@ryuzaki13/react-foundation-ui 1.4.4 → 1.5.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/dist/advanced-search/index.js +9 -9
- package/dist/badge/index.js +1 -1
- package/dist/base-table/index.js +1 -1
- package/dist/button/index.js +1 -1
- package/dist/check-box/index.js +1 -1
- package/dist/chunks/{CalendarView-Z_XWk7aI.js → CalendarView-DtacoN_c.js} +2 -2
- package/dist/chunks/{CalendarView-Z_XWk7aI.js.map → CalendarView-DtacoN_c.js.map} +1 -1
- package/dist/chunks/CheckBox.module-C5SjPwSj.js.map +1 -1
- package/dist/chunks/{TextEditorLexicalClient-CK8j3RA4.js → TextEditorLexicalClient-DVML-Nhd.js} +6 -6
- package/dist/chunks/{TextEditorLexicalClient-CK8j3RA4.js.map → TextEditorLexicalClient-DVML-Nhd.js.map} +1 -1
- package/dist/chunks/{badge-DwIUjH0a.js → badge-CbclcpUi.js} +2 -2
- package/dist/chunks/{badge-DwIUjH0a.js.map → badge-CbclcpUi.js.map} +1 -1
- package/dist/chunks/{base-table-BFsVwXg3.js → base-table-BPcdSitC.js} +3 -3
- package/dist/chunks/{base-table-BFsVwXg3.js.map → base-table-BPcdSitC.js.map} +1 -1
- package/dist/chunks/{button-BU2kRzwu.js → button-BOl7hYmT.js} +4 -4
- package/dist/chunks/button-BOl7hYmT.js.map +1 -0
- package/dist/chunks/{check-box-Dd3YFuxd.js → check-box-6HGX_KOy.js} +5 -5
- package/dist/chunks/check-box-6HGX_KOy.js.map +1 -0
- package/dist/chunks/{context-menu-C6RO7soI.js → context-menu-BY4pYGwB.js} +2 -2
- package/dist/chunks/{context-menu-C6RO7soI.js.map → context-menu-BY4pYGwB.js.map} +1 -1
- package/dist/chunks/{date-input-BzExUQnc.js → date-input-DKkJO_-h.js} +19 -19
- package/dist/chunks/date-input-DKkJO_-h.js.map +1 -0
- package/dist/chunks/{floating-arrow-BE-z4QkE.js → floating-arrow-DPKwJfww.js} +3 -3
- package/dist/chunks/{floating-arrow-BE-z4QkE.js.map → floating-arrow-DPKwJfww.js.map} +1 -1
- package/dist/chunks/{input-Bp6_Ucgr.js → input-BWCaVC06.js} +9 -7
- package/dist/chunks/input-BWCaVC06.js.map +1 -0
- package/dist/chunks/{input-files-D1JzSw_Y.js → input-files-62qH2TMj.js} +3 -3
- package/dist/chunks/{input-files-D1JzSw_Y.js.map → input-files-62qH2TMj.js.map} +1 -1
- package/dist/chunks/{input-search-Bkhcinru.js → input-search-CdPI1cb6.js} +2 -2
- package/dist/chunks/{input-search-Bkhcinru.js.map → input-search-CdPI1cb6.js.map} +1 -1
- package/dist/chunks/{misc-BYxxlJz6.js → misc-Cp_r022Z.js} +2 -2
- package/dist/chunks/{misc-BYxxlJz6.js.map → misc-Cp_r022Z.js.map} +1 -1
- package/dist/chunks/{modal-paexEF0j.js → modal-DPIXoMkB.js} +3 -3
- package/dist/chunks/{modal-paexEF0j.js.map → modal-DPIXoMkB.js.map} +1 -1
- package/dist/chunks/{multi-select-COEkc8Qc.js → multi-select-01xmD1nZ.js} +114 -104
- package/dist/chunks/multi-select-01xmD1nZ.js.map +1 -0
- package/dist/chunks/{picker-e6IsrMUG.js → picker-Mdb73_uW.js} +3 -3
- package/dist/chunks/picker-Mdb73_uW.js.map +1 -0
- package/dist/chunks/popover-BTT7zSqx.js +230 -0
- package/dist/chunks/{popover-CGU3MlsH.js.map → popover-BTT7zSqx.js.map} +1 -1
- package/dist/chunks/{radio-group-CM9Lg_nc.js → radio-group-4j2HbemI.js} +2 -2
- package/dist/chunks/{radio-group-CM9Lg_nc.js.map → radio-group-4j2HbemI.js.map} +1 -1
- package/dist/chunks/{select-BON0S9Dr.js → select-DRf4_a1Z.js} +6 -6
- package/dist/chunks/select-DRf4_a1Z.js.map +1 -0
- package/dist/chunks/{table-Dd5BcC0k.js → table-DSg9gi_l.js} +2 -2
- package/dist/chunks/{table-Dd5BcC0k.js.map → table-DSg9gi_l.js.map} +1 -1
- package/dist/chunks/{ui.module-BisoTevy.js → ui.module-BfaIVBba.js} +3 -1
- package/dist/chunks/ui.module-BfaIVBba.js.map +1 -0
- package/dist/chunks/{uiClasses-BNjBunnY.js → uiClasses-4atXOh0J.js} +2 -2
- package/dist/chunks/{uiClasses-BNjBunnY.js.map → uiClasses-4atXOh0J.js.map} +1 -1
- package/dist/chunks/{useODataSelectBase-CKe1AVMI.js → useODataSelectBase-DI_wwKgw.js} +2 -2
- package/dist/chunks/{useODataSelectBase-CKe1AVMI.js.map → useODataSelectBase-DI_wwKgw.js.map} +1 -1
- package/dist/context-menu/index.js +1 -1
- package/dist/date-input/index.js +2 -2
- package/dist/date-input/ui/DateInput.d.ts.map +1 -1
- package/dist/date-time-input/index.js +195 -194
- package/dist/date-time-input/index.js.map +1 -1
- package/dist/date-time-input/ui/SingleDateTimeInput.d.ts.map +1 -1
- package/dist/disclosure/index.js +4 -3
- package/dist/disclosure/index.js.map +1 -1
- package/dist/drop-zone/index.js +1 -1
- package/dist/expandable-action-panel/index.js +2 -2
- package/dist/floating-arrow/index.js +1 -1
- package/dist/image/index.js +4 -4
- package/dist/input/Input.d.ts +2 -1
- package/dist/input/Input.d.ts.map +1 -1
- package/dist/input/index.js +1 -1
- package/dist/input-date-time/index.js +2 -2
- package/dist/input-file/index.js +2 -2
- package/dist/input-files/index.js +1 -1
- package/dist/input-image/index.js +2 -2
- package/dist/input-search/index.js +1 -1
- package/dist/layout-picker/index.js +94 -107
- package/dist/layout-picker/index.js.map +1 -1
- package/dist/layout-picker/ui/LayoutPicker.d.ts.map +1 -1
- package/dist/list/index.js +1 -1
- package/dist/listbox/Listbox.d.ts +1 -0
- package/dist/listbox/Listbox.d.ts.map +1 -1
- package/dist/listbox/index.js +39 -34
- package/dist/listbox/index.js.map +1 -1
- package/dist/misc/index.js +1 -1
- package/dist/modal/index.js +1 -1
- package/dist/multi-select/index.js +2 -2
- package/dist/multi-select/ui/MultiSelect.d.ts.map +1 -1
- package/dist/multi-select/ui/defaultRenderers.d.ts +2 -1
- package/dist/multi-select/ui/defaultRenderers.d.ts.map +1 -1
- package/dist/notifications/index.js +1 -1
- package/dist/picker/index.js +1 -1
- package/dist/popover/FloatingPopover.d.ts +5 -0
- package/dist/popover/FloatingPopover.d.ts.map +1 -1
- package/dist/popover/index.js +1 -1
- package/dist/preset-range-date-input/index.js +2 -3
- package/dist/preset-range-date-input/index.js.map +1 -1
- package/dist/preset-select/index.js +1 -1
- package/dist/radio-button/index.js +3 -3
- package/dist/radio-button/index.js.map +1 -1
- package/dist/radio-group/index.js +1 -1
- package/dist/select/Select.d.ts.map +1 -1
- package/dist/select/index.js +1 -1
- package/dist/simple-table/index.js +1 -1
- package/dist/slider/Slider.d.ts.map +1 -1
- package/dist/slider/index.js +131 -117
- package/dist/slider/index.js.map +1 -1
- package/dist/state-select/index.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/table/index.js +1 -1
- package/dist/table-sorting/index.js +1 -1
- package/dist/tabs/index.js +2 -2
- package/dist/tabs/index.js.map +1 -1
- package/dist/tag-input/index.js +2 -2
- package/dist/text/index.js +1 -1
- package/dist/text-editor/index.js +2 -2
- package/dist/textarea/Textarea.d.ts.map +1 -1
- package/dist/textarea/index.js +3 -2
- package/dist/textarea/index.js.map +1 -1
- package/dist/toggle/index.js +1 -1
- package/dist/tree-select/TreeMultiSelect.d.ts.map +1 -1
- package/dist/tree-select/TreePickerBase.d.ts.map +1 -1
- package/dist/tree-select/index.js +244 -244
- package/dist/tree-select/index.js.map +1 -1
- package/dist/tree-table/index.js +1 -1
- package/package.json +24 -18
- package/src/styles/_base.scss +3 -3
- package/src/styles/config/_index.scss +43 -38
- package/src/styles/mixins/_controls.scss +17 -16
- package/storybook-static/assets/Badge-CD5894x5.css +1 -0
- package/storybook-static/assets/{Badge-Bh73-APE.js → Badge-CblO4qSx.js} +1 -1
- package/storybook-static/assets/{Badge.stories-gNFtCWnR.js → Badge.stories-CtRrqjAo.js} +1 -1
- package/storybook-static/assets/{Button-O9QPAftp.js → Button-BVt4jmN4.js} +1 -1
- package/storybook-static/assets/{Button-mjF9HSg0.js → Button-Bzc9jBAF.js} +1 -1
- package/storybook-static/assets/{Button-DtU4kGzD.css → Button-DuVDH6-g.css} +1 -1
- package/storybook-static/assets/{Button.stories-wkiE0c_a.js → Button.stories-tqfxm0ox.js} +1 -1
- package/storybook-static/assets/CalendarView-MkrPd5D-.js +1 -0
- package/storybook-static/assets/{CheckBox-CB8fTQF0.js → CheckBox-0BK2dgdD.js} +1 -1
- package/storybook-static/assets/CheckBox-8XczNrjq.css +1 -0
- package/storybook-static/assets/{CheckBox-Clpeg9q7.js → CheckBox-CWipX4CI.js} +2 -2
- package/storybook-static/assets/{CheckBox.stories-pfWBxvOy.js → CheckBox.stories-B5yWzlQa.js} +1 -1
- package/storybook-static/assets/{Color-6AOWCN3U-CVvkiihj.js → Color-6AOWCN3U-WdTzF_2p.js} +1 -1
- package/storybook-static/assets/{ContextMenu-Sv4wfyS3.js → ContextMenu-BjWu5DHB.js} +1 -1
- package/storybook-static/assets/{ContextMenu-eGnlhRRu.js → ContextMenu-kbSWsoCE.js} +1 -1
- package/storybook-static/assets/ContextMenu.stories-CQcrX3sj.js +90 -0
- package/storybook-static/assets/DateInput-4lH8A4HQ.css +1 -0
- package/storybook-static/assets/DateInput-BUgBb3aH.js +1 -0
- package/storybook-static/assets/{DateInput-DQDplLib.js → DateInput-CyNIW9Md.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-BNpS4CND.js → DateInput.stories-DyB3PjTl.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-DCBEf98i.js → DateRangePresetSelect-BwibZk_q.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-Bfx-d5qg.js → DateRangePresetSelect-CBZ0OAmn.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-PAV2jgQb.js → DateRangePresetSelect.stories-kmmKl-3j.js} +1 -1
- package/storybook-static/assets/{Detail-DvmdQCue.js → Detail-pHBZ5bkR.js} +1 -1
- package/storybook-static/assets/{Detail.stories-CEm00aSN.js → Detail.stories-Bs5YNmLn.js} +1 -1
- package/storybook-static/assets/Dialog-DBTU-LRR.js +1 -0
- package/storybook-static/assets/{Dialog-3I2Y7jD7.js → Dialog-DbFhCtF1.js} +1 -1
- package/storybook-static/assets/Dialog.stories-_WQW8YNs.js +31 -0
- package/storybook-static/assets/{Disclosure-DUIQ37oh.js → Disclosure-vOJWmhLt.js} +1 -1
- package/storybook-static/assets/Disclosure.stories-wyulIOoJ.js +40 -0
- package/storybook-static/assets/DisclosureGroup-BUDxwl5C.js +2 -0
- package/storybook-static/assets/DisclosureGroup-DjObX5Qs.css +1 -0
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-DwPk6ai7.js → DocsRenderer-JROSPFPF-B7vhvrpB.js} +1 -1
- package/storybook-static/assets/DropZone-B7Q1qQqP.js +9 -0
- package/storybook-static/assets/{DropZone-BGuCU5dq.js → DropZone-BvRT0gUm.js} +1 -1
- package/storybook-static/assets/DropZone.stories-WmoR3uPj.js +36 -0
- package/storybook-static/assets/DropdownMenu-BW35W6_U.js +1 -0
- package/storybook-static/assets/ExpandableActionPanel-C9G9PsZx.js +2 -0
- package/storybook-static/assets/ExpandableActionPanel.stories-Dllpmeu_.js +19 -0
- package/storybook-static/assets/{Flex-CBwbh1yu.js → Flex-Cydb-4MR.js} +1 -1
- package/storybook-static/assets/{Flex.stories-cdk6vRZq.js → Flex.stories-Dczj9g4W.js} +1 -1
- package/storybook-static/assets/FloatingPopover-C-W77AcJ.js +1 -0
- package/storybook-static/assets/{FloatingPopover-DC84VrV3.css → FloatingPopover-jwILx9b0.css} +1 -1
- package/storybook-static/assets/FormattedTableCell-fePg_bmP.js +18 -0
- package/storybook-static/assets/{Grid-BkKqSMfk.js → Grid-Dal3v5dj.js} +1 -1
- package/storybook-static/assets/{Grid.stories-828arrPi.js → Grid.stories-Byb4mMpE.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-CrIWrKKR.js → ImageCropper.stories-B9OD2pur.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-F3AaZx-K.js → ImageRenderer-BcUjptiu.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-l3PnRYxy.js → ImageRenderer.stories-BuO2nhom.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-C6uhkvCN.js → ImageView.stories-mSkR535R.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-BSPiv5lU.js → ImageViewer.stories-DVdR3-_j.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-BOpMGgz6.js → ImageViewerRuntime-DiR_HwIE.js} +1 -1
- package/storybook-static/assets/{Input-D-ZrbHVw.js → Input-BdCavSu1.js} +1 -1
- package/storybook-static/assets/Input-DZQKV4DP.js +3 -0
- package/storybook-static/assets/Input-Db2-9PJZ.css +1 -0
- package/storybook-static/assets/{Input.stories-vqPv6pLx.js → Input.stories-Cu66SvKb.js} +1 -1
- package/storybook-static/assets/{InputDateTime-DHBVbRii.js → InputDateTime-Day94W-O.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-BAvLMBuk.js → InputDateTime.stories-990MuicZ.js} +1 -1
- package/storybook-static/assets/InputFile-CJll5mC-.js +1 -0
- package/storybook-static/assets/{InputFile-B9TVOEZV.js → InputFile-Cp8x84ZG.js} +1 -1
- package/storybook-static/assets/InputFile.stories-fNNwbNfa.js +36 -0
- package/storybook-static/assets/{InputFiles-CxZkOZFK.js → InputFiles-CBvR3Szf.js} +1 -1
- package/storybook-static/assets/InputFiles-OusF5Lfq.js +1 -0
- package/storybook-static/assets/InputFiles.stories-DcpEbOOo.js +33 -0
- package/storybook-static/assets/{InputFilesList-OEX4zGI3.js → InputFilesList-zuNP1QIB.js} +1 -1
- package/storybook-static/assets/{InputImage-31A6fxSf.js → InputImage-CjMAL3uq.js} +1 -1
- package/storybook-static/assets/InputImage-Dl2bJNZk.js +7 -0
- package/storybook-static/assets/InputImage.stories-BzxEndIe.js +45 -0
- package/storybook-static/assets/InteractiveComponents.stories-CXF1nGLl.js +303 -0
- package/storybook-static/assets/{LayoutPicker-Dc55ovYM.js → LayoutPicker-BahcFBzK.js} +1 -1
- package/storybook-static/assets/LayoutPicker-CZRoovVS.css +1 -0
- package/storybook-static/assets/LayoutPicker-DzAN3gGO.js +376 -0
- package/storybook-static/assets/LayoutPicker-yb6IMmd2.css +1 -0
- package/storybook-static/assets/LayoutPicker.stories-ByamaGlv.js +74 -0
- package/storybook-static/assets/Listbox-C5hwzE4s.js +41 -0
- package/storybook-static/assets/Listbox-CHsNGsDc.js +1 -0
- package/storybook-static/assets/Listbox.stories-CvXZeESb.js +53 -0
- package/storybook-static/assets/{Modal-CXvDgktT.js → Modal-Dib11Lzy.js} +1 -1
- package/storybook-static/assets/Modal.stories-DYMy-kLP.js +180 -0
- package/storybook-static/assets/ModalManagerProvider-natWXnSM.js +1 -0
- package/storybook-static/assets/{MultiSelect-DN4foQlG.js → MultiSelect-Cl9MkPZw.js} +1 -1
- package/storybook-static/assets/MultiSelect-DlCZ7dhH.js +2 -0
- package/storybook-static/assets/{MultiSelect.stories-CgKNQmma.js → MultiSelect.stories-202TRBKq.js} +1 -1
- package/storybook-static/assets/{NoData-W7wK8oTW.js → NoData-DcHZdLTJ.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-D1UoWmF8.js → NotificationsHost-DzqEi2vc.js} +1 -1
- package/storybook-static/assets/{NotificationsHost.stories-BWUuMmPl.js → NotificationsHost.stories-CvoQfIjj.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-DE1V4el8.js → ODataMultiSelect-CHQguikm.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-Q1DUIL2W.js → ODataMultiSelect.stories-BZbWK4CP.js} +1 -1
- package/storybook-static/assets/{ODataSelect-CtoT2Wxx.js → ODataSelect-C1YGDpg_.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-DLi7Rwzk.js → ODataSelect.stories-D4tQXs2c.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-DEZfgyPK.js → ODataTreeMultiSelect-BjR7zhyJ.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-H42q78xI.js → ODataTreeMultiSelect.stories-Drg8mLhi.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-BeylEiPN.js → ODataTreeSelect-D_fcT3Aw.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-MOILmtfY.js → ODataTreeSelect.stories-BWFdmmvf.js} +2 -2
- package/storybook-static/assets/{OneStepScroller-BSvYN6QP.js → OneStepScroller-DWCRXFHq.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-KQFGCxq6.js → PeriodSelect-C7QQKxZ4.js} +1 -1
- package/storybook-static/assets/PeriodSelect-DtfTzrNK.js +5 -0
- package/storybook-static/assets/PeriodSelect.stories-CF65LIHm.js +60 -0
- package/storybook-static/assets/{PickerSelectionToolbar-Cvv8vTZm.js → PickerSelectionToolbar-D9atWyWj.js} +1 -1
- package/storybook-static/assets/{PickerTriggerActions-BBZmXagt.js → PickerTriggerActions-C7WeaOKN.js} +1 -1
- package/storybook-static/assets/{Popover-D6gSyjaW.js → Popover-CUJF-IMC.js} +1 -1
- package/storybook-static/assets/{Popover-7YZIq8Fi.js → Popover-DQJIeny_.js} +1 -1
- package/storybook-static/assets/{Popover.stories-DM69Ztws.js → Popover.stories-BON0z3PX.js} +1 -1
- package/storybook-static/assets/PresetRangeDateInput-D3_uzWzQ.js +1 -0
- package/storybook-static/assets/{PresetRangeDateInput-Ch6GapcJ.js → PresetRangeDateInput-DpA1KOCo.js} +1 -1
- package/storybook-static/assets/PresetRangeDateInput.stories-CDDJDiei.js +15 -0
- package/storybook-static/assets/{PresetSelect-C8uIYhPJ.js → PresetSelect-DlV2eC-b.js} +1 -1
- package/storybook-static/assets/RadioButton-BLyqp88m.js +2 -0
- package/storybook-static/assets/{RadioButton-BQjiyASl.js → RadioButton-wkLEwRaH.js} +1 -1
- package/storybook-static/assets/RadioButton.stories-DS9RYBEJ.js +35 -0
- package/storybook-static/assets/{RadioGroup-vw4ObVj-.js → RadioGroup-CsWIje1J.js} +1 -1
- package/storybook-static/assets/{RadioGroup-DNqu6WaC.js → RadioGroup-DERcyzA0.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-B-WQzZW_.js → RadioGroup.stories-DkgUPavS.js} +1 -1
- package/storybook-static/assets/{Scrollable-DrxMuH2M.js → Scrollable-DvJ3T3Ik.js} +1 -1
- package/storybook-static/assets/{Select-BxigZNtu.js → Select-DmEm2boi.js} +1 -1
- package/storybook-static/assets/{Select-X_O4M8Hi.js → Select-g0c0XGQY.js} +1 -1
- package/storybook-static/assets/{Select.stories-BpTrYJSr.js → Select.stories-BEPJovVd.js} +1 -1
- package/storybook-static/assets/{SelectOptionContent-RAmgWCOm.js → SelectOptionContent-B5E2W8PZ.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-CA9wjk2m.js → SerializableSelect-wgzDfqEi.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-DXd4E-3U.js → SerializableSelect.stories-V8IqyO9Y.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-BeFLYUBF.js → SingleDateTimeInput-B7v0t9f5.js} +1 -1
- package/storybook-static/assets/SingleDateTimeInput-CN7PyOsb.js +1 -0
- package/storybook-static/assets/SingleDateTimeInput-dwDPQ0HY.css +1 -0
- package/storybook-static/assets/SingleDateTimeInput.stories-FOoEMoyF.js +78 -0
- package/storybook-static/assets/Slider-24H5ASxG.js +1 -0
- package/storybook-static/assets/{Slider-BdWBkKp4.js → Slider-3HQKHpoi.js} +1 -1
- package/storybook-static/assets/Slider-BWuie2gr.css +1 -0
- package/storybook-static/assets/{Slider.stories-CgmOhVBs.js → Slider.stories-DeeP8cmV.js} +1 -1
- package/storybook-static/assets/{SliderInput-QmF2VQWA.js → SliderInput-CFbx-GW7.js} +1 -1
- package/storybook-static/assets/SliderInput-bqFr-Lyp.js +2 -0
- package/storybook-static/assets/SliderInput.stories-Djli653m.js +67 -0
- package/storybook-static/assets/{Sortable-D5OTpesH.js → Sortable-CMo2PMKX.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-yz3c5EhY.js → Sortable.stories-BFsQvwMx.js} +1 -1
- package/storybook-static/assets/{Splitter-DVq6XBul.js → Splitter-dwOhGuIg.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-CopPw1_p.js → Splitter.stories-DZ3nAxpo.js} +1 -1
- package/storybook-static/assets/StateSelect-IigEzRom.js +4 -0
- package/storybook-static/assets/{StateSelect-ojwXeKmx.js → StateSelect-j3gi4kbM.js} +1 -1
- package/storybook-static/assets/StateSelect.stories-Bj-2m2hS.js +44 -0
- package/storybook-static/assets/{StringToggle.stories-ByYMmlXl.js → StringToggle.stories-ClSl76ts.js} +1 -1
- package/storybook-static/assets/{Switch-Dy4Pahkn.js → Switch-BDbBZjMA.js} +1 -1
- package/storybook-static/assets/Switch-C9OAPzUM.js +1 -0
- package/storybook-static/assets/Switch.stories-CQ3ueThx.js +26 -0
- package/storybook-static/assets/{Table-BO6Oa4JV.js → Table-BbGcLQ81.js} +1 -1
- package/storybook-static/assets/{Table.stories--TpBKwmP.js → Table.stories-DvaHP59R.js} +1 -1
- package/storybook-static/assets/{Tabs-7c93qVyH.js → Tabs-CNEYvzUv.js} +1 -1
- package/storybook-static/assets/Tabs.stories-BpyQokl8.js +57 -0
- package/storybook-static/assets/TabsBox-ClZCbgKB.js +2 -0
- package/storybook-static/assets/TabsBox-Co1vxD90.css +1 -0
- package/storybook-static/assets/TagInput-ChmW4s9O.css +1 -0
- package/storybook-static/assets/TagInput-DorsSF_V.js +7 -0
- package/storybook-static/assets/TagInput.stories-ChgRz4Co.js +12 -0
- package/storybook-static/assets/{Text-BPlJUr3R.js → Text-DUqtop-c.js} +1 -1
- package/storybook-static/assets/{Textarea-D3S4MkiX.js → Textarea-ZfZJmHsp.js} +1 -1
- package/storybook-static/assets/Textarea-yZWv6QdW.js +1 -0
- package/storybook-static/assets/Textarea.stories-B5Q7syxH.js +27 -0
- package/storybook-static/assets/{TimePanel-C2iZ9Qr6.js → TimePanel-C39f__j8.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-JTjIv6z1.js → TimePanel.stories-DtjILTPk.js} +1 -1
- package/storybook-static/assets/{Toggle-CHmajZE5.js → Toggle-BndjhQFY.js} +1 -1
- package/storybook-static/assets/{Toggle-OlKw8qaK.js → Toggle-CdpPJI_O.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-k4Z8qQVs.js → Toggle.stories-BD_C0YTw.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-dOg0l7rk.js → TreeMultiSelect--M1WiE_f.js} +1 -1
- package/storybook-static/assets/TreeMultiSelect-BPz5kISi.js +1 -0
- package/storybook-static/assets/{TreeMultiSelect.stories-CAzZRxn5.js → TreeMultiSelect.stories-BgkDJur9.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-DMs9EpFv.css → TreePickerBase-BxLupQDs.css} +1 -1
- package/storybook-static/assets/{TreePickerBase-ycYQYQgi.js → TreePickerBase-Dup03AiC.js} +2 -2
- package/storybook-static/assets/{TreeSelect-BrNyI_Qx.js → TreeSelect-B0RWsDT4.js} +1 -1
- package/storybook-static/assets/{TreeSelect-CDecTnag.js → TreeSelect-BrQGgG40.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-BUOw2Rwn.js → TreeSelect.stories-DkgdJ5XX.js} +1 -1
- package/storybook-static/assets/{TreeTable-BXw7lFBk.js → TreeTable-HQr8pb9r.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-z40pruPV.js → TreeTable.stories-C4hcph6x.js} +1 -1
- package/storybook-static/assets/{async-BLDV04P4.js → async-lzSWdC34.js} +1 -1
- package/storybook-static/assets/{blocks-BiaKjftm.js → blocks-D8l_hmHU.js} +3 -3
- package/storybook-static/assets/{browserAndReact-DX4H5rjQ.js → browserAndReact-BwvRFhzI.js} +1 -1
- package/storybook-static/assets/{check-fB4gCKB_.js → check-DpX8PMs_.js} +1 -1
- package/storybook-static/assets/{chevron-down-B9GH0QvB.js → chevron-down-DE8FRR-h.js} +1 -1
- package/storybook-static/assets/{chevron-left-DjbyJeHO.js → chevron-left-Cy3TEG_Y.js} +1 -1
- package/storybook-static/assets/{chevron-right-D29uf09I.js → chevron-right-CZ4-4s1X.js} +1 -1
- package/storybook-static/assets/{chunk-W22LQPXL-CGkHFiZ0.js → chunk-W22LQPXL-Ci-XApFb.js} +1 -1
- package/storybook-static/assets/{circle-alert-Dmd7-WNp.js → circle-alert-CWbgc3Jn.js} +1 -1
- package/storybook-static/assets/{circle-check-VtVMsaJJ.js → circle-check-DODquDnH.js} +1 -1
- package/storybook-static/assets/{components-CsfQDbHv.js → components-BdUOCBP9.js} +3 -3
- package/storybook-static/assets/{contextMenu-CzdfaUsd.js → contextMenu-XvvXJEpW.js} +1 -1
- package/storybook-static/assets/defaultRenderers-lMEgLPIU.js +1 -0
- package/storybook-static/assets/defaultRenderers-tFmVIvt_.css +1 -0
- package/storybook-static/assets/{download-CyVhTbv6.js → download-BEGaHxQc.js} +1 -1
- package/storybook-static/assets/{filesAndExcel-DlUnL-Uu.js → filesAndExcel-C9FnZv9P.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-DZ8IyUV4.js → floating-ui.react-GziJy4gA.js} +1 -1
- package/storybook-static/assets/formatters-CVj-3Vn0-C5-BLq9O.js +1 -0
- package/storybook-static/assets/{formatters-runtime-DVi3RdYb.js → formatters-runtime-DO0szrYr.js} +1 -1
- package/storybook-static/assets/{formatters-BTz64vfu.js → formatters-vWial7jf.js} +16 -1
- package/storybook-static/assets/{foundationLib-CFj4J-Pc.js → foundationLib-CIqc9fhG.js} +1 -1
- package/storybook-static/assets/{hooks-Ch5aYb7R.js → hooks-DfgvMSqN.js} +2 -2
- package/storybook-static/assets/{iframe-DaN-XFub.js → iframe-BHhbrImE.js} +4 -4
- package/storybook-static/assets/iframe-D7iJQEr5.css +1 -0
- package/storybook-static/assets/iframe-oIP1aL7X.js +1 -0
- package/storybook-static/assets/{info-Cirk1RKZ.js → info-DSZ4aUvi.js} +1 -1
- package/storybook-static/assets/{odata-BtfB5Aje.js → odata-DmijE2H9.js} +1 -1
- package/storybook-static/assets/{odata-service-DnPlNGpU-Bpd4Zh9L.js → odata-service-B5w4YBao-BcP2cvfZ.js} +1 -1
- package/storybook-static/assets/{odataAndTables-TEZyQ-TZ.js → odataAndTables-m2AMS6oI.js} +1 -1
- package/storybook-static/assets/{odataFetchFn-DEKVPDzV.js → odataFetchFn-CwpkgKoz.js} +1 -1
- package/storybook-static/assets/{odataStoryFixtures-CDDaJZKW.js → odataStoryFixtures-CBtJYQsv.js} +1 -1
- package/storybook-static/assets/{persisted-BzLLmgUK.js → persisted-DpSU25AR.js} +1 -1
- package/storybook-static/assets/{pureUtilities-Dw249t3R.js → pureUtilities-BG4ZSO63.js} +1 -1
- package/storybook-static/assets/react-Bz35HWpn.js +9 -0
- package/storybook-static/assets/{refresh-cw-BN3JCsXv.js → refresh-cw-ltgf4cUB.js} +1 -1
- package/storybook-static/assets/{runtimeAndState-CCVgv3ck.js → runtimeAndState-C_GrWjr8.js} +1 -1
- package/storybook-static/assets/{settings-2-jtcbbWm5.js → settings-2-qpVYfZn_.js} +1 -1
- package/storybook-static/assets/{sortable-dNWaObUX.js → sortable-CrCQ3H1V.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-T5IQBZDB-hYwVxXYm.js → syntaxhighlighter-T5IQBZDB-eOr9ght-.js} +1 -1
- package/storybook-static/assets/{trash-2-DrVfT0z5.js → trash-2-lfhUDclN.js} +1 -1
- package/storybook-static/assets/{triangle-alert-B1Q28Bq9.js → triangle-alert-D9YGTafY.js} +1 -1
- package/storybook-static/assets/ui-CD51AD-_.css +1 -0
- package/storybook-static/assets/ui.module-kfCm3RIG.js +1 -0
- package/storybook-static/assets/{uiClasses-CO3Cdv1E.js → uiClasses-BS9RPcty.js} +1 -1
- package/storybook-static/assets/{useODataSelectBase-DlbeGYUP.js → useODataSelectBase-BVgxJPNn.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-CvsoLfiG.js → useODataTreeData-CdLHOBnD.js} +1 -1
- package/storybook-static/assets/{usePickerDefaultFilter-DdxyE_i8.js → usePickerDefaultFilter-Be420WNF.js} +1 -1
- package/storybook-static/assets/{usePickerQuery-6rDaPaB0.js → usePickerQuery-B6U-oOS6.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-BHBjSLtn.js → usePickerTriggerController-C-VxrzSe.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-DzBkX15M.css → usePickerTriggerController-Q-ULIoGr.css} +1 -1
- package/storybook-static/assets/{x-Dh43gJN9.js → x-CNM39xuu.js} +1 -1
- package/storybook-static/iframe.html +3 -3
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/dist/chunks/button-BU2kRzwu.js.map +0 -1
- package/dist/chunks/check-box-Dd3YFuxd.js.map +0 -1
- package/dist/chunks/date-input-BzExUQnc.js.map +0 -1
- package/dist/chunks/input-Bp6_Ucgr.js.map +0 -1
- package/dist/chunks/multi-select-COEkc8Qc.js.map +0 -1
- package/dist/chunks/picker-e6IsrMUG.js.map +0 -1
- package/dist/chunks/popover-CGU3MlsH.js +0 -222
- package/dist/chunks/select-BON0S9Dr.js.map +0 -1
- package/dist/chunks/ui.module-BisoTevy.js.map +0 -1
- package/storybook-static/assets/Badge-Cr7bAbxa.css +0 -1
- package/storybook-static/assets/CalendarView-CqKlnF8k.js +0 -1
- package/storybook-static/assets/CheckBox-CT1_Mjc0.css +0 -1
- package/storybook-static/assets/ContextMenu.stories-CVw3hOvY.js +0 -90
- package/storybook-static/assets/DateInput-D8_Oleoy.js +0 -1
- package/storybook-static/assets/DateInput-pmGiwdvw.css +0 -1
- package/storybook-static/assets/Dialog.stories-lcadmonM.js +0 -31
- package/storybook-static/assets/Disclosure-DzVnkjef.css +0 -1
- package/storybook-static/assets/Disclosure.stories-BeizaZWP.js +0 -41
- package/storybook-static/assets/DropZone.stories-B4J6OZ3T.js +0 -44
- package/storybook-static/assets/ExpandableActionPanel.stories-gCrqbhG6.js +0 -20
- package/storybook-static/assets/FloatingPopover-D4h-c24R.js +0 -1
- package/storybook-static/assets/FormattedTableCell-Dh-kHTOC.js +0 -18
- package/storybook-static/assets/Input-BioMOZju.css +0 -1
- package/storybook-static/assets/Input-Co--DMHY.js +0 -3
- package/storybook-static/assets/InputFile.stories-CypBLWFh.js +0 -36
- package/storybook-static/assets/InputFiles.stories-BGwCp7OC.js +0 -33
- package/storybook-static/assets/InputImage.stories-CdpOudXI.js +0 -51
- package/storybook-static/assets/LayoutPicker-9tLTatHF.css +0 -1
- package/storybook-static/assets/LayoutPicker.stories-DXcn-WXQ.js +0 -449
- package/storybook-static/assets/Listbox-DF8E6oMR.js +0 -38
- package/storybook-static/assets/Listbox.stories-C98_9wX3.js +0 -47
- package/storybook-static/assets/Modal.stories-DAC_QwN7.js +0 -180
- package/storybook-static/assets/MultiSelect-B-wX6JPo.js +0 -2
- package/storybook-static/assets/MultiSelectToken-DDu5n78h.css +0 -1
- package/storybook-static/assets/MultiSelectToken-fjW8p4YG.js +0 -1
- package/storybook-static/assets/PeriodSelect.stories-BIYx4_Yy.js +0 -64
- package/storybook-static/assets/PresetRangeDateInput.stories-Cqd4eb0N.js +0 -15
- package/storybook-static/assets/RadioButton.stories-Cbho4i83.js +0 -36
- package/storybook-static/assets/SingleDateTimeInput-mOllNfg2.css +0 -1
- package/storybook-static/assets/SingleDateTimeInput.stories-B1aZ754N.js +0 -78
- package/storybook-static/assets/Slider-BYrHesOR.js +0 -1
- package/storybook-static/assets/Slider-DMDFRH6B.css +0 -1
- package/storybook-static/assets/SliderInput.stories-MjSmhiOM.js +0 -68
- package/storybook-static/assets/StateSelect.stories-D46m5HNn.js +0 -47
- package/storybook-static/assets/Switch.stories-EiAb5Z-D.js +0 -26
- package/storybook-static/assets/Tabs-BLkTB6pp.css +0 -1
- package/storybook-static/assets/Tabs.stories-DXZ0r2ix.js +0 -58
- package/storybook-static/assets/TagInput-LeQAhDgs.css +0 -1
- package/storybook-static/assets/TagInput.stories-CoM8rXwa.js +0 -18
- package/storybook-static/assets/Textarea.stories-47k8uHdB.js +0 -27
- package/storybook-static/assets/TreeMultiSelect-BC_n1Wb-.js +0 -1
- package/storybook-static/assets/formatters--mhLir82-v41eaI4a.js +0 -1
- package/storybook-static/assets/iframe-CJQlmNUm.css +0 -1
- package/storybook-static/assets/iframe-Cr7AcW_R.js +0 -1
- package/storybook-static/assets/react-KzpmXJc9.js +0 -9
- package/storybook-static/assets/ui-CSPaMpbi.css +0 -1
- package/storybook-static/assets/ui.module-DoMIk8Oc.js +0 -1
- /package/storybook-static/assets/{CheckBox.module-BBzuj5He.js → CheckBox.module-DPvJxTHD.js} +0 -0
- /package/storybook-static/assets/{Modal-BL_cTIW7.css → ModalManagerProvider-BL_cTIW7.css} +0 -0
- /package/storybook-static/assets/{array-BBSjoTRy-CIRmlF93.js → array-D-_yMMUK-CIRmlF93.js} +0 -0
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r,t as i}from"./SingleDateTimeInput-CN7PyOsb.js";import{n as a}from"./iframe-BHhbrImE.js";import{_ as o,b as s,h as c,y as l}from"./odata-service-B5w4YBao-BcP2cvfZ.js";var u=t({Default:()=>m,Empty:()=>g,TimeOnly:()=>h,WithLimits:()=>_,WithRightPanel:()=>v,__namedExportsOrder:()=>y,default:()=>p}),d,f,p,m,h,g,_,v,y;function b(){return(b=e((()=>{d=n(),s(),r(),f=a(),p={title:`Shared/UI/SingleDateTimeInput`,component:i,args:{value:null,onChange:()=>{}},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля даты и времени.`,control:`text`},description:{description:`Описание под заголовком поля.`,control:`text`},placeholder:{description:`Текстовая подсказка для сегментного ввода.`,control:`text`},value:{description:"Текущее значение в виде `Date | null`.",control:!1},onChange:{description:`Вызывается при вводе или выборе валидной даты-времени.`,control:!1},minDate:{description:`Минимально допустимая дата-время.`,control:`date`},maxDate:{description:`Максимально допустимая дата-время.`,control:`date`},error:{description:`Текст внешней ошибки под полем.`,control:`text`},onClearError:{description:`Сбрасывает внешнюю ошибку при ручном вводе и выборе в picker.`,control:!1},size:{description:`Размер поля и подписи.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},disabled:{description:`Блокирует сегментный ввод и popover picker.`,control:`boolean`},timePanelPlacement:{description:`Размещение панели выбора времени относительно календаря.`,control:`inline-radio`,options:[`bottom`,`right`]},mode:{description:`Режим работы поля: дата-время или только время.`,control:`inline-radio`,options:[`date-time`,`time`]}}},m={render:e=>{let[t,n]=(0,d.useState)(e.value??new Date(2026,2,5,9,15,0,0));return(0,f.jsxs)(`div`,{children:[(0,f.jsx)(i,{...e,value:t,onChange:n}),(0,f.jsxs)(`p`,{children:[`Вывод значения через `,(0,f.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsDateTime(value)`}),`:`]}),(0,f.jsx)(`pre`,{children:l(t)}),(0,f.jsxs)(`p`,{children:[`Вывод значения через `,(0,f.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsODataDatetime(value)`}),`:`]}),(0,f.jsx)(`pre`,{children:c(t)})]})},args:{label:`Дата и время`,description:`Фиксированный формат: дд.мм.гггг чч:мм`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},h={render:e=>{let[t,n]=(0,d.useState)(new Date(1970,0,1,9,15,0,0));return(0,f.jsxs)(`div`,{children:[(0,f.jsx)(i,{...e,value:t,onChange:n}),(0,f.jsxs)(`p`,{children:[`Вывод значения через `,(0,f.jsx)(`code`,{className:`statusInfo`,children:`formatDateAsTime(value)`}),`:`]}),(0,f.jsx)(`pre`,{children:o(t)}),(0,f.jsx)(`p`,{children:`Техническая дата значения всегда фиксируется как 01.01.1970.`}),(0,f.jsx)(`pre`,{children:t?t.toISOString():``})]})},args:{label:`Время`,description:`Режим только времени с маской чч:мм и wheel-picker без календаря.`,placeholder:`чч:мм`,mode:`time`,minDate:new Date(2026,2,10,9,15,0,0),maxDate:new Date(2026,2,10,18,30,0,0)}},g={render:e=>{let[t,n]=(0,d.useState)(null);return(0,f.jsx)(i,{...e,value:t,onChange:n})},args:{label:`Пустое значение`,description:`Поле можно заполнить вручную или через popover picker.`,placeholder:`дд.мм.гггг чч:мм`,timePanelPlacement:`bottom`}},_={render:e=>{let[t,n]=(0,d.useState)(new Date(2026,2,10,12,30,0,0));return(0,f.jsx)(i,{...e,value:t,onChange:n})},args:{label:`Дата отгрузки`,description:`Доступен только интервал с 10 по 12 марта 2026 года.`,minDate:new Date(2026,2,10,9,0,0,0),maxDate:new Date(2026,2,12,18,30,0,0),timePanelPlacement:`bottom`}},v={render:e=>{let[t,n]=(0,d.useState)(new Date(2026,2,10,12,30,0,0));return(0,f.jsx)(i,{...e,value:t,onChange:n})},args:{label:`Дата и время`,description:`Wheel-панель времени расположена справа от календаря.`,timePanelPlacement:`right`}},m.parameters={...m.parameters,docs:{...m.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
render: args => {
|
|
3
|
+
const [value, setValue] = useState<Date | null>(args.value ?? new Date(2026, 2, 5, 9, 15, 0, 0));
|
|
4
|
+
return <div>
|
|
5
|
+
<SingleDateTimeInput {...args} value={value} onChange={setValue} />
|
|
6
|
+
|
|
7
|
+
<p>
|
|
8
|
+
Вывод значения через <code className="statusInfo">formatDateAsDateTime(value)</code>:
|
|
9
|
+
</p>
|
|
10
|
+
<pre>{formatDateAsDateTime(value)}</pre>
|
|
11
|
+
<p>
|
|
12
|
+
Вывод значения через <code className="statusInfo">formatDateAsODataDatetime(value)</code>:
|
|
13
|
+
</p>
|
|
14
|
+
<pre>{formatDateAsODataDatetime(value)}</pre>
|
|
15
|
+
</div>;
|
|
16
|
+
},
|
|
17
|
+
args: {
|
|
18
|
+
label: "Дата и время",
|
|
19
|
+
description: "Фиксированный формат: дд.мм.гггг чч:мм",
|
|
20
|
+
placeholder: "дд.мм.гггг чч:мм",
|
|
21
|
+
timePanelPlacement: "bottom"
|
|
22
|
+
}
|
|
23
|
+
}`,...m.parameters?.docs?.source},description:{story:`Демонстрирует основной сценарий выбора даты и времени с точностью до минуты.`,...m.parameters?.docs?.description}}},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
|
|
24
|
+
render: args => {
|
|
25
|
+
const [value, setValue] = useState<Date | null>(new Date(1970, 0, 1, 9, 15, 0, 0));
|
|
26
|
+
return <div>
|
|
27
|
+
<SingleDateTimeInput {...args} value={value} onChange={setValue} />
|
|
28
|
+
|
|
29
|
+
<p>
|
|
30
|
+
Вывод значения через <code className="statusInfo">formatDateAsTime(value)</code>:
|
|
31
|
+
</p>
|
|
32
|
+
<pre>{formatDateAsTime(value)}</pre>
|
|
33
|
+
<p>Техническая дата значения всегда фиксируется как 01.01.1970.</p>
|
|
34
|
+
<pre>{value ? value.toISOString() : ""}</pre>
|
|
35
|
+
</div>;
|
|
36
|
+
},
|
|
37
|
+
args: {
|
|
38
|
+
label: "Время",
|
|
39
|
+
description: "Режим только времени с маской чч:мм и wheel-picker без календаря.",
|
|
40
|
+
placeholder: "чч:мм",
|
|
41
|
+
mode: "time",
|
|
42
|
+
minDate: new Date(2026, 2, 10, 9, 15, 0, 0),
|
|
43
|
+
maxDate: new Date(2026, 2, 10, 18, 30, 0, 0)
|
|
44
|
+
}
|
|
45
|
+
}`,...h.parameters?.docs?.source},description:{story:"Демонстрирует режим выбора только времени на технической дате `1970-01-01`.",...h.parameters?.docs?.description}}},g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
|
|
46
|
+
render: args => {
|
|
47
|
+
const [value, setValue] = useState<Date | null>(null);
|
|
48
|
+
return <SingleDateTimeInput {...args} value={value} onChange={setValue} />;
|
|
49
|
+
},
|
|
50
|
+
args: {
|
|
51
|
+
label: "Пустое значение",
|
|
52
|
+
description: "Поле можно заполнить вручную или через popover picker.",
|
|
53
|
+
placeholder: "дд.мм.гггг чч:мм",
|
|
54
|
+
timePanelPlacement: "bottom"
|
|
55
|
+
}
|
|
56
|
+
}`,...g.parameters?.docs?.source},description:{story:`Показывает пустое контролируемое значение.`,...g.parameters?.docs?.description}}},_.parameters={..._.parameters,docs:{..._.parameters?.docs,source:{originalSource:`{
|
|
57
|
+
render: args => {
|
|
58
|
+
const [value, setValue] = useState<Date | null>(new Date(2026, 2, 10, 12, 30, 0, 0));
|
|
59
|
+
return <SingleDateTimeInput {...args} value={value} onChange={setValue} />;
|
|
60
|
+
},
|
|
61
|
+
args: {
|
|
62
|
+
label: "Дата отгрузки",
|
|
63
|
+
description: "Доступен только интервал с 10 по 12 марта 2026 года.",
|
|
64
|
+
minDate: new Date(2026, 2, 10, 9, 0, 0, 0),
|
|
65
|
+
maxDate: new Date(2026, 2, 12, 18, 30, 0, 0),
|
|
66
|
+
timePanelPlacement: "bottom"
|
|
67
|
+
}
|
|
68
|
+
}`,..._.parameters?.docs?.source},description:{story:`Демонстрирует ограничение диапазона и синхронизацию календаря со временем.`,..._.parameters?.docs?.description}}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
|
|
69
|
+
render: args => {
|
|
70
|
+
const [value, setValue] = useState<Date | null>(new Date(2026, 2, 10, 12, 30, 0, 0));
|
|
71
|
+
return <SingleDateTimeInput {...args} value={value} onChange={setValue} />;
|
|
72
|
+
},
|
|
73
|
+
args: {
|
|
74
|
+
label: "Дата и время",
|
|
75
|
+
description: "Wheel-панель времени расположена справа от календаря.",
|
|
76
|
+
timePanelPlacement: "right"
|
|
77
|
+
}
|
|
78
|
+
}`,...v.parameters?.docs?.source},description:{story:`Демонстрирует размещение wheel-панели справа от календаря.`,...v.parameters?.docs?.description}}},y=[`Default`,`TimeOnly`,`Empty`,`WithLimits`,`WithRightPanel`]})))()}export{_ as a,h as i,g as n,v as o,u as r,b as s,m as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{n as e,o as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-BHhbrImE.js";import{a as i,i as a}from"./utils-DUM89eIj.js";import{n as o,t as s}from"./FloatingPopover-C-W77AcJ.js";import{c,l as ee,o as te,u as ne}from"./Input-DZQKV4DP.js";function l(e){if(!Number.isFinite(e))return 0;let t=e.toString().toLowerCase(),n=t.indexOf(`e-`);if(n>=0)return Number(t.slice(n+2));let r=t.indexOf(`.`);return r>=0?t.length-r-1:0}function u(e,t){if(t<=0)return Math.round(e);let n=10**t;return Math.round(e*n)/n}function d(e,t){return!Number.isFinite(e)||!Number.isFinite(t)?{min:0,max:100}:e<=t?{min:e,max:t}:{min:t,max:e}}function f(e,t,n){return Number.isFinite(e)?Math.min(n,Math.max(t,e)):t}function p(e){return!Number.isFinite(e)||e===void 0||e<=0?1:e}function m(e,t,n){if(!e?.length)return[];let r=new Set;return e.filter(e=>Number.isFinite(e.value)&&e.value>=t&&e.value<=n).slice().sort((e,t)=>e.value-t.value).filter(e=>!r.has(e.value)&&(r.add(e.value),!0))}function h(e,t,n,r){let i=p(r),a=f(e,t,n),o=Math.max(l(i),l(t),l(n));return f(u(t+Math.round((a-t)/i)*i,o),t,n)}function g(e,t){if(!t.length)return;let n=t[0],r=Math.abs(e-n.value);for(let i=1;i<t.length;i+=1){let a=t[i],o=Math.abs(e-a.value);o<r&&(n=a,r=o)}return n}function _(e,t,n,r){if(!t.length)return f(e,n,r);let i=f(e,n,r);return g(i,t)?.value??i}function v(e,t){let{min:n,max:r}=d(t.min,t.max),i=m(t.marks,n,r);return i.length>0?_(e,i,n,r):h(e,n,r,t.step)}function y(e,t,n){return n<=t?0:(f(e,t,n)-t)/(n-t)*100}function re(e,t,n){if(n<=t)return t;let r=f(e,0,100);return t+(n-t)*r/100}function b(e,t,n,r,i=`value`){return i===`index`&&t.length>1?e/(t.length-1)*100:i===`index`?0:y(t[e]?.value??n,n,r)}function x(e,t,n,r,i=`value`){if(!t.length)return;let a=f(e,0,100),o=t[0],s=Math.abs(a-b(0,t,n,r,i));for(let e=1;e<t.length;e+=1){let c=Math.abs(a-b(e,t,n,r,i));c<s&&(o=t[e],s=c)}return o}function ie(e,t,n,r=n.min,i=n.max){let{min:a,max:o}=d(r,i),s=m(n.marks,a,o);if(s.length>0){let n=s.map(e=>e.value),r=0,i=Math.abs(e-n[0]);for(let t=1;t<n.length;t+=1){let a=Math.abs(e-n[t]);a<i&&(i=a,r=t)}return n[f(r+t,0,n.length-1)]}let c=p(n.step);return h(e+t*c,a,o,c)}function S(){return(S=e((()=>{})))()}function C(e,t,n){return m(e,t,n)}function w(e,t,n){let r=t.findIndex(t=>t.value===e.value);return b(Math.max(0,r),t,n.min,n.max,n.marksPosition)}function T(e,t){let{min:n,max:r}=d(t.min,t.max),i=C(t.marks,n,r);if(i.length>0){let a=i.find(t=>t.value===e)??g(e,i);if(a)return w(a,i,{...t,min:n,max:r,marks:i})}return y(e,n,r)}function ae(e,t){let{min:n,max:r}=d(t.min,t.max);return x(e,C(t.marks,n,r),n,r,t.marksPosition)}function E(e,t){return v(e,t)}function D(e,t){let{min:n,max:r}=d(t.min,t.max);return e===void 0?n:E(e,{...t,min:n,max:r})}function O(e){if(e)return!Object.hasOwn(e,`outputValue`)||e.outputValue===void 0?e.value:e.outputValue}function k(e,t,n){let r=t.filter(t=>O(t)===e);if(r.length)return e===null?n===0?r[0]:r[r.length-1]:r[0]}function A(e,t,n){let r=k(e,t,n);if(r)return r;let i,a=1/0;for(let n of t){let t=O(n);if(typeof t!=`number`||!Number.isFinite(t))continue;let r=Math.abs(e-t);r<a&&(i=n,a=r)}return i}function j(e,t,n,r){if(e===null)return null;let{min:i,max:a}=d(r.min,r.max),o=C(r.marks,i,a),s=Number.isFinite(e)?e:t;if(o.length>0){let e=A(s,o,n),r=O(e);return r===void 0?e?.value??t:r}return h(s,i,a,r.step)}function M(e,t){let{min:n,max:r}=d(t.min,t.max);if(!e)return[null,null];let i=j(e[0],n,0,{...t,min:n,max:r}),a=j(e[1],r,1,{...t,min:n,max:r});return i!==null&&a!==null&&i>a?[a,i]:[i,a]}function N(e,t,n,r){if(e===null)return t;let{min:i,max:a}=d(r.min,r.max),o=C(r.marks,i,a);return o.length>0?(k(e,o,n)??(typeof e==`number`?A(e,o,n):void 0))?.value??t:h(e,i,a,r.step)}function oe(e,t){let{min:n,max:r}=d(t.min,t.max),i=M(e,{...t,min:n,max:r}),a=N(i[0],n,0,{...t,min:n,max:r}),o=N(i[1],r,1,{...t,min:n,max:r});return a<=o?[a,o]:[o,a]}function se(e,t){let{min:n,max:r}=d(t.min,t.max),i=C(t.marks,n,r);if(i.length>0){let t=g(e,i),n=O(t);return n===void 0?t?.value??e:n}return h(e,n,r,t.step)}function ce(e,t){let[n,r]=t;return Math.abs(e-n)<=Math.abs(e-r)?0:1}function le(e,t){let{min:n,max:r}=d(t.min,t.max);return Array.isArray(e)?{startPercent:T(e[0],{...t,min:n,max:r}),endPercent:T(e[1],{...t,min:n,max:r})}:{startPercent:0,endPercent:T(e,{...t,min:n,max:r})}}function P(){return(P=e((()=>{})))()}var ue,F,I,L,R,z,B,V,H,U,W,G,K,q,J,de,fe,Y;function X(){return(X=e((()=>{ue=`fA7zne`,F=`TMbaqW`,I=`_77qn1L`,L=`cxJQqh`,R=`-X13t0`,z=`gg-atO`,B=`bTLJZl`,V=`vDAmRy`,H=`iNrV0y`,U=`PpaxP2`,W=`_9K78Fi`,G=`vzEDBe`,K=`_0OWJh0`,q=`Mk4xi2`,J=`SL0IDQ`,de=`mdezg5`,fe=`a4R18g`,Y={slider:ue,sliderCompact:F,trackShell:I,track:L,tooltipReference:R,rail:z,fill:B,thumb:V,marks:H,mark:U,compactMark:W,markDot:G,markLabel:K,popoverContent:q,rangeInputControl:J,rangeSegmentInput:de,rangeSeparator:fe}})))()}function pe(e){return e===`ArrowLeft`||e===`ArrowDown`?-1:e===`ArrowRight`||e===`ArrowUp`?1:e===`PageDown`?-10:e===`PageUp`?10:null}function me(e,t){return!!e&&e[0]===t[0]&&e[1]===t[1]}function he(e,t){return e===null?t===0?`-∞`:`∞`:String(e)}function ge(e,t){return t.find(t=>t.value===e)?.label??String(e)}function _e(e){return typeof e==`string`||typeof e==`number`?(0,$.jsx)(`span`,{className:`textNoWrap`,children:e}):e}function ve({position:e,children:t}){return(0,$.jsx)(`span`,{"data-slot":`slider-tooltip-reference`,className:Y.tooltipReference,style:{left:`${e}%`},children:t})}function Z(e){let{min:t,max:n,step:r,marks:a,marksPosition:o=`value`,marksDisplay:c=`compact`,className:ee,error:l,onClearError:u,label:f,description:p,disabled:m,size:h}=e,{min:g,max:_}=(0,Q.useMemo)(()=>d(t,n),[t,n]),v=(0,Q.useMemo)(()=>C(a,g,_),[a,g,_]),y=(0,Q.useMemo)(()=>({min:g,max:_,step:r,marks:v,marksPosition:o}),[g,_,r,v,o]),b=e.mode===`range`,x=b?void 0:D(e.value,y),S=b?M(e.value,y):void 0,E=b?oe(e.value,y):void 0,O=b?E:[x],k=le(b?E:x,y),A=(0,Q.useRef)(null),j=(0,Q.useRef)([]),N=(0,Q.useRef)(null),P=(0,Q.useRef)(null),[ue,F]=(0,Q.useState)(null),{controlId:I,labelId:L,descriptionId:R,errorId:z,describedBy:B}=ne({hasLabel:f!=null,hasDescription:!!p,hasError:!!l}),V=t=>{m||e.mode!==`single`||(e.value===void 0||e.value!==t)&&(e.onChange(t),u?.())},H=t=>{m||e.mode!==`range`||me(e.value,t)||(e.onChange(t),u?.())},U=(t,n)=>{if(!m){if(e.mode===`range`){let[e,r]=E,[i,a]=S,o=M(n===0?[se(Math.min(t,r),y),a]:[i,se(Math.max(t,e),y)],y);H(o);return}V(D(t,y))}},W=e=>{let t=A.current?.getBoundingClientRect();if(!t)return g;let n=(e-t.left)/t.width*100;return(v.length>0?ae(n,y):void 0)?.value??re(n,g,_)},G=(0,Q.useRef)(U),K=(0,Q.useRef)(W);(0,Q.useEffect)(()=>{G.current=U,K.current=W}),(0,Q.useEffect)(()=>{let e=e=>{P.current!==null&&e&&e.pointerId!==P.current||(P.current=null,N.current=null,F(null))},t=e=>{N.current!==null&&(P.current===null||e.pointerId===P.current)&&G.current(K.current(e.clientX),N.current)};return window.addEventListener(`pointermove`,t),window.addEventListener(`pointerup`,e),window.addEventListener(`pointercancel`,e),()=>{window.removeEventListener(`pointermove`,t),window.removeEventListener(`pointerup`,e),window.removeEventListener(`pointercancel`,e)}},[]);let q=(e,t)=>{P.current=e,N.current=t,F(t),j.current[t]?.focus()},J=e=>{if(m)return;e.preventDefault();let t=W(e.clientX),n=b?ce(t,E):0;U(t,n),q(e.pointerId,n)},de=e=>t=>{m||(t.preventDefault(),t.stopPropagation(),q(t.pointerId,e))},fe=e=>t=>{if(m)return;let n=b&&e===1?E[0]:g,r=b&&e===0?E[1]:_,i=pe(t.key);if(t.key===`Home`){t.preventDefault(),U(n,e);return}if(t.key===`End`){t.preventDefault(),U(r,e);return}if(i===null)return;t.preventDefault();let a=O[e],o=ie(a,i,y,n,r);U(o,e)},X=e=>{if(m)return;let t=b?ce(e,E):0;U(e,t),j.current[t]?.focus()},Z=(e,t)=>{if(b){let n=S[t];return v.find(t=>t.value===e)?.label??he(n,t)}return ge(e,v)};return(0,$.jsx)(te,{label:f,description:p,disabled:m,className:ee,size:h,error:l,controlId:I,labelId:L,descriptionId:R,errorId:z,children:(0,$.jsxs)(`div`,{id:I,className:i(Y.slider,c===`compact`&&Y.sliderCompact),children:[(0,$.jsx)(`div`,{className:Y.trackShell,children:(0,$.jsxs)(`div`,{ref:A,"data-slot":`track`,className:Y.track,role:`presentation`,onPointerDown:J,children:[(0,$.jsx)(`div`,{className:Y.rail}),(0,$.jsx)(`div`,{"data-slot":`fill`,className:Y.fill,style:{left:`${k.startPercent}%`,width:`${k.endPercent-k.startPercent}%`}}),c===`compact`&&v.map(e=>{let t=w(e,v,y),n=b?e.value>=E[0]&&e.value<=E[1]:e.value<=x;return(0,$.jsx)(ve,{position:t,children:(0,$.jsx)(s,{tooltip:!0,placement:`top`,content:_e(e.label),children:(0,$.jsx)(`button`,{type:`button`,"data-slot":`mark`,"data-active":n?``:void 0,className:Y.compactMark,"aria-label":e.ariaLabel,disabled:m,onClick:()=>X(e.value),children:(0,$.jsx)(`span`,{className:Y.markDot,"aria-hidden":`true`})})})},e.value)}),O.map((e,t)=>{let n=Z(e,t);return(0,$.jsx)(ve,{position:T(e,y),children:(0,$.jsx)(s,{tooltip:!0,placement:`top`,content:_e(n),openDelay:0,closeDelay:100,positionUpdateKey:e,children:(0,$.jsx)(`button`,{ref:e=>{j.current[t]=e},type:`button`,role:`slider`,"data-slot":`thumb`,"data-thumb-index":t,"data-dragging":ue===t?``:void 0,className:Y.thumb,disabled:m,"aria-disabled":m||void 0,"aria-orientation":`horizontal`,"aria-valuemin":b&&t===1?E[0]:g,"aria-valuemax":b&&t===0?E[1]:_,"aria-valuenow":e,"aria-valuetext":typeof n==`string`||typeof n==`number`?String(n):void 0,"aria-labelledby":L,"aria-describedby":B,"aria-label":L?void 0:b?t===0?`Минимальное значение`:`Максимальное значение`:`Значение`,onPointerDown:de(t),onKeyDown:fe(t)})})},t)})]})}),c===`full`&&v.length>0&&(0,$.jsx)(`div`,{className:Y.marks,children:v.map(e=>{let t=b?e.value>=E[0]&&e.value<=E[1]:e.value<=x;return(0,$.jsxs)(`button`,{type:`button`,"data-slot":`mark`,"data-active":t?``:void 0,className:Y.mark,style:{left:`${w(e,v,y)}%`},"aria-label":e.ariaLabel,disabled:m,onClick:()=>X(e.value),children:[(0,$.jsx)(`span`,{className:Y.markDot,"aria-hidden":`true`}),(0,$.jsx)(`span`,{className:Y.markLabel,children:e.label})]},e.value)})})]})})}function ye(e){return(0,$.jsx)(Z,{...e,mode:`single`,marksDisplay:`compact`})}function be(e){return(0,$.jsx)(Z,{...e,mode:`range`,marksDisplay:`compact`})}var Q,$;function xe(){return(xe=e((()=>{Q=t(n(),1),a(),c(),ee(),o(),P(),X(),$=r(),Z.__docgenInfo={description:``,methods:[],displayName:`SliderBase`},ye.__docgenInfo={description:``,methods:[],displayName:`Slider`,props:{min:{required:!0,tsType:{name:`number`},description:`Минимальная координата шкалы. Marks вне этой границы отбрасываются.`},max:{required:!0,tsType:{name:`number`},description:`Максимальная координата шкалы. Marks вне этой границы отбрасываются.`},step:{required:!1,tsType:{name:`number`},description:"Шаг изменения, когда `marks` не заданы или после фильтрации не осталось валидных marks."},marks:{required:!1,tsType:{name:`unknown`},description:`Дискретные точки выбора. Если заданы, бегунок всегда ходит только по marks.`},marksPosition:{required:!1,tsType:{name:`NumberScaleMarksPosition`},description:"Способ визуального размещения marks и бегунка: по числовой координате `value` или равномерно по индексу."},className:{required:!1,tsType:{name:`string`},description:`Внешний CSS-класс контейнера поля.`},error:{required:!1,tsType:{name:`string`},description:"Текст внешней ошибки, отображается через общую `InputUI`-обёртку."},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:`Вызывается после успешного изменения значения, чтобы потребитель мог сбросить внешнюю ошибку.`}},composes:[`Omit`]},be.__docgenInfo={description:``,methods:[],displayName:`SliderRange`,props:{min:{required:!0,tsType:{name:`number`},description:`Минимальная координата шкалы. Marks вне этой границы отбрасываются.`},max:{required:!0,tsType:{name:`number`},description:`Максимальная координата шкалы. Marks вне этой границы отбрасываются.`},step:{required:!1,tsType:{name:`number`},description:"Шаг изменения, когда `marks` не заданы или после фильтрации не осталось валидных marks."},marks:{required:!1,tsType:{name:`unknown`},description:`Дискретные точки выбора. Если заданы, бегунок всегда ходит только по marks.`},marksPosition:{required:!1,tsType:{name:`NumberScaleMarksPosition`},description:"Способ визуального размещения marks и бегунка: по числовой координате `value` или равномерно по индексу."},className:{required:!1,tsType:{name:`string`},description:`Внешний CSS-класс контейнера поля.`},error:{required:!1,tsType:{name:`string`},description:"Текст внешней ошибки, отображается через общую `InputUI`-обёртку."},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:`Вызывается после успешного изменения значения, чтобы потребитель мог сбросить внешнюю ошибку.`}},composes:[`Omit`]}})))()}export{Y as a,P as c,C as d,S as f,xe as i,M as l,Z as n,X as o,d as p,be as r,O as s,ye as t,D as u};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,c as m,i as h,l as g,n as _,o as v,r as y,s as b,t as x,u as S}from"./Slider.stories-DeeP8cmV.js";function C(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(s,{of:g,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,T.jsx)(u,{children:`Slider`}),`
|
|
3
3
|
`,(0,T.jsx)(o,{children:`Компактные single и range слайдеры с marks, tooltip и открытыми границами`}),`
|
|
4
4
|
`,(0,T.jsxs)(t.p,{children:[(0,T.jsx)(t.code,{children:`Slider`}),` и `,(0,T.jsx)(t.code,{children:`SliderRange`}),` — отдельные публичные компоненты. Оба используют общую числовую шкалу, но не смешивают single/range через prop.`]}),`
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.fA7zne{gap:var(--space-sm);flex-direction:column;display:flex}.TMbaqW{gap:0}._77qn1L{padding-inline:calc((var(--control-height) - var(--space-xs)) / 2);position:relative}.cxJQqh{height:var(--control-height);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;position:relative}.-X13t0{top:calc(50% - (var(--control-height) - var(--space-xs)) / 2);width:0;height:0;position:absolute;left:0}.gg-atO,.bTLJZl{height:var(--space-sm);border-radius:999px;position:absolute;top:50%;transform:translateY(-50%)}.gg-atO{background-color:var(--surface-2);border:var(--border);left:0;right:0}.bTLJZl{background-color:var(--status-info-fill)}.vDAmRy{top:calc((var(--control-height) - var(--space-xs)) / 2);width:calc(var(--control-height) - var(--space-xs));height:calc(var(--control-height) - var(--space-xs));border:var(--border);background-color:var(--surface-0);color:var(--content-0);box-shadow:var(--shadow-sm);cursor:grab;z-index:2;transition:transform var(--transition-fast) ease, border-color var(--transition-fast) ease, box-shadow var(--transition-fast) ease, background-color var(--transition-fast) ease;border-radius:50%;position:absolute;left:0;transform:translate(-50%,-50%)}.vDAmRy:active,.vDAmRy:hover{border-color:var(--border-1)}.vDAmRy:focus-visible{outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset)}.vDAmRy[data-dragging]{cursor:grabbing;box-shadow:var(--shadow-md);transform:translate(-50%,-50%)scale(1.04)}.iNrV0y{min-height:calc(var(--font-size-sm) + var(--space-md));margin-inline:calc((var(--control-height) - var(--space-xs)) / 2);position:relative}.PpaxP2{align-items:center;gap:var(--space-xs);color:var(--content-2);cursor:pointer;white-space:nowrap;background:0 0;border:none;flex-direction:column;padding:0;display:inline-flex;position:absolute;top:0;transform:translate(-50%)}.PpaxP2:focus-visible{outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset);border-radius:var(--radius-sm)}.PpaxP2[data-active]{color:var(--content-0)}._9K78Fi{top:calc((var(--control-height) - var(--space-xs)) / 2);width:var(--control-height);height:var(--control-height);color:var(--content-2);cursor:pointer;z-index:1;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex;position:absolute;left:0;transform:translate(-50%,-50%)}._9K78Fi:focus-visible{outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset);border-radius:var(--radius-sm)}._9K78Fi[data-active]{color:var(--content-0)}._9K78Fi:disabled{cursor:default}.vzEDBe{width:var(--space-sm);height:var(--space-sm);background-color:currentColor;border-radius:50%}._0OWJh0{font-size:var(--font-size-sm)}.Mk4xi2{min-width:min(24em, 100vw - var(--space-xl))}.SL0IDQ{gap:var(--space-xs);cursor:text}.mdezg5{width:7ch;min-width:0;font-family:var(--font-family-mono);color:inherit;text-align:center;caret-color:var(--content-0);font-variant-numeric:tabular-nums;background:0 0;border:none;outline:none;margin:0;padding:0}.mdezg5::selection{background-color:var(--focus-ring);color:var(--surface-0)}.mdezg5:disabled{opacity:.25}.a4R18g{-webkit-user-select:none;user-select:none;color:var(--content-2);flex-shrink:0}.a4R18g[data-disabled]{opacity:.25}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-BHhbrImE.js";import{i,r as a,t as o}from"./Slider-24H5ASxG.js";var s=t({Disabled:()=>E,MonthsIndexMarks:()=>x,RangeMonthToDaysOutput:()=>w,RangeOpenMonthToDaysOutput:()=>T,RangeOpenWithoutExplicitMiddleOutput:()=>C,RangePlain:()=>S,SingleStep:()=>y,SingleWithMarks:()=>b,__namedExportsOrder:()=>D,default:()=>v});function c(e,t){return e===null?`null`:`${e}${t}`}function l(e,t,n=``){let[r,i]=e??[null,null],a=[];return r!==null&&a.push(`${t} >= ${r}${n}`),i!==null&&a.push(`${t} <= ${i}${n}`),a.length>0?a.join(` AND `):`Фильтр не ограничивает значение`}function u({value:e,field:t,unit:n=``,children:r}){let[i,a]=e??[null,null];return(0,f.jsxs)(`div`,{className:`marginTopMd`,children:[(0,f.jsx)(`div`,{className:`textSm сontent2`,children:`Preview фильтра`}),(0,f.jsx)(`pre`,{children:JSON.stringify({value:[i,a],human:`${c(i,n)} — ${c(a,n)}`,filter:l(e,t,n)},null,2)}),r]})}var d,f,p,m,h,g,_,v,y,b,x,S,C,w,T,E,D;function O(){return(O=e((()=>{d=n(),i(),f=r(),p=[{value:0,label:`0`},{value:25,label:`25`},{value:50,label:`50`},{value:75,label:`75`},{value:100,label:`100`}],m=[{value:1,label:`1 мес.`},{value:3,label:`3 мес.`},{value:6,label:`6 мес.`},{value:9,label:`9 мес.`},{value:12,label:`12 мес.`},{value:18,label:`18 мес.`},{value:24,label:`24 мес.`}],h=[{value:0,label:`Без нижней границы`,outputValue:null},{value:1,label:`1 мес.`},{value:3,label:`3 мес.`},{value:6,label:`6 мес.`},{value:12,label:`12 мес.`},{value:24,label:`24 мес.`},{value:25,label:`Без верхней границы`,outputValue:null}],g=[{value:1,label:`1 мес.`,outputValue:30},{value:3,label:`3 мес.`,outputValue:90},{value:6,label:`6 мес.`,outputValue:180},{value:12,label:`12 мес.`,outputValue:360},{value:24,label:`24 мес.`,outputValue:720}],_=[{value:0,label:`Без нижней границы`,outputValue:null},{value:1,label:`1 мес.`,outputValue:30},{value:3,label:`3 мес.`,outputValue:90},{value:6,label:`6 мес.`,outputValue:180},{value:12,label:`12 мес.`,outputValue:360},{value:24,label:`24 мес.`,outputValue:720},{value:25,label:`Без верхней границы`,outputValue:null}],v={title:`Shared/UI/Slider`,component:o,args:{value:30,onChange:()=>{},min:0,max:100,step:5},parameters:{atomicCanvas:!0,layout:`padded`}},y={render:e=>{let t=e,[n,r]=(0,d.useState)(e.value);return(0,f.jsx)(o,{...t,label:`Громкость`,value:n,onChange:r})},args:{description:`Компактный single-value слайдер со step=5.`,value:35,step:5}},b={render:e=>{let t=e,[n,r]=(0,d.useState)(50);return(0,f.jsx)(o,{...t,label:`Процент выполнения`,value:n,onChange:r})},args:{description:`Marks активны, кликабельны и показывают подписи через tooltip.`,value:50,marks:p}},x={render:e=>{let t=e,[n,r]=(0,d.useState)(6);return(0,f.jsx)(o,{...t,label:`Срок`,value:n,onChange:r})},args:{min:1,max:24,value:6,marks:m,marksPosition:`index`,description:`Неравномерные значения месяцев расположены с равным визуальным шагом.`}},S={render:()=>{let[e,t]=(0,d.useState)([25,75]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(a,{label:`Процент выполнения`,description:"Обычный range: `value` mark является и координатой шкалы, и значением фильтра.",min:0,max:100,marks:p,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`progress`,unit:`%`})]})}},C={render:()=>{let[e,t]=(0,d.useState)([null,12]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(a,{label:`Срок в месяцах`,description:"Открытые границы задаются только крайними `outputValue:null`; у обычных marks outputValue не указан и берётся `value`.",min:0,max:25,marks:h,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`months`,unit:` мес.`})]})}},w={render:()=>{let[e,t]=(0,d.useState)([90,360]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(a,{label:`Срок: месяцы на шкале, дни в фильтре`,description:"`value` хранит координату/месяцы, `outputValue` отдаёт наружу дни.",min:1,max:24,marks:g,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`days`,unit:` дн.`})]})}},T={render:()=>{let[e,t]=(0,d.useState)([null,720]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(a,{label:`Срок: открытые границы и дни в фильтре`,description:"Крайние marks отдают null, обычные marks отдают дни через `outputValue`.",min:0,max:25,marks:_,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`days`,unit:` дн.`})]})}},E={args:{label:`Недоступно`,description:`Состояние без интеракций.`,value:40,disabled:!0,marks:p}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const sliderArgs = args as SliderProps;
|
|
4
4
|
const [value, setValue] = useState<number | undefined>(args.value as number | undefined);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,c as m,d as h,i as g,l as _,n as v,o as y,r as b,s as x,t as S,u as C}from"./SliderInput.stories-Djli653m.js";function w(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(s,{of:C,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,E.jsx)(u,{children:`SliderInput`}),`
|
|
3
3
|
`,(0,E.jsx)(o,{children:`Поля ввода для single и range с popover slider`}),`
|
|
4
4
|
`,(0,E.jsxs)(t.p,{children:[(0,E.jsx)(t.code,{children:`SliderInput`}),` работает с одним числом, а `,(0,E.jsx)(t.code,{children:`SliderRangeInput`}),` — с диапазоном `,(0,E.jsx)(t.code,{children:`[number | null, number | null]`}),`.`]}),`
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n}from"./iframe-BHhbrImE.js";import{a as r,i}from"./utils-DUM89eIj.js";import{o as a,s as o}from"./odata-service-B5w4YBao-BcP2cvfZ.js";import{n as s,t as c}from"./Popover-CUJF-IMC.js";import{n as l,t as u}from"./ui.module-kfCm3RIG.js";import{a as d,c as f,l as p,o as m,r as h,u as g}from"./Input-DZQKV4DP.js";import{n as _,t as v}from"./PickerTriggerActions-C7WeaOKN.js";import{a as y,c as b,d as x,i as S,l as C,n as w,o as T,p as E,s as D,u as O}from"./Slider-24H5ASxG.js";function k({open:e,disabled:t,setOpen:n}){return(0,z.jsx)(c.Trigger,{passive:!0,children:(0,z.jsx)(`div`,{children:(0,z.jsx)(v,{open:e,disabled:t,openAriaLabel:`Открыть слайдер`,closeAriaLabel:`Закрыть слайдер`,onToggleMouseDown:e=>e.preventDefault(),onToggleClick:()=>n(e=>!e)})})})}function A(e,t){let n=C(e,t);return{start:n[0]===null?`-∞`:String(n[0]),end:n[1]===null?`∞`:String(n[1])}}function j(e,t){let n=e.trim();return n===``||n===t?null:a(n)}function M(e,t,n){let r=t.filter(t=>D(t)===e);if(r.length)return e===null&&n===`end`?r[r.length-1]:r[0]}function N(e,t){return e?.readonlyLabel?.trim()?e.readonlyLabel.trim():typeof e?.label==`string`||typeof e?.label==`number`?String(e.label):t===null?``:String(t)}function P(e,t,n){return N(M(e,t,n),e)}function ee(e,t,n){let[r,i]=e,a=r===null,o=i===null;return a&&o?n??``:a?`Меньше ${P(i,t,`end`)}`:o?`Больше ${P(r,t,`start`)}`:r===i?`Равно ${P(r,t,`start`)}`:`От ${P(r,t,`start`)} до ${P(i,t,`end`)}`}function F({value:e,onChange:t,min:n,max:r,step:i,marks:o,marksPosition:s=`value`,className:l,error:u,onClearError:f,label:p,description:m,placeholder:h,disabled:g,size:_}){let{min:v,max:b}=(0,R.useMemo)(()=>E(n,r),[n,r]),S=(0,R.useMemo)(()=>x(o,v,b),[o,v,b]),C=(0,R.useMemo)(()=>({min:v,max:b,step:i,marks:S,marksPosition:s}),[v,b,i,S,s]),T=O(e,C),[D,A]=(0,R.useState)(!1),[j,M]=(0,R.useState)(String(T)),N=(0,R.useEffectEvent)(e=>{M(e)});(0,R.useEffect)(()=>{N(String(T))},[T]);let P=(0,R.useCallback)(()=>{if(g){M(String(T));return}let n=a(j);if(n===void 0){M(String(T));return}let r=O(n,C);e!==r&&(t(r),f?.()),M(String(r))},[g,j,T,t,f,C,e]);return(0,z.jsxs)(c,{open:D,onOpenChange:A,children:[(0,z.jsx)(d,{label:p,description:m,placeholder:h,disabled:g,size:_,className:l,error:u,value:j,onChange:M,onBlur:P,onKeyDown:e=>{e.key===`Enter`&&(e.preventDefault(),P())},endAdornmentWidth:`var(--control-height)`,endAdornment:k({open:D,disabled:g,setOpen:A})}),(0,z.jsx)(c.Content,{background:`primary`,children:(0,z.jsx)(`div`,{className:y.popoverContent,children:(0,z.jsx)(w,{mode:`single`,min:v,max:b,step:i,marks:S,marksPosition:s,marksDisplay:`full`,value:e,onChange:e=>{t(e),M(String(e)),f?.()},disabled:g})})})]})}function I({value:e,onChange:t,min:n,max:i,step:a,marks:o,marksPosition:s=`value`,className:u,error:d,onClearError:f,label:p,description:_,readonlyValueText:v,placeholder:b,disabled:S,size:T}){let{min:D,max:O}=(0,R.useMemo)(()=>E(n,i),[n,i]),M=(0,R.useMemo)(()=>x(o,D,O),[o,D,O]),N=(0,R.useMemo)(()=>({min:D,max:O,step:a,marks:M,marksPosition:s}),[D,O,a,M,s]),P=(0,R.useMemo)(()=>C(e,N),[N,e]),F=(0,R.useMemo)(()=>A(P,N),[P,N]),[I,B]=(0,R.useState)(!1),[V,H]=(0,R.useState)(F.start),[U,W]=(0,R.useState)(F.end),[G,K]=(0,R.useState)(P),te=(0,R.useEffectEvent)((e,t)=>{H(e),W(t)});(0,R.useEffect)(()=>{I||te(F.start,F.end)},[F.start,F.end,P,I]);let{controlId:q,labelId:J,descriptionId:ne,errorId:re,describedBy:ie}=g({hasLabel:p!=null,hasDescription:!!_,hasError:!!d}),Y=(0,R.useCallback)(()=>{H(F.start),W(F.end)},[F.end,F.start]),X=(0,R.useCallback)(()=>{if(S){Y();return}let e=j(V,`-∞`),n=j(U,`∞`);if(e===void 0||n===void 0){Y();return}let r=C([e,n],N);L(P,r)||(t(r),f?.());let i=A(r,N);H(i.start),W(i.end),K(r)},[S,U,V,P,t,f,Y,N]),ae=(0,R.useCallback)(e=>{let n=C(e,N);L(P,n)||(t(n),f?.());let r=A(n,N);H(r.start),W(r.end),K(n)},[P,t,f,N]),Z=e=>{!I&&e&&(K(P),H(F.start),W(F.end)),I&&!e&&!S&&ae(G),B(e)},Q=e=>{e.key===`Enter`&&(e.preventDefault(),X())},oe=e=>{let t=C(e,N);K(t);let n=A(t,N);H(n.start),W(n.end)},$=v?ee(I?G:P,M,b):void 0;return(0,z.jsxs)(c,{open:I,onOpenChange:Z,children:[(0,z.jsx)(m,{label:p,description:_,disabled:S,className:u,size:T,error:d,controlId:q,labelId:J,descriptionId:ne,errorId:re,children:(0,z.jsx)(h,{endAdornmentWidth:`var(--control-height)`,endAdornment:k({open:I,disabled:S,setOpen:e=>{Z(typeof e==`function`?e(I):e)}}),children:({controlClassName:e})=>(0,z.jsx)(`div`,{id:q,className:r(l.uiInputControlFake,y.rangeInputControl,e),"data-invalid":d?``:void 0,"data-disabled":S||void 0,role:`group`,"aria-invalid":!!d||void 0,"aria-label":typeof p==`string`?p:`Диапазон`,"aria-labelledby":typeof p==`string`?void 0:J,"aria-describedby":ie,children:v?(0,z.jsx)(`span`,{className:r(`flexEllipsis`,!$&&l.uiPlaceholder),children:$||b}):(0,z.jsxs)(z.Fragment,{children:[(0,z.jsx)(`input`,{type:`text`,inputMode:`decimal`,className:y.rangeSegmentInput,value:V,disabled:S,"aria-label":`Начало диапазона`,onChange:e=>H(e.target.value),onBlur:X,onKeyDown:Q}),(0,z.jsx)(`span`,{className:y.rangeSeparator,"data-disabled":S||void 0,children:`-`}),(0,z.jsx)(`input`,{type:`text`,inputMode:`decimal`,className:y.rangeSegmentInput,value:U,disabled:S,"aria-label":`Конец диапазона`,onChange:e=>W(e.target.value),onBlur:X,onKeyDown:Q})]})})})}),(0,z.jsx)(c.Content,{background:`primary`,children:(0,z.jsx)(`div`,{className:y.popoverContent,children:(0,z.jsx)(w,{mode:`range`,min:D,max:O,step:a,marks:M,marksPosition:s,marksDisplay:`full`,value:G,onChange:oe,disabled:S})})})]})}function L(e,t){return e[0]===t[0]&&e[1]===t[1]}var R,z;function B(){return(B=e((()=>{R=t(),o(),i(),f(),p(),_(),s(),u(),b(),S(),T(),z=n(),F.__docgenInfo={description:``,methods:[],displayName:`SliderInput`,props:{label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},min:{required:!0,tsType:{name:`number`},description:`Минимальная координата шкалы. Marks вне этой границы не участвуют в выборе.`},max:{required:!0,tsType:{name:`number`},description:`Максимальная координата шкалы. Marks вне этой границы не участвуют в выборе.`},step:{required:!1,tsType:{name:`number`},description:`Шаг ручного ввода и слайдера, если не заданы marks.`},marksPosition:{required:!1,tsType:{name:`NumberScaleMarksPosition`},description:`Способ визуального размещения marks и бегунка в popover.`,defaultValue:{value:`"value"`,computed:!1}},className:{required:!1,tsType:{name:`string`},description:`Внешний CSS-класс общей обёртки поля.`},error:{required:!1,tsType:{name:`string`},description:`Текст внешней ошибки.`},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:`Сбрасывает внешнюю ошибку после успешного commit или выбора в popover.`},marks:{required:!1,tsType:{name:`unknown`},description:"Marks single-слайдера. Single-компонент отдаёт наружу `mark.value`."}}},I.__docgenInfo={description:``,methods:[],displayName:`SliderRangeInput`,props:{label:{required:!1,tsType:{name:`ReactNode`},description:``},description:{required:!1,tsType:{name:`string`},description:``},placeholder:{required:!1,tsType:{name:`string`},description:``},disabled:{required:!1,tsType:{name:`boolean`},description:``},size:{required:!1,tsType:{name:`union`,raw:`"xs" | "sm" | "md" | "lg" | "xl"`,elements:[{name:`literal`,value:`"xs"`},{name:`literal`,value:`"sm"`},{name:`literal`,value:`"md"`},{name:`literal`,value:`"lg"`},{name:`literal`,value:`"xl"`}]},description:``},value:{required:!0,tsType:{name:`V`},description:"Если начальное состояние может быть `null | undefined`\nзначит `onChange` тоже должен ументь сбрасывать.\nПоэтому такой контрол явно должен передавать `UiBaseProps<AnyType | undefined>`"},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: T) => void`,signature:{arguments:[{type:{name:`C`},name:`value`}],return:{name:`void`}}},description:``},min:{required:!0,tsType:{name:`number`},description:`Минимальная координата шкалы. Marks вне этой границы не участвуют в выборе.`},max:{required:!0,tsType:{name:`number`},description:`Максимальная координата шкалы. Marks вне этой границы не участвуют в выборе.`},step:{required:!1,tsType:{name:`number`},description:`Шаг ручного ввода и слайдера, если не заданы marks.`},marksPosition:{required:!1,tsType:{name:`NumberScaleMarksPosition`},description:`Способ визуального размещения marks и бегунка в popover.`,defaultValue:{value:`"value"`,computed:!1}},className:{required:!1,tsType:{name:`string`},description:`Внешний CSS-класс общей обёртки поля.`},error:{required:!1,tsType:{name:`string`},description:`Текст внешней ошибки.`},onClearError:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:`Сбрасывает внешнюю ошибку после успешного commit или выбора в popover.`},marks:{required:!1,tsType:{name:`unknown`},description:"Marks range-слайдера. `value` задаёт координату на шкале, `outputValue` задаёт публичное значение для потребителя."},readonlyValueText:{required:!1,tsType:{name:`boolean`},description:`Показывает вместо ручных сегментов готовый текст по выбранным marks.
|
|
2
|
+
Popover остаётся единственным способом изменить значение через слайдер, а потребитель получает изменение при закрытии popover.`}}}})))()}export{I as n,B as r,F as t};
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-BHhbrImE.js";import{a as i,s as a}from"./odata-service-B5w4YBao-BcP2cvfZ.js";import{n as o,r as s,t as c}from"./SliderInput-bqFr-Lyp.js";var l=t({Basic:()=>v,DecimalManualInput:()=>b,Disabled:()=>E,MarksSnap:()=>y,RangeInputMonthToDaysOutput:()=>C,RangeInputOpenMonthToDaysOutput:()=>w,RangeInputOpenWithoutExplicitMiddleOutput:()=>S,RangeInputPlain:()=>x,RangeInputReadonlyText:()=>T,__namedExportsOrder:()=>D,default:()=>_});function u({value:e,field:t,children:n}){let[r,a]=e??[null,null];return(0,f.jsxs)(`div`,{className:`marginTopMd`,children:[(0,f.jsx)(`div`,{className:`textSm сontent2`,children:`Preview фильтра`}),(0,f.jsx)(`pre`,{children:JSON.stringify({value:[r,a],filter:i(t,e)},null,2)}),n]})}var d,f,p,m,h,g,_,v,y,b,x,S,C,w,T,E,D;function O(){return(O=e((()=>{d=n(),a(),s(),f=r(),p=[{value:0,label:`0`},{value:20,label:`20`},{value:40,label:`40`},{value:60,label:`60`},{value:80,label:`80`},{value:100,label:`100`}],m=[{value:0,label:`Без нижней границы`,outputValue:null},{value:1,label:`1 мес.`},{value:3,label:`3 мес.`},{value:6,label:`6 мес.`},{value:12,label:`12 мес.`},{value:24,label:`24 мес.`},{value:25,label:`Без верхней границы`,outputValue:null}],h=[{value:1,label:`1 мес.`,outputValue:30},{value:3,label:`3 мес.`,outputValue:90},{value:6,label:`6 мес.`,outputValue:180},{value:12,label:`12 мес.`,outputValue:360},{value:24,label:`24 мес.`,outputValue:720}],g=[{value:0,label:`-`,outputValue:null},{value:1,label:`1м.`,outputValue:30},{value:3,label:`3м.`,outputValue:90},{value:6,label:`6м.`,outputValue:180},{value:12,label:`1г.`,outputValue:360},{value:18,label:`1.5г.`,outputValue:540},{value:24,label:`2г.`,outputValue:720},{value:25,label:`-`,outputValue:null}],_={title:`Shared/UI/SliderInput`,component:c,args:{value:12,onChange:()=>{},min:0,max:100,step:.5},parameters:{atomicCanvas:!0,layout:`padded`}},v={render:e=>{let[t,n]=(0,d.useState)(e.value);return(0,f.jsx)(c,{...e,label:`Порог`,description:`Ручной ввод и popover slider работают с одним значением.`,value:t,onChange:n})}},y={render:e=>{let[t,n]=(0,d.useState)(40);return(0,f.jsx)(c,{...e,label:`Готовый пресет`,marks:p,value:t,onChange:n})}},b={render:e=>{let[t,n]=(0,d.useState)(17.5);return(0,f.jsx)(c,{...e,label:`Десятичное значение`,value:t,onChange:n})},args:{step:.5}},x={render:()=>{let[e,t]=(0,d.useState)([20,80]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o,{label:`Процент выполнения`,description:"RangeInput без outputValue: наружу отдаётся координата `value`.",min:0,max:100,marks:p,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`progress`,unit:`%`})]})}},S={render:()=>{let[e,t]=(0,d.useState)([null,12]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o,{label:`Срок в месяцах`,description:"У крайних marks `outputValue:null`; у обычных marks outputValue не указан и берётся `value`.",min:0,max:25,marks:m,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`months`,unit:` мес.`})]})}},C={render:()=>{let[e,t]=(0,d.useState)([90,360]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o,{label:`Срок: месяцы на шкале, дни в фильтре`,description:`В поле и фильтре видны дни, а popover показывает месячные marks.`,min:1,max:24,marks:h,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`days`,unit:` дн.`})]})}},w={render:()=>{let[e,t]=(0,d.useState)([null,720]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o,{label:`Срок: открытые границы и дни в фильтре`,description:"Крайние marks отдают null, обычные marks отдают дни через `outputValue`.",min:0,max:25,marks:g,marksPosition:`index`,value:e,onChange:t}),(0,f.jsx)(u,{value:e,field:`days`,unit:` дн.`})]})}},T={render:()=>{let[e,t]=(0,d.useState)([90,180]);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o,{label:`Срок текстом`,description:`В поле выводится готовый текст по marks, а изменение через popover коммитится при закрытии.`,min:0,max:25,marks:g,marksPosition:`index`,value:e,onChange:t,readonlyValueText:!0,placeholder:`Любой срок`}),(0,f.jsx)(u,{value:e,field:`days`,unit:` дн.`})]})}},E={args:{label:`Недоступно`,description:`Поле и popover отключены.`,value:20,disabled:!0,marks:p}},v.parameters={...v.parameters,docs:{...v.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
render: args => {
|
|
3
|
+
const [value, setValue] = useState<number>(args.value);
|
|
4
|
+
return <SliderInput {...args} label="Порог" description="Ручной ввод и popover slider работают с одним значением." value={value} onChange={setValue} />;
|
|
5
|
+
}
|
|
6
|
+
}`,...v.parameters?.docs?.source}}},y.parameters={...y.parameters,docs:{...y.parameters?.docs,source:{originalSource:`{
|
|
7
|
+
render: args => {
|
|
8
|
+
const [value, setValue] = useState<number>(40);
|
|
9
|
+
return <SliderInput {...args} label="Готовый пресет" marks={percentMarks} value={value} onChange={setValue} />;
|
|
10
|
+
}
|
|
11
|
+
}`,...y.parameters?.docs?.source}}},b.parameters={...b.parameters,docs:{...b.parameters?.docs,source:{originalSource:`{
|
|
12
|
+
render: args => {
|
|
13
|
+
const [value, setValue] = useState<number>(17.5);
|
|
14
|
+
return <SliderInput {...args} label="Десятичное значение" value={value} onChange={setValue} />;
|
|
15
|
+
},
|
|
16
|
+
args: {
|
|
17
|
+
step: 0.5
|
|
18
|
+
}
|
|
19
|
+
}`,...b.parameters?.docs?.source}}},x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
|
|
20
|
+
render: () => {
|
|
21
|
+
const [value, setValue] = useState<SliderRangeValue>([20, 80]);
|
|
22
|
+
return <>
|
|
23
|
+
<SliderRangeInput label="Процент выполнения" description="RangeInput без outputValue: наружу отдаётся координата \`value\`." min={0} max={100} marks={percentMarks} value={value} onChange={setValue} />
|
|
24
|
+
<RangePreview value={value} field="progress" unit="%" />
|
|
25
|
+
</>;
|
|
26
|
+
}
|
|
27
|
+
}`,...x.parameters?.docs?.source}}},S.parameters={...S.parameters,docs:{...S.parameters?.docs,source:{originalSource:`{
|
|
28
|
+
render: () => {
|
|
29
|
+
const [value, setValue] = useState<SliderRangeValue>([null, 12]);
|
|
30
|
+
return <>
|
|
31
|
+
<SliderRangeInput label="Срок в месяцах" description="У крайних marks \`outputValue:null\`; у обычных marks outputValue не указан и берётся \`value\`." min={0} max={25} marks={openMonthMarks} marksPosition="index" value={value} onChange={setValue} />
|
|
32
|
+
<RangePreview value={value} field="months" unit=" мес." />
|
|
33
|
+
</>;
|
|
34
|
+
}
|
|
35
|
+
}`,...S.parameters?.docs?.source}}},C.parameters={...C.parameters,docs:{...C.parameters?.docs,source:{originalSource:`{
|
|
36
|
+
render: () => {
|
|
37
|
+
const [value, setValue] = useState<SliderRangeValue>([90, 360]);
|
|
38
|
+
return <>
|
|
39
|
+
<SliderRangeInput label="Срок: месяцы на шкале, дни в фильтре" description="В поле и фильтре видны дни, а popover показывает месячные marks." min={1} max={24} marks={monthToDayMarks} marksPosition="index" value={value} onChange={setValue} />
|
|
40
|
+
<RangePreview value={value} field="days" unit=" дн." />
|
|
41
|
+
</>;
|
|
42
|
+
}
|
|
43
|
+
}`,...C.parameters?.docs?.source}}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
|
|
44
|
+
render: () => {
|
|
45
|
+
const [value, setValue] = useState<SliderRangeValue>([null, 720]);
|
|
46
|
+
return <>
|
|
47
|
+
<SliderRangeInput label="Срок: открытые границы и дни в фильтре" description="Крайние marks отдают null, обычные marks отдают дни через \`outputValue\`." min={0} max={25} marks={openMonthToDayMarks} marksPosition="index" value={value} onChange={setValue} />
|
|
48
|
+
<RangePreview value={value} field="days" unit=" дн." />
|
|
49
|
+
</>;
|
|
50
|
+
}
|
|
51
|
+
}`,...w.parameters?.docs?.source}}},T.parameters={...T.parameters,docs:{...T.parameters?.docs,source:{originalSource:`{
|
|
52
|
+
render: () => {
|
|
53
|
+
const [value, setValue] = useState<SliderRangeValue>([90, 180]);
|
|
54
|
+
return <>
|
|
55
|
+
<SliderRangeInput label="Срок текстом" description="В поле выводится готовый текст по marks, а изменение через popover коммитится при закрытии." min={0} max={25} marks={openMonthToDayMarks} marksPosition="index" value={value} onChange={setValue} readonlyValueText placeholder="Любой срок" />
|
|
56
|
+
<RangePreview value={value} field="days" unit=" дн." />
|
|
57
|
+
</>;
|
|
58
|
+
}
|
|
59
|
+
}`,...T.parameters?.docs?.source}}},E.parameters={...E.parameters,docs:{...E.parameters?.docs,source:{originalSource:`{
|
|
60
|
+
args: {
|
|
61
|
+
label: "Недоступно",
|
|
62
|
+
description: "Поле и popover отключены.",
|
|
63
|
+
value: 20,
|
|
64
|
+
disabled: true,
|
|
65
|
+
marks: percentMarks
|
|
66
|
+
}
|
|
67
|
+
}`,...E.parameters?.docs?.source}}},D=[`Basic`,`MarksSnap`,`DecimalManualInput`,`RangeInputPlain`,`RangeInputOpenWithoutExplicitMiddleOutput`,`RangeInputMonthToDaysOutput`,`RangeInputOpenMonthToDaysOutput`,`RangeInputReadonlyText`,`Disabled`]})))()}export{C as a,x as c,O as d,y as i,T as l,b as n,w as o,E as r,S as s,v as t,l as u};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,c as m,i as h,n as g,o as _,r as v,s as y,t as b}from"./Sortable.stories-BFsQvwMx.js";function x(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(s,{of:y,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,C.jsx)(u,{children:`Sortable`}),`
|
|
3
3
|
`,(0,C.jsxs)(o,{children:[`Headless-набор для сортируемых коллекций на базе `,(0,C.jsx)(t.code,{children:`dnd-kit`}),` с поддержкой list, horizontal и grid-layout`]}),`
|
|
4
4
|
`,(0,C.jsxs)(t.p,{children:[(0,C.jsx)(t.code,{children:`Sortable`}),` не навязывает визуальный вид элементов и используется как композиционный слой поверх `,(0,C.jsx)(t.code,{children:`dnd-kit`}),`.
|
package/storybook-static/assets/{Sortable.stories-yz3c5EhY.js → Sortable.stories-BFsQvwMx.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{i as r,n as i,r as a,t as o}from"./sortable-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{i as r,n as i,r as a,t as o}from"./sortable-CrCQ3H1V.js";import{n as s}from"./iframe-BHhbrImE.js";var c=t({Basic:()=>y,DisabledItems:()=>S,GridCards:()=>x,HandleOnly:()=>C,HorizontalList:()=>b,NestedContainers:()=>w,SortablePreview:()=>d,__namedExportsOrder:()=>T,default:()=>v});function l(e,t,n){let r=[...e],[i]=r.splice(t,1);return r.splice(n,0,i),r}function u(e){switch(e){case`horizontal`:return{display:`flex`,gap:`var(--space-sm)`,overflowX:`auto`};case`grid`:return{display:`grid`,gap:`var(--space-sm)`,gridTemplateColumns:`repeat(auto-fill, minmax(12rem, 1fr))`};default:return{display:`grid`,gap:`var(--space-sm)`}}}function d(e){let[t,n]=(0,f.useState)(e.initialItems),r=new Set(e.disabledIds??[]);return(0,p.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,p.jsx)(o.Root,{onDragEnd:r=>{let i=a({event:r,items:{[e.containerId]:t}});i&&n(e=>l(e,i.fromIndex,i.toIndex))},children:(0,p.jsx)(o.Container,{containerId:e.containerId,items:t,layout:e.layout,children:(0,p.jsx)(`div`,{style:u(e.layout),children:t.map(t=>(0,p.jsxs)(o.Item,{id:t,disabled:r.has(t),style:{...m,minWidth:e.itemWidth},children:[(0,p.jsx)(o.DragHandle,{title:`Перетащить ${t}`}),(0,p.jsx)(`div`,{children:t})]},t))})})}),(0,p.jsx)(`div`,{style:{fontSize:14,opacity:.8},children:`Порядок элементов изменяется локально в рамках story.`})]})}var f,p,m,h,g,_,v,y,b,x,S,C,w,T;function E(){return(E=e((()=>{f=n(),i(),r(),p=s(),m={display:`grid`,gridTemplateColumns:`var(--control-height) 1fr`,alignItems:`center`,gap:`var(--space-sm)`,padding:`var(--space-sm)`,border:`var(--border)`,borderRadius:`var(--radius-sm)`,background:`var(--surface-0)`},h=[`Alpha`,`Bravo`,`Charlie`,`Delta`],g=[`Фильтры`,`Графики`,`Сводка`,`История`],_=[`Карточка 1`,`Карточка 2`,`Карточка 3`,`Карточка 4`,`Карточка 5`,`Карточка 6`],v={title:`Shared/UI/Sortable`,component:d,args:{containerId:`sortable-demo`,layout:`vertical`,initialItems:h,itemWidth:void 0,disabledIds:[]},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{containerId:{description:"Идентификатор `SortableContext`, который используется для вычисления reorder внутри контейнера.",control:`text`},layout:{description:`Режим раскладки и стратегия сортировки: вертикальный список, горизонтальный список или grid.`,control:`inline-radio`,options:[`vertical`,`horizontal`,`grid`]},initialItems:{description:`Начальный набор элементов. Внутри story состояние управляется локально.`,control:!1},itemWidth:{description:`Минимальная ширина карточки; полезна для горизонтального режима.`,control:`text`},disabledIds:{description:`Список id, для которых drag-handle отключен.`,control:!1}}},y={},b={args:{containerId:`sortable-horizontal`,layout:`horizontal`,initialItems:g,itemWidth:`12rem`}},x={args:{containerId:`sortable-grid`,layout:`grid`,initialItems:_}},S={args:{containerId:`sortable-disabled`,layout:`vertical`,initialItems:h,disabledIds:[`Bravo`,`Delta`]}},C={args:{containerId:`sortable-handle-only`,layout:`vertical`,initialItems:[`Пункт 1`,`Пункт 2`,`Пункт 3`,`Пункт 4`]}},w={args:{containerId:`top`,layout:`vertical`,initialItems:[`Группа A`,`Группа B`]},render:()=>{let[e,t]=(0,f.useState)([`Группа A`,`Группа B`]),[n,r]=(0,f.useState)({"Группа A":[`A.1`,`A.2`,`A.3`],"Группа B":[`B.1`,`B.2`]});return(0,p.jsxs)(`div`,{style:{display:`grid`,gap:12},children:[(0,p.jsx)(o.Root,{onDragEnd:i=>{let o=a({event:i,items:{top:e,...Object.fromEntries(e.map(e=>[`parent:${e}`,n[e]??[]]))}});if(!o)return;if(o.containerId===`top`){t(e=>l(e,o.fromIndex,o.toIndex));return}let s=String(o.containerId).slice(7);r(e=>({...e,[s]:l(e[s]??[],o.fromIndex,o.toIndex)}))},children:(0,p.jsx)(o.Container,{containerId:`top`,items:e,children:(0,p.jsx)(`div`,{style:{display:`grid`,gap:`var(--space-md)`},children:e.map(e=>(0,p.jsxs)(o.Item,{id:e,style:{...m,gridTemplateColumns:`var(--control-height) 1fr`,alignItems:`start`},children:[(0,p.jsx)(o.DragHandle,{title:`Перетащить ${e}`}),(0,p.jsxs)(`div`,{style:{display:`grid`,gap:`var(--space-sm)`},children:[(0,p.jsx)(`strong`,{children:e}),(0,p.jsx)(o.Container,{containerId:`parent:${e}`,items:n[e]??[],children:(0,p.jsx)(`div`,{style:{display:`grid`,gap:`var(--space-xs)`},children:(n[e]??[]).map(e=>(0,p.jsxs)(o.Item,{id:e,style:{...m,background:`var(--surface-1)`},children:[(0,p.jsx)(o.DragHandle,{title:`Перетащить ${e}`}),(0,p.jsx)(`div`,{children:e})]},e))})})]})]},e))})})}),(0,p.jsx)(`div`,{style:{fontSize:14,opacity:.8},children:"Вложенные контейнеры сортируются независимо и используют общий `Sortable.Root`."})]})}},d.__docgenInfo={description:``,methods:[],displayName:`SortablePreview`,props:{containerId:{required:!0,tsType:{name:`string`},description:``},layout:{required:!0,tsType:{name:`union`,raw:`"vertical" | "horizontal" | "grid"`,elements:[{name:`literal`,value:`"vertical"`},{name:`literal`,value:`"horizontal"`},{name:`literal`,value:`"grid"`}]},description:``},initialItems:{required:!0,tsType:{name:`Array`,elements:[{name:`string`}],raw:`string[]`},description:``},itemWidth:{required:!1,tsType:{name:`string`},description:``},disabledIds:{required:!1,tsType:{name:`Array`,elements:[{name:`string`}],raw:`string[]`},description:``}}},d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`function SortablePreview(props: SortablePreviewProps) {
|
|
2
2
|
const [items, setItems] = useState(props.initialItems);
|
|
3
3
|
const disabledIdSet = new Set(props.disabledIds ?? []);
|
|
4
4
|
return <div style={{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,i as m,n as h,o as g,r as _,t as v}from"./Splitter.stories-DZ3nAxpo.js";function y(e){let t={code:`code`,h2:`h2`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(s,{of:p,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(u,{children:`Splitter`}),`
|
|
3
3
|
`,(0,x.jsx)(o,{children:(0,x.jsx)(t.p,{children:`Компонент для интерактивного разделения рабочей области на две панели с поддержкой вложенности, клавиатуры и ограничений по размеру`})}),`
|
|
4
4
|
`,(0,x.jsxs)(t.p,{children:[(0,x.jsx)(t.code,{children:`Splitter`}),` подходит для интерфейсов, где пользователь должен самостоятельно перераспределять пространство между соседними областями: навигацией и контентом, таблицей и деталями, превью и журналом событий.`]}),`
|
package/storybook-static/assets/{Splitter.stories-CopPw1_p.js → Splitter.stories-DZ3nAxpo.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-BHhbrImE.js";import{a as i,i as a}from"./utils-DUM89eIj.js";var o,s,c,l,u,d,f;function p(){return(p=e((()=>{o=`wAovST`,s=`QVVMwe`,c=`H43AJ8`,l=`pgo8sW`,u=`_8fCvqA`,d=`t6RFcI`,f={splitter:o,vertical:s,separator:c,horizontal:l,topLeft:u,bottomRight:d}})))()}function m(e,t,n){return Math.min(n,Math.max(t,e))}function h(e,t){return Number.isFinite(e)?m(e,0,1):t}function g(e,t){let n=h(e,E),r=h(t,D);return n<=r?[n,r]:[r,n]}function _(e,t){return e===`vertical`?t.clientX:t.clientY}function v(e,t){return e===`vertical`?t.width:t.height}function y(e,t){if(e===`vertical`){if(t===`ArrowLeft`)return-.02;if(t===`ArrowRight`)return k}if(e===`horizontal`){if(t===`ArrowUp`)return-.02;if(t===`ArrowDown`)return k}return null}function b(e,t){return t===`start`?0:t===`end`?1:e}function x({direction:e,initial:t,min:n,max:r,collapsedPane:i}){let[a,o]=g(n,r),s=(0,w.useRef)(null),c=(0,w.useRef)(null),l=(0,w.useRef)(null),u=(0,w.useRef)(null),d=(0,w.useRef)(null),f=(0,w.useRef)(null),p=(0,w.useRef)(0),x=(0,w.useRef)(m(h(t,O),a,o)),S=(0,w.useRef)(t),[C,T]=(0,w.useState)(()=>m(h(t,O),a,o)),E=(0,w.useRef)(C),D=(0,w.useCallback)(e=>{E.current=e,c.current?.style.setProperty(`flex-basis`,`${b(e,i)*100}%`),l.current?.setAttribute(`aria-valuenow`,`${Math.round(e*100)}`)},[i]),k=()=>{if(f.current!==null&&(cancelAnimationFrame(f.current),f.current=null),d.current===null)return E.current;let e=d.current;return d.current=null,D(e),e},A=e=>{d.current=e,f.current===null&&(f.current=requestAnimationFrame(()=>{f.current=null,d.current!==null&&D(d.current)}))},j=()=>{u.current?.(),u.current=null},M=e=>{k(),T(m(e,a,o))};return(0,w.useLayoutEffect)(()=>{D(C)},[D,C]),(0,w.useEffect)(()=>{T(e=>{let n=S.current!==t;return S.current=t,m(n?h(t,O):e,a,o)})},[t,a,o]),(0,w.useEffect)(()=>()=>{j(),f.current!==null&&cancelAnimationFrame(f.current)},[]),{containerRef:s,topLeftRef:c,separatorRef:l,ratio:C,minRatio:a,maxRatio:o,handleSeparatorPointerDown:t=>{if(t.button!==0)return;t.preventDefault();let n=s.current;if(!n)return;j();try{t.currentTarget.setPointerCapture?.(t.pointerId)}catch{}p.current=_(e,t),x.current=E.current;let r=t=>{let r=v(e,n.getBoundingClientRect());if(r<=0)return;let i=_(e,t)-p.current,s=m(x.current+i/r,a,o);A(s)},i=()=>{j(),T(k())};u.current=()=>{document.removeEventListener(`pointermove`,r),document.removeEventListener(`pointerup`,i),document.removeEventListener(`pointercancel`,i)},document.addEventListener(`pointermove`,r),document.addEventListener(`pointerup`,i),document.addEventListener(`pointercancel`,i)},handleSeparatorKeyDown:t=>{let n=y(e,t.key);if(n!==null){t.preventDefault(),M(E.current+n);return}if(t.key===`Home`){t.preventDefault(),M(a);return}t.key===`End`&&(t.preventDefault(),M(o))}}}function S({className:e,direction:t,left:n,right:r,collapsedPane:a,logic:o}){let{containerRef:s,topLeftRef:c,separatorRef:l,ratio:u,minRatio:d,maxRatio:p,handleSeparatorPointerDown:m,handleSeparatorKeyDown:h}=o,g=b(u,a),_=a===`start`,v=a===`end`,y=a===null;return(0,T.jsxs)(`div`,{ref:s,className:i(f.splitter,f[t],e),children:[(0,T.jsx)(`div`,{ref:c,className:f.topLeft,style:{flexBasis:`${g*100}%`},hidden:_,children:n}),(0,T.jsx)(`div`,{ref:l,hidden:!y,role:`separator`,"aria-orientation":t===`vertical`?`vertical`:`horizontal`,"aria-valuemin":Math.round(d*100),"aria-valuemax":Math.round(p*100),"aria-valuenow":Math.round(u*100),tabIndex:y?0:-1,onPointerDown:m,onKeyDown:h,className:f.separator}),(0,T.jsx)(`div`,{className:f.bottomRight,hidden:v,children:r})]})}function C({direction:e=`vertical`,initial:t=O,min:n=E,max:r=D,className:i,collapsedPane:a=null,children:o}){let[s,c]=w.Children.toArray(o),l=x({direction:e,initial:t,min:n,max:r,collapsedPane:a});return c?(0,T.jsx)(S,{className:i,direction:e,left:s,right:c,collapsedPane:a,logic:l}):s}var w,T,E,D,O,k;function A(){return(A=e((()=>{w=n(),a(),p(),T=r(),E=.1,D=.9,O=.7,k=.02,C.__docgenInfo={description:``,methods:[],displayName:`Splitter`,props:{direction:{defaultValue:{value:`"vertical"`,computed:!1},required:!1},initial:{defaultValue:{value:`0.7`,computed:!1},required:!1},min:{defaultValue:{value:`0.1`,computed:!1},required:!1},max:{defaultValue:{value:`0.9`,computed:!1},required:!1},collapsedPane:{defaultValue:{value:`null`,computed:!1},required:!1}}}})))()}var j=t({Basic:()=>z,Constrained:()=>H,Horizontal:()=>B,NestedFourPanels:()=>V,__namedExportsOrder:()=>U,default:()=>R});function M({children:e}){return(0,L.jsx)(`div`,{style:{height:490},children:e})}function N({title:e,description:t,items:n=[]}){return(0,L.jsxs)(`div`,{style:{height:`100%`,padding:`var(--space-md)`,borderRadius:`var(--radius-md)`,border:`var(--border)`,display:`grid`,alignContent:`start`,gap:`var(--space-md)`},className:`scrollable`,children:[(0,L.jsxs)(`div`,{children:[(0,L.jsx)(`h2`,{children:e}),(0,L.jsx)(`p`,{children:t})]}),n.length>0&&(0,L.jsx)(`div`,{style:{display:`grid`,gap:`var(--space-sm)`},children:n.map(e=>(0,L.jsx)(`div`,{style:{padding:`var(--space-sm) var(--space-md)`,borderRadius:`var(--radius-sm)`,background:`var(--surface-1)`},children:e},e))})]})}function P(e){return(0,L.jsx)(M,{children:(0,L.jsxs)(C,{...e,children:[(0,L.jsx)(N,{title:`Навигация`,description:`Левая панель подходит для фильтров, дерева разделов, списка сущностей или структуры документа.`,items:[`Раздел 1`,`Раздел 2`,`Раздел 3`,`Раздел 4`]}),(0,L.jsx)(N,{title:`Рабочая область`,description:`Правая панель обычно содержит детальный контент: таблицу, карточку объекта, форму или вкладки.`,items:[`Текущий документ`,`История изменений`,`Комментарии`,`Связанные объекты`,`Параметры отображения`]})]})})}function F(){return(0,L.jsx)(M,{children:(0,L.jsxs)(C,{initial:.48,min:.25,max:.75,children:[(0,L.jsxs)(C,{direction:`horizontal`,initial:.58,min:.25,max:.75,children:[(0,L.jsx)(N,{title:`Список`,description:`Верхняя левая панель может держать навигацию или результат поиска.`,items:[`Поиск`,`Фильтр по статусу`,`Группы`,`Быстрые действия`]}),(0,L.jsx)(N,{title:`Подробности`,description:`Нижняя левая панель подходит для связанного контента по выбранному элементу.`,items:[`Свойства`,`Ответственный`,`Теги`,`Контекст`]})]}),(0,L.jsxs)(C,{direction:`horizontal`,initial:.36,min:.2,max:.8,children:[(0,L.jsx)(N,{title:`Превью`,description:`Верхняя правая панель может содержать документ, схему, карту или live-просмотр.`,items:[`Предпросмотр файла`,`Масштаб 100%`,`Слой подсветки`]}),(0,L.jsx)(N,{title:`Журнал`,description:`Нижняя правая панель часто используется для событий, логов или вспомогательных данных.`,items:[`10:31 Импорт завершён`,`10:34 Индексация`,`10:36 Синхронизация`,`10:38 Проверка целостности`]})]})]})})}function I(e){return(0,L.jsx)(M,{children:(0,L.jsxs)(C,{...e,children:[(0,L.jsx)(N,{title:`Фиксированные ограничения`,description:"У этой панели ужаты границы `min` и `max`, поэтому splitter нельзя увести слишком далеко.",items:[`Нажмите на разделитель`,`Используйте стрелки`,`Home = минимум`,`End = максимум`]}),(0,L.jsx)(N,{title:`Проверка доступности`,description:`Сценарий помогает проверить клавиатурное управление, устойчивость границ и отсутствие рывков при drag.`,items:[`ArrowLeft / ArrowRight`,`ArrowUp / ArrowDown`,`Перетаскивание мышью`,`Перетаскивание на тач-устройстве`]})]})})}var L,R,z,B,V,H,U;function W(){return(W=e((()=>{A(),L=r(),R={title:`Shared/UI/Splitter`,component:C,parameters:{atomicCanvas:!0,layout:`padded`},args:{direction:`vertical`,initial:.45,min:.15,max:.85},argTypes:{direction:{description:`Направление разделения: вертикальное по ширине или горизонтальное по высоте.`,control:`inline-radio`,options:[`vertical`,`horizontal`]},initial:{description:`Начальная доля первой панели в диапазоне от 0 до 1.`,control:{type:`range`,min:0,max:1,step:.01}},min:{description:`Минимальная доля первой панели. Значение автоматически нормализуется в диапазон 0..1.`,control:{type:`range`,min:0,max:1,step:.01}},max:{description:"Максимальная доля первой панели. Если `min` и `max` перепутаны местами, компонент сам исправит диапазон.",control:{type:`range`,min:0,max:1,step:.01}},className:{description:`Дополнительный CSS-класс корневого контейнера.`,control:`text`},children:{description:`Splitter ожидает ровно два прямых дочерних элемента. Для большего количества областей используйте вложенные Splitter.`,control:!1}}},z={name:`Две панели`,render:e=>(0,L.jsx)(P,{...e})},B={name:`Горизонтальное разделение`,render:e=>(0,L.jsx)(P,{...e}),args:{direction:`horizontal`,initial:.55}},V={name:`Четыре панели через вложенность`,render:()=>(0,L.jsx)(F,{})},H={name:`Ограничения и клавиатура`,render:e=>(0,L.jsx)(I,{...e}),args:{initial:.35,min:.25,max:.55}},z.parameters={...z.parameters,docs:{...z.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
name: "Две панели",
|
|
3
3
|
render: args => <TwoPaneLayout {...args} />
|
|
4
4
|
}`,...z.parameters?.docs?.source}}},B.parameters={...B.parameters,docs:{...B.parameters?.docs,source:{originalSource:`{
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n}from"./iframe-BHhbrImE.js";import{a as r,i}from"./utils-DUM89eIj.js";import{d as a,l as o,y as s}from"./formatters-CVj-3Vn0-C5-BLq9O.js";import{n as c,t as l}from"./Select-g0c0XGQY.js";var u,d,f,p,m,h,g,_,v,y,b,x;function S(){return(S=e((()=>{u=`p4nQdZ`,d=`_94tg5v`,f=`HyK7Zs`,p=`Mm4hrB`,m=`clxxBQ`,h=`_5pJ7o-`,g=`VV6hKN`,_=`cuQNP0`,v=`w7nIOT`,y=`ed-Afj`,b=`Lbxloe`,x={button:u,valueContainer:d,swatch:f,optionsPalette:p,optionsDetailed:m,option:h,optionPalette:g,optionDetailed:_,optionMeta:v,optionMetaIcon:y,optionMetaLabel:b}})))()}function C({state:e,className:t}){return(0,A.jsx)(`span`,{className:r(x.swatch,t),"data-empty":e===`none`?``:void 0,style:{"--state-color":a[e]}})}function w(e){return!!(e?.icon||e?.label)}function T(e,t){return typeof t?.label==`string`&&t.label.trim()?t.label:e||`empty`}function E(e){return w(e)?(0,A.jsxs)(`span`,{className:x.optionMeta,children:[e?.icon?(0,A.jsx)(`span`,{className:x.optionMetaIcon,children:e.icon}):null,e?.label?(0,A.jsx)(`span`,{className:x.optionMetaLabel,children:e.label}):null]}):null}function D(e,t){return(0,A.jsxs)(`div`,{className:x.valueContainer,children:[(0,A.jsx)(C,{state:e}),E(t)]})}function O({label:e,description:t,disabled:n,placeholder:i,size:a,value:s,onChange:c,options:u=o,stateMeta:d,className:f,clearable:p}){let m=(0,k.useMemo)(()=>Array.from(new Set(u)),[u]),h=m.some(e=>w(d?.[e])),g={getOptionKey:e=>e||`__empty_state__`,getOptionLabel:e=>d?.[e]?.label??e,getOptionAriaLabel:e=>T(e,d?.[e]),renderValue:e=>D(e,d?.[e]),renderOption:e=>(0,A.jsxs)(A.Fragment,{children:[(0,A.jsx)(C,{state:e}),h?E(d?.[e]):null]}),buttonClassName:x.button,optionsContentClassName:r(h?x.optionsDetailed:x.optionsPalette),getOptionClassName:()=>r(x.option,h?x.optionDetailed:x.optionPalette)};return(0,A.jsx)(l,{label:e,description:t,disabled:n,placeholder:i,size:a,value:s,onChange:c,options:m,className:f,clearable:p,...g})}var k,A;function j(){return(j=e((()=>{k=t(),s(),i(),c(),S(),A=n(),O.__docgenInfo={description:`Специализированный селект для выбора цветового или статусного состояния. Используется там, где значению соответствует визуальный swatch.`,methods:[],displayName:`StateSelect`,props:{placeholder:{required:!1,tsType:{name:`string`},description:``},options:{required:!1,tsType:{name:`unknown`},description:``,defaultValue:{value:`DEFAULT_VALUE_STATES`,computed:!0}},stateMeta:{required:!1,tsType:{name:`Partial`,elements:[{name:`Record`,elements:[{name:`State`},{name:`signature`,type:`object`,raw:`{
|
|
2
|
+
label?: ReactNode;
|
|
3
|
+
icon?: ReactNode;
|
|
4
|
+
}`,signature:{properties:[{key:`label`,value:{name:`ReactNode`,required:!1}},{key:`icon`,value:{name:`ReactNode`,required:!1}}]}}],raw:`Record<State, StateMeta>`}],raw:`Partial<Record<State, StateMeta>>`},description:``},className:{required:!1,tsType:{name:`string`},description:``},clearable:{required:!1,tsType:{name:`boolean`},description:``}},composes:[`Omit`]}})))()}export{j as n,O as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,i as m,n as h,r as g,t as _}from"./StateSelect.stories-Bj-2m2hS.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:`StateSelect`}),`
|
|
3
3
|
`,(0,b.jsx)(o,{children:`Специализированный select для выбора визуального статуса или семантического состояния`}),`
|
|
4
4
|
`,(0,b.jsx)(t.p,{children:`StateSelect уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r,t as i}from"./circle-check-DODquDnH.js";import{i as a,n as o,r as s,t as c}from"./info-DSZ4aUvi.js";import{n as l,t as u}from"./triangle-alert-D9YGTafY.js";import{i as d,n as f,r as p}from"./iframe-BHhbrImE.js";import{n as m,t as h}from"./StateSelect-IigEzRom.js";var g,_;function v(){return(v=e((()=>{d(),g=[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`M8 12h8`,key:`1wcyev`}]],_=p(`circle-minus`,g)})))()}var y=t({Controlled:()=>C,PaletteOnly:()=>T,WithMeta:()=>w,__namedExportsOrder:()=>E,default:()=>S}),b,x,S,C,w,T,E;function D(){return(D=e((()=>{b=n(),l(),r(),o(),v(),a(),m(),x=f(),S={title:`Shared/UI/StateSelect`,component:h,args:{label:`Состояние`,description:`Выберите визуальный статус.`,placeholder:`Выберите значение`,value:`information`,onChange:()=>{},disabled:!1,size:`md`},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок поля выбора состояния.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},placeholder:{description:`Текст, когда значение не выбрано.`,control:`text`},value:{description:`Текущее состояние.`,control:`select`,options:[``,`none`,`information`,`success`,`warning`,`error`]},onChange:{description:`Вызывается при выборе состояния.`,control:!1},options:{description:`Кастомный набор доступных состояний.`,control:!1},stateMeta:{description:`Кастомные иконки и подписи для значений.`,control:!1},disabled:{description:`Блокирует взаимодействие с полем.`,control:`boolean`},size:{description:`Размер поля и подписей.`,control:`select`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},className:{description:`Дополнительный CSS-класс.`,control:`text`}}},C={render:e=>{let[t,n]=(0,b.useState)(`information`);return(0,x.jsx)(h,{...e,value:t,onChange:n})}},w={render:e=>{let[t,n]=(0,b.useState)(`warning`);return(0,x.jsx)(h,{...e,value:t,onChange:n,stateMeta:{none:{label:`Без статуса`,icon:(0,x.jsx)(_,{})},information:{label:`Инфо`,icon:(0,x.jsx)(c,{})},success:{label:`Успех`,icon:(0,x.jsx)(i,{})},warning:{label:`Предупреждение`,icon:(0,x.jsx)(u,{})},error:{label:`Ошибка`,icon:(0,x.jsx)(s,{})}}})},args:{value:`warning`}},T={render:e=>{let[t,n]=(0,b.useState)(`none`);return(0,x.jsx)(h,{...e,value:t,onChange:n,options:[`none`,`success`,`error`]})},args:{options:[`none`,`success`,`error`],value:`none`}},C.parameters={...C.parameters,docs:{...C.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
render: args => {
|
|
3
|
+
const [value, setValue] = useState<State | undefined>("information");
|
|
4
|
+
return <StateSelect {...args} value={value} onChange={setValue} />;
|
|
5
|
+
}
|
|
6
|
+
}`,...C.parameters?.docs?.source}}},w.parameters={...w.parameters,docs:{...w.parameters?.docs,source:{originalSource:`{
|
|
7
|
+
render: args => {
|
|
8
|
+
const [value, setValue] = useState<State | undefined>("warning");
|
|
9
|
+
return <StateSelect {...args} value={value} onChange={setValue} stateMeta={{
|
|
10
|
+
none: {
|
|
11
|
+
label: "Без статуса",
|
|
12
|
+
icon: <MinusCircleIcon />
|
|
13
|
+
},
|
|
14
|
+
information: {
|
|
15
|
+
label: "Инфо",
|
|
16
|
+
icon: <InfoIcon />
|
|
17
|
+
},
|
|
18
|
+
success: {
|
|
19
|
+
label: "Успех",
|
|
20
|
+
icon: <CheckCircle2Icon />
|
|
21
|
+
},
|
|
22
|
+
warning: {
|
|
23
|
+
label: "Предупреждение",
|
|
24
|
+
icon: <AlertTriangleIcon />
|
|
25
|
+
},
|
|
26
|
+
error: {
|
|
27
|
+
label: "Ошибка",
|
|
28
|
+
icon: <XCircleIcon />
|
|
29
|
+
}
|
|
30
|
+
}} />;
|
|
31
|
+
},
|
|
32
|
+
args: {
|
|
33
|
+
value: "warning"
|
|
34
|
+
}
|
|
35
|
+
}`,...w.parameters?.docs?.source}}},T.parameters={...T.parameters,docs:{...T.parameters?.docs,source:{originalSource:`{
|
|
36
|
+
render: args => {
|
|
37
|
+
const [value, setValue] = useState<State | undefined>("none");
|
|
38
|
+
return <StateSelect {...args} value={value} onChange={setValue} options={["none", "success", "error"]} />;
|
|
39
|
+
},
|
|
40
|
+
args: {
|
|
41
|
+
options: ["none", "success", "error"],
|
|
42
|
+
value: "none"
|
|
43
|
+
}
|
|
44
|
+
}`,...T.parameters?.docs?.source}}},E=[`Controlled`,`WithMeta`,`PaletteOnly`]})))()}export{D as a,w as i,T as n,y as r,C as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n}from"./iframe-BHhbrImE.js";import{n as r,t as i}from"./Toggle-CdpPJI_O.js";function a(e,t){return typeof e==`string`?e:t}var o,s;function c(){return(c=e((()=>{o=`true`,s=`false`})))()}function l({value:e,onChange:t,checkedValue:n,uncheckedValue:r,defaultChecked:c,...l}){let d=a(n,o),f=a(r,s),p=e===d;return(0,u.jsx)(i,{...l,value:p,onChange:e=>t(e?d:f)})}var u;function d(){return(d=e((()=>{c(),r(),u=n(),l.__docgenInfo={description:`Адаптирует boolean-состояние Toggle к паре настраиваемых строковых значений.`,methods:[],displayName:`StringToggle`,props:{checkedValue:{required:!1,tsType:{name:`string`},description:``},uncheckedValue:{required:!1,tsType:{name:`string`},description:``},value:{required:!0,tsType:{name:`string`},description:``},onChange:{required:!0,tsType:{name:`signature`,type:`function`,raw:`(value: string) => void`,signature:{arguments:[{type:{name:`string`},name:`value`}],return:{name:`void`}}},description:``}}}})))()}var f,p,m,h,g;function _(){return(_=e((()=>{f=t(),d(),p=n(),m={title:`Shared/UI/Toggle/StringToggle`,component:l,args:{value:`ZBP_MANAGER`,onChange:()=>void 0,checkedText:`за клиента`,uncheckedText:`за сделку`,checkedValue:`ZM_MANAGER`,uncheckedValue:`ZBP_MANAGER`},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{value:{description:`Текущее строковое значение.`,control:!1},onChange:{description:`Возвращает строку выбранного состояния.`,control:!1},checkedValue:{description:`Значение включённого состояния.`,control:`text`},uncheckedValue:{description:`Значение выключенного состояния.`,control:`text`},checkedText:{description:`Текст включённого состояния.`,control:`text`},uncheckedText:{description:`Текст выключенного состояния.`,control:`text`}}},h={render:e=>{let[t,n]=(0,f.useState)(e.value);return(0,p.jsx)(l,{...e,value:t,onChange:n})}},h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: args => {
|
|
3
3
|
const [value, setValue] = useState<string>(args.value);
|
|
4
4
|
return <StringToggle {...args} value={value} onChange={setValue} />;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{a as p,i as m,n as h,r as g,t as _}from"./Switch.stories-CQ3ueThx.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:`Switch`}),`
|
|
3
3
|
`,(0,b.jsx)(o,{children:`Переключатель в виде слайдера для быстрых включений, отключений и tri-state сценариев`}),`
|
|
4
4
|
`,(0,b.jsx)(t.p,{children:`Switch уже имеет живые stories, а эта страница собирает их в структурированную документацию с краткими рекомендациями, примерами подключения и API.
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{n as e,o as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r,t as i}from"./circle-check-DODquDnH.js";import{i as a,n as o,r as s}from"./iframe-BHhbrImE.js";import{a as c,i as l}from"./utils-DUM89eIj.js";import{n as u,t as d}from"./ui.module-kfCm3RIG.js";var f,p;function m(){return(m=e((()=>{a(),f=[[`circle`,{cx:`12`,cy:`12`,r:`10`,key:`1mglay`}],[`path`,{d:`M4.929 4.929 19.07 19.071`,key:`196cmz`}]],p=s(`ban`,f)})))()}var h,g,_,v,y;function b(){return(b=e((()=>{h=`Or5LYA`,g=`w0AMfA`,_=`P1x4lq`,v=`-ZVOZo`,y={switchWrapper:h,switch:`qge3io`,iconWrapper:g,auto:_,checked:v}})))()}function x(e){let{label:t,description:n,disabled:r,checkedIcon:a=(0,C.jsx)(i,{}),uncheckedIcon:o=(0,C.jsx)(p,{}),className:s,type:l,id:d,size:f,placeholder:m,onChange:h,value:g,triState:_,...v}=e,b=(0,S.useId)(),x=d??b,w=n?`${x}-description`:void 0,T=t?`${x}-label`:void 0,E=()=>{if(!e.triState){e.onChange(!e.value);return}if(e.value===void 0){e.onChange(!0);return}if(e.value===!0){e.onChange(!1);return}e.value===!1&&e.onChange(void 0)},D=typeof e.value==`boolean`&&e.value,O=e.triState&&typeof e.value!=`boolean`,k=v[`aria-label`]??(t?void 0:`Переключатель`);return(0,C.jsxs)(`div`,{className:c(u.uiElement,r&&u.disabled),"aria-disabled":r||void 0,children:[t&&(0,C.jsxs)(`div`,{id:T,className:u.uiLabel,children:[t,`:`]}),n&&(0,C.jsx)(`p`,{id:w,className:u.uiDescription,children:n}),(0,C.jsx)(`button`,{...v,id:x,type:l??`button`,role:`switch`,disabled:r,"aria-checked":D,"aria-describedby":w,"aria-labelledby":T,"aria-label":k,"aria-disabled":r,"data-ui":`switch`,"data-action":`toggle-switch`,onClick:E,className:c(u.uiInputControl,y.switchWrapper,s),children:(0,C.jsx)(`div`,{className:y.switch,"data-disabled":r||void 0,children:O?(0,C.jsx)(`div`,{className:c(y.iconWrapper,y.auto,y.checked),children:`Auto`}):(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(`div`,{className:c(y.iconWrapper,!e.value&&y.checked),children:o}),(0,C.jsx)(`div`,{className:c(y.iconWrapper,e.value&&y.checked),children:a})]})})})]})}var S,C;function w(){return(w=e((()=>{S=t(n(),1),l(),m(),r(),d(),b(),C=o(),x.__docgenInfo={description:`Переключатель boolean-состояния в виде слайдера. Подходит для быстрых настроек и включения/отключения опций.`,methods:[],displayName:`Switch`}})))()}export{w as n,x as t};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r,t as i}from"./Switch-C9OAPzUM.js";import{n as a}from"./iframe-BHhbrImE.js";var o=t({BiState:()=>u,Disabled:()=>f,TriState:()=>d,__namedExportsOrder:()=>p,default:()=>l}),s,c,l,u,d,f,p;function m(){return(m=e((()=>{s=n(),r(),c=a(),l={title:`Shared/UI/Switch`,component:i,args:{label:`Режим обработки`,description:`Переключение состояния`,value:!1,onChange:()=>{},triState:!1,disabled:!1},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{label:{description:`Заголовок переключателя.`,control:`text`},description:{description:`Описание под заголовком.`,control:`text`},value:{description:"Текущее значение (`boolean` или `undefined` в tri-state).",control:!1},onChange:{description:`Вызывается при изменении состояния.`,control:!1},triState:{description:"Включает трехсостоянный режим (`undefined → true → false`).",control:`boolean`},checkedIcon:{description:"Кастомная иконка для состояния `true`.",control:!1},uncheckedIcon:{description:"Кастомная иконка для состояния `false`.",control:!1},disabled:{description:`Блокирует переключение.`,control:`boolean`}}},u={render:e=>{let[t,n]=(0,s.useState)(!1);return(0,c.jsx)(i,{...e,value:t,onChange:n,triState:!1})}},d={render:e=>{let[t,n]=(0,s.useState)(void 0);return(0,c.jsxs)(`div`,{style:{display:`grid`,gap:8},children:[(0,c.jsx)(i,{...e,value:t,onChange:n,triState:!0}),(0,c.jsxs)(`div`,{children:[`Текущее значение: `,String(t)]})]})},args:{triState:!0,value:void 0}},f={args:{disabled:!0,value:!0}},u.parameters={...u.parameters,docs:{...u.parameters?.docs,source:{originalSource:`{
|
|
2
|
+
render: args => {
|
|
3
|
+
const [value, setValue] = useState(false);
|
|
4
|
+
return <Switch {...args} value={value} onChange={setValue} triState={false} />;
|
|
5
|
+
}
|
|
6
|
+
}`,...u.parameters?.docs?.source}}},d.parameters={...d.parameters,docs:{...d.parameters?.docs,source:{originalSource:`{
|
|
7
|
+
render: args => {
|
|
8
|
+
const [value, setValue] = useState<boolean | undefined>(undefined);
|
|
9
|
+
return <div style={{
|
|
10
|
+
display: "grid",
|
|
11
|
+
gap: 8
|
|
12
|
+
}}>
|
|
13
|
+
<Switch {...args} value={value} onChange={setValue} triState />
|
|
14
|
+
<div>Текущее значение: {String(value)}</div>
|
|
15
|
+
</div>;
|
|
16
|
+
},
|
|
17
|
+
args: {
|
|
18
|
+
triState: true,
|
|
19
|
+
value: undefined
|
|
20
|
+
}
|
|
21
|
+
}`,...d.parameters?.docs?.source}}},f.parameters={...f.parameters,docs:{...f.parameters?.docs,source:{originalSource:`{
|
|
22
|
+
args: {
|
|
23
|
+
disabled: true,
|
|
24
|
+
value: true
|
|
25
|
+
}
|
|
26
|
+
}`,...f.parameters?.docs?.source}}},p=[`BiState`,`TriState`,`Disabled`]})))()}export{m as a,d as i,f as n,o as r,u as t};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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-D8l_hmHU.js";import{_ as p,a as m,c as h,d as g,f as _,g as v,h as y,i as b,l as x,m as S,n as C,o as w,p as T,r as E,s as D,t as O,u as k}from"./Table.stories-DvaHP59R.js";function A(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,M.jsxs)(M.Fragment,{children:[(0,M.jsx)(s,{of:D,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,M.jsx)(u,{children:`Table`}),`
|
|
3
3
|
`,(0,M.jsxs)(o,{children:[`Плоская таблица как React-альтернатива `,(0,M.jsx)(t.code,{children:`sap.m.Table`})]}),`
|
|
4
4
|
`,(0,M.jsxs)(t.p,{children:[(0,M.jsx)(t.code,{children:`Table`}),` предназначен для плоских данных и по поведению осознанно сближен с `,(0,M.jsx)(t.code,{children:`TreeTable`}),`.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-
|
|
1
|
+
import{n as e,r as t}from"./rolldown-runtime-C0FnF6B9.js";import{t as n}from"./react-C21x__mS.js";import{n as r}from"./iframe-BHhbrImE.js";import{D as i,E as a,T as ee,c as te,l as ne,n as o,s as re,v as s,w as ie}from"./odata-DmijE2H9.js";import{i as ae,y as oe}from"./formatters-CVj-3Vn0-C5-BLq9O.js";import{S as se,_ as ce,a as le,b as ue,c as de,d as fe,f as pe,g as me,h as he,i as ge,l as _e,m as ve,n as ye,o as be,p as xe,r as Se,s as c,t as Ce,u as we,v as Te,x as Ee,y as De}from"./FormattedTableCell-fePg_bmP.js";var l,u,d;function f(){return(f=e((()=>{l=`hKghZt`,u=`QsLRvS`,d={selectedIndicatorCell:l,sentinel:u}})))()}function Oe(e,t){return String(t)}function p({title:e,isLoading:t,isFetching:n,data:r,columns:i,selectionMode:a=`none`,selectedRowIds:ee,getRowId:ne,className:o,minHeight:re,tableClassName:s,columnVisibility:ie,defaultColumnVisibility:oe,columnOrder:le,defaultColumnOrder:ue,columnSizing:fe,defaultColumnSizing:me,columnPinning:ge,defaultColumnPinning:_e,enableColumnResizing:ve=!1,enableColumnReordering:ye=!1,columnResizeMinWidth:c,onColumnVisibilityChange:De,onColumnOrderChange:l,onColumnSizingChange:u,onColumnPinningChange:f,onRowClick:p,onRowSelectionChange:g,onReachEnd:_,getRowCanSelect:v,getRowClassName:ke,renderHeaderContextMenu:Ae,renderCellContent:y}){let b=(0,m.useMemo)(()=>r??[],[r]),x=(0,m.useMemo)(()=>he(i),[i]),S=ne??Oe,C=(0,m.useMemo)(()=>new Map(b.map((e,t)=>[S(e,t),e])),[S,b]),w=(0,m.useMemo)(()=>Array.from(C.keys()),[C]),T=(0,m.useRef)(null),E=(0,m.useRef)(null),{rowSelection:D,activateRowSelection:O}=te({availableRowIds:w,rowById:C,selectionMode:a,selectedRowIds:ee,onRowSelectionChange:g}),{columnVisibility:k,onColumnVisibilityChange:A}=be({columnVisibility:ie,defaultColumnVisibility:oe,onColumnVisibilityChange:De}),{columnOrder:j,onColumnOrderChange:M}=pe({columnOrder:le,defaultColumnOrder:ue,onColumnOrderChange:l}),{columnSizing:N,onColumnSizingChange:je}=de({columnSizing:fe,defaultColumnSizing:me,columnResizeMinWidth:c,onColumnSizingChange:u}),{columnPinning:P,onColumnPinningChange:F}=we({columnPinning:ge,defaultColumnPinning:_e,onColumnPinningChange:f}),I=(0,m.useMemo)(()=>({columnOrder:j,columnPinning:P,columnSizing:N,columnVisibility:k}),[j,P,N,k]),L=(0,m.useEffectEvent)(()=>{_?.()});(0,m.useEffect)(()=>{if(!_||!T.current||!E.current||t)return;let e=new IntersectionObserver(e=>{e[0]?.isIntersecting&&L()},{root:T.current,threshold:.1});return e.observe(E.current),()=>e.disconnect()},[t,_,b.length]);let R=Ee({data:b,columns:i,state:{columnOrder:j,columnPinning:P,columnSizing:N,columnVisibility:k,rowSelection:D},onColumnOrderChange:M,onColumnPinningChange:F,onColumnSizingChange:je,onColumnVisibilityChange:A,getRowId:(e,t)=>S(e,t),getCoreRowModel:se(),enableMultiRowSelection:a===`multi`,enableRowSelection:e=>a===`none`?!1:!v||v(e.original)}),z=Te(R,I),B=R.getRowModel().rows,V=(0,m.useMemo)(()=>xe({rows:B,columns:z}),[B,z]),H=z[0]?.id;return(0,h.jsx)(Se,{table:R,columnState:I,title:e,isLoading:t,isFetching:n,className:o,minHeight:re,tableClassName:s,selectionMode:a,scrollableRef:T,onActivateRow:a!==`none`||p?e=>{O(e.id,e.getCanSelect()),p?.(e.original)}:void 0,isRowInteractive:e=>!!(p||a!==`none`&&e.getCanSelect()),getRowClassName:e=>ke?.(e.original),getCellClassName:({row:e,cell:t})=>t.column.id===H&&e.getIsSelected()?d.selectedIndicatorCell:void 0,getCellLayout:({cell:e})=>V.get(e.id),renderHeaderContextMenu:Ae,enableColumnResizing:ve,enableColumnReordering:ye,columnResizeMinWidth:c,renderCellContent:e=>{let t=ae({field:x.runtimeByColumnId[e.cell.column.id],rawValue:e.cell.getValue(),rowData:e.row.original,rowKind:`plain`}),n=ce({columnId:e.cell.column.id,runtimeByColumnId:x.runtimeByColumnId,customCellColumnIds:x.customCellColumnIds})?(0,h.jsx)(Ce,{displayValue:t,align:e.columnMeta?.align}):e.defaultContent;return y?y({...e,defaultContent:n,displayValue:t}):n},afterTableContent:_?(0,h.jsx)(`div`,{ref:E,className:d.sentinel,"aria-hidden":`true`}):null})}var m,h;function g(){return(g=e((()=>{m=n(),oe(),s(),ue(),ge(),ve(),me(),ye(),De(),fe(),_e(),c(),le(),f(),h=r(),p.__docgenInfo={description:"Плоская таблица на базе TanStack Table как React-альтернатива `sap.m.Table`.",methods:[],displayName:`Table`,props:{title:{required:!1,tsType:{name:`string`},description:`Необязательный заголовок над таблицей.`},isLoading:{required:!1,tsType:{name:`boolean`},description:`Признак первичной загрузки.`},isFetching:{required:!1,tsType:{name:`boolean`},description:`Признак фоновой догрузки или обновления данных.`},data:{required:!0,tsType:{name:`union`,raw:`readonly TData[] | undefined | null`,elements:[{name:`unknown`},{name:`undefined`},{name:`null`}]},description:`Плоский источник строк.`},columns:{required:!0,tsType:{name:`unknown`},description:`Описание колонок таблицы.`},selectionMode:{required:!1,tsType:{name:`TableSelectionMode`},description:`Режим выбора строк.`,defaultValue:{value:`"none"`,computed:!1}},selectedRowIds:{required:!1,tsType:{name:`unknown`},description:`Внешний список выбранных строк.
|
|
2
2
|
|
|
3
3
|
Если передан, таблица синхронизирует визуальное выделение с этим набором id.`},getRowId:{required:!1,tsType:{name:`signature`,type:`function`,raw:`(row: TData, index: number) => string`,signature:{arguments:[{type:{name:`TData`},name:`row`},{type:{name:`number`},name:`index`}],return:{name:`string`}}},description:`Стабильный идентификатор строки.
|
|
4
4
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t}from"./iframe-BHhbrImE.js";import{i as n,r}from"./react-qN2cStNd.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}from"./blocks-D8l_hmHU.js";import{a as f,c as p,d as m,i as h,l as g,n as _,o as v,r as y,s as b,t as x,u as S}from"./Tabs.stories-BpyQokl8.js";function C(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(s,{of:S,parameters:{docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,T.jsx)(u,{children:`Tabs`}),`
|
|
3
3
|
`,(0,T.jsx)(o,{children:`Набор tabs-компонентов с разделением простого scroll-сценария и составного panel-layout сценария`}),`
|
|
4
4
|
`,(0,T.jsxs)(t.p,{children:[`После рефакторинга `,(0,T.jsx)(t.code,{children:`tabs`}),` разделены на два независимых сценария:`]}),`
|