@koine/react 1.1.10 → 1.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Alert/Alert.js +12 -8
- package/Alert/Alert.mjs +10 -0
- package/Alert/index.js +4 -1
- package/Alert/index.mjs +1 -0
- package/Alert/package.json +2 -2
- package/Animations/Reveal.js +18 -14
- package/Animations/Reveal.mjs +17 -0
- package/Animations/Underline.js +7 -4
- package/Animations/Underline.mjs +5 -0
- package/Animations/index.js +6 -3
- package/Animations/index.mjs +3 -0
- package/Animations/package.json +2 -2
- package/Animations/useReveal.js +11 -7
- package/{node/Animations/useReveal.js → Animations/useReveal.mjs} +7 -11
- package/Autocomplete/AutocompleteDownshift.js +4 -1
- package/{node/Autocomplete/AutocompleteDownshift.js → Autocomplete/AutocompleteDownshift.mjs} +1 -4
- package/Autocomplete/AutocompleteDownshiftMultiselect.js +4 -1
- package/{node/Autocomplete/AutocompleteDownshiftMultiselect.js → Autocomplete/AutocompleteDownshiftMultiselect.mjs} +1 -4
- package/Autocomplete/AutocompleteMui.js +33 -35
- package/{node/Autocomplete/AutocompleteMui.js → Autocomplete/AutocompleteMui.mjs} +35 -33
- package/Autocomplete/AutocompleteReach.js +4 -1
- package/{node/Autocomplete/AutocompleteReach.js → Autocomplete/AutocompleteReach.mjs} +1 -4
- package/Autocomplete/components.js +25 -22
- package/Autocomplete/components.mjs +34 -0
- package/Autocomplete/helpers.js +11 -6
- package/{node/Autocomplete/helpers.js → Autocomplete/helpers.mjs} +6 -11
- package/Autocomplete/index.js +5 -1
- package/Autocomplete/index.mjs +3 -0
- package/Autocomplete/package.json +2 -2
- package/Bg/BgColor.js +14 -10
- package/Bg/BgColor.mjs +21 -0
- package/Bg/BgPhoto.js +13 -9
- package/Bg/BgPhoto.mjs +16 -0
- package/Bg/BgSvg.js +10 -6
- package/Bg/BgSvg.mjs +12 -0
- package/Bg/index.js +6 -3
- package/Bg/index.mjs +3 -0
- package/Bg/package.json +2 -2
- package/Breadcrumbs/Breadcrumbs.js +22 -18
- package/Breadcrumbs/Breadcrumbs.mjs +27 -0
- package/Breadcrumbs/index.js +4 -1
- package/Breadcrumbs/index.mjs +1 -0
- package/Breadcrumbs/package.json +2 -2
- package/Buttons/Button.js +12 -9
- package/Buttons/Button.mjs +14 -0
- package/Buttons/ButtonComposite.js +20 -16
- package/Buttons/ButtonComposite.mjs +28 -0
- package/Buttons/ButtonFab.js +8 -5
- package/Buttons/ButtonFab.mjs +6 -0
- package/Buttons/ButtonLink.js +12 -8
- package/Buttons/ButtonLink.mjs +11 -0
- package/Buttons/IconButton.js +9 -6
- package/Buttons/IconButton.mjs +7 -0
- package/Buttons/index.js +8 -5
- package/Buttons/index.mjs +5 -0
- package/Buttons/package.json +2 -2
- package/Calendar/CalendarDaygridCell.js +16 -12
- package/{node/Calendar/CalendarDaygridCell.js → Calendar/CalendarDaygridCell.mjs} +12 -16
- package/Calendar/CalendarDaygridNav.js +14 -9
- package/Calendar/CalendarDaygridNav.mjs +23 -0
- package/Calendar/CalendarDaygridTable.js +23 -19
- package/{node/Calendar/CalendarDaygridTable.js → Calendar/CalendarDaygridTable.mjs} +19 -23
- package/Calendar/CalendarLegend.js +9 -5
- package/Calendar/CalendarLegend.mjs +16 -0
- package/Calendar/calendar-api-google.js +27 -23
- package/{node/Calendar/calendar-api-google.js → Calendar/calendar-api-google.mjs} +23 -27
- package/Calendar/index.js +9 -6
- package/Calendar/index.mjs +6 -0
- package/Calendar/package.json +2 -2
- package/Calendar/types.js +2 -1
- package/Calendar/types.mjs +1 -0
- package/Calendar/useCalendar.js +43 -39
- package/{node/Calendar/useCalendar.js → Calendar/useCalendar.mjs} +39 -43
- package/Calendar/utils.js +44 -31
- package/{node/Calendar/utils.js → Calendar/utils.mjs} +31 -44
- package/Carousel/Carousel.js +4 -1
- package/{node/Carousel/Carousel.js → Carousel/Carousel.mjs} +1 -4
- package/Carousel/CarouselCss.js +17 -13
- package/Carousel/CarouselCss.mjs +22 -0
- package/Carousel/index.js +4 -1
- package/Carousel/index.mjs +1 -0
- package/Carousel/package.json +2 -2
- package/Collapsable/Collapsable.js +4 -1
- package/Collapsable/Collapsable.mjs +1 -0
- package/{node/Collapsable/CollapsableReach.js → Collapsable/CollapsableReach.mjs} +0 -0
- package/Collapsable/index.js +4 -1
- package/Collapsable/index.mjs +2 -0
- package/Collapsable/package.json +2 -2
- package/Debug/Debug.js +10 -6
- package/Debug/Debug.mjs +9 -0
- package/Debug/index.js +4 -1
- package/Debug/index.mjs +1 -0
- package/Debug/package.json +2 -2
- package/Details/Details.js +30 -27
- package/Details/Details.mjs +63 -0
- package/Details/index.js +4 -1
- package/Details/index.mjs +1 -0
- package/Details/package.json +2 -2
- package/Dialog/DialogMui.js +28 -25
- package/{node/Dialog/DialogMui.js → Dialog/DialogMui.mjs} +25 -28
- package/Dialog/css/bare.js +21 -18
- package/Dialog/css/bare.mjs +21 -0
- package/Dialog/index.js +5 -1
- package/Dialog/index.mjs +1 -0
- package/Dialog/m/bare.js +26 -23
- package/Dialog/m/bare.mjs +52 -0
- package/Dialog/m/basic.js +7 -3
- package/{node/Dialog/m/basic.js → Dialog/m/basic.mjs} +3 -7
- package/Dialog/m/index.js +7 -3
- package/Dialog/m/index.mjs +4 -0
- package/Dialog/m/package.json +2 -2
- package/Dialog/package.json +2 -2
- package/Dialog/sc/bare.js +24 -21
- package/Dialog/sc/bare.mjs +43 -0
- package/Dialog/sc/framer.js +18 -15
- package/Dialog/sc/framer.mjs +16 -0
- package/Dialog/sc/framerMaterial.js +18 -15
- package/Dialog/sc/framerMaterial.mjs +16 -0
- package/Dialog/sc/material.js +22 -19
- package/Dialog/sc/material.mjs +21 -0
- package/Dialog/tw/bare.js +21 -18
- package/Dialog/tw/bare.mjs +42 -0
- package/Dialog/tw/elegant.js +21 -18
- package/Dialog/tw/elegant.mjs +20 -0
- package/Dialog/tw/framer.js +18 -15
- package/Dialog/tw/framer.mjs +16 -0
- package/Dialog/tw/framerMaterial.js +18 -15
- package/Dialog/tw/framerMaterial.mjs +16 -0
- package/Dialog/tw/material.js +21 -18
- package/Dialog/tw/material.mjs +20 -0
- package/Editor/Editor--tiptap.js +20 -15
- package/Editor/Editor--tiptap.mjs +26 -0
- package/Editor/components.js +14 -9
- package/Editor/components.mjs +10 -0
- package/Editor/index.js +4 -1
- package/Editor/index.mjs +1 -0
- package/Editor/package.json +2 -2
- package/FaviconTags/FaviconTags.js +8 -4
- package/FaviconTags/FaviconTags.mjs +16 -0
- package/FaviconTags/index.js +7 -2
- package/FaviconTags/index.mjs +2 -0
- package/FaviconTags/package.json +2 -2
- package/Form/Form.js +27 -23
- package/Form/Form.mjs +61 -0
- package/Form/index.js +4 -1
- package/Form/index.mjs +1 -0
- package/Form/package.json +2 -2
- package/Form/sc/bare.js +21 -18
- package/Form/sc/bare.mjs +20 -0
- package/Forms/Checkbox/Checkbox.js +16 -13
- package/Forms/Checkbox/Checkbox.mjs +18 -0
- package/Forms/Checkbox/index.js +4 -1
- package/Forms/Checkbox/index.mjs +1 -0
- package/Forms/Checkbox/package.json +2 -2
- package/Forms/Feedback/Feedback.js +10 -6
- package/Forms/Feedback/Feedback.mjs +9 -0
- package/Forms/Feedback/index.js +4 -1
- package/Forms/Feedback/index.mjs +1 -0
- package/Forms/Feedback/package.json +2 -2
- package/Forms/Field/Field.js +14 -10
- package/Forms/Field/Field.mjs +31 -0
- package/Forms/Field/FieldControl.js +18 -14
- package/Forms/Field/FieldControl.mjs +47 -0
- package/Forms/Field/FieldHint.js +6 -3
- package/Forms/Field/FieldHint.mjs +4 -0
- package/Forms/Field/index.js +5 -2
- package/Forms/Field/index.mjs +2 -0
- package/Forms/Field/package.json +2 -2
- package/Forms/Input/Input.js +17 -14
- package/Forms/Input/Input.mjs +17 -0
- package/Forms/Input/index.js +4 -1
- package/Forms/Input/index.mjs +1 -0
- package/Forms/Input/package.json +2 -2
- package/Forms/InputGroup/InputGroup.js +17 -13
- package/Forms/InputGroup/InputGroup.mjs +15 -0
- package/Forms/InputGroup/index.js +4 -1
- package/Forms/InputGroup/index.mjs +1 -0
- package/Forms/InputGroup/package.json +2 -2
- package/Forms/Label/Label.js +8 -5
- package/Forms/Label/Label.mjs +6 -0
- package/Forms/Label/index.js +4 -1
- package/Forms/Label/index.mjs +1 -0
- package/Forms/Label/package.json +2 -2
- package/Forms/Password/Password.js +17 -14
- package/Forms/Password/Password.mjs +17 -0
- package/Forms/Password/index.js +4 -1
- package/Forms/Password/index.mjs +1 -0
- package/Forms/Password/package.json +2 -2
- package/Forms/Radio/Radio.js +22 -19
- package/Forms/Radio/Radio.mjs +25 -0
- package/Forms/Radio/index.js +4 -1
- package/Forms/Radio/index.mjs +1 -0
- package/Forms/Radio/package.json +2 -2
- package/Forms/Switch/Switch.js +16 -13
- package/Forms/Switch/Switch.mjs +20 -0
- package/Forms/Switch/index.js +4 -1
- package/Forms/Switch/index.mjs +1 -0
- package/Forms/Switch/package.json +2 -2
- package/Forms/Textarea/Textarea.js +13 -10
- package/Forms/Textarea/Textarea.mjs +12 -0
- package/Forms/Textarea/TextareaRich.js +15 -12
- package/Forms/Textarea/TextareaRich.mjs +28 -0
- package/Forms/Textarea/index.js +5 -2
- package/Forms/Textarea/index.mjs +2 -0
- package/Forms/Textarea/package.json +2 -2
- package/{node/Forms/Toggle/Toggle-tailwind.js → Forms/Toggle/Toggle-tailwind.mjs} +0 -0
- package/Forms/Toggle/Toggle.js +26 -21
- package/Forms/Toggle/Toggle.mjs +31 -0
- package/Forms/Toggle/index.js +4 -1
- package/Forms/Toggle/index.mjs +1 -0
- package/Forms/Toggle/package.json +2 -2
- package/{node/Forms/Toggle/useToggle-tailwind.js → Forms/Toggle/useToggle-tailwind.mjs} +0 -0
- package/Forms/Toggle/useToggle.js +19 -15
- package/{node/Forms/Toggle/useToggle.js → Forms/Toggle/useToggle.mjs} +15 -19
- package/Forms/antispam.js +16 -10
- package/{node/Forms/antispam.js → Forms/antispam.mjs} +10 -16
- package/Forms/helpers.js +16 -8
- package/{node/Forms/helpers.js → Forms/helpers.mjs} +8 -16
- package/Forms/index.js +18 -15
- package/Forms/index.mjs +16 -0
- package/Forms/package.json +2 -2
- package/Forms/styles.js +19 -16
- package/Forms/styles.mjs +29 -0
- package/Gauge/Gauge.js +5 -1
- package/{node/Gauge/Gauge.js → Gauge/Gauge.mjs} +1 -5
- package/Grid/Grid.js +13 -10
- package/Grid/Grid.mjs +53 -0
- package/Grid/index.js +4 -1
- package/Grid/index.mjs +1 -0
- package/Grid/package.json +2 -2
- package/Hamburger/Hamburger.js +11 -7
- package/Hamburger/Hamburger.mjs +52 -0
- package/Hamburger/index.js +4 -1
- package/Hamburger/index.mjs +1 -0
- package/Hamburger/package.json +2 -2
- package/Header/index.js +4 -1
- package/Header/index.mjs +1 -0
- package/Header/package.json +2 -2
- package/Header/useHeader.js +18 -14
- package/Header/useHeader.mjs +31 -0
- package/Hidden/Hidden.js +6 -3
- package/Hidden/Hidden.mjs +10 -0
- package/Hidden/index.js +4 -1
- package/Hidden/index.mjs +1 -0
- package/Hidden/package.json +2 -2
- package/Img/index.js +4 -1
- package/Img/index.mjs +1 -0
- package/Img/package.json +2 -2
- package/Img/sc/bare.js +6 -3
- package/{node/Img/sc/bare.js → Img/sc/bare.mjs} +3 -6
- package/Img/types.js +2 -1
- package/Img/types.mjs +1 -0
- package/Link/Link.js +6 -3
- package/Link/Link.mjs +4 -0
- package/Link/LinkBlank.js +15 -11
- package/Link/LinkBlank.mjs +17 -0
- package/Link/index.js +5 -2
- package/Link/index.mjs +2 -0
- package/Link/package.json +2 -2
- package/Menu/Menu.js +6 -3
- package/Menu/Menu.mjs +4 -0
- package/Menu/MenuMui.js +29 -26
- package/Menu/MenuMui.mjs +75 -0
- package/Menu/index.js +4 -1
- package/Menu/index.mjs +1 -0
- package/Menu/package.json +2 -2
- package/MenuItem/MenuItem.js +6 -3
- package/MenuItem/MenuItem.mjs +4 -0
- package/MenuItem/MenuItemMui.js +13 -10
- package/MenuItem/MenuItemMui.mjs +15 -0
- package/MenuItem/index.js +4 -1
- package/MenuItem/index.mjs +1 -0
- package/MenuItem/package.json +2 -2
- package/MenuItem/useMenuItem.js +20 -16
- package/{node/MenuItem/useMenuItem.js → MenuItem/useMenuItem.mjs} +16 -20
- package/Meta/Meta.js +8 -4
- package/Meta/Meta.mjs +6 -0
- package/Meta/index.js +7 -2
- package/Meta/index.mjs +2 -0
- package/Meta/package.json +2 -2
- package/NoJs/NoJs.js +8 -4
- package/NoJs/NoJs.mjs +7 -0
- package/NoJs/index.js +7 -2
- package/NoJs/index.mjs +2 -0
- package/NoJs/package.json +2 -2
- package/Pagination/PaginationNav.js +22 -18
- package/Pagination/PaginationNav.mjs +61 -0
- package/Pagination/PaginationResults.js +12 -8
- package/Pagination/PaginationResults.mjs +11 -0
- package/Pagination/index.js +5 -2
- package/Pagination/index.mjs +2 -0
- package/Pagination/package.json +2 -2
- package/Pill/Pill.js +9 -6
- package/Pill/Pill.mjs +7 -0
- package/Pill/index.js +4 -1
- package/Pill/index.mjs +1 -0
- package/Pill/package.json +2 -2
- package/Progress/ProgressCircular.js +14 -10
- package/Progress/ProgressCircular.mjs +15 -0
- package/Progress/ProgressLinear.js +13 -9
- package/Progress/ProgressLinear.mjs +24 -0
- package/Progress/ProgressOverlay.js +20 -16
- package/Progress/ProgressOverlay.mjs +24 -0
- package/Progress/index.js +6 -3
- package/Progress/index.mjs +3 -0
- package/Progress/package.json +2 -2
- package/Rating/Rating.js +26 -21
- package/Rating/Rating.mjs +70 -0
- package/Rating/index.js +13 -5
- package/{node/Rating/index.js → Rating/index.mjs} +5 -13
- package/Rating/package.json +2 -2
- package/Select/SelectDownshift.js +4 -1
- package/{node/Select/SelectDownshift.js → Select/SelectDownshift.mjs} +1 -4
- package/Select/components.js +13 -10
- package/Select/components.mjs +12 -0
- package/Select/index.js +5 -1
- package/Select/index.mjs +3 -0
- package/Select/package.json +2 -2
- package/Sidebar/Sidebar.js +21 -17
- package/Sidebar/Sidebar.mjs +23 -0
- package/Sidebar/index.js +4 -1
- package/Sidebar/index.mjs +1 -0
- package/Sidebar/package.json +2 -2
- package/Spacing/Spacing.js +15 -11
- package/Spacing/Spacing.mjs +45 -0
- package/Spacing/index.js +4 -1
- package/Spacing/index.mjs +1 -0
- package/Spacing/package.json +2 -2
- package/Sticky/Sticky.js +4 -1
- package/{node/Sticky/Sticky.js → Sticky/Sticky.mjs} +1 -4
- package/Sticky/StickyCss.js +9 -5
- package/Sticky/StickyCss.mjs +6 -0
- package/Sticky/index.js +4 -1
- package/Sticky/index.mjs +1 -0
- package/Sticky/package.json +2 -2
- package/Tabs/TabsMui.js +28 -25
- package/Tabs/TabsMui.mjs +46 -0
- package/Tabs/index.js +4 -1
- package/Tabs/index.mjs +1 -0
- package/Tabs/package.json +2 -2
- package/{node/Tabs/sc/bare.js → Tabs/sc/bare.mjs} +0 -0
- package/Tabs/tw/bare.js +17 -14
- package/Tabs/tw/bare.mjs +17 -0
- package/Tabs/tw/material.js +17 -14
- package/Tabs/tw/material.mjs +18 -0
- package/Tabs/useTabs.js +12 -8
- package/{node/Tabs/useTabs.js → Tabs/useTabs.mjs} +8 -12
- package/Typography/CopyPasteVisible.js +6 -3
- package/Typography/CopyPasteVisible.mjs +4 -0
- package/Typography/Native.js +16 -13
- package/Typography/Native.mjs +14 -0
- package/Typography/ReadMore.js +28 -24
- package/Typography/ReadMore.mjs +43 -0
- package/Typography/TextLoop.js +21 -16
- package/{node/Typography/TextLoop.js → Typography/TextLoop.mjs} +16 -21
- package/Typography/TypeStairs.js +11 -8
- package/{node/Typography/TypeStairs.js → Typography/TypeStairs.mjs} +8 -11
- package/Typography/index.js +8 -5
- package/Typography/index.mjs +5 -0
- package/Typography/package.json +2 -2
- package/css/index.js +7 -2
- package/{node/tw/index.js → css/index.mjs} +2 -7
- package/css/package.json +2 -2
- package/helpers/classed.js +10 -6
- package/{node/helpers/classed.js → helpers/classed.mjs} +6 -10
- package/helpers/createUseMediaQueryWidth.js +16 -11
- package/{node/helpers/createUseMediaQueryWidth.js → helpers/createUseMediaQueryWidth.mjs} +11 -16
- package/helpers/extend-component.js +10 -6
- package/helpers/extend-component.mjs +13 -0
- package/helpers/index.js +7 -4
- package/helpers/index.mjs +4 -0
- package/helpers/mergeRefs.js +6 -2
- package/{node/helpers/mergeRefs.js → helpers/mergeRefs.mjs} +2 -6
- package/helpers/package.json +2 -2
- package/hooks/index.js +24 -21
- package/hooks/index.mjs +22 -0
- package/hooks/package.json +2 -2
- package/hooks/types.js +2 -1
- package/hooks/types.mjs +1 -0
- package/hooks/useAsyncFn.js +14 -10
- package/{node/hooks/useAsyncFn.js → hooks/useAsyncFn.mjs} +10 -14
- package/hooks/useDateLocale.js +14 -12
- package/{node/hooks/useDateLocale.js → hooks/useDateLocale.mjs} +10 -17
- package/hooks/useEffectOnce.js +8 -4
- package/hooks/useEffectOnce.mjs +9 -0
- package/hooks/useFirstMountState.js +8 -4
- package/hooks/useFirstMountState.mjs +13 -0
- package/hooks/useFixedOffset.js +21 -16
- package/hooks/useFixedOffset.mjs +57 -0
- package/hooks/useFocus.js +8 -4
- package/hooks/useFocus.mjs +12 -0
- package/hooks/useInterval.js +14 -10
- package/{node/hooks/useInterval.js → hooks/useInterval.mjs} +10 -14
- package/hooks/useIsomorphicLayoutEffect.js +10 -6
- package/hooks/useIsomorphicLayoutEffect.mjs +9 -0
- package/hooks/useKeyUp.js +12 -8
- package/{node/hooks/useKeyUp.js → hooks/useKeyUp.mjs} +8 -12
- package/hooks/useMeasure.js +30 -26
- package/{node/hooks/useMeasure.js → hooks/useMeasure.mjs} +26 -30
- package/hooks/useMount.js +8 -4
- package/hooks/useMount.mjs +10 -0
- package/hooks/useMountedState.js +10 -6
- package/hooks/useMountedState.mjs +16 -0
- package/hooks/useNavigateAway.js +13 -8
- package/{node/hooks/useNavigateAway.js → hooks/useNavigateAway.mjs} +8 -13
- package/hooks/usePrevious.js +8 -4
- package/hooks/usePrevious.mjs +12 -0
- package/hooks/usePreviousRef.js +9 -5
- package/hooks/usePreviousRef.mjs +9 -0
- package/hooks/useScrollPosition.js +16 -11
- package/{node/hooks/useScrollPosition.js → hooks/useScrollPosition.mjs} +11 -16
- package/hooks/useScrollThreshold.js +15 -10
- package/hooks/useScrollThreshold.mjs +28 -0
- package/hooks/useScrollTo.js +11 -6
- package/hooks/useScrollTo.mjs +22 -0
- package/hooks/useSmoothScroll.js +18 -13
- package/hooks/useSmoothScroll.mjs +39 -0
- package/hooks/useTraceUpdate.js +9 -5
- package/{node/hooks/useTraceUpdate.js → hooks/useTraceUpdate.mjs} +5 -9
- package/hooks/useUpdateEffect.js +10 -6
- package/hooks/useUpdateEffect.mjs +15 -0
- package/hooks/useWindowSize.js +15 -10
- package/hooks/useWindowSize.mjs +29 -0
- package/index.js +4 -1
- package/{node/index.js → index.mjs} +1 -4
- package/m/MotionProvider.js +10 -6
- package/{node/m/MotionProvider.js → m/MotionProvider.mjs} +6 -10
- package/m/index.js +4 -1
- package/m/index.mjs +6 -0
- package/m/lite.js +4 -2
- package/m/lite.mjs +2 -0
- package/m/max.js +4 -2
- package/m/max.mjs +2 -0
- package/m/package.json +2 -2
- package/package.json +5 -4
- package/sc/index.js +36 -30
- package/sc/index.mjs +31 -0
- package/sc/package.json +2 -2
- package/scm/index.js +34 -29
- package/scm/index.mjs +31 -0
- package/scm/package.json +2 -2
- package/shared/index.js +11 -8
- package/shared/index.mjs +8 -0
- package/shared/package.json +2 -2
- package/styles/Body.js +7 -4
- package/styles/Body.mjs +13 -0
- package/styles/Global.js +7 -4
- package/styles/Global.mjs +18 -0
- package/styles/index.js +10 -7
- package/styles/index.mjs +7 -0
- package/styles/media.js +13 -8
- package/{node/styles/media.js → styles/media.mjs} +8 -13
- package/styles/package.json +2 -2
- package/styles/spacing.js +11 -4
- package/{node/styles/spacing.js → styles/spacing.mjs} +4 -11
- package/styles/styled.js +11 -7
- package/styles/styled.mjs +13 -0
- package/styles/theme--vanilla.js +32 -26
- package/styles/theme--vanilla.mjs +58 -0
- package/styles/theme.js +12 -8
- package/{node/styles/theme.js → styles/theme.mjs} +8 -12
- package/tw/index.js +7 -2
- package/{node/css/index.js → tw/index.mjs} +2 -7
- package/tw/package.json +2 -2
- package/twm/index.js +7 -2
- package/{node/twm/index.js → twm/index.mjs} +2 -7
- package/twm/package.json +2 -2
- package/types.js +2 -1
- package/types.mjs +1 -0
- package/node/Alert/Alert.js +0 -14
- package/node/Alert/index.js +0 -4
- package/node/Animations/Reveal.js +0 -21
- package/node/Animations/Underline.js +0 -8
- package/node/Animations/index.js +0 -6
- package/node/Autocomplete/components.js +0 -37
- package/node/Autocomplete/index.js +0 -7
- package/node/Bg/BgColor.js +0 -25
- package/node/Bg/BgPhoto.js +0 -20
- package/node/Bg/BgSvg.js +0 -16
- package/node/Bg/index.js +0 -6
- package/node/Breadcrumbs/Breadcrumbs.js +0 -31
- package/node/Breadcrumbs/index.js +0 -4
- package/node/Buttons/Button.js +0 -17
- package/node/Buttons/ButtonComposite.js +0 -32
- package/node/Buttons/ButtonFab.js +0 -9
- package/node/Buttons/ButtonLink.js +0 -15
- package/node/Buttons/IconButton.js +0 -10
- package/node/Buttons/index.js +0 -8
- package/node/Calendar/CalendarDaygridNav.js +0 -28
- package/node/Calendar/CalendarLegend.js +0 -20
- package/node/Calendar/index.js +0 -9
- package/node/Calendar/types.js +0 -2
- package/node/Carousel/CarouselCss.js +0 -26
- package/node/Carousel/index.js +0 -4
- package/node/Collapsable/Collapsable.js +0 -4
- package/node/Collapsable/index.js +0 -5
- package/node/Debug/Debug.js +0 -13
- package/node/Debug/index.js +0 -4
- package/node/Details/Details.js +0 -66
- package/node/Details/index.js +0 -4
- package/node/Dialog/css/bare.js +0 -24
- package/node/Dialog/index.js +0 -5
- package/node/Dialog/m/bare.js +0 -55
- package/node/Dialog/m/index.js +0 -8
- package/node/Dialog/sc/bare.js +0 -46
- package/node/Dialog/sc/framer.js +0 -19
- package/node/Dialog/sc/framerMaterial.js +0 -19
- package/node/Dialog/sc/material.js +0 -24
- package/node/Dialog/tw/bare.js +0 -45
- package/node/Dialog/tw/elegant.js +0 -23
- package/node/Dialog/tw/framer.js +0 -19
- package/node/Dialog/tw/framerMaterial.js +0 -19
- package/node/Dialog/tw/material.js +0 -23
- package/node/Editor/Editor--tiptap.js +0 -31
- package/node/Editor/components.js +0 -15
- package/node/Editor/index.js +0 -4
- package/node/FaviconTags/FaviconTags.js +0 -20
- package/node/FaviconTags/index.js +0 -7
- package/node/Form/Form.js +0 -65
- package/node/Form/index.js +0 -4
- package/node/Form/sc/bare.js +0 -23
- package/node/Forms/Checkbox/Checkbox.js +0 -21
- package/node/Forms/Checkbox/index.js +0 -4
- package/node/Forms/Feedback/Feedback.js +0 -13
- package/node/Forms/Feedback/index.js +0 -4
- package/node/Forms/Field/Field.js +0 -35
- package/node/Forms/Field/FieldControl.js +0 -51
- package/node/Forms/Field/FieldHint.js +0 -7
- package/node/Forms/Field/index.js +0 -5
- package/node/Forms/Input/Input.js +0 -20
- package/node/Forms/Input/index.js +0 -4
- package/node/Forms/InputGroup/InputGroup.js +0 -19
- package/node/Forms/InputGroup/index.js +0 -4
- package/node/Forms/Label/Label.js +0 -9
- package/node/Forms/Label/index.js +0 -4
- package/node/Forms/Password/Password.js +0 -20
- package/node/Forms/Password/index.js +0 -4
- package/node/Forms/Radio/Radio.js +0 -28
- package/node/Forms/Radio/index.js +0 -4
- package/node/Forms/Switch/Switch.js +0 -23
- package/node/Forms/Switch/index.js +0 -4
- package/node/Forms/Textarea/Textarea.js +0 -15
- package/node/Forms/Textarea/TextareaRich.js +0 -31
- package/node/Forms/Textarea/index.js +0 -5
- package/node/Forms/Toggle/Toggle.js +0 -36
- package/node/Forms/Toggle/index.js +0 -4
- package/node/Forms/index.js +0 -19
- package/node/Forms/styles.js +0 -32
- package/node/Grid/Grid.js +0 -56
- package/node/Grid/index.js +0 -4
- package/node/Hamburger/Hamburger.js +0 -56
- package/node/Hamburger/index.js +0 -4
- package/node/Header/index.js +0 -4
- package/node/Header/useHeader.js +0 -35
- package/node/Hidden/Hidden.js +0 -13
- package/node/Hidden/index.js +0 -4
- package/node/Img/index.js +0 -4
- package/node/Img/types.js +0 -2
- package/node/Link/Link.js +0 -7
- package/node/Link/LinkBlank.js +0 -21
- package/node/Link/index.js +0 -5
- package/node/Menu/Menu.js +0 -7
- package/node/Menu/MenuMui.js +0 -78
- package/node/Menu/index.js +0 -4
- package/node/MenuItem/MenuItem.js +0 -7
- package/node/MenuItem/MenuItemMui.js +0 -18
- package/node/MenuItem/index.js +0 -4
- package/node/Meta/Meta.js +0 -10
- package/node/Meta/index.js +0 -7
- package/node/NoJs/NoJs.js +0 -11
- package/node/NoJs/index.js +0 -7
- package/node/Pagination/PaginationNav.js +0 -65
- package/node/Pagination/PaginationResults.js +0 -15
- package/node/Pagination/index.js +0 -5
- package/node/Pill/Pill.js +0 -10
- package/node/Pill/index.js +0 -4
- package/node/Progress/ProgressCircular.js +0 -19
- package/node/Progress/ProgressLinear.js +0 -28
- package/node/Progress/ProgressOverlay.js +0 -28
- package/node/Progress/index.js +0 -6
- package/node/Rating/Rating.js +0 -75
- package/node/Select/components.js +0 -15
- package/node/Select/index.js +0 -7
- package/node/Sidebar/Sidebar.js +0 -27
- package/node/Sidebar/index.js +0 -4
- package/node/Spacing/Spacing.js +0 -49
- package/node/Spacing/index.js +0 -4
- package/node/Sticky/StickyCss.js +0 -10
- package/node/Sticky/index.js +0 -4
- package/node/Tabs/TabsMui.js +0 -49
- package/node/Tabs/index.js +0 -4
- package/node/Tabs/tw/bare.js +0 -20
- package/node/Tabs/tw/material.js +0 -21
- package/node/Typography/CopyPasteVisible.js +0 -7
- package/node/Typography/Native.js +0 -17
- package/node/Typography/ReadMore.js +0 -47
- package/node/Typography/index.js +0 -8
- package/node/helpers/extend-component.js +0 -17
- package/node/helpers/index.js +0 -7
- package/node/hooks/index.js +0 -25
- package/node/hooks/types.js +0 -2
- package/node/hooks/useEffectOnce.js +0 -13
- package/node/hooks/useFirstMountState.js +0 -17
- package/node/hooks/useFixedOffset.js +0 -62
- package/node/hooks/useFocus.js +0 -16
- package/node/hooks/useIsomorphicLayoutEffect.js +0 -13
- package/node/hooks/useMount.js +0 -14
- package/node/hooks/useMountedState.js +0 -20
- package/node/hooks/usePrevious.js +0 -16
- package/node/hooks/usePreviousRef.js +0 -13
- package/node/hooks/useScrollThreshold.js +0 -33
- package/node/hooks/useScrollTo.js +0 -27
- package/node/hooks/useSmoothScroll.js +0 -44
- package/node/hooks/useUpdateEffect.js +0 -19
- package/node/hooks/useWindowSize.js +0 -34
- package/node/m/index.js +0 -9
- package/node/m/lite.js +0 -4
- package/node/m/max.js +0 -4
- package/node/sc/index.js +0 -37
- package/node/scm/index.js +0 -36
- package/node/shared/index.js +0 -11
- package/node/styles/Body.js +0 -16
- package/node/styles/Global.js +0 -21
- package/node/styles/index.js +0 -10
- package/node/styles/styled.js +0 -17
- package/node/styles/theme--vanilla.js +0 -64
- package/node/types.js +0 -2
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { useRef } from "react";
|
|
2
|
+
import injectCss from "@koine/dom/injectCss";
|
|
3
|
+
import calculateFixedOffset from "@koine/dom/calculateFixedOffset";
|
|
4
|
+
import listenResizeDebounced from "@koine/dom/listenResizeDebounced";
|
|
5
|
+
import $each from "@koine/dom/$each";
|
|
6
|
+
import debounce from "@koine/utils/debounce";
|
|
7
|
+
import useIsomorphicLayoutEffect from "./useIsomorphicLayoutEffect";
|
|
8
|
+
var inject = function (value) {
|
|
9
|
+
injectCss("useFixedOffset", "html{scroll-padding-top: ".concat(value, "px}"));
|
|
10
|
+
};
|
|
11
|
+
/**
|
|
12
|
+
* # Use fixed offset
|
|
13
|
+
*
|
|
14
|
+
* Maybe use [ResizeObserver polyfill](https://github.com/juggle/resize-observer)
|
|
15
|
+
*
|
|
16
|
+
* @see https://web.dev/resize-observer/
|
|
17
|
+
*
|
|
18
|
+
* @param selector By default `[data-fixed]`: anyhting with the data attribute `data-fixed`
|
|
19
|
+
*/
|
|
20
|
+
export function useFixedOffset(selector) {
|
|
21
|
+
var fixedOffset = useRef(0);
|
|
22
|
+
useIsomorphicLayoutEffect(function () {
|
|
23
|
+
var update = function () {
|
|
24
|
+
var newFixedOffset = calculateFixedOffset();
|
|
25
|
+
fixedOffset.current = newFixedOffset;
|
|
26
|
+
// inject this CSS make the hashed deeplinks position the scroll at the
|
|
27
|
+
// right offset
|
|
28
|
+
inject(newFixedOffset);
|
|
29
|
+
};
|
|
30
|
+
update();
|
|
31
|
+
if (ResizeObserver) {
|
|
32
|
+
// const elements = $$("[data-fixed]");
|
|
33
|
+
var observer_1 = new ResizeObserver(function (entries) {
|
|
34
|
+
var newFixedOffset = 0;
|
|
35
|
+
entries.forEach(function (entry) {
|
|
36
|
+
newFixedOffset += entry.contentRect.height;
|
|
37
|
+
});
|
|
38
|
+
fixedOffset.current = newFixedOffset;
|
|
39
|
+
var updateOnResize = debounce(function () { return inject(newFixedOffset); }, 400, true);
|
|
40
|
+
updateOnResize();
|
|
41
|
+
});
|
|
42
|
+
$each(selector || "[data-fixed]", function ($el) {
|
|
43
|
+
if (observer_1)
|
|
44
|
+
observer_1.observe($el);
|
|
45
|
+
});
|
|
46
|
+
return function () {
|
|
47
|
+
observer_1 === null || observer_1 === void 0 ? void 0 : observer_1.disconnect();
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
else {
|
|
51
|
+
var listener = listenResizeDebounced(0, update);
|
|
52
|
+
return listener;
|
|
53
|
+
}
|
|
54
|
+
}, [selector]);
|
|
55
|
+
return fixedOffset;
|
|
56
|
+
}
|
|
57
|
+
export default useFixedOffset;
|
package/hooks/useFocus.js
CHANGED
|
@@ -1,12 +1,16 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useFocus = void 0;
|
|
4
|
+
var react_1 = require("react");
|
|
2
5
|
/**
|
|
3
6
|
* @see https://stackoverflow.com/a/54159564/1938970
|
|
4
7
|
*/
|
|
5
|
-
|
|
6
|
-
var element = useRef(null);
|
|
8
|
+
var useFocus = function () {
|
|
9
|
+
var element = (0, react_1.useRef)(null);
|
|
7
10
|
var setFocus = function () {
|
|
8
11
|
element.current && element.current.focus();
|
|
9
12
|
};
|
|
10
13
|
return [element, setFocus];
|
|
11
14
|
};
|
|
12
|
-
|
|
15
|
+
exports.useFocus = useFocus;
|
|
16
|
+
exports.default = exports.useFocus;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { useRef } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* @see https://stackoverflow.com/a/54159564/1938970
|
|
4
|
+
*/
|
|
5
|
+
export var useFocus = function () {
|
|
6
|
+
var element = useRef(null);
|
|
7
|
+
var setFocus = function () {
|
|
8
|
+
element.current && element.current.focus();
|
|
9
|
+
};
|
|
10
|
+
return [element, setFocus];
|
|
11
|
+
};
|
|
12
|
+
export default useFocus;
|
package/hooks/useInterval.js
CHANGED
|
@@ -1,19 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useInterval = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var noop_1 = tslib_1.__importDefault(require("@koine/utils/noop"));
|
|
4
7
|
/**
|
|
5
8
|
* @borrows [dan abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
|
|
6
9
|
*
|
|
7
10
|
* We just add `deps` array argument and typescript support
|
|
8
11
|
*/
|
|
9
|
-
|
|
12
|
+
function useInterval(callback, delay, deps) {
|
|
10
13
|
if (deps === void 0) { deps = []; }
|
|
11
|
-
var savedCallback = useRef();
|
|
12
|
-
useEffect(function () {
|
|
14
|
+
var savedCallback = (0, react_1.useRef)();
|
|
15
|
+
(0, react_1.useEffect)(function () {
|
|
13
16
|
savedCallback.current = callback;
|
|
14
17
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
15
|
-
}, __spreadArray([callback], deps, true));
|
|
16
|
-
useEffect(function () {
|
|
18
|
+
}, tslib_1.__spreadArray([callback], deps, true));
|
|
19
|
+
(0, react_1.useEffect)(function () {
|
|
17
20
|
function tick() {
|
|
18
21
|
if (savedCallback.current)
|
|
19
22
|
savedCallback.current();
|
|
@@ -22,7 +25,8 @@ export function useInterval(callback, delay, deps) {
|
|
|
22
25
|
var id_1 = setInterval(tick, delay);
|
|
23
26
|
return function () { return clearInterval(id_1); };
|
|
24
27
|
}
|
|
25
|
-
return
|
|
28
|
+
return noop_1.default;
|
|
26
29
|
}, [delay]);
|
|
27
30
|
}
|
|
28
|
-
|
|
31
|
+
exports.useInterval = useInterval;
|
|
32
|
+
exports.default = useInterval;
|
|
@@ -1,22 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var react_1 = require("react");
|
|
6
|
-
var noop_1 = tslib_1.__importDefault(require("@koine/utils/noop"));
|
|
1
|
+
import { __spreadArray } from "tslib";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
|
+
import noop from "@koine/utils/noop";
|
|
7
4
|
/**
|
|
8
5
|
* @borrows [dan abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
|
|
9
6
|
*
|
|
10
7
|
* We just add `deps` array argument and typescript support
|
|
11
8
|
*/
|
|
12
|
-
function useInterval(callback, delay, deps) {
|
|
9
|
+
export function useInterval(callback, delay, deps) {
|
|
13
10
|
if (deps === void 0) { deps = []; }
|
|
14
|
-
var savedCallback =
|
|
15
|
-
|
|
11
|
+
var savedCallback = useRef();
|
|
12
|
+
useEffect(function () {
|
|
16
13
|
savedCallback.current = callback;
|
|
17
14
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
18
|
-
},
|
|
19
|
-
|
|
15
|
+
}, __spreadArray([callback], deps, true));
|
|
16
|
+
useEffect(function () {
|
|
20
17
|
function tick() {
|
|
21
18
|
if (savedCallback.current)
|
|
22
19
|
savedCallback.current();
|
|
@@ -25,8 +22,7 @@ function useInterval(callback, delay, deps) {
|
|
|
25
22
|
var id_1 = setInterval(tick, delay);
|
|
26
23
|
return function () { return clearInterval(id_1); };
|
|
27
24
|
}
|
|
28
|
-
return
|
|
25
|
+
return noop;
|
|
29
26
|
}, [delay]);
|
|
30
27
|
}
|
|
31
|
-
|
|
32
|
-
exports.default = useInterval;
|
|
28
|
+
export default useInterval;
|
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useIsomorphicLayoutEffect = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var isBrowser_1 = tslib_1.__importDefault(require("@koine/utils/isBrowser"));
|
|
3
7
|
/**
|
|
4
8
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
|
|
5
9
|
*/
|
|
6
|
-
|
|
7
|
-
? useLayoutEffect
|
|
8
|
-
: useEffect;
|
|
9
|
-
|
|
10
|
+
exports.useIsomorphicLayoutEffect = isBrowser_1.default
|
|
11
|
+
? react_1.useLayoutEffect
|
|
12
|
+
: react_1.useEffect;
|
|
13
|
+
exports.default = exports.useIsomorphicLayoutEffect;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { useEffect, useLayoutEffect } from "react";
|
|
2
|
+
import isBrowser from "@koine/utils/isBrowser";
|
|
3
|
+
/**
|
|
4
|
+
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
|
|
5
|
+
*/
|
|
6
|
+
export var useIsomorphicLayoutEffect = isBrowser
|
|
7
|
+
? useLayoutEffect
|
|
8
|
+
: useEffect;
|
|
9
|
+
export default useIsomorphicLayoutEffect;
|
package/hooks/useKeyUp.js
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useKeyUp = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var on_1 = tslib_1.__importDefault(require("@koine/dom/on"));
|
|
7
|
+
function useKeyUp(callback, deps) {
|
|
5
8
|
if (deps === void 0) { deps = []; }
|
|
6
|
-
useEffect(function () {
|
|
7
|
-
var listener =
|
|
9
|
+
(0, react_1.useEffect)(function () {
|
|
10
|
+
var listener = (0, on_1.default)(window, "keyup", function (event) {
|
|
8
11
|
// const { key } = event;
|
|
9
12
|
// be sure we do not intercept keys combinations maybe used for other
|
|
10
13
|
// actions like native browser navigation shortcuts
|
|
@@ -18,6 +21,7 @@ export function useKeyUp(callback, deps) {
|
|
|
18
21
|
});
|
|
19
22
|
return listener;
|
|
20
23
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
21
|
-
}, __spreadArray([callback], deps, true));
|
|
24
|
+
}, tslib_1.__spreadArray([callback], deps, true));
|
|
22
25
|
}
|
|
23
|
-
|
|
26
|
+
exports.useKeyUp = useKeyUp;
|
|
27
|
+
exports.default = useKeyUp;
|
|
@@ -1,13 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var react_1 = require("react");
|
|
6
|
-
var on_1 = tslib_1.__importDefault(require("@koine/dom/on"));
|
|
7
|
-
function useKeyUp(callback, deps) {
|
|
1
|
+
import { __spreadArray } from "tslib";
|
|
2
|
+
import { useEffect } from "react";
|
|
3
|
+
import on from "@koine/dom/on";
|
|
4
|
+
export function useKeyUp(callback, deps) {
|
|
8
5
|
if (deps === void 0) { deps = []; }
|
|
9
|
-
|
|
10
|
-
var listener = (
|
|
6
|
+
useEffect(function () {
|
|
7
|
+
var listener = on(window, "keyup", function (event) {
|
|
11
8
|
// const { key } = event;
|
|
12
9
|
// be sure we do not intercept keys combinations maybe used for other
|
|
13
10
|
// actions like native browser navigation shortcuts
|
|
@@ -21,7 +18,6 @@ function useKeyUp(callback, deps) {
|
|
|
21
18
|
});
|
|
22
19
|
return listener;
|
|
23
20
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
24
|
-
},
|
|
21
|
+
}, __spreadArray([callback], deps, true));
|
|
25
22
|
}
|
|
26
|
-
|
|
27
|
-
exports.default = useKeyUp;
|
|
23
|
+
export default useKeyUp;
|
package/hooks/useMeasure.js
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useMeasure = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var debounce_1 = tslib_1.__importDefault(require("@koine/utils/debounce"));
|
|
7
|
+
var noop_1 = tslib_1.__importDefault(require("@koine/utils/noop"));
|
|
8
|
+
var listenResizeDebounced_1 = tslib_1.__importDefault(require("@koine/dom/listenResizeDebounced"));
|
|
9
|
+
var listenScrollDebounced_1 = tslib_1.__importDefault(require("@koine/dom/listenScrollDebounced"));
|
|
10
|
+
var on_1 = tslib_1.__importDefault(require("@koine/dom/on"));
|
|
11
|
+
var off_1 = tslib_1.__importDefault(require("@koine/dom/off"));
|
|
9
12
|
var observer;
|
|
10
13
|
// Returns a list of scroll offsets
|
|
11
14
|
function findScrollContainers(element) {
|
|
@@ -15,7 +18,7 @@ function findScrollContainers(element) {
|
|
|
15
18
|
var _a = window.getComputedStyle(element), overflow = _a.overflow, overflowX = _a.overflowX, overflowY = _a.overflowY;
|
|
16
19
|
if ([overflow, overflowX, overflowY].some(function (prop) { return prop === "auto" || prop === "scroll"; }))
|
|
17
20
|
result.push(element);
|
|
18
|
-
return __spreadArray(__spreadArray([], result, true), findScrollContainers(element.parentElement), true);
|
|
21
|
+
return tslib_1.__spreadArray(tslib_1.__spreadArray([], result, true), findScrollContainers(element.parentElement), true);
|
|
19
22
|
}
|
|
20
23
|
var keys = [
|
|
21
24
|
"x",
|
|
@@ -35,9 +38,9 @@ var areBoundsEqual = function (a, b) {
|
|
|
35
38
|
*
|
|
36
39
|
* @borrows [pmndrs/react-use-measure](https://github.com/pmndrs/react-use-measure)
|
|
37
40
|
*/
|
|
38
|
-
|
|
41
|
+
function useMeasure(options) {
|
|
39
42
|
var _a = (options || {}).scroll /* offsetSize = false */, scroll = _a === void 0 ? false : _a /* offsetSize = false */;
|
|
40
|
-
var _b = useState({
|
|
43
|
+
var _b = (0, react_1.useState)({
|
|
41
44
|
left: 0,
|
|
42
45
|
top: 0,
|
|
43
46
|
width: 0,
|
|
@@ -48,7 +51,7 @@ export function useMeasure(options) {
|
|
|
48
51
|
y: 0,
|
|
49
52
|
}), bounds = _b[0], setBounds = _b[1];
|
|
50
53
|
// keep all state in a ref
|
|
51
|
-
var state = useRef([
|
|
54
|
+
var state = (0, react_1.useRef)([
|
|
52
55
|
// element
|
|
53
56
|
null,
|
|
54
57
|
// scrollContainers
|
|
@@ -59,13 +62,13 @@ export function useMeasure(options) {
|
|
|
59
62
|
bounds,
|
|
60
63
|
]);
|
|
61
64
|
// make sure to update state only as long as the component is truly mounted
|
|
62
|
-
var mounted = useRef(false);
|
|
63
|
-
useEffect(function () {
|
|
65
|
+
var mounted = (0, react_1.useRef)(false);
|
|
66
|
+
(0, react_1.useEffect)(function () {
|
|
64
67
|
mounted.current = true;
|
|
65
68
|
return function () { return void (mounted.current = false); };
|
|
66
69
|
}, []);
|
|
67
70
|
// memoize handlers, so event-listeners know when they should update
|
|
68
|
-
var _c = useMemo(function () {
|
|
71
|
+
var _c = (0, react_1.useMemo)(function () {
|
|
69
72
|
var callback = function () {
|
|
70
73
|
var _args = [];
|
|
71
74
|
for (var _i = 0; _i < arguments.length; _i++) {
|
|
@@ -85,7 +88,7 @@ export function useMeasure(options) {
|
|
|
85
88
|
setBounds(size);
|
|
86
89
|
}
|
|
87
90
|
};
|
|
88
|
-
var debouncedCallback =
|
|
91
|
+
var debouncedCallback = (0, debounce_1.default)(callback);
|
|
89
92
|
return [callback, debouncedCallback, debouncedCallback];
|
|
90
93
|
}, [setBounds /* , offsetSize */]), forceRefresh = _c[0] /* resizeChange */, scrollChange = _c[2];
|
|
91
94
|
// cleanup current scroll-listeners / observers
|
|
@@ -93,7 +96,7 @@ export function useMeasure(options) {
|
|
|
93
96
|
var _a = state.current, scrollContainers = _a[1], resizeObserver = _a[2];
|
|
94
97
|
if (scrollContainers) {
|
|
95
98
|
scrollContainers.forEach(function (element) {
|
|
96
|
-
return
|
|
99
|
+
return (0, off_1.default)(element, "scroll", scrollChange);
|
|
97
100
|
});
|
|
98
101
|
state.current[1] = null;
|
|
99
102
|
}
|
|
@@ -113,7 +116,7 @@ export function useMeasure(options) {
|
|
|
113
116
|
observer.observe(element);
|
|
114
117
|
if (scroll && scrollContainers) {
|
|
115
118
|
scrollContainers.forEach(function (scrollContainer) {
|
|
116
|
-
return
|
|
119
|
+
return (0, on_1.default)(scrollContainer, "scroll", scrollChange, {
|
|
117
120
|
capture: true,
|
|
118
121
|
passive: true,
|
|
119
122
|
});
|
|
@@ -136,26 +139,26 @@ export function useMeasure(options) {
|
|
|
136
139
|
// debugger;
|
|
137
140
|
// forceRefresh();
|
|
138
141
|
// });
|
|
139
|
-
useEffect(function () {
|
|
142
|
+
(0, react_1.useEffect)(function () {
|
|
140
143
|
if (scroll) {
|
|
141
|
-
var listener =
|
|
144
|
+
var listener = (0, listenScrollDebounced_1.default)(0, forceRefresh, 100);
|
|
142
145
|
return listener;
|
|
143
146
|
}
|
|
144
|
-
return
|
|
147
|
+
return noop_1.default;
|
|
145
148
|
}, [scroll, forceRefresh]);
|
|
146
|
-
useEffect(function () {
|
|
149
|
+
(0, react_1.useEffect)(function () {
|
|
147
150
|
// const listener = listenResizeDebounced(onWindowResize);
|
|
148
151
|
// return listener;
|
|
149
|
-
var listener =
|
|
152
|
+
var listener = (0, listenResizeDebounced_1.default)(0, forceRefresh, 100);
|
|
150
153
|
return listener;
|
|
151
154
|
}, [forceRefresh]);
|
|
152
155
|
// respond to changes that are relevant for the listeners
|
|
153
|
-
useEffect(function () {
|
|
156
|
+
(0, react_1.useEffect)(function () {
|
|
154
157
|
removeListeners();
|
|
155
158
|
addListeners();
|
|
156
159
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
157
160
|
}, [scroll /* , scrollChange, resizeChange */]);
|
|
158
|
-
useEffect(function () {
|
|
161
|
+
(0, react_1.useEffect)(function () {
|
|
159
162
|
// operate on mount, @kuus on the original version there is no call on mount?
|
|
160
163
|
forceRefresh();
|
|
161
164
|
// remove all listeners when the components unmounts
|
|
@@ -164,4 +167,5 @@ export function useMeasure(options) {
|
|
|
164
167
|
}, []);
|
|
165
168
|
return [ref, bounds, forceRefresh];
|
|
166
169
|
}
|
|
167
|
-
|
|
170
|
+
exports.useMeasure = useMeasure;
|
|
171
|
+
exports.default = useMeasure;
|
|
@@ -1,14 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var listenScrollDebounced_1 = tslib_1.__importDefault(require("@koine/dom/listenScrollDebounced"));
|
|
10
|
-
var on_1 = tslib_1.__importDefault(require("@koine/dom/on"));
|
|
11
|
-
var off_1 = tslib_1.__importDefault(require("@koine/dom/off"));
|
|
1
|
+
import { __spreadArray } from "tslib";
|
|
2
|
+
import { useEffect, useState, useRef, useMemo } from "react";
|
|
3
|
+
import debounce from "@koine/utils/debounce";
|
|
4
|
+
import noop from "@koine/utils/noop";
|
|
5
|
+
import listenResizeDebounced from "@koine/dom/listenResizeDebounced";
|
|
6
|
+
import listenScrollDebounced from "@koine/dom/listenScrollDebounced";
|
|
7
|
+
import on from "@koine/dom/on";
|
|
8
|
+
import off from "@koine/dom/off";
|
|
12
9
|
var observer;
|
|
13
10
|
// Returns a list of scroll offsets
|
|
14
11
|
function findScrollContainers(element) {
|
|
@@ -18,7 +15,7 @@ function findScrollContainers(element) {
|
|
|
18
15
|
var _a = window.getComputedStyle(element), overflow = _a.overflow, overflowX = _a.overflowX, overflowY = _a.overflowY;
|
|
19
16
|
if ([overflow, overflowX, overflowY].some(function (prop) { return prop === "auto" || prop === "scroll"; }))
|
|
20
17
|
result.push(element);
|
|
21
|
-
return
|
|
18
|
+
return __spreadArray(__spreadArray([], result, true), findScrollContainers(element.parentElement), true);
|
|
22
19
|
}
|
|
23
20
|
var keys = [
|
|
24
21
|
"x",
|
|
@@ -38,9 +35,9 @@ var areBoundsEqual = function (a, b) {
|
|
|
38
35
|
*
|
|
39
36
|
* @borrows [pmndrs/react-use-measure](https://github.com/pmndrs/react-use-measure)
|
|
40
37
|
*/
|
|
41
|
-
function useMeasure(options) {
|
|
38
|
+
export function useMeasure(options) {
|
|
42
39
|
var _a = (options || {}).scroll /* offsetSize = false */, scroll = _a === void 0 ? false : _a /* offsetSize = false */;
|
|
43
|
-
var _b =
|
|
40
|
+
var _b = useState({
|
|
44
41
|
left: 0,
|
|
45
42
|
top: 0,
|
|
46
43
|
width: 0,
|
|
@@ -51,7 +48,7 @@ function useMeasure(options) {
|
|
|
51
48
|
y: 0,
|
|
52
49
|
}), bounds = _b[0], setBounds = _b[1];
|
|
53
50
|
// keep all state in a ref
|
|
54
|
-
var state =
|
|
51
|
+
var state = useRef([
|
|
55
52
|
// element
|
|
56
53
|
null,
|
|
57
54
|
// scrollContainers
|
|
@@ -62,13 +59,13 @@ function useMeasure(options) {
|
|
|
62
59
|
bounds,
|
|
63
60
|
]);
|
|
64
61
|
// make sure to update state only as long as the component is truly mounted
|
|
65
|
-
var mounted =
|
|
66
|
-
|
|
62
|
+
var mounted = useRef(false);
|
|
63
|
+
useEffect(function () {
|
|
67
64
|
mounted.current = true;
|
|
68
65
|
return function () { return void (mounted.current = false); };
|
|
69
66
|
}, []);
|
|
70
67
|
// memoize handlers, so event-listeners know when they should update
|
|
71
|
-
var _c =
|
|
68
|
+
var _c = useMemo(function () {
|
|
72
69
|
var callback = function () {
|
|
73
70
|
var _args = [];
|
|
74
71
|
for (var _i = 0; _i < arguments.length; _i++) {
|
|
@@ -88,7 +85,7 @@ function useMeasure(options) {
|
|
|
88
85
|
setBounds(size);
|
|
89
86
|
}
|
|
90
87
|
};
|
|
91
|
-
var debouncedCallback = (
|
|
88
|
+
var debouncedCallback = debounce(callback);
|
|
92
89
|
return [callback, debouncedCallback, debouncedCallback];
|
|
93
90
|
}, [setBounds /* , offsetSize */]), forceRefresh = _c[0] /* resizeChange */, scrollChange = _c[2];
|
|
94
91
|
// cleanup current scroll-listeners / observers
|
|
@@ -96,7 +93,7 @@ function useMeasure(options) {
|
|
|
96
93
|
var _a = state.current, scrollContainers = _a[1], resizeObserver = _a[2];
|
|
97
94
|
if (scrollContainers) {
|
|
98
95
|
scrollContainers.forEach(function (element) {
|
|
99
|
-
return (
|
|
96
|
+
return off(element, "scroll", scrollChange);
|
|
100
97
|
});
|
|
101
98
|
state.current[1] = null;
|
|
102
99
|
}
|
|
@@ -116,7 +113,7 @@ function useMeasure(options) {
|
|
|
116
113
|
observer.observe(element);
|
|
117
114
|
if (scroll && scrollContainers) {
|
|
118
115
|
scrollContainers.forEach(function (scrollContainer) {
|
|
119
|
-
return (
|
|
116
|
+
return on(scrollContainer, "scroll", scrollChange, {
|
|
120
117
|
capture: true,
|
|
121
118
|
passive: true,
|
|
122
119
|
});
|
|
@@ -139,26 +136,26 @@ function useMeasure(options) {
|
|
|
139
136
|
// debugger;
|
|
140
137
|
// forceRefresh();
|
|
141
138
|
// });
|
|
142
|
-
|
|
139
|
+
useEffect(function () {
|
|
143
140
|
if (scroll) {
|
|
144
|
-
var listener = (0,
|
|
141
|
+
var listener = listenScrollDebounced(0, forceRefresh, 100);
|
|
145
142
|
return listener;
|
|
146
143
|
}
|
|
147
|
-
return
|
|
144
|
+
return noop;
|
|
148
145
|
}, [scroll, forceRefresh]);
|
|
149
|
-
|
|
146
|
+
useEffect(function () {
|
|
150
147
|
// const listener = listenResizeDebounced(onWindowResize);
|
|
151
148
|
// return listener;
|
|
152
|
-
var listener = (0,
|
|
149
|
+
var listener = listenResizeDebounced(0, forceRefresh, 100);
|
|
153
150
|
return listener;
|
|
154
151
|
}, [forceRefresh]);
|
|
155
152
|
// respond to changes that are relevant for the listeners
|
|
156
|
-
|
|
153
|
+
useEffect(function () {
|
|
157
154
|
removeListeners();
|
|
158
155
|
addListeners();
|
|
159
156
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
160
157
|
}, [scroll /* , scrollChange, resizeChange */]);
|
|
161
|
-
|
|
158
|
+
useEffect(function () {
|
|
162
159
|
// operate on mount, @kuus on the original version there is no call on mount?
|
|
163
160
|
forceRefresh();
|
|
164
161
|
// remove all listeners when the components unmounts
|
|
@@ -167,5 +164,4 @@ function useMeasure(options) {
|
|
|
167
164
|
}, []);
|
|
168
165
|
return [ref, bounds, forceRefresh];
|
|
169
166
|
}
|
|
170
|
-
|
|
171
|
-
exports.default = useMeasure;
|
|
167
|
+
export default useMeasure;
|
package/hooks/useMount.js
CHANGED
|
@@ -1,10 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useMount = void 0;
|
|
4
|
+
var useEffectOnce_1 = require("./useEffectOnce");
|
|
2
5
|
/**
|
|
3
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMount.ts)
|
|
4
7
|
*/
|
|
5
|
-
|
|
6
|
-
useEffectOnce(function () {
|
|
8
|
+
var useMount = function (fn) {
|
|
9
|
+
(0, useEffectOnce_1.useEffectOnce)(function () {
|
|
7
10
|
fn();
|
|
8
11
|
});
|
|
9
12
|
};
|
|
10
|
-
|
|
13
|
+
exports.useMount = useMount;
|
|
14
|
+
exports.default = exports.useMount;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { useEffectOnce } from "./useEffectOnce";
|
|
2
|
+
/**
|
|
3
|
+
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMount.ts)
|
|
4
|
+
*/
|
|
5
|
+
export var useMount = function (fn) {
|
|
6
|
+
useEffectOnce(function () {
|
|
7
|
+
fn();
|
|
8
|
+
});
|
|
9
|
+
};
|
|
10
|
+
export default useMount;
|
package/hooks/useMountedState.js
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useMountedState = void 0;
|
|
4
|
+
var react_1 = require("react");
|
|
2
5
|
/**
|
|
3
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
|
|
4
7
|
*/
|
|
5
|
-
|
|
6
|
-
var mountedRef = useRef(false);
|
|
7
|
-
var get = useCallback(function () { return mountedRef.current; }, []);
|
|
8
|
-
useEffect(function () {
|
|
8
|
+
function useMountedState() {
|
|
9
|
+
var mountedRef = (0, react_1.useRef)(false);
|
|
10
|
+
var get = (0, react_1.useCallback)(function () { return mountedRef.current; }, []);
|
|
11
|
+
(0, react_1.useEffect)(function () {
|
|
9
12
|
mountedRef.current = true;
|
|
10
13
|
return function () {
|
|
11
14
|
mountedRef.current = false;
|
|
@@ -13,4 +16,5 @@ export function useMountedState() {
|
|
|
13
16
|
}, []);
|
|
14
17
|
return get;
|
|
15
18
|
}
|
|
16
|
-
|
|
19
|
+
exports.useMountedState = useMountedState;
|
|
20
|
+
exports.default = useMountedState;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
|
|
4
|
+
*/
|
|
5
|
+
export function useMountedState() {
|
|
6
|
+
var mountedRef = useRef(false);
|
|
7
|
+
var get = useCallback(function () { return mountedRef.current; }, []);
|
|
8
|
+
useEffect(function () {
|
|
9
|
+
mountedRef.current = true;
|
|
10
|
+
return function () {
|
|
11
|
+
mountedRef.current = false;
|
|
12
|
+
};
|
|
13
|
+
}, []);
|
|
14
|
+
return get;
|
|
15
|
+
}
|
|
16
|
+
export default useMountedState;
|