@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
package/node/Form/index.js
DELETED
package/node/Form/sc/bare.js
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.KoineForm = exports.Feedback = exports.Overlay = exports.Root = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
var styled_1 = require("../../styles/styled");
|
|
7
|
-
var Collapsable_1 = require("../../Collapsable");
|
|
8
|
-
var Progress_1 = require("../../Progress");
|
|
9
|
-
var Alert_1 = require("../../Alert");
|
|
10
|
-
var helpers_1 = require("../../helpers");
|
|
11
|
-
var _ = tslib_1.__importStar(require("../Form"));
|
|
12
|
-
exports.Root = (0, styled_components_1.default)(_.Root)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
13
|
-
exports.Overlay = (0, styled_components_1.default)(_.Overlay)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n z-index: 4;\n ", "\n ", "\n background: rgba(var(--bodyBg--rgb),.8);\n pointer-events: none;\n backdrop-filter: blur(2px);\n"], ["\n z-index: 4;\n ", "\n ", "\n background: rgba(var(--bodyBg--rgb),.8);\n pointer-events: none;\n backdrop-filter: blur(2px);\n"])), styled_1.overlay, styled_1.centered);
|
|
14
|
-
exports.Feedback = (0, styled_components_1.default)(Alert_1.Alert)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n padding: 2em 0;\n"], ["\n padding: 2em 0;\n"])));
|
|
15
|
-
exports.KoineForm = (0, helpers_1.extendComponent)(_.KoineForm, {
|
|
16
|
-
Root: exports.Root,
|
|
17
|
-
Overlay: exports.Overlay,
|
|
18
|
-
Progress: Progress_1.ProgressCircular,
|
|
19
|
-
Collapsable: Collapsable_1.Collapsable,
|
|
20
|
-
Ok: exports.Feedback,
|
|
21
|
-
Fail: exports.Feedback,
|
|
22
|
-
});
|
|
23
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Checkbox = exports.CheckboxLabel = exports.CheckboxIndicator = exports.CheckboxToggle = exports.CheckboxRoot = 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 Toggle_1 = require("../Toggle");
|
|
9
|
-
var useToggle_1 = require("../Toggle/useToggle");
|
|
10
|
-
exports.CheckboxRoot = styled_components_1.default.label(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n cursor: pointer;\n"])));
|
|
11
|
-
exports.CheckboxToggle = (0, styled_components_1.default)(Toggle_1.Toggle)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n pointer-events: none;\n"], ["\n pointer-events: none;\n"])));
|
|
12
|
-
exports.CheckboxIndicator = (0, styled_components_1.default)(Toggle_1.ToggleIndicatorSquared)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
|
|
13
|
-
exports.CheckboxLabel = (0, styled_components_1.default)(Toggle_1.ToggleLabel)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n font-size: 0.8em;\n"], ["\n font-size: 0.8em;\n"])));
|
|
14
|
-
/**
|
|
15
|
-
* All logic and invisible Inputs come from the `useToggle` hook
|
|
16
|
-
*/
|
|
17
|
-
exports.Checkbox = (0, react_1.forwardRef)(function Checkbox(props, ref) {
|
|
18
|
-
var _a = (0, useToggle_1.useToggle)(props, ref), rootProps = _a.rootProps, Inputs = _a.Inputs, label = _a.label;
|
|
19
|
-
return ((0, jsx_runtime_1.jsxs)(exports.CheckboxRoot, tslib_1.__assign({}, rootProps, { children: [(0, jsx_runtime_1.jsxs)(exports.CheckboxToggle, { children: [Inputs, (0, jsx_runtime_1.jsx)(exports.CheckboxIndicator, {})] }), label && (0, jsx_runtime_1.jsx)(exports.CheckboxLabel, { children: label })] })));
|
|
20
|
-
});
|
|
21
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Feedback = 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 Root = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n margin-top: 0.2em;\n font-size: 12px;\n ", "\n"], ["\n margin-top: 0.2em;\n font-size: 12px;\n ", "\n"])), function (p) { return (p.$danger ? "color: var(--danger);" : ""); });
|
|
8
|
-
var Feedback = function (_a) {
|
|
9
|
-
var $danger = _a.$danger, children = _a.children;
|
|
10
|
-
return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ role: "alert", "$danger": $danger }, { children: children })));
|
|
11
|
-
};
|
|
12
|
-
exports.Feedback = Feedback;
|
|
13
|
-
var templateObject_1;
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Field = exports.FieldRoot = exports.FieldBase = exports.field = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
var styled_components_1 = tslib_1.__importStar(require("styled-components"));
|
|
7
|
-
var Feedback_1 = require("../Feedback");
|
|
8
|
-
exports.field = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n padding-bottom: 20px;\n"], ["\n padding-bottom: 20px;\n"])));
|
|
9
|
-
exports.FieldBase = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.field);
|
|
10
|
-
exports.FieldRoot = (0, styled_components_1.default)(exports.FieldBase)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (p) {
|
|
11
|
-
return (p.$danger &&
|
|
12
|
-
"\n color: var(--danger);\n \n textarea,\n input,\n select {\n color: var(--danger);\n }\n ");
|
|
13
|
-
});
|
|
14
|
-
var Field = function (_a) {
|
|
15
|
-
var name = _a.name, t = _a.t, error = _a.error, errors = _a.errors, children = _a.children, props = tslib_1.__rest(_a, ["name", "t", "error", "errors", "children"]);
|
|
16
|
-
var err = (errors && name ? errors[name] : error);
|
|
17
|
-
var msg = "";
|
|
18
|
-
if (err) {
|
|
19
|
-
if (name && t && err.type !== "plain") {
|
|
20
|
-
msg = t("errors.".concat(name, ".").concat(err.type || err.message));
|
|
21
|
-
}
|
|
22
|
-
else {
|
|
23
|
-
msg = err.message;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
// dynamic i18n namespace loading does not seem to work yet
|
|
27
|
-
// const t = useT("core.Forms");
|
|
28
|
-
// const { locale } = useRouter();
|
|
29
|
-
// useEffect(() => {
|
|
30
|
-
// i18n.addResourceBundle(locale, "core.Forms", null);
|
|
31
|
-
// }, []);
|
|
32
|
-
return ((0, jsx_runtime_1.jsxs)(exports.FieldRoot, tslib_1.__assign({ "$danger": !!err }, props, { children: [children, msg && (0, jsx_runtime_1.jsx)(Feedback_1.Feedback, tslib_1.__assign({ "$danger": true }, { children: msg }))] })));
|
|
33
|
-
};
|
|
34
|
-
exports.Field = Field;
|
|
35
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.FieldControl = 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 react_hook_form_1 = require("react-hook-form");
|
|
8
|
-
var decode_1 = tslib_1.__importDefault(require("@koine/utils/decode"));
|
|
9
|
-
var Field_1 = require("./Field");
|
|
10
|
-
var FieldHint_1 = require("./FieldHint");
|
|
11
|
-
var styles_1 = require("../styles");
|
|
12
|
-
/**
|
|
13
|
-
*
|
|
14
|
-
* - it expects the `field` object from our `useForm` wrapper around react-hook-form
|
|
15
|
-
* - automatically get translated strings from the given `t` function` for the
|
|
16
|
-
* field `label`, `placeholder` and `errors`. The .json expected by the `t` function
|
|
17
|
-
* look like this:
|
|
18
|
-
*
|
|
19
|
-
* ```json
|
|
20
|
-
* ```
|
|
21
|
-
*/
|
|
22
|
-
var FieldControl = function (_a) {
|
|
23
|
-
var control = _a.control, register = _a.register, setValue = _a.setValue, maybeEncodedName = _a.name, label = _a.label, placeholder = _a.placeholder, hint = _a.hint, t = _a.t, _b = _a.showError, showError = _b === void 0 ? true : _b, children = _a.children, encode = _a.encode, props = tslib_1.__rest(_a, ["control", "register", "setValue", "name", "label", "placeholder", "hint", "t", "showError", "children", "encode"]);
|
|
24
|
-
var name = encode ? (0, decode_1.default)(maybeEncodedName) : maybeEncodedName;
|
|
25
|
-
var errors = (0, react_hook_form_1.useFormState)({ name: name, control: control }).errors;
|
|
26
|
-
var error = showError && errors[name] ? errors[name] : null;
|
|
27
|
-
var FormFieldContent = (0, react_1.useMemo)(function () {
|
|
28
|
-
return children({
|
|
29
|
-
control: control,
|
|
30
|
-
register: register,
|
|
31
|
-
setValue: setValue,
|
|
32
|
-
name: maybeEncodedName,
|
|
33
|
-
// @see https://github.com/vinissimus/next-translate/pull/461
|
|
34
|
-
// @see https://github.com/vinissimus/next-translate/issues/429
|
|
35
|
-
label: label || t("labels.".concat(name), undefined, { default: "" }),
|
|
36
|
-
placeholder: placeholder || t("placeholders.".concat(name), undefined, { fallback: "" }),
|
|
37
|
-
});
|
|
38
|
-
}, [
|
|
39
|
-
children,
|
|
40
|
-
control,
|
|
41
|
-
register,
|
|
42
|
-
setValue,
|
|
43
|
-
name,
|
|
44
|
-
label,
|
|
45
|
-
t,
|
|
46
|
-
maybeEncodedName,
|
|
47
|
-
placeholder,
|
|
48
|
-
]);
|
|
49
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Field_1.Field, tslib_1.__assign({ name: maybeEncodedName, t: t, error: error }, props, { children: [FormFieldContent, hint && (0, jsx_runtime_1.jsx)(FieldHint_1.FieldHint, { children: hint })] })), encode && register && (0, jsx_runtime_1.jsx)(styles_1.InputHoneypot, tslib_1.__assign({}, register(name)))] }));
|
|
50
|
-
};
|
|
51
|
-
exports.FieldControl = FieldControl;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.FieldHint = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
exports.FieldHint = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n padding-top: 0.6em;\n opacity: 0.7;\n font-size: 75%;\n"], ["\n padding-top: 0.6em;\n opacity: 0.7;\n font-size: 75%;\n"])));
|
|
7
|
-
var templateObject_1;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Input = exports.InputNative = exports.InputPost = exports.InputPre = exports.InputMain = exports.InputWrap = 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 Label_1 = require("../Label/Label");
|
|
9
|
-
var styles_1 = require("../styles");
|
|
10
|
-
exports.InputWrap = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
11
|
-
exports.InputMain = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n flex: 1;\n"], ["\n flex: 1;\n"])));
|
|
12
|
-
exports.InputPre = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
|
|
13
|
-
exports.InputPost = styled_components_1.default.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject([""], [""])));
|
|
14
|
-
exports.InputNative = styled_components_1.default.input(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), styles_1.inputBase, styles_1.inputFocus);
|
|
15
|
-
exports.Input = (0, react_1.forwardRef)(function Input(_a, ref) {
|
|
16
|
-
var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
|
|
17
|
-
// console.log("Input: render");
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsx)(exports.InputNative, tslib_1.__assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
|
|
19
|
-
});
|
|
20
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.InputGroup = exports.InputGroupButtonPost = exports.InputGroupButtonPre = exports.InputGroupMain = exports.InputGroupRoot = 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 Buttons_1 = require("../../Buttons");
|
|
8
|
-
var Field_1 = require("../Field");
|
|
9
|
-
var media_1 = require("../../styles/media");
|
|
10
|
-
exports.InputGroupRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n display: flex;\n ", " {\n flex-direction: column;\n }\n"], ["\n ", "\n display: flex;\n ", " {\n flex-direction: column;\n }\n"])), Field_1.field, media_1.max.sm);
|
|
11
|
-
exports.InputGroupMain = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n flex: 1;\n"], ["\n flex: 1;\n"])));
|
|
12
|
-
exports.InputGroupButtonPre = (0, styled_components_1.default)(Buttons_1.KoineButton)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n ", " {\n border-bottom: 0;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n ", " {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n"], ["\n ", " {\n border-bottom: 0;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n ", " {\n border-right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n"])), media_1.max.sm, media_1.min.sm);
|
|
13
|
-
exports.InputGroupButtonPost = (0, styled_components_1.default)(Buttons_1.KoineButton)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n ", " {\n border-top: 0;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n ", " {\n border-left: 0;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n"], ["\n ", " {\n border-top: 0;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n ", " {\n border-left: 0;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n"])), media_1.max.sm, media_1.min.sm);
|
|
14
|
-
var InputGroup = function (_a) {
|
|
15
|
-
var pre = _a.pre, post = _a.post, _b = _a.Button, Button = _b === void 0 ? Buttons_1.KoineButton : _b, _c = _a.btnProps, btnProps = _c === void 0 ? {} : _c, children = _a.children, props = tslib_1.__rest(_a, ["pre", "post", "Button", "btnProps", "children"]);
|
|
16
|
-
return ((0, jsx_runtime_1.jsxs)(exports.InputGroupRoot, tslib_1.__assign({}, props, { children: [pre && (0, jsx_runtime_1.jsx)(exports.InputGroupButtonPre, tslib_1.__assign({ as: Button }, btnProps)), (0, jsx_runtime_1.jsx)(exports.InputGroupMain, { children: children }), post && (0, jsx_runtime_1.jsx)(exports.InputGroupButtonPost, tslib_1.__assign({ as: Button }, btnProps))] })));
|
|
17
|
-
};
|
|
18
|
-
exports.InputGroup = InputGroup;
|
|
19
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Label = exports.labelMaterial = exports.label = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
exports.label = "\n display: flex;\n font-size: 13px;\n cursor: pointer;\n";
|
|
7
|
-
exports.labelMaterial = "\n z-index: 2;\n position: relative;\n display: inline-block;\n padding: 0 5px;\n font-weight: 100;\n font-size: 10px;\n background: var(--bodyBg);\n transform: translateY(-0.3em) translateX(1em);\n cursor: pointer;\n\n + * {\n margin-top: -1em;\n }\n";
|
|
8
|
-
exports.Label = styled_components_1.default.label(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.labelMaterial);
|
|
9
|
-
var templateObject_1;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Password = exports.PasswordInputNative = 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 im_1 = require("react-icons/im");
|
|
9
|
-
var Label_1 = require("../Label/Label");
|
|
10
|
-
var Input_1 = require("../Input/Input");
|
|
11
|
-
var ICON_WIDTH = "2em";
|
|
12
|
-
var PasswordInputWrap = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
13
|
-
exports.PasswordInputNative = (0, styled_components_1.default)(Input_1.InputNative)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n position: relative;\n padding-right: ", ";\n"], ["\n position: relative;\n padding-right: ", ";\n"])), ICON_WIDTH);
|
|
14
|
-
var PasswordIcon = styled_components_1.default.span(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n opacity: 0.5;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n opacity: 0.5;\n"])), ICON_WIDTH);
|
|
15
|
-
exports.Password = (0, react_1.forwardRef)(function Password(_a, ref) {
|
|
16
|
-
var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
|
|
17
|
-
var _b = (0, react_1.useState)(false), visible = _b[0], setVisible = _b[1];
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsxs)(PasswordInputWrap, { children: [(0, jsx_runtime_1.jsx)(exports.PasswordInputNative, tslib_1.__assign({ type: visible ? "text" : "password", autoComplete: "new-password" }, (register ? register(name) : { name: name, ref: ref }), props)), (0, jsx_runtime_1.jsx)(PasswordIcon, tslib_1.__assign({ onClick: function () { return setVisible(function (prev) { return !prev; }); } }, { children: visible ? (0, jsx_runtime_1.jsx)(im_1.ImEyeBlocked, {}) : (0, jsx_runtime_1.jsx)(im_1.ImEye, {}) }))] })] }));
|
|
19
|
-
});
|
|
20
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Radio = 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 Label_1 = require("../Label/Label");
|
|
9
|
-
var Toggle_1 = require("../Toggle");
|
|
10
|
-
var styles_1 = require("../styles");
|
|
11
|
-
var RadioRoot = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));
|
|
12
|
-
var RadioLabel = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), Label_1.label);
|
|
13
|
-
var RadioOptionRoot = styled_components_1.default.label(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n display: flex;\n align-items: center;\n padding: 0.05em;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n padding: 0.05em;\n cursor: pointer;\n"])));
|
|
14
|
-
var RadioToggle = (0, styled_components_1.default)(Toggle_1.Toggle)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject([""], [""])));
|
|
15
|
-
var RadioIndicator = (0, styled_components_1.default)(Toggle_1.ToggleIndicatorSquared)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject([""], [""])));
|
|
16
|
-
var RadioOptionLabel = (0, styled_components_1.default)(Toggle_1.ToggleLabel)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject([""], [""])));
|
|
17
|
-
var RadioOption = (0, react_1.forwardRef)(function RadioOption(_a, ref) {
|
|
18
|
-
var register = _a.register, name = _a.name, label = _a.label, $ref = _a.$ref, props = tslib_1.__rest(_a, ["register", "name", "label", "$ref"]);
|
|
19
|
-
var inputProps = register ? register(name) : { name: name, ref: $ref || ref };
|
|
20
|
-
return ((0, jsx_runtime_1.jsxs)(RadioOptionRoot, { children: [(0, jsx_runtime_1.jsxs)(RadioToggle, { children: [(0, jsx_runtime_1.jsx)(styles_1.InputInvisible, tslib_1.__assign({ type: "radio" }, inputProps, props)), (0, jsx_runtime_1.jsx)(RadioIndicator, {})] }), (0, jsx_runtime_1.jsx)(RadioOptionLabel, { children: label })] }));
|
|
21
|
-
});
|
|
22
|
-
exports.Radio = (0, react_1.forwardRef)(function Radio(_a, ref) {
|
|
23
|
-
var label = _a.label, options = _a.options, props = tslib_1.__rest(_a, ["label", "options"]);
|
|
24
|
-
if (!options)
|
|
25
|
-
return null;
|
|
26
|
-
return ((0, jsx_runtime_1.jsxs)(RadioRoot, { children: [label && (0, jsx_runtime_1.jsx)(RadioLabel, { children: label }), options.map(function (option, idx) { return ((0, jsx_runtime_1.jsx)(RadioOption, tslib_1.__assign({}, option, props, { "$ref": ref }), idx)); })] }));
|
|
27
|
-
});
|
|
28
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Switch = exports.SwitchHandle = exports.SwitchTrack = 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 Checkbox_1 = require("../Checkbox");
|
|
9
|
-
var Toggle_1 = require("../Toggle");
|
|
10
|
-
var useToggle_1 = require("../Toggle/useToggle");
|
|
11
|
-
var styled_1 = require("../../styles/styled");
|
|
12
|
-
var SWITCH_GUTTER = 0.25;
|
|
13
|
-
var SWITCH_HANDLE_SIZE = 1;
|
|
14
|
-
exports.SwitchTrack = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: relative;\n width: ", "em;\n height: ", "em;\n padding: ", "em;\n border-radius: ", "em;\n ", "\n\n input:focus ~ & {\n ", "\n }\n\n input:disabled ~ & {\n opacity: 0.5;\n cursor: not-allowed;\n }\n"], ["\n position: relative;\n width: ", "em;\n height: ", "em;\n padding: ", "em;\n border-radius: ", "em;\n ", "\n\n input:focus ~ & {\n ", "\n }\n\n input:disabled ~ & {\n opacity: 0.5;\n cursor: not-allowed;\n }\n"])), SWITCH_HANDLE_SIZE * 3, SWITCH_HANDLE_SIZE * 1.5, SWITCH_GUTTER, SWITCH_HANDLE_SIZE, Toggle_1.toggleBase, styled_1.stateFocus);
|
|
15
|
-
exports.SwitchHandle = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n position: absolute;\n width: ", "em;\n height: ", "em;\n left: ", "em;\n margin-top: -1px;\n /* border: 1px solid currentColor; */\n background: currentColor;\n opacity: 0.5;\n border-radius: 100%;\n transition: all 0.18s ease-in-out;\n\n input:checked + ", " & {\n opacity: 1;\n left: calc(100% - ", "em - ", "em);\n }\n"], ["\n position: absolute;\n width: ", "em;\n height: ", "em;\n left: ", "em;\n margin-top: -1px;\n /* border: 1px solid currentColor; */\n background: currentColor;\n opacity: 0.5;\n border-radius: 100%;\n transition: all 0.18s ease-in-out;\n\n input:checked + ", " & {\n opacity: 1;\n left: calc(100% - ", "em - ", "em);\n }\n"])), SWITCH_HANDLE_SIZE, SWITCH_HANDLE_SIZE, SWITCH_GUTTER, exports.SwitchTrack, SWITCH_HANDLE_SIZE, SWITCH_GUTTER);
|
|
16
|
-
/**
|
|
17
|
-
* All logic and invisible Inputs come from the `useToggle` hook
|
|
18
|
-
*/
|
|
19
|
-
exports.Switch = (0, react_1.forwardRef)(function Switch(props, ref) {
|
|
20
|
-
var _a = (0, useToggle_1.useToggle)(props, ref), rootProps = _a.rootProps, Inputs = _a.Inputs, label = _a.label;
|
|
21
|
-
return ((0, jsx_runtime_1.jsxs)(Checkbox_1.CheckboxRoot, tslib_1.__assign({}, rootProps, { children: [Inputs, (0, jsx_runtime_1.jsx)(exports.SwitchTrack, { children: (0, jsx_runtime_1.jsx)(exports.SwitchHandle, {}) }), label && (0, jsx_runtime_1.jsx)(Checkbox_1.CheckboxLabel, { children: label })] })));
|
|
22
|
-
});
|
|
23
|
-
var templateObject_1, templateObject_2;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Textarea = exports.TextareaNative = 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 Label_1 = require("../Label/Label");
|
|
9
|
-
var styles_1 = require("../styles");
|
|
10
|
-
exports.TextareaNative = styled_components_1.default.textarea(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n ", "\n resize: vertical;\n"], ["\n ", "\n ", "\n resize: vertical;\n"])), styles_1.inputBase, styles_1.inputFocus);
|
|
11
|
-
exports.Textarea = (0, react_1.forwardRef)(function Textarea(_a, ref) {
|
|
12
|
-
var register = _a.register, name = _a.name, label = _a.label, props = tslib_1.__rest(_a, ["register", "name", "label"]);
|
|
13
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsx)(exports.TextareaNative, tslib_1.__assign({}, (register ? register(name) : { name: name, ref: ref }), props))] }));
|
|
14
|
-
});
|
|
15
|
-
var templateObject_1;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TextareaRich = 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
|
-
// import TextareaAutosize from "@mui/base/TextareaAutosize";
|
|
9
|
-
var Label_1 = require("../Label/Label");
|
|
10
|
-
var Editor_1 = require("../../Editor");
|
|
11
|
-
var helpers_1 = require("../helpers");
|
|
12
|
-
var Root = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n .ProseMirror {\n max-height: 160px;\n overflow: auto;\n }\n .EditorContent {\n position: relative;\n &:after {\n position: absolute;\n content: \"\";\n bottom: 0;\n left: 0;\n right: 16px; /* scrollbar width? */\n height: 3em;\n background: linear-gradient(0deg, white, white 33%, transparent);\n pointer-events: none;\n }\n }\n"], ["\n .ProseMirror {\n max-height: 160px;\n overflow: auto;\n }\n .EditorContent {\n position: relative;\n &:after {\n position: absolute;\n content: \"\";\n bottom: 0;\n left: 0;\n right: 16px; /* scrollbar width? */\n height: 3em;\n background: linear-gradient(0deg, white, white 33%, transparent);\n pointer-events: none;\n }\n }\n"])));
|
|
13
|
-
exports.TextareaRich = (0, react_1.forwardRef)(function TextareaRich(_a, ref) {
|
|
14
|
-
var register = _a.register, setValue = _a.setValue, name = _a.name, label = _a.label, _b = _a.defaultValue, defaultValue = _b === void 0 ? "" : _b, onChange = _a.onChange, props = tslib_1.__rest(_a, ["register", "setValue", "name", "label", "defaultValue", "onChange"]);
|
|
15
|
-
if (register)
|
|
16
|
-
register(name);
|
|
17
|
-
return ((0, jsx_runtime_1.jsxs)(Root, { children: [label && (0, jsx_runtime_1.jsx)(Label_1.Label, { children: label }), (0, jsx_runtime_1.jsx)(Editor_1.Editor, tslib_1.__assign({ options: {
|
|
18
|
-
// element: <TextareaAutosize />,
|
|
19
|
-
content: defaultValue,
|
|
20
|
-
onUpdate: (onChange || setValue) && name
|
|
21
|
-
? function (_a) {
|
|
22
|
-
var editor = _a.editor;
|
|
23
|
-
var value = editor.getHTML();
|
|
24
|
-
if (setValue)
|
|
25
|
-
setValue(name, value);
|
|
26
|
-
(0, helpers_1.triggerOnChange)(onChange, name, value);
|
|
27
|
-
}
|
|
28
|
-
: undefined,
|
|
29
|
-
} }, props))] }));
|
|
30
|
-
});
|
|
31
|
-
var templateObject_1;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ToggleIndicatorRounded = exports.ToggleIndicatorSquared = exports.ToggleIndicatorFg = exports.ToggleIndicatorBgCircle = exports.ToggleIndicatorBgSquare = exports.ToggleIndicatorHolder = exports.ToggleLabelSub = exports.ToggleLabel = exports.Toggle = exports.toggleIndicatorFg = exports.toggleIndicatorBgShape = exports.toggleIndicatorBg = exports.toggleBase = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
/**
|
|
7
|
-
* @file
|
|
8
|
-
*
|
|
9
|
-
* About accessibility:
|
|
10
|
-
* - minimum target size of 44px https://www.w3.org/TR/WCAG21/#target-size
|
|
11
|
-
*/
|
|
12
|
-
var react_1 = require("react");
|
|
13
|
-
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
14
|
-
var styled_1 = require("../../styles/styled");
|
|
15
|
-
exports.toggleBase = "\n border: 1px solid var(--forms-border-color);\n";
|
|
16
|
-
exports.toggleIndicatorBg = "\n display: inline-block;\n flex-shrink: 0;\n width: 100%;\n height: 100%;\n";
|
|
17
|
-
exports.toggleIndicatorBgShape = "\n ".concat(exports.toggleIndicatorBg, "\n fill: none;\n stroke-width: 2px;\n stroke: var(--forms-border-color);\n");
|
|
18
|
-
exports.toggleIndicatorFg = "\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n fill: currentcolor;\n";
|
|
19
|
-
exports.Toggle = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 2em;\n height: 2em;\n margin: 0 -0.3em; /* rtl */\n padding: 0.3em;\n"], ["\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 2em;\n height: 2em;\n margin: 0 -0.3em; /* rtl */\n padding: 0.3em;\n"])));
|
|
20
|
-
exports.ToggleLabel = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n margin-left: 0.6em; /* rtl */\n"], ["\n margin-left: 0.6em; /* rtl */\n"])));
|
|
21
|
-
exports.ToggleLabelSub = styled_components_1.default.small(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n opacity: 0.7;\n font-size: 0.7em; ;\n"], ["\n opacity: 0.7;\n font-size: 0.7em; ;\n"])));
|
|
22
|
-
exports.ToggleIndicatorHolder = styled_components_1.default.span(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n position: relative;\n display: flex;\n\n input:focus ~ & {\n ", "\n }\n"], ["\n position: relative;\n display: flex;\n\n input:focus ~ & {\n ", "\n }\n"])), styled_1.stateFocus);
|
|
23
|
-
exports.ToggleIndicatorBgSquare = styled_components_1.default.svg(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.toggleIndicatorBgShape);
|
|
24
|
-
exports.ToggleIndicatorBgCircle = styled_components_1.default.svg(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), exports.toggleIndicatorBgShape);
|
|
25
|
-
exports.ToggleIndicatorFg = styled_components_1.default.svg(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n ", "\n transform: scale(0);\n transition: transform 0.18s ease;\n\n input:checked + ", " & {\n transform: scale(1);\n }\n"], ["\n ", "\n transform: scale(0);\n transition: transform 0.18s ease;\n\n input:checked + ", " & {\n transform: scale(1);\n }\n"])), exports.toggleIndicatorFg, exports.ToggleIndicatorHolder);
|
|
26
|
-
var ToggleIndicatorSquared = function (props) {
|
|
27
|
-
return ((0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorHolder, { children: [(0, jsx_runtime_1.jsx)(exports.ToggleIndicatorBgSquare, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("rect", { width: "24", height: "24" }) })), (0, jsx_runtime_1.jsx)(exports.ToggleIndicatorFg, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z" }) }))] }));
|
|
28
|
-
};
|
|
29
|
-
exports.ToggleIndicatorSquared = ToggleIndicatorSquared;
|
|
30
|
-
var ToggleIndicatorRounded = function (_a) {
|
|
31
|
-
var _b = _a.r, r = _b === void 0 ? 6 : _b;
|
|
32
|
-
var id = (0, react_1.useId)();
|
|
33
|
-
return ((0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorHolder, { children: [(0, jsx_runtime_1.jsxs)(exports.ToggleIndicatorBgCircle, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: [(0, jsx_runtime_1.jsx)("circle", { cy: "12", cx: "12", r: "12", id: "r_".concat(id), clipPath: "url(#c_".concat(id, ")") }), (0, jsx_runtime_1.jsx)("clipPath", tslib_1.__assign({ id: "c_".concat(id) }, { children: (0, jsx_runtime_1.jsx)("use", { xlinkHref: "#r_".concat(id) }) }))] })), (0, jsx_runtime_1.jsx)(exports.ToggleIndicatorFg, tslib_1.__assign({ viewBox: "0 0 24 24" }, { children: (0, jsx_runtime_1.jsx)("circle", { r: r, cx: "12", cy: "12" }) }))] }));
|
|
34
|
-
};
|
|
35
|
-
exports.ToggleIndicatorRounded = ToggleIndicatorRounded;
|
|
36
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
package/node/Forms/index.js
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
var tslib_1 = require("tslib");
|
|
4
|
-
tslib_1.__exportStar(require("./antispam"), exports);
|
|
5
|
-
tslib_1.__exportStar(require("./Checkbox"), exports);
|
|
6
|
-
tslib_1.__exportStar(require("./Input"), exports);
|
|
7
|
-
tslib_1.__exportStar(require("./InputGroup"), exports);
|
|
8
|
-
tslib_1.__exportStar(require("./Feedback"), exports);
|
|
9
|
-
tslib_1.__exportStar(require("./Field"), exports);
|
|
10
|
-
tslib_1.__exportStar(require("./InputGroup"), exports);
|
|
11
|
-
tslib_1.__exportStar(require("./Label"), exports);
|
|
12
|
-
tslib_1.__exportStar(require("./Password"), exports);
|
|
13
|
-
tslib_1.__exportStar(require("./Radio"), exports);
|
|
14
|
-
// export * from "./Select";
|
|
15
|
-
tslib_1.__exportStar(require("./Switch"), exports);
|
|
16
|
-
tslib_1.__exportStar(require("./Textarea"), exports);
|
|
17
|
-
tslib_1.__exportStar(require("./Toggle"), exports);
|
|
18
|
-
tslib_1.__exportStar(require("./helpers"), exports);
|
|
19
|
-
tslib_1.__exportStar(require("./styles"), exports);
|
package/node/Forms/styles.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.inputFocus = exports.inputBase = exports.inputReset = exports.inputPadding = exports.inputBorder = exports.inputResetAutofill = exports.InputProgress = exports.InputHoneypot = exports.InputInvisible = 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 styled_1 = require("../styles/styled");
|
|
8
|
-
var ProgressLinear_1 = require("../Progress/ProgressLinear");
|
|
9
|
-
var styled_2 = require("../styles/styled");
|
|
10
|
-
exports.InputInvisible = styled_components_1.default.input(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), styled_2.invisible);
|
|
11
|
-
exports.InputHoneypot = (0, styled_components_1.default)(exports.InputInvisible).attrs({
|
|
12
|
-
type: "text",
|
|
13
|
-
autoComplete: "new-password",
|
|
14
|
-
tabIndex: -1,
|
|
15
|
-
})(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject([""], [""])));
|
|
16
|
-
exports.InputProgress = (0, styled_components_1.default)(function (p) { return ((0, jsx_runtime_1.jsx)(ProgressLinear_1.ProgressLinear, tslib_1.__assign({ fg: "var(--accent300)", bg: "var(--accent400)" }, p))); })(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n"], ["\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n"])));
|
|
17
|
-
/**
|
|
18
|
-
* Remove the default light blue background on autofilled inputs. To be used as
|
|
19
|
-
* a function that outputs a CSS string.
|
|
20
|
-
*
|
|
21
|
-
* @see https://stackoverflow.com/a/62624824/1938970
|
|
22
|
-
*/
|
|
23
|
-
exports.inputResetAutofill = "\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-background-clip: text;\n }\n";
|
|
24
|
-
/* FIXME: find a nice way to override this styling from implementation */
|
|
25
|
-
// border-bottom: 1px solid var(--forms-border-color);
|
|
26
|
-
// border: 0;
|
|
27
|
-
exports.inputBorder = "\n border: 1px solid var(--forms-border-color);\n";
|
|
28
|
-
exports.inputPadding = "\n padding: var(--forms-gutter-y) var(--forms-gutter-x);\n";
|
|
29
|
-
exports.inputReset = "\n width: 100%;\n min-height: 44px;\n ".concat(exports.inputBorder, "\n ").concat(exports.inputPadding, "\n");
|
|
30
|
-
exports.inputBase = "\n ".concat(exports.inputReset, "\n ").concat(exports.inputResetAutofill, "\n background: transparent;\n");
|
|
31
|
-
exports.inputFocus = "\n &:focus {\n outline: 0px;\n appearance: none;\n ".concat(styled_1.stateFocus, "\n }\n");
|
|
32
|
-
var templateObject_1, templateObject_2, templateObject_3;
|
package/node/Grid/Grid.js
DELETED
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.Col = exports.Row = exports.ContainerFluid = exports.Container = exports.GRID_GUTTER_DEFAULT = exports.GRID_COLUMNS = void 0;
|
|
4
|
-
var tslib_1 = require("tslib");
|
|
5
|
-
var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
exports.GRID_COLUMNS = 12;
|
|
7
|
-
exports.GRID_GUTTER_DEFAULT = "half";
|
|
8
|
-
exports.Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n max-width: ", "px;\n margin: 0 auto;\n padding: 0 ", "px;\n ", "\n"], ["\n max-width: ", "px;\n margin: 0 auto;\n padding: 0 ", "px;\n ", "\n"])), function (p) { return p.theme.breakpoints[p.size]; }, function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.clamp ? "overflow: hidden;" : ""); });
|
|
9
|
-
exports.ContainerFluid = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n padding: 0 ", "px;\n"], ["\n padding: 0 ", "px;\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; });
|
|
10
|
-
exports.Row = styled_components_1.default.div(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n margin: 0 -", "px;\n display: flex;\n ", "\n ", ";\n ", "\n"], ["\n margin: 0 -", "px;\n display: flex;\n ", "\n ", ";\n ", "\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.$noWrap ? "overflow: auto;" : "flex-wrap: wrap;"); }, function (p) { return (p.$valign ? "align-items: ".concat(p.$valign) : ""); }, function (p) {
|
|
11
|
-
return p.$reverse &&
|
|
12
|
-
"@media (".concat(p.$reverse.split(":")[0], "-width: ").concat(p.$reverse.split(":")[1], "px) {\n flex-direction: row-reverse;\n }");
|
|
13
|
-
});
|
|
14
|
-
exports.Col = styled_components_1.default.div(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n padding: 0 ", "px;\n display: ", ";\n ", ";\n ", ";\n"], ["\n padding: 0 ", "px;\n display: ", ";\n ", ";\n ", ";\n"])), function (p) { return p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]; }, function (p) { return (p.$flex ? "flex" : "block"); }, function (p) { return (p.$valign ? "align-items: " + p.$valign : ""); }, function (p) { return getColCss(p); });
|
|
15
|
-
function getColWidth(breakpoints, breakpoint, value) {
|
|
16
|
-
var breakpointValue = breakpoints[breakpoint] + "px";
|
|
17
|
-
var width = (value * 100) / exports.GRID_COLUMNS;
|
|
18
|
-
var cssValue = "\n min-width: ".concat(width, "%;\n flex: 0 0 ").concat(width, "%;\n");
|
|
19
|
-
if (breakpoint === Object.keys(breakpoints)[0]) {
|
|
20
|
-
return cssValue;
|
|
21
|
-
}
|
|
22
|
-
return "\n @media (min-width: ".concat(breakpointValue, "){\n ").concat(cssValue, "\n }");
|
|
23
|
-
}
|
|
24
|
-
function getColCss(props) {
|
|
25
|
-
var $auto = props.$auto, $offset = props.$offset, $width = props.$width;
|
|
26
|
-
var breakpoints = props.theme.breakpoints;
|
|
27
|
-
var css = "";
|
|
28
|
-
if ($offset) {
|
|
29
|
-
var offsets = $offset.split(",");
|
|
30
|
-
for (var i = 0; i <= offsets.length; i++) {
|
|
31
|
-
if (offsets[i]) {
|
|
32
|
-
var _a = offsets[i].split(":"), offsetBreakpoint = _a[0], offsetSize = _a[1];
|
|
33
|
-
css += " \n @media(min-width: ".concat(breakpoints[offsetBreakpoint], "px){\n margin-left: ").concat((100 * offsetSize) / exports.GRID_COLUMNS, "%;\n }\n ");
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
if ($width) {
|
|
38
|
-
// do nothing, width is set explicitly
|
|
39
|
-
}
|
|
40
|
-
else if ($auto) {
|
|
41
|
-
css += "flex: 0 0 auto; width: auto; max-width: none;";
|
|
42
|
-
}
|
|
43
|
-
else {
|
|
44
|
-
for (var breakpoint in breakpoints) {
|
|
45
|
-
var value = props[breakpoint];
|
|
46
|
-
if (typeof value !== "undefined") {
|
|
47
|
-
css += getColWidth(breakpoints, breakpoint, value);
|
|
48
|
-
}
|
|
49
|
-
else if (breakpoint === "xs") {
|
|
50
|
-
css += getColWidth(breakpoints, breakpoint, 12);
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
return css;
|
|
55
|
-
}
|
|
56
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
package/node/Grid/index.js
DELETED