@janbox/storefront-ui 1.0.1 → 1.0.3
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/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +4 -0
- package/dist/hooks/use-controllable-state.js +2 -2
- package/dist/hooks/use-countdown-timer.js +1 -1
- package/dist/hooks/use-first-mount-state/index.d.ts +2 -0
- package/dist/hooks/use-first-mount-state/index.d.ts.map +1 -0
- package/dist/hooks/use-first-mount-state/index.js +12 -0
- package/dist/hooks/use-update-effect/index.d.ts +3 -0
- package/dist/hooks/use-update-effect/index.d.ts.map +1 -0
- package/dist/hooks/use-update-effect/index.js +13 -0
- package/dist/lib/accordion/accordion/accordion.d.ts +2 -1
- package/dist/lib/accordion/accordion/accordion.d.ts.map +1 -1
- package/dist/lib/accordion/accordion/accordion.js +15 -6
- package/dist/lib/accordion/accordion/types.d.ts +2 -2
- package/dist/lib/accordion/accordion/types.d.ts.map +1 -1
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/misc/isDeepEqual.js +5 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useCustomCompareEffect.js +25 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useDeepCompareEffect.js +19 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useFirstMountState.js +12 -0
- package/dist/node_modules/.pnpm/react-use@17.6.0_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/react-use/esm/useUpdateEffect.js +13 -0
- package/package.json +19 -50
- package/dist/HOCs/index.cjs +0 -4
- package/dist/HOCs/with-query-fallback.cjs +0 -16
- package/dist/assets/json/countries.json.cjs +0 -1159
- package/dist/assets/svg/arrow-down.svg.cjs +0 -3
- package/dist/assets/svg/arrow-forward.svg.cjs +0 -3
- package/dist/assets/svg/arrow-left.svg.cjs +0 -3
- package/dist/assets/svg/arrow-right.svg.cjs +0 -3
- package/dist/assets/svg/calendar.svg.cjs +0 -3
- package/dist/assets/svg/check.svg.cjs +0 -3
- package/dist/assets/svg/clock-time.svg.cjs +0 -3
- package/dist/assets/svg/done-check.svg.cjs +0 -3
- package/dist/assets/svg/earth-home-world.svg.cjs +0 -3
- package/dist/assets/svg/eye-hidden.svg.cjs +0 -3
- package/dist/assets/svg/eye-show-visible.svg.cjs +0 -3
- package/dist/assets/svg/image-placeholder.svg.cjs +0 -3
- package/dist/assets/svg/loading-waiting.svg.cjs +0 -3
- package/dist/assets/svg/long-arrow-right.svg.cjs +0 -3
- package/dist/assets/svg/minus.svg.cjs +0 -3
- package/dist/assets/svg/plus.svg.cjs +0 -3
- package/dist/assets/svg/search-add-plus-middle.svg.cjs +0 -3
- package/dist/assets/svg/search-minus.svg.cjs +0 -3
- package/dist/assets/svg/times-close-delete.svg.cjs +0 -3
- package/dist/components/index.cjs +0 -8
- package/dist/components/scroll-view.cjs +0 -19
- package/dist/components/svg-loader.cjs +0 -14
- package/dist/components/virtualized-list.cjs +0 -43
- package/dist/constants/index.cjs +0 -32
- package/dist/hooks/index.cjs +0 -14
- package/dist/hooks/use-controllable-state.cjs +0 -39
- package/dist/hooks/use-countdown-timer.cjs +0 -85
- package/dist/hooks/use-hover-line-effect/index.cjs +0 -24
- package/dist/hooks/use-hover-line-effect/use-hover-line-effect.module.scss.cjs +0 -8
- package/dist/hooks/use-query-params.cjs +0 -53
- package/dist/hooks/use-ripple-effect/index.cjs +0 -69
- package/dist/hooks/use-ripple-effect/use-ripple-effect.module.scss.cjs +0 -11
- package/dist/hooks/use-window-screen/index.cjs +0 -52
- package/dist/index.cjs +0 -305
- package/dist/lib/accordion/accordion/accordion.cjs +0 -109
- package/dist/lib/accordion/accordion/helpers.cjs +0 -21
- package/dist/lib/accordion/accordion/types.cjs +0 -7
- package/dist/lib/accordion/accordion-content/accordion-content.cjs +0 -41
- package/dist/lib/accordion/accordion-content/helpers.cjs +0 -8
- package/dist/lib/accordion/accordion-group/accordion-group.cjs +0 -56
- package/dist/lib/accordion/accordion-group/helpers.cjs +0 -20
- package/dist/lib/accordion/accordion-group/types.cjs +0 -7
- package/dist/lib/accordion/accordion-summary/accordion-summary.cjs +0 -64
- package/dist/lib/accordion/accordion-summary/helpers.cjs +0 -15
- package/dist/lib/accordion/accordion-summary/types.cjs +0 -8
- package/dist/lib/badge/badge.cjs +0 -42
- package/dist/lib/badge/helpers.cjs +0 -8
- package/dist/lib/box/box.cjs +0 -55
- package/dist/lib/box/helpers.cjs +0 -8
- package/dist/lib/breadcrumbs/breadcrumb-item/breadcrumb-item.cjs +0 -28
- package/dist/lib/breadcrumbs/breadcrumbs/breadcrumbs.cjs +0 -44
- package/dist/lib/button/button.cjs +0 -235
- package/dist/lib/button/helpers.cjs +0 -74
- package/dist/lib/cascader/cascader.cjs +0 -497
- package/dist/lib/cascader/helpers.cjs +0 -28
- package/dist/lib/checkbox/checkbox.cjs +0 -52
- package/dist/lib/checkbox/checkbox.module.scss.cjs +0 -23
- package/dist/lib/chip/chip.cjs +0 -60
- package/dist/lib/chip/helpers.cjs +0 -14
- package/dist/lib/collapse/collapse.cjs +0 -50
- package/dist/lib/container/container.cjs +0 -101
- package/dist/lib/container/helpers.cjs +0 -12
- package/dist/lib/count-up/count-up.cjs +0 -38
- package/dist/lib/countdown-timer/countdown-timer.cjs +0 -9
- package/dist/lib/date-picker/date-picker.cjs +0 -168
- package/dist/lib/date-picker/helpers.cjs +0 -12
- package/dist/lib/dialog/dialog/dialog.cjs +0 -93
- package/dist/lib/dialog/dialog/helpers.cjs +0 -27
- package/dist/lib/dialog/dialog-body/dialog-body.cjs +0 -32
- package/dist/lib/dialog/dialog-close/dialog-close.cjs +0 -5
- package/dist/lib/dialog/dialog-footer/dialog-footer.cjs +0 -31
- package/dist/lib/dialog/dialog-header/dialog-header.cjs +0 -73
- package/dist/lib/drawer/drawer/drawer.cjs +0 -100
- package/dist/lib/drawer/drawer/helpers.cjs +0 -7
- package/dist/lib/drawer/drawer-close/drawer-close.cjs +0 -5
- package/dist/lib/filter-panel/checkbox-filter-panel.cjs +0 -107
- package/dist/lib/filter-panel/filter-panel.cjs +0 -37
- package/dist/lib/filter-panel/input-range-filter-panel.cjs +0 -78
- package/dist/lib/filter-panel/input-text-filter-panel.cjs +0 -57
- package/dist/lib/filter-panel/radio-filter-panel.cjs +0 -95
- package/dist/lib/flag/flag.cjs +0 -20
- package/dist/lib/flag/helpers.cjs +0 -16
- package/dist/lib/flexbox/flex-item/flex-item.cjs +0 -22
- package/dist/lib/flexbox/flex-item/helpers.cjs +0 -10
- package/dist/lib/flexbox/flexbox/flexbox.cjs +0 -46
- package/dist/lib/flexbox/flexbox/helpers.cjs +0 -16
- package/dist/lib/floating/floating/floating.cjs +0 -97
- package/dist/lib/floating/floating/helpers.cjs +0 -9
- package/dist/lib/floating/floating-close/floating-close.cjs +0 -32
- package/dist/lib/floating/floating-content/floating-content.cjs +0 -57
- package/dist/lib/floating/floating-trigger/floating-trigger.cjs +0 -35
- package/dist/lib/form-helper-text/form-helper-text.cjs +0 -35
- package/dist/lib/form-label/form-label.cjs +0 -28
- package/dist/lib/generic-element/generic-element.cjs +0 -15
- package/dist/lib/grid/cell/cell.cjs +0 -28
- package/dist/lib/grid/cell/helpers.cjs +0 -8
- package/dist/lib/grid/grid/grid.cjs +0 -53
- package/dist/lib/grid/grid/helpers.cjs +0 -12
- package/dist/lib/highlight-words/highlight-words.cjs +0 -18
- package/dist/lib/icon/helpers.cjs +0 -12
- package/dist/lib/icon/icon.cjs +0 -38
- package/dist/lib/icon-button/helpers.cjs +0 -42
- package/dist/lib/icon-button/icon-button.cjs +0 -146
- package/dist/lib/image/helpers.cjs +0 -15
- package/dist/lib/image/image.cjs +0 -36
- package/dist/lib/input/helpers.cjs +0 -38
- package/dist/lib/input/input.cjs +0 -205
- package/dist/lib/input/input.module.scss.cjs +0 -17
- package/dist/lib/input-mask/helpers.cjs +0 -12
- package/dist/lib/input-mask/input-mask.cjs +0 -120
- package/dist/lib/input-number/input-number.cjs +0 -132
- package/dist/lib/input-number/input-number.module.scss.cjs +0 -8
- package/dist/lib/input-range/helpers.cjs +0 -12
- package/dist/lib/input-range/input-range.cjs +0 -179
- package/dist/lib/input-range/input-range.module.scss.cjs +0 -8
- package/dist/lib/lightbox/lightbox.cjs +0 -199
- package/dist/lib/linear-progress/helpers.cjs +0 -13
- package/dist/lib/linear-progress/linear-progress.cjs +0 -75
- package/dist/lib/link/helpers.cjs +0 -8
- package/dist/lib/link/link.cjs +0 -63
- package/dist/lib/loading/block-skeleton/block-skeleton.cjs +0 -21
- package/dist/lib/loading/image-skeleton/image-skeleton.cjs +0 -43
- package/dist/lib/loading/loading-overlay/loading-overlay.cjs +0 -60
- package/dist/lib/loading/text-skeleton/text-skeleton.cjs +0 -16
- package/dist/lib/marquee/marquee/helpers.cjs +0 -15
- package/dist/lib/marquee/marquee/marquee.cjs +0 -99
- package/dist/lib/marquee/marquee/types.cjs +0 -7
- package/dist/lib/marquee/marquee-item/marquee-item.cjs +0 -16
- package/dist/lib/menu/menu/menu.cjs +0 -38
- package/dist/lib/menu/menu-item/helpers.cjs +0 -16
- package/dist/lib/menu/menu-item/menu-item.cjs +0 -34
- package/dist/lib/menu/menu-list/menu-list.cjs +0 -34
- package/dist/lib/menu/menu-list/types.cjs +0 -7
- package/dist/lib/menu/menu-trigger/menu-trigger.cjs +0 -8
- package/dist/lib/multiple-select/helpers.cjs +0 -12
- package/dist/lib/multiple-select/multiple-select.cjs +0 -348
- package/dist/lib/nav-link/nav-link.cjs +0 -40
- package/dist/lib/notifications/helpers.cjs +0 -39
- package/dist/lib/notifications/notifications.cjs +0 -167
- package/dist/lib/otp-input/otp-input.cjs +0 -132
- package/dist/lib/pagination/helpers.cjs +0 -57
- package/dist/lib/pagination/pagination.cjs +0 -163
- package/dist/lib/phone-input/phone-input.cjs +0 -182
- package/dist/lib/popover/popover/helpers.cjs +0 -7
- package/dist/lib/popover/popover/popover.cjs +0 -31
- package/dist/lib/popover/popover-close/popover-close.cjs +0 -5
- package/dist/lib/popover/popover-content/popover-content.cjs +0 -29
- package/dist/lib/popover/popover-trigger/popover-trigger.cjs +0 -8
- package/dist/lib/primitive/primitive.cjs +0 -30
- package/dist/lib/progress/progress.cjs +0 -50
- package/dist/lib/radio-button/helpers.cjs +0 -8
- package/dist/lib/radio-button/radio-button.cjs +0 -33
- package/dist/lib/radio-button/radio-button.module.scss.cjs +0 -17
- package/dist/lib/select/helpers.cjs +0 -12
- package/dist/lib/select/select.cjs +0 -317
- package/dist/lib/star-rating/star-rating.cjs +0 -39
- package/dist/lib/stepper/step.cjs +0 -69
- package/dist/lib/stepper/stepper.cjs +0 -86
- package/dist/lib/stepper/types.cjs +0 -8
- package/dist/lib/swiper/swiper/helpers.cjs +0 -16
- package/dist/lib/swiper/swiper/swiper.cjs +0 -113
- package/dist/lib/swiper/swiper-dots-paging/swiper-dots-paging.cjs +0 -77
- package/dist/lib/swiper/swiper-slide/swiper-slide.cjs +0 -31
- package/dist/lib/switch/switch.cjs +0 -19
- package/dist/lib/switch/switch.module.scss.cjs +0 -14
- package/dist/lib/table/table/table.cjs +0 -26
- package/dist/lib/table/table-body/table-body.cjs +0 -34
- package/dist/lib/table/table-cell/table-cell.cjs +0 -12
- package/dist/lib/table/table-footer/table-footer.cjs +0 -7
- package/dist/lib/table/table-head/table-head.cjs +0 -33
- package/dist/lib/table/table-row/table-row.cjs +0 -7
- package/dist/lib/tabs/tab/helpers.cjs +0 -9
- package/dist/lib/tabs/tab/tab.cjs +0 -26
- package/dist/lib/tabs/tab-content/tab-content.cjs +0 -22
- package/dist/lib/tabs/tab-indicator/tab-indicator.cjs +0 -92
- package/dist/lib/tabs/tab-list/helpers.cjs +0 -8
- package/dist/lib/tabs/tab-list/tab-list.cjs +0 -40
- package/dist/lib/tabs/tab-panel/helpers.cjs +0 -8
- package/dist/lib/tabs/tab-panel/tab-panel.cjs +0 -21
- package/dist/lib/tabs/tabs/helpers.cjs +0 -36
- package/dist/lib/tabs/tabs/tabs.cjs +0 -62
- package/dist/lib/text/helpers.cjs +0 -140
- package/dist/lib/text/text.cjs +0 -41
- package/dist/lib/textarea/helpers.cjs +0 -12
- package/dist/lib/textarea/textarea.cjs +0 -122
- package/dist/lib/textarea/textarea.module.scss.cjs +0 -14
- package/dist/lib/time-picker/time-picker.cjs +0 -305
- package/dist/lib/tooltip/tooltip.cjs +0 -124
- package/dist/lib/trans-html/trans-html.cjs +0 -26
- package/dist/lib/unordered-list/list-item/helpers.cjs +0 -14
- package/dist/lib/unordered-list/list-item/list-item.cjs +0 -36
- package/dist/lib/unordered-list/unordered-list/helpers.cjs +0 -14
- package/dist/lib/unordered-list/unordered-list/unordered-list.cjs +0 -27
- package/dist/lib/video/helpers.cjs +0 -10
- package/dist/lib/video/video.cjs +0 -24
- package/dist/theme/index.cjs +0 -22
- package/dist/theme/palette.cjs +0 -287
- package/dist/theme/provider.cjs +0 -303
- package/dist/theme/screens.cjs +0 -24
- package/dist/theme/typography.cjs +0 -29
- package/dist/types/index.cjs +0 -1
- package/dist/utils/common.cjs +0 -139
- package/dist/utils/emotion-helpers.cjs +0 -145
- package/dist/utils/index.cjs +0 -233
- package/dist/utils/query-params.cjs +0 -130
- package/dist/utils/stylesheet.cjs +0 -5
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const lodashEs = require("lodash-es");
|
|
6
|
-
const useControllableState = require("../../hooks/use-controllable-state.cjs");
|
|
7
|
-
const theme_screens = require("../../theme/screens.cjs");
|
|
8
|
-
require("../../theme/palette.cjs");
|
|
9
|
-
const theme_typography = require("../../theme/typography.cjs");
|
|
10
|
-
const input = require("../input/input.cjs");
|
|
11
|
-
const OtpInput = ({
|
|
12
|
-
length = 6,
|
|
13
|
-
onFullfilled,
|
|
14
|
-
onChange,
|
|
15
|
-
disabled,
|
|
16
|
-
autoFocus,
|
|
17
|
-
isLoading,
|
|
18
|
-
defaultValue,
|
|
19
|
-
value,
|
|
20
|
-
error
|
|
21
|
-
}) => {
|
|
22
|
-
const [otp, setOtp] = useControllableState.useControllableState({
|
|
23
|
-
defaultValue: lodashEs.times(length, (num) => (defaultValue == null ? void 0 : defaultValue.at(num)) ?? ""),
|
|
24
|
-
value: value == null ? void 0 : value.split("")
|
|
25
|
-
});
|
|
26
|
-
const inputRefs = react.useRef([]);
|
|
27
|
-
const getInputIndex = (target) => {
|
|
28
|
-
return Number(target.dataset.index);
|
|
29
|
-
};
|
|
30
|
-
react.useEffect(() => {
|
|
31
|
-
var _a;
|
|
32
|
-
if (autoFocus) {
|
|
33
|
-
(_a = inputRefs.current.at(0)) == null ? void 0 : _a.focus();
|
|
34
|
-
}
|
|
35
|
-
}, [autoFocus]);
|
|
36
|
-
const handleChange = (e) => {
|
|
37
|
-
var _a;
|
|
38
|
-
if (disabled) return;
|
|
39
|
-
const value2 = e.target.value;
|
|
40
|
-
const index = getInputIndex(e.target);
|
|
41
|
-
if (value2 && !/^\d$/.test(value2)) return;
|
|
42
|
-
const newOtp = [...otp];
|
|
43
|
-
newOtp[index] = value2;
|
|
44
|
-
setOtp(newOtp);
|
|
45
|
-
onChange == null ? void 0 : onChange(newOtp.join(""));
|
|
46
|
-
if (value2 && index < length - 1) {
|
|
47
|
-
(_a = inputRefs.current.at(index + 1)) == null ? void 0 : _a.focus();
|
|
48
|
-
}
|
|
49
|
-
if (newOtp.every((digit) => digit !== "") && newOtp.join("").length === length) {
|
|
50
|
-
onFullfilled == null ? void 0 : onFullfilled(newOtp.join(""));
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
const handleKeyDown = (e) => {
|
|
54
|
-
var _a, _b, _c;
|
|
55
|
-
if (disabled) return;
|
|
56
|
-
const index = getInputIndex(e.target);
|
|
57
|
-
if (e.key === "Backspace") {
|
|
58
|
-
if (otp[index]) {
|
|
59
|
-
const newOtp = [...otp];
|
|
60
|
-
newOtp[index] = "";
|
|
61
|
-
setOtp(newOtp);
|
|
62
|
-
onChange == null ? void 0 : onChange(newOtp.join(""));
|
|
63
|
-
} else if (index > 0) {
|
|
64
|
-
const newOtp = [...otp];
|
|
65
|
-
newOtp[index - 1] = "";
|
|
66
|
-
setOtp(newOtp);
|
|
67
|
-
(_a = inputRefs.current.at(index - 1)) == null ? void 0 : _a.focus();
|
|
68
|
-
onChange == null ? void 0 : onChange(newOtp.join(""));
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
if (e.key === "ArrowLeft" && index > 0) {
|
|
72
|
-
(_b = inputRefs.current.at(index - 1)) == null ? void 0 : _b.focus();
|
|
73
|
-
}
|
|
74
|
-
if (e.key === "ArrowRight" && index < length - 1) {
|
|
75
|
-
(_c = inputRefs.current.at(index + 1)) == null ? void 0 : _c.focus();
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
const handlePaste = (e) => {
|
|
79
|
-
var _a;
|
|
80
|
-
if (disabled) return;
|
|
81
|
-
e.preventDefault();
|
|
82
|
-
const pastedData = e.clipboardData.getData("text/plain");
|
|
83
|
-
const pastedDigits = pastedData.replace(/\D/g, "").slice(0, length);
|
|
84
|
-
if (pastedDigits) {
|
|
85
|
-
const newOtp = [...otp];
|
|
86
|
-
pastedDigits.split("").forEach((digit, index) => {
|
|
87
|
-
if (index < length) {
|
|
88
|
-
newOtp[index] = digit;
|
|
89
|
-
}
|
|
90
|
-
});
|
|
91
|
-
setOtp(newOtp);
|
|
92
|
-
onChange == null ? void 0 : onChange(newOtp.join(""));
|
|
93
|
-
const lastFilledIndex = Math.min(pastedDigits.length - 1, length - 1);
|
|
94
|
-
(_a = inputRefs.current.at(lastFilledIndex)) == null ? void 0 : _a.focus();
|
|
95
|
-
if (newOtp.every((digit) => digit !== "") && newOtp.join("").length === length) {
|
|
96
|
-
onFullfilled == null ? void 0 : onFullfilled(newOtp.join(""));
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
};
|
|
100
|
-
const onFocus = (e) => {
|
|
101
|
-
e.target.select();
|
|
102
|
-
};
|
|
103
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { css: { display: "flex", width: "100%", gap: "0.5rem", [theme_screens.mediaQuery("sm")]: { gap: "0.75rem" } }, children: otp.map((digit, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { css: { flex: "1 1 0%", position: "relative" }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
104
|
-
input.Input,
|
|
105
|
-
{
|
|
106
|
-
ref: (el) => {
|
|
107
|
-
inputRefs.current[index] = el;
|
|
108
|
-
},
|
|
109
|
-
type: "text",
|
|
110
|
-
inputMode: "numeric",
|
|
111
|
-
pattern: "\\d*",
|
|
112
|
-
maxLength: 1,
|
|
113
|
-
"data-index": index,
|
|
114
|
-
value: digit,
|
|
115
|
-
onChange: handleChange,
|
|
116
|
-
onFocus,
|
|
117
|
-
onKeyDown: handleKeyDown,
|
|
118
|
-
onPaste: index === 0 ? handlePaste : void 0,
|
|
119
|
-
disabled,
|
|
120
|
-
readOnly: isLoading,
|
|
121
|
-
css: {
|
|
122
|
-
textAlign: "center",
|
|
123
|
-
fontWeight: 500,
|
|
124
|
-
fontSize: theme_typography.getTypographyVar("lg").fontSize,
|
|
125
|
-
lineHeight: theme_typography.getTypographyVar("lg").lineHeight
|
|
126
|
-
},
|
|
127
|
-
xs: { size: "md" },
|
|
128
|
-
error
|
|
129
|
-
}
|
|
130
|
-
) }, index)) });
|
|
131
|
-
};
|
|
132
|
-
exports.OtpInput = OtpInput;
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const utils_index = require("../../utils/index.cjs");
|
|
4
|
-
const DEFAULT_SIBLING_COUNT = 2;
|
|
5
|
-
const getPageRange = (currentPage, totalPages, siblingCount = DEFAULT_SIBLING_COUNT) => {
|
|
6
|
-
const leftSiblingIndex = Math.max(currentPage - siblingCount, 1);
|
|
7
|
-
const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPages);
|
|
8
|
-
const shouldShowLeftDots = leftSiblingIndex > 2;
|
|
9
|
-
const shouldShowRightDots = rightSiblingIndex < totalPages - 1;
|
|
10
|
-
const result = [];
|
|
11
|
-
result.push({ type: "page", page: 1 });
|
|
12
|
-
if (shouldShowLeftDots) {
|
|
13
|
-
result.push({ type: "ellipsis" });
|
|
14
|
-
} else if (leftSiblingIndex > 1) {
|
|
15
|
-
for (let i = 2; i < leftSiblingIndex; i++) {
|
|
16
|
-
result.push({ type: "page", page: i });
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
for (let i = leftSiblingIndex; i <= rightSiblingIndex; i++) {
|
|
20
|
-
if (i !== 1 && i !== totalPages) {
|
|
21
|
-
result.push({ type: "page", page: i });
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
if (shouldShowRightDots) {
|
|
25
|
-
result.push({ type: "ellipsis" });
|
|
26
|
-
} else if (rightSiblingIndex < totalPages) {
|
|
27
|
-
for (let i = rightSiblingIndex + 1; i < totalPages; i++) {
|
|
28
|
-
result.push({ type: "page", page: i });
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
if (totalPages > 1) {
|
|
32
|
-
result.push({ type: "page", page: totalPages });
|
|
33
|
-
}
|
|
34
|
-
return result;
|
|
35
|
-
};
|
|
36
|
-
const defaultProps = {
|
|
37
|
-
xs: {
|
|
38
|
-
size: "sm"
|
|
39
|
-
},
|
|
40
|
-
showPrevPageButton: true,
|
|
41
|
-
showNextPageButton: true,
|
|
42
|
-
states: {
|
|
43
|
-
normal: {
|
|
44
|
-
color: "neutral",
|
|
45
|
-
variant: "outlined"
|
|
46
|
-
},
|
|
47
|
-
active: {
|
|
48
|
-
color: "primary",
|
|
49
|
-
variant: "outlined"
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
const getPaginationProps = (extended) => {
|
|
54
|
-
return utils_index.mergeComponentProps(defaultProps, extended);
|
|
55
|
-
};
|
|
56
|
-
exports.getPageRange = getPageRange;
|
|
57
|
-
exports.getPaginationProps = getPaginationProps;
|
|
@@ -1,163 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const helpers = require("./helpers.cjs");
|
|
6
|
-
const arrowLeft = require("../../assets/svg/arrow-left.svg.cjs");
|
|
7
|
-
const arrowForward = require("../../assets/svg/arrow-forward.svg.cjs");
|
|
8
|
-
const arrowRight = require("../../assets/svg/arrow-right.svg.cjs");
|
|
9
|
-
require("lodash-es");
|
|
10
|
-
require("../../theme/palette.cjs");
|
|
11
|
-
const theme_typography = require("../../theme/typography.cjs");
|
|
12
|
-
const utils_index = require("../../utils/index.cjs");
|
|
13
|
-
const text = require("../text/text.cjs");
|
|
14
|
-
const iconButton = require("../icon-button/icon-button.cjs");
|
|
15
|
-
const icon = require("../icon/icon.cjs");
|
|
16
|
-
const Pagination = react.forwardRef((_props, ref) => {
|
|
17
|
-
var _a, _b, _c, _d;
|
|
18
|
-
const {
|
|
19
|
-
page = 1,
|
|
20
|
-
count = 1,
|
|
21
|
-
onChange,
|
|
22
|
-
disabled,
|
|
23
|
-
showFirstPageButton,
|
|
24
|
-
showLastPageButton,
|
|
25
|
-
showNextPageButton,
|
|
26
|
-
showPrevPageButton,
|
|
27
|
-
siblingCount,
|
|
28
|
-
states,
|
|
29
|
-
xs,
|
|
30
|
-
sm,
|
|
31
|
-
md,
|
|
32
|
-
lg,
|
|
33
|
-
...rest
|
|
34
|
-
} = helpers.getPaginationProps(_props);
|
|
35
|
-
const sizeVariantState = {
|
|
36
|
-
xs: utils_index.getSizeVariantState(xs == null ? void 0 : xs.size),
|
|
37
|
-
sm: utils_index.getSizeVariantState(sm == null ? void 0 : sm.size),
|
|
38
|
-
md: utils_index.getSizeVariantState(md == null ? void 0 : md.size),
|
|
39
|
-
lg: utils_index.getSizeVariantState(lg == null ? void 0 : lg.size)
|
|
40
|
-
};
|
|
41
|
-
const pageRange = helpers.getPageRange(page, count, siblingCount);
|
|
42
|
-
const css = [
|
|
43
|
-
{
|
|
44
|
-
display: "flex",
|
|
45
|
-
alignItems: "center",
|
|
46
|
-
justifyContent: "center",
|
|
47
|
-
gap: 4
|
|
48
|
-
}
|
|
49
|
-
];
|
|
50
|
-
const handlePageClick = (e) => {
|
|
51
|
-
const newPage = Number(e.currentTarget.value);
|
|
52
|
-
if (disabled || newPage === page) return;
|
|
53
|
-
if (onChange) onChange(newPage);
|
|
54
|
-
};
|
|
55
|
-
const handlePrevClick = (_e) => {
|
|
56
|
-
if (disabled || page <= 1) return;
|
|
57
|
-
if (onChange) onChange(page - 1);
|
|
58
|
-
};
|
|
59
|
-
const handleNextClick = (_e) => {
|
|
60
|
-
if (disabled || page >= count) return;
|
|
61
|
-
if (onChange) onChange(page + 1);
|
|
62
|
-
};
|
|
63
|
-
const handleFirstClick = (_e) => {
|
|
64
|
-
if (disabled || page <= 1) return;
|
|
65
|
-
if (onChange) onChange(1);
|
|
66
|
-
};
|
|
67
|
-
const handleLastClick = (_e) => {
|
|
68
|
-
if (disabled || page >= count) return;
|
|
69
|
-
if (onChange) onChange(count);
|
|
70
|
-
};
|
|
71
|
-
const PaginationButton = (buttonProps) => {
|
|
72
|
-
var _a2;
|
|
73
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
74
|
-
iconButton.IconButton,
|
|
75
|
-
{
|
|
76
|
-
disabled,
|
|
77
|
-
variant: (_a2 = states == null ? void 0 : states.normal) == null ? void 0 : _a2.variant,
|
|
78
|
-
...buttonProps,
|
|
79
|
-
xs: { size: xs == null ? void 0 : xs.size, ...buttonProps.xs },
|
|
80
|
-
sm: { size: sm == null ? void 0 : sm.size, ...buttonProps.sm },
|
|
81
|
-
md: { size: md == null ? void 0 : md.size, ...buttonProps.md },
|
|
82
|
-
lg: { size: lg == null ? void 0 : lg.size, ...buttonProps.lg }
|
|
83
|
-
}
|
|
84
|
-
);
|
|
85
|
-
};
|
|
86
|
-
const PaginationIcon = (iconProps) => {
|
|
87
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
88
|
-
icon.Icon,
|
|
89
|
-
{
|
|
90
|
-
xs: {
|
|
91
|
-
size: utils_index.getSizeVariantState(xs == null ? void 0 : xs.size).iconSize
|
|
92
|
-
},
|
|
93
|
-
sm: {
|
|
94
|
-
size: utils_index.getSizeVariantState(sm == null ? void 0 : sm.size).iconSize
|
|
95
|
-
},
|
|
96
|
-
md: {
|
|
97
|
-
size: utils_index.getSizeVariantState(md == null ? void 0 : md.size).iconSize
|
|
98
|
-
},
|
|
99
|
-
lg: {
|
|
100
|
-
size: utils_index.getSizeVariantState(lg == null ? void 0 : lg.size).iconSize
|
|
101
|
-
},
|
|
102
|
-
...iconProps
|
|
103
|
-
}
|
|
104
|
-
);
|
|
105
|
-
};
|
|
106
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { css, ...rest, ref, children: [
|
|
107
|
-
showFirstPageButton && /* @__PURE__ */ jsxRuntime.jsx(PaginationButton, { "aria-disabled": page <= 1, color: (_a = states == null ? void 0 : states.normal) == null ? void 0 : _a.color, onClick: handleFirstClick, children: /* @__PURE__ */ jsxRuntime.jsx(PaginationIcon, { css: { transform: "rotate(180deg)" }, source: arrowForward }) }),
|
|
108
|
-
showPrevPageButton && /* @__PURE__ */ jsxRuntime.jsx(PaginationButton, { "aria-disabled": page <= 1, color: (_b = states == null ? void 0 : states.normal) == null ? void 0 : _b.color, onClick: handlePrevClick, children: /* @__PURE__ */ jsxRuntime.jsx(PaginationIcon, { source: arrowLeft }) }),
|
|
109
|
-
pageRange.map((pageItem, index) => {
|
|
110
|
-
var _a2, _b2, _c2, _d2, _e;
|
|
111
|
-
const isActive = pageItem.type === "page" && pageItem.page === page;
|
|
112
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
|
|
113
|
-
pageItem.type === "ellipsis" && /* @__PURE__ */ jsxRuntime.jsx(PaginationButton, { color: (_a2 = states == null ? void 0 : states.normal) == null ? void 0 : _a2.color, children: "..." }),
|
|
114
|
-
pageItem.type === "page" && /* @__PURE__ */ jsxRuntime.jsx(
|
|
115
|
-
PaginationButton,
|
|
116
|
-
{
|
|
117
|
-
color: isActive ? (_b2 = states == null ? void 0 : states.active) == null ? void 0 : _b2.color : (_c2 = states == null ? void 0 : states.normal) == null ? void 0 : _c2.color,
|
|
118
|
-
value: pageItem.page,
|
|
119
|
-
variant: isActive ? (_d2 = states == null ? void 0 : states.active) == null ? void 0 : _d2.variant : (_e = states == null ? void 0 : states.normal) == null ? void 0 : _e.variant,
|
|
120
|
-
onClick: handlePageClick,
|
|
121
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
122
|
-
text.Text,
|
|
123
|
-
{
|
|
124
|
-
xs: {
|
|
125
|
-
css: {
|
|
126
|
-
paddingLeft: 2,
|
|
127
|
-
paddingRight: 2,
|
|
128
|
-
...sizeVariantState.xs.textVariant ? {
|
|
129
|
-
fontSize: theme_typography.getTypographyVar(sizeVariantState.xs.textVariant).fontSize,
|
|
130
|
-
lineHeight: theme_typography.getTypographyVar(sizeVariantState.xs.textVariant).lineHeight
|
|
131
|
-
} : {}
|
|
132
|
-
}
|
|
133
|
-
},
|
|
134
|
-
sm: {
|
|
135
|
-
css: sizeVariantState.sm.textVariant ? {
|
|
136
|
-
fontSize: theme_typography.getTypographyVar(sizeVariantState.sm.textVariant).fontSize,
|
|
137
|
-
lineHeight: theme_typography.getTypographyVar(sizeVariantState.sm.textVariant).lineHeight
|
|
138
|
-
} : {}
|
|
139
|
-
},
|
|
140
|
-
md: {
|
|
141
|
-
css: sizeVariantState.md.textVariant ? {
|
|
142
|
-
fontSize: theme_typography.getTypographyVar(sizeVariantState.md.textVariant).fontSize,
|
|
143
|
-
lineHeight: theme_typography.getTypographyVar(sizeVariantState.md.textVariant).lineHeight
|
|
144
|
-
} : {}
|
|
145
|
-
},
|
|
146
|
-
lg: {
|
|
147
|
-
css: sizeVariantState.lg.textVariant ? {
|
|
148
|
-
fontSize: theme_typography.getTypographyVar(sizeVariantState.lg.textVariant).fontSize,
|
|
149
|
-
lineHeight: theme_typography.getTypographyVar(sizeVariantState.lg.textVariant).lineHeight
|
|
150
|
-
} : {}
|
|
151
|
-
},
|
|
152
|
-
children: pageItem.page
|
|
153
|
-
}
|
|
154
|
-
)
|
|
155
|
-
}
|
|
156
|
-
)
|
|
157
|
-
] }, index);
|
|
158
|
-
}),
|
|
159
|
-
showNextPageButton && /* @__PURE__ */ jsxRuntime.jsx(PaginationButton, { "aria-disabled": page >= count, color: (_c = states == null ? void 0 : states.normal) == null ? void 0 : _c.color, onClick: handleNextClick, children: /* @__PURE__ */ jsxRuntime.jsx(PaginationIcon, { source: arrowRight }) }),
|
|
160
|
-
showLastPageButton && /* @__PURE__ */ jsxRuntime.jsx(PaginationButton, { "aria-disabled": page >= count, color: (_d = states == null ? void 0 : states.normal) == null ? void 0 : _d.color, onClick: handleLastClick, children: /* @__PURE__ */ jsxRuntime.jsx(PaginationIcon, { source: arrowForward }) })
|
|
161
|
-
] });
|
|
162
|
-
});
|
|
163
|
-
exports.Pagination = Pagination;
|
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
const react$1 = require("@floating-ui/react");
|
|
6
|
-
const lodashEs = require("lodash-es");
|
|
7
|
-
const phone = require("phone");
|
|
8
|
-
const usehooksTs = require("usehooks-ts");
|
|
9
|
-
const countries = require("../../assets/json/countries.json.cjs");
|
|
10
|
-
const useControllableState = require("../../hooks/use-controllable-state.cjs");
|
|
11
|
-
const utils_index = require("../../utils/index.cjs");
|
|
12
|
-
const theme_palette = require("../../theme/palette.cjs");
|
|
13
|
-
const select = require("../select/select.cjs");
|
|
14
|
-
const flag = require("../flag/flag.cjs");
|
|
15
|
-
const inputMask = require("../input-mask/input-mask.cjs");
|
|
16
|
-
const input = require("../input/input.cjs");
|
|
17
|
-
const formHelperText = require("../form-helper-text/form-helper-text.cjs");
|
|
18
|
-
const CountryRowLabel = ({ code, name, dial_code }) => {
|
|
19
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { css: { display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
20
|
-
/* @__PURE__ */ jsxRuntime.jsx(flag.Flag, { countryCode: code }),
|
|
21
|
-
/* @__PURE__ */ jsxRuntime.jsxs("span", { css: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
|
|
22
|
-
dial_code,
|
|
23
|
-
" (",
|
|
24
|
-
name,
|
|
25
|
-
")"
|
|
26
|
-
] })
|
|
27
|
-
] });
|
|
28
|
-
};
|
|
29
|
-
const SelectedRenderer = ({ code, dial_code }) => {
|
|
30
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { css: { display: "flex", alignItems: "center", gap: 6 }, children: [
|
|
31
|
-
/* @__PURE__ */ jsxRuntime.jsx(flag.Flag, { countryCode: code }),
|
|
32
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { css: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: dial_code })
|
|
33
|
-
] });
|
|
34
|
-
};
|
|
35
|
-
const parsePhoneInputValue = (value) => {
|
|
36
|
-
var _a, _b;
|
|
37
|
-
if (lodashEs.isNil(value)) {
|
|
38
|
-
return value;
|
|
39
|
-
}
|
|
40
|
-
if (value.countryCode) {
|
|
41
|
-
return {
|
|
42
|
-
...value,
|
|
43
|
-
dialCode: value.dialCode ?? ((_a = countries.find((country) => country.code === value.countryCode)) == null ? void 0 : _a.dial_code)
|
|
44
|
-
};
|
|
45
|
-
}
|
|
46
|
-
const { countryIso2 } = phone.phone([value.dialCode, value.nationalNumber].filter(Boolean).join(""));
|
|
47
|
-
return {
|
|
48
|
-
...value,
|
|
49
|
-
countryCode: countryIso2 ?? ((_b = countries.find((country) => country.dial_code === value.dialCode)) == null ? void 0 : _b.code)
|
|
50
|
-
};
|
|
51
|
-
};
|
|
52
|
-
const PhoneInput = react.forwardRef(
|
|
53
|
-
({ error, defaultValue, value, onChange, containerProps, helperText, disabled, ...props }, ref) => {
|
|
54
|
-
var _a;
|
|
55
|
-
const [selectOpen, setSelectOpen] = react.useState(false);
|
|
56
|
-
const [inputFocused, setInputFocused] = react.useState(false);
|
|
57
|
-
const inputRef = react.useRef(null);
|
|
58
|
-
const wrapperRef = react.useRef(null);
|
|
59
|
-
const mergedRefs = react$1.useMergeRefs([ref, wrapperRef]);
|
|
60
|
-
const [internalValue, setInternalValue] = useControllableState.useControllableState({
|
|
61
|
-
defaultValue: parsePhoneInputValue(defaultValue) ?? {
|
|
62
|
-
countryCode: (_a = countries.at(0)) == null ? void 0 : _a.code
|
|
63
|
-
},
|
|
64
|
-
value: parsePhoneInputValue(value)
|
|
65
|
-
});
|
|
66
|
-
const { width: wrapperWidth = 0 } = usehooksTs.useResizeObserver({
|
|
67
|
-
ref: wrapperRef,
|
|
68
|
-
box: "border-box"
|
|
69
|
-
});
|
|
70
|
-
const triggerChange = (next) => {
|
|
71
|
-
setInternalValue(next);
|
|
72
|
-
onChange == null ? void 0 : onChange(next);
|
|
73
|
-
};
|
|
74
|
-
const onDialCodeChange = (_, option) => {
|
|
75
|
-
var _a2;
|
|
76
|
-
triggerChange({
|
|
77
|
-
...internalValue,
|
|
78
|
-
dialCode: option.dial_code,
|
|
79
|
-
countryCode: option.code
|
|
80
|
-
});
|
|
81
|
-
(_a2 = inputRef.current) == null ? void 0 : _a2.select();
|
|
82
|
-
};
|
|
83
|
-
const onNationalNumberChange = (e) => {
|
|
84
|
-
e.target.value = e.target.value.replace(/[^0-9]/g, "");
|
|
85
|
-
triggerChange({
|
|
86
|
-
...internalValue,
|
|
87
|
-
nationalNumber: e.target.value
|
|
88
|
-
});
|
|
89
|
-
};
|
|
90
|
-
const inputDisplayValue = (() => {
|
|
91
|
-
const originalValue = internalValue.nationalNumber ?? "";
|
|
92
|
-
return inputFocused ? originalValue : originalValue.replace(/^(\d{1,3})(\d{0,3})?(\d*)$/, "$1 $2 $3");
|
|
93
|
-
})();
|
|
94
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...containerProps, css: { display: "flex", flexDirection: "column", width: "100%", ...containerProps == null ? void 0 : containerProps.css }, children: [
|
|
95
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
96
|
-
inputMask.InputMask,
|
|
97
|
-
{
|
|
98
|
-
...props,
|
|
99
|
-
css: [
|
|
100
|
-
error && !selectOpen && {
|
|
101
|
-
"&::after": { borderColor: theme_palette.getColorVar("red.600") }
|
|
102
|
-
},
|
|
103
|
-
inputFocused && {
|
|
104
|
-
"&::after": { borderColor: theme_palette.getColorVar("primary.600") },
|
|
105
|
-
boxShadow: `0 0 0 3px ${theme_palette.getColorVar("primary.300")}`
|
|
106
|
-
},
|
|
107
|
-
disabled && {
|
|
108
|
-
backgroundColor: utils_index.getColorShadesByVariant("neutral").disabledSurface,
|
|
109
|
-
pointerEvents: "none"
|
|
110
|
-
},
|
|
111
|
-
props.css
|
|
112
|
-
],
|
|
113
|
-
ref: mergedRefs,
|
|
114
|
-
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { css: { position: "absolute", inset: 0, display: "flex", alignItems: "center" }, children: [
|
|
115
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
116
|
-
select.Select,
|
|
117
|
-
{
|
|
118
|
-
containerProps: {
|
|
119
|
-
css: { width: "fit-content", minWidth: 80 }
|
|
120
|
-
},
|
|
121
|
-
css: {
|
|
122
|
-
paddingRight: 0
|
|
123
|
-
},
|
|
124
|
-
xs: {
|
|
125
|
-
outline: {
|
|
126
|
-
top: 0,
|
|
127
|
-
right: 0,
|
|
128
|
-
bottom: 0,
|
|
129
|
-
left: 0
|
|
130
|
-
}
|
|
131
|
-
},
|
|
132
|
-
listProps: {
|
|
133
|
-
style: {
|
|
134
|
-
width: wrapperWidth
|
|
135
|
-
}
|
|
136
|
-
},
|
|
137
|
-
value: internalValue.countryCode ?? null,
|
|
138
|
-
onChange: onDialCodeChange,
|
|
139
|
-
options: countries,
|
|
140
|
-
disabled,
|
|
141
|
-
selectedRenderer: SelectedRenderer,
|
|
142
|
-
optionLabel: CountryRowLabel,
|
|
143
|
-
optionValue: "code",
|
|
144
|
-
optionSearchLabel: ["name", "dial_code", "code"],
|
|
145
|
-
open: selectOpen,
|
|
146
|
-
onOpenChange: setSelectOpen
|
|
147
|
-
}
|
|
148
|
-
),
|
|
149
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { css: { borderRight: "1px solid", borderColor: theme_palette.getColorVar("border.default"), height: "66.666667%", marginLeft: 8, marginRight: 8 } }),
|
|
150
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
151
|
-
input.Input,
|
|
152
|
-
{
|
|
153
|
-
value: inputDisplayValue,
|
|
154
|
-
disabled,
|
|
155
|
-
containerProps: {
|
|
156
|
-
css: { flex: 1 }
|
|
157
|
-
},
|
|
158
|
-
mainProps: {
|
|
159
|
-
style: {
|
|
160
|
-
paddingLeft: 0,
|
|
161
|
-
boxShadow: "none"
|
|
162
|
-
}
|
|
163
|
-
},
|
|
164
|
-
onChange: onNationalNumberChange,
|
|
165
|
-
xs: {
|
|
166
|
-
css: {
|
|
167
|
-
borderWidth: 0
|
|
168
|
-
}
|
|
169
|
-
},
|
|
170
|
-
onFocus: () => setInputFocused(true),
|
|
171
|
-
onBlur: () => setInputFocused(false),
|
|
172
|
-
ref: inputRef
|
|
173
|
-
}
|
|
174
|
-
)
|
|
175
|
-
] })
|
|
176
|
-
}
|
|
177
|
-
),
|
|
178
|
-
/* @__PURE__ */ jsxRuntime.jsx(formHelperText.FormHelperText, { error, children: helperText })
|
|
179
|
-
] });
|
|
180
|
-
}
|
|
181
|
-
);
|
|
182
|
-
exports.PhoneInput = PhoneInput;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const helpers = require("../../floating/floating/helpers.cjs");
|
|
4
|
-
const usePopoverContext = () => {
|
|
5
|
-
return helpers.useFloatingContext();
|
|
6
|
-
};
|
|
7
|
-
exports.usePopoverContext = usePopoverContext;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const useControllableState = require("../../../hooks/use-controllable-state.cjs");
|
|
5
|
-
const floating = require("../../floating/floating/floating.cjs");
|
|
6
|
-
const Popover = ({ ...props }) => {
|
|
7
|
-
const [open, setOpen] = useControllableState.useControllableState({
|
|
8
|
-
defaultValue: false,
|
|
9
|
-
value: props.open
|
|
10
|
-
});
|
|
11
|
-
const onOpenChange = (open2, event, reason) => {
|
|
12
|
-
var _a;
|
|
13
|
-
setOpen(open2);
|
|
14
|
-
(_a = props.onOpenChange) == null ? void 0 : _a.call(props, open2, event, reason);
|
|
15
|
-
};
|
|
16
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
17
|
-
floating.Floating,
|
|
18
|
-
{
|
|
19
|
-
dismissProps: {
|
|
20
|
-
enabled: true
|
|
21
|
-
},
|
|
22
|
-
clickProps: {
|
|
23
|
-
enabled: true
|
|
24
|
-
},
|
|
25
|
-
...props,
|
|
26
|
-
open,
|
|
27
|
-
onOpenChange
|
|
28
|
-
}
|
|
29
|
-
);
|
|
30
|
-
};
|
|
31
|
-
exports.Popover = Popover;
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const react = require("react");
|
|
5
|
-
require("clsx");
|
|
6
|
-
require("lodash-es");
|
|
7
|
-
const theme_palette = require("../../../theme/palette.cjs");
|
|
8
|
-
const stylesheet = require("../../../utils/stylesheet.cjs");
|
|
9
|
-
const floatingContent = require("../../floating/floating-content/floating-content.cjs");
|
|
10
|
-
const PopoverContent = react.forwardRef(({ className, ...props }, ref) => {
|
|
11
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
12
|
-
floatingContent.FloatingContent,
|
|
13
|
-
{
|
|
14
|
-
css: {
|
|
15
|
-
backgroundColor: theme_palette.getColorVar("surface.default"),
|
|
16
|
-
padding: "0.75rem",
|
|
17
|
-
borderRadius: "0.75rem",
|
|
18
|
-
borderWidth: "1px",
|
|
19
|
-
borderStyle: "solid",
|
|
20
|
-
borderColor: theme_palette.getColorVar("neutral.100"),
|
|
21
|
-
boxShadow: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)"
|
|
22
|
-
},
|
|
23
|
-
className: stylesheet.cn(className),
|
|
24
|
-
...props,
|
|
25
|
-
ref
|
|
26
|
-
}
|
|
27
|
-
);
|
|
28
|
-
});
|
|
29
|
-
exports.PopoverContent = PopoverContent;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const floatingTrigger = require("../../floating/floating-trigger/floating-trigger.cjs");
|
|
5
|
-
const PopoverTrigger = (props) => {
|
|
6
|
-
return /* @__PURE__ */ jsxRuntime.jsx(floatingTrigger.FloatingTrigger, { ...props });
|
|
7
|
-
};
|
|
8
|
-
exports.PopoverTrigger = PopoverTrigger;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
4
|
-
const theme_screens = require("../../theme/screens.cjs");
|
|
5
|
-
require("../../theme/palette.cjs");
|
|
6
|
-
const Primitive = ({
|
|
7
|
-
as,
|
|
8
|
-
xs,
|
|
9
|
-
sm,
|
|
10
|
-
md,
|
|
11
|
-
lg,
|
|
12
|
-
...rest
|
|
13
|
-
}) => {
|
|
14
|
-
const Component = as ?? "div";
|
|
15
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
16
|
-
Component,
|
|
17
|
-
{
|
|
18
|
-
css: [
|
|
19
|
-
xs == null ? void 0 : xs.css,
|
|
20
|
-
{
|
|
21
|
-
[theme_screens.mediaQuery("sm")]: sm == null ? void 0 : sm.css,
|
|
22
|
-
[theme_screens.mediaQuery("md")]: md == null ? void 0 : md.css,
|
|
23
|
-
[theme_screens.mediaQuery("lg")]: lg == null ? void 0 : lg.css
|
|
24
|
-
}
|
|
25
|
-
],
|
|
26
|
-
...rest
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
};
|
|
30
|
-
exports.Primitive = Primitive;
|