@apple-pie/slice 0.0.5 → 0.0.7
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/cjs/chunks/Avatar-0EXaRG4e.js +54 -0
- package/dist/cjs/chunks/AvatarGroup-BsRUAZl0.js +37 -0
- package/dist/cjs/chunks/Badge-Bv6c2YVC.js +23 -0
- package/dist/cjs/chunks/Button-DFAWHJmQ.js +246 -0
- package/dist/cjs/chunks/ButtonBar-DOgYDAda.js +53 -0
- package/dist/cjs/chunks/Card-BPClSuHa.js +37 -0
- package/dist/cjs/chunks/CheckBox-tsExpwtr.js +56 -0
- package/dist/cjs/chunks/Chip-CPHF1zn-.js +84 -0
- package/dist/cjs/chunks/DivInput-DDQVtlot.js +102 -0
- package/dist/cjs/chunks/DocIcons-B5TcBqSH.js +108 -0
- package/dist/cjs/chunks/Dot-BSSClfHQ.js +73 -0
- package/dist/cjs/chunks/DrggablePanel-wWLPesc8.js +202 -0
- package/dist/cjs/chunks/DropDown-COdCr77A.js +102 -0
- package/dist/cjs/chunks/ErrorSummary-CIUqlSLC.js +60 -0
- package/dist/cjs/chunks/FileIcon-DTQaXxfC.js +221 -0
- package/dist/cjs/chunks/FileList-J2EgJyCo.js +217 -0
- package/dist/cjs/chunks/FlexDiv-CW5gSa4V.js +65 -0
- package/dist/cjs/chunks/Grouper-QwwunKen.js +61 -0
- package/dist/cjs/chunks/IconButton-B53y3z1_.js +77 -0
- package/dist/cjs/chunks/Label-DoiS07-y.js +111 -0
- package/dist/cjs/chunks/Logos-CAHU-eIP.js +483 -0
- package/dist/cjs/chunks/Overlay-Bb2YoSKr.js +36 -0
- package/dist/cjs/chunks/Pager-CN2z8M9E.js +37 -0
- package/dist/cjs/chunks/ProgressIndicator-BbrZ7Aoc.js +157 -0
- package/dist/cjs/chunks/PromptInput-BXDqUXFQ.js +150 -0
- package/dist/cjs/chunks/RadioButton-GKRhZEmb.js +56 -0
- package/dist/cjs/chunks/RadioButtonList-CFpZmyAX.js +59 -0
- package/dist/cjs/chunks/Slider-CZvCAodl.js +136 -0
- package/dist/cjs/chunks/Spacer-CtxV2Pww.js +18 -0
- package/dist/cjs/chunks/Switch-C94aofxQ.js +37 -0
- package/dist/cjs/chunks/TabBar-D6akzNUf.js +123 -0
- package/dist/cjs/chunks/TextArea-DjF8Koup.js +82 -0
- package/dist/cjs/chunks/TextField-Cg6mQcYl.js +204 -0
- package/dist/cjs/chunks/Tip-CjMHa-fD.js +88 -0
- package/dist/cjs/chunks/Toast-Cdyh6T-l.js +163 -0
- package/dist/cjs/chunks/UploadArea-BmZ50EEl.js +123 -0
- package/dist/cjs/chunks/_types-B5xXv4NA.js +1386 -0
- package/dist/cjs/chunks/sharedTypes-gCECyn2N.js +6 -0
- package/dist/cjs/chunks/style-inject.es-CMuL-BfJ.js +11 -0
- package/dist/cjs/chunks/tipStore-Ck4NLvml.js +17 -0
- package/dist/cjs/chunks/toastStore-CSStgB9d.js +17 -0
- package/dist/cjs/chunks/tslib.es6-C8dZW5nY.js +49 -0
- package/dist/cjs/chunks/uploads-worker-mD8pcsGP.js +221 -0
- package/dist/cjs/chunks/uploadsStore-CxWIctvI.js +75 -0
- package/dist/cjs/chunks/utils-BsBHecUI.js +70 -0
- package/dist/cjs/chunks/windowStore-RaJswiHM.js +70 -0
- package/dist/cjs/hooks/useDoubleClick.js +11 -23
- package/dist/cjs/hooks/useKeyboardShortcuts.js +18 -35
- package/dist/cjs/hooks/useLastUpdated.js +20 -42
- package/dist/cjs/hooks/useLocalStore.js +23 -39
- package/dist/cjs/hooks/useObserveResize.js +26 -44
- package/dist/cjs/hooks/useObserveTheme.js +18 -36
- package/dist/cjs/hooks/useTheme.js +17 -40
- package/dist/cjs/hooks/useToolTip.js +19 -32
- package/dist/cjs/hooks/useTrackRenders.js +11 -29
- package/dist/cjs/hooks/useWindow.js +29 -65
- package/dist/cjs/hooks.js +12 -30
- package/dist/cjs/index.js +47 -127
- package/dist/cjs/providers/ThemeProvider.js +27 -45
- package/dist/cjs/providers.js +5 -12
- package/dist/cjs/stores/tip.js +4 -9
- package/dist/cjs/stores/toast.js +4 -9
- package/dist/cjs/stores/uploads.js +11 -0
- package/dist/cjs/stores/window.js +8 -10
- package/dist/cjs/stores.js +18 -21
- package/dist/cjs/theme/colors.js +371 -379
- package/dist/cjs/theme/corners.js +10 -12
- package/dist/cjs/theme/elevations.js +10 -13
- package/dist/cjs/theme/themes.js +8 -13
- package/dist/cjs/theme/type.js +225 -384
- package/dist/cjs/theme.js +5 -13
- package/dist/cjs/uikit/Avatar/index.js +6 -0
- package/dist/cjs/uikit/AvatarGroup/index.js +7 -0
- package/dist/cjs/uikit/Badge/index.js +6 -0
- package/dist/cjs/uikit/Button/index.js +12 -0
- package/dist/cjs/uikit/ButtonBar/index.js +12 -0
- package/dist/cjs/uikit/Card/index.js +10 -0
- package/dist/cjs/uikit/CheckBox/index.js +10 -0
- package/dist/cjs/uikit/Chip/index.js +11 -0
- package/dist/cjs/uikit/DivInput/index.js +7 -0
- package/dist/cjs/uikit/DocIcon/index.js +9 -0
- package/dist/cjs/uikit/Dot/index.js +6 -0
- package/dist/cjs/uikit/DraggablePanel/index.js +10 -0
- package/dist/cjs/uikit/DropDown/index.js +10 -0
- package/dist/cjs/uikit/ErrorSummary/index.js +6 -0
- package/dist/cjs/uikit/FileIcon/index.js +15 -0
- package/dist/cjs/uikit/FileList/index.js +11 -0
- package/dist/cjs/uikit/FlexDiv/index.js +6 -0
- package/dist/cjs/uikit/Grouper/index.js +11 -0
- package/dist/cjs/uikit/Icon/index.js +14 -0
- package/dist/cjs/uikit/IconButton/index.js +12 -0
- package/dist/cjs/uikit/Label/index.js +10 -0
- package/dist/cjs/uikit/Logos/index.js +9 -0
- package/dist/cjs/uikit/Overlay/index.js +6 -0
- package/dist/cjs/uikit/Pager/index.js +7 -0
- package/dist/cjs/uikit/Progress/index.js +10 -0
- package/dist/cjs/uikit/PromptInput/index.js +14 -0
- package/dist/cjs/uikit/RadioButton/index.js +12 -0
- package/dist/cjs/uikit/RadioButtonList/index.js +13 -0
- package/dist/cjs/uikit/Slider/index.js +7 -0
- package/dist/cjs/uikit/Spacer/index.js +6 -0
- package/dist/cjs/uikit/Switch/index.js +6 -0
- package/dist/cjs/uikit/TabBar/index.js +12 -0
- package/dist/cjs/uikit/TextArea/index.js +13 -0
- package/dist/cjs/uikit/Textfield/index.js +13 -0
- package/dist/cjs/uikit/Tip/index.js +7 -0
- package/dist/cjs/uikit/Toast/index.js +16 -0
- package/dist/cjs/uikit/UploadArea/index.js +15 -0
- package/dist/cjs/workers/uploads/uploads.js +5 -0
- package/dist/esm/chunks/Avatar-D_W5zErj.mjs +60 -0
- package/dist/esm/chunks/AvatarGroup-Dbfmz0Yz.mjs +45 -0
- package/dist/esm/chunks/Badge-BISGWj5-.mjs +29 -0
- package/dist/esm/chunks/Button-B_aIY6wE.mjs +264 -0
- package/dist/esm/chunks/ButtonBar-Cr6TFvvD.mjs +66 -0
- package/dist/esm/chunks/Card-BzKBF0ny.mjs +45 -0
- package/dist/esm/chunks/CheckBox-CYggPKaT.mjs +68 -0
- package/dist/esm/chunks/Chip-B3wb9g1U.mjs +96 -0
- package/dist/esm/chunks/DivInput-_VL6PAqT.mjs +114 -0
- package/dist/esm/chunks/DocIcons-BxtcXsWI.mjs +114 -0
- package/dist/esm/chunks/Dot-C-Xu24wF.mjs +81 -0
- package/dist/esm/chunks/DrggablePanel-Bg3UKK1k.mjs +214 -0
- package/dist/esm/chunks/DropDown-D7KyGLkM.mjs +114 -0
- package/dist/esm/chunks/ErrorSummary-CZw06dSh.mjs +68 -0
- package/dist/esm/chunks/FileIcon-BcIJzIwA.mjs +233 -0
- package/dist/esm/chunks/FileList-DUzgHfE-.mjs +229 -0
- package/dist/esm/chunks/FlexDiv-BLYDgWu2.mjs +73 -0
- package/dist/esm/chunks/Grouper-CRldBHSw.mjs +75 -0
- package/dist/esm/chunks/IconButton-BBiZrXlS.mjs +93 -0
- package/dist/esm/chunks/Label-DPIAVkn1.mjs +124 -0
- package/dist/esm/chunks/Logos-CpcaarOG.mjs +493 -0
- package/dist/esm/chunks/Overlay-Bh0enFIe.mjs +44 -0
- package/dist/esm/chunks/Pager-B-1ZRUzU.mjs +45 -0
- package/dist/esm/chunks/ProgressIndicator-CNOBQ_Fv.mjs +167 -0
- package/dist/esm/chunks/PromptInput-DdsIgZ3T.mjs +160 -0
- package/dist/esm/chunks/RadioButton-D-TdQu3a.mjs +66 -0
- package/dist/esm/chunks/RadioButtonList-CEScWkbT.mjs +67 -0
- package/dist/esm/chunks/Slider-C3A8GCfH.mjs +142 -0
- package/dist/esm/chunks/Spacer-BlgEdKEM.mjs +20 -0
- package/dist/esm/chunks/Switch-obpmvCGd.mjs +45 -0
- package/dist/esm/chunks/TabBar-DFj021UP.mjs +141 -0
- package/dist/esm/chunks/TextArea-D_hq6VF3.mjs +90 -0
- package/dist/esm/chunks/TextField-Co0u-xdd.mjs +222 -0
- package/dist/esm/chunks/Tip-CHQh-Yq0.mjs +98 -0
- package/dist/esm/chunks/Toast-BiXzVFtM.mjs +179 -0
- package/dist/esm/chunks/UploadArea-B9685Z06.mjs +133 -0
- package/dist/esm/chunks/_types-KZDzhaiK.mjs +1395 -0
- package/dist/esm/chunks/sharedTypes-tn9-uJvb.mjs +8 -0
- package/dist/esm/chunks/style-inject.es-D0BjEaN8.mjs +11 -0
- package/dist/esm/chunks/tipStore-CL5a95Bl.mjs +15 -0
- package/dist/esm/chunks/toastStore-D2PEIqCo.mjs +15 -0
- package/dist/esm/chunks/tslib.es6-c-7TIv71.mjs +53 -0
- package/dist/esm/chunks/uploads-worker-Dv-4zGnC.mjs +224 -0
- package/dist/esm/chunks/uploadsStore-D69fEXMY.mjs +72 -0
- package/dist/esm/chunks/utils-BQ1v7VE4.mjs +74 -0
- package/dist/esm/chunks/windowStore-CwW0i_le.mjs +71 -0
- package/dist/esm/hooks/useDoubleClick.mjs +14 -0
- package/dist/esm/hooks/useKeyboardShortcuts.mjs +27 -0
- package/dist/esm/hooks/useLastUpdated.mjs +31 -0
- package/dist/esm/hooks/useLocalStore.mjs +36 -0
- package/dist/esm/hooks/useObserveResize.mjs +38 -0
- package/dist/esm/hooks/useObserveTheme.mjs +34 -0
- package/dist/esm/hooks/useTheme.mjs +73 -0
- package/dist/esm/hooks/useToolTip.mjs +23 -0
- package/dist/esm/hooks/useTrackRenders.mjs +23 -0
- package/dist/esm/hooks/useWindow.mjs +52 -0
- package/dist/esm/hooks.mjs +29 -0
- package/dist/esm/index.mjs +117 -0
- package/dist/esm/providers/ThemeProvider.mjs +49 -0
- package/dist/esm/providers.mjs +15 -0
- package/dist/esm/stores/tip.mjs +3 -0
- package/dist/esm/stores/toast.mjs +3 -0
- package/dist/esm/stores/uploads.mjs +7 -0
- package/dist/esm/stores/window.mjs +3 -0
- package/dist/esm/stores.mjs +13 -0
- package/dist/esm/theme/colors.mjs +373 -0
- package/dist/esm/theme/corners.mjs +12 -0
- package/dist/esm/theme/elevations.mjs +15 -0
- package/dist/esm/theme/themes.mjs +25 -0
- package/dist/esm/theme/type.mjs +236 -0
- package/dist/esm/theme.mjs +9 -0
- package/dist/esm/uikit/Avatar/index.mjs +9 -0
- package/dist/esm/uikit/AvatarGroup/index.mjs +11 -0
- package/dist/esm/uikit/Badge/index.mjs +9 -0
- package/dist/esm/uikit/Button/index.mjs +39 -0
- package/dist/esm/uikit/ButtonBar/index.mjs +39 -0
- package/dist/esm/uikit/Card/index.mjs +29 -0
- package/dist/esm/uikit/CheckBox/index.mjs +31 -0
- package/dist/esm/uikit/Chip/index.mjs +31 -0
- package/dist/esm/uikit/DivInput/index.mjs +13 -0
- package/dist/esm/uikit/DocIcon/index.mjs +23 -0
- package/dist/esm/uikit/Dot/index.mjs +11 -0
- package/dist/esm/uikit/DraggablePanel/index.mjs +29 -0
- package/dist/esm/uikit/DropDown/index.mjs +29 -0
- package/dist/esm/uikit/ErrorSummary/index.mjs +11 -0
- package/dist/esm/uikit/FileIcon/index.mjs +25 -0
- package/dist/esm/uikit/FileList/index.mjs +35 -0
- package/dist/esm/uikit/FlexDiv/index.mjs +11 -0
- package/dist/esm/uikit/Grouper/index.mjs +33 -0
- package/dist/esm/uikit/Icon/index.mjs +25 -0
- package/dist/esm/uikit/IconButton/index.mjs +37 -0
- package/dist/esm/uikit/Label/index.mjs +27 -0
- package/dist/esm/uikit/Logos/index.mjs +23 -0
- package/dist/esm/uikit/Overlay/index.mjs +11 -0
- package/dist/esm/uikit/Pager/index.mjs +11 -0
- package/dist/esm/uikit/Progress/index.mjs +27 -0
- package/dist/esm/uikit/PromptInput/index.mjs +45 -0
- package/dist/esm/uikit/RadioButton/index.mjs +39 -0
- package/dist/esm/uikit/RadioButtonList/index.mjs +41 -0
- package/dist/esm/uikit/Slider/index.mjs +13 -0
- package/dist/esm/uikit/Spacer/index.mjs +7 -0
- package/dist/esm/uikit/Switch/index.mjs +11 -0
- package/dist/esm/uikit/TabBar/index.mjs +39 -0
- package/dist/esm/uikit/TextArea/index.mjs +41 -0
- package/dist/esm/uikit/Textfield/index.mjs +43 -0
- package/dist/esm/uikit/Tip/index.mjs +13 -0
- package/dist/esm/uikit/Toast/index.mjs +31 -0
- package/dist/esm/uikit/UploadArea/index.mjs +37 -0
- package/dist/esm/workers/uploads/uploads.mjs +5 -0
- package/dist/types/index.d.ts +3 -0
- package/dist/types/stores/index.d.ts +1 -0
- package/dist/types/stores/uploads/_types.d.ts +16 -0
- package/dist/types/stores/uploads/index.d.ts +2 -0
- package/dist/types/stores/uploads/uploadsStore.d.ts +22 -0
- package/dist/types/uikit/FileList/_types.d.ts +1 -0
- package/dist/types/uikit/UploadArea/UploadArea.d.ts +54 -0
- package/dist/types/uikit/UploadArea/_types.d.ts +46 -0
- package/dist/types/uikit/UploadArea/index.d.ts +3 -0
- package/dist/types/util/utils.d.ts +4 -0
- package/dist/types/workers/uploads/uploads-worker.d.ts +129 -0
- package/dist/types/workers/uploads/uploads.d.ts +1 -0
- package/dist/types/workers/uploads/uploads.runtime.d.ts +1 -0
- package/package.json +23 -17
- package/dist/cjs/chunks/Avatar-z2YcOAoP.js +0 -68
- package/dist/cjs/chunks/AvatarGroup-Cz8369zI.js +0 -39
- package/dist/cjs/chunks/Badge-COSg__VJ.js +0 -41
- package/dist/cjs/chunks/Button-BNXqiA13.js +0 -312
- package/dist/cjs/chunks/ButtonBar-CeDdAOlH.js +0 -58
- package/dist/cjs/chunks/Card-Cc_c-S7i.js +0 -36
- package/dist/cjs/chunks/CheckBox-hTWIPqV_.js +0 -76
- package/dist/cjs/chunks/Chip-CLKVldi4.js +0 -93
- package/dist/cjs/chunks/DivInput-DnY2emt-.js +0 -204
- package/dist/cjs/chunks/DocIcons-BRWOzK96.js +0 -41
- package/dist/cjs/chunks/Dot-B5dO8kSS.js +0 -80
- package/dist/cjs/chunks/DrggablePanel-BtsURL9o.js +0 -302
- package/dist/cjs/chunks/DropDown-COr9u96t.js +0 -154
- package/dist/cjs/chunks/ErrorSummary-BrSHbGpk.js +0 -42
- package/dist/cjs/chunks/FileIcon-CEMQK_Je.js +0 -132
- package/dist/cjs/chunks/FileList-DWIm4o46.js +0 -163
- package/dist/cjs/chunks/FlexDiv-BHl29ywz.js +0 -103
- package/dist/cjs/chunks/Grouper-EyHoeA8w.js +0 -50
- package/dist/cjs/chunks/IconButton-9QZ4eKBZ.js +0 -84
- package/dist/cjs/chunks/Label-DZJ_YDtD.js +0 -134
- package/dist/cjs/chunks/Logos-DSlAUz8l.js +0 -119
- package/dist/cjs/chunks/Overlay-DV3C5NDO.js +0 -45
- package/dist/cjs/chunks/Pager-CRjpl1FZ.js +0 -42
- package/dist/cjs/chunks/ProgressIndicator-BAwAaw58.js +0 -121
- package/dist/cjs/chunks/PromptInput-DmO8a3oX.js +0 -212
- package/dist/cjs/chunks/RadioButton-DA9YUGEF.js +0 -65
- package/dist/cjs/chunks/RadioButtonList-BtsT7GJc.js +0 -116
- package/dist/cjs/chunks/Slider-CqrIwn-L.js +0 -285
- package/dist/cjs/chunks/Spacer-BEY2-_PB.js +0 -16
- package/dist/cjs/chunks/Switch-CtkFtogd.js +0 -43
- package/dist/cjs/chunks/TabBar-WsNlr-aZ.js +0 -176
- package/dist/cjs/chunks/TextArea-BMJWUH2H.js +0 -153
- package/dist/cjs/chunks/TextField-mfwz79cD.js +0 -248
- package/dist/cjs/chunks/Tip-Af6FMEDi.js +0 -91
- package/dist/cjs/chunks/Toast-CxAEOW4z.js +0 -158
- package/dist/cjs/chunks/_types-BNlHsGMQ.js +0 -714
- package/dist/cjs/chunks/sharedTypes-BvTjh6M5.js +0 -9
- package/dist/cjs/chunks/style-inject.es-XZHJH68X.js +0 -30
- package/dist/cjs/chunks/tipStore-C9oV9SIh.js +0 -23
- package/dist/cjs/chunks/toastStore-C-ETP9H6.js +0 -23
- package/dist/cjs/chunks/tslib.es6-4H29ixHs.js +0 -48
- package/dist/cjs/chunks/utils-BwNacfBU.js +0 -128
- package/dist/cjs/chunks/windowStore-CPcVHJq6.js +0 -93
- package/dist/cjs/uikit/Avatar.js +0 -11
- package/dist/cjs/uikit/AvatarGroup.js +0 -12
- package/dist/cjs/uikit/Badge.js +0 -11
- package/dist/cjs/uikit/Button.js +0 -26
- package/dist/cjs/uikit/ButtonBar.js +0 -26
- package/dist/cjs/uikit/Card.js +0 -21
- package/dist/cjs/uikit/CheckBox.js +0 -22
- package/dist/cjs/uikit/Chip.js +0 -22
- package/dist/cjs/uikit/DivInput.js +0 -13
- package/dist/cjs/uikit/DocIcon.js +0 -18
- package/dist/cjs/uikit/Dot.js +0 -12
- package/dist/cjs/uikit/DraggablePanel.js +0 -21
- package/dist/cjs/uikit/DropDown.js +0 -21
- package/dist/cjs/uikit/ErrorSummary.js +0 -12
- package/dist/cjs/uikit/FileIcon.js +0 -23
- package/dist/cjs/uikit/FileList.js +0 -24
- package/dist/cjs/uikit/FlexDiv.js +0 -12
- package/dist/cjs/uikit/Grouper.js +0 -23
- package/dist/cjs/uikit/Icon.js +0 -23
- package/dist/cjs/uikit/IconButton.js +0 -25
- package/dist/cjs/uikit/Label.js +0 -20
- package/dist/cjs/uikit/Logos.js +0 -18
- package/dist/cjs/uikit/Overlay.js +0 -12
- package/dist/cjs/uikit/Pager.js +0 -12
- package/dist/cjs/uikit/Progress.js +0 -21
- package/dist/cjs/uikit/PromptInput.js +0 -29
- package/dist/cjs/uikit/RadioButton.js +0 -26
- package/dist/cjs/uikit/RadioButtonList.js +0 -27
- package/dist/cjs/uikit/Slider.js +0 -13
- package/dist/cjs/uikit/Spacer.js +0 -10
- package/dist/cjs/uikit/Switch.js +0 -12
- package/dist/cjs/uikit/TabBar.js +0 -26
- package/dist/cjs/uikit/TextArea.js +0 -27
- package/dist/cjs/uikit/Textfield.js +0 -28
- package/dist/cjs/uikit/Tip.js +0 -13
- package/dist/cjs/uikit/Toast.js +0 -26
- package/dist/esm/chunks/Avatar-BtkvMV1v.js +0 -66
- package/dist/esm/chunks/AvatarGroup-pbqdS56o.js +0 -37
- package/dist/esm/chunks/Badge-DtxDLSO0.js +0 -39
- package/dist/esm/chunks/Button-BUJkJqdO.js +0 -310
- package/dist/esm/chunks/ButtonBar-Bl0oCxd8.js +0 -56
- package/dist/esm/chunks/Card-Bjk0kgQh.js +0 -34
- package/dist/esm/chunks/CheckBox-CvkZuSeB.js +0 -74
- package/dist/esm/chunks/Chip-o-YG_HAf.js +0 -91
- package/dist/esm/chunks/DivInput-D6ORPrkT.js +0 -202
- package/dist/esm/chunks/DocIcons-CbOX4n8Y.js +0 -39
- package/dist/esm/chunks/Dot-BZcEZbnm.js +0 -78
- package/dist/esm/chunks/DrggablePanel-DWrTjXvf.js +0 -300
- package/dist/esm/chunks/DropDown-BDIvYWI-.js +0 -152
- package/dist/esm/chunks/ErrorSummary-DzDnacH0.js +0 -40
- package/dist/esm/chunks/FileIcon-Cxh-QsYb.js +0 -130
- package/dist/esm/chunks/FileList-yo_u1Kvw.js +0 -161
- package/dist/esm/chunks/FlexDiv-CFyndG99.js +0 -101
- package/dist/esm/chunks/Grouper-NJbpaaQG.js +0 -48
- package/dist/esm/chunks/IconButton-3m9ugITV.js +0 -82
- package/dist/esm/chunks/Label-CgntsR3g.js +0 -132
- package/dist/esm/chunks/Logos-DwZP-TR2.js +0 -117
- package/dist/esm/chunks/Overlay-BolsHW9S.js +0 -43
- package/dist/esm/chunks/Pager-BHLyXq9p.js +0 -40
- package/dist/esm/chunks/ProgressIndicator-uI9BZwBB.js +0 -118
- package/dist/esm/chunks/PromptInput-C_qj6kGp.js +0 -210
- package/dist/esm/chunks/RadioButton-D8otD_Jj.js +0 -63
- package/dist/esm/chunks/RadioButtonList-CtX1j7rO.js +0 -114
- package/dist/esm/chunks/Slider-O6UelMjh.js +0 -283
- package/dist/esm/chunks/Spacer-DbZSG5x3.js +0 -14
- package/dist/esm/chunks/Switch-DjfrSiQz.js +0 -41
- package/dist/esm/chunks/TabBar-C0NgwRa2.js +0 -174
- package/dist/esm/chunks/TextArea-DK0giDGR.js +0 -151
- package/dist/esm/chunks/TextField-CQ4XYYNm.js +0 -246
- package/dist/esm/chunks/Tip-iFECDhwN.js +0 -89
- package/dist/esm/chunks/Toast-ZxMZtbd0.js +0 -156
- package/dist/esm/chunks/_types-RJ7q8S0B.js +0 -712
- package/dist/esm/chunks/sharedTypes-BfZzG1KX.js +0 -9
- package/dist/esm/chunks/style-inject.es-tgCJW-Cu.js +0 -28
- package/dist/esm/chunks/tipStore-nBYJ6tmE.js +0 -17
- package/dist/esm/chunks/toastStore-r3pvNa28.js +0 -17
- package/dist/esm/chunks/tslib.es6-0pkUdtrF.js +0 -45
- package/dist/esm/chunks/utils-CZ1LWeN6.js +0 -121
- package/dist/esm/chunks/windowStore-Cu4W4zJM.js +0 -91
- package/dist/esm/hooks/useDoubleClick.js +0 -24
- package/dist/esm/hooks/useKeyboardShortcuts.js +0 -42
- package/dist/esm/hooks/useLastUpdated.js +0 -51
- package/dist/esm/hooks/useLocalStore.js +0 -50
- package/dist/esm/hooks/useObserveResize.js +0 -54
- package/dist/esm/hooks/useObserveTheme.js +0 -41
- package/dist/esm/hooks/useTheme.js +0 -84
- package/dist/esm/hooks/useToolTip.js +0 -34
- package/dist/esm/hooks/useTrackRenders.js +0 -37
- package/dist/esm/hooks/useWindow.js +0 -84
- package/dist/esm/hooks.js +0 -15
- package/dist/esm/index.js +0 -58
- package/dist/esm/providers/ThemeProvider.js +0 -56
- package/dist/esm/providers.js +0 -8
- package/dist/esm/stores/tip.js +0 -2
- package/dist/esm/stores/toast.js +0 -2
- package/dist/esm/stores/window.js +0 -2
- package/dist/esm/stores.js +0 -4
- package/dist/esm/theme/colors.js +0 -377
- package/dist/esm/theme/corners.js +0 -12
- package/dist/esm/theme/elevations.js +0 -15
- package/dist/esm/theme/themes.js +0 -23
- package/dist/esm/theme/type.js +0 -393
- package/dist/esm/theme.js +0 -5
- package/dist/esm/uikit/Avatar.js +0 -5
- package/dist/esm/uikit/AvatarGroup.js +0 -6
- package/dist/esm/uikit/Badge.js +0 -5
- package/dist/esm/uikit/Button.js +0 -20
- package/dist/esm/uikit/ButtonBar.js +0 -20
- package/dist/esm/uikit/Card.js +0 -15
- package/dist/esm/uikit/CheckBox.js +0 -16
- package/dist/esm/uikit/Chip.js +0 -16
- package/dist/esm/uikit/DivInput.js +0 -7
- package/dist/esm/uikit/DocIcon.js +0 -12
- package/dist/esm/uikit/Dot.js +0 -6
- package/dist/esm/uikit/DraggablePanel.js +0 -15
- package/dist/esm/uikit/DropDown.js +0 -15
- package/dist/esm/uikit/ErrorSummary.js +0 -6
- package/dist/esm/uikit/FileIcon.js +0 -13
- package/dist/esm/uikit/FileList.js +0 -18
- package/dist/esm/uikit/FlexDiv.js +0 -6
- package/dist/esm/uikit/Grouper.js +0 -17
- package/dist/esm/uikit/Icon.js +0 -13
- package/dist/esm/uikit/IconButton.js +0 -19
- package/dist/esm/uikit/Label.js +0 -14
- package/dist/esm/uikit/Logos.js +0 -12
- package/dist/esm/uikit/Overlay.js +0 -6
- package/dist/esm/uikit/Pager.js +0 -6
- package/dist/esm/uikit/Progress.js +0 -14
- package/dist/esm/uikit/PromptInput.js +0 -23
- package/dist/esm/uikit/RadioButton.js +0 -20
- package/dist/esm/uikit/RadioButtonList.js +0 -21
- package/dist/esm/uikit/Slider.js +0 -7
- package/dist/esm/uikit/Spacer.js +0 -4
- package/dist/esm/uikit/Switch.js +0 -6
- package/dist/esm/uikit/TabBar.js +0 -20
- package/dist/esm/uikit/TextArea.js +0 -21
- package/dist/esm/uikit/Textfield.js +0 -22
- package/dist/esm/uikit/Tip.js +0 -7
- package/dist/esm/uikit/Toast.js +0 -16
|
@@ -1,202 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { motion } from 'motion/react';
|
|
4
|
-
import React, { useRef, useState, useCallback, useEffect, useMemo } from 'react';
|
|
5
|
-
import { c as cleanString } from './utils-CZ1LWeN6.js';
|
|
6
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
7
|
-
|
|
8
|
-
var css_248z = ".type-module_body-xs-regular__QWEzl {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-medium__FxEAv {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-xs-bold__rf7AV {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xs);\n\tline-height: 133.33%;\n\ttext-decoration: none;\n\tletter-spacing: 0.25px;\n}.type-module_body-s-regular__8-FO- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-medium__qyYq- {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-s-bold__7GQ5Z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-s);\n\tline-height: 142.86%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-m-regular__Qtp5G {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-medium__Ieh9K {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-m-bold__0lZ3I {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-m);\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_body-l-regular__Ar4d3 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-medium__6tV1n {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-l-bold__I8Q1v {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-l);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_body-xl-regular__zDf-z {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-regular);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-medium__R5GpK {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-medium);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.1px;\n}.type-module_body-xl-bold__SI-hC {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: var(--font-weight-bold);\n\tfont-size: var(--font-size-xl);\n\tline-height: 162.5%;\n\ttext-decoration: none;\n\tletter-spacing: 0.15px;\n}.type-module_heading-s-medium__jGIb2 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-s-bold__QFgN8 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 20px;\n\tline-height: 140%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-bold__tdBSi {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-m-medium__-7Uyu {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 24px;\n\tline-height: 116.67%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-medium__8hGYF {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-l-bold__Cryjg {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 30px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-medium__PUi44 {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 500;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}.type-module_heading-xl-bold__1B6fk {\n\tfont-family: var(--font-family), sans-serif;\n\tfont-weight: 600;\n\tfont-size: 36px;\n\tline-height: 128.57%;\n\ttext-decoration: none;\n\tletter-spacing: 0.2px;\n}\n\n.DivInput-module_wrapper__gljOU {\n\tpadding: var(--div-input-padding);\n\twidth: var(--div-input-width);\n\tborder-radius: var(--div-input-border-radius);\n\tbackground: var(--div-input-wrapper-bg);\n\t&:hover {\n\t\tbackground: var(--div-input-bg);\n\t}\n}\n\n.DivInput-module_input__R8myv {\n\tcolor: var(--div-input-color);\n\tuser-select: var(--div-input-user-select);\n\t-webkit-user-select: var(--div-input-user-select);\n\ttext-align: var(--div-input-text-align);\n\tpointer-events: all;\n\tbackground: transparent;\n\tborder-radius: 4px;\n\tborder: 0;\n\toutline: none;\n\ttext-overflow: ellipsis;\n\tdisplay: -webkit-box;\n\toverflow: hidden;\n\twhite-space: var(--div-input-white-space);\n\t-webkit-line-clamp: var(--div-input-line-clamp);\n\t-webkit-box-orient: vertical;\n\tcursor: var(--div-input-cursor);\n\ttransition: background 0.2s ease-in-out 0s;\n}\n";
|
|
9
|
-
var css = {"wrapper":"DivInput-module_wrapper__gljOU","input":"DivInput-module_input__R8myv type-module_body-m-regular__Qtp5G"};
|
|
10
|
-
styleInject(css_248z);
|
|
11
|
-
|
|
12
|
-
const DivInput = React.memo((props) => {
|
|
13
|
-
const { value = '', name = 'Input Field', placeholder = 'Placeholder', isEditable = true, wrap = false, focus = false, width = 'auto', textAlign = 'left', clamp = 3, padding = '0px', onChange = () => null, onSubmit = () => null, onFocus = () => null, onBlur = () => null, onDblClick = () => null, onClick = () => null, radius = 4, bgColor = 'var(--core-surface-secondary)' } = props, divAttributes = __rest(props, ["value", "name", "placeholder", "isEditable", "wrap", "focus", "width", "textAlign", "clamp", "padding", "onChange", "onSubmit", "onFocus", "onBlur", "onDblClick", "onClick", "radius", "bgColor"]);
|
|
14
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
15
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
16
|
-
const divClass = className ? ` ${className}` : '';
|
|
17
|
-
const ref = useRef(null);
|
|
18
|
-
const innerText = useRef(value === '' ? cleanString(placeholder) : cleanString(value));
|
|
19
|
-
const [isFocused, setIsFocused] = useState(focus);
|
|
20
|
-
const [text, setText] = useState(innerText.current);
|
|
21
|
-
const [isPlaceholder, setIsPlaceholder] = useState(false);
|
|
22
|
-
// Memoize setCursor function
|
|
23
|
-
const setCursor = useCallback((to, length = 1) => {
|
|
24
|
-
if (ref.current) {
|
|
25
|
-
const range = document.createRange();
|
|
26
|
-
range.setStart(ref.current, to === 'start' ? 0 : length);
|
|
27
|
-
range.setEnd(ref.current, to === 'start' ? 0 : 1);
|
|
28
|
-
const selection = globalThis.getSelection();
|
|
29
|
-
selection === null || selection === void 0 ? void 0 : selection.removeAllRanges();
|
|
30
|
-
selection === null || selection === void 0 ? void 0 : selection.addRange(range);
|
|
31
|
-
}
|
|
32
|
-
}, []);
|
|
33
|
-
// Memoize handleSelectAll
|
|
34
|
-
const handleSelectAll = useCallback(() => {
|
|
35
|
-
var _a, _b, _c;
|
|
36
|
-
if (!((_a = ref.current) === null || _a === void 0 ? void 0 : _a.firstChild))
|
|
37
|
-
return;
|
|
38
|
-
const range = document.createRange();
|
|
39
|
-
range.selectNode(ref.current.firstChild);
|
|
40
|
-
(_b = globalThis.getSelection()) === null || _b === void 0 ? void 0 : _b.removeAllRanges();
|
|
41
|
-
(_c = globalThis.getSelection()) === null || _c === void 0 ? void 0 : _c.addRange(range);
|
|
42
|
-
}, []);
|
|
43
|
-
// Combined effect for related state updates
|
|
44
|
-
useEffect(() => {
|
|
45
|
-
if (!ref.current)
|
|
46
|
-
return;
|
|
47
|
-
// Set contentEditable
|
|
48
|
-
ref.current.contentEditable = isEditable ? 'true' : 'false';
|
|
49
|
-
// Handle focus
|
|
50
|
-
if (focus) {
|
|
51
|
-
handleSelectAll();
|
|
52
|
-
ref.current.focus();
|
|
53
|
-
}
|
|
54
|
-
setIsFocused(focus);
|
|
55
|
-
// Update text
|
|
56
|
-
const newText = value === '' ? cleanString(placeholder) : cleanString(value);
|
|
57
|
-
innerText.current = newText;
|
|
58
|
-
ref.current.innerText = newText;
|
|
59
|
-
setText(newText);
|
|
60
|
-
}, [value, placeholder, focus, isEditable, handleSelectAll]);
|
|
61
|
-
// Effect for placeholder state
|
|
62
|
-
useEffect(() => {
|
|
63
|
-
if (placeholder) {
|
|
64
|
-
setIsPlaceholder(text === placeholder);
|
|
65
|
-
}
|
|
66
|
-
}, [placeholder, text]);
|
|
67
|
-
// Memoize handleSetValue
|
|
68
|
-
const handleSetValue = useCallback((e) => {
|
|
69
|
-
let textString = '';
|
|
70
|
-
const stripped = e.currentTarget.innerText.replaceAll(/\s+/g, '');
|
|
71
|
-
if (stripped.length === 0 && placeholder && ref.current) {
|
|
72
|
-
ref.current.innerText = placeholder;
|
|
73
|
-
setIsPlaceholder(true);
|
|
74
|
-
setCursor('start');
|
|
75
|
-
}
|
|
76
|
-
else if (isPlaceholder) {
|
|
77
|
-
const textString = e.currentTarget.innerText.replace(placeholder, '');
|
|
78
|
-
innerText.current = cleanString(textString);
|
|
79
|
-
if (ref.current) {
|
|
80
|
-
ref.current.innerText = cleanString(textString);
|
|
81
|
-
setCursor('end');
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
else {
|
|
85
|
-
textString = e.currentTarget.innerText;
|
|
86
|
-
innerText.current = cleanString(textString || '');
|
|
87
|
-
}
|
|
88
|
-
onChange(innerText.current);
|
|
89
|
-
setText(innerText.current);
|
|
90
|
-
}, [placeholder, isPlaceholder, onChange, setCursor]);
|
|
91
|
-
// Memoize handleKeyDown
|
|
92
|
-
const handleKeyDown = useCallback((e) => {
|
|
93
|
-
// stop propagation to avoid conflicts with listeners to shortcuts while editing
|
|
94
|
-
e.stopPropagation();
|
|
95
|
-
if (e.key === 'Enter' && ref.current) {
|
|
96
|
-
e.preventDefault();
|
|
97
|
-
ref.current.innerHTML = cleanString(innerText.current);
|
|
98
|
-
onChange(null);
|
|
99
|
-
onSubmit(innerText.current);
|
|
100
|
-
ref === null || ref === void 0 ? void 0 : ref.current.blur();
|
|
101
|
-
return true;
|
|
102
|
-
}
|
|
103
|
-
if (e.key === '<' || e.key === '>') {
|
|
104
|
-
e.preventDefault();
|
|
105
|
-
return false;
|
|
106
|
-
}
|
|
107
|
-
}, [onChange, onSubmit]);
|
|
108
|
-
// Memoize handlePaste
|
|
109
|
-
const handlePaste = useCallback((e) => {
|
|
110
|
-
var _a;
|
|
111
|
-
e.preventDefault();
|
|
112
|
-
if (!e.clipboardData)
|
|
113
|
-
return;
|
|
114
|
-
const textData = e.clipboardData.getData('text/plain');
|
|
115
|
-
if (!textData)
|
|
116
|
-
return;
|
|
117
|
-
const pasteText = cleanString(textData);
|
|
118
|
-
const selection = globalThis.getSelection();
|
|
119
|
-
if (!(selection === null || selection === void 0 ? void 0 : selection.rangeCount))
|
|
120
|
-
return;
|
|
121
|
-
selection === null || selection === void 0 ? void 0 : selection.deleteFromDocument();
|
|
122
|
-
selection === null || selection === void 0 ? void 0 : selection.getRangeAt(0).insertNode(document.createTextNode(pasteText));
|
|
123
|
-
selection === null || selection === void 0 ? void 0 : selection.collapseToEnd();
|
|
124
|
-
const newText = ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.innerText) || '';
|
|
125
|
-
onChange(cleanString(newText));
|
|
126
|
-
innerText.current = cleanString(newText);
|
|
127
|
-
return true;
|
|
128
|
-
}, [onChange]);
|
|
129
|
-
// Memoize handleFocus
|
|
130
|
-
const handleFocus = useCallback((e) => {
|
|
131
|
-
setIsFocused(true);
|
|
132
|
-
onFocus(e);
|
|
133
|
-
}, [onFocus]);
|
|
134
|
-
// Memoize handleBlur
|
|
135
|
-
const handleBlur = useCallback((_e) => {
|
|
136
|
-
if (!ref.current)
|
|
137
|
-
return;
|
|
138
|
-
const blurText = cleanString(innerText.current);
|
|
139
|
-
if (blurText === '') {
|
|
140
|
-
ref.current.innerText = placeholder;
|
|
141
|
-
innerText.current = placeholder;
|
|
142
|
-
}
|
|
143
|
-
onChange(null);
|
|
144
|
-
onSubmit(innerText.current);
|
|
145
|
-
setIsFocused(false);
|
|
146
|
-
onBlur(blurText);
|
|
147
|
-
}, [placeholder, onChange, onSubmit, onBlur]);
|
|
148
|
-
// Memoize handleClick
|
|
149
|
-
const handleClick = useCallback((e) => {
|
|
150
|
-
e.preventDefault();
|
|
151
|
-
e.stopPropagation();
|
|
152
|
-
if (isPlaceholder)
|
|
153
|
-
setTimeout(() => setCursor('start'), 50);
|
|
154
|
-
onClick();
|
|
155
|
-
}, [isPlaceholder, setCursor, onClick]);
|
|
156
|
-
// calc css values as number / string
|
|
157
|
-
const setWidth = useCallback((width) => {
|
|
158
|
-
if (typeof width === 'string')
|
|
159
|
-
return width;
|
|
160
|
-
return `${width}px`;
|
|
161
|
-
}, []);
|
|
162
|
-
// memo cssVars
|
|
163
|
-
const cssVars = useMemo(() => {
|
|
164
|
-
return {
|
|
165
|
-
'--div-input-color': isPlaceholder
|
|
166
|
-
? 'var(--core-text-tertiary)'
|
|
167
|
-
: 'var(--core-text-primary)',
|
|
168
|
-
'--div-input-width': `${setWidth(width)}`,
|
|
169
|
-
'--div-input-user-select': isEditable ? 'text' : 'none',
|
|
170
|
-
'--div-input-padding': padding !== null && padding !== void 0 ? padding : '0',
|
|
171
|
-
'--div-input-text-align': textAlign !== null && textAlign !== void 0 ? textAlign : 'left',
|
|
172
|
-
'--div-input-white-space': isEditable && wrap ? 'wrap' : 'no-wrap',
|
|
173
|
-
'--div-input-line-clamp': isEditable && isFocused ? 'none' : (clamp !== null && clamp !== void 0 ? clamp : 'none'),
|
|
174
|
-
'--div-input-cursor': isEditable ? 'text' : 'default',
|
|
175
|
-
'--div-input-bg': isEditable
|
|
176
|
-
? (bgColor !== null && bgColor !== void 0 ? bgColor : 'var(--core-surface-secondary)')
|
|
177
|
-
: 'transparent',
|
|
178
|
-
'--div-input-wrapper-bg': isEditable && isFocused
|
|
179
|
-
? (bgColor !== null && bgColor !== void 0 ? bgColor : 'var(--core-surface-secondary)')
|
|
180
|
-
: 'transparent',
|
|
181
|
-
'--div-input-border-radius': `${radius}px`,
|
|
182
|
-
};
|
|
183
|
-
}, [
|
|
184
|
-
clamp,
|
|
185
|
-
wrap,
|
|
186
|
-
isEditable,
|
|
187
|
-
width,
|
|
188
|
-
textAlign,
|
|
189
|
-
isFocused,
|
|
190
|
-
padding,
|
|
191
|
-
isPlaceholder,
|
|
192
|
-
setWidth,
|
|
193
|
-
bgColor,
|
|
194
|
-
radius,
|
|
195
|
-
]);
|
|
196
|
-
// avoid issues with safari that refocuses editable divs on blur
|
|
197
|
-
// by wrapping it with a pointer events none
|
|
198
|
-
return (jsx("div", Object.assign({ id: divId, className: `${css.wrapper}${divClass}`, style: Object.assign(Object.assign({}, divStyle), cssVars) }, rest, { children: jsx(motion.div, { className: css.input, ref: ref, contentEditable: isEditable, suppressContentEditableWarning: true, onInput: handleSetValue, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur, onPaste: handlePaste, onDoubleClick: onDblClick, onClick: handleClick, role: 'textbox', "aria-label": name, children: value !== null && value !== void 0 ? value : placeholder }) })));
|
|
199
|
-
});
|
|
200
|
-
DivInput.displayName = 'DivInput';
|
|
201
|
-
|
|
202
|
-
export { DivInput as D };
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React, { useMemo } from 'react';
|
|
4
|
-
import { useTheme } from '../hooks/useTheme.js';
|
|
5
|
-
import '../theme/colors.js';
|
|
6
|
-
import '../hooks/useWindow.js';
|
|
7
|
-
|
|
8
|
-
const DocIcons = React.memo((props) => {
|
|
9
|
-
const { type = 'pdf', height = 36 } = props, divAttributes = __rest(props, ["type", "height"]);
|
|
10
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
11
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
12
|
-
const divClass = className ? ` ${className}` : '';
|
|
13
|
-
const theme = useTheme();
|
|
14
|
-
const renderIcon = useMemo(() => {
|
|
15
|
-
const images = [
|
|
16
|
-
{
|
|
17
|
-
name: 'not supported',
|
|
18
|
-
svg: (jsxs("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", height: height, "aria-label": 'Not supported', children: [jsx("title", { children: "Not supported" }), jsx("path", { d: "M 13.944 0 L 21.798 8 L 21.798 21.2 C 21.798 22.746 20.568 24 19.049 24 L 4.911 24 C 3.393 24 2.162 22.745 2.162 21.2 L 2.162 2.8 C 2.162 1.254 3.393 0 4.911 0 Z", fill: "rgb(102, 113, 127)" }), jsx("path", { d: "M 12.021 16.249 C 12.461 16.249 12.733 15.968 12.733 15.625 L 12.733 15.52 C 12.733 15.028 13.014 14.711 13.63 14.307 C 14.482 13.744 15.089 13.235 15.089 12.18 C 15.089 10.72 13.788 9.93 12.294 9.93 C 10.782 9.93 9.789 10.65 9.552 11.46 C 9.508 11.6 9.482 11.74 9.482 11.89 C 9.482 12.285 9.789 12.496 10.079 12.496 C 10.378 12.496 10.571 12.356 10.729 12.145 L 10.887 11.934 C 11.195 11.424 11.652 11.125 12.241 11.125 C 13.041 11.125 13.559 11.582 13.559 12.25 C 13.559 12.848 13.19 13.138 12.426 13.674 C 11.793 14.114 11.318 14.579 11.318 15.441 L 11.318 15.555 C 11.318 16.012 11.573 16.249 12.021 16.249 Z M 12.004 18.869 C 12.514 18.869 12.953 18.464 12.953 17.954 C 12.953 17.444 12.523 17.04 12.003 17.04 C 11.485 17.04 11.054 17.453 11.054 17.954 C 11.054 18.455 11.494 18.868 12.004 18.868 Z", fill: "rgb(255, 255, 255)" }), jsx("path", { d: "M 21.798 8 L 16.832 8 C 15.314 8 13.944 6.605 13.944 5.058 L 13.944 0 Z", fill: "rgba(255,255,255,0.4)" })] })),
|
|
19
|
-
},
|
|
20
|
-
{
|
|
21
|
-
name: 'text',
|
|
22
|
-
svg: (jsxs("svg", { viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg", height: height, "aria-label": "Text document", children: [jsx("title", { children: "Text document" }), jsx("path", { d: "M137.902 0a48.573 48.573 0 0 0-35.589 15.294 53.965 53.965 0 0 0-15.273 35.64v917.412a48.707 48.707 0 0 0 15.273 35.64 49.971 49.971 0 0 0 35.59 15.293h746.336a48.64 48.64 0 0 0 35.59-15.293 50.37 50.37 0 0 0 15.273-35.64V288.717L646.728 0H137.902z", fill: "#FD7541" }), jsx("path", { d: "M935.102 288.717H697.656c-27.822-.666-50.227-23.076-50.928-50.934V0l288.374 288.717z", fill: "#FFFFFF", opacity: 0.4 }), jsx("path", { d: "M248.126 365.184h220.518a25.518 25.518 0 0 0 24.192-25.497 25.518 25.518 0 0 0-24.197-25.503H248.126a25.518 25.518 0 0 0-24.197 25.498 25.518 25.518 0 0 0 24.197 25.497zm0 169.825H773.95a25.446 25.446 0 0 0 25.43-25.466 25.446 25.446 0 0 0-25.43-25.467H248.126a25.446 25.446 0 0 0-25.431 25.467 25.446 25.446 0 0 0 25.43 25.466zM773.95 653.896H248.126a25.518 25.518 0 0 0-24.197 25.497 25.518 25.518 0 0 0 24.197 25.503H773.95a25.518 25.518 0 0 0 24.197-25.497A25.518 25.518 0 0 0 773.95 653.9z", fill: "#FFF" })] })),
|
|
23
|
-
},
|
|
24
|
-
{
|
|
25
|
-
name: 'docx',
|
|
26
|
-
svg: (jsxs("svg", { viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg", height: height, "aria-label": "Word document", children: [jsx("title", { children: "Word document" }), jsx("path", { d: "m594.944 0 335.124 341.32v563.2c0 65.996-52.5 119.48-117.294 119.48H209.546c-64.793 0-117.299-53.53-117.299-119.48V119.48C92.252 53.484 144.757 0 209.551 0h385.393z", fill: theme.current.colors['core-button-primary'] }), jsx("path", { d: "M930.068 341.32H718.152c-64.748 0-123.208-59.49-123.208-125.492V0l335.124 341.32z", fill: "#ffffff", fillOpacity: ".7" }), jsx("path", { d: "M427.377 725.32V768H259.814v-42.68h167.563zM594.944 640v42.68h-335.13V640h335.13zm0-85.32v42.64h-335.13v-42.64h335.13zm0-85.36V512h-335.13v-42.68h335.13z", fill: "#FFF" })] })),
|
|
27
|
-
},
|
|
28
|
-
{
|
|
29
|
-
name: 'pdf',
|
|
30
|
-
svg: (jsxs("svg", { viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg", height: height, "aria-label": "PDF document", children: [jsx("title", { children: "PDF document" }), jsx("path", { d: "m594.944 0 335.124 341.32v563.2c0 65.996-52.5 119.48-117.294 119.48H209.546c-64.793 0-117.299-53.53-117.299-119.48V119.48C92.252 53.484 144.757 0 209.551 0h385.393z", fill: "#E94848" }), jsx("path", { d: "M482.954 375.48a40.586 40.586 0 0 0-40.028 40.776c0 27.786 15.17 62.326 31.18 94.771-12.564 39.834-26.715 82.473-44.82 118.503-37.094 14.796-70.195 25.83-90.06 42.168a41.708 41.708 0 0 0-12.39 29.926c0 22.344 18.063 40.776 40.038 40.776a39.332 39.332 0 0 0 29.27-12.472c14.618-17.828 31.888-50.13 47.294-79.642 35.42-14.198 72.607-28.672 108.447-37.325 26.163 21.453 64.051 35.65 95.186 35.65 21.97 0 40.033-18.385 40.033-40.775a40.586 40.586 0 0 0-40.033-40.724c-24.991 0-61.297 9.072-89.037 18.616a301.338 301.338 0 0 1-58.092-76.984c10.66-33.332 23.04-66.658 23.04-92.488a40.586 40.586 0 0 0-40.028-40.776zm0 24.438c8.98 0 16.01 7.168 16.01 16.292 0 12.237-6.42 34.816-13.87 59.018-9.958-23.552-18.15-46.172-18.15-58.972 0-9.165 7.025-16.292 16.01-16.292v-.046zm6.887 139.546a323.574 323.574 0 0 0 41.523 53.76c-23.742 6.604-46.92 15.078-69.822 23.92 11.08-25.364 19.917-51.758 28.299-77.726v.046zm157.235 52.126c8.98 0 16.01 7.122 16.01 16.292 0 9.124-7.03 16.292-16.015 16.292-18.059 0-43.659-8.284-64.185-19.876 23.552-6.794 49.204-12.749 64.185-12.749v.041zM408.15 664.576c-11.264 20.48-22.436 39.562-30.26 49.152a15.078 15.078 0 0 1-11.028 4.188 15.964 15.964 0 0 1-16.01-16.292 17.707 17.707 0 0 1 4.234-11.356c9.4-7.398 29.835-16.292 53.064-25.692z", fill: "#FFF" }), jsx("path", { d: "M930.068 341.32H718.152c-64.748 0-123.208-59.49-123.208-125.492V0l335.124 341.32z", fill: "#FFF", fillOpacity: ".4" })] })),
|
|
31
|
-
},
|
|
32
|
-
];
|
|
33
|
-
const item = images.filter((data) => type === data.name);
|
|
34
|
-
return item ? item[0].svg : null;
|
|
35
|
-
}, [height, type, theme]);
|
|
36
|
-
return (jsx("div", Object.assign({ id: divId, className: divClass.trim(), style: Object.assign(Object.assign({}, divStyle), { display: 'flex', justifyContent: 'center', alignItems: 'center' }) }, rest, { children: renderIcon })));
|
|
37
|
-
});
|
|
38
|
-
|
|
39
|
-
export { DocIcons as D };
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { AnimatePresence, motion } from 'motion/react';
|
|
4
|
-
import React, { useMemo } from 'react';
|
|
5
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
6
|
-
|
|
7
|
-
var css_248z = ".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.Dot-module_dot__8eYTa {\n\tdisplay: var(--dot-display);\n\tbox-sizing: content-box;\n\tposition: var(--dot-position);\n\ttop: var(--dot-top);\n\tright: var(--dot-right);\n\tvertical-align: var(--dot-vertical-align);\n\tmin-height: var(--dot-size);\n\tmin-width: var(--dot-size);\n\theight: var(--dot-size);\n\twidth: var(--dot-size);\n\tborder: var(--dot-border) solid var(--core-surface-primary);\n\tbackground: var(--dot-bg);\n\tborder-radius: 100%;\n\tz-index: var(--elevation-status);\n}\n";
|
|
8
|
-
var css = {"dot":"Dot-module_dot__8eYTa flexBox-module_row__PWxbe"};
|
|
9
|
-
styleInject(css_248z);
|
|
10
|
-
|
|
11
|
-
const DEFAULT_VARIANTS = {
|
|
12
|
-
initial: { opacity: 0 },
|
|
13
|
-
animate: { opacity: 1 },
|
|
14
|
-
exit: { opacity: 0 },
|
|
15
|
-
};
|
|
16
|
-
const DEFAULT_TRANSITION = {
|
|
17
|
-
ease: 'easeInOut',
|
|
18
|
-
duration: 0.5,
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
const Dot = React.memo((props) => {
|
|
22
|
-
const { size = 8, topOffset = 2, rightOffset = 2, border = 3, position = 'corner', color = undefined, transition = undefined, motionValues = undefined, show = false, state } = props, divAttributes = __rest(props, ["size", "topOffset", "rightOffset", "border", "position", "color", "transition", "motionValues", "show", "state"]);
|
|
23
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
24
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
25
|
-
const divClass = className ? ` ${className}` : '';
|
|
26
|
-
// memo variants
|
|
27
|
-
const variants = useMemo(() => {
|
|
28
|
-
if (motionValues) {
|
|
29
|
-
return Object.assign(Object.assign({}, DEFAULT_VARIANTS), motionValues);
|
|
30
|
-
}
|
|
31
|
-
return DEFAULT_VARIANTS;
|
|
32
|
-
}, [motionValues]);
|
|
33
|
-
// memo transition
|
|
34
|
-
const trans = useMemo(() => {
|
|
35
|
-
if (transition) {
|
|
36
|
-
return Object.assign(Object.assign({}, DEFAULT_TRANSITION), transition);
|
|
37
|
-
}
|
|
38
|
-
return DEFAULT_TRANSITION;
|
|
39
|
-
}, [transition]);
|
|
40
|
-
// memo color
|
|
41
|
-
const bgColor = useMemo(() => {
|
|
42
|
-
if (color) {
|
|
43
|
-
return color;
|
|
44
|
-
}
|
|
45
|
-
if (state) {
|
|
46
|
-
switch (state) {
|
|
47
|
-
case 'red':
|
|
48
|
-
return 'var(--feedback-warning)';
|
|
49
|
-
case 'yellow':
|
|
50
|
-
return 'var(--feedback-attention)';
|
|
51
|
-
case 'green':
|
|
52
|
-
return 'var(--feedback-positive)';
|
|
53
|
-
case 'blue':
|
|
54
|
-
return 'var(--core-gp-logo-primary)';
|
|
55
|
-
case 'grey':
|
|
56
|
-
return 'var(--core-text-secondary)';
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
return 'var(--core-text-special)';
|
|
60
|
-
}, [state, color]);
|
|
61
|
-
// memo css vars
|
|
62
|
-
const cssVars = useMemo(() => {
|
|
63
|
-
return {
|
|
64
|
-
'--dot-size': `${size}px`,
|
|
65
|
-
'--dot-display': position === 'inline' ? 'inline-flex' : 'flex',
|
|
66
|
-
'--dot-position': position === 'inline' ? 'relative' : 'absolute',
|
|
67
|
-
'--dot-top': position === 'inline' ? 'unset' : `${topOffset}px`,
|
|
68
|
-
'--dot-right': position === 'inline' ? 'unset' : `${rightOffset}px`,
|
|
69
|
-
'--dot-vertical-align': position === 'inline' ? 'middle' : 'unset',
|
|
70
|
-
'--dot-border': `${border}px solid`,
|
|
71
|
-
'--dot-border-color': 'var(--core-surface-primary)',
|
|
72
|
-
'--dot-bg': `${bgColor}`,
|
|
73
|
-
};
|
|
74
|
-
}, [size, position, topOffset, rightOffset, border, bgColor]);
|
|
75
|
-
return (jsx(AnimatePresence, { initial: false, children: show && (jsx(motion.div, Object.assign({ id: divId, className: `${css.dot}${divClass}`, style: Object.assign(Object.assign({}, divStyle), cssVars), initial: 'initial', animate: 'animate', exit: 'exit', transition: trans, variants: variants, role: 'status', "aria-live": 'polite', "aria-label": 'Blue dot indicating active or new' }, rest, { children: jsx("div", { className: "dot" }) }))) }));
|
|
76
|
-
});
|
|
77
|
-
|
|
78
|
-
export { Dot as D };
|
|
@@ -1,300 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React, { useRef, useState, useCallback, useEffect, useMemo } from 'react';
|
|
4
|
-
import { useTheme } from '../hooks/useTheme.js';
|
|
5
|
-
import '../theme/colors.js';
|
|
6
|
-
import '../hooks/useWindow.js';
|
|
7
|
-
import { useObserveResize } from '../hooks/useObserveResize.js';
|
|
8
|
-
import { p as pointerPosition } from './utils-CZ1LWeN6.js';
|
|
9
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
10
|
-
|
|
11
|
-
var css_248z = ".flexBox-module_row__PWxbe {\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowBetween__27lKK {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowStart__nJZnW {\n\tdisplay: flex;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_rowEnd__dHcOU {\n\tdisplay: flex;\n\tjustify-content: flex-end;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_column__MP2Xd {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: center;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStart__Kg8cV {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: flex-start;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnStartCenter__zcmtk {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnBetween__157yI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\talign-items: center;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}.flexBox-module_columnEnd__u2nwI {\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: flex-end;\n\talign-items: flex-end;\n\tbox-sizing: border-box;\n\tpadding: 0;\n\tmargin: 0;\n}\n\n.DraggablePanel-module_panel__r-Dm- {\n\tposition: relative;\n\tbackground-color: var(--panel-bg);\n}\n\n.DraggablePanel-module_content__K1gRd {\n\twidth: 100%;\n\theight: 100%;\n\toverflow: hidden;\n}\n\n.DraggablePanel-module_handle__yVrgS {\n\twidth: var(--drag-handle-width);\n\theight: var(--drag-handle-height);\n\tmin-width: var(--drag-handle-width);\n\tmin-height: var(--drag-handle-height);\n\tborder-radius: var(--drag-handle-radius);\n\tborder: var(--drag-handle-border) solid var(--drag-handle-border-color);\n\tbackground: var(--drag-handle-bg);\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 50%;\n\ttransform: translateX(-50%) translateY(-50%);\n\tz-index: 15000;\n}\n";
|
|
12
|
-
var css = {"panel":"DraggablePanel-module_panel__r-Dm- flexBox-module_columnStart__Kg8cV","content":"DraggablePanel-module_content__K1gRd flexBox-module_columnStart__Kg8cV","handle":"DraggablePanel-module_handle__yVrgS"};
|
|
13
|
-
styleInject(css_248z);
|
|
14
|
-
|
|
15
|
-
const MIN_SIZE = 50;
|
|
16
|
-
const DraggablePanel = React.memo((props) => {
|
|
17
|
-
const theme = useTheme();
|
|
18
|
-
const { children, sizeConstraints = { initial: 250, min: 250, max: 500 }, dragsRight = true, isClosed = true, resizeHandle = {
|
|
19
|
-
width: 10,
|
|
20
|
-
color: 'transparent',
|
|
21
|
-
offsetX: true,
|
|
22
|
-
}, borderRight = '1px solid var(--core-outline-primary)', borderLeft = null, bgColor = 'transparent', drags = true, isTouchDevice = false, disableOnContext = true, dragHandle = true, dragHandleStyle, containerRef, onResize = () => null, onResizeStart = () => null, onResizeEnd = () => null } = props, divAttributes = __rest(props, ["children", "sizeConstraints", "dragsRight", "isClosed", "resizeHandle", "borderRight", "borderLeft", "bgColor", "drags", "isTouchDevice", "disableOnContext", "dragHandle", "dragHandleStyle", "containerRef", "onResize", "onResizeStart", "onResizeEnd"]);
|
|
23
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
24
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
25
|
-
const divClass = className ? ` ${className}` : '';
|
|
26
|
-
const handle = useRef(null);
|
|
27
|
-
const div = useRef(null);
|
|
28
|
-
const [isDragging, setIsDragging] = useState(false);
|
|
29
|
-
const isOver = useRef(false);
|
|
30
|
-
const gripper = Object.assign({}, resizeHandle);
|
|
31
|
-
const containerSize = useObserveResize(containerRef);
|
|
32
|
-
const [handleHighlight, setHandleHighlight] = useState(false);
|
|
33
|
-
const [lastWidth, setLastWidth] = useState(null);
|
|
34
|
-
const [panelClosed, setPanelClosed] = useState(isClosed);
|
|
35
|
-
const [constraints, setConstraints] = useState(sizeConstraints);
|
|
36
|
-
const [contWidth, setContWidth] = useState(undefined);
|
|
37
|
-
const timer = useRef(null);
|
|
38
|
-
const startX = useRef(0);
|
|
39
|
-
const startWidth = useRef(0);
|
|
40
|
-
const divWidth = useRef(0);
|
|
41
|
-
const divHeight = useRef(0);
|
|
42
|
-
const deltaWidth = useRef(0);
|
|
43
|
-
// handle window resize call back - use the window object only if containerRef is undefined
|
|
44
|
-
const handleWindowResize = useCallback(() => {
|
|
45
|
-
if (!(containerRef === null || containerRef === void 0 ? void 0 : containerRef.current))
|
|
46
|
-
setContWidth(window.innerWidth);
|
|
47
|
-
}, [containerRef]);
|
|
48
|
-
const handleMouseOver = useCallback(() => {
|
|
49
|
-
isOver.current = true;
|
|
50
|
-
setHighlight(true);
|
|
51
|
-
}, []);
|
|
52
|
-
const handleMouseOut = useCallback(() => {
|
|
53
|
-
isOver.current = false;
|
|
54
|
-
if (!isDragging)
|
|
55
|
-
setHighlight(false);
|
|
56
|
-
}, [isDragging]);
|
|
57
|
-
const handleFocus = useCallback(() => {
|
|
58
|
-
isOver.current = true;
|
|
59
|
-
setHighlight(true);
|
|
60
|
-
}, []);
|
|
61
|
-
const handleBlur = useCallback(() => {
|
|
62
|
-
isOver.current = false;
|
|
63
|
-
if (!isDragging)
|
|
64
|
-
setHighlight(false);
|
|
65
|
-
}, [isDragging]);
|
|
66
|
-
const handleTouchStart = useCallback(() => {
|
|
67
|
-
isOver.current = true;
|
|
68
|
-
setHighlight(true);
|
|
69
|
-
}, []);
|
|
70
|
-
const handleTouchEnd = useCallback(() => {
|
|
71
|
-
isOver.current = false;
|
|
72
|
-
if (!isDragging)
|
|
73
|
-
setHighlight(false);
|
|
74
|
-
}, [isDragging]);
|
|
75
|
-
// handle container resize - if continerRef and width more than 0 use this to set container size
|
|
76
|
-
useEffect(() => {
|
|
77
|
-
if (!containerRef)
|
|
78
|
-
return;
|
|
79
|
-
if (containerSize.width > 0)
|
|
80
|
-
setContWidth(containerSize.width);
|
|
81
|
-
}, [containerSize, containerRef]);
|
|
82
|
-
// listen to then window resize event
|
|
83
|
-
// biome-ignore lint/correctness/useExhaustiveDependencies: on mount only
|
|
84
|
-
useEffect(() => {
|
|
85
|
-
if (!contWidth)
|
|
86
|
-
setContWidth(window.innerWidth);
|
|
87
|
-
globalThis.addEventListener('resize', handleWindowResize);
|
|
88
|
-
return () => globalThis.removeEventListener('resize', handleWindowResize);
|
|
89
|
-
}, []);
|
|
90
|
-
// close/open on prop change
|
|
91
|
-
useEffect(() => setPanelClosed(isClosed), [isClosed]);
|
|
92
|
-
// on constraints update, check and adjust div width to not exceed max
|
|
93
|
-
const adjustCurrentWidth = useCallback((relConst) => {
|
|
94
|
-
if ((div === null || div === void 0 ? void 0 : div.current) && relConst.max) {
|
|
95
|
-
const currentWidth = div.current.offsetWidth;
|
|
96
|
-
if (currentWidth > relConst.max) {
|
|
97
|
-
div.current.style.width = `${relConst.max}px`;
|
|
98
|
-
divWidth.current = relConst.max;
|
|
99
|
-
setLastWidth(relConst.max);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
}, []);
|
|
103
|
-
// reset constraints on prop changes
|
|
104
|
-
useEffect(() => {
|
|
105
|
-
if (!contWidth)
|
|
106
|
-
return;
|
|
107
|
-
const { min, max, initial } = sizeConstraints;
|
|
108
|
-
const relativeConstraints = { min, max, initial };
|
|
109
|
-
for (const [key, value] of Object.entries(sizeConstraints)) {
|
|
110
|
-
let calc = value;
|
|
111
|
-
if (calc <= 1 && calc >= 0)
|
|
112
|
-
calc = contWidth * value; // handle "percent" values
|
|
113
|
-
if (calc > 1 && calc < MIN_SIZE)
|
|
114
|
-
calc = MIN_SIZE; // ensure values no smaller than MIN_SIZE
|
|
115
|
-
relativeConstraints[key] = calc;
|
|
116
|
-
}
|
|
117
|
-
if (relativeConstraints.min < relativeConstraints.initial) {
|
|
118
|
-
relativeConstraints.initial = relativeConstraints.min; // ensure "initial" is not smaller than "min"
|
|
119
|
-
}
|
|
120
|
-
setConstraints(relativeConstraints);
|
|
121
|
-
adjustCurrentWidth(relativeConstraints);
|
|
122
|
-
}, [sizeConstraints, contWidth, adjustCurrentWidth]);
|
|
123
|
-
// callback for hilight when hovering over the resize handle
|
|
124
|
-
const setHighlight = useCallback((state) => {
|
|
125
|
-
if (timer.current)
|
|
126
|
-
clearTimeout(timer.current);
|
|
127
|
-
if (state) {
|
|
128
|
-
timer.current = setTimeout(() => {
|
|
129
|
-
setHandleHighlight(state);
|
|
130
|
-
}, isTouchDevice ? 0 : 350);
|
|
131
|
-
}
|
|
132
|
-
else
|
|
133
|
-
setHandleHighlight(false);
|
|
134
|
-
}, [isTouchDevice]);
|
|
135
|
-
// get the current mouse X position using touch or mouse event
|
|
136
|
-
const getClientX = useCallback((e) => {
|
|
137
|
-
return pointerPosition(e);
|
|
138
|
-
}, []);
|
|
139
|
-
// calculate the drag amount based on starting point and new client x point
|
|
140
|
-
const getNewWidth = useCallback((clientX) => {
|
|
141
|
-
return dragsRight
|
|
142
|
-
? startWidth.current + clientX - startX.current
|
|
143
|
-
: startWidth.current - clientX + startX.current;
|
|
144
|
-
}, [dragsRight]);
|
|
145
|
-
// check constraints to prevent over dragging
|
|
146
|
-
const canDrag = useCallback((newWidth, clientX) => {
|
|
147
|
-
if (constraints === null || constraints === void 0 ? void 0 : constraints.min) {
|
|
148
|
-
if (newWidth <= constraints.min)
|
|
149
|
-
return false;
|
|
150
|
-
if (newWidth < constraints.min)
|
|
151
|
-
return false;
|
|
152
|
-
}
|
|
153
|
-
if (constraints === null || constraints === void 0 ? void 0 : constraints.max) {
|
|
154
|
-
if (newWidth >= constraints.max) {
|
|
155
|
-
if (clientX - startX.current > 0)
|
|
156
|
-
return false;
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
return true;
|
|
160
|
-
}, [constraints]);
|
|
161
|
-
// process drag
|
|
162
|
-
const doDrag = useCallback((e) => {
|
|
163
|
-
if (div === null || div === void 0 ? void 0 : div.current) {
|
|
164
|
-
e.stopPropagation();
|
|
165
|
-
e.preventDefault();
|
|
166
|
-
const el = div.current;
|
|
167
|
-
const clientX = getClientX(e);
|
|
168
|
-
const newWidth = getNewWidth(clientX);
|
|
169
|
-
if (!canDrag(newWidth, clientX))
|
|
170
|
-
return;
|
|
171
|
-
el.style.width = `${newWidth}px`;
|
|
172
|
-
divWidth.current = newWidth;
|
|
173
|
-
deltaWidth.current = clientX - startX.current;
|
|
174
|
-
onResize({
|
|
175
|
-
div,
|
|
176
|
-
divWidth: divWidth.current,
|
|
177
|
-
divHeight: divHeight.current,
|
|
178
|
-
deltaWidth: deltaWidth.current,
|
|
179
|
-
});
|
|
180
|
-
}
|
|
181
|
-
return false;
|
|
182
|
-
}, [onResize, canDrag, getNewWidth, getClientX]);
|
|
183
|
-
// handle stopping drag
|
|
184
|
-
const stopDrag = useCallback(() => {
|
|
185
|
-
setIsDragging(false);
|
|
186
|
-
document.documentElement.removeEventListener('mousemove', doDrag, false);
|
|
187
|
-
document.documentElement.removeEventListener('mouseup', stopDrag, false);
|
|
188
|
-
document.documentElement.removeEventListener('touchmove', doDrag, false);
|
|
189
|
-
document.documentElement.removeEventListener('touchend', stopDrag, false);
|
|
190
|
-
document.documentElement.style.userSelect = 'auto';
|
|
191
|
-
// noinspection JSDeprecatedSymbols
|
|
192
|
-
document.documentElement.style.webkitUserSelect = 'auto'; // reuqired for safari / iOS
|
|
193
|
-
if (div === null || div === void 0 ? void 0 : div.current) {
|
|
194
|
-
divWidth.current = div.current.offsetWidth;
|
|
195
|
-
divHeight.current = div.current.offsetHeight;
|
|
196
|
-
deltaWidth.current = 0;
|
|
197
|
-
const update = {
|
|
198
|
-
div,
|
|
199
|
-
divWidth: divWidth.current,
|
|
200
|
-
divHeight: divHeight.current,
|
|
201
|
-
deltaWidth: deltaWidth.current,
|
|
202
|
-
};
|
|
203
|
-
onResize(update);
|
|
204
|
-
onResizeEnd(update);
|
|
205
|
-
}
|
|
206
|
-
setLastWidth(divWidth.current);
|
|
207
|
-
if (!isOver.current)
|
|
208
|
-
setHighlight(false);
|
|
209
|
-
}, [doDrag, onResizeEnd, onResize, setHighlight]);
|
|
210
|
-
// handle starting drag
|
|
211
|
-
const initDrag = useCallback((e) => {
|
|
212
|
-
if ((div === null || div === void 0 ? void 0 : div.current) && document.defaultView) {
|
|
213
|
-
setIsDragging(true);
|
|
214
|
-
const el = div.current;
|
|
215
|
-
divWidth.current = div.current.offsetWidth;
|
|
216
|
-
divHeight.current = div.current.offsetHeight;
|
|
217
|
-
deltaWidth.current = 0;
|
|
218
|
-
startX.current = pointerPosition(e);
|
|
219
|
-
startWidth.current = Number.parseInt(document.defaultView.getComputedStyle(el).width, 10);
|
|
220
|
-
document.documentElement.addEventListener('mousemove', doDrag, false);
|
|
221
|
-
document.documentElement.addEventListener('mouseup', stopDrag, false);
|
|
222
|
-
document.documentElement.addEventListener('touchmove', doDrag, false);
|
|
223
|
-
document.documentElement.addEventListener('touchend', stopDrag, false);
|
|
224
|
-
document.documentElement.style.userSelect = 'none';
|
|
225
|
-
// noinspection JSDeprecatedSymbols
|
|
226
|
-
document.documentElement.style.webkitUserSelect = 'none'; // reuqired for safari / iOS
|
|
227
|
-
const update = {
|
|
228
|
-
div,
|
|
229
|
-
divWidth: divWidth.current,
|
|
230
|
-
divHeight: divHeight.current,
|
|
231
|
-
deltaWidth: deltaWidth.current,
|
|
232
|
-
};
|
|
233
|
-
onResize(update);
|
|
234
|
-
onResizeStart(update);
|
|
235
|
-
}
|
|
236
|
-
}, [doDrag, stopDrag, onResize, onResizeStart]);
|
|
237
|
-
useEffect(() => {
|
|
238
|
-
const hl = handle === null || handle === void 0 ? void 0 : handle.current;
|
|
239
|
-
if (hl && drags) {
|
|
240
|
-
hl.addEventListener('mousedown', initDrag, false);
|
|
241
|
-
hl.addEventListener('touchstart', initDrag, { passive: true });
|
|
242
|
-
}
|
|
243
|
-
return () => {
|
|
244
|
-
if (hl) {
|
|
245
|
-
hl.removeEventListener('mousedown', initDrag, false);
|
|
246
|
-
hl.removeEventListener('touchstart', initDrag);
|
|
247
|
-
}
|
|
248
|
-
};
|
|
249
|
-
}, [drags, initDrag]);
|
|
250
|
-
const leftRightStyle = useMemo(() => {
|
|
251
|
-
if (dragsRight) {
|
|
252
|
-
return { right: isTouchDevice ? -22 : -((gripper.width || 10) / 2) };
|
|
253
|
-
}
|
|
254
|
-
return { left: isTouchDevice ? -22 : -((gripper.width || 10) / 2) };
|
|
255
|
-
}, [dragsRight, isTouchDevice, gripper.width]);
|
|
256
|
-
const width = useMemo(() => {
|
|
257
|
-
if (!drags)
|
|
258
|
-
return '100%';
|
|
259
|
-
if (panelClosed)
|
|
260
|
-
return 0;
|
|
261
|
-
if (lastWidth)
|
|
262
|
-
return lastWidth;
|
|
263
|
-
return constraints.initial;
|
|
264
|
-
}, [drags, panelClosed, lastWidth, constraints.initial]);
|
|
265
|
-
const cssVars = useMemo(() => {
|
|
266
|
-
return {
|
|
267
|
-
'--panel-bg': bgColor !== null && bgColor !== void 0 ? bgColor : 'transparent',
|
|
268
|
-
};
|
|
269
|
-
}, [bgColor]);
|
|
270
|
-
return (jsxs("div", Object.assign({ id: divId, className: `${css.panel}${divClass}`, ref: div, onContextMenu: (e) => {
|
|
271
|
-
if (disableOnContext)
|
|
272
|
-
e.preventDefault();
|
|
273
|
-
return true;
|
|
274
|
-
}, style: Object.assign(Object.assign(Object.assign({}, divStyle), cssVars), { overflow: 'visible', width: width, height: '100%', maxWidth: drags ? constraints.max : 'unset', transition: isDragging ? '' : 'width 0.2s ease', borderRight: panelClosed || !borderRight || !drags ? 'none' : borderRight, borderLeft: panelClosed || !borderLeft || !drags ? 'none' : borderLeft }) }, rest, { children: [jsxs("div", { ref: handle, style: Object.assign(Object.assign({ position: 'absolute', boxSizing: 'border-box', display: panelClosed || !drags ? 'none' : 'flex', alignItems: 'center', justifyContent: 'center', zIndex: 1, top: 0 }, leftRightStyle), { bottom: 0, width: isTouchDevice ? 44 : gripper.width, backgroundColor: resizeHandle.color, cursor: 'col-resize', overflow: 'visible' }), onMouseOver: handleMouseOver, onMouseOut: handleMouseOut, onFocus: handleFocus, onBlur: handleBlur, onTouchStart: handleTouchStart, onTouchEnd: handleTouchEnd, children: [dragHandle && !panelClosed && (jsx(DragHandle, Object.assign({}, (dragHandleStyle !== null && dragHandleStyle !== void 0 ? dragHandleStyle : {})))), jsx("div", { style: {
|
|
275
|
-
backgroundColor: handleHighlight
|
|
276
|
-
? theme.current.colors['core-outline-primary']
|
|
277
|
-
: 'transparent',
|
|
278
|
-
flex: 1,
|
|
279
|
-
maxWidth: 3,
|
|
280
|
-
height: '100%',
|
|
281
|
-
pointerEvents: 'none',
|
|
282
|
-
transition: 'background-color 0.2s ease',
|
|
283
|
-
} })] }), jsx("div", { className: css.content, children: children })] })));
|
|
284
|
-
});
|
|
285
|
-
const DragHandle = React.memo((props) => {
|
|
286
|
-
const { width = 6, height = 6, radius = 100, stroke = 1, color = 'var(--core-surface-primary)', strokeColor = 'var(--core-outline-primary)', } = props;
|
|
287
|
-
const cssVars = useMemo(() => {
|
|
288
|
-
return {
|
|
289
|
-
'--drag-handle-width': `${width}px`,
|
|
290
|
-
'--drag-handle-height': `${height}px`,
|
|
291
|
-
'--drag-handle-radius': `${radius}px`,
|
|
292
|
-
'--drag-handle-border': `${stroke}px`,
|
|
293
|
-
'--drag-handle-border-color': `${strokeColor}`,
|
|
294
|
-
'--drag-handle-bg': `${color}`,
|
|
295
|
-
};
|
|
296
|
-
}, [width, height, radius, stroke, color, strokeColor]);
|
|
297
|
-
return jsx("div", { className: css.handle, style: cssVars });
|
|
298
|
-
});
|
|
299
|
-
|
|
300
|
-
export { DraggablePanel as D };
|