@koine/react 1.0.11 → 1.0.14
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 +7 -13
- package/Animations/Reveal.js +12 -10
- package/Animations/Underline.js +3 -13
- package/Animations/useReveal.js +18 -17
- package/Autocomplete/AutocompleteDownshift.js +1 -1
- package/Autocomplete/AutocompleteDownshiftMultiselect.js +1 -1
- package/Autocomplete/AutocompleteMui.js +61 -56
- package/Autocomplete/AutocompleteReach.js +1 -1
- package/Autocomplete/components.js +17 -72
- package/Autocomplete/helpers.js +1 -1
- package/Bg/BgColor.js +14 -24
- package/Bg/BgPhoto.js +11 -54
- package/Bg/BgSvg.js +6 -9
- package/Breadcrumbs/Breadcrumbs.js +14 -54
- package/Buttons/Button.js +8 -73
- package/Buttons/ButtonComposite.js +20 -41
- package/Buttons/ButtonFab.js +4 -6
- package/Buttons/ButtonLink.js +7 -6
- package/Buttons/IconButton.js +5 -17
- package/Calendar/CalendarDaygridCell.js +20 -14
- package/Calendar/CalendarDaygridNav.js +10 -9
- package/Calendar/CalendarDaygridTable.js +32 -30
- package/Calendar/CalendarLegend.js +7 -2
- package/Calendar/calendar-api-google.js +101 -68
- package/Calendar/useCalendar.js +114 -113
- package/Calendar/utils.js +73 -74
- package/Carousel/Carousel.js +1 -1
- package/Carousel/CarouselCss.js +12 -26
- package/Collapsable/Collapsable.js +1 -1
- package/Debug/Debug.js +5 -17
- package/Details/Details.js +30 -27
- package/Dialog/DialogMui.js +22 -20
- package/Dialog/css/bare.js +17 -15
- package/Dialog/m/bare.js +17 -13
- package/Dialog/m/basic.js +2 -2
- package/Dialog/m/index.js +4 -4
- package/Dialog/sc/bare.js +25 -43
- package/Dialog/sc/framer.js +6 -6
- package/Dialog/sc/framerMaterial.js +6 -6
- package/Dialog/sc/material.js +17 -37
- package/Dialog/tw/bare.js +25 -19
- package/Dialog/tw/elegant.js +17 -15
- package/Dialog/tw/framer.js +6 -6
- package/Dialog/tw/framerMaterial.js +6 -6
- package/Dialog/tw/material.js +17 -15
- package/Editor/Editor--tiptap.js +14 -11
- package/Editor/components.js +6 -24
- package/Favicon/FaviconTags.js +2 -1
- package/Form/Form.js +30 -28
- package/Form/sc/bare.js +9 -18
- package/Forms/Checkbox/Checkbox.js +9 -15
- package/Forms/Feedback/Feedback.js +6 -7
- package/Forms/Field/Field.js +15 -26
- package/Forms/Field/FieldControl.js +19 -15
- package/Forms/Field/FieldHint.js +3 -5
- package/Forms/Input/Input.js +10 -16
- package/Forms/InputGroup/InputGroup.js +9 -36
- package/Forms/Label/Label.js +5 -23
- package/Forms/Password/Password.js +10 -23
- package/Forms/Radio/Radio.js +15 -18
- package/Forms/Switch/Switch.js +9 -39
- package/Forms/Textarea/Textarea.js +6 -7
- package/Forms/Textarea/TextareaRich.js +10 -24
- package/Forms/Toggle/Toggle.js +19 -67
- package/Forms/Toggle/useToggle.d.ts +1 -1
- package/Forms/Toggle/useToggle.js +30 -30
- package/Forms/antispam.js +12 -12
- package/Forms/helpers.js +7 -6
- package/Forms/styles.js +12 -43
- package/Gauge/Gauge.js +1 -1
- package/Grid/Grid.js +25 -51
- package/Hamburger/Hamburger.js +35 -47
- package/Header/useHeader.js +12 -12
- package/Hidden/Hidden.js +9 -13
- package/Img/sc/bare.js +3 -1
- package/Link/Link.js +3 -1
- package/Link/LinkBlank.js +8 -17
- package/Menu/Menu.js +3 -10
- package/MenuItem/MenuItem.js +3 -19
- package/Meta/Meta.js +3 -2
- package/NoJs/NoJs.js +2 -2
- package/Pagination/PaginationNav.js +26 -48
- package/Pagination/PaginationResults.js +7 -6
- package/Pill/Pill.js +6 -36
- package/Progress/ProgressCircular.js +9 -30
- package/Progress/ProgressLinear.js +8 -16
- package/Progress/ProgressOverlay.js +11 -27
- package/Rating/Rating.js +24 -44
- package/Rating/index.js +19 -15
- package/Select/SelectDownshift.js +1 -1
- package/Select/components.js +6 -12
- package/Sidebar/Sidebar.js +13 -38
- package/Spacing/Spacing.js +12 -12
- package/Sticky/Sticky.js +1 -1
- package/Sticky/StickyCss.js +4 -2
- package/Tabs/TabsMui.js +19 -16
- package/Tabs/tw/bare.js +13 -11
- package/Tabs/tw/material.js +15 -11
- package/Tabs/useTabs.js +16 -16
- package/Typography/CopyPasteVisible.js +3 -5
- package/Typography/Native.js +12 -45
- package/Typography/ReadMore.js +25 -51
- package/Typography/TextLoop.js +19 -22
- package/Typography/TypeStairs.js +20 -16
- package/helpers/classed.js +21 -18
- package/helpers/extend-component.js +6 -6
- package/hooks/useAsyncFn.js +18 -11
- package/hooks/useDateLocale.js +22 -13
- package/hooks/useEffectOnce.js +1 -1
- package/hooks/useFirstMountState.js +1 -1
- package/hooks/useFocus.js +3 -3
- package/hooks/useId.js +3 -2
- package/hooks/useIsomorphicLayoutEffect.js +1 -1
- package/hooks/useMount.js +2 -2
- package/hooks/useMountedState.js +4 -4
- package/hooks/usePrevious.js +2 -2
- package/hooks/useScrollPosition.js +20 -15
- package/hooks/useScrollTo.js +7 -5
- package/hooks/useTraceUpdate.js +4 -3
- package/hooks/useUpdateEffect.js +3 -3
- package/hooks/useWindowSize.js +3 -3
- package/m/MotionProvider.js +4 -2
- package/package.json +8 -7
- package/styles/Body.js +4 -8
- package/styles/Global.js +4 -36
- package/styles/media.js +41 -36
- package/styles/spacing.js +15 -16
- package/styles/styled.js +7 -21
- package/styles/theme--vanilla.js +20 -18
- package/styles/theme.js +11 -11
- package/node/Alert/Alert.js +0 -21
- package/node/Alert/index.js +0 -4
- package/node/Animations/Reveal.js +0 -19
- package/node/Animations/Underline.js +0 -19
- package/node/Animations/index.js +0 -6
- package/node/Animations/useReveal.js +0 -74
- package/node/Autocomplete/AutocompleteDownshift.js +0 -161
- package/node/Autocomplete/AutocompleteDownshiftMultiselect.js +0 -356
- package/node/Autocomplete/AutocompleteMui.js +0 -175
- package/node/Autocomplete/AutocompleteReach.js +0 -115
- package/node/Autocomplete/components.js +0 -93
- package/node/Autocomplete/helpers.js +0 -32
- package/node/Autocomplete/index.js +0 -7
- package/node/Bg/BgColor.js +0 -36
- package/node/Bg/BgPhoto.js +0 -64
- package/node/Bg/BgSvg.js +0 -20
- package/node/Bg/index.js +0 -6
- package/node/Breadcrumbs/Breadcrumbs.js +0 -72
- package/node/Breadcrumbs/index.js +0 -4
- package/node/Buttons/Button.js +0 -83
- package/node/Buttons/ButtonComposite.js +0 -54
- package/node/Buttons/ButtonFab.js +0 -12
- package/node/Buttons/ButtonLink.js +0 -15
- package/node/Buttons/IconButton.js +0 -23
- package/node/Buttons/index.js +0 -8
- package/node/Calendar/CalendarDaygridCell.js +0 -55
- package/node/Calendar/CalendarDaygridNav.js +0 -27
- package/node/Calendar/CalendarDaygridTable.js +0 -60
- package/node/Calendar/CalendarLegend.js +0 -15
- package/node/Calendar/calendar-api-google.js +0 -99
- package/node/Calendar/index.js +0 -9
- package/node/Calendar/types.js +0 -2
- package/node/Calendar/useCalendar.js +0 -186
- package/node/Calendar/utils.js +0 -217
- package/node/Carousel/Carousel.js +0 -381
- package/node/Carousel/CarouselCss.js +0 -42
- package/node/Carousel/index.js +0 -4
- package/node/Collapsable/Collapsable.js +0 -4
- package/node/Collapsable/CollapsableReach.js +0 -253
- package/node/Collapsable/index.js +0 -5
- package/node/Debug/Debug.js +0 -26
- package/node/Debug/index.js +0 -4
- package/node/Details/Details.js +0 -65
- package/node/Details/index.js +0 -4
- package/node/Dialog/DialogMui.js +0 -82
- package/node/Dialog/css/bare.js +0 -23
- package/node/Dialog/index.js +0 -5
- package/node/Dialog/m/bare.js +0 -51
- package/node/Dialog/m/basic.js +0 -35
- package/node/Dialog/m/index.js +0 -8
- package/node/Dialog/sc/bare.js +0 -65
- package/node/Dialog/sc/framer.js +0 -19
- package/node/Dialog/sc/framerMaterial.js +0 -19
- package/node/Dialog/sc/material.js +0 -45
- package/node/Dialog/tw/bare.js +0 -40
- package/node/Dialog/tw/elegant.js +0 -21
- package/node/Dialog/tw/framer.js +0 -19
- package/node/Dialog/tw/framerMaterial.js +0 -19
- package/node/Dialog/tw/material.js +0 -21
- package/node/Editor/Editor--tiptap.js +0 -29
- package/node/Editor/components.js +0 -34
- package/node/Editor/index.js +0 -4
- package/node/Favicon/FaviconTags.js +0 -18
- package/node/Favicon/index.js +0 -4
- package/node/Form/Form.js +0 -63
- package/node/Form/index.js +0 -4
- package/node/Form/sc/bare.js +0 -33
- package/node/Forms/Checkbox/Checkbox.js +0 -28
- package/node/Forms/Checkbox/index.js +0 -4
- package/node/Forms/Feedback/Feedback.js +0 -15
- package/node/Forms/Feedback/index.js +0 -4
- package/node/Forms/Field/Field.js +0 -64
- package/node/Forms/Field/FieldControl.js +0 -47
- package/node/Forms/Field/FieldHint.js +0 -10
- package/node/Forms/Field/index.js +0 -5
- package/node/Forms/Input/Input.js +0 -27
- package/node/Forms/Input/index.js +0 -4
- package/node/Forms/InputGroup/InputGroup.js +0 -47
- package/node/Forms/InputGroup/index.js +0 -4
- package/node/Forms/Label/Label.js +0 -28
- package/node/Forms/Label/index.js +0 -4
- package/node/Forms/Password/Password.js +0 -34
- package/node/Forms/Password/index.js +0 -4
- package/node/Forms/Radio/Radio.js +0 -32
- package/node/Forms/Radio/index.js +0 -4
- package/node/Forms/Switch/Switch.js +0 -54
- package/node/Forms/Switch/index.js +0 -4
- package/node/Forms/Textarea/Textarea.js +0 -17
- package/node/Forms/Textarea/TextareaRich.js +0 -46
- package/node/Forms/Textarea/index.js +0 -5
- package/node/Forms/Toggle/Toggle.js +0 -86
- package/node/Forms/Toggle/index.js +0 -4
- package/node/Forms/Toggle/useToggle.js +0 -149
- package/node/Forms/antispam.js +0 -61
- package/node/Forms/helpers.js +0 -51
- package/node/Forms/index.js +0 -19
- package/node/Forms/styles.js +0 -64
- package/node/Gauge/Gauge.js +0 -106
- package/node/Grid/Grid.js +0 -83
- package/node/Grid/index.js +0 -4
- package/node/Hamburger/Hamburger.js +0 -69
- package/node/Hamburger/index.js +0 -4
- package/node/Header/index.js +0 -4
- package/node/Header/useHeader.js +0 -34
- package/node/Hidden/Hidden.js +0 -18
- package/node/Hidden/index.js +0 -4
- package/node/Img/index.js +0 -4
- package/node/Img/sc/bare.js +0 -41
- package/node/Img/types.js +0 -2
- package/node/Link/Link.js +0 -6
- package/node/Link/LinkBlank.js +0 -31
- package/node/Link/index.js +0 -5
- package/node/Menu/Menu.js +0 -15
- package/node/Menu/index.js +0 -4
- package/node/MenuItem/MenuItem.js +0 -24
- package/node/MenuItem/index.js +0 -4
- package/node/Meta/Meta.js +0 -8
- package/node/Meta/index.js +0 -4
- package/node/NoJs/NoJs.js +0 -10
- package/node/NoJs/index.js +0 -4
- package/node/Pagination/PaginationNav.js +0 -88
- package/node/Pagination/PaginationResults.js +0 -15
- package/node/Pagination/index.js +0 -5
- package/node/Pill/Pill.js +0 -41
- package/node/Pill/index.js +0 -4
- package/node/Progress/ProgressCircular.js +0 -41
- package/node/Progress/ProgressLinear.js +0 -37
- package/node/Progress/ProgressOverlay.js +0 -45
- package/node/Progress/index.js +0 -6
- package/node/Rating/Rating.js +0 -97
- package/node/Rating/index.js +0 -53
- package/node/Select/SelectDownshift.js +0 -41
- package/node/Select/components.js +0 -22
- package/node/Select/index.js +0 -7
- package/node/Sidebar/Sidebar.js +0 -53
- package/node/Sidebar/index.js +0 -4
- package/node/Spacing/Spacing.js +0 -50
- package/node/Spacing/index.js +0 -4
- package/node/Sticky/Sticky.js +0 -222
- package/node/Sticky/StickyCss.js +0 -8
- package/node/Sticky/index.js +0 -4
- package/node/Tabs/TabsMui.js +0 -47
- package/node/Tabs/index.js +0 -4
- package/node/Tabs/sc/bare.js +0 -87
- package/node/Tabs/tw/bare.js +0 -19
- package/node/Tabs/tw/material.js +0 -17
- package/node/Tabs/useTabs.js +0 -48
- package/node/Typography/CopyPasteVisible.js +0 -10
- package/node/Typography/Native.js +0 -51
- package/node/Typography/ReadMore.js +0 -74
- package/node/Typography/TextLoop.js +0 -54
- package/node/Typography/TypeStairs.js +0 -49
- package/node/Typography/index.js +0 -8
- package/node/css/index.js +0 -36
- package/node/helpers/classed.js +0 -69
- package/node/helpers/extend-component.js +0 -16
- package/node/helpers/index.js +0 -5
- package/node/hooks/index.js +0 -18
- package/node/hooks/types.js +0 -2
- package/node/hooks/useAsyncFn.js +0 -33
- package/node/hooks/useDateLocale.js +0 -56
- package/node/hooks/useEffectOnce.js +0 -12
- package/node/hooks/useFirstMountState.js +0 -16
- package/node/hooks/useFocus.js +0 -15
- package/node/hooks/useId.js +0 -11
- package/node/hooks/useIsomorphicLayoutEffect.js +0 -11
- package/node/hooks/useMount.js +0 -13
- package/node/hooks/useMountedState.js +0 -19
- package/node/hooks/usePrevious.js +0 -12
- package/node/hooks/useScrollPosition.js +0 -79
- package/node/hooks/useScrollTo.js +0 -23
- package/node/hooks/useTraceUpdate.js +0 -24
- package/node/hooks/useUpdateEffect.js +0 -18
- package/node/hooks/useWindowSize.js +0 -17
- package/node/index.js +0 -8
- package/node/m/MotionProvider.js +0 -41
- 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 -21
- package/node/styles/Global.js +0 -53
- package/node/styles/index.js +0 -10
- package/node/styles/media.js +0 -156
- package/node/styles/spacing.js +0 -53
- package/node/styles/styled.js +0 -31
- package/node/styles/theme--vanilla.js +0 -59
- package/node/styles/theme.js +0 -45
- package/node/tw/index.js +0 -36
- package/node/twm/index.js +0 -36
- package/node/types.js +0 -2
package/node/Tabs/sc/bare.js
DELETED
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
// <reference types="@reach/utils/dist/declarations/src/polymorphic" />
|
|
3
|
-
/**
|
|
4
|
-
* @file
|
|
5
|
-
*
|
|
6
|
-
* Here we manage only "vertical" oriented tabs for now
|
|
7
|
-
*/
|
|
8
|
-
// import styled from "styled-components";
|
|
9
|
-
// import {
|
|
10
|
-
// Tabs as _Tabs,
|
|
11
|
-
// TabList as _TabList,
|
|
12
|
-
// Tab as _Tab,
|
|
13
|
-
// TabPanels as _TabPanels,
|
|
14
|
-
// TabPanel as _TabPanel,
|
|
15
|
-
// TabProps as _TabProps,
|
|
16
|
-
// TabsProps as _TabsProps,
|
|
17
|
-
// useTabsContext,
|
|
18
|
-
// } from "@reach/tabs";
|
|
19
|
-
// import { min } from "../../styles/media";
|
|
20
|
-
// import { UnderlineSkewed } from "../../Animations/Underline";
|
|
21
|
-
// import { btnStyleReset } from "../../Buttons/Button";
|
|
22
|
-
// export const Tabs = styled(_Tabs)<TabsProps>`
|
|
23
|
-
// ${min.sm} {
|
|
24
|
-
// display: flex;
|
|
25
|
-
// ${(p) => p.$vertical && "flex-direction: column;"}
|
|
26
|
-
// }
|
|
27
|
-
// `;
|
|
28
|
-
// export type TabsProps = React.PropsWithChildren<_TabsProps> & {
|
|
29
|
-
// $vertical?: boolean;
|
|
30
|
-
// };
|
|
31
|
-
// export const TabList = styled(_TabList)`
|
|
32
|
-
// display: flex;
|
|
33
|
-
// flex-direction: column;
|
|
34
|
-
// ${min.sm} {
|
|
35
|
-
// border-right: 1px solid var(--grey800);
|
|
36
|
-
// }
|
|
37
|
-
// `;
|
|
38
|
-
// export const TabWrap = styled(_Tab)<TabProps & TabStyledProps>`
|
|
39
|
-
// ${btnStyleReset}
|
|
40
|
-
// position: relative;
|
|
41
|
-
// justify-content: flex-end;
|
|
42
|
-
// padding: 0.7em;
|
|
43
|
-
// margin-bottom: 1em;
|
|
44
|
-
// font-weight: bold;
|
|
45
|
-
// color: ${(p) => (p.$active ? "var(--accent200)" : "var(--grey300)")};
|
|
46
|
-
// ${min.sm} {
|
|
47
|
-
// padding-right: var(--gutter-half);
|
|
48
|
-
// }
|
|
49
|
-
// &:hover {
|
|
50
|
-
// color: ${(p) => (p.$active ? "var(--accent200)" : "var(--accent300)")};
|
|
51
|
-
// }
|
|
52
|
-
// `;
|
|
53
|
-
// export const TabText = styled.span<TabStyledProps>`
|
|
54
|
-
// position: relative;
|
|
55
|
-
// z-index: 1;
|
|
56
|
-
// `;
|
|
57
|
-
// export const TabUnderline = styled(UnderlineSkewed)<TabStyledProps>``;
|
|
58
|
-
// export type TabStyledProps = {
|
|
59
|
-
// $active: boolean;
|
|
60
|
-
// $focused: boolean;
|
|
61
|
-
// };
|
|
62
|
-
// export type TabProps = _TabProps & {
|
|
63
|
-
// idx: number;
|
|
64
|
-
// };
|
|
65
|
-
// export const Tab = ({ children, ...props }: TabProps) => {
|
|
66
|
-
// const { selectedIndex, focusedIndex } = useTabsContext();
|
|
67
|
-
// const styledProps = {
|
|
68
|
-
// $active: props.idx === selectedIndex,
|
|
69
|
-
// $focused: props.idx === focusedIndex,
|
|
70
|
-
// };
|
|
71
|
-
// return (
|
|
72
|
-
// <TabWrap {...props} {...styledProps}>
|
|
73
|
-
// {styledProps.$active && (
|
|
74
|
-
// <TabUnderline {...styledProps} layoutId="Tab-underline" />
|
|
75
|
-
// )}
|
|
76
|
-
// <TabText {...styledProps}>{children}</TabText>
|
|
77
|
-
// </TabWrap>
|
|
78
|
-
// );
|
|
79
|
-
// };
|
|
80
|
-
// export const TabPanels = styled(_TabPanels)`
|
|
81
|
-
// flex: 1;
|
|
82
|
-
// `;
|
|
83
|
-
// export const TabPanel = styled(_TabPanel)`
|
|
84
|
-
// ${min.sm} {
|
|
85
|
-
// padding-left: var(--gutter-half);
|
|
86
|
-
// }
|
|
87
|
-
// `;
|
package/node/Tabs/tw/bare.js
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.KoineTabs = exports.Panel = exports.Indicator = exports.Tab = exports.List = exports.Root = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const helpers_1 = require("../../helpers");
|
|
6
|
-
// import type { ComponentsProps } from "../TabsMui";
|
|
7
|
-
const _ = tslib_1.__importStar(require("../TabsMui"));
|
|
8
|
-
exports.Root = (0, helpers_1.classed)(_.Root) `< class="tabs`;
|
|
9
|
-
exports.List = (0, helpers_1.classed)(_.List) `< class="tabsList flex`;
|
|
10
|
-
exports.Tab = (0, helpers_1.classed)(_.Tab) `< class="tabsTab inline-flex items-center justify-center [-webkit-tap-highlight-color:transparent] appearance-none select-none`;
|
|
11
|
-
exports.Indicator = (0, helpers_1.classed)(_.Indicator) `< class="tabsIndicator`;
|
|
12
|
-
exports.Panel = (0, helpers_1.classed)(_.Panel) `< class="tabsPanel`;
|
|
13
|
-
exports.KoineTabs = (0, helpers_1.extendComponent)(_.KoineTabs, {
|
|
14
|
-
Root: exports.Root,
|
|
15
|
-
List: exports.List,
|
|
16
|
-
Tab: exports.Tab,
|
|
17
|
-
Indicator: exports.Indicator,
|
|
18
|
-
Panel: exports.Panel,
|
|
19
|
-
});
|
package/node/Tabs/tw/material.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.KoineTabs = exports.Panel = exports.Indicator = exports.Tab = exports.List = exports.Root = void 0;
|
|
4
|
-
const helpers_1 = require("../../helpers");
|
|
5
|
-
const bare_1 = require("./bare");
|
|
6
|
-
exports.Root = (0, helpers_1.classed)(bare_1.KoineTabs.Root) `< class="`;
|
|
7
|
-
exports.List = (0, helpers_1.classed)(bare_1.KoineTabs.List) `< class="border-b-gray-200 border-b border-solid`;
|
|
8
|
-
exports.Tab = (0, helpers_1.classed)(bare_1.KoineTabs.Tab) `< class="flex-col relative py-3 px-4 uppercase`; // ${p => p.selected ? "text-cyan-600" : ""}
|
|
9
|
-
exports.Indicator = (0, helpers_1.classed)(bare_1.KoineTabs.Indicator) `< class="absolute bottom-0 w-full h-[2px] ${p => p.selected ? "bg-current" : ""}`;
|
|
10
|
-
exports.Panel = (0, helpers_1.classed)(bare_1.KoineTabs.Panel) `< class="tabsPanel`;
|
|
11
|
-
exports.KoineTabs = (0, helpers_1.extendComponent)(bare_1.KoineTabs, {
|
|
12
|
-
Root: exports.Root,
|
|
13
|
-
List: exports.List,
|
|
14
|
-
Tab: exports.Tab,
|
|
15
|
-
Indicator: exports.Indicator,
|
|
16
|
-
Panel: exports.Panel,
|
|
17
|
-
});
|
package/node/Tabs/useTabs.js
DELETED
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useTabs = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const utils_1 = require("@mui/utils");
|
|
6
|
-
const useId_1 = require("../hooks/useId");
|
|
7
|
-
const useTabs = (props) => {
|
|
8
|
-
const { value: valueProp, defaultValue, onChange, orientation, direction, selectionFollowsFocus, } = props;
|
|
9
|
-
const [value, setValue] = (0, utils_1.unstable_useControlled)({
|
|
10
|
-
controlled: valueProp,
|
|
11
|
-
default: defaultValue,
|
|
12
|
-
name: "Tabs",
|
|
13
|
-
state: "value",
|
|
14
|
-
});
|
|
15
|
-
const idPrefix = (0, useId_1.useId)();
|
|
16
|
-
const onSelected = (0, react_1.useCallback)((e, newValue) => {
|
|
17
|
-
setValue(newValue);
|
|
18
|
-
if (onChange) {
|
|
19
|
-
onChange(e, newValue);
|
|
20
|
-
}
|
|
21
|
-
}, [onChange, setValue]);
|
|
22
|
-
const getRootProps = () => {
|
|
23
|
-
return {};
|
|
24
|
-
};
|
|
25
|
-
const tabsContextValue = (0, react_1.useMemo)(() => {
|
|
26
|
-
return {
|
|
27
|
-
idPrefix,
|
|
28
|
-
value,
|
|
29
|
-
onSelected,
|
|
30
|
-
orientation,
|
|
31
|
-
direction,
|
|
32
|
-
selectionFollowsFocus,
|
|
33
|
-
};
|
|
34
|
-
}, [
|
|
35
|
-
idPrefix,
|
|
36
|
-
value,
|
|
37
|
-
onSelected,
|
|
38
|
-
orientation,
|
|
39
|
-
direction,
|
|
40
|
-
selectionFollowsFocus,
|
|
41
|
-
]);
|
|
42
|
-
return {
|
|
43
|
-
getRootProps,
|
|
44
|
-
tabsContextValue,
|
|
45
|
-
};
|
|
46
|
-
};
|
|
47
|
-
exports.useTabs = useTabs;
|
|
48
|
-
exports.default = exports.useTabs;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.CopyPasteVisible = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
exports.CopyPasteVisible = styled_components_1.default.span `
|
|
7
|
-
color: transparent;
|
|
8
|
-
opacity: 0;
|
|
9
|
-
font-size: 0;
|
|
10
|
-
`;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.H4 = exports.H3 = exports.H2 = exports.H1 = exports.P = exports.h4 = exports.h3 = exports.h2 = exports.h1 = exports.p = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
6
|
-
const media_1 = require("../styles/media");
|
|
7
|
-
exports.p = `
|
|
8
|
-
margin: 0 0 1em 0;
|
|
9
|
-
`;
|
|
10
|
-
exports.h1 = `
|
|
11
|
-
margin: 0 0 10px 0;
|
|
12
|
-
font-size: 30px;
|
|
13
|
-
font-weight: 800;
|
|
14
|
-
line-height: var(--headingsLineHeight);
|
|
15
|
-
${media_1.min.md} {
|
|
16
|
-
font-size: 50px;
|
|
17
|
-
}
|
|
18
|
-
`;
|
|
19
|
-
exports.h2 = `
|
|
20
|
-
margin: 0 0 1em 0;
|
|
21
|
-
font-size: 24px;
|
|
22
|
-
font-weight: 800;
|
|
23
|
-
line-height: var(--headingsLineHeight);
|
|
24
|
-
`;
|
|
25
|
-
exports.h3 = `
|
|
26
|
-
margin: 0 0 1em 0;
|
|
27
|
-
font-size: 20px;
|
|
28
|
-
font-weight: 600;
|
|
29
|
-
line-height: var(--headingsLineHeight);
|
|
30
|
-
`;
|
|
31
|
-
exports.h4 = `
|
|
32
|
-
margin: 0 0 1em 0;
|
|
33
|
-
font-size: 13px;
|
|
34
|
-
font-weight: 600;
|
|
35
|
-
line-height: var(--headingsLineHeight);
|
|
36
|
-
`;
|
|
37
|
-
exports.P = styled_components_1.default.div `
|
|
38
|
-
${exports.p}
|
|
39
|
-
`;
|
|
40
|
-
exports.H1 = styled_components_1.default.div `
|
|
41
|
-
${exports.h1}
|
|
42
|
-
`;
|
|
43
|
-
exports.H2 = styled_components_1.default.div `
|
|
44
|
-
${exports.h2}
|
|
45
|
-
`;
|
|
46
|
-
exports.H3 = styled_components_1.default.div `
|
|
47
|
-
${exports.h3}
|
|
48
|
-
`;
|
|
49
|
-
exports.H4 = styled_components_1.default.div `
|
|
50
|
-
${exports.h4}
|
|
51
|
-
`;
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ReadMore = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const react_1 = require("react");
|
|
7
|
-
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
|
|
8
|
-
const framer_motion_1 = require("framer-motion");
|
|
9
|
-
// import { CgArrowsExpandDownRight as IconExpand } from "react-icons/cg";
|
|
10
|
-
const hooks_1 = require("../hooks");
|
|
11
|
-
const Root = styled_components_1.default.div ``;
|
|
12
|
-
const Content = styled_components_1.default.div `
|
|
13
|
-
& p:first-child {
|
|
14
|
-
margin-top: 0;
|
|
15
|
-
}
|
|
16
|
-
`;
|
|
17
|
-
const BtnWrap = styled_components_1.default.span `
|
|
18
|
-
display: flex;
|
|
19
|
-
justify-content: flex-end;
|
|
20
|
-
transition: transform 0.18s ease-in-out;
|
|
21
|
-
text-align: right;
|
|
22
|
-
transform: translateY(${(p) => (p.$expanded ? "0" : "-100%")});
|
|
23
|
-
opacity: ${(p) => (p.$expanded ? 0 : 1)};
|
|
24
|
-
`;
|
|
25
|
-
const BtnFader = styled_components_1.default.div `
|
|
26
|
-
width: 30%;
|
|
27
|
-
transition: transform 0.18s ease-in-out;
|
|
28
|
-
background: linear-gradient(45deg, transparent 50%, ${(p) => p.$bg} 70%);
|
|
29
|
-
`;
|
|
30
|
-
const Btn = styled_components_1.default.span `
|
|
31
|
-
padding: 0 10px 0 10px;
|
|
32
|
-
line-height: ${(p) => (p.$lineHeight ? p.$lineHeight : "inherit")};
|
|
33
|
-
background: var(--bodyBg);
|
|
34
|
-
color: var(--grey600);
|
|
35
|
-
white-space: nowrap;
|
|
36
|
-
font-size: ${(p) => p.$fontSize}px;
|
|
37
|
-
cursor: pointer;
|
|
38
|
-
`;
|
|
39
|
-
const BtnIcon = styled_components_1.default.span `
|
|
40
|
-
display: inline-block;
|
|
41
|
-
margin: 0 0 0 4px;
|
|
42
|
-
transition: transform 0.18s ease-in-out;
|
|
43
|
-
${(p) => (p.$expanded ? "transform: rotate(180deg);" : "")};
|
|
44
|
-
font-size: ${(p) => p.$fontSize}px;
|
|
45
|
-
`;
|
|
46
|
-
const ReadMore = ({ lines = 3, lineHeight = 1.6, fontSize = 14, bg = "var(--bodyBg)", expand = "Expand", collapse = "Collapse", ...props }) => {
|
|
47
|
-
const defaultMaxHeight = lines * (lineHeight * fontSize);
|
|
48
|
-
const [expanded, setExpanded] = (0, react_1.useState)(false);
|
|
49
|
-
const [maxHeight, setMaxHeight] = (0, react_1.useState)(defaultMaxHeight);
|
|
50
|
-
const [fullHeight, setFullHeight] = (0, react_1.useState)(0);
|
|
51
|
-
const [exceeds, setExceeds] = (0, react_1.useState)(false);
|
|
52
|
-
const content = (0, react_1.useRef)(null);
|
|
53
|
-
const height = (0, framer_motion_1.useSpring)(defaultMaxHeight);
|
|
54
|
-
const styles = (0, react_1.useMemo)(() => (exceeds ? { height, overflow: "hidden" } : {}), [exceeds, height]);
|
|
55
|
-
const handleExpandClick = () => {
|
|
56
|
-
setExpanded((prevExpanded) => !prevExpanded);
|
|
57
|
-
};
|
|
58
|
-
(0, hooks_1.useIsomorphicLayoutEffect)(() => {
|
|
59
|
-
if (content.current) {
|
|
60
|
-
const elementHeight = content.current.offsetHeight;
|
|
61
|
-
const newExceeds = elementHeight > maxHeight;
|
|
62
|
-
if (!newExceeds) {
|
|
63
|
-
setMaxHeight(elementHeight);
|
|
64
|
-
}
|
|
65
|
-
setExceeds(newExceeds);
|
|
66
|
-
setFullHeight(elementHeight);
|
|
67
|
-
}
|
|
68
|
-
}, [content, maxHeight]);
|
|
69
|
-
(0, hooks_1.useIsomorphicLayoutEffect)(() => {
|
|
70
|
-
height.set(expanded ? fullHeight : maxHeight);
|
|
71
|
-
}, [expanded, height, fullHeight, maxHeight]);
|
|
72
|
-
return ((0, jsx_runtime_1.jsxs)(Root, { children: [(0, jsx_runtime_1.jsx)(framer_motion_1.m.div, { style: styles, children: (0, jsx_runtime_1.jsx)(Content, { ref: content, ...props }) }), exceeds && ((0, jsx_runtime_1.jsxs)(BtnWrap, { "$expanded": expanded, children: [(0, jsx_runtime_1.jsx)(BtnFader, { "$bg": bg }), (0, jsx_runtime_1.jsxs)(Btn, { "$fontSize": fontSize, "$lineHeight": lineHeight, onClick: handleExpandClick, "aria-expanded": expanded, "aria-label": expanded ? collapse : expand, children: [expanded ? collapse : expand, (0, jsx_runtime_1.jsx)(BtnIcon, { "$expanded": expanded })] })] }))] }));
|
|
73
|
-
};
|
|
74
|
-
exports.ReadMore = ReadMore;
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TextLoop = exports.TextLoopPiece = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
const framer_motion_1 = require("framer-motion");
|
|
7
|
-
const TextLoopPiece = ({ text = "", style = {}, className = "", direction = "up", inline = true, noOverflow = true, delay = 400, }) => {
|
|
8
|
-
const placeholderRef = (0, react_1.useRef)(null);
|
|
9
|
-
const [content, setContent] = (0, react_1.useState)({ data: "", key: "" });
|
|
10
|
-
const [width, setWidth] = (0, react_1.useState)(inline ? 0 : "auto");
|
|
11
|
-
(0, react_1.useEffect)(() => {
|
|
12
|
-
const timeoutId = setTimeout(() => {
|
|
13
|
-
if (!placeholderRef.current)
|
|
14
|
-
return;
|
|
15
|
-
placeholderRef.current.innerHTML = text + "";
|
|
16
|
-
if (inline)
|
|
17
|
-
setWidth(placeholderRef.current.offsetWidth);
|
|
18
|
-
setContent({ data: text + "", key: new Date() + "" });
|
|
19
|
-
}, delay);
|
|
20
|
-
return () => clearTimeout(timeoutId);
|
|
21
|
-
}, [text, delay, inline]);
|
|
22
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: className, style: {
|
|
23
|
-
...style,
|
|
24
|
-
position: "relative",
|
|
25
|
-
display: inline ? "inline-block" : "block",
|
|
26
|
-
width,
|
|
27
|
-
whiteSpace: inline ? "nowrap" : "normal",
|
|
28
|
-
}, children: [(0, jsx_runtime_1.jsx)("span", { ref: placeholderRef, style: { visibility: "hidden" } }), (0, jsx_runtime_1.jsx)("div", { style: {
|
|
29
|
-
overflow: noOverflow ? "hidden" : "visible",
|
|
30
|
-
display: "block",
|
|
31
|
-
position: "absolute",
|
|
32
|
-
top: 0,
|
|
33
|
-
left: 0,
|
|
34
|
-
height: "100%",
|
|
35
|
-
width: "100%",
|
|
36
|
-
}, children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.m.div, { style: { position: "absolute" }, initial: {
|
|
37
|
-
opacity: 0,
|
|
38
|
-
y: direction === "down" ? "-100%" : "100%",
|
|
39
|
-
}, animate: { opacity: 1, y: 0 }, exit: {
|
|
40
|
-
opacity: 0,
|
|
41
|
-
y: direction === "down" ? "100%" : "-100%",
|
|
42
|
-
}, children: content.data }, content.key) }) })] }));
|
|
43
|
-
};
|
|
44
|
-
exports.TextLoopPiece = TextLoopPiece;
|
|
45
|
-
const TextLoop = ({ texts, interval = 3000, ...props }) => {
|
|
46
|
-
const [index, setIndex] = (0, react_1.useState)(0);
|
|
47
|
-
(0, react_1.useEffect)(() => {
|
|
48
|
-
const intervalId = setInterval(() => setIndex((index) => index + 1), interval // every 3 seconds
|
|
49
|
-
);
|
|
50
|
-
return () => clearTimeout(intervalId);
|
|
51
|
-
}, [interval]);
|
|
52
|
-
return (0, jsx_runtime_1.jsx)(exports.TextLoopPiece, { ...props, text: texts[index % texts.length] });
|
|
53
|
-
};
|
|
54
|
-
exports.TextLoop = TextLoop;
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.TypeStairs = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
exports.TypeStairs = (0, react_1.forwardRef)(({ children, limit }, ref) => {
|
|
7
|
-
// split in rows or just use one row if there is no limit
|
|
8
|
-
const rows = limit ? splitTextIntoRows(children, limit) : [children];
|
|
9
|
-
return rows.length > 1 ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: rows.map((row, rowIndex) => {
|
|
10
|
-
return ((0, jsx_runtime_1.jsxs)("span", { children: [renderRow(row, rowIndex, ref), rowIndex !== rows.length - 1 && (0, jsx_runtime_1.jsx)("br", {})] }, `row-${rowIndex}`));
|
|
11
|
-
}) })) : (renderRow(rows[0], 0, ref));
|
|
12
|
-
});
|
|
13
|
-
/**
|
|
14
|
-
* every number chars find a space and break, then restart the gradient weight
|
|
15
|
-
* @see https://stackoverflow.com/a/25770787
|
|
16
|
-
*/
|
|
17
|
-
function splitTextIntoRows(input = "", limit = 18) {
|
|
18
|
-
const rows = [];
|
|
19
|
-
const arr = input.split(" ");
|
|
20
|
-
let currow = arr[0];
|
|
21
|
-
let rowlen = currow.length;
|
|
22
|
-
for (let i = 1; i < arr.length; i++) {
|
|
23
|
-
const word = arr[i];
|
|
24
|
-
rowlen += word.length + 1;
|
|
25
|
-
if (rowlen <= limit) {
|
|
26
|
-
currow += " " + word;
|
|
27
|
-
}
|
|
28
|
-
else {
|
|
29
|
-
rows.push(currow);
|
|
30
|
-
currow = word;
|
|
31
|
-
rowlen = word.length;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
rows.push(currow);
|
|
35
|
-
return rows;
|
|
36
|
-
}
|
|
37
|
-
function renderRow(row, rowIndex, ref) {
|
|
38
|
-
const letters = row.split("");
|
|
39
|
-
let fontWeightIdx = 1;
|
|
40
|
-
// const fontWeight = Math.min(fontWeightIdx * 100, 800);
|
|
41
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: letters.map((letter, letterIndex) => {
|
|
42
|
-
const fontWeight = Math.min(fontWeightIdx * 100, 800);
|
|
43
|
-
// don't waste a fontWeight for a white space
|
|
44
|
-
if (letter !== " ") {
|
|
45
|
-
fontWeightIdx++;
|
|
46
|
-
}
|
|
47
|
-
return ((0, jsx_runtime_1.jsx)("span", { style: { fontWeight }, ref: ref, children: letter }, `letter-${rowIndex}-${letterIndex}`));
|
|
48
|
-
}) }));
|
|
49
|
-
}
|
package/node/Typography/index.js
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const tslib_1 = require("tslib");
|
|
4
|
-
tslib_1.__exportStar(require("./CopyPasteVisible"), exports);
|
|
5
|
-
tslib_1.__exportStar(require("./Native"), exports);
|
|
6
|
-
tslib_1.__exportStar(require("./ReadMore"), exports);
|
|
7
|
-
tslib_1.__exportStar(require("./TextLoop"), exports);
|
|
8
|
-
tslib_1.__exportStar(require("./TypeStairs"), exports);
|
package/node/css/index.js
DELETED
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.KoineDialog = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
tslib_1.__exportStar(require("../shared"), exports);
|
|
6
|
-
// export * from "../Alert";
|
|
7
|
-
// export * from "../Animations";
|
|
8
|
-
// export * from "../Autocomplete";
|
|
9
|
-
// export * from "../Bg";
|
|
10
|
-
// export * from "../Breadcrumbs";
|
|
11
|
-
// export * from "../Buttons";
|
|
12
|
-
// export * from "../Carousel";
|
|
13
|
-
// export * from "../Collapsable";
|
|
14
|
-
// export * from "../Debug";
|
|
15
|
-
var bare_1 = require("../Dialog/css/bare");
|
|
16
|
-
Object.defineProperty(exports, "KoineDialog", { enumerable: true, get: function () { return bare_1.KoineDialog; } });
|
|
17
|
-
// export * from "../Form";
|
|
18
|
-
// export * from "../Forms";
|
|
19
|
-
// export * from "../Grid";
|
|
20
|
-
// export * from "../Hamburger";
|
|
21
|
-
// export * from "../Header";
|
|
22
|
-
// export * from "../Hidden";
|
|
23
|
-
// export * from "../Img";
|
|
24
|
-
// export * from "../Link";
|
|
25
|
-
// export * from "../MenuItem";
|
|
26
|
-
// export * from "../Pagination";
|
|
27
|
-
// export * from "../Pill";
|
|
28
|
-
// export * from "../Progress";
|
|
29
|
-
// export * from "../Rating";
|
|
30
|
-
// // export * from "../Select";
|
|
31
|
-
// export * from "../Sidebar";
|
|
32
|
-
// export * from "../Spacing";
|
|
33
|
-
// export * from "../Sticky";
|
|
34
|
-
// export * from "../styles";
|
|
35
|
-
// export * from "../Tabs";
|
|
36
|
-
// export * from "../Typography";
|
package/node/helpers/classed.js
DELETED
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.classed = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
/**
|
|
6
|
-
* This utility allows to extend a component a là `styled-components` but for
|
|
7
|
-
* a className based styling solution like Tailwind,
|
|
8
|
-
*
|
|
9
|
-
* It also plays nicely with tailwind intellisense @see:
|
|
10
|
-
*
|
|
11
|
-
* - https://github.com/tailwindlabs/tailwindcss-intellisense#tailwindcssclassattributes
|
|
12
|
-
*
|
|
13
|
-
* For references about tagged functions:
|
|
14
|
-
* - https://javascript.plainenglish.io/how-css-in-js-libraries-work-da4145b1b6c7
|
|
15
|
-
* - https://makersden.io/blog/reverse-engineering-styled-components
|
|
16
|
-
* - https://typesafe.blog/article/the-logic-behind-javascript-tag-functions
|
|
17
|
-
* - https://flaming.codes/posts/typescript-and-javascript-tagged-template-strings
|
|
18
|
-
*/
|
|
19
|
-
function classed(component) {
|
|
20
|
-
// @ts-expect-error nevermind for now...
|
|
21
|
-
const type = component.type || component;
|
|
22
|
-
return function (strings, ...args) {
|
|
23
|
-
const WrappedComponent = (0, react_1.forwardRef)(function (props, ref) {
|
|
24
|
-
const argResolved = args
|
|
25
|
-
.map((arg, index) => {
|
|
26
|
-
let result = "";
|
|
27
|
-
if (typeof arg === "function") {
|
|
28
|
-
result = arg(props);
|
|
29
|
-
}
|
|
30
|
-
else if (typeof arg !== "undefined") {
|
|
31
|
-
result = arg.toString();
|
|
32
|
-
}
|
|
33
|
-
return strings[index] + result;
|
|
34
|
-
})
|
|
35
|
-
.join("");
|
|
36
|
-
const isNativeHtmlElement = typeof type === "string";
|
|
37
|
-
const propsToForward = isNativeHtmlElement
|
|
38
|
-
? {}
|
|
39
|
-
: props;
|
|
40
|
-
if (isNativeHtmlElement) {
|
|
41
|
-
for (const key in props) {
|
|
42
|
-
// like styled-components `transient` props
|
|
43
|
-
if (!key.startsWith("$")) {
|
|
44
|
-
// FIXME: for react 18 we need: @ts-expect-error
|
|
45
|
-
propsToForward[key] = props[key];
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
// get the tagged function string outcome
|
|
50
|
-
let className = argResolved || strings[0];
|
|
51
|
-
// check if we need to clean it or not from the optional structure `< class="..."`
|
|
52
|
-
className = className.match(/class="([^"]*)/)?.[1] || className;
|
|
53
|
-
// add the custom classes from props
|
|
54
|
-
className += props?.className ? " " + props?.className : "";
|
|
55
|
-
return (0, react_1.createElement)(type, {
|
|
56
|
-
// ...props,
|
|
57
|
-
...propsToForward,
|
|
58
|
-
// only add ot props if it is not an empty string
|
|
59
|
-
className: className || undefined,
|
|
60
|
-
// add ref to props
|
|
61
|
-
ref,
|
|
62
|
-
});
|
|
63
|
-
});
|
|
64
|
-
// FIXME: not sure if this is needed
|
|
65
|
-
// WrappedComponent.displayName = type.toString();
|
|
66
|
-
return WrappedComponent; // as unknown as React.ReactElement<typeof props>;
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
exports.classed = classed;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.extendComponent = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const extendComponent = (component, defaultProps) => {
|
|
6
|
-
// FIXME: check if we need to forwardRef or not
|
|
7
|
-
const NewComponent = (props) => (0, react_1.createElement)(component, props);
|
|
8
|
-
// const NewComponent = forwardRef<React.ComponentProps<Component>, Component>(
|
|
9
|
-
// (props, ref) => createElement(component, { ...props, ref })
|
|
10
|
-
// );
|
|
11
|
-
return Object.assign(NewComponent, {
|
|
12
|
-
...defaultProps,
|
|
13
|
-
defaultProps,
|
|
14
|
-
});
|
|
15
|
-
};
|
|
16
|
-
exports.extendComponent = extendComponent;
|
package/node/helpers/index.js
DELETED
package/node/hooks/index.js
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const tslib_1 = require("tslib");
|
|
4
|
-
tslib_1.__exportStar(require("./useAsyncFn"), exports);
|
|
5
|
-
tslib_1.__exportStar(require("./useDateLocale"), exports);
|
|
6
|
-
tslib_1.__exportStar(require("./useEffectOnce"), exports);
|
|
7
|
-
tslib_1.__exportStar(require("./useFirstMountState"), exports);
|
|
8
|
-
tslib_1.__exportStar(require("./useFocus"), exports);
|
|
9
|
-
tslib_1.__exportStar(require("./useId"), exports);
|
|
10
|
-
tslib_1.__exportStar(require("./useIsomorphicLayoutEffect"), exports);
|
|
11
|
-
tslib_1.__exportStar(require("./useMount"), exports);
|
|
12
|
-
tslib_1.__exportStar(require("./useMountedState"), exports);
|
|
13
|
-
tslib_1.__exportStar(require("./usePrevious"), exports);
|
|
14
|
-
tslib_1.__exportStar(require("./useScrollPosition"), exports);
|
|
15
|
-
// export * from "./useScrollTo";
|
|
16
|
-
tslib_1.__exportStar(require("./useTraceUpdate"), exports);
|
|
17
|
-
tslib_1.__exportStar(require("./useUpdateEffect"), exports);
|
|
18
|
-
tslib_1.__exportStar(require("./useWindowSize"), exports);
|
package/node/hooks/types.js
DELETED
package/node/hooks/useAsyncFn.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.useAsyncFn = void 0;
|
|
4
|
-
const react_1 = require("react");
|
|
5
|
-
const useMountedState_1 = require("./useMountedState");
|
|
6
|
-
/**
|
|
7
|
-
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useAsyncFn.ts)
|
|
8
|
-
*/
|
|
9
|
-
function useAsyncFn(fn, deps = [], initialState = { loading: false }) {
|
|
10
|
-
const lastCallId = (0, react_1.useRef)(0);
|
|
11
|
-
const isMounted = (0, useMountedState_1.useMountedState)();
|
|
12
|
-
const [state, set] = (0, react_1.useState)(initialState);
|
|
13
|
-
const callback = (0, react_1.useCallback)((...args) => {
|
|
14
|
-
const callId = ++lastCallId.current;
|
|
15
|
-
if (!state.loading) {
|
|
16
|
-
set((prevState) => ({ ...prevState, loading: true }));
|
|
17
|
-
}
|
|
18
|
-
return fn(...args).then((value) => {
|
|
19
|
-
isMounted() &&
|
|
20
|
-
callId === lastCallId.current &&
|
|
21
|
-
set({ value, loading: false });
|
|
22
|
-
return value;
|
|
23
|
-
}, (error) => {
|
|
24
|
-
isMounted() &&
|
|
25
|
-
callId === lastCallId.current &&
|
|
26
|
-
set({ error, loading: false });
|
|
27
|
-
return error;
|
|
28
|
-
});
|
|
29
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
30
|
-
}, deps);
|
|
31
|
-
return [state, callback];
|
|
32
|
-
}
|
|
33
|
-
exports.useAsyncFn = useAsyncFn;
|