@salutejs/plasma-new-hope 0.72.0-dev.0 → 0.73.0-canary.1160.8627071767.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/TextField/TextField.js +166 -40
- package/cjs/components/TextField/TextField.js.map +1 -1
- package/cjs/components/TextField/TextField.styles.js +27 -11
- package/cjs/components/TextField/TextField.styles.js.map +1 -1
- package/cjs/components/TextField/TextField.styles_1b1mddp.css +8 -0
- package/cjs/components/TextField/TextField.tokens.js +68 -20
- package/cjs/components/TextField/TextField.tokens.js.map +1 -1
- package/cjs/components/TextField/TextField_wctd2m.css +1 -0
- package/cjs/components/TextField/hooks/useKeyNavigation.js +132 -0
- package/cjs/components/TextField/hooks/useKeyNavigation.js.map +1 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.css +19 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js +38 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js.map +1 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +26 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js.map +1 -0
- package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles_1y8n7la.css +1 -0
- package/cjs/components/TextField/{_disabled → variations/_disabled}/base.js +2 -2
- package/cjs/components/TextField/variations/_disabled/base.js.map +1 -0
- package/cjs/components/TextField/variations/_disabled/base_1tnjoy9.css +1 -0
- package/cjs/components/TextField/{_label-placement → variations/_label-placement}/base.js +1 -1
- package/cjs/components/TextField/variations/_label-placement/base.js.map +1 -0
- package/cjs/components/TextField/{_label-placement → variations/_label-placement}/inner.js +2 -2
- package/cjs/components/TextField/variations/_label-placement/inner.js.map +1 -0
- package/cjs/components/TextField/variations/_label-placement/inner_gqlcj2.css +1 -0
- package/cjs/components/TextField/{_label-placement → variations/_label-placement}/outer.js +2 -2
- package/cjs/components/TextField/variations/_label-placement/outer.js.map +1 -0
- package/cjs/components/TextField/variations/_label-placement/outer_is41nj.css +1 -0
- package/cjs/components/TextField/{_view → variations/_read-only}/base.js +2 -2
- package/cjs/components/TextField/variations/_read-only/base.js.map +1 -0
- package/cjs/components/TextField/variations/_read-only/base_134hshp.css +1 -0
- package/cjs/components/TextField/variations/_size/base.js +9 -0
- package/cjs/components/TextField/variations/_size/base.js.map +1 -0
- package/cjs/components/TextField/variations/_size/base_1khzr9t.css +1 -0
- package/cjs/components/TextField/{_size → variations/_view}/base.js +2 -2
- package/cjs/components/TextField/variations/_view/base.js.map +1 -0
- package/cjs/components/TextField/variations/_view/base_1qd77x6.css +1 -0
- package/cjs/index.css +16 -9
- package/cjs/index.js +2 -2
- package/es/components/TextField/TextField.js +169 -44
- package/es/components/TextField/TextField.js.map +1 -1
- package/es/components/TextField/TextField.styles.js +25 -12
- package/es/components/TextField/TextField.styles.js.map +1 -1
- package/es/components/TextField/TextField.styles_1b1mddp.css +8 -0
- package/es/components/TextField/TextField.tokens.js +68 -21
- package/es/components/TextField/TextField.tokens.js.map +1 -1
- package/es/components/TextField/TextField_wctd2m.css +1 -0
- package/es/components/TextField/hooks/useKeyNavigation.js +127 -0
- package/es/components/TextField/hooks/useKeyNavigation.js.map +1 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.css +19 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js +34 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js.map +1 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +22 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js.map +1 -0
- package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles_1y8n7la.css +1 -0
- package/es/components/TextField/variations/_disabled/base.js +5 -0
- package/es/components/TextField/variations/_disabled/base.js.map +1 -0
- package/es/components/TextField/variations/_disabled/base_1tnjoy9.css +1 -0
- package/es/components/TextField/{_label-placement → variations/_label-placement}/base.js +1 -1
- package/es/components/TextField/variations/_label-placement/base.js.map +1 -0
- package/es/components/TextField/variations/_label-placement/inner.js +5 -0
- package/es/components/TextField/variations/_label-placement/inner.js.map +1 -0
- package/es/components/TextField/variations/_label-placement/inner_gqlcj2.css +1 -0
- package/es/components/TextField/variations/_label-placement/outer.js +5 -0
- package/es/components/TextField/variations/_label-placement/outer.js.map +1 -0
- package/es/components/TextField/variations/_label-placement/outer_is41nj.css +1 -0
- package/es/components/TextField/variations/_read-only/base.js +5 -0
- package/es/components/TextField/variations/_read-only/base.js.map +1 -0
- package/es/components/TextField/variations/_read-only/base_134hshp.css +1 -0
- package/es/components/TextField/variations/_size/base.js +5 -0
- package/es/components/TextField/variations/_size/base.js.map +1 -0
- package/es/components/TextField/variations/_size/base_1khzr9t.css +1 -0
- package/es/components/TextField/{_disabled → variations/_view}/base.js +2 -2
- package/es/components/TextField/variations/_view/base.js.map +1 -0
- package/es/components/TextField/variations/_view/base_1qd77x6.css +1 -0
- package/es/index.css +16 -9
- package/es/index.js +2 -2
- package/package.json +2 -2
- package/styled-components/cjs/components/TextField/TextField.js +173 -43
- package/styled-components/cjs/components/TextField/TextField.styles.js +18 -10
- package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +24 -0
- package/styled-components/cjs/components/TextField/TextField.tokens.js +68 -21
- package/styled-components/cjs/components/TextField/hooks/index.js +12 -0
- package/styled-components/cjs/components/TextField/hooks/useKeyNavigation.js +138 -0
- package/styled-components/cjs/components/TextField/index.js +2 -2
- package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js +39 -0
- package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +25 -0
- package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.types.js +5 -0
- package/styled-components/cjs/components/TextField/ui/index.js +12 -0
- package/styled-components/cjs/components/TextField/variations/_disabled/base.js +10 -0
- package/styled-components/cjs/components/TextField/variations/_label-placement/inner.js +10 -0
- package/styled-components/cjs/components/TextField/{_label-placement → variations/_label-placement}/outer.js +3 -3
- package/styled-components/cjs/components/TextField/variations/_read-only/base.js +10 -0
- package/styled-components/cjs/components/TextField/variations/_read-only/tokens.json +1 -0
- package/styled-components/cjs/components/TextField/variations/_size/base.js +10 -0
- package/styled-components/cjs/components/TextField/variations/_view/base.js +10 -0
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +43 -0
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.js +11 -0
- package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +181 -0
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.config.js +40 -0
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.js +11 -0
- package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +181 -0
- package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.config.js +43 -0
- package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.js +11 -0
- package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.stories.tsx +181 -0
- package/styled-components/es/components/TextField/TextField.js +177 -47
- package/styled-components/es/components/TextField/TextField.styles.js +17 -9
- package/styled-components/es/components/TextField/TextField.template-doc.mdx +24 -0
- package/styled-components/es/components/TextField/TextField.tokens.js +67 -20
- package/styled-components/es/components/TextField/hooks/index.js +1 -0
- package/styled-components/es/components/TextField/hooks/useKeyNavigation.js +132 -0
- package/styled-components/es/components/TextField/index.js +2 -2
- package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.js +30 -0
- package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +19 -0
- package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.types.js +1 -0
- package/styled-components/es/components/TextField/ui/index.js +1 -0
- package/styled-components/es/components/TextField/variations/_disabled/base.js +4 -0
- package/styled-components/es/components/TextField/variations/_label-placement/inner.js +4 -0
- package/styled-components/es/components/TextField/variations/_label-placement/outer.js +4 -0
- package/styled-components/es/components/TextField/variations/_read-only/base.js +4 -0
- package/styled-components/es/components/TextField/variations/_read-only/tokens.json +1 -0
- package/styled-components/es/components/TextField/variations/_size/base.js +4 -0
- package/styled-components/es/components/TextField/variations/_view/base.js +4 -0
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +37 -0
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.js +5 -0
- package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +181 -0
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js +34 -0
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.js +5 -0
- package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +181 -0
- package/styled-components/es/examples/sds_engineer/components/TextField/TextField.config.js +37 -0
- package/styled-components/es/examples/sds_engineer/components/TextField/TextField.js +5 -0
- package/styled-components/es/examples/sds_engineer/components/TextField/TextField.stories.tsx +181 -0
- package/types/components/TextField/TextField.d.ts +8 -3
- package/types/components/TextField/TextField.d.ts.map +1 -1
- package/types/components/TextField/TextField.styles.d.ts +6 -3
- package/types/components/TextField/TextField.styles.d.ts.map +1 -1
- package/types/components/TextField/TextField.tokens.d.ts +57 -8
- package/types/components/TextField/TextField.tokens.d.ts.map +1 -1
- package/types/components/TextField/TextField.types.d.ts +71 -6
- package/types/components/TextField/TextField.types.d.ts.map +1 -1
- package/types/components/TextField/hooks/index.d.ts +2 -0
- package/types/components/TextField/hooks/index.d.ts.map +1 -0
- package/types/components/TextField/hooks/useKeyNavigation.d.ts +17 -0
- package/types/components/TextField/hooks/useKeyNavigation.d.ts.map +1 -0
- package/types/components/TextField/index.d.ts +3 -2
- package/types/components/TextField/index.d.ts.map +1 -1
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.d.ts +7 -0
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.d.ts.map +1 -0
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.styles.d.ts +3 -0
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.styles.d.ts.map +1 -0
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.types.d.ts +37 -0
- package/types/components/TextField/ui/TextFieldChip/TextFieldChip.types.d.ts.map +1 -0
- package/types/components/TextField/ui/index.d.ts +2 -0
- package/types/components/TextField/ui/index.d.ts.map +1 -0
- package/types/components/TextField/variations/_disabled/base.d.ts.map +1 -0
- package/types/components/TextField/variations/_label-placement/base.d.ts.map +1 -0
- package/types/components/TextField/variations/_label-placement/index.d.ts.map +1 -0
- package/types/components/TextField/variations/_label-placement/inner.d.ts.map +1 -0
- package/types/components/TextField/variations/_label-placement/outer.d.ts.map +1 -0
- package/types/components/TextField/variations/_read-only/base.d.ts.map +1 -0
- package/types/components/TextField/variations/_size/base.d.ts.map +1 -0
- package/types/components/TextField/variations/_view/base.d.ts +2 -0
- package/types/components/TextField/variations/_view/base.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts +32 -0
- package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts.map +1 -0
- package/types/examples/plasma_b2c/components/TextField/TextField.d.ts +60 -0
- package/types/examples/plasma_b2c/components/TextField/TextField.d.ts.map +1 -0
- package/types/examples/plasma_web/components/TextField/TextField.config.d.ts +32 -0
- package/types/examples/plasma_web/components/TextField/TextField.config.d.ts.map +1 -0
- package/types/examples/plasma_web/components/TextField/TextField.d.ts +60 -0
- package/types/examples/plasma_web/components/TextField/TextField.d.ts.map +1 -0
- package/types/examples/sds_engineer/components/TextField/TextField.config.d.ts +32 -0
- package/types/examples/sds_engineer/components/TextField/TextField.config.d.ts.map +1 -0
- package/types/examples/sds_engineer/components/TextField/TextField.d.ts +60 -0
- package/types/examples/sds_engineer/components/TextField/TextField.d.ts.map +1 -0
- package/cjs/components/TextField/TextField.styles_2qw1n8.css +0 -5
- package/cjs/components/TextField/TextField_1lzb2r1.css +0 -1
- package/cjs/components/TextField/_disabled/base.js.map +0 -1
- package/cjs/components/TextField/_disabled/base_so3w81.css +0 -1
- package/cjs/components/TextField/_label-placement/base.js.map +0 -1
- package/cjs/components/TextField/_label-placement/inner.js.map +0 -1
- package/cjs/components/TextField/_label-placement/inner_1tyuicp.css +0 -1
- package/cjs/components/TextField/_label-placement/outer.js.map +0 -1
- package/cjs/components/TextField/_label-placement/outer_19ekaek.css +0 -1
- package/cjs/components/TextField/_size/base.js.map +0 -1
- package/cjs/components/TextField/_size/base_b5smyu.css +0 -1
- package/cjs/components/TextField/_view/base.js.map +0 -1
- package/cjs/components/TextField/_view/base_5bqzed.css +0 -1
- package/es/components/TextField/TextField.styles_2qw1n8.css +0 -5
- package/es/components/TextField/TextField_1lzb2r1.css +0 -1
- package/es/components/TextField/_disabled/base.js.map +0 -1
- package/es/components/TextField/_disabled/base_so3w81.css +0 -1
- package/es/components/TextField/_label-placement/base.js.map +0 -1
- package/es/components/TextField/_label-placement/inner.js +0 -5
- package/es/components/TextField/_label-placement/inner.js.map +0 -1
- package/es/components/TextField/_label-placement/inner_1tyuicp.css +0 -1
- package/es/components/TextField/_label-placement/outer.js +0 -5
- package/es/components/TextField/_label-placement/outer.js.map +0 -1
- package/es/components/TextField/_label-placement/outer_19ekaek.css +0 -1
- package/es/components/TextField/_size/base.js +0 -5
- package/es/components/TextField/_size/base.js.map +0 -1
- package/es/components/TextField/_size/base_b5smyu.css +0 -1
- package/es/components/TextField/_view/base.js +0 -5
- package/es/components/TextField/_view/base.js.map +0 -1
- package/es/components/TextField/_view/base_5bqzed.css +0 -1
- package/styled-components/cjs/components/TextField/_disabled/base.js +0 -9
- package/styled-components/cjs/components/TextField/_label-placement/inner.js +0 -10
- package/styled-components/cjs/components/TextField/_size/base.js +0 -10
- package/styled-components/cjs/components/TextField/_view/base.js +0 -10
- package/styled-components/es/components/TextField/_disabled/base.js +0 -3
- package/styled-components/es/components/TextField/_label-placement/inner.js +0 -4
- package/styled-components/es/components/TextField/_label-placement/outer.js +0 -4
- package/styled-components/es/components/TextField/_size/base.js +0 -4
- package/styled-components/es/components/TextField/_view/base.js +0 -4
- package/types/components/TextField/_disabled/base.d.ts.map +0 -1
- package/types/components/TextField/_label-placement/base.d.ts.map +0 -1
- package/types/components/TextField/_label-placement/index.d.ts.map +0 -1
- package/types/components/TextField/_label-placement/inner.d.ts.map +0 -1
- package/types/components/TextField/_label-placement/outer.d.ts.map +0 -1
- package/types/components/TextField/_size/base.d.ts.map +0 -1
- package/types/components/TextField/_view/base.d.ts.map +0 -1
- /package/cjs/components/TextField/{_label-placement → variations/_label-placement}/base_x642ct.css +0 -0
- /package/es/components/TextField/{_label-placement → variations/_label-placement}/base_x642ct.css +0 -0
- /package/styled-components/cjs/components/TextField/{_disabled → variations/_disabled}/tokens.json +0 -0
- /package/styled-components/cjs/components/TextField/{_label-placement → variations/_label-placement}/base.js +0 -0
- /package/styled-components/cjs/components/TextField/{_label-placement → variations/_label-placement}/index.js +0 -0
- /package/styled-components/cjs/components/TextField/{_size → variations/_size}/tokens.json +0 -0
- /package/styled-components/cjs/components/TextField/{_view → variations/_view}/tokens.json +0 -0
- /package/styled-components/es/components/TextField/{_disabled → variations/_disabled}/tokens.json +0 -0
- /package/styled-components/es/components/TextField/{_label-placement → variations/_label-placement}/base.js +0 -0
- /package/styled-components/es/components/TextField/{_label-placement → variations/_label-placement}/index.js +0 -0
- /package/styled-components/es/components/TextField/{_size → variations/_size}/tokens.json +0 -0
- /package/styled-components/es/components/TextField/{_view → variations/_view}/tokens.json +0 -0
- /package/types/components/TextField/{_disabled → variations/_disabled}/base.d.ts +0 -0
- /package/types/components/TextField/{_label-placement → variations/_label-placement}/base.d.ts +0 -0
- /package/types/components/TextField/{_label-placement → variations/_label-placement}/index.d.ts +0 -0
- /package/types/components/TextField/{_label-placement → variations/_label-placement}/inner.d.ts +0 -0
- /package/types/components/TextField/{_label-placement → variations/_label-placement}/outer.d.ts +0 -0
- /package/types/components/TextField/{_size → variations/_read-only}/base.d.ts +0 -0
- /package/types/components/TextField/{_view → variations/_size}/base.d.ts +0 -0
@@ -0,0 +1,127 @@
|
|
1
|
+
import { slicedToArray as _slicedToArray, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
2
|
+
import { useState } from 'react';
|
3
|
+
|
4
|
+
var Keys = {
|
5
|
+
Enter: 'Enter',
|
6
|
+
Tab: 'Tab',
|
7
|
+
Escape: 'Escape',
|
8
|
+
ArrowLeft: 'ArrowLeft',
|
9
|
+
ArrowRight: 'ArrowRight',
|
10
|
+
Backspace: 'Backspace'
|
11
|
+
};
|
12
|
+
var useKeyNavigation = function useKeyNavigation(_ref) {
|
13
|
+
var _ref$controlledRefs = _ref.controlledRefs,
|
14
|
+
chipsRefs = _ref$controlledRefs.chipsRefs,
|
15
|
+
contentRef = _ref$controlledRefs.contentRef,
|
16
|
+
inputRef = _ref$controlledRefs.inputRef,
|
17
|
+
disabled = _ref.disabled,
|
18
|
+
readOnly = _ref.readOnly,
|
19
|
+
chips = _ref.chips,
|
20
|
+
enumerationType = _ref.enumerationType,
|
21
|
+
updateChips = _ref.updateChips,
|
22
|
+
onChange = _ref.onChange,
|
23
|
+
onSearch = _ref.onSearch;
|
24
|
+
var _useState = useState(-1),
|
25
|
+
_useState2 = _slicedToArray(_useState, 2),
|
26
|
+
activeChipIndex = _useState2[0],
|
27
|
+
setActiveChipIndex = _useState2[1];
|
28
|
+
var handleInputKeydown = function handleInputKeydown(event) {
|
29
|
+
var _inputRef$current;
|
30
|
+
var _ref2 = event.target,
|
31
|
+
value = _ref2.value;
|
32
|
+
if (disabled || readOnly) {
|
33
|
+
return;
|
34
|
+
}
|
35
|
+
if (event.key === Keys.Enter && enumerationType === 'chip' && value) {
|
36
|
+
var nextIndex = (chips === null || chips === void 0 ? void 0 : chips.length) || 0;
|
37
|
+
var newChips = [].concat(_toConsumableArray(chips), [{
|
38
|
+
id: "".concat(nextIndex, "_").concat(value),
|
39
|
+
text: value
|
40
|
+
}]);
|
41
|
+
var newValues = newChips.map(function (_ref3) {
|
42
|
+
var text = _ref3.text;
|
43
|
+
return text;
|
44
|
+
});
|
45
|
+
updateChips(newChips, newValues);
|
46
|
+
event.target.value = '';
|
47
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(event);
|
48
|
+
}
|
49
|
+
if (event.key === Keys.Enter && onSearch) {
|
50
|
+
onSearch(value, event);
|
51
|
+
}
|
52
|
+
if (event.key === Keys.Backspace && chips.length && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.selectionStart) === 0) {
|
53
|
+
var _newChips = _toConsumableArray(chips);
|
54
|
+
_newChips === null || _newChips === void 0 ? void 0 : _newChips.pop();
|
55
|
+
chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.pop();
|
56
|
+
var _newValues = _newChips.map(function (_ref4) {
|
57
|
+
var text = _ref4.text;
|
58
|
+
return text;
|
59
|
+
});
|
60
|
+
updateChips(_newChips, _newValues);
|
61
|
+
}
|
62
|
+
};
|
63
|
+
var onChipClear = function onChipClear(clearId, index) {
|
64
|
+
if (!chips.length) {
|
65
|
+
return;
|
66
|
+
}
|
67
|
+
var newChips = (chips === null || chips === void 0 ? void 0 : chips.filter(function (_ref5) {
|
68
|
+
var chipId = _ref5.id;
|
69
|
+
return chipId !== clearId;
|
70
|
+
})) || [];
|
71
|
+
var newValues = newChips.map(function (_ref6) {
|
72
|
+
var text = _ref6.text;
|
73
|
+
return text;
|
74
|
+
});
|
75
|
+
chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.splice(index, 1);
|
76
|
+
updateChips(newChips, newValues);
|
77
|
+
};
|
78
|
+
var handleChipKeyDown = function handleChipKeyDown(event, chipId, chipIndex) {
|
79
|
+
if (event.key === Keys.Tab) {
|
80
|
+
event.preventDefault();
|
81
|
+
}
|
82
|
+
if (event.key === Keys.Backspace) {
|
83
|
+
onChipClear(chipId, chipIndex);
|
84
|
+
}
|
85
|
+
};
|
86
|
+
var handleContentKeyDown = function handleContentKeyDown(event) {
|
87
|
+
var _inputRef$current2, _focusedItem, _focusedItem2;
|
88
|
+
var chipsRefsCount = chipsRefs.current.length;
|
89
|
+
var currentCaretPosition = (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.selectionStart) || 0;
|
90
|
+
var newActiveChipIndex = activeChipIndex;
|
91
|
+
var focusedItem = null;
|
92
|
+
if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {
|
93
|
+
var _chipsRefs$current;
|
94
|
+
var index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
|
95
|
+
newActiveChipIndex = document.activeElement === (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) ? chipsRefsCount - 1 : index;
|
96
|
+
focusedItem = (_chipsRefs$current = chipsRefs.current) === null || _chipsRefs$current === void 0 ? void 0 : _chipsRefs$current[newActiveChipIndex];
|
97
|
+
}
|
98
|
+
if (event.key === Keys.ArrowRight && enumerationType === 'chip' && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
|
99
|
+
var _chipsRefs$current2;
|
100
|
+
var _index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;
|
101
|
+
newActiveChipIndex = document.activeElement === (contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) ? 0 : _index;
|
102
|
+
focusedItem = _index === activeChipIndex ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : (_chipsRefs$current2 = chipsRefs.current) === null || _chipsRefs$current2 === void 0 ? void 0 : _chipsRefs$current2[newActiveChipIndex];
|
103
|
+
}
|
104
|
+
if (event.key === Keys.Backspace && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
|
105
|
+
var _chipsRefs$current3;
|
106
|
+
var _index2 = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
|
107
|
+
newActiveChipIndex = chipsRefsCount === 0 ? -1 : _index2;
|
108
|
+
focusedItem = chipsRefsCount === 0 ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : chipsRefs === null || chipsRefs === void 0 ? void 0 : (_chipsRefs$current3 = chipsRefs.current) === null || _chipsRefs$current3 === void 0 ? void 0 : _chipsRefs$current3[newActiveChipIndex];
|
109
|
+
}
|
110
|
+
(_focusedItem = focusedItem) === null || _focusedItem === void 0 ? void 0 : _focusedItem.focus();
|
111
|
+
(_focusedItem2 = focusedItem) === null || _focusedItem2 === void 0 ? void 0 : _focusedItem2.scrollIntoView({
|
112
|
+
behavior: 'smooth',
|
113
|
+
block: 'center',
|
114
|
+
inline: 'center'
|
115
|
+
});
|
116
|
+
setActiveChipIndex(newActiveChipIndex);
|
117
|
+
};
|
118
|
+
return {
|
119
|
+
handleInputKeydown: handleInputKeydown,
|
120
|
+
handleChipKeyDown: handleChipKeyDown,
|
121
|
+
onChipClear: onChipClear,
|
122
|
+
handleContentKeyDown: handleContentKeyDown
|
123
|
+
};
|
124
|
+
};
|
125
|
+
|
126
|
+
export { Keys, useKeyNavigation };
|
127
|
+
//# sourceMappingURL=useKeyNavigation.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useKeyNavigation.js","sources":["../../../../src/components/TextField/hooks/useKeyNavigation.ts"],"sourcesContent":["import { useState } from 'react';\nimport type { ChangeEvent, KeyboardEvent } from 'react';\n\nimport type { UseKeyNavigationProps } from '../TextField.types';\n\nexport const Keys = {\n Enter: 'Enter',\n Tab: 'Tab',\n Escape: 'Escape',\n ArrowLeft: 'ArrowLeft',\n ArrowRight: 'ArrowRight',\n Backspace: 'Backspace',\n};\n\nexport const useKeyNavigation = ({\n controlledRefs: { chipsRefs, contentRef, inputRef },\n disabled,\n readOnly,\n chips,\n enumerationType,\n updateChips,\n onChange,\n onSearch,\n}: UseKeyNavigationProps) => {\n const [activeChipIndex, setActiveChipIndex] = useState(-1);\n\n const handleInputKeydown = (event: ChangeEvent<HTMLInputElement> & KeyboardEvent<HTMLInputElement>) => {\n const { value } = event.target as HTMLInputElement;\n\n if (disabled || readOnly) {\n return;\n }\n\n if (event.key === Keys.Enter && enumerationType === 'chip' && value) {\n const nextIndex = chips?.length || 0;\n\n const newChips = [...chips, { id: `${nextIndex}_${value}`, text: value }];\n const newValues = newChips.map(({ text }) => text);\n\n updateChips(newChips, newValues);\n event.target.value = '';\n onChange?.(event);\n }\n\n if (event.key === Keys.Enter && onSearch) {\n onSearch(value, event);\n }\n\n if (event.key === Keys.Backspace && chips.length && inputRef?.current?.selectionStart === 0) {\n const newChips = [...chips];\n newChips?.pop();\n chipsRefs?.current.pop();\n\n const newValues = newChips.map(({ text }) => text);\n\n updateChips(newChips, newValues);\n }\n };\n\n const onChipClear = (clearId: string, index: number) => {\n if (!chips.length) {\n return;\n }\n\n const newChips = chips?.filter(({ id: chipId }) => chipId !== clearId) || [];\n const newValues = newChips.map(({ text }) => text);\n chipsRefs?.current.splice(index, 1);\n\n updateChips(newChips, newValues);\n };\n\n const handleChipKeyDown = (event: KeyboardEvent<HTMLButtonElement>, chipId: string, chipIndex: number) => {\n if (event.key === Keys.Tab) {\n event.preventDefault();\n }\n\n if (event.key === Keys.Backspace) {\n onChipClear(chipId, chipIndex);\n }\n };\n\n const handleContentKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n const chipsRefsCount = chipsRefs.current.length;\n const currentCaretPosition = inputRef?.current?.selectionStart || 0;\n\n let newActiveChipIndex = activeChipIndex;\n let focusedItem: HTMLButtonElement | HTMLInputElement | null = null;\n\n if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {\n const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n newActiveChipIndex = document.activeElement === inputRef?.current ? chipsRefsCount - 1 : index;\n\n focusedItem = chipsRefs.current?.[newActiveChipIndex];\n }\n\n if (\n event.key === Keys.ArrowRight &&\n enumerationType === 'chip' &&\n document.activeElement !== inputRef?.current\n ) {\n const index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;\n\n newActiveChipIndex = document.activeElement === contentRef?.current ? 0 : index;\n focusedItem =\n index === activeChipIndex\n ? (inputRef?.current as HTMLInputElement)\n : chipsRefs.current?.[newActiveChipIndex];\n }\n\n if (event.key === Keys.Backspace && document.activeElement !== inputRef?.current) {\n const index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;\n\n newActiveChipIndex = chipsRefsCount === 0 ? -1 : index;\n focusedItem =\n chipsRefsCount === 0\n ? (inputRef?.current as HTMLInputElement)\n : chipsRefs?.current?.[newActiveChipIndex];\n }\n\n focusedItem?.focus();\n focusedItem?.scrollIntoView({\n behavior: 'smooth',\n block: 'center',\n inline: 'center',\n });\n\n setActiveChipIndex(newActiveChipIndex);\n };\n\n return { handleInputKeydown, handleChipKeyDown, onChipClear, handleContentKeyDown } as const;\n};\n"],"names":["Keys","Enter","Tab","Escape","ArrowLeft","ArrowRight","Backspace","useKeyNavigation","_ref","_ref$controlledRefs","controlledRefs","chipsRefs","contentRef","inputRef","disabled","readOnly","chips","enumerationType","updateChips","onChange","onSearch","_useState","useState","_useState2","_slicedToArray","activeChipIndex","setActiveChipIndex","handleInputKeydown","event","_inputRef$current","_ref2","target","value","key","nextIndex","length","newChips","concat","_toConsumableArray","id","text","newValues","map","_ref3","current","selectionStart","pop","_ref4","onChipClear","clearId","index","filter","_ref5","chipId","_ref6","splice","handleChipKeyDown","chipIndex","preventDefault","handleContentKeyDown","_inputRef$current2","_focusedItem","_focusedItem2","chipsRefsCount","currentCaretPosition","newActiveChipIndex","focusedItem","_chipsRefs$current","document","activeElement","_chipsRefs$current2","_chipsRefs$current3","focus","scrollIntoView","behavior","block","inline"],"mappings":";;;AAKO,IAAMA,IAAI,GAAG;AAChBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,SAAS,EAAE,WAAW;AACtBC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,SAAS,EAAE,WAAA;AACf,EAAC;IAEYC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EASA;AAAA,EAAA,IAAAC,mBAAA,GAAAD,IAAA,CARzBE,cAAc;IAAIC,SAAS,GAAAF,mBAAA,CAATE,SAAS;IAAEC,UAAU,GAAAH,mBAAA,CAAVG,UAAU;IAAEC,QAAQ,GAAAJ,mBAAA,CAARI,QAAQ;IACjDC,QAAQ,GAAAN,IAAA,CAARM,QAAQ;IACRC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;IACRC,KAAK,GAAAR,IAAA,CAALQ,KAAK;IACLC,eAAe,GAAAT,IAAA,CAAfS,eAAe;IACfC,WAAW,GAAAV,IAAA,CAAXU,WAAW;IACXC,QAAQ,GAAAX,IAAA,CAARW,QAAQ;IACRC,QAAQ,GAAAZ,IAAA,CAARY,QAAQ,CAAA;AAER,EAAA,IAAAC,SAAA,GAA8CC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAAAC,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAAnDI,IAAAA,eAAe,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,kBAAkB,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAE1C,EAAA,IAAMI,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIC,KAAsE,EAAK;AAAA,IAAA,IAAAC,iBAAA,CAAA;AACnG,IAAA,IAAAC,KAAA,GAAkBF,KAAK,CAACG,MAAM;MAAtBC,KAAK,GAAAF,KAAA,CAALE,KAAK,CAAA;IAEb,IAAIlB,QAAQ,IAAIC,QAAQ,EAAE;AACtB,MAAA,OAAA;AACJ,KAAA;AAEA,IAAA,IAAIa,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACC,KAAK,IAAIgB,eAAe,KAAK,MAAM,IAAIe,KAAK,EAAE;MACjE,IAAME,SAAS,GAAG,CAAAlB,KAAK,KAAA,IAAA,IAALA,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAALA,KAAK,CAAEmB,MAAM,KAAI,CAAC,CAAA;AAEpC,MAAA,IAAMC,QAAQ,GAAAC,EAAAA,CAAAA,MAAA,CAAAC,kBAAA,CAAOtB,KAAK,CAAE,EAAA,CAAA;QAAEuB,EAAE,EAAA,EAAA,CAAAF,MAAA,CAAKH,SAAS,OAAAG,MAAA,CAAIL,KAAK,CAAE;AAAEQ,QAAAA,IAAI,EAAER,KAAAA;AAAM,OAAC,CAAC,CAAA,CAAA;AACzE,MAAA,IAAMS,SAAS,GAAGL,QAAQ,CAACM,GAAG,CAAC,UAAAC,KAAA,EAAA;AAAA,QAAA,IAAGH,IAAI,GAAAG,KAAA,CAAJH,IAAI,CAAA;AAAA,QAAA,OAAOA,IAAI,CAAA;OAAC,CAAA,CAAA;AAElDtB,MAAAA,WAAW,CAACkB,QAAQ,EAAEK,SAAS,CAAC,CAAA;AAChCb,MAAAA,KAAK,CAACG,MAAM,CAACC,KAAK,GAAG,EAAE,CAAA;AACvBb,MAAAA,QAAQ,aAARA,QAAQ,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAARA,QAAQ,CAAGS,KAAK,CAAC,CAAA;AACrB,KAAA;IAEA,IAAIA,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACC,KAAK,IAAImB,QAAQ,EAAE;AACtCA,MAAAA,QAAQ,CAACY,KAAK,EAAEJ,KAAK,CAAC,CAAA;AAC1B,KAAA;AAEA,IAAA,IAAIA,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACM,SAAS,IAAIU,KAAK,CAACmB,MAAM,IAAI,CAAAtB,QAAQ,KAAA,IAAA,IAARA,QAAQ,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,CAAAgB,iBAAA,GAARhB,QAAQ,CAAE+B,OAAO,MAAA,IAAA,IAAAf,iBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,iBAAA,CAAmBgB,cAAc,MAAK,CAAC,EAAE;AACzF,MAAA,IAAMT,SAAQ,GAAAE,kBAAA,CAAOtB,KAAK,CAAC,CAAA;AAC3BoB,MAAAA,SAAQ,aAARA,SAAQ,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAARA,SAAQ,CAAEU,GAAG,EAAE,CAAA;MACfnC,SAAS,KAAA,IAAA,IAATA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,SAAS,CAAEiC,OAAO,CAACE,GAAG,EAAE,CAAA;AAExB,MAAA,IAAML,UAAS,GAAGL,SAAQ,CAACM,GAAG,CAAC,UAAAK,KAAA,EAAA;AAAA,QAAA,IAAGP,IAAI,GAAAO,KAAA,CAAJP,IAAI,CAAA;AAAA,QAAA,OAAOA,IAAI,CAAA;OAAC,CAAA,CAAA;AAElDtB,MAAAA,WAAW,CAACkB,SAAQ,EAAEK,UAAS,CAAC,CAAA;AACpC,KAAA;GACH,CAAA;EAED,IAAMO,WAAW,GAAG,SAAdA,WAAWA,CAAIC,OAAe,EAAEC,KAAa,EAAK;AACpD,IAAA,IAAI,CAAClC,KAAK,CAACmB,MAAM,EAAE;AACf,MAAA,OAAA;AACJ,KAAA;AAEA,IAAA,IAAMC,QAAQ,GAAG,CAAApB,KAAK,KAALA,IAAAA,IAAAA,KAAK,KAALA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,KAAK,CAAEmC,MAAM,CAAC,UAAAC,KAAA,EAAA;AAAA,MAAA,IAAOC,MAAM,GAAAD,KAAA,CAAVb,EAAE,CAAA;MAAA,OAAec,MAAM,KAAKJ,OAAO,CAAA;AAAA,KAAA,CAAC,KAAI,EAAE,CAAA;AAC5E,IAAA,IAAMR,SAAS,GAAGL,QAAQ,CAACM,GAAG,CAAC,UAAAY,KAAA,EAAA;AAAA,MAAA,IAAGd,IAAI,GAAAc,KAAA,CAAJd,IAAI,CAAA;AAAA,MAAA,OAAOA,IAAI,CAAA;KAAC,CAAA,CAAA;AAClD7B,IAAAA,SAAS,KAATA,IAAAA,IAAAA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,SAAS,CAAEiC,OAAO,CAACW,MAAM,CAACL,KAAK,EAAE,CAAC,CAAC,CAAA;AAEnChC,IAAAA,WAAW,CAACkB,QAAQ,EAAEK,SAAS,CAAC,CAAA;GACnC,CAAA;EAED,IAAMe,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAI5B,KAAuC,EAAEyB,MAAc,EAAEI,SAAiB,EAAK;AACtG,IAAA,IAAI7B,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACE,GAAG,EAAE;MACxB0B,KAAK,CAAC8B,cAAc,EAAE,CAAA;AAC1B,KAAA;AAEA,IAAA,IAAI9B,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACM,SAAS,EAAE;AAC9B0C,MAAAA,WAAW,CAACK,MAAM,EAAEI,SAAS,CAAC,CAAA;AAClC,KAAA;GACH,CAAA;AAED,EAAA,IAAME,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAI/B,KAAoC,EAAK;AAAA,IAAA,IAAAgC,kBAAA,EAAAC,YAAA,EAAAC,aAAA,CAAA;AACnE,IAAA,IAAMC,cAAc,GAAGpD,SAAS,CAACiC,OAAO,CAACT,MAAM,CAAA;AAC/C,IAAA,IAAM6B,oBAAoB,GAAG,CAAAnD,QAAQ,KAARA,IAAAA,IAAAA,QAAQ,wBAAA+C,kBAAA,GAAR/C,QAAQ,CAAE+B,OAAO,cAAAgB,kBAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjBA,kBAAA,CAAmBf,cAAc,KAAI,CAAC,CAAA;IAEnE,IAAIoB,kBAAkB,GAAGxC,eAAe,CAAA;IACxC,IAAIyC,WAAwD,GAAG,IAAI,CAAA;AAEnE,IAAA,IAAItC,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACI,SAAS,IAAIa,eAAe,KAAK,MAAM,IAAI+C,oBAAoB,IAAI,CAAC,EAAE;AAAA,MAAA,IAAAG,kBAAA,CAAA;AACzF,MAAA,IAAMjB,KAAK,GAAGzB,eAAe,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAGA,eAAe,GAAG,CAAC,CAAA;AAEhEwC,MAAAA,kBAAkB,GAAGG,QAAQ,CAACC,aAAa,MAAKxD,QAAQ,KAARA,IAAAA,IAAAA,QAAQ,KAARA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,QAAQ,CAAE+B,OAAO,CAAA,GAAGmB,cAAc,GAAG,CAAC,GAAGb,KAAK,CAAA;AAE9FgB,MAAAA,WAAW,GAAAC,CAAAA,kBAAA,GAAGxD,SAAS,CAACiC,OAAO,MAAAuB,IAAAA,IAAAA,kBAAA,KAAjBA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,kBAAA,CAAoBF,kBAAkB,CAAC,CAAA;AACzD,KAAA;IAEA,IACIrC,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACK,UAAU,IAC7BY,eAAe,KAAK,MAAM,IAC1BmD,QAAQ,CAACC,aAAa,MAAKxD,QAAQ,KAAA,IAAA,IAARA,QAAQ,KAARA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,QAAQ,CAAE+B,OAAO,CAC9C,EAAA;AAAA,MAAA,IAAA0B,mBAAA,CAAA;AACE,MAAA,IAAMpB,MAAK,GAAGzB,eAAe,GAAG,CAAC,IAAIsC,cAAc,GAAGtC,eAAe,GAAGA,eAAe,GAAG,CAAC,CAAA;AAE3FwC,MAAAA,kBAAkB,GAAGG,QAAQ,CAACC,aAAa,MAAKzD,UAAU,KAAA,IAAA,IAAVA,UAAU,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAVA,UAAU,CAAEgC,OAAO,CAAG,GAAA,CAAC,GAAGM,MAAK,CAAA;MAC/EgB,WAAW,GACPhB,MAAK,KAAKzB,eAAe,GAClBZ,QAAQ,KAARA,IAAAA,IAAAA,QAAQ,KAARA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,QAAQ,CAAE+B,OAAO,IAAA0B,mBAAA,GAClB3D,SAAS,CAACiC,OAAO,MAAA,IAAA,IAAA0B,mBAAA,KAAjBA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,mBAAA,CAAoBL,kBAAkB,CAAC,CAAA;AACrD,KAAA;AAEA,IAAA,IAAIrC,KAAK,CAACK,GAAG,KAAKjC,IAAI,CAACM,SAAS,IAAI8D,QAAQ,CAACC,aAAa,MAAKxD,QAAQ,KAARA,IAAAA,IAAAA,QAAQ,uBAARA,QAAQ,CAAE+B,OAAO,CAAE,EAAA;AAAA,MAAA,IAAA2B,mBAAA,CAAA;AAC9E,MAAA,IAAMrB,OAAK,GAAGzB,eAAe,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAGA,eAAe,GAAG,CAAC,CAAA;MAEhEwC,kBAAkB,GAAGF,cAAc,KAAK,CAAC,GAAG,CAAC,CAAC,GAAGb,OAAK,CAAA;AACtDgB,MAAAA,WAAW,GACPH,cAAc,KAAK,CAAC,GACblD,QAAQ,KAARA,IAAAA,IAAAA,QAAQ,KAARA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,QAAQ,CAAE+B,OAAO,GAClBjC,SAAS,KAATA,IAAAA,IAAAA,SAAS,KAAA4D,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,CAAAA,mBAAA,GAAT5D,SAAS,CAAEiC,OAAO,MAAA2B,IAAAA,IAAAA,mBAAA,KAAlBA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,mBAAA,CAAqBN,kBAAkB,CAAC,CAAA;AACtD,KAAA;IAEA,CAAAJ,YAAA,GAAAK,WAAW,MAAAL,IAAAA,IAAAA,YAAA,uBAAXA,YAAA,CAAaW,KAAK,EAAE,CAAA;IACpB,CAAAV,aAAA,GAAAI,WAAW,MAAA,IAAA,IAAAJ,aAAA,KAAXA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,aAAA,CAAaW,cAAc,CAAC;AACxBC,MAAAA,QAAQ,EAAE,QAAQ;AAClBC,MAAAA,KAAK,EAAE,QAAQ;AACfC,MAAAA,MAAM,EAAE,QAAA;AACZ,KAAC,CAAC,CAAA;IAEFlD,kBAAkB,CAACuC,kBAAkB,CAAC,CAAA;GACzC,CAAA;EAED,OAAO;AAAEtC,IAAAA,kBAAkB,EAAlBA,kBAAkB;AAAE6B,IAAAA,iBAAiB,EAAjBA,iBAAiB;AAAER,IAAAA,WAAW,EAAXA,WAAW;AAAEW,IAAAA,oBAAoB,EAApBA,oBAAAA;GAAsB,CAAA;AACvF;;;;"}
|
@@ -0,0 +1,19 @@
|
|
1
|
+
.IconRoot_7pl7ig_svvlqhf__32c458a1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:var(--svvlqhf-0);height:var(--svvlqhf-0);-webkit-flex:0 0 var(--svvlqhf-0);-ms-flex:0 0 var(--svvlqhf-0);flex:0 0 var(--svvlqhf-0);}
|
2
|
+
|
3
|
+
.base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
|
4
|
+
|
5
|
+
.base_fcgkys_b1pde8v1__0b4d127a{font-family:var(--plasma-chip-font-family);font-size:var(--plasma-chip-font-size);font-style:var(--plasma-chip-font-style);font-weight:var(--plasma-chip-font-weight);-webkit-letter-spacing:var(--plasma-chip-letter-spacing);-moz-letter-spacing:var(--plasma-chip-letter-spacing);-ms-letter-spacing:var(--plasma-chip-letter-spacing);letter-spacing:var(--plasma-chip-letter-spacing);line-height:var(--plasma-chip-lineheight);border-radius:var(--plasma-chip-border-radius);width:var(--plasma-chip-width);height:var(--plasma-chip-height);padding-top:var(--plasma-chip-padding-top);padding-right:var(--plasma-chip-padding-right);padding-bottom:var(--plasma-chip-padding-bottom);padding-left:var(--plasma-chip-padding-left);}.base_fcgkys_b1pde8v1__0b4d127a:hover{scale:var(--plasma-chip-scale-hover);}.base_fcgkys_b1pde8v1__0b4d127a:active{scale:var(--plasma-chip-scale-active);}
|
6
|
+
|
7
|
+
.base_rmcs0j_b16ulzzx__f8cae226[disabled]{opacity:var(--plasma-chip-disabled-opacity);cursor:not-allowed;}.base_rmcs0j_b16ulzzx__f8cae226[disabled]:hover,.base_rmcs0j_b16ulzzx__f8cae226[disabled]:active{scale:none;color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}
|
8
|
+
|
9
|
+
.base_1nfit77_b10y1phq__6aaec899[readonly]{color:var(--plasma-chip-color-readonly);background-color:var(--plasma-chip-background-readonly);}.base_1nfit77_b10y1phq__6aaec899[readonly]:hover,.base_1nfit77_b10y1phq__6aaec899[readonly]:active{scale:none;cursor:default;color:var(--plasma-chip-color-readonly-hover);background-color:var(--plasma-chip-background-readonly-hover);}
|
10
|
+
|
11
|
+
.base_kgtz8x_b16hf96__46a206b1{--plasma_private-chip-outline-size:var(--plasma-chip-outline-size,0.125rem);position:relative;}.base_kgtz8x_b16hf96__46a206b1:focus{outline:none;}.base_kgtz8x_b16hf96__46a206b1::before{content:'';position:absolute;top:calc(-1 * var(--plasma_private-chip-outline-size));left:calc(-1 * var(--plasma_private-chip-outline-size));right:calc(-1 * var(--plasma_private-chip-outline-size));bottom:calc(-1 * var(--plasma_private-chip-outline-size));z-index:1;display:block;box-sizing:content-box;border:var(--plasma_private-chip-outline-size) solid transparent;border-radius:calc(var(--plasma-chip-border-radius) + var(--plasma_private-chip-outline-size));-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.base_kgtz8x_b16hf96__46a206b1.base_kgtz8x_focusVisible__46a206b1:focus::before,.base_kgtz8x_b16hf96__46a206b1[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 var(--plasma_private-chip-outline-size) var(--plasma-chip-focus-color);}
|
12
|
+
|
13
|
+
.Chip_styles_1mwwhiw_bol5daj__07da4d18{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);}
|
14
|
+
.Chip_styles_1mwwhiw_sj20on5__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-left-content-margin-left);margin-right:var(--plasma-chip-left-content-margin-right);}
|
15
|
+
.Chip_styles_1mwwhiw_s1ror4o9__07da4d18{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
16
|
+
.Chip_styles_1mwwhiw_swddmyi__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-right-content-margin-left);margin-right:var(--plasma-chip-right-content-margin-right);}
|
17
|
+
.Chip_styles_1mwwhiw_s1pcflhj__07da4d18{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-left:var(--plasma-chip-clear-content-margin-left);margin-right:var(--plasma-chip-clear-content-margin-right);color:var(--plasma-chip-close-icon-color);}
|
18
|
+
|
19
|
+
.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676{--plasma-chip-color:var(--plasma-textfield__chip-color);--plasma-chip-background:var(--plasma-textfield__chip-background);--plasma-chip-color-hover:var(--plasma-textfield__chip-color-hover);--plasma-chip-background-hover:var(--plasma-textfield__chip-background-hover);--plasma-chip-color-active:var(--plasma-textfield__chip-color-active);--plasma-chip-background-active:var(--plasma-textfield__chip-background-active);--plasma-chip-background-readonly:var(--plasma-textfield__chip-background-readonly);--plasma-chip-color-readonly:var(--plasma-textfield__chip-color-readonly);--plasma-chip-background-readonly-hover:var(--plasma-textfield__chip-background-readonly-hover);--plasma-chip-color-readonly-hover:var(--plasma-textfield__chip-color-readonly-hover);--plasma-chip-border-radius:var(--plasma-textfield__chip-border-radius);--plasma-chip-width:var(--plasma-textfield__chip-width);--plasma-chip-height:var(--plasma-textfield__chip-height);--plasma-chip-padding-right:var(--plasma-textfield__chip-padding-right);--plasma-chip-padding-left:var(--plasma-textfield__chip-padding-left);--plasma-chip-font-family:var(--plasma-textfield__chip-font-family);--plasma-chip-font-size:var(--plasma-textfield__chip-font-size);--plasma-chip-font-style:var(--plasma-textfield__chip-font-style);--plasma-chip-font-weight:var(--plasma-textfield__chip-font-weight);--plasma-chip-letter-spacing:var(--plasma-textfield__chip-letter-spacing);--plasma-chip-lineheight:var(--plasma-textfield__chip-line-height);--plasma-chip-clear-content-margin-left:var(--plasma-textfield__chip-clear-content-margin-left);--plasma-chip-clear-content-margin-right:var(--plasma-textfield__chip-clear-content-margin-right);--plasma-chip-scale-hover:var(--plasma-textfield__chip-scale-hover);--plasma-chip-scale-active:var(--plasma-textfield__chip-scale-active);--plasma-chip-close-icon-size:var(--plasma-textfield__chip-close-icon-size);--plasma-chip-close-icon-color:var(--plasma-textfield__chip-close-icon-color);--plasma-chip-focus-color:var(--plasma-textfield-focus-color);-webkit-scroll-snap-align:center;-moz-scroll-snap-align:center;-ms-scroll-snap-align:center;scroll-snap-align:center;-webkit-scroll-snap-stop:normal;-moz-scroll-snap-stop:normal;-ms-scroll-snap-stop:normal;scroll-snap-stop:normal;position:relative;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:calc(var(--plasma-textfield__chip-border-radius) - 0.1rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676.TextFieldChip_styles_1y8n7la_focusVisible__8f291676:focus::before,.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-textfield-focus-color);}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[readonly]{opacity:var(--plasma-textfield__chip-opacity-readonly);}
|
@@ -0,0 +1,34 @@
|
|
1
|
+
import React, { forwardRef } from 'react';
|
2
|
+
import { StyledChip } from './TextFieldChip.styles.js';
|
3
|
+
|
4
|
+
/**
|
5
|
+
* Чип, отображающий выбранный элемент
|
6
|
+
*/
|
7
|
+
var TextFieldChip = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
8
|
+
var id = _ref.id,
|
9
|
+
text = _ref.text,
|
10
|
+
disabled = _ref.disabled,
|
11
|
+
readOnly = _ref.readOnly,
|
12
|
+
onClick = _ref.onClick,
|
13
|
+
onClear = _ref.onClear,
|
14
|
+
onKeyDown = _ref.onKeyDown;
|
15
|
+
var onClearHandle = function onClearHandle() {
|
16
|
+
return onClear(id);
|
17
|
+
};
|
18
|
+
var onKeyDownHandle = function onKeyDownHandle(event) {
|
19
|
+
onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, id);
|
20
|
+
};
|
21
|
+
return /*#__PURE__*/React.createElement(StyledChip, {
|
22
|
+
ref: ref,
|
23
|
+
tabIndex: -1,
|
24
|
+
disabled: disabled,
|
25
|
+
readOnly: readOnly,
|
26
|
+
onClick: onClick,
|
27
|
+
onClear: onClearHandle,
|
28
|
+
onKeyDown: onKeyDownHandle,
|
29
|
+
text: "".concat(text)
|
30
|
+
});
|
31
|
+
});
|
32
|
+
|
33
|
+
export { TextFieldChip };
|
34
|
+
//# sourceMappingURL=TextFieldChip.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"TextFieldChip.js","sources":["../../../../../src/components/TextField/ui/TextFieldChip/TextFieldChip.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { StyledChip } from './TextFieldChip.styles';\nimport type { TextFieldChipProps } from './TextFieldChip.types';\n\n/**\n * Чип, отображающий выбранный элемент\n */\nexport const TextFieldChip = forwardRef<HTMLButtonElement, TextFieldChipProps>(\n ({ id, text, disabled, readOnly, onClick, onClear, onKeyDown }, ref) => {\n const onClearHandle = () => onClear(id);\n\n const onKeyDownHandle = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDown?.(event, id);\n };\n\n return (\n <StyledChip\n ref={ref}\n tabIndex={-1}\n disabled={disabled}\n readOnly={readOnly}\n onClick={onClick}\n onClear={onClearHandle}\n onKeyDown={onKeyDownHandle}\n text={`${text}`}\n />\n );\n },\n);\n"],"names":["TextFieldChip","forwardRef","_ref","ref","id","text","disabled","readOnly","onClick","onClear","onKeyDown","onClearHandle","onKeyDownHandle","event","React","createElement","StyledChip","tabIndex","concat"],"mappings":";;;AAKA;AACA;AACA;AACO,IAAMA,aAAa,gBAAGC,UAAU,CACnC,UAAAC,IAAA,EAAgEC,GAAG,EAAK;AAAA,EAAA,IAArEC,EAAE,GAAAF,IAAA,CAAFE,EAAE;IAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IAAEC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IAAEC,QAAQ,GAAAL,IAAA,CAARK,QAAQ;IAAEC,OAAO,GAAAN,IAAA,CAAPM,OAAO;IAAEC,OAAO,GAAAP,IAAA,CAAPO,OAAO;IAAEC,SAAS,GAAAR,IAAA,CAATQ,SAAS,CAAA;AACxD,EAAA,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,GAAA;IAAA,OAASF,OAAO,CAACL,EAAE,CAAC,CAAA;AAAA,GAAA,CAAA;AAEvC,EAAA,IAAMQ,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,KAA6C,EAAK;IACvEH,SAAS,KAAA,IAAA,IAATA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,SAAS,CAAGG,KAAK,EAAET,EAAE,CAAC,CAAA;GACzB,CAAA;AAED,EAAA,oBACIU,KAAA,CAAAC,aAAA,CAACC,UAAU,EAAA;AACPb,IAAAA,GAAG,EAAEA,GAAI;IACTc,QAAQ,EAAE,CAAC,CAAE;AACbX,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,OAAO,EAAEE,aAAc;AACvBD,IAAAA,SAAS,EAAEE,eAAgB;IAC3BP,IAAI,EAAA,EAAA,CAAAa,MAAA,CAAKb,IAAI,CAAA;AAAG,GACnB,CAAC,CAAA;AAEV,CACJ;;;;"}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import './TextFieldChip.styles_1y8n7la.css';
|
2
|
+
import { styled } from '@linaria/react';
|
3
|
+
import { chipConfig } from '../../../Chip/Chip.js';
|
4
|
+
import '@linaria/core';
|
5
|
+
import { component, mergeConfig } from '../../../../engines/common.js';
|
6
|
+
|
7
|
+
// issue #823
|
8
|
+
var mergedConfig = /*#__PURE__*/mergeConfig(chipConfig);
|
9
|
+
var Chip = /*#__PURE__*/component(mergedConfig);
|
10
|
+
|
11
|
+
// NOTE: Необходимое переопределение токенов из компонента Chip т.к. используются его части
|
12
|
+
var _exp = function _exp() {
|
13
|
+
return Chip;
|
14
|
+
};
|
15
|
+
var StyledChip = /*#__PURE__*/styled(_exp())({
|
16
|
+
name: "StyledChip",
|
17
|
+
"class": "s32p7ut",
|
18
|
+
propsAsIs: true
|
19
|
+
});
|
20
|
+
|
21
|
+
export { StyledChip };
|
22
|
+
//# sourceMappingURL=TextFieldChip.styles.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"TextFieldChip.styles.js","sources":["../../../../../src/components/TextField/ui/TextFieldChip/TextFieldChip.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { chipConfig, chipTokens } from '../../../Chip';\nimport { component, mergeConfig } from '../../../../engines';\nimport { tokens } from '../../TextField.tokens';\nimport { addFocus } from '../../../../mixins';\n\n// issue #823\nconst mergedConfig = mergeConfig(chipConfig);\nconst Chip = component(mergedConfig);\n\n// NOTE: Необходимое переопределение токенов из компонента Chip т.к. используются его части\nexport const StyledChip = styled(Chip)`\n ${chipTokens.color}: var(${tokens.chipColor});\n ${chipTokens.background}: var(${tokens.chipBackground});\n ${chipTokens.colorHover}: var(${tokens.chipColorHover});\n ${chipTokens.backgroundHover}: var(${tokens.chipBackgroundHover});\n ${chipTokens.colorActive}: var(${tokens.chipColorActive});\n ${chipTokens.backgroundActive}: var(${tokens.chipBackgroundActive});\n ${chipTokens.backgroundReadOnly}: var(${tokens.chipBackgroundReadOnly});\n ${chipTokens.colorReadOnly}: var(${tokens.chipColorReadOnly});\n ${chipTokens.backgroundReadOnlyHover}: var(${tokens.chipBackgroundReadOnlyHover});\n ${chipTokens.colorReadOnlyHover}: var(${tokens.chipColorReadOnlyHover});\n ${chipTokens.borderRadius}: var(${tokens.chipBorderRadius});\n ${chipTokens.width}: var(${tokens.chipWidth});\n ${chipTokens.height}: var(${tokens.chipHeight});\n ${chipTokens.paddingRight}: var(${tokens.chipPaddingRight});\n ${chipTokens.paddingLeft}: var(${tokens.chipPaddingLeft});\n ${chipTokens.fontFamily}: var(${tokens.chipFontFamily});\n ${chipTokens.fontSize}: var(${tokens.chipFontSize});\n ${chipTokens.fontStyle}: var(${tokens.chipFontStyle});\n ${chipTokens.fontWeight}: var(${tokens.chipFontWeight});\n ${chipTokens.letterSpacing}: var(${tokens.chipLetterSpacing});\n ${chipTokens.lineHeight}: var(${tokens.chipLineHeight});\n ${chipTokens.clearContentMarginLeft}: var(${tokens.chipClearContentMarginLeft});\n ${chipTokens.clearContentMarginRight}: var(${tokens.chipClearContentMarginRight});\n ${chipTokens.scaleHover}: var(${tokens.chipScaleHover});\n ${chipTokens.scaleActive}: var(${tokens.chipScaleActive});\n ${chipTokens.closeIconSize}: var(${tokens.chipCloseIconSize});\n ${chipTokens.closeIconColor}: var(${tokens.chipCloseIconColor});\n ${chipTokens.focusColor}: var(${tokens.focusColor});\n\n scroll-snap-align: center;\n scroll-snap-stop: normal;\n\n ${addFocus({\n outlineOffset: '0.0625rem',\n outlineSize: '0.0625rem',\n outlineRadius: `calc(var(${tokens.chipBorderRadius}) - 0.1rem)`,\n outlineColor: `var(${tokens.focusColor})`,\n })}\n\n &[readonly] {\n opacity: var(${tokens.chipOpacityReadonly});\n }\n`;\n"],"names":["mergedConfig","mergeConfig","chipConfig","Chip","component","_exp","StyledChip","styled","name","class","propsAsIs"],"mappings":";;;;;AAOA;AACA,IAAMA,YAAY,gBAAGC,WAAW,CAACC,UAAU,CAAC,CAAA;AAC5C,IAAMC,IAAI,gBAAGC,SAAS,CAACJ,YAAY,CAAC,CAAA;;AAEpC;AAAA,IAAAK,IAAA,GAVkBA,SAUlBA,IAAAA,GAAA;AAAA,EAAA,OACiCF,IAAI,CAAA;AAAA,CAAA,CAAA;AAA9B,IAAMG,UAAU,gBAAGC,MAAM,CAAAF,IAAA,EAAA,CAAA,CAAA;AAAAG,EAAAA,IAAA,EAAA,YAAA;AAAAC,EAAAA,OAAAA,EAAA,SAAA;AAAAC,EAAAA,SAAA,EAAA,IAAA;AAAA,CA2C/B;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.s32p7ut{--plasma-chip-color:var(--plasma-textfield__chip-color);--plasma-chip-background:var(--plasma-textfield__chip-background);--plasma-chip-color-hover:var(--plasma-textfield__chip-color-hover);--plasma-chip-background-hover:var(--plasma-textfield__chip-background-hover);--plasma-chip-color-active:var(--plasma-textfield__chip-color-active);--plasma-chip-background-active:var(--plasma-textfield__chip-background-active);--plasma-chip-background-readonly:var(--plasma-textfield__chip-background-readonly);--plasma-chip-color-readonly:var(--plasma-textfield__chip-color-readonly);--plasma-chip-background-readonly-hover:var(--plasma-textfield__chip-background-readonly-hover);--plasma-chip-color-readonly-hover:var(--plasma-textfield__chip-color-readonly-hover);--plasma-chip-border-radius:var(--plasma-textfield__chip-border-radius);--plasma-chip-width:var(--plasma-textfield__chip-width);--plasma-chip-height:var(--plasma-textfield__chip-height);--plasma-chip-padding-right:var(--plasma-textfield__chip-padding-right);--plasma-chip-padding-left:var(--plasma-textfield__chip-padding-left);--plasma-chip-font-family:var(--plasma-textfield__chip-font-family);--plasma-chip-font-size:var(--plasma-textfield__chip-font-size);--plasma-chip-font-style:var(--plasma-textfield__chip-font-style);--plasma-chip-font-weight:var(--plasma-textfield__chip-font-weight);--plasma-chip-letter-spacing:var(--plasma-textfield__chip-letter-spacing);--plasma-chip-lineheight:var(--plasma-textfield__chip-line-height);--plasma-chip-clear-content-margin-left:var(--plasma-textfield__chip-clear-content-margin-left);--plasma-chip-clear-content-margin-right:var(--plasma-textfield__chip-clear-content-margin-right);--plasma-chip-scale-hover:var(--plasma-textfield__chip-scale-hover);--plasma-chip-scale-active:var(--plasma-textfield__chip-scale-active);--plasma-chip-close-icon-size:var(--plasma-textfield__chip-close-icon-size);--plasma-chip-close-icon-color:var(--plasma-textfield__chip-close-icon-color);--plasma-chip-focus-color:var(--plasma-textfield-focus-color);-webkit-scroll-snap-align:center;-moz-scroll-snap-align:center;-ms-scroll-snap-align:center;scroll-snap-align:center;-webkit-scroll-snap-stop:normal;-moz-scroll-snap-stop:normal;-ms-scroll-snap-stop:normal;scroll-snap-stop:normal;position:relative;}.s32p7ut::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:calc(var(--plasma-textfield__chip-border-radius) - 0.1rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.s32p7ut.focus-visible:focus::before,.s32p7ut[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-textfield-focus-color);}.s32p7ut[readonly]{opacity:var(--plasma-textfield__chip-opacity-readonly);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_disabled/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input } from '../../TextField.styles';\n\nexport const base = css`\n &[disabled] {\n opacity: var(${tokens.disabledOpacity});\n cursor: not-allowed;\n\n ${Input} {\n cursor: not-allowed;\n min-width: unset;\n }\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAUhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b15zsg4z[disabled]{opacity:var(--plasma-textfield-disabled-opacity);cursor:not-allowed;}.b15zsg4z[disabled] .io4bpie{cursor:not-allowed;min-width:unset;}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_label-placement/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\n// TODO: REMOVE IT\nexport const base = css``;\n"],"names":["base"],"mappings":"AAEA;AACO,IAAMA,IAAI,GAAQ;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"inner.js","sources":["../../../../../src/components/TextField/variations/_label-placement/inner.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { Input, Label } from '../../TextField.styles';\nimport { tokens } from '../../TextField.tokens';\n\nexport const labelPlacement_inner = css`\n ${Input} {\n padding: var(${tokens.contentLabelInnerPadding});\n }\n\n ${Input}:focus ~ ${Label}, ${Input}:not(:placeholder-shown) ~ ${Label} {\n height: auto;\n padding: var(${tokens.labelInnerPadding});\n\n font-family: var(${tokens.labelInnerFontFamily});\n font-size: var(${tokens.labelInnerFontSize});\n font-style: var(${tokens.labelInnerFontStyle});\n font-weight: var(${tokens.labelInnerFontWeight});\n letter-spacing: var(${tokens.labelInnerLetterSpacing});\n line-height: var(${tokens.labelInnerLineHeight});\n }\n\n ${Input}:not(:focus)::placeholder {\n color: transparent;\n }\n\n ${Input}:focus::placeholder {\n color: transparent;\n }\n\n ${Label} {\n color: var(${tokens.placeholderColor});\n\n pointer-events: none;\n position: absolute;\n top: 0;\n\n display: flex;\n align-items: center;\n\n box-sizing: border-box;\n\n transition: padding 0.1s ease-in-out, height 0s;\n\n height: var(${tokens.height});\n\n padding-top: calc(var(${tokens.height}) / 4);\n padding-bottom: calc(var(${tokens.height}) / 4);\n }\n`;\n"],"names":["labelPlacement_inner"],"mappings":"AAKO,IAAMA,oBAAoB,GA4ChC;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.l8oinlg .io4bpie{padding:var(--plasma-textfield-placement_inner__content-padding);}.l8oinlg .io4bpie:focus ~ .l13qvwoy,.l8oinlg .io4bpie:not(:placeholder-shown) ~ .l13qvwoy{height:auto;padding:var(--plasma-textfield-placement_inner__label-padding);font-family:var(--plasma-textfield-placement_inner__label-font-family);font-size:var(--plasma-textfield-placement_inner__label-font-size);font-style:var(--plasma-textfield-placement_inner__label-font-style);font-weight:var(--plasma-textfield-placement_inner__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);line-height:var(--plasma-textfield-placement_inner__label-line-height);}.l8oinlg .io4bpie:not(:focus)::-webkit-input-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus)::-moz-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus):-ms-input-placeholder{color:transparent;}.l8oinlg .io4bpie:not(:focus)::placeholder{color:transparent;}.l8oinlg .io4bpie:focus::-webkit-input-placeholder{color:transparent;}.l8oinlg .io4bpie:focus::-moz-placeholder{color:transparent;}.l8oinlg .io4bpie:focus:-ms-input-placeholder{color:transparent;}.l8oinlg .io4bpie:focus::placeholder{color:transparent;}.l8oinlg .l13qvwoy{color:var(--plasma-textfield__placeholder-color);pointer-events:none;position:absolute;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-transition:padding 0.1s ease-in-out,height 0s;transition:padding 0.1s ease-in-out,height 0s;height:var(--plasma-textfield-height);padding-top:calc(var(--plasma-textfield-height) / 4);padding-bottom:calc(var(--plasma-textfield-height) / 4);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"outer.js","sources":["../../../../../src/components/TextField/variations/_label-placement/outer.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { Label } from '../../TextField.styles';\nimport { tokens } from '../../TextField.tokens';\n\nexport const labelPlacement_outer = css`\n ${Label} {\n display: block;\n margin-bottom: var(${tokens.labelOffset});\n color: var(${tokens.labelColor});\n }\n`;\n"],"names":["labelPlacement_outer"],"mappings":"AAKO,IAAMA,oBAAoB,GAMhC;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.la46t0i .l13qvwoy{display:block;margin-bottom:var(--plasma-textfield__label-offset);color:var(--plasma-textfield__label-color);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_read-only/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, Label, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n &[readonly] {\n ${InputWrapper} {\n color: var(${tokens.colorReadOnly});\n background-color: var(${String(tokens.backgroundColorReadOnly)});\n box-shadow: inset 0 0 0 var(${String(tokens.borderWidth)}) var(${String(tokens.borderColorReadOnly)});\n }\n\n ${InputWrapper}:hover {\n background-color: var(${tokens.backgroundColorReadOnly});\n }\n\n ${Input}::placeholder {\n color: var(${tokens.placeholderColorReadOnly});\n }\n\n ${Input} {\n color: var(${tokens.colorReadOnly});\n cursor: default;\n min-width: unset;\n }\n\n ${LeftHelper} {\n color: var(${tokens.leftHelperColorReadOnly});\n }\n\n ${Label} {\n color: var(${tokens.labelColorReadOnly});\n }\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GA8BhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b1w985rt[readonly] .iq39zt5{color:var(--plasma-textfield-color-readonly);background-color:var(--plasma-textfield-bg-color-readonly);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma-textfield-border-color-readonly);}.b1w985rt[readonly] .iq39zt5:hover{background-color:var(--plasma-textfield-bg-color-readonly);}.b1w985rt[readonly] .io4bpie::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie::-moz-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie::placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.b1w985rt[readonly] .io4bpie{color:var(--plasma-textfield-color-readonly);cursor:default;min-width:unset;}.b1w985rt[readonly] .llv9av6{color:var(--plasma-textfield__left-helper-color-readonly);}.b1w985rt[readonly] .l13qvwoy{color:var(--plasma-textfield__label-color-readonly);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_size/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { classes, tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, Label, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n ${Input} {\n font-family: var(${tokens.fontFamily});\n font-size: var(${tokens.fontSize});\n font-style: var(${tokens.fontStyle});\n font-weight: var(${tokens.fontWeight});\n letter-spacing: var(${tokens.letterSpacing});\n line-height: var(${tokens.lineHeight});\n }\n\n ${InputWrapper} {\n height: var(${tokens.height});\n border-radius: var(${tokens.borderRadius});\n padding: var(${tokens.padding});\n\n &.${classes.hasChips} {\n padding-top: var(${tokens.paddingWithChips});\n padding-bottom: var(${tokens.paddingWithChips});\n }\n\n &.${classes.hasEmptyContentLeft} {\n padding-left: var(${tokens.paddingWithChips});\n }\n\n &.${classes.hasEmptyContentRight} {\n padding-right: var(${tokens.paddingWithChips});\n }\n }\n\n ${Label} {\n font-family: var(${tokens.labelFontFamily});\n font-size: var(${tokens.labelFontSize});\n font-style: var(${tokens.labelFontStyle});\n font-weight: var(${tokens.labelFontWeight});\n letter-spacing: var(${tokens.labelLetterSpacing});\n line-height: var(${tokens.labelLineHeight});\n }\n\n ${LeftHelper} {\n margin-top: var(${tokens.leftHelperOffset});\n\n font-family: var(${tokens.leftHelperFontFamily});\n font-size: var(${tokens.leftHelperFontSize});\n font-style: var(${tokens.leftHelperFontStyle});\n font-weight: var(${tokens.leftHelperFontWeight});\n letter-spacing: var(${tokens.leftHelperLetterSpacing});\n line-height: var(${tokens.leftHelperLineHeight});\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAgDhB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.b13ve66i .io4bpie{font-family:var(--plasma-textfield-font-family);font-size:var(--plasma-textfield-font-size);font-style:var(--plasma-textfield-font-style);font-weight:var(--plasma-textfield-font-weight);-webkit-letter-spacing:var(--plasma-textfield-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-letter-spacing);letter-spacing:var(--plasma-textfield-letter-spacing);line-height:var(--plasma-textfield-line-height);}.b13ve66i .iq39zt5{height:var(--plasma-textfield-height);border-radius:var(--plasma-textfield-border-radius);padding:var(--plasma-textfield-padding);}.b13ve66i .iq39zt5.has-chips{padding-top:var(--plasma-textfield-padding-with-chips);padding-bottom:var(--plasma-textfield-padding-with-chips);}.b13ve66i .iq39zt5.has-empty-content-left{padding-left:var(--plasma-textfield-padding-with-chips);}.b13ve66i .iq39zt5.has-empty-content-right{padding-right:var(--plasma-textfield-padding-with-chips);}.b13ve66i .l13qvwoy{font-family:var(--plasma-textfield__label-font-family);font-size:var(--plasma-textfield__label-font-size);font-style:var(--plasma-textfield__label-font-style);font-weight:var(--plasma-textfield__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__label-letter-spacing);letter-spacing:var(--plasma-textfield__label-letter-spacing);line-height:var(--plasma-textfield__label-line-height);}.b13ve66i .llv9av6{margin-top:var(--plasma-textfield__left-helper-offset);font-family:var(--plasma-textfield__left-helper-font-family);font-size:var(--plasma-textfield__left-helper-font-size);font-style:var(--plasma-textfield__left-helper-font-style);font-weight:var(--plasma-textfield__left-helper-font-weight);-webkit-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);line-height:var(--plasma-textfield__left-helper-line-height);}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"base.js","sources":["../../../../../src/components/TextField/variations/_view/base.ts"],"sourcesContent":["import { css } from '@linaria/core';\n\nimport { tokens } from '../../TextField.tokens';\nimport { Input, InputWrapper, LeftHelper } from '../../TextField.styles';\n\nexport const base = css`\n ${InputWrapper} {\n --plasma_private-textfield-border-color: var(${String(tokens.borderColor)});\n --plasma_private-textfield-bg-color: var(${String(tokens.backgroundColor)});\n\n color: var(${tokens.color});\n background-color: var(--plasma_private-textfield-bg-color);\n box-shadow: inset 0 0 0 var(${tokens.borderWidth}) var(--plasma_private-textfield-border-color);\n caret-color: var(${tokens.caretColor});\n\n transition: background-color 0.1s ease-in, color 0.1s ease-in, box-shadow 0.1s ease-in;\n }\n ${InputWrapper}:hover {\n --plasma_private-textfield-border-color: var(${tokens.borderColorHover}, var(${String(tokens.borderColor)}));\n --plasma_private-textfield-bg-color: var(\n ${tokens.backgroundColorHover},\n var(${String(tokens.backgroundColor)})\n );\n }\n ${InputWrapper}:focus-within {\n --plasma_private-textfield-border-color: var(${tokens.borderColorFocus}, var(${String(tokens.borderColor)}));\n --plasma_private-textfield-bg-color: var(\n ${tokens.backgroundColorFocus},\n var(${String(tokens.backgroundColor)})\n );\n }\n ${Input}::placeholder {\n color: var(${tokens.placeholderColor});\n }\n ${Input} {\n color: var(${tokens.color});\n }\n ${LeftHelper} {\n color: var(${tokens.leftHelperColor});\n }\n`;\n"],"names":["base"],"mappings":"AAKO,IAAMA,IAAI,GAmChB;;;;"}
|
@@ -0,0 +1 @@
|
|
1
|
+
.bptx5xt .iq39zt5{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color);--plasma_private-textfield-bg-color:var(--plasma-textfield-bg-color);color:var(--plasma-textfield-color);background-color:var(--plasma_private-textfield-bg-color);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma_private-textfield-border-color);caret-color:var(--plasma-textfield__caret-color);-webkit-transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;}.bptx5xt .iq39zt5:hover{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-hover,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-hover, var(--plasma-textfield-bg-color) );}.bptx5xt .iq39zt5:focus-within{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-focus,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-focus, var(--plasma-textfield-bg-color) );}.bptx5xt .io4bpie::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie::-moz-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie::placeholder{color:var(--plasma-textfield__placeholder-color);}.bptx5xt .io4bpie{color:var(--plasma-textfield-color);}.bptx5xt .llv9av6{color:var(--plasma-textfield__left-helper-color);}
|
package/es/index.css
CHANGED
@@ -109,23 +109,30 @@
|
|
109
109
|
|
110
110
|
.TextArea_qicm5y_b6rykm0__77932f3e{position:relative;box-sizing:border-box;}.TextArea_qicm5y_b6rykm0__77932f3e .TextArea_qicm5y_innerPlaceholderUp__77932f3e .TextArea_qicm5y_textarea__77932f3e{height:calc(var(--plasma_private-textarea-input-actual-height) - 1rem);}.TextArea_qicm5y_b6rykm0__77932f3e .TextArea_qicm5y_innerPlaceholderUp__77932f3e .TextArea_qicm5y_textareaWrapper__77932f3e{padding-top:calc(var(--plasma-textarea-input-padding-top) + 1rem);}.TextArea_qicm5y_b6rykm0__77932f3e .TextArea_qicm5y_innerPlaceholderUp__77932f3e .TextArea_qicm5y_textareaPlaceholder__77932f3e{font-family:var(--plasma-textarea-label-inner-font-family);font-size:var(--plasma-textarea-label-inner-font-size);font-style:var(--plasma-textarea-label-inner-font-style);font-weight:var(--plasma-textarea-label-inner-font-weight);-webkit-letter-spacing:var(--plasma-textarea-label-inner-letter-spacing);-moz-letter-spacing:var(--plasma-textarea-label-inner-letter-spacing);-ms-letter-spacing:var(--plasma-textarea-label-inner-letter-spacing);letter-spacing:var(--plasma-textarea-label-inner-letter-spacing);line-height:var(--plasma-textarea-label-inner-line-height);}.TextArea_qicm5y_b6rykm0__77932f3e .TextArea_qicm5y_hidePlaceholder__77932f3e .TextArea_qicm5y_textareaPlaceholder__77932f3e{display:none;}.TextArea_qicm5y_b6rykm0__77932f3e .TextArea_qicm5y_focusedOuterPlaceholderColor__77932f3e .TextArea_qicm5y_textareaPlaceholder__77932f3e{color:var(--plasma-textarea-placeholder-color-focus);}
|
111
111
|
|
112
|
-
.
|
112
|
+
.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb{padding:var(--plasma-textfield-placement_inner__content-padding);}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:focus ~ .inner_gqlcj2_l13qvwoy__0d4c77cb,.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:not(:placeholder-shown) ~ .inner_gqlcj2_l13qvwoy__0d4c77cb{height:auto;padding:var(--plasma-textfield-placement_inner__label-padding);font-family:var(--plasma-textfield-placement_inner__label-font-family);font-size:var(--plasma-textfield-placement_inner__label-font-size);font-style:var(--plasma-textfield-placement_inner__label-font-style);font-weight:var(--plasma-textfield-placement_inner__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);letter-spacing:var(--plasma-textfield-placement_inner__label-letter-spacing);line-height:var(--plasma-textfield-placement_inner__label-line-height);}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:not(:focus)::-webkit-input-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:not(:focus)::-moz-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:not(:focus):-ms-input-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:not(:focus)::placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:focus::-webkit-input-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:focus::-moz-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:focus:-ms-input-placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_io4bpie__0d4c77cb:focus::placeholder{color:transparent;}.inner_gqlcj2_l8oinlg__0d4c77cb .inner_gqlcj2_l13qvwoy__0d4c77cb{color:var(--plasma-textfield__placeholder-color);pointer-events:none;position:absolute;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;-webkit-transition:padding 0.1s ease-in-out,height 0s;transition:padding 0.1s ease-in-out,height 0s;height:var(--plasma-textfield-height);padding-top:calc(var(--plasma-textfield-height) / 4);padding-bottom:calc(var(--plasma-textfield-height) / 4);}
|
113
113
|
|
114
|
-
.
|
114
|
+
.outer_is41nj_la46t0i__fd2d2cf4 .outer_is41nj_l13qvwoy__fd2d2cf4{display:block;margin-bottom:var(--plasma-textfield__label-offset);color:var(--plasma-textfield__label-color);}
|
115
115
|
|
116
|
-
.
|
116
|
+
.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_io4bpie__4e32753c{font-family:var(--plasma-textfield-font-family);font-size:var(--plasma-textfield-font-size);font-style:var(--plasma-textfield-font-style);font-weight:var(--plasma-textfield-font-weight);-webkit-letter-spacing:var(--plasma-textfield-letter-spacing);-moz-letter-spacing:var(--plasma-textfield-letter-spacing);-ms-letter-spacing:var(--plasma-textfield-letter-spacing);letter-spacing:var(--plasma-textfield-letter-spacing);line-height:var(--plasma-textfield-line-height);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_iq39zt5__4e32753c{height:var(--plasma-textfield-height);border-radius:var(--plasma-textfield-border-radius);padding:var(--plasma-textfield-padding);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_iq39zt5__4e32753c.base_1khzr9t_hasChips__4e32753c{padding-top:var(--plasma-textfield-padding-with-chips);padding-bottom:var(--plasma-textfield-padding-with-chips);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_iq39zt5__4e32753c.base_1khzr9t_hasEmptyContentLeft__4e32753c{padding-left:var(--plasma-textfield-padding-with-chips);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_iq39zt5__4e32753c.base_1khzr9t_hasEmptyContentRight__4e32753c{padding-right:var(--plasma-textfield-padding-with-chips);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_l13qvwoy__4e32753c{font-family:var(--plasma-textfield__label-font-family);font-size:var(--plasma-textfield__label-font-size);font-style:var(--plasma-textfield__label-font-style);font-weight:var(--plasma-textfield__label-font-weight);-webkit-letter-spacing:var(--plasma-textfield__label-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__label-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__label-letter-spacing);letter-spacing:var(--plasma-textfield__label-letter-spacing);line-height:var(--plasma-textfield__label-line-height);}.base_1khzr9t_b13ve66i__4e32753c .base_1khzr9t_llv9av6__4e32753c{margin-top:var(--plasma-textfield__left-helper-offset);font-family:var(--plasma-textfield__left-helper-font-family);font-size:var(--plasma-textfield__left-helper-font-size);font-style:var(--plasma-textfield__left-helper-font-style);font-weight:var(--plasma-textfield__left-helper-font-weight);-webkit-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-moz-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);-ms-letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);letter-spacing:var(--plasma-textfield__left-helper-letter-spacing);line-height:var(--plasma-textfield__left-helper-line-height);}
|
117
117
|
|
118
|
-
.
|
118
|
+
.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_iq39zt5__3c6defb4{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color);--plasma_private-textfield-bg-color:var(--plasma-textfield-bg-color);color:var(--plasma-textfield-color);background-color:var(--plasma_private-textfield-bg-color);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma_private-textfield-border-color);caret-color:var(--plasma-textfield__caret-color);-webkit-transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;transition:background-color 0.1s ease-in,color 0.1s ease-in,box-shadow 0.1s ease-in;}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_iq39zt5__3c6defb4:hover{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-hover,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-hover, var(--plasma-textfield-bg-color) );}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_iq39zt5__3c6defb4:focus-within{--plasma_private-textfield-border-color:var(--plasma-textfield-border-color-focus,var(--plasma-textfield-border-color));--plasma_private-textfield-bg-color:var( --plasma-textfield-bg-color-focus, var(--plasma-textfield-bg-color) );}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_io4bpie__3c6defb4::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_io4bpie__3c6defb4::-moz-placeholder{color:var(--plasma-textfield__placeholder-color);}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_io4bpie__3c6defb4:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color);}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_io4bpie__3c6defb4::placeholder{color:var(--plasma-textfield__placeholder-color);}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_io4bpie__3c6defb4{color:var(--plasma-textfield-color);}.base_1qd77x6_bptx5xt__3c6defb4 .base_1qd77x6_llv9av6__3c6defb4{color:var(--plasma-textfield__left-helper-color);}
|
119
119
|
|
120
|
-
.
|
120
|
+
.base_1tnjoy9_b15zsg4z__de8f837b[disabled]{opacity:var(--plasma-textfield-disabled-opacity);cursor:not-allowed;}.base_1tnjoy9_b15zsg4z__de8f837b[disabled] .base_1tnjoy9_io4bpie__de8f837b{cursor:not-allowed;min-width:unset;}
|
121
121
|
|
122
|
-
.
|
123
|
-
.TextField_styles_2qw1n8_i1j28rg8__ccab1392 .TextField_styles_2qw1n8_iq39zt5__ccab1392{width:100%;}
|
124
|
-
.TextField_styles_2qw1n8_i13zudoe__ccab1392{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-shadow:inset 0 0 0 var(--plasma_private-textfield-border-width) var(--plasma_private-textfield-border-color);}.TextField_styles_2qw1n8_i13zudoe__ccab1392 .TextField_styles_2qw1n8_i1j28rg8__ccab1392{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}
|
122
|
+
.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_iq39zt5__3851a304{color:var(--plasma-textfield-color-readonly);background-color:var(--plasma-textfield-bg-color-readonly);box-shadow:inset 0 0 0 var(--plasmas-textfield-border-width) var(--plasma-textfield-border-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_iq39zt5__3851a304:hover{background-color:var(--plasma-textfield-bg-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_io4bpie__3851a304::-webkit-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_io4bpie__3851a304::-moz-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_io4bpie__3851a304:-ms-input-placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_io4bpie__3851a304::placeholder{color:var(--plasma-textfield__placeholder-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_io4bpie__3851a304{color:var(--plasma-textfield-color-readonly);cursor:default;min-width:unset;}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_llv9av6__3851a304{color:var(--plasma-textfield__left-helper-color-readonly);}.base_134hshp_b1w985rt__3851a304[readonly] .base_134hshp_l13qvwoy__3851a304{color:var(--plasma-textfield__label-color-readonly);}
|
125
123
|
|
124
|
+
.TextField_styles_1b1mddp_iq39zt5__552d9a4a{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;box-sizing:border-box;}
|
125
|
+
.TextField_styles_1b1mddp_i1j28rg8__552d9a4a{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1b1mddp_i1j28rg8__552d9a4a::-webkit-scrollbar{display:none;}.TextField_styles_1b1mddp_i1j28rg8__552d9a4a.TextField_styles_1b1mddp_hasChips__552d9a4a{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
|
126
|
+
.TextField_styles_1b1mddp_s13zudoe__552d9a4a{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-gap);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
|
127
|
+
.TextField_styles_1b1mddp_io4bpie__552d9a4a{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;-webkit-flex:1;-ms-flex:1;flex:1;min-width:60%;}
|
126
128
|
|
129
|
+
.TextField_styles_1b1mddp_s19ry60d__552d9a4a{margin:var(--plasma-textfield__left-content-margin);}
|
130
|
+
.TextField_styles_1b1mddp_sbt1ohz__552d9a4a{margin:var(--plasma-textfield__right-content-margin);}
|
127
131
|
|
128
|
-
|
132
|
+
|
133
|
+
.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676{--plasma-chip-color:var(--plasma-textfield__chip-color);--plasma-chip-background:var(--plasma-textfield__chip-background);--plasma-chip-color-hover:var(--plasma-textfield__chip-color-hover);--plasma-chip-background-hover:var(--plasma-textfield__chip-background-hover);--plasma-chip-color-active:var(--plasma-textfield__chip-color-active);--plasma-chip-background-active:var(--plasma-textfield__chip-background-active);--plasma-chip-background-readonly:var(--plasma-textfield__chip-background-readonly);--plasma-chip-color-readonly:var(--plasma-textfield__chip-color-readonly);--plasma-chip-background-readonly-hover:var(--plasma-textfield__chip-background-readonly-hover);--plasma-chip-color-readonly-hover:var(--plasma-textfield__chip-color-readonly-hover);--plasma-chip-border-radius:var(--plasma-textfield__chip-border-radius);--plasma-chip-width:var(--plasma-textfield__chip-width);--plasma-chip-height:var(--plasma-textfield__chip-height);--plasma-chip-padding-right:var(--plasma-textfield__chip-padding-right);--plasma-chip-padding-left:var(--plasma-textfield__chip-padding-left);--plasma-chip-font-family:var(--plasma-textfield__chip-font-family);--plasma-chip-font-size:var(--plasma-textfield__chip-font-size);--plasma-chip-font-style:var(--plasma-textfield__chip-font-style);--plasma-chip-font-weight:var(--plasma-textfield__chip-font-weight);--plasma-chip-letter-spacing:var(--plasma-textfield__chip-letter-spacing);--plasma-chip-lineheight:var(--plasma-textfield__chip-line-height);--plasma-chip-clear-content-margin-left:var(--plasma-textfield__chip-clear-content-margin-left);--plasma-chip-clear-content-margin-right:var(--plasma-textfield__chip-clear-content-margin-right);--plasma-chip-scale-hover:var(--plasma-textfield__chip-scale-hover);--plasma-chip-scale-active:var(--plasma-textfield__chip-scale-active);--plasma-chip-close-icon-size:var(--plasma-textfield__chip-close-icon-size);--plasma-chip-close-icon-color:var(--plasma-textfield__chip-close-icon-color);--plasma-chip-focus-color:var(--plasma-textfield-focus-color);-webkit-scroll-snap-align:center;-moz-scroll-snap-align:center;-ms-scroll-snap-align:center;scroll-snap-align:center;-webkit-scroll-snap-stop:normal;-moz-scroll-snap-stop:normal;-ms-scroll-snap-stop:normal;scroll-snap-stop:normal;position:relative;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676::before{content:'';position:absolute;top:0.0625rem;left:0.0625rem;right:0.0625rem;bottom:0.0625rem;z-index:1;display:block;box-sizing:content-box;border:0.0625rem solid transparent;border-radius:calc(var(--plasma-textfield__chip-border-radius) - 0.1rem);-webkit-transition:box-shadow 0.2s ease-in-out;transition:box-shadow 0.2s ease-in-out;pointer-events:none;}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676.TextFieldChip_styles_1y8n7la_focusVisible__8f291676:focus::before,.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[data-focus-visible-added]::before{outline:none;box-shadow:0 0 0 0.0625rem var(--plasma-textfield-focus-color);}.TextFieldChip_styles_1y8n7la_s32p7ut__8f291676[readonly]{opacity:var(--plasma-textfield__chip-opacity-readonly);}
|
134
|
+
|
135
|
+
.TextField_wctd2m_bpunezx__bc8b464c{display:block;overflow:hidden;}
|
129
136
|
|
130
137
|
.after_1sk7lsj_l1u83q10__310e7ae9{-webkit-box-pack:start;-webkit-justify-content:start;-ms-flex-pack:start;justify-content:start;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;--plasma_private-switch__label-offset:0 0 0 var(--plasma-switch__label-offset);}
|
131
138
|
|
package/es/index.js
CHANGED
@@ -36,8 +36,8 @@ export { popoverConfig, popoverRoot } from './components/Popover/Popover.js';
|
|
36
36
|
export { classes as popoverClasses, tokens as popoverTokens } from './components/Popover/Popover.tokens.js';
|
37
37
|
export { textAreaConfig, textAreaRoot } from './components/TextArea/TextArea.js';
|
38
38
|
export { tokens as textAreaTokens } from './components/TextArea/TextArea.tokens.js';
|
39
|
-
export { labelPlacement_inner as textField_labelPlacement_inner } from './components/TextField/_label-placement/inner.js';
|
40
|
-
export { labelPlacement_outer as textField_labelPlacement_outer } from './components/TextField/_label-placement/outer.js';
|
39
|
+
export { labelPlacement_inner as textField_labelPlacement_inner } from './components/TextField/variations/_label-placement/inner.js';
|
40
|
+
export { labelPlacement_outer as textField_labelPlacement_outer } from './components/TextField/variations/_label-placement/outer.js';
|
41
41
|
export { textFieldConfig, textFieldRoot } from './components/TextField/TextField.js';
|
42
42
|
export { tokens as textFieldTokens } from './components/TextField/TextField.tokens.js';
|
43
43
|
export { labelPosition_After as Switch_LabelPosition_After } from './components/Switch/_label-position/after.js';
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
3
|
-
"version": "0.
|
3
|
+
"version": "0.73.0-canary.1160.8627071767.0",
|
4
4
|
"description": "Salute Design System blueprint",
|
5
5
|
"main": "cjs/index.js",
|
6
6
|
"module": "es/index.js",
|
@@ -102,5 +102,5 @@
|
|
102
102
|
"react-popper": "2.3.0",
|
103
103
|
"storeon": "3.1.5"
|
104
104
|
},
|
105
|
-
"gitHead": "
|
105
|
+
"gitHead": "875842360aa50a18ddf316d138c31f84909f97a4"
|
106
106
|
}
|