@apple-pie/slice 0.0.6 → 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 +46 -134
- 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/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/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-BHMne9Mr.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-s1aCv2Y1.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-CfzofBTJ.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/UploadArea-DunGYE1_.js +0 -155
- 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/cjs/uikit/UploadArea.js +0 -31
- 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-CdUgbpYF.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-BRon-ejm.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-DodTBG82.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/UploadArea-C0YHy4Z9.js +0 -147
- 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 -59
- 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
- package/dist/esm/uikit/UploadArea.js +0 -19
|
@@ -1,130 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React, { useMemo, useCallback } from 'react';
|
|
4
|
-
import { useTheme } from '../hooks/useTheme.js';
|
|
5
|
-
import '../theme/colors.js';
|
|
6
|
-
import '../hooks/useWindow.js';
|
|
7
|
-
import { a as accessibleKeyDown } from './utils-CZ1LWeN6.js';
|
|
8
|
-
|
|
9
|
-
var FileIconNames;
|
|
10
|
-
(function (FileIconNames) {
|
|
11
|
-
FileIconNames["pdf"] = "pdf";
|
|
12
|
-
FileIconNames["text"] = "text";
|
|
13
|
-
FileIconNames["sheet"] = "sheet";
|
|
14
|
-
FileIconNames["preso"] = "preso";
|
|
15
|
-
FileIconNames["md"] = "md";
|
|
16
|
-
FileIconNames["code"] = "code";
|
|
17
|
-
FileIconNames["image"] = "image";
|
|
18
|
-
FileIconNames["audio"] = "audio";
|
|
19
|
-
FileIconNames["video"] = "video";
|
|
20
|
-
FileIconNames["other"] = "other";
|
|
21
|
-
})(FileIconNames || (FileIconNames = {}));
|
|
22
|
-
const iconColorSchemes = {
|
|
23
|
-
blue: { dark: '#4084ff', light: '#2d2fff' },
|
|
24
|
-
red: { dark: '#ff474a', light: '#df0529' },
|
|
25
|
-
green: { dark: '#2d8c00', light: '#2d8c00' },
|
|
26
|
-
gray: { dark: '#657d91', light: '#4c6273' },
|
|
27
|
-
pink: { dark: '#ff3ac2', light: '#df059b' },
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
const STATIC_FILE_ICONS = new Map([
|
|
31
|
-
[
|
|
32
|
-
'pdf',
|
|
33
|
-
{
|
|
34
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.red[theme] }), jsx("path", { d: "M8.53,7c-.39,0-.73.38-.64.77.06.59.44,1.07.74,1.56.03.18-.06.36-.07.54-.19,1.06-.49,2.12-.95,3.09-.56.26-1.2.52-1.53,1.08-.21.39.09.91.52.95.4.05.7-.29.92-.58.23-.31.38-.68.57-1.01,1.15-.46,2.37-.79,3.61-.91.5.36,1.03.78,1.68.81.37,0,.68-.37.63-.74-.02-.34-.32-.57-.63-.63-.5-.15-1.03-.07-1.54-.06-.97-.78-1.87-1.67-2.58-2.7.05-.62.16-1.31-.17-1.88-.12-.18-.33-.3-.55-.28ZM8.55,7.57c.11.02.12.18.15.27.03.18.03.36.02.54-.13-.24-.3-.5-.27-.79.03,0,.06-.02.1-.02ZM9.15,10c.58.72,1.23,1.39,1.93,1.99-.93.14-1.85.38-2.73.7.34-.89.6-1.8.77-2.73.01.01.02.03.04.04ZM12.77,12.43c.23.02.49,0,.67.16.02.14-.15.16-.25.11-.19-.06-.38-.14-.54-.27.04,0,.08,0,.12,0ZM7.15,13.9c-.11.2-.26.39-.43.53-.05.09-.2-.07-.13-.14.14-.22.39-.34.61-.47-.02.03-.03.06-.05.08Z", fill: "#fff" })] })),
|
|
35
|
-
},
|
|
36
|
-
],
|
|
37
|
-
[
|
|
38
|
-
'text',
|
|
39
|
-
{
|
|
40
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.blue[theme] }), jsx("rect", { x: "6", y: "8", width: "6", height: "1", fill: "#fff" }), jsx("rect", { x: "6", y: "10.5", width: "8", height: "1", fill: "#fff" }), jsx("rect", { x: "6", y: "13", width: "3.5", height: "1", fill: "#fff" })] })),
|
|
41
|
-
},
|
|
42
|
-
],
|
|
43
|
-
[
|
|
44
|
-
'sheet',
|
|
45
|
-
{
|
|
46
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.green[theme] }), jsx("path", { d: "M6,8v6h8v-6H6ZM7,9h1.5v1.5h-1.5v-1.5ZM7,11.5h1.5v1.5h-1.5v-1.5ZM13,13h-3.5v-1.5h3.5v1.5ZM9.5,10.5v-1.5h3.5v1.5h-3.5Z", fill: "#fff" })] })),
|
|
47
|
-
},
|
|
48
|
-
],
|
|
49
|
-
[
|
|
50
|
-
'preso',
|
|
51
|
-
{
|
|
52
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.red[theme] }), jsx("path", { d: "M14,7.5H6c-.28,0-.5.22-.5.5v6c0,.28.22.5.5.5h8c.28,0,.5-.22.5-.5v-6c0-.28-.22-.5-.5-.5ZM8.5,12.5c-.83,0-1.5-.67-1.5-1.5s.67-1.5,1.5-1.5c0,0,0,0,0,0v1.5h1.5s0,0,0,0c0,.83-.67,1.5-1.5,1.5ZM13,12.5h-2v-1h2v1ZM13,10.5h-2v-1h2v1Z", fill: "#fff" })] })),
|
|
53
|
-
},
|
|
54
|
-
],
|
|
55
|
-
[
|
|
56
|
-
'md',
|
|
57
|
-
{
|
|
58
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.gray[theme] }), jsx("path", { d: "M14,9.13v-1h-1.63v-1.63h-1v1.63h-2.73v-1.63h-1v1.63h-1.63v1h1.63v2.73h-1.63v1h1.63v1.63h1v-1.63h2.73v1.63h1v-1.63h1.63v-1h-1.63v-2.73h1.63ZM11.37,11.87h-2.73v-2.73h2.73v2.73Z", fill: "#fff" })] })),
|
|
59
|
-
},
|
|
60
|
-
],
|
|
61
|
-
[
|
|
62
|
-
'code',
|
|
63
|
-
{
|
|
64
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.gray[theme] }), jsx("path", { d: "M7.75,8.47l-2.8,1.6c-.16.09-.25.25-.25.43s.1.34.25.43l2.8,1.6.5-.87-2.04-1.17,2.04-1.17-.5-.87Z", fill: "#fff" }), jsx("path", { d: "M15.28,10.18l-2.4-1.6-.55.83,1.78,1.18-1.78,1.18.55.83,2.4-1.6c.14-.09.22-.25.22-.42s-.08-.32-.22-.42Z", fill: "#fff" }), jsx("rect", { x: "6.53", y: "10", width: "7.43", height: "1", transform: "translate(-1.52 19.26) rotate(-82.36)", fill: "#fff" })] })),
|
|
65
|
-
},
|
|
66
|
-
],
|
|
67
|
-
[
|
|
68
|
-
'image',
|
|
69
|
-
{
|
|
70
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.blue[theme] }), jsx("path", { d: "M13.51,7h-7.03c-.54,0-.99.44-.99.99v4.84h0s0,1.68,0,1.68h8.01c.54,0,.99-.44.99-.99v-5.53c0-.54-.44-.99-.99-.99ZM6.49,8h7.01v5.26s-1-1.01-1-1.01l-1.25,1.25h-.01l-3.25-3.79-1.49,1.86v-3.58Z", fill: "#fff" }), jsx("circle", { cx: "11.5", cy: "10", r: "1", fill: "#fff" })] })),
|
|
71
|
-
},
|
|
72
|
-
],
|
|
73
|
-
[
|
|
74
|
-
'audio',
|
|
75
|
-
{
|
|
76
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.pink[theme] }), jsx("path", { d: "M9.14,8.39c-.09.07-.2.11-.31.11h-1.32c-.28,0-.5.23-.5.5v2.49c0,.28.23.5.5.5h1.32c.11,0,.22.04.31.11l1.86,1.89h1v-7.5h-1l-1.86,1.89Z", fill: "#fff" })] })),
|
|
77
|
-
},
|
|
78
|
-
],
|
|
79
|
-
[
|
|
80
|
-
'video',
|
|
81
|
-
{
|
|
82
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.pink[theme] }), jsx("rect", { x: "6", y: "7.75", width: "5.5", height: "5.5", rx: ".75", ry: ".75", fill: "#fff" }), jsx("path", { d: "M13.87,8.03c-.08-.04-.18-.04-.26.01l-1.5,1c-.07.05-.11.12-.11.21v2.5c0,.08.04.16.11.21l1.5,1s.09.04.14.04c.04,0,.08,0,.12-.03.08-.04.13-.13.13-.22v-4.5c0-.09-.05-.18-.13-.22Z", fill: "#fff" })] })),
|
|
83
|
-
},
|
|
84
|
-
],
|
|
85
|
-
[
|
|
86
|
-
'other',
|
|
87
|
-
{
|
|
88
|
-
paths: (theme) => (jsxs(Fragment, { children: [jsx("path", { d: "M3,2v15.99c0,.55.45,1,1,1h11.99c.55,0,1-.45,1-1V5c0-.55-.45-1-1-1h-2v-2c0-.55-.45-1-1-1H4c-.55,0-1,.45-1,1Z", fill: iconColorSchemes.gray[theme] }), jsx("rect", { x: "6", y: "8", width: "6", height: "1", fill: "#fff" }), jsx("rect", { x: "6", y: "10.5", width: "8", height: "1", fill: "#fff" }), jsx("rect", { x: "6", y: "13", width: "3.5", height: "1", fill: "#fff" })] })),
|
|
89
|
-
},
|
|
90
|
-
],
|
|
91
|
-
]);
|
|
92
|
-
|
|
93
|
-
const FileIcon = React.memo((props) => {
|
|
94
|
-
const { name = 'pdf', size = 24, pointer = false, disabled = false, onClick } = props, svgAttributes = __rest(props, ["name", "size", "pointer", "disabled", "onClick"]);
|
|
95
|
-
const { id: svgId, className, style } = svgAttributes, rest = __rest(svgAttributes, ["id", "className", "style"]);
|
|
96
|
-
const { isDark } = useTheme();
|
|
97
|
-
// memo cursor style
|
|
98
|
-
const cursor = useMemo(() => {
|
|
99
|
-
if (disabled)
|
|
100
|
-
return 'default';
|
|
101
|
-
return pointer ? 'pointer' : 'inherit';
|
|
102
|
-
}, [disabled, pointer]);
|
|
103
|
-
// memo icon style
|
|
104
|
-
const iconStyle = useMemo(() => {
|
|
105
|
-
return {
|
|
106
|
-
cursor,
|
|
107
|
-
userSelect: 'none',
|
|
108
|
-
WebkitUserSelect: 'none',
|
|
109
|
-
WebkitTapHighlightColor: 'transparent',
|
|
110
|
-
outline: 'none',
|
|
111
|
-
border: 0,
|
|
112
|
-
};
|
|
113
|
-
}, [cursor]);
|
|
114
|
-
const handleClick = useCallback((e) => {
|
|
115
|
-
if (!disabled)
|
|
116
|
-
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
117
|
-
}, [onClick, disabled]);
|
|
118
|
-
const definition = STATIC_FILE_ICONS.get(name);
|
|
119
|
-
const paths = definition === null || definition === void 0 ? void 0 : definition.paths(isDark ? 'dark' : 'light');
|
|
120
|
-
if (!paths)
|
|
121
|
-
return null;
|
|
122
|
-
return (jsxs("svg", Object.assign({ id: svgId, className: className, xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 20 20", style: Object.assign(Object.assign({}, style), iconStyle), onClick: handleClick, role: pointer ? 'button' : 'img', "aria-label": `${name} icon`, "aria-disabled": pointer ? disabled : undefined, tabIndex: pointer && !disabled ? 0 : -1, onKeyDown: (e) => {
|
|
123
|
-
if (!pointer || disabled)
|
|
124
|
-
return;
|
|
125
|
-
accessibleKeyDown(e, () => handleClick(e));
|
|
126
|
-
}, opacity: disabled ? 0.5 : 1 }, rest, { children: [jsx("title", {}), paths] })));
|
|
127
|
-
});
|
|
128
|
-
FileIcon.displayName = 'FileIcon';
|
|
129
|
-
|
|
130
|
-
export { FileIcon as F, FileIconNames as a };
|
|
@@ -1,161 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import React, { useCallback, useMemo } from 'react';
|
|
4
|
-
import { s as setStyle, a as accessibleKeyDown } from './utils-CZ1LWeN6.js';
|
|
5
|
-
import { F as FileIcon } from './FileIcon-Cxh-QsYb.js';
|
|
6
|
-
import { I as Icon } from './_types-RJ7q8S0B.js';
|
|
7
|
-
import { P as ProgressIndicator } from './ProgressIndicator-uI9BZwBB.js';
|
|
8
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
9
|
-
|
|
10
|
-
function nameAndExtension(fileName) {
|
|
11
|
-
var _a;
|
|
12
|
-
const ext = (_a = fileName.split('.').pop()) !== null && _a !== void 0 ? _a : 'unknown';
|
|
13
|
-
return { name: fileName, ext };
|
|
14
|
-
}
|
|
15
|
-
function fileIconName(extension) {
|
|
16
|
-
switch (extension) {
|
|
17
|
-
case 'png':
|
|
18
|
-
case 'jpeg':
|
|
19
|
-
case 'jpg':
|
|
20
|
-
case 'gif':
|
|
21
|
-
case 'heic':
|
|
22
|
-
return 'image';
|
|
23
|
-
case 'docx':
|
|
24
|
-
case 'doc':
|
|
25
|
-
case 'txt':
|
|
26
|
-
return 'text';
|
|
27
|
-
case 'md':
|
|
28
|
-
return 'md';
|
|
29
|
-
case 'html':
|
|
30
|
-
case 'js':
|
|
31
|
-
case 'ts':
|
|
32
|
-
case 'tsx':
|
|
33
|
-
case 'json':
|
|
34
|
-
case 'py':
|
|
35
|
-
return 'code';
|
|
36
|
-
case 'xls':
|
|
37
|
-
case 'xlsx':
|
|
38
|
-
case 'csv':
|
|
39
|
-
return 'sheet';
|
|
40
|
-
case 'ppt':
|
|
41
|
-
case 'pptx':
|
|
42
|
-
return 'preso';
|
|
43
|
-
case 'pdf':
|
|
44
|
-
return 'pdf';
|
|
45
|
-
case 'mp3':
|
|
46
|
-
case 'aif':
|
|
47
|
-
case 'wav':
|
|
48
|
-
return 'audio';
|
|
49
|
-
case 'mp4':
|
|
50
|
-
case 'mov':
|
|
51
|
-
return 'video';
|
|
52
|
-
case 'clipboard':
|
|
53
|
-
return 'clipboard';
|
|
54
|
-
default:
|
|
55
|
-
return 'other';
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
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}.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.FileList-module_wrapper__vsmK5 {\n\twidth: 100%;\n\toverflow: hidden;\n\tflex-wrap: var(--file-wrap);\n\tflex-direction: var(--file-direction) !important;\n\talign-items: flex-start !important;\n\tgap: var(--file-gap);\n\tuser-select: none;\n\t-webkit-user-select: none;\n}\n\n.FileList-module_file__TTDb9 {\n\tposition: relative;\n\tpadding: var(--file-padding) !important;\n\tborder: 1px solid var(--file-border-color);\n\tborder-radius: 4px;\n\toverflow: hidden;\n\tmin-height: max-content;\n\tmax-width: var(--file-max-width);\n\tmin-width: var(--file-min-width);\n\tcolor: var(--core-text-primary);\n\tbackground: transparent;\n\tgap: 4px;\n}\n\n/* file progress bar */\n.FileList-module_file__TTDb9::before {\n\tcontent: \"\";\n\tposition: absolute;\n\tbackground: var(--file-bg-color);\n\ttop: 0;\n\tbottom: 0;\n\tleft: 0;\n\twidth: var(--file-progress);\n\ttransition: width 1s ease-in-out 0s;\n\tz-index: 1;\n}\n\n.FileList-module_fileName__qFumz {\n\twidth: 100%;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\tword-break: break-all;\n\tdisplay: -webkit-box !important;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n\tz-index: 2;\n}\n\n.FileList-module_meta__cEeZM {\n\tflex: 1;\n\tmin-width: 0;\n\tgap: 2px;\n\tz-index: 2;\n}\n\n.FileList-module_status__gOq0Z {\n\tcolor: var(--core-text-secondary);\n\tline-height: 1.2;\n}\n\n.FileList-module_error__lwFza {\n\tcolor: var(--feedback-warning);\n}\n\n.FileList-module_fileIcon__a-lhL {\n\tmin-width: var(--file-icon-size);\n\tmin-height: var(--file-icon-size);\n\tmax-width: var(--file-icon-size);\n\tmax-height: var(--file-icon-size);\n\tz-index: 2;\n}\n\n.FileList-module_icon__IqQtu {\n\tmargin-left: 4px !important;\n\tmin-width: 20px;\n\tmin-height: 20px;\n\tmax-width: 20px;\n\tmax-height: 20px;\n\tcursor: pointer;\n\tz-index: 2;\n}\n\n.FileList-module_xs__E8BbI {\n}\n\n.FileList-module_s__hk4A- {\n}\n\n.FileList-module_m__3Fc4x {\n}\n\n.FileList-module_l__pS2TK {\n}\n\n.FileList-module_xl__NbbC5 {\n}\n";
|
|
60
|
-
var css = {"wrapper":"FileList-module_wrapper__vsmK5 flexBox-module_rowStart__nJZnW","file":"FileList-module_file__TTDb9 flexBox-module_rowStart__nJZnW","fileName":"FileList-module_fileName__qFumz flexBox-module_row__PWxbe","meta":"FileList-module_meta__cEeZM flexBox-module_columnStart__Kg8cV","status":"FileList-module_status__gOq0Z type-module_body-xs-regular__QWEzl","error":"FileList-module_error__lwFza","fileIcon":"FileList-module_fileIcon__a-lhL flexBox-module_row__PWxbe","icon":"FileList-module_icon__IqQtu flexBox-module_row__PWxbe","xs":"FileList-module_xs__E8BbI type-module_body-xs-regular__QWEzl","s":"FileList-module_s__hk4A- type-module_body-s-regular__8-FO-","m":"FileList-module_m__3Fc4x type-module_body-m-regular__Qtp5G","l":"FileList-module_l__pS2TK type-module_body-l-regular__Ar4d3","xl":"FileList-module_xl__NbbC5 type-module_body-xl-regular__zDf-z"};
|
|
61
|
-
styleInject(css_248z);
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* utility get file name from file item
|
|
65
|
-
*/
|
|
66
|
-
function fileNameFromItem(item) {
|
|
67
|
-
return typeof item.file === 'string' ? item.file : item.file.name;
|
|
68
|
-
}
|
|
69
|
-
/**
|
|
70
|
-
* cal progress as a percentage string
|
|
71
|
-
*/
|
|
72
|
-
function normalizeProgress(uploading, progress) {
|
|
73
|
-
if (progress === undefined || Number.isNaN(progress)) {
|
|
74
|
-
return uploading ? '0%' : '100%';
|
|
75
|
-
}
|
|
76
|
-
const percent = progress <= 1 ? progress * 100 : progress;
|
|
77
|
-
const clamped = Math.max(0, Math.min(100, percent));
|
|
78
|
-
return `${Math.round(clamped)}%`;
|
|
79
|
-
}
|
|
80
|
-
/**
|
|
81
|
-
* display the progress indicator if uploading
|
|
82
|
-
*/
|
|
83
|
-
function displayProgress(uploading) {
|
|
84
|
-
if (!uploading)
|
|
85
|
-
return { display: 'none' };
|
|
86
|
-
return { display: 'flex' };
|
|
87
|
-
}
|
|
88
|
-
/**
|
|
89
|
-
* display the remove button if not uploading
|
|
90
|
-
*/
|
|
91
|
-
function displayClose(uploading) {
|
|
92
|
-
if (!uploading)
|
|
93
|
-
return { display: 'flex' };
|
|
94
|
-
return { display: 'none' };
|
|
95
|
-
}
|
|
96
|
-
const FileList = React.memo((props) => {
|
|
97
|
-
const { files = [], onChange, onToolTip, maxWidth, minWidth, direction = 'row', padding, gap = 10, size = 's', iconSize = 24, bgColor, canRemove = true } = props, divAttributes = __rest(props, ["files", "onChange", "onToolTip", "maxWidth", "minWidth", "direction", "padding", "gap", "size", "iconSize", "bgColor", "canRemove"]);
|
|
98
|
-
// div attributes to add
|
|
99
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
100
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
101
|
-
const divClass = className ? ` ${className}` : '';
|
|
102
|
-
// convert file name to file item name, type
|
|
103
|
-
const fileNameToFileItem = useCallback((fileName) => {
|
|
104
|
-
const { ext, name } = nameAndExtension(fileName);
|
|
105
|
-
const icon = fileIconName(ext);
|
|
106
|
-
return { name, ext, icon };
|
|
107
|
-
}, []);
|
|
108
|
-
// memoize ready-to-render list
|
|
109
|
-
const displayList = useMemo(() => {
|
|
110
|
-
return files.map((item, index) => {
|
|
111
|
-
var _a;
|
|
112
|
-
const fileName = fileNameFromItem(item);
|
|
113
|
-
const fileMeta = fileNameToFileItem(fileName);
|
|
114
|
-
const progress = normalizeProgress(item.uploading, item.progress);
|
|
115
|
-
return Object.assign(Object.assign({}, fileMeta), { key: `${fileMeta.name}-${index}`, index, uploading: (_a = item.uploading) !== null && _a !== void 0 ? _a : false, progress, error: item.error });
|
|
116
|
-
});
|
|
117
|
-
}, [files, fileNameToFileItem]);
|
|
118
|
-
// remove items from the list
|
|
119
|
-
const handleRemove = useCallback((index) => {
|
|
120
|
-
const updated = files.filter((_, itemIndex) => itemIndex !== index);
|
|
121
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(updated);
|
|
122
|
-
}, [files, onChange]);
|
|
123
|
-
// show remove tooltip
|
|
124
|
-
const handleMouseOver = useCallback((e) => {
|
|
125
|
-
const toolTip = {
|
|
126
|
-
payload: { label: 'Remove file' },
|
|
127
|
-
ref: { current: e.currentTarget },
|
|
128
|
-
};
|
|
129
|
-
onToolTip === null || onToolTip === void 0 ? void 0 : onToolTip(toolTip);
|
|
130
|
-
}, [onToolTip]);
|
|
131
|
-
// hide remove tooltip
|
|
132
|
-
const handleMouseOut = useCallback(() => {
|
|
133
|
-
onToolTip === null || onToolTip === void 0 ? void 0 : onToolTip(null);
|
|
134
|
-
}, [onToolTip]);
|
|
135
|
-
// memo style vars
|
|
136
|
-
const cssVars = useMemo(() => {
|
|
137
|
-
return {
|
|
138
|
-
'--file-max-width': direction === 'column' ? '100%' : setStyle(maxWidth),
|
|
139
|
-
'--file-min-width': direction === 'column' && !minWidth ? '100%' : setStyle(minWidth),
|
|
140
|
-
'--file-gap': setStyle(gap),
|
|
141
|
-
'--file-direction': direction,
|
|
142
|
-
'--file-wrap': direction === 'column' ? 'nowrap' : 'wrap',
|
|
143
|
-
'--file-padding': padding ? setStyle(padding) : '4px 4px 4px 2px',
|
|
144
|
-
'--file-icon-size': setStyle(iconSize),
|
|
145
|
-
'--file-overflow': direction === 'column' ? 'unset' : 'hidden',
|
|
146
|
-
'--file-bg-color': bgColor !== null && bgColor !== void 0 ? bgColor : 'var(--core-surface-secondary)',
|
|
147
|
-
};
|
|
148
|
-
}, [maxWidth, gap, direction, minWidth, padding, iconSize, bgColor]);
|
|
149
|
-
// CSS var for then progress of each file
|
|
150
|
-
const fileCSSVars = useCallback((progress, error) => {
|
|
151
|
-
return {
|
|
152
|
-
'--file-progress': `${progress}`,
|
|
153
|
-
'--file-border-color': error
|
|
154
|
-
? 'var(--feedback-warning)'
|
|
155
|
-
: 'var(--core-outline-primary)',
|
|
156
|
-
};
|
|
157
|
-
}, []);
|
|
158
|
-
return (jsx("div", Object.assign({ className: `${css.wrapper}${divClass}`, style: Object.assign(Object.assign({}, divStyle), cssVars), id: divId }, rest, { children: displayList.map((i) => (jsxs("div", { className: `${css.file} ${css[size]}`, style: fileCSSVars(i.progress, i.error), children: [jsx("div", { className: css.fileIcon, children: jsx(FileIcon, { name: i.icon, size: iconSize }) }), jsxs("div", { className: css.meta, children: [jsx("div", { className: css.fileName, children: i.name }), i.error && (jsx("div", { className: `${css.status} ${i.error ? css.error : ''}`, children: i.error }))] }), jsx("div", { className: css.icon, style: displayProgress(i.uploading), children: jsx(ProgressIndicator, { inline: true, size: 20, show: i.uploading }) }), canRemove && (jsx("div", { className: css.icon, style: displayClose(i.uploading), role: 'button', "aria-label": 'remove file', onMouseOver: handleMouseOver, onMouseOut: handleMouseOut, onFocus: handleMouseOver, onBlur: handleMouseOut, onClick: () => handleRemove(i.index), onKeyDown: (e) => accessibleKeyDown(e, () => handleRemove(i.index)), tabIndex: 0, children: jsx(Icon, { name: 'x', style: { pointerEvents: 'none' } }) }))] }, i.key))) })));
|
|
159
|
-
});
|
|
160
|
-
|
|
161
|
-
export { FileList as F };
|
|
@@ -1,101 +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, { useMemo } from 'react';
|
|
5
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
6
|
-
|
|
7
|
-
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}.FlexDiv-module_flexDiv__VNfVQ {\n\t&::-webkit-scrollbar {\n\t\tbackground-color: var(--flex-div-bg);\n\t\twidth: 14px;\n\t}\n\n\t&::-webkit-scrollbar-track {\n\t\tbackground-color: var(--flex-div-scroll-border);\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground-color: var(--flex-div-scroll-handle);\n\t\tborder-radius: 20px;\n\t\tborder: 4px solid var(--flex-div-scroll-border);\n\t}\n\n\t&::-webkit-scrollbar-thumb:hover {\n\t\tbackground-color: var(--flex-div-scroll-handle-hover);\n\t\tborder-radius: 20px;\n\t\tborder: 4px solid var(--flex-div-scroll-border);\n\t\tcursor: default;\n\t}\n}\n";
|
|
8
|
-
var css = {"flexDiv":"FlexDiv-module_flexDiv__VNfVQ type-module_body-m-regular__Qtp5G"};
|
|
9
|
-
styleInject(css_248z);
|
|
10
|
-
|
|
11
|
-
// Extract helper functions outside component
|
|
12
|
-
function setSize(style, isHeight) {
|
|
13
|
-
if (typeof style === 'number')
|
|
14
|
-
return `${style}px`;
|
|
15
|
-
if (style === 'grow')
|
|
16
|
-
return 'unset';
|
|
17
|
-
if (style === 'fill')
|
|
18
|
-
return '100%';
|
|
19
|
-
if (style === 'fit')
|
|
20
|
-
return 'auto';
|
|
21
|
-
if (style === 'viewport')
|
|
22
|
-
return isHeight ? '100vh' : '100vw';
|
|
23
|
-
return style;
|
|
24
|
-
}
|
|
25
|
-
function setBox(style) {
|
|
26
|
-
if (typeof style === 'number')
|
|
27
|
-
return `${style}px`;
|
|
28
|
-
return style;
|
|
29
|
-
}
|
|
30
|
-
function setFlex(style) {
|
|
31
|
-
if (style === 'start' || style === 'top')
|
|
32
|
-
return 'flex-start';
|
|
33
|
-
if (style === 'end' || style === 'bottom')
|
|
34
|
-
return 'flex-end';
|
|
35
|
-
if (style === 'between')
|
|
36
|
-
return 'space-between';
|
|
37
|
-
return style;
|
|
38
|
-
}
|
|
39
|
-
const FlexDiv = React.memo(React.forwardRef((props, ref) => {
|
|
40
|
-
const { children, scrollY = false, scrollX = false, background = 'var(--core-surface-primary)', direction = 'column', alignItems = 'start', justify = 'start', height = 'fit', width = 'fill', maxWidth = undefined, centerSelf = undefined, wrap = false, reverse = false, padding = 0, margin = 0, absolute = false, flex, gap, variants, transition, animate, enter, exit, border, borderRadius, className, scrollHandle, scrollHandleHover } = props, divAttributes = __rest(props, ["children", "scrollY", "scrollX", "background", "direction", "alignItems", "justify", "height", "width", "maxWidth", "centerSelf", "wrap", "reverse", "padding", "margin", "absolute", "flex", "gap", "variants", "transition", "animate", "enter", "exit", "border", "borderRadius", "className", "scrollHandle", "scrollHandleHover"]);
|
|
41
|
-
const { id: divId, style: userStyle } = divAttributes, rest = __rest(divAttributes, ["id", "style"]);
|
|
42
|
-
const wrapperStyle = userStyle !== null && userStyle !== void 0 ? userStyle : {};
|
|
43
|
-
// Memoize layout
|
|
44
|
-
const style = useMemo(() => {
|
|
45
|
-
return {
|
|
46
|
-
display: 'flex',
|
|
47
|
-
position: `${absolute ? 'absolute' : 'relative'}`,
|
|
48
|
-
flexDirection: `${direction}${reverse ? '-reverse' : ''}`,
|
|
49
|
-
flexWrap: `${wrap ? 'wrap' : 'nowrap'}`,
|
|
50
|
-
justifyContent: `${setFlex(justify)}`,
|
|
51
|
-
alignItems: `${setFlex(alignItems)}`,
|
|
52
|
-
boxSizing: 'border-box',
|
|
53
|
-
padding: `${setBox(padding)}`,
|
|
54
|
-
margin: centerSelf ? '0 auto' : `${setBox(margin)}`,
|
|
55
|
-
width: `${absolute ? 'unset' : setSize(width, false)}`,
|
|
56
|
-
height: `${absolute ? 'unset' : setSize(height, true)}`,
|
|
57
|
-
maxWidth: `${maxWidth ? setSize(maxWidth, false) : 'unset'}`,
|
|
58
|
-
flex: `${absolute ? 'unset' : (flex !== null && flex !== void 0 ? flex : 'unset')}`,
|
|
59
|
-
top: `${absolute ? '0' : 'unset'}`,
|
|
60
|
-
bottom: `${absolute ? '0' : 'unset'}`,
|
|
61
|
-
left: `${absolute ? '0' : 'unset'}`,
|
|
62
|
-
right: `${absolute ? '0' : 'unset'}`,
|
|
63
|
-
gap: gap ? `${gap}px` : 'unset',
|
|
64
|
-
border: `${border !== null && border !== void 0 ? border : 'unset'}`,
|
|
65
|
-
background: `${background !== null && background !== void 0 ? background : 'transparent'}`,
|
|
66
|
-
overflow: 'hidden',
|
|
67
|
-
overflowY: `${scrollY ? 'auto' : 'unset'}`,
|
|
68
|
-
overflowX: `${scrollX ? 'auto' : 'unset'}`,
|
|
69
|
-
borderRadius: borderRadius ? `${borderRadius}px` : 'unset',
|
|
70
|
-
color: 'var(--core-text-primary)',
|
|
71
|
-
'--flex-div-scroll-border': `${background !== null && background !== void 0 ? background : 'transparent'}`,
|
|
72
|
-
'--flex-div-scroll-handle': `${scrollHandle !== null && scrollHandle !== void 0 ? scrollHandle : 'var(--scroll-bar)'}`,
|
|
73
|
-
'--flex-div-scroll-handle-hover': `${scrollHandleHover !== null && scrollHandleHover !== void 0 ? scrollHandleHover : 'var(--scroll-bar-hover)'}`,
|
|
74
|
-
};
|
|
75
|
-
}, [
|
|
76
|
-
absolute,
|
|
77
|
-
direction,
|
|
78
|
-
reverse,
|
|
79
|
-
wrap,
|
|
80
|
-
justify,
|
|
81
|
-
alignItems,
|
|
82
|
-
padding,
|
|
83
|
-
margin,
|
|
84
|
-
width,
|
|
85
|
-
height,
|
|
86
|
-
flex,
|
|
87
|
-
gap,
|
|
88
|
-
border,
|
|
89
|
-
background,
|
|
90
|
-
scrollY,
|
|
91
|
-
scrollX,
|
|
92
|
-
centerSelf,
|
|
93
|
-
maxWidth,
|
|
94
|
-
scrollHandle,
|
|
95
|
-
scrollHandleHover,
|
|
96
|
-
borderRadius,
|
|
97
|
-
]);
|
|
98
|
-
return (jsx(motion.div, Object.assign({ id: divId, ref: ref, className: `${css.flexDiv} ${className !== null && className !== void 0 ? className : ''}`, style: Object.assign(Object.assign({}, wrapperStyle), style), transition: transition, variants: variants, initial: enter, animate: animate, exit: exit }, rest, { children: children })));
|
|
99
|
-
}));
|
|
100
|
-
|
|
101
|
-
export { FlexDiv as F };
|
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import { useAnimate } from 'motion/react';
|
|
4
|
-
import React, { useState, useEffect, useCallback, useMemo } from 'react';
|
|
5
|
-
import { useTheme } from '../hooks/useTheme.js';
|
|
6
|
-
import '../theme/colors.js';
|
|
7
|
-
import '../hooks/useWindow.js';
|
|
8
|
-
import { B as Badge } from './Badge-DtxDLSO0.js';
|
|
9
|
-
import { I as Icon } from './_types-RJ7q8S0B.js';
|
|
10
|
-
import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
|
|
11
|
-
|
|
12
|
-
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}.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.Grouper-module_header__NPgUW {\n\twidth: 100%;\n\tcursor: pointer;\n}\n\n.Grouper-module_title__-bt06 {\n\tcolor: var(--core-text-primary);\n\tflex: 1;\n}\n\n.Grouper-module_content__u2SN7 {\n\tuser-select: none;\n\t-webkit-user-select: none;\n\tpadding: 0 24px !important;\n\twidth: 100%;\n\tgap: 6px;\n\theight: var(--grouper-height);\n\tborder-top: var(--grouper-border) solid var(--core-outline-primary);\n}\n\n.Grouper-module_icon__7YSLa {\n\tmin-height: var(--grouper-icon-size);\n\theight: var(--grouper-icon-size);\n\tmin-width: var(--grouper-icon-size);\n\twidth: var(--grouper-icon-size);\n}\n";
|
|
13
|
-
var css = {"header":"Grouper-module_header__NPgUW flexBox-module_rowBetween__27lKK","title":"Grouper-module_title__-bt06 flexBox-module_rowBetween__27lKK type-module_body-m-regular__Qtp5G","content":"Grouper-module_content__u2SN7 flexBox-module_rowBetween__27lKK","icon":"Grouper-module_icon__7YSLa flexBox-module_row__PWxbe"};
|
|
14
|
-
styleInject(css_248z);
|
|
15
|
-
|
|
16
|
-
const Grouper = React.memo((props) => {
|
|
17
|
-
const { title = 'Group Title', toggle = true, open = true, hasIcon = true, iconName = 'chevron down', iconSize = 18, frameSize = 64, border = 0, count = 0, unframed = false, hideNull = true, showFilterBadge = false, onChange = () => null, onClick = () => null } = props, divAttributes = __rest(props, ["title", "toggle", "open", "hasIcon", "iconName", "iconSize", "frameSize", "border", "count", "unframed", "hideNull", "showFilterBadge", "onChange", "onClick"]);
|
|
18
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
19
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
20
|
-
const divClass = className ? ` ${className}` : '';
|
|
21
|
-
const theme = useTheme();
|
|
22
|
-
const [state, setState] = useState(open);
|
|
23
|
-
const [icon, animateIcon] = useAnimate();
|
|
24
|
-
useEffect(() => setState(open), [open]);
|
|
25
|
-
const animate = useCallback((state) => {
|
|
26
|
-
const animation = { rotate: state ? 0 : 180 };
|
|
27
|
-
animateIcon(icon.current, Object.assign({}, animation), { ease: 'easeInOut', duration: 0.25 });
|
|
28
|
-
}, [animateIcon, icon]);
|
|
29
|
-
const handleToggle = useCallback(() => {
|
|
30
|
-
if (!toggle)
|
|
31
|
-
return;
|
|
32
|
-
onClick();
|
|
33
|
-
onChange(!state);
|
|
34
|
-
animate(!state);
|
|
35
|
-
setState(!state);
|
|
36
|
-
}, [toggle, onClick, onChange, state, animate]);
|
|
37
|
-
// memo css vars
|
|
38
|
-
const cssVars = useMemo(() => {
|
|
39
|
-
return {
|
|
40
|
-
'--grouper-height': unframed ? 'auto' : `${frameSize}px`,
|
|
41
|
-
'--grouper-border': border ? `${border}px` : '0',
|
|
42
|
-
'--grouper-icon-size': `${iconSize}px`,
|
|
43
|
-
};
|
|
44
|
-
}, [frameSize, iconSize, border, unframed]);
|
|
45
|
-
return (jsx("div", Object.assign({ id: divId, className: `${css.header}${divClass}`, style: Object.assign(Object.assign({}, divStyle), cssVars), onClick: handleToggle, onKeyDown: handleToggle }, rest, { children: jsxs("div", { className: css.content, children: [jsxs("div", { className: css.title, children: [title, jsx(Badge, { hideNull: hideNull, count: count, variant: 'light' }), showFilterBadge && (jsx(Icon, { name: "filter", size: 16, strokeColor: theme.current.colors['core-text-disabled'] }))] }), hasIcon && (jsx("div", { ref: icon, className: css.icon, children: jsx(Icon, { name: iconName, size: iconSize }) }))] }) })));
|
|
46
|
-
});
|
|
47
|
-
|
|
48
|
-
export { Grouper as G };
|
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
import { _ as __rest } from './tslib.es6-0pkUdtrF.js';
|
|
2
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { motion } from 'motion/react';
|
|
4
|
-
import React, { useState, useRef, useEffect, useCallback, useMemo } from 'react';
|
|
5
|
-
import { B as Badge } from './Badge-DtxDLSO0.js';
|
|
6
|
-
import { D as Dot } from './Dot-BZcEZbnm.js';
|
|
7
|
-
import { I as Icon } from './_types-RJ7q8S0B.js';
|
|
8
|
-
import { T as ToolTipType } from './sharedTypes-BfZzG1KX.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}.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.IconButton-module_button__Mq4Gd {\n\tposition: relative;\n\tbackground: var(--ib-bg);\n\tborder-radius: var(--ib-border-radius);\n\tborder: var(--ib-border) solid var(--core-outline-primary);\n\tgap: 6px;\n\tcursor: pointer;\n\t&:hover {\n\t\tbackground: var(--ib-bg-hover);\n\t}\n}\n\n.IconButton-module_label__piWOE {\n\tcolor: var(--ib-color);\n\ttext-overflow: ellipsis;\n\toverflow: hidden;\n\tword-break: break-all;\n\tdisplay: -webkit-box;\n\t-webkit-line-clamp: 1;\n\t-webkit-box-orient: vertical;\n}\n\n.IconButton-module_icon__EQ8vW {\n\tmin-height: var(--ib-icon-size);\n\theight: var(--ib-icon-size);\n\tmin-width: var(--ib-icon-size);\n\twidth: var(--ib-icon-size);\n}\n\n.IconButton-module_count__BhOlH {\n\tposition: absolute;\n\ttop: 0;\n\tright: 0;\n\ttransform: translateX(5px) translateY(-2px);\n}\n";
|
|
12
|
-
var css = {"button":"IconButton-module_button__Mq4Gd flexBox-module_row__PWxbe","label":"IconButton-module_label__piWOE flexBox-module_row__PWxbe type-module_body-l-regular__Ar4d3","icon":"IconButton-module_icon__EQ8vW flexBox-module_row__PWxbe","count":"IconButton-module_count__BhOlH flexBox-module_row__PWxbe"};
|
|
13
|
-
styleInject(css_248z);
|
|
14
|
-
|
|
15
|
-
const IconButton = React.memo((props) => {
|
|
16
|
-
const { frameSize = 36, iconSize = 20, icon = 'more', borderRadius = 4, tooltip = undefined, color = undefined, colorOn = undefined, bgColor = 'var(--core-surface-secondary)', bgColorHover = 'var(--core-outline-primary)', bgColorOn = 'var(--core-outline-primary)', transition = undefined, variants = undefined, initial = undefined, animate = undefined, exit = undefined, fillColor = undefined, label = undefined, hover = undefined, count = 0, toggle = true, toggleIcon = false, isToggled = false, disabled = false, showDot = false, border = false, onClick = () => null, onToolTip = () => null } = props, divAttributes = __rest(props, ["frameSize", "iconSize", "icon", "borderRadius", "tooltip", "color", "colorOn", "bgColor", "bgColorHover", "bgColorOn", "transition", "variants", "initial", "animate", "exit", "fillColor", "label", "hover", "count", "toggle", "toggleIcon", "isToggled", "disabled", "showDot", "border", "onClick", "onToolTip"]);
|
|
17
|
-
const { id: divId, className, style } = divAttributes, rest = __rest(divAttributes, ["id", "className", "style"]);
|
|
18
|
-
const divStyle = style !== null && style !== void 0 ? style : {};
|
|
19
|
-
const divClass = className ? ` ${className}` : '';
|
|
20
|
-
const [on, setOn] = useState(isToggled);
|
|
21
|
-
const ref = useRef(null);
|
|
22
|
-
useEffect(() => setOn(isToggled), [isToggled]);
|
|
23
|
-
const handleClick = useCallback((e) => {
|
|
24
|
-
if (disabled)
|
|
25
|
-
return;
|
|
26
|
-
if (tooltip)
|
|
27
|
-
onToolTip(null);
|
|
28
|
-
setOn(!on);
|
|
29
|
-
onClick(e);
|
|
30
|
-
}, [disabled, tooltip, onToolTip, on, onClick]);
|
|
31
|
-
const handleMouseEnter = useCallback((e) => {
|
|
32
|
-
if (!(ref === null || ref === void 0 ? void 0 : ref.current) || !tooltip)
|
|
33
|
-
return;
|
|
34
|
-
const tip = {
|
|
35
|
-
type: ToolTipType.button,
|
|
36
|
-
payload: { label: tooltip },
|
|
37
|
-
event: e,
|
|
38
|
-
ref: ref,
|
|
39
|
-
};
|
|
40
|
-
onToolTip(tip);
|
|
41
|
-
}, [tooltip, onToolTip]);
|
|
42
|
-
const handleMouseLeave = useCallback(() => {
|
|
43
|
-
if (tooltip)
|
|
44
|
-
onToolTip(null);
|
|
45
|
-
}, [tooltip, onToolTip]);
|
|
46
|
-
// memo icon stroke color
|
|
47
|
-
const strokeColor = useMemo(() => color || 'var(--core-icon-primary)', [color]);
|
|
48
|
-
// memo bg color
|
|
49
|
-
const bgColorNormal = useMemo(() => {
|
|
50
|
-
if (on && toggle)
|
|
51
|
-
return bgColorOn;
|
|
52
|
-
return bgColor !== null && bgColor !== void 0 ? bgColor : 'var(--core-surface-secondary)';
|
|
53
|
-
}, [toggle, bgColorOn, bgColor, on]);
|
|
54
|
-
// memo bg color on hover
|
|
55
|
-
const bgHoverColor = useMemo(() => {
|
|
56
|
-
if (hover && on)
|
|
57
|
-
return bgColorOn;
|
|
58
|
-
if (hover)
|
|
59
|
-
return bgColorHover;
|
|
60
|
-
return bgColor !== null && bgColor !== void 0 ? bgColor : 'transparent';
|
|
61
|
-
}, [hover, bgColor, bgColorOn, bgColorHover, on]);
|
|
62
|
-
// memo text color selected / unselected
|
|
63
|
-
const textColor = useMemo(() => {
|
|
64
|
-
if (toggle && on)
|
|
65
|
-
return colorOn;
|
|
66
|
-
return color !== null && color !== void 0 ? color : 'var(--core-text-primary)';
|
|
67
|
-
}, [toggle, on, colorOn, color]);
|
|
68
|
-
// memo css vars
|
|
69
|
-
const cssVars = useMemo(() => {
|
|
70
|
-
return {
|
|
71
|
-
'--ib-bg': bgColorNormal,
|
|
72
|
-
'--ib-bg-hover': bgHoverColor,
|
|
73
|
-
'--ib-icon-size': `${frameSize !== null && frameSize !== void 0 ? frameSize : 0}px`,
|
|
74
|
-
'--ib-border-radius': `${borderRadius !== null && borderRadius !== void 0 ? borderRadius : 0}px`,
|
|
75
|
-
'--ib-border': border ? '1px' : 0,
|
|
76
|
-
'--ib-color': textColor,
|
|
77
|
-
};
|
|
78
|
-
}, [bgColorNormal, bgHoverColor, textColor, border, frameSize, borderRadius]);
|
|
79
|
-
return (jsxs(motion.div, Object.assign({ id: divId, className: `${css.button}${divClass}`, style: Object.assign(Object.assign({}, divStyle), cssVars), onClick: handleClick, onMouseLeave: handleMouseLeave, onMouseEnter: handleMouseEnter, transition: transition, variants: variants, initial: initial, animate: animate, exit: exit, ref: ref }, rest, { children: [jsx("div", { className: css.icon, style: { opacity: disabled ? 0.3 : 1 }, children: jsx(Icon, { name: icon, strokeColor: strokeColor, fillColor: fillColor, disabled: disabled, size: iconSize, toggle: toggleIcon ? isToggled : false, pointer: true }) }), label && jsx("div", { className: css.label, children: label }), jsx(Dot, { show: showDot }), count !== 0 && (jsx("div", { className: css.count, children: jsx(Badge, { variant: 'light', count: count, hideNull: true }) }))] })));
|
|
80
|
-
});
|
|
81
|
-
|
|
82
|
-
export { IconButton as I };
|