@once-ui-system/core 1.0.13 → 1.0.15
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/dist/components/Accordion.js +15 -33
- package/dist/components/Accordion.js.map +1 -1
- package/dist/components/AccordionGroup.js +6 -24
- package/dist/components/AccordionGroup.js.map +1 -1
- package/dist/components/Arrow.js +15 -32
- package/dist/components/Arrow.js.map +1 -1
- package/dist/components/AutoScroll.js +7 -25
- package/dist/components/AutoScroll.js.map +1 -1
- package/dist/components/Avatar.js +19 -30
- package/dist/components/Avatar.js.map +1 -1
- package/dist/components/AvatarGroup.js +14 -26
- package/dist/components/AvatarGroup.js.map +1 -1
- package/dist/components/Background.js +37 -59
- package/dist/components/Background.js.map +1 -1
- package/dist/components/Badge.d.ts.map +1 -1
- package/dist/components/Badge.js +14 -61
- package/dist/components/Badge.js.map +1 -1
- package/dist/components/Banner.js +5 -22
- package/dist/components/Banner.js.map +1 -1
- package/dist/components/Button.d.ts.map +1 -1
- package/dist/components/Button.js +12 -29
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Card.d.ts.map +1 -1
- package/dist/components/Card.js +12 -27
- package/dist/components/Card.js.map +1 -1
- package/dist/components/Carousel.js +18 -32
- package/dist/components/Carousel.js.map +1 -1
- package/dist/components/Checkbox.js +18 -36
- package/dist/components/Checkbox.js.map +1 -1
- package/dist/components/Chip.js +20 -35
- package/dist/components/Chip.js.map +1 -1
- package/dist/components/ColorInput.js +12 -27
- package/dist/components/ColorInput.js.map +1 -1
- package/dist/components/Column.js +6 -21
- package/dist/components/Column.js.map +1 -1
- package/dist/components/CompareImage.js +15 -33
- package/dist/components/CompareImage.js.map +1 -1
- package/dist/components/CursorCard.js +23 -37
- package/dist/components/CursorCard.js.map +1 -1
- package/dist/components/DateInput.js +24 -35
- package/dist/components/DateInput.js.map +1 -1
- package/dist/components/DatePicker.js +40 -65
- package/dist/components/DatePicker.js.map +1 -1
- package/dist/components/DateRangeInput.js +17 -35
- package/dist/components/DateRangeInput.js.map +1 -1
- package/dist/components/DateRangePicker.js +15 -30
- package/dist/components/DateRangePicker.js.map +1 -1
- package/dist/components/Dialog.js +33 -87
- package/dist/components/Dialog.js.map +1 -1
- package/dist/components/Dropdown.js +6 -21
- package/dist/components/Dropdown.js.map +1 -1
- package/dist/components/DropdownWrapper.js +42 -45
- package/dist/components/DropdownWrapper.js.map +1 -1
- package/dist/components/ElementType.js +10 -28
- package/dist/components/ElementType.js.map +1 -1
- package/dist/components/Fade.js +19 -33
- package/dist/components/Fade.js.map +1 -1
- package/dist/components/Feedback.js +6 -21
- package/dist/components/Feedback.js.map +1 -1
- package/dist/components/Flex.js +18 -26
- package/dist/components/Flex.js.map +1 -1
- package/dist/components/FlipFx.js +29 -37
- package/dist/components/FlipFx.js.map +1 -1
- package/dist/components/GlitchFx.js +13 -31
- package/dist/components/GlitchFx.js.map +1 -1
- package/dist/components/Grid.js +18 -26
- package/dist/components/Grid.js.map +1 -1
- package/dist/components/Heading.js +10 -24
- package/dist/components/Heading.js.map +1 -1
- package/dist/components/HoloFx.js +35 -36
- package/dist/components/HoloFx.js.map +1 -1
- package/dist/components/Icon.js +14 -32
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/IconButton.js +15 -33
- package/dist/components/IconButton.js.map +1 -1
- package/dist/components/InfiniteScroll.js +16 -63
- package/dist/components/InfiniteScroll.js.map +1 -1
- package/dist/components/InlineCode.js +8 -26
- package/dist/components/InlineCode.js.map +1 -1
- package/dist/components/Input.js +31 -49
- package/dist/components/Input.js.map +1 -1
- package/dist/components/InteractiveDetails.js +6 -9
- package/dist/components/InteractiveDetails.js.map +1 -1
- package/dist/components/Kbd.js +5 -22
- package/dist/components/Kbd.js.map +1 -1
- package/dist/components/LetterFx.js +13 -19
- package/dist/components/LetterFx.js.map +1 -1
- package/dist/components/Line.js +6 -21
- package/dist/components/Line.js.map +1 -1
- package/dist/components/Logo.js +12 -30
- package/dist/components/Logo.js.map +1 -1
- package/dist/components/LogoCloud.js +14 -29
- package/dist/components/LogoCloud.js.map +1 -1
- package/dist/components/Mask.js +17 -32
- package/dist/components/Mask.js.map +1 -1
- package/dist/components/Media.js +25 -36
- package/dist/components/Media.js.map +1 -1
- package/dist/components/NavIcon.js +8 -26
- package/dist/components/NavIcon.js.map +1 -1
- package/dist/components/NumberInput.js +11 -30
- package/dist/components/NumberInput.js.map +1 -1
- package/dist/components/OTPInput.js +16 -37
- package/dist/components/OTPInput.js.map +1 -1
- package/dist/components/OgCard.js +22 -30
- package/dist/components/OgCard.js.map +1 -1
- package/dist/components/Option.js +15 -33
- package/dist/components/Option.js.map +1 -1
- package/dist/components/Particle.d.ts +2 -3
- package/dist/components/Particle.d.ts.map +1 -1
- package/dist/components/Particle.js +14 -62
- package/dist/components/Particle.js.map +1 -1
- package/dist/components/PasswordInput.js +8 -11
- package/dist/components/PasswordInput.js.map +1 -1
- package/dist/components/RadioButton.js +17 -35
- package/dist/components/RadioButton.js.map +1 -1
- package/dist/components/RevealFx.js +18 -32
- package/dist/components/RevealFx.js.map +1 -1
- package/dist/components/Row.js +6 -21
- package/dist/components/Row.js.map +1 -1
- package/dist/components/ScrollToTop.js +9 -28
- package/dist/components/ScrollToTop.js.map +1 -1
- package/dist/components/Scroller.js +30 -77
- package/dist/components/Scroller.js.map +1 -1
- package/dist/components/SegmentedControl.js +15 -32
- package/dist/components/SegmentedControl.js.map +1 -1
- package/dist/components/Select.js +32 -50
- package/dist/components/Select.js.map +1 -1
- package/dist/components/Skeleton.js +8 -26
- package/dist/components/Skeleton.js.map +1 -1
- package/dist/components/SmartLink.js +28 -34
- package/dist/components/SmartLink.js.map +1 -1
- package/dist/components/Spinner.js +8 -26
- package/dist/components/Spinner.js.map +1 -1
- package/dist/components/StatusIndicator.js +8 -26
- package/dist/components/StatusIndicator.js.map +1 -1
- package/dist/components/StyleOverlay.js +9 -27
- package/dist/components/StyleOverlay.js.map +1 -1
- package/dist/components/StylePanel.js +45 -63
- package/dist/components/StylePanel.js.map +1 -1
- package/dist/components/Switch.js +18 -36
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Table.d.ts.map +1 -1
- package/dist/components/Table.js +12 -29
- package/dist/components/Table.js.map +1 -1
- package/dist/components/Tag.js +8 -26
- package/dist/components/Tag.js.map +1 -1
- package/dist/components/TagInput.js +9 -24
- package/dist/components/TagInput.js.map +1 -1
- package/dist/components/Text.js +10 -24
- package/dist/components/Text.js.map +1 -1
- package/dist/components/Textarea.js +34 -81
- package/dist/components/Textarea.js.map +1 -1
- package/dist/components/ThemeSwitcher.js +10 -46
- package/dist/components/ThemeSwitcher.js.map +1 -1
- package/dist/components/TiltFx.js +8 -26
- package/dist/components/TiltFx.js.map +1 -1
- package/dist/components/Toast.js +14 -20
- package/dist/components/Toast.js.map +1 -1
- package/dist/components/Toaster.js +10 -16
- package/dist/components/Toaster.js.map +1 -1
- package/dist/components/ToggleButton.d.ts.map +1 -1
- package/dist/components/ToggleButton.js +10 -27
- package/dist/components/ToggleButton.js.map +1 -1
- package/dist/components/Tooltip.js +11 -25
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/User.js +8 -25
- package/dist/components/User.js.map +1 -1
- package/dist/components/UserMenu.js +8 -26
- package/dist/components/UserMenu.js.map +1 -1
- package/dist/components/index.js +81 -97
- package/dist/components/index.js.map +1 -1
- package/dist/contexts/DataThemeProvider.js +23 -19
- package/dist/contexts/DataThemeProvider.js.map +1 -1
- package/dist/contexts/IconProvider.js +9 -14
- package/dist/contexts/IconProvider.js.map +1 -1
- package/dist/contexts/ThemeProvider.js +43 -32
- package/dist/contexts/ThemeProvider.js.map +1 -1
- package/dist/contexts/ToastProvider.js +14 -15
- package/dist/contexts/ToastProvider.js.map +1 -1
- package/dist/contexts/index.js +4 -20
- package/dist/contexts/index.js.map +1 -1
- package/dist/hooks/index.js +3 -19
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/useDebounce.d.ts.map +1 -1
- package/dist/hooks/useDebounce.js +5 -7
- package/dist/hooks/useDebounce.js.map +1 -1
- package/dist/hooks/useFetchOg.d.ts.map +1 -1
- package/dist/hooks/useFetchOg.js +8 -11
- package/dist/hooks/useFetchOg.js.map +1 -1
- package/dist/hooks/useHeadingLinks.d.ts.map +1 -1
- package/dist/hooks/useHeadingLinks.js +5 -8
- package/dist/hooks/useHeadingLinks.js.map +1 -1
- package/dist/icons.js +31 -34
- package/dist/icons.js.map +1 -1
- package/dist/index.js +8 -24
- package/dist/index.js.map +1 -1
- package/dist/interfaces.js +1 -2
- package/dist/modules/code/CodeBlock.js +33 -84
- package/dist/modules/code/CodeBlock.js.map +1 -1
- package/dist/modules/data/BarChart.js +30 -75
- package/dist/modules/data/BarChart.js.map +1 -1
- package/dist/modules/data/ChartHeader.js +29 -45
- package/dist/modules/data/ChartHeader.js.map +1 -1
- package/dist/modules/data/ChartStatus.js +4 -8
- package/dist/modules/data/ChartStatus.js.map +1 -1
- package/dist/modules/data/DataTooltip.js +14 -17
- package/dist/modules/data/DataTooltip.js.map +1 -1
- package/dist/modules/data/Gradient.js +6 -11
- package/dist/modules/data/Gradient.js.map +1 -1
- package/dist/modules/data/Legend.js +8 -11
- package/dist/modules/data/Legend.js.map +1 -1
- package/dist/modules/data/LineBarChart.js +29 -77
- package/dist/modules/data/LineBarChart.js.map +1 -1
- package/dist/modules/data/LineChart.js +42 -87
- package/dist/modules/data/LineChart.js.map +1 -1
- package/dist/modules/data/PieChart.js +28 -78
- package/dist/modules/data/PieChart.js.map +1 -1
- package/dist/modules/data/Swatch.js +17 -12
- package/dist/modules/data/Swatch.js.map +1 -1
- package/dist/modules/data/index.js +11 -27
- package/dist/modules/data/index.js.map +1 -1
- package/dist/modules/data/interfaces.js +1 -2
- package/dist/modules/data/utils/colorDistribution.js +8 -12
- package/dist/modules/data/utils/colorDistribution.js.map +1 -1
- package/dist/modules/data/utils/formatDate.js +6 -9
- package/dist/modules/data/utils/formatDate.js.map +1 -1
- package/dist/modules/index.js +19 -41
- package/dist/modules/index.js.map +1 -1
- package/dist/modules/media/MediaUpload.js +16 -34
- package/dist/modules/media/MediaUpload.js.map +1 -1
- package/dist/modules/navigation/HeadingLink.d.ts.map +1 -1
- package/dist/modules/navigation/HeadingLink.js +33 -46
- package/dist/modules/navigation/HeadingLink.js.map +1 -1
- package/dist/modules/navigation/HeadingNav.js +24 -42
- package/dist/modules/navigation/HeadingNav.js.map +1 -1
- package/dist/modules/navigation/Kbar.js +52 -109
- package/dist/modules/navigation/Kbar.js.map +1 -1
- package/dist/modules/navigation/MegaMenu.js +27 -44
- package/dist/modules/navigation/MegaMenu.js.map +1 -1
- package/dist/modules/navigation/MobileMegaMenu.js +10 -25
- package/dist/modules/navigation/MobileMegaMenu.js.map +1 -1
- package/dist/modules/navigation/index.js +5 -21
- package/dist/modules/navigation/index.js.map +1 -1
- package/dist/modules/seo/Meta.js +28 -19
- package/dist/modules/seo/Meta.js.map +1 -1
- package/dist/modules/seo/Schema.js +16 -17
- package/dist/modules/seo/Schema.js.map +1 -1
- package/dist/package.json +2 -4
- package/dist/types.js +1 -4
- package/dist/types.js.map +1 -1
- package/dist/utils/devLogger.js +1 -4
- package/dist/utils/devLogger.js.map +1 -1
- package/dist/utils/index.js +1 -17
- package/dist/utils/index.js.map +1 -1
- package/next-env.d.ts +5 -0
- package/package.json +18 -20
package/dist/components/Input.js
CHANGED
|
@@ -1,33 +1,15 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
15
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
16
|
-
};
|
|
17
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
18
|
-
exports.Input = void 0;
|
|
19
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
20
|
-
const react_1 = require("react");
|
|
21
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
22
|
-
const _1 = require(".");
|
|
23
|
-
const Input_module_scss_1 = __importDefault(require("./Input.module.scss"));
|
|
24
|
-
const useDebounce_1 = require("../hooks/useDebounce");
|
|
25
|
-
const Input = (0, react_1.forwardRef)((_a, ref) => {
|
|
26
|
-
var { id, label, placeholder, height = "m", error = false, errorMessage, description, radius, className, style, hasPrefix, hasSuffix, children, onFocus, onBlur, validate, cursor } = _a, props = __rest(_a, ["id", "label", "placeholder", "height", "error", "errorMessage", "description", "radius", "className", "style", "hasPrefix", "hasSuffix", "children", "onFocus", "onBlur", "validate", "cursor"]);
|
|
27
|
-
const [isFocused, setIsFocused] = (0, react_1.useState)(false);
|
|
28
|
-
const [isFilled, setIsFilled] = (0, react_1.useState)(!!props.value);
|
|
29
|
-
const [validationError, setValidationError] = (0, react_1.useState)(null);
|
|
30
|
-
const debouncedValue = (0, useDebounce_1.useDebounce)(props.value, 1000);
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useEffect, forwardRef, useCallback, } from "react";
|
|
4
|
+
import classNames from "classnames";
|
|
5
|
+
import { Column, Flex, Text } from ".";
|
|
6
|
+
import styles from "./Input.module.scss";
|
|
7
|
+
import { useDebounce } from "../hooks/useDebounce";
|
|
8
|
+
const Input = forwardRef(({ id, label, placeholder, height = "m", error = false, errorMessage, description, radius, className, style, hasPrefix, hasSuffix, children, onFocus, onBlur, validate, cursor, ...props }, ref) => {
|
|
9
|
+
const [isFocused, setIsFocused] = useState(false);
|
|
10
|
+
const [isFilled, setIsFilled] = useState(!!props.value);
|
|
11
|
+
const [validationError, setValidationError] = useState(null);
|
|
12
|
+
const debouncedValue = useDebounce(props.value, 1000);
|
|
31
13
|
const handleFocus = (event) => {
|
|
32
14
|
setIsFocused(true);
|
|
33
15
|
if (onFocus)
|
|
@@ -44,10 +26,10 @@ const Input = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
44
26
|
if (onBlur)
|
|
45
27
|
onBlur(event);
|
|
46
28
|
};
|
|
47
|
-
|
|
29
|
+
useEffect(() => {
|
|
48
30
|
setIsFilled(!!props.value);
|
|
49
31
|
}, [props.value]);
|
|
50
|
-
const validateInput =
|
|
32
|
+
const validateInput = useCallback(() => {
|
|
51
33
|
if (!debouncedValue) {
|
|
52
34
|
setValidationError(null);
|
|
53
35
|
return;
|
|
@@ -65,29 +47,29 @@ const Input = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
65
47
|
setValidationError(null);
|
|
66
48
|
}
|
|
67
49
|
}, [debouncedValue, validate, errorMessage]);
|
|
68
|
-
|
|
50
|
+
useEffect(() => {
|
|
69
51
|
validateInput();
|
|
70
52
|
}, [debouncedValue, validateInput]);
|
|
71
53
|
const displayError = validationError || errorMessage;
|
|
72
|
-
const inputClassNames = (
|
|
73
|
-
[
|
|
74
|
-
[
|
|
75
|
-
[
|
|
76
|
-
[
|
|
77
|
-
[
|
|
78
|
-
[
|
|
79
|
-
[
|
|
54
|
+
const inputClassNames = classNames(styles.input, "font-body", "font-default", "font-m", cursor === "interactive" ? "cursor-interactive" : undefined, {
|
|
55
|
+
[styles.filled]: isFilled,
|
|
56
|
+
[styles.focused]: isFocused,
|
|
57
|
+
[styles.withPrefix]: hasPrefix,
|
|
58
|
+
[styles.withSuffix]: hasSuffix,
|
|
59
|
+
[styles.placeholder]: placeholder,
|
|
60
|
+
[styles.hasChildren]: children,
|
|
61
|
+
[styles.error]: displayError && debouncedValue !== "",
|
|
80
62
|
});
|
|
81
|
-
return ((
|
|
82
|
-
[
|
|
83
|
-
}), children: [(
|
|
84
|
-
[
|
|
63
|
+
return (_jsxs(Column, { gap: "8", style: style, fillWidth: true, fitHeight: true, className: classNames(className, {
|
|
64
|
+
[styles.error]: (error || (displayError && debouncedValue !== "")) && props.value !== "",
|
|
65
|
+
}), children: [_jsxs(Flex, { transition: "micro-medium", border: "neutral-medium", background: "neutral-alpha-weak", overflow: "hidden", vertical: "stretch", className: classNames(styles.base, {
|
|
66
|
+
[styles.s]: height === "s",
|
|
85
67
|
}, {
|
|
86
|
-
[
|
|
87
|
-
}, radius === "none" ? "radius-none" : radius ? `radius-l-${radius}` : "radius-l"), children: [hasPrefix && ((
|
|
88
|
-
[
|
|
89
|
-
}), children: label })), children] }), hasSuffix && ((
|
|
68
|
+
[styles.m]: height === "m",
|
|
69
|
+
}, radius === "none" ? "radius-none" : radius ? `radius-l-${radius}` : "radius-l"), children: [hasPrefix && (_jsx(Flex, { paddingLeft: "12", className: styles.prefix, position: "static", children: hasPrefix })), _jsxs(Column, { fillWidth: true, children: [_jsx("input", { ...props, ref: ref, id: id, placeholder: placeholder, onFocus: handleFocus, onBlur: handleBlur, className: inputClassNames, "aria-describedby": displayError ? `${id}-error` : undefined, "aria-invalid": !!displayError }), label && (_jsx(Text, { as: "label", variant: "label-default-m", htmlFor: id, className: classNames(styles.label, styles.inputLabel, {
|
|
70
|
+
[styles.floating]: isFocused || isFilled || placeholder,
|
|
71
|
+
}), children: label })), children] }), hasSuffix && (_jsx(Flex, { paddingRight: "12", className: styles.suffix, position: "static", children: hasSuffix }))] }), displayError && errorMessage !== false && (_jsx(Flex, { paddingX: "16", children: _jsx(Text, { as: "span", id: `${id}-error`, variant: "body-default-s", onBackground: "danger-weak", children: validationError || errorMessage }) })), description && (_jsx(Flex, { paddingX: "16", fillWidth: true, id: `${id}-description`, textVariant: "body-default-s", onBackground: "neutral-weak", children: description }))] }));
|
|
90
72
|
});
|
|
91
|
-
exports.Input = Input;
|
|
92
73
|
Input.displayName = "Input";
|
|
74
|
+
export { Input };
|
|
93
75
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +1,10 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
const InteractiveDetails = (0, react_1.forwardRef)(({ label, description, iconButtonProps, onClick, className, id, disabled }, ref) => {
|
|
9
|
-
return ((0, jsx_runtime_1.jsxs)(_1.Column, { ref: ref, cursor: disabled ? "not-allowed" : undefined, className: className, onClick: onClick, id: id, children: [(0, jsx_runtime_1.jsxs)(_1.Row, { gap: "4", vertical: "center", children: [(0, jsx_runtime_1.jsx)(_1.Text, { as: "span", variant: "label-default-m", onBackground: disabled ? "neutral-weak" : "neutral-strong", children: label }), (iconButtonProps === null || iconButtonProps === void 0 ? void 0 : iconButtonProps.tooltip) && ((0, jsx_runtime_1.jsx)("div", { onClick: (e) => e.stopPropagation(), children: (0, jsx_runtime_1.jsx)(_1.IconButton, Object.assign({ size: "s", variant: "ghost", icon: "help" }, iconButtonProps)) }))] }), description && ((0, jsx_runtime_1.jsx)(_1.Text, { as: "span", variant: "body-default-s", onBackground: "neutral-weak", children: description }))] }));
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { Text, Column, IconButton, Row } from ".";
|
|
5
|
+
const InteractiveDetails = forwardRef(({ label, description, iconButtonProps, onClick, className, id, disabled }, ref) => {
|
|
6
|
+
return (_jsxs(Column, { ref: ref, cursor: disabled ? "not-allowed" : undefined, className: className, onClick: onClick, id: id, children: [_jsxs(Row, { gap: "4", vertical: "center", children: [_jsx(Text, { as: "span", variant: "label-default-m", onBackground: disabled ? "neutral-weak" : "neutral-strong", children: label }), iconButtonProps?.tooltip && (_jsx("div", { onClick: (e) => e.stopPropagation(), children: _jsx(IconButton, { size: "s", variant: "ghost", icon: "help", ...iconButtonProps }) }))] }), description && (_jsx(Text, { as: "span", variant: "body-default-s", onBackground: "neutral-weak", children: description }))] }));
|
|
10
7
|
});
|
|
11
|
-
exports.InteractiveDetails = InteractiveDetails;
|
|
12
8
|
InteractiveDetails.displayName = "InteractiveDetails";
|
|
9
|
+
export { InteractiveDetails };
|
|
13
10
|
//# sourceMappingURL=InteractiveDetails.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InteractiveDetails.js","sourceRoot":"","sources":["../../src/components/InteractiveDetails.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"InteractiveDetails.js","sourceRoot":"","sources":["../../src/components/InteractiveDetails.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAmB,GAAG,EAAE,MAAM,GAAG,CAAC;AAYnE,MAAM,kBAAkB,GAAsC,UAAU,CAGtE,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,GAAG,EAAE,EAAE;IACnF,OAAO,CACL,MAAC,MAAM,IACL,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EAC5C,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,EAAE,aAEN,MAAC,GAAG,IAAC,GAAG,EAAC,GAAG,EAAC,QAAQ,EAAC,QAAQ,aAC5B,KAAC,IAAI,IACH,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,iBAAiB,EACzB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,gBAAgB,YAEzD,KAAK,GACD,EACN,eAAe,EAAE,OAAO,IAAI,CAC3B,cAAK,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,YACtC,KAAC,UAAU,IAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAC,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,eAAe,GAAI,GACpE,CACP,IACG,EACL,WAAW,IAAI,CACd,KAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,gBAAgB,EAAC,YAAY,EAAC,cAAc,YACjE,WAAW,GACP,CACR,IACM,CACV,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAC;AAEtD,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
|
package/dist/components/Kbd.js
CHANGED
|
@@ -1,24 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.Kbd = void 0;
|
|
15
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
16
|
-
const react_1 = require("react");
|
|
17
|
-
const _1 = require(".");
|
|
18
|
-
const Kbd = (0, react_1.forwardRef)((_a, ref) => {
|
|
19
|
-
var { label, children, className, style } = _a, rest = __rest(_a, ["label", "children", "className", "style"]);
|
|
20
|
-
return ((0, jsx_runtime_1.jsx)(_1.Flex, Object.assign({ as: "kbd", ref: ref, horizontal: "center", minWidth: "32", background: "neutral-strong", radius: "s", paddingX: "4", paddingY: "2", onBackground: "neutral-medium", border: "neutral-strong", className: className, style: style }, rest, { children: (0, jsx_runtime_1.jsx)(_1.Text, { as: "span", variant: "label-default-s", children: label || children }) })));
|
|
21
|
-
});
|
|
22
|
-
exports.Kbd = Kbd;
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
import { Flex, Text } from ".";
|
|
4
|
+
const Kbd = forwardRef(({ label, children, className, style, ...rest }, ref) => (_jsx(Flex, { as: "kbd", ref: ref, horizontal: "center", minWidth: "32", background: "neutral-strong", radius: "s", paddingX: "4", paddingY: "2", onBackground: "neutral-medium", border: "neutral-strong", className: className, style: style, ...rest, children: _jsx(Text, { as: "span", variant: "label-default-s", children: label || children }) })));
|
|
23
5
|
Kbd.displayName = "Kbd";
|
|
6
|
+
export { Kbd };
|
|
24
7
|
//# sourceMappingURL=Kbd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Kbd.js","sourceRoot":"","sources":["../../src/components/Kbd.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Kbd.js","sourceRoot":"","sources":["../../src/components/Kbd.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAa,UAAU,EAAE,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AAS/B,MAAM,GAAG,GAAG,UAAU,CACpB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACvD,KAAC,IAAI,IACH,EAAE,EAAC,KAAK,EACR,GAAG,EAAE,GAAG,EACR,UAAU,EAAC,QAAQ,EACnB,QAAQ,EAAC,IAAI,EACb,UAAU,EAAC,gBAAgB,EAC3B,MAAM,EAAC,GAAG,EACV,QAAQ,EAAC,GAAG,EACZ,QAAQ,EAAC,GAAG,EACZ,YAAY,EAAC,gBAAgB,EAC7B,MAAM,EAAC,gBAAgB,EACvB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KACR,IAAI,YAER,KAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,iBAAiB,YACtC,KAAK,IAAI,QAAQ,GACb,GACF,CACR,CACF,CAAC;AAEF,GAAG,CAAC,WAAW,GAAG,KAAK,CAAC;AAExB,OAAO,EAAE,GAAG,EAAE,CAAC"}
|
|
@@ -1,13 +1,7 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
-
exports.LetterFx = void 0;
|
|
8
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
9
|
-
const react_1 = require("react");
|
|
10
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useRef, useCallback, useEffect, forwardRef } from "react";
|
|
4
|
+
import classNames from "classnames";
|
|
11
5
|
const defaultCharset = ["X", "$", "@", "a", "H", "z", "o", "0", "y", "#", "?", "*", "0", "1", "+"];
|
|
12
6
|
function getRandomCharacter(charset) {
|
|
13
7
|
const randomIndex = Math.floor(Math.random() * charset.length);
|
|
@@ -57,15 +51,15 @@ function createEventHandler(originalText, setText, inProgress, setInProgress, sp
|
|
|
57
51
|
}
|
|
58
52
|
};
|
|
59
53
|
}
|
|
60
|
-
const LetterFx =
|
|
61
|
-
const [text, setText] =
|
|
62
|
-
const [inProgress, setInProgress] =
|
|
63
|
-
const [hasAnimated, setHasAnimated] =
|
|
64
|
-
const originalText =
|
|
65
|
-
const eventHandler =
|
|
54
|
+
const LetterFx = forwardRef(({ children, trigger = "hover", speed = "medium", charset = defaultCharset, onTrigger, className, style, }, ref) => {
|
|
55
|
+
const [text, setText] = useState(typeof children === "string" ? children : "");
|
|
56
|
+
const [inProgress, setInProgress] = useState(false);
|
|
57
|
+
const [hasAnimated, setHasAnimated] = useState(false);
|
|
58
|
+
const originalText = useRef(typeof children === "string" ? children : "");
|
|
59
|
+
const eventHandler = useCallback(() => {
|
|
66
60
|
createEventHandler(originalText.current, setText, inProgress, setInProgress, speed, charset, trigger === "instant" ? setHasAnimated : undefined)();
|
|
67
61
|
}, [inProgress, speed, charset, trigger, setHasAnimated]);
|
|
68
|
-
|
|
62
|
+
useEffect(() => {
|
|
69
63
|
if (typeof children === "string") {
|
|
70
64
|
setText(children);
|
|
71
65
|
originalText.current = children;
|
|
@@ -74,13 +68,13 @@ const LetterFx = (0, react_1.forwardRef)(({ children, trigger = "hover", speed =
|
|
|
74
68
|
}
|
|
75
69
|
}
|
|
76
70
|
}, [children, trigger, eventHandler, hasAnimated]);
|
|
77
|
-
|
|
71
|
+
useEffect(() => {
|
|
78
72
|
if (trigger === "custom" && onTrigger) {
|
|
79
73
|
onTrigger(eventHandler);
|
|
80
74
|
}
|
|
81
75
|
}, [trigger, onTrigger, eventHandler]);
|
|
82
|
-
return ((
|
|
76
|
+
return (_jsx("span", { ref: ref, className: classNames(className), style: style, onMouseOver: trigger === "hover" ? eventHandler : undefined, children: text }));
|
|
83
77
|
});
|
|
84
|
-
exports.LetterFx = LetterFx;
|
|
85
78
|
LetterFx.displayName = "LetterFx";
|
|
79
|
+
export { LetterFx };
|
|
86
80
|
//# sourceMappingURL=LetterFx.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LetterFx.js","sourceRoot":"","sources":["../../src/components/LetterFx.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LetterFx.js","sourceRoot":"","sources":["../../src/components/LetterFx.tsx"],"names":[],"mappings":"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"}
|
package/dist/components/Line.js
CHANGED
|
@@ -1,24 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
-
t[p[i]] = s[p[i]];
|
|
10
|
-
}
|
|
11
|
-
return t;
|
|
12
|
-
};
|
|
13
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.Line = void 0;
|
|
15
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
16
|
-
const react_1 = require("react");
|
|
17
|
-
const _1 = require(".");
|
|
18
|
-
const Line = (0, react_1.forwardRef)((_a, ref) => {
|
|
19
|
-
var { vert, className, style } = _a, rest = __rest(_a, ["vert", "className", "style"]);
|
|
20
|
-
return ((0, jsx_runtime_1.jsx)(_1.Flex, Object.assign({ ref: ref, minWidth: (vert && "1") || undefined, minHeight: (!vert && "1") || undefined, width: (vert && "1") || undefined, height: (!vert && "1") || undefined, fillWidth: !vert, fillHeight: vert, background: "neutral-strong", direction: vert ? "column" : "row", className: className, style: style }, rest)));
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
import { Flex } from ".";
|
|
4
|
+
const Line = forwardRef(({ vert, className, style, ...rest }, ref) => {
|
|
5
|
+
return (_jsx(Flex, { ref: ref, minWidth: (vert && "1") || undefined, minHeight: (!vert && "1") || undefined, width: (vert && "1") || undefined, height: (!vert && "1") || undefined, fillWidth: !vert, fillHeight: vert, background: "neutral-strong", direction: vert ? "column" : "row", className: className, style: style, ...rest }));
|
|
21
6
|
});
|
|
22
|
-
exports.Line = Line;
|
|
23
7
|
Line.displayName = "Line";
|
|
8
|
+
export { Line };
|
|
24
9
|
//# sourceMappingURL=Line.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Line.js","sourceRoot":"","sources":["../../src/components/Line.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Line.js","sourceRoot":"","sources":["../../src/components/Line.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AAOzB,MAAM,IAAI,GAAG,UAAU,CAA4B,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;IAC9F,OAAO,CACL,KAAC,IAAI,IACH,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,SAAS,EACpC,SAAS,EAAE,CAAC,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,SAAS,EACtC,KAAK,EAAE,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,SAAS,EACjC,MAAM,EAAE,CAAC,CAAC,IAAI,IAAI,GAAG,CAAC,IAAI,SAAS,EACnC,SAAS,EAAE,CAAC,IAAI,EAChB,UAAU,EAAE,IAAI,EAChB,UAAU,EAAC,gBAAgB,EAC3B,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAClC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KACR,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,CAAC"}
|
package/dist/components/Logo.js
CHANGED
|
@@ -1,26 +1,9 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
10
|
-
t[p[i]] = s[p[i]];
|
|
11
|
-
}
|
|
12
|
-
return t;
|
|
13
|
-
};
|
|
14
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
15
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
16
|
-
};
|
|
17
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
18
|
-
exports.Logo = void 0;
|
|
19
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
20
|
-
const react_1 = require("react");
|
|
21
|
-
const link_1 = __importDefault(require("next/link"));
|
|
22
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
23
|
-
const _1 = require(".");
|
|
2
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useEffect } from "react";
|
|
4
|
+
import Link from "next/link";
|
|
5
|
+
import classNames from "classnames";
|
|
6
|
+
import { Flex } from ".";
|
|
24
7
|
const sizeMap = {
|
|
25
8
|
xs: "20",
|
|
26
9
|
s: "24",
|
|
@@ -28,26 +11,25 @@ const sizeMap = {
|
|
|
28
11
|
l: "40",
|
|
29
12
|
xl: "48",
|
|
30
13
|
};
|
|
31
|
-
const Logo = (
|
|
32
|
-
|
|
33
|
-
(0, react_1.useEffect)(() => {
|
|
14
|
+
const Logo = ({ size = "m", href, icon, wordmark, className, style, ...props }) => {
|
|
15
|
+
useEffect(() => {
|
|
34
16
|
if (!icon && !wordmark) {
|
|
35
17
|
console.warn("Both 'icon' and 'wordmark' props are set to false. The logo will not render any content.");
|
|
36
18
|
}
|
|
37
19
|
}, [icon, wordmark]);
|
|
38
|
-
const content = ((
|
|
20
|
+
const content = (_jsxs(_Fragment, { children: [icon && (
|
|
39
21
|
// @ts-ignore
|
|
40
|
-
(
|
|
22
|
+
_jsx("img", { style: {
|
|
41
23
|
height: `var(--static-space-${sizeMap[size]})`,
|
|
42
24
|
width: "auto",
|
|
43
25
|
}, alt: "Trademark", src: icon })), wordmark && (
|
|
44
26
|
// @ts-ignore
|
|
45
|
-
(
|
|
27
|
+
_jsx("img", { style: {
|
|
46
28
|
height: `var(--static-space-${sizeMap[size]})`,
|
|
47
29
|
width: "auto",
|
|
48
30
|
}, alt: "Trademark", src: wordmark }))] }));
|
|
49
|
-
return href ? ((
|
|
31
|
+
return href ? (_jsx(Link, { className: classNames("radius-l", "display-flex", "fit-height", className), style: style, href: href, "aria-label": "Trademark", ...props, children: content })) : (_jsx(Flex, { className: classNames(className), radius: "l", fitHeight: true, style: style, "aria-label": "Trademark", children: content }));
|
|
50
32
|
};
|
|
51
|
-
exports.Logo = Logo;
|
|
52
33
|
Logo.displayName = "Logo";
|
|
34
|
+
export { Logo };
|
|
53
35
|
//# sourceMappingURL=Logo.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Logo.js","sourceRoot":"","sources":["../../src/components/Logo.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Logo.js","sourceRoot":"","sources":["../../src/components/Logo.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC;AAEzB,MAAM,OAAO,GAAiC;IAC5C,EAAE,EAAE,IAAI;IACR,CAAC,EAAE,IAAI;IACP,CAAC,EAAE,IAAI;IACP,CAAC,EAAE,IAAI;IACP,EAAE,EAAE,IAAI;CACT,CAAC;AAWF,MAAM,IAAI,GAAwB,CAAC,EACjC,IAAI,GAAG,GAAG,EACV,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACvB,OAAO,CAAC,IAAI,CACV,0FAA0F,CAC3F,CAAC;QACJ,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC;IAErB,MAAM,OAAO,GAAG,CACd,8BACG,IAAI,IAAI;YACP,aAAa;YACb,cACE,KAAK,EAAE;oBACL,MAAM,EAAE,sBAAsB,OAAO,CAAC,IAAI,CAAC,GAAG;oBAC9C,KAAK,EAAE,MAAM;iBACd,EACD,GAAG,EAAC,WAAW,EACf,GAAG,EAAE,IAAI,GACT,CACH,EACA,QAAQ,IAAI;YACX,aAAa;YACb,cACE,KAAK,EAAE;oBACL,MAAM,EAAE,sBAAsB,OAAO,CAAC,IAAI,CAAC,GAAG;oBAC9C,KAAK,EAAE,MAAM;iBACd,EACD,GAAG,EAAC,WAAW,EACf,GAAG,EAAE,QAAQ,GACb,CACH,IACA,CACJ,CAAC;IAEF,OAAO,IAAI,CAAC,CAAC,CAAC,CACZ,KAAC,IAAI,IACH,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,CAAC,EAC1E,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,gBACC,WAAW,KAClB,KAAK,YAER,OAAO,GACH,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,EAChC,MAAM,EAAC,GAAG,EACV,SAAS,QACT,KAAK,EAAE,KAAK,gBACD,WAAW,YAErB,OAAO,GACH,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,CAAC"}
|
|
@@ -1,34 +1,16 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
9
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
10
|
-
t[p[i]] = s[p[i]];
|
|
11
|
-
}
|
|
12
|
-
return t;
|
|
13
|
-
};
|
|
14
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
15
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
16
|
-
};
|
|
17
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
18
|
-
exports.LogoCloud = void 0;
|
|
19
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
20
|
-
const react_1 = require("react");
|
|
21
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
22
|
-
const _1 = require(".");
|
|
23
|
-
const LogoCloud_module_scss_1 = __importDefault(require("./LogoCloud.module.scss"));
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef, useState, useEffect } from "react";
|
|
4
|
+
import classNames from "classnames";
|
|
5
|
+
import { Grid, Flex, Logo } from ".";
|
|
6
|
+
import styles from "./LogoCloud.module.scss";
|
|
24
7
|
const ANIMATION_DURATION = 5000;
|
|
25
8
|
const STAGGER_DELAY = 25;
|
|
26
|
-
const LogoCloud =
|
|
27
|
-
|
|
28
|
-
const [
|
|
29
|
-
const [key, setKey] = (0, react_1.useState)(0);
|
|
9
|
+
const LogoCloud = forwardRef(({ logos, className, style, limit = 6, rotationInterval = ANIMATION_DURATION, ...rest }, ref) => {
|
|
10
|
+
const [visibleLogos, setVisibleLogos] = useState(() => logos.slice(0, limit));
|
|
11
|
+
const [key, setKey] = useState(0);
|
|
30
12
|
const shouldRotate = logos.length > limit;
|
|
31
|
-
|
|
13
|
+
useEffect(() => {
|
|
32
14
|
if (!shouldRotate) {
|
|
33
15
|
setVisibleLogos(logos);
|
|
34
16
|
return;
|
|
@@ -46,8 +28,11 @@ const LogoCloud = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
46
28
|
}, rotationInterval + STAGGER_DELAY * limit);
|
|
47
29
|
return () => clearInterval(interval);
|
|
48
30
|
}, [logos, limit, rotationInterval, shouldRotate]);
|
|
49
|
-
return ((
|
|
31
|
+
return (_jsx(Grid, { ref: ref, className: classNames(styles.container, className), style: style, ...rest, children: visibleLogos.map((logo, index) => (_jsx(Flex, { vertical: "center", horizontal: "center", paddingX: "24", paddingY: "20", radius: "l", children: _jsx(Logo, { className: shouldRotate ? styles.logo : styles.staticLogo, style: {
|
|
32
|
+
...logo.style,
|
|
33
|
+
animationDelay: `${index * STAGGER_DELAY}ms`,
|
|
34
|
+
}, ...logo }) }, `${key}-${index}`))) }));
|
|
50
35
|
});
|
|
51
|
-
exports.LogoCloud = LogoCloud;
|
|
52
36
|
LogoCloud.displayName = "LogoCloud";
|
|
37
|
+
export { LogoCloud };
|
|
53
38
|
//# sourceMappingURL=LogoCloud.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogoCloud.js","sourceRoot":"","sources":["../../src/components/LogoCloud.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LogoCloud.js","sourceRoot":"","sources":["../../src/components/LogoCloud.tsx"],"names":[],"mappings":"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"}
|
package/dist/components/Mask.js
CHANGED
|
@@ -1,32 +1,14 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
"use client";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
};
|
|
14
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
15
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
16
|
-
};
|
|
17
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
18
|
-
exports.Mask = void 0;
|
|
19
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
20
|
-
const react_1 = require("react");
|
|
21
|
-
const _1 = require(".");
|
|
22
|
-
const Mask_module_scss_1 = __importDefault(require("./Mask.module.scss"));
|
|
23
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
24
|
-
const Mask = (0, react_1.forwardRef)((_a, forwardedRef) => {
|
|
25
|
-
var { cursor = false, x, y, radius = 50, children, className, style } = _a, rest = __rest(_a, ["cursor", "x", "y", "radius", "children", "className", "style"]);
|
|
26
|
-
const [cursorPosition, setCursorPosition] = (0, react_1.useState)({ x: 0, y: 0 });
|
|
27
|
-
const [smoothPosition, setSmoothPosition] = (0, react_1.useState)({ x: 0, y: 0 });
|
|
28
|
-
const maskRef = (0, react_1.useRef)(null);
|
|
29
|
-
(0, react_1.useEffect)(() => {
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef, useEffect, useRef, useState } from "react";
|
|
4
|
+
import { Flex } from ".";
|
|
5
|
+
import styles from "./Mask.module.scss";
|
|
6
|
+
import classNames from "classnames";
|
|
7
|
+
const Mask = forwardRef(({ cursor = false, x, y, radius = 50, children, className, style, ...rest }, forwardedRef) => {
|
|
8
|
+
const [cursorPosition, setCursorPosition] = useState({ x: 0, y: 0 });
|
|
9
|
+
const [smoothPosition, setSmoothPosition] = useState({ x: 0, y: 0 });
|
|
10
|
+
const maskRef = useRef(null);
|
|
11
|
+
useEffect(() => {
|
|
30
12
|
if (forwardedRef) {
|
|
31
13
|
if (typeof forwardedRef === "function") {
|
|
32
14
|
forwardedRef(maskRef.current);
|
|
@@ -36,7 +18,7 @@ const Mask = (0, react_1.forwardRef)((_a, forwardedRef) => {
|
|
|
36
18
|
}
|
|
37
19
|
}
|
|
38
20
|
}, [forwardedRef]);
|
|
39
|
-
|
|
21
|
+
useEffect(() => {
|
|
40
22
|
if (!cursor)
|
|
41
23
|
return;
|
|
42
24
|
const handleMouseMove = (event) => {
|
|
@@ -53,7 +35,7 @@ const Mask = (0, react_1.forwardRef)((_a, forwardedRef) => {
|
|
|
53
35
|
document.removeEventListener("mousemove", handleMouseMove);
|
|
54
36
|
};
|
|
55
37
|
}, [cursor]);
|
|
56
|
-
|
|
38
|
+
useEffect(() => {
|
|
57
39
|
if (!cursor)
|
|
58
40
|
return;
|
|
59
41
|
let animationFrameId;
|
|
@@ -91,8 +73,11 @@ const Mask = (0, react_1.forwardRef)((_a, forwardedRef) => {
|
|
|
91
73
|
}
|
|
92
74
|
return {};
|
|
93
75
|
};
|
|
94
|
-
return ((
|
|
76
|
+
return (_jsx(Flex, { ref: maskRef, fill: true, className: classNames(styles.mask, className), top: "0", left: "0", zIndex: 0, overflow: "hidden", style: {
|
|
77
|
+
...maskStyle(),
|
|
78
|
+
...style,
|
|
79
|
+
}, ...rest, children: children }));
|
|
95
80
|
});
|
|
96
|
-
exports.Mask = Mask;
|
|
97
81
|
Mask.displayName = "Mask";
|
|
82
|
+
export { Mask };
|
|
98
83
|
//# sourceMappingURL=Mask.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Mask.js","sourceRoot":"","sources":["../../src/components/Mask.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Mask.js","sourceRoot":"","sources":["../../src/components/Mask.tsx"],"names":[],"mappings":"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"}
|