mimir-ui-kit 1.8.0 → 1.8.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{DatePickerModal-ByEDSY5o.js → DatePickerModal-DUUCHAWF.js} +17 -17
- package/dist/assets/DatePickerModal.css +1 -1
- package/dist/assets/SelectSearch.css +1 -1
- package/dist/components/DatePicker/DatePicker.d.ts +5 -5
- package/dist/components/DatePicker/DatePicker.js +1 -1
- package/dist/components/DatePicker/DatePickerModal.js +1 -1
- package/dist/components/DatePicker/index.d.ts +1 -1
- package/dist/components/Input/Input.d.ts +2 -2
- package/dist/components/RadioGroup/RadioGroup.d.ts +18 -2
- package/dist/components/RadioGroup/RadioGroup.js +50 -44
- package/dist/components/RadioGroup/index.d.ts +1 -1
- package/dist/components/SelectSearch/SelectSearch.d.ts +10 -16
- package/dist/components/SelectSearch/SelectSearch.js +100 -104
- package/dist/components/SelectSearch/index.d.ts +1 -2
- package/dist/components/Switch/Switch.d.ts +293 -3
- package/dist/components/Switch/Switch.js +27 -22
- package/dist/components/Switch/index.d.ts +1 -1
- package/dist/components/index.d.ts +3 -3
- package/package.json +1 -1
- package/dist/components/SelectSearch/types.d.ts +0 -17
- package/dist/components/SelectSearch/types.js +0 -1
- package/dist/components/Switch/types.d.ts +0 -4
- package/dist/components/Switch/types.js +0 -1
@@ -3,28 +3,28 @@ import { useRef, useState, useEffect } from "react";
|
|
3
3
|
import { week } from "./components/DatePicker/constants.js";
|
4
4
|
import { formating } from "./utils/index.js";
|
5
5
|
import { Button } from "./components/Button/Button.js";
|
6
|
-
import './assets/DatePickerModal.css';const input = "
|
7
|
-
const wrapper = "
|
8
|
-
const active = "
|
9
|
-
const button = "
|
10
|
-
const h = "
|
11
|
-
const b = "
|
12
|
-
const d = "
|
13
|
-
const m = "
|
14
|
-
const a = "
|
15
|
-
const prev = "
|
16
|
-
const orange = "
|
17
|
-
const current = "
|
6
|
+
import './assets/DatePickerModal.css';const input = "_input_187xq_2";
|
7
|
+
const wrapper = "_wrapper_187xq_20";
|
8
|
+
const active = "_active_187xq_26";
|
9
|
+
const button = "_button_187xq_34";
|
10
|
+
const h = "_h_187xq_80";
|
11
|
+
const b = "_b_187xq_34";
|
12
|
+
const d = "_d_187xq_6";
|
13
|
+
const m = "_m_187xq_99";
|
14
|
+
const a = "_a_187xq_26";
|
15
|
+
const prev = "_prev_187xq_101";
|
16
|
+
const orange = "_orange_187xq_117";
|
17
|
+
const current = "_current_187xq_142";
|
18
18
|
const cls = {
|
19
19
|
input,
|
20
|
-
"date-wrapper": "_date-
|
20
|
+
"date-wrapper": "_date-wrapper_187xq_6",
|
21
21
|
wrapper,
|
22
22
|
active,
|
23
|
-
"input-wrapper": "_input-
|
24
|
-
"button-wrapper": "_button-
|
23
|
+
"input-wrapper": "_input-wrapper_187xq_30",
|
24
|
+
"button-wrapper": "_button-wrapper_187xq_34",
|
25
25
|
button,
|
26
|
-
"field-overlow": "_field-
|
27
|
-
"calendar-block": "_calendar-
|
26
|
+
"field-overlow": "_field-overlow_187xq_51",
|
27
|
+
"calendar-block": "_calendar-block_187xq_57",
|
28
28
|
h,
|
29
29
|
b,
|
30
30
|
d,
|
@@ -1 +1 @@
|
|
1
|
-
.
|
1
|
+
._input_187xq_2{padding-right:var(--space-3xl)}._date-wrapper_187xq_6{position:relative}._date-wrapper_187xq_6:hover input{background:var(--input-bg-color-hover)}._date-wrapper_187xq_6:before{position:absolute;top:0;right:60px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}._wrapper_187xq_20{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_187xq_20._active_187xq_26{border-bottom:1px solid var(--citrine-100)}._input-wrapper_187xq_30{flex:1}._button-wrapper_187xq_34{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_187xq_34{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_187xq_51{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_187xq_57{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:#fff;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_187xq_57 ._h_187xq_80{display:flex;width:100%;color:var(--black-100)}._calendar-block_187xq_57 ._b_187xq_34{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_187xq_57 ._d_187xq_6{display:flex;flex:1;align-items:center;justify-content:center;color:var(--black-100)}._calendar-block_187xq_57 ._m_187xq_99,._calendar-block_187xq_57 ._a_187xq_26,._calendar-block_187xq_57 ._prev_187xq_101{width:48px;height:48px;overflow:hidden}._calendar-block_187xq_57 ._m_187xq_99{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_187xq_57 ._m_187xq_99 b{font-weight:var(--font-weight-text-regular)}._calendar-block_187xq_57 ._orange_187xq_117{color:var(--citrine-100)}._calendar-block_187xq_57 ._a_187xq_26{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_187xq_57 ._a_187xq_26 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_187xq_57 ._a_187xq_26 b:hover{background:var(--black-10)}._calendar-block_187xq_57 ._a_187xq_26 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_187xq_57 ._current_187xq_142{background:var(--sapphire-10);border-radius:var(--control-radius-s)}
|
@@ -1 +1 @@
|
|
1
|
-
._select-
|
1
|
+
._select-search_xswn2_2{position:relative}._container_xswn2_6{display:flex;gap:var(--select-search-gap);align-items:center;justify-content:space-between;height:var(--select-search-height);padding:var(--select-search-space);background-color:var(--black-5);border-radius:var(--select-search-radius)}._container-open_xswn2_16{border-bottom:1px solid var(--citrine-100)}._full_xswn2_20{width:100%}._selectorIcon-open_xswn2_24{transform:rotate(180deg)}._placeholder_xswn2_28{position:absolute;top:var(--select-search-input-top);left:0;color:var(--black-60);font-size:var(--select-search-input-font-size);transition:all .3s ease;pointer-events:none}._placeholder-top_xswn2_37{font-size:var(--size-text-s);transform:translateY(-10px);transition-duration:.2s,.1s}._input_xswn2_43{width:100%;height:100%;color:var(--black-100);font-size:var(--select-search-input-font-size);background-color:var(--black-5)}._input_xswn2_43:focus~._placeholder_xswn2_28{font-size:var(--size-text-s);transform:translateY(-10px);transition-duration:.2s,.1s}._input-container_xswn2_55{position:relative;align-self:flex-end;width:100%}._button_xswn2_61{display:flex;align-items:center;background:none;border:none;cursor:pointer}._options_xswn2_69{position:absolute;top:100%;z-index:10;width:100%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:var(--select-search-options-height-desktop);overflow-y:auto;font-size:var(--size-text-l);background:var(--white);border-radius:0 0 var(--select-search-radius) var(--select-search-radius);box-shadow:var(--box-shadow-select-search)}._options_xswn2_69::-webkit-scrollbar{width:2px}._options_xswn2_69::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._options_xswn2_69::-webkit-scrollbar-track{background-color:var(--white)}@media (max-width: 600px){._options_xswn2_69{max-height:var(--select-search-options-height-mobile)}}._option_xswn2_69{padding:var(--select-search-option-space);cursor:pointer;transition:background-color .2s ease-in-out}._option-active_xswn2_103{background-color:var(--black-5)}._option-inner_xswn2_106{display:flex;gap:var(--space-m);align-items:center;justify-content:space-between}._no-options_xswn2_113{padding:var(--select-search-option-space);color:var(--black-80)}._l_xswn2_118{--select-search-height: var(--select-search-height-l);--select-search-space: var(--space-xss) var(--space-m);--select-search-radius: var(--control-radius);--select-search-input-font-size: var(--size-text-l);--select-search-gap: var(--space-2xs);--select-search-option-space: var(--space-2s) var(--space-m);--select-search-input-top: var(--select-search-input-top-l)}._xxl_xswn2_128{--select-search-height: var(--select-search-height-xxl);--select-search-space: var(--space-xss) var(--space-m);--select-search-radius: var(--control-radius-s);--select-search-input-font-size: var(--size-text-xl);--select-search-gap: var(--space-xs);--select-search-option-space: var(--space-2l) var(--space-m);--select-search-input-top: var(--select-search-input-top-xxl)}._selected-icon_xswn2_138 path{fill:var(--sapphire-100)}
|
@@ -4,7 +4,7 @@ export type DatePicker = {
|
|
4
4
|
/**
|
5
5
|
* функция=callback, которая вызывается при изменении значения и передает имя и новое значение для обновления стейта (data),
|
6
6
|
*/
|
7
|
-
onChangeValue
|
7
|
+
onChangeValue?: (e: TDatePickerValue) => void;
|
8
8
|
/**
|
9
9
|
* функция ограничения выбора даты
|
10
10
|
(до какой даты выбор не доступен)
|
@@ -13,17 +13,17 @@ export type DatePicker = {
|
|
13
13
|
/**
|
14
14
|
* значение из стейта (data)
|
15
15
|
*/
|
16
|
-
value
|
16
|
+
value?: string;
|
17
17
|
} & TInputProps;
|
18
18
|
export type TDatePickerValue = {
|
19
|
-
value
|
19
|
+
value?: Date;
|
20
20
|
name?: string;
|
21
21
|
};
|
22
22
|
export declare const DatePicker: import('react').MemoExoticComponent<import('react').ForwardRefExoticComponent<{
|
23
23
|
/**
|
24
24
|
* функция=callback, которая вызывается при изменении значения и передает имя и новое значение для обновления стейта (data),
|
25
25
|
*/
|
26
|
-
onChangeValue
|
26
|
+
onChangeValue?: (e: TDatePickerValue) => void;
|
27
27
|
/**
|
28
28
|
* функция ограничения выбора даты
|
29
29
|
(до какой даты выбор не доступен)
|
@@ -32,7 +32,7 @@ export declare const DatePicker: import('react').MemoExoticComponent<import('rea
|
|
32
32
|
/**
|
33
33
|
* значение из стейта (data)
|
34
34
|
*/
|
35
|
-
value
|
35
|
+
value?: string;
|
36
36
|
} & import('../Input/types').TInputProps & {
|
37
37
|
size?: import('../Input').TSize;
|
38
38
|
variant?: import('../Input').TVariant;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { jsxs, jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
3
|
import { memo, forwardRef, useState } from "react";
|
4
|
-
import { c as cls, D as DatePickerModal } from "../../DatePickerModal-
|
4
|
+
import { c as cls, D as DatePickerModal } from "../../DatePickerModal-DUUCHAWF.js";
|
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";
|
@@ -1,2 +1,2 @@
|
|
1
1
|
export { DatePicker } from './DatePicker';
|
2
|
-
export type { DatePicker as TDatePickerProps } from './DatePicker';
|
2
|
+
export type { DatePicker as TDatePickerProps, TDatePickerValue } from './DatePicker';
|
@@ -7,7 +7,7 @@ export type TProps = TInputProps & {
|
|
7
7
|
*/
|
8
8
|
size?: TSize;
|
9
9
|
/**
|
10
|
-
*
|
10
|
+
* `Варианты отображения ввода. Может быть 'alert', 'success', 'default', 'default-gray', 'default-white'.`
|
11
11
|
*/
|
12
12
|
variant?: TVariant;
|
13
13
|
/**
|
@@ -37,7 +37,7 @@ export declare const Input: import('react').MemoExoticComponent<import('react').
|
|
37
37
|
*/
|
38
38
|
size?: TSize;
|
39
39
|
/**
|
40
|
-
*
|
40
|
+
* `Варианты отображения ввода. Может быть 'alert', 'success', 'default', 'default-gray', 'default-white'.`
|
41
41
|
*/
|
42
42
|
variant?: TVariant;
|
43
43
|
/**
|
@@ -7,7 +7,7 @@ export interface TRadioOption {
|
|
7
7
|
/**
|
8
8
|
* Свойства компонента RadioGroup.
|
9
9
|
*/
|
10
|
-
export type
|
10
|
+
export type TRadioGroupProps = Omit<RadioGroupProps, 'value'> & {
|
11
11
|
/**
|
12
12
|
* Массив опций для радиогруппы.
|
13
13
|
* Каждая опция должна содержать значение и метку.
|
@@ -27,4 +27,20 @@ export type TProps = Omit<RadioGroupProps, 'value'> & {
|
|
27
27
|
/**
|
28
28
|
* Компонент RadioGroup для выбора одной опции из нескольких.
|
29
29
|
*/
|
30
|
-
export declare
|
30
|
+
export declare const RadioGroup: import('react').ForwardRefExoticComponent<Omit<RadioGroupProps, "value"> & {
|
31
|
+
/**
|
32
|
+
* Массив опций для радиогруппы.
|
33
|
+
* Каждая опция должна содержать значение и метку.
|
34
|
+
*/
|
35
|
+
options: TRadioOption[];
|
36
|
+
/**
|
37
|
+
* Выбранное значение опции.
|
38
|
+
* Может быть необязательным, если нет выбранного значения.
|
39
|
+
*/
|
40
|
+
value?: TRadioOption["value"];
|
41
|
+
/**
|
42
|
+
* Текст метки, отображаемой над радиогруппой.
|
43
|
+
* Может быть необязательным.
|
44
|
+
*/
|
45
|
+
label?: string;
|
46
|
+
} & import('react').RefAttributes<HTMLElement>>;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
2
2
|
import { W, K, w, b as a, z as z$1, U, y, l, T, o, j as j$1, H, s, n, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, c as $6179b936705e76d3$export$ae780daf29e6d456, D, d as u$1, I, G, a as u$2, u as u$3, e as o$1, f as p, r } from "../../label-BXAcSLy0.js";
|
3
|
-
import React__default, { createContext, useId, useReducer, useRef, useMemo, useCallback, useContext } from "react";
|
3
|
+
import React__default, { createContext, useId, useReducer, useRef, useMemo, useCallback, useContext, forwardRef } from "react";
|
4
4
|
import { u, P, F, T as T$1, _ } from "../../focus-management-CFDo6ZSc.js";
|
5
5
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
6
6
|
import '../../assets/RadioGroup.css';var Le = ((e) => (e[e.RegisterOption = 0] = "RegisterOption", e[e.UnregisterOption = 1] = "UnregisterOption", e))(Le || {});
|
@@ -116,51 +116,57 @@ const cls = {
|
|
116
116
|
frame,
|
117
117
|
checked
|
118
118
|
};
|
119
|
-
|
120
|
-
options,
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
const radioClasses = classNames(cls["radio-wrapper"], {
|
127
|
-
[cls.disabled]: props.disabled
|
128
|
-
});
|
129
|
-
return /* @__PURE__ */ jsxs(Tt, { value, className: cls.group, onChange, ...props, children: [
|
130
|
-
label2 && /* @__PURE__ */ jsx(K, { as: "p", className: cls.label, children: label2 }),
|
131
|
-
/* @__PURE__ */ jsx("div", { className: cls["content-wrapper"], children: options.map(({ label: label22, value: value2 }) => /* @__PURE__ */ jsx(
|
132
|
-
Be,
|
119
|
+
const RadioGroup = forwardRef(
|
120
|
+
({ options, value, onChange, label: label2, ...props }, ref) => {
|
121
|
+
const radioClasses = classNames(cls["radio-wrapper"], {
|
122
|
+
[cls.disabled]: props.disabled
|
123
|
+
});
|
124
|
+
return /* @__PURE__ */ jsxs(
|
125
|
+
Tt,
|
133
126
|
{
|
134
|
-
|
135
|
-
value
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
127
|
+
ref,
|
128
|
+
value,
|
129
|
+
className: cls.group,
|
130
|
+
onChange,
|
131
|
+
...props,
|
132
|
+
children: [
|
133
|
+
label2 && /* @__PURE__ */ jsx(K, { as: "p", className: cls.label, children: label2 }),
|
134
|
+
/* @__PURE__ */ jsx("div", { className: cls["content-wrapper"], children: options.map(({ label: label22, value: value2 }) => /* @__PURE__ */ jsx(
|
135
|
+
Be,
|
141
136
|
{
|
142
|
-
as: "
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
children: /* @__PURE__ */
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
}
|
137
|
+
as: "span",
|
138
|
+
value: value2,
|
139
|
+
disabled: props.disabled,
|
140
|
+
className: radioClasses,
|
141
|
+
children: ({ checked: checked2, disabled: disabled2 }) => /* @__PURE__ */ jsxs(Fragment, { children: [
|
142
|
+
/* @__PURE__ */ jsx(
|
143
|
+
K,
|
144
|
+
{
|
145
|
+
as: "button",
|
146
|
+
className: classNames(cls.radio, {
|
147
|
+
[cls.disabled]: props.disabled
|
148
|
+
}),
|
149
|
+
children: /* @__PURE__ */ jsx(
|
150
|
+
"span",
|
151
|
+
{
|
152
|
+
className: classNames(cls.frame, {
|
153
|
+
[cls.checked]: checked2,
|
154
|
+
[cls.disabled]: disabled2
|
155
|
+
})
|
156
|
+
}
|
157
|
+
)
|
158
|
+
}
|
159
|
+
),
|
160
|
+
label22
|
161
|
+
] })
|
162
|
+
},
|
163
|
+
label22
|
164
|
+
)) })
|
165
|
+
]
|
166
|
+
}
|
167
|
+
);
|
168
|
+
}
|
169
|
+
);
|
164
170
|
export {
|
165
171
|
RadioGroup
|
166
172
|
};
|
@@ -1,2 +1,2 @@
|
|
1
1
|
export { RadioGroup } from './RadioGroup';
|
2
|
-
export type { TRadioOption } from './RadioGroup';
|
2
|
+
export type { TRadioOption, TRadioGroupProps } from './RadioGroup';
|
@@ -1,21 +1,15 @@
|
|
1
|
-
import {
|
1
|
+
import { ESelectSearchSize } from './constants';
|
2
2
|
|
3
|
-
export type
|
4
|
-
|
5
|
-
|
6
|
-
|
3
|
+
export type TSelectSearchItem = {
|
4
|
+
id: number;
|
5
|
+
name: string;
|
6
|
+
};
|
7
|
+
export type TSelectSearchProps = {
|
7
8
|
items: TSelectSearchItem[];
|
8
|
-
|
9
|
-
|
10
|
-
*/
|
9
|
+
value?: TSelectSearchItem | null;
|
10
|
+
onChange?: (value: TSelectSearchItem | null) => void;
|
11
11
|
placeholder?: string;
|
12
|
-
|
13
|
-
* Размер SelectSearch. Допустимые значения: `l`, `xxl`.
|
14
|
-
*/
|
15
|
-
size?: 'l' | 'xxl';
|
16
|
-
/**
|
17
|
-
* Флаг, указывающий, что элемент занимает все доступное пространство.
|
18
|
-
*/
|
12
|
+
size?: ESelectSearchSize;
|
19
13
|
full?: boolean;
|
20
14
|
};
|
21
|
-
export declare const SelectSearch: (
|
15
|
+
export declare const SelectSearch: import('react').ForwardRefExoticComponent<TSelectSearchProps & import('react').RefAttributes<HTMLElement>>;
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
3
|
import * as React from "react";
|
4
|
-
import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useState, useLayoutEffect, createContext, useContext, Fragment, createRef } from "react";
|
4
|
+
import React__default, { useReducer, useMemo, useSyncExternalStore, useId as useId$1, useEffect, useCallback, useRef, useState, useLayoutEffect, createContext, useContext, Fragment, createRef, forwardRef } from "react";
|
5
5
|
import { ESelectSearchSize } from "./constants.js";
|
6
6
|
import { useMediaQuery } from "../../hooks/useMediaQuery/useMediaQuery.js";
|
7
7
|
import { EMediaQuery } from "../../hooks/useMediaQuery/constants.js";
|
@@ -3841,125 +3841,121 @@ function No(o2, r2) {
|
|
3841
3841
|
return H({ ourProps: { id: d2, ref: M2, role: "option", tabIndex: s2 === true ? void 0 : -1, "aria-disabled": s2 === true ? true : void 0, "aria-selected": C, disabled: void 0, onMouseDown: y2, onFocus: A2, onPointerEnter: h2, onMouseEnter: h2, onPointerMove: O, onMouseMove: O, onPointerLeave: G2, onMouseLeave: G2 }, theirProps: a3, slot: J2, defaultTag: ko, name: "Combobox.Option" });
|
3842
3842
|
}
|
3843
3843
|
let Uo = W$1(ho), Ho = W$1(Vo), Go = W$1(Mo), jo = K, zo = W$1(Bo), Ko = W$1(No), Nt = Object.assign(Uo, { Input: Go, Button: Ho, Label: jo, Options: zo, Option: Ko });
|
3844
|
-
const container = "
|
3845
|
-
const full = "
|
3846
|
-
const placeholder = "
|
3847
|
-
const input = "
|
3848
|
-
const button = "
|
3849
|
-
const options = "
|
3850
|
-
const option = "
|
3851
|
-
const l = "
|
3852
|
-
const xxl = "
|
3844
|
+
const container = "_container_xswn2_6";
|
3845
|
+
const full = "_full_xswn2_20";
|
3846
|
+
const placeholder = "_placeholder_xswn2_28";
|
3847
|
+
const input = "_input_xswn2_43";
|
3848
|
+
const button = "_button_xswn2_61";
|
3849
|
+
const options = "_options_xswn2_69";
|
3850
|
+
const option = "_option_xswn2_69";
|
3851
|
+
const l = "_l_xswn2_118";
|
3852
|
+
const xxl = "_xxl_xswn2_128";
|
3853
3853
|
const cls = {
|
3854
|
-
"select-search": "_select-
|
3854
|
+
"select-search": "_select-search_xswn2_2",
|
3855
3855
|
container,
|
3856
|
-
"container-open": "_container-
|
3856
|
+
"container-open": "_container-open_xswn2_16",
|
3857
3857
|
full,
|
3858
|
-
"selectorIcon-open": "_selectorIcon-
|
3858
|
+
"selectorIcon-open": "_selectorIcon-open_xswn2_24",
|
3859
3859
|
placeholder,
|
3860
|
-
"placeholder-top": "_placeholder-
|
3860
|
+
"placeholder-top": "_placeholder-top_xswn2_37",
|
3861
3861
|
input,
|
3862
|
-
"input-container": "_input-
|
3862
|
+
"input-container": "_input-container_xswn2_55",
|
3863
3863
|
button,
|
3864
3864
|
options,
|
3865
3865
|
option,
|
3866
|
-
"option-active": "_option-
|
3867
|
-
"option-inner": "_option-
|
3868
|
-
"no-options": "_no-
|
3866
|
+
"option-active": "_option-active_xswn2_103",
|
3867
|
+
"option-inner": "_option-inner_xswn2_106",
|
3868
|
+
"no-options": "_no-options_xswn2_113",
|
3869
3869
|
l,
|
3870
3870
|
xxl,
|
3871
|
-
"selected-icon": "_selected-
|
3871
|
+
"selected-icon": "_selected-icon_xswn2_138"
|
3872
3872
|
};
|
3873
|
-
const SelectSearch = (
|
3874
|
-
items,
|
3875
|
-
|
3876
|
-
|
3877
|
-
|
3878
|
-
|
3879
|
-
|
3880
|
-
|
3881
|
-
|
3882
|
-
|
3883
|
-
|
3884
|
-
|
3885
|
-
|
3886
|
-
|
3887
|
-
|
3888
|
-
|
3889
|
-
|
3890
|
-
|
3891
|
-
|
3892
|
-
|
3893
|
-
|
3894
|
-
|
3895
|
-
|
3896
|
-
|
3897
|
-
|
3898
|
-
|
3899
|
-
|
3900
|
-
|
3901
|
-
|
3902
|
-
|
3903
|
-
|
3904
|
-
|
3905
|
-
|
3906
|
-
|
3907
|
-
|
3908
|
-
|
3909
|
-
|
3910
|
-
|
3873
|
+
const SelectSearch = forwardRef(
|
3874
|
+
({ items, placeholder: placeholder2, size: size2 = ESelectSearchSize.L, onChange, value, full: full2 }, ref) => {
|
3875
|
+
const [searchValue, setSearchValue] = useState("");
|
3876
|
+
const [isItemSelected, setIsItemSelected] = useState(false);
|
3877
|
+
const isMobile = useMediaQuery(EMediaQuery.XSS);
|
3878
|
+
const filteredItems = useMemo(() => {
|
3879
|
+
return searchValue.trim().toLowerCase() ? items.filter(
|
3880
|
+
(item) => item.name.toLowerCase().includes(searchValue.toLowerCase())
|
3881
|
+
) : items;
|
3882
|
+
}, [searchValue, items]);
|
3883
|
+
const handleOneChange = (newValue) => {
|
3884
|
+
onChange == null ? void 0 : onChange(newValue);
|
3885
|
+
setIsItemSelected(!!newValue);
|
3886
|
+
};
|
3887
|
+
return /* @__PURE__ */ jsx(
|
3888
|
+
Nt,
|
3889
|
+
{
|
3890
|
+
as: "div",
|
3891
|
+
onChange: handleOneChange,
|
3892
|
+
value,
|
3893
|
+
className: classNames(cls["select-search"], { [cls.full]: full2 }),
|
3894
|
+
ref,
|
3895
|
+
children: ({ open }) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
3896
|
+
/* @__PURE__ */ jsxs(
|
3897
|
+
"div",
|
3898
|
+
{
|
3899
|
+
className: classNames(cls.container, cls[size2], {
|
3900
|
+
[cls["container-open"]]: open
|
3901
|
+
}),
|
3902
|
+
children: [
|
3903
|
+
/* @__PURE__ */ jsxs("div", { className: cls["input-container"], children: [
|
3904
|
+
/* @__PURE__ */ jsx(
|
3905
|
+
Go,
|
3906
|
+
{
|
3907
|
+
className: cls.input,
|
3908
|
+
onChange: (event) => setSearchValue(event.target.value),
|
3909
|
+
displayValue: (item) => item == null ? void 0 : item.name
|
3910
|
+
}
|
3911
|
+
),
|
3912
|
+
/* @__PURE__ */ jsx(
|
3913
|
+
"span",
|
3914
|
+
{
|
3915
|
+
className: classNames(cls.placeholder, {
|
3916
|
+
[cls["placeholder-top"]]: isItemSelected || open || searchValue
|
3917
|
+
}),
|
3918
|
+
children: placeholder2
|
3919
|
+
}
|
3920
|
+
)
|
3921
|
+
] }),
|
3922
|
+
/* @__PURE__ */ jsx(Ho, { className: cls.button, children: /* @__PURE__ */ jsx(
|
3923
|
+
Icon,
|
3911
3924
|
{
|
3912
|
-
|
3913
|
-
|
3914
|
-
|
3925
|
+
iconName: isMobile ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
|
3926
|
+
className: classNames(cls["selector-icon"], {
|
3927
|
+
[cls["selector-icon-open"]]: open
|
3928
|
+
})
|
3915
3929
|
}
|
3916
|
-
)
|
3917
|
-
|
3918
|
-
|
3930
|
+
) })
|
3931
|
+
]
|
3932
|
+
}
|
3933
|
+
),
|
3934
|
+
/* @__PURE__ */ jsx(zo, { className: classNames(cls.options, cls[size2]), children: !items.length ? /* @__PURE__ */ jsx("div", { className: cls["no-options"], children: "Нет данных" }) : !filteredItems.length && searchValue.trim() ? /* @__PURE__ */ jsx("div", { className: cls["no-options"], children: "Ничего не найдено" }) : filteredItems.map((item) => /* @__PURE__ */ jsx(
|
3935
|
+
Ko,
|
3936
|
+
{
|
3937
|
+
value: item,
|
3938
|
+
className: ({ focus }) => classNames(cls.option, {
|
3939
|
+
[cls["option-active"]]: focus
|
3940
|
+
}),
|
3941
|
+
children: ({ selected }) => /* @__PURE__ */ jsxs("div", { className: cls["option-inner"], children: [
|
3942
|
+
/* @__PURE__ */ jsx("span", { className: cls["option-text"], children: item.name }),
|
3943
|
+
selected && /* @__PURE__ */ jsx(
|
3944
|
+
Icon,
|
3919
3945
|
{
|
3920
|
-
|
3921
|
-
|
3922
|
-
}),
|
3923
|
-
children: placeholder2
|
3946
|
+
iconName: "Done16px",
|
3947
|
+
className: cls["selected-icon"]
|
3924
3948
|
}
|
3925
3949
|
)
|
3926
|
-
] })
|
3927
|
-
|
3928
|
-
|
3929
|
-
|
3930
|
-
|
3931
|
-
|
3932
|
-
|
3933
|
-
|
3934
|
-
|
3935
|
-
) })
|
3936
|
-
]
|
3937
|
-
}
|
3938
|
-
),
|
3939
|
-
/* @__PURE__ */ jsx(zo, { className: classNames(cls.options, cls[size2]), children: !items.length ? /* @__PURE__ */ jsx("div", { className: cls["no-options"], children: "Нет данных" }) : !filteredItems.length && searchValue.trim() ? /* @__PURE__ */ jsx("div", { className: cls["no-options"], children: "Ничего не найдено" }) : filteredItems.map((item) => /* @__PURE__ */ jsx(
|
3940
|
-
Ko,
|
3941
|
-
{
|
3942
|
-
value: item,
|
3943
|
-
className: ({ focus }) => classNames(cls.option, {
|
3944
|
-
[cls["option-active"]]: focus
|
3945
|
-
}),
|
3946
|
-
children: ({ selected }) => /* @__PURE__ */ jsxs("div", { className: cls["option-inner"], children: [
|
3947
|
-
/* @__PURE__ */ jsx("span", { className: cls["option-text"], children: item.name }),
|
3948
|
-
selected && /* @__PURE__ */ jsx(
|
3949
|
-
Icon,
|
3950
|
-
{
|
3951
|
-
iconName: "Done16px",
|
3952
|
-
className: cls["selected-icon"]
|
3953
|
-
}
|
3954
|
-
)
|
3955
|
-
] })
|
3956
|
-
},
|
3957
|
-
item.id
|
3958
|
-
)) })
|
3959
|
-
] })
|
3960
|
-
}
|
3961
|
-
);
|
3962
|
-
};
|
3950
|
+
] })
|
3951
|
+
},
|
3952
|
+
item.id
|
3953
|
+
)) })
|
3954
|
+
] })
|
3955
|
+
}
|
3956
|
+
);
|
3957
|
+
}
|
3958
|
+
);
|
3963
3959
|
export {
|
3964
3960
|
SelectSearch
|
3965
3961
|
};
|
@@ -1,3 +1,2 @@
|
|
1
|
-
export { SelectSearch, type
|
1
|
+
export { SelectSearch, type TSelectSearchProps, type TSelectSearchItem } from './SelectSearch';
|
2
2
|
export { ESelectSearchSize } from './constants';
|
3
|
-
export type { TSelectSearchItem, TSelectSearchSize } from './types';
|
@@ -1,4 +1,294 @@
|
|
1
|
-
import {
|
2
|
-
import { TSwitchProps } from './types';
|
1
|
+
import { CheckboxProps } from '@headlessui/react';
|
3
2
|
|
4
|
-
export
|
3
|
+
export type TSwitchProps = CheckboxProps;
|
4
|
+
export declare const Switch: import('react').ForwardRefExoticComponent<{
|
5
|
+
suppressHydrationWarning?: boolean | undefined;
|
6
|
+
color?: string | undefined;
|
7
|
+
id?: string | undefined;
|
8
|
+
lang?: string | undefined;
|
9
|
+
style?: import('react').CSSProperties | undefined;
|
10
|
+
"aria-activedescendant"?: string | undefined;
|
11
|
+
"aria-atomic"?: (boolean | "true" | "false") | undefined;
|
12
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
|
13
|
+
"aria-braillelabel"?: string | undefined;
|
14
|
+
"aria-brailleroledescription"?: string | undefined;
|
15
|
+
"aria-busy"?: (boolean | "true" | "false") | undefined;
|
16
|
+
"aria-colcount"?: number | undefined;
|
17
|
+
"aria-colindex"?: number | undefined;
|
18
|
+
"aria-colindextext"?: string | undefined;
|
19
|
+
"aria-colspan"?: number | undefined;
|
20
|
+
"aria-controls"?: string | undefined;
|
21
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
|
22
|
+
"aria-description"?: string | undefined;
|
23
|
+
"aria-details"?: string | undefined;
|
24
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
|
25
|
+
"aria-errormessage"?: string | undefined;
|
26
|
+
"aria-expanded"?: (boolean | "true" | "false") | undefined;
|
27
|
+
"aria-flowto"?: string | undefined;
|
28
|
+
"aria-grabbed"?: (boolean | "true" | "false") | undefined;
|
29
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
|
30
|
+
"aria-hidden"?: (boolean | "true" | "false") | undefined;
|
31
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
|
32
|
+
"aria-keyshortcuts"?: string | undefined;
|
33
|
+
"aria-label"?: string | undefined;
|
34
|
+
"aria-level"?: number | undefined;
|
35
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined;
|
36
|
+
"aria-modal"?: (boolean | "true" | "false") | undefined;
|
37
|
+
"aria-multiline"?: (boolean | "true" | "false") | undefined;
|
38
|
+
"aria-multiselectable"?: (boolean | "true" | "false") | undefined;
|
39
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined;
|
40
|
+
"aria-owns"?: string | undefined;
|
41
|
+
"aria-placeholder"?: string | undefined;
|
42
|
+
"aria-posinset"?: number | undefined;
|
43
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
|
44
|
+
"aria-readonly"?: (boolean | "true" | "false") | undefined;
|
45
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
|
46
|
+
"aria-required"?: (boolean | "true" | "false") | undefined;
|
47
|
+
"aria-roledescription"?: string | undefined;
|
48
|
+
"aria-rowcount"?: number | undefined;
|
49
|
+
"aria-rowindex"?: number | undefined;
|
50
|
+
"aria-rowindextext"?: string | undefined;
|
51
|
+
"aria-rowspan"?: number | undefined;
|
52
|
+
"aria-selected"?: (boolean | "true" | "false") | undefined;
|
53
|
+
"aria-setsize"?: number | undefined;
|
54
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
|
55
|
+
"aria-valuemax"?: number | undefined;
|
56
|
+
"aria-valuemin"?: number | undefined;
|
57
|
+
"aria-valuenow"?: number | undefined;
|
58
|
+
"aria-valuetext"?: string | undefined;
|
59
|
+
dangerouslySetInnerHTML?: {
|
60
|
+
__html: string | TrustedHTML;
|
61
|
+
} | undefined;
|
62
|
+
onCopy?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
63
|
+
onCopyCapture?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
64
|
+
onCut?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
65
|
+
onCutCapture?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
66
|
+
onPaste?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
67
|
+
onPasteCapture?: import('react').ClipboardEventHandler<HTMLSpanElement> | undefined;
|
68
|
+
onCompositionEnd?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
69
|
+
onCompositionEndCapture?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
70
|
+
onCompositionStart?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
71
|
+
onCompositionStartCapture?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
72
|
+
onCompositionUpdate?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
73
|
+
onCompositionUpdateCapture?: import('react').CompositionEventHandler<HTMLSpanElement> | undefined;
|
74
|
+
onFocus?: import('react').FocusEventHandler<HTMLSpanElement> | undefined;
|
75
|
+
onFocusCapture?: import('react').FocusEventHandler<HTMLSpanElement> | undefined;
|
76
|
+
onBlur?: import('react').FocusEventHandler<HTMLSpanElement> | undefined;
|
77
|
+
onBlurCapture?: import('react').FocusEventHandler<HTMLSpanElement> | undefined;
|
78
|
+
onChangeCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
79
|
+
onBeforeInput?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
80
|
+
onBeforeInputCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
81
|
+
onInput?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
82
|
+
onInputCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
83
|
+
onReset?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
84
|
+
onResetCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
85
|
+
onSubmit?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
86
|
+
onSubmitCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
87
|
+
onInvalid?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
88
|
+
onInvalidCapture?: import('react').FormEventHandler<HTMLSpanElement> | undefined;
|
89
|
+
onLoad?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
90
|
+
onLoadCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
91
|
+
onError?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
92
|
+
onErrorCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
93
|
+
onKeyDown?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
94
|
+
onKeyDownCapture?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
95
|
+
onKeyPress?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
96
|
+
onKeyPressCapture?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
97
|
+
onKeyUp?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
98
|
+
onKeyUpCapture?: import('react').KeyboardEventHandler<HTMLSpanElement> | undefined;
|
99
|
+
onAbort?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
100
|
+
onAbortCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
101
|
+
onCanPlay?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
102
|
+
onCanPlayCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
103
|
+
onCanPlayThrough?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
104
|
+
onCanPlayThroughCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
105
|
+
onDurationChange?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
106
|
+
onDurationChangeCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
107
|
+
onEmptied?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
108
|
+
onEmptiedCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
109
|
+
onEncrypted?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
110
|
+
onEncryptedCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
111
|
+
onEnded?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
112
|
+
onEndedCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
113
|
+
onLoadedData?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
114
|
+
onLoadedDataCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
115
|
+
onLoadedMetadata?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
116
|
+
onLoadedMetadataCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
117
|
+
onLoadStart?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
118
|
+
onLoadStartCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
119
|
+
onPause?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
120
|
+
onPauseCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
121
|
+
onPlay?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
122
|
+
onPlayCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
123
|
+
onPlaying?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
124
|
+
onPlayingCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
125
|
+
onProgress?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
126
|
+
onProgressCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
127
|
+
onRateChange?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
128
|
+
onRateChangeCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
129
|
+
onResize?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
130
|
+
onResizeCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
131
|
+
onSeeked?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
132
|
+
onSeekedCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
133
|
+
onSeeking?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
134
|
+
onSeekingCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
135
|
+
onStalled?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
136
|
+
onStalledCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
137
|
+
onSuspend?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
138
|
+
onSuspendCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
139
|
+
onTimeUpdate?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
140
|
+
onTimeUpdateCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
141
|
+
onVolumeChange?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
142
|
+
onVolumeChangeCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
143
|
+
onWaiting?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
144
|
+
onWaitingCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
145
|
+
onAuxClick?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
146
|
+
onAuxClickCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
147
|
+
onClick?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
148
|
+
onClickCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
149
|
+
onContextMenu?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
150
|
+
onContextMenuCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
151
|
+
onDoubleClick?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
152
|
+
onDoubleClickCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
153
|
+
onDrag?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
154
|
+
onDragCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
155
|
+
onDragEnd?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
156
|
+
onDragEndCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
157
|
+
onDragEnter?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
158
|
+
onDragEnterCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
159
|
+
onDragExit?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
160
|
+
onDragExitCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
161
|
+
onDragLeave?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
162
|
+
onDragLeaveCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
163
|
+
onDragOver?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
164
|
+
onDragOverCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
165
|
+
onDragStart?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
166
|
+
onDragStartCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
167
|
+
onDrop?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
168
|
+
onDropCapture?: import('react').DragEventHandler<HTMLSpanElement> | undefined;
|
169
|
+
onMouseDown?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
170
|
+
onMouseDownCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
171
|
+
onMouseEnter?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
172
|
+
onMouseLeave?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
173
|
+
onMouseMove?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
174
|
+
onMouseMoveCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
175
|
+
onMouseOut?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
176
|
+
onMouseOutCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
177
|
+
onMouseOver?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
178
|
+
onMouseOverCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
179
|
+
onMouseUp?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
180
|
+
onMouseUpCapture?: import('react').MouseEventHandler<HTMLSpanElement> | undefined;
|
181
|
+
onSelect?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
182
|
+
onSelectCapture?: import('react').ReactEventHandler<HTMLSpanElement> | undefined;
|
183
|
+
onTouchCancel?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
184
|
+
onTouchCancelCapture?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
185
|
+
onTouchEnd?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
186
|
+
onTouchEndCapture?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
187
|
+
onTouchMove?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
188
|
+
onTouchMoveCapture?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
189
|
+
onTouchStart?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
190
|
+
onTouchStartCapture?: import('react').TouchEventHandler<HTMLSpanElement> | undefined;
|
191
|
+
onPointerDown?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
192
|
+
onPointerDownCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
193
|
+
onPointerMove?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
194
|
+
onPointerMoveCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
195
|
+
onPointerUp?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
196
|
+
onPointerUpCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
197
|
+
onPointerCancel?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
198
|
+
onPointerCancelCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
199
|
+
onPointerEnter?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
200
|
+
onPointerLeave?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
201
|
+
onPointerOver?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
202
|
+
onPointerOverCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
203
|
+
onPointerOut?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
204
|
+
onPointerOutCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
205
|
+
onGotPointerCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
206
|
+
onGotPointerCaptureCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
207
|
+
onLostPointerCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
208
|
+
onLostPointerCaptureCapture?: import('react').PointerEventHandler<HTMLSpanElement> | undefined;
|
209
|
+
onScroll?: import('react').UIEventHandler<HTMLSpanElement> | undefined;
|
210
|
+
onScrollCapture?: import('react').UIEventHandler<HTMLSpanElement> | undefined;
|
211
|
+
onWheel?: import('react').WheelEventHandler<HTMLSpanElement> | undefined;
|
212
|
+
onWheelCapture?: import('react').WheelEventHandler<HTMLSpanElement> | undefined;
|
213
|
+
onAnimationStart?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
214
|
+
onAnimationStartCapture?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
215
|
+
onAnimationEnd?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
216
|
+
onAnimationEndCapture?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
217
|
+
onAnimationIteration?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
218
|
+
onAnimationIterationCapture?: import('react').AnimationEventHandler<HTMLSpanElement> | undefined;
|
219
|
+
onTransitionEnd?: import('react').TransitionEventHandler<HTMLSpanElement> | undefined;
|
220
|
+
onTransitionEndCapture?: import('react').TransitionEventHandler<HTMLSpanElement> | undefined;
|
221
|
+
key?: import('react').Key | null | undefined;
|
222
|
+
slot?: string | undefined;
|
223
|
+
title?: string | undefined;
|
224
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
225
|
+
suppressContentEditableWarning?: boolean | undefined;
|
226
|
+
accessKey?: string | undefined;
|
227
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
|
228
|
+
contextMenu?: string | undefined;
|
229
|
+
dir?: string | undefined;
|
230
|
+
draggable?: (boolean | "true" | "false") | undefined;
|
231
|
+
hidden?: boolean | undefined;
|
232
|
+
nonce?: string | undefined;
|
233
|
+
spellCheck?: (boolean | "true" | "false") | undefined;
|
234
|
+
translate?: "yes" | "no" | undefined;
|
235
|
+
radioGroup?: string | undefined;
|
236
|
+
about?: string | undefined;
|
237
|
+
content?: string | undefined;
|
238
|
+
datatype?: string | undefined;
|
239
|
+
inlist?: any;
|
240
|
+
prefix?: string | undefined;
|
241
|
+
property?: string | undefined;
|
242
|
+
rel?: string | undefined;
|
243
|
+
resource?: string | undefined;
|
244
|
+
rev?: string | undefined;
|
245
|
+
typeof?: string | undefined;
|
246
|
+
vocab?: string | undefined;
|
247
|
+
autoCapitalize?: string | undefined;
|
248
|
+
autoCorrect?: string | undefined;
|
249
|
+
autoSave?: string | undefined;
|
250
|
+
itemProp?: string | undefined;
|
251
|
+
itemScope?: boolean | undefined;
|
252
|
+
itemType?: string | undefined;
|
253
|
+
itemID?: string | undefined;
|
254
|
+
itemRef?: string | undefined;
|
255
|
+
results?: number | undefined;
|
256
|
+
security?: string | undefined;
|
257
|
+
unselectable?: "on" | "off" | undefined;
|
258
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
|
259
|
+
is?: string | undefined;
|
260
|
+
} & {
|
261
|
+
as?: "span" | undefined;
|
262
|
+
children?: import('react').ReactNode | ((bag: {
|
263
|
+
checked: boolean;
|
264
|
+
changing: boolean;
|
265
|
+
focus: boolean;
|
266
|
+
active: boolean;
|
267
|
+
hover: boolean;
|
268
|
+
autofocus: boolean;
|
269
|
+
disabled: boolean;
|
270
|
+
indeterminate: boolean;
|
271
|
+
}) => import('react').ReactElement);
|
272
|
+
refName?: string;
|
273
|
+
} & {
|
274
|
+
className?: string | ((bag: {
|
275
|
+
checked: boolean;
|
276
|
+
changing: boolean;
|
277
|
+
focus: boolean;
|
278
|
+
active: boolean;
|
279
|
+
hover: boolean;
|
280
|
+
autofocus: boolean;
|
281
|
+
disabled: boolean;
|
282
|
+
indeterminate: boolean;
|
283
|
+
}) => string) | undefined;
|
284
|
+
} & {
|
285
|
+
value?: string | undefined;
|
286
|
+
disabled?: boolean;
|
287
|
+
indeterminate?: boolean;
|
288
|
+
checked?: boolean;
|
289
|
+
defaultChecked?: boolean;
|
290
|
+
autoFocus?: boolean;
|
291
|
+
form?: string;
|
292
|
+
name?: string;
|
293
|
+
onChange?: (checked: boolean) => void;
|
294
|
+
} & import('react').RefAttributes<HTMLInputElement>>;
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
2
2
|
import { c as classNames } from "../../index-CweZ_OcN.js";
|
3
|
-
import React__default, { useId, useState, useMemo, useCallback } from "react";
|
3
|
+
import React__default, { useId, useState, useMemo, useCallback, forwardRef, useEffect } from "react";
|
4
4
|
import { Icon } from "../../icons/Icon.js";
|
5
5
|
import { W, d as u, b as a, l, T, I, G, p, o, $ as $f7dceffc5ad7768b$export$4e328f61c538687f, c as $6179b936705e76d3$export$ae780daf29e6d456, D, j, H, r, e as o$1, f as p$1 } from "../../label-BXAcSLy0.js";
|
6
6
|
import { w } from "../../use-active-press-9MCrfRZk.js";
|
@@ -26,27 +26,32 @@ const cls = {
|
|
26
26
|
"switch": "_switch_1g34c_2",
|
27
27
|
enabled
|
28
28
|
};
|
29
|
-
const Switch = (
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
29
|
+
const Switch = forwardRef(
|
30
|
+
(props, ref) => {
|
31
|
+
const { checked, onChange, ...restProps } = props;
|
32
|
+
const [enabled2, setEnabled] = useState(checked);
|
33
|
+
const handleChange = (value) => {
|
34
|
+
setEnabled(value);
|
35
|
+
onChange == null ? void 0 : onChange(value);
|
36
|
+
};
|
37
|
+
useEffect(() => {
|
38
|
+
setEnabled(!!checked);
|
39
|
+
}, [checked]);
|
40
|
+
return /* @__PURE__ */ jsx(
|
41
|
+
Re,
|
42
|
+
{
|
43
|
+
ref,
|
44
|
+
checked: enabled2,
|
45
|
+
onChange: handleChange,
|
46
|
+
className: classNames(cls.switch, {
|
47
|
+
[cls.enabled]: enabled2
|
48
|
+
}),
|
49
|
+
...restProps,
|
50
|
+
children: /* @__PURE__ */ jsx(Icon, { iconName: "Done16px" })
|
51
|
+
}
|
52
|
+
);
|
53
|
+
}
|
54
|
+
);
|
50
55
|
export {
|
51
56
|
Switch
|
52
57
|
};
|
@@ -1,2 +1,2 @@
|
|
1
1
|
export { Switch } from './Switch';
|
2
|
-
export type { TSwitchProps } from './
|
2
|
+
export type { TSwitchProps } from './Switch';
|
@@ -6,9 +6,9 @@ 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
10
|
export { DatePicker } from './DatePicker';
|
11
|
-
export type { TDatePickerProps } from './DatePicker';
|
11
|
+
export type { TDatePickerProps, TDatePickerValue } from './DatePicker';
|
12
12
|
export { MergedButton } from './MergedButton';
|
13
13
|
export { EMergedButtonVariantRound } from './MergedButton';
|
14
14
|
export type { TButtonPropsWithoutStyles } from './MergedButton';
|
@@ -20,6 +20,6 @@ export { EDrawerPosition } from './Drawer';
|
|
20
20
|
export { Steps, EStepsPrimaryColor, EStepsSecondaryColor, EStepsSize, type TCommonStepsProps } from './Steps';
|
21
21
|
export { Vote, EVoteSize, type TCommonVoteProps } from './Vote';
|
22
22
|
export { SelectSearch, ESelectSearchSize } from './SelectSearch';
|
23
|
-
export type { TSelectSearchItem, TSelectSearchProps
|
23
|
+
export type { TSelectSearchItem, TSelectSearchProps } from './SelectSearch';
|
24
24
|
export { Switch } from './Switch';
|
25
25
|
export type { TSwitchProps } from './Switch';
|
package/package.json
CHANGED
@@ -1,17 +0,0 @@
|
|
1
|
-
import { ESelectSearchSize } from './constants';
|
2
|
-
|
3
|
-
export type TSelectSearchItem = {
|
4
|
-
id: number;
|
5
|
-
name: string;
|
6
|
-
};
|
7
|
-
export type TSelectSearchProps = {
|
8
|
-
items: TSelectSearchItem[];
|
9
|
-
value?: TSelectSearchItem | null;
|
10
|
-
onChange?: (value: TSelectSearchItem | null) => void;
|
11
|
-
placeholder?: string;
|
12
|
-
size?: TSelectSearchSize;
|
13
|
-
full?: boolean;
|
14
|
-
};
|
15
|
-
export type TSelectSearchSize = {
|
16
|
-
size?: ESelectSearchSize;
|
17
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
|
@@ -1 +0,0 @@
|
|
1
|
-
|