mimir-ui-kit 1.32.3 → 1.33.0
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/assets/Avatar.css +1 -0
- package/dist/assets/NotificationBadge.css +1 -1
- package/dist/assets/styles.css +1 -1
- package/dist/components/Avatar/Avatar.d.ts +3 -0
- package/dist/components/Avatar/Avatar.js +53 -0
- package/dist/components/Avatar/constants.d.ts +5 -0
- package/dist/components/Avatar/constants.js +9 -0
- package/dist/components/Avatar/index.d.ts +3 -0
- package/dist/components/Avatar/index.js +6 -0
- package/dist/components/Avatar/types.d.ts +10 -0
- package/dist/components/Avatar/types.js +1 -0
- package/dist/components/DatePicker/DatePicker.d.ts +36 -18
- package/dist/components/DatePicker/DatePicker.js +41 -3
- package/dist/components/DatePicker/DatePickerModal.js +1 -1
- package/dist/components/DatePicker/MonthPickerModal.js +1 -1
- package/dist/components/DatePicker/YearPickerModal.js +1 -1
- package/dist/components/DatePicker/utils.d.ts +2 -0
- package/dist/components/DatePicker/utils.js +16 -0
- package/dist/components/NotificationBadge/NotificationBadge.js +4 -4
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +4 -0
- package/dist/index.js +4 -0
- package/dist/styles.module-7wzJYhR3.js +40 -0
- package/package.json +1 -1
- package/dist/styles.module-Ugsf0AOb.js +0 -38
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._avatar_58dyx_2{position:relative;display:flex;align-items:center;justify-content:center;width:var(--avatar-width);height:var(--avatar-height);-o-object-fit:cover;object-fit:cover;border-radius:50%}._avatar_58dyx_2 image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}._s_58dyx_19{--avatar-width: 32px;--avatar-height: 32px}._m_58dyx_24{--avatar-width: 40px;--avatar-height: 40px}._l_58dyx_29{--avatar-width: 48px;--avatar-height: 48px}._default_58dyx_34{background-color:var(--black-5)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._notification-
|
|
1
|
+
._notification-badge_2ldj3_2{position:relative;display:flex;align-items:center;justify-content:center;width:var(--width-notification-badge);height:var(--height-notification-badge);color:var(--white);font-size:var(--size-text-notification-badge);background-color:var(--citrine-100);border-radius:50%}._notification-badge-absolute_2ldj3_14{position:absolute}._m_2ldj3_18{--size-text-notification-badge: var(--size-text-m);--width-notification-badge: 24px;--height-notification-badge: 24px}._s_2ldj3_24{--height-notification-badge: 16px;--width-notification-badge: 16px;--size-text-notification-badge: var(--size-text-xs)}
|
package/dist/assets/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._input_1i5h3_2{padding-right:var(--space-3xl)}._input-wrapper_1i5h3_6{flex:1}._date-wrapper_1i5h3_10{position:relative;width:100%}._date-wrapper_1i5h3_10 ._inputBorderControl_1i5h3_14{border:transparent}._date-wrapper_1i5h3_10:hover ._input-wrapper_1i5h3_6{background-color:var(--input-bg-color-hover)}._date-wrapper_1i5h3_10:before{position:absolute;top:0;right:45px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}._date-wrapper_1i5h3_10._editable_1i5h3_27:before{display:none}._date-wrapper_1i5h3_10 svg{cursor:pointer}[data-disabled=true] ._date-wrapper_1i5h3_10:before{cursor:auto}[data-disabled=true] ._date-wrapper_1i5h3_10 ._input-wrapper_1i5h3_6{background:var(--black-20)}[data-disabled=true] ._date-wrapper_1i5h3_10 ._input-wrapper_1i5h3_6 label,[data-disabled=true] ._date-wrapper_1i5h3_10 ._input-wrapper_1i5h3_6 input{color:var(--white)}[data-disabled=true] ._button-wrapper_1i5h3_44 svg{color:var(--white);cursor:default;fill:var(--white)}._wrapper_1i5h3_50{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_1i5h3_50._active_1i5h3_56{border-bottom:1px solid var(--citrine-100)}._button-wrapper_1i5h3_44{position:absolute;top:0;right:0;z-index:2;display:flex;justify-content:center;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_1i5h3_44{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_1i5h3_78{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_1i5h3_84{position:absolute;z-index:3;display:flex;flex-direction:column;width:368px;max-height:none;padding:16px;font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:var(--white);border-radius:var(--control-radius-s);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703;opacity:0;transition:height .5s ease-in;font-feature-settings:"zero";font-variant-numeric:slashed-zero}._calendar-block_1i5h3_84 ._h_1i5h3_107{display:flex;width:100%;color:var(--black-100)}._calendar-block_1i5h3_84 ._b_1i5h3_44{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_1i5h3_84 ._d_1i5h3_10{display:flex;flex:1;gap:4px;align-items:center;justify-content:center;color:var(--black-100);cursor:pointer}._calendar-block_1i5h3_84 ._m_1i5h3_128,._calendar-block_1i5h3_84 ._a_1i5h3_56,._calendar-block_1i5h3_84 ._prev_1i5h3_130{width:auto;height:48px;overflow:hidden}._calendar-block_1i5h3_84 ._m_1i5h3_128{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_1i5h3_84 ._m_1i5h3_128 b{font-weight:var(--font-weight-text-regular)}._calendar-block_1i5h3_84 ._orange_1i5h3_146{color:var(--citrine-100)}._calendar-block_1i5h3_84 ._a_1i5h3_56{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_1i5h3_84 ._a_1i5h3_56 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_1i5h3_84 ._a_1i5h3_56 b:hover{background:var(--black-10)}._calendar-block_1i5h3_84 ._a_1i5h3_56 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_1i5h3_84 ._current_1i5h3_171{background:var(--sapphire-10);border-radius:var(--control-radius-s)}._calendar-block_1i5h3_84 ._monthGrid_1i5h3_176{display:grid;grid-template-columns:repeat(3,1fr)}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
+
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
+
import { memo } from "react";
|
|
4
|
+
import { EAvatarSize } from "./constants.js";
|
|
5
|
+
import { Icon } from "../../icons/Icon.js";
|
|
6
|
+
import { AppImage } from "../Image/Image.js";
|
|
7
|
+
import { NotificationBadge } from "../NotificationBadge/NotificationBadge.js";
|
|
8
|
+
import '../../assets/Avatar.css';const avatar = "_avatar_58dyx_2";
|
|
9
|
+
const s = "_s_58dyx_19";
|
|
10
|
+
const m = "_m_58dyx_24";
|
|
11
|
+
const l = "_l_58dyx_29";
|
|
12
|
+
const cls = {
|
|
13
|
+
avatar,
|
|
14
|
+
s,
|
|
15
|
+
m,
|
|
16
|
+
l,
|
|
17
|
+
"default": "_default_58dyx_34"
|
|
18
|
+
};
|
|
19
|
+
const Avatar = memo(
|
|
20
|
+
({
|
|
21
|
+
size = EAvatarSize.M,
|
|
22
|
+
className,
|
|
23
|
+
notificationsCount = 0,
|
|
24
|
+
src,
|
|
25
|
+
alt = "User avatar"
|
|
26
|
+
}) => {
|
|
27
|
+
const notificationPosition = size === EAvatarSize.S || size === EAvatarSize.M ? { top: "8px", left: "-8px" } : { top: "12px", left: "-12px" };
|
|
28
|
+
return /* @__PURE__ */ jsxs(
|
|
29
|
+
"div",
|
|
30
|
+
{
|
|
31
|
+
className: classNames(cls.avatar, cls[size], className, {
|
|
32
|
+
[cls.default]: !src
|
|
33
|
+
}),
|
|
34
|
+
children: [
|
|
35
|
+
src ? /* @__PURE__ */ jsx(AppImage, { src, alt, className: cls.image }) : /* @__PURE__ */ jsx(Icon, { iconName: "User16px" }),
|
|
36
|
+
!!notificationsCount && /* @__PURE__ */ jsx(
|
|
37
|
+
NotificationBadge,
|
|
38
|
+
{
|
|
39
|
+
count: notificationsCount,
|
|
40
|
+
position: notificationPosition,
|
|
41
|
+
size: size === EAvatarSize.S ? "s" : "m",
|
|
42
|
+
absolute: true
|
|
43
|
+
}
|
|
44
|
+
)
|
|
45
|
+
]
|
|
46
|
+
}
|
|
47
|
+
);
|
|
48
|
+
}
|
|
49
|
+
);
|
|
50
|
+
Avatar.displayName = "Avatar";
|
|
51
|
+
export {
|
|
52
|
+
Avatar
|
|
53
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
|
@@ -2,35 +2,44 @@ import { TInputProps } from '../Input';
|
|
|
2
2
|
|
|
3
3
|
export type DatePicker = {
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
5
|
+
* Функция обратного вызова при изменении значения даты
|
|
6
6
|
*/
|
|
7
7
|
onChangeValue?: (e: TDatePickerValue) => void;
|
|
8
8
|
/**
|
|
9
|
-
*
|
|
9
|
+
* Функция обратного вызова при возникновении ошибки валидации
|
|
10
10
|
*/
|
|
11
11
|
onError?: (e: TDatePickerOnError) => void;
|
|
12
|
-
/**
|
|
12
|
+
/**
|
|
13
|
+
* Функция обратного вызова при потере фокуса компонентом
|
|
13
14
|
*/
|
|
14
15
|
onBlur?: (e: Date) => void;
|
|
15
16
|
/**
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
*/
|
|
17
|
+
* Функция ограничения выбора даты (до какой даты выбор не доступен)
|
|
18
|
+
*/
|
|
19
19
|
before?: Date | string;
|
|
20
20
|
/**
|
|
21
|
-
*
|
|
21
|
+
* Значение даты из стейта (data)
|
|
22
22
|
*/
|
|
23
23
|
value?: string;
|
|
24
24
|
/**
|
|
25
|
-
*
|
|
25
|
+
* Значение типа модального окна календаря
|
|
26
26
|
*/
|
|
27
27
|
type?: 'days' | 'months' | 'years';
|
|
28
|
+
/**
|
|
29
|
+
* Флаг отключения компонента
|
|
30
|
+
*/
|
|
28
31
|
disabled?: boolean;
|
|
32
|
+
/**
|
|
33
|
+
* Флаг наличия ошибки
|
|
34
|
+
*/
|
|
29
35
|
error?: boolean;
|
|
30
36
|
/**
|
|
31
|
-
*
|
|
37
|
+
* Флаг немедленной валидации при вводе
|
|
32
38
|
*/
|
|
33
39
|
validateImmediately?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Флаг разрешения ручного ввода даты
|
|
42
|
+
*/
|
|
34
43
|
editable?: boolean;
|
|
35
44
|
} & TInputProps;
|
|
36
45
|
export type TDatePickerValue = {
|
|
@@ -43,34 +52,43 @@ export type TDatePickerOnError = {
|
|
|
43
52
|
};
|
|
44
53
|
export declare const DatePicker: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<{
|
|
45
54
|
/**
|
|
46
|
-
*
|
|
55
|
+
* Функция обратного вызова при изменении значения даты
|
|
47
56
|
*/
|
|
48
57
|
onChangeValue?: (e: TDatePickerValue) => void;
|
|
49
58
|
/**
|
|
50
|
-
*
|
|
59
|
+
* Функция обратного вызова при возникновении ошибки валидации
|
|
51
60
|
*/
|
|
52
61
|
onError?: (e: TDatePickerOnError) => void;
|
|
53
|
-
/**
|
|
62
|
+
/**
|
|
63
|
+
* Функция обратного вызова при потере фокуса компонентом
|
|
54
64
|
*/
|
|
55
65
|
onBlur?: (e: Date) => void;
|
|
56
66
|
/**
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
*/
|
|
67
|
+
* Функция ограничения выбора даты (до какой даты выбор не доступен)
|
|
68
|
+
*/
|
|
60
69
|
before?: Date | string;
|
|
61
70
|
/**
|
|
62
|
-
*
|
|
71
|
+
* Значение даты из стейта (data)
|
|
63
72
|
*/
|
|
64
73
|
value?: string;
|
|
65
74
|
/**
|
|
66
|
-
*
|
|
75
|
+
* Значение типа модального окна календаря
|
|
67
76
|
*/
|
|
68
77
|
type?: "days" | "months" | "years";
|
|
78
|
+
/**
|
|
79
|
+
* Флаг отключения компонента
|
|
80
|
+
*/
|
|
69
81
|
disabled?: boolean;
|
|
82
|
+
/**
|
|
83
|
+
* Флаг наличия ошибки
|
|
84
|
+
*/
|
|
70
85
|
error?: boolean;
|
|
71
86
|
/**
|
|
72
|
-
*
|
|
87
|
+
* Флаг немедленной валидации при вводе
|
|
73
88
|
*/
|
|
74
89
|
validateImmediately?: boolean;
|
|
90
|
+
/**
|
|
91
|
+
* Флаг разрешения ручного ввода даты
|
|
92
|
+
*/
|
|
75
93
|
editable?: boolean;
|
|
76
94
|
} & import('../Input/types').TInputProps & import('../Input').TAdditionalProps & import('react').RefAttributes<HTMLInputElement>>>;
|
|
@@ -3,12 +3,16 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
|
3
3
|
import { memo, forwardRef, useState, useEffect } from "react";
|
|
4
4
|
import { DatePickerModal } from "./DatePickerModal.js";
|
|
5
5
|
import { MonthPickerModal } from "./MonthPickerModal.js";
|
|
6
|
-
import { c as cls } from "../../styles.module-
|
|
6
|
+
import { c as cls } from "../../styles.module-7wzJYhR3.js";
|
|
7
|
+
import { formatDatePart, getFullYear } from "./utils.js";
|
|
7
8
|
import { YearPickerModal } from "./YearPickerModal.js";
|
|
8
9
|
import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
|
|
9
10
|
import { formating } from "../../utils/index.js";
|
|
10
11
|
import { I as Input } from "../../Input-ChCIy5oY.js";
|
|
11
12
|
import { EInputVariant } from "../Input/constants.js";
|
|
13
|
+
const MAX_DAY = 31;
|
|
14
|
+
const MAX_MONTH = 12;
|
|
15
|
+
const DATE_LENGTH = 8;
|
|
12
16
|
const DatePicker = memo(
|
|
13
17
|
forwardRef(
|
|
14
18
|
({
|
|
@@ -24,6 +28,7 @@ const DatePicker = memo(
|
|
|
24
28
|
validateImmediately,
|
|
25
29
|
variant,
|
|
26
30
|
disabled = false,
|
|
31
|
+
editable = false,
|
|
27
32
|
...props
|
|
28
33
|
}, ref) => {
|
|
29
34
|
const [isActive, setActive] = useState(false);
|
|
@@ -32,6 +37,7 @@ const DatePicker = memo(
|
|
|
32
37
|
value && !isNaN(new Date(value).getTime()) ? new Date(value) : void 0
|
|
33
38
|
);
|
|
34
39
|
const [isError, setError] = useState(error);
|
|
40
|
+
const [inputValue, setInputValue] = useState("");
|
|
35
41
|
useEffect(() => {
|
|
36
42
|
setError(error);
|
|
37
43
|
}, [error]);
|
|
@@ -40,6 +46,13 @@ const DatePicker = memo(
|
|
|
40
46
|
value && !isNaN(new Date(value).getTime()) ? new Date(value) : void 0
|
|
41
47
|
);
|
|
42
48
|
}, [value]);
|
|
49
|
+
useEffect(() => {
|
|
50
|
+
if (date && !(typeof date === "string") && !isNaN(date == null ? void 0 : date.getTime())) {
|
|
51
|
+
setInputValue(formating.Date(date, "dd/mm/yy"));
|
|
52
|
+
} else {
|
|
53
|
+
setInputValue("");
|
|
54
|
+
}
|
|
55
|
+
}, [date]);
|
|
43
56
|
const milliseconds = value && new Date(value).getTime;
|
|
44
57
|
useEffect(() => {
|
|
45
58
|
if (validateImmediately) {
|
|
@@ -88,6 +101,28 @@ const DatePicker = memo(
|
|
|
88
101
|
onChangeValue == null ? void 0 : onChangeValue({ value: sendDate, name });
|
|
89
102
|
onBlur == null ? void 0 : onBlur(sendDate);
|
|
90
103
|
};
|
|
104
|
+
const handleInputChange = (e) => {
|
|
105
|
+
if (editable) {
|
|
106
|
+
const newValue = e.target.value.replace(/[^\d]/g, "");
|
|
107
|
+
const [day, month, year] = [
|
|
108
|
+
formatDatePart(newValue.substring(0, 2), MAX_DAY),
|
|
109
|
+
formatDatePart(newValue.substring(2, 4), MAX_MONTH),
|
|
110
|
+
newValue.substring(4, 6)
|
|
111
|
+
];
|
|
112
|
+
const formattedValue = [day, month, year].filter(Boolean).join("/");
|
|
113
|
+
setInputValue(formattedValue);
|
|
114
|
+
if (formattedValue.length === DATE_LENGTH) {
|
|
115
|
+
const fullYear = getFullYear(year);
|
|
116
|
+
const newDate = /* @__PURE__ */ new Date(
|
|
117
|
+
`${fullYear}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`
|
|
118
|
+
);
|
|
119
|
+
if (!isNaN(newDate.getTime())) {
|
|
120
|
+
setDate(newDate);
|
|
121
|
+
onChangeValue == null ? void 0 : onChangeValue({ value: newDate, name });
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
};
|
|
91
126
|
const wrapperClassNames = classNames(cls.wrapper, isActive && cls.active);
|
|
92
127
|
const InputClassNames = classNames(cls.input, cls.inputBorderControl);
|
|
93
128
|
return /* @__PURE__ */ jsxs("div", { className: wrapperClassNames, "data-disabled": disabled, children: [
|
|
@@ -95,7 +130,9 @@ const DatePicker = memo(
|
|
|
95
130
|
"div",
|
|
96
131
|
{
|
|
97
132
|
"data-error": isError,
|
|
98
|
-
className: cls["date-wrapper"],
|
|
133
|
+
className: classNames(cls["date-wrapper"], {
|
|
134
|
+
[cls.editable]: editable
|
|
135
|
+
}),
|
|
99
136
|
onClick: onOpen,
|
|
100
137
|
children: /* @__PURE__ */ jsx(
|
|
101
138
|
Input,
|
|
@@ -106,7 +143,8 @@ const DatePicker = memo(
|
|
|
106
143
|
size,
|
|
107
144
|
type: "text",
|
|
108
145
|
variant: isError ? EInputVariant.Error : variant,
|
|
109
|
-
value:
|
|
146
|
+
value: inputValue,
|
|
147
|
+
onChange: handleInputChange,
|
|
110
148
|
rightAddon: {
|
|
111
149
|
addonType: "icon",
|
|
112
150
|
addonContent: isActive ? "DropdownArrowUp24px" : "DropdownArrowDown24px"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, useState, useEffect } from "react";
|
|
3
3
|
import { week } from "./constants.js";
|
|
4
|
-
import { c as cls } from "../../styles.module-
|
|
4
|
+
import { c as cls } from "../../styles.module-7wzJYhR3.js";
|
|
5
5
|
import { Icon } from "../../icons/Icon.js";
|
|
6
6
|
import { formating } from "../../utils/index.js";
|
|
7
7
|
import { Button } from "../Button/Button.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, useState, useEffect } from "react";
|
|
3
3
|
import { months } from "./constants.js";
|
|
4
|
-
import { c as cls } from "../../styles.module-
|
|
4
|
+
import { c as cls } from "../../styles.module-7wzJYhR3.js";
|
|
5
5
|
import { Icon } from "../../icons/Icon.js";
|
|
6
6
|
import { formating } from "../../utils/index.js";
|
|
7
7
|
import { Button } from "../Button/Button.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, useState, useEffect } from "react";
|
|
3
|
-
import { c as cls } from "../../styles.module-
|
|
3
|
+
import { c as cls } from "../../styles.module-7wzJYhR3.js";
|
|
4
4
|
import { formating } from "../../utils/index.js";
|
|
5
5
|
import { Button } from "../Button/Button.js";
|
|
6
6
|
function YearPickerModal({
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
const YEAR_OFFSET = 20;
|
|
2
|
+
const CENTURY = 100;
|
|
3
|
+
const formatDatePart = (value, max) => {
|
|
4
|
+
const num = parseInt(value);
|
|
5
|
+
return num > max ? max.toString() : value;
|
|
6
|
+
};
|
|
7
|
+
const getFullYear = (year) => {
|
|
8
|
+
const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
|
|
9
|
+
const currentCentury = Math.floor(currentYear / CENTURY) * CENTURY;
|
|
10
|
+
const fullYear = parseInt(year) + currentCentury;
|
|
11
|
+
return fullYear > currentYear + YEAR_OFFSET ? fullYear - CENTURY : fullYear;
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
formatDatePart,
|
|
15
|
+
getFullYear
|
|
16
|
+
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
3
|
import { ENotificationBadgeSize } from "./constants.js";
|
|
4
|
-
import '../../assets/NotificationBadge.css';const m = "
|
|
5
|
-
const s = "
|
|
4
|
+
import '../../assets/NotificationBadge.css';const m = "_m_2ldj3_18";
|
|
5
|
+
const s = "_s_2ldj3_24";
|
|
6
6
|
const cls = {
|
|
7
|
-
"notification-badge": "_notification-
|
|
8
|
-
"notification-badge-absolute": "_notification-badge-
|
|
7
|
+
"notification-badge": "_notification-badge_2ldj3_2",
|
|
8
|
+
"notification-badge-absolute": "_notification-badge-absolute_2ldj3_14",
|
|
9
9
|
m,
|
|
10
10
|
s
|
|
11
11
|
};
|
|
@@ -54,3 +54,5 @@ export { ELabelPositions } from './Switcher';
|
|
|
54
54
|
export type { TSwitcherProps } from './Switcher';
|
|
55
55
|
export { TwinSwitcher } from './TwinSwitcher';
|
|
56
56
|
export { ESkeletonVariant, SkeletonBrick, SkeletonCircle, SkeletonText } from './Skeleton';
|
|
57
|
+
export { Avatar, EAvatarSize } from './Avatar';
|
|
58
|
+
export type { TAvatarProps, TAvatarSize } from './Avatar';
|
package/dist/components/index.js
CHANGED
|
@@ -56,15 +56,19 @@ import { SkeletonBrick } from "./Skeleton/SkeletonBrick/SkeletonBrick.js";
|
|
|
56
56
|
import { SkeletonText } from "./Skeleton/SkeletonText/SkeletonText.js";
|
|
57
57
|
import { SkeletonCircle } from "./Skeleton/SkeletonCircle/SkeletonCircle.js";
|
|
58
58
|
import { ESkeletonVariant } from "./Skeleton/constants.js";
|
|
59
|
+
import { Avatar } from "./Avatar/Avatar.js";
|
|
60
|
+
import { EAvatarSize } from "./Avatar/constants.js";
|
|
59
61
|
export {
|
|
60
62
|
Accordion,
|
|
61
63
|
AccordionItem,
|
|
64
|
+
Avatar,
|
|
62
65
|
Button,
|
|
63
66
|
CheckboxMimir,
|
|
64
67
|
Chip,
|
|
65
68
|
DatePicker,
|
|
66
69
|
Drawer,
|
|
67
70
|
EAccordionSize,
|
|
71
|
+
EAvatarSize,
|
|
68
72
|
EButtonForm,
|
|
69
73
|
EButtonSize,
|
|
70
74
|
EButtonVariantBorderless,
|
package/dist/index.js
CHANGED
|
@@ -56,6 +56,8 @@ import { SkeletonBrick } from "./components/Skeleton/SkeletonBrick/SkeletonBrick
|
|
|
56
56
|
import { SkeletonText } from "./components/Skeleton/SkeletonText/SkeletonText.js";
|
|
57
57
|
import { SkeletonCircle } from "./components/Skeleton/SkeletonCircle/SkeletonCircle.js";
|
|
58
58
|
import { ESkeletonVariant } from "./components/Skeleton/constants.js";
|
|
59
|
+
import { Avatar } from "./components/Avatar/Avatar.js";
|
|
60
|
+
import { EAvatarSize } from "./components/Avatar/constants.js";
|
|
59
61
|
import { useMediaQuery } from "./hooks/useMediaQuery/useMediaQuery.js";
|
|
60
62
|
import { EMediaQuery, EMinMediaQuery } from "./hooks/useMediaQuery/constants.js";
|
|
61
63
|
import { useLockBodyScroll } from "./hooks/useLockBodyScroll/useLockBodyScroll.js";
|
|
@@ -70,12 +72,14 @@ import { parseDate } from "./utils/formating/Date.js";
|
|
|
70
72
|
import './assets/index.css';export {
|
|
71
73
|
Accordion,
|
|
72
74
|
AccordionItem,
|
|
75
|
+
Avatar,
|
|
73
76
|
Button,
|
|
74
77
|
CheckboxMimir,
|
|
75
78
|
Chip,
|
|
76
79
|
DatePicker,
|
|
77
80
|
Drawer,
|
|
78
81
|
EAccordionSize,
|
|
82
|
+
EAvatarSize,
|
|
79
83
|
EButtonForm,
|
|
80
84
|
EButtonSize,
|
|
81
85
|
EButtonVariantBorderless,
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import './assets/styles.css';const input = "_input_1i5h3_2";
|
|
2
|
+
const inputBorderControl = "_inputBorderControl_1i5h3_14";
|
|
3
|
+
const editable = "_editable_1i5h3_27";
|
|
4
|
+
const wrapper = "_wrapper_1i5h3_50";
|
|
5
|
+
const active = "_active_1i5h3_56";
|
|
6
|
+
const button = "_button_1i5h3_44";
|
|
7
|
+
const h = "_h_1i5h3_107";
|
|
8
|
+
const b = "_b_1i5h3_44";
|
|
9
|
+
const d = "_d_1i5h3_10";
|
|
10
|
+
const m = "_m_1i5h3_128";
|
|
11
|
+
const a = "_a_1i5h3_56";
|
|
12
|
+
const prev = "_prev_1i5h3_130";
|
|
13
|
+
const orange = "_orange_1i5h3_146";
|
|
14
|
+
const current = "_current_1i5h3_171";
|
|
15
|
+
const monthGrid = "_monthGrid_1i5h3_176";
|
|
16
|
+
const cls = {
|
|
17
|
+
input,
|
|
18
|
+
"input-wrapper": "_input-wrapper_1i5h3_6",
|
|
19
|
+
"date-wrapper": "_date-wrapper_1i5h3_10",
|
|
20
|
+
inputBorderControl,
|
|
21
|
+
editable,
|
|
22
|
+
"button-wrapper": "_button-wrapper_1i5h3_44",
|
|
23
|
+
wrapper,
|
|
24
|
+
active,
|
|
25
|
+
button,
|
|
26
|
+
"field-overlow": "_field-overlow_1i5h3_78",
|
|
27
|
+
"calendar-block": "_calendar-block_1i5h3_84",
|
|
28
|
+
h,
|
|
29
|
+
b,
|
|
30
|
+
d,
|
|
31
|
+
m,
|
|
32
|
+
a,
|
|
33
|
+
prev,
|
|
34
|
+
orange,
|
|
35
|
+
current,
|
|
36
|
+
monthGrid
|
|
37
|
+
};
|
|
38
|
+
export {
|
|
39
|
+
cls as c
|
|
40
|
+
};
|
package/package.json
CHANGED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import './assets/styles.css';const input = "_input_fbbrm_2";
|
|
2
|
-
const inputBorderControl = "_inputBorderControl_fbbrm_14";
|
|
3
|
-
const wrapper = "_wrapper_fbbrm_44";
|
|
4
|
-
const active = "_active_fbbrm_50";
|
|
5
|
-
const button = "_button_fbbrm_38";
|
|
6
|
-
const h = "_h_fbbrm_101";
|
|
7
|
-
const b = "_b_fbbrm_38";
|
|
8
|
-
const d = "_d_fbbrm_10";
|
|
9
|
-
const m = "_m_fbbrm_122";
|
|
10
|
-
const a = "_a_fbbrm_50";
|
|
11
|
-
const prev = "_prev_fbbrm_124";
|
|
12
|
-
const orange = "_orange_fbbrm_140";
|
|
13
|
-
const current = "_current_fbbrm_165";
|
|
14
|
-
const monthGrid = "_monthGrid_fbbrm_170";
|
|
15
|
-
const cls = {
|
|
16
|
-
input,
|
|
17
|
-
"input-wrapper": "_input-wrapper_fbbrm_6",
|
|
18
|
-
"date-wrapper": "_date-wrapper_fbbrm_10",
|
|
19
|
-
inputBorderControl,
|
|
20
|
-
"button-wrapper": "_button-wrapper_fbbrm_38",
|
|
21
|
-
wrapper,
|
|
22
|
-
active,
|
|
23
|
-
button,
|
|
24
|
-
"field-overlow": "_field-overlow_fbbrm_72",
|
|
25
|
-
"calendar-block": "_calendar-block_fbbrm_78",
|
|
26
|
-
h,
|
|
27
|
-
b,
|
|
28
|
-
d,
|
|
29
|
-
m,
|
|
30
|
-
a,
|
|
31
|
-
prev,
|
|
32
|
-
orange,
|
|
33
|
-
current,
|
|
34
|
-
monthGrid
|
|
35
|
-
};
|
|
36
|
-
export {
|
|
37
|
-
cls as c
|
|
38
|
-
};
|