@koine/react 1.1.10 → 1.1.12
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.d.ts +6 -1
- 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.d.ts +298 -13
- 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.d.ts +328 -19
- package/Dialog/DialogMui.js +28 -25
- package/{node/Dialog/DialogMui.js → Dialog/DialogMui.mjs} +25 -28
- package/Dialog/css/bare.d.ts +352 -43
- 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.d.ts +322 -13
- 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.d.ts +325 -17
- package/Dialog/sc/bare.js +24 -21
- package/Dialog/sc/bare.mjs +43 -0
- package/Dialog/sc/framer.d.ts +316 -7
- package/Dialog/sc/framer.js +18 -15
- package/Dialog/sc/framer.mjs +16 -0
- package/Dialog/sc/framerMaterial.d.ts +316 -7
- package/Dialog/sc/framerMaterial.js +18 -15
- package/Dialog/sc/framerMaterial.mjs +16 -0
- package/Dialog/sc/material.d.ts +325 -16
- package/Dialog/sc/material.js +22 -19
- package/Dialog/sc/material.mjs +21 -0
- package/Dialog/tw/bare.d.ts +358 -49
- package/Dialog/tw/bare.js +21 -18
- package/Dialog/tw/bare.mjs +42 -0
- package/Dialog/tw/elegant.d.ts +379 -70
- package/Dialog/tw/elegant.js +21 -18
- package/Dialog/tw/elegant.mjs +20 -0
- package/Dialog/tw/framer.d.ts +340 -31
- package/Dialog/tw/framer.js +18 -15
- package/Dialog/tw/framer.mjs +16 -0
- package/Dialog/tw/framerMaterial.d.ts +356 -47
- package/Dialog/tw/framerMaterial.js +18 -15
- package/Dialog/tw/framerMaterial.mjs +16 -0
- package/Dialog/tw/material.d.ts +379 -70
- 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.d.ts +45 -19
- 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.d.ts +33 -8
- package/Form/sc/bare.js +21 -18
- package/Form/sc/bare.mjs +20 -0
- package/Forms/Checkbox/Checkbox.d.ts +1 -1
- 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.d.ts +1 -1
- 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.d.ts +1 -1
- 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.d.ts +1 -1
- 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.d.ts +1 -1
- 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.d.ts +1 -1
- package/Forms/Textarea/Textarea.js +13 -10
- package/Forms/Textarea/Textarea.mjs +12 -0
- package/Forms/Textarea/TextareaRich.d.ts +1 -1
- 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.d.ts +1 -1
- 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.d.ts +0 -35
- package/Menu/MenuMui.js +165 -75
- package/Menu/MenuMui.mjs +165 -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.d.ts +0 -6
- package/MenuItem/MenuItemMui.js +32 -15
- package/MenuItem/MenuItemMui.mjs +32 -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.d.ts +287 -55
- 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.d.ts +311 -80
- package/Tabs/tw/bare.js +17 -14
- package/Tabs/tw/bare.mjs +17 -0
- package/Tabs/tw/material.d.ts +326 -136
- 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 +26 -22
- 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
|
@@ -1,28 +1,32 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.KoineButtonComposite = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = require("react");
|
|
7
|
+
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
8
|
+
var Root = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n min-width: 0;\n\n & svg {\n font-size: 2em !important;\n margin: 0 0.33em 0 0 !important;\n }\n"], ["\n ", "\n min-width: 0;\n\n & svg {\n font-size: 2em !important;\n margin: 0 0.33em 0 0 !important;\n }\n"])), function (p) {
|
|
6
9
|
return p.$icon ? "display: flex;" : "display: inline-block; text-align: left;";
|
|
7
10
|
});
|
|
8
|
-
var ButtonCompositeIcon =
|
|
9
|
-
var BesidesIcon =
|
|
10
|
-
var Main =
|
|
11
|
-
var Sub =
|
|
12
|
-
var Text =
|
|
13
|
-
var Inner = memo(function (_a) {
|
|
11
|
+
var ButtonCompositeIcon = styled_components_1.default.svg(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n float: left;\n"], ["\n float: left;\n"])));
|
|
12
|
+
var BesidesIcon = styled_components_1.default.span(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n text-align: left;\n line-height: 1.2;\n"], ["\n text-align: left;\n line-height: 1.2;\n"])));
|
|
13
|
+
var Main = styled_components_1.default.span(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n display: block;\n font-size: 0.9em;\n\n &:last-child {\n margin-top: ", ";\n }\n"], ["\n display: block;\n font-size: 0.9em;\n\n &:last-child {\n margin-top: ", ";\n }\n"])), function (p) { return (p.$reverse && !p.$icon ? "0.5em" : "0"); });
|
|
14
|
+
var Sub = styled_components_1.default.span(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n display: block;\n text-transform: none;\n font-size: 0.7em;\n font-weight: 500;\n\n ", " + & {\n margin-top: ", ";\n }\n"], ["\n display: block;\n text-transform: none;\n font-size: 0.7em;\n font-weight: 500;\n\n ", " + & {\n margin-top: ", ";\n }\n"])), Main, function (p) { return (p.$reverse && !p.$icon ? "0.5em" : "0"); });
|
|
15
|
+
var Text = styled_components_1.default.span(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject([""], [""])));
|
|
16
|
+
var Inner = (0, react_1.memo)(function (_a) {
|
|
14
17
|
var textMain = _a.textMain, textSub = _a.textSub, text = _a.text, $reverse = _a.$reverse, $icon = _a.$icon;
|
|
15
|
-
return (
|
|
18
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [$reverse ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [textSub && ((0, jsx_runtime_1.jsx)(Sub, tslib_1.__assign({ "$icon": $icon, "$reverse": $reverse }, { children: textSub }))), textMain && ((0, jsx_runtime_1.jsx)(Main, tslib_1.__assign({ "$icon": $icon, "$reverse": $reverse }, { children: textMain })))] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [textMain && ((0, jsx_runtime_1.jsx)(Main, tslib_1.__assign({ "$icon": $icon, "$reverse": $reverse }, { children: textMain }))), textSub && ((0, jsx_runtime_1.jsx)(Sub, tslib_1.__assign({ "$icon": $icon, "$reverse": $reverse }, { children: textSub })))] })), text && (0, jsx_runtime_1.jsx)(Text, { children: text })] }));
|
|
16
19
|
});
|
|
17
|
-
|
|
18
|
-
var Icon = _a.Icon, _b = _a.iconProps, iconProps = _b === void 0 ? {} : _b, textMain = _a.textMain, textSub = _a.textSub, textReverse = _a.textReverse, text = _a.text, _c = _a.Button, Button = _c === void 0 ? "button" : _c, _d = _a.ButtonLink, ButtonLink = _d === void 0 ? "a" : _d, props = __rest(_a, ["Icon", "iconProps", "textMain", "textSub", "textReverse", "text", "Button", "ButtonLink"]);
|
|
20
|
+
var KoineButtonComposite = function (_a) {
|
|
21
|
+
var Icon = _a.Icon, _b = _a.iconProps, iconProps = _b === void 0 ? {} : _b, textMain = _a.textMain, textSub = _a.textSub, textReverse = _a.textReverse, text = _a.text, _c = _a.Button, Button = _c === void 0 ? "button" : _c, _d = _a.ButtonLink, ButtonLink = _d === void 0 ? "a" : _d, props = tslib_1.__rest(_a, ["Icon", "iconProps", "textMain", "textSub", "textReverse", "text", "Button", "ButtonLink"]);
|
|
19
22
|
var Btn = props.href ? ButtonLink : Button;
|
|
20
23
|
var styledProps = {
|
|
21
24
|
$icon: !!Icon,
|
|
22
25
|
$reverse: textReverse,
|
|
23
26
|
$twoLines: !!(textMain && textSub && !Icon),
|
|
24
27
|
};
|
|
25
|
-
var innerProps = __assign({ textMain: textMain, textSub: textSub, text: text }, styledProps);
|
|
26
|
-
return (
|
|
28
|
+
var innerProps = tslib_1.__assign({ textMain: textMain, textSub: textSub, text: text }, styledProps);
|
|
29
|
+
return ((0, jsx_runtime_1.jsxs)(Root, tslib_1.__assign({ as: Btn }, props, styledProps, { children: [Icon && (0, jsx_runtime_1.jsx)(ButtonCompositeIcon, tslib_1.__assign({ as: Icon }, iconProps)), Icon ? ((0, jsx_runtime_1.jsx)(BesidesIcon, tslib_1.__assign({}, styledProps, { children: (0, jsx_runtime_1.jsx)(Inner, tslib_1.__assign({}, innerProps)) }))) : ((0, jsx_runtime_1.jsx)(Inner, tslib_1.__assign({}, innerProps)))] })));
|
|
27
30
|
};
|
|
31
|
+
exports.KoineButtonComposite = KoineButtonComposite;
|
|
28
32
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { __assign, __makeTemplateObject, __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { memo } from "react";
|
|
4
|
+
import styled from "styled-components";
|
|
5
|
+
var Root = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n min-width: 0;\n\n & svg {\n font-size: 2em !important;\n margin: 0 0.33em 0 0 !important;\n }\n"], ["\n ", "\n min-width: 0;\n\n & svg {\n font-size: 2em !important;\n margin: 0 0.33em 0 0 !important;\n }\n"])), function (p) {
|
|
6
|
+
return p.$icon ? "display: flex;" : "display: inline-block; text-align: left;";
|
|
7
|
+
});
|
|
8
|
+
var ButtonCompositeIcon = styled.svg(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n float: left;\n"], ["\n float: left;\n"])));
|
|
9
|
+
var BesidesIcon = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n text-align: left;\n line-height: 1.2;\n"], ["\n text-align: left;\n line-height: 1.2;\n"])));
|
|
10
|
+
var Main = styled.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: block;\n font-size: 0.9em;\n\n &:last-child {\n margin-top: ", ";\n }\n"], ["\n display: block;\n font-size: 0.9em;\n\n &:last-child {\n margin-top: ", ";\n }\n"])), function (p) { return (p.$reverse && !p.$icon ? "0.5em" : "0"); });
|
|
11
|
+
var Sub = styled.span(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: block;\n text-transform: none;\n font-size: 0.7em;\n font-weight: 500;\n\n ", " + & {\n margin-top: ", ";\n }\n"], ["\n display: block;\n text-transform: none;\n font-size: 0.7em;\n font-weight: 500;\n\n ", " + & {\n margin-top: ", ";\n }\n"])), Main, function (p) { return (p.$reverse && !p.$icon ? "0.5em" : "0"); });
|
|
12
|
+
var Text = styled.span(templateObject_6 || (templateObject_6 = __makeTemplateObject([""], [""])));
|
|
13
|
+
var Inner = memo(function (_a) {
|
|
14
|
+
var textMain = _a.textMain, textSub = _a.textSub, text = _a.text, $reverse = _a.$reverse, $icon = _a.$icon;
|
|
15
|
+
return (_jsxs(_Fragment, { children: [$reverse ? (_jsxs(_Fragment, { children: [textSub && (_jsx(Sub, __assign({ "$icon": $icon, "$reverse": $reverse }, { children: textSub }))), textMain && (_jsx(Main, __assign({ "$icon": $icon, "$reverse": $reverse }, { children: textMain })))] })) : (_jsxs(_Fragment, { children: [textMain && (_jsx(Main, __assign({ "$icon": $icon, "$reverse": $reverse }, { children: textMain }))), textSub && (_jsx(Sub, __assign({ "$icon": $icon, "$reverse": $reverse }, { children: textSub })))] })), text && _jsx(Text, { children: text })] }));
|
|
16
|
+
});
|
|
17
|
+
export var KoineButtonComposite = function (_a) {
|
|
18
|
+
var Icon = _a.Icon, _b = _a.iconProps, iconProps = _b === void 0 ? {} : _b, textMain = _a.textMain, textSub = _a.textSub, textReverse = _a.textReverse, text = _a.text, _c = _a.Button, Button = _c === void 0 ? "button" : _c, _d = _a.ButtonLink, ButtonLink = _d === void 0 ? "a" : _d, props = __rest(_a, ["Icon", "iconProps", "textMain", "textSub", "textReverse", "text", "Button", "ButtonLink"]);
|
|
19
|
+
var Btn = props.href ? ButtonLink : Button;
|
|
20
|
+
var styledProps = {
|
|
21
|
+
$icon: !!Icon,
|
|
22
|
+
$reverse: textReverse,
|
|
23
|
+
$twoLines: !!(textMain && textSub && !Icon),
|
|
24
|
+
};
|
|
25
|
+
var innerProps = __assign({ textMain: textMain, textSub: textSub, text: text }, styledProps);
|
|
26
|
+
return (_jsxs(Root, __assign({ as: Btn }, props, styledProps, { children: [Icon && _jsx(ButtonCompositeIcon, __assign({ as: Icon }, iconProps)), Icon ? (_jsx(BesidesIcon, __assign({}, styledProps, { children: _jsx(Inner, __assign({}, innerProps)) }))) : (_jsx(Inner, __assign({}, innerProps)))] })));
|
|
27
|
+
};
|
|
28
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
package/Buttons/ButtonFab.js
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.IconButtonFab = exports.buttonFab = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var styled_components_1 = tslib_1.__importStar(require("styled-components"));
|
|
6
|
+
var IconButton_1 = require("./IconButton");
|
|
7
|
+
exports.buttonFab = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);\n"], ["\n box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);\n"])));
|
|
8
|
+
exports.IconButtonFab = (0, styled_components_1.default)(IconButton_1.IconButton)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.buttonFab);
|
|
6
9
|
var templateObject_1, templateObject_2;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { __makeTemplateObject } from "tslib";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { IconButton } from "./IconButton";
|
|
4
|
+
export var buttonFab = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);\n"], ["\n box-shadow: 3px 3px 6px -4px rgb(0, 0, 0, 0.5);\n"])));
|
|
5
|
+
export var IconButtonFab = styled(IconButton)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), buttonFab);
|
|
6
|
+
var templateObject_1, templateObject_2;
|
package/Buttons/ButtonLink.js
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.KoineButtonLink = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
7
|
+
var Button_1 = require("./Button");
|
|
8
|
+
var Root = (0, styled_components_1.default)(Button_1.KoineButton)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
|
|
9
|
+
var KoineButtonLink = function (_a) {
|
|
10
|
+
var href = _a.href, _b = _a.Link, Link = _b === void 0 ? "a" : _b, props = tslib_1.__rest(_a, ["href", "Link"]);
|
|
8
11
|
var isRelative = href && href.startsWith("/");
|
|
9
|
-
return isRelative ? (
|
|
12
|
+
return isRelative ? ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ href: href }, props, { as: Link }))) : ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ href: href }, props, { as: "a" })));
|
|
10
13
|
};
|
|
14
|
+
exports.KoineButtonLink = KoineButtonLink;
|
|
11
15
|
var templateObject_1;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { __assign, __makeTemplateObject, __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import styled from "styled-components";
|
|
4
|
+
import { KoineButton } from "./Button";
|
|
5
|
+
var Root = styled(KoineButton)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
|
|
6
|
+
export var KoineButtonLink = function (_a) {
|
|
7
|
+
var href = _a.href, _b = _a.Link, Link = _b === void 0 ? "a" : _b, props = __rest(_a, ["href", "Link"]);
|
|
8
|
+
var isRelative = href && href.startsWith("/");
|
|
9
|
+
return isRelative ? (_jsx(Root, __assign({ href: href }, props, { as: Link }))) : (_jsx(Root, __assign({ href: href }, props, { as: "a" })));
|
|
10
|
+
};
|
|
11
|
+
var templateObject_1;
|
package/Buttons/IconButton.js
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.IconButton = exports.iconBtnStyleBase = exports.iconBtnStyleReset = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var styled_components_1 = tslib_1.__importStar(require("styled-components"));
|
|
6
|
+
var Button_1 = require("./Button");
|
|
7
|
+
exports.iconBtnStyleReset = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 44px;\n height: 44px;\n border-radius: 100%;\n ", "\n"], ["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 44px;\n height: 44px;\n border-radius: 100%;\n ", "\n"])), Button_1.btnStyleReset);
|
|
8
|
+
exports.iconBtnStyleBase = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.iconBtnStyleReset);
|
|
9
|
+
exports.IconButton = styled_components_1.default.button(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n ", "\n ", "\n ", "\n"], ["\n ", "\n ", "\n ", "\n"])), exports.iconBtnStyleBase, function (p) { return p.$variant === "outlined" && Button_1.btnStyleOutlined; }, function (p) { return p.$variant === "contained" && Button_1.btnStyleContained; });
|
|
7
10
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { __makeTemplateObject } from "tslib";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { btnStyleReset, btnStyleOutlined, btnStyleContained, } from "./Button";
|
|
4
|
+
export var iconBtnStyleReset = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 44px;\n height: 44px;\n border-radius: 100%;\n ", "\n"], ["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 44px;\n height: 44px;\n border-radius: 100%;\n ", "\n"])), btnStyleReset);
|
|
5
|
+
export var iconBtnStyleBase = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), iconBtnStyleReset);
|
|
6
|
+
export var IconButton = styled.button(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n"], ["\n ", "\n ", "\n ", "\n"])), iconBtnStyleBase, function (p) { return p.$variant === "outlined" && btnStyleOutlined; }, function (p) { return p.$variant === "contained" && btnStyleContained; });
|
|
7
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
package/Buttons/index.js
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var tslib_1 = require("tslib");
|
|
4
|
+
tslib_1.__exportStar(require("./Button"), exports);
|
|
5
|
+
tslib_1.__exportStar(require("./ButtonComposite"), exports);
|
|
6
|
+
tslib_1.__exportStar(require("./ButtonFab"), exports);
|
|
7
|
+
tslib_1.__exportStar(require("./ButtonLink"), exports);
|
|
8
|
+
tslib_1.__exportStar(require("./IconButton"), exports);
|
package/Buttons/package.json
CHANGED
|
@@ -1,8 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.CalendarDaygridCell = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = require("react");
|
|
7
|
+
var md_1 = require("react-icons/md");
|
|
8
|
+
var utils_1 = require("./utils");
|
|
6
9
|
/**
|
|
7
10
|
* Style for button within a event cell
|
|
8
11
|
*
|
|
@@ -16,20 +19,20 @@ var styleBtn = {
|
|
|
16
19
|
whiteSpace: "nowrap",
|
|
17
20
|
textOverflow: "ellipsis",
|
|
18
21
|
};
|
|
19
|
-
|
|
22
|
+
var CalendarDaygridCell = function (_a) {
|
|
20
23
|
var eventClicked = _a.eventClicked, setEventClicked = _a.setEventClicked,
|
|
21
24
|
// eventHovered,
|
|
22
25
|
setEventHovered = _a.setEventHovered, view = _a.view, maxEvents = _a.maxEvents, events = _a.events, calendarsMap = _a.calendarsMap, _b = _a.Cell, Cell = _b === void 0 ? "div" : _b, _c = _a.CellOverflow, CellOverflow = _c === void 0 ? "div" : _c, _d = _a.CellEvent, CellEvent = _d === void 0 ? "div" : _d, _e = _a.CellEventBtn, CellEventBtn = _e === void 0 ? "div" : _e, _f = _a.CellEventTitle, CellEventTitle = _f === void 0 ? "span" : _f, _g = _a.CellEventStart, CellEventStart = _g === void 0 ? "span" : _g;
|
|
23
|
-
var _h = useState(false), isExpanded = _h[0], expand = _h[1];
|
|
26
|
+
var _h = (0, react_1.useState)(false), isExpanded = _h[0], expand = _h[1];
|
|
24
27
|
var eventsWithoutPlaceholders = events.filter(function (event) { return !event.placeholder; });
|
|
25
|
-
return (
|
|
28
|
+
return ((0, jsx_runtime_1.jsx)(Cell, { children: events.map(function (event, i) {
|
|
26
29
|
if (i === maxEvents && !isExpanded) {
|
|
27
|
-
return (
|
|
30
|
+
return ((0, jsx_runtime_1.jsxs)(CellOverflow, tslib_1.__assign({ onClick: function () { return expand(true); } }, { children: [(0, jsx_runtime_1.jsx)(md_1.MdAdd, {}), eventsWithoutPlaceholders.length - maxEvents] }), "overflowMessage" + i));
|
|
28
31
|
}
|
|
29
32
|
if (i > maxEvents && !isExpanded)
|
|
30
33
|
return null;
|
|
31
34
|
if (event.placeholder) {
|
|
32
|
-
return (
|
|
35
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: (0, jsx_runtime_1.jsx)(CellEvent, tslib_1.__assign({ "$placeholder": true }, { children: (0, jsx_runtime_1.jsx)(CellEventBtn, tslib_1.__assign({ "aria-hidden": "true", style: { visibility: "hidden" }, "$placeholder": true }, { children: (0, jsx_runtime_1.jsx)(CellEventTitle, { children: "\u00A0" }) })) })) }, event.key));
|
|
33
36
|
}
|
|
34
37
|
var styleEvent = {
|
|
35
38
|
zIndex: event.firstOfMulti ? 1 : 0,
|
|
@@ -48,10 +51,11 @@ export var CalendarDaygridCell = function (_a) {
|
|
|
48
51
|
$isOutOfRange: event.$isOutOfRange,
|
|
49
52
|
$isToday: event.$isToday,
|
|
50
53
|
};
|
|
51
|
-
return (
|
|
54
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: (0, jsx_runtime_1.jsx)(CellEvent, tslib_1.__assign({ style: styleEvent }, styledProps, { children: (0, jsx_runtime_1.jsx)(CellEventBtn, tslib_1.__assign({ role: "button", style: styleBtn }, styledProps, { onClick: function () {
|
|
52
55
|
return setEventClicked(function (prev) {
|
|
53
56
|
return (prev === null || prev === void 0 ? void 0 : prev.uid) === event.uid ? null : event;
|
|
54
57
|
});
|
|
55
|
-
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); } }, { children: event.allDay ? (
|
|
58
|
+
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); } }, { children: event.allDay ? ((0, jsx_runtime_1.jsx)(CellEventTitle, { children: event.title })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(CellEventStart, { children: (0, utils_1.getDisplayTime)(event.start) }), (0, jsx_runtime_1.jsx)(CellEventTitle, { children: event.title })] })) })) })) }, event.key));
|
|
56
59
|
}) }));
|
|
57
60
|
};
|
|
61
|
+
exports.CalendarDaygridCell = CalendarDaygridCell;
|
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
var react_1 = require("react");
|
|
7
|
-
var md_1 = require("react-icons/md");
|
|
8
|
-
var utils_1 = require("./utils");
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { Fragment, useState } from "react";
|
|
4
|
+
import { MdAdd as IconExpand } from "react-icons/md";
|
|
5
|
+
import { getDisplayTime } from "./utils";
|
|
9
6
|
/**
|
|
10
7
|
* Style for button within a event cell
|
|
11
8
|
*
|
|
@@ -19,20 +16,20 @@ var styleBtn = {
|
|
|
19
16
|
whiteSpace: "nowrap",
|
|
20
17
|
textOverflow: "ellipsis",
|
|
21
18
|
};
|
|
22
|
-
var CalendarDaygridCell = function (_a) {
|
|
19
|
+
export var CalendarDaygridCell = function (_a) {
|
|
23
20
|
var eventClicked = _a.eventClicked, setEventClicked = _a.setEventClicked,
|
|
24
21
|
// eventHovered,
|
|
25
22
|
setEventHovered = _a.setEventHovered, view = _a.view, maxEvents = _a.maxEvents, events = _a.events, calendarsMap = _a.calendarsMap, _b = _a.Cell, Cell = _b === void 0 ? "div" : _b, _c = _a.CellOverflow, CellOverflow = _c === void 0 ? "div" : _c, _d = _a.CellEvent, CellEvent = _d === void 0 ? "div" : _d, _e = _a.CellEventBtn, CellEventBtn = _e === void 0 ? "div" : _e, _f = _a.CellEventTitle, CellEventTitle = _f === void 0 ? "span" : _f, _g = _a.CellEventStart, CellEventStart = _g === void 0 ? "span" : _g;
|
|
26
|
-
var _h =
|
|
23
|
+
var _h = useState(false), isExpanded = _h[0], expand = _h[1];
|
|
27
24
|
var eventsWithoutPlaceholders = events.filter(function (event) { return !event.placeholder; });
|
|
28
|
-
return ((
|
|
25
|
+
return (_jsx(Cell, { children: events.map(function (event, i) {
|
|
29
26
|
if (i === maxEvents && !isExpanded) {
|
|
30
|
-
return ((
|
|
27
|
+
return (_jsxs(CellOverflow, __assign({ onClick: function () { return expand(true); } }, { children: [_jsx(IconExpand, {}), eventsWithoutPlaceholders.length - maxEvents] }), "overflowMessage" + i));
|
|
31
28
|
}
|
|
32
29
|
if (i > maxEvents && !isExpanded)
|
|
33
30
|
return null;
|
|
34
31
|
if (event.placeholder) {
|
|
35
|
-
return ((
|
|
32
|
+
return (_jsx(Fragment, { children: _jsx(CellEvent, __assign({ "$placeholder": true }, { children: _jsx(CellEventBtn, __assign({ "aria-hidden": "true", style: { visibility: "hidden" }, "$placeholder": true }, { children: _jsx(CellEventTitle, { children: "\u00A0" }) })) })) }, event.key));
|
|
36
33
|
}
|
|
37
34
|
var styleEvent = {
|
|
38
35
|
zIndex: event.firstOfMulti ? 1 : 0,
|
|
@@ -51,11 +48,10 @@ var CalendarDaygridCell = function (_a) {
|
|
|
51
48
|
$isOutOfRange: event.$isOutOfRange,
|
|
52
49
|
$isToday: event.$isToday,
|
|
53
50
|
};
|
|
54
|
-
return ((
|
|
51
|
+
return (_jsx(Fragment, { children: _jsx(CellEvent, __assign({ style: styleEvent }, styledProps, { children: _jsx(CellEventBtn, __assign({ role: "button", style: styleBtn }, styledProps, { onClick: function () {
|
|
55
52
|
return setEventClicked(function (prev) {
|
|
56
53
|
return (prev === null || prev === void 0 ? void 0 : prev.uid) === event.uid ? null : event;
|
|
57
54
|
});
|
|
58
|
-
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); } }, { children: event.allDay ? ((
|
|
55
|
+
}, onMouseEnter: function () { return setEventHovered(event); }, onMouseLeave: function () { return setEventHovered(null); } }, { children: event.allDay ? (_jsx(CellEventTitle, { children: event.title })) : (_jsxs(_Fragment, { children: [_jsx(CellEventStart, { children: getDisplayTime(event.start) }), _jsx(CellEventTitle, { children: event.title })] })) })) })) }, event.key));
|
|
59
56
|
}) }));
|
|
60
57
|
};
|
|
61
|
-
exports.CalendarDaygridCell = CalendarDaygridCell;
|
|
@@ -1,23 +1,28 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.KoineCalendarDaygridNav = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var format_1 = tslib_1.__importDefault(require("date-fns/format"));
|
|
7
|
+
var useDateLocale_1 = require("../hooks/useDateLocale");
|
|
8
|
+
var KoineCalendarDaygridNav = function (_a) {
|
|
5
9
|
var range = _a.range, view = _a.view, todayInView = _a.todayInView, handlePrev = _a.handlePrev, handleNext = _a.handleNext, handleToday = _a.handleToday, handleView = _a.handleView, localeCode = _a.locale, _b = _a.NavRoot, NavRoot = _b === void 0 ? "nav" : _b, _c = _a.NavTitle, NavTitle = _c === void 0 ? "div" : _c, _d = _a.NavBtns, NavBtns = _d === void 0 ? "div" : _d, _e = _a.NavBtnPrev, NavBtnPrev = _e === void 0 ? "button" : _e, _f = _a.NavBtnNext, NavBtnNext = _f === void 0 ? "button" : _f, _g = _a.NavBtnToday, NavBtnToday = _g === void 0 ? "button" : _g, _h = _a.NavBtnViewMonth, NavBtnViewMonth = _h === void 0 ? "button" : _h, _j = _a.NavBtnViewWeek, NavBtnViewWeek = _j === void 0 ? "button" : _j;
|
|
6
10
|
var start = range[0], end = range[1];
|
|
7
|
-
var locale = useDateLocale(localeCode);
|
|
11
|
+
var locale = (0, useDateLocale_1.useDateLocale)(localeCode);
|
|
8
12
|
var opts = { locale: locale };
|
|
9
13
|
var formatted = "";
|
|
10
14
|
if (view === "month") {
|
|
11
|
-
formatted =
|
|
15
|
+
formatted = (0, format_1.default)(start, "MMMM yyyy", opts);
|
|
12
16
|
}
|
|
13
17
|
if (view === "week") {
|
|
14
18
|
var inSameMonth = start.getMonth() === end.getMonth();
|
|
15
19
|
if (inSameMonth) {
|
|
16
|
-
formatted =
|
|
20
|
+
formatted = (0, format_1.default)(start, "# MMMM yyyy", opts).replace("#", "".concat(start.getDate(), "-").concat(end.getDate()));
|
|
17
21
|
}
|
|
18
22
|
else {
|
|
19
|
-
formatted = "".concat(
|
|
23
|
+
formatted = "".concat((0, format_1.default)(start, "d MMMM", opts), " - ").concat((0, format_1.default)(end, "d MMMM yyyy", opts));
|
|
20
24
|
}
|
|
21
25
|
}
|
|
22
|
-
return (
|
|
26
|
+
return ((0, jsx_runtime_1.jsxs)(NavRoot, { children: [(0, jsx_runtime_1.jsxs)(NavBtns, { children: [(0, jsx_runtime_1.jsx)(NavBtnPrev, { onClick: handlePrev }), (0, jsx_runtime_1.jsx)(NavBtnNext, { onClick: handleNext }), (0, jsx_runtime_1.jsx)(NavBtnToday, { onClick: handleToday, disabled: todayInView }), (0, jsx_runtime_1.jsx)(NavBtnViewMonth, { onClick: function () { return handleView("month"); }, disabled: view === "month" }), (0, jsx_runtime_1.jsx)(NavBtnViewWeek, { onClick: function () { return handleView("week"); }, disabled: view === "week" })] }), (0, jsx_runtime_1.jsx)(NavTitle, { range: range, formatted: formatted })] }));
|
|
23
27
|
};
|
|
28
|
+
exports.KoineCalendarDaygridNav = KoineCalendarDaygridNav;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import format from "date-fns/format";
|
|
3
|
+
import { useDateLocale } from "../hooks/useDateLocale";
|
|
4
|
+
export var KoineCalendarDaygridNav = function (_a) {
|
|
5
|
+
var range = _a.range, view = _a.view, todayInView = _a.todayInView, handlePrev = _a.handlePrev, handleNext = _a.handleNext, handleToday = _a.handleToday, handleView = _a.handleView, localeCode = _a.locale, _b = _a.NavRoot, NavRoot = _b === void 0 ? "nav" : _b, _c = _a.NavTitle, NavTitle = _c === void 0 ? "div" : _c, _d = _a.NavBtns, NavBtns = _d === void 0 ? "div" : _d, _e = _a.NavBtnPrev, NavBtnPrev = _e === void 0 ? "button" : _e, _f = _a.NavBtnNext, NavBtnNext = _f === void 0 ? "button" : _f, _g = _a.NavBtnToday, NavBtnToday = _g === void 0 ? "button" : _g, _h = _a.NavBtnViewMonth, NavBtnViewMonth = _h === void 0 ? "button" : _h, _j = _a.NavBtnViewWeek, NavBtnViewWeek = _j === void 0 ? "button" : _j;
|
|
6
|
+
var start = range[0], end = range[1];
|
|
7
|
+
var locale = useDateLocale(localeCode);
|
|
8
|
+
var opts = { locale: locale };
|
|
9
|
+
var formatted = "";
|
|
10
|
+
if (view === "month") {
|
|
11
|
+
formatted = format(start, "MMMM yyyy", opts);
|
|
12
|
+
}
|
|
13
|
+
if (view === "week") {
|
|
14
|
+
var inSameMonth = start.getMonth() === end.getMonth();
|
|
15
|
+
if (inSameMonth) {
|
|
16
|
+
formatted = format(start, "# MMMM yyyy", opts).replace("#", "".concat(start.getDate(), "-").concat(end.getDate()));
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
formatted = "".concat(format(start, "d MMMM", opts), " - ").concat(format(end, "d MMMM yyyy", opts));
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
return (_jsxs(NavRoot, { children: [_jsxs(NavBtns, { children: [_jsx(NavBtnPrev, { onClick: handlePrev }), _jsx(NavBtnNext, { onClick: handleNext }), _jsx(NavBtnToday, { onClick: handleToday, disabled: todayInView }), _jsx(NavBtnViewMonth, { onClick: function () { return handleView("month"); }, disabled: view === "month" }), _jsx(NavBtnViewWeek, { onClick: function () { return handleView("week"); }, disabled: view === "week" })] }), _jsx(NavTitle, { range: range, formatted: formatted })] }));
|
|
23
|
+
};
|
|
@@ -1,20 +1,23 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.KoineCalendarDaygridTable = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = require("react");
|
|
7
|
+
var eachWeekOfInterval_1 = tslib_1.__importDefault(require("date-fns/eachWeekOfInterval"));
|
|
8
|
+
var react_swipeable_1 = require("react-swipeable");
|
|
9
|
+
var hooks_1 = require("../hooks");
|
|
10
|
+
var utils_1 = require("./utils");
|
|
11
|
+
var CalendarDaygridCell_1 = require("./CalendarDaygridCell");
|
|
9
12
|
function getView(range) {
|
|
10
13
|
var start = range[0], end = range[1];
|
|
11
|
-
var weeks =
|
|
14
|
+
var weeks = (0, eachWeekOfInterval_1.default)({ start: start, end: end }, { weekStartsOn: 1 });
|
|
12
15
|
return {
|
|
13
16
|
month: start.getMonth(),
|
|
14
17
|
weeks: weeks,
|
|
15
18
|
};
|
|
16
19
|
}
|
|
17
|
-
|
|
20
|
+
var KoineCalendarDaygridTable = function (_a) {
|
|
18
21
|
var localeCode = _a.locale, handlePrev = _a.handlePrev, handleNext = _a.handleNext, events = _a.events, dayLabels = _a.dayLabels, view = _a.view, range = _a.range, eventClicked = _a.eventClicked, setEventClicked = _a.setEventClicked, eventHovered = _a.eventHovered, setEventHovered = _a.setEventHovered, _b = _a.calendarsMap, calendarsMap = _b === void 0 ? {} : _b, _c = _a.maxEvents, maxEvents = _c === void 0 ? 5 : _c, _d = _a.Table, Table = _d === void 0 ? "table" : _d, _e = _a.TableHead, TableHead = _e === void 0 ? "thead" : _e, _f = _a.TableHeadCell, TableHeadCell = _f === void 0 ? "th" : _f, _g = _a.TableBody, TableBody = _g === void 0 ? "tbody" : _g, _h = _a.TableBodyRow, TableBodyRow = _h === void 0 ? "tr" : _h, _j = _a.TableBodyCell, TableBodyCell = _j === void 0 ? "td" : _j, _k = _a.TableBodyCellDate, TableBodyCellDate = _k === void 0 ? "div" : _k, Cell = _a.Cell, CellOverflow = _a.CellOverflow, CellEvent = _a.CellEvent, CellEventBtn = _a.CellEventBtn, CellEventTitle = _a.CellEventTitle, CellEventStart = _a.CellEventStart;
|
|
19
22
|
var restKoine = {
|
|
20
23
|
Cell: Cell,
|
|
@@ -24,26 +27,26 @@ export var KoineCalendarDaygridTable = function (_a) {
|
|
|
24
27
|
CellEventTitle: CellEventTitle,
|
|
25
28
|
CellEventStart: CellEventStart,
|
|
26
29
|
};
|
|
27
|
-
var _l = useState(dayLabels || [0, 1, 2, 3, 4, 5, 6]), days = _l[0], setDays = _l[1];
|
|
28
|
-
var _m = useState([]), weeksEvents = _m[0], setWeeksEvents = _m[1];
|
|
30
|
+
var _l = (0, react_1.useState)(dayLabels || [0, 1, 2, 3, 4, 5, 6]), days = _l[0], setDays = _l[1];
|
|
31
|
+
var _m = (0, react_1.useState)([]), weeksEvents = _m[0], setWeeksEvents = _m[1];
|
|
29
32
|
// const [days, setDays] = useState(dayLabels || [...Array(7).keys()]);
|
|
30
|
-
var locale = useDateLocale(localeCode);
|
|
31
|
-
var _o = useMemo(function () { return getView(range); }, [range]), month = _o.month, weeks = _o.weeks;
|
|
32
|
-
var swipeableHandlers = useSwipeable({
|
|
33
|
+
var locale = (0, hooks_1.useDateLocale)(localeCode);
|
|
34
|
+
var _o = (0, react_1.useMemo)(function () { return getView(range); }, [range]), month = _o.month, weeks = _o.weeks;
|
|
35
|
+
var swipeableHandlers = (0, react_swipeable_1.useSwipeable)({
|
|
33
36
|
onSwipedLeft: handleNext,
|
|
34
37
|
onSwipedRight: handlePrev,
|
|
35
38
|
});
|
|
36
|
-
useEffect(function () {
|
|
37
|
-
setWeeksEvents(processEventsInView(events, view, month, weeks));
|
|
39
|
+
(0, react_1.useEffect)(function () {
|
|
40
|
+
setWeeksEvents((0, utils_1.processEventsInView)(events, view, month, weeks));
|
|
38
41
|
}, [events, view, month, weeks]);
|
|
39
|
-
useEffect(function () {
|
|
42
|
+
(0, react_1.useEffect)(function () {
|
|
40
43
|
if (locale && locale.localize && !dayLabels) {
|
|
41
44
|
setDays([1, 2, 3, 4, 5, 6, 0].map(
|
|
42
45
|
// @ts-expect-error nevermind
|
|
43
46
|
function (i) { return locale.localize.day(i, { width: "abbreviated" }); }));
|
|
44
47
|
}
|
|
45
48
|
}, [locale, dayLabels]);
|
|
46
|
-
return (
|
|
49
|
+
return ((0, jsx_runtime_1.jsxs)(Table, tslib_1.__assign({}, swipeableHandlers, { children: [(0, jsx_runtime_1.jsx)(TableHead, { children: (0, jsx_runtime_1.jsx)("tr", { children: days.map(function (day) { return ((0, jsx_runtime_1.jsx)(TableHeadCell, tslib_1.__assign({ scope: "column" }, { children: day }), day)); }) }) }), (0, jsx_runtime_1.jsx)(TableBody, { children: weeksEvents.map(function (week, i) { return ((0, jsx_runtime_1.jsx)(TableBodyRow, tslib_1.__assign({}, week.props, { children: week.days.map(function (day) { return ((0, jsx_runtime_1.jsxs)(TableBodyCell, tslib_1.__assign({}, day.props, { children: [(0, jsx_runtime_1.jsx)(TableBodyCellDate, tslib_1.__assign({}, day.props, { children: day.label })), day.events.length > 0 && ((0, jsx_runtime_1.jsx)(CalendarDaygridCell_1.CalendarDaygridCell, tslib_1.__assign({}, {
|
|
47
50
|
eventClicked: eventClicked,
|
|
48
51
|
setEventClicked: setEventClicked,
|
|
49
52
|
eventHovered: eventHovered,
|
|
@@ -55,3 +58,4 @@ export var KoineCalendarDaygridTable = function (_a) {
|
|
|
55
58
|
calendarsMap: calendarsMap,
|
|
56
59
|
}, restKoine)))] }))); }) }))); }) })] })));
|
|
57
60
|
};
|
|
61
|
+
exports.KoineCalendarDaygridTable = KoineCalendarDaygridTable;
|
|
@@ -1,23 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
var hooks_1 = require("../hooks");
|
|
10
|
-
var utils_1 = require("./utils");
|
|
11
|
-
var CalendarDaygridCell_1 = require("./CalendarDaygridCell");
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect, useMemo, useState } from "react";
|
|
4
|
+
import eachWeekOfInterval from "date-fns/eachWeekOfInterval";
|
|
5
|
+
import { useSwipeable } from "react-swipeable";
|
|
6
|
+
import { useDateLocale } from "../hooks";
|
|
7
|
+
import { processEventsInView } from "./utils";
|
|
8
|
+
import { CalendarDaygridCell, } from "./CalendarDaygridCell";
|
|
12
9
|
function getView(range) {
|
|
13
10
|
var start = range[0], end = range[1];
|
|
14
|
-
var weeks = (
|
|
11
|
+
var weeks = eachWeekOfInterval({ start: start, end: end }, { weekStartsOn: 1 });
|
|
15
12
|
return {
|
|
16
13
|
month: start.getMonth(),
|
|
17
14
|
weeks: weeks,
|
|
18
15
|
};
|
|
19
16
|
}
|
|
20
|
-
var KoineCalendarDaygridTable = function (_a) {
|
|
17
|
+
export var KoineCalendarDaygridTable = function (_a) {
|
|
21
18
|
var localeCode = _a.locale, handlePrev = _a.handlePrev, handleNext = _a.handleNext, events = _a.events, dayLabels = _a.dayLabels, view = _a.view, range = _a.range, eventClicked = _a.eventClicked, setEventClicked = _a.setEventClicked, eventHovered = _a.eventHovered, setEventHovered = _a.setEventHovered, _b = _a.calendarsMap, calendarsMap = _b === void 0 ? {} : _b, _c = _a.maxEvents, maxEvents = _c === void 0 ? 5 : _c, _d = _a.Table, Table = _d === void 0 ? "table" : _d, _e = _a.TableHead, TableHead = _e === void 0 ? "thead" : _e, _f = _a.TableHeadCell, TableHeadCell = _f === void 0 ? "th" : _f, _g = _a.TableBody, TableBody = _g === void 0 ? "tbody" : _g, _h = _a.TableBodyRow, TableBodyRow = _h === void 0 ? "tr" : _h, _j = _a.TableBodyCell, TableBodyCell = _j === void 0 ? "td" : _j, _k = _a.TableBodyCellDate, TableBodyCellDate = _k === void 0 ? "div" : _k, Cell = _a.Cell, CellOverflow = _a.CellOverflow, CellEvent = _a.CellEvent, CellEventBtn = _a.CellEventBtn, CellEventTitle = _a.CellEventTitle, CellEventStart = _a.CellEventStart;
|
|
22
19
|
var restKoine = {
|
|
23
20
|
Cell: Cell,
|
|
@@ -27,26 +24,26 @@ var KoineCalendarDaygridTable = function (_a) {
|
|
|
27
24
|
CellEventTitle: CellEventTitle,
|
|
28
25
|
CellEventStart: CellEventStart,
|
|
29
26
|
};
|
|
30
|
-
var _l =
|
|
31
|
-
var _m =
|
|
27
|
+
var _l = useState(dayLabels || [0, 1, 2, 3, 4, 5, 6]), days = _l[0], setDays = _l[1];
|
|
28
|
+
var _m = useState([]), weeksEvents = _m[0], setWeeksEvents = _m[1];
|
|
32
29
|
// const [days, setDays] = useState(dayLabels || [...Array(7).keys()]);
|
|
33
|
-
var locale =
|
|
34
|
-
var _o =
|
|
35
|
-
var swipeableHandlers =
|
|
30
|
+
var locale = useDateLocale(localeCode);
|
|
31
|
+
var _o = useMemo(function () { return getView(range); }, [range]), month = _o.month, weeks = _o.weeks;
|
|
32
|
+
var swipeableHandlers = useSwipeable({
|
|
36
33
|
onSwipedLeft: handleNext,
|
|
37
34
|
onSwipedRight: handlePrev,
|
|
38
35
|
});
|
|
39
|
-
|
|
40
|
-
setWeeksEvents(
|
|
36
|
+
useEffect(function () {
|
|
37
|
+
setWeeksEvents(processEventsInView(events, view, month, weeks));
|
|
41
38
|
}, [events, view, month, weeks]);
|
|
42
|
-
|
|
39
|
+
useEffect(function () {
|
|
43
40
|
if (locale && locale.localize && !dayLabels) {
|
|
44
41
|
setDays([1, 2, 3, 4, 5, 6, 0].map(
|
|
45
42
|
// @ts-expect-error nevermind
|
|
46
43
|
function (i) { return locale.localize.day(i, { width: "abbreviated" }); }));
|
|
47
44
|
}
|
|
48
45
|
}, [locale, dayLabels]);
|
|
49
|
-
return ((
|
|
46
|
+
return (_jsxs(Table, __assign({}, swipeableHandlers, { children: [_jsx(TableHead, { children: _jsx("tr", { children: days.map(function (day) { return (_jsx(TableHeadCell, __assign({ scope: "column" }, { children: day }), day)); }) }) }), _jsx(TableBody, { children: weeksEvents.map(function (week, i) { return (_jsx(TableBodyRow, __assign({}, week.props, { children: week.days.map(function (day) { return (_jsxs(TableBodyCell, __assign({}, day.props, { children: [_jsx(TableBodyCellDate, __assign({}, day.props, { children: day.label })), day.events.length > 0 && (_jsx(CalendarDaygridCell, __assign({}, {
|
|
50
47
|
eventClicked: eventClicked,
|
|
51
48
|
setEventClicked: setEventClicked,
|
|
52
49
|
eventHovered: eventHovered,
|
|
@@ -58,4 +55,3 @@ var KoineCalendarDaygridTable = function (_a) {
|
|
|
58
55
|
calendarsMap: calendarsMap,
|
|
59
56
|
}, restKoine)))] }))); }) }))); }) })] })));
|
|
60
57
|
};
|
|
61
|
-
exports.KoineCalendarDaygridTable = KoineCalendarDaygridTable;
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.KoineCalendarLegend = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var KoineCalendarLegend = function (_a) {
|
|
4
7
|
// const sorted = Object.entries(calendarsMap).sort((a, b) => {
|
|
5
8
|
// const { name: nameA } = a[1];
|
|
6
9
|
// const { name: nameB } = b[1];
|
|
@@ -9,8 +12,9 @@ export var KoineCalendarLegend = function (_a) {
|
|
|
9
12
|
// else return 0;
|
|
10
13
|
// });
|
|
11
14
|
var _b = _a.calendarsMap, calendarsMap = _b === void 0 ? {} : _b, toggleCalendarVisibility = _a.toggleCalendarVisibility, _c = _a.LegendItem, LegendItem = _c === void 0 ? "div" : _c, _d = _a.LegendItemStatus, LegendItemStatus = _d === void 0 ? "span" : _d, _e = _a.LegendItemLabel, LegendItemLabel = _e === void 0 ? "span" : _e, _f = _a.LegendItemEvents, LegendItemEvents = _f === void 0 ? "span" : _f;
|
|
12
|
-
return (
|
|
15
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.entries(calendarsMap).map(function (_a) {
|
|
13
16
|
var id = _a[0], calendar = _a[1];
|
|
14
|
-
return (
|
|
17
|
+
return ((0, jsx_runtime_1.jsxs)(LegendItem, tslib_1.__assign({ onClick: function () { return toggleCalendarVisibility(id); }, "$color": calendar.color, "$empty": calendar.events === 0, disabled: calendar.events === 0 }, { children: [(0, jsx_runtime_1.jsx)(LegendItemStatus, { children: calendar.on ? "\u2b24" : "\u2b58" }), (0, jsx_runtime_1.jsx)(LegendItemLabel, { children: calendar.name }), (0, jsx_runtime_1.jsx)(LegendItemEvents, { children: calendar.events })] }), "CalendarLegend." + id));
|
|
15
18
|
}) }));
|
|
16
19
|
};
|
|
20
|
+
exports.KoineCalendarLegend = KoineCalendarLegend;
|