@ryuzaki13/react-foundation-ui 1.5.9 → 1.5.11
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 +182 -148
- package/dist/advanced-search/index.js.map +1 -1
- package/dist/advanced-search/model/useAdvancedSearchSelection.d.ts +1 -1
- package/dist/advanced-search/model/useAdvancedSearchSelection.d.ts.map +1 -1
- package/dist/advanced-search/ui/AdvancedSearchModal.d.ts +12 -3
- package/dist/advanced-search/ui/AdvancedSearchModal.d.ts.map +1 -1
- package/dist/advanced-search/ui/AdvancedSearchModalSession.d.ts +15 -0
- package/dist/advanced-search/ui/AdvancedSearchModalSession.d.ts.map +1 -0
- package/dist/advanced-search/ui/AdvancedSearchSelect.d.ts.map +1 -1
- 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-BSshXZAX.js → CalendarView-DqA-PbAU.js} +42 -42
- package/dist/chunks/{CalendarView-BSshXZAX.js.map → CalendarView-DqA-PbAU.js.map} +1 -1
- package/dist/chunks/{ImageViewerRuntime-BMs3BBkV.js → ImageViewerRuntime-HGBWp9NM.js} +18 -18
- package/dist/chunks/{ImageViewerRuntime-BMs3BBkV.js.map → ImageViewerRuntime-HGBWp9NM.js.map} +1 -1
- package/dist/chunks/{TextEditorLexicalClient-CLjpATRu.js → TextEditorLexicalClient-B084kVzu.js} +322 -322
- package/dist/chunks/{TextEditorLexicalClient-CLjpATRu.js.map → TextEditorLexicalClient-B084kVzu.js.map} +1 -1
- package/dist/chunks/{badge-CaooZXYD.js → badge-DMM8cOHd.js} +16 -16
- package/dist/chunks/{badge-CaooZXYD.js.map → badge-DMM8cOHd.js.map} +1 -1
- package/dist/chunks/{base-table-fUJY__6M.js → base-table-CJdKCKhb.js} +125 -125
- package/dist/chunks/{base-table-fUJY__6M.js.map → base-table-CJdKCKhb.js.map} +1 -1
- package/dist/chunks/{button-C--u7uJj.js → button-CzUO5rzq.js} +17 -17
- package/dist/chunks/{button-C--u7uJj.js.map → button-CzUO5rzq.js.map} +1 -1
- package/dist/chunks/{check-box-BZiEBR9c.js → check-box-sfGjYczQ.js} +11 -11
- package/dist/chunks/{check-box-BZiEBR9c.js.map → check-box-sfGjYczQ.js.map} +1 -1
- package/dist/chunks/{context-menu-XZ-e0f6_.js → context-menu-6nJkPmKV.js} +83 -83
- package/dist/chunks/{context-menu-XZ-e0f6_.js.map → context-menu-6nJkPmKV.js.map} +1 -1
- package/dist/chunks/date-input-9T8AoG5U.js +341 -0
- package/dist/chunks/{date-input-Dr5QNVT6.js.map → date-input-9T8AoG5U.js.map} +1 -1
- package/dist/chunks/{input-BNszawm6.js → input-VC8jEoTa.js} +37 -37
- package/dist/chunks/{input-BNszawm6.js.map → input-VC8jEoTa.js.map} +1 -1
- package/dist/chunks/{input-files-DxLVr2PF.js → input-files-CoMjadk7.js} +22 -22
- package/dist/chunks/{input-files-DxLVr2PF.js.map → input-files-CoMjadk7.js.map} +1 -1
- package/dist/chunks/{input-search-C2OOhZlw.js → input-search-Bs_9SxT0.js} +2 -2
- package/dist/chunks/{input-search-C2OOhZlw.js.map → input-search-Bs_9SxT0.js.map} +1 -1
- package/dist/chunks/{misc-Cp_r022Z.js → misc-CkRRma5E.js} +55 -55
- package/dist/chunks/{misc-Cp_r022Z.js.map → misc-CkRRma5E.js.map} +1 -1
- package/dist/chunks/{modal-DK9M7lT5.js → modal-LHkNxBko.js} +38 -38
- package/dist/chunks/{modal-DK9M7lT5.js.map → modal-LHkNxBko.js.map} +1 -1
- package/dist/chunks/{multi-select-CFHaQPot.js → multi-select-BJ6Lst1E.js} +44 -44
- package/dist/chunks/{multi-select-CFHaQPot.js.map → multi-select-BJ6Lst1E.js.map} +1 -1
- package/dist/chunks/{picker-D3Fc15JH.js → picker-DLnfOgZj.js} +34 -34
- package/dist/chunks/{picker-D3Fc15JH.js.map → picker-DLnfOgZj.js.map} +1 -1
- package/dist/chunks/{popover-BTT7zSqx.js → popover-IExDrsF6.js} +67 -67
- package/dist/chunks/{popover-BTT7zSqx.js.map → popover-IExDrsF6.js.map} +1 -1
- package/dist/chunks/{select-BolFlcoY.js → select-CysiIrej.js} +5 -5
- package/dist/chunks/{select-BolFlcoY.js.map → select-CysiIrej.js.map} +1 -1
- package/dist/chunks/{sortable-DcTIAbjD.js → sortable-BKIwlqhI.js} +17 -17
- package/dist/chunks/{sortable-DcTIAbjD.js.map → sortable-BKIwlqhI.js.map} +1 -1
- package/dist/chunks/{table-BChs6bgR.js → table-CIWdAcPY.js} +2 -2
- package/dist/chunks/{table-BChs6bgR.js.map → table-CIWdAcPY.js.map} +1 -1
- package/dist/chunks/{types-CxXyru6U.js → types-D9Wj9wrg.js} +21 -21
- package/dist/chunks/{types-CxXyru6U.js.map → types-D9Wj9wrg.js.map} +1 -1
- package/dist/chunks/{useODataSelectBase-BhCMCzv_.js → useODataSelectBase-Bq36Wp1U.js} +8 -8
- package/dist/chunks/{useODataSelectBase-BhCMCzv_.js.map → useODataSelectBase-Bq36Wp1U.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 +32 -32
- package/dist/dialog/index.js +9 -9
- package/dist/disclosure/index.js +10 -10
- package/dist/drop-zone/index.js +8 -8
- package/dist/errors/index.js +8 -8
- package/dist/expandable-action-panel/index.js +16 -16
- package/dist/flex/useFlexClasses.d.ts +1 -1
- package/dist/fullscreen-portal/index.js +7 -7
- package/dist/image/index.js +27 -27
- package/dist/input/index.js +1 -1
- package/dist/input-date-time/index.js +1 -1
- package/dist/input-file/index.js +1 -1
- package/dist/input-files/index.js +1 -1
- package/dist/input-image/index.js +1 -1
- package/dist/input-search/index.js +1 -1
- package/dist/layout-picker/index.js +1 -1
- package/dist/list/index.js +25 -25
- package/dist/listbox/index.js +5 -5
- package/dist/misc/index.js +1 -1
- package/dist/modal/index.js +1 -1
- package/dist/multi-select/index.js +1 -1
- package/dist/notifications/index.js +30 -30
- package/dist/picker/index.js +1 -1
- package/dist/popover/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 +10 -10
- package/dist/select/index.js +1 -1
- package/dist/simple-table/index.js +1 -1
- package/dist/slider/index.js +3 -3
- package/dist/sortable/index.js +1 -1
- package/dist/state-select/index.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/switch/index.js +11 -11
- package/dist/table/index.js +1 -1
- package/dist/table-sorting/index.js +13 -13
- package/dist/tabs/index.js +1 -1
- package/dist/tag-input/index.js +55 -55
- package/dist/tag-input/index.js.map +1 -1
- package/dist/text/index.js +1 -1
- package/dist/text-editor/index.js +3 -3
- package/dist/textarea/index.js +1 -1
- package/dist/tree-select/index.js +134 -134
- package/dist/tree-select/index.js.map +1 -1
- package/dist/tree-table/index.js +16 -16
- package/package.json +1 -1
- package/storybook-static/assets/{Badge-H-k9yUSA.js → Badge-BRzsgtsW.js} +1 -1
- package/storybook-static/assets/{Badge.stories-6jzeuC64.js → Badge.stories-BEUzIGxR.js} +1 -1
- package/storybook-static/assets/{BadgeList-DB44TweU.js → BadgeList-Dvi9mgiq.js} +1 -1
- package/storybook-static/assets/{Button-D3hmChuc.js → Button-B0yitxpz.js} +1 -1
- package/storybook-static/assets/{Button-CAqJR-HG.js → Button-D9NRl_J-.js} +1 -1
- package/storybook-static/assets/{Button.stories-Dms2VFN3.js → Button.stories-RTpFQ0lC.js} +1 -1
- package/storybook-static/assets/{CalendarView-DkD4c8VM.js → CalendarView-hixokiLY.js} +1 -1
- package/storybook-static/assets/{CheckBox-DGy-LNaF.js → CheckBox-CkP3wY1y.js} +1 -1
- package/storybook-static/assets/{CheckBox-BTKqpDhB.js → CheckBox-DgcHpYEB.js} +1 -1
- package/storybook-static/assets/{CheckBox.stories-Cr1VcSRy.js → CheckBox.stories-B6gt-Pyy.js} +1 -1
- package/storybook-static/assets/{Color-6AOWCN3U-D2ij3DuB.js → Color-6AOWCN3U-CS57U4UC.js} +1 -1
- package/storybook-static/assets/{ContextMenu-BTCmlKUo.js → ContextMenu-CvaQBpuB.js} +1 -1
- package/storybook-static/assets/{ContextMenu-XLrJcLuy.js → ContextMenu-DfArrHyO.js} +1 -1
- package/storybook-static/assets/{ContextMenu.stories-BF0iVkIu.js → ContextMenu.stories-UUZnkfjK.js} +1 -1
- package/storybook-static/assets/{DateInput-BiQztDCJ.js → DateInput-BOJzcuf8.js} +1 -1
- package/storybook-static/assets/{DateInput-BAvKi07l.js → DateInput-D0Z39L0u.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-tcb5N1bV.js → DateInput.stories-B9oAtjEF.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-CSrEwt-3.js → DateRangePresetSelect-Bhzy-5vR.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect-CiGmgmac.js → DateRangePresetSelect-I9kq2B9z.js} +1 -1
- package/storybook-static/assets/{DateRangePresetSelect.stories-DIXe2bLs.js → DateRangePresetSelect.stories-CkkmtUCo.js} +1 -1
- package/storybook-static/assets/{Detail-CI8BYAuL.js → Detail-D038XLEh.js} +1 -1
- package/storybook-static/assets/{Detail.stories-Ccicg9Vr.js → Detail.stories-Dy8sCrYr.js} +1 -1
- package/storybook-static/assets/{Dialog-597JR3cR.js → Dialog-BpBfxyHP.js} +1 -1
- package/storybook-static/assets/{Dialog-R5Am1Hzd.js → Dialog-DvcT-HcI.js} +1 -1
- package/storybook-static/assets/{Dialog.stories-ClpSbVhd.js → Dialog.stories-CFwZCUTc.js} +1 -1
- package/storybook-static/assets/{Disclosure-zZQU-Iyf.js → Disclosure-bS8JZMZH.js} +1 -1
- package/storybook-static/assets/{Disclosure.stories-C2-9GP8X.js → Disclosure.stories-DoRb7eFP.js} +1 -1
- package/storybook-static/assets/{DisclosureGroup-DtQit9bi.js → DisclosureGroup-C8bhahk2.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-JROSPFPF-VDAUUJ7T.js → DocsRenderer-JROSPFPF-BENO-TjP.js} +1 -1
- package/storybook-static/assets/{DropZone-BGH6QR3H.js → DropZone-BFesDtXX.js} +1 -1
- package/storybook-static/assets/{DropZone-DYT6KTBY.js → DropZone-CT2ql-iq.js} +1 -1
- package/storybook-static/assets/{DropZone.stories-Db_Eah_P.js → DropZone.stories-DjyWW5NR.js} +1 -1
- package/storybook-static/assets/{DropdownMenu-Dw4WHBLp.js → DropdownMenu-DFIvsL7-.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel-C1SC-Fm0.js → ExpandableActionPanel-HfuTxNHC.js} +1 -1
- package/storybook-static/assets/{ExpandableActionPanel.stories-Ce5iXJOz.js → ExpandableActionPanel.stories-hrKtH1J5.js} +1 -1
- package/storybook-static/assets/{Flex-B1Xbfrsd.js → Flex-YpXsCy6o.js} +1 -1
- package/storybook-static/assets/{Flex.stories-B51AhkLf.js → Flex.stories-Ck5prBoq.js} +1 -1
- package/storybook-static/assets/{FloatingPopover-8m1ZtemJ.js → FloatingPopover-DOPDzLFT.js} +1 -1
- package/storybook-static/assets/{FormattedTableCell-DGC4mBLN.js → FormattedTableCell-CpYotISk.js} +1 -1
- package/storybook-static/assets/{Grid-BGmNVH-Y.js → Grid-DUocH4TX.js} +1 -1
- package/storybook-static/assets/{Grid.stories-dp9HIC9t.js → Grid.stories-jnw37ukT.js} +1 -1
- package/storybook-static/assets/{ImageCropper.stories-Bjn1k0Kz.js → ImageCropper.stories-CDLsJM59.js} +1 -1
- package/storybook-static/assets/{ImageRenderer-DjYotwaD.js → ImageRenderer-CZ7DKuFY.js} +1 -1
- package/storybook-static/assets/{ImageRenderer.stories-BxWs6FdX.js → ImageRenderer.stories-B8-aQ58B.js} +1 -1
- package/storybook-static/assets/{ImageView.stories-icpfyY3j.js → ImageView.stories-DLhqZ_GI.js} +1 -1
- package/storybook-static/assets/{ImageViewer.stories-zcaCCmK2.js → ImageViewer.stories-o1yD_rZq.js} +2 -2
- package/storybook-static/assets/{ImageViewerRuntime-CqsgnUZA.js → ImageViewerRuntime-CJlrAsfL.js} +1 -1
- package/storybook-static/assets/{Input-CUfYW_um.js → Input-8dAj3L5M.js} +1 -1
- package/storybook-static/assets/{Input-CIQAnFtb.js → Input-B8y70gW9.js} +1 -1
- package/storybook-static/assets/{Input.stories-DfCKF8rm.js → Input.stories-KAOo2cMb.js} +1 -1
- package/storybook-static/assets/{InputDateTime-BRLLMLY_.js → InputDateTime-C8iXQn7P.js} +1 -1
- package/storybook-static/assets/{InputDateTime.stories-CvxnfvBi.js → InputDateTime.stories-BOUfVN41.js} +1 -1
- package/storybook-static/assets/{InputFile-ChUdk4fI.js → InputFile-BlMNRcyL.js} +1 -1
- package/storybook-static/assets/{InputFile-DodOOJna.js → InputFile-C-CwNpFJ.js} +1 -1
- package/storybook-static/assets/{InputFile.stories-BbUp9qzg.js → InputFile.stories-MD9cAu-W.js} +1 -1
- package/storybook-static/assets/{InputFiles-DiXnyunh.js → InputFiles-BMjWaVN9.js} +1 -1
- package/storybook-static/assets/{InputFiles-B2tnIFaW.js → InputFiles-D72fv8HQ.js} +1 -1
- package/storybook-static/assets/{InputFiles.stories-CDD5dVDx.js → InputFiles.stories-BlD8cBmt.js} +1 -1
- package/storybook-static/assets/{InputFilesList-DQJ-PQST.js → InputFilesList-Dol1dIX5.js} +1 -1
- package/storybook-static/assets/{InputImage-fwAQqeI_.js → InputImage-_sOF8mmB.js} +1 -1
- package/storybook-static/assets/{InputImage-C325RWQr.js → InputImage-uE0JlBq5.js} +1 -1
- package/storybook-static/assets/{InputImage.stories-L3jyHxSJ.js → InputImage.stories-R6HZFGuR.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents-OABim2ku.js → InteractiveComponents-BDmyyudJ.js} +1 -1
- package/storybook-static/assets/{InteractiveComponents.stories-EPcGTlqo.js → InteractiveComponents.stories-RsjV4QyY.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-CPFQxHT8.js → LayoutPicker-CqpAicOL.js} +1 -1
- package/storybook-static/assets/{LayoutPicker-ZpKrd_7K.js → LayoutPicker-CywNkFMn.js} +1 -1
- package/storybook-static/assets/{LayoutPicker.stories-SD1M9rTk.js → LayoutPicker.stories-BMiwqihl.js} +1 -1
- package/storybook-static/assets/{Listbox-D14PtWlP.js → Listbox-Bznk_lrX.js} +1 -1
- package/storybook-static/assets/{Listbox-CuNYuQox.js → Listbox-zQgffOs0.js} +1 -1
- package/storybook-static/assets/{Listbox.stories-C24wwo8z.js → Listbox.stories-BeWjK-CY.js} +1 -1
- package/storybook-static/assets/{Modal-V81rtPnm.js → Modal-unWtDqq_.js} +1 -1
- package/storybook-static/assets/{Modal.stories-DtkSn50u.js → Modal.stories-DepzRvWp.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-Z3rgI84z.js → ModalManagerProvider-B1XUXs-1.js} +1 -1
- package/storybook-static/assets/{ModalManagerProvider-C5bd7SFD.css → ModalManagerProvider-CjPErFqW.css} +1 -1
- package/storybook-static/assets/{MultiSelect-CWHllMQL.js → MultiSelect-DBzuR4v6.js} +1 -1
- package/storybook-static/assets/{MultiSelect-CCpKNk3U.js → MultiSelect-U5XEaFTv.js} +1 -1
- package/storybook-static/assets/{MultiSelect.stories-BK3hlkDB.js → MultiSelect.stories-9xtLUsmK.js} +1 -1
- package/storybook-static/assets/{NoData-vatUQRQ8.js → NoData-Did5-Vbj.js} +1 -1
- package/storybook-static/assets/{NotificationsHost-DA4Psge0.js → NotificationsHost-C16jWWbh.js} +1 -1
- package/storybook-static/assets/{NotificationsHost.stories-Bq3X0zOH.js → NotificationsHost.stories-Df9Sciyb.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect-B7_-_SsF.js → ODataMultiSelect-_5_Hrv8p.js} +1 -1
- package/storybook-static/assets/{ODataMultiSelect.stories-BNFsF78C.js → ODataMultiSelect.stories-DWTlih_F.js} +1 -1
- package/storybook-static/assets/{ODataSelect-BDDK25Nk.js → ODataSelect-xX8_14hD.js} +1 -1
- package/storybook-static/assets/{ODataSelect.stories-DUh5DBtM.js → ODataSelect.stories-B_VSMkR5.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect-DBs7NzjO.js → ODataTreeMultiSelect-CheCWkrj.js} +1 -1
- package/storybook-static/assets/{ODataTreeMultiSelect.stories-HAT4WTM-.js → ODataTreeMultiSelect.stories-CAWAJxdC.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect-imLw4plg.js → ODataTreeSelect-ZQN9ZhPc.js} +1 -1
- package/storybook-static/assets/{ODataTreeSelect.stories-URCAozFr.js → ODataTreeSelect.stories-CYC_eiFv.js} +1 -1
- package/storybook-static/assets/{OneStepScroller-KNIY7BEL.js → OneStepScroller-KFcpHiAM.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-C4Z1vWiO.js → PeriodSelect-BgQWqB2a.js} +1 -1
- package/storybook-static/assets/{PeriodSelect-Dg4cO0kt.js → PeriodSelect-DN9SFKXh.js} +1 -1
- package/storybook-static/assets/{PeriodSelect.stories-CcVbKheD.js → PeriodSelect.stories-DcUE2clK.js} +1 -1
- package/storybook-static/assets/{PickerSelectionToolbar-C_OkpXnl.js → PickerSelectionToolbar-CvqU44D-.js} +1 -1
- package/storybook-static/assets/{PickerTriggerActions-DoqVHiKv.js → PickerTriggerActions-DZzNAe4M.js} +1 -1
- package/storybook-static/assets/{Popover-BhdTqLlb.js → Popover-B1_qmzkr.js} +1 -1
- package/storybook-static/assets/{Popover-N6YINSY_.js → Popover-iSasApKA.js} +1 -1
- package/storybook-static/assets/{Popover.stories-CN59PWzR.js → Popover.stories-CGLUaRgH.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-Ctgz_cfn.js → PresetRangeDateInput-CxyBq2XS.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput-CXs3TAYN.js → PresetRangeDateInput-D_ylm7hV.js} +1 -1
- package/storybook-static/assets/{PresetRangeDateInput.stories-B7INPvQC.js → PresetRangeDateInput.stories-DgrBel6_.js} +1 -1
- package/storybook-static/assets/{PresetSelect-BEvkvTRL.js → PresetSelect-CrdvEugF.js} +1 -1
- package/storybook-static/assets/{RadioButton-0RVpzxzk.js → RadioButton-DW4ph1Xp.js} +1 -1
- package/storybook-static/assets/{RadioButton-BfyYyhLa.js → RadioButton-DwyUH5ms.js} +1 -1
- package/storybook-static/assets/{RadioButton.stories-D27stCgN.js → RadioButton.stories-6q7CeUZY.js} +1 -1
- package/storybook-static/assets/{RadioGroup-CFrv1NLu.js → RadioGroup-BumTRrwE.js} +1 -1
- package/storybook-static/assets/{RadioGroup-DrAOT8A_.js → RadioGroup-DshEU96S.js} +1 -1
- package/storybook-static/assets/{RadioGroup.stories-C4oBCJdD.js → RadioGroup.stories-Bwv8Bgn8.js} +1 -1
- package/storybook-static/assets/{Scrollable-DsEfPtLq.js → Scrollable-ZI0zA9wz.js} +1 -1
- package/storybook-static/assets/{Select-DOcRt1WX.js → Select-CP1Ijv9g.js} +1 -1
- package/storybook-static/assets/{Select-Co7ThaEv.js → Select-CjuyI3wO.js} +1 -1
- package/storybook-static/assets/{Select.stories-BXNsTQVf.js → Select.stories-kCFhGvWP.js} +1 -1
- package/storybook-static/assets/{SelectOptionContent-ZfSH566e.js → SelectOptionContent-C2DjqaM0.js} +1 -1
- package/storybook-static/assets/{SerializableSelect-DY0-hE9S.js → SerializableSelect-CoVoXwJS.js} +1 -1
- package/storybook-static/assets/{SerializableSelect.stories-awgIM5u-.js → SerializableSelect.stories-UTJc7HQF.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-BtpTlEeK.js → SingleDateTimeInput-DobT9m-7.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput-BjaUEsZz.js → SingleDateTimeInput-bIeFRT8c.js} +1 -1
- package/storybook-static/assets/{SingleDateTimeInput.stories-C7QK6_5g.js → SingleDateTimeInput.stories-CwAP5lI3.js} +1 -1
- package/storybook-static/assets/{Slider-aNVrwhr6.js → Slider-CnhBAXNm.js} +1 -1
- package/storybook-static/assets/{Slider-BKv97sQa.js → Slider-DB7dm4uC.js} +1 -1
- package/storybook-static/assets/{Slider.stories-CZvSVBPQ.js → Slider.stories-D7ADzpCF.js} +1 -1
- package/storybook-static/assets/{SliderInput-7X4RLbUB.js → SliderInput-CvmZ86d-.js} +1 -1
- package/storybook-static/assets/{SliderInput-CkIxuEjc.js → SliderInput-DfMdXNjq.js} +1 -1
- package/storybook-static/assets/{SliderInput.stories-DN_GaYcm.js → SliderInput.stories-CKe5q8PZ.js} +1 -1
- package/storybook-static/assets/{Sortable-CmftIyd3.js → Sortable-D-PG0esR.js} +1 -1
- package/storybook-static/assets/{Sortable.stories-Jz0esMg6.js → Sortable.stories-BUUu5LQR.js} +1 -1
- package/storybook-static/assets/{Splitter-DW_9UWfI.js → Splitter-Cbiph6ck.js} +1 -1
- package/storybook-static/assets/{Splitter.stories-D5ynqUat.js → Splitter.stories-z1_IuipN.js} +1 -1
- package/storybook-static/assets/{StateSelect-CLchQToK.js → StateSelect-BfhvHQrQ.js} +1 -1
- package/storybook-static/assets/{StateSelect-BHhwcOHa.js → StateSelect-C6b0aolc.js} +1 -1
- package/storybook-static/assets/{StateSelect.stories-BdwAm9TE.js → StateSelect.stories-yKKasuZq.js} +1 -1
- package/storybook-static/assets/{StringToggle.stories-mZtN5ZqY.js → StringToggle.stories-mHQXke0Z.js} +1 -1
- package/storybook-static/assets/{Switch-Bf1Zr3rq.js → Switch--s8CABgk.js} +1 -1
- package/storybook-static/assets/{Switch-DfMUb2ZQ.js → Switch-DtYu0DX3.js} +1 -1
- package/storybook-static/assets/{Switch.stories-BsZrt00p.js → Switch.stories-DqVmpD3F.js} +1 -1
- package/storybook-static/assets/{Table-DBkYYLix.js → Table-CS-8NjMS.js} +1 -1
- package/storybook-static/assets/{Table.stories-MXx2G8Ou.js → Table.stories-BDEFvavq.js} +1 -1
- package/storybook-static/assets/{Tabs-DmkzIl51.js → Tabs-DVAc2sEq.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-0XRI9VXR.js → Tabs.stories-Bx3SVBYV.js} +1 -1
- package/storybook-static/assets/{TabsBox-BcZIzq2f.js → TabsBox-DIc3bAG9.js} +1 -1
- package/storybook-static/assets/{TagInput-C1ynHkEU.js → TagInput-DvJOyiDa.js} +1 -1
- package/storybook-static/assets/{TagInput.stories-zByD7t70.js → TagInput.stories-BfUUxxvB.js} +1 -1
- package/storybook-static/assets/{Text-B8JQ8g6X.js → Text-DDM_QNpo.js} +1 -1
- package/storybook-static/assets/{Textarea-D7_oAPwc.js → Textarea-B8jfChqH.js} +1 -1
- package/storybook-static/assets/{Textarea-DlwCUO2d.js → Textarea-CouwxZMS.js} +1 -1
- package/storybook-static/assets/{Textarea.stories-AVxqLKSu.js → Textarea.stories-B5YnG6Hg.js} +1 -1
- package/storybook-static/assets/{TimePanel-DnyfOpfG.js → TimePanel-Ce44lmoA.js} +1 -1
- package/storybook-static/assets/{TimePanel.stories-jO6WSBvm.js → TimePanel.stories-dMXzRVpT.js} +1 -1
- package/storybook-static/assets/{Toggle-XKm0YNzz.js → Toggle-BLb3M4N1.js} +1 -1
- package/storybook-static/assets/{Toggle-C0wWpjgI.js → Toggle-C8qL0JdM.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-C0i6HRO0.js → Toggle.stories-CR8xCkXd.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-C3LhJxzz.js → TreeMultiSelect-5fHQVUTd.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect-D9UnDwNu.js → TreeMultiSelect-Bttryv5k.js} +1 -1
- package/storybook-static/assets/{TreeMultiSelect.stories-Cy1neWKt.js → TreeMultiSelect.stories-B4zkiRfC.js} +1 -1
- package/storybook-static/assets/{TreePickerBase-l3-d4zHW.js → TreePickerBase-B_XyJaYL.js} +1 -1
- package/storybook-static/assets/{TreeSelect-B6_w40IO.js → TreeSelect-BmV5BgHm.js} +1 -1
- package/storybook-static/assets/{TreeSelect-BGUby1c1.js → TreeSelect-_mFMic9T.js} +1 -1
- package/storybook-static/assets/{TreeSelect.stories-euNnlIhp.js → TreeSelect.stories-D-lz21y2.js} +1 -1
- package/storybook-static/assets/{TreeTable-BdYK6ILe.js → TreeTable-BjnuFqoj.js} +1 -1
- package/storybook-static/assets/{TreeTable.stories-BV7UtxnX.js → TreeTable.stories-OEii5uhT.js} +1 -1
- package/storybook-static/assets/{async-DLn-s4lH.js → async-BggDKhCa.js} +1 -1
- package/storybook-static/assets/{blocks-CQ7RHmDr.js → blocks-DXv0kKnO.js} +3 -3
- package/storybook-static/assets/{browserAndReact-8A8IpU0z.js → browserAndReact-CJg4Htw7.js} +1 -1
- package/storybook-static/assets/{check-DhUE5WQh.js → check-BDF3qN6C.js} +1 -1
- package/storybook-static/assets/{chevron-down-D4lkPPbf.js → chevron-down-DycW5rEN.js} +1 -1
- package/storybook-static/assets/{chevron-left-M03WkC-a.js → chevron-left-C5fp0Uga.js} +1 -1
- package/storybook-static/assets/{chevron-right-BJAsqJhn.js → chevron-right-BtcaEPgU.js} +1 -1
- package/storybook-static/assets/{chunk-W22LQPXL-CiwCRaDo.js → chunk-W22LQPXL-DpbhHTe5.js} +1 -1
- package/storybook-static/assets/{circle-alert-q4Jm4R62.js → circle-alert-BHmYiVSQ.js} +1 -1
- package/storybook-static/assets/{circle-check-2STuXttp.js → circle-check-D-kWZdLj.js} +1 -1
- package/storybook-static/assets/{components-B5pHXbt2.js → components-CiK0i2y5.js} +3 -3
- package/storybook-static/assets/{contextMenu-C4kMhuxz.js → contextMenu-BuB7GWKM.js} +1 -1
- package/storybook-static/assets/{defaultRenderers-WqMviHeH.js → defaultRenderers-DKIVh61V.js} +1 -1
- package/storybook-static/assets/{download-A_0kizVg.js → download-CHMcYpj3.js} +1 -1
- package/storybook-static/assets/{filesAndExcel-CfQAZrQE.js → filesAndExcel-DlArA_GW.js} +1 -1
- package/storybook-static/assets/{floating-ui.react-WPEHN77t.js → floating-ui.react-2n8Uyf0J.js} +1 -1
- package/storybook-static/assets/{formatters-DmwKOTAq.js → formatters-BwCs7xCt.js} +1 -1
- package/storybook-static/assets/{formatters-runtime-bVpg8aMB.js → formatters-runtime-ibdtp7C6.js} +1 -1
- package/storybook-static/assets/{foundationLib-C01I_M2-.js → foundationLib-DAvQ9wk8.js} +1 -1
- package/storybook-static/assets/{hooks-CE5XnwC0.js → hooks-D0mbXwcm.js} +1 -1
- package/storybook-static/assets/iframe-B1M7f4Qn.js +1 -0
- package/storybook-static/assets/{iframe-B94C5PVz.js → iframe-BnjRbLCp.js} +3 -3
- package/storybook-static/assets/{info-DMdsXpNu.js → info-B9srbxQP.js} +1 -1
- package/storybook-static/assets/{odata-C_Kp4nRV.js → odata-D9w_2DW1.js} +1 -1
- package/storybook-static/assets/{odataAndTables-BKMVN-Ie.js → odataAndTables-B7U8x4CV.js} +1 -1
- package/storybook-static/assets/{odataFetchFn-ClGPC3PY.js → odataFetchFn-BrsJ-DlE.js} +1 -1
- package/storybook-static/assets/{odataStoryFixtures-BBUrFOHI.js → odataStoryFixtures-CbO3dfw1.js} +1 -1
- package/storybook-static/assets/{persisted-Bgbpgwot.js → persisted-DXbdpvSU.js} +1 -1
- package/storybook-static/assets/{pureUtilities-Bhx4RJT9.js → pureUtilities-BtrtdX0r.js} +1 -1
- package/storybook-static/assets/{react-BS8poczJ.js → react-DmKWdnt1.js} +1 -1
- package/storybook-static/assets/{refresh-cw-DOf-HEqz.js → refresh-cw-C2Rk5OjE.js} +1 -1
- package/storybook-static/assets/{runtimeAndState-BI3ShVSh.js → runtimeAndState-Be2a2JfZ.js} +1 -1
- package/storybook-static/assets/{settings-2-D80RVegV.js → settings-2-CuAc9ekV.js} +1 -1
- package/storybook-static/assets/{sortable-BNyMs1Ud.js → sortable-DF8VgD8R.js} +1 -1
- package/storybook-static/assets/{syntaxhighlighter-T5IQBZDB-B7A0UpdW.js → syntaxhighlighter-T5IQBZDB-BnGJW0L9.js} +1 -1
- package/storybook-static/assets/{trash-2-D6iHrdib.js → trash-2-DRXwetzV.js} +1 -1
- package/storybook-static/assets/{triangle-alert-DHXjljtr.js → triangle-alert-D5785xcd.js} +1 -1
- package/storybook-static/assets/{useODataSelectBase-ix89Wh6D.js → useODataSelectBase-DfOi4e0X.js} +1 -1
- package/storybook-static/assets/{useODataTreeData-Cjry2j-1.js → useODataTreeData-BBSy4G6V.js} +1 -1
- package/storybook-static/assets/{usePickerQuery-Kxa1KWXx.js → usePickerQuery-BYa25rmI.js} +1 -1
- package/storybook-static/assets/{usePickerTriggerController-BdBNKr8c.js → usePickerTriggerController-CwgtrL5F.js} +1 -1
- package/storybook-static/assets/{x-C2J_sxhT.js → x-DvnP0o1b.js} +1 -1
- package/storybook-static/iframe.html +2 -2
- package/storybook-static/project.json +1 -1
- package/dist/chunks/date-input-Dr5QNVT6.js +0 -341
- package/storybook-static/assets/iframe-G3pIVTVE.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-BTT7zSqx.js","names":[],"sources":["../../src/popover/components/Popover.module.scss","../../src/popover/components/PopoverContext.tsx","../../src/popover/components/PopoverContent.tsx","../../src/popover/components/PopoverTrigger.tsx","../../src/popover/components/Popover.tsx","../../src/popover/Popover.module.scss","../../src/popover/FloatingPopover.tsx","../../src/popover/FloatingTooltip.tsx"],"sourcesContent":[".popover {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\n\tborder: var(--border-width) solid var(--border-1);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-md));\n\n\tz-index: var(--z-popover);\n\n\t&.primary {\n\t\tbackground-color: var(--surface-0);\n\t}\n\n\t&.secondary {\n\t\tbackground-color: var(--surface-1);\n\t}\n}\n","import React, { createContext, useContext } from \"react\";\n\nimport { Placement, useFloating } from \"@floating-ui/react\";\nimport { createMissingContextError } from \"@ryuzaki13/react-foundation-lib/error\";\n\ninterface PopoverContextValue {\n\topen: boolean;\n\tsetOpen: React.Dispatch<React.SetStateAction<boolean>>;\n\trefs: ReturnType<typeof useFloating>[\"refs\"];\n\tfloatingStyles: React.CSSProperties;\n\tplacement: Placement;\n\tmiddlewareData: ReturnType<typeof useFloating>[\"middlewareData\"];\n\tarrowRef: React.RefObject<HTMLDivElement | null>;\n}\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport function usePopoverContext() {\n\tconst context = useContext(PopoverContext);\n\tif (!context) {\n\t\tthrow createMissingContextError({\n\t\t\thookName: \"usePopoverContext\",\n\t\t\tproviderName: \"Popover\"\n\t\t});\n\t}\n\treturn context;\n}\n","import React, { useCallback, useRef } from \"react\";\n\nimport { FloatingPortal } from \"@floating-ui/react\";\nimport { useClickOutside, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { TooltipArrow } from \"../../floating-arrow\";\n\nimport styles from \"./Popover.module.scss\";\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverContentProps {\n\tchildren: React.ReactNode | ((ctx: { setClose: () => void }) => React.ReactNode);\n\tonClose?: () => void;\n\tcloseOnOutside?: boolean;\n\tcloseOnEscape?: boolean;\n\tdisableOutsideClick?: boolean;\n\tbackground?: \"primary\" | \"secondary\";\n}\n\n/**\n * Содержимое Popover, отображаемое в портале.\n */\nexport const PopoverContent: React.FC<PopoverContentProps> = ({\n\tchildren,\n\tonClose,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\tbackground = \"secondary\"\n}) => {\n\tconst { open, setOpen, refs, floatingStyles, middlewareData, placement, arrowRef } = usePopoverContext();\n\tconst floatingElementRef = useRef<HTMLDivElement | null>(null);\n\tconst setFloating = useCallback(\n\t\t(node: HTMLDivElement | null) => {\n\t\t\tfloatingElementRef.current = node;\n\t\t\trefs.setFloating(node);\n\t\t},\n\t\t[refs]\n\t);\n\n\tconst floatingRef = useOverlayFocus<HTMLDivElement>({\n\t\tactive: open,\n\t\tinitialFocus: \"container\",\n\t\trestoreFocus: true,\n\t\tcontainerRef: floatingElementRef\n\t});\n\n\tconst setClose = useCallback(() => {\n\t\tif (!open) return;\n\t\tsetOpen(false);\n\t\tonClose?.();\n\t}, [setOpen, onClose, open]);\n\n\tuseEscapeDismiss({\n\t\tactive: open,\n\t\tenabled: closeOnEscape,\n\t\tonDismiss: setClose,\n\t\tcontainerRef: floatingRef as React.RefObject<HTMLElement | null>\n\t});\n\n\tconst outsideClose = useCallback(() => {\n\t\tif (!open || disableOutsideClick) return;\n\t\tif (closeOnOutside) setClose();\n\t}, [open, disableOutsideClick, closeOnOutside, setClose]);\n\n\tuseClickOutside([refs.floating as React.RefObject<HTMLElement>, refs.reference as React.RefObject<HTMLElement>], outsideClose);\n\n\tif (!open) return null;\n\n\treturn (\n\t\t<FloatingPortal>\n\t\t\t<div\n\t\t\t\tref={setFloating}\n\t\t\t\tstyle={floatingStyles}\n\t\t\t\tclassName={cn(styles.popover, styles[background])}\n\t\t\t\trole=\"dialog\"\n\t\t\t\taria-modal=\"true\"\n\t\t\t\ttabIndex={-1}>\n\t\t\t\t{typeof children === \"function\" ? children({ setClose }) : children}\n\t\t\t\t<TooltipArrow ref={arrowRef} placement={placement} middlewareData={middlewareData} />\n\t\t\t</div>\n\t\t</FloatingPortal>\n\t);\n};\n","import React, { cloneElement, useCallback } from \"react\";\n\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverTriggerProps {\n\tpassive?: true;\n\tchildren: React.ReactElement<React.HTMLAttributes<Element> & { ref?: React.Ref<Element> }>;\n}\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ passive, children }) => {\n\tconst { open, setOpen, refs } = usePopoverContext();\n\n\tconst handleClick = useCallback(\n\t\t(e: React.MouseEvent) => {\n\t\t\tif (children.props.onClick) {\n\t\t\t\tchildren.props.onClick(e);\n\t\t\t}\n\t\t\tif (e.defaultPrevented) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\n\t\t\tif (passive) return;\n\n\t\t\tsetOpen((v) => !v);\n\t\t},\n\t\t[children, setOpen, passive]\n\t);\n\n\treturn cloneElement(children as React.JSX.Element, {\n\t\tref: refs.setReference,\n\t\t\"aria-expanded\": open,\n\t\tonClick: handleClick\n\t});\n};\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { useCallback, useRef, useState } from \"react\";\n\nimport { arrow, autoUpdate, flip, offset, Placement, shift, useFloating } from \"@floating-ui/react\";\n\nimport { PopoverContent } from \"./PopoverContent\";\nimport { PopoverContext } from \"./PopoverContext\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\n\nexport interface PopoverProps {\n\tchildren: React.ReactNode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\n/**\n * Контролируемый Popover.\n * Используется в связке с Popover.Trigger и Popover.Content.\n */\nconst PopoverRoot: React.FC<PopoverProps> = ({ children, open: controlledOpen, defaultOpen, onOpenChange, placement = \"bottom\" }) => {\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);\n\n\tconst isControlled = controlledOpen !== undefined;\n\tconst open = isControlled ? controlledOpen : uncontrolledOpen;\n\tconst setOpen = useCallback<React.Dispatch<React.SetStateAction<boolean>>>(\n\t\t(value) => {\n\t\t\tconst next = typeof value === \"function\" ? value(open) : value;\n\t\t\tif (!isControlled) setUncontrolledOpen(next);\n\t\t\tonOpenChange?.(next);\n\t\t},\n\t\t[isControlled, onOpenChange, open]\n\t);\n\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: actualPlacement\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(8), flip(), shift({ padding: 16 }), arrow({ element: arrowRef.current })],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\treturn (\n\t\t<PopoverContext.Provider value={{ open, setOpen, refs, floatingStyles, placement: actualPlacement, middlewareData, arrowRef }}>\n\t\t\t{children}\n\t\t</PopoverContext.Provider>\n\t);\n};\n\n/**\n * Композиционное API:\n * <Popover>\n * <Popover.Trigger />\n * <Popover.Content />\n * </Popover>\n */\nexport const Popover = Object.assign(PopoverRoot, {\n\tTrigger: PopoverTrigger,\n\tContent: PopoverContent\n});\n",".tooltipPanel {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\tbackground-color: var(--surface-1);\n\tborder: var(--border-width) solid var(--border-2);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-sm));\n\n\t&.negative {\n\t\t--border-1: var(--content-0);\n\n\t\tbackground-color: var(--content-0);\n\t\tborder-color: var(--border-1);\n\t\tcolor: var(--surface-1);\n\t}\n\n\t&.information {\n\t\t--border-1: var(--status-info-text);\n\n\t\tbackground-color: var(--status-info-text);\n\t\tborder-color: var(--status-info-text);\n\t\tcolor: var(--status-info-on-fill);\n\t}\n\n\t&.error {\n\t\t--border-1: var(--status-error-text);\n\n\t\tbackground-color: var(--status-error-text);\n\t\tborder-color: var(--status-error-text);\n\t\tcolor: var(--status-error-on-fill);\n\t}\n\n\t&.warning {\n\t\t--border-1: var(--status-warning-text);\n\n\t\tbackground-color: var(--status-warning-text);\n\t\tborder-color: var(--status-warning-text);\n\t\tcolor: var(--status-warning-on-fill);\n\t}\n\n\t&.success {\n\t\t--border-1: var(--status-success-text);\n\n\t\tbackground-color: var(--status-success-text);\n\t\tborder-color: var(--status-success-text);\n\t\tcolor: var(--status-success-on-fill);\n\t}\n}\n\n.tooltip {\n\tz-index: var(--z-tooltip);\n\tpointer-events: none;\n\n\ttext-align: initial;\n\tfont-size: var(--font-size-sm);\n\tfont-style: normal;\n\tfont-weight: 500;\n\tfont-variation-settings: \"wght\" 500;\n\tline-height: var(--line-height);\n\n\t@extend .tooltipPanel;\n}\n","/* eslint-disable react-hooks/refs */\nimport React, { useLayoutEffect, useRef, useState } from \"react\";\n\nimport {\n\tarrow,\n\tautoUpdate,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tuseDismiss,\n\tuseFloating,\n\tuseHover,\n\tuseInteractions,\n\tuseRole\n} from \"@floating-ui/react\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { createPortal } from \"react-dom\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\ninterface FloatingPopoverProps {\n\tcontent: React.ReactNode;\n\tchildren: React.ReactNode;\n\topenOnHover?: boolean;\n\tplacement?: Placement;\n\topenDelay?: number;\n\tcloseDelay?: number;\n\tmaxWidth?: number;\n\tstate?: \"information\" | \"error\" | \"warning\" | \"success\" | \"negative\";\n\ttooltip?: true;\n\t/**\n\t * Изменяется вместе с CSS-координатой trigger, когда её изменение не отслеживается `autoUpdate`.\n\t * После commit React выполняется повторный расчёт позиции открытой floating-панели.\n\t */\n\tpositionUpdateKey?: unknown;\n}\n\nexport const FloatingPopover: React.FC<FloatingPopoverProps> = ({\n\tcontent,\n\tchildren,\n\topenOnHover = true,\n\tplacement = \"bottom\",\n\topenDelay = 200,\n\tcloseDelay = 100,\n\tmaxWidth,\n\tstate,\n\ttooltip,\n\tpositionUpdateKey\n}) => {\n\tconst [open, setOpen] = useState(false);\n\tconst arrowRef = useRef<HTMLDivElement>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tcontext,\n\t\tplacement: computedPlacement,\n\t\tupdate\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\tmiddleware: [\n\t\t\toffset(8),\n\t\t\tflip({ fallbackAxisSideDirection: \"end\", fallbackPlacements: [\"top\", \"right\", \"bottom\"] }),\n\t\t\tshift({ padding: 16 }),\n\t\t\tarrow({ element: arrowRef, padding: 8 })\n\t\t],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (open) {\n\t\t\tvoid update();\n\t\t}\n\t}, [open, positionUpdateKey, update]);\n\n\tconst hover = useHover(context, {\n\t\tenabled: openOnHover,\n\t\tmove: false,\n\t\tdelay: {\n\t\t\topen: openDelay,\n\t\t\tclose: closeDelay\n\t\t}\n\t});\n\tconst dismiss = useDismiss(context);\n\tconst role = useRole(context);\n\n\tconst { getReferenceProps, getFloatingProps } = useInteractions([hover, dismiss, role]);\n\n\treturn (\n\t\t<>\n\t\t\t<span ref={refs.setReference} {...getReferenceProps()} style={{ lineHeight: 1 }}>\n\t\t\t\t{children}\n\t\t\t</span>\n\n\t\t\t{open &&\n\t\t\t\tcreatePortal(\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={refs.setFloating}\n\t\t\t\t\t\tstyle={{ ...floatingStyles, zIndex: \"var(--z-tooltip)\", maxWidth: maxWidth ? `${maxWidth}em` : undefined }}\n\t\t\t\t\t\t{...getFloatingProps()}\n\t\t\t\t\t\trole=\"tooltip\"\n\t\t\t\t\t\tclassName={cn(styles.tooltipPanel, tooltip && styles.tooltip, state && styles[state])}>\n\t\t\t\t\t\t{content}\n\n\t\t\t\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t\t\t\t</div>,\n\t\t\t\t\tdocument.body\n\t\t\t\t)}\n\t\t</>\n\t);\n};\n","import React, { useEffect, useRef } from \"react\";\n\nimport { arrow, flip, offset, shift, useFloating } from \"@floating-ui/react\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\nexport const FloatingTooltip: React.FC<{\n\tx: number;\n\ty: number;\n\tchildren: React.ReactNode;\n}> = ({ x, y, children }) => {\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: computedPlacement\n\t} = useFloating({\n\t\tstrategy: \"absolute\",\n\t\tplacement: \"top\",\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(6), flip(), shift({ padding: 16 }), arrow({ element: arrowRef })]\n\t});\n\n\tuseEffect(() => {\n\t\tif (refs.setReference) {\n\t\t\trefs.setReference({\n\t\t\t\tgetBoundingClientRect: () =>\n\t\t\t\t\t({\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t\twidth: 0,\n\t\t\t\t\t\theight: 0,\n\t\t\t\t\t\ttop: y,\n\t\t\t\t\t\tleft: x,\n\t\t\t\t\t\tbottom: y,\n\t\t\t\t\t\tright: x,\n\t\t\t\t\t\ttoJSON: () => {}\n\t\t\t\t\t}) as DOMRect\n\t\t\t});\n\t\t}\n\t}, [x, y, refs]);\n\n\treturn (\n\t\t<div ref={refs.setFloating} style={{ ...floatingStyles, position: \"absolute\", pointerEvents: \"none\" }} className={styles.tooltip}>\n\t\t\t{children}\n\n\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t</div>\n\t);\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"popover-IExDrsF6.js","names":[],"sources":["../../src/popover/components/Popover.module.scss","../../src/popover/components/PopoverContext.tsx","../../src/popover/components/PopoverContent.tsx","../../src/popover/components/PopoverTrigger.tsx","../../src/popover/components/Popover.tsx","../../src/popover/Popover.module.scss","../../src/popover/FloatingPopover.tsx","../../src/popover/FloatingTooltip.tsx"],"sourcesContent":[".popover {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\n\tborder: var(--border-width) solid var(--border-1);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-md));\n\n\tz-index: var(--z-popover);\n\n\t&.primary {\n\t\tbackground-color: var(--surface-0);\n\t}\n\n\t&.secondary {\n\t\tbackground-color: var(--surface-1);\n\t}\n}\n","import React, { createContext, useContext } from \"react\";\n\nimport { Placement, useFloating } from \"@floating-ui/react\";\nimport { createMissingContextError } from \"@ryuzaki13/react-foundation-lib/error\";\n\ninterface PopoverContextValue {\n\topen: boolean;\n\tsetOpen: React.Dispatch<React.SetStateAction<boolean>>;\n\trefs: ReturnType<typeof useFloating>[\"refs\"];\n\tfloatingStyles: React.CSSProperties;\n\tplacement: Placement;\n\tmiddlewareData: ReturnType<typeof useFloating>[\"middlewareData\"];\n\tarrowRef: React.RefObject<HTMLDivElement | null>;\n}\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport function usePopoverContext() {\n\tconst context = useContext(PopoverContext);\n\tif (!context) {\n\t\tthrow createMissingContextError({\n\t\t\thookName: \"usePopoverContext\",\n\t\t\tproviderName: \"Popover\"\n\t\t});\n\t}\n\treturn context;\n}\n","import React, { useCallback, useRef } from \"react\";\n\nimport { FloatingPortal } from \"@floating-ui/react\";\nimport { useClickOutside, useEscapeDismiss, useOverlayFocus } from \"@ryuzaki13/react-foundation-lib/dom\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { TooltipArrow } from \"../../floating-arrow\";\n\nimport styles from \"./Popover.module.scss\";\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverContentProps {\n\tchildren: React.ReactNode | ((ctx: { setClose: () => void }) => React.ReactNode);\n\tonClose?: () => void;\n\tcloseOnOutside?: boolean;\n\tcloseOnEscape?: boolean;\n\tdisableOutsideClick?: boolean;\n\tbackground?: \"primary\" | \"secondary\";\n}\n\n/**\n * Содержимое Popover, отображаемое в портале.\n */\nexport const PopoverContent: React.FC<PopoverContentProps> = ({\n\tchildren,\n\tonClose,\n\tcloseOnOutside = true,\n\tcloseOnEscape = true,\n\tdisableOutsideClick = false,\n\tbackground = \"secondary\"\n}) => {\n\tconst { open, setOpen, refs, floatingStyles, middlewareData, placement, arrowRef } = usePopoverContext();\n\tconst floatingElementRef = useRef<HTMLDivElement | null>(null);\n\tconst setFloating = useCallback(\n\t\t(node: HTMLDivElement | null) => {\n\t\t\tfloatingElementRef.current = node;\n\t\t\trefs.setFloating(node);\n\t\t},\n\t\t[refs]\n\t);\n\n\tconst floatingRef = useOverlayFocus<HTMLDivElement>({\n\t\tactive: open,\n\t\tinitialFocus: \"container\",\n\t\trestoreFocus: true,\n\t\tcontainerRef: floatingElementRef\n\t});\n\n\tconst setClose = useCallback(() => {\n\t\tif (!open) return;\n\t\tsetOpen(false);\n\t\tonClose?.();\n\t}, [setOpen, onClose, open]);\n\n\tuseEscapeDismiss({\n\t\tactive: open,\n\t\tenabled: closeOnEscape,\n\t\tonDismiss: setClose,\n\t\tcontainerRef: floatingRef as React.RefObject<HTMLElement | null>\n\t});\n\n\tconst outsideClose = useCallback(() => {\n\t\tif (!open || disableOutsideClick) return;\n\t\tif (closeOnOutside) setClose();\n\t}, [open, disableOutsideClick, closeOnOutside, setClose]);\n\n\tuseClickOutside([refs.floating as React.RefObject<HTMLElement>, refs.reference as React.RefObject<HTMLElement>], outsideClose);\n\n\tif (!open) return null;\n\n\treturn (\n\t\t<FloatingPortal>\n\t\t\t<div\n\t\t\t\tref={setFloating}\n\t\t\t\tstyle={floatingStyles}\n\t\t\t\tclassName={cn(styles.popover, styles[background])}\n\t\t\t\trole=\"dialog\"\n\t\t\t\taria-modal=\"true\"\n\t\t\t\ttabIndex={-1}>\n\t\t\t\t{typeof children === \"function\" ? children({ setClose }) : children}\n\t\t\t\t<TooltipArrow ref={arrowRef} placement={placement} middlewareData={middlewareData} />\n\t\t\t</div>\n\t\t</FloatingPortal>\n\t);\n};\n","import React, { cloneElement, useCallback } from \"react\";\n\nimport { usePopoverContext } from \"./PopoverContext\";\n\nexport interface PopoverTriggerProps {\n\tpassive?: true;\n\tchildren: React.ReactElement<React.HTMLAttributes<Element> & { ref?: React.Ref<Element> }>;\n}\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ passive, children }) => {\n\tconst { open, setOpen, refs } = usePopoverContext();\n\n\tconst handleClick = useCallback(\n\t\t(e: React.MouseEvent) => {\n\t\t\tif (children.props.onClick) {\n\t\t\t\tchildren.props.onClick(e);\n\t\t\t}\n\t\t\tif (e.defaultPrevented) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\n\t\t\tif (passive) return;\n\n\t\t\tsetOpen((v) => !v);\n\t\t},\n\t\t[children, setOpen, passive]\n\t);\n\n\treturn cloneElement(children as React.JSX.Element, {\n\t\tref: refs.setReference,\n\t\t\"aria-expanded\": open,\n\t\tonClick: handleClick\n\t});\n};\n","/* eslint-disable react-refresh/only-export-components */\nimport React, { useCallback, useRef, useState } from \"react\";\n\nimport { arrow, autoUpdate, flip, offset, Placement, shift, useFloating } from \"@floating-ui/react\";\n\nimport { PopoverContent } from \"./PopoverContent\";\nimport { PopoverContext } from \"./PopoverContext\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\n\nexport interface PopoverProps {\n\tchildren: React.ReactNode;\n\tplacement?: Placement;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n}\n\n/**\n * Контролируемый Popover.\n * Используется в связке с Popover.Trigger и Popover.Content.\n */\nconst PopoverRoot: React.FC<PopoverProps> = ({ children, open: controlledOpen, defaultOpen, onOpenChange, placement = \"bottom\" }) => {\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen ?? false);\n\n\tconst isControlled = controlledOpen !== undefined;\n\tconst open = isControlled ? controlledOpen : uncontrolledOpen;\n\tconst setOpen = useCallback<React.Dispatch<React.SetStateAction<boolean>>>(\n\t\t(value) => {\n\t\t\tconst next = typeof value === \"function\" ? value(open) : value;\n\t\t\tif (!isControlled) setUncontrolledOpen(next);\n\t\t\tonOpenChange?.(next);\n\t\t},\n\t\t[isControlled, onOpenChange, open]\n\t);\n\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: actualPlacement\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(8), flip(), shift({ padding: 16 }), arrow({ element: arrowRef.current })],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\treturn (\n\t\t<PopoverContext.Provider value={{ open, setOpen, refs, floatingStyles, placement: actualPlacement, middlewareData, arrowRef }}>\n\t\t\t{children}\n\t\t</PopoverContext.Provider>\n\t);\n};\n\n/**\n * Композиционное API:\n * <Popover>\n * <Popover.Trigger />\n * <Popover.Content />\n * </Popover>\n */\nexport const Popover = Object.assign(PopoverRoot, {\n\tTrigger: PopoverTrigger,\n\tContent: PopoverContent\n});\n",".tooltipPanel {\n\tpadding: var(--space-sm);\n\t// background-image: radial-gradient(var(--surface-0) 50%, var(--surface-1) 100%);\n\tbackground-color: var(--surface-1);\n\tborder: var(--border-width) solid var(--border-2);\n\tborder-radius: var(--radius-sm);\n\tcolor: var(--content-0);\n\n\tfilter: drop-shadow(var(--shadow-sm));\n\n\t&.negative {\n\t\t--border-1: var(--content-0);\n\n\t\tbackground-color: var(--content-0);\n\t\tborder-color: var(--border-1);\n\t\tcolor: var(--surface-1);\n\t}\n\n\t&.information {\n\t\t--border-1: var(--status-info-text);\n\n\t\tbackground-color: var(--status-info-text);\n\t\tborder-color: var(--status-info-text);\n\t\tcolor: var(--status-info-on-fill);\n\t}\n\n\t&.error {\n\t\t--border-1: var(--status-error-text);\n\n\t\tbackground-color: var(--status-error-text);\n\t\tborder-color: var(--status-error-text);\n\t\tcolor: var(--status-error-on-fill);\n\t}\n\n\t&.warning {\n\t\t--border-1: var(--status-warning-text);\n\n\t\tbackground-color: var(--status-warning-text);\n\t\tborder-color: var(--status-warning-text);\n\t\tcolor: var(--status-warning-on-fill);\n\t}\n\n\t&.success {\n\t\t--border-1: var(--status-success-text);\n\n\t\tbackground-color: var(--status-success-text);\n\t\tborder-color: var(--status-success-text);\n\t\tcolor: var(--status-success-on-fill);\n\t}\n}\n\n.tooltip {\n\tz-index: var(--z-tooltip);\n\tpointer-events: none;\n\n\ttext-align: initial;\n\tfont-size: var(--font-size-sm);\n\tfont-style: normal;\n\tfont-weight: 500;\n\tfont-variation-settings: \"wght\" 500;\n\tline-height: var(--line-height);\n\n\t@extend .tooltipPanel;\n}\n","/* eslint-disable react-hooks/refs */\nimport React, { useLayoutEffect, useRef, useState } from \"react\";\n\nimport {\n\tarrow,\n\tautoUpdate,\n\tflip,\n\toffset,\n\tPlacement,\n\tshift,\n\tuseDismiss,\n\tuseFloating,\n\tuseHover,\n\tuseInteractions,\n\tuseRole\n} from \"@floating-ui/react\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { createPortal } from \"react-dom\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\ninterface FloatingPopoverProps {\n\tcontent: React.ReactNode;\n\tchildren: React.ReactNode;\n\topenOnHover?: boolean;\n\tplacement?: Placement;\n\topenDelay?: number;\n\tcloseDelay?: number;\n\tmaxWidth?: number;\n\tstate?: \"information\" | \"error\" | \"warning\" | \"success\" | \"negative\";\n\ttooltip?: true;\n\t/**\n\t * Изменяется вместе с CSS-координатой trigger, когда её изменение не отслеживается `autoUpdate`.\n\t * После commit React выполняется повторный расчёт позиции открытой floating-панели.\n\t */\n\tpositionUpdateKey?: unknown;\n}\n\nexport const FloatingPopover: React.FC<FloatingPopoverProps> = ({\n\tcontent,\n\tchildren,\n\topenOnHover = true,\n\tplacement = \"bottom\",\n\topenDelay = 200,\n\tcloseDelay = 100,\n\tmaxWidth,\n\tstate,\n\ttooltip,\n\tpositionUpdateKey\n}) => {\n\tconst [open, setOpen] = useState(false);\n\tconst arrowRef = useRef<HTMLDivElement>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tcontext,\n\t\tplacement: computedPlacement,\n\t\tupdate\n\t} = useFloating({\n\t\topen,\n\t\tonOpenChange: setOpen,\n\t\tplacement,\n\t\tmiddleware: [\n\t\t\toffset(8),\n\t\t\tflip({ fallbackAxisSideDirection: \"end\", fallbackPlacements: [\"top\", \"right\", \"bottom\"] }),\n\t\t\tshift({ padding: 16 }),\n\t\t\tarrow({ element: arrowRef, padding: 8 })\n\t\t],\n\t\twhileElementsMounted: autoUpdate\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (open) {\n\t\t\tvoid update();\n\t\t}\n\t}, [open, positionUpdateKey, update]);\n\n\tconst hover = useHover(context, {\n\t\tenabled: openOnHover,\n\t\tmove: false,\n\t\tdelay: {\n\t\t\topen: openDelay,\n\t\t\tclose: closeDelay\n\t\t}\n\t});\n\tconst dismiss = useDismiss(context);\n\tconst role = useRole(context);\n\n\tconst { getReferenceProps, getFloatingProps } = useInteractions([hover, dismiss, role]);\n\n\treturn (\n\t\t<>\n\t\t\t<span ref={refs.setReference} {...getReferenceProps()} style={{ lineHeight: 1 }}>\n\t\t\t\t{children}\n\t\t\t</span>\n\n\t\t\t{open &&\n\t\t\t\tcreatePortal(\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={refs.setFloating}\n\t\t\t\t\t\tstyle={{ ...floatingStyles, zIndex: \"var(--z-tooltip)\", maxWidth: maxWidth ? `${maxWidth}em` : undefined }}\n\t\t\t\t\t\t{...getFloatingProps()}\n\t\t\t\t\t\trole=\"tooltip\"\n\t\t\t\t\t\tclassName={cn(styles.tooltipPanel, tooltip && styles.tooltip, state && styles[state])}>\n\t\t\t\t\t\t{content}\n\n\t\t\t\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t\t\t\t</div>,\n\t\t\t\t\tdocument.body\n\t\t\t\t)}\n\t\t</>\n\t);\n};\n","import React, { useEffect, useRef } from \"react\";\n\nimport { arrow, flip, offset, shift, useFloating } from \"@floating-ui/react\";\n\nimport { FloatingArrow } from \"../floating-arrow/FloatingArrow\";\n\nimport styles from \"./Popover.module.scss\";\n\nexport const FloatingTooltip: React.FC<{\n\tx: number;\n\ty: number;\n\tchildren: React.ReactNode;\n}> = ({ x, y, children }) => {\n\tconst arrowRef = useRef<HTMLDivElement | null>(null);\n\n\tconst {\n\t\trefs,\n\t\tfloatingStyles,\n\t\tmiddlewareData,\n\t\tplacement: computedPlacement\n\t} = useFloating({\n\t\tstrategy: \"absolute\",\n\t\tplacement: \"top\",\n\t\t// eslint-disable-next-line react-hooks/refs\n\t\tmiddleware: [offset(6), flip(), shift({ padding: 16 }), arrow({ element: arrowRef })]\n\t});\n\n\tuseEffect(() => {\n\t\tif (refs.setReference) {\n\t\t\trefs.setReference({\n\t\t\t\tgetBoundingClientRect: () =>\n\t\t\t\t\t({\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t\twidth: 0,\n\t\t\t\t\t\theight: 0,\n\t\t\t\t\t\ttop: y,\n\t\t\t\t\t\tleft: x,\n\t\t\t\t\t\tbottom: y,\n\t\t\t\t\t\tright: x,\n\t\t\t\t\t\ttoJSON: () => {}\n\t\t\t\t\t}) as DOMRect\n\t\t\t});\n\t\t}\n\t}, [x, y, refs]);\n\n\treturn (\n\t\t<div ref={refs.setFloating} style={{ ...floatingStyles, position: \"absolute\", pointerEvents: \"none\" }} className={styles.tooltip}>\n\t\t\t{children}\n\n\t\t\t<FloatingArrow ref={arrowRef} placement={computedPlacement} middlewareData={middlewareData} />\n\t\t</div>\n\t);\n};\n"],"mappings":"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"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { t as e } from "./ui.module-DHVTOqZ0.js";
|
|
2
|
-
import { c as t } from "./input-
|
|
3
|
-
import { a as n, c as r, f as i, i as a, l as o, o as s, p as c, r as l, t as u, u as d } from "./picker-
|
|
4
|
-
import { n as f, r as p } from "./useODataSelectBase-
|
|
2
|
+
import { c as t } from "./input-VC8jEoTa.js";
|
|
3
|
+
import { a as n, c as r, f as i, i as a, l as o, o as s, p as c, r as l, t as u, u as d } from "./picker-DLnfOgZj.js";
|
|
4
|
+
import { n as f, r as p } from "./useODataSelectBase-Bq36Wp1U.js";
|
|
5
5
|
import { Fragment as m, useCallback as h, useMemo as g, useRef as ee, useState as te } from "react";
|
|
6
6
|
import { useODataCollectionModel as _ } from "@ryuzaki13/react-foundation-api/odata";
|
|
7
7
|
import { cn as v } from "@ryuzaki13/react-foundation-lib/utils";
|
|
8
|
-
import { CheckIcon as ne, XIcon as re } from "lucide-react";
|
|
9
8
|
import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
|
|
9
|
+
import { CheckIcon as ne, XIcon as re } from "lucide-react";
|
|
10
10
|
//#region src/select/lib/getOptionSearchText.ts
|
|
11
11
|
function ie({ option: e, getOptionLabel: t, getOptionCode: n, getOptionGroup: r }) {
|
|
12
12
|
return [
|
|
@@ -325,4 +325,4 @@ function k({ label: e, description: t, disabled: n, placeholder: r, size: i, opt
|
|
|
325
325
|
//#endregion
|
|
326
326
|
export { S as i, E as n, w as r, k as t };
|
|
327
327
|
|
|
328
|
-
//# sourceMappingURL=select-
|
|
328
|
+
//# sourceMappingURL=select-CysiIrej.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-BolFlcoY.js","names":[],"sources":["../../src/select/lib/getOptionSearchText.ts","../../src/select/model/useODataSelect.ts","../../src/select/lib/createSelectOptionSections.ts","../../src/select/Select.module.scss","../../src/select/Select.tsx","../../src/select/ODataSelect.tsx","../../src/select/SerializableSelect.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\n\nimport { InputType } from \"@ryuzaki13/react-foundation-lib/types\";\n\nimport { extractPickerTextContent } from \"../../picker\";\nimport { type SelectOptionGroup } from \"../SelectOptionGroup\";\n\nexport function getOptionSearchText<T extends InputType>({\n\toption,\n\tgetOptionLabel,\n\tgetOptionCode,\n\tgetOptionGroup\n}: {\n\toption: T;\n\tgetOptionLabel: (option: T) => ReactNode;\n\tgetOptionCode?: (option: T) => ReactNode;\n\tgetOptionGroup?: (option: T) => SelectOptionGroup | undefined;\n}) {\n\treturn [\n\t\textractPickerTextContent(getOptionLabel(option)),\n\t\textractPickerTextContent(getOptionCode?.(option)),\n\t\textractPickerTextContent(getOptionGroup?.(option)?.label)\n\t]\n\t\t.filter((part): part is string => Boolean(part))\n\t\t.join(\" \")\n\t\t.toLowerCase();\n}\n\n/** Находит selected option по value и возвращает fallback, если значение еще не нормализовано. */\nexport function resolveSelectedOption<TOption extends { value: string }>(\n\toptions: readonly TOption[],\n\tvalue: string,\n\tfallback: TOption\n): TOption {\n\treturn options.find((option) => option.value === value) ?? fallback;\n}\n","import { useMemo } from \"react\";\n\nimport { ODataCollectionModel, ODataSingleSelectProps } from \"@ryuzaki13/react-foundation-api/odata\";\nimport { CollectionItem } from \"@ryuzaki13/react-foundation-lib/odata\";\n\nimport { useODataSelectBase } from \"./useODataSelectBase\";\n\ninterface UseODataSelectOptions extends Omit<ODataSingleSelectProps, \"model\"> {\n\tmodel: Required<ODataCollectionModel>;\n\tonChange: (value: string | undefined) => void;\n}\n\nexport function useODataSelect({ odata, segment, model, value, dependencies, onChange }: UseODataSelectOptions) {\n\tconst odataModel = useODataSelectBase({\n\t\todata,\n\t\tsegment,\n\t\tmodel,\n\t\tvalue: value ? [value] : [],\n\t\tdependencies\n\t});\n\n\tconst selectedItem = odataModel.selectedItems[0];\n\tconst options = useMemo(() => {\n\t\tif (!selectedItem) {\n\t\t\treturn odataModel.filteredItems;\n\t\t}\n\n\t\treturn [selectedItem, ...odataModel.filteredItems];\n\t}, [odataModel.filteredItems, selectedItem]);\n\n\tconst handleChange = (item: CollectionItem | undefined) => {\n\t\tonChange(item?.[odataModel.selectionKey]);\n\t};\n\n\treturn {\n\t\t...odataModel,\n\t\tselectedItem,\n\t\toptions,\n\t\thandleChange\n\t};\n}\n","import { type SelectOptionGroup } from \"../SelectOptionGroup\";\n\nexport type SelectOptionSectionItem<TOption> = {\n\treadonly option: TOption;\n\treadonly index: number;\n};\n\nexport type SelectOptionSection<TOption> = {\n\treadonly group: SelectOptionGroup | undefined;\n\treadonly items: readonly SelectOptionSectionItem<TOption>[];\n};\n\n/**\n * Собирает соседние опции с одинаковым group key в секции, сохраняя исходные индексы для клавиатурной навигации listbox.\n */\nexport function createSelectOptionSections<TOption>(\n\toptions: readonly TOption[],\n\tgetOptionGroup: (option: TOption) => SelectOptionGroup | undefined\n): readonly SelectOptionSection<TOption>[] {\n\tconst sections: Array<{ group: SelectOptionGroup | undefined; items: SelectOptionSectionItem<TOption>[] }> = [];\n\n\toptions.forEach((option, index) => {\n\t\tconst group = getOptionGroup(option);\n\t\tconst currentSection = sections.at(-1);\n\t\tconst belongsToCurrentSection = currentSection?.group?.key === group?.key;\n\n\t\tif (currentSection && belongsToCurrentSection) {\n\t\t\tcurrentSection.items.push({ option, index });\n\t\t\treturn;\n\t\t}\n\n\t\tsections.push({\n\t\t\tgroup,\n\t\t\titems: [{ option, index }]\n\t\t});\n\t});\n\n\treturn sections;\n}\n",".inputWithOverlay {\n\tcolor: transparent;\n\tcaret-color: transparent;\n}\n\n.valueOverlay {\n\tposition: absolute;\n\tinset: 0 calc(var(--control-height) + var(--space-xs)) 0 var(--space-md);\n\tdisplay: flex;\n\talign-items: center;\n\tpointer-events: none;\n\toverflow: hidden;\n}\n","import { type CSSProperties, Fragment, ReactNode, useCallback, useMemo, useRef, useState } from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\nimport { InputType } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CheckIcon, XIcon } from \"lucide-react\";\n\nimport {\n\textractPickerTextContent,\n\tPickerField,\n\tPickerPopup,\n\tPickerStatus,\n\tPickerTriggerActions,\n\tPickerTriggerInput,\n\tusePickerDefaultFilter,\n\tusePickerFloatingListbox,\n\tusePickerQuery,\n\tusePickerTriggerController\n} from \"../picker\";\nimport { ChangeHandler, UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport { getOptionSearchText } from \"./lib\";\nimport { createSelectOptionSections } from \"./lib/createSelectOptionSections\";\nimport styles from \"./Select.module.scss\";\nimport { type SelectOptionGroup, type SelectOptionKey } from \"./SelectOptionGroup\";\n\nexport { type SelectOptionGroup, type SelectOptionKey } from \"./SelectOptionGroup\";\n\nexport type SelectOptionState = {\n\tactive: boolean;\n\tselected: boolean;\n\tdisabled: boolean;\n};\n\ntype SelectSharedProps<TOption extends InputType> = Omit<UiBaseProps<TOption, TOption | undefined>, \"onChange\"> & {\n\toptions: readonly TOption[];\n\tgetOptionKey: (option: TOption) => SelectOptionKey;\n\tgetOptionLabel: (option: TOption) => ReactNode;\n\tgetOptionCode?: (option: TOption) => ReactNode;\n\tgetOptionDisabled?: (option: TOption) => boolean;\n\tgetOptionAriaLabel?: (option: TOption) => string;\n\tgetOptionGroup?: (option: TOption) => SelectOptionGroup | undefined;\n\tgetOptionClassName?: (option: TOption, state: SelectOptionState) => string | undefined;\n\trenderOption?: (option: TOption, state: SelectOptionState) => ReactNode;\n\trenderValue?: (option: TOption) => ReactNode;\n\tclassName?: string;\n\tbuttonClassName?: string;\n\toptionsClassName?: string;\n\toptionsMaxWidth?: CSSProperties[\"maxWidth\"];\n\toptionsContentClassName?: string;\n\tsearchable?: boolean;\n\tquery?: string;\n\tdefaultQuery?: string;\n\tonQuery?: (value: string) => void;\n\tdefaultFilter?: boolean;\n\trenderPopupHeader?: ReactNode;\n\temptyState?: ReactNode;\n\tloadingState?: ReactNode;\n\terrorState?: ReactNode;\n\tplacement?: Placement;\n};\n\ntype SelectChangeValue<TOption extends InputType, TClearable extends boolean | undefined> = true extends TClearable\n\t? TOption | undefined\n\t: TOption;\n\nexport type SelectProps<TOption extends InputType, TClearable extends boolean | undefined = false> = SelectSharedProps<TOption> & {\n\tclearable?: TClearable;\n\tonChange: ChangeHandler<SelectChangeValue<TOption, TClearable>>;\n};\n\n/**\n * Выпадающий список выбора значения из набора опций. Подходит для форм, фильтров и простых справочников.\n */\nexport function Select<TOption extends InputType, TClearable extends boolean | undefined = false>(props: SelectProps<TOption, TClearable>) {\n\tconst {\n\t\tlabel,\n\t\tdescription,\n\t\tdisabled,\n\t\tplaceholder,\n\t\tsize,\n\t\toptions,\n\t\tvalue,\n\t\tonChange,\n\t\tgetOptionKey,\n\t\tgetOptionLabel,\n\t\tgetOptionCode,\n\t\tgetOptionDisabled,\n\t\tgetOptionAriaLabel,\n\t\tgetOptionGroup,\n\t\tgetOptionClassName,\n\t\trenderOption,\n\t\trenderValue,\n\t\tclassName,\n\t\tbuttonClassName,\n\t\toptionsClassName,\n\t\toptionsMaxWidth,\n\t\toptionsContentClassName,\n\t\tsearchable = false,\n\t\tdefaultFilter = true,\n\t\tquery,\n\t\tdefaultQuery,\n\t\tonQuery,\n\t\trenderPopupHeader,\n\t\temptyState,\n\t\tloadingState,\n\t\terrorState,\n\t\tplacement = \"bottom-start\",\n\t\tclearable = false\n\t} = props;\n\tconst emitChange = onChange as ChangeHandler<TOption | undefined>;\n\n\tconst inputRef = useRef<HTMLInputElement | null>(null);\n\tconst [open, setOpen] = useState(false);\n\tconst triggerMode = searchable ? \"search-single\" : \"display\";\n\tconst selectedKey = value === undefined ? undefined : getOptionKey(value);\n\tconst selectedOption =\n\t\tselectedKey === undefined ? undefined : (options.find((option) => getOptionKey(option) === selectedKey) ?? value);\n\tconst {\n\t\tquery: currentQuery,\n\t\tsetQuery,\n\t\tresetQueryOnClose\n\t} = usePickerQuery({\n\t\tquery,\n\t\tdefaultQuery,\n\t\tonQuery,\n\t\ttriggerMode\n\t});\n\tconst handleOpenChange = (nextOpen: boolean) => {\n\t\tif (open && !nextOpen && resetQueryOnClose) {\n\t\t\tsetQuery(\"\");\n\t\t}\n\n\t\tsetOpen(nextOpen);\n\t};\n\tconst getSearchText = useCallback(\n\t\t(option: TOption) =>\n\t\t\tgetOptionSearchText({\n\t\t\t\toption,\n\t\t\t\tgetOptionLabel,\n\t\t\t\tgetOptionCode,\n\t\t\t\tgetOptionGroup\n\t\t\t}),\n\t\t[getOptionCode, getOptionGroup, getOptionLabel]\n\t);\n\tconst visibleOptions = usePickerDefaultFilter({\n\t\toptions,\n\t\tquery: currentQuery,\n\t\tenabled: searchable && defaultFilter,\n\t\tgetSearchText\n\t});\n\tconst optionSections = useMemo(\n\t\t() => (getOptionGroup ? createSelectOptionSections(visibleOptions, getOptionGroup) : undefined),\n\t\t[getOptionGroup, visibleOptions]\n\t);\n\tconst selectedIndex = selectedKey === undefined ? -1 : visibleOptions.findIndex((option) => getOptionKey(option) === selectedKey);\n\tconst {\n\t\tactiveIndex,\n\t\tcontext,\n\t\tfloatingStyles,\n\t\tgetFloatingProps,\n\t\tsetReference,\n\t\tsetFloating,\n\t\tsetOptionRef,\n\t\tclose,\n\t\topenList,\n\t\ttoggleOpen,\n\t\tselectOption,\n\t\tselectActiveOption,\n\t\thandleReferenceKeyDown,\n\t\thandleFloatingKeyDown,\n\t\tgetOptionId,\n\t\tgetActiveOptionId\n\t} = usePickerFloatingListbox({\n\t\toptions: visibleOptions,\n\t\tselectedIndex,\n\t\topen,\n\t\tonOpenChange: handleOpenChange,\n\t\tgetOptionDisabled,\n\t\tonSelect: emitChange,\n\t\tdisabled,\n\t\tplacement,\n\t\ttriggerMode\n\t});\n\n\tconst hasOptions = visibleOptions.length > 0;\n\tconst labelContent = selectedOption !== undefined ? getOptionLabel(selectedOption) : undefined;\n\tconst displayContent = selectedOption !== undefined ? (renderValue ? renderValue(selectedOption) : labelContent) : undefined;\n\tconst labelText = extractPickerTextContent(labelContent);\n\tconst codeText = selectedOption !== undefined ? extractPickerTextContent(getOptionCode?.(selectedOption)) : undefined;\n\tconst displayText =\n\t\textractPickerTextContent(displayContent) ?? labelText ?? codeText ?? (selectedKey !== undefined ? String(selectedKey) : \"\");\n\tconst showSearchValue = searchable && (open || currentQuery.length > 0);\n\tconst inputValue = showSearchValue ? currentQuery : selectedOption !== undefined ? displayText : \"\";\n\tconst showDisplayOverlay =\n\t\tselectedOption !== undefined &&\n\t\tdisplayContent !== undefined &&\n\t\textractPickerTextContent(displayContent) === undefined &&\n\t\t!showSearchValue;\n\tconst triggerController = usePickerTriggerController({\n\t\tmode: triggerMode,\n\t\topen,\n\t\tcurrentQuery,\n\t\thasDisplayValue: selectedOption !== undefined,\n\t\tinputRef,\n\t\tsetQuery,\n\t\topenList,\n\t\tclose,\n\t\ttoggleOpen\n\t});\n\tconst setInputNode = (node: HTMLInputElement | null) => {\n\t\tinputRef.current = node;\n\t};\n\tconst handleClear = () => {\n\t\tif (clearable) {\n\t\t\temitChange(undefined);\n\t\t}\n\n\t\tsetQuery(\"\");\n\t\tclose();\n\t};\n\tconst renderOptionNode = (listId: string, option: TOption, index: number) => {\n\t\tconst optionKey = getOptionKey(option);\n\t\tconst selected = selectedKey !== undefined && optionKey === selectedKey;\n\t\tconst active = index === activeIndex;\n\t\tconst optionDisabled = getOptionDisabled?.(option) ?? false;\n\t\tconst optionState = { active, selected, disabled: optionDisabled };\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tkey={optionKey}\n\t\t\t\tid={getOptionId(listId, index)}\n\t\t\t\tref={(node) => setOptionRef(index, node)}\n\t\t\t\trole=\"option\"\n\t\t\t\taria-selected={selected}\n\t\t\t\taria-disabled={optionDisabled || undefined}\n\t\t\t\taria-label={getOptionAriaLabel?.(option)}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tuiStyles.uiPopupOption,\n\t\t\t\t\toptionDisabled && uiStyles.disabled,\n\t\t\t\t\tactive && uiStyles.uiPopupOptionActive,\n\t\t\t\t\tselected && uiStyles.selected,\n\t\t\t\t\tgetOptionClassName?.(option, optionState)\n\t\t\t\t)}\n\t\t\t\tonClick={() => selectOption(option)}>\n\t\t\t\t{renderOption ? (\n\t\t\t\t\trenderOption(option, optionState)\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{selected ? <CheckIcon className={uiStyles.uiPopupOptionIcon} /> : <span className={uiStyles.uiPopupOptionIcon} />}\n\t\t\t\t\t\t<div className={uiStyles.uiOptionText}>{getOptionLabel(option)}</div>\n\t\t\t\t\t\t{getOptionCode && <div className={uiStyles.uiOptionCode}>{getOptionCode(option)}</div>}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<PickerField label={label} description={description} disabled={disabled} size={size} className={className}>\n\t\t\t{({ controlId, labelId, describedBy }) => {\n\t\t\t\tconst listId = `${controlId}-listbox`;\n\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<PickerTriggerInput\n\t\t\t\t\t\t\tref={setInputNode}\n\t\t\t\t\t\t\trootRef={setReference}\n\t\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\treadOnly={!searchable}\n\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\trole=\"combobox\"\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\t\tselectedOption === undefined || showSearchValue\n\t\t\t\t\t\t\t\t\t? `${placeholder ?? label ?? \"\"} <${options.length}>`\n\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\t\taria-haspopup=\"listbox\"\n\t\t\t\t\t\t\taria-expanded={open}\n\t\t\t\t\t\t\taria-controls={open ? listId : undefined}\n\t\t\t\t\t\t\taria-autocomplete={searchable ? \"list\" : \"none\"}\n\t\t\t\t\t\t\taria-activedescendant={open ? getActiveOptionId(listId) : undefined}\n\t\t\t\t\t\t\tinputClassName={cn(showDisplayOverlay && styles.inputWithOverlay, buttonClassName, \"textOverflow\")}\n\t\t\t\t\t\t\toverlay={showDisplayOverlay ? <div className={styles.valueOverlay}>{displayContent}</div> : undefined}\n\t\t\t\t\t\t\tendAdornment={\n\t\t\t\t\t\t\t\t<PickerTriggerActions\n\t\t\t\t\t\t\t\t\topen={open}\n\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\tonToggleMouseDown={triggerController.handleToggleMouseDown}\n\t\t\t\t\t\t\t\t\tonToggleClick={triggerController.handleToggleClick}>\n\t\t\t\t\t\t\t\t\t{clearable && selectedOption !== undefined && !disabled ? (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\tclassName={uiStyles.uiClearButton}\n\t\t\t\t\t\t\t\t\t\t\tdata-ui=\"select-clear-button\"\n\t\t\t\t\t\t\t\t\t\t\tdata-action=\"clear-select\"\n\t\t\t\t\t\t\t\t\t\t\tonMouseDown={(event) => {\n\t\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t\thandleClear();\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\taria-label=\"Очистить выбор\">\n\t\t\t\t\t\t\t\t\t\t\t<XIcon />\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t</PickerTriggerActions>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonChange={(event) => {\n\t\t\t\t\t\t\t\tif (!searchable) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerInputChange(event.target.value);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonClick={triggerController.handleTriggerClick}\n\t\t\t\t\t\t\tonFocus={(event) => {\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerFocus(event.currentTarget);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonKeyDown={(event) => {\n\t\t\t\t\t\t\t\thandleReferenceKeyDown(event);\n\n\t\t\t\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerKeyDown({\n\t\t\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\t\t\tonActivateWhenOpen: selectActiveOption,\n\t\t\t\t\t\t\t\t\tenableSpaceActivation: !searchable\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t<PickerPopup\n\t\t\t\t\t\t\topen={open}\n\t\t\t\t\t\t\tcontext={context}\n\t\t\t\t\t\t\tfloatingStyles={floatingStyles}\n\t\t\t\t\t\t\tlistId={listId}\n\t\t\t\t\t\t\tlabelId={labelId}\n\t\t\t\t\t\t\tdescriptionId={describedBy}\n\t\t\t\t\t\t\tactiveOptionId={hasOptions ? getActiveOptionId(listId) : undefined}\n\t\t\t\t\t\t\tsetFloating={setFloating}\n\t\t\t\t\t\t\tgetFloatingProps={getFloatingProps}\n\t\t\t\t\t\t\tonKeyDown={handleFloatingKeyDown}\n\t\t\t\t\t\t\tclassName={cn(uiStyles.uiPopupOptions, optionsClassName)}\n\t\t\t\t\t\t\tmaxWidth={optionsMaxWidth}\n\t\t\t\t\t\t\theader={renderPopupHeader}>\n\t\t\t\t\t\t\t<div className={cn(optionsContentClassName, \"h100 scrollable\")}>\n\t\t\t\t\t\t\t\t{hasOptions ? (\n\t\t\t\t\t\t\t\t\toptionSections ? (\n\t\t\t\t\t\t\t\t\t\toptionSections.map((section, sectionIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tconst groupLabelId = section.group ? `${listId}-group-${sectionIndex}` : undefined;\n\t\t\t\t\t\t\t\t\t\t\tconst optionNodes = section.items.map(({ option, index }) =>\n\t\t\t\t\t\t\t\t\t\t\t\trenderOptionNode(listId, option, index)\n\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\treturn section.group ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`group-${String(section.group.key)}-${sectionIndex}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-labelledby={groupLabelId}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div id={groupLabelId} className={uiStyles.uiPopupGroupLabel}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{section.group.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{optionNodes}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t<Fragment key={`options-${sectionIndex}`}>{optionNodes}</Fragment>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\tvisibleOptions.map((option, index) => renderOptionNode(listId, option, index))\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<PickerStatus emptyState={emptyState} loadingState={loadingState} errorState={errorState} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</PickerPopup>\n\t\t\t\t\t</>\n\t\t\t\t);\n\t\t\t}}\n\t\t</PickerField>\n\t);\n}\n","import React from \"react\";\n\nimport { ODataSingleSelectProps, useODataCollectionModel } from \"@ryuzaki13/react-foundation-api/odata\";\nimport { CollectionItem } from \"@ryuzaki13/react-foundation-lib/odata\";\n\nimport { InputUILoading } from \"../input\";\nimport { UiBaseProps } from \"../types\";\n\nimport { useODataSelect } from \"./model/useODataSelect\";\nimport { Select } from \"./Select\";\nimport { SelectOptionContent } from \"./SelectOptionContent\";\n\ntype ODataSelectProps = Omit<ODataSingleSelectProps, \"value\"> & UiBaseProps<string | undefined> & { clearable?: boolean };\n\nfunction getODataOptionTextKey(item: CollectionItem | undefined, textKey: string, codeKey: string) {\n\tif (!item) {\n\t\treturn textKey || codeKey;\n\t}\n\n\treturn textKey || Object.keys(item).find((key) => key !== codeKey) || codeKey;\n}\n\nexport const ODataSelect: React.FC<ODataSelectProps> = ({\n\todata,\n\tsegment,\n\tmodel: initialModel,\n\tsize,\n\tlabel,\n\tdescription,\n\tdisabled,\n\tvalue,\n\tdependencies,\n\tonChange,\n\tclearable\n}) => {\n\tconst model = useODataCollectionModel(initialModel);\n\tconst odataModel = useODataSelect({\n\t\todata,\n\t\tsegment,\n\t\tmodel,\n\t\tvalue,\n\t\tdependencies,\n\t\tonChange\n\t});\n\n\tif (odataModel.isLoading) {\n\t\treturn <InputUILoading size={size} label={label} description={description} />;\n\t}\n\n\tconst hideCode = segment.hideCode ?? odata.hideCode;\n\tconst resolvedTextKey = getODataOptionTextKey(odataModel.selectedItem ?? odataModel.options[0], odataModel.textKey, odataModel.codeKey);\n\n\treturn (\n\t\t<Select\n\t\t\tsize={size}\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\toptions={odataModel.options}\n\t\t\tvalue={odataModel.selectedItem}\n\t\t\tonChange={odataModel.handleChange}\n\t\t\tgetOptionKey={(item) => item[odataModel.codeKey]}\n\t\t\tgetOptionLabel={(item) => item[resolvedTextKey]}\n\t\t\tgetOptionCode={hideCode ? undefined : (item) => item[odataModel.codeKey]}\n\t\t\tgetOptionAriaLabel={(item) =>\n\t\t\t\thideCode || item[resolvedTextKey] === item[odataModel.codeKey]\n\t\t\t\t\t? String(item[resolvedTextKey])\n\t\t\t\t\t: `${item[resolvedTextKey]} ${item[odataModel.codeKey]}`\n\t\t\t}\n\t\t\trenderValue={(item) => (\n\t\t\t\t<SelectOptionContent label={item[resolvedTextKey]} code={hideCode ? undefined : item[odataModel.codeKey]} />\n\t\t\t)}\n\t\t\trenderOption={(item) => (\n\t\t\t\t<SelectOptionContent\n\t\t\t\t\tlabel={item[resolvedTextKey]}\n\t\t\t\t\tcode={hideCode ? undefined : item[odataModel.codeKey]}\n\t\t\t\t\thighlight={odataModel.debouncedQuery}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\tsearchable\n\t\t\tquery={odataModel.query}\n\t\t\tonQuery={odataModel.setQuery}\n\t\t\tdefaultFilter={false}\n\t\t\tdisabled={disabled || odataModel.isLoading}\n\t\t\tplaceholder={odataModel.placeholder}\n\t\t\tloadingState=\"Загрузка...\"\n\t\t\terrorState={odataModel.isError ? \"Ошибка загрузки\" : undefined}\n\t\t\temptyState={!odataModel.isLoading && !odataModel.isError ? \"Нет данных\" : undefined}\n\t\t\tclearable={clearable}\n\t\t/>\n\t);\n};\n","import { Select } from \"./Select\";\n\nimport type { UiBaseProps } from \"../types\";\nimport type { SelectOptionKey } from \"./Select\";\n\ntype SerializableOptionRecord = Record<string, unknown>;\n\ntype SerializableOptionKeyField<TOption extends SerializableOptionRecord> = {\n\t[K in keyof TOption]: Extract<TOption[K], SelectOptionKey> extends never ? never : K;\n}[keyof TOption];\n\ntype SerializableOptionValue<TOption extends SerializableOptionRecord, TOptionKey extends SerializableOptionKeyField<TOption>> = Extract<\n\tTOption[TOptionKey],\n\tSelectOptionKey\n>;\n\nexport interface SerializableSelectProps<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n> extends Omit<UiBaseProps<SerializableOptionValue<TOption, TOptionKey> | undefined>, \"onChange\"> {\n\toptions: readonly TOption[];\n\tonChange: (value: SerializableOptionValue<TOption, TOptionKey> | undefined) => void;\n\toptionKey: TOptionKey;\n\toptionLabel: TOptionLabel;\n\trenderCode?: true;\n\tclassName?: string;\n\tclearable?: boolean;\n}\n\nfunction getSerializableOptionKey<TOption extends SerializableOptionRecord, TOptionKey extends SerializableOptionKeyField<TOption>>(\n\toption: TOption,\n\toptionKey: TOptionKey\n): Extract<TOption[TOptionKey], SelectOptionKey> {\n\treturn option[optionKey] as Extract<TOption[TOptionKey], SelectOptionKey>;\n}\n\nfunction getSerializableOptionLabel<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n>(option: TOption, optionLabel: TOptionLabel, optionKey: TOptionKey): string | number {\n\tconst label = option[optionLabel];\n\n\tif (typeof label === \"string\" || typeof label === \"number\") {\n\t\treturn label;\n\t}\n\n\tconst key = getSerializableOptionKey(option, optionKey);\n\treturn typeof key === \"string\" || typeof key === \"number\" ? key : String(key);\n}\n\nexport function SerializableSelect<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n>({\n\tlabel,\n\tdescription,\n\tdisabled,\n\tplaceholder,\n\tsize,\n\toptions,\n\tvalue,\n\tonChange,\n\toptionKey,\n\toptionLabel,\n\trenderCode,\n\tclassName,\n\tclearable\n}: SerializableSelectProps<TOption, TOptionKey, TOptionLabel>) {\n\tconst selectedOption =\n\t\tvalue === undefined ? undefined : options.find((option) => getSerializableOptionKey(option, optionKey) === value);\n\n\treturn (\n\t\t<Select\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tplaceholder={placeholder}\n\t\t\tsize={size}\n\t\t\toptions={options}\n\t\t\tvalue={selectedOption}\n\t\t\tonChange={(option: TOption | undefined) => onChange(option ? getSerializableOptionKey(option, optionKey) : undefined)}\n\t\t\tgetOptionKey={(option: TOption) => getSerializableOptionKey(option, optionKey)}\n\t\t\tgetOptionLabel={(option: TOption) => getSerializableOptionLabel(option, optionLabel, optionKey)}\n\t\t\tgetOptionCode={renderCode ? (option: TOption) => getSerializableOptionKey(option, optionKey) : undefined}\n\t\t\tclassName={className}\n\t\t\tclearable={clearable}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select-CysiIrej.js","names":[],"sources":["../../src/select/lib/getOptionSearchText.ts","../../src/select/model/useODataSelect.ts","../../src/select/lib/createSelectOptionSections.ts","../../src/select/Select.module.scss","../../src/select/Select.tsx","../../src/select/ODataSelect.tsx","../../src/select/SerializableSelect.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\n\nimport { InputType } from \"@ryuzaki13/react-foundation-lib/types\";\n\nimport { extractPickerTextContent } from \"../../picker\";\nimport { type SelectOptionGroup } from \"../SelectOptionGroup\";\n\nexport function getOptionSearchText<T extends InputType>({\n\toption,\n\tgetOptionLabel,\n\tgetOptionCode,\n\tgetOptionGroup\n}: {\n\toption: T;\n\tgetOptionLabel: (option: T) => ReactNode;\n\tgetOptionCode?: (option: T) => ReactNode;\n\tgetOptionGroup?: (option: T) => SelectOptionGroup | undefined;\n}) {\n\treturn [\n\t\textractPickerTextContent(getOptionLabel(option)),\n\t\textractPickerTextContent(getOptionCode?.(option)),\n\t\textractPickerTextContent(getOptionGroup?.(option)?.label)\n\t]\n\t\t.filter((part): part is string => Boolean(part))\n\t\t.join(\" \")\n\t\t.toLowerCase();\n}\n\n/** Находит selected option по value и возвращает fallback, если значение еще не нормализовано. */\nexport function resolveSelectedOption<TOption extends { value: string }>(\n\toptions: readonly TOption[],\n\tvalue: string,\n\tfallback: TOption\n): TOption {\n\treturn options.find((option) => option.value === value) ?? fallback;\n}\n","import { useMemo } from \"react\";\n\nimport { ODataCollectionModel, ODataSingleSelectProps } from \"@ryuzaki13/react-foundation-api/odata\";\nimport { CollectionItem } from \"@ryuzaki13/react-foundation-lib/odata\";\n\nimport { useODataSelectBase } from \"./useODataSelectBase\";\n\ninterface UseODataSelectOptions extends Omit<ODataSingleSelectProps, \"model\"> {\n\tmodel: Required<ODataCollectionModel>;\n\tonChange: (value: string | undefined) => void;\n}\n\nexport function useODataSelect({ odata, segment, model, value, dependencies, onChange }: UseODataSelectOptions) {\n\tconst odataModel = useODataSelectBase({\n\t\todata,\n\t\tsegment,\n\t\tmodel,\n\t\tvalue: value ? [value] : [],\n\t\tdependencies\n\t});\n\n\tconst selectedItem = odataModel.selectedItems[0];\n\tconst options = useMemo(() => {\n\t\tif (!selectedItem) {\n\t\t\treturn odataModel.filteredItems;\n\t\t}\n\n\t\treturn [selectedItem, ...odataModel.filteredItems];\n\t}, [odataModel.filteredItems, selectedItem]);\n\n\tconst handleChange = (item: CollectionItem | undefined) => {\n\t\tonChange(item?.[odataModel.selectionKey]);\n\t};\n\n\treturn {\n\t\t...odataModel,\n\t\tselectedItem,\n\t\toptions,\n\t\thandleChange\n\t};\n}\n","import { type SelectOptionGroup } from \"../SelectOptionGroup\";\n\nexport type SelectOptionSectionItem<TOption> = {\n\treadonly option: TOption;\n\treadonly index: number;\n};\n\nexport type SelectOptionSection<TOption> = {\n\treadonly group: SelectOptionGroup | undefined;\n\treadonly items: readonly SelectOptionSectionItem<TOption>[];\n};\n\n/**\n * Собирает соседние опции с одинаковым group key в секции, сохраняя исходные индексы для клавиатурной навигации listbox.\n */\nexport function createSelectOptionSections<TOption>(\n\toptions: readonly TOption[],\n\tgetOptionGroup: (option: TOption) => SelectOptionGroup | undefined\n): readonly SelectOptionSection<TOption>[] {\n\tconst sections: Array<{ group: SelectOptionGroup | undefined; items: SelectOptionSectionItem<TOption>[] }> = [];\n\n\toptions.forEach((option, index) => {\n\t\tconst group = getOptionGroup(option);\n\t\tconst currentSection = sections.at(-1);\n\t\tconst belongsToCurrentSection = currentSection?.group?.key === group?.key;\n\n\t\tif (currentSection && belongsToCurrentSection) {\n\t\t\tcurrentSection.items.push({ option, index });\n\t\t\treturn;\n\t\t}\n\n\t\tsections.push({\n\t\t\tgroup,\n\t\t\titems: [{ option, index }]\n\t\t});\n\t});\n\n\treturn sections;\n}\n",".inputWithOverlay {\n\tcolor: transparent;\n\tcaret-color: transparent;\n}\n\n.valueOverlay {\n\tposition: absolute;\n\tinset: 0 calc(var(--control-height) + var(--space-xs)) 0 var(--space-md);\n\tdisplay: flex;\n\talign-items: center;\n\tpointer-events: none;\n\toverflow: hidden;\n}\n","import { type CSSProperties, Fragment, ReactNode, useCallback, useMemo, useRef, useState } from \"react\";\n\nimport { Placement } from \"@floating-ui/react\";\nimport { InputType } from \"@ryuzaki13/react-foundation-lib/types\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { CheckIcon, XIcon } from \"lucide-react\";\n\nimport {\n\textractPickerTextContent,\n\tPickerField,\n\tPickerPopup,\n\tPickerStatus,\n\tPickerTriggerActions,\n\tPickerTriggerInput,\n\tusePickerDefaultFilter,\n\tusePickerFloatingListbox,\n\tusePickerQuery,\n\tusePickerTriggerController\n} from \"../picker\";\nimport { ChangeHandler, UiBaseProps } from \"../types\";\nimport uiStyles from \"../ui.module.scss\";\n\nimport { getOptionSearchText } from \"./lib\";\nimport { createSelectOptionSections } from \"./lib/createSelectOptionSections\";\nimport styles from \"./Select.module.scss\";\nimport { type SelectOptionGroup, type SelectOptionKey } from \"./SelectOptionGroup\";\n\nexport { type SelectOptionGroup, type SelectOptionKey } from \"./SelectOptionGroup\";\n\nexport type SelectOptionState = {\n\tactive: boolean;\n\tselected: boolean;\n\tdisabled: boolean;\n};\n\ntype SelectSharedProps<TOption extends InputType> = Omit<UiBaseProps<TOption, TOption | undefined>, \"onChange\"> & {\n\toptions: readonly TOption[];\n\tgetOptionKey: (option: TOption) => SelectOptionKey;\n\tgetOptionLabel: (option: TOption) => ReactNode;\n\tgetOptionCode?: (option: TOption) => ReactNode;\n\tgetOptionDisabled?: (option: TOption) => boolean;\n\tgetOptionAriaLabel?: (option: TOption) => string;\n\tgetOptionGroup?: (option: TOption) => SelectOptionGroup | undefined;\n\tgetOptionClassName?: (option: TOption, state: SelectOptionState) => string | undefined;\n\trenderOption?: (option: TOption, state: SelectOptionState) => ReactNode;\n\trenderValue?: (option: TOption) => ReactNode;\n\tclassName?: string;\n\tbuttonClassName?: string;\n\toptionsClassName?: string;\n\toptionsMaxWidth?: CSSProperties[\"maxWidth\"];\n\toptionsContentClassName?: string;\n\tsearchable?: boolean;\n\tquery?: string;\n\tdefaultQuery?: string;\n\tonQuery?: (value: string) => void;\n\tdefaultFilter?: boolean;\n\trenderPopupHeader?: ReactNode;\n\temptyState?: ReactNode;\n\tloadingState?: ReactNode;\n\terrorState?: ReactNode;\n\tplacement?: Placement;\n};\n\ntype SelectChangeValue<TOption extends InputType, TClearable extends boolean | undefined> = true extends TClearable\n\t? TOption | undefined\n\t: TOption;\n\nexport type SelectProps<TOption extends InputType, TClearable extends boolean | undefined = false> = SelectSharedProps<TOption> & {\n\tclearable?: TClearable;\n\tonChange: ChangeHandler<SelectChangeValue<TOption, TClearable>>;\n};\n\n/**\n * Выпадающий список выбора значения из набора опций. Подходит для форм, фильтров и простых справочников.\n */\nexport function Select<TOption extends InputType, TClearable extends boolean | undefined = false>(props: SelectProps<TOption, TClearable>) {\n\tconst {\n\t\tlabel,\n\t\tdescription,\n\t\tdisabled,\n\t\tplaceholder,\n\t\tsize,\n\t\toptions,\n\t\tvalue,\n\t\tonChange,\n\t\tgetOptionKey,\n\t\tgetOptionLabel,\n\t\tgetOptionCode,\n\t\tgetOptionDisabled,\n\t\tgetOptionAriaLabel,\n\t\tgetOptionGroup,\n\t\tgetOptionClassName,\n\t\trenderOption,\n\t\trenderValue,\n\t\tclassName,\n\t\tbuttonClassName,\n\t\toptionsClassName,\n\t\toptionsMaxWidth,\n\t\toptionsContentClassName,\n\t\tsearchable = false,\n\t\tdefaultFilter = true,\n\t\tquery,\n\t\tdefaultQuery,\n\t\tonQuery,\n\t\trenderPopupHeader,\n\t\temptyState,\n\t\tloadingState,\n\t\terrorState,\n\t\tplacement = \"bottom-start\",\n\t\tclearable = false\n\t} = props;\n\tconst emitChange = onChange as ChangeHandler<TOption | undefined>;\n\n\tconst inputRef = useRef<HTMLInputElement | null>(null);\n\tconst [open, setOpen] = useState(false);\n\tconst triggerMode = searchable ? \"search-single\" : \"display\";\n\tconst selectedKey = value === undefined ? undefined : getOptionKey(value);\n\tconst selectedOption =\n\t\tselectedKey === undefined ? undefined : (options.find((option) => getOptionKey(option) === selectedKey) ?? value);\n\tconst {\n\t\tquery: currentQuery,\n\t\tsetQuery,\n\t\tresetQueryOnClose\n\t} = usePickerQuery({\n\t\tquery,\n\t\tdefaultQuery,\n\t\tonQuery,\n\t\ttriggerMode\n\t});\n\tconst handleOpenChange = (nextOpen: boolean) => {\n\t\tif (open && !nextOpen && resetQueryOnClose) {\n\t\t\tsetQuery(\"\");\n\t\t}\n\n\t\tsetOpen(nextOpen);\n\t};\n\tconst getSearchText = useCallback(\n\t\t(option: TOption) =>\n\t\t\tgetOptionSearchText({\n\t\t\t\toption,\n\t\t\t\tgetOptionLabel,\n\t\t\t\tgetOptionCode,\n\t\t\t\tgetOptionGroup\n\t\t\t}),\n\t\t[getOptionCode, getOptionGroup, getOptionLabel]\n\t);\n\tconst visibleOptions = usePickerDefaultFilter({\n\t\toptions,\n\t\tquery: currentQuery,\n\t\tenabled: searchable && defaultFilter,\n\t\tgetSearchText\n\t});\n\tconst optionSections = useMemo(\n\t\t() => (getOptionGroup ? createSelectOptionSections(visibleOptions, getOptionGroup) : undefined),\n\t\t[getOptionGroup, visibleOptions]\n\t);\n\tconst selectedIndex = selectedKey === undefined ? -1 : visibleOptions.findIndex((option) => getOptionKey(option) === selectedKey);\n\tconst {\n\t\tactiveIndex,\n\t\tcontext,\n\t\tfloatingStyles,\n\t\tgetFloatingProps,\n\t\tsetReference,\n\t\tsetFloating,\n\t\tsetOptionRef,\n\t\tclose,\n\t\topenList,\n\t\ttoggleOpen,\n\t\tselectOption,\n\t\tselectActiveOption,\n\t\thandleReferenceKeyDown,\n\t\thandleFloatingKeyDown,\n\t\tgetOptionId,\n\t\tgetActiveOptionId\n\t} = usePickerFloatingListbox({\n\t\toptions: visibleOptions,\n\t\tselectedIndex,\n\t\topen,\n\t\tonOpenChange: handleOpenChange,\n\t\tgetOptionDisabled,\n\t\tonSelect: emitChange,\n\t\tdisabled,\n\t\tplacement,\n\t\ttriggerMode\n\t});\n\n\tconst hasOptions = visibleOptions.length > 0;\n\tconst labelContent = selectedOption !== undefined ? getOptionLabel(selectedOption) : undefined;\n\tconst displayContent = selectedOption !== undefined ? (renderValue ? renderValue(selectedOption) : labelContent) : undefined;\n\tconst labelText = extractPickerTextContent(labelContent);\n\tconst codeText = selectedOption !== undefined ? extractPickerTextContent(getOptionCode?.(selectedOption)) : undefined;\n\tconst displayText =\n\t\textractPickerTextContent(displayContent) ?? labelText ?? codeText ?? (selectedKey !== undefined ? String(selectedKey) : \"\");\n\tconst showSearchValue = searchable && (open || currentQuery.length > 0);\n\tconst inputValue = showSearchValue ? currentQuery : selectedOption !== undefined ? displayText : \"\";\n\tconst showDisplayOverlay =\n\t\tselectedOption !== undefined &&\n\t\tdisplayContent !== undefined &&\n\t\textractPickerTextContent(displayContent) === undefined &&\n\t\t!showSearchValue;\n\tconst triggerController = usePickerTriggerController({\n\t\tmode: triggerMode,\n\t\topen,\n\t\tcurrentQuery,\n\t\thasDisplayValue: selectedOption !== undefined,\n\t\tinputRef,\n\t\tsetQuery,\n\t\topenList,\n\t\tclose,\n\t\ttoggleOpen\n\t});\n\tconst setInputNode = (node: HTMLInputElement | null) => {\n\t\tinputRef.current = node;\n\t};\n\tconst handleClear = () => {\n\t\tif (clearable) {\n\t\t\temitChange(undefined);\n\t\t}\n\n\t\tsetQuery(\"\");\n\t\tclose();\n\t};\n\tconst renderOptionNode = (listId: string, option: TOption, index: number) => {\n\t\tconst optionKey = getOptionKey(option);\n\t\tconst selected = selectedKey !== undefined && optionKey === selectedKey;\n\t\tconst active = index === activeIndex;\n\t\tconst optionDisabled = getOptionDisabled?.(option) ?? false;\n\t\tconst optionState = { active, selected, disabled: optionDisabled };\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tkey={optionKey}\n\t\t\t\tid={getOptionId(listId, index)}\n\t\t\t\tref={(node) => setOptionRef(index, node)}\n\t\t\t\trole=\"option\"\n\t\t\t\taria-selected={selected}\n\t\t\t\taria-disabled={optionDisabled || undefined}\n\t\t\t\taria-label={getOptionAriaLabel?.(option)}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tuiStyles.uiPopupOption,\n\t\t\t\t\toptionDisabled && uiStyles.disabled,\n\t\t\t\t\tactive && uiStyles.uiPopupOptionActive,\n\t\t\t\t\tselected && uiStyles.selected,\n\t\t\t\t\tgetOptionClassName?.(option, optionState)\n\t\t\t\t)}\n\t\t\t\tonClick={() => selectOption(option)}>\n\t\t\t\t{renderOption ? (\n\t\t\t\t\trenderOption(option, optionState)\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{selected ? <CheckIcon className={uiStyles.uiPopupOptionIcon} /> : <span className={uiStyles.uiPopupOptionIcon} />}\n\t\t\t\t\t\t<div className={uiStyles.uiOptionText}>{getOptionLabel(option)}</div>\n\t\t\t\t\t\t{getOptionCode && <div className={uiStyles.uiOptionCode}>{getOptionCode(option)}</div>}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<PickerField label={label} description={description} disabled={disabled} size={size} className={className}>\n\t\t\t{({ controlId, labelId, describedBy }) => {\n\t\t\t\tconst listId = `${controlId}-listbox`;\n\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<PickerTriggerInput\n\t\t\t\t\t\t\tref={setInputNode}\n\t\t\t\t\t\t\trootRef={setReference}\n\t\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\treadOnly={!searchable}\n\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\trole=\"combobox\"\n\t\t\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\t\tselectedOption === undefined || showSearchValue\n\t\t\t\t\t\t\t\t\t? `${placeholder ?? label ?? \"\"} <${options.length}>`\n\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taria-labelledby={labelId}\n\t\t\t\t\t\t\taria-describedby={describedBy}\n\t\t\t\t\t\t\taria-haspopup=\"listbox\"\n\t\t\t\t\t\t\taria-expanded={open}\n\t\t\t\t\t\t\taria-controls={open ? listId : undefined}\n\t\t\t\t\t\t\taria-autocomplete={searchable ? \"list\" : \"none\"}\n\t\t\t\t\t\t\taria-activedescendant={open ? getActiveOptionId(listId) : undefined}\n\t\t\t\t\t\t\tinputClassName={cn(showDisplayOverlay && styles.inputWithOverlay, buttonClassName, \"textOverflow\")}\n\t\t\t\t\t\t\toverlay={showDisplayOverlay ? <div className={styles.valueOverlay}>{displayContent}</div> : undefined}\n\t\t\t\t\t\t\tendAdornment={\n\t\t\t\t\t\t\t\t<PickerTriggerActions\n\t\t\t\t\t\t\t\t\topen={open}\n\t\t\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\t\t\tonToggleMouseDown={triggerController.handleToggleMouseDown}\n\t\t\t\t\t\t\t\t\tonToggleClick={triggerController.handleToggleClick}>\n\t\t\t\t\t\t\t\t\t{clearable && selectedOption !== undefined && !disabled ? (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\tclassName={uiStyles.uiClearButton}\n\t\t\t\t\t\t\t\t\t\t\tdata-ui=\"select-clear-button\"\n\t\t\t\t\t\t\t\t\t\t\tdata-action=\"clear-select\"\n\t\t\t\t\t\t\t\t\t\t\tonMouseDown={(event) => {\n\t\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t\thandleClear();\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\taria-label=\"Очистить выбор\">\n\t\t\t\t\t\t\t\t\t\t\t<XIcon />\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t</PickerTriggerActions>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonChange={(event) => {\n\t\t\t\t\t\t\t\tif (!searchable) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerInputChange(event.target.value);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonClick={triggerController.handleTriggerClick}\n\t\t\t\t\t\t\tonFocus={(event) => {\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerFocus(event.currentTarget);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonKeyDown={(event) => {\n\t\t\t\t\t\t\t\thandleReferenceKeyDown(event);\n\n\t\t\t\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\ttriggerController.handleTriggerKeyDown({\n\t\t\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\t\t\tonActivateWhenOpen: selectActiveOption,\n\t\t\t\t\t\t\t\t\tenableSpaceActivation: !searchable\n\t\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t<PickerPopup\n\t\t\t\t\t\t\topen={open}\n\t\t\t\t\t\t\tcontext={context}\n\t\t\t\t\t\t\tfloatingStyles={floatingStyles}\n\t\t\t\t\t\t\tlistId={listId}\n\t\t\t\t\t\t\tlabelId={labelId}\n\t\t\t\t\t\t\tdescriptionId={describedBy}\n\t\t\t\t\t\t\tactiveOptionId={hasOptions ? getActiveOptionId(listId) : undefined}\n\t\t\t\t\t\t\tsetFloating={setFloating}\n\t\t\t\t\t\t\tgetFloatingProps={getFloatingProps}\n\t\t\t\t\t\t\tonKeyDown={handleFloatingKeyDown}\n\t\t\t\t\t\t\tclassName={cn(uiStyles.uiPopupOptions, optionsClassName)}\n\t\t\t\t\t\t\tmaxWidth={optionsMaxWidth}\n\t\t\t\t\t\t\theader={renderPopupHeader}>\n\t\t\t\t\t\t\t<div className={cn(optionsContentClassName, \"h100 scrollable\")}>\n\t\t\t\t\t\t\t\t{hasOptions ? (\n\t\t\t\t\t\t\t\t\toptionSections ? (\n\t\t\t\t\t\t\t\t\t\toptionSections.map((section, sectionIndex) => {\n\t\t\t\t\t\t\t\t\t\t\tconst groupLabelId = section.group ? `${listId}-group-${sectionIndex}` : undefined;\n\t\t\t\t\t\t\t\t\t\t\tconst optionNodes = section.items.map(({ option, index }) =>\n\t\t\t\t\t\t\t\t\t\t\t\trenderOptionNode(listId, option, index)\n\t\t\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\t\t\t\treturn section.group ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={`group-${String(section.group.key)}-${sectionIndex}`}\n\t\t\t\t\t\t\t\t\t\t\t\t\trole=\"group\"\n\t\t\t\t\t\t\t\t\t\t\t\t\taria-labelledby={groupLabelId}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div id={groupLabelId} className={uiStyles.uiPopupGroupLabel}>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{section.group.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{optionNodes}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t\t<Fragment key={`options-${sectionIndex}`}>{optionNodes}</Fragment>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\tvisibleOptions.map((option, index) => renderOptionNode(listId, option, index))\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<PickerStatus emptyState={emptyState} loadingState={loadingState} errorState={errorState} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</PickerPopup>\n\t\t\t\t\t</>\n\t\t\t\t);\n\t\t\t}}\n\t\t</PickerField>\n\t);\n}\n","import React from \"react\";\n\nimport { ODataSingleSelectProps, useODataCollectionModel } from \"@ryuzaki13/react-foundation-api/odata\";\nimport { CollectionItem } from \"@ryuzaki13/react-foundation-lib/odata\";\n\nimport { InputUILoading } from \"../input\";\nimport { UiBaseProps } from \"../types\";\n\nimport { useODataSelect } from \"./model/useODataSelect\";\nimport { Select } from \"./Select\";\nimport { SelectOptionContent } from \"./SelectOptionContent\";\n\ntype ODataSelectProps = Omit<ODataSingleSelectProps, \"value\"> & UiBaseProps<string | undefined> & { clearable?: boolean };\n\nfunction getODataOptionTextKey(item: CollectionItem | undefined, textKey: string, codeKey: string) {\n\tif (!item) {\n\t\treturn textKey || codeKey;\n\t}\n\n\treturn textKey || Object.keys(item).find((key) => key !== codeKey) || codeKey;\n}\n\nexport const ODataSelect: React.FC<ODataSelectProps> = ({\n\todata,\n\tsegment,\n\tmodel: initialModel,\n\tsize,\n\tlabel,\n\tdescription,\n\tdisabled,\n\tvalue,\n\tdependencies,\n\tonChange,\n\tclearable\n}) => {\n\tconst model = useODataCollectionModel(initialModel);\n\tconst odataModel = useODataSelect({\n\t\todata,\n\t\tsegment,\n\t\tmodel,\n\t\tvalue,\n\t\tdependencies,\n\t\tonChange\n\t});\n\n\tif (odataModel.isLoading) {\n\t\treturn <InputUILoading size={size} label={label} description={description} />;\n\t}\n\n\tconst hideCode = segment.hideCode ?? odata.hideCode;\n\tconst resolvedTextKey = getODataOptionTextKey(odataModel.selectedItem ?? odataModel.options[0], odataModel.textKey, odataModel.codeKey);\n\n\treturn (\n\t\t<Select\n\t\t\tsize={size}\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\toptions={odataModel.options}\n\t\t\tvalue={odataModel.selectedItem}\n\t\t\tonChange={odataModel.handleChange}\n\t\t\tgetOptionKey={(item) => item[odataModel.codeKey]}\n\t\t\tgetOptionLabel={(item) => item[resolvedTextKey]}\n\t\t\tgetOptionCode={hideCode ? undefined : (item) => item[odataModel.codeKey]}\n\t\t\tgetOptionAriaLabel={(item) =>\n\t\t\t\thideCode || item[resolvedTextKey] === item[odataModel.codeKey]\n\t\t\t\t\t? String(item[resolvedTextKey])\n\t\t\t\t\t: `${item[resolvedTextKey]} ${item[odataModel.codeKey]}`\n\t\t\t}\n\t\t\trenderValue={(item) => (\n\t\t\t\t<SelectOptionContent label={item[resolvedTextKey]} code={hideCode ? undefined : item[odataModel.codeKey]} />\n\t\t\t)}\n\t\t\trenderOption={(item) => (\n\t\t\t\t<SelectOptionContent\n\t\t\t\t\tlabel={item[resolvedTextKey]}\n\t\t\t\t\tcode={hideCode ? undefined : item[odataModel.codeKey]}\n\t\t\t\t\thighlight={odataModel.debouncedQuery}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\tsearchable\n\t\t\tquery={odataModel.query}\n\t\t\tonQuery={odataModel.setQuery}\n\t\t\tdefaultFilter={false}\n\t\t\tdisabled={disabled || odataModel.isLoading}\n\t\t\tplaceholder={odataModel.placeholder}\n\t\t\tloadingState=\"Загрузка...\"\n\t\t\terrorState={odataModel.isError ? \"Ошибка загрузки\" : undefined}\n\t\t\temptyState={!odataModel.isLoading && !odataModel.isError ? \"Нет данных\" : undefined}\n\t\t\tclearable={clearable}\n\t\t/>\n\t);\n};\n","import { Select } from \"./Select\";\n\nimport type { UiBaseProps } from \"../types\";\nimport type { SelectOptionKey } from \"./Select\";\n\ntype SerializableOptionRecord = Record<string, unknown>;\n\ntype SerializableOptionKeyField<TOption extends SerializableOptionRecord> = {\n\t[K in keyof TOption]: Extract<TOption[K], SelectOptionKey> extends never ? never : K;\n}[keyof TOption];\n\ntype SerializableOptionValue<TOption extends SerializableOptionRecord, TOptionKey extends SerializableOptionKeyField<TOption>> = Extract<\n\tTOption[TOptionKey],\n\tSelectOptionKey\n>;\n\nexport interface SerializableSelectProps<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n> extends Omit<UiBaseProps<SerializableOptionValue<TOption, TOptionKey> | undefined>, \"onChange\"> {\n\toptions: readonly TOption[];\n\tonChange: (value: SerializableOptionValue<TOption, TOptionKey> | undefined) => void;\n\toptionKey: TOptionKey;\n\toptionLabel: TOptionLabel;\n\trenderCode?: true;\n\tclassName?: string;\n\tclearable?: boolean;\n}\n\nfunction getSerializableOptionKey<TOption extends SerializableOptionRecord, TOptionKey extends SerializableOptionKeyField<TOption>>(\n\toption: TOption,\n\toptionKey: TOptionKey\n): Extract<TOption[TOptionKey], SelectOptionKey> {\n\treturn option[optionKey] as Extract<TOption[TOptionKey], SelectOptionKey>;\n}\n\nfunction getSerializableOptionLabel<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n>(option: TOption, optionLabel: TOptionLabel, optionKey: TOptionKey): string | number {\n\tconst label = option[optionLabel];\n\n\tif (typeof label === \"string\" || typeof label === \"number\") {\n\t\treturn label;\n\t}\n\n\tconst key = getSerializableOptionKey(option, optionKey);\n\treturn typeof key === \"string\" || typeof key === \"number\" ? key : String(key);\n}\n\nexport function SerializableSelect<\n\tTOption extends SerializableOptionRecord,\n\tTOptionKey extends SerializableOptionKeyField<TOption>,\n\tTOptionLabel extends keyof TOption\n>({\n\tlabel,\n\tdescription,\n\tdisabled,\n\tplaceholder,\n\tsize,\n\toptions,\n\tvalue,\n\tonChange,\n\toptionKey,\n\toptionLabel,\n\trenderCode,\n\tclassName,\n\tclearable\n}: SerializableSelectProps<TOption, TOptionKey, TOptionLabel>) {\n\tconst selectedOption =\n\t\tvalue === undefined ? undefined : options.find((option) => getSerializableOptionKey(option, optionKey) === value);\n\n\treturn (\n\t\t<Select\n\t\t\tlabel={label}\n\t\t\tdescription={description}\n\t\t\tdisabled={disabled}\n\t\t\tplaceholder={placeholder}\n\t\t\tsize={size}\n\t\t\toptions={options}\n\t\t\tvalue={selectedOption}\n\t\t\tonChange={(option: TOption | undefined) => onChange(option ? getSerializableOptionKey(option, optionKey) : undefined)}\n\t\t\tgetOptionKey={(option: TOption) => getSerializableOptionKey(option, optionKey)}\n\t\t\tgetOptionLabel={(option: TOption) => getSerializableOptionLabel(option, optionLabel, optionKey)}\n\t\t\tgetOptionCode={renderCode ? (option: TOption) => getSerializableOptionKey(option, optionKey) : undefined}\n\t\t\tclassName={className}\n\t\t\tclearable={clearable}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { createContext as e, createElement as t, useContext as n, useMemo as r } from "react";
|
|
2
2
|
import { cn as i } from "@ryuzaki13/react-foundation-lib/utils";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
4
|
+
import { GripIcon as o } from "lucide-react";
|
|
5
5
|
import { useDndSortableSensors as s } from "@ryuzaki13/react-foundation-lib/hooks";
|
|
6
6
|
import { SortableContext as c, horizontalListSortingStrategy as l, rectSortingStrategy as u, useSortable as d, verticalListSortingStrategy as f } from "@dnd-kit/sortable";
|
|
7
7
|
import { CSS as p } from "@dnd-kit/utilities";
|
|
@@ -47,11 +47,11 @@ function S(e, t) {
|
|
|
47
47
|
return typeof e == "function" ? e(t) : e;
|
|
48
48
|
}
|
|
49
49
|
function C(e) {
|
|
50
|
-
let { children: t, collisionDetection: n = h, sensors: i, onDragCancel:
|
|
50
|
+
let { children: t, collisionDetection: n = h, sensors: i, onDragCancel: o, onDragEnd: c, onDragMove: l, onDragOver: u, onDragPending: d, onDragStart: f, accessibility: p, ...g } = e, _ = s(), v = typeof document > "u" ? void 0 : document.body, y = r(() => ({
|
|
51
51
|
...p,
|
|
52
52
|
container: p?.container ?? v
|
|
53
53
|
}), [p, v]);
|
|
54
|
-
return /* @__PURE__ */
|
|
54
|
+
return /* @__PURE__ */ a(m, {
|
|
55
55
|
...g,
|
|
56
56
|
accessibility: y,
|
|
57
57
|
sensors: i ?? _,
|
|
@@ -60,23 +60,23 @@ function C(e) {
|
|
|
60
60
|
onDragMove: l,
|
|
61
61
|
onDragOver: u,
|
|
62
62
|
onDragEnd: c,
|
|
63
|
-
onDragCancel:
|
|
63
|
+
onDragCancel: o,
|
|
64
64
|
onDragPending: d,
|
|
65
65
|
children: t
|
|
66
66
|
});
|
|
67
67
|
}
|
|
68
68
|
function w(e) {
|
|
69
|
-
let { children: t, containerId: n, items: r, layout: i = "vertical", strategy:
|
|
70
|
-
return /* @__PURE__ */
|
|
69
|
+
let { children: t, containerId: n, items: r, layout: i = "vertical", strategy: o } = e;
|
|
70
|
+
return /* @__PURE__ */ a(c, {
|
|
71
71
|
id: String(n),
|
|
72
72
|
items: [...r],
|
|
73
|
-
strategy: v(i,
|
|
73
|
+
strategy: v(i, o),
|
|
74
74
|
children: t
|
|
75
75
|
});
|
|
76
76
|
}
|
|
77
77
|
function T(e) {
|
|
78
|
-
let { as: n, id:
|
|
79
|
-
id:
|
|
78
|
+
let { as: n, id: o, children: s, className: c, style: l, disabled: u = !1, dragActivator: f = "handle", ...m } = e, h = n ?? "div", { attributes: g, listeners: _, setActivatorNodeRef: v, setNodeRef: y, transform: S, transition: C, isDragging: w, isOver: T, isSorting: E } = d({
|
|
79
|
+
id: o,
|
|
80
80
|
disabled: u
|
|
81
81
|
}), D = {
|
|
82
82
|
transform: p.Transform.toString(S),
|
|
@@ -106,7 +106,7 @@ function T(e) {
|
|
|
106
106
|
...g,
|
|
107
107
|
..._
|
|
108
108
|
} : {};
|
|
109
|
-
return /* @__PURE__ */
|
|
109
|
+
return /* @__PURE__ */ a(b.Provider, {
|
|
110
110
|
value: O,
|
|
111
111
|
children: t(h, {
|
|
112
112
|
...m,
|
|
@@ -114,7 +114,7 @@ function T(e) {
|
|
|
114
114
|
ref: y,
|
|
115
115
|
className: i(c),
|
|
116
116
|
style: D,
|
|
117
|
-
"data-sortable-id": String(
|
|
117
|
+
"data-sortable-id": String(o),
|
|
118
118
|
"data-sortable-dragging": w ? "true" : "false",
|
|
119
119
|
"data-sortable-disabled": u ? "true" : "false"
|
|
120
120
|
}, x(s, k))
|
|
@@ -149,8 +149,8 @@ function k(e, t, n) {
|
|
|
149
149
|
}
|
|
150
150
|
function A(e) {
|
|
151
151
|
if (e.as === "button") {
|
|
152
|
-
let { as: t, children: n, className: r, disabled: s = !1, icon: c = /* @__PURE__ */ o
|
|
153
|
-
return /* @__PURE__ */
|
|
152
|
+
let { as: t, children: n, className: r, disabled: s = !1, icon: c = /* @__PURE__ */ a(o, { "aria-hidden": "true" }), type: l = "button", ...u } = e, d = k(n, u["aria-label"], u.title);
|
|
153
|
+
return /* @__PURE__ */ a(E, {
|
|
154
154
|
...u,
|
|
155
155
|
as: t,
|
|
156
156
|
type: l,
|
|
@@ -160,8 +160,8 @@ function A(e) {
|
|
|
160
160
|
children: O(n, c)
|
|
161
161
|
});
|
|
162
162
|
}
|
|
163
|
-
let { as: t, children: n, className: r, disabled: s = !1, icon: c = /* @__PURE__ */ o
|
|
164
|
-
return /* @__PURE__ */
|
|
163
|
+
let { as: t, children: n, className: r, disabled: s = !1, icon: c = /* @__PURE__ */ a(o, { "aria-hidden": "true" }), ...l } = e, u = k(n, l["aria-label"], l.title);
|
|
164
|
+
return /* @__PURE__ */ a(E, {
|
|
165
165
|
...l,
|
|
166
166
|
as: t,
|
|
167
167
|
disabled: s,
|
|
@@ -182,4 +182,4 @@ var j = {
|
|
|
182
182
|
//#endregion
|
|
183
183
|
export { T as a, E as i, A as n, C as o, w as r, y as s, j as t };
|
|
184
184
|
|
|
185
|
-
//# sourceMappingURL=sortable-
|
|
185
|
+
//# sourceMappingURL=sortable-BKIwlqhI.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sortable-DcTIAbjD.js","names":[],"sources":["../../src/sortable/sortableUtils.ts","../../src/sortable/Sortable.tsx","../../src/sortable/SortableDragHandle.module.scss","../../src/sortable/SortableDragHandle.tsx","../../src/sortable/index.ts"],"sourcesContent":["import { type DragEndEvent, type UniqueIdentifier } from \"@dnd-kit/core\";\nimport { horizontalListSortingStrategy, rectSortingStrategy, verticalListSortingStrategy, type SortingStrategy } from \"@dnd-kit/sortable\";\n\nexport type SortableLayout = \"vertical\" | \"horizontal\" | \"grid\";\n\nexport interface SortableReorderResult {\n\tcontainerId: UniqueIdentifier;\n\tactiveId: UniqueIdentifier;\n\toverId: UniqueIdentifier;\n\tfromIndex: number;\n\ttoIndex: number;\n}\n\ntype SortableItemsByContainer = Record<string, readonly UniqueIdentifier[]>;\n\nfunction resolveContainerId(eventPart: DragEndEvent[\"active\"] | DragEndEvent[\"over\"] | null | undefined): UniqueIdentifier | null {\n\treturn eventPart?.data.current?.sortable.containerId ?? null;\n}\n\nfunction resolveContainerItems(\n\tcontainerId: UniqueIdentifier,\n\titems: readonly UniqueIdentifier[] | SortableItemsByContainer\n): readonly UniqueIdentifier[] | null {\n\tif (Array.isArray(items)) {\n\t\treturn items;\n\t}\n\n\treturn (items as SortableItemsByContainer)[String(containerId)] ?? null;\n}\n\nexport function resolveSortableStrategy(layout: SortableLayout, strategy?: SortingStrategy): SortingStrategy {\n\tif (strategy) {\n\t\treturn strategy;\n\t}\n\n\tswitch (layout) {\n\t\tcase \"horizontal\":\n\t\t\treturn horizontalListSortingStrategy;\n\t\tcase \"grid\":\n\t\t\treturn rectSortingStrategy;\n\t\tcase \"vertical\":\n\t\tdefault:\n\t\t\treturn verticalListSortingStrategy;\n\t}\n}\n\nexport function getSortableReorderResult(params: {\n\tevent: DragEndEvent;\n\titems: readonly UniqueIdentifier[] | SortableItemsByContainer;\n}): SortableReorderResult | null {\n\tconst { event, items } = params;\n\tconst { active, over } = event;\n\n\tif (!over || active.id === over.id) {\n\t\treturn null;\n\t}\n\n\tconst activeContainerId = resolveContainerId(active);\n\tconst overContainerId = resolveContainerId(over);\n\tif (activeContainerId == null || overContainerId == null || activeContainerId !== overContainerId) {\n\t\treturn null;\n\t}\n\n\tconst containerItems = resolveContainerItems(activeContainerId, items);\n\tif (!containerItems) {\n\t\treturn null;\n\t}\n\n\tconst fromIndex = containerItems.indexOf(active.id);\n\tconst toIndex = containerItems.indexOf(over.id);\n\tif (fromIndex < 0 || toIndex < 0) {\n\t\treturn null;\n\t}\n\n\treturn {\n\t\tcontainerId: activeContainerId,\n\t\tactiveId: active.id,\n\t\toverId: over.id,\n\t\tfromIndex,\n\t\ttoIndex\n\t};\n}\n","import {\n\tcreateContext,\n\tcreateElement,\n\tuseContext,\n\tuseMemo,\n\ttype ComponentPropsWithoutRef,\n\ttype CSSProperties,\n\ttype ElementType,\n\ttype ReactNode\n} from \"react\";\n\nimport { closestCenter, DndContext, type DndContextProps } from \"@dnd-kit/core\";\nimport { SortableContext, useSortable, type SortingStrategy } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { useDndSortableSensors } from \"@ryuzaki13/react-foundation-lib/hooks\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { resolveSortableStrategy, type SortableLayout } from \"./sortableUtils\";\n\nimport type { UniqueIdentifier } from \"@dnd-kit/core\";\n\ntype SortableItemRenderState = {\n\tisDragging: boolean;\n\tisOver: boolean;\n\tisSorting: boolean;\n\tdisabled: boolean;\n};\n\ntype SortableHandleContextValue = {\n\tattributes: Record<string, unknown>;\n\tlisteners: Record<string, ((event: unknown) => void) | undefined> | undefined;\n\tsetActivatorNodeRef: (element: HTMLElement | null) => void;\n\tdisabled: boolean;\n\tisDragging: boolean;\n};\n\ntype SortableRootProps = Omit<DndContextProps, \"children\" | \"collisionDetection\" | \"sensors\"> & {\n\tchildren: ReactNode;\n\tcollisionDetection?: DndContextProps[\"collisionDetection\"];\n\tsensors?: DndContextProps[\"sensors\"];\n};\n\ntype SortableContainerProps = {\n\tchildren: ReactNode;\n\tcontainerId: UniqueIdentifier;\n\titems: readonly UniqueIdentifier[];\n\tlayout?: SortableLayout;\n\tstrategy?: SortingStrategy;\n};\n\ntype SortableItemBaseProps = {\n\tas?: ElementType;\n\tid: UniqueIdentifier;\n\tchildren?: ReactNode | ((state: SortableItemRenderState) => ReactNode);\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tdisabled?: boolean;\n\tdragActivator?: \"handle\" | \"item\";\n};\n\ntype SortableItemProps<E extends ElementType = \"div\"> = SortableItemBaseProps &\n\tOmit<ComponentPropsWithoutRef<E>, keyof SortableItemBaseProps | \"children\" | \"style\" | \"id\">;\n\ntype SortableHandleBaseProps = {\n\tas?: ElementType;\n\tchildren?: ReactNode | ((state: Pick<SortableHandleContextValue, \"disabled\" | \"isDragging\">) => ReactNode);\n\tdisabled?: boolean;\n};\n\ntype SortableHandleProps<E extends ElementType = \"div\"> = SortableHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<E>, keyof SortableHandleBaseProps | \"children\">;\n\nconst SortableHandleContext = createContext<SortableHandleContextValue | null>(null);\n\nfunction toItemChildren(children: SortableItemProps[\"children\"], state: SortableItemRenderState) {\n\treturn typeof children === \"function\" ? children(state) : children;\n}\n\nfunction toHandleChildren(children: SortableHandleProps[\"children\"], state: Pick<SortableHandleContextValue, \"disabled\" | \"isDragging\">) {\n\treturn typeof children === \"function\" ? children(state) : children;\n}\n\nexport function SortableRoot(props: SortableRootProps) {\n\tconst {\n\t\tchildren,\n\t\tcollisionDetection = closestCenter,\n\t\tsensors,\n\t\tonDragCancel,\n\t\tonDragEnd,\n\t\tonDragMove,\n\t\tonDragOver,\n\t\tonDragPending,\n\t\tonDragStart,\n\t\taccessibility,\n\t\t...restProps\n\t} = props;\n\tconst defaultSensors = useDndSortableSensors();\n\tconst defaultAccessibilityContainer = typeof document === \"undefined\" ? undefined : document.body;\n\tconst resolvedAccessibility = useMemo<DndContextProps[\"accessibility\"]>(\n\t\t() => ({\n\t\t\t...accessibility,\n\t\t\tcontainer: accessibility?.container ?? defaultAccessibilityContainer\n\t\t}),\n\t\t[accessibility, defaultAccessibilityContainer]\n\t);\n\n\treturn (\n\t\t<DndContext\n\t\t\t{...restProps}\n\t\t\taccessibility={resolvedAccessibility}\n\t\t\tsensors={sensors ?? defaultSensors}\n\t\t\tcollisionDetection={collisionDetection}\n\t\t\tonDragStart={onDragStart}\n\t\t\tonDragMove={onDragMove}\n\t\t\tonDragOver={onDragOver}\n\t\t\tonDragEnd={onDragEnd}\n\t\t\tonDragCancel={onDragCancel}\n\t\t\tonDragPending={onDragPending}>\n\t\t\t{children}\n\t\t</DndContext>\n\t);\n}\n\nexport function SortableContainer(props: SortableContainerProps) {\n\tconst { children, containerId, items, layout = \"vertical\", strategy } = props;\n\n\treturn (\n\t\t<SortableContext id={String(containerId)} items={[...items]} strategy={resolveSortableStrategy(layout, strategy)}>\n\t\t\t{children}\n\t\t</SortableContext>\n\t);\n}\n\nexport function SortableItem<E extends ElementType = \"div\">(props: SortableItemProps<E>) {\n\tconst { as, id, children, className, style, disabled = false, dragActivator = \"handle\", ...restProps } = props;\n\tconst Component = (as ?? \"div\") as ElementType;\n\tconst { attributes, listeners, setActivatorNodeRef, setNodeRef, transform, transition, isDragging, isOver, isSorting } = useSortable({\n\t\tid,\n\t\tdisabled\n\t});\n\n\tconst itemStyle: CSSProperties = {\n\t\ttransform: CSS.Transform.toString(transform),\n\t\ttransition,\n\t\tzIndex: !disabled && isDragging ? 2 : 1,\n\t\topacity: !disabled && isDragging ? 0.6 : undefined,\n\t\t...style\n\t};\n\tconst handleContextValue = useMemo<SortableHandleContextValue>(\n\t\t() => ({\n\t\t\tattributes: attributes as unknown as Record<string, unknown>,\n\t\t\tlisteners:\n\t\t\t\tdragActivator === \"handle\" ? (listeners as Record<string, ((event: unknown) => void) | undefined> | undefined) : undefined,\n\t\t\tsetActivatorNodeRef,\n\t\t\tdisabled: disabled || dragActivator !== \"handle\",\n\t\t\tisDragging\n\t\t}),\n\t\t[attributes, listeners, setActivatorNodeRef, disabled, dragActivator, isDragging]\n\t);\n\tconst itemState: SortableItemRenderState = {\n\t\tisDragging,\n\t\tisOver,\n\t\tisSorting,\n\t\tdisabled\n\t};\n\tconst dragBindings = dragActivator === \"item\" && !disabled ? { ...attributes, ...listeners } : {};\n\n\treturn (\n\t\t<SortableHandleContext.Provider value={handleContextValue}>\n\t\t\t{createElement(\n\t\t\t\tComponent,\n\t\t\t\t{\n\t\t\t\t\t...restProps,\n\t\t\t\t\t...dragBindings,\n\t\t\t\t\tref: setNodeRef,\n\t\t\t\t\tclassName: cn(className),\n\t\t\t\t\tstyle: itemStyle,\n\t\t\t\t\t\"data-sortable-id\": String(id),\n\t\t\t\t\t\"data-sortable-dragging\": isDragging ? \"true\" : \"false\",\n\t\t\t\t\t\"data-sortable-disabled\": disabled ? \"true\" : \"false\"\n\t\t\t\t},\n\t\t\t\ttoItemChildren(children, itemState)\n\t\t\t)}\n\t\t</SortableHandleContext.Provider>\n\t);\n}\n\nexport function SortableHandle<E extends ElementType = \"div\">(props: SortableHandleProps<E>) {\n\tconst { as, children, disabled = false, ...restProps } = props;\n\tconst Component = (as ?? \"div\") as ElementType;\n\tconst context = useContext(SortableHandleContext);\n\tconst handleDisabled = disabled || !context || context.disabled;\n\tconst dragBindings = !handleDisabled ? { ...context.attributes, ...context.listeners } : {};\n\tconst handleState = {\n\t\tdisabled: handleDisabled,\n\t\tisDragging: context?.isDragging ?? false\n\t};\n\n\treturn createElement(\n\t\tComponent,\n\t\t{\n\t\t\t...restProps,\n\t\t\t...dragBindings,\n\t\t\tref: !handleDisabled && context ? context.setActivatorNodeRef : undefined,\n\t\t\t\"aria-disabled\": handleDisabled || undefined,\n\t\t\t\"data-sortable-handle\": \"true\",\n\t\t\t\"data-sortable-handle-disabled\": handleDisabled ? \"true\" : \"false\",\n\t\t\t\"data-sortable-handle-dragging\": handleState.isDragging ? \"true\" : \"false\"\n\t\t},\n\t\ttoHandleChildren(children, handleState)\n\t);\n}\n",".dragHandle {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\n\twidth: var(--control-height);\n\theight: var(--control-height);\n\tpadding: 0;\n\tborder: none;\n\tborder-radius: var(--radius-sm);\n\tbackground: transparent;\n\tcolor: inherit;\n\tline-height: 1;\n\tuser-select: none;\n\ttouch-action: none;\n\tcursor: grab;\n\n\t&:focus-visible {\n\t\toutline: var(--focus);\n\t\toutline-offset: var(--focus-offset);\n\t}\n\n\t&:active,\n\t&[data-sortable-handle-dragging=\"true\"] {\n\t\tcursor: grabbing;\n\t}\n\n\t&[data-sortable-handle-disabled=\"true\"] {\n\t\tcursor: default;\n\t\topacity: 0.25;\n\t}\n\n\tsvg {\n\t\tdisplay: block;\n\t\twidth: 1.25em;\n\t\theight: 1.25em;\n\t}\n}\n","import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { GripIcon } from \"lucide-react\";\n\nimport { SortableHandle } from \"./Sortable\";\nimport styles from \"./SortableDragHandle.module.scss\";\n\ntype SortableDragHandleBaseProps = {\n\tchildren?: ReactNode;\n\tclassName?: string;\n\tdisabled?: boolean;\n\ticon?: ReactNode;\n};\n\ntype SortableDragHandleDivProps = SortableDragHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<\"div\">, keyof SortableDragHandleBaseProps | \"children\"> & {\n\t\tas?: \"div\";\n\t};\n\ntype SortableDragHandleButtonProps = SortableDragHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<\"button\">, keyof SortableDragHandleBaseProps | \"children\" | \"type\"> & {\n\t\tas: \"button\";\n\t\ttype?: \"button\" | \"submit\" | \"reset\";\n\t};\n\nexport type SortableDragHandleProps = SortableDragHandleDivProps | SortableDragHandleButtonProps;\n\nfunction renderHandleContent(children: ReactNode, icon: ReactNode) {\n\treturn children ?? icon;\n}\n\nfunction resolveIconOnlyAriaLabel(children: ReactNode, ariaLabel: string | undefined, title: string | undefined) {\n\treturn children == null ? (ariaLabel ?? title) : ariaLabel;\n}\n\nexport function SortableDragHandle(props: SortableDragHandleProps) {\n\tif (props.as === \"button\") {\n\t\tconst { as, children, className, disabled = false, icon = <GripIcon aria-hidden=\"true\" />, type = \"button\", ...restProps } = props;\n\t\tconst ariaLabel = resolveIconOnlyAriaLabel(children, restProps[\"aria-label\"], restProps.title);\n\n\t\treturn (\n\t\t\t<SortableHandle<\"button\">\n\t\t\t\t{...restProps}\n\t\t\t\tas={as}\n\t\t\t\ttype={type}\n\t\t\t\tdisabled={disabled}\n\t\t\t\taria-label={ariaLabel}\n\t\t\t\tclassName={cn(styles.dragHandle, className)}>\n\t\t\t\t{renderHandleContent(children, icon)}\n\t\t\t</SortableHandle>\n\t\t);\n\t}\n\n\tconst { as, children, className, disabled = false, icon = <GripIcon aria-hidden=\"true\" />, ...restProps } = props;\n\tconst ariaLabel = resolveIconOnlyAriaLabel(children, restProps[\"aria-label\"], restProps.title);\n\n\treturn (\n\t\t<SortableHandle<\"div\">\n\t\t\t{...restProps}\n\t\t\tas={as}\n\t\t\tdisabled={disabled}\n\t\t\taria-label={ariaLabel}\n\t\t\tclassName={cn(styles.dragHandle, className)}>\n\t\t\t{renderHandleContent(children, icon)}\n\t\t</SortableHandle>\n\t);\n}\n","import { SortableContainer, SortableHandle, SortableItem, SortableRoot } from \"./Sortable\";\nimport { SortableDragHandle } from \"./SortableDragHandle\";\n\nexport { getSortableReorderResult } from \"./sortableUtils\";\nexport { SortableContainer, SortableDragHandle, SortableHandle, SortableItem, SortableRoot };\n\nexport type { SortableDragHandleProps } from \"./SortableDragHandle\";\nexport type { SortableLayout, SortableReorderResult } from \"./sortableUtils\";\n\nexport const Sortable = {\n\tRoot: SortableRoot,\n\tContainer: SortableContainer,\n\tItem: SortableItem,\n\tHandle: SortableHandle,\n\tDragHandle: SortableDragHandle\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sortable-BKIwlqhI.js","names":[],"sources":["../../src/sortable/sortableUtils.ts","../../src/sortable/Sortable.tsx","../../src/sortable/SortableDragHandle.module.scss","../../src/sortable/SortableDragHandle.tsx","../../src/sortable/index.ts"],"sourcesContent":["import { type DragEndEvent, type UniqueIdentifier } from \"@dnd-kit/core\";\nimport { horizontalListSortingStrategy, rectSortingStrategy, verticalListSortingStrategy, type SortingStrategy } from \"@dnd-kit/sortable\";\n\nexport type SortableLayout = \"vertical\" | \"horizontal\" | \"grid\";\n\nexport interface SortableReorderResult {\n\tcontainerId: UniqueIdentifier;\n\tactiveId: UniqueIdentifier;\n\toverId: UniqueIdentifier;\n\tfromIndex: number;\n\ttoIndex: number;\n}\n\ntype SortableItemsByContainer = Record<string, readonly UniqueIdentifier[]>;\n\nfunction resolveContainerId(eventPart: DragEndEvent[\"active\"] | DragEndEvent[\"over\"] | null | undefined): UniqueIdentifier | null {\n\treturn eventPart?.data.current?.sortable.containerId ?? null;\n}\n\nfunction resolveContainerItems(\n\tcontainerId: UniqueIdentifier,\n\titems: readonly UniqueIdentifier[] | SortableItemsByContainer\n): readonly UniqueIdentifier[] | null {\n\tif (Array.isArray(items)) {\n\t\treturn items;\n\t}\n\n\treturn (items as SortableItemsByContainer)[String(containerId)] ?? null;\n}\n\nexport function resolveSortableStrategy(layout: SortableLayout, strategy?: SortingStrategy): SortingStrategy {\n\tif (strategy) {\n\t\treturn strategy;\n\t}\n\n\tswitch (layout) {\n\t\tcase \"horizontal\":\n\t\t\treturn horizontalListSortingStrategy;\n\t\tcase \"grid\":\n\t\t\treturn rectSortingStrategy;\n\t\tcase \"vertical\":\n\t\tdefault:\n\t\t\treturn verticalListSortingStrategy;\n\t}\n}\n\nexport function getSortableReorderResult(params: {\n\tevent: DragEndEvent;\n\titems: readonly UniqueIdentifier[] | SortableItemsByContainer;\n}): SortableReorderResult | null {\n\tconst { event, items } = params;\n\tconst { active, over } = event;\n\n\tif (!over || active.id === over.id) {\n\t\treturn null;\n\t}\n\n\tconst activeContainerId = resolveContainerId(active);\n\tconst overContainerId = resolveContainerId(over);\n\tif (activeContainerId == null || overContainerId == null || activeContainerId !== overContainerId) {\n\t\treturn null;\n\t}\n\n\tconst containerItems = resolveContainerItems(activeContainerId, items);\n\tif (!containerItems) {\n\t\treturn null;\n\t}\n\n\tconst fromIndex = containerItems.indexOf(active.id);\n\tconst toIndex = containerItems.indexOf(over.id);\n\tif (fromIndex < 0 || toIndex < 0) {\n\t\treturn null;\n\t}\n\n\treturn {\n\t\tcontainerId: activeContainerId,\n\t\tactiveId: active.id,\n\t\toverId: over.id,\n\t\tfromIndex,\n\t\ttoIndex\n\t};\n}\n","import {\n\tcreateContext,\n\tcreateElement,\n\tuseContext,\n\tuseMemo,\n\ttype ComponentPropsWithoutRef,\n\ttype CSSProperties,\n\ttype ElementType,\n\ttype ReactNode\n} from \"react\";\n\nimport { closestCenter, DndContext, type DndContextProps } from \"@dnd-kit/core\";\nimport { SortableContext, useSortable, type SortingStrategy } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { useDndSortableSensors } from \"@ryuzaki13/react-foundation-lib/hooks\";\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { resolveSortableStrategy, type SortableLayout } from \"./sortableUtils\";\n\nimport type { UniqueIdentifier } from \"@dnd-kit/core\";\n\ntype SortableItemRenderState = {\n\tisDragging: boolean;\n\tisOver: boolean;\n\tisSorting: boolean;\n\tdisabled: boolean;\n};\n\ntype SortableHandleContextValue = {\n\tattributes: Record<string, unknown>;\n\tlisteners: Record<string, ((event: unknown) => void) | undefined> | undefined;\n\tsetActivatorNodeRef: (element: HTMLElement | null) => void;\n\tdisabled: boolean;\n\tisDragging: boolean;\n};\n\ntype SortableRootProps = Omit<DndContextProps, \"children\" | \"collisionDetection\" | \"sensors\"> & {\n\tchildren: ReactNode;\n\tcollisionDetection?: DndContextProps[\"collisionDetection\"];\n\tsensors?: DndContextProps[\"sensors\"];\n};\n\ntype SortableContainerProps = {\n\tchildren: ReactNode;\n\tcontainerId: UniqueIdentifier;\n\titems: readonly UniqueIdentifier[];\n\tlayout?: SortableLayout;\n\tstrategy?: SortingStrategy;\n};\n\ntype SortableItemBaseProps = {\n\tas?: ElementType;\n\tid: UniqueIdentifier;\n\tchildren?: ReactNode | ((state: SortableItemRenderState) => ReactNode);\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tdisabled?: boolean;\n\tdragActivator?: \"handle\" | \"item\";\n};\n\ntype SortableItemProps<E extends ElementType = \"div\"> = SortableItemBaseProps &\n\tOmit<ComponentPropsWithoutRef<E>, keyof SortableItemBaseProps | \"children\" | \"style\" | \"id\">;\n\ntype SortableHandleBaseProps = {\n\tas?: ElementType;\n\tchildren?: ReactNode | ((state: Pick<SortableHandleContextValue, \"disabled\" | \"isDragging\">) => ReactNode);\n\tdisabled?: boolean;\n};\n\ntype SortableHandleProps<E extends ElementType = \"div\"> = SortableHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<E>, keyof SortableHandleBaseProps | \"children\">;\n\nconst SortableHandleContext = createContext<SortableHandleContextValue | null>(null);\n\nfunction toItemChildren(children: SortableItemProps[\"children\"], state: SortableItemRenderState) {\n\treturn typeof children === \"function\" ? children(state) : children;\n}\n\nfunction toHandleChildren(children: SortableHandleProps[\"children\"], state: Pick<SortableHandleContextValue, \"disabled\" | \"isDragging\">) {\n\treturn typeof children === \"function\" ? children(state) : children;\n}\n\nexport function SortableRoot(props: SortableRootProps) {\n\tconst {\n\t\tchildren,\n\t\tcollisionDetection = closestCenter,\n\t\tsensors,\n\t\tonDragCancel,\n\t\tonDragEnd,\n\t\tonDragMove,\n\t\tonDragOver,\n\t\tonDragPending,\n\t\tonDragStart,\n\t\taccessibility,\n\t\t...restProps\n\t} = props;\n\tconst defaultSensors = useDndSortableSensors();\n\tconst defaultAccessibilityContainer = typeof document === \"undefined\" ? undefined : document.body;\n\tconst resolvedAccessibility = useMemo<DndContextProps[\"accessibility\"]>(\n\t\t() => ({\n\t\t\t...accessibility,\n\t\t\tcontainer: accessibility?.container ?? defaultAccessibilityContainer\n\t\t}),\n\t\t[accessibility, defaultAccessibilityContainer]\n\t);\n\n\treturn (\n\t\t<DndContext\n\t\t\t{...restProps}\n\t\t\taccessibility={resolvedAccessibility}\n\t\t\tsensors={sensors ?? defaultSensors}\n\t\t\tcollisionDetection={collisionDetection}\n\t\t\tonDragStart={onDragStart}\n\t\t\tonDragMove={onDragMove}\n\t\t\tonDragOver={onDragOver}\n\t\t\tonDragEnd={onDragEnd}\n\t\t\tonDragCancel={onDragCancel}\n\t\t\tonDragPending={onDragPending}>\n\t\t\t{children}\n\t\t</DndContext>\n\t);\n}\n\nexport function SortableContainer(props: SortableContainerProps) {\n\tconst { children, containerId, items, layout = \"vertical\", strategy } = props;\n\n\treturn (\n\t\t<SortableContext id={String(containerId)} items={[...items]} strategy={resolveSortableStrategy(layout, strategy)}>\n\t\t\t{children}\n\t\t</SortableContext>\n\t);\n}\n\nexport function SortableItem<E extends ElementType = \"div\">(props: SortableItemProps<E>) {\n\tconst { as, id, children, className, style, disabled = false, dragActivator = \"handle\", ...restProps } = props;\n\tconst Component = (as ?? \"div\") as ElementType;\n\tconst { attributes, listeners, setActivatorNodeRef, setNodeRef, transform, transition, isDragging, isOver, isSorting } = useSortable({\n\t\tid,\n\t\tdisabled\n\t});\n\n\tconst itemStyle: CSSProperties = {\n\t\ttransform: CSS.Transform.toString(transform),\n\t\ttransition,\n\t\tzIndex: !disabled && isDragging ? 2 : 1,\n\t\topacity: !disabled && isDragging ? 0.6 : undefined,\n\t\t...style\n\t};\n\tconst handleContextValue = useMemo<SortableHandleContextValue>(\n\t\t() => ({\n\t\t\tattributes: attributes as unknown as Record<string, unknown>,\n\t\t\tlisteners:\n\t\t\t\tdragActivator === \"handle\" ? (listeners as Record<string, ((event: unknown) => void) | undefined> | undefined) : undefined,\n\t\t\tsetActivatorNodeRef,\n\t\t\tdisabled: disabled || dragActivator !== \"handle\",\n\t\t\tisDragging\n\t\t}),\n\t\t[attributes, listeners, setActivatorNodeRef, disabled, dragActivator, isDragging]\n\t);\n\tconst itemState: SortableItemRenderState = {\n\t\tisDragging,\n\t\tisOver,\n\t\tisSorting,\n\t\tdisabled\n\t};\n\tconst dragBindings = dragActivator === \"item\" && !disabled ? { ...attributes, ...listeners } : {};\n\n\treturn (\n\t\t<SortableHandleContext.Provider value={handleContextValue}>\n\t\t\t{createElement(\n\t\t\t\tComponent,\n\t\t\t\t{\n\t\t\t\t\t...restProps,\n\t\t\t\t\t...dragBindings,\n\t\t\t\t\tref: setNodeRef,\n\t\t\t\t\tclassName: cn(className),\n\t\t\t\t\tstyle: itemStyle,\n\t\t\t\t\t\"data-sortable-id\": String(id),\n\t\t\t\t\t\"data-sortable-dragging\": isDragging ? \"true\" : \"false\",\n\t\t\t\t\t\"data-sortable-disabled\": disabled ? \"true\" : \"false\"\n\t\t\t\t},\n\t\t\t\ttoItemChildren(children, itemState)\n\t\t\t)}\n\t\t</SortableHandleContext.Provider>\n\t);\n}\n\nexport function SortableHandle<E extends ElementType = \"div\">(props: SortableHandleProps<E>) {\n\tconst { as, children, disabled = false, ...restProps } = props;\n\tconst Component = (as ?? \"div\") as ElementType;\n\tconst context = useContext(SortableHandleContext);\n\tconst handleDisabled = disabled || !context || context.disabled;\n\tconst dragBindings = !handleDisabled ? { ...context.attributes, ...context.listeners } : {};\n\tconst handleState = {\n\t\tdisabled: handleDisabled,\n\t\tisDragging: context?.isDragging ?? false\n\t};\n\n\treturn createElement(\n\t\tComponent,\n\t\t{\n\t\t\t...restProps,\n\t\t\t...dragBindings,\n\t\t\tref: !handleDisabled && context ? context.setActivatorNodeRef : undefined,\n\t\t\t\"aria-disabled\": handleDisabled || undefined,\n\t\t\t\"data-sortable-handle\": \"true\",\n\t\t\t\"data-sortable-handle-disabled\": handleDisabled ? \"true\" : \"false\",\n\t\t\t\"data-sortable-handle-dragging\": handleState.isDragging ? \"true\" : \"false\"\n\t\t},\n\t\ttoHandleChildren(children, handleState)\n\t);\n}\n",".dragHandle {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\n\twidth: var(--control-height);\n\theight: var(--control-height);\n\tpadding: 0;\n\tborder: none;\n\tborder-radius: var(--radius-sm);\n\tbackground: transparent;\n\tcolor: inherit;\n\tline-height: 1;\n\tuser-select: none;\n\ttouch-action: none;\n\tcursor: grab;\n\n\t&:focus-visible {\n\t\toutline: var(--focus);\n\t\toutline-offset: var(--focus-offset);\n\t}\n\n\t&:active,\n\t&[data-sortable-handle-dragging=\"true\"] {\n\t\tcursor: grabbing;\n\t}\n\n\t&[data-sortable-handle-disabled=\"true\"] {\n\t\tcursor: default;\n\t\topacity: 0.25;\n\t}\n\n\tsvg {\n\t\tdisplay: block;\n\t\twidth: 1.25em;\n\t\theight: 1.25em;\n\t}\n}\n","import type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\nimport { GripIcon } from \"lucide-react\";\n\nimport { SortableHandle } from \"./Sortable\";\nimport styles from \"./SortableDragHandle.module.scss\";\n\ntype SortableDragHandleBaseProps = {\n\tchildren?: ReactNode;\n\tclassName?: string;\n\tdisabled?: boolean;\n\ticon?: ReactNode;\n};\n\ntype SortableDragHandleDivProps = SortableDragHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<\"div\">, keyof SortableDragHandleBaseProps | \"children\"> & {\n\t\tas?: \"div\";\n\t};\n\ntype SortableDragHandleButtonProps = SortableDragHandleBaseProps &\n\tOmit<ComponentPropsWithoutRef<\"button\">, keyof SortableDragHandleBaseProps | \"children\" | \"type\"> & {\n\t\tas: \"button\";\n\t\ttype?: \"button\" | \"submit\" | \"reset\";\n\t};\n\nexport type SortableDragHandleProps = SortableDragHandleDivProps | SortableDragHandleButtonProps;\n\nfunction renderHandleContent(children: ReactNode, icon: ReactNode) {\n\treturn children ?? icon;\n}\n\nfunction resolveIconOnlyAriaLabel(children: ReactNode, ariaLabel: string | undefined, title: string | undefined) {\n\treturn children == null ? (ariaLabel ?? title) : ariaLabel;\n}\n\nexport function SortableDragHandle(props: SortableDragHandleProps) {\n\tif (props.as === \"button\") {\n\t\tconst { as, children, className, disabled = false, icon = <GripIcon aria-hidden=\"true\" />, type = \"button\", ...restProps } = props;\n\t\tconst ariaLabel = resolveIconOnlyAriaLabel(children, restProps[\"aria-label\"], restProps.title);\n\n\t\treturn (\n\t\t\t<SortableHandle<\"button\">\n\t\t\t\t{...restProps}\n\t\t\t\tas={as}\n\t\t\t\ttype={type}\n\t\t\t\tdisabled={disabled}\n\t\t\t\taria-label={ariaLabel}\n\t\t\t\tclassName={cn(styles.dragHandle, className)}>\n\t\t\t\t{renderHandleContent(children, icon)}\n\t\t\t</SortableHandle>\n\t\t);\n\t}\n\n\tconst { as, children, className, disabled = false, icon = <GripIcon aria-hidden=\"true\" />, ...restProps } = props;\n\tconst ariaLabel = resolveIconOnlyAriaLabel(children, restProps[\"aria-label\"], restProps.title);\n\n\treturn (\n\t\t<SortableHandle<\"div\">\n\t\t\t{...restProps}\n\t\t\tas={as}\n\t\t\tdisabled={disabled}\n\t\t\taria-label={ariaLabel}\n\t\t\tclassName={cn(styles.dragHandle, className)}>\n\t\t\t{renderHandleContent(children, icon)}\n\t\t</SortableHandle>\n\t);\n}\n","import { SortableContainer, SortableHandle, SortableItem, SortableRoot } from \"./Sortable\";\nimport { SortableDragHandle } from \"./SortableDragHandle\";\n\nexport { getSortableReorderResult } from \"./sortableUtils\";\nexport { SortableContainer, SortableDragHandle, SortableHandle, SortableItem, SortableRoot };\n\nexport type { SortableDragHandleProps } from \"./SortableDragHandle\";\nexport type { SortableLayout, SortableReorderResult } from \"./sortableUtils\";\n\nexport const Sortable = {\n\tRoot: SortableRoot,\n\tContainer: SortableContainer,\n\tItem: SortableItem,\n\tHandle: SortableHandle,\n\tDragHandle: SortableDragHandle\n};\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as e, c as t, d as n, i as r, m as i, n as a, o as ee, r as te, s as ne, t as re } from "./base-table-
|
|
1
|
+
import { a as e, c as t, d as n, i as r, m as i, n as a, o as ee, r as te, s as ne, t as re } from "./base-table-CJdKCKhb.js";
|
|
2
2
|
import { useEffect as ie, useEffectEvent as ae, useMemo as o, useRef as s } from "react";
|
|
3
3
|
import { jsx as c } from "react/jsx-runtime";
|
|
4
4
|
import { formatPipelineDisplayValue as l } from "@ryuzaki13/react-foundation-lib/formatters";
|
|
@@ -138,4 +138,4 @@ function m({ title: m, isLoading: h, isFetching: se, data: g, columns: _, select
|
|
|
138
138
|
//#endregion
|
|
139
139
|
export { m as t };
|
|
140
140
|
|
|
141
|
-
//# sourceMappingURL=table-
|
|
141
|
+
//# sourceMappingURL=table-CIWdAcPY.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-BChs6bgR.js","names":[],"sources":["../../src/table/Table.module.scss","../../src/table/Table.tsx"],"sourcesContent":[".selectedIndicatorCell {\n\tbox-shadow: inset 0.1875rem 0 0 var(--content-accent);\n}\n\n.sentinel {\n\theight: 1px;\n}\n","/* eslint-disable react-hooks/incompatible-library */\nimport { useEffect, useEffectEvent, useMemo, useRef } from \"react\";\n\nimport { formatPipelineDisplayValue } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { TableFormulaRowData } from \"@ryuzaki13/react-foundation-lib/formulas\";\nimport {\n\ttype TableColumnDef,\n\ttype TableColumnOrderState,\n\ttype TableColumnSizingState,\n\ttype TableSelectionMode,\n\tuseTableRowSelection\n} from \"@ryuzaki13/react-foundation-lib/table\";\nimport { getCoreRowModel, useReactTable, type Row, type VisibilityState } from \"@tanstack/react-table\";\n\nimport {\n\tBaseTable,\n\tbuildBaseTableMergedCellsLayout,\n\tbuildTableFormattingSnapshot,\n\tFormattedTableCell,\n\tgetOrderedVisibleLeafColumns,\n\tshouldUseTableFormatting,\n\tuseTableColumnOrder,\n\tuseTableColumnPinning,\n\tuseTableColumnSizing,\n\tuseTableColumnVisibility,\n\ttype BaseTableColumnState,\n\ttype BaseTableProps,\n\ttype TableColumnPinningState\n} from \"../base-table\";\n\nimport styles from \"./Table.module.scss\";\n\n/**\n * Возвращает индекс как строковый id, если внешний id не передан.\n */\nfunction defaultGetRowId<TData>(_row: TData, index: number): string {\n\treturn String(index);\n}\n\n/**\n * Пропсы компонента Table.\n *\n * Компонент предназначен для плоских данных и по API осознанно сближен с TreeTable.\n */\nexport interface TableProps<TData extends object> {\n\t/**\n\t * Необязательный заголовок над таблицей.\n\t */\n\ttitle?: string;\n\t/**\n\t * Признак первичной загрузки.\n\t */\n\tisLoading?: boolean;\n\t/**\n\t * Признак фоновой догрузки или обновления данных.\n\t */\n\tisFetching?: boolean;\n\t/**\n\t * Плоский источник строк.\n\t */\n\tdata: readonly TData[] | undefined | null;\n\t/**\n\t * Описание колонок таблицы.\n\t */\n\tcolumns: readonly TableColumnDef<TData>[];\n\t/**\n\t * Режим выбора строк.\n\t */\n\tselectionMode?: TableSelectionMode;\n\t/**\n\t * Внешний список выбранных строк.\n\t *\n\t * Если передан, таблица синхронизирует визуальное выделение с этим набором id.\n\t */\n\tselectedRowIds?: readonly string[];\n\t/**\n\t * Стабильный идентификатор строки.\n\t *\n\t * Если не задан, используется индекс строки.\n\t */\n\tgetRowId?: (row: TData, index: number) => string;\n\t/**\n\t * Дополнительный CSS-класс корневого контейнера.\n\t */\n\tclassName?: string;\n\tminHeight?: `${number}em` | `${number}%`;\n\t/**\n\t * Дополнительный CSS-класс тега `table`.\n\t */\n\ttableClassName?: string;\n\t/**\n\t * Внешнее controlled-состояние видимости колонок.\n\t */\n\tcolumnVisibility?: VisibilityState;\n\t/**\n\t * Стартовое uncontrolled-состояние видимости колонок.\n\t */\n\tdefaultColumnVisibility?: VisibilityState;\n\t/**\n\t * Внешнее controlled-состояние порядка колонок.\n\t */\n\tcolumnOrder?: readonly string[];\n\t/**\n\t * Стартовое uncontrolled-состояние порядка колонок.\n\t */\n\tdefaultColumnOrder?: readonly string[];\n\t/**\n\t * Внешнее controlled-состояние ширин колонок в px.\n\t */\n\tcolumnSizing?: TableColumnSizingState;\n\t/**\n\t * Стартовое uncontrolled-состояние ширин колонок в px.\n\t */\n\tdefaultColumnSizing?: TableColumnSizingState;\n\t/**\n\t * Внешнее controlled-состояние left-pinning для колонок.\n\t */\n\tcolumnPinning?: TableColumnPinningState;\n\t/**\n\t * Стартовое uncontrolled-состояние left-pinning для колонок.\n\t */\n\tdefaultColumnPinning?: TableColumnPinningState;\n\t/**\n\t * Включает изменение ширины колонок через header-handle.\n\t */\n\tenableColumnResizing?: boolean;\n\t/**\n\t * Включает изменение порядка колонок через drag&drop заголовков.\n\t */\n\tenableColumnReordering?: boolean;\n\t/**\n\t * Минимальная ширина колонки при resize в px.\n\t */\n\tcolumnResizeMinWidth?: number;\n\t/**\n\t * Вызывается после изменения видимости колонок.\n\t */\n\tonColumnVisibilityChange?: (state: VisibilityState) => void;\n\t/**\n\t * Вызывается после изменения порядка колонок.\n\t */\n\tonColumnOrderChange?: (state: TableColumnOrderState) => void;\n\t/**\n\t * Вызывается после изменения ширины колонок.\n\t */\n\tonColumnSizingChange?: (state: TableColumnSizingState) => void;\n\t/**\n\t * Вызывается после изменения left-pinning state.\n\t */\n\tonColumnPinningChange?: (state: TableColumnPinningState) => void;\n\t/**\n\t * Вызывается при активации строки кликом или клавиатурой.\n\t */\n\tonRowClick?: (row: TData) => void;\n\t/**\n\t * Вызывается после изменения выбранных строк.\n\t */\n\tonRowSelectionChange?: (rows: TData[]) => void;\n\t/**\n\t * Вызывается при достижении конца таблицы внутри scroll-контейнера.\n\t */\n\tonReachEnd?: () => void;\n\t/**\n\t * Позволяет запретить выбор отдельных строк.\n\t */\n\tgetRowCanSelect?: (row: TData) => boolean;\n\t/**\n\t * Позволяет добавить CSS-класс для конкретной строки.\n\t */\n\tgetRowClassName?: (row: TData) => string | undefined;\n\t/**\n\t * Контекстное меню заголовка колонки. Используется для общих runtime-действий\n\t * вроде server sorting без встраивания доменной логики в shared-таблицу.\n\t */\n\trenderHeaderContextMenu?: BaseTableProps<TData>[\"renderHeaderContextMenu\"];\n\t/**\n\t * Тонкая точка расширения содержимого ячейки поверх стандартного форматирования.\n\t *\n\t * В отличие от `column.cell`, этот слот не отключает общий formatting-runtime:\n\t * `defaultContent` уже содержит отформатированное значение, если оно применимо.\n\t */\n\trenderCellContent?: BaseTableProps<TData>[\"renderCellContent\"];\n}\n\n/**\n * Плоская таблица на базе TanStack Table как React-альтернатива `sap.m.Table`.\n */\nexport function Table<TData extends object>({\n\ttitle,\n\tisLoading,\n\tisFetching,\n\tdata,\n\tcolumns,\n\tselectionMode = \"none\",\n\tselectedRowIds,\n\tgetRowId,\n\tclassName,\n\tminHeight,\n\ttableClassName,\n\tcolumnVisibility,\n\tdefaultColumnVisibility,\n\tcolumnOrder,\n\tdefaultColumnOrder,\n\tcolumnSizing,\n\tdefaultColumnSizing,\n\tcolumnPinning,\n\tdefaultColumnPinning,\n\tenableColumnResizing = false,\n\tenableColumnReordering = false,\n\tcolumnResizeMinWidth,\n\tonColumnVisibilityChange,\n\tonColumnOrderChange,\n\tonColumnSizingChange,\n\tonColumnPinningChange,\n\tonRowClick,\n\tonRowSelectionChange,\n\tonReachEnd,\n\tgetRowCanSelect,\n\tgetRowClassName,\n\trenderHeaderContextMenu,\n\trenderCellContent\n}: TableProps<TData>) {\n\tconst tableData = useMemo(() => data ?? [], [data]);\n\tconst formattingSnapshot = useMemo(() => buildTableFormattingSnapshot(columns), [columns]);\n\tconst resolveRowId = getRowId ?? defaultGetRowId<TData>;\n\tconst rowById = useMemo(() => new Map(tableData.map((row, index) => [resolveRowId(row, index), row])), [resolveRowId, tableData]);\n\tconst availableRowIds = useMemo(() => Array.from(rowById.keys()), [rowById]);\n\tconst scrollableRef = useRef<HTMLDivElement | null>(null);\n\tconst sentinelRef = useRef<HTMLDivElement | null>(null);\n\n\tconst { rowSelection, activateRowSelection } = useTableRowSelection({\n\t\tavailableRowIds,\n\t\trowById,\n\t\tselectionMode,\n\t\tselectedRowIds,\n\t\tonRowSelectionChange\n\t});\n\tconst { columnVisibility: resolvedColumnVisibility, onColumnVisibilityChange: handleColumnVisibilityChange } = useTableColumnVisibility(\n\t\t{\n\t\t\tcolumnVisibility,\n\t\t\tdefaultColumnVisibility,\n\t\t\tonColumnVisibilityChange\n\t\t}\n\t);\n\tconst { columnOrder: resolvedColumnOrder, onColumnOrderChange: handleColumnOrderChange } = useTableColumnOrder({\n\t\tcolumnOrder,\n\t\tdefaultColumnOrder,\n\t\tonColumnOrderChange\n\t});\n\tconst { columnSizing: resolvedColumnSizing, onColumnSizingChange: handleColumnSizingChange } = useTableColumnSizing({\n\t\tcolumnSizing,\n\t\tdefaultColumnSizing,\n\t\tcolumnResizeMinWidth,\n\t\tonColumnSizingChange\n\t});\n\tconst { columnPinning: resolvedColumnPinning, onColumnPinningChange: handleColumnPinningChange } = useTableColumnPinning({\n\t\tcolumnPinning,\n\t\tdefaultColumnPinning,\n\t\tonColumnPinningChange\n\t});\n\tconst baseTableColumnState = useMemo<BaseTableColumnState>(\n\t\t() => ({\n\t\t\tcolumnOrder: resolvedColumnOrder,\n\t\t\tcolumnPinning: resolvedColumnPinning,\n\t\t\tcolumnSizing: resolvedColumnSizing,\n\t\t\tcolumnVisibility: resolvedColumnVisibility\n\t\t}),\n\t\t[resolvedColumnOrder, resolvedColumnPinning, resolvedColumnSizing, resolvedColumnVisibility]\n\t);\n\n\tconst emitReachEnd = useEffectEvent(() => {\n\t\tonReachEnd?.();\n\t});\n\n\tuseEffect(() => {\n\t\tif (!onReachEnd || !scrollableRef.current || !sentinelRef.current || isLoading) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst observer = new IntersectionObserver(\n\t\t\t(entries) => {\n\t\t\t\tconst entry = entries[0];\n\n\t\t\t\tif (entry?.isIntersecting) {\n\t\t\t\t\temitReachEnd();\n\t\t\t\t}\n\t\t\t},\n\t\t\t{\n\t\t\t\troot: scrollableRef.current,\n\t\t\t\tthreshold: 0.1\n\t\t\t}\n\t\t);\n\n\t\tobserver.observe(sentinelRef.current);\n\n\t\treturn () => observer.disconnect();\n\t}, [isLoading, onReachEnd, tableData.length]);\n\n\tconst table = useReactTable<TData>({\n\t\tdata: tableData as TData[],\n\t\tcolumns: columns as TableColumnDef<TData>[],\n\t\tstate: {\n\t\t\tcolumnOrder: resolvedColumnOrder,\n\t\t\tcolumnPinning: resolvedColumnPinning,\n\t\t\tcolumnSizing: resolvedColumnSizing,\n\t\t\tcolumnVisibility: resolvedColumnVisibility,\n\t\t\trowSelection\n\t\t},\n\t\tonColumnOrderChange: handleColumnOrderChange,\n\t\tonColumnPinningChange: handleColumnPinningChange,\n\t\tonColumnSizingChange: handleColumnSizingChange,\n\t\tonColumnVisibilityChange: handleColumnVisibilityChange,\n\t\tgetRowId: (row, index) => resolveRowId(row, index),\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tenableMultiRowSelection: selectionMode === \"multi\",\n\t\tenableRowSelection: (row) => {\n\t\t\tif (selectionMode === \"none\") {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\treturn getRowCanSelect ? getRowCanSelect(row.original) : true;\n\t\t}\n\t});\n\n\tconst visibleLeafColumns = getOrderedVisibleLeafColumns(table, baseTableColumnState);\n\tconst rowModelRows = table.getRowModel().rows;\n\tconst mergedCellLayout = useMemo(\n\t\t() =>\n\t\t\tbuildBaseTableMergedCellsLayout({\n\t\t\t\trows: rowModelRows,\n\t\t\t\tcolumns: visibleLeafColumns\n\t\t\t}),\n\t\t[rowModelRows, visibleLeafColumns]\n\t);\n\tconst leadingColumnId = visibleLeafColumns[0]?.id;\n\n\t/**\n\t * Активирует строку: обновляет выбор в соответствии с режимом и вызывает внешний callback.\n\t */\n\tconst activateRow = (row: Row<TData>) => {\n\t\tactivateRowSelection(row.id, row.getCanSelect());\n\t\tonRowClick?.(row.original);\n\t};\n\n\treturn (\n\t\t<BaseTable\n\t\t\ttable={table}\n\t\t\tcolumnState={baseTableColumnState}\n\t\t\ttitle={title}\n\t\t\tisLoading={isLoading}\n\t\t\tisFetching={isFetching}\n\t\t\tclassName={className}\n\t\t\tminHeight={minHeight}\n\t\t\ttableClassName={tableClassName}\n\t\t\tselectionMode={selectionMode}\n\t\t\tscrollableRef={scrollableRef}\n\t\t\tonActivateRow={selectionMode !== \"none\" || onRowClick ? activateRow : undefined}\n\t\t\tisRowInteractive={(row) => Boolean(onRowClick || (selectionMode !== \"none\" && row.getCanSelect()))}\n\t\t\tgetRowClassName={(row) => getRowClassName?.(row.original)}\n\t\t\tgetCellClassName={({ row, cell }) =>\n\t\t\t\tcell.column.id === leadingColumnId && row.getIsSelected() ? styles.selectedIndicatorCell : undefined\n\t\t\t}\n\t\t\tgetCellLayout={({ cell }) => mergedCellLayout.get(cell.id)}\n\t\t\trenderHeaderContextMenu={renderHeaderContextMenu}\n\t\t\tenableColumnResizing={enableColumnResizing}\n\t\t\tenableColumnReordering={enableColumnReordering}\n\t\t\tcolumnResizeMinWidth={columnResizeMinWidth}\n\t\t\trenderCellContent={(args) => {\n\t\t\t\tconst displayValue = formatPipelineDisplayValue({\n\t\t\t\t\tfield: formattingSnapshot.runtimeByColumnId[args.cell.column.id],\n\t\t\t\t\trawValue: args.cell.getValue(),\n\t\t\t\t\trowData: args.row.original as TableFormulaRowData,\n\t\t\t\t\trowKind: \"plain\"\n\t\t\t\t});\n\t\t\t\tconst defaultContent = !shouldUseTableFormatting({\n\t\t\t\t\tcolumnId: args.cell.column.id,\n\t\t\t\t\truntimeByColumnId: formattingSnapshot.runtimeByColumnId,\n\t\t\t\t\tcustomCellColumnIds: formattingSnapshot.customCellColumnIds\n\t\t\t\t}) ? (\n\t\t\t\t\targs.defaultContent\n\t\t\t\t) : (\n\t\t\t\t\t<FormattedTableCell displayValue={displayValue} align={args.columnMeta?.align} />\n\t\t\t\t);\n\n\t\t\t\tif (renderCellContent) {\n\t\t\t\t\treturn renderCellContent({\n\t\t\t\t\t\t...args,\n\t\t\t\t\t\tdefaultContent,\n\t\t\t\t\t\tdisplayValue\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\treturn defaultContent;\n\t\t\t}}\n\t\t\tafterTableContent={onReachEnd ? <div ref={sentinelRef} className={styles.sentinel} aria-hidden=\"true\" /> : null}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"table-CIWdAcPY.js","names":[],"sources":["../../src/table/Table.module.scss","../../src/table/Table.tsx"],"sourcesContent":[".selectedIndicatorCell {\n\tbox-shadow: inset 0.1875rem 0 0 var(--content-accent);\n}\n\n.sentinel {\n\theight: 1px;\n}\n","/* eslint-disable react-hooks/incompatible-library */\nimport { useEffect, useEffectEvent, useMemo, useRef } from \"react\";\n\nimport { formatPipelineDisplayValue } from \"@ryuzaki13/react-foundation-lib/formatters\";\nimport { TableFormulaRowData } from \"@ryuzaki13/react-foundation-lib/formulas\";\nimport {\n\ttype TableColumnDef,\n\ttype TableColumnOrderState,\n\ttype TableColumnSizingState,\n\ttype TableSelectionMode,\n\tuseTableRowSelection\n} from \"@ryuzaki13/react-foundation-lib/table\";\nimport { getCoreRowModel, useReactTable, type Row, type VisibilityState } from \"@tanstack/react-table\";\n\nimport {\n\tBaseTable,\n\tbuildBaseTableMergedCellsLayout,\n\tbuildTableFormattingSnapshot,\n\tFormattedTableCell,\n\tgetOrderedVisibleLeafColumns,\n\tshouldUseTableFormatting,\n\tuseTableColumnOrder,\n\tuseTableColumnPinning,\n\tuseTableColumnSizing,\n\tuseTableColumnVisibility,\n\ttype BaseTableColumnState,\n\ttype BaseTableProps,\n\ttype TableColumnPinningState\n} from \"../base-table\";\n\nimport styles from \"./Table.module.scss\";\n\n/**\n * Возвращает индекс как строковый id, если внешний id не передан.\n */\nfunction defaultGetRowId<TData>(_row: TData, index: number): string {\n\treturn String(index);\n}\n\n/**\n * Пропсы компонента Table.\n *\n * Компонент предназначен для плоских данных и по API осознанно сближен с TreeTable.\n */\nexport interface TableProps<TData extends object> {\n\t/**\n\t * Необязательный заголовок над таблицей.\n\t */\n\ttitle?: string;\n\t/**\n\t * Признак первичной загрузки.\n\t */\n\tisLoading?: boolean;\n\t/**\n\t * Признак фоновой догрузки или обновления данных.\n\t */\n\tisFetching?: boolean;\n\t/**\n\t * Плоский источник строк.\n\t */\n\tdata: readonly TData[] | undefined | null;\n\t/**\n\t * Описание колонок таблицы.\n\t */\n\tcolumns: readonly TableColumnDef<TData>[];\n\t/**\n\t * Режим выбора строк.\n\t */\n\tselectionMode?: TableSelectionMode;\n\t/**\n\t * Внешний список выбранных строк.\n\t *\n\t * Если передан, таблица синхронизирует визуальное выделение с этим набором id.\n\t */\n\tselectedRowIds?: readonly string[];\n\t/**\n\t * Стабильный идентификатор строки.\n\t *\n\t * Если не задан, используется индекс строки.\n\t */\n\tgetRowId?: (row: TData, index: number) => string;\n\t/**\n\t * Дополнительный CSS-класс корневого контейнера.\n\t */\n\tclassName?: string;\n\tminHeight?: `${number}em` | `${number}%`;\n\t/**\n\t * Дополнительный CSS-класс тега `table`.\n\t */\n\ttableClassName?: string;\n\t/**\n\t * Внешнее controlled-состояние видимости колонок.\n\t */\n\tcolumnVisibility?: VisibilityState;\n\t/**\n\t * Стартовое uncontrolled-состояние видимости колонок.\n\t */\n\tdefaultColumnVisibility?: VisibilityState;\n\t/**\n\t * Внешнее controlled-состояние порядка колонок.\n\t */\n\tcolumnOrder?: readonly string[];\n\t/**\n\t * Стартовое uncontrolled-состояние порядка колонок.\n\t */\n\tdefaultColumnOrder?: readonly string[];\n\t/**\n\t * Внешнее controlled-состояние ширин колонок в px.\n\t */\n\tcolumnSizing?: TableColumnSizingState;\n\t/**\n\t * Стартовое uncontrolled-состояние ширин колонок в px.\n\t */\n\tdefaultColumnSizing?: TableColumnSizingState;\n\t/**\n\t * Внешнее controlled-состояние left-pinning для колонок.\n\t */\n\tcolumnPinning?: TableColumnPinningState;\n\t/**\n\t * Стартовое uncontrolled-состояние left-pinning для колонок.\n\t */\n\tdefaultColumnPinning?: TableColumnPinningState;\n\t/**\n\t * Включает изменение ширины колонок через header-handle.\n\t */\n\tenableColumnResizing?: boolean;\n\t/**\n\t * Включает изменение порядка колонок через drag&drop заголовков.\n\t */\n\tenableColumnReordering?: boolean;\n\t/**\n\t * Минимальная ширина колонки при resize в px.\n\t */\n\tcolumnResizeMinWidth?: number;\n\t/**\n\t * Вызывается после изменения видимости колонок.\n\t */\n\tonColumnVisibilityChange?: (state: VisibilityState) => void;\n\t/**\n\t * Вызывается после изменения порядка колонок.\n\t */\n\tonColumnOrderChange?: (state: TableColumnOrderState) => void;\n\t/**\n\t * Вызывается после изменения ширины колонок.\n\t */\n\tonColumnSizingChange?: (state: TableColumnSizingState) => void;\n\t/**\n\t * Вызывается после изменения left-pinning state.\n\t */\n\tonColumnPinningChange?: (state: TableColumnPinningState) => void;\n\t/**\n\t * Вызывается при активации строки кликом или клавиатурой.\n\t */\n\tonRowClick?: (row: TData) => void;\n\t/**\n\t * Вызывается после изменения выбранных строк.\n\t */\n\tonRowSelectionChange?: (rows: TData[]) => void;\n\t/**\n\t * Вызывается при достижении конца таблицы внутри scroll-контейнера.\n\t */\n\tonReachEnd?: () => void;\n\t/**\n\t * Позволяет запретить выбор отдельных строк.\n\t */\n\tgetRowCanSelect?: (row: TData) => boolean;\n\t/**\n\t * Позволяет добавить CSS-класс для конкретной строки.\n\t */\n\tgetRowClassName?: (row: TData) => string | undefined;\n\t/**\n\t * Контекстное меню заголовка колонки. Используется для общих runtime-действий\n\t * вроде server sorting без встраивания доменной логики в shared-таблицу.\n\t */\n\trenderHeaderContextMenu?: BaseTableProps<TData>[\"renderHeaderContextMenu\"];\n\t/**\n\t * Тонкая точка расширения содержимого ячейки поверх стандартного форматирования.\n\t *\n\t * В отличие от `column.cell`, этот слот не отключает общий formatting-runtime:\n\t * `defaultContent` уже содержит отформатированное значение, если оно применимо.\n\t */\n\trenderCellContent?: BaseTableProps<TData>[\"renderCellContent\"];\n}\n\n/**\n * Плоская таблица на базе TanStack Table как React-альтернатива `sap.m.Table`.\n */\nexport function Table<TData extends object>({\n\ttitle,\n\tisLoading,\n\tisFetching,\n\tdata,\n\tcolumns,\n\tselectionMode = \"none\",\n\tselectedRowIds,\n\tgetRowId,\n\tclassName,\n\tminHeight,\n\ttableClassName,\n\tcolumnVisibility,\n\tdefaultColumnVisibility,\n\tcolumnOrder,\n\tdefaultColumnOrder,\n\tcolumnSizing,\n\tdefaultColumnSizing,\n\tcolumnPinning,\n\tdefaultColumnPinning,\n\tenableColumnResizing = false,\n\tenableColumnReordering = false,\n\tcolumnResizeMinWidth,\n\tonColumnVisibilityChange,\n\tonColumnOrderChange,\n\tonColumnSizingChange,\n\tonColumnPinningChange,\n\tonRowClick,\n\tonRowSelectionChange,\n\tonReachEnd,\n\tgetRowCanSelect,\n\tgetRowClassName,\n\trenderHeaderContextMenu,\n\trenderCellContent\n}: TableProps<TData>) {\n\tconst tableData = useMemo(() => data ?? [], [data]);\n\tconst formattingSnapshot = useMemo(() => buildTableFormattingSnapshot(columns), [columns]);\n\tconst resolveRowId = getRowId ?? defaultGetRowId<TData>;\n\tconst rowById = useMemo(() => new Map(tableData.map((row, index) => [resolveRowId(row, index), row])), [resolveRowId, tableData]);\n\tconst availableRowIds = useMemo(() => Array.from(rowById.keys()), [rowById]);\n\tconst scrollableRef = useRef<HTMLDivElement | null>(null);\n\tconst sentinelRef = useRef<HTMLDivElement | null>(null);\n\n\tconst { rowSelection, activateRowSelection } = useTableRowSelection({\n\t\tavailableRowIds,\n\t\trowById,\n\t\tselectionMode,\n\t\tselectedRowIds,\n\t\tonRowSelectionChange\n\t});\n\tconst { columnVisibility: resolvedColumnVisibility, onColumnVisibilityChange: handleColumnVisibilityChange } = useTableColumnVisibility(\n\t\t{\n\t\t\tcolumnVisibility,\n\t\t\tdefaultColumnVisibility,\n\t\t\tonColumnVisibilityChange\n\t\t}\n\t);\n\tconst { columnOrder: resolvedColumnOrder, onColumnOrderChange: handleColumnOrderChange } = useTableColumnOrder({\n\t\tcolumnOrder,\n\t\tdefaultColumnOrder,\n\t\tonColumnOrderChange\n\t});\n\tconst { columnSizing: resolvedColumnSizing, onColumnSizingChange: handleColumnSizingChange } = useTableColumnSizing({\n\t\tcolumnSizing,\n\t\tdefaultColumnSizing,\n\t\tcolumnResizeMinWidth,\n\t\tonColumnSizingChange\n\t});\n\tconst { columnPinning: resolvedColumnPinning, onColumnPinningChange: handleColumnPinningChange } = useTableColumnPinning({\n\t\tcolumnPinning,\n\t\tdefaultColumnPinning,\n\t\tonColumnPinningChange\n\t});\n\tconst baseTableColumnState = useMemo<BaseTableColumnState>(\n\t\t() => ({\n\t\t\tcolumnOrder: resolvedColumnOrder,\n\t\t\tcolumnPinning: resolvedColumnPinning,\n\t\t\tcolumnSizing: resolvedColumnSizing,\n\t\t\tcolumnVisibility: resolvedColumnVisibility\n\t\t}),\n\t\t[resolvedColumnOrder, resolvedColumnPinning, resolvedColumnSizing, resolvedColumnVisibility]\n\t);\n\n\tconst emitReachEnd = useEffectEvent(() => {\n\t\tonReachEnd?.();\n\t});\n\n\tuseEffect(() => {\n\t\tif (!onReachEnd || !scrollableRef.current || !sentinelRef.current || isLoading) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst observer = new IntersectionObserver(\n\t\t\t(entries) => {\n\t\t\t\tconst entry = entries[0];\n\n\t\t\t\tif (entry?.isIntersecting) {\n\t\t\t\t\temitReachEnd();\n\t\t\t\t}\n\t\t\t},\n\t\t\t{\n\t\t\t\troot: scrollableRef.current,\n\t\t\t\tthreshold: 0.1\n\t\t\t}\n\t\t);\n\n\t\tobserver.observe(sentinelRef.current);\n\n\t\treturn () => observer.disconnect();\n\t}, [isLoading, onReachEnd, tableData.length]);\n\n\tconst table = useReactTable<TData>({\n\t\tdata: tableData as TData[],\n\t\tcolumns: columns as TableColumnDef<TData>[],\n\t\tstate: {\n\t\t\tcolumnOrder: resolvedColumnOrder,\n\t\t\tcolumnPinning: resolvedColumnPinning,\n\t\t\tcolumnSizing: resolvedColumnSizing,\n\t\t\tcolumnVisibility: resolvedColumnVisibility,\n\t\t\trowSelection\n\t\t},\n\t\tonColumnOrderChange: handleColumnOrderChange,\n\t\tonColumnPinningChange: handleColumnPinningChange,\n\t\tonColumnSizingChange: handleColumnSizingChange,\n\t\tonColumnVisibilityChange: handleColumnVisibilityChange,\n\t\tgetRowId: (row, index) => resolveRowId(row, index),\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tenableMultiRowSelection: selectionMode === \"multi\",\n\t\tenableRowSelection: (row) => {\n\t\t\tif (selectionMode === \"none\") {\n\t\t\t\treturn false;\n\t\t\t}\n\n\t\t\treturn getRowCanSelect ? getRowCanSelect(row.original) : true;\n\t\t}\n\t});\n\n\tconst visibleLeafColumns = getOrderedVisibleLeafColumns(table, baseTableColumnState);\n\tconst rowModelRows = table.getRowModel().rows;\n\tconst mergedCellLayout = useMemo(\n\t\t() =>\n\t\t\tbuildBaseTableMergedCellsLayout({\n\t\t\t\trows: rowModelRows,\n\t\t\t\tcolumns: visibleLeafColumns\n\t\t\t}),\n\t\t[rowModelRows, visibleLeafColumns]\n\t);\n\tconst leadingColumnId = visibleLeafColumns[0]?.id;\n\n\t/**\n\t * Активирует строку: обновляет выбор в соответствии с режимом и вызывает внешний callback.\n\t */\n\tconst activateRow = (row: Row<TData>) => {\n\t\tactivateRowSelection(row.id, row.getCanSelect());\n\t\tonRowClick?.(row.original);\n\t};\n\n\treturn (\n\t\t<BaseTable\n\t\t\ttable={table}\n\t\t\tcolumnState={baseTableColumnState}\n\t\t\ttitle={title}\n\t\t\tisLoading={isLoading}\n\t\t\tisFetching={isFetching}\n\t\t\tclassName={className}\n\t\t\tminHeight={minHeight}\n\t\t\ttableClassName={tableClassName}\n\t\t\tselectionMode={selectionMode}\n\t\t\tscrollableRef={scrollableRef}\n\t\t\tonActivateRow={selectionMode !== \"none\" || onRowClick ? activateRow : undefined}\n\t\t\tisRowInteractive={(row) => Boolean(onRowClick || (selectionMode !== \"none\" && row.getCanSelect()))}\n\t\t\tgetRowClassName={(row) => getRowClassName?.(row.original)}\n\t\t\tgetCellClassName={({ row, cell }) =>\n\t\t\t\tcell.column.id === leadingColumnId && row.getIsSelected() ? styles.selectedIndicatorCell : undefined\n\t\t\t}\n\t\t\tgetCellLayout={({ cell }) => mergedCellLayout.get(cell.id)}\n\t\t\trenderHeaderContextMenu={renderHeaderContextMenu}\n\t\t\tenableColumnResizing={enableColumnResizing}\n\t\t\tenableColumnReordering={enableColumnReordering}\n\t\t\tcolumnResizeMinWidth={columnResizeMinWidth}\n\t\t\trenderCellContent={(args) => {\n\t\t\t\tconst displayValue = formatPipelineDisplayValue({\n\t\t\t\t\tfield: formattingSnapshot.runtimeByColumnId[args.cell.column.id],\n\t\t\t\t\trawValue: args.cell.getValue(),\n\t\t\t\t\trowData: args.row.original as TableFormulaRowData,\n\t\t\t\t\trowKind: \"plain\"\n\t\t\t\t});\n\t\t\t\tconst defaultContent = !shouldUseTableFormatting({\n\t\t\t\t\tcolumnId: args.cell.column.id,\n\t\t\t\t\truntimeByColumnId: formattingSnapshot.runtimeByColumnId,\n\t\t\t\t\tcustomCellColumnIds: formattingSnapshot.customCellColumnIds\n\t\t\t\t}) ? (\n\t\t\t\t\targs.defaultContent\n\t\t\t\t) : (\n\t\t\t\t\t<FormattedTableCell displayValue={displayValue} align={args.columnMeta?.align} />\n\t\t\t\t);\n\n\t\t\t\tif (renderCellContent) {\n\t\t\t\t\treturn renderCellContent({\n\t\t\t\t\t\t...args,\n\t\t\t\t\t\tdefaultContent,\n\t\t\t\t\t\tdisplayValue\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\treturn defaultContent;\n\t\t\t}}\n\t\t\tafterTableContent={onReachEnd ? <div ref={sentinelRef} className={styles.sentinel} aria-hidden=\"true\" /> : null}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}
|