@koine/react 1.0.11 → 1.0.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 +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.js +29 -29
- 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/node/Alert/Alert.js +9 -16
- package/node/Alert/index.js +1 -1
- package/node/Animations/Reveal.js +15 -13
- package/node/Animations/Underline.js +5 -16
- package/node/Animations/index.js +1 -1
- package/node/Animations/useReveal.js +19 -18
- package/node/Autocomplete/AutocompleteMui.js +69 -64
- package/node/Autocomplete/components.js +26 -82
- package/node/Autocomplete/helpers.js +2 -2
- package/node/Bg/BgColor.js +18 -29
- package/node/Bg/BgPhoto.js +15 -59
- package/node/Bg/BgSvg.js +8 -12
- package/node/Bg/index.js +1 -1
- package/node/Breadcrumbs/Breadcrumbs.js +20 -61
- package/node/Breadcrumbs/index.js +1 -1
- package/node/Buttons/Button.js +10 -76
- package/node/Buttons/ButtonComposite.js +23 -45
- package/node/Buttons/ButtonFab.js +6 -9
- package/node/Buttons/ButtonLink.js +10 -10
- package/node/Buttons/IconButton.js +7 -20
- package/node/Buttons/index.js +1 -1
- package/node/Calendar/CalendarDaygridCell.js +24 -18
- package/node/Calendar/CalendarDaygridNav.js +14 -13
- package/node/Calendar/CalendarDaygridTable.js +39 -38
- package/node/Calendar/CalendarLegend.js +8 -3
- package/node/Calendar/calendar-api-google.js +105 -73
- package/node/Calendar/index.js +1 -1
- package/node/Calendar/useCalendar.js +117 -116
- package/node/Calendar/utils.js +82 -84
- package/node/Carousel/CarouselCss.js +17 -32
- package/node/Carousel/index.js +1 -1
- package/node/Collapsable/index.js +1 -1
- package/node/Debug/Debug.js +7 -20
- package/node/Debug/index.js +1 -1
- package/node/Details/Details.js +24 -22
- package/node/Details/index.js +1 -1
- package/node/Dialog/DialogMui.js +12 -11
- package/node/Dialog/css/bare.js +11 -10
- package/node/Dialog/m/bare.js +18 -14
- package/node/Dialog/m/basic.js +1 -1
- package/node/Dialog/m/index.js +4 -4
- package/node/Dialog/sc/bare.js +22 -41
- package/node/Dialog/sc/framer.js +5 -5
- package/node/Dialog/sc/framerMaterial.js +5 -5
- package/node/Dialog/sc/material.js +12 -33
- package/node/Dialog/tw/bare.js +19 -14
- package/node/Dialog/tw/elegant.js +11 -9
- package/node/Dialog/tw/framer.js +5 -5
- package/node/Dialog/tw/framerMaterial.js +5 -5
- package/node/Dialog/tw/material.js +11 -9
- package/node/Editor/Editor--tiptap.js +19 -17
- package/node/Editor/components.js +9 -28
- package/node/Editor/index.js +1 -1
- package/node/Favicon/FaviconTags.js +3 -2
- package/node/Favicon/index.js +1 -1
- package/node/Form/Form.js +20 -18
- package/node/Form/index.js +1 -1
- package/node/Form/sc/bare.js +12 -22
- package/node/Forms/Checkbox/Checkbox.js +13 -20
- package/node/Forms/Checkbox/index.js +1 -1
- package/node/Forms/Feedback/Feedback.js +8 -10
- package/node/Forms/Feedback/index.js +1 -1
- package/node/Forms/Field/Field.js +18 -30
- package/node/Forms/Field/FieldControl.js +26 -22
- package/node/Forms/Field/FieldHint.js +4 -7
- package/node/Forms/Field/index.js +1 -1
- package/node/Forms/Input/Input.js +15 -22
- package/node/Forms/Input/index.js +1 -1
- package/node/Forms/InputGroup/InputGroup.js +14 -42
- package/node/Forms/InputGroup/index.js +1 -1
- package/node/Forms/Label/Label.js +6 -25
- package/node/Forms/Label/index.js +1 -1
- package/node/Forms/Password/Password.js +16 -30
- package/node/Forms/Password/index.js +1 -1
- package/node/Forms/Radio/Radio.js +21 -25
- package/node/Forms/Radio/index.js +1 -1
- package/node/Forms/Switch/Switch.js +15 -46
- package/node/Forms/Switch/index.js +1 -1
- package/node/Forms/Textarea/Textarea.js +11 -13
- package/node/Forms/Textarea/TextareaRich.js +16 -31
- package/node/Forms/Textarea/index.js +1 -1
- package/node/Forms/Toggle/Toggle.js +23 -72
- package/node/Forms/Toggle/index.js +1 -1
- package/node/Forms/Toggle/useToggle.js +33 -33
- package/node/Forms/antispam.js +14 -14
- package/node/Forms/helpers.js +8 -7
- package/node/Forms/index.js +1 -1
- package/node/Forms/styles.js +16 -48
- package/node/Gauge/Gauge.js +1 -1
- package/node/Grid/Grid.js +24 -51
- package/node/Grid/index.js +1 -1
- package/node/Hamburger/Hamburger.js +37 -50
- package/node/Hamburger/index.js +1 -1
- package/node/Header/index.js +1 -1
- package/node/Header/useHeader.js +16 -16
- package/node/Hidden/Hidden.js +10 -15
- package/node/Hidden/index.js +1 -1
- package/node/Img/index.js +1 -1
- package/node/Img/sc/bare.js +4 -3
- package/node/Link/Link.js +4 -3
- package/node/Link/LinkBlank.js +11 -21
- package/node/Link/index.js +1 -1
- package/node/Menu/Menu.js +4 -12
- package/node/Menu/index.js +1 -1
- package/node/MenuItem/MenuItem.js +4 -21
- package/node/MenuItem/index.js +1 -1
- package/node/Meta/Meta.js +4 -3
- package/node/Meta/index.js +1 -1
- package/node/NoJs/NoJs.js +3 -3
- package/node/NoJs/index.js +1 -1
- package/node/Pagination/PaginationNav.js +30 -53
- package/node/Pagination/PaginationResults.js +10 -10
- package/node/Pagination/index.js +1 -1
- package/node/Pill/Pill.js +7 -38
- package/node/Pill/index.js +1 -1
- package/node/Progress/ProgressCircular.js +11 -33
- package/node/Progress/ProgressLinear.js +11 -20
- package/node/Progress/ProgressOverlay.js +18 -35
- package/node/Progress/index.js +1 -1
- package/node/Rating/Rating.js +28 -49
- package/node/Rating/index.js +20 -16
- package/node/Select/components.js +11 -18
- package/node/Sidebar/Sidebar.js +21 -47
- package/node/Sidebar/index.js +1 -1
- package/node/Spacing/Spacing.js +16 -17
- package/node/Spacing/index.js +1 -1
- package/node/Sticky/StickyCss.js +5 -3
- package/node/Sticky/index.js +1 -1
- package/node/Tabs/TabsMui.js +16 -14
- package/node/Tabs/index.js +1 -1
- package/node/Tabs/tw/bare.js +9 -8
- package/node/Tabs/tw/material.js +11 -7
- package/node/Tabs/useTabs.js +19 -19
- package/node/Typography/CopyPasteVisible.js +4 -7
- package/node/Typography/Native.js +14 -48
- package/node/Typography/ReadMore.js +30 -57
- package/node/Typography/TextLoop.js +22 -25
- package/node/Typography/TypeStairs.js +22 -18
- package/node/Typography/index.js +1 -1
- package/node/css/index.js +1 -1
- package/node/helpers/classed.js +22 -19
- package/node/helpers/extend-component.js +7 -7
- package/node/helpers/index.js +1 -1
- package/node/hooks/index.js +1 -1
- package/node/hooks/useAsyncFn.js +20 -13
- package/node/hooks/useDateLocale.js +23 -37
- package/node/hooks/useEffectOnce.js +2 -2
- package/node/hooks/useFirstMountState.js +2 -2
- package/node/hooks/useFocus.js +4 -4
- package/node/hooks/useId.js +4 -3
- package/node/hooks/useIsomorphicLayoutEffect.js +2 -2
- package/node/hooks/useMount.js +3 -3
- package/node/hooks/useMountedState.js +5 -5
- package/node/hooks/usePrevious.js +3 -3
- package/node/hooks/useScrollPosition.js +23 -18
- package/node/hooks/useScrollTo.js +9 -7
- package/node/hooks/useTraceUpdate.js +5 -4
- package/node/hooks/useUpdateEffect.js +5 -5
- package/node/hooks/useWindowSize.js +4 -4
- package/node/index.js +1 -1
- package/node/m/MotionProvider.js +6 -4
- package/node/m/index.js +1 -1
- package/node/m/lite.js +1 -1
- package/node/m/max.js +1 -1
- package/node/sc/index.js +1 -1
- package/node/scm/index.js +1 -1
- package/node/shared/index.js +1 -1
- package/node/styles/Body.js +5 -10
- package/node/styles/Global.js +5 -37
- package/node/styles/index.js +1 -1
- package/node/styles/media.js +42 -38
- package/node/styles/spacing.js +15 -16
- package/node/styles/styled.js +7 -21
- package/node/styles/theme--vanilla.js +21 -19
- package/node/styles/theme.js +9 -9
- package/node/tw/index.js +1 -1
- package/node/twm/index.js +1 -1
- package/package.json +3 -2
- 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
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.TextLoop = exports.TextLoopPiece = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
(0, react_1.
|
|
12
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = require("react");
|
|
7
|
+
var framer_motion_1 = require("framer-motion");
|
|
8
|
+
var TextLoopPiece = function (_a) {
|
|
9
|
+
var _b = _a.text, text = _b === void 0 ? "" : _b, _c = _a.style, style = _c === void 0 ? {} : _c, _d = _a.className, className = _d === void 0 ? "" : _d, _e = _a.direction, direction = _e === void 0 ? "up" : _e, _f = _a.inline, inline = _f === void 0 ? true : _f, _g = _a.noOverflow, noOverflow = _g === void 0 ? true : _g, _h = _a.delay, delay = _h === void 0 ? 400 : _h;
|
|
10
|
+
var placeholderRef = (0, react_1.useRef)(null);
|
|
11
|
+
var _j = (0, react_1.useState)({ data: "", key: "" }), content = _j[0], setContent = _j[1];
|
|
12
|
+
var _k = (0, react_1.useState)(inline ? 0 : "auto"), width = _k[0], setWidth = _k[1];
|
|
13
|
+
(0, react_1.useEffect)(function () {
|
|
14
|
+
var timeoutId = setTimeout(function () {
|
|
13
15
|
if (!placeholderRef.current)
|
|
14
16
|
return;
|
|
15
17
|
placeholderRef.current.innerHTML = text + "";
|
|
@@ -17,15 +19,9 @@ const TextLoopPiece = ({ text = "", style = {}, className = "", direction = "up"
|
|
|
17
19
|
setWidth(placeholderRef.current.offsetWidth);
|
|
18
20
|
setContent({ data: text + "", key: new Date() + "" });
|
|
19
21
|
}, delay);
|
|
20
|
-
return ()
|
|
22
|
+
return function () { return clearTimeout(timeoutId); };
|
|
21
23
|
}, [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: {
|
|
24
|
+
return ((0, jsx_runtime_1.jsxs)("div", tslib_1.__assign({ className: className, style: tslib_1.__assign(tslib_1.__assign({}, style), { position: "relative", display: inline ? "inline-block" : "block", width: width, whiteSpace: inline ? "nowrap" : "normal" }) }, { children: [(0, jsx_runtime_1.jsx)("span", { ref: placeholderRef, style: { visibility: "hidden" } }), (0, jsx_runtime_1.jsx)("div", tslib_1.__assign({ style: {
|
|
29
25
|
overflow: noOverflow ? "hidden" : "visible",
|
|
30
26
|
display: "block",
|
|
31
27
|
position: "absolute",
|
|
@@ -33,22 +29,23 @@ const TextLoopPiece = ({ text = "", style = {}, className = "", direction = "up"
|
|
|
33
29
|
left: 0,
|
|
34
30
|
height: "100%",
|
|
35
31
|
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: {
|
|
32
|
+
} }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.m.div, tslib_1.__assign({ style: { position: "absolute" }, initial: {
|
|
37
33
|
opacity: 0,
|
|
38
34
|
y: direction === "down" ? "-100%" : "100%",
|
|
39
35
|
}, animate: { opacity: 1, y: 0 }, exit: {
|
|
40
36
|
opacity: 0,
|
|
41
37
|
y: direction === "down" ? "100%" : "-100%",
|
|
42
|
-
}, children: content.data }, content.key) }) })] }));
|
|
38
|
+
} }, { children: content.data }), content.key) }) }))] })));
|
|
43
39
|
};
|
|
44
40
|
exports.TextLoopPiece = TextLoopPiece;
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
(0, react_1.
|
|
48
|
-
|
|
41
|
+
var TextLoop = function (_a) {
|
|
42
|
+
var texts = _a.texts, _b = _a.interval, interval = _b === void 0 ? 3000 : _b, props = tslib_1.__rest(_a, ["texts", "interval"]);
|
|
43
|
+
var _c = (0, react_1.useState)(0), index = _c[0], setIndex = _c[1];
|
|
44
|
+
(0, react_1.useEffect)(function () {
|
|
45
|
+
var intervalId = setInterval(function () { return setIndex(function (index) { return index + 1; }); }, interval // every 3 seconds
|
|
49
46
|
);
|
|
50
|
-
return ()
|
|
47
|
+
return function () { return clearTimeout(intervalId); };
|
|
51
48
|
}, [interval]);
|
|
52
|
-
return (0, jsx_runtime_1.jsx)(exports.TextLoopPiece, {
|
|
49
|
+
return (0, jsx_runtime_1.jsx)(exports.TextLoopPiece, tslib_1.__assign({}, props, { text: texts[index % texts.length] }));
|
|
53
50
|
};
|
|
54
51
|
exports.TextLoop = TextLoop;
|
|
@@ -1,26 +1,30 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.TypeStairs = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
var react_1 = require("react");
|
|
7
|
+
exports.TypeStairs = (0, react_1.forwardRef)(function (_a, ref) {
|
|
8
|
+
var children = _a.children, limit = _a.limit;
|
|
7
9
|
// split in rows or just use one row if there is no limit
|
|
8
|
-
|
|
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", {})] },
|
|
10
|
+
var rows = limit ? splitTextIntoRows(children, limit) : [children];
|
|
11
|
+
return rows.length > 1 ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: rows.map(function (row, rowIndex) {
|
|
12
|
+
return ((0, jsx_runtime_1.jsxs)("span", { children: [renderRow(row, rowIndex, ref), rowIndex !== rows.length - 1 && (0, jsx_runtime_1.jsx)("br", {})] }, "row-".concat(rowIndex)));
|
|
11
13
|
}) })) : (renderRow(rows[0], 0, ref));
|
|
12
14
|
});
|
|
13
15
|
/**
|
|
14
16
|
* every number chars find a space and break, then restart the gradient weight
|
|
15
17
|
* @see https://stackoverflow.com/a/25770787
|
|
16
18
|
*/
|
|
17
|
-
function splitTextIntoRows(input
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
function splitTextIntoRows(input, limit) {
|
|
20
|
+
if (input === void 0) { input = ""; }
|
|
21
|
+
if (limit === void 0) { limit = 18; }
|
|
22
|
+
var rows = [];
|
|
23
|
+
var arr = input.split(" ");
|
|
24
|
+
var currow = arr[0];
|
|
25
|
+
var rowlen = currow.length;
|
|
26
|
+
for (var i = 1; i < arr.length; i++) {
|
|
27
|
+
var word = arr[i];
|
|
24
28
|
rowlen += word.length + 1;
|
|
25
29
|
if (rowlen <= limit) {
|
|
26
30
|
currow += " " + word;
|
|
@@ -35,15 +39,15 @@ function splitTextIntoRows(input = "", limit = 18) {
|
|
|
35
39
|
return rows;
|
|
36
40
|
}
|
|
37
41
|
function renderRow(row, rowIndex, ref) {
|
|
38
|
-
|
|
39
|
-
|
|
42
|
+
var letters = row.split("");
|
|
43
|
+
var fontWeightIdx = 1;
|
|
40
44
|
// const fontWeight = Math.min(fontWeightIdx * 100, 800);
|
|
41
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: letters.map((letter, letterIndex)
|
|
42
|
-
|
|
45
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: letters.map(function (letter, letterIndex) {
|
|
46
|
+
var fontWeight = Math.min(fontWeightIdx * 100, 800);
|
|
43
47
|
// don't waste a fontWeight for a white space
|
|
44
48
|
if (letter !== " ") {
|
|
45
49
|
fontWeightIdx++;
|
|
46
50
|
}
|
|
47
|
-
return ((0, jsx_runtime_1.jsx)("span", { style: { fontWeight }, ref: ref, children: letter },
|
|
51
|
+
return ((0, jsx_runtime_1.jsx)("span", tslib_1.__assign({ style: { fontWeight: fontWeight }, ref: ref }, { children: letter }), "letter-".concat(rowIndex, "-").concat(letterIndex)));
|
|
48
52
|
}) }));
|
|
49
53
|
}
|
package/node/Typography/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
|
|
3
|
+
var tslib_1 = require("tslib");
|
|
4
4
|
tslib_1.__exportStar(require("./CopyPasteVisible"), exports);
|
|
5
5
|
tslib_1.__exportStar(require("./Native"), exports);
|
|
6
6
|
tslib_1.__exportStar(require("./ReadMore"), exports);
|
package/node/css/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.KoineDialog = void 0;
|
|
4
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
5
|
tslib_1.__exportStar(require("../shared"), exports);
|
|
6
6
|
// export * from "../Alert";
|
|
7
7
|
// export * from "../Animations";
|
package/node/helpers/classed.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.classed = void 0;
|
|
4
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
5
6
|
/**
|
|
6
7
|
* This utility allows to extend a component a là `styled-components` but for
|
|
7
8
|
* a className based styling solution like Tailwind,
|
|
@@ -18,12 +19,17 @@ const react_1 = require("react");
|
|
|
18
19
|
*/
|
|
19
20
|
function classed(component) {
|
|
20
21
|
// @ts-expect-error nevermind for now...
|
|
21
|
-
|
|
22
|
-
return function (strings
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
22
|
+
var type = component.type || component;
|
|
23
|
+
return function (strings) {
|
|
24
|
+
var args = [];
|
|
25
|
+
for (var _i = 1; _i < arguments.length; _i++) {
|
|
26
|
+
args[_i - 1] = arguments[_i];
|
|
27
|
+
}
|
|
28
|
+
var WrappedComponent = (0, react_1.forwardRef)(function (props, ref) {
|
|
29
|
+
var _a;
|
|
30
|
+
var argResolved = args
|
|
31
|
+
.map(function (arg, index) {
|
|
32
|
+
var result = "";
|
|
27
33
|
if (typeof arg === "function") {
|
|
28
34
|
result = arg(props);
|
|
29
35
|
}
|
|
@@ -33,12 +39,12 @@ function classed(component) {
|
|
|
33
39
|
return strings[index] + result;
|
|
34
40
|
})
|
|
35
41
|
.join("");
|
|
36
|
-
|
|
37
|
-
|
|
42
|
+
var isNativeHtmlElement = typeof type === "string";
|
|
43
|
+
var propsToForward = isNativeHtmlElement
|
|
38
44
|
? {}
|
|
39
45
|
: props;
|
|
40
46
|
if (isNativeHtmlElement) {
|
|
41
|
-
for (
|
|
47
|
+
for (var key in props) {
|
|
42
48
|
// like styled-components `transient` props
|
|
43
49
|
if (!key.startsWith("$")) {
|
|
44
50
|
// FIXME: for react 18 we need: @ts-expect-error
|
|
@@ -47,19 +53,16 @@ function classed(component) {
|
|
|
47
53
|
}
|
|
48
54
|
}
|
|
49
55
|
// get the tagged function string outcome
|
|
50
|
-
|
|
56
|
+
var className = argResolved || strings[0];
|
|
51
57
|
// check if we need to clean it or not from the optional structure `< class="..."`
|
|
52
|
-
className = className.match(/class="([^"]*)/)
|
|
58
|
+
className = ((_a = className.match(/class="([^"]*)/)) === null || _a === void 0 ? void 0 : _a[1]) || className;
|
|
53
59
|
// add the custom classes from props
|
|
54
|
-
className += props
|
|
55
|
-
return (0, react_1.createElement)(type, {
|
|
56
|
-
// ...props,
|
|
57
|
-
...propsToForward,
|
|
60
|
+
className += (props === null || props === void 0 ? void 0 : props.className) ? " " + (props === null || props === void 0 ? void 0 : props.className) : "";
|
|
61
|
+
return (0, react_1.createElement)(type, tslib_1.__assign(tslib_1.__assign({}, propsToForward), {
|
|
58
62
|
// only add ot props if it is not an empty string
|
|
59
|
-
className: className || undefined,
|
|
63
|
+
className: className || undefined,
|
|
60
64
|
// add ref to props
|
|
61
|
-
ref
|
|
62
|
-
});
|
|
65
|
+
ref: ref }));
|
|
63
66
|
});
|
|
64
67
|
// FIXME: not sure if this is needed
|
|
65
68
|
// WrappedComponent.displayName = type.toString();
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.extendComponent = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var extendComponent = function (component, defaultProps) {
|
|
6
7
|
// FIXME: check if we need to forwardRef or not
|
|
7
|
-
|
|
8
|
+
var NewComponent = function (props) {
|
|
9
|
+
return (0, react_1.createElement)(component, props);
|
|
10
|
+
};
|
|
8
11
|
// const NewComponent = forwardRef<React.ComponentProps<Component>, Component>(
|
|
9
12
|
// (props, ref) => createElement(component, { ...props, ref })
|
|
10
13
|
// );
|
|
11
|
-
return Object.assign(NewComponent, {
|
|
12
|
-
...defaultProps,
|
|
13
|
-
defaultProps,
|
|
14
|
-
});
|
|
14
|
+
return Object.assign(NewComponent, tslib_1.__assign(tslib_1.__assign({}, defaultProps), { defaultProps: defaultProps }));
|
|
15
15
|
};
|
|
16
16
|
exports.extendComponent = extendComponent;
|
package/node/helpers/index.js
CHANGED
package/node/hooks/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
|
|
3
|
+
var tslib_1 = require("tslib");
|
|
4
4
|
tslib_1.__exportStar(require("./useAsyncFn"), exports);
|
|
5
5
|
tslib_1.__exportStar(require("./useDateLocale"), exports);
|
|
6
6
|
tslib_1.__exportStar(require("./useEffectOnce"), exports);
|
package/node/hooks/useAsyncFn.js
CHANGED
|
@@ -1,29 +1,36 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useAsyncFn = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
6
|
+
var useMountedState_1 = require("./useMountedState");
|
|
6
7
|
/**
|
|
7
8
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useAsyncFn.ts)
|
|
8
9
|
*/
|
|
9
|
-
function useAsyncFn(fn, deps
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
function useAsyncFn(fn, deps, initialState) {
|
|
11
|
+
if (deps === void 0) { deps = []; }
|
|
12
|
+
if (initialState === void 0) { initialState = { loading: false }; }
|
|
13
|
+
var lastCallId = (0, react_1.useRef)(0);
|
|
14
|
+
var isMounted = (0, useMountedState_1.useMountedState)();
|
|
15
|
+
var _a = (0, react_1.useState)(initialState), state = _a[0], set = _a[1];
|
|
16
|
+
var callback = (0, react_1.useCallback)(function () {
|
|
17
|
+
var args = [];
|
|
18
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
19
|
+
args[_i] = arguments[_i];
|
|
20
|
+
}
|
|
21
|
+
var callId = ++lastCallId.current;
|
|
15
22
|
if (!state.loading) {
|
|
16
|
-
set((prevState)
|
|
23
|
+
set(function (prevState) { return (tslib_1.__assign(tslib_1.__assign({}, prevState), { loading: true })); });
|
|
17
24
|
}
|
|
18
|
-
return fn(
|
|
25
|
+
return fn.apply(void 0, args).then(function (value) {
|
|
19
26
|
isMounted() &&
|
|
20
27
|
callId === lastCallId.current &&
|
|
21
|
-
set({ value, loading: false });
|
|
28
|
+
set({ value: value, loading: false });
|
|
22
29
|
return value;
|
|
23
|
-
}, (error)
|
|
30
|
+
}, function (error) {
|
|
24
31
|
isMounted() &&
|
|
25
32
|
callId === lastCallId.current &&
|
|
26
|
-
set({ error, loading: false });
|
|
33
|
+
set({ error: error, loading: false });
|
|
27
34
|
return error;
|
|
28
35
|
});
|
|
29
36
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
@@ -1,51 +1,37 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
3
|
exports.useDateLocale = void 0;
|
|
27
|
-
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = require("react");
|
|
28
6
|
/**
|
|
29
7
|
* Dynamically import the date-fns correct locale
|
|
30
8
|
*
|
|
31
9
|
* Inspired by:
|
|
32
10
|
* @see https://robertmarshall.dev/blog/dynamically-import-datefns-locale-mui-datepicker-localization/
|
|
33
11
|
*/
|
|
34
|
-
function useDateLocale(locale, defaultLocale
|
|
35
|
-
|
|
36
|
-
|
|
12
|
+
function useDateLocale(locale, defaultLocale) {
|
|
13
|
+
var _this = this;
|
|
14
|
+
if (defaultLocale === void 0) { defaultLocale = "en"; }
|
|
15
|
+
var _a = (0, react_1.useState)(), data = _a[0], setData = _a[1];
|
|
16
|
+
var _b = (0, react_1.useState)(defaultLocale), current = _b[0], setCurrent = _b[1];
|
|
37
17
|
// const [ready, setReady] = useState(false);
|
|
38
18
|
// If the user changes the locale listen to the change and import the locale that is now required.
|
|
39
|
-
(0, react_1.useEffect)(()
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
19
|
+
(0, react_1.useEffect)(function () {
|
|
20
|
+
var importLocaleFile = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
|
|
21
|
+
var localeToSet;
|
|
22
|
+
return tslib_1.__generator(this, function (_a) {
|
|
23
|
+
switch (_a.label) {
|
|
24
|
+
case 0: return [4 /*yield*/, Promise.resolve().then(function () { return tslib_1.__importStar(require(
|
|
25
|
+
/* webpackMode: "lazy", webpackChunkName: "df-[index]", webpackExclude: /_lib/ */
|
|
26
|
+
"date-fns/locale/".concat(locale, "/index.js"))); })];
|
|
27
|
+
case 1:
|
|
28
|
+
localeToSet = _a.sent();
|
|
29
|
+
setCurrent(locale || current);
|
|
30
|
+
setData(localeToSet.default);
|
|
31
|
+
return [2 /*return*/];
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
}); };
|
|
49
35
|
// If the locale has not yet been loaded.
|
|
50
36
|
if (locale !== current) {
|
|
51
37
|
importLocaleFile();
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useEffectOnce = void 0;
|
|
4
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
5
|
/**
|
|
6
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useEffectOnce.ts)
|
|
7
7
|
*/
|
|
8
|
-
|
|
8
|
+
var useEffectOnce = function (effect) {
|
|
9
9
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
10
10
|
(0, react_1.useEffect)(effect, []);
|
|
11
11
|
};
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useFirstMountState = void 0;
|
|
4
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
5
|
/**
|
|
6
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
|
|
7
7
|
*/
|
|
8
8
|
function useFirstMountState() {
|
|
9
|
-
|
|
9
|
+
var isFirst = (0, react_1.useRef)(true);
|
|
10
10
|
if (isFirst.current) {
|
|
11
11
|
isFirst.current = false;
|
|
12
12
|
return true;
|
package/node/hooks/useFocus.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useFocus = void 0;
|
|
4
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
5
|
/**
|
|
6
6
|
* @see https://stackoverflow.com/a/54159564/1938970
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
var useFocus = function () {
|
|
9
|
+
var element = (0, react_1.useRef)(null);
|
|
10
|
+
var setFocus = function () {
|
|
11
11
|
element.current && element.current.focus();
|
|
12
12
|
};
|
|
13
13
|
return [element, setFocus];
|
package/node/hooks/useId.js
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useId = void 0;
|
|
4
|
-
|
|
4
|
+
var utils_1 = require("@koine/utils");
|
|
5
5
|
/**
|
|
6
6
|
* FIXME: once we can move to react 18 just replace this import with `{ useId } from "react";`
|
|
7
7
|
*/
|
|
8
|
-
function useId(prefix
|
|
9
|
-
|
|
8
|
+
function useId(prefix) {
|
|
9
|
+
if (prefix === void 0) { prefix = "uid"; }
|
|
10
|
+
return "".concat(prefix, "-").concat((0, utils_1.uid)());
|
|
10
11
|
}
|
|
11
12
|
exports.useId = useId;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useIsomorphicLayoutEffect = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
|
+
var utils_1 = require("@koine/utils");
|
|
6
6
|
/**
|
|
7
7
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useFirstMountState.ts)
|
|
8
8
|
*/
|
package/node/hooks/useMount.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useMount = void 0;
|
|
4
|
-
|
|
4
|
+
var useEffectOnce_1 = require("./useEffectOnce");
|
|
5
5
|
/**
|
|
6
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMount.ts)
|
|
7
7
|
*/
|
|
8
|
-
|
|
9
|
-
(0, useEffectOnce_1.useEffectOnce)(()
|
|
8
|
+
var useMount = function (fn) {
|
|
9
|
+
(0, useEffectOnce_1.useEffectOnce)(function () {
|
|
10
10
|
fn();
|
|
11
11
|
});
|
|
12
12
|
};
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useMountedState = void 0;
|
|
4
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
5
|
/**
|
|
6
6
|
* @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
|
|
7
7
|
*/
|
|
8
8
|
function useMountedState() {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
(0, react_1.useEffect)(()
|
|
9
|
+
var mountedRef = (0, react_1.useRef)(false);
|
|
10
|
+
var get = (0, react_1.useCallback)(function () { return mountedRef.current; }, []);
|
|
11
|
+
(0, react_1.useEffect)(function () {
|
|
12
12
|
mountedRef.current = true;
|
|
13
|
-
return ()
|
|
13
|
+
return function () {
|
|
14
14
|
mountedRef.current = false;
|
|
15
15
|
};
|
|
16
16
|
}, []);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.usePrevious = void 0;
|
|
4
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
5
|
function usePrevious(value) {
|
|
6
|
-
|
|
7
|
-
(0, react_1.useEffect)(()
|
|
6
|
+
var ref = (0, react_1.useRef)();
|
|
7
|
+
(0, react_1.useEffect)(function () {
|
|
8
8
|
ref.current = value;
|
|
9
9
|
});
|
|
10
10
|
return ref.current;
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useScrollPosition = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
4
|
+
var react_1 = require("react");
|
|
5
|
+
var utils_1 = require("@koine/utils");
|
|
6
|
+
var useIsomorphicLayoutEffect_1 = require("./useIsomorphicLayoutEffect");
|
|
7
|
+
var zeroPosition = { x: 0, y: 0 };
|
|
8
|
+
var getClientRect = function (element) {
|
|
9
|
+
return element === null || element === void 0 ? void 0 : element.getBoundingClientRect();
|
|
10
|
+
};
|
|
11
|
+
var getScrollPosition = function (element, useWindow, boundingElement) {
|
|
10
12
|
if (!utils_1.isBrowser) {
|
|
11
13
|
return zeroPosition;
|
|
12
14
|
}
|
|
13
15
|
if (useWindow) {
|
|
14
16
|
return { x: window.scrollX, y: window.scrollY };
|
|
15
17
|
}
|
|
16
|
-
|
|
17
|
-
|
|
18
|
+
var targetPosition = getClientRect((element === null || element === void 0 ? void 0 : element.current) || document.body);
|
|
19
|
+
var containerPosition = getClientRect(boundingElement === null || boundingElement === void 0 ? void 0 : boundingElement.current);
|
|
18
20
|
if (!targetPosition) {
|
|
19
21
|
return zeroPosition;
|
|
20
22
|
}
|
|
@@ -32,20 +34,22 @@ const getScrollPosition = (element, useWindow, boundingElement) => {
|
|
|
32
34
|
* - reused internal helper functions
|
|
33
35
|
* - compacted object arguments in functions as plain argument list to improve compression
|
|
34
36
|
*/
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
37
|
+
var useScrollPosition = function (effect, deps, element, useWindow, wait, boundingElement) {
|
|
38
|
+
if (deps === void 0) { deps = []; }
|
|
39
|
+
var position = (0, react_1.useRef)(getScrollPosition(null, useWindow, boundingElement));
|
|
40
|
+
var throttleTimeout = null;
|
|
41
|
+
var callBack = function () {
|
|
42
|
+
var current = getScrollPosition(element, useWindow, boundingElement);
|
|
40
43
|
effect(current, position.current);
|
|
41
44
|
position.current = current;
|
|
42
45
|
throttleTimeout = null;
|
|
43
46
|
};
|
|
44
|
-
(0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(()
|
|
47
|
+
(0, useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect)(function () {
|
|
48
|
+
var _a;
|
|
45
49
|
if (!utils_1.isBrowser) {
|
|
46
50
|
return undefined;
|
|
47
51
|
}
|
|
48
|
-
|
|
52
|
+
var handleScroll = function () {
|
|
49
53
|
if (wait) {
|
|
50
54
|
if (throttleTimeout === null) {
|
|
51
55
|
throttleTimeout = window.setTimeout(callBack, wait);
|
|
@@ -56,16 +60,17 @@ const useScrollPosition = (effect, deps = [], element, useWindow, wait, bounding
|
|
|
56
60
|
}
|
|
57
61
|
};
|
|
58
62
|
if (boundingElement) {
|
|
59
|
-
boundingElement.current
|
|
63
|
+
(_a = boundingElement.current) === null || _a === void 0 ? void 0 : _a.addEventListener("scroll", handleScroll, {
|
|
60
64
|
passive: true,
|
|
61
65
|
});
|
|
62
66
|
}
|
|
63
67
|
else {
|
|
64
68
|
window.addEventListener("scroll", handleScroll, { passive: true });
|
|
65
69
|
}
|
|
66
|
-
return ()
|
|
70
|
+
return function () {
|
|
71
|
+
var _a;
|
|
67
72
|
if (boundingElement) {
|
|
68
|
-
boundingElement.current
|
|
73
|
+
(_a = boundingElement.current) === null || _a === void 0 ? void 0 : _a.removeEventListener("scroll", handleScroll);
|
|
69
74
|
}
|
|
70
75
|
else {
|
|
71
76
|
window.removeEventListener("scroll", handleScroll);
|