mimir-ui-kit 1.19.0 → 1.19.2
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/README.md +62 -62
- package/dist/{Input-BFFPzelg.js → Input-DdKAiGfJ.js} +51 -40
- package/dist/assets/Button.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/Link.css +1 -0
- package/dist/components/Accordion/Accordion.js +2 -2
- package/dist/components/AnchorLink/Link.d.ts +3 -0
- package/dist/components/AnchorLink/Link.js +63 -0
- package/dist/components/AnchorLink/index.d.ts +1 -1
- package/dist/components/AnchorLink/index.js +1 -1
- package/dist/components/Button/Button.js +31 -31
- package/dist/components/DatePicker/DatePicker.js +1 -1
- package/dist/components/Input/Input.d.ts +8 -0
- package/dist/components/Input/Input.js +1 -1
- package/dist/components/Input/index.js +1 -1
- package/dist/components/InputPassword/InputPassword.js +1 -1
- package/dist/components/InputPhoneNumber/InputPhoneNumber.js +1 -1
- package/dist/components/OtpInput/OtpInput.js +1 -1
- package/dist/components/RadioGroup/RadioGroup.d.ts +12 -1
- package/dist/components/RadioGroup/RadioGroup.js +9 -5
- package/dist/components/SelectSearch/SelectSearch.js +5 -3
- package/dist/components/SelectSearch/types.d.ts +3 -1
- package/dist/components/TextArea/TextArea.js +11 -4
- package/dist/components/index.js +2 -2
- package/dist/index.d.ts +1 -0
- package/dist/index.js +2 -2
- package/dist/types/index.d.ts +1 -0
- package/dist/types/propsWithAs.d.ts +16 -0
- package/package.json +1 -1
- package/dist/assets/AnchorLink.css +0 -1
- package/dist/assets/Checkbox.css +0 -0
- package/dist/components/AnchorLink/AnchorLink.d.ts +0 -13
- package/dist/components/AnchorLink/AnchorLink.js +0 -69
- package/dist/components/Checkbox/Checkbox.d.ts +0 -23
- package/dist/components/Checkbox/Checkbox.js +0 -24
- package/dist/components/Checkbox/constants.d.ts +0 -0
- package/dist/components/Checkbox/index.d.ts +0 -1
- package/dist/components/Checkbox/index.js +0 -4
- package/dist/components/Checkbox/types.d.ts +0 -0
- /package/dist/{components/Checkbox/constants.js → types/index.js} +0 -0
- /package/dist/{components/Checkbox/types.js → types/propsWithAs.js} +0 -0
package/README.md
CHANGED
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
# Mimir-ui
|
|
2
|
-
|
|
3
|
-
## Установка и запуск проекта
|
|
4
|
-
|
|
5
|
-
1. Установите зависимости:
|
|
6
|
-
```bash
|
|
7
|
-
npm install
|
|
8
|
-
```
|
|
9
|
-
2. Запуск storybook
|
|
10
|
-
```bash
|
|
11
|
-
npm run storybook
|
|
12
|
-
```
|
|
13
|
-
|
|
14
|
-
## Сборка проекта
|
|
15
|
-
|
|
16
|
-
1. Скрипт для сборки
|
|
17
|
-
```bash
|
|
18
|
-
npm run build
|
|
19
|
-
```
|
|
20
|
-
|
|
21
|
-
## Создание нового компонента
|
|
22
|
-
|
|
23
|
-
```bash
|
|
24
|
-
npm run create-component <ComponentName>
|
|
25
|
-
```
|
|
26
|
-
|
|
27
|
-
## Поднятие версии для публикации на npm
|
|
28
|
-
|
|
29
|
-
Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
|
|
30
|
-
|
|
31
|
-
1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
|
|
32
|
-
|
|
33
|
-
```bash
|
|
34
|
-
npm version patch
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
|
|
38
|
-
```bash
|
|
39
|
-
npm version minor
|
|
40
|
-
```
|
|
41
|
-
3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
|
|
42
|
-
```bash
|
|
43
|
-
npm version major
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
## Публикация на npm
|
|
47
|
-
|
|
48
|
-
1. Скрипт для публикации на npm:
|
|
49
|
-
```bash
|
|
50
|
-
npm publish
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
## Ручная Генерация иконок
|
|
54
|
-
|
|
55
|
-
1. Экспортируем с фигмы иконку.
|
|
56
|
-
2. Добавляем ее в папку svgs.
|
|
57
|
-
3. Запускаем скрипт:
|
|
58
|
-
```bash
|
|
59
|
-
npm run icons
|
|
60
|
-
```
|
|
61
|
-
4. Смотрим в папку `icons/components`
|
|
62
|
-
5. Готово.
|
|
1
|
+
# Mimir-ui
|
|
2
|
+
|
|
3
|
+
## Установка и запуск проекта
|
|
4
|
+
|
|
5
|
+
1. Установите зависимости:
|
|
6
|
+
```bash
|
|
7
|
+
npm install
|
|
8
|
+
```
|
|
9
|
+
2. Запуск storybook
|
|
10
|
+
```bash
|
|
11
|
+
npm run storybook
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Сборка проекта
|
|
15
|
+
|
|
16
|
+
1. Скрипт для сборки
|
|
17
|
+
```bash
|
|
18
|
+
npm run build
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Создание нового компонента
|
|
22
|
+
|
|
23
|
+
```bash
|
|
24
|
+
npm run create-component <ComponentName>
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
## Поднятие версии для публикации на npm
|
|
28
|
+
|
|
29
|
+
Для поднятия версии пакета перед публикацией на npm используем следующие скрипты:
|
|
30
|
+
|
|
31
|
+
1. `patch`: Этот скрипт увеличивает версию пакета на один патч (например, с версии 1.0.0 до 1.0.1). Он автоматически обновляет версию в файле package.json и создает коммит с обновленной версией.
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
npm version patch
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
2. `minor`: Этот скрипт увеличивает версию пакета на один минорный уровень (например, с версии 1.0.0 до 1.1.0). Также обновляет версию в package.json и создает коммит.
|
|
38
|
+
```bash
|
|
39
|
+
npm version minor
|
|
40
|
+
```
|
|
41
|
+
3. `major`: Этот скрипт увеличивает версию пакета на один мажорный уровень (например, с версии 1.0.0 до 2.0.0). Он также обновляет версию в package.json и создает коммит.
|
|
42
|
+
```bash
|
|
43
|
+
npm version major
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
## Публикация на npm
|
|
47
|
+
|
|
48
|
+
1. Скрипт для публикации на npm:
|
|
49
|
+
```bash
|
|
50
|
+
npm publish
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## Ручная Генерация иконок
|
|
54
|
+
|
|
55
|
+
1. Экспортируем с фигмы иконку.
|
|
56
|
+
2. Добавляем ее в папку svgs.
|
|
57
|
+
3. Запускаем скрипт:
|
|
58
|
+
```bash
|
|
59
|
+
npm run icons
|
|
60
|
+
```
|
|
61
|
+
4. Смотрим в папку `icons/components`
|
|
62
|
+
5. Готово.
|
|
@@ -5,39 +5,39 @@ import { EInputVariant } from "./components/Input/constants.js";
|
|
|
5
5
|
import { useMergeRefs } from "./hooks/useMergeRefs/useMergeRefs.js";
|
|
6
6
|
import { Icon } from "./icons/Icon.js";
|
|
7
7
|
import { Button } from "./components/Button/Button.js";
|
|
8
|
-
import './assets/Input.css';const label = "
|
|
9
|
-
const input = "
|
|
10
|
-
const focused = "
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
const
|
|
18
|
-
const
|
|
8
|
+
import './assets/Input.css';const label = "_label_1oj7p_16";
|
|
9
|
+
const input = "_input_1oj7p_3";
|
|
10
|
+
const focused = "_focused_1oj7p_65";
|
|
11
|
+
const disabled = "_disabled_1oj7p_71";
|
|
12
|
+
const clear = "_clear_1oj7p_104";
|
|
13
|
+
const s = "_s_1oj7p_152";
|
|
14
|
+
const m = "_m_1oj7p_167";
|
|
15
|
+
const l = "_l_1oj7p_16";
|
|
16
|
+
const success = "_success_1oj7p_224";
|
|
17
|
+
const alarm = "_alarm_1oj7p_242";
|
|
18
|
+
const error = "_error_1oj7p_260";
|
|
19
19
|
const cls = {
|
|
20
|
-
"input-wrapper": "_input-
|
|
20
|
+
"input-wrapper": "_input-wrapper_1oj7p_3",
|
|
21
21
|
label,
|
|
22
|
-
"has-left-slot": "_has-left-
|
|
23
|
-
"active-label": "_active-
|
|
22
|
+
"has-left-slot": "_has-left-slot_1oj7p_29",
|
|
23
|
+
"active-label": "_active-label_1oj7p_32",
|
|
24
24
|
input,
|
|
25
|
-
"has-right-slot": "_has-right-
|
|
25
|
+
"has-right-slot": "_has-right-slot_1oj7p_62",
|
|
26
26
|
focused,
|
|
27
|
-
"has-label": "_has-
|
|
28
|
-
|
|
29
|
-
"
|
|
30
|
-
"
|
|
27
|
+
"has-label": "_has-label_1oj7p_68",
|
|
28
|
+
disabled,
|
|
29
|
+
"left-slot": "_left-slot_1oj7p_77",
|
|
30
|
+
"right-slot": "_right-slot_1oj7p_78",
|
|
31
|
+
"addon-icon": "_addon-icon_1oj7p_100",
|
|
31
32
|
clear,
|
|
32
33
|
s,
|
|
33
34
|
m,
|
|
34
35
|
l,
|
|
35
|
-
"default-gray": "_default-
|
|
36
|
-
"default-white": "_default-
|
|
36
|
+
"default-gray": "_default-gray_1oj7p_197",
|
|
37
|
+
"default-white": "_default-white_1oj7p_209",
|
|
37
38
|
success,
|
|
38
39
|
alarm,
|
|
39
|
-
error
|
|
40
|
-
disabled
|
|
40
|
+
error
|
|
41
41
|
};
|
|
42
42
|
const renderAddon = (addon) => {
|
|
43
43
|
var _a, _b;
|
|
@@ -87,15 +87,17 @@ const Input = memo(
|
|
|
87
87
|
label: label2,
|
|
88
88
|
withClearButton,
|
|
89
89
|
disabled: disabled2,
|
|
90
|
+
onChange,
|
|
90
91
|
rightAddon,
|
|
91
92
|
leftAddon,
|
|
92
93
|
size = "m",
|
|
94
|
+
numbersOnly,
|
|
95
|
+
maxLength,
|
|
93
96
|
...otherProps
|
|
94
97
|
} = props;
|
|
95
98
|
const [isFocused, setIsFocused] = useState(autofocus);
|
|
96
99
|
const [withValue, setWithValue] = useState(!!value);
|
|
97
100
|
const inputRef = useRef(null);
|
|
98
|
-
const leftAddonRef = useRef(null);
|
|
99
101
|
const mergedInputRef = useMergeRefs(inputRef, ref);
|
|
100
102
|
useEffect(() => {
|
|
101
103
|
if (autofocus) {
|
|
@@ -122,13 +124,22 @@ const Input = memo(
|
|
|
122
124
|
inputRef.current.value = "";
|
|
123
125
|
inputRef.current.focus();
|
|
124
126
|
setWithValue(false);
|
|
127
|
+
onChange == null ? void 0 : onChange({
|
|
128
|
+
target: { value: "" }
|
|
129
|
+
});
|
|
125
130
|
}
|
|
126
131
|
};
|
|
127
132
|
const handleChange = (event) => {
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
133
|
+
let newValue = event.target.value;
|
|
134
|
+
if (numbersOnly) {
|
|
135
|
+
newValue = newValue.replace(/\D/g, "");
|
|
136
|
+
}
|
|
137
|
+
if (maxLength !== void 0) {
|
|
138
|
+
newValue = newValue.slice(0, maxLength);
|
|
139
|
+
}
|
|
140
|
+
event.target.value = newValue;
|
|
141
|
+
onChange == null ? void 0 : onChange(event);
|
|
142
|
+
setWithValue(!!newValue);
|
|
132
143
|
};
|
|
133
144
|
const currentLeftAddon = renderAddon(leftAddon);
|
|
134
145
|
const currentRightAddon = renderAddon(rightAddon);
|
|
@@ -140,16 +151,11 @@ const Input = memo(
|
|
|
140
151
|
[cls["has-left-slot"]]: !!currentLeftAddon,
|
|
141
152
|
[cls["has-right-slot"]]: !!currentRightAddon
|
|
142
153
|
};
|
|
143
|
-
const labelClassNames = classNames(
|
|
144
|
-
cls
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
[cls["has-left-slot"]]: !!currentLeftAddon
|
|
149
|
-
},
|
|
150
|
-
className,
|
|
151
|
-
cls[size]
|
|
152
|
-
);
|
|
154
|
+
const labelClassNames = classNames(cls.label, className, cls[size], {
|
|
155
|
+
[cls["active-label"]]: isFocused || value,
|
|
156
|
+
[cls.disabled]: disabled2 || readonly,
|
|
157
|
+
[cls["has-left-slot"]]: !!currentLeftAddon
|
|
158
|
+
});
|
|
153
159
|
const inputClassNames = classNames(cls.input, mods, className, [
|
|
154
160
|
cls[variant],
|
|
155
161
|
cls[size]
|
|
@@ -161,7 +167,10 @@ const Input = memo(
|
|
|
161
167
|
cls["input-wrapper"],
|
|
162
168
|
cls[variant],
|
|
163
169
|
cls[size],
|
|
164
|
-
{
|
|
170
|
+
{
|
|
171
|
+
[cls.disabled]: disabled2 || readonly,
|
|
172
|
+
[cls.focused]: isFocused || withValue
|
|
173
|
+
},
|
|
165
174
|
wrapperClassName
|
|
166
175
|
),
|
|
167
176
|
children: [
|
|
@@ -169,7 +178,6 @@ const Input = memo(
|
|
|
169
178
|
currentLeftAddon && /* @__PURE__ */ jsx(
|
|
170
179
|
"span",
|
|
171
180
|
{
|
|
172
|
-
ref: leftAddonRef,
|
|
173
181
|
className: classNames(cls["left-slot"], {
|
|
174
182
|
[cls.focused]: isFocused,
|
|
175
183
|
[cls["has-label"]]: !!label2
|
|
@@ -189,6 +197,8 @@ const Input = memo(
|
|
|
189
197
|
readOnly: readonly,
|
|
190
198
|
value,
|
|
191
199
|
onChange: handleChange,
|
|
200
|
+
maxLength,
|
|
201
|
+
disabled: disabled2,
|
|
192
202
|
...otherProps
|
|
193
203
|
}
|
|
194
204
|
),
|
|
@@ -211,6 +221,7 @@ const Input = memo(
|
|
|
211
221
|
iconName: "Close16px",
|
|
212
222
|
size: "m-s",
|
|
213
223
|
clear: true,
|
|
224
|
+
disabled: disabled2 || readonly,
|
|
214
225
|
variant: "secondary-gray",
|
|
215
226
|
onClick: handleClear
|
|
216
227
|
}
|
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._button_18bdh_2{--button-cursor: pointer;display:inline-flex;flex-shrink:0;align-items:center;box-sizing:border-box;max-width:100%;height:var(--button-height);padding:0 var(--button-space);overflow:hidden;color:var(--button-color);font-weight:var(--font-weight-text-semibold);font-size:var(--button-font-size);font-family:var(--font-inter);line-height:var(--line-height-text-s1);white-space:nowrap;text-transform:uppercase;-webkit-text-decoration:none;text-decoration:none;text-overflow:ellipsis;-moz-column-gap:var(--button-gap);column-gap:var(--button-gap);background:var(--button-bg-color);border:none;border-color:var(--border-color);cursor:pointer;cursor:var(--button-cursor);transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}._button_18bdh_2:hover{color:var(--button-color-hover);background:var(--button-bg-color-hover);border-color:var(--border-color-hover)}._button_18bdh_2:active{color:var(--button-color-active);background:var(--button-bg-color-active);border-color:var(--border-color-active)}._button_18bdh_2:focus{box-shadow:0 0 2px var(--sapphire-normal)}._button_18bdh_2._clear_18bdh_42:focus{box-shadow:none}._button_18bdh_2 svg{color:currentcolor;fill:currentcolor}._button_18bdh_2 svg path{color:currentcolor;fill:currentcolor}._default-button_18bdh_54._primary-sapphire_18bdh_54{--button-bg-color: var(--sapphire-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--sapphire-active);--button-bg-color-hover: var(--sapphire-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_18bdh_54._primary-citrine_18bdh_63{--button-bg-color: var(--citrine-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--citrine-active);--button-bg-color-hover: var(--citrine-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_18bdh_54._secondary-asphalt_18bdh_72{--button-bg-color: var(--asphalt-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--asphalt-active);--button-bg-color-hover: var(--asphalt-hover);--button-color: var(--light-text);--button-border: transparent}._default-button_18bdh_54._secondary-gray_18bdh_81{--button-bg-color: var(--gray-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--gray-active);--button-bg-color-hover: var(--gray-hover);--button-color: var(--dark-text);--button-border: transparent}._default-button_18bdh_54._secondary-white_18bdh_90{--button-bg-color: var(--white-normal);--button-color-hover: var(--counter-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--white-active);--button-bg-color-hover: var(--white);--button-color: var(--dark-text);--button-border: transparent}._default-button_18bdh_54._secondary-red_18bdh_99{--button-bg-color: var(--red-normal);--button-color-hover: var(--light-text);--button-color-active: var(--light-text);--button-bg-color-active: var(--red-active);--button-bg-color-hover: var(--red-hover);--button-color: var(--light-text);--button-border: transparent}._round-button_18bdh_109{--button-border-radius-l: 24px;--button-border-radius-m: 20px;--button-border-radius-s: 16px;--button-border-radius-xs: 12px;--button-space-l: var(--space-s);--button-space-m: var(--space-xs);--button-space-s: var(--space-xs);--button-space-xs: var(--space-2xs);border-radius:var(--button-border-radius)}._round-button_18bdh_109._black_18bdh_120{--button-bg-color: var(--asphalt-normal);--button-bg-color-hover: var(--asphalt-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--light-text);--button-color-hover: var(--light-text);--button-color-active: var(--light-text)}._round-button_18bdh_109._gray_18bdh_129{--button-bg-color: var(--gray-normal);--button-bg-color-hover: var(--gray-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._round-button_18bdh_109._white_18bdh_138{--button-bg-color: var(--white-normal);--button-bg-color-hover: var(--white-hover);--button-bg-color-active: var(--sapphire-normal);--button-bg-color-focus: var(--sapphire-normal);--button-color: var(--asphalt-normal);--button-color-hover: var(--asphalt-hover);--button-color-active: var(--light-text)}._outline-button_18bdh_148{--button-bg-color: transparent;--button-bg-color-hover: transparent;--button-bg-color-active: transparent;--button-bg-color-focus: transparent;border:1px solid var(--border-color)}._outline-button_18bdh_148._outline-asphalt_18bdh_155{--border-color: var(--disabled-color);--button-color: var(--black-80);--border-color-hover: var(--black-80);--button-color-hover: var(--black-80);--border-color-active: var(--black-100);--button-color-active: var(--black-100)}._outline-button_18bdh_148._outline-gray_18bdh_163{--border-color: var(--black-5);--button-color: var(--black-5);--border-color-hover: var(--black-5);--button-color-hover: var(--counter-text);--border-color-active: var(--black-80);--button-color-active: var(--white);--button-bg-color-active: var(--black-80)}._outline-button_18bdh_148._outline-white_18bdh_172{--border-color: var(--white);--button-color: var(--white);--border-color-hover: var(--white);--button-color-hover: var(--counter-text);--border-color-active: var(--black-80);--button-color-active: var(--white);--button-bg-color-active: var(--black-80)}._outline-button_18bdh_148._outline-red_18bdh_181{--border-color: var(--error-normal);--button-color: var(--error-normal);--border-color-hover: var(--red-hover);--button-color-hover: var(--red-hover);--border-color-active: var(--red-active);--button-color-active: var(--white);--button-bg-color-active: var(--red-active)}._default-button_18bdh_54,._outline-button_18bdh_148{--button-space-xxl: var(--control-space-xxl);--button-space-xl: var(--control-space-l);--button-space-l: var(--space-m);--button-space-m: var(--space-m);--button-space-s: var(--space-xs);--button-space-xs: var(--space-2xs);--button-border-radius-xxl: var(--control-radius-s);--button-border-radius-xl: var(--control-radius-s);--button-border-radius-l: var(--control-radius);--button-border-radius-m: var(--control-radius);--button-border-radius-s: var(--control-radius-xs);--button-border-radius-xs: var(--control-radius-xs);border-radius:var(--button-border-radius)}._xs_18bdh_208{--button-height: var(--button-height-xs);--button-font-size: var(--control-text-size-xs);--button-space: var(--button-space-xs);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._m-s_18bdh_216{--button-height: var(--button-height-ms);--button-border-radius: var(--button-border-radius-s);font-weight:var(--font-weight-text-regular);--button-gap: var(--space-2xs);--button-font-size: var(--size-text-s)}._s_18bdh_72{--button-height: var(--button-height-s);--button-font-size: var(--control-text-size-s);--button-space: var(--button-space-s);--button-gap: 4px;--button-border-radius: var(--button-border-radius-s)}._m_18bdh_216{--button-height: var(--button-height-m);--button-font-size: var(--size-text-m);--button-space: var(--button-space-m);--button-gap: 8px;--button-border-radius: var(--button-border-radius-m)}._l_18bdh_240{--button-height: var(--button-height-l);--button-font-size: var(--size-text-m);--button-space: var(--button-space-l);--button-gap: 8px;--button-border-radius: var(--button-border-radius-l)}._xl_18bdh_248{--button-height: var(--button-height-xl);--button-space: var(--button-space-xl);--button-gap: 8px;--button-border-radius: var(--button-border-radius-xl);--button-font-size: var(--size-text-m);font-weight:var(--font-weight-text-medium)}._xxl_18bdh_257{--button-height: var(--button-height-xxl);--button-space: var(--button-space-xxl);--button-border-radius: var(--button-border-radius-xxl);--button-gap: 8px;font-weight:var(--font-weight-text-medium);--button-font-size: var(--size-text-m)}._full_18bdh_266{display:flex;justify-content:center;width:100%}._disabled_18bdh_272{--button-cursor: not-allowed;color:var(--light-text);background-color:var(--disabled)}._disabled_18bdh_272:hover,._disabled_18bdh_272:active,._disabled_18bdh_272:focus{color:var(--light-text);background-color:var(--disabled);box-shadow:none}._disabled_18bdh_272._outline-button_18bdh_148{color:var(--disabled);background-color:transparent;border:1px solid var(--disabled)}._icon-button_18bdh_288{justify-content:center;min-width:var(--button-height);padding:0}
|
package/dist/assets/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._input-
|
|
1
|
+
._input-wrapper_1oj7p_3{--input-border-radius-l: 8px;--input-border-radius-m: 6px;--input-border-radius-s: 6px;position:relative;display:flex;padding:0 var(--space-m);overflow:hidden;background-color:var(--input-bg-color);border-bottom:1px solid transparent;border-radius:var(--input-border-radius);transition:background-color .2s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease}._input-wrapper_1oj7p_3 ._label_1oj7p_16{position:absolute;top:calc(var(--input-height) / 2 - var(--input-font-size) / 2);left:var(--space-m);z-index:1;display:block;color:var(--label-color);font-size:var(--input-font-size);white-space:nowrap;transform-origin:left center;transition:transform .15s ease-out,left .15s ease-out,color .15s ease-out;pointer-events:none}._input-wrapper_1oj7p_3 ._label_1oj7p_16._has-left-slot_1oj7p_29{left:calc(var(--space-m) + var(--icon-size) + var(--clear-button-mg))}._input-wrapper_1oj7p_3 ._label_1oj7p_16._active-label_1oj7p_32{transform:scale(var(--label-scaled)) translateY(calc(var(--input-font-size) * -1))}._input-wrapper_1oj7p_3 ._label_1oj7p_16._active-label_1oj7p_32._has-left-slot_1oj7p_29{left:calc(var(--space-m) + var(--icon-size) + var(--space-s));transform:scale(var(--label-scaled)) translate(calc((var(--space-m) + var(--left-addon-position)) * 2 * -1),calc(var(--input-font-size) * -1))}._input-wrapper_1oj7p_3 ._input_1oj7p_3{position:relative;display:block;flex:1;width:100%;min-width:0;height:var(--input-height);color:var(--dark-text);font-size:var(--input-font-size);font-family:var(--font-inter);line-height:var(--input-line-height);letter-spacing:-.42px;background-color:inherit;border-radius:var(--input-border-radius);outline:none;cursor:var(--input-cursor);transition:border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-feature-settings:"zero"}._input-wrapper_1oj7p_3 ._input_1oj7p_3._has-left-slot_1oj7p_29{padding-left:0}._input-wrapper_1oj7p_3 ._input_1oj7p_3._has-right-slot_1oj7p_62{padding-right:0}._input-wrapper_1oj7p_3 ._input_1oj7p_3._focused_1oj7p_65{padding-top:0}._input-wrapper_1oj7p_3 ._input_1oj7p_3._has-label_1oj7p_68{padding-top:var(--input-padding-position)}._input-wrapper_1oj7p_3 ._input_1oj7p_3._disabled_1oj7p_71{color:var(--light-text)}._input-wrapper_1oj7p_3 ._input_1oj7p_3._disabled_1oj7p_71:hover,._input-wrapper_1oj7p_3 ._input_1oj7p_3._disabled_1oj7p_71:active,._input-wrapper_1oj7p_3 ._input_1oj7p_3._disabled_1oj7p_71:focus{color:var(--light-text)}._input-wrapper_1oj7p_3 ._left-slot_1oj7p_77,._input-wrapper_1oj7p_3 ._right-slot_1oj7p_78{display:flex;align-items:center;height:var(--input-height);color:var(--black-60);font-size:var(--input-font-size);font-family:var(--font-inter);line-height:var(--input-line-height);background-color:inherit;transition:padding-top .15s ease-out}._input-wrapper_1oj7p_3 ._left-slot_1oj7p_77._focused_1oj7p_65._has-label_1oj7p_68,._input-wrapper_1oj7p_3 ._right-slot_1oj7p_78._focused_1oj7p_65._has-label_1oj7p_68{padding-top:var(--input-padding-position)}._input-wrapper_1oj7p_3 ._left-slot_1oj7p_77{justify-content:flex-end;margin-right:var(--clear-button-mg)}._input-wrapper_1oj7p_3 ._right-slot_1oj7p_78{margin-left:var(--clear-button-mg)}._input-wrapper_1oj7p_3 ._addon-icon_1oj7p_100{width:var(--icon-size);height:var(--icon-size)}._input-wrapper_1oj7p_3 ._clear_1oj7p_104{align-self:center;width:16px;height:16px;margin-left:var(--clear-button-mg)}._input-wrapper_1oj7p_3 svg{color:currentcolor;fill:currentcolor}._input-wrapper_1oj7p_3:hover ._label_1oj7p_16,._input-wrapper_1oj7p_3:focus-within ._label_1oj7p_16{color:var(--label-color)}._input-wrapper_1oj7p_3:hover{background-color:var(--input-bg-color-hover)}._input-wrapper_1oj7p_3:focus-within{background-color:var(--input-bg-color-active);border-bottom:1px solid var(--input-bottom-color-active)}._input-wrapper_1oj7p_3._focused_1oj7p_65{color:var(--input-color-active);background-color:var(--input-bg-color-active)}._input-wrapper_1oj7p_3._focused_1oj7p_65:hover{background-color:var(--input-bg-color-hover)}._input-wrapper_1oj7p_3._disabled_1oj7p_71{--input-cursor: not-allowed;--label-color: var(--light-text);color:var(--light-text);background-color:var(--black-20);border-bottom:1px solid transparent}._input-wrapper_1oj7p_3._disabled_1oj7p_71:hover,._input-wrapper_1oj7p_3._disabled_1oj7p_71:active,._input-wrapper_1oj7p_3._disabled_1oj7p_71:focus{--label-color: var(--light-text);color:var(--light-text);background-color:var(--black-20);border-bottom:1px solid transparent;box-shadow:none}._input-wrapper_1oj7p_3._disabled_1oj7p_71::-moz-placeholder{color:var(--light-text)}._input-wrapper_1oj7p_3._disabled_1oj7p_71::placeholder{color:var(--light-text)}._input-wrapper_1oj7p_3._disabled_1oj7p_71:hover::-moz-placeholder{color:var(--light-text)}._input-wrapper_1oj7p_3._disabled_1oj7p_71:hover::placeholder{color:var(--light-text)}._s_1oj7p_152{--input-height: var(--space-xxl);--input-font-size: var(--control-text-size-m);--input-line-height: var(--line-height-text-xs);--input-padding: var(--space-m);--input-padding-position: var(--space-1xs);--input-border-radius: var(--input-border-radius-s);--label-font-size: var(--size-text-xs);--label-scaled: .85;--label-spacing: var(--space-1xs);--clear-button-mg: var(--space-2xs);--icon-size: 16px;--left-addon-position: 0px}._m_1oj7p_167{--input-height: var(--space-4xl);--input-font-size: var(--control-text-size-l);--input-line-height: var(--line-height-text-s1);--input-padding: var(--space-m);--input-padding-position: var(--space-xs);--input-border-radius: var(--input-border-radius-m);--label-font-size: var(--size-text-s);--label-scaled: .75;--label-spacing: var(--space-xs);--clear-button-mg: var(--space-2xs);--icon-size: 16px;--left-addon-position: var(--space-3xs)}._l_1oj7p_16{--input-height: var(--space-4xxl);--input-font-size: var(--control-text-size-2xl);--input-line-height: var(--line-height-text-l);--input-padding: var(--space-m);--input-padding-position: var(--space-s);--input-border-radius: var(--input-border-radius-l);--label-font-size: var(--size-text-s);--label-scaled: .6;--label-spacing: var(--space-s);--clear-button-mg: var(--space-xs);--icon-size: 24px;--left-addon-position: var(--space-s)}._default-gray_1oj7p_197{--input-bg-color: var(--black-5);--input-bg-color-active: var(--black-10);--input-bg-color-hover: var(--black-10);--input-color: var(--dark-text);--input-color-hover: var(--dark-text);--input-color-active: var(--dark-text);--input-border: transparent;--input-bottom-color-active: var(--citrine-normal);--label-color: var(--black-60)}._default-white_1oj7p_209{--input-bg-color: var(--white);--input-bg-color-hover: var(--black-10);--input-bg-color-active: var(--white);--input-color: var(--dark-text);--input-color-hover: var(--dark-text);--input-color-active: var(--dark-text);--input-border: transparent;--input-bottom-color-active: var(--citrine-normal);--label-color: var(--black-60)}._default-white_1oj7p_209:hover{--label-color: var(--dark-text)}._success_1oj7p_224{--input-bg-color: var(--success-normal);--input-bg-color-hover: var(--success-bg-hover);--input-bg-color-active: var(--success-bg-active);--input-color: var(--dark-text);--input-color-hover: var(--dark-text);--input-color-active: var(--dark-text);--input-border: transparent;--input-bottom-color-active: var(--success-normal);--label-color: var(--black-60)}._success_1oj7p_224::-moz-placeholder{color:var(--input-color)}._success_1oj7p_224::placeholder{color:var(--input-color)}._success_1oj7p_224:hover::-moz-placeholder{color:var(--input-color)}._success_1oj7p_224:hover::placeholder{color:var(--input-color)}._alarm_1oj7p_242{--input-bg-color: var(--alarm-normal);--input-bg-color-hover: var(--alarm-bg-hover);--input-bg-color-active: var(--alarm-bg-active);--input-color: var(--dark-text);--input-color-hover: var(--dark-text);--input-color-active: var(--dark-text);--input-border: transparent;--input-bottom-color-active: var(--alarm-normal);--label-color: var(--black-60)}._alarm_1oj7p_242::-moz-placeholder{color:var(--input-color)}._alarm_1oj7p_242::placeholder{color:var(--input-color)}._alarm_1oj7p_242:hover::-moz-placeholder{color:var(--input-color)}._alarm_1oj7p_242:hover::placeholder{color:var(--input-color)}._error_1oj7p_260{--input-bg-color: var(--error-normal);--input-bg-color-hover: var(--error-bg-hover);--input-bg-color-active: var(--error-bg-active);--input-color: var(--dark-text);--input-color-hover: var(--dark-text);--input-color-active: var(--dark-text);--input-border: transparent;--input-bottom-color-active: var(--error-normal);--label-color: var(--black-60)}._error_1oj7p_260::-moz-placeholder{color:var(--input-color)}._error_1oj7p_260::placeholder{color:var(--input-color)}._error_1oj7p_260:hover::-moz-placeholder{color:var(--input-color)}._error_1oj7p_260:hover::placeholder{color:var(--input-color)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._link_q5qzz_2{--link-color: var(--dark-text);display:inline-flex;align-items:center;color:var(--link-color);font-size:var(--link-font-size);font-family:var(--font-inter);line-height:var(--link-line-height);-moz-column-gap:var(--link-gap);column-gap:var(--link-gap);cursor:pointer;transition:all .15s ease}._link_q5qzz_2:hover{--link-color: var(--sapphire-hover)}._link_q5qzz_2:active{--link-color: var(--sapphire-active)}._link_q5qzz_2._sample_q5qzz_20:hover{-webkit-text-decoration:underline var(--link-color);text-decoration:underline var(--link-color);text-underline-offset:4px}._link_q5qzz_2._anchor_q5qzz_24{-webkit-text-decoration:underline dashed var(--link-color);text-decoration:underline dashed var(--link-color);text-underline-offset:4px}._link_q5qzz_2._disabled_q5qzz_28,._link_q5qzz_2._disabled_q5qzz_28:hover,._link_q5qzz_2._disabled_q5qzz_28:active{--link-color: var(--disabled);-webkit-text-decoration:none;text-decoration:none;cursor:not-allowed}._link_q5qzz_2 ._icon_q5qzz_38{color:currentcolor;fill:currentcolor}._link_q5qzz_2 ._icon_q5qzz_38 path{color:currentcolor;fill:currentcolor}._xs_q5qzz_47{--link-font-size: var(--size-text-s);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._s_q5qzz_20{--link-font-size: var(--size-text-m);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._m_q5qzz_59{--link-font-size: var(--size-text-l);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._l_q5qzz_2{--link-font-size: var(--size-text-l2);--link-line-height: var(--size-text-s);--link-gap: var(--space-xs)}
|
|
@@ -6,7 +6,7 @@ import { EAccordionButtonType, EAccordionSize, EAccordionButtonStyle, EAccordion
|
|
|
6
6
|
import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
|
|
7
7
|
import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
|
|
8
8
|
import { Icon } from "../../icons/Icon.js";
|
|
9
|
-
import { Link } from "../AnchorLink/
|
|
9
|
+
import { Link } from "../AnchorLink/Link.js";
|
|
10
10
|
import { M as M$1, W, y, T, o, a as u$1, H as H$1, I, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D, u as u$3, c as o$1 } from "../../keyboard-B256ZoM-.js";
|
|
11
11
|
import { w } from "../../use-active-press-B6yeSopF.js";
|
|
12
12
|
import { T as T$1 } from "../../use-resolve-button-type-B6LE6gU3.js";
|
|
@@ -220,7 +220,7 @@ const Accordion = forwardRef(
|
|
|
220
220
|
Ce,
|
|
221
221
|
{
|
|
222
222
|
as: isLink ? Fragment : EAccordionButtonType.BUTTON,
|
|
223
|
-
className:
|
|
223
|
+
className: classNames({ [cls.header]: !isLink }),
|
|
224
224
|
children: renderButton(open2)
|
|
225
225
|
}
|
|
226
226
|
),
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
+
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { ELinkSize, ELinkVariant } from "./constants.js";
|
|
5
|
+
import { Icon } from "../../icons/Icon.js";
|
|
6
|
+
import '../../assets/Link.css';const link = "_link_q5qzz_2";
|
|
7
|
+
const sample = "_sample_q5qzz_20";
|
|
8
|
+
const anchor = "_anchor_q5qzz_24";
|
|
9
|
+
const disabled = "_disabled_q5qzz_28";
|
|
10
|
+
const icon = "_icon_q5qzz_38";
|
|
11
|
+
const xs = "_xs_q5qzz_47";
|
|
12
|
+
const s = "_s_q5qzz_20";
|
|
13
|
+
const m = "_m_q5qzz_59";
|
|
14
|
+
const l = "_l_q5qzz_2";
|
|
15
|
+
const cls = {
|
|
16
|
+
link,
|
|
17
|
+
sample,
|
|
18
|
+
anchor,
|
|
19
|
+
disabled,
|
|
20
|
+
icon,
|
|
21
|
+
xs,
|
|
22
|
+
s,
|
|
23
|
+
m,
|
|
24
|
+
l
|
|
25
|
+
};
|
|
26
|
+
const Link = forwardRef(
|
|
27
|
+
(props, ref) => {
|
|
28
|
+
const {
|
|
29
|
+
as: Component = "button",
|
|
30
|
+
disabled: disabled2,
|
|
31
|
+
leftIcon,
|
|
32
|
+
children,
|
|
33
|
+
rightIcon,
|
|
34
|
+
className,
|
|
35
|
+
size = ELinkSize.L,
|
|
36
|
+
variant = ELinkVariant.ANCHOR,
|
|
37
|
+
...otherProps
|
|
38
|
+
} = props;
|
|
39
|
+
const classes = classNames(cls.link, className, cls[variant], cls[size], {
|
|
40
|
+
[cls.disabled]: disabled2
|
|
41
|
+
});
|
|
42
|
+
return /* @__PURE__ */ jsxs(Component, { ref, className: classes, ...otherProps, children: [
|
|
43
|
+
leftIcon && /* @__PURE__ */ jsx(
|
|
44
|
+
Icon,
|
|
45
|
+
{
|
|
46
|
+
...leftIcon,
|
|
47
|
+
className: classNames(cls.icon, leftIcon.className)
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
children,
|
|
51
|
+
rightIcon && /* @__PURE__ */ jsx(
|
|
52
|
+
Icon,
|
|
53
|
+
{
|
|
54
|
+
...rightIcon,
|
|
55
|
+
className: classNames(cls.icon, rightIcon.className)
|
|
56
|
+
}
|
|
57
|
+
)
|
|
58
|
+
] });
|
|
59
|
+
}
|
|
60
|
+
);
|
|
61
|
+
export {
|
|
62
|
+
Link
|
|
63
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { Link } from './
|
|
1
|
+
export { Link } from './Link';
|
|
2
2
|
export { ELinkSize, ELinkVariant } from './constants';
|
|
@@ -3,48 +3,48 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
|
3
3
|
import { forwardRef } from "react";
|
|
4
4
|
import { EButtonVariantDefault, EButtonForm } from "./constants.js";
|
|
5
5
|
import { Icon } from "../../icons/Icon.js";
|
|
6
|
-
import '../../assets/Button.css';const button = "
|
|
7
|
-
const clear = "
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
const
|
|
16
|
-
const
|
|
17
|
-
const full = "
|
|
18
|
-
const disabled = "
|
|
6
|
+
import '../../assets/Button.css';const button = "_button_18bdh_2";
|
|
7
|
+
const clear = "_clear_18bdh_42";
|
|
8
|
+
const black = "_black_18bdh_120";
|
|
9
|
+
const gray = "_gray_18bdh_129";
|
|
10
|
+
const white = "_white_18bdh_138";
|
|
11
|
+
const xs = "_xs_18bdh_208";
|
|
12
|
+
const s = "_s_18bdh_72";
|
|
13
|
+
const m = "_m_18bdh_216";
|
|
14
|
+
const l = "_l_18bdh_240";
|
|
15
|
+
const xl = "_xl_18bdh_248";
|
|
16
|
+
const xxl = "_xxl_18bdh_257";
|
|
17
|
+
const full = "_full_18bdh_266";
|
|
18
|
+
const disabled = "_disabled_18bdh_272";
|
|
19
19
|
const cls = {
|
|
20
20
|
button,
|
|
21
21
|
clear,
|
|
22
|
+
"default-button": "_default-button_18bdh_54",
|
|
23
|
+
"primary-sapphire": "_primary-sapphire_18bdh_54",
|
|
24
|
+
"primary-citrine": "_primary-citrine_18bdh_63",
|
|
25
|
+
"secondary-asphalt": "_secondary-asphalt_18bdh_72",
|
|
26
|
+
"secondary-gray": "_secondary-gray_18bdh_81",
|
|
27
|
+
"secondary-white": "_secondary-white_18bdh_90",
|
|
28
|
+
"secondary-red": "_secondary-red_18bdh_99",
|
|
29
|
+
"round-button": "_round-button_18bdh_109",
|
|
30
|
+
black,
|
|
31
|
+
gray,
|
|
32
|
+
white,
|
|
33
|
+
"outline-button": "_outline-button_18bdh_148",
|
|
34
|
+
"outline-asphalt": "_outline-asphalt_18bdh_155",
|
|
35
|
+
"outline-gray": "_outline-gray_18bdh_163",
|
|
36
|
+
"outline-white": "_outline-white_18bdh_172",
|
|
37
|
+
"outline-red": "_outline-red_18bdh_181",
|
|
22
38
|
xs,
|
|
39
|
+
"m-s": "_m-s_18bdh_216",
|
|
23
40
|
s,
|
|
24
41
|
m,
|
|
25
42
|
l,
|
|
26
43
|
xl,
|
|
27
44
|
xxl,
|
|
28
|
-
"m-s": "_m-s_12tq3_105",
|
|
29
|
-
"default-button": "_default-button_12tq3_113",
|
|
30
|
-
"primary-sapphire": "_primary-sapphire_12tq3_116",
|
|
31
|
-
"primary-citrine": "_primary-citrine_12tq3_125",
|
|
32
|
-
"secondary-asphalt": "_secondary-asphalt_12tq3_134",
|
|
33
|
-
"secondary-gray": "_secondary-gray_12tq3_143",
|
|
34
|
-
"secondary-white": "_secondary-white_12tq3_152",
|
|
35
|
-
"secondary-red": "_secondary-red_12tq3_161",
|
|
36
|
-
"round-button": "_round-button_12tq3_171",
|
|
37
|
-
black,
|
|
38
|
-
gray,
|
|
39
|
-
white,
|
|
40
|
-
"outline-button": "_outline-button_12tq3_206",
|
|
41
|
-
"outline-asphalt": "_outline-asphalt_12tq3_214",
|
|
42
|
-
"outline-gray": "_outline-gray_12tq3_222",
|
|
43
|
-
"outline-white": "_outline-white_12tq3_231",
|
|
44
|
-
"outline-red": "_outline-red_12tq3_240",
|
|
45
45
|
full,
|
|
46
46
|
disabled,
|
|
47
|
-
"icon-button": "_icon-
|
|
47
|
+
"icon-button": "_icon-button_18bdh_288"
|
|
48
48
|
};
|
|
49
49
|
const Button = forwardRef(
|
|
50
50
|
(props, ref) => {
|
|
@@ -5,7 +5,7 @@ import { c as cls, D as DatePickerModal } from "../../DatePickerModal-BM0BgzTb.j
|
|
|
5
5
|
import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
|
|
6
6
|
import { formating } from "../../utils/index.js";
|
|
7
7
|
import { Button } from "../Button/Button.js";
|
|
8
|
-
import { I as Input } from "../../Input-
|
|
8
|
+
import { I as Input } from "../../Input-DdKAiGfJ.js";
|
|
9
9
|
const DatePicker = memo(
|
|
10
10
|
forwardRef(
|
|
11
11
|
({ size, value, onChangeValue, name, before, ...props }, ref) => {
|
|
@@ -42,6 +42,14 @@ export type TAdditionalProps = {
|
|
|
42
42
|
* Флаг, показывающий наличие кнопки очистки.
|
|
43
43
|
*/
|
|
44
44
|
withClearButton?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Разрешить только числовой ввод
|
|
47
|
+
*/
|
|
48
|
+
numbersOnly?: boolean;
|
|
49
|
+
/**
|
|
50
|
+
* Максимальная длина ввода
|
|
51
|
+
*/
|
|
52
|
+
maxLength?: number;
|
|
45
53
|
};
|
|
46
54
|
export type TProps = TInputProps & TAdditionalProps;
|
|
47
55
|
export declare const Input: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<TInputProps & TAdditionalProps & import('react').RefAttributes<HTMLInputElement>>>;
|
|
@@ -2,7 +2,7 @@ import "react/jsx-runtime";
|
|
|
2
2
|
import "../../index-CweZ_OcN.js";
|
|
3
3
|
import "react";
|
|
4
4
|
import "./constants.js";
|
|
5
|
-
import { I } from "../../Input-
|
|
5
|
+
import { I } from "../../Input-DdKAiGfJ.js";
|
|
6
6
|
import "../../hooks/useMergeRefs/useMergeRefs.js";
|
|
7
7
|
import "../../icons/Icon.js";
|
|
8
8
|
import "../Button/Button.js";
|
|
@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { memo, forwardRef, useState } from "react";
|
|
3
3
|
import { Icon } from "../../icons/Icon.js";
|
|
4
4
|
import { Button } from "../Button/Button.js";
|
|
5
|
-
import { I as Input } from "../../Input-
|
|
5
|
+
import { I as Input } from "../../Input-DdKAiGfJ.js";
|
|
6
6
|
import '../../assets/InputPassword.css';const input = "_input_mam1g_2";
|
|
7
7
|
const wrapper = "_wrapper_mam1g_6";
|
|
8
8
|
const button = "_button_mam1g_17";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { memo, forwardRef, useState, useCallback, useImperativeHandle } from "react";
|
|
3
3
|
import { getMaskedInputPhoneValue, getUnmaskedInputValue } from "./utils.js";
|
|
4
|
-
import { I as Input } from "../../Input-
|
|
4
|
+
import { I as Input } from "../../Input-DdKAiGfJ.js";
|
|
5
5
|
const InputPhoneNumber = memo(
|
|
6
6
|
forwardRef(
|
|
7
7
|
({ value = "", onChange, ...props }, ref) => {
|
|
@@ -3,7 +3,7 @@ import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
|
3
3
|
import { forwardRef, useImperativeHandle, Fragment } from "react";
|
|
4
4
|
import { ITEMS_PER_SEPARATOR, DEFAULT_VALUE_LENGTH } from "./constants.js";
|
|
5
5
|
import { useOTPInput } from "./hooks.js";
|
|
6
|
-
import { I as Input } from "../../Input-
|
|
6
|
+
import { I as Input } from "../../Input-DdKAiGfJ.js";
|
|
7
7
|
import '../../assets/OtpInput.css';const otp = "_otp_196ev_3";
|
|
8
8
|
const input = "_input_196ev_14";
|
|
9
9
|
const separator = "_separator_196ev_28";
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { RadioGroupProps } from '@headlessui/react';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
2
3
|
|
|
3
4
|
export interface TRadioOption {
|
|
4
5
|
value: string;
|
|
5
|
-
label:
|
|
6
|
+
label: ReactNode;
|
|
6
7
|
}
|
|
7
8
|
/**
|
|
8
9
|
* Свойства компонента RadioGroup.
|
|
@@ -23,6 +24,11 @@ export type TRadioGroupProps = Omit<RadioGroupProps, 'value'> & {
|
|
|
23
24
|
* Может быть необязательным.
|
|
24
25
|
*/
|
|
25
26
|
label?: string;
|
|
27
|
+
/**
|
|
28
|
+
* Дополнительный класснейм для элементов радиогруппы.
|
|
29
|
+
*
|
|
30
|
+
*/
|
|
31
|
+
classNameRadioWrapper?: string;
|
|
26
32
|
};
|
|
27
33
|
/**
|
|
28
34
|
* Компонент RadioGroup для выбора одной опции из нескольких.
|
|
@@ -43,4 +49,9 @@ export declare const RadioGroup: import('react').ForwardRefExoticComponent<Omit<
|
|
|
43
49
|
* Может быть необязательным.
|
|
44
50
|
*/
|
|
45
51
|
label?: string;
|
|
52
|
+
/**
|
|
53
|
+
* Дополнительный класснейм для элементов радиогруппы.
|
|
54
|
+
*
|
|
55
|
+
*/
|
|
56
|
+
classNameRadioWrapper?: string;
|
|
46
57
|
} & import('react').RefAttributes<HTMLElement>>;
|
|
@@ -120,10 +120,14 @@ const cls = {
|
|
|
120
120
|
checked
|
|
121
121
|
};
|
|
122
122
|
const RadioGroup = forwardRef(
|
|
123
|
-
({ options, value, onChange, label: label2, ...props }, ref) => {
|
|
124
|
-
const radioClasses = classNames(
|
|
125
|
-
[
|
|
126
|
-
|
|
123
|
+
({ options, value, onChange, label: label2, classNameRadioWrapper, ...props }, ref) => {
|
|
124
|
+
const radioClasses = classNames(
|
|
125
|
+
cls["radio-wrapper"],
|
|
126
|
+
classNameRadioWrapper,
|
|
127
|
+
{
|
|
128
|
+
[cls.disabled]: props.disabled
|
|
129
|
+
}
|
|
130
|
+
);
|
|
127
131
|
return /* @__PURE__ */ jsxs(
|
|
128
132
|
Tt,
|
|
129
133
|
{
|
|
@@ -163,7 +167,7 @@ const RadioGroup = forwardRef(
|
|
|
163
167
|
label22
|
|
164
168
|
] })
|
|
165
169
|
},
|
|
166
|
-
|
|
170
|
+
typeof value2 === "string" ? value2 : String(value2)
|
|
167
171
|
)) })
|
|
168
172
|
]
|
|
169
173
|
}
|
|
@@ -4,7 +4,7 @@ import * as React from "react";
|
|
|
4
4
|
import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useLayoutEffect, createContext, useContext, useState, Fragment, createRef, forwardRef } from "react";
|
|
5
5
|
import { ESelectSearchSize } from "./constants.js";
|
|
6
6
|
import { Icon } from "../../icons/Icon.js";
|
|
7
|
-
import { I as Input } from "../../Input-
|
|
7
|
+
import { I as Input } from "../../Input-DdKAiGfJ.js";
|
|
8
8
|
import { EInputVariant, EInputSize } from "../Input/constants.js";
|
|
9
9
|
import { n as n$2, u as u$3, d as o$1, s as s$3, o as o$2, p as p$1, t as t$3, e as s$4, W as W$1, y as y$3, T, H, M as M$1, a as u$5, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, b as $6179b936705e76d3$export$ae780daf29e6d456, D as D$2, c as o$3 } from "../../keyboard-B256ZoM-.js";
|
|
10
10
|
import * as ReactDOM from "react-dom";
|
|
@@ -3798,7 +3798,8 @@ const SelectSearch = forwardRef(
|
|
|
3798
3798
|
onSearch,
|
|
3799
3799
|
variant = EInputVariant.DefaultGray,
|
|
3800
3800
|
menuPlacement = "bottom",
|
|
3801
|
-
disabled: disabled2 = false
|
|
3801
|
+
disabled: disabled2 = false,
|
|
3802
|
+
searchProps
|
|
3802
3803
|
} = props;
|
|
3803
3804
|
const [inputValue, setInputValue] = useState("");
|
|
3804
3805
|
const mapSizeToInputSize = (size22) => {
|
|
@@ -3863,7 +3864,8 @@ const SelectSearch = forwardRef(
|
|
|
3863
3864
|
onChange: handleInputChange,
|
|
3864
3865
|
value: inputValue,
|
|
3865
3866
|
disabled: disabled2,
|
|
3866
|
-
variant
|
|
3867
|
+
variant,
|
|
3868
|
+
...searchProps
|
|
3867
3869
|
}
|
|
3868
3870
|
),
|
|
3869
3871
|
showArrow && /* @__PURE__ */ jsx(Ho, { className: cls.button, disabled: disabled2, children: /* @__PURE__ */ jsx(
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
import { ESelectSearchSize } from './constants';
|
|
3
|
-
import { TVariant } from '../Input';
|
|
3
|
+
import { TInputProps, TVariant } from '../Input';
|
|
4
4
|
|
|
5
5
|
export type TSelectOption = {
|
|
6
6
|
name: string;
|
|
@@ -50,4 +50,6 @@ export type TSelectSearchProps = {
|
|
|
50
50
|
menuPlacement?: TMenuPlacement;
|
|
51
51
|
/** Отключает компонент SelectSearch */
|
|
52
52
|
disabled?: boolean;
|
|
53
|
+
/** Пропсы для инпута поиска опций */
|
|
54
|
+
searchProps?: Pick<TInputProps, 'numbersOnly' | 'maxLength'>;
|
|
53
55
|
};
|
|
@@ -5,7 +5,7 @@ import { useAutoResizeTextArea } from "./hooks.js";
|
|
|
5
5
|
import { useMergeRefs } from "../../hooks/useMergeRefs/useMergeRefs.js";
|
|
6
6
|
import { Icon } from "../../icons/Icon.js";
|
|
7
7
|
import { Button } from "../Button/Button.js";
|
|
8
|
-
import { c as cls } from "../../Input-
|
|
8
|
+
import { c as cls } from "../../Input-DdKAiGfJ.js";
|
|
9
9
|
import { EInputVariant } from "../Input/constants.js";
|
|
10
10
|
import '../../assets/TextArea.css';const textarea = "_textarea_46c4k_2";
|
|
11
11
|
const s = "_s_46c4k_6";
|
|
@@ -63,6 +63,7 @@ const TextArea = memo(
|
|
|
63
63
|
onFocus,
|
|
64
64
|
onBlur,
|
|
65
65
|
label,
|
|
66
|
+
onChange,
|
|
66
67
|
withClearButton,
|
|
67
68
|
disabled,
|
|
68
69
|
rightAddon,
|
|
@@ -101,14 +102,16 @@ const TextArea = memo(
|
|
|
101
102
|
inputRef.current.focus();
|
|
102
103
|
setWithValue(false);
|
|
103
104
|
handleResize();
|
|
105
|
+
onChange == null ? void 0 : onChange({
|
|
106
|
+
target: { value: "" }
|
|
107
|
+
});
|
|
104
108
|
}
|
|
105
109
|
};
|
|
106
110
|
const handleChange = (event) => {
|
|
107
|
-
var _a;
|
|
108
111
|
const targetValue = event.target.value;
|
|
109
112
|
setWithValue(!!targetValue);
|
|
110
113
|
handleResize();
|
|
111
|
-
|
|
114
|
+
onChange == null ? void 0 : onChange(event);
|
|
112
115
|
};
|
|
113
116
|
const currentLeftAddon = renderAddon(leftAddon);
|
|
114
117
|
const currentRightAddon = renderAddon(rightAddon);
|
|
@@ -145,7 +148,10 @@ const TextArea = memo(
|
|
|
145
148
|
cls[variant],
|
|
146
149
|
textareaCls[size],
|
|
147
150
|
cls[size],
|
|
148
|
-
{
|
|
151
|
+
{
|
|
152
|
+
[cls.disabled]: disabled || readonly,
|
|
153
|
+
[cls.focused]: isFocused || withValue
|
|
154
|
+
},
|
|
149
155
|
wrapperClassName
|
|
150
156
|
),
|
|
151
157
|
children: [
|
|
@@ -193,6 +199,7 @@ const TextArea = memo(
|
|
|
193
199
|
iconName: "Close16px",
|
|
194
200
|
size: "m-s",
|
|
195
201
|
clear: true,
|
|
202
|
+
disabled: disabled || readonly,
|
|
196
203
|
variant: "secondary-gray",
|
|
197
204
|
onClick: handleClear
|
|
198
205
|
}
|
package/dist/components/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "./Button/Button.js";
|
|
2
2
|
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./Button/constants.js";
|
|
3
|
-
import { I } from "../Input-
|
|
3
|
+
import { I } from "../Input-DdKAiGfJ.js";
|
|
4
4
|
import { EInputSize, EInputVariant } from "./Input/constants.js";
|
|
5
5
|
import { TextArea } from "./TextArea/TextArea.js";
|
|
6
6
|
import { InputPassword } from "./InputPassword/InputPassword.js";
|
|
@@ -37,7 +37,7 @@ import { useToast } from "./Toasts/hooks.js";
|
|
|
37
37
|
import { EToastPosition, EToastVariant } from "./Toasts/constants.js";
|
|
38
38
|
import { UploaderPhotos } from "./UploaderPhotos/UploaderPhotos.js";
|
|
39
39
|
import { Uploader } from "./Uploader/Uploader.js";
|
|
40
|
-
import { Link } from "./AnchorLink/
|
|
40
|
+
import { Link } from "./AnchorLink/Link.js";
|
|
41
41
|
import { ELinkSize, ELinkVariant } from "./AnchorLink/constants.js";
|
|
42
42
|
import { NotificationBadge } from "./NotificationBadge/NotificationBadge.js";
|
|
43
43
|
import { ENotificationBadgeSize } from "./NotificationBadge/constants.js";
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "./components/Button/Button.js";
|
|
2
2
|
import { EButtonForm, EButtonSize, EButtonVariantDefault, EButtonVariantOutline, EButtonVariantRound } from "./components/Button/constants.js";
|
|
3
|
-
import { I } from "./Input-
|
|
3
|
+
import { I } from "./Input-DdKAiGfJ.js";
|
|
4
4
|
import { EInputSize, EInputVariant } from "./components/Input/constants.js";
|
|
5
5
|
import { TextArea } from "./components/TextArea/TextArea.js";
|
|
6
6
|
import { InputPassword } from "./components/InputPassword/InputPassword.js";
|
|
@@ -37,7 +37,7 @@ import { useToast } from "./components/Toasts/hooks.js";
|
|
|
37
37
|
import { EToastPosition, EToastVariant } from "./components/Toasts/constants.js";
|
|
38
38
|
import { UploaderPhotos } from "./components/UploaderPhotos/UploaderPhotos.js";
|
|
39
39
|
import { Uploader } from "./components/Uploader/Uploader.js";
|
|
40
|
-
import { Link } from "./components/AnchorLink/
|
|
40
|
+
import { Link } from "./components/AnchorLink/Link.js";
|
|
41
41
|
import { ELinkSize, ELinkVariant } from "./components/AnchorLink/constants.js";
|
|
42
42
|
import { NotificationBadge } from "./components/NotificationBadge/NotificationBadge.js";
|
|
43
43
|
import { ENotificationBadgeSize } from "./components/NotificationBadge/constants.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type { Props, PolymorphicRef, ComponentCustomProps } from './propsWithAs';
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ElementType, ComponentPropsWithoutRef, ComponentPropsWithRef, JSXElementConstructor, ReactElement, ReactNode } from 'react';
|
|
2
|
+
|
|
3
|
+
export type PropsOf<C extends keyof JSX.IntrinsicElements | JSXElementConstructor<unknown>> = JSX.LibraryManagedAttributes<C, ComponentPropsWithoutRef<C>>;
|
|
4
|
+
type AsProp<C extends ElementType> = {
|
|
5
|
+
as?: C;
|
|
6
|
+
};
|
|
7
|
+
export type ExtendableProps<ExtendedProps = NonNullable<unknown>, OverrideProps = NonNullable<unknown>> = OverrideProps & Omit<ExtendedProps, keyof OverrideProps>;
|
|
8
|
+
export type InheritableElementProps<C extends ElementType, Props = NonNullable<unknown>> = ExtendableProps<PropsOf<C>, Props>;
|
|
9
|
+
export type PolymorphicComponentProps<C extends ElementType, Props = NonNullable<unknown>> = InheritableElementProps<C, Props & AsProp<C>>;
|
|
10
|
+
export type PolymorphicRef<C extends ElementType> = ComponentPropsWithRef<C>['ref'];
|
|
11
|
+
export type PolymorphicComponentPropsWithRef<C extends ElementType, Props = NonNullable<unknown>> = PolymorphicComponentProps<C, Props> & {
|
|
12
|
+
ref?: PolymorphicRef<C>;
|
|
13
|
+
};
|
|
14
|
+
export type Props<C extends ElementType, P> = PolymorphicComponentPropsWithRef<C, P>;
|
|
15
|
+
export type ComponentCustomProps = <C extends ElementType = 'span', P = NonNullable<unknown>>(props: Props<C, P>) => ReactElement | ReactNode;
|
|
16
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
._link_miwq0_2{--link-color: var(--dark-text);display:inline-flex;align-items:center;color:var(--link-color);font-size:var(--link-font-size);font-family:var(--font-inter);line-height:var(--link-line-height);-moz-column-gap:var(--link-gap);column-gap:var(--link-gap);transition:all .15s ease}._link_miwq0_2:hover{--link-color: var(--sapphire-hover)}._link_miwq0_2:active{--link-color: var(--sapphire-active)}._link_miwq0_2._sample_miwq0_19:hover{-webkit-text-decoration:underline var(--link-color);text-decoration:underline var(--link-color);text-underline-offset:4px}._link_miwq0_2._anchor_miwq0_23{-webkit-text-decoration:underline dashed var(--link-color);text-decoration:underline dashed var(--link-color);text-underline-offset:4px}._link_miwq0_2._disabled_miwq0_27{--link-color: var(--disabled);-webkit-text-decoration:none;text-decoration:none}._link_miwq0_2._disabled_miwq0_27:hover,._link_miwq0_2._disabled_miwq0_27:active{-webkit-text-decoration:none;text-decoration:none;--link-color: var(--disabled)}._link_miwq0_2 ._icon_miwq0_35{color:currentcolor;fill:currentcolor}._link_miwq0_2 ._icon_miwq0_35 path{color:currentcolor;fill:currentcolor}._xs_miwq0_44{--link-font-size: var(--size-text-s);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._s_miwq0_19{--link-font-size: var(--size-text-m);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._m_miwq0_56{--link-font-size: var(--size-text-l);--link-line-height: var(--size-text-s);--link-gap: var(--space-2xs)}._l_miwq0_2{--link-font-size: var(--size-text-l2);--link-line-height: var(--size-text-s);--link-gap: var(--space-xs)}
|
package/dist/assets/Checkbox.css
DELETED
|
File without changes
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { ComponentProps } from 'react';
|
|
2
|
-
import { ELinkSize, ELinkVariant } from './constants';
|
|
3
|
-
import { TIconProps } from '../../icons';
|
|
4
|
-
|
|
5
|
-
type TProps = ComponentProps<'button'> & {
|
|
6
|
-
variant?: ELinkVariant | `${ELinkVariant}`;
|
|
7
|
-
size?: ELinkSize | `${ELinkSize}`;
|
|
8
|
-
leftIcon?: TIconProps;
|
|
9
|
-
rightIcon?: TIconProps;
|
|
10
|
-
disabled?: boolean;
|
|
11
|
-
};
|
|
12
|
-
export declare const Link: import('react').ForwardRefExoticComponent<Omit<TProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
13
|
-
export {};
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
-
import { forwardRef } from "react";
|
|
4
|
-
import { ELinkSize, ELinkVariant } from "./constants.js";
|
|
5
|
-
import { Icon } from "../../icons/Icon.js";
|
|
6
|
-
import '../../assets/AnchorLink.css';const link = "_link_miwq0_2";
|
|
7
|
-
const sample = "_sample_miwq0_19";
|
|
8
|
-
const anchor = "_anchor_miwq0_23";
|
|
9
|
-
const disabled = "_disabled_miwq0_27";
|
|
10
|
-
const icon = "_icon_miwq0_35";
|
|
11
|
-
const xs = "_xs_miwq0_44";
|
|
12
|
-
const s = "_s_miwq0_19";
|
|
13
|
-
const m = "_m_miwq0_56";
|
|
14
|
-
const l = "_l_miwq0_2";
|
|
15
|
-
const cls = {
|
|
16
|
-
link,
|
|
17
|
-
sample,
|
|
18
|
-
anchor,
|
|
19
|
-
disabled,
|
|
20
|
-
icon,
|
|
21
|
-
xs,
|
|
22
|
-
s,
|
|
23
|
-
m,
|
|
24
|
-
l
|
|
25
|
-
};
|
|
26
|
-
const Link = forwardRef(
|
|
27
|
-
({
|
|
28
|
-
leftIcon,
|
|
29
|
-
className,
|
|
30
|
-
size = ELinkSize.L,
|
|
31
|
-
variant = ELinkVariant.ANCHOR,
|
|
32
|
-
rightIcon,
|
|
33
|
-
disabled: disabled2,
|
|
34
|
-
...props
|
|
35
|
-
}, ref) => {
|
|
36
|
-
return /* @__PURE__ */ jsxs(
|
|
37
|
-
"button",
|
|
38
|
-
{
|
|
39
|
-
ref,
|
|
40
|
-
type: "button",
|
|
41
|
-
disabled: disabled2,
|
|
42
|
-
className: classNames(cls.link, className, cls[variant], cls[size], {
|
|
43
|
-
[cls.disabled]: disabled2
|
|
44
|
-
}),
|
|
45
|
-
...props,
|
|
46
|
-
children: [
|
|
47
|
-
leftIcon && /* @__PURE__ */ jsx(
|
|
48
|
-
Icon,
|
|
49
|
-
{
|
|
50
|
-
...leftIcon,
|
|
51
|
-
className: classNames(cls.icon, leftIcon.className)
|
|
52
|
-
}
|
|
53
|
-
),
|
|
54
|
-
props.children,
|
|
55
|
-
rightIcon && /* @__PURE__ */ jsx(
|
|
56
|
-
Icon,
|
|
57
|
-
{
|
|
58
|
-
...rightIcon,
|
|
59
|
-
className: classNames(cls.icon, rightIcon.className)
|
|
60
|
-
}
|
|
61
|
-
)
|
|
62
|
-
]
|
|
63
|
-
}
|
|
64
|
-
);
|
|
65
|
-
}
|
|
66
|
-
);
|
|
67
|
-
export {
|
|
68
|
-
Link
|
|
69
|
-
};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
export type TProps = {
|
|
2
|
-
/**
|
|
3
|
-
* Класс, применяемый к корневому элемент
|
|
4
|
-
*/
|
|
5
|
-
rootClassName?: string;
|
|
6
|
-
/**
|
|
7
|
-
* Текст метки для чекбокса
|
|
8
|
-
*/
|
|
9
|
-
label: string;
|
|
10
|
-
/**
|
|
11
|
-
* Состояние выбранности чекбокса
|
|
12
|
-
*/
|
|
13
|
-
checked?: boolean;
|
|
14
|
-
/**
|
|
15
|
-
* Обработчик изменения состояния чекбокса
|
|
16
|
-
*/
|
|
17
|
-
onChange: () => void;
|
|
18
|
-
/**
|
|
19
|
-
* Название поля чекбокса
|
|
20
|
-
*/
|
|
21
|
-
name: string;
|
|
22
|
-
};
|
|
23
|
-
export declare const Checkbox: import('react').ForwardRefExoticComponent<TProps & import('react').RefAttributes<HTMLLabelElement>>;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { c as classNames } from "../../index-CweZ_OcN.js";
|
|
3
|
-
import { forwardRef } from "react";
|
|
4
|
-
import '../../assets/Checkbox.css';const cls = {};
|
|
5
|
-
const Checkbox = forwardRef(
|
|
6
|
-
(props, ref) => {
|
|
7
|
-
const { rootClassName, label, checked, onChange, name } = props;
|
|
8
|
-
return /* @__PURE__ */ jsxs("label", { className: classNames(cls.container, rootClassName), ref, children: [
|
|
9
|
-
/* @__PURE__ */ jsx(
|
|
10
|
-
"input",
|
|
11
|
-
{
|
|
12
|
-
type: "checkbox",
|
|
13
|
-
checked,
|
|
14
|
-
onChange,
|
|
15
|
-
name
|
|
16
|
-
}
|
|
17
|
-
),
|
|
18
|
-
label
|
|
19
|
-
] });
|
|
20
|
-
}
|
|
21
|
-
);
|
|
22
|
-
export {
|
|
23
|
-
Checkbox
|
|
24
|
-
};
|
|
File without changes
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Checkbox } from './Checkbox';
|
|
File without changes
|
|
File without changes
|
|
File without changes
|