@ryuzaki13/react-foundation-ui 1.5.8 → 1.5.10
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 +8 -8
- 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-DO899w6E.js → CalendarView-BSshXZAX.js} +2 -2
- package/dist/chunks/{CalendarView-DO899w6E.js.map → CalendarView-BSshXZAX.js.map} +1 -1
- package/dist/chunks/{TextEditorLexicalClient-C7XL4lZ5.js → TextEditorLexicalClient-CLjpATRu.js} +6 -6
- package/dist/chunks/{TextEditorLexicalClient-C7XL4lZ5.js.map → TextEditorLexicalClient-CLjpATRu.js.map} +1 -1
- package/dist/chunks/{badge-BXwM9cFq.js → badge-CaooZXYD.js} +4 -4
- package/dist/chunks/{badge-BXwM9cFq.js.map → badge-CaooZXYD.js.map} +1 -1
- package/dist/chunks/{base-table-CFJHhLNb.js → base-table-fUJY__6M.js} +2 -2
- package/dist/chunks/{base-table-CFJHhLNb.js.map → base-table-fUJY__6M.js.map} +1 -1
- package/dist/chunks/{button-BcnvJpqz.js → button-C--u7uJj.js} +5 -5
- package/dist/chunks/{button-BcnvJpqz.js.map → button-C--u7uJj.js.map} +1 -1
- package/dist/chunks/{check-box-BrPHWs2l.js → check-box-BZiEBR9c.js} +3 -3
- package/dist/chunks/{check-box-BrPHWs2l.js.map → check-box-BZiEBR9c.js.map} +1 -1
- package/dist/chunks/{context-menu-DcdUfWN3.js → context-menu-XZ-e0f6_.js} +2 -2
- package/dist/chunks/{context-menu-DcdUfWN3.js.map → context-menu-XZ-e0f6_.js.map} +1 -1
- package/dist/chunks/{date-input-Db7GPkPC.js → date-input-Dr5QNVT6.js} +5 -5
- package/dist/chunks/{date-input-Db7GPkPC.js.map → date-input-Dr5QNVT6.js.map} +1 -1
- package/dist/chunks/{input-CMVATAFR.js → input-BNszawm6.js} +2 -2
- package/dist/chunks/{input-CMVATAFR.js.map → input-BNszawm6.js.map} +1 -1
- package/dist/chunks/{input-files-DM6I2iF_.js → input-files-DxLVr2PF.js} +3 -3
- package/dist/chunks/{input-files-DM6I2iF_.js.map → input-files-DxLVr2PF.js.map} +1 -1
- package/dist/chunks/{input-search-BlTKbtAL.js → input-search-C2OOhZlw.js} +2 -2
- package/dist/chunks/{input-search-BlTKbtAL.js.map → input-search-C2OOhZlw.js.map} +1 -1
- package/dist/chunks/{modal-z1Ej4Y-r.js → modal-DK9M7lT5.js} +2 -2
- package/dist/chunks/{modal-z1Ej4Y-r.js.map → modal-DK9M7lT5.js.map} +1 -1
- package/dist/chunks/{multi-select-BMBjWg3h.js → multi-select-CFHaQPot.js} +5 -5
- package/dist/chunks/{multi-select-BMBjWg3h.js.map → multi-select-CFHaQPot.js.map} +1 -1
- package/dist/chunks/{picker-C-a-2NkB.js → picker-D3Fc15JH.js} +3 -3
- package/dist/chunks/{picker-C-a-2NkB.js.map → picker-D3Fc15JH.js.map} +1 -1
- package/dist/chunks/{radio-group-D-eBPuGm.js → radio-group-BRR1ZQDA.js} +2 -2
- package/dist/chunks/radio-group-BRR1ZQDA.js.map +1 -0
- package/dist/chunks/{select-BhVOTvZ_.js → select-BolFlcoY.js} +5 -5
- package/dist/chunks/{select-BhVOTvZ_.js.map → select-BolFlcoY.js.map} +1 -1
- package/dist/chunks/{table-jMjMoYKh.js → table-BChs6bgR.js} +2 -2
- package/dist/chunks/{table-jMjMoYKh.js.map → table-BChs6bgR.js.map} +1 -1
- package/dist/chunks/{ui.module-D_ZhzCRv.js → ui.module-DHVTOqZ0.js} +6 -2
- package/dist/chunks/{ui.module-D_ZhzCRv.js.map → ui.module-DHVTOqZ0.js.map} +1 -1
- package/dist/chunks/{uiClasses-CF_aN4Tv.js → uiClasses-UkaejTdf.js} +13 -6
- package/dist/chunks/uiClasses-UkaejTdf.js.map +1 -0
- package/dist/chunks/{useODataSelectBase-CQJuzk5Q.js → useODataSelectBase-BhCMCzv_.js} +2 -2
- package/dist/chunks/{useODataSelectBase-CQJuzk5Q.js.map → useODataSelectBase-BhCMCzv_.js.map} +1 -1
- package/dist/context-menu/index.js +1 -1
- package/dist/date-input/index.js +2 -2
- package/dist/date-time-input/index.js +3 -3
- package/dist/disclosure/Disclosure.d.ts +6 -4
- package/dist/disclosure/Disclosure.d.ts.map +1 -1
- package/dist/disclosure/index.js +34 -33
- package/dist/disclosure/index.js.map +1 -1
- package/dist/drop-zone/index.js +1 -1
- package/dist/expandable-action-panel/index.js +1 -1
- package/dist/image/index.js +4 -4
- 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 +2 -2
- package/dist/layout-picker/index.js.map +1 -1
- package/dist/listbox/index.js +1 -1
- package/dist/modal/index.js +1 -1
- package/dist/multi-select/index.js +1 -1
- package/dist/notifications/index.js +1 -1
- package/dist/picker/index.js +1 -1
- package/dist/preset-range-date-input/index.js +1 -1
- package/dist/preset-select/index.js +1 -1
- package/dist/radio-button/index.js +2 -2
- package/dist/radio-group/index.js +1 -1
- package/dist/select/index.js +1 -1
- package/dist/simple-table/index.js +1 -1
- package/dist/slider/index.js +3 -3
- 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.d.ts +0 -2
- package/dist/tabs/index.d.ts.map +1 -1
- package/dist/tabs/index.js +164 -173
- package/dist/tabs/index.js.map +1 -1
- package/dist/tabs/model/types.d.ts +9 -8
- package/dist/tabs/model/types.d.ts.map +1 -1
- package/dist/tabs/ui/TabsBox.d.ts +1 -1
- package/dist/tabs/ui/TabsBox.d.ts.map +1 -1
- package/dist/tabs/ui/TabsLayout.d.ts.map +1 -1
- package/dist/tag-input/index.js +2 -2
- package/dist/text/Text.d.ts +1 -1
- package/dist/text/Text.d.ts.map +1 -1
- package/dist/text/index.js +3 -1
- package/dist/text/index.js.map +1 -1
- package/dist/text-editor/index.js +1 -1
- package/dist/textarea/index.js +2 -2
- package/dist/toggle/index.js +1 -1
- package/dist/toggle/index.js.map +1 -1
- package/dist/tree-select/index.js +6 -6
- package/dist/tree-table/index.js +1 -1
- package/dist/types.d.ts +1 -0
- package/dist/types.d.ts.map +1 -1
- package/dist/uiClasses.d.ts +2 -1
- package/dist/uiClasses.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/styles/_color.scss +4 -0
- package/storybook-static/assets/{Badge-Khhz8aRX.js → Badge-BRzsgtsW.js} +1 -1
- package/storybook-static/assets/{Badge.stories-zOcsfaff.js → Badge.stories-BEUzIGxR.js} +1 -1
- package/storybook-static/assets/{BadgeList-DS9d6kVQ.js → BadgeList-Dvi9mgiq.js} +2 -2
- package/storybook-static/assets/{Button-C38ehnnC.js → Button-B0yitxpz.js} +1 -1
- package/storybook-static/assets/{Button-CEXo9sAm.js → Button-D9NRl_J-.js} +1 -1
- package/storybook-static/assets/{Button.stories-1WKvAI-j.js → Button.stories-RTpFQ0lC.js} +1 -1
- package/storybook-static/assets/{CalendarView-CiXyo_UG.js → CalendarView-hixokiLY.js} +1 -1
- package/storybook-static/assets/{CheckBox-BeowtitL.js → CheckBox-CkP3wY1y.js} +1 -1
- package/storybook-static/assets/{CheckBox-sqtI5EhB.js → CheckBox-DgcHpYEB.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-BPX1Rg46.js → CheckBox.stories-B6gt-Pyy.js} +1 -1
- package/storybook-static/assets/{Color-6AOWCN3U-2vHfXX4h.js → Color-6AOWCN3U-CS57U4UC.js} +1 -1
- package/storybook-static/assets/{ContextMenu-CKqFrruL.js → ContextMenu-CvaQBpuB.js} +1 -1
- package/storybook-static/assets/{ContextMenu-Cf0aB42t.js → ContextMenu-DfArrHyO.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-DUNNczmV.js → ContextMenu.stories-UUZnkfjK.js} +1 -1
- package/storybook-static/assets/{DateInput-CgZisi2m.js → DateInput-BOJzcuf8.js} +1 -1
- package/storybook-static/assets/{DateInput-CqLQj_F4.js → DateInput-D0Z39L0u.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-Do_7epv1.js → DateInput.stories-B9oAtjEF.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-CQH5mwGa.js → DateRangePresetSelect-Bhzy-5vR.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-CvYeLrV2.js → DateRangePresetSelect-I9kq2B9z.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-BaulSowp.js → DateRangePresetSelect.stories-CkkmtUCo.js} +1 -1
- package/storybook-static/assets/{Detail-C5pT_ihu.js → Detail-D038XLEh.js} +1 -1
- package/storybook-static/assets/{Detail.stories-CYeU4gW0.js → Detail.stories-Dy8sCrYr.js} +1 -1
- package/storybook-static/assets/{Dialog-JpGOo8UM.js → Dialog-BpBfxyHP.js} +1 -1
- package/storybook-static/assets/{Dialog-CyfPnLNU.js → Dialog-DvcT-HcI.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-DDgSBPse.js → Dialog.stories-CFwZCUTc.js} +1 -1
- package/storybook-static/assets/{Disclosure-CoRV3SKI.js → Disclosure-bS8JZMZH.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-ShTbXMfl.js → Disclosure.stories-DoRb7eFP.js} +1 -1
- package/storybook-static/assets/DisclosureGroup-C8bhahk2.js +2 -0
- package/storybook-static/assets/DisclosureGroup-CVFMwx22.css +1 -0
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-C6cvpWLp.js → DocsRenderer-JROSPFPF-BENO-TjP.js} +1 -1
- package/storybook-static/assets/{DropZone-BMM9Wzo2.js → DropZone-BFesDtXX.js} +1 -1
- package/storybook-static/assets/{DropZone-aGbl_hY6.js → DropZone-CT2ql-iq.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-B19OUO0s.js → DropZone.stories-DjyWW5NR.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-Cg0W3h8L.js → DropdownMenu-DFIvsL7-.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel-BzBrYqC5.js → ExpandableActionPanel-HfuTxNHC.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-DCNEDnZa.js → ExpandableActionPanel.stories-hrKtH1J5.js} +1 -1
- package/storybook-static/assets/{Flex-MkfwQVIc.js → Flex-YpXsCy6o.js} +1 -1
- package/storybook-static/assets/{Flex.stories-BlM3OY3o.js → Flex.stories-Ck5prBoq.js} +1 -1
- package/storybook-static/assets/{FloatingPopover-D6CCSTdu.js → FloatingPopover-DOPDzLFT.js} +1 -1
- package/storybook-static/assets/{FormattedTableCell-G7nk8gAQ.js → FormattedTableCell-CpYotISk.js} +1 -1
- package/storybook-static/assets/{Grid-DfaPblMb.js → Grid-DUocH4TX.js} +1 -1
- package/storybook-static/assets/{Grid.stories-DDikKF9r.js → Grid.stories-jnw37ukT.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-CXPVp9Vp.js → ImageCropper.stories-CDLsJM59.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-BGvZWBqv.js → ImageRenderer-CZ7DKuFY.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-DISqcLr0.js → ImageRenderer.stories-B8-aQ58B.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-2slK-d-x.js → ImageView.stories-DLhqZ_GI.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-Xq_D5QUi.js → ImageViewer.stories-o1yD_rZq.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-DMqh4wGq.js → ImageViewerRuntime-CJlrAsfL.js} +1 -1
- package/storybook-static/assets/{Input-B9ykEI3i.js → Input-8dAj3L5M.js} +1 -1
- package/storybook-static/assets/{Input-QDdDpHSi.js → Input-B8y70gW9.js} +1 -1
- package/storybook-static/assets/{Input.stories-B0ij_iCD.js → Input.stories-KAOo2cMb.js} +1 -1
- package/storybook-static/assets/{InputDateTime-BLCtKukj.js → InputDateTime-C8iXQn7P.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-mKKGsKaq.js → InputDateTime.stories-BOUfVN41.js} +1 -1
- package/storybook-static/assets/{InputFile-CHhD9bDB.js → InputFile-BlMNRcyL.js} +1 -1
- package/storybook-static/assets/{InputFile-uAmsP7LG.js → InputFile-C-CwNpFJ.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-CK-ACsW2.js → InputFile.stories-MD9cAu-W.js} +1 -1
- package/storybook-static/assets/{InputFiles-DABWDqXi.js → InputFiles-BMjWaVN9.js} +1 -1
- package/storybook-static/assets/{InputFiles-CDgBA7Tt.js → InputFiles-D72fv8HQ.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-Dihf3LA3.js → InputFiles.stories-BlD8cBmt.js} +1 -1
- package/storybook-static/assets/{InputFilesList-CCkGwmuk.js → InputFilesList-Dol1dIX5.js} +1 -1
- package/storybook-static/assets/{InputImage-CL1d5Pan.js → InputImage-_sOF8mmB.js} +1 -1
- package/storybook-static/assets/{InputImage-B-yYeHyx.js → InputImage-uE0JlBq5.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-CJSA6DVX.js → InputImage.stories-R6HZFGuR.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents-BbTcKx2O.js → InteractiveComponents-BDmyyudJ.js} +3 -3
- package/storybook-static/assets/InteractiveComponents.stories-RsjV4QyY.js +530 -0
- package/storybook-static/assets/{LayoutPicker-Bghy4k1z.js → LayoutPicker-CqpAicOL.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-CXDkkJp2.js → LayoutPicker-CywNkFMn.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-yb6IMmd2.css → LayoutPicker-DudPIiwb.css} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-DW9dESrS.js → LayoutPicker.stories-BMiwqihl.js} +1 -1
- package/storybook-static/assets/{Listbox-CLvPiIfl.js → Listbox-Bznk_lrX.js} +1 -1
- package/storybook-static/assets/{Listbox--cQWgUmD.js → Listbox-zQgffOs0.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-Df-qKPoO.js → Listbox.stories-BeWjK-CY.js} +1 -1
- package/storybook-static/assets/{Modal-q_SY4zcu.js → Modal-unWtDqq_.js} +1 -1
- package/storybook-static/assets/{Modal.stories-uOYpbXVv.js → Modal.stories-DepzRvWp.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-DRweDYkZ.js → ModalManagerProvider-B1XUXs-1.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-C5bd7SFD.css → ModalManagerProvider-CjPErFqW.css} +1 -1
- package/storybook-static/assets/{MultiSelect-B2hs_VJT.js → MultiSelect-DBzuR4v6.js} +1 -1
- package/storybook-static/assets/{MultiSelect-C7oSCFYc.js → MultiSelect-U5XEaFTv.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-CmXVD8NV.js → MultiSelect.stories-9xtLUsmK.js} +1 -1
- package/storybook-static/assets/{NoData-CYykp6nm.js → NoData-Did5-Vbj.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-6EGDcdXc.js → NotificationsHost-C16jWWbh.js} +1 -1
- package/storybook-static/assets/{NotificationsHost.stories-DYlOKW3z.js → NotificationsHost.stories-Df9Sciyb.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-D3lAz52M.js → ODataMultiSelect-_5_Hrv8p.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-Do349Woi.js → ODataMultiSelect.stories-DWTlih_F.js} +1 -1
- package/storybook-static/assets/{ODataSelect-BmLCt-Et.js → ODataSelect-xX8_14hD.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-CBE4FRU1.js → ODataSelect.stories-B_VSMkR5.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-DPRC8mC_.js → ODataTreeMultiSelect-CheCWkrj.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-B04PXBI1.js → ODataTreeMultiSelect.stories-CAWAJxdC.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-D_JM7RgM.js → ODataTreeSelect-ZQN9ZhPc.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-Cg5g1jKK.js → ODataTreeSelect.stories-CYC_eiFv.js} +1 -1
- package/storybook-static/assets/{OneStepScroller-BFpPuaB_.js → OneStepScroller-KFcpHiAM.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-DEMta98q.js → PeriodSelect-BgQWqB2a.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-BcOUZrRT.js → PeriodSelect-DN9SFKXh.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-Y9ouTAuy.js → PeriodSelect.stories-DcUE2clK.js} +1 -1
- package/storybook-static/assets/{PickerSelectionToolbar-Bv-nSj0d.js → PickerSelectionToolbar-CvqU44D-.js} +1 -1
- package/storybook-static/assets/{PickerTriggerActions-CQDEvDc_.js → PickerTriggerActions-DZzNAe4M.js} +1 -1
- package/storybook-static/assets/{Popover-CWLOyKnP.js → Popover-B1_qmzkr.js} +1 -1
- package/storybook-static/assets/{Popover-DB3qAxXW.js → Popover-iSasApKA.js} +1 -1
- package/storybook-static/assets/{Popover.stories-D5sWLE6b.js → Popover.stories-CGLUaRgH.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-59Tam-1W.js → PresetRangeDateInput-CxyBq2XS.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-CtvsU8Ml.js → PresetRangeDateInput-D_ylm7hV.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-CUwrsRrL.js → PresetRangeDateInput.stories-DgrBel6_.js} +1 -1
- package/storybook-static/assets/{PresetSelect-BAYEJ8CM.js → PresetSelect-CrdvEugF.js} +1 -1
- package/storybook-static/assets/{RadioButton-zpobcF9e.js → RadioButton-DW4ph1Xp.js} +1 -1
- package/storybook-static/assets/{RadioButton-CM7QJhfw.js → RadioButton-DwyUH5ms.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-CzL_GQa2.js → RadioButton.stories-6q7CeUZY.js} +3 -3
- package/storybook-static/assets/{RadioGroup-CRQsZ0qT.js → RadioGroup-BumTRrwE.js} +1 -1
- package/storybook-static/assets/{RadioGroup-vkD0hI_b.css → RadioGroup-DJ1xoaNp.css} +1 -1
- package/storybook-static/assets/{RadioGroup-BApqIRxt.js → RadioGroup-DshEU96S.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-CxrEMC1U.js → RadioGroup.stories-Bwv8Bgn8.js} +1 -1
- package/storybook-static/assets/{Scrollable-8LS79J5A.js → Scrollable-ZI0zA9wz.js} +1 -1
- package/storybook-static/assets/{Select-Dgz6O4XI.js → Select-CP1Ijv9g.js} +1 -1
- package/storybook-static/assets/{Select-DnKAwahR.js → Select-CjuyI3wO.js} +1 -1
- package/storybook-static/assets/{Select.stories-BVue1oEG.js → Select.stories-kCFhGvWP.js} +1 -1
- package/storybook-static/assets/{SelectOptionContent-B0aIuszF.js → SelectOptionContent-C2DjqaM0.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-DdKvEcMl.js → SerializableSelect-CoVoXwJS.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-C9HykJIM.js → SerializableSelect.stories-UTJc7HQF.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-5BdPENRL.js → SingleDateTimeInput-DobT9m-7.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-BJurOfWH.js → SingleDateTimeInput-bIeFRT8c.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-CbCzAEH_.js → SingleDateTimeInput.stories-CwAP5lI3.js} +1 -1
- package/storybook-static/assets/Slider-CK-W2ZTO.css +1 -0
- package/storybook-static/assets/{Slider-Su14u999.js → Slider-CnhBAXNm.js} +1 -1
- package/storybook-static/assets/{Slider-B7fBYWsh.js → Slider-DB7dm4uC.js} +1 -1
- package/storybook-static/assets/{Slider.stories-oq8MwiOM.js → Slider.stories-D7ADzpCF.js} +1 -1
- package/storybook-static/assets/{SliderInput-DC3rLw1R.js → SliderInput-CvmZ86d-.js} +1 -1
- package/storybook-static/assets/{SliderInput-C6vA0nX0.js → SliderInput-DfMdXNjq.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-oSDfsTGl.js → SliderInput.stories-CKe5q8PZ.js} +1 -1
- package/storybook-static/assets/{Sortable-D2S4Ntya.js → Sortable-D-PG0esR.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-B1VPCY57.js → Sortable.stories-BUUu5LQR.js} +1 -1
- package/storybook-static/assets/{Splitter-BOCZma_W.js → Splitter-Cbiph6ck.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-Be1FdaCX.js → Splitter.stories-z1_IuipN.js} +1 -1
- package/storybook-static/assets/{StateSelect-a1GpBbb9.js → StateSelect-BfhvHQrQ.js} +1 -1
- package/storybook-static/assets/{StateSelect-D397PXHf.js → StateSelect-C6b0aolc.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-uqTINtV1.js → StateSelect.stories-yKKasuZq.js} +1 -1
- package/storybook-static/assets/{StringToggle.stories-VNfJpKp9.js → StringToggle.stories-mHQXke0Z.js} +1 -1
- package/storybook-static/assets/{Switch-DJnZsi7c.js → Switch--s8CABgk.js} +1 -1
- package/storybook-static/assets/{Switch-5BXuXQib.js → Switch-DtYu0DX3.js} +1 -1
- package/storybook-static/assets/{Switch.stories-qmAfTk2T.js → Switch.stories-DqVmpD3F.js} +1 -1
- package/storybook-static/assets/{Table-DwAfFwxJ.js → Table-CS-8NjMS.js} +1 -1
- package/storybook-static/assets/{Table.stories-BIfxC452.js → Table.stories-BDEFvavq.js} +1 -1
- package/storybook-static/assets/Tabs-DVAc2sEq.js +65 -0
- package/storybook-static/assets/Tabs.stories-Bx3SVBYV.js +57 -0
- package/storybook-static/assets/TabsBox-D-bkJX9j.css +1 -0
- package/storybook-static/assets/TabsBox-DIc3bAG9.js +2 -0
- package/storybook-static/assets/{TagInput-o8pKGmii.js → TagInput-DvJOyiDa.js} +1 -1
- package/storybook-static/assets/{TagInput.stories-VMOT59Cx.js → TagInput.stories-BfUUxxvB.js} +1 -1
- package/storybook-static/assets/Text-DDM_QNpo.js +1 -0
- package/storybook-static/assets/{Textarea-BAmJ8_Mc.js → Textarea-B8jfChqH.js} +1 -1
- package/storybook-static/assets/{Textarea-ZKT4EZNo.js → Textarea-CouwxZMS.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-C2UVl6PS.js → Textarea.stories-B5YnG6Hg.js} +1 -1
- package/storybook-static/assets/{TimePanel-BrhU0p24.js → TimePanel-Ce44lmoA.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-ngyJXj5J.js → TimePanel.stories-dMXzRVpT.js} +1 -1
- package/storybook-static/assets/{Toggle-CBNpSWHj.js → Toggle-BLb3M4N1.js} +1 -1
- package/storybook-static/assets/{Toggle-wlk2S-OZ.js → Toggle-C8qL0JdM.js} +1 -1
- package/storybook-static/assets/Toggle-fKG2dFY0.css +1 -0
- package/storybook-static/assets/{Toggle.stories-B98YrV_V.js → Toggle.stories-CR8xCkXd.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-Dtl4PCmy.js → TreeMultiSelect-5fHQVUTd.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-C-9k48kJ.js → TreeMultiSelect-Bttryv5k.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-CWlzx-1-.js → TreeMultiSelect.stories-B4zkiRfC.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-DypAOfjj.js → TreePickerBase-B_XyJaYL.js} +1 -1
- package/storybook-static/assets/{TreeSelect-DG-iC3OT.js → TreeSelect-BmV5BgHm.js} +1 -1
- package/storybook-static/assets/{TreeSelect-D5ihwfVT.js → TreeSelect-_mFMic9T.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-C4y-1eM0.js → TreeSelect.stories-D-lz21y2.js} +1 -1
- package/storybook-static/assets/{TreeTable-EtrL23Tv.js → TreeTable-BjnuFqoj.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-DlZcGmtJ.js → TreeTable.stories-OEii5uhT.js} +1 -1
- package/storybook-static/assets/{async-BbFzTdhE.js → async-BggDKhCa.js} +1 -1
- package/storybook-static/assets/{blocks-Dk_BOKmc.js → blocks-DXv0kKnO.js} +3 -3
- package/storybook-static/assets/{browserAndReact-BjzCiDcb.js → browserAndReact-CJg4Htw7.js} +1 -1
- package/storybook-static/assets/{check-DSM_9_9i.js → check-BDF3qN6C.js} +1 -1
- package/storybook-static/assets/{chevron-down-Bp7g9jaN.js → chevron-down-DycW5rEN.js} +1 -1
- package/storybook-static/assets/{chevron-left-D0R6zNbT.js → chevron-left-C5fp0Uga.js} +1 -1
- package/storybook-static/assets/{chevron-right-D4cu1_Hh.js → chevron-right-BtcaEPgU.js} +1 -1
- package/storybook-static/assets/{chunk-W22LQPXL-ClDnVv2Q.js → chunk-W22LQPXL-DpbhHTe5.js} +1 -1
- package/storybook-static/assets/{circle-alert-BPggadk6.js → circle-alert-BHmYiVSQ.js} +1 -1
- package/storybook-static/assets/{circle-check-BU1QAh8V.js → circle-check-D-kWZdLj.js} +1 -1
- package/storybook-static/assets/{components-B_jGKru2.js → components-CiK0i2y5.js} +3 -3
- package/storybook-static/assets/{contextMenu-Bf6YK0UH.js → contextMenu-BuB7GWKM.js} +1 -1
- package/storybook-static/assets/{defaultRenderers-DjL-8uS1.js → defaultRenderers-DKIVh61V.js} +1 -1
- package/storybook-static/assets/{download-QNniF4SQ.js → download-CHMcYpj3.js} +1 -1
- package/storybook-static/assets/{filesAndExcel-BYbWfuEG.js → filesAndExcel-DlArA_GW.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-_mbG5dEq.js → floating-ui.react-2n8Uyf0J.js} +1 -1
- package/storybook-static/assets/{formatters-CSUSbuYT.js → formatters-BwCs7xCt.js} +1 -1
- package/storybook-static/assets/{formatters-runtime-CJK7YO_m.js → formatters-runtime-ibdtp7C6.js} +1 -1
- package/storybook-static/assets/{foundationLib-DYspa9hU.js → foundationLib-DAvQ9wk8.js} +1 -1
- package/storybook-static/assets/{hooks-BKgQ004K.js → hooks-D0mbXwcm.js} +1 -1
- package/storybook-static/assets/iframe-B1M7f4Qn.js +1 -0
- package/storybook-static/assets/{iframe-DuAeRvx6.js → iframe-BnjRbLCp.js} +3 -3
- package/storybook-static/assets/iframe-J8XUsZxh.css +1 -0
- package/storybook-static/assets/{info-XhLhSnbk.js → info-B9srbxQP.js} +1 -1
- package/storybook-static/assets/{odata-kmwYINrm.js → odata-D9w_2DW1.js} +1 -1
- package/storybook-static/assets/{odataAndTables-D1zT50BB.js → odataAndTables-B7U8x4CV.js} +1 -1
- package/storybook-static/assets/{odataFetchFn-0PlOYGor.js → odataFetchFn-BrsJ-DlE.js} +1 -1
- package/storybook-static/assets/{odataStoryFixtures-BhAHMCLD.js → odataStoryFixtures-CbO3dfw1.js} +1 -1
- package/storybook-static/assets/{persisted-BYm1AJlK.js → persisted-DXbdpvSU.js} +1 -1
- package/storybook-static/assets/{pureUtilities-CRz8PgNh.js → pureUtilities-BtrtdX0r.js} +1 -1
- package/storybook-static/assets/{react-B37IqpVm.js → react-DmKWdnt1.js} +1 -1
- package/storybook-static/assets/{refresh-cw-Bcya9hPG.js → refresh-cw-C2Rk5OjE.js} +1 -1
- package/storybook-static/assets/{runtimeAndState-Difqhsa_.js → runtimeAndState-Be2a2JfZ.js} +1 -1
- package/storybook-static/assets/{settings-2-C2bGc7dw.js → settings-2-CuAc9ekV.js} +1 -1
- package/storybook-static/assets/{sortable-CvctSETP.js → sortable-DF8VgD8R.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-T5IQBZDB-CK4b0ttG.js → syntaxhighlighter-T5IQBZDB-BnGJW0L9.js} +1 -1
- package/storybook-static/assets/{trash-2-34MyPhKO.js → trash-2-DRXwetzV.js} +1 -1
- package/storybook-static/assets/{triangle-alert-m0XHePwA.js → triangle-alert-D5785xcd.js} +1 -1
- package/storybook-static/assets/{ui-nZtwyXyS.css → ui-vmPSPL8p.css} +1 -1
- package/storybook-static/assets/ui.module-Bh9yvZgk.js +1 -0
- package/storybook-static/assets/uiClasses-CyX7wB6b.js +1 -0
- package/storybook-static/assets/{useODataSelectBase-DBkT6Oh-.js → useODataSelectBase-DfOi4e0X.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-Cj_M219Q.js → useODataTreeData-BBSy4G6V.js} +1 -1
- package/storybook-static/assets/{usePickerQuery-DNrvDy8E.js → usePickerQuery-BYa25rmI.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-BCnKK5xY.js → usePickerTriggerController-CwgtrL5F.js} +1 -1
- package/storybook-static/assets/{x-BXPCGZYS.js → x-DvnP0o1b.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/radio-group-D-eBPuGm.js.map +0 -1
- package/dist/chunks/uiClasses-CF_aN4Tv.js.map +0 -1
- package/dist/tabs/ui/Tabs.d.ts +0 -16
- package/dist/tabs/ui/Tabs.d.ts.map +0 -1
- package/storybook-static/assets/DisclosureGroup-BFWSlYOk.css +0 -1
- package/storybook-static/assets/DisclosureGroup-DFZxdYAc.js +0 -2
- package/storybook-static/assets/InteractiveComponents.stories-91dvlxQf.js +0 -472
- package/storybook-static/assets/Slider-bVVL6_Jz.css +0 -1
- package/storybook-static/assets/Tabs-CFLwas2t.js +0 -72
- package/storybook-static/assets/Tabs.stories-BDpQCjIJ.js +0 -87
- package/storybook-static/assets/TabsBox-B-Qi_Ddz.js +0 -2
- package/storybook-static/assets/TabsBox-B5ugO318.css +0 -1
- package/storybook-static/assets/Text-DGP30761.js +0 -1
- package/storybook-static/assets/Toggle-9G08CPe5.css +0 -1
- package/storybook-static/assets/iframe-DrFZbzJ3.js +0 -1
- package/storybook-static/assets/iframe-_EkhDToa.css +0 -1
- package/storybook-static/assets/ui.module-DjxH5szp.js +0 -1
- package/storybook-static/assets/uiClasses-CjI3jv6I.js +0 -1
package/dist/tabs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/tabs/lib/tabs.ts","../../src/tabs/model/useTabsState.ts","../../src/tabs/ui/Tabs.module.scss","../../src/tabs/ui/TabsLoadingState.tsx","../../src/tabs/ui/TabsNoDataState.tsx","../../src/tabs/ui/TabsPanel.tsx","../../src/tabs/ui/TabsTabList.tsx","../../src/tabs/ui/TabsBox.tsx","../../src/tabs/ui/Tabs.tsx","../../src/tabs/ui/TabsLayout.tsx"],"sourcesContent":["import type { TabsDescriptor, TabsMountStrategy } from \"../model/types\";\n\n/**\n * Возвращает идентификатор первой доступной вкладки.\n */\nexport function getFirstEnabledTabId(items: TabsDescriptor[]) {\n\treturn items.find((item) => !item.disabled)?.id ?? null;\n}\n\n/**\n * Возвращает безопасный идентификатор вкладки.\n * Если переданный `candidate` недоступен, выбирается первая доступная вкладка.\n */\nexport function getSafeTabId(items: TabsDescriptor[], candidate: string | undefined | null) {\n\tif (!candidate) {\n\t\treturn getFirstEnabledTabId(items);\n\t}\n\n\tconst matchedItem = items.find((item) => item.id === candidate && !item.disabled);\n\treturn matchedItem?.id ?? getFirstEnabledTabId(items);\n}\n\n/**\n * Возвращает только доступные вкладки для roving focus и клавиатурной навигации.\n */\nexport function getEnabledTabs(items: TabsDescriptor[]) {\n\treturn items.filter((item) => !item.disabled);\n}\n\ninterface ShouldMountTabPanelOptions {\n\tmountStrategy: TabsMountStrategy;\n\tisSelected: boolean;\n\tisVisited: boolean;\n}\n\n/**\n * Определяет, должна ли панель оставаться смонтированной с учётом стратегии монтирования.\n */\nexport function shouldMountTabPanel({ mountStrategy, isSelected, isVisited }: ShouldMountTabPanelOptions) {\n\treturn mountStrategy === \"keep-mounted\" || isSelected || (mountStrategy === \"lazy\" && isVisited);\n}\n","import type React from \"react\";\nimport { FocusEvent, KeyboardEvent, useId, useMemo, useRef, useState } from \"react\";\n\nimport { getRovingFocusTargetIndex } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { getEnabledTabs, getSafeTabId } from \"../lib/tabs\";\n\nimport type { TabsActivationMode, TabsDescriptor, TabsOrientation } from \"./types\";\n\ninterface UseTabsStateOptions {\n\titems: TabsDescriptor[];\n\tvalue?: string;\n\tdefaultValue?: string;\n\tonValueChange?: (value: string) => void;\n\torientation?: TabsOrientation;\n\tactivationMode?: TabsActivationMode;\n\tloop?: boolean;\n}\n\n/**\n * Публичная часть модели, необходимая визуальным подкомпонентам tabs.\n */\nexport interface TabsStateModel {\n\tactivationMode: TabsActivationMode;\n\torientation: TabsOrientation;\n\tselectedTabId: string | null;\n\ttabbableTabId: string | null;\n\tonTabListKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void;\n\tonTabListBlur: (event: FocusEvent<HTMLDivElement>) => void;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tgetTabButtonProps: (item: TabsDescriptor) => React.ButtonHTMLAttributes<HTMLButtonElement> & {\n\t\tref: (node: HTMLButtonElement | null) => void;\n\t};\n\tisVisited: (tabId: string) => boolean;\n}\n\n/**\n * Инкапсулирует state, a11y-связки и клавиатурную навигацию для всех оболочек tabs.\n */\nexport function useTabsState({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tloop = true\n}: UseTabsStateOptions): TabsStateModel {\n\tconst isControlled = value !== undefined;\n\tconst enabledTabs = useMemo(() => getEnabledTabs(items), [items]);\n\tconst fallbackTabId = enabledTabs[0]?.id ?? null;\n\tconst [internalValue, setInternalValue] = useState(() => getSafeTabId(items, defaultValue));\n\tconst [focusedTabId, setFocusedTabId] = useState<string | null>(() => getSafeTabId(items, value ?? defaultValue));\n\tconst initialVisitedTabId = getSafeTabId(items, value ?? defaultValue);\n\tconst [visitedTabsState, setVisitedTabsState] = useState<Set<string>>(() =>\n\t\tinitialVisitedTabId ? new Set([initialVisitedTabId]) : new Set()\n\t);\n\tconst tabsId = useId();\n\tconst tabRefs = useRef<Record<string, HTMLButtonElement | null>>({});\n\n\tconst selectedTabId = getSafeTabId(items, isControlled ? value : internalValue);\n\tconst nextTabbableTabId = getSafeTabId(items, focusedTabId) ?? selectedTabId ?? fallbackTabId;\n\tconst visitedTabs = useMemo(() => {\n\t\tif (!selectedTabId || visitedTabsState.has(selectedTabId)) {\n\t\t\treturn visitedTabsState;\n\t\t}\n\n\t\tconst next = new Set(visitedTabsState);\n\t\tnext.add(selectedTabId);\n\t\treturn next;\n\t}, [selectedTabId, visitedTabsState]);\n\n\tconst activateTab = (nextTabId: string) => {\n\t\tconst safeNextTabId = getSafeTabId(items, nextTabId);\n\t\tif (!safeNextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetVisitedTabsState((prev) => {\n\t\t\tif (prev.has(safeNextTabId)) {\n\t\t\t\treturn prev;\n\t\t\t}\n\n\t\t\tconst next = new Set(prev);\n\t\t\tnext.add(safeNextTabId);\n\t\t\treturn next;\n\t\t});\n\n\t\tif (!isControlled) {\n\t\t\tsetInternalValue(safeNextTabId);\n\t\t}\n\n\t\tonValueChange?.(safeNextTabId);\n\t};\n\n\tconst focusTab = (nextTabId: string) => {\n\t\ttabRefs.current[nextTabId]?.focus();\n\t};\n\n\tconst onTabListKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n\t\tif (enabledTabs.length < 2) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeFocusIndex = Math.max(\n\t\t\t0,\n\t\t\tenabledTabs.findIndex((item) => item.id === (nextTabbableTabId ?? selectedTabId ?? fallbackTabId))\n\t\t);\n\t\tconst nextEnabledIndex = getRovingFocusTargetIndex({\n\t\t\tcurrentIndex: activeFocusIndex,\n\t\t\titemCount: enabledTabs.length,\n\t\t\tkey: event.key,\n\t\t\torientation,\n\t\t\twrap: loop\n\t\t});\n\n\t\tif (nextEnabledIndex === null) {\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\n\t\tconst nextTabId = enabledTabs[nextEnabledIndex]?.id;\n\t\tif (!nextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(nextTabId);\n\t\tfocusTab(nextTabId);\n\n\t\tif (activationMode === \"automatic\") {\n\t\t\tactivateTab(nextTabId);\n\t\t}\n\t};\n\n\tconst onTabListBlur = (event: FocusEvent<HTMLDivElement>) => {\n\t\tconst nextTarget = event.relatedTarget;\n\n\t\tif (nextTarget instanceof Node && event.currentTarget.contains(nextTarget)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(selectedTabId ?? fallbackTabId);\n\t};\n\n\tconst getTabElementId = (tabId: string) => `${tabsId}-tab-${tabId}`;\n\tconst getPanelElementId = (tabId: string) => `${tabsId}-panel-${tabId}`;\n\n\tconst getTabButtonProps = (item: TabsDescriptor) => {\n\t\tconst isSelected = item.id === selectedTabId;\n\t\tconst isTabbable = item.id === nextTabbableTabId;\n\n\t\treturn {\n\t\t\tref: (node: HTMLButtonElement | null) => {\n\t\t\t\ttabRefs.current[item.id] = node;\n\t\t\t},\n\t\t\ttype: \"button\" as const,\n\t\t\trole: \"tab\" as const,\n\t\t\tid: getTabElementId(item.id),\n\t\t\tdisabled: item.disabled,\n\t\t\t\"aria-selected\": isSelected,\n\t\t\t\"aria-controls\": getPanelElementId(item.id),\n\t\t\t\"aria-disabled\": item.disabled || undefined,\n\t\t\ttabIndex: item.disabled ? -1 : isTabbable ? 0 : -1,\n\t\t\tonFocus: () => setFocusedTabId(item.id),\n\t\t\tonClick: () => activateTab(item.id)\n\t\t};\n\t};\n\n\treturn {\n\t\tactivationMode,\n\t\torientation,\n\t\tselectedTabId,\n\t\ttabbableTabId: nextTabbableTabId,\n\t\tonTabListKeyDown,\n\t\tonTabListBlur,\n\t\tgetTabElementId,\n\t\tgetPanelElementId,\n\t\tgetTabButtonProps,\n\t\tisVisited: (tabId: string) => visitedTabs.has(tabId)\n\t};\n}\n",".tabsContainer {\n\t--tabs-border: none;\n\t--tabs-panel-border: none;\n\t--tabs-panel-padding: var(--space-md);\n\t--tabs-panel-bg: var(--surface-0);\n\n\tdisplay: grid;\n\t// gap: var(--space-sm);\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.bordered {\n\t--tabs-border: var(--border);\n\t--tabs-panel-border: var(--border);\n}\n\n.cleanPanel {\n\t--tabs-panel-padding: 0;\n\t--tabs-panel-bg: none;\n\t--tabs-panel-border: none;\n}\n\n.tabs {\n\tdisplay: flex;\n\tgap: var(--space-xs);\n\tmin-width: 0;\n\n\tborder: var(--tabs-border);\n\t// background-color: var(--surface-0);\n\tpadding: var(--space-sm);\n}\n\n.panels {\n\tmin-width: 0;\n\tmin-height: 0;\n\tborder: var(--tabs-panel-border);\n\tbackground-color: var(--tabs-panel-bg);\n}\n\n.horizontal {\n\tgrid-template-rows: auto minmax(0, 1fr);\n\n\t.tabs {\n\t\tborder-top-left-radius: var(--radius-sm);\n\t\tborder-top-right-radius: var(--radius-sm);\n\t}\n\n\t.panels {\n\t\tborder-top: none;\n\n\t\tborder-bottom-left-radius: var(--radius-sm);\n\t\tborder-bottom-right-radius: var(--radius-sm);\n\t}\n\n\t.tab {\n\t\tborder-bottom: var(--focus-width) solid transparent;\n\t}\n}\n\n.vertical {\n\tgrid-template-columns: 10em minmax(0, 1fr);\n\tmin-height: 0;\n\n\t.tabs {\n\t\tflex-direction: column;\n\n\t\tborder-top-left-radius: var(--radius-sm);\n\t\tborder-bottom-left-radius: var(--radius-sm);\n\t}\n\n\t.panels {\n\t\tborder-left: none;\n\n\t\tborder-top-right-radius: var(--radius-sm);\n\t\tborder-bottom-right-radius: var(--radius-sm);\n\t}\n\n\t.tab {\n\t\tborder-left: var(--focus-width) solid transparent;\n\t}\n}\n\n.panelScrollable {\n\toverflow: auto;\n}\n\n.tab {\n\ttext-align: left;\n\n\tposition: relative;\n\tmin-height: var(--control-height);\n\tpadding: var(--space-xs) var(--space-md);\n\tcolor: var(--content-2);\n\t// border-radius: var(--radius-sm);\n\tfont-weight: 700;\n\tfont-variation-settings: \"wght\" 700;\n\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tcursor: pointer;\n\t\tcolor: var(--content-1);\n\t\t// background-color: var(--surface-accent);\n\t\tborder-color: var(--border-2);\n\t}\n\n\t&.selected {\n\t\tcolor: var(--content-accent);\n\t\t// background-color: var(--status-info-fill);\n\t\tborder-color: var(--border-accent);\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t\tcolor: var(--content-2);\n\t\tbackground-color: var(--surface-2);\n\t}\n}\n\n.panel {\n\tpadding: 0;\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n}\n\n.panelBody {\n\tmin-width: 0;\n\tmin-height: 0;\n\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutPanels {\n\toverflow: hidden;\n}\n\n.layoutPanel {\n\tdisplay: grid;\n\tgap: var(--space-md);\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutSection {\n\tmin-width: 0;\n}\n\n.layoutContent {\n\tmin-height: 0;\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { LoadingMessage } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\ninterface TabsLoadingStateProps {\n\tcontainerClassName: string;\n\ttabListClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n\tloadingText?: string;\n}\n\n/**\n * Служебное loading-состояние для `TabsBox`.\n */\nexport function TabsLoadingState({\n\tcontainerClassName,\n\ttabListClassName,\n\tpanelsClassName,\n\tpanelClassName,\n\tpanelBodyClassName,\n\tloadingText\n}: TabsLoadingStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={tabListClassName} aria-hidden=\"true\">\n\t\t\t\t<button type=\"button\" disabled data-disabled=\"\" className={cn(styles.tab, \"skeletonLine\")}>\n\t\t\t\t\tЗагрузка...\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div className={panelsClassName} aria-busy=\"true\">\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<LoadingMessage text={loadingText} className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { NoData } from \"../../misc\";\n\ninterface TabsNoDataStateProps {\n\tcontainerClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n}\n\n/**\n * Служебное empty-состояние для `TabsBox`.\n */\nexport function TabsNoDataState({ containerClassName, panelsClassName, panelClassName, panelBodyClassName }: TabsNoDataStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<NoData className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import React from \"react\";\n\n/**\n * Унифицированная ARIA-обёртка для содержимого активной панели tabs.\n */\ninterface TabsPanelProps {\n\ttabId: string;\n\tisSelected: boolean;\n\tclassName?: string;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tchildren: React.ReactNode;\n}\n\nexport function TabsPanel({ tabId, isSelected, className, getTabElementId, getPanelElementId, children }: TabsPanelProps) {\n\treturn (\n\t\t<div\n\t\t\trole=\"tabpanel\"\n\t\t\tid={getPanelElementId(tabId)}\n\t\t\taria-labelledby={getTabElementId(tabId)}\n\t\t\thidden={!isSelected}\n\t\t\tclassName={className}>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n","import { ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { OneStepScroller } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\nimport type { TabsDescriptor } from \"../model/types\";\nimport type { TabsStateModel } from \"../model/useTabsState\";\n\n/**\n * Рендерит tablist и кнопки вкладок поверх общей модели tabs.\n */\ninterface TabsTabListProps {\n\titems: TabsDescriptor[];\n\tstate: TabsStateModel;\n\tclassName?: string;\n\tariaLabel?: string;\n\tariaLabelledBy?: string;\n}\n\nexport function TabsTabList({ items, state, className, ariaLabel, ariaLabelledBy }: TabsTabListProps) {\n\tconst wrapItems = (children: ReactNode) => {\n\t\tif (state.orientation === \"horizontal\") {\n\t\t\treturn <OneStepScroller>{children}</OneStepScroller>;\n\t\t}\n\n\t\treturn <>{children}</>;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={className}\n\t\t\trole=\"tablist\"\n\t\t\taria-orientation={state.orientation}\n\t\t\taria-label={ariaLabel}\n\t\t\taria-labelledby={ariaLabelledBy}\n\t\t\tonKeyDown={state.onTabListKeyDown}\n\t\t\tonBlur={state.onTabListBlur}>\n\t\t\t{wrapItems(\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<button\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t{...state.getTabButtonProps(item)}\n\t\t\t\t\t\tdata-ui=\"tabs-tab\"\n\t\t\t\t\t\tdata-action=\"select-tab\"\n\t\t\t\t\t\tclassName={cn(styles.tab, \"textWrap\", item.id === state.selectedTabId && styles.selected)}>\n\t\t\t\t\t\t{item.title}\n\t\t\t\t\t</button>\n\t\t\t\t))\n\t\t\t)}\n\t\t</div>\n\t);\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { TabsBoxProps } from \"../model/types\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsLoadingState } from \"./TabsLoadingState\";\nimport { TabsNoDataState } from \"./TabsNoDataState\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\n/**\n * Простой items-based tabs-компонент.\n * Сам управляет областью панели и её прокруткой.\n */\nexport function TabsBox({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\tisLoading,\n\tloadingText,\n\tcleanPanel,\n\tbordered = false,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tmountStrategy = \"unmount\",\n\tloop = true,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}: TabsBoxProps) {\n\tconst state = useTabsState({\n\t\titems,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tstyles[orientation],\n\t\tbordered && styles.bordered,\n\t\tcleanPanel && styles.cleanPanel,\n\t\tclassName\n\t);\n\tconst tabListClassName = styles.tabs;\n\tconst panelsClassName = cn(styles.panels, styles.panelScrollable, \"scrollable overscroll\");\n\tconst panelClassName = styles.panel;\n\tconst panelBodyClassName = styles.panelBody;\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<TabsLoadingState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\ttabListClassName={tabListClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t\tloadingText={loadingText}\n\t\t\t/>\n\t\t);\n\t}\n\n\tif (!items.length) {\n\t\treturn (\n\t\t\t<TabsNoDataState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={items} state={state} className={tabListClassName} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{items.map((item) => {\n\t\t\t\t\tconst isSelected = item.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(item.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\ttabId={item.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={panelClassName}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={panelBodyClassName}>{item.content}</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { TabsBox } from \"./TabsBox\";\n\nimport type { TabsBoxItem, TabsBoxProps } from \"../model/types\";\n\n/**\n * Элемент вкладки для устаревшего совместимого API `Tabs`.\n */\nexport type TabsItem = TabsBoxItem;\n\n/**\n * @deprecated Используйте `TabsBox` для простого сценария и `TabsLayout` для составных layout-сценариев.\n */\nexport interface TabsProps extends TabsBoxProps {\n\tonChange?: (value: string) => void;\n}\n\n/**\n * @deprecated Используйте `TabsBox` для простого сценария и `TabsLayout` для составных layout-сценариев.\n */\nexport function Tabs({ onChange, onValueChange, ...props }: TabsProps) {\n\treturn (\n\t\t<TabsBox\n\t\t\t{...props}\n\t\t\tonValueChange={(nextValue) => {\n\t\t\t\tonValueChange?.(nextValue);\n\t\t\t\tonChange?.(nextValue);\n\t\t\t}}\n\t\t/>\n\t);\n}\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { Children, isValidElement, useMemo } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\nimport type { TabsDescriptor, TabsLayoutProps, TabsLayoutSectionProps, TabsLayoutTabProps } from \"../model/types\";\n\ninterface ParsedTabsLayoutTab extends TabsDescriptor {\n\ttoolbar: TabsLayoutSectionProps | null;\n\tcontent: TabsLayoutSectionProps;\n\tfooter: TabsLayoutSectionProps | null;\n}\n\nconst tabsLayoutTabDisplayName = \"TabsLayout.Tab\";\nconst tabsLayoutToolbarDisplayName = \"TabsLayout.Toolbar\";\nconst tabsLayoutContentDisplayName = \"TabsLayout.Content\";\nconst tabsLayoutFooterDisplayName = \"TabsLayout.Footer\";\n\n/**\n * Возвращает стабильный displayName compound-элемента.\n * Это нужно для корректной работы HMR, где ссылочное сравнение `child.type` может ломаться.\n */\nfunction getTabsLayoutElementDisplayName(child: React.ReactElement) {\n\tconst { type } = child;\n\n\tif (typeof type === \"function\") {\n\t\tconst componentType = type as React.JSXElementConstructor<unknown> & {\n\t\t\tdisplayName?: string;\n\t\t\tname?: string;\n\t\t};\n\n\t\treturn componentType.displayName ?? componentType.name ?? null;\n\t}\n\n\tif (typeof type === \"object\" && type !== null && \"displayName\" in type) {\n\t\tconst componentType = type as {\n\t\t\tdisplayName?: string;\n\t\t};\n\n\t\treturn typeof componentType.displayName === \"string\" ? componentType.displayName : null;\n\t}\n\n\treturn null;\n}\n\nfunction isTabsLayoutElement<Props>(child: React.ReactNode, displayName: string): child is React.ReactElement<Props> {\n\treturn isValidElement<Props>(child) && getTabsLayoutElementDisplayName(child) === displayName;\n}\n\n/**\n * Маркер верхнеуровневой вкладки в compound-режиме `TabsLayout`.\n */\nfunction TabsLayoutTab({ children }: TabsLayoutTabProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutTab.displayName = tabsLayoutTabDisplayName;\n\n/**\n * Верхняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutToolbar({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutToolbar.displayName = tabsLayoutToolbarDisplayName;\n\n/**\n * Основное содержимое панели, которое само управляет своим layout и scroll.\n */\nfunction TabsLayoutContent({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutContent.displayName = tabsLayoutContentDisplayName;\n\n/**\n * Нижняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutFooter({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutFooter.displayName = tabsLayoutFooterDisplayName;\n\nfunction parseTabsLayoutSections(children: React.ReactNode, tabId: string) {\n\tlet toolbar: TabsLayoutSectionProps | null = null;\n\tlet content: TabsLayoutSectionProps | null = null;\n\tlet footer: TabsLayoutSectionProps | null = null;\n\n\tfor (const child of Children.toArray(children)) {\n\t\tif (!isValidElement(child)) {\n\t\t\tthrow new Error(\n\t\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t\t);\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutToolbarDisplayName)) {\n\t\t\tif (toolbar) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Toolbar.`);\n\t\t\t}\n\n\t\t\ttoolbar = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutContentDisplayName)) {\n\t\t\tif (content) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Content.`);\n\t\t\t}\n\n\t\t\tcontent = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutFooterDisplayName)) {\n\t\t\tif (footer) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Footer.`);\n\t\t\t}\n\n\t\t\tfooter = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tthrow new Error(\n\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t);\n\t}\n\n\tif (!content) {\n\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" должен содержать блок TabsLayout.Content.`);\n\t}\n\n\treturn { toolbar, content, footer };\n}\n\nfunction parseTabsLayoutChildren(children: React.ReactNode): ParsedTabsLayoutTab[] {\n\treturn Children.toArray(children).map((child) => {\n\t\tif (!isTabsLayoutElement<TabsLayoutTabProps>(child, tabsLayoutTabDisplayName)) {\n\t\t\tthrow new Error(\"TabsLayout принимает только дочерние элементы TabsLayout.Tab.\");\n\t\t}\n\n\t\treturn {\n\t\t\tid: child.props.id,\n\t\t\ttitle: child.props.title,\n\t\t\tdisabled: child.props.disabled,\n\t\t\t...parseTabsLayoutSections(child.props.children, child.props.id)\n\t\t};\n\t});\n}\n\ntype TabsLayoutComposition = React.FC<TabsLayoutProps> & {\n\tTab: typeof TabsLayoutTab;\n\tToolbar: typeof TabsLayoutToolbar;\n\tContent: typeof TabsLayoutContent;\n\tFooter: typeof TabsLayoutFooter;\n};\n\n/**\n * Compound-оболочка tabs для составных panel-layout сценариев.\n * Сам компонент управляет только переключением и каркасом панели.\n */\nconst TabsLayoutRoot: React.FC<TabsLayoutProps> = ({\n\tchildren,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\tbordered,\n\tcleanPanel,\n\torientation = \"horizontal\",\n\tactivationMode = \"manual\",\n\tmountStrategy = \"lazy\",\n\tloop = true,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}) => {\n\tconst tabs = useMemo(() => parseTabsLayoutChildren(children), [children]);\n\tconst state = useTabsState({\n\t\titems: tabs,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tstyles[orientation],\n\t\tbordered && styles.bordered,\n\t\tcleanPanel && styles.cleanPanel,\n\t\tclassName\n\t);\n\tconst panelsClassName = cn(styles.panels, styles.layoutPanels);\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={tabs} state={state} className={styles.tabs} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{tabs.map((tab) => {\n\t\t\t\t\tconst isSelected = tab.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(tab.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst templateRows = `${tab.toolbar ? \"auto \" : \"\"}minmax(0, 1fr)${tab.footer ? \" auto\" : \"\"}`;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={tab.id}\n\t\t\t\t\t\t\ttabId={tab.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={styles.panel}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={styles.layoutPanel} style={{ gridTemplateRows: templateRows }}>\n\t\t\t\t\t\t\t\t{tab.toolbar ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.toolbar.className)}>{tab.toolbar.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, styles.layoutContent, tab.content.className)}>\n\t\t\t\t\t\t\t\t\t{tab.content.children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{tab.footer ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.footer.className)}>{tab.footer.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nTabsLayoutRoot.displayName = \"TabsLayout\";\n\nexport const TabsLayout = Object.assign(TabsLayoutRoot, {\n\tTab: TabsLayoutTab,\n\tToolbar: TabsLayoutToolbar,\n\tContent: TabsLayoutContent,\n\tFooter: TabsLayoutFooter\n}) as TabsLayoutComposition;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/tabs/lib/tabs.ts","../../src/tabs/model/useTabsState.ts","../../src/tabs/ui/Tabs.module.scss","../../src/tabs/ui/TabsLoadingState.tsx","../../src/tabs/ui/TabsNoDataState.tsx","../../src/tabs/ui/TabsPanel.tsx","../../src/tabs/ui/TabsTabList.tsx","../../src/tabs/ui/TabsBox.tsx","../../src/tabs/ui/TabsLayout.tsx"],"sourcesContent":["import type { TabsDescriptor, TabsMountStrategy } from \"../model/types\";\n\n/**\n * Возвращает идентификатор первой доступной вкладки.\n */\nexport function getFirstEnabledTabId(items: TabsDescriptor[]) {\n\treturn items.find((item) => !item.disabled)?.id ?? null;\n}\n\n/**\n * Возвращает безопасный идентификатор вкладки.\n * Если переданный `candidate` недоступен, выбирается первая доступная вкладка.\n */\nexport function getSafeTabId(items: TabsDescriptor[], candidate: string | undefined | null) {\n\tif (!candidate) {\n\t\treturn getFirstEnabledTabId(items);\n\t}\n\n\tconst matchedItem = items.find((item) => item.id === candidate && !item.disabled);\n\treturn matchedItem?.id ?? getFirstEnabledTabId(items);\n}\n\n/**\n * Возвращает только доступные вкладки для roving focus и клавиатурной навигации.\n */\nexport function getEnabledTabs(items: TabsDescriptor[]) {\n\treturn items.filter((item) => !item.disabled);\n}\n\ninterface ShouldMountTabPanelOptions {\n\tmountStrategy: TabsMountStrategy;\n\tisSelected: boolean;\n\tisVisited: boolean;\n}\n\n/**\n * Определяет, должна ли панель оставаться смонтированной с учётом стратегии монтирования.\n */\nexport function shouldMountTabPanel({ mountStrategy, isSelected, isVisited }: ShouldMountTabPanelOptions) {\n\treturn mountStrategy === \"keep-mounted\" || isSelected || (mountStrategy === \"lazy\" && isVisited);\n}\n","import type React from \"react\";\nimport { FocusEvent, KeyboardEvent, useId, useMemo, useRef, useState } from \"react\";\n\nimport { getRovingFocusTargetIndex } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { getEnabledTabs, getSafeTabId } from \"../lib/tabs\";\n\nimport type { TabsActivationMode, TabsDescriptor, TabsOrientation } from \"./types\";\n\ninterface UseTabsStateOptions {\n\titems: TabsDescriptor[];\n\tvalue?: string;\n\tdefaultValue?: string;\n\tonValueChange?: (value: string) => void;\n\torientation?: TabsOrientation;\n\tactivationMode?: TabsActivationMode;\n\tloop?: boolean;\n}\n\n/**\n * Публичная часть модели, необходимая визуальным подкомпонентам tabs.\n */\nexport interface TabsStateModel {\n\tactivationMode: TabsActivationMode;\n\torientation: TabsOrientation;\n\tselectedTabId: string | null;\n\ttabbableTabId: string | null;\n\tonTabListKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void;\n\tonTabListBlur: (event: FocusEvent<HTMLDivElement>) => void;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tgetTabButtonProps: (item: TabsDescriptor) => React.ButtonHTMLAttributes<HTMLButtonElement> & {\n\t\tref: (node: HTMLButtonElement | null) => void;\n\t};\n\tisVisited: (tabId: string) => boolean;\n}\n\n/**\n * Инкапсулирует state, a11y-связки и клавиатурную навигацию для всех оболочек tabs.\n */\nexport function useTabsState({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tloop = true\n}: UseTabsStateOptions): TabsStateModel {\n\tconst isControlled = value !== undefined;\n\tconst enabledTabs = useMemo(() => getEnabledTabs(items), [items]);\n\tconst fallbackTabId = enabledTabs[0]?.id ?? null;\n\tconst [internalValue, setInternalValue] = useState(() => getSafeTabId(items, defaultValue));\n\tconst [focusedTabId, setFocusedTabId] = useState<string | null>(() => getSafeTabId(items, value ?? defaultValue));\n\tconst initialVisitedTabId = getSafeTabId(items, value ?? defaultValue);\n\tconst [visitedTabsState, setVisitedTabsState] = useState<Set<string>>(() =>\n\t\tinitialVisitedTabId ? new Set([initialVisitedTabId]) : new Set()\n\t);\n\tconst tabsId = useId();\n\tconst tabRefs = useRef<Record<string, HTMLButtonElement | null>>({});\n\n\tconst selectedTabId = getSafeTabId(items, isControlled ? value : internalValue);\n\tconst nextTabbableTabId = getSafeTabId(items, focusedTabId) ?? selectedTabId ?? fallbackTabId;\n\tconst visitedTabs = useMemo(() => {\n\t\tif (!selectedTabId || visitedTabsState.has(selectedTabId)) {\n\t\t\treturn visitedTabsState;\n\t\t}\n\n\t\tconst next = new Set(visitedTabsState);\n\t\tnext.add(selectedTabId);\n\t\treturn next;\n\t}, [selectedTabId, visitedTabsState]);\n\n\tconst activateTab = (nextTabId: string) => {\n\t\tconst safeNextTabId = getSafeTabId(items, nextTabId);\n\t\tif (!safeNextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetVisitedTabsState((prev) => {\n\t\t\tif (prev.has(safeNextTabId)) {\n\t\t\t\treturn prev;\n\t\t\t}\n\n\t\t\tconst next = new Set(prev);\n\t\t\tnext.add(safeNextTabId);\n\t\t\treturn next;\n\t\t});\n\n\t\tif (!isControlled) {\n\t\t\tsetInternalValue(safeNextTabId);\n\t\t}\n\n\t\tonValueChange?.(safeNextTabId);\n\t};\n\n\tconst focusTab = (nextTabId: string) => {\n\t\ttabRefs.current[nextTabId]?.focus();\n\t};\n\n\tconst onTabListKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n\t\tif (enabledTabs.length < 2) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeFocusIndex = Math.max(\n\t\t\t0,\n\t\t\tenabledTabs.findIndex((item) => item.id === (nextTabbableTabId ?? selectedTabId ?? fallbackTabId))\n\t\t);\n\t\tconst nextEnabledIndex = getRovingFocusTargetIndex({\n\t\t\tcurrentIndex: activeFocusIndex,\n\t\t\titemCount: enabledTabs.length,\n\t\t\tkey: event.key,\n\t\t\torientation,\n\t\t\twrap: loop\n\t\t});\n\n\t\tif (nextEnabledIndex === null) {\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\n\t\tconst nextTabId = enabledTabs[nextEnabledIndex]?.id;\n\t\tif (!nextTabId) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(nextTabId);\n\t\tfocusTab(nextTabId);\n\n\t\tif (activationMode === \"automatic\") {\n\t\t\tactivateTab(nextTabId);\n\t\t}\n\t};\n\n\tconst onTabListBlur = (event: FocusEvent<HTMLDivElement>) => {\n\t\tconst nextTarget = event.relatedTarget;\n\n\t\tif (nextTarget instanceof Node && event.currentTarget.contains(nextTarget)) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetFocusedTabId(selectedTabId ?? fallbackTabId);\n\t};\n\n\tconst getTabElementId = (tabId: string) => `${tabsId}-tab-${tabId}`;\n\tconst getPanelElementId = (tabId: string) => `${tabsId}-panel-${tabId}`;\n\n\tconst getTabButtonProps = (item: TabsDescriptor) => {\n\t\tconst isSelected = item.id === selectedTabId;\n\t\tconst isTabbable = item.id === nextTabbableTabId;\n\n\t\treturn {\n\t\t\tref: (node: HTMLButtonElement | null) => {\n\t\t\t\ttabRefs.current[item.id] = node;\n\t\t\t},\n\t\t\ttype: \"button\" as const,\n\t\t\trole: \"tab\" as const,\n\t\t\tid: getTabElementId(item.id),\n\t\t\tdisabled: item.disabled,\n\t\t\t\"aria-selected\": isSelected,\n\t\t\t\"aria-controls\": getPanelElementId(item.id),\n\t\t\t\"aria-disabled\": item.disabled || undefined,\n\t\t\ttabIndex: item.disabled ? -1 : isTabbable ? 0 : -1,\n\t\t\tonFocus: () => setFocusedTabId(item.id),\n\t\t\tonClick: () => activateTab(item.id)\n\t\t};\n\t};\n\n\treturn {\n\t\tactivationMode,\n\t\torientation,\n\t\tselectedTabId,\n\t\ttabbableTabId: nextTabbableTabId,\n\t\tonTabListKeyDown,\n\t\tonTabListBlur,\n\t\tgetTabElementId,\n\t\tgetPanelElementId,\n\t\tgetTabButtonProps,\n\t\tisVisited: (tabId: string) => visitedTabs.has(tabId)\n\t};\n}\n",".tabsContainer {\n\t--tabs-border: var(--border);\n\t--tabs-panel-padding: var(--space-md);\n\n\tdisplay: grid;\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\toverflow: hidden;\n\n\t&.clean {\n\t\t--tabs-border: none;\n\t\t--tabs-panel-padding: 0;\n\t}\n}\n\n.tabs {\n\tdisplay: flex;\n\tmin-width: 0;\n\n\tborder: var(--tabs-border);\n\tbackground-color: var(--surface-1);\n}\n\n.panels {\n\tmin-width: 0;\n\tmin-height: 0;\n\tborder: var(--tabs-border);\n}\n\n.horizontal {\n\tgrid-template-rows: auto minmax(0, 1fr);\n\n\t.tabs {\n\t\tpadding: var(--space-sm);\n\n\t\tborder-top-left-radius: var(--radius-sm);\n\t\tborder-top-right-radius: var(--radius-sm);\n\t}\n\n\t.panels {\n\t\tborder-top: none;\n\n\t\tborder-bottom-left-radius: var(--radius-sm);\n\t\tborder-bottom-right-radius: var(--radius-sm);\n\t}\n\n\t.tab {\n\t\t&::before {\n\t\t\tcontent: \"\";\n\t\t\tposition: absolute;\n\t\t\tbottom: 0;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\tborder-bottom: var(--focus-width) solid var(--decoration-color);\n\t\t}\n\t}\n}\n\n.vertical {\n\tgrid-template-columns: 10em minmax(0, 1fr);\n\tmin-height: 0;\n\n\t.tabs {\n\t\tflex-direction: column;\n\n\t\tborder-top-left-radius: var(--radius-sm);\n\t\tborder-bottom-left-radius: var(--radius-sm);\n\t}\n\n\t.panels {\n\t\tborder-left: none;\n\n\t\tborder-top-right-radius: var(--radius-sm);\n\t\tborder-bottom-right-radius: var(--radius-sm);\n\t}\n\n\t// .tab {\n\t// \t&::before {\n\t// \t\tcontent: \"\";\n\t// \t\tposition: absolute;\n\t// \t\ttop: 0;\n\t// \t\tbottom: 0;\n\t// \t\tright: 0;\n\t// \t\tborder-right: var(--focus-width) solid var(--decoration-color);\n\t// \t}\n\t// }\n}\n\n.panelScrollable {\n\toverflow: auto;\n}\n\n.tab {\n\t--decoration-color: transparent;\n\n\ttext-align: left;\n\n\tposition: relative;\n\tmin-height: var(--control-height);\n\tpadding: var(--space-xs) var(--space-md);\n\tcolor: var(--content-2);\n\tborder-radius: var(--radius-sm);\n\tfont-weight: 700;\n\tfont-variation-settings: \"wght\" 700;\n\n\tflex-shrink: 0;\n\n\t&:hover {\n\t\tcursor: pointer;\n\t\tcolor: var(--content-accent);\n\t\t// background-color: var(--surface-accent);\n\t\t--decoration-color: var(--border-accent);\n\t}\n\n\t&.selected {\n\t\tcolor: var(--status-brand-text);\n\t\t// color: var(--content-0);\n\t\t// background-color: var(--status-brand-fill);\n\t\t--decoration-color: var(--status-brand-border);\n\t}\n\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t\tcolor: var(--content-2);\n\t\tbackground-color: var(--surface-2);\n\t}\n}\n\n.panel {\n\tpadding: 0;\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n}\n\n.panelBody {\n\tmin-width: 0;\n\tmin-height: 0;\n\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutPanels {\n\toverflow: hidden;\n}\n\n.layoutPanel {\n\tdisplay: grid;\n\tgap: var(--space-md);\n\tmin-width: 0;\n\tmin-height: 0;\n\theight: 100%;\n\tpadding: var(--tabs-panel-padding);\n}\n\n.layoutSection {\n\tmin-width: 0;\n}\n\n.layoutContent {\n\tmin-height: 0;\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { LoadingMessage } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\ninterface TabsLoadingStateProps {\n\tcontainerClassName: string;\n\ttabListClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n\tloadingText?: string;\n}\n\n/**\n * Служебное loading-состояние для `TabsBox`.\n */\nexport function TabsLoadingState({\n\tcontainerClassName,\n\ttabListClassName,\n\tpanelsClassName,\n\tpanelClassName,\n\tpanelBodyClassName,\n\tloadingText\n}: TabsLoadingStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={tabListClassName} aria-hidden=\"true\">\n\t\t\t\t<button type=\"button\" disabled data-disabled=\"\" className={cn(styles.tab, \"skeletonLine\")}>\n\t\t\t\t\tЗагрузка...\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div className={panelsClassName} aria-busy=\"true\">\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<LoadingMessage text={loadingText} className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import { NoData } from \"../../misc\";\n\ninterface TabsNoDataStateProps {\n\tcontainerClassName: string;\n\tpanelsClassName: string;\n\tpanelClassName: string;\n\tpanelBodyClassName: string;\n}\n\n/**\n * Служебное empty-состояние для `TabsBox`.\n */\nexport function TabsNoDataState({ containerClassName, panelsClassName, panelClassName, panelBodyClassName }: TabsNoDataStateProps) {\n\treturn (\n\t\t<div className={containerClassName}>\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t<div className={panelClassName}>\n\t\t\t\t\t<div className={panelBodyClassName}>\n\t\t\t\t\t\t<NoData className=\"radiusSm\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","import React from \"react\";\n\n/**\n * Унифицированная ARIA-обёртка для содержимого активной панели tabs.\n */\ninterface TabsPanelProps {\n\ttabId: string;\n\tisSelected: boolean;\n\tclassName?: string;\n\tgetTabElementId: (tabId: string) => string;\n\tgetPanelElementId: (tabId: string) => string;\n\tchildren: React.ReactNode;\n}\n\nexport function TabsPanel({ tabId, isSelected, className, getTabElementId, getPanelElementId, children }: TabsPanelProps) {\n\treturn (\n\t\t<div\n\t\t\trole=\"tabpanel\"\n\t\t\tid={getPanelElementId(tabId)}\n\t\t\taria-labelledby={getTabElementId(tabId)}\n\t\t\thidden={!isSelected}\n\t\t\tclassName={className}>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n","import { ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { OneStepScroller } from \"../../misc\";\n\nimport styles from \"./Tabs.module.scss\";\n\nimport type { TabsDescriptor } from \"../model/types\";\nimport type { TabsStateModel } from \"../model/useTabsState\";\n\n/**\n * Рендерит tablist и кнопки вкладок поверх общей модели tabs.\n */\ninterface TabsTabListProps {\n\titems: TabsDescriptor[];\n\tstate: TabsStateModel;\n\tclassName?: string;\n\tariaLabel?: string;\n\tariaLabelledBy?: string;\n}\n\nexport function TabsTabList({ items, state, className, ariaLabel, ariaLabelledBy }: TabsTabListProps) {\n\tconst wrapItems = (children: ReactNode) => {\n\t\tif (state.orientation === \"horizontal\") {\n\t\t\treturn <OneStepScroller>{children}</OneStepScroller>;\n\t\t}\n\n\t\treturn <>{children}</>;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={className}\n\t\t\trole=\"tablist\"\n\t\t\taria-orientation={state.orientation}\n\t\t\taria-label={ariaLabel}\n\t\t\taria-labelledby={ariaLabelledBy}\n\t\t\tonKeyDown={state.onTabListKeyDown}\n\t\t\tonBlur={state.onTabListBlur}>\n\t\t\t{wrapItems(\n\t\t\t\titems.map((item) => (\n\t\t\t\t\t<button\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t{...state.getTabButtonProps(item)}\n\t\t\t\t\t\tdata-ui=\"tabs-tab\"\n\t\t\t\t\t\tdata-action=\"select-tab\"\n\t\t\t\t\t\tclassName={cn(styles.tab, \"textWrap\", item.id === state.selectedTabId && styles.selected)}>\n\t\t\t\t\t\t{item.title}\n\t\t\t\t\t</button>\n\t\t\t\t))\n\t\t\t)}\n\t\t</div>\n\t);\n}\n","import { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../../ui.module.scss\";\nimport { getUiPanelToneClassName } from \"../../uiClasses\";\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { TabsBoxProps } from \"../model/types\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsLoadingState } from \"./TabsLoadingState\";\nimport { TabsNoDataState } from \"./TabsNoDataState\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\n/**\n * Простой items-based tabs-компонент.\n * Сам управляет областью панели и её прокруткой.\n */\nexport function TabsBox({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\tisLoading,\n\tloadingText,\n\torientation = \"horizontal\",\n\tactivationMode = \"automatic\",\n\tmountStrategy = \"unmount\",\n\tloop = true,\n\ttone = \"primary\",\n\tclean = false,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}: TabsBoxProps) {\n\tconst state = useTabsState({\n\t\titems,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tclean ? styles.clean : uiStyles.uiFilledPanel,\n\t\tstyles[orientation],\n\t\tgetUiPanelToneClassName(tone),\n\t\tclassName\n\t);\n\tconst tabListClassName = styles.tabs;\n\tconst panelsClassName = cn(styles.panels, styles.panelScrollable, \"scrollable overscroll\");\n\tconst panelClassName = styles.panel;\n\tconst panelBodyClassName = styles.panelBody;\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<TabsLoadingState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\ttabListClassName={tabListClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t\tloadingText={loadingText}\n\t\t\t/>\n\t\t);\n\t}\n\n\tif (!items.length) {\n\t\treturn (\n\t\t\t<TabsNoDataState\n\t\t\t\tcontainerClassName={rootClassName}\n\t\t\t\tpanelsClassName={panelsClassName}\n\t\t\t\tpanelClassName={panelClassName}\n\t\t\t\tpanelBodyClassName={panelBodyClassName}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={items} state={state} className={tabListClassName} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{items.map((item) => {\n\t\t\t\t\tconst isSelected = item.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(item.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t\ttabId={item.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={panelClassName}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={panelBodyClassName}>{item.content}</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { Children, isValidElement, useMemo } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport uiStyles from \"../../ui.module.scss\";\nimport { getUiPanelToneClassName } from \"../../uiClasses\";\nimport { shouldMountTabPanel } from \"../lib/tabs\";\nimport { useTabsState } from \"../model/useTabsState\";\n\nimport styles from \"./Tabs.module.scss\";\nimport { TabsPanel } from \"./TabsPanel\";\nimport { TabsTabList } from \"./TabsTabList\";\n\nimport type { TabsDescriptor, TabsLayoutProps, TabsLayoutSectionProps, TabsLayoutTabProps } from \"../model/types\";\n\ninterface ParsedTabsLayoutTab extends TabsDescriptor {\n\ttoolbar: TabsLayoutSectionProps | null;\n\tcontent: TabsLayoutSectionProps;\n\tfooter: TabsLayoutSectionProps | null;\n}\n\nconst tabsLayoutTabDisplayName = \"TabsLayout.Tab\";\nconst tabsLayoutToolbarDisplayName = \"TabsLayout.Toolbar\";\nconst tabsLayoutContentDisplayName = \"TabsLayout.Content\";\nconst tabsLayoutFooterDisplayName = \"TabsLayout.Footer\";\n\n/**\n * Возвращает стабильный displayName compound-элемента.\n * Это нужно для корректной работы HMR, где ссылочное сравнение `child.type` может ломаться.\n */\nfunction getTabsLayoutElementDisplayName(child: React.ReactElement) {\n\tconst { type } = child;\n\n\tif (typeof type === \"function\") {\n\t\tconst componentType = type as React.JSXElementConstructor<unknown> & {\n\t\t\tdisplayName?: string;\n\t\t\tname?: string;\n\t\t};\n\n\t\treturn componentType.displayName ?? componentType.name ?? null;\n\t}\n\n\tif (typeof type === \"object\" && type !== null && \"displayName\" in type) {\n\t\tconst componentType = type as {\n\t\t\tdisplayName?: string;\n\t\t};\n\n\t\treturn typeof componentType.displayName === \"string\" ? componentType.displayName : null;\n\t}\n\n\treturn null;\n}\n\nfunction isTabsLayoutElement<Props>(child: React.ReactNode, displayName: string): child is React.ReactElement<Props> {\n\treturn isValidElement<Props>(child) && getTabsLayoutElementDisplayName(child) === displayName;\n}\n\n/**\n * Маркер верхнеуровневой вкладки в compound-режиме `TabsLayout`.\n */\nfunction TabsLayoutTab({ children }: TabsLayoutTabProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutTab.displayName = tabsLayoutTabDisplayName;\n\n/**\n * Верхняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutToolbar({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutToolbar.displayName = tabsLayoutToolbarDisplayName;\n\n/**\n * Основное содержимое панели, которое само управляет своим layout и scroll.\n */\nfunction TabsLayoutContent({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutContent.displayName = tabsLayoutContentDisplayName;\n\n/**\n * Нижняя секция панели, исключённая из прокручиваемого содержимого.\n */\nfunction TabsLayoutFooter({ children }: TabsLayoutSectionProps) {\n\treturn <>{children}</>;\n}\n\nTabsLayoutFooter.displayName = tabsLayoutFooterDisplayName;\n\nfunction parseTabsLayoutSections(children: React.ReactNode, tabId: string) {\n\tlet toolbar: TabsLayoutSectionProps | null = null;\n\tlet content: TabsLayoutSectionProps | null = null;\n\tlet footer: TabsLayoutSectionProps | null = null;\n\n\tfor (const child of Children.toArray(children)) {\n\t\tif (!isValidElement(child)) {\n\t\t\tthrow new Error(\n\t\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t\t);\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutToolbarDisplayName)) {\n\t\t\tif (toolbar) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Toolbar.`);\n\t\t\t}\n\n\t\t\ttoolbar = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutContentDisplayName)) {\n\t\t\tif (content) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Content.`);\n\t\t\t}\n\n\t\t\tcontent = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (isTabsLayoutElement<TabsLayoutSectionProps>(child, tabsLayoutFooterDisplayName)) {\n\t\t\tif (footer) {\n\t\t\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" содержит более одного блока TabsLayout.Footer.`);\n\t\t\t}\n\n\t\t\tfooter = child.props;\n\t\t\tcontinue;\n\t\t}\n\n\t\tthrow new Error(\n\t\t\t`TabsLayout.Tab \"${tabId}\" поддерживает только дочерние элементы TabsLayout.Toolbar, TabsLayout.Content и TabsLayout.Footer.`\n\t\t);\n\t}\n\n\tif (!content) {\n\t\tthrow new Error(`TabsLayout.Tab \"${tabId}\" должен содержать блок TabsLayout.Content.`);\n\t}\n\n\treturn { toolbar, content, footer };\n}\n\nfunction parseTabsLayoutChildren(children: React.ReactNode): ParsedTabsLayoutTab[] {\n\treturn Children.toArray(children).map((child) => {\n\t\tif (!isTabsLayoutElement<TabsLayoutTabProps>(child, tabsLayoutTabDisplayName)) {\n\t\t\tthrow new Error(\"TabsLayout принимает только дочерние элементы TabsLayout.Tab.\");\n\t\t}\n\n\t\treturn {\n\t\t\tid: child.props.id,\n\t\t\ttitle: child.props.title,\n\t\t\tdisabled: child.props.disabled,\n\t\t\t...parseTabsLayoutSections(child.props.children, child.props.id)\n\t\t};\n\t});\n}\n\ntype TabsLayoutComposition = React.FC<TabsLayoutProps> & {\n\tTab: typeof TabsLayoutTab;\n\tToolbar: typeof TabsLayoutToolbar;\n\tContent: typeof TabsLayoutContent;\n\tFooter: typeof TabsLayoutFooter;\n};\n\n/**\n * Compound-оболочка tabs для составных panel-layout сценариев.\n * Сам компонент управляет только переключением и каркасом панели.\n */\nconst TabsLayoutRoot: React.FC<TabsLayoutProps> = ({\n\tchildren,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tclassName,\n\torientation = \"horizontal\",\n\tactivationMode = \"manual\",\n\tmountStrategy = \"lazy\",\n\tloop = true,\n\ttone = \"primary\",\n\tclean = false,\n\t\"aria-label\": ariaLabel,\n\t\"aria-labelledby\": ariaLabelledBy\n}) => {\n\tconst tabs = useMemo(() => parseTabsLayoutChildren(children), [children]);\n\tconst state = useTabsState({\n\t\titems: tabs,\n\t\tvalue,\n\t\tdefaultValue,\n\t\tonValueChange,\n\t\torientation,\n\t\tactivationMode,\n\t\tloop\n\t});\n\tconst rootClassName = cn(\n\t\tstyles.tabsContainer,\n\t\tclean ? styles.clean : uiStyles.uiFilledPanel,\n\t\tstyles[orientation],\n\t\tgetUiPanelToneClassName(tone),\n\t\tclassName\n\t);\n\tconst panelsClassName = cn(styles.panels, styles.layoutPanels);\n\n\treturn (\n\t\t<div className={rootClassName}>\n\t\t\t<TabsTabList items={tabs} state={state} className={styles.tabs} ariaLabel={ariaLabel} ariaLabelledBy={ariaLabelledBy} />\n\n\t\t\t<div className={panelsClassName}>\n\t\t\t\t{tabs.map((tab) => {\n\t\t\t\t\tconst isSelected = tab.id === state.selectedTabId;\n\t\t\t\t\tconst isMounted = shouldMountTabPanel({\n\t\t\t\t\t\tmountStrategy,\n\t\t\t\t\t\tisSelected,\n\t\t\t\t\t\tisVisited: state.isVisited(tab.id)\n\t\t\t\t\t});\n\n\t\t\t\t\tif (!isMounted) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst templateRows = `${tab.toolbar ? \"auto \" : \"\"}minmax(0, 1fr)${tab.footer ? \" auto\" : \"\"}`;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TabsPanel\n\t\t\t\t\t\t\tkey={tab.id}\n\t\t\t\t\t\t\ttabId={tab.id}\n\t\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\t\tclassName={styles.panel}\n\t\t\t\t\t\t\tgetTabElementId={state.getTabElementId}\n\t\t\t\t\t\t\tgetPanelElementId={state.getPanelElementId}>\n\t\t\t\t\t\t\t<div className={styles.layoutPanel} style={{ gridTemplateRows: templateRows }}>\n\t\t\t\t\t\t\t\t{tab.toolbar ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.toolbar.className)}>{tab.toolbar.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, styles.layoutContent, tab.content.className)}>\n\t\t\t\t\t\t\t\t\t{tab.content.children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{tab.footer ? (\n\t\t\t\t\t\t\t\t\t<div className={cn(styles.layoutSection, tab.footer.className)}>{tab.footer.children}</div>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</TabsPanel>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nTabsLayoutRoot.displayName = \"TabsLayout\";\n\nexport const TabsLayout = Object.assign(TabsLayoutRoot, {\n\tTab: TabsLayoutTab,\n\tToolbar: TabsLayoutToolbar,\n\tContent: TabsLayoutContent,\n\tFooter: TabsLayoutFooter\n}) as TabsLayoutComposition;\n"],"mappings":"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"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { type ReactNode } from "react";
|
|
2
|
+
import { UiPanelTone } from "../../types";
|
|
2
3
|
/**
|
|
3
4
|
* Направление списка вкладок.
|
|
4
5
|
*/
|
|
@@ -16,7 +17,7 @@ export type TabsMountStrategy = "unmount" | "lazy" | "keep-mounted";
|
|
|
16
17
|
*/
|
|
17
18
|
export interface TabsDescriptor {
|
|
18
19
|
id: string;
|
|
19
|
-
title:
|
|
20
|
+
title: ReactNode;
|
|
20
21
|
disabled?: boolean;
|
|
21
22
|
}
|
|
22
23
|
/**
|
|
@@ -30,8 +31,8 @@ export interface TabsCommonProps {
|
|
|
30
31
|
activationMode?: TabsActivationMode;
|
|
31
32
|
mountStrategy?: TabsMountStrategy;
|
|
32
33
|
loop?: boolean;
|
|
33
|
-
|
|
34
|
-
|
|
34
|
+
tone?: UiPanelTone;
|
|
35
|
+
clean?: boolean;
|
|
35
36
|
className?: string;
|
|
36
37
|
"aria-label"?: string;
|
|
37
38
|
"aria-labelledby"?: string;
|
|
@@ -40,7 +41,7 @@ export interface TabsCommonProps {
|
|
|
40
41
|
* Элемент данных для простого сценария `TabsBox`.
|
|
41
42
|
*/
|
|
42
43
|
export interface TabsBoxItem extends TabsDescriptor {
|
|
43
|
-
content:
|
|
44
|
+
content: ReactNode;
|
|
44
45
|
}
|
|
45
46
|
/**
|
|
46
47
|
* Публичный API для простого items-based сценария tabs.
|
|
@@ -54,19 +55,19 @@ export interface TabsBoxProps extends TabsCommonProps {
|
|
|
54
55
|
* Пропсы секций compound-режима `TabsLayout`.
|
|
55
56
|
*/
|
|
56
57
|
export interface TabsLayoutSectionProps {
|
|
57
|
-
children:
|
|
58
|
+
children: ReactNode;
|
|
58
59
|
className?: string;
|
|
59
60
|
}
|
|
60
61
|
/**
|
|
61
62
|
* Описание одной вкладки в compound-режиме `TabsLayout`.
|
|
62
63
|
*/
|
|
63
64
|
export interface TabsLayoutTabProps extends TabsDescriptor {
|
|
64
|
-
children:
|
|
65
|
+
children: ReactNode;
|
|
65
66
|
}
|
|
66
67
|
/**
|
|
67
68
|
* Публичный API для compound-сценария `TabsLayout`.
|
|
68
69
|
*/
|
|
69
70
|
export interface TabsLayoutProps extends TabsCommonProps {
|
|
70
|
-
children:
|
|
71
|
+
children: ReactNode;
|
|
71
72
|
}
|
|
72
73
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/tabs/model/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/tabs/model/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,YAAY,GAAG,UAAU,CAAC;AAExD;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG,QAAQ,CAAC;AAExD;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,MAAM,GAAG,cAAc,CAAC;AAEpE;;GAEG;AACH,MAAM,WAAW,cAAc;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;GAEG;AACH,MAAM,WAAW,WAAY,SAAQ,cAAc;IAClD,OAAO,EAAE,SAAS,CAAC;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,YAAa,SAAQ,eAAe;IACpD,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACzD,QAAQ,EAAE,SAAS,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACvD,QAAQ,EAAE,SAAS,CAAC;CACpB"}
|
|
@@ -3,5 +3,5 @@ import { TabsBoxProps } from "../model/types";
|
|
|
3
3
|
* Простой items-based tabs-компонент.
|
|
4
4
|
* Сам управляет областью панели и её прокруткой.
|
|
5
5
|
*/
|
|
6
|
-
export declare function TabsBox({ items, value, defaultValue, onValueChange, className, isLoading, loadingText,
|
|
6
|
+
export declare function TabsBox({ items, value, defaultValue, onValueChange, className, isLoading, loadingText, orientation, activationMode, mountStrategy, loop, tone, clean, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy }: TabsBoxProps): import("react").JSX.Element;
|
|
7
7
|
//# sourceMappingURL=TabsBox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsBox.d.ts","sourceRoot":"","sources":["../../../src/tabs/ui/TabsBox.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabsBox.d.ts","sourceRoot":"","sources":["../../../src/tabs/ui/TabsBox.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAS9C;;;GAGG;AACH,wBAAgB,OAAO,CAAC,EACvB,KAAK,EACL,KAAK,EACL,YAAY,EACZ,aAAa,EACb,SAAS,EACT,SAAS,EACT,WAAW,EACX,WAA0B,EAC1B,cAA4B,EAC5B,aAAyB,EACzB,IAAW,EACX,IAAgB,EAChB,KAAa,EACb,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,EAAE,YAAY,+BA+Ed"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsLayout.d.ts","sourceRoot":"","sources":["../../../src/tabs/ui/TabsLayout.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"TabsLayout.d.ts","sourceRoot":"","sources":["../../../src/tabs/ui/TabsLayout.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAajE,OAAO,KAAK,EAAkB,eAAe,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AA4ClH;;GAEG;AACH,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,kBAAkB,qBAEtD;kBAFQ,aAAa;;;AAMtB;;GAEG;AACH,iBAAS,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE,sBAAsB,qBAE9D;kBAFQ,iBAAiB;;;AAM1B;;GAEG;AACH,iBAAS,iBAAiB,CAAC,EAAE,QAAQ,EAAE,EAAE,sBAAsB,qBAE9D;kBAFQ,iBAAiB;;;AAM1B;;GAEG;AACH,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE,sBAAsB,qBAE7D;kBAFQ,gBAAgB;;;AAwEzB,KAAK,qBAAqB,GAAG,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,GAAG;IACxD,GAAG,EAAE,OAAO,aAAa,CAAC;IAC1B,OAAO,EAAE,OAAO,iBAAiB,CAAC;IAClC,OAAO,EAAE,OAAO,iBAAiB,CAAC;IAClC,MAAM,EAAE,OAAO,gBAAgB,CAAC;CAChC,CAAC;AAwFF,eAAO,MAAM,UAAU,EAKjB,qBAAqB,CAAC"}
|
package/dist/tag-input/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { t as e } from "../chunks/ui.module-
|
|
2
|
-
import { l as t, s as n } from "../chunks/input-
|
|
1
|
+
import { t as e } from "../chunks/ui.module-DHVTOqZ0.js";
|
|
2
|
+
import { l as t, s as n } from "../chunks/input-BNszawm6.js";
|
|
3
3
|
import { useImperativeHandle as r, useRef as i, useState as a } from "react";
|
|
4
4
|
import { cn as o } from "@ryuzaki13/react-foundation-lib/utils";
|
|
5
5
|
import { XIcon as s } from "lucide-react";
|
package/dist/text/Text.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { CSSProperties } from "react";
|
|
2
2
|
export type TextSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
3
|
-
export type TextColor = "primary" | "secondary" | "muted" | "error" | "warning" | "success" | "info";
|
|
3
|
+
export type TextColor = "primary" | "secondary" | "muted" | "error" | "warning" | "success" | "info" | "brand" | "accent";
|
|
4
4
|
export type TextWeight = "lighter" | "light" | "regular" | "medium" | "bold" | "bolder";
|
|
5
5
|
export type TextWrap = "wrap" | "noWrap";
|
|
6
6
|
interface BaseTextProps {
|
package/dist/text/Text.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAW,MAAM,OAAO,CAAC;AAItD,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxD,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAW,MAAM,OAAO,CAAC;AAItD,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACxD,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAC1H,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;AACxF,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;AAoCzC,UAAU,aAAa;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACtB;AAED,UAAU,SAAU,SAAQ,aAAa;IACxC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,GAAG,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACtE;AA6BD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CASpC,CAAC"}
|
package/dist/text/index.js
CHANGED
|
@@ -11,7 +11,9 @@ var a = ({ text: e, highlight: t }) => t ? e.split(RegExp(`(${t})`, "gi")).map((
|
|
|
11
11
|
info: "statusInfo",
|
|
12
12
|
success: "statusSuccess",
|
|
13
13
|
warning: "statusWarning",
|
|
14
|
-
error: "statusError"
|
|
14
|
+
error: "statusError",
|
|
15
|
+
brand: "statusBrand",
|
|
16
|
+
accent: "contentAccent"
|
|
15
17
|
}, s = {
|
|
16
18
|
xs: "fontSizeXs",
|
|
17
19
|
sm: "fontSizeSm",
|
package/dist/text/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/text/HighlightText.tsx","../../src/text/Text.tsx","../../src/text/TextOverflow.tsx"],"sourcesContent":["export const HighlightText = ({ text, highlight }: { text: string; highlight?: string }) => {\n\tif (!highlight) return text;\n\treturn text\n\t\t.split(new RegExp(`(${highlight})`, \"gi\"))\n\t\t.map((part, i) => (part.toLowerCase() === highlight.toLowerCase() ? <mark key={i}>{part}</mark> : part));\n};\n","import React, { CSSProperties, useMemo } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextColor = \"primary\" | \"secondary\" | \"muted\" | \"error\" | \"warning\" | \"success\" | \"info\";\nexport type TextWeight = \"lighter\" | \"light\" | \"regular\" | \"medium\" | \"bold\" | \"bolder\";\nexport type TextWrap = \"wrap\" | \"noWrap\";\n\nconst textColors: Record<TextColor, string> = {\n\tprimary: \"content0\",\n\tsecondary: \"content1\",\n\tmuted: \"content2\",\n\tinfo: \"statusInfo\",\n\tsuccess: \"statusSuccess\",\n\twarning: \"statusWarning\",\n\terror: \"statusError\"\n};\n\nconst textSizes: Record<TextSize, string> = {\n\txs: \"fontSizeXs\",\n\tsm: \"fontSizeSm\",\n\tmd: \"fontSizeMd\",\n\tlg: \"fontSizeLg\",\n\txl: \"fontSizeXl\"\n};\n\nconst textWeights: Record<TextWeight, string> = {\n\tlighter: \"fontLighter\",\n\tlight: \"fontLight\",\n\tregular: \"fontRegular\",\n\tmedium: \"fontMedium\",\n\tbold: \"fontBold\",\n\tbolder: \"fontBolder\"\n};\n\nconst textWraps: Record<TextWrap, string> = {\n\twrap: \"textWrap\",\n\tnoWrap: \"textNoWrap\"\n};\n\ninterface BaseTextProps {\n\tsize?: TextSize;\n\tcolor?: TextColor;\n\tweight?: TextWeight;\n\titalic?: boolean;\n\tuppercase?: boolean;\n\twrap?: TextWrap;\n\tclassName?: string;\n\tstyle?: CSSProperties;\n}\n\ninterface TextProps extends BaseTextProps {\n\tchildren: React.ReactNode;\n\tas?: \"code\" | \"span\" | \"p\" | \"div\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n}\n\nconst useTextStyles = ({ size, color, weight, italic, uppercase, wrap, className }: BaseTextProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: string[] = [];\n\n\t\tif (size) {\n\t\t\tclasses.push(textSizes[size]);\n\t\t}\n\n\t\tif (weight) {\n\t\t\tclasses.push(textWeights[weight]);\n\t\t}\n\n\t\tif (wrap) {\n\t\t\tclasses.push(textWraps[wrap]);\n\t\t}\n\n\t\tif (italic) classes.push(\"fontItalic\");\n\t\tif (uppercase) classes.push(\"textUppercase\");\n\n\t\tif (color) {\n\t\t\tclasses.push(textColors[color]);\n\t\t}\n\n\t\treturn cn(...classes, className);\n\t}, [size, weight, color, italic, uppercase, wrap, className]);\n};\n\nexport const Text: React.FC<TextProps> = ({ children, as, style, ...props }) => {\n\tconst classes = useTextStyles(props);\n\tconst Component = as || \"span\";\n\n\treturn (\n\t\t<Component className={classes} style={style}>\n\t\t\t{children}\n\t\t</Component>\n\t);\n};\n","import { ComponentProps, ComponentType } from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\nimport { normalizeTextWithFallback } from \"@ryuzaki13/react-foundation-lib/formatters\";\n\nimport { FloatingPopover } from \"../popover\";\n\n// Базовые пропсы которые всегда будут\ninterface BaseTextOverflowProps {\n\tchildren: string;\n\tmaxChar?: number;\n\t/**\n\t * Максимальная ширина тултипа в em.\n\t */\n\tmaxWidth?: number;\n\tplacement?: Placement;\n\tcloseDelay?: number;\n\t/**\n\t * Для работы text-overflow элемент обязан быть блочным или inline-block.\n\t * Если в качестве обёртки передается инлайновый компонент, то он будет\n\t * перезаписан через стили на display: block или inline-block в зависимости\n\t * от установки данного пропса.\n\t */\n\tblock?: true;\n\tstate?: \"information\" | \"error\" | \"warning\" | \"success\" | \"negative\";\n}\n\n// Базовые пропсы которые должен принимать textWrap компонент\ninterface RequiredWrapperProps {\n\tstyle?: React.CSSProperties;\n\tclassName?: string;\n\tchildren: string;\n}\n\n// Дженерик для пропсов которые зависят от textWrap компонента\ninterface TextOverflowProps<\n\tT extends ComponentType<RequiredWrapperProps> = ComponentType<RequiredWrapperProps>\n> extends BaseTextOverflowProps {\n\ttextWrap?: T;\n\ttextWrapProps?: Omit<ComponentProps<T>, \"children\">;\n}\n\nexport function TextOverflow<T extends ComponentType<RequiredWrapperProps>>({\n\tmaxChar,\n\tplacement = \"left\",\n\tcloseDelay = 0,\n\tmaxWidth,\n\tchildren,\n\tblock,\n\tstate,\n\ttextWrap,\n\ttextWrapProps\n}: TextOverflowProps<T>) {\n\tconst textContent = normalizeTextWithFallback(children);\n\tif (!textContent.length || (maxChar && textContent.length < maxChar)) return <span>{textContent}</span>;\n\n\tconst TextWrapper = textWrap ?? \"div\";\n\n\tconst baseWrapperProps = {\n\t\tstyle: { display: block ? \"block\" : \"inline-block\", width: maxChar ? `${maxChar - 3}ch` : \"auto\" },\n\t\tclassName: \"textOverflow\"\n\t};\n\n\t// Правильный порядок слияния: baseWrapperProps приоритетнее\n\tconst mergedProps = {\n\t\t...textWrapProps,\n\t\t...baseWrapperProps,\n\t\tstyle: {\n\t\t\t...textWrapProps?.style,\n\t\t\t...baseWrapperProps.style // width приоритетнее\n\t\t},\n\t\tclassName: [textWrapProps?.className, baseWrapperProps.className].filter(Boolean).join(\" \")\n\t};\n\n\treturn (\n\t\t<FloatingPopover state={state} placement={placement} openOnHover content={textContent} closeDelay={closeDelay} maxWidth={maxWidth}>\n\t\t\t<TextWrapper {...mergedProps}>{textContent}</TextWrapper>\n\t\t</FloatingPopover>\n\t);\n}\n"],"mappings":";;;;;;AAAA,IAAa,KAAiB,EAAE,SAAM,mBAChC,IACE,EACL,MAAU,OAAO,IAAI,EAAU,IAAI,IAAI,CAAC,CAAC,CACzC,KAAK,GAAM,MAAO,EAAK,YAAY,MAAM,EAAU,YAAY,IAAI,kBAAC,QAAD,EAAA,UAAe,EAAW,GAAf,CAAe,IAAI,CAAK,IAHjF,GCQlB,IAAwC;CAC7C,SAAS;CACT,WAAW;CACX,OAAO;CACP,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/text/HighlightText.tsx","../../src/text/Text.tsx","../../src/text/TextOverflow.tsx"],"sourcesContent":["export const HighlightText = ({ text, highlight }: { text: string; highlight?: string }) => {\n\tif (!highlight) return text;\n\treturn text\n\t\t.split(new RegExp(`(${highlight})`, \"gi\"))\n\t\t.map((part, i) => (part.toLowerCase() === highlight.toLowerCase() ? <mark key={i}>{part}</mark> : part));\n};\n","import React, { CSSProperties, useMemo } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextColor = \"primary\" | \"secondary\" | \"muted\" | \"error\" | \"warning\" | \"success\" | \"info\" | \"brand\" | \"accent\";\nexport type TextWeight = \"lighter\" | \"light\" | \"regular\" | \"medium\" | \"bold\" | \"bolder\";\nexport type TextWrap = \"wrap\" | \"noWrap\";\n\nconst textColors: Record<TextColor, string> = {\n\tprimary: \"content0\",\n\tsecondary: \"content1\",\n\tmuted: \"content2\",\n\tinfo: \"statusInfo\",\n\tsuccess: \"statusSuccess\",\n\twarning: \"statusWarning\",\n\terror: \"statusError\",\n\tbrand: \"statusBrand\",\n\taccent: \"contentAccent\"\n};\n\nconst textSizes: Record<TextSize, string> = {\n\txs: \"fontSizeXs\",\n\tsm: \"fontSizeSm\",\n\tmd: \"fontSizeMd\",\n\tlg: \"fontSizeLg\",\n\txl: \"fontSizeXl\"\n};\n\nconst textWeights: Record<TextWeight, string> = {\n\tlighter: \"fontLighter\",\n\tlight: \"fontLight\",\n\tregular: \"fontRegular\",\n\tmedium: \"fontMedium\",\n\tbold: \"fontBold\",\n\tbolder: \"fontBolder\"\n};\n\nconst textWraps: Record<TextWrap, string> = {\n\twrap: \"textWrap\",\n\tnoWrap: \"textNoWrap\"\n};\n\ninterface BaseTextProps {\n\tsize?: TextSize;\n\tcolor?: TextColor;\n\tweight?: TextWeight;\n\titalic?: boolean;\n\tuppercase?: boolean;\n\twrap?: TextWrap;\n\tclassName?: string;\n\tstyle?: CSSProperties;\n}\n\ninterface TextProps extends BaseTextProps {\n\tchildren: React.ReactNode;\n\tas?: \"code\" | \"span\" | \"p\" | \"div\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n}\n\nconst useTextStyles = ({ size, color, weight, italic, uppercase, wrap, className }: BaseTextProps) => {\n\treturn useMemo(() => {\n\t\tconst classes: string[] = [];\n\n\t\tif (size) {\n\t\t\tclasses.push(textSizes[size]);\n\t\t}\n\n\t\tif (weight) {\n\t\t\tclasses.push(textWeights[weight]);\n\t\t}\n\n\t\tif (wrap) {\n\t\t\tclasses.push(textWraps[wrap]);\n\t\t}\n\n\t\tif (italic) classes.push(\"fontItalic\");\n\t\tif (uppercase) classes.push(\"textUppercase\");\n\n\t\tif (color) {\n\t\t\tclasses.push(textColors[color]);\n\t\t}\n\n\t\treturn cn(...classes, className);\n\t}, [size, weight, color, italic, uppercase, wrap, className]);\n};\n\nexport const Text: React.FC<TextProps> = ({ children, as, style, ...props }) => {\n\tconst classes = useTextStyles(props);\n\tconst Component = as || \"span\";\n\n\treturn (\n\t\t<Component className={classes} style={style}>\n\t\t\t{children}\n\t\t</Component>\n\t);\n};\n","import { ComponentProps, ComponentType } from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\nimport { normalizeTextWithFallback } from \"@ryuzaki13/react-foundation-lib/formatters\";\n\nimport { FloatingPopover } from \"../popover\";\n\n// Базовые пропсы которые всегда будут\ninterface BaseTextOverflowProps {\n\tchildren: string;\n\tmaxChar?: number;\n\t/**\n\t * Максимальная ширина тултипа в em.\n\t */\n\tmaxWidth?: number;\n\tplacement?: Placement;\n\tcloseDelay?: number;\n\t/**\n\t * Для работы text-overflow элемент обязан быть блочным или inline-block.\n\t * Если в качестве обёртки передается инлайновый компонент, то он будет\n\t * перезаписан через стили на display: block или inline-block в зависимости\n\t * от установки данного пропса.\n\t */\n\tblock?: true;\n\tstate?: \"information\" | \"error\" | \"warning\" | \"success\" | \"negative\";\n}\n\n// Базовые пропсы которые должен принимать textWrap компонент\ninterface RequiredWrapperProps {\n\tstyle?: React.CSSProperties;\n\tclassName?: string;\n\tchildren: string;\n}\n\n// Дженерик для пропсов которые зависят от textWrap компонента\ninterface TextOverflowProps<\n\tT extends ComponentType<RequiredWrapperProps> = ComponentType<RequiredWrapperProps>\n> extends BaseTextOverflowProps {\n\ttextWrap?: T;\n\ttextWrapProps?: Omit<ComponentProps<T>, \"children\">;\n}\n\nexport function TextOverflow<T extends ComponentType<RequiredWrapperProps>>({\n\tmaxChar,\n\tplacement = \"left\",\n\tcloseDelay = 0,\n\tmaxWidth,\n\tchildren,\n\tblock,\n\tstate,\n\ttextWrap,\n\ttextWrapProps\n}: TextOverflowProps<T>) {\n\tconst textContent = normalizeTextWithFallback(children);\n\tif (!textContent.length || (maxChar && textContent.length < maxChar)) return <span>{textContent}</span>;\n\n\tconst TextWrapper = textWrap ?? \"div\";\n\n\tconst baseWrapperProps = {\n\t\tstyle: { display: block ? \"block\" : \"inline-block\", width: maxChar ? `${maxChar - 3}ch` : \"auto\" },\n\t\tclassName: \"textOverflow\"\n\t};\n\n\t// Правильный порядок слияния: baseWrapperProps приоритетнее\n\tconst mergedProps = {\n\t\t...textWrapProps,\n\t\t...baseWrapperProps,\n\t\tstyle: {\n\t\t\t...textWrapProps?.style,\n\t\t\t...baseWrapperProps.style // width приоритетнее\n\t\t},\n\t\tclassName: [textWrapProps?.className, baseWrapperProps.className].filter(Boolean).join(\" \")\n\t};\n\n\treturn (\n\t\t<FloatingPopover state={state} placement={placement} openOnHover content={textContent} closeDelay={closeDelay} maxWidth={maxWidth}>\n\t\t\t<TextWrapper {...mergedProps}>{textContent}</TextWrapper>\n\t\t</FloatingPopover>\n\t);\n}\n"],"mappings":";;;;;;AAAA,IAAa,KAAiB,EAAE,SAAM,mBAChC,IACE,EACL,MAAU,OAAO,IAAI,EAAU,IAAI,IAAI,CAAC,CAAC,CACzC,KAAK,GAAM,MAAO,EAAK,YAAY,MAAM,EAAU,YAAY,IAAI,kBAAC,QAAD,EAAA,UAAe,EAAW,GAAf,CAAe,IAAI,CAAK,IAHjF,GCQlB,IAAwC;CAC7C,SAAS;CACT,WAAW;CACX,OAAO;CACP,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,OAAO;CACP,QAAQ;AACT,GAEM,IAAsC;CAC3C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACL,GAEM,IAA0C;CAC/C,SAAS;CACT,OAAO;CACP,SAAS;CACT,QAAQ;CACR,MAAM;CACN,QAAQ;AACT,GAEM,IAAsC;CAC3C,MAAM;CACN,QAAQ;AACT,GAkBM,KAAiB,EAAE,SAAM,UAAO,WAAQ,WAAQ,cAAW,SAAM,mBAC/D,QAAc;CACpB,IAAM,IAAoB,CAAC;CAqB3B,OAnBI,KACH,EAAQ,KAAK,EAAU,EAAK,GAGzB,KACH,EAAQ,KAAK,EAAY,EAAO,GAG7B,KACH,EAAQ,KAAK,EAAU,EAAK,GAGzB,KAAQ,EAAQ,KAAK,YAAY,GACjC,KAAW,EAAQ,KAAK,eAAe,GAEvC,KACH,EAAQ,KAAK,EAAW,EAAM,GAGxB,EAAG,GAAG,GAAS,CAAS;AAChC,GAAG;CAAC;CAAM;CAAQ;CAAO;CAAQ;CAAW;CAAM;AAAS,CAAC,GAGhD,KAA6B,EAAE,aAAU,OAAI,UAAO,GAAG,QAAY;CAC/E,IAAM,IAAU,EAAc,CAAK;CAGnC,OACC,kBAHiB,KAAM,QAGvB;EAAW,WAAW;EAAgB;EACpC;CACS,CAAA;AAEb;;;ACrDA,SAAgB,EAA4D,EAC3E,YACA,eAAY,QACZ,gBAAa,GACb,aACA,aACA,UACA,UACA,aACA,oBACwB;CACxB,IAAM,IAAc,EAA0B,CAAQ;CACtD,IAAI,CAAC,EAAY,UAAW,KAAW,EAAY,SAAS,GAAU,OAAO,kBAAC,QAAD,EAAA,UAAO,EAAkB,CAAA;CAEtG,IAAM,IAAc,KAAY,OAE1B,IAAmB;EACxB,OAAO;GAAE,SAAS,IAAQ,UAAU;GAAgB,OAAO,IAAU,GAAG,IAAU,EAAE,MAAM;EAAO;EACjG,WAAW;CACZ,GAGM,IAAc;EACnB,GAAG;EACH,GAAG;EACH,OAAO;GACN,GAAG,GAAe;GAClB,GAAG,EAAiB;EACrB;EACA,WAAW,CAAC,GAAe,WAAW,EAAiB,SAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAC3F;CAEA,OACC,kBAAC,GAAD;EAAwB;EAAkB;EAAW,aAAA;EAAY,SAAS;EAAyB;EAAsB;EACxH,UAAA,kBAAC,GAAD;GAAa,GAAI;GAAc,UAAA;EAAyB,CAAA;CACxC,CAAA;AAEnB"}
|
|
@@ -3,7 +3,7 @@ import { a as t, n, t as r } from "../chunks/types-CxXyru6U.js";
|
|
|
3
3
|
import { jsx as i } from "react/jsx-runtime";
|
|
4
4
|
//#region src/text-editor/TextEditorLexical.tsx
|
|
5
5
|
function a() {
|
|
6
|
-
return import("../chunks/TextEditorLexicalClient-
|
|
6
|
+
return import("../chunks/TextEditorLexicalClient-CLjpATRu.js").then((e) => ({ TextEditorLexicalClient: e.TextEditorLexicalClient }));
|
|
7
7
|
}
|
|
8
8
|
function o(t) {
|
|
9
9
|
return /* @__PURE__ */ i(e, {
|
package/dist/textarea/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { t as e } from "../chunks/ui.module-
|
|
2
|
-
import { l as t, s as n } from "../chunks/input-
|
|
1
|
+
import { t as e } from "../chunks/ui.module-DHVTOqZ0.js";
|
|
2
|
+
import { l as t, s as n } from "../chunks/input-BNszawm6.js";
|
|
3
3
|
import { cn as r } from "@ryuzaki13/react-foundation-lib/utils";
|
|
4
4
|
import { jsx as i } from "react/jsx-runtime";
|
|
5
5
|
var a = { textarea: "TjY2iu" };
|
package/dist/toggle/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as e } from "../chunks/ui.module-
|
|
1
|
+
import { t as e } from "../chunks/ui.module-DHVTOqZ0.js";
|
|
2
2
|
import { useId as t } from "react";
|
|
3
3
|
import { cn as n } from "@ryuzaki13/react-foundation-lib/utils";
|
|
4
4
|
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
package/dist/toggle/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/toggle/stringToggleState.ts","../../src/toggle/Toggle.module.scss","../../src/toggle/Toggle.tsx","../../src/toggle/StringToggle.tsx"],"sourcesContent":["/**\n * Строковые значения по умолчанию позволяют использовать StringToggle\n * как строковое представление обычного boolean-переключателя.\n */\nexport const DEFAULT_STRING_TOGGLE_CHECKED_VALUE = \"true\";\nexport const DEFAULT_STRING_TOGGLE_UNCHECKED_VALUE = \"false\";\n\n/**\n * Возвращает переданную строку буквально, включая пустую строку и пробелы.\n * Fallback применяется только когда строковое значение отсутствует.\n */\nexport function resolveStringToggleStateValue(value: unknown, fallback: string): string {\n\treturn typeof value === \"string\" ? value : fallback;\n}\n","@use \"@/styles/mixins\" as *;\n\n.row {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n}\n\n.wrapper {\n\tposition: relative;\n\tdisplay: flex;\n\tflex: 1 0 auto;\n\tmin-width: calc(var(--drp-ui-width-xs, var(--ui-width-xs)) - var(--width-add));\n}\n\n.input {\n\twidth: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tappearance: none;\n\tcursor: pointer;\n\n\t&:checked + .track {\n\t\t.thumb {\n\t\t\ttransform: translateX(100%);\n\t\t}\n\n\t\t.unchecked {\n\t\t\tcolor: var(--content-2);\n\t\t}\n\n\t\t.checked {\n\t\t\tcolor: var(--status-
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/toggle/stringToggleState.ts","../../src/toggle/Toggle.module.scss","../../src/toggle/Toggle.tsx","../../src/toggle/StringToggle.tsx"],"sourcesContent":["/**\n * Строковые значения по умолчанию позволяют использовать StringToggle\n * как строковое представление обычного boolean-переключателя.\n */\nexport const DEFAULT_STRING_TOGGLE_CHECKED_VALUE = \"true\";\nexport const DEFAULT_STRING_TOGGLE_UNCHECKED_VALUE = \"false\";\n\n/**\n * Возвращает переданную строку буквально, включая пустую строку и пробелы.\n * Fallback применяется только когда строковое значение отсутствует.\n */\nexport function resolveStringToggleStateValue(value: unknown, fallback: string): string {\n\treturn typeof value === \"string\" ? value : fallback;\n}\n","@use \"@/styles/mixins\" as *;\n\n.row {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: var(--space-sm);\n}\n\n.wrapper {\n\tposition: relative;\n\tdisplay: flex;\n\tflex: 1 0 auto;\n\tmin-width: calc(var(--drp-ui-width-xs, var(--ui-width-xs)) - var(--width-add));\n}\n\n.input {\n\twidth: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tappearance: none;\n\tcursor: pointer;\n\n\t&:checked + .track {\n\t\t.thumb {\n\t\t\ttransform: translateX(100%);\n\t\t}\n\n\t\t.unchecked {\n\t\t\tcolor: var(--content-2);\n\t\t}\n\n\t\t.checked {\n\t\t\tcolor: var(--status-brand-on-fill);\n\t\t}\n\t}\n\n\t&:focus-visible + .track {\n\t\t@include focusVisible;\n\t}\n}\n\n.track {\n\t.unchecked {\n\t\tcolor: var(--status-brand-on-fill);\n\t}\n\n\t.checked {\n\t\tcolor: var(--content-2);\n\t}\n\n\tposition: absolute;\n\tinset: calc(var(--border-width) * 2);\n\tpointer-events: none;\n\tdisplay: grid;\n\tgrid-template-columns: repeat(2, minmax(0, 1fr));\n\talign-items: center;\n\tmin-width: 6.5em;\n\tpadding: 0;\n\toverflow: hidden;\n\n\t&[data-disabled] {\n\t\t.thumb {\n\t\t\topacity: var(--disabled-opacity);\n\t\t}\n\t}\n}\n\n.option {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: 0 var(--space-sm);\n\tline-height: 1;\n\twhite-space: nowrap;\n\tuser-select: none;\n\tpointer-events: none;\n\tposition: relative;\n\tz-index: 1;\n\ttransition: color var(--transition-fast) linear;\n}\n\n.thumb {\n\tposition: absolute;\n\ttop: 0; // var(--border-width);\n\tleft: 0; //var(--border-width);\n\twidth: 50%; // calc(50% - var(--border-width));\n\theight: 100%; // calc(100% - var(--border-width) * 2);\n\tborder-radius: var(--radius-xs);\n\tbackground-color: var(--status-brand-fill);\n\ttransition:\n\t\ttransform var(--transition-fast) ease-in-out,\n\t\topacity var(--transition-fast) ease-in-out;\n}\n","import React, { useId } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport styles from \"./Toggle.module.scss\";\n\ntype ToggleLabelPosition = \"before\" | \"after\";\n\nexport interface ToggleProps\n\textends Omit<React.InputHTMLAttributes<HTMLInputElement>, \"size\" | \"checked\" | \"value\" | \"onChange\" | \"type\">, UiBaseProps<boolean> {\n\tcheckedText?: string;\n\tuncheckedText?: string;\n\tlabelPosition?: ToggleLabelPosition;\n}\n\n/**\n * Переключаемая кнопка с сохранением активного состояния. Используется для локального выбора режима, фильтра или форматирования.\n */\nexport function Toggle({\n\tlabel,\n\tdescription,\n\tplaceholder,\n\tdisabled,\n\tsize,\n\tclassName,\n\tonChange,\n\tvalue,\n\tid: externalId,\n\tcheckedText = \"ВКЛ\",\n\tuncheckedText = \"ВЫКЛ\",\n\tlabelPosition = \"before\",\n\t...props\n}: ToggleProps) {\n\tconst autoId = useId();\n\tconst id = externalId ?? autoId;\n\tconst descriptionId = description ? `${id}-description` : undefined;\n\tconst text = label ?? placeholder;\n\tconst isChecked = Boolean(value);\n\tconst fallbackAriaLabel = !text && !props[\"aria-label\"] ? `${uncheckedText} / ${checkedText}` : undefined;\n\n\tconst labelElement = text ? (\n\t\t<label htmlFor={id} className={uiStyles.uiLabel}>\n\t\t\t{text}\n\t\t</label>\n\t) : null;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(uiStyles.uiElement, disabled && uiStyles.disabled, size && uiStyles.uiSizable, size && uiStyles[size], className)}\n\t\t\taria-disabled={disabled || undefined}>\n\t\t\t<div className={styles.row}>\n\t\t\t\t{labelPosition === \"before\" && labelElement}\n\t\t\t\t<div className={styles.wrapper}>\n\t\t\t\t\t<input\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\trole=\"switch\"\n\t\t\t\t\t\tchecked={isChecked}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\taria-checked={isChecked}\n\t\t\t\t\t\taria-describedby={descriptionId}\n\t\t\t\t\t\taria-label={fallbackAriaLabel}\n\t\t\t\t\t\tclassName={cn(uiStyles.uiInputControl, styles.input)}\n\t\t\t\t\t\tonChange={(event) => onChange?.(event.currentTarget.checked)}\n\t\t\t\t\t/>\n\t\t\t\t\t<div className={styles.track} data-disabled={disabled || undefined} aria-hidden=\"true\">\n\t\t\t\t\t\t<div className={styles.thumb} />\n\t\t\t\t\t\t<div className={cn(styles.option, styles.unchecked)}>{uncheckedText}</div>\n\t\t\t\t\t\t<div className={cn(styles.option, styles.checked)}>{checkedText}</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{labelPosition === \"after\" && labelElement}\n\t\t\t</div>\n\t\t\t{description && (\n\t\t\t\t<p id={descriptionId} className={uiStyles.uiDescription}>\n\t\t\t\t\t{description}\n\t\t\t\t</p>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n","import { type ComponentProps } from \"react\";\n\nimport {\n\tDEFAULT_STRING_TOGGLE_CHECKED_VALUE,\n\tDEFAULT_STRING_TOGGLE_UNCHECKED_VALUE,\n\tresolveStringToggleStateValue\n} from \"./stringToggleState\";\nimport { Toggle } from \"./Toggle\";\n\n/**\n * Публичный контракт Toggle, который принимает и возвращает два настраиваемых\n * строковых значения вместо boolean.\n */\nexport type StringToggleProps = Omit<ComponentProps<typeof Toggle>, \"value\" | \"onChange\"> & {\n\tcheckedValue?: string;\n\tuncheckedValue?: string;\n\tvalue: string;\n\tonChange: (value: string) => void;\n};\n\n/**\n * Адаптирует boolean-состояние Toggle к паре настраиваемых строковых значений.\n */\nexport function StringToggle({\n\tvalue,\n\tonChange,\n\tcheckedValue: configuredCheckedValue,\n\tuncheckedValue: configuredUncheckedValue,\n\tdefaultChecked: _defaultChecked,\n\t...props\n}: StringToggleProps) {\n\t/*\n\t * StringToggle является controlled-компонентом: визуальное состояние всегда\n\t * определяется `value`, поэтому native defaultChecked не передаётся в input.\n\t */\n\tvoid _defaultChecked;\n\n\tconst checkedValue = resolveStringToggleStateValue(configuredCheckedValue, DEFAULT_STRING_TOGGLE_CHECKED_VALUE);\n\tconst uncheckedValue = resolveStringToggleStateValue(configuredUncheckedValue, DEFAULT_STRING_TOGGLE_UNCHECKED_VALUE);\n\tconst isChecked = value === checkedValue;\n\n\treturn <Toggle {...props} value={isChecked} onChange={(checked) => onChange(checked ? checkedValue : uncheckedValue)} />;\n}\n"],"mappings":";;;;;AAIA,IAAa,IAAsC,QACtC,IAAwC;AAMrD,SAAgB,EAA8B,GAAgB,GAA0B;CACvF,OAAO,OAAO,KAAU,WAAW,IAAQ;AAC5C;;;;;;;;;;;;;AEQA,SAAgB,EAAO,EACtB,UACA,gBACA,gBACA,aACA,SACA,cACA,aACA,UACA,IAAI,GACJ,iBAAc,OACd,mBAAgB,QAChB,mBAAgB,UAChB,GAAG,KACY;CACf,IAAM,IAAS,EAAM,GACf,IAAK,KAAc,GACnB,IAAgB,IAAc,GAAG,EAAG,gBAAgB,KAAA,GACpD,IAAO,KAAS,GAChB,IAAY,EAAQ,GACpB,IAAoB,CAAC,KAAQ,CAAC,EAAM,gBAAgB,GAAG,EAAc,KAAK,MAAgB,KAAA,GAE1F,IAAe,IACpB,kBAAC,SAAD;EAAO,SAAS;EAAI,WAAW,EAAS;EACtC,UAAA;CACK,CAAA,IACJ;CAEJ,OACC,kBAAC,OAAD;EACC,WAAW,EAAG,EAAS,WAAW,KAAY,EAAS,UAAU,KAAQ,EAAS,WAAW,KAAQ,EAAS,IAAO,CAAS;EAC9H,iBAAe,KAAY,KAAA;EAF5B,UAAA,CAGC,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAvB,UAAA;IACE,MAAkB,YAAY;IAC/B,kBAAC,OAAD;KAAK,WAAW,EAAO;KAAvB,UAAA,CACC,kBAAC,SAAD;MACC,GAAI;MACA;MACJ,MAAK;MACL,MAAK;MACL,SAAS;MACC;MACV,gBAAc;MACd,oBAAkB;MAClB,cAAY;MACZ,WAAW,EAAG,EAAS,gBAAgB,EAAO,KAAK;MACnD,WAAW,MAAU,IAAW,EAAM,cAAc,OAAO;KAC3D,CAAA,GACD,kBAAC,OAAD;MAAK,WAAW,EAAO;MAAO,iBAAe,KAAY,KAAA;MAAW,eAAY;MAAhF,UAAA;OACC,kBAAC,OAAD,EAAK,WAAW,EAAO,MAAQ,CAAA;OAC/B,kBAAC,OAAD;QAAK,WAAW,EAAG,EAAO,QAAQ,EAAO,SAAS;QAAI,UAAA;OAAmB,CAAA;OACzE,kBAAC,OAAD;QAAK,WAAW,EAAG,EAAO,QAAQ,EAAO,OAAO;QAAI,UAAA;OAAiB,CAAA;MACjE;KACD,CAAA,CAAA;;IACJ,MAAkB,WAAW;GAC1B;EACJ,CAAA,GAAA,KACA,kBAAC,KAAD;GAAG,IAAI;GAAe,WAAW,EAAS;GACxC,UAAA;EACC,CAAA,CAEA;;AAEP;;;AC7DA,SAAgB,EAAa,EAC5B,UACA,aACA,cAAc,GACd,gBAAgB,GAChB,gBAAgB,GAChB,GAAG,KACkB;CAOrB,IAAM,IAAe,EAA8B,GAAwB,CAAmC,GACxG,IAAiB,EAA8B,GAA0B,CAAqC,GAC9G,IAAY,MAAU;CAE5B,OAAO,kBAAC,GAAD;EAAQ,GAAI;EAAO,OAAO;EAAW,WAAW,MAAY,EAAS,IAAU,IAAe,CAAc;CAAI,CAAA;AACxH"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { t as e } from "../chunks/ui.module-
|
|
2
|
-
import { o as t } from "../chunks/input-
|
|
3
|
-
import { t as n } from "../chunks/check-box-
|
|
4
|
-
import { c as r, d as i, f as a, i as o, l as s, n as c, p as l, r as u, t as d, u as f } from "../chunks/picker-
|
|
5
|
-
import { r as p } from "../chunks/useODataSelectBase-
|
|
6
|
-
import { o as m, s as h } from "../chunks/multi-select-
|
|
1
|
+
import { t as e } from "../chunks/ui.module-DHVTOqZ0.js";
|
|
2
|
+
import { o as t } from "../chunks/input-BNszawm6.js";
|
|
3
|
+
import { t as n } from "../chunks/check-box-BZiEBR9c.js";
|
|
4
|
+
import { c as r, d as i, f as a, i as o, l as s, n as c, p as l, r as u, t as d, u as f } from "../chunks/picker-D3Fc15JH.js";
|
|
5
|
+
import { r as p } from "../chunks/useODataSelectBase-BhCMCzv_.js";
|
|
6
|
+
import { o as m, s as h } from "../chunks/multi-select-CFHaQPot.js";
|
|
7
7
|
import { useCallback as g, useLayoutEffect as _, useMemo as v, useRef as y, useState as ee } from "react";
|
|
8
8
|
import { flattenODataDependentServices as b, sortODataDependentSegmentItemsByChains as x, useODataCollection as S, useODataCollectionChains as C, useODataCollectionModel as w } from "@ryuzaki13/react-foundation-api/odata";
|
|
9
9
|
import { cn as T } from "@ryuzaki13/react-foundation-lib/utils";
|
package/dist/tree-table/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as e, c as t, d as n, i as r, m as i, n as ee, o as te, r as ne, s as re, t as ie } from "../chunks/base-table-
|
|
1
|
+
import { a as e, c as t, d as n, i as r, m as i, n as ee, o as te, r as ne, s as re, t as ie } from "../chunks/base-table-fUJY__6M.js";
|
|
2
2
|
import { useEffect as a, useEffectEvent as o, useMemo as s, useRef as c, useState as ae } from "react";
|
|
3
3
|
import { cn as oe } from "@ryuzaki13/react-foundation-lib/utils";
|
|
4
4
|
import { ChevronDownIcon as l, ChevronRightIcon as u } from "lucide-react";
|
package/dist/types.d.ts
CHANGED
|
@@ -22,4 +22,5 @@ export type UiBaseProps<C, V = C> = {
|
|
|
22
22
|
export type UiTone = "neutral" | "brand" | "error" | "warning" | "success" | "info";
|
|
23
23
|
export type UiAppearance = "solid" | "outline" | "ghost" | "transparent";
|
|
24
24
|
export type UiVariant = "transparent" | "ghost" | "neutral" | "brand" | "error" | "warning" | "success" | "info" | "neutralOutline" | "brandOutline" | "errorOutline" | "warningOutline" | "successOutline" | "infoOutline";
|
|
25
|
+
export type UiPanelTone = "primary" | "secondary" | "tertiary";
|
|
25
26
|
//# sourceMappingURL=types.d.ts.map
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtD,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAElD,MAAM,MAAM,WAAW,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAEpF,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAEzE,MAAM,MAAM,SAAS,GAClB,aAAa,GACb,OAAO,GACP,SAAS,GACT,OAAO,GACP,OAAO,GACP,SAAS,GACT,SAAS,GACT,MAAM,GACN,gBAAgB,GAChB,cAAc,GACd,cAAc,GACd,gBAAgB,GAChB,gBAAgB,GAChB,aAAa,CAAC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtD,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAElD,MAAM,MAAM,WAAW,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAEpF,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,aAAa,CAAC;AAEzE,MAAM,MAAM,SAAS,GAClB,aAAa,GACb,OAAO,GACP,SAAS,GACT,OAAO,GACP,OAAO,GACP,SAAS,GACT,SAAS,GACT,MAAM,GACN,gBAAgB,GAChB,cAAc,GACd,cAAc,GACd,gBAAgB,GAChB,gBAAgB,GAChB,aAAa,CAAC;AAEjB,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC"}
|
package/dist/uiClasses.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { UiAppearance, UiTone, UiVariant } from "./types";
|
|
1
|
+
import type { UiAppearance, UiPanelTone, UiTone, UiVariant } from "./types";
|
|
2
2
|
export type UiScheme = {
|
|
3
3
|
tone: UiTone;
|
|
4
4
|
appearance: UiAppearance;
|
|
@@ -6,6 +6,7 @@ export type UiScheme = {
|
|
|
6
6
|
export type UiSelectionAppearance = Extract<UiAppearance, "outline" | "solid">;
|
|
7
7
|
export declare function getUiToneClassName(tone: UiTone): string;
|
|
8
8
|
export declare function getUiAppearanceClassName(appearance: UiAppearance): string;
|
|
9
|
+
export declare function getUiPanelToneClassName(tone: UiPanelTone): string;
|
|
9
10
|
export declare function resolveUiScheme({ variant, tone, appearance, fallbackTone, fallbackAppearance }: {
|
|
10
11
|
variant?: UiVariant;
|
|
11
12
|
tone?: UiTone;
|
package/dist/uiClasses.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"uiClasses.d.ts","sourceRoot":"","sources":["../src/uiClasses.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"uiClasses.d.ts","sourceRoot":"","sources":["../src/uiClasses.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAE5E,MAAM,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,YAAY,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,YAAY,EAAE,SAAS,GAAG,OAAO,CAAC,CAAC;AAyC/E,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,wBAAgB,wBAAwB,CAAC,UAAU,EAAE,YAAY,GAAG,MAAM,CAEzE;AAED,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,WAAW,GAAG,MAAM,CAEjE;AAED,wBAAgB,eAAe,CAAC,EAC/B,OAAO,EACP,IAAI,EACJ,UAAU,EACV,YAAwB,EACxB,kBAA8B,EAC9B,EAAE;IACF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,kBAAkB,CAAC,EAAE,YAAY,CAAC;CAClC,GAAG,QAAQ,CAgBX"}
|
package/package.json
CHANGED
package/src/styles/_color.scss
CHANGED
|
@@ -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-BnjRbLCp.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-DXv0kKnO.js";import{a as p,i as m,n as h,o as g,r as _,s as v,t as y}from"./Badge.stories-BEUzIGxR.js";function b(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(s,{of:h,parameters:{atomicCanvas:!0,layout:`padded`,docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,S.jsx)(u,{children:`Badge`}),`
|
|
3
3
|
`,(0,S.jsx)(o,{children:`Компактная текстовая метка для статусов, категорий, фильтров и коротких служебных пометок`}),`
|
|
4
4
|
`,(0,S.jsx)(t.p,{children:`Badge подходит для коротких подписей, которые должны быстро читаться и не перегружать интерфейс:`}),`
|
|
@@ -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-BnjRbLCp.js";import{i,n as a,r as o,t as s}from"./BadgeList-Dvi9mgiq.js";var c=t({Appearances:()=>h,Basic:()=>p,RemovableList:()=>_,Sizes:()=>g,Tones:()=>m,__namedExportsOrder:()=>v,default:()=>f}),l,u,d,f,p,m,h,g,_,v;function y(){return(y=e((()=>{l=n(),i(),a(),u=r(),{useArgs:d}=__STORYBOOK_MODULE_PREVIEW_API__,f={title:`Shared/UI/Badge`,component:o,args:{children:`Новый`,size:`md`,tone:`info`,appearance:`solid`},parameters:{atomicCanvas:!0,layout:`padded`},argTypes:{children:{description:`Текст внутри бейджа.`,control:`text`},size:{description:`Размер бейджа.`,control:`inline-radio`,options:[`xs`,`sm`,`md`,`lg`,`xl`]},tone:{description:`Цветовой тон бейджа.`,control:`inline-radio`,options:[`neutral`,`brand`,`success`,`warning`,`error`,`info`]},appearance:{description:`Форма бейджа.`,control:`inline-radio`,options:[`solid`,`outline`,`ghost`,`transparent`]},onRemove:{description:`Показывает кнопку удаления и вызывает обработчик по клику.`,control:!1}}},p={render:function(){let[e]=d();return(0,u.jsx)(o,{...e})}},m={render:()=>(0,u.jsxs)(s,{children:[(0,u.jsx)(o,{tone:`neutral`,appearance:`outline`,children:`Neutral`}),(0,u.jsx)(o,{tone:`success`,appearance:`solid`,children:`Успешно`}),(0,u.jsx)(o,{tone:`warning`,appearance:`solid`,children:`Внимание`}),(0,u.jsx)(o,{tone:`error`,appearance:`solid`,children:`Ошибка`}),(0,u.jsx)(o,{tone:`info`,appearance:`solid`,children:`Информация`})]})},h={render:()=>(0,u.jsxs)(s,{children:[(0,u.jsx)(o,{tone:`neutral`,appearance:`solid`,children:`Solid`}),(0,u.jsx)(o,{tone:`neutral`,appearance:`outline`,children:`Outline`}),(0,u.jsx)(o,{tone:`info`,appearance:`ghost`,children:`Ghost`}),(0,u.jsx)(o,{tone:`warning`,appearance:`transparent`,children:`Transparent`})]})},g={render:()=>(0,u.jsxs)(s,{children:[(0,u.jsx)(o,{size:`xs`,children:`Extra Small`}),(0,u.jsx)(o,{size:`sm`,children:`Small`}),(0,u.jsx)(o,{size:`md`,children:`Medium`}),(0,u.jsx)(o,{size:`lg`,children:`Large`}),(0,u.jsx)(o,{size:`xl`,children:`Extra Large`})]})},_={render:()=>{let[e,t]=(0,l.useState)([`Фильтр A`,`Фильтр B`,`Фильтр C`]);return(0,u.jsx)(s,{children:e.map(e=>(0,u.jsx)(o,{tone:`info`,appearance:`outline`,onRemove:()=>t(t=>t.filter(t=>t!==e)),children:e},e))})}},p.parameters={...p.parameters,docs:{...p.parameters?.docs,source:{originalSource:`{
|
|
2
2
|
render: function Render() {
|
|
3
3
|
const [args] = useArgs<BadgeStoryArgs>();
|
|
4
4
|
return <Badge {...args} />;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n,t as r}from"./x-
|
|
1
|
+
import{n as e}from"./rolldown-runtime-C0FnF6B9.js";import{t}from"./react-C21x__mS.js";import{n,t as r}from"./x-DvnP0o1b.js";import{n as i}from"./iframe-BnjRbLCp.js";import{a,i as o}from"./utils-DUM89eIj.js";import{a as s,l as c}from"./array-D-_yMMUK-CIRmlF93.js";import{n as l,t as u}from"./FloatingPopover-DOPDzLFT.js";import{a as d,i as f,r as p,t as m}from"./uiClasses-CyX7wB6b.js";import{n as h,t as g}from"./FlexContainer-LmZIdhq2.js";function _({maxChar:e,placement:t=`left`,closeDelay:n=0,maxWidth:r,children:i,block:a,state:o,textWrap:s,textWrapProps:l}){let d=c(i);if(!d.length||e&&d.length<e)return(0,v.jsx)(`span`,{children:d});let f=s??`div`,p={style:{display:a?`block`:`inline-block`,width:e?`${e-3}ch`:`auto`},className:`textOverflow`},m={...l,...p,style:{...l?.style,...p.style},className:[l?.className,p.className].filter(Boolean).join(` `)};return(0,v.jsx)(u,{state:o,placement:t,openOnHover:!0,content:d,closeDelay:n,maxWidth:r,children:(0,v.jsx)(f,{...m,children:d})})}var v;function y(){return(y=e((()=>{s(),l(),v=i(),_.__docgenInfo={description:``,methods:[],displayName:`TextOverflow`,props:{children:{required:!0,tsType:{name:`string`},description:``},maxChar:{required:!1,tsType:{name:`number`},description:``},maxWidth:{required:!1,tsType:{name:`number`},description:`Максимальная ширина тултипа в em.`},placement:{required:!1,tsType:{name:`Placement`},description:``,defaultValue:{value:`"left"`,computed:!1}},closeDelay:{required:!1,tsType:{name:`number`},description:``,defaultValue:{value:`0`,computed:!1}},block:{required:!1,tsType:{name:`literal`,value:`true`},description:`Для работы text-overflow элемент обязан быть блочным или inline-block.
|
|
2
2
|
Если в качестве обёртки передается инлайновый компонент, то он будет
|
|
3
3
|
перезаписан через стили на display: block или inline-block в зависимости
|
|
4
|
-
от установки данного пропса.`},state:{required:!1,tsType:{name:`union`,raw:`"information" | "error" | "warning" | "success" | "negative"`,elements:[{name:`literal`,value:`"information"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"negative"`}]},description:``},textWrap:{required:!1,tsType:{name:`T`},description:``},textWrapProps:{required:!1,tsType:{name:`Omit`,elements:[{name:`ComponentProps`,elements:[{name:`T`}],raw:`ComponentProps<T>`},{name:`literal`,value:`"children"`}],raw:`Omit<ComponentProps<T>, "children">`},description:``}}}})))()}var b,x,S,C,w,T,E,D,O,k;function A(){return(A=e((()=>{b=`qBtmnH`,x=`p-HsHY`,S=`u9tQAE`,C=`FRScRz`,w=`W13uQO`,T=`_3IRcM9`,E=`R3ybI7`,D=`DdWAaC`,O=`_5cXBQF`,k={badge:b,passive:x,sizeXs:S,sizeSm:C,sizeMd:w,sizeLg:T,sizeXl:E,content:D,removeButton:O}})))()}function j({children:e,size:t=`sm`,tone:n,appearance:i,className:o,onRemove:s}){let c=n??`neutral`,l=d({tone:n,appearance:i,fallbackTone:c,fallbackAppearance:c===`neutral`?`outline`:`solid`});return(0,M.jsxs)(`div`,{className:a(k.badge,N[t],
|
|
4
|
+
от установки данного пропса.`},state:{required:!1,tsType:{name:`union`,raw:`"information" | "error" | "warning" | "success" | "negative"`,elements:[{name:`literal`,value:`"information"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"negative"`}]},description:``},textWrap:{required:!1,tsType:{name:`T`},description:``},textWrapProps:{required:!1,tsType:{name:`Omit`,elements:[{name:`ComponentProps`,elements:[{name:`T`}],raw:`ComponentProps<T>`},{name:`literal`,value:`"children"`}],raw:`Omit<ComponentProps<T>, "children">`},description:``}}}})))()}var b,x,S,C,w,T,E,D,O,k;function A(){return(A=e((()=>{b=`qBtmnH`,x=`p-HsHY`,S=`u9tQAE`,C=`FRScRz`,w=`W13uQO`,T=`_3IRcM9`,E=`R3ybI7`,D=`DdWAaC`,O=`_5cXBQF`,k={badge:b,passive:x,sizeXs:S,sizeSm:C,sizeMd:w,sizeLg:T,sizeXl:E,content:D,removeButton:O}})))()}function j({children:e,size:t=`sm`,tone:n,appearance:i,className:o,onRemove:s}){let c=n??`neutral`,l=d({tone:n,appearance:i,fallbackTone:c,fallbackAppearance:c===`neutral`?`outline`:`solid`});return(0,M.jsxs)(`div`,{className:a(k.badge,N[t],p(l.tone),m(l.appearance),!s&&k.passive,o),children:[(0,M.jsx)(_,{maxChar:25,placement:`top`,block:!0,textWrapProps:{className:k.content},children:String(e)}),s&&(0,M.jsx)(`button`,{type:`button`,onClick:s,className:k.removeButton,"aria-label":`Удалить бейдж`,"data-ui":`badge-remove-button`,"data-action":`remove-badge`,children:(0,M.jsx)(r,{})})]})}var M,N;function P(){return(P=e((()=>{o(),n(),y(),f(),A(),M=i(),N={xs:k.sizeXs,sm:k.sizeSm,md:k.sizeMd,lg:k.sizeLg,xl:k.sizeXl},j.__docgenInfo={description:`Компактный индикатор для статусов, категорий и коротких служебных меток.`,methods:[],displayName:`Badge`,props:{children:{required:!0,tsType:{name:`union`,raw:`string | number`,elements:[{name:`string`},{name:`number`}]},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:``,defaultValue:{value:`"sm"`,computed:!1}},tone:{required:!1,tsType:{name:`union`,raw:`"neutral" | "brand" | "error" | "warning" | "success" | "info"`,elements:[{name:`literal`,value:`"neutral"`},{name:`literal`,value:`"brand"`},{name:`literal`,value:`"error"`},{name:`literal`,value:`"warning"`},{name:`literal`,value:`"success"`},{name:`literal`,value:`"info"`}]},description:``},appearance:{required:!1,tsType:{name:`union`,raw:`"solid" | "outline" | "ghost" | "transparent"`,elements:[{name:`literal`,value:`"solid"`},{name:`literal`,value:`"outline"`},{name:`literal`,value:`"ghost"`},{name:`literal`,value:`"transparent"`}]},description:``},className:{required:!1,tsType:{name:`string`},description:``},onRemove:{required:!1,tsType:{name:`signature`,type:`function`,raw:`() => void`,signature:{arguments:[],return:{name:`void`}}},description:``}}}})))()}function F({children:e}){return(0,L.jsx)(g,{inline:!0,wrap:!0,gap:`sm`,align:`baseline`,children:I.Children.map(e,(e,t)=>(0,L.jsx)(I.Fragment,{children:e},t))})}var I,L;function R(){return(R=e((()=>{I=t(),h(),L=i(),F.__docgenInfo={description:"Контейнер для группы `Badge`, который выстраивает элементы в единый список с предсказуемыми отступами. Используется для компактного вывода набора меток или фильтров.",methods:[],displayName:`BadgeList`,props:{children:{required:!0,tsType:{name:`Array`,elements:[{name:`ReactElement`,elements:[{name:`union`,raw:`typeof Badge | null | undefined | false`,elements:[{name:`Badge`},{name:`null`},{name:`undefined`},{name:`literal`,value:`false`}]}],raw:`ReactElement<typeof Badge | null | undefined | false>`}],raw:`ReactElement<typeof Badge | null | undefined | false>[]`},description:``}}}})))()}export{P as i,R as n,j as r,F 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-BnjRbLCp.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-DXv0kKnO.js";import{a as p,i as m,n as h,o as g,r as _,t as v}from"./Button.stories-RTpFQ0lC.js";function y(e){let t={code:`code`,h2:`h2`,h3:`h3`,li:`li`,p:`p`,pre:`pre`,ul:`ul`,...n(),...e.components};return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(s,{of:h,parameters:{atomicCanvas:!0,layout:`padded`,docs:{toc:!0}}}),`
|
|
2
2
|
`,(0,x.jsx)(u,{children:`Button`}),`
|
|
3
3
|
`,(0,x.jsx)(o,{children:`Базовая action-кнопка дизайн-системы для пользовательских действий, подтверждений и быстрых операций`}),`
|
|
4
4
|
`,(0,x.jsxs)(t.p,{children:[(0,x.jsx)(t.code,{children:`Button`}),` используется как универсальная кнопка интерфейса: в формах, тулбарах, модальных окнах, карточках, таблицах и компактных icon-only сценариях.`]}),`
|