mimir-ui-kit 1.10.0 → 1.10.1
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +62 -62
- package/dist/DatePickerModal-DUUCHAWF.js +204 -0
- package/dist/{NavigationButtons-B8tMfqrg.js → NavigationButtons-DuOoqaPo.js} +20 -20
- package/dist/assets/Button.css +1 -1
- package/dist/assets/DatePickerModal.css +1 -0
- package/dist/assets/Drawer.css +1 -0
- package/dist/assets/Input.css +1 -1
- package/dist/assets/MergedButton.css +1 -1
- package/dist/assets/OtpInput.css +1 -1
- package/dist/assets/RadioGroup.css +1 -1
- package/dist/assets/SelectSearch.css +1 -0
- package/dist/assets/Slider.css +1 -1
- package/dist/assets/Switch.css +1 -0
- package/dist/assets/Tag.css +1 -0
- package/dist/assets/Timer.css +1 -0
- package/dist/assets/index.css +1 -1
- package/dist/components/Button/Button.d.ts +0 -1
- package/dist/components/Button/Button.js +25 -25
- package/dist/components/DatePicker/DatePicker.d.ts +44 -0
- package/dist/components/DatePicker/DatePicker.js +69 -0
- package/dist/components/DatePicker/DatePickerModal.d.ts +8 -0
- package/dist/components/DatePicker/DatePickerModal.js +9 -0
- package/dist/components/DatePicker/constants.d.ts +6 -0
- package/dist/components/DatePicker/constants.js +11 -0
- package/dist/components/DatePicker/index.d.ts +2 -0
- package/dist/components/DatePicker/index.js +4 -0
- package/dist/components/Drawer/Drawer.d.ts +38 -0
- package/dist/components/Drawer/Drawer.js +144 -0
- package/dist/components/Drawer/constants.d.ts +5 -0
- package/dist/components/Drawer/constants.js +9 -0
- package/dist/components/Drawer/index.d.ts +2 -0
- package/dist/components/Drawer/index.js +6 -0
- package/dist/components/Input/Input.d.ts +2 -2
- package/dist/components/Input/Input.js +17 -16
- package/dist/components/InputPassword/InputPassword.js +2 -2
- package/dist/components/InputPhoneNumber/InputPhoneNumber.js +1 -1
- package/dist/components/MergedButton/MergedButton.d.ts +1 -1
- package/dist/components/MergedButton/MergedButton.js +17 -19
- package/dist/components/OtpInput/OtpInput.js +6 -6
- package/dist/components/Portal/Portal.d.ts +7 -0
- package/dist/components/Portal/Portal.js +10 -0
- package/dist/components/Portal/index.d.ts +1 -0
- package/dist/components/Portal/index.js +4 -0
- package/dist/components/RadioGroup/RadioGroup.d.ts +18 -2
- package/dist/components/RadioGroup/RadioGroup.js +127 -1061
- package/dist/components/RadioGroup/index.d.ts +1 -1
- package/dist/components/SelectSearch/SelectSearch.d.ts +15 -0
- package/dist/components/SelectSearch/SelectSearch.js +3961 -0
- package/dist/components/SelectSearch/constants.d.ts +4 -0
- package/dist/components/SelectSearch/constants.js +8 -0
- package/dist/components/SelectSearch/index.d.ts +2 -0
- package/dist/components/SelectSearch/index.js +6 -0
- package/dist/components/Slider/NavigationButtons/NavigationButtons.js +1 -1
- package/dist/components/Slider/NavigationButtons/index.js +1 -1
- package/dist/components/Slider/Slider.js +10 -10
- package/dist/components/Switch/Switch.d.ts +294 -0
- package/dist/components/Switch/Switch.js +57 -0
- package/dist/components/Switch/index.d.ts +2 -0
- package/dist/components/Switch/index.js +4 -0
- package/dist/components/Tag/Tag.d.ts +19 -57
- package/dist/components/Tag/Tag.js +39 -84
- package/dist/components/Tag/constants.d.ts +5 -37
- package/dist/components/Tag/constants.js +13 -53
- package/dist/components/Tag/index.d.ts +2 -3
- package/dist/components/Tag/index.js +5 -6
- package/dist/components/Tag/types.d.ts +0 -6
- package/dist/components/Timer/Timer.d.ts +24 -0
- package/dist/components/Timer/Timer.js +29 -0
- package/dist/components/Timer/index.d.ts +1 -0
- package/dist/components/Timer/index.js +4 -0
- package/dist/components/index.d.ts +11 -1
- package/dist/components/index.js +19 -0
- package/dist/focus-management-CFDo6ZSc.js +91 -0
- package/dist/hooks/index.d.ts +3 -0
- package/dist/hooks/index.js +7 -1
- package/dist/hooks/useClickOutside/index.d.ts +1 -0
- package/dist/hooks/useClickOutside/index.js +4 -0
- package/dist/hooks/useClickOutside/useClickOutside.d.ts +7 -0
- package/dist/hooks/useClickOutside/useClickOutside.js +25 -0
- package/dist/hooks/useInterval/index.d.ts +1 -0
- package/dist/hooks/useInterval/index.js +4 -0
- package/dist/hooks/useInterval/useInterval.d.ts +1 -0
- package/dist/hooks/useInterval/useInterval.js +17 -0
- package/dist/hooks/useLockBodyScroll/index.d.ts +1 -0
- package/dist/hooks/useLockBodyScroll/index.js +4 -0
- package/dist/hooks/useLockBodyScroll/useLockBodyScroll.d.ts +6 -0
- package/dist/hooks/useLockBodyScroll/useLockBodyScroll.js +20 -0
- package/dist/hooks/useTimer/index.d.ts +18 -0
- package/dist/hooks/useTimer/index.js +83 -0
- package/dist/hooks/useTimer/useTimer.d.ts +18 -0
- package/dist/hooks/useTimer/useTimer.js +87 -0
- package/dist/hooks/useTimer/utils.d.ts +24 -0
- package/dist/hooks/useTimer/utils.js +88 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +28 -1
- package/dist/label-BXAcSLy0.js +913 -0
- package/dist/use-active-press-9MCrfRZk.js +31 -0
- package/dist/utils/formating/Date.d.ts +1 -0
- package/dist/utils/formating/Date.js +26 -0
- package/dist/utils/formating/Month.d.ts +8 -0
- package/dist/utils/formating/Month.js +80 -0
- package/dist/utils/formating/Numbers.d.ts +6 -0
- package/dist/utils/formating/Numbers.js +8 -0
- package/dist/utils/index.d.ts +9 -0
- package/dist/utils/index.js +11 -0
- package/package.json +128 -128
@@ -1,99 +1,54 @@
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
|
-
import { forwardRef
|
4
|
-
import {
|
5
|
-
import
|
6
|
-
|
7
|
-
const
|
8
|
-
const
|
9
|
-
const
|
10
|
-
const
|
11
|
-
const CITRINE = "_CITRINE_j31xr_15";
|
12
|
-
const SAPPHIRE = "_SAPPHIRE_j31xr_18";
|
13
|
-
const SECONDARY = "_SECONDARY_j31xr_21";
|
14
|
-
const WHITE = "_WHITE_j31xr_21";
|
15
|
-
const LIGHT_SAPPHIRE = "_LIGHT_SAPPHIRE_j31xr_24";
|
16
|
-
const LIGHT_GRAY = "_LIGHT_GRAY_j31xr_27";
|
17
|
-
const disabled = "_disabled_j31xr_27";
|
3
|
+
import { forwardRef } from "react";
|
4
|
+
import { ETagSize, ETagType } from "./constants.js";
|
5
|
+
import '../../assets/Tag.css';const container = "_container_1f2sk_2";
|
6
|
+
const disabled = "_disabled_1f2sk_24";
|
7
|
+
const inner = "_inner_1f2sk_29";
|
8
|
+
const M = "_M_1f2sk_37";
|
9
|
+
const S = "_S_1f2sk_41";
|
10
|
+
const XS = "_XS_1f2sk_49";
|
18
11
|
const cls = {
|
19
12
|
container,
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
SAPPHIRE,
|
26
|
-
SECONDARY,
|
27
|
-
WHITE,
|
28
|
-
LIGHT_SAPPHIRE,
|
29
|
-
LIGHT_GRAY,
|
30
|
-
disabled
|
13
|
+
disabled,
|
14
|
+
inner,
|
15
|
+
M,
|
16
|
+
S,
|
17
|
+
XS
|
31
18
|
};
|
32
|
-
const
|
19
|
+
const Tag = forwardRef(
|
33
20
|
(props, ref) => {
|
34
21
|
const {
|
35
22
|
rootClassName,
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
editable: editable2 = false,
|
40
|
-
size = EStepsSize.M,
|
41
|
-
onClick,
|
23
|
+
innerClassName,
|
24
|
+
children,
|
25
|
+
size = ETagSize.M,
|
42
26
|
disabled: disabled2 = false,
|
43
|
-
|
44
|
-
|
27
|
+
elementType = ETagType.BUTTON,
|
28
|
+
backgroundColor = "",
|
29
|
+
color = "",
|
30
|
+
outline = false,
|
31
|
+
...otherProps
|
45
32
|
} = props;
|
46
|
-
const
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
useEffect(() => {
|
59
|
-
if (stepWasChangedRef.current === true) {
|
60
|
-
onClick && onClick(step2);
|
61
|
-
stepWasChangedRef.current = false;
|
62
|
-
}
|
63
|
-
}, [onClick, step2]);
|
64
|
-
const handleMouseEnter = (evt) => {
|
65
|
-
const hoveredIdx = Number(evt.currentTarget.id.split(ID_SEPARATOR)[1]);
|
66
|
-
setHoveredStep(hoveredIdx);
|
67
|
-
};
|
68
|
-
const handleMouseLeave = () => {
|
69
|
-
setHoveredStep(null);
|
70
|
-
};
|
71
|
-
const buttons = Array.from({ length: quantity }, (_, idx) => {
|
72
|
-
const isPrimary = idx + DIFF_BETWEEN_STEP_AND_INDEX <= (hoveredStep !== null ? hoveredStep + DIFF_BETWEEN_STEP_AND_INDEX : step2);
|
73
|
-
const isSecondary = idx + DIFF_BETWEEN_STEP_AND_INDEX > (hoveredStep !== null ? hoveredStep + DIFF_BETWEEN_STEP_AND_INDEX : step2);
|
74
|
-
return /* @__PURE__ */ jsx(
|
75
|
-
"button",
|
76
|
-
{
|
77
|
-
id: `${idPrefix}${ID_SEPARATOR}${idx}`,
|
78
|
-
className: classNames(cls.step, cls[size], stepClassName, {
|
79
|
-
[cls.editable]: editable2 && !disabled2,
|
80
|
-
[cls.disabled]: disabled2 || !editable2 && idx + 1 > step2,
|
81
|
-
[cls[EStepsColorType.PRIMARY]]: isPrimary,
|
82
|
-
[cls[EStepsColorType.SECONDARY]]: isSecondary,
|
83
|
-
[cls[primaryColor]]: isPrimary,
|
84
|
-
[cls[secondaryColor]]: isSecondary
|
85
|
-
}),
|
86
|
-
onClick: () => handleClick(idx),
|
87
|
-
onMouseEnter: handleMouseEnter,
|
88
|
-
onMouseLeave: handleMouseLeave,
|
89
|
-
children: /* @__PURE__ */ jsx(Icon, { iconName: "Step", ...StepSize[size] })
|
33
|
+
const Element = elementType === ETagType.BUTTON ? ETagType.BUTTON : ETagType.DIV;
|
34
|
+
return /* @__PURE__ */ jsx(
|
35
|
+
Element,
|
36
|
+
{
|
37
|
+
className: classNames(cls.container, cls[size], rootClassName, {
|
38
|
+
[cls.disabled]: disabled2
|
39
|
+
}),
|
40
|
+
ref,
|
41
|
+
style: {
|
42
|
+
backgroundColor: outline ? "transparent" : backgroundColor,
|
43
|
+
borderColor: backgroundColor,
|
44
|
+
color: outline ? backgroundColor : color
|
90
45
|
},
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
46
|
+
...otherProps,
|
47
|
+
children: /* @__PURE__ */ jsx("span", { className: classNames(cls.inner, innerClassName), children })
|
48
|
+
}
|
49
|
+
);
|
95
50
|
}
|
96
51
|
);
|
97
52
|
export {
|
98
|
-
|
53
|
+
Tag
|
99
54
|
};
|
@@ -1,41 +1,9 @@
|
|
1
|
-
export declare
|
2
|
-
export declare const DIFF_BETWEEN_STEP_AND_INDEX = 1;
|
3
|
-
export declare const ID_SEPARATOR = "-//-";
|
4
|
-
export declare enum EStepsSize {
|
1
|
+
export declare enum ETagSize {
|
5
2
|
XS = "XS",
|
6
3
|
S = "S",
|
7
|
-
M = "M"
|
8
|
-
L = "L"
|
4
|
+
M = "M"
|
9
5
|
}
|
10
|
-
export declare
|
11
|
-
|
12
|
-
|
13
|
-
height: number;
|
14
|
-
};
|
15
|
-
S: {
|
16
|
-
width: number;
|
17
|
-
height: number;
|
18
|
-
};
|
19
|
-
M: {
|
20
|
-
width: number;
|
21
|
-
height: number;
|
22
|
-
};
|
23
|
-
L: {
|
24
|
-
width: number;
|
25
|
-
height: number;
|
26
|
-
};
|
27
|
-
};
|
28
|
-
export declare enum EStepsColorType {
|
29
|
-
PRIMARY = "PRIMARY",
|
30
|
-
SECONDARY = "SECONDARY"
|
31
|
-
}
|
32
|
-
export declare enum EStepsPrimaryColor {
|
33
|
-
GRAY = "GRAY",
|
34
|
-
CITRINE = "CITRINE",
|
35
|
-
SAPPHIRE = "SAPPHIRE"
|
36
|
-
}
|
37
|
-
export declare enum EStepsSecondaryColor {
|
38
|
-
LIGHT_GRAY = "LIGHT_GRAY",
|
39
|
-
LIGHT_SAPPHIRE = "LIGHT_SAPPHIRE",
|
40
|
-
WHITE = "WHITE"
|
6
|
+
export declare enum ETagType {
|
7
|
+
DIV = "div",
|
8
|
+
BUTTON = "button"
|
41
9
|
}
|
@@ -1,55 +1,15 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
XS: {
|
13
|
-
width: 19,
|
14
|
-
height: 8
|
15
|
-
},
|
16
|
-
S: {
|
17
|
-
width: 36,
|
18
|
-
height: 12
|
19
|
-
},
|
20
|
-
M: {
|
21
|
-
width: 48,
|
22
|
-
height: 21
|
23
|
-
},
|
24
|
-
L: {
|
25
|
-
width: 64,
|
26
|
-
height: 28
|
27
|
-
}
|
28
|
-
};
|
29
|
-
var EStepsColorType = /* @__PURE__ */ ((EStepsColorType2) => {
|
30
|
-
EStepsColorType2["PRIMARY"] = "PRIMARY";
|
31
|
-
EStepsColorType2["SECONDARY"] = "SECONDARY";
|
32
|
-
return EStepsColorType2;
|
33
|
-
})(EStepsColorType || {});
|
34
|
-
var EStepsPrimaryColor = /* @__PURE__ */ ((EStepsPrimaryColor2) => {
|
35
|
-
EStepsPrimaryColor2["GRAY"] = "GRAY";
|
36
|
-
EStepsPrimaryColor2["CITRINE"] = "CITRINE";
|
37
|
-
EStepsPrimaryColor2["SAPPHIRE"] = "SAPPHIRE";
|
38
|
-
return EStepsPrimaryColor2;
|
39
|
-
})(EStepsPrimaryColor || {});
|
40
|
-
var EStepsSecondaryColor = /* @__PURE__ */ ((EStepsSecondaryColor2) => {
|
41
|
-
EStepsSecondaryColor2["LIGHT_GRAY"] = "LIGHT_GRAY";
|
42
|
-
EStepsSecondaryColor2["LIGHT_SAPPHIRE"] = "LIGHT_SAPPHIRE";
|
43
|
-
EStepsSecondaryColor2["WHITE"] = "WHITE";
|
44
|
-
return EStepsSecondaryColor2;
|
45
|
-
})(EStepsSecondaryColor || {});
|
1
|
+
var ETagSize = /* @__PURE__ */ ((ETagSize2) => {
|
2
|
+
ETagSize2["XS"] = "XS";
|
3
|
+
ETagSize2["S"] = "S";
|
4
|
+
ETagSize2["M"] = "M";
|
5
|
+
return ETagSize2;
|
6
|
+
})(ETagSize || {});
|
7
|
+
var ETagType = /* @__PURE__ */ ((ETagType2) => {
|
8
|
+
ETagType2["DIV"] = "div";
|
9
|
+
ETagType2["BUTTON"] = "button";
|
10
|
+
return ETagType2;
|
11
|
+
})(ETagType || {});
|
46
12
|
export {
|
47
|
-
|
48
|
-
|
49
|
-
EStepsPrimaryColor,
|
50
|
-
EStepsSecondaryColor,
|
51
|
-
EStepsSize,
|
52
|
-
ID_SEPARATOR,
|
53
|
-
StepSize,
|
54
|
-
ZERO_STEP
|
13
|
+
ETagSize,
|
14
|
+
ETagType
|
55
15
|
};
|
@@ -1,3 +1,2 @@
|
|
1
|
-
export {
|
2
|
-
export {
|
3
|
-
export type { TCommonStepsProps } from './types';
|
1
|
+
export { Tag } from './Tag';
|
2
|
+
export { ETagSize, ETagType } from './constants';
|
@@ -1,8 +1,7 @@
|
|
1
|
-
import {
|
2
|
-
import {
|
1
|
+
import { Tag } from "./Tag.js";
|
2
|
+
import { ETagSize, ETagType } from "./constants.js";
|
3
3
|
export {
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
Steps
|
4
|
+
ETagSize,
|
5
|
+
ETagType,
|
6
|
+
Tag
|
8
7
|
};
|
@@ -0,0 +1,24 @@
|
|
1
|
+
type TProps = {
|
2
|
+
/**
|
3
|
+
* число, которое представляет собой временную метку, указывающую время, когда истекает таймер.
|
4
|
+
* const timer = new Date().getTime() + 60000; => таймер на 1 минуту
|
5
|
+
*/
|
6
|
+
expiryTimestamp: number;
|
7
|
+
/**
|
8
|
+
* необязательное свойство типа boolean, которое указывает, должен ли таймер начинаться автоматически при создании компонента.
|
9
|
+
*/
|
10
|
+
autoStart?: boolean;
|
11
|
+
/**
|
12
|
+
* необязательная функция, которая вызывается, когда таймер истекает.
|
13
|
+
*/
|
14
|
+
onTimerEnd?: () => void;
|
15
|
+
/**
|
16
|
+
* Дополнительный класс.
|
17
|
+
*/
|
18
|
+
className?: string;
|
19
|
+
};
|
20
|
+
/**
|
21
|
+
* Компонент Timer отображает таймер с отсчетом времени в минутах и секундах.
|
22
|
+
*/
|
23
|
+
export declare const Timer: ({ expiryTimestamp, autoStart, onTimerEnd, className }: TProps) => import("react/jsx-runtime").JSX.Element;
|
24
|
+
export {};
|
@@ -0,0 +1,29 @@
|
|
1
|
+
import { jsxs } from "react/jsx-runtime";
|
2
|
+
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
|
+
import { useTimer } from "../../hooks/useTimer/index.js";
|
4
|
+
import '../../assets/Timer.css';const timer = "_timer_llwad_3";
|
5
|
+
const cls = {
|
6
|
+
timer
|
7
|
+
};
|
8
|
+
const Timer = ({
|
9
|
+
expiryTimestamp,
|
10
|
+
autoStart = false,
|
11
|
+
onTimerEnd,
|
12
|
+
className
|
13
|
+
}) => {
|
14
|
+
const { minutes, seconds } = useTimer({
|
15
|
+
expiryTimestamp,
|
16
|
+
onExpire: onTimerEnd,
|
17
|
+
autoStart
|
18
|
+
});
|
19
|
+
const formattedMinutes = String(minutes).padStart(2, "0");
|
20
|
+
const formattedSeconds = String(seconds).padStart(2, "0");
|
21
|
+
return /* @__PURE__ */ jsxs("div", { className: classNames(cls.timer, className), children: [
|
22
|
+
formattedMinutes,
|
23
|
+
":",
|
24
|
+
formattedSeconds
|
25
|
+
] });
|
26
|
+
};
|
27
|
+
export {
|
28
|
+
Timer
|
29
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export { Timer } from './Timer';
|
@@ -6,12 +6,22 @@ export type { TInputPasswordProps } from './InputPassword';
|
|
6
6
|
export { InputPhoneNumber, getMaskedInputPhoneValue, getUnmaskedInputValue } from './InputPhoneNumber';
|
7
7
|
export { OtpInput } from './OtpInput';
|
8
8
|
export { RadioGroup } from './RadioGroup';
|
9
|
-
export type { TRadioOption } from './RadioGroup';
|
9
|
+
export type { TRadioOption, TRadioGroupProps } from './RadioGroup';
|
10
|
+
export { DatePicker } from './DatePicker';
|
11
|
+
export type { TDatePickerProps, TDatePickerValue } from './DatePicker';
|
10
12
|
export { MergedButton } from './MergedButton';
|
11
13
|
export { EMergedButtonVariantRound } from './MergedButton';
|
12
14
|
export type { TButtonPropsWithoutStyles } from './MergedButton';
|
13
15
|
export { Image } from './Image';
|
14
16
|
export { Loader } from './Loader';
|
15
17
|
export { Slider } from './Slider';
|
18
|
+
export { Drawer } from './Drawer';
|
19
|
+
export { EDrawerPosition } from './Drawer';
|
16
20
|
export { Steps, EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize, type TCommonStepsProps } from './Steps';
|
17
21
|
export { Vote, EVoteSize, type TCommonVoteProps } from './Vote';
|
22
|
+
export { SelectSearch, ESelectSearchSize } from './SelectSearch';
|
23
|
+
export type { TSelectSearchItem, TSelectSearchProps } from './SelectSearch';
|
24
|
+
export { Switch } from './Switch';
|
25
|
+
export type { TSwitchProps } from './Switch';
|
26
|
+
export { Tag, ETagSize, ETagType } from './Tag';
|
27
|
+
export { Timer } from './Timer';
|
package/dist/components/index.js
CHANGED
@@ -7,27 +7,42 @@ import { InputPhoneNumber } from "./InputPhoneNumber/InputPhoneNumber.js";
|
|
7
7
|
import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./InputPhoneNumber/utils.js";
|
8
8
|
import { OtpInput } from "./OtpInput/OtpInput.js";
|
9
9
|
import { RadioGroup } from "./RadioGroup/RadioGroup.js";
|
10
|
+
import { DatePicker } from "./DatePicker/DatePicker.js";
|
10
11
|
import { MergedButton } from "./MergedButton/MergedButton.js";
|
11
12
|
import { EMergedButtonVariantRound } from "./MergedButton/constants.js";
|
12
13
|
import { AppImage } from "./Image/Image.js";
|
13
14
|
import { Loader } from "./Loader/Loader.js";
|
14
15
|
import { Slider } from "./Slider/Slider.js";
|
16
|
+
import { Drawer } from "./Drawer/Drawer.js";
|
17
|
+
import { EDrawerPosition } from "./Drawer/constants.js";
|
15
18
|
import { Steps } from "./Steps/Steps.js";
|
16
19
|
import { EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize } from "./Steps/constants.js";
|
17
20
|
import { Vote } from "./Vote/Vote.js";
|
18
21
|
import { EVoteSize } from "./Vote/constants.js";
|
22
|
+
import { SelectSearch } from "./SelectSearch/SelectSearch.js";
|
23
|
+
import { ESelectSearchSize } from "./SelectSearch/constants.js";
|
24
|
+
import { Switch } from "./Switch/Switch.js";
|
25
|
+
import { Tag } from "./Tag/Tag.js";
|
26
|
+
import { ETagSize, ETagType } from "./Tag/constants.js";
|
27
|
+
import { Timer } from "./Timer/Timer.js";
|
19
28
|
export {
|
20
29
|
Button,
|
30
|
+
DatePicker,
|
31
|
+
Drawer,
|
21
32
|
EButtonForm,
|
22
33
|
EButtonSize,
|
23
34
|
EButtonVariantDefault,
|
24
35
|
EButtonVariantRound,
|
36
|
+
EDrawerPosition,
|
25
37
|
EInputSize,
|
26
38
|
EInputVariant,
|
27
39
|
EMergedButtonVariantRound,
|
40
|
+
ESelectSearchSize,
|
28
41
|
EStepsPrimaryColor,
|
29
42
|
EStepsSecondaryColor,
|
30
43
|
EStepsSize,
|
44
|
+
ETagSize,
|
45
|
+
ETagType,
|
31
46
|
EVoteSize,
|
32
47
|
AppImage as Image,
|
33
48
|
Input,
|
@@ -37,8 +52,12 @@ export {
|
|
37
52
|
MergedButton,
|
38
53
|
OtpInput,
|
39
54
|
RadioGroup,
|
55
|
+
SelectSearch,
|
40
56
|
Slider,
|
41
57
|
Steps,
|
58
|
+
Switch,
|
59
|
+
Tag,
|
60
|
+
Timer,
|
42
61
|
Vote,
|
43
62
|
getMaskedInputPhoneValue,
|
44
63
|
getUnmaskedInputValue
|
@@ -0,0 +1,91 @@
|
|
1
|
+
import { useCallback } from "react";
|
2
|
+
import { u as u$1, a as u$2 } from "./label-BXAcSLy0.js";
|
3
|
+
function l(e, r) {
|
4
|
+
return e !== null && r !== null && typeof e == "object" && typeof r == "object" && "id" in e && "id" in r ? e.id === r.id : e === r;
|
5
|
+
}
|
6
|
+
function u(e = l) {
|
7
|
+
return useCallback((r, t) => {
|
8
|
+
if (typeof e == "string") {
|
9
|
+
let o = e;
|
10
|
+
return (r == null ? void 0 : r[o]) === (t == null ? void 0 : t[o]);
|
11
|
+
}
|
12
|
+
return e(r, t);
|
13
|
+
}, [e]);
|
14
|
+
}
|
15
|
+
let f = ["[contentEditable=true]", "[tabindex]", "a[href]", "area[href]", "button:not([disabled])", "iframe", "input:not([disabled])", "select:not([disabled])", "textarea:not([disabled])"].map((e) => `${e}:not([tabindex='-1'])`).join(","), p = ["[data-autofocus]"].map((e) => `${e}:not([tabindex='-1'])`).join(",");
|
16
|
+
var F = ((n) => (n[n.First = 1] = "First", n[n.Previous = 2] = "Previous", n[n.Next = 4] = "Next", n[n.Last = 8] = "Last", n[n.WrapAround = 16] = "WrapAround", n[n.NoScroll = 32] = "NoScroll", n[n.AutoFocus = 64] = "AutoFocus", n))(F || {}), T = ((o) => (o[o.Error = 0] = "Error", o[o.Overflow = 1] = "Overflow", o[o.Success = 2] = "Success", o[o.Underflow = 3] = "Underflow", o))(T || {}), y = ((t) => (t[t.Previous = -1] = "Previous", t[t.Next = 1] = "Next", t))(y || {});
|
17
|
+
function b(e = document.body) {
|
18
|
+
return e == null ? [] : Array.from(e.querySelectorAll(f)).sort((r, t) => Math.sign((r.tabIndex || Number.MAX_SAFE_INTEGER) - (t.tabIndex || Number.MAX_SAFE_INTEGER)));
|
19
|
+
}
|
20
|
+
function S(e = document.body) {
|
21
|
+
return e == null ? [] : Array.from(e.querySelectorAll(p)).sort((r, t) => Math.sign((r.tabIndex || Number.MAX_SAFE_INTEGER) - (t.tabIndex || Number.MAX_SAFE_INTEGER)));
|
22
|
+
}
|
23
|
+
var h = ((t) => (t[t.Strict = 0] = "Strict", t[t.Loose = 1] = "Loose", t))(h || {});
|
24
|
+
function A(e, r = 0) {
|
25
|
+
var t;
|
26
|
+
return e === ((t = u$1(e)) == null ? void 0 : t.body) ? false : u$2(r, { [0]() {
|
27
|
+
return e.matches(f);
|
28
|
+
}, [1]() {
|
29
|
+
let u2 = e;
|
30
|
+
for (; u2 !== null; ) {
|
31
|
+
if (u2.matches(f)) return true;
|
32
|
+
u2 = u2.parentElement;
|
33
|
+
}
|
34
|
+
return false;
|
35
|
+
} });
|
36
|
+
}
|
37
|
+
var H = ((t) => (t[t.Keyboard = 0] = "Keyboard", t[t.Mouse = 1] = "Mouse", t))(H || {});
|
38
|
+
typeof window != "undefined" && typeof document != "undefined" && (document.addEventListener("keydown", (e) => {
|
39
|
+
e.metaKey || e.altKey || e.ctrlKey || (document.documentElement.dataset.headlessuiFocusVisible = "");
|
40
|
+
}, true), document.addEventListener("click", (e) => {
|
41
|
+
e.detail === 1 ? delete document.documentElement.dataset.headlessuiFocusVisible : e.detail === 0 && (document.documentElement.dataset.headlessuiFocusVisible = "");
|
42
|
+
}, true));
|
43
|
+
let w = ["textarea", "input"].join(",");
|
44
|
+
function O(e) {
|
45
|
+
var r, t;
|
46
|
+
return (t = (r = e == null ? void 0 : e.matches) == null ? void 0 : r.call(e, w)) != null ? t : false;
|
47
|
+
}
|
48
|
+
function _(e, r = (t) => t) {
|
49
|
+
return e.slice().sort((t, u2) => {
|
50
|
+
let o = r(t), c = r(u2);
|
51
|
+
if (o === null || c === null) return 0;
|
52
|
+
let l2 = o.compareDocumentPosition(c);
|
53
|
+
return l2 & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : l2 & Node.DOCUMENT_POSITION_PRECEDING ? 1 : 0;
|
54
|
+
});
|
55
|
+
}
|
56
|
+
function P(e, r, { sorted: t = true, relativeTo: u2 = null, skipElements: o = [] } = {}) {
|
57
|
+
let c = Array.isArray(e) ? e.length > 0 ? e[0].ownerDocument : document : e.ownerDocument, l2 = Array.isArray(e) ? t ? _(e) : e : r & 64 ? S(e) : b(e);
|
58
|
+
o.length > 0 && l2.length > 1 && (l2 = l2.filter((s) => !o.some((a) => a != null && "current" in a ? (a == null ? void 0 : a.current) === s : a === s))), u2 = u2 != null ? u2 : c.activeElement;
|
59
|
+
let n = (() => {
|
60
|
+
if (r & 5) return 1;
|
61
|
+
if (r & 10) return -1;
|
62
|
+
throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
|
63
|
+
})(), x = (() => {
|
64
|
+
if (r & 1) return 0;
|
65
|
+
if (r & 2) return Math.max(0, l2.indexOf(u2)) - 1;
|
66
|
+
if (r & 4) return Math.max(0, l2.indexOf(u2)) + 1;
|
67
|
+
if (r & 8) return l2.length - 1;
|
68
|
+
throw new Error("Missing Focus.First, Focus.Previous, Focus.Next or Focus.Last");
|
69
|
+
})(), M = r & 32 ? { preventScroll: true } : {}, m = 0, d = l2.length, i;
|
70
|
+
do {
|
71
|
+
if (m >= d || m + d <= 0) return 0;
|
72
|
+
let s = x + m;
|
73
|
+
if (r & 16) s = (s + d) % d;
|
74
|
+
else {
|
75
|
+
if (s < 0) return 3;
|
76
|
+
if (s >= d) return 1;
|
77
|
+
}
|
78
|
+
i = l2[s], i == null || i.focus(M), m += n;
|
79
|
+
} while (i !== c.activeElement);
|
80
|
+
return r & 6 && O(i) && i.select(), 2;
|
81
|
+
}
|
82
|
+
export {
|
83
|
+
A,
|
84
|
+
F,
|
85
|
+
P,
|
86
|
+
T,
|
87
|
+
_,
|
88
|
+
f,
|
89
|
+
h,
|
90
|
+
u
|
91
|
+
};
|
package/dist/hooks/index.d.ts
CHANGED
package/dist/hooks/index.js
CHANGED
@@ -1,6 +1,12 @@
|
|
1
1
|
import { useMediaQuery } from "./useMediaQuery/useMediaQuery.js";
|
2
2
|
import { EMediaQuery } from "./useMediaQuery/constants.js";
|
3
|
+
import { useLockBodyScroll } from "./useLockBodyScroll/useLockBodyScroll.js";
|
4
|
+
import { useInterval } from "./useInterval/useInterval.js";
|
5
|
+
import { useTimer } from "./useTimer/index.js";
|
3
6
|
export {
|
4
7
|
EMediaQuery,
|
5
|
-
|
8
|
+
useInterval,
|
9
|
+
useLockBodyScroll,
|
10
|
+
useMediaQuery,
|
11
|
+
useTimer
|
6
12
|
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export { useClickOutside } from './useClickOutside';
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import { useEffect } from "react";
|
2
|
+
function useClickOutside({
|
3
|
+
isActive,
|
4
|
+
setActive,
|
5
|
+
className
|
6
|
+
}) {
|
7
|
+
useEffect(() => {
|
8
|
+
const handleClickOtside = (e) => {
|
9
|
+
if (e.target) {
|
10
|
+
if (!e.target.closest("." + className)) {
|
11
|
+
setActive(false);
|
12
|
+
window.removeEventListener("click", handleClickOtside, true);
|
13
|
+
}
|
14
|
+
}
|
15
|
+
};
|
16
|
+
if (isActive) {
|
17
|
+
window.addEventListener("click", handleClickOtside, true);
|
18
|
+
} else {
|
19
|
+
window.removeEventListener("click", handleClickOtside, true);
|
20
|
+
}
|
21
|
+
}, [isActive]);
|
22
|
+
}
|
23
|
+
export {
|
24
|
+
useClickOutside
|
25
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export { useInterval } from './useInterval';
|
@@ -0,0 +1 @@
|
|
1
|
+
export declare function useInterval(callback: VoidFunction, delay: number | null): void;
|
@@ -0,0 +1,17 @@
|
|
1
|
+
import { useRef, useEffect } from "react";
|
2
|
+
function useInterval(callback, delay) {
|
3
|
+
const callbackRef = useRef();
|
4
|
+
callbackRef.current = callback;
|
5
|
+
useEffect(() => {
|
6
|
+
if (!delay) {
|
7
|
+
return;
|
8
|
+
}
|
9
|
+
const interval = setInterval(() => {
|
10
|
+
callbackRef.current && callbackRef.current();
|
11
|
+
}, delay);
|
12
|
+
return () => clearInterval(interval);
|
13
|
+
}, [delay]);
|
14
|
+
}
|
15
|
+
export {
|
16
|
+
useInterval
|
17
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export { useLockBodyScroll } from './useLockBodyScroll';
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import { useLayoutEffect } from "react";
|
2
|
+
function useLockBodyScroll({ on, paddingRight }) {
|
3
|
+
useLayoutEffect(() => {
|
4
|
+
const hasVerticalScrollbar = document.documentElement.scrollHeight > document.documentElement.clientHeight;
|
5
|
+
if (!on || !hasVerticalScrollbar) return;
|
6
|
+
const originalStyle = window.getComputedStyle(document.body).overflow;
|
7
|
+
const originalPaddingStyle = window.getComputedStyle(
|
8
|
+
document.body
|
9
|
+
).paddingRight;
|
10
|
+
document.body.style.overflow = "hidden";
|
11
|
+
document.body.style.paddingRight = `${paddingRight}px`;
|
12
|
+
return () => {
|
13
|
+
document.body.style.overflow = originalStyle;
|
14
|
+
document.body.style.paddingRight = originalPaddingStyle;
|
15
|
+
};
|
16
|
+
}, [on, paddingRight]);
|
17
|
+
}
|
18
|
+
export {
|
19
|
+
useLockBodyScroll
|
20
|
+
};
|