@salutejs/plasma-new-hope 0.146.0-canary.1436.10882554984.0 → 0.147.0-canary.1418.10899581491.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Mask/Mask.js +209 -0
- package/cjs/components/Mask/Mask.js.map +1 -0
- package/cjs/components/Mask/utils/constants.js +33 -0
- package/cjs/components/Mask/utils/constants.js.map +1 -0
- package/cjs/components/Mask/utils/createMask.js +53 -0
- package/cjs/components/Mask/utils/createMask.js.map +1 -0
- package/cjs/components/Mask/utils/mask.js +244 -0
- package/cjs/components/Mask/utils/mask.js.map +1 -0
- package/cjs/components/Mask/utils/parseMask.js +38 -0
- package/cjs/components/Mask/utils/parseMask.js.map +1 -0
- package/cjs/components/Mask/utils/processInput.js +54 -0
- package/cjs/components/Mask/utils/processInput.js.map +1 -0
- package/cjs/components/Mask/utils/processMask.js +101 -0
- package/cjs/components/Mask/utils/processMask.js.map +1 -0
- package/cjs/components/Mask/utils/selection.js +50 -0
- package/cjs/components/Mask/utils/selection.js.map +1 -0
- package/cjs/components/TextField/TextField.js +3 -1
- package/cjs/components/TextField/TextField.js.map +1 -1
- package/cjs/index.js +2 -0
- package/cjs/index.js.map +1 -1
- package/emotion/cjs/components/Mask/Mask.js +220 -0
- package/emotion/cjs/components/Mask/Mask.template-doc.mdx +126 -0
- package/emotion/cjs/components/Mask/Mask.types.js +5 -0
- package/emotion/cjs/components/Mask/index.js +12 -0
- package/emotion/cjs/components/Mask/utils/constants.js +29 -0
- package/emotion/cjs/components/Mask/utils/createMask.js +50 -0
- package/emotion/cjs/components/Mask/utils/mask.js +247 -0
- package/emotion/cjs/components/Mask/utils/parseMask.js +36 -0
- package/emotion/cjs/components/Mask/utils/processInput.js +52 -0
- package/emotion/cjs/components/Mask/utils/processMask.js +99 -0
- package/emotion/cjs/components/Mask/utils/selection.js +48 -0
- package/emotion/cjs/components/TextField/TextField.js +4 -2
- package/emotion/cjs/examples/plasma_b2c/components/Mask/Mask.js +9 -0
- package/emotion/cjs/examples/plasma_b2c/components/Mask/Mask.stories.tsx +127 -0
- package/emotion/cjs/examples/plasma_web/components/Mask/Mask.js +9 -0
- package/emotion/cjs/examples/plasma_web/components/Mask/Mask.stories.tsx +125 -0
- package/emotion/cjs/index.js +11 -0
- package/emotion/es/components/Mask/Mask.js +212 -0
- package/emotion/es/components/Mask/Mask.template-doc.mdx +126 -0
- package/emotion/es/components/Mask/Mask.types.js +1 -0
- package/emotion/es/components/Mask/index.js +1 -0
- package/emotion/es/components/Mask/utils/constants.js +23 -0
- package/emotion/es/components/Mask/utils/createMask.js +44 -0
- package/emotion/es/components/Mask/utils/mask.js +243 -0
- package/emotion/es/components/Mask/utils/parseMask.js +30 -0
- package/emotion/es/components/Mask/utils/processInput.js +46 -0
- package/emotion/es/components/Mask/utils/processMask.js +93 -0
- package/emotion/es/components/Mask/utils/selection.js +42 -0
- package/emotion/es/components/TextField/TextField.js +4 -2
- package/emotion/es/examples/plasma_b2c/components/Mask/Mask.js +3 -0
- package/emotion/es/examples/plasma_b2c/components/Mask/Mask.stories.tsx +127 -0
- package/emotion/es/examples/plasma_web/components/Mask/Mask.js +3 -0
- package/emotion/es/examples/plasma_web/components/Mask/Mask.stories.tsx +125 -0
- package/emotion/es/index.js +2 -1
- package/es/components/Mask/Mask.js +205 -0
- package/es/components/Mask/Mask.js.map +1 -0
- package/es/components/Mask/utils/constants.js +26 -0
- package/es/components/Mask/utils/constants.js.map +1 -0
- package/es/components/Mask/utils/createMask.js +48 -0
- package/es/components/Mask/utils/createMask.js.map +1 -0
- package/es/components/Mask/utils/mask.js +240 -0
- package/es/components/Mask/utils/mask.js.map +1 -0
- package/es/components/Mask/utils/parseMask.js +34 -0
- package/es/components/Mask/utils/parseMask.js.map +1 -0
- package/es/components/Mask/utils/processInput.js +50 -0
- package/es/components/Mask/utils/processInput.js.map +1 -0
- package/es/components/Mask/utils/processMask.js +97 -0
- package/es/components/Mask/utils/processMask.js.map +1 -0
- package/es/components/Mask/utils/selection.js +46 -0
- package/es/components/Mask/utils/selection.js.map +1 -0
- package/es/components/TextField/TextField.js +3 -1
- package/es/components/TextField/TextField.js.map +1 -1
- package/es/index.js +1 -0
- package/es/index.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Mask/Mask.js +220 -0
- package/styled-components/cjs/components/Mask/Mask.template-doc.mdx +126 -0
- package/styled-components/cjs/components/Mask/Mask.types.js +5 -0
- package/styled-components/cjs/components/Mask/index.js +12 -0
- package/styled-components/cjs/components/Mask/utils/constants.js +29 -0
- package/styled-components/cjs/components/Mask/utils/createMask.js +50 -0
- package/styled-components/cjs/components/Mask/utils/mask.js +247 -0
- package/styled-components/cjs/components/Mask/utils/parseMask.js +36 -0
- package/styled-components/cjs/components/Mask/utils/processInput.js +52 -0
- package/styled-components/cjs/components/Mask/utils/processMask.js +99 -0
- package/styled-components/cjs/components/Mask/utils/selection.js +48 -0
- package/styled-components/cjs/components/TextField/TextField.js +3 -1
- package/styled-components/cjs/examples/plasma_b2c/components/Mask/Mask.js +9 -0
- package/styled-components/cjs/examples/plasma_b2c/components/Mask/Mask.stories.tsx +127 -0
- package/styled-components/cjs/examples/plasma_web/components/Mask/Mask.js +9 -0
- package/styled-components/cjs/examples/plasma_web/components/Mask/Mask.stories.tsx +125 -0
- package/styled-components/cjs/index.js +11 -0
- package/styled-components/es/components/Mask/Mask.js +212 -0
- package/styled-components/es/components/Mask/Mask.template-doc.mdx +126 -0
- package/styled-components/es/components/Mask/Mask.types.js +1 -0
- package/styled-components/es/components/Mask/index.js +1 -0
- package/styled-components/es/components/Mask/utils/constants.js +23 -0
- package/styled-components/es/components/Mask/utils/createMask.js +44 -0
- package/styled-components/es/components/Mask/utils/mask.js +243 -0
- package/styled-components/es/components/Mask/utils/parseMask.js +30 -0
- package/styled-components/es/components/Mask/utils/processInput.js +46 -0
- package/styled-components/es/components/Mask/utils/processMask.js +93 -0
- package/styled-components/es/components/Mask/utils/selection.js +42 -0
- package/styled-components/es/components/TextField/TextField.js +3 -1
- package/styled-components/es/examples/plasma_b2c/components/Mask/Mask.js +3 -0
- package/styled-components/es/examples/plasma_b2c/components/Mask/Mask.stories.tsx +127 -0
- package/styled-components/es/examples/plasma_web/components/Mask/Mask.js +3 -0
- package/styled-components/es/examples/plasma_web/components/Mask/Mask.stories.tsx +125 -0
- package/styled-components/es/index.js +2 -1
- package/types/components/Mask/Mask.d.ts +5 -0
- package/types/components/Mask/Mask.d.ts.map +1 -0
- package/types/components/Mask/Mask.types.d.ts +84 -0
- package/types/components/Mask/Mask.types.d.ts.map +1 -0
- package/types/components/Mask/index.d.ts +2 -0
- package/types/components/Mask/index.d.ts.map +1 -0
- package/types/components/Mask/utils/constants.d.ts +15 -0
- package/types/components/Mask/utils/constants.d.ts.map +1 -0
- package/types/components/Mask/utils/createMask.d.ts +19 -0
- package/types/components/Mask/utils/createMask.d.ts.map +1 -0
- package/types/components/Mask/utils/mask.d.ts +48 -0
- package/types/components/Mask/utils/mask.d.ts.map +1 -0
- package/types/components/Mask/utils/parseMask.d.ts +3 -0
- package/types/components/Mask/utils/parseMask.d.ts.map +1 -0
- package/types/components/Mask/utils/processInput.d.ts +13 -0
- package/types/components/Mask/utils/processInput.d.ts.map +1 -0
- package/types/components/Mask/utils/processMask.d.ts +7 -0
- package/types/components/Mask/utils/processMask.d.ts.map +1 -0
- package/types/components/Mask/utils/selection.d.ts +10 -0
- package/types/components/Mask/utils/selection.d.ts.map +1 -0
- package/types/components/TextField/TextField.d.ts.map +1 -1
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts +191 -0
- package/types/examples/plasma_b2c/components/Mask/Mask.d.ts.map +1 -0
- package/types/examples/plasma_web/components/Mask/Mask.d.ts +191 -0
- package/types/examples/plasma_web/components/Mask/Mask.d.ts.map +1 -0
- package/types/index.d.ts +1 -0
- package/types/index.d.ts.map +1 -1
@@ -0,0 +1,127 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import type { ComponentProps } from 'react';
|
3
|
+
import type { StoryObj, Meta } from '@storybook/react';
|
4
|
+
import { action } from '@storybook/addon-actions';
|
5
|
+
|
6
|
+
import { WithTheme } from '../../../_helpers';
|
7
|
+
|
8
|
+
import { Mask } from './Mask';
|
9
|
+
|
10
|
+
const onChange = action('onChange');
|
11
|
+
|
12
|
+
const sizes = ['l', 'm', 's', 'xs'];
|
13
|
+
const views = ['default', 'positive', 'warning', 'negative'];
|
14
|
+
|
15
|
+
const meta: Meta<typeof Mask> = {
|
16
|
+
title: 'plasma_b2c/Mask',
|
17
|
+
component: Mask,
|
18
|
+
decorators: [WithTheme],
|
19
|
+
argTypes: {
|
20
|
+
view: {
|
21
|
+
options: views,
|
22
|
+
control: {
|
23
|
+
type: 'select',
|
24
|
+
},
|
25
|
+
},
|
26
|
+
size: {
|
27
|
+
options: sizes,
|
28
|
+
control: {
|
29
|
+
type: 'inline-radio',
|
30
|
+
},
|
31
|
+
},
|
32
|
+
},
|
33
|
+
};
|
34
|
+
|
35
|
+
export default meta;
|
36
|
+
|
37
|
+
type StoryPropsDefault = Omit<
|
38
|
+
ComponentProps<typeof Mask>,
|
39
|
+
| 'helperBlock'
|
40
|
+
| 'contentLeft'
|
41
|
+
| 'htmlSize'
|
42
|
+
| 'contentRight'
|
43
|
+
| 'type'
|
44
|
+
| 'name'
|
45
|
+
| 'onFocus'
|
46
|
+
| 'onBlur'
|
47
|
+
| 'onChange'
|
48
|
+
| 'value'
|
49
|
+
| 'checked'
|
50
|
+
| 'maxLength'
|
51
|
+
| 'minLength'
|
52
|
+
| 'required'
|
53
|
+
| 'enumerationType'
|
54
|
+
| 'chips'
|
55
|
+
| 'onChangeChips'
|
56
|
+
>;
|
57
|
+
|
58
|
+
const StoryDemo = ({ view, ...rest }: StoryPropsDefault) => {
|
59
|
+
return (
|
60
|
+
<div style={{ display: 'flex', flexDirection: 'column', gap: '2rem', width: '50%' }}>
|
61
|
+
<Mask
|
62
|
+
label="Маска телефона"
|
63
|
+
mask="+7 (000) 000 - 00 - 00"
|
64
|
+
maskChar="_"
|
65
|
+
showPrefix={false}
|
66
|
+
view={view}
|
67
|
+
onChange={onChange}
|
68
|
+
{...rest}
|
69
|
+
/>
|
70
|
+
|
71
|
+
<Mask
|
72
|
+
label="Маска телефона: отображается всегда"
|
73
|
+
mask="+7 (000) 000 - 00 - 00"
|
74
|
+
maskChar="_"
|
75
|
+
view={view}
|
76
|
+
alwaysShowMask
|
77
|
+
onChange={onChange}
|
78
|
+
{...rest}
|
79
|
+
value="+79123"
|
80
|
+
name="example"
|
81
|
+
/>
|
82
|
+
|
83
|
+
<Mask
|
84
|
+
label="Маска даты"
|
85
|
+
mask="00/00/0000"
|
86
|
+
maskString="DD/MM/YYYY"
|
87
|
+
alwaysShowMask
|
88
|
+
view={view}
|
89
|
+
onChange={onChange}
|
90
|
+
{...rest}
|
91
|
+
/>
|
92
|
+
|
93
|
+
<Mask
|
94
|
+
label="Маска даты: значения по умолчанию"
|
95
|
+
// eslint-disable-next-line no-octal-escape
|
96
|
+
mask="12.\04.0000"
|
97
|
+
maskChar="_"
|
98
|
+
alwaysShowMask
|
99
|
+
view={view}
|
100
|
+
onChange={onChange}
|
101
|
+
{...rest}
|
102
|
+
/>
|
103
|
+
|
104
|
+
<Mask
|
105
|
+
label="Маска времени"
|
106
|
+
mask="00:00"
|
107
|
+
maskChar="_"
|
108
|
+
alwaysShowMask
|
109
|
+
view={view}
|
110
|
+
onChange={onChange}
|
111
|
+
{...rest}
|
112
|
+
/>
|
113
|
+
</div>
|
114
|
+
);
|
115
|
+
};
|
116
|
+
|
117
|
+
export const Default: StoryObj<StoryPropsDefault> = {
|
118
|
+
args: {
|
119
|
+
size: 'l',
|
120
|
+
view: 'default',
|
121
|
+
labelPlacement: 'outer',
|
122
|
+
placeholder: 'Заполните поле',
|
123
|
+
disabled: false,
|
124
|
+
readOnly: false,
|
125
|
+
},
|
126
|
+
render: (args) => <StoryDemo {...args} />,
|
127
|
+
};
|
@@ -0,0 +1,125 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import type { ComponentProps } from 'react';
|
3
|
+
import type { StoryObj, Meta } from '@storybook/react';
|
4
|
+
import { action } from '@storybook/addon-actions';
|
5
|
+
|
6
|
+
import { WithTheme } from '../../../_helpers';
|
7
|
+
|
8
|
+
import { Mask } from './Mask';
|
9
|
+
|
10
|
+
const onChange = action('onChange');
|
11
|
+
|
12
|
+
const sizes = ['l', 'm', 's', 'xs'];
|
13
|
+
const views = ['default', 'positive', 'warning', 'negative'];
|
14
|
+
|
15
|
+
const meta: Meta<typeof Mask> = {
|
16
|
+
title: 'plasma_web/Mask',
|
17
|
+
component: Mask,
|
18
|
+
decorators: [WithTheme],
|
19
|
+
argTypes: {
|
20
|
+
view: {
|
21
|
+
options: views,
|
22
|
+
control: {
|
23
|
+
type: 'select',
|
24
|
+
},
|
25
|
+
},
|
26
|
+
size: {
|
27
|
+
options: sizes,
|
28
|
+
control: {
|
29
|
+
type: 'inline-radio',
|
30
|
+
},
|
31
|
+
},
|
32
|
+
},
|
33
|
+
};
|
34
|
+
|
35
|
+
export default meta;
|
36
|
+
|
37
|
+
type StoryPropsDefault = Omit<
|
38
|
+
ComponentProps<typeof Mask>,
|
39
|
+
| 'helperBlock'
|
40
|
+
| 'contentLeft'
|
41
|
+
| 'htmlSize'
|
42
|
+
| 'contentRight'
|
43
|
+
| 'type'
|
44
|
+
| 'name'
|
45
|
+
| 'onFocus'
|
46
|
+
| 'onBlur'
|
47
|
+
| 'onChange'
|
48
|
+
| 'value'
|
49
|
+
| 'checked'
|
50
|
+
| 'maxLength'
|
51
|
+
| 'minLength'
|
52
|
+
| 'required'
|
53
|
+
| 'enumerationType'
|
54
|
+
| 'chips'
|
55
|
+
| 'onChangeChips'
|
56
|
+
>;
|
57
|
+
|
58
|
+
const StoryDemo = ({ view, ...rest }: StoryPropsDefault) => {
|
59
|
+
return (
|
60
|
+
<div style={{ display: 'flex', flexDirection: 'column', gap: '2rem', width: '50%' }}>
|
61
|
+
<Mask
|
62
|
+
label="Маска телефона"
|
63
|
+
mask="+7 (000) 000 - 00 - 00"
|
64
|
+
maskChar="_"
|
65
|
+
showPrefix={false}
|
66
|
+
view={view}
|
67
|
+
onChange={onChange}
|
68
|
+
{...rest}
|
69
|
+
/>
|
70
|
+
|
71
|
+
<Mask
|
72
|
+
label="Маска телефона: отображается всегда"
|
73
|
+
mask="+7 (000) 000 - 00 - 00"
|
74
|
+
maskChar="_"
|
75
|
+
view={view}
|
76
|
+
alwaysShowMask
|
77
|
+
onChange={onChange}
|
78
|
+
{...rest}
|
79
|
+
/>
|
80
|
+
|
81
|
+
<Mask
|
82
|
+
label="Маска даты"
|
83
|
+
mask="00/00/0000"
|
84
|
+
maskString="DD/MM/YYYY"
|
85
|
+
alwaysShowMask
|
86
|
+
view={view}
|
87
|
+
onChange={onChange}
|
88
|
+
{...rest}
|
89
|
+
/>
|
90
|
+
|
91
|
+
<Mask
|
92
|
+
label="Маска даты: значения по умолчанию"
|
93
|
+
// eslint-disable-next-line no-octal-escape
|
94
|
+
mask="12.\04.0000"
|
95
|
+
maskChar="_"
|
96
|
+
alwaysShowMask
|
97
|
+
view={view}
|
98
|
+
onChange={onChange}
|
99
|
+
{...rest}
|
100
|
+
/>
|
101
|
+
|
102
|
+
<Mask
|
103
|
+
label="Маска времени"
|
104
|
+
mask="00:00"
|
105
|
+
maskChar="_"
|
106
|
+
alwaysShowMask
|
107
|
+
view={view}
|
108
|
+
onChange={onChange}
|
109
|
+
{...rest}
|
110
|
+
/>
|
111
|
+
</div>
|
112
|
+
);
|
113
|
+
};
|
114
|
+
|
115
|
+
export const Default: StoryObj<StoryPropsDefault> = {
|
116
|
+
args: {
|
117
|
+
size: 'l',
|
118
|
+
view: 'default',
|
119
|
+
labelPlacement: 'outer',
|
120
|
+
placeholder: 'Заполните поле',
|
121
|
+
disabled: false,
|
122
|
+
readOnly: false,
|
123
|
+
},
|
124
|
+
render: (args) => <StoryDemo {...args} />,
|
125
|
+
};
|
package/emotion/es/index.js
CHANGED
@@ -56,4 +56,5 @@ export * from './components/Portal';
|
|
56
56
|
export * from './components/Price';
|
57
57
|
export * from './components/Autocomplete';
|
58
58
|
export * from './components/EmptyState';
|
59
|
-
export * from './components/Editable';
|
59
|
+
export * from './components/Editable';
|
60
|
+
export * from './components/Mask';
|
@@ -0,0 +1,205 @@
|
|
1
|
+
import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
|
2
|
+
import React, { forwardRef, useState, useMemo, useRef, useEffect } from 'react';
|
3
|
+
import { useForkRef } from '@salutejs/plasma-core';
|
4
|
+
import { useDidMountEffect } from '../../hooks/useDidMountEffect.js';
|
5
|
+
import '../../utils/react.js';
|
6
|
+
import { createMask, defaults } from './utils/createMask.js';
|
7
|
+
import { keyboardCode } from './utils/constants.js';
|
8
|
+
|
9
|
+
var _excluded = ["mask", "maskChar", "alwaysShowMask", "maskString", "showPrefix", "value", "defaultValue", "showMask", "onChange", "onBlur", "onFocus", "reformat"];
|
10
|
+
var composeMask = function composeMask(InputComponent) {
|
11
|
+
return /*#__PURE__*/forwardRef(function (props, outerRef) {
|
12
|
+
var maskValue = props.mask,
|
13
|
+
maskChar = props.maskChar,
|
14
|
+
alwaysShowMask = props.alwaysShowMask,
|
15
|
+
maskString = props.maskString,
|
16
|
+
showPrefix = props.showPrefix,
|
17
|
+
value = props.value,
|
18
|
+
defaultValue = props.defaultValue,
|
19
|
+
showMaskedValue = props.showMask,
|
20
|
+
onChange = props.onChange,
|
21
|
+
onBlur = props.onBlur,
|
22
|
+
onFocus = props.onFocus,
|
23
|
+
reformat = props.reformat,
|
24
|
+
rest = _objectWithoutProperties(props, _excluded);
|
25
|
+
var _useState = useState(alwaysShowMask || showMaskedValue),
|
26
|
+
_useState2 = _slicedToArray(_useState, 2),
|
27
|
+
showMask = _useState2[0],
|
28
|
+
setShowMask = _useState2[1];
|
29
|
+
var _useState3 = useState(''),
|
30
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
31
|
+
innerValue = _useState4[0],
|
32
|
+
setInnerValue = _useState4[1];
|
33
|
+
var mask = useMemo(function () {
|
34
|
+
return createMask({
|
35
|
+
value: String(value) || String(defaultValue) || '',
|
36
|
+
mask: maskValue,
|
37
|
+
maskChar: maskChar || defaults.maskChar,
|
38
|
+
maskString: maskString,
|
39
|
+
showPrefix: showPrefix || defaults.showPrefix,
|
40
|
+
reformat: reformat
|
41
|
+
});
|
42
|
+
}, []);
|
43
|
+
var canSetSelection = useRef(false);
|
44
|
+
var inputRef = useRef(null);
|
45
|
+
var innerRef = useForkRef(inputRef, outerRef);
|
46
|
+
var getSelection = function getSelection() {
|
47
|
+
var _inputRef$current, _inputRef$current2;
|
48
|
+
mask.setSelection = {
|
49
|
+
start: (inputRef === null || inputRef === void 0 || (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.selectionStart) || 0,
|
50
|
+
end: (inputRef === null || inputRef === void 0 || (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.selectionEnd) || 0
|
51
|
+
};
|
52
|
+
};
|
53
|
+
var setSelection = function setSelection() {
|
54
|
+
var _inputRef$current3;
|
55
|
+
if (!canSetSelection.current) {
|
56
|
+
return;
|
57
|
+
}
|
58
|
+
var selection = mask.getSelection;
|
59
|
+
inputRef === null || inputRef === void 0 || (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 || _inputRef$current3.setSelectionRange(selection.start, selection.end);
|
60
|
+
setTimeout(function () {
|
61
|
+
var _inputRef$current4;
|
62
|
+
return inputRef === null || inputRef === void 0 || (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setSelectionRange(selection.start, selection.end);
|
63
|
+
}, 0);
|
64
|
+
};
|
65
|
+
var showValue = function showValue() {
|
66
|
+
if (!(inputRef !== null && inputRef !== void 0 && inputRef.current)) {
|
67
|
+
return;
|
68
|
+
}
|
69
|
+
if (showMask && (canSetSelection.current || alwaysShowMask)) {
|
70
|
+
inputRef.current.value = mask.getState.maskedValue;
|
71
|
+
setInnerValue(mask.getState.maskedValue);
|
72
|
+
return;
|
73
|
+
}
|
74
|
+
setInnerValue(mask.getState.visibleValue);
|
75
|
+
inputRef.current.value = mask.getState.visibleValue;
|
76
|
+
};
|
77
|
+
var keyPressPropName = function keyPressPropName() {
|
78
|
+
if (typeof navigator !== 'undefined' && navigator.userAgent.match(/Android/i)) {
|
79
|
+
return 'onBeforeInput';
|
80
|
+
}
|
81
|
+
return 'onKeyPress';
|
82
|
+
};
|
83
|
+
var dispatchEvent = function dispatchEvent(e) {
|
84
|
+
var _mask$getState = mask.getState,
|
85
|
+
maskedValue = _mask$getState.maskedValue,
|
86
|
+
visibleValue = _mask$getState.visibleValue;
|
87
|
+
if (onChange) {
|
88
|
+
onChange(e, {
|
89
|
+
maskedValue: maskedValue,
|
90
|
+
value: visibleValue
|
91
|
+
});
|
92
|
+
}
|
93
|
+
};
|
94
|
+
var onPaste = function onPaste(e) {
|
95
|
+
e.preventDefault();
|
96
|
+
getSelection();
|
97
|
+
if (!(e !== null && e !== void 0 && e.clipboardData)) {
|
98
|
+
return;
|
99
|
+
}
|
100
|
+
mask.paste(e.clipboardData.getData('Text'));
|
101
|
+
setTimeout(setSelection, 0);
|
102
|
+
dispatchEvent(e);
|
103
|
+
};
|
104
|
+
var handleChange = function handleChange(e) {
|
105
|
+
var currentValue;
|
106
|
+
if (showMask && (canSetSelection.current || alwaysShowMask)) {
|
107
|
+
currentValue = mask.getState.maskedValue;
|
108
|
+
} else {
|
109
|
+
currentValue = mask.getState.visibleValue;
|
110
|
+
}
|
111
|
+
if (e.target.value !== currentValue) {
|
112
|
+
getSelection();
|
113
|
+
mask.updateValue(e.target.value);
|
114
|
+
setTimeout(setSelection, 0);
|
115
|
+
}
|
116
|
+
dispatchEvent(e);
|
117
|
+
};
|
118
|
+
var onKeyPress = function onKeyPress(e) {
|
119
|
+
if (e.metaKey || e.altKey || e.ctrlKey || e.key === 'Enter') {
|
120
|
+
return;
|
121
|
+
}
|
122
|
+
e.preventDefault();
|
123
|
+
getSelection();
|
124
|
+
mask.input(e.key || String.fromCharCode(e.which));
|
125
|
+
setSelection();
|
126
|
+
dispatchEvent(e);
|
127
|
+
};
|
128
|
+
var onKeyDown = function onKeyDown(e) {
|
129
|
+
if (e.code === keyboardCode.Backspace) {
|
130
|
+
e.preventDefault();
|
131
|
+
getSelection();
|
132
|
+
mask.removePreviousOrSelected();
|
133
|
+
setSelection();
|
134
|
+
dispatchEvent(e);
|
135
|
+
}
|
136
|
+
if (e.code === keyboardCode.Delete) {
|
137
|
+
e.preventDefault();
|
138
|
+
getSelection();
|
139
|
+
mask.removeNextOrSelected();
|
140
|
+
setSelection();
|
141
|
+
dispatchEvent(e);
|
142
|
+
}
|
143
|
+
};
|
144
|
+
var handleFocus = function handleFocus(e) {
|
145
|
+
canSetSelection.current = true;
|
146
|
+
if (onFocus) {
|
147
|
+
onFocus(e);
|
148
|
+
}
|
149
|
+
};
|
150
|
+
var handleBlur = function handleBlur(e) {
|
151
|
+
canSetSelection.current = false;
|
152
|
+
if (onBlur) {
|
153
|
+
onBlur(e);
|
154
|
+
}
|
155
|
+
};
|
156
|
+
var keyPressEvent = _defineProperty({}, keyPressPropName(), onKeyPress);
|
157
|
+
useDidMountEffect(function () {
|
158
|
+
setShowMask(alwaysShowMask || showMask);
|
159
|
+
}, [alwaysShowMask, showMask]);
|
160
|
+
useDidMountEffect(function () {
|
161
|
+
if (reformat) {
|
162
|
+
mask.updateReformat(reformat);
|
163
|
+
}
|
164
|
+
}, [reformat]);
|
165
|
+
useDidMountEffect(function () {
|
166
|
+
mask.updateMask(String(mask));
|
167
|
+
}, [mask]);
|
168
|
+
useDidMountEffect(function () {
|
169
|
+
mask.updateMaskString(String(maskString));
|
170
|
+
}, [maskString]);
|
171
|
+
useDidMountEffect(function () {
|
172
|
+
mask.updateMaskChar(String(maskChar));
|
173
|
+
}, [maskChar]);
|
174
|
+
useEffect(function () {
|
175
|
+
mask.updateValue(String(value));
|
176
|
+
}, [value]);
|
177
|
+
useEffect(function () {
|
178
|
+
showValue();
|
179
|
+
}, [showValue, mask]);
|
180
|
+
useEffect(function () {
|
181
|
+
var subscriber = function subscriber() {
|
182
|
+
showValue();
|
183
|
+
setSelection();
|
184
|
+
};
|
185
|
+
mask.subscribe(subscriber);
|
186
|
+
return function () {
|
187
|
+
mask.unsubscribe(subscriber);
|
188
|
+
};
|
189
|
+
}, [mask, showValue, setSelection]);
|
190
|
+
return /*#__PURE__*/React.createElement(InputComponent, _extends({}, rest, {
|
191
|
+
onChange: handleChange,
|
192
|
+
onKeyDown: onKeyDown,
|
193
|
+
onPaste: onPaste,
|
194
|
+
onFocus: handleFocus,
|
195
|
+
onBlur: handleBlur
|
196
|
+
}, keyPressEvent, {
|
197
|
+
value: innerValue,
|
198
|
+
ref: innerRef,
|
199
|
+
autoComplete: "off"
|
200
|
+
}));
|
201
|
+
});
|
202
|
+
};
|
203
|
+
|
204
|
+
export { composeMask };
|
205
|
+
//# sourceMappingURL=Mask.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Mask.js","sources":["../../../src/components/Mask/Mask.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ChangeEvent, FC, InputHTMLAttributes, FocusEvent } from 'react';\nimport { useForkRef } from '@salutejs/plasma-core';\n\nimport { useDidMountEffect } from '../../hooks';\n\nimport type { MaskProps } from './Mask.types';\nimport { createMask, defaults } from './utils/createMask';\nimport { keyboardCode } from './utils/constants';\nimport type { Mask } from './utils/mask';\n\nexport const composeMask = <T extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'>>(InputComponent: FC<T>) =>\n forwardRef<HTMLInputElement, T & MaskProps>((props, outerRef) => {\n const {\n mask: maskValue,\n maskChar,\n alwaysShowMask,\n maskString,\n showPrefix,\n value,\n defaultValue,\n showMask: showMaskedValue,\n onChange,\n onBlur,\n onFocus,\n reformat,\n ...rest\n } = props;\n\n const [showMask, setShowMask] = useState(alwaysShowMask || showMaskedValue);\n const [innerValue, setInnerValue] = useState('');\n\n const mask = useMemo<Mask>(\n () =>\n createMask({\n value: String(value) || String(defaultValue) || '',\n mask: maskValue,\n maskChar: maskChar || defaults.maskChar,\n maskString,\n showPrefix: showPrefix || defaults.showPrefix,\n reformat,\n }),\n [],\n );\n\n const canSetSelection = useRef(false);\n const inputRef = useRef<HTMLInputElement | null>(null);\n const innerRef = useForkRef(inputRef, outerRef);\n\n const getSelection = () => {\n mask.setSelection = {\n start: inputRef?.current?.selectionStart || 0,\n end: inputRef?.current?.selectionEnd || 0,\n };\n };\n\n const setSelection = () => {\n if (!canSetSelection.current) {\n return;\n }\n const selection = mask.getSelection;\n inputRef?.current?.setSelectionRange(selection.start, selection.end);\n\n setTimeout(() => inputRef?.current?.setSelectionRange(selection.start, selection.end), 0);\n };\n\n const showValue = () => {\n if (!inputRef?.current) {\n return;\n }\n\n if (showMask && (canSetSelection.current || alwaysShowMask)) {\n inputRef.current.value = mask.getState.maskedValue;\n setInnerValue(mask.getState.maskedValue);\n return;\n }\n\n setInnerValue(mask.getState.visibleValue);\n inputRef.current.value = mask.getState.visibleValue;\n };\n\n const keyPressPropName = () => {\n if (typeof navigator !== 'undefined' && navigator.userAgent.match(/Android/i)) {\n return 'onBeforeInput';\n }\n return 'onKeyPress';\n };\n\n const dispatchEvent = (e: KeyboardEvent | ChangeEvent | ClipboardEvent) => {\n const { maskedValue, visibleValue } = mask.getState;\n\n if (onChange) {\n onChange(e as ChangeEvent<HTMLInputElement>, { maskedValue, value: visibleValue });\n }\n };\n\n const onPaste = (e: ClipboardEvent) => {\n e.preventDefault();\n getSelection();\n\n if (!e?.clipboardData) {\n return;\n }\n\n mask.paste(e.clipboardData.getData('Text'));\n setTimeout(setSelection, 0);\n\n dispatchEvent(e);\n };\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n let currentValue;\n if (showMask && (canSetSelection.current || alwaysShowMask)) {\n currentValue = mask.getState.maskedValue;\n } else {\n currentValue = mask.getState.visibleValue;\n }\n\n if (e.target.value !== currentValue) {\n getSelection();\n mask.updateValue(e.target.value);\n\n setTimeout(setSelection, 0);\n }\n dispatchEvent(e);\n };\n\n const onKeyPress = (e: KeyboardEvent) => {\n if (e.metaKey || e.altKey || e.ctrlKey || e.key === 'Enter') {\n return;\n }\n\n e.preventDefault();\n getSelection();\n mask.input(e.key || String.fromCharCode(e.which));\n setSelection();\n dispatchEvent(e);\n };\n\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.code === keyboardCode.Backspace) {\n e.preventDefault();\n getSelection();\n mask.removePreviousOrSelected();\n\n setSelection();\n\n dispatchEvent(e);\n }\n\n if (e.code === keyboardCode.Delete) {\n e.preventDefault();\n getSelection();\n mask.removeNextOrSelected();\n\n setSelection();\n\n dispatchEvent(e);\n }\n };\n\n const handleFocus = (e: FocusEvent<HTMLInputElement>) => {\n canSetSelection.current = true;\n\n if (onFocus) {\n onFocus(e);\n }\n };\n\n const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n canSetSelection.current = false;\n\n if (onBlur) {\n onBlur(e);\n }\n };\n\n const keyPressEvent = { [keyPressPropName()]: onKeyPress };\n\n useDidMountEffect(() => {\n setShowMask(alwaysShowMask || showMask);\n }, [alwaysShowMask, showMask]);\n\n useDidMountEffect(() => {\n if (reformat) {\n mask.updateReformat(reformat);\n }\n }, [reformat]);\n\n useDidMountEffect(() => {\n mask.updateMask(String(mask));\n }, [mask]);\n\n useDidMountEffect(() => {\n mask.updateMaskString(String(maskString));\n }, [maskString]);\n\n useDidMountEffect(() => {\n mask.updateMaskChar(String(maskChar));\n }, [maskChar]);\n\n useEffect(() => {\n mask.updateValue(String(value));\n }, [value]);\n\n useEffect(() => {\n showValue();\n }, [showValue, mask]);\n\n useEffect(() => {\n const subscriber = () => {\n showValue();\n setSelection();\n };\n\n mask.subscribe(subscriber);\n\n return () => {\n mask.unsubscribe(subscriber);\n };\n }, [mask, showValue, setSelection]);\n\n return (\n <InputComponent\n {...(rest as T)}\n onChange={handleChange}\n onKeyDown={onKeyDown}\n onPaste={onPaste}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...keyPressEvent}\n value={innerValue}\n ref={innerRef}\n autoComplete=\"off\"\n />\n );\n });\n"],"names":["composeMask","InputComponent","forwardRef","props","outerRef","maskValue","mask","maskChar","alwaysShowMask","maskString","showPrefix","value","defaultValue","showMaskedValue","showMask","onChange","onBlur","onFocus","reformat","rest","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","setShowMask","_useState3","_useState4","innerValue","setInnerValue","useMemo","createMask","String","defaults","canSetSelection","useRef","inputRef","innerRef","useForkRef","getSelection","_inputRef$current","_inputRef$current2","setSelection","start","current","selectionStart","end","selectionEnd","_inputRef$current3","selection","setSelectionRange","setTimeout","_inputRef$current4","showValue","getState","maskedValue","visibleValue","keyPressPropName","navigator","userAgent","match","dispatchEvent","e","_mask$getState","onPaste","preventDefault","clipboardData","paste","getData","handleChange","currentValue","target","updateValue","onKeyPress","metaKey","altKey","ctrlKey","key","input","fromCharCode","which","onKeyDown","code","keyboardCode","Backspace","removePreviousOrSelected","Delete","removeNextOrSelected","handleFocus","handleBlur","keyPressEvent","_defineProperty","useDidMountEffect","updateReformat","updateMask","updateMaskString","updateMaskChar","useEffect","subscriber","subscribe","unsubscribe","React","createElement","_extends","ref","autoComplete"],"mappings":"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"}
|
@@ -0,0 +1,26 @@
|
|
1
|
+
var charType = {
|
2
|
+
User: 1,
|
3
|
+
Char: 2,
|
4
|
+
Mask: 3
|
5
|
+
};
|
6
|
+
var keyboardCode = {
|
7
|
+
Backspace: 'Backspace',
|
8
|
+
Delete: 'Delete'
|
9
|
+
};
|
10
|
+
var escapeChar = '\\';
|
11
|
+
var defaultFormatChars = [{
|
12
|
+
str: '0',
|
13
|
+
regexp: /[0-9]/
|
14
|
+
}, {
|
15
|
+
str: '*',
|
16
|
+
regexp: /./
|
17
|
+
}, {
|
18
|
+
str: 'a',
|
19
|
+
regexp: /[a-zA-Z]/
|
20
|
+
}, {
|
21
|
+
str: 'я',
|
22
|
+
regexp: /[а-яА-ЯёЁ]/
|
23
|
+
}];
|
24
|
+
|
25
|
+
export { charType, defaultFormatChars, escapeChar, keyboardCode };
|
26
|
+
//# sourceMappingURL=constants.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/components/Mask/utils/constants.ts"],"sourcesContent":["export const charType = {\n User: 1,\n Char: 2,\n Mask: 3,\n} as const;\n\nexport const keyboardCode = {\n Backspace: 'Backspace',\n Delete: 'Delete',\n};\n\nexport const escapeChar = '\\\\';\n\nexport const defaultFormatChars = [\n {\n str: '0',\n regexp: /[0-9]/,\n },\n {\n str: '*',\n regexp: /./,\n },\n {\n str: 'a',\n regexp: /[a-zA-Z]/,\n },\n {\n str: 'я',\n regexp: /[а-яА-ЯёЁ]/,\n },\n];\n"],"names":["charType","User","Char","Mask","keyboardCode","Backspace","Delete","escapeChar","defaultFormatChars","str","regexp"],"mappings":"AAAO,IAAMA,QAAQ,GAAG;AACpBC,EAAAA,IAAI,EAAE,CAAC;AACPC,EAAAA,IAAI,EAAE,CAAC;AACPC,EAAAA,IAAI,EAAE,CAAA;AACV,EAAU;AAEH,IAAMC,YAAY,GAAG;AACxBC,EAAAA,SAAS,EAAE,WAAW;AACtBC,EAAAA,MAAM,EAAE,QAAA;AACZ,EAAC;AAEM,IAAMC,UAAU,GAAG,KAAI;AAEvB,IAAMC,kBAAkB,GAAG,CAC9B;AACIC,EAAAA,GAAG,EAAE,GAAG;AACRC,EAAAA,MAAM,EAAE,OAAA;AACZ,CAAC,EACD;AACID,EAAAA,GAAG,EAAE,GAAG;AACRC,EAAAA,MAAM,EAAE,GAAA;AACZ,CAAC,EACD;AACID,EAAAA,GAAG,EAAE,GAAG;AACRC,EAAAA,MAAM,EAAE,UAAA;AACZ,CAAC,EACD;AACID,EAAAA,GAAG,EAAE,GAAG;AACRC,EAAAA,MAAM,EAAE,YAAA;AACZ,CAAC;;;;"}
|
@@ -0,0 +1,48 @@
|
|
1
|
+
import { defaultFormatChars } from './constants.js';
|
2
|
+
import { Mask } from './mask.js';
|
3
|
+
import { removeSelectedRange } from './selection.js';
|
4
|
+
|
5
|
+
var defaults = {
|
6
|
+
maskFormat: defaultFormatChars,
|
7
|
+
maskChar: '',
|
8
|
+
showMask: false,
|
9
|
+
removeSelectedRange: removeSelectedRange,
|
10
|
+
showPrefix: false
|
11
|
+
};
|
12
|
+
var createMask = function createMask(params) {
|
13
|
+
var _params$mask;
|
14
|
+
var maskString = params.maskString,
|
15
|
+
_params$showPrefix = params.showPrefix,
|
16
|
+
showPrefix = _params$showPrefix === void 0 ? defaults.showPrefix : _params$showPrefix,
|
17
|
+
_params$maskChar = params.maskChar,
|
18
|
+
maskChar = _params$maskChar === void 0 ? defaults.maskChar : _params$maskChar,
|
19
|
+
reformat = params.reformat;
|
20
|
+
var resReformat = reformat;
|
21
|
+
if (!reformat && !params.mask) {
|
22
|
+
resReformat = function resReformat(args) {
|
23
|
+
var str = args.value.map(function (item) {
|
24
|
+
return item["char"];
|
25
|
+
}).join('');
|
26
|
+
return {
|
27
|
+
value: args.value,
|
28
|
+
visibleValue: str,
|
29
|
+
maskedValue: str,
|
30
|
+
selection: args.selection
|
31
|
+
};
|
32
|
+
};
|
33
|
+
} else if (reformat && params.mask) {
|
34
|
+
params.mask = undefined;
|
35
|
+
}
|
36
|
+
if (maskString && maskString.length !== (params === null || params === void 0 || (_params$mask = params.mask) === null || _params$mask === void 0 ? void 0 : _params$mask.length)) {
|
37
|
+
throw new Error('maskString должна быть такой же длины, как и mask');
|
38
|
+
}
|
39
|
+
if (maskChar.length > 1) {
|
40
|
+
throw new Error('maskChar должен содержать только 1 символ');
|
41
|
+
}
|
42
|
+
var mask = new Mask(showPrefix, maskChar, maskString, resReformat);
|
43
|
+
mask.updateMask(params.mask);
|
44
|
+
return mask;
|
45
|
+
};
|
46
|
+
|
47
|
+
export { createMask, defaults };
|
48
|
+
//# sourceMappingURL=createMask.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"createMask.js","sources":["../../../../src/components/Mask/utils/createMask.ts"],"sourcesContent":["import type { CreateInputArgs, InputValueInfo } from '../Mask.types';\n\nimport { defaultFormatChars } from './constants';\nimport { Mask } from './mask';\nimport { removeSelectedRange } from './selection';\n\nexport const defaults = {\n maskFormat: defaultFormatChars,\n maskChar: '',\n showMask: false,\n removeSelectedRange,\n showPrefix: false,\n};\n\nexport const createMask = (params: CreateInputArgs): Mask => {\n const { maskString, showPrefix = defaults.showPrefix, maskChar = defaults.maskChar, reformat } = params;\n let resReformat = reformat;\n\n if (!reformat && !params.mask) {\n resReformat = (args) => {\n const str = (args.value as InputValueInfo[]).map((item) => item.char).join('');\n return {\n value: args.value,\n visibleValue: str,\n maskedValue: str,\n selection: args.selection,\n };\n };\n } else if (reformat && params.mask) {\n params.mask = undefined;\n }\n\n if (maskString && maskString.length !== params?.mask?.length) {\n throw new Error('maskString должна быть такой же длины, как и mask');\n }\n\n if (maskChar.length > 1) {\n throw new Error('maskChar должен содержать только 1 символ');\n }\n\n const mask = new Mask(showPrefix, maskChar, maskString, resReformat);\n\n mask.updateMask(params.mask);\n\n return mask;\n};\n"],"names":["defaults","maskFormat","defaultFormatChars","maskChar","showMask","removeSelectedRange","showPrefix","createMask","params","_params$mask","maskString","_params$showPrefix","_params$maskChar","reformat","resReformat","mask","args","str","value","map","item","join","visibleValue","maskedValue","selection","undefined","length","Error","Mask","updateMask"],"mappings":";;;;AAMO,IAAMA,QAAQ,GAAG;AACpBC,EAAAA,UAAU,EAAEC,kBAAkB;AAC9BC,EAAAA,QAAQ,EAAE,EAAE;AACZC,EAAAA,QAAQ,EAAE,KAAK;AACfC,EAAAA,mBAAmB,EAAnBA,mBAAmB;AACnBC,EAAAA,UAAU,EAAE,KAAA;AAChB,EAAC;IAEYC,UAAU,GAAG,SAAbA,UAAUA,CAAIC,MAAuB,EAAW;AAAA,EAAA,IAAAC,YAAA,CAAA;AACzD,EAAA,IAAQC,UAAU,GAA+EF,MAAM,CAA/FE,UAAU;IAAAC,kBAAA,GAA+EH,MAAM,CAAnFF,UAAU;AAAVA,IAAAA,UAAU,GAAAK,kBAAA,KAAA,KAAA,CAAA,GAAGX,QAAQ,CAACM,UAAU,GAAAK,kBAAA;IAAAC,gBAAA,GAA6CJ,MAAM,CAAjDL,QAAQ;AAARA,IAAAA,QAAQ,GAAAS,gBAAA,KAAA,KAAA,CAAA,GAAGZ,QAAQ,CAACG,QAAQ,GAAAS,gBAAA;IAAEC,QAAQ,GAAKL,MAAM,CAAnBK,QAAQ,CAAA;EAC5F,IAAIC,WAAW,GAAGD,QAAQ,CAAA;AAE1B,EAAA,IAAI,CAACA,QAAQ,IAAI,CAACL,MAAM,CAACO,IAAI,EAAE;AAC3BD,IAAAA,WAAW,GAAG,SAAAA,WAACE,CAAAA,IAAI,EAAK;MACpB,IAAMC,GAAG,GAAID,IAAI,CAACE,KAAK,CAAsBC,GAAG,CAAC,UAACC,IAAI,EAAA;AAAA,QAAA,OAAKA,IAAI,CAAK,MAAA,CAAA,CAAA;AAAA,OAAA,CAAC,CAACC,IAAI,CAAC,EAAE,CAAC,CAAA;MAC9E,OAAO;QACHH,KAAK,EAAEF,IAAI,CAACE,KAAK;AACjBI,QAAAA,YAAY,EAAEL,GAAG;AACjBM,QAAAA,WAAW,EAAEN,GAAG;QAChBO,SAAS,EAAER,IAAI,CAACQ,SAAAA;OACnB,CAAA;KACJ,CAAA;AACL,GAAC,MAAM,IAAIX,QAAQ,IAAIL,MAAM,CAACO,IAAI,EAAE;IAChCP,MAAM,CAACO,IAAI,GAAGU,SAAS,CAAA;AAC3B,GAAA;EAEA,IAAIf,UAAU,IAAIA,UAAU,CAACgB,MAAM,MAAKlB,MAAM,aAANA,MAAM,KAAA,KAAA,CAAA,IAAA,CAAAC,YAAA,GAAND,MAAM,CAAEO,IAAI,MAAA,IAAA,IAAAN,YAAA,KAAZA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,YAAA,CAAciB,MAAM,CAAE,EAAA;AAC1D,IAAA,MAAM,IAAIC,KAAK,CAAC,mDAAmD,CAAC,CAAA;AACxE,GAAA;AAEA,EAAA,IAAIxB,QAAQ,CAACuB,MAAM,GAAG,CAAC,EAAE;AACrB,IAAA,MAAM,IAAIC,KAAK,CAAC,2CAA2C,CAAC,CAAA;AAChE,GAAA;AAEA,EAAA,IAAMZ,IAAI,GAAG,IAAIa,IAAI,CAACtB,UAAU,EAAEH,QAAQ,EAAEO,UAAU,EAAEI,WAAW,CAAC,CAAA;AAEpEC,EAAAA,IAAI,CAACc,UAAU,CAACrB,MAAM,CAACO,IAAI,CAAC,CAAA;AAE5B,EAAA,OAAOA,IAAI,CAAA;AACf;;;;"}
|