armtek-uikit-react 1.0.33 → 1.0.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/Checkbox.scss +21 -17
- package/assets/Chip.scss +3 -1
- package/assets/Select.scss +3 -3
- package/package.json +1 -1
- package/ui/Chip/Chip.js +1 -0
- package/ui/Form/Select/SelectSummary.js +4 -4
- package/ui/Form/TextField/TextField.js +5 -1
- package/ui/Form/TextField/TextField.module.scss +2 -1
package/assets/Checkbox.scss
CHANGED
|
@@ -29,18 +29,20 @@
|
|
|
29
29
|
content: '';
|
|
30
30
|
left: 0;
|
|
31
31
|
top: -3px;
|
|
32
|
+
box-sizing: border-box;
|
|
32
33
|
}
|
|
33
34
|
&:after{
|
|
34
35
|
content: '';
|
|
35
36
|
position: absolute;
|
|
36
37
|
transform: rotate(45deg);
|
|
37
|
-
left:
|
|
38
|
+
left: 8px;
|
|
38
39
|
top: 1px;
|
|
39
|
-
width:
|
|
40
|
-
height:
|
|
40
|
+
width: 7px;
|
|
41
|
+
height: 11px;
|
|
41
42
|
border-bottom: 2px solid;
|
|
42
43
|
border-right: 2px solid;
|
|
43
44
|
display: none;
|
|
45
|
+
box-sizing: border-box;
|
|
44
46
|
}
|
|
45
47
|
& span{
|
|
46
48
|
display: inline-block;
|
|
@@ -55,8 +57,10 @@
|
|
|
55
57
|
//padding-left: 27px;
|
|
56
58
|
}
|
|
57
59
|
&:after{
|
|
58
|
-
left:
|
|
59
|
-
top:
|
|
60
|
+
left: 6px;
|
|
61
|
+
top: 2px;
|
|
62
|
+
width: 6px;
|
|
63
|
+
height: 10px;
|
|
60
64
|
}
|
|
61
65
|
&:before{
|
|
62
66
|
top:-1px;
|
|
@@ -70,10 +74,10 @@
|
|
|
70
74
|
padding-left: 25px;
|
|
71
75
|
}
|
|
72
76
|
&:after{
|
|
73
|
-
left:
|
|
77
|
+
left: 5px;
|
|
74
78
|
top: 1px;
|
|
75
79
|
height: 8px;
|
|
76
|
-
width:
|
|
80
|
+
width: 6px;
|
|
77
81
|
}
|
|
78
82
|
&:before{
|
|
79
83
|
top: -2px;
|
|
@@ -82,7 +86,7 @@
|
|
|
82
86
|
.checkbox__label_intermediate{
|
|
83
87
|
&:after{
|
|
84
88
|
border-left: none;
|
|
85
|
-
width:
|
|
89
|
+
width: 14px;
|
|
86
90
|
transform: none;
|
|
87
91
|
top: 7px;
|
|
88
92
|
height: 0;
|
|
@@ -90,11 +94,11 @@
|
|
|
90
94
|
border-right: none;
|
|
91
95
|
}
|
|
92
96
|
&.checkbox_medium:after{
|
|
93
|
-
width:
|
|
97
|
+
width: 11px;
|
|
94
98
|
}
|
|
95
99
|
&.checkbox_small:after{
|
|
96
|
-
width:
|
|
97
|
-
top:
|
|
100
|
+
width: 9px;
|
|
101
|
+
top: 5px;
|
|
98
102
|
}
|
|
99
103
|
}
|
|
100
104
|
|
|
@@ -223,10 +227,10 @@
|
|
|
223
227
|
border: none;
|
|
224
228
|
border-radius: 50%;
|
|
225
229
|
background: $color-primary;
|
|
226
|
-
width:
|
|
227
|
-
height:
|
|
228
|
-
margin-top: -
|
|
229
|
-
margin-left:
|
|
230
|
+
width: 10px;
|
|
231
|
+
height: 10px;
|
|
232
|
+
margin-top: -3px;
|
|
233
|
+
margin-left: 0px;
|
|
230
234
|
top:50%;
|
|
231
235
|
left:50%;
|
|
232
236
|
transform: translate(-50%, -50%);
|
|
@@ -235,14 +239,14 @@
|
|
|
235
239
|
&:after{
|
|
236
240
|
width: 8px;
|
|
237
241
|
height: 8px;
|
|
238
|
-
margin-top:
|
|
242
|
+
margin-top: -1px;
|
|
239
243
|
}
|
|
240
244
|
}
|
|
241
245
|
&.checkbox_small{
|
|
242
246
|
&:after{
|
|
243
247
|
width: 6px;
|
|
244
248
|
height: 6px;
|
|
245
|
-
margin-top: -
|
|
249
|
+
margin-top: -2px;
|
|
246
250
|
}
|
|
247
251
|
}
|
|
248
252
|
&.checkbox_error:before{
|
package/assets/Chip.scss
CHANGED
package/assets/Select.scss
CHANGED
|
@@ -27,9 +27,8 @@
|
|
|
27
27
|
position: static;
|
|
28
28
|
}
|
|
29
29
|
.selectSummary__wrapper{
|
|
30
|
-
padding: calc($size-step * 2) calc($size-step * 2)
|
|
30
|
+
padding: calc($size-step * 2) calc($size-step * 2) $size-step;
|
|
31
31
|
& .selectSummary{
|
|
32
|
-
padding-bottom: $size-step;
|
|
33
32
|
border-top: 1px solid $color-gray-300;
|
|
34
33
|
}
|
|
35
34
|
}
|
|
@@ -40,6 +39,7 @@
|
|
|
40
39
|
display: flex;
|
|
41
40
|
align-items: center;
|
|
42
41
|
justify-content: space-between;
|
|
42
|
+
margin-top:$size-step;
|
|
43
43
|
}
|
|
44
44
|
.selectSummary__check{
|
|
45
45
|
margin-right: 60px;
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
}
|
|
60
60
|
.selectSummary__options{
|
|
61
61
|
border-bottom: 1px solid $color-gray-300;
|
|
62
|
-
padding:
|
|
62
|
+
padding: 0 0 calc($size-step) 0;
|
|
63
63
|
margin-bottom: calc($size-step / 2);
|
|
64
64
|
}
|
|
65
65
|
.selectSummary__optionList{
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"armtek-uikit-react","version":"1.0.
|
|
1
|
+
{"name":"armtek-uikit-react","version":"1.0.35","description":"Armtek UIKit for React","repository":{"type":"git","url":"ssh://git@gl.corp:10022/int/uikit/uikit_react.git"},"author":"","license":"ISC","dependencies":{"rc-slider":"^10.2.1","react":"*","react-datepicker":"^4.16.0","react-dom":"*","clsx":"^2.0.0"},"peerDependencies":{"react":"*","react-dom":"*"},"scripts":{"pub":"npm version patch && npm publish"}}
|
package/ui/Chip/Chip.js
CHANGED
|
@@ -32,6 +32,7 @@ function Chip(props) {
|
|
|
32
32
|
className: clsx('material_icon', css.chip__icon, css['chip__icon_' + size]),
|
|
33
33
|
children: icon
|
|
34
34
|
}), /*#__PURE__*/_jsx("span", {
|
|
35
|
+
className: css.chip__text,
|
|
35
36
|
children: text || children
|
|
36
37
|
}), onClose && /*#__PURE__*/_jsx("span", {
|
|
37
38
|
className: clsx('material_icon_solid', {
|
|
@@ -27,7 +27,7 @@ export const SelectSummary = props => {
|
|
|
27
27
|
return /*#__PURE__*/_jsx(_Fragment, {
|
|
28
28
|
children: /*#__PURE__*/_jsxs("div", {
|
|
29
29
|
className: clsx('Arm-select-summary', css.selectSummary),
|
|
30
|
-
children: [/*#__PURE__*/_jsx("div", {
|
|
30
|
+
children: [selectedOptions.length > 0 && /*#__PURE__*/_jsx("div", {
|
|
31
31
|
className: css.selectSummary__options,
|
|
32
32
|
children: /*#__PURE__*/_jsx(SelectSummaryChips, {
|
|
33
33
|
options: selectedOptions,
|
|
@@ -36,7 +36,7 @@ export const SelectSummary = props => {
|
|
|
36
36
|
})
|
|
37
37
|
}), /*#__PURE__*/_jsxs("div", {
|
|
38
38
|
className: css.selectSummary__row,
|
|
39
|
-
children: [onSelectAll && /*#__PURE__*/_jsx("div", {
|
|
39
|
+
children: [!!onSelectAll && /*#__PURE__*/_jsx("div", {
|
|
40
40
|
className: clsx(css.selectSummary__check, {
|
|
41
41
|
[css.selectSummary__check_disabled]: selectAllDisabled
|
|
42
42
|
}),
|
|
@@ -51,7 +51,7 @@ export const SelectSummary = props => {
|
|
|
51
51
|
children: label_check_all
|
|
52
52
|
})
|
|
53
53
|
})
|
|
54
|
-
}), onClearAll && /*#__PURE__*/_jsx("div", {
|
|
54
|
+
}), !!onClearAll && /*#__PURE__*/_jsx("div", {
|
|
55
55
|
className: clsx(css.selectSummary__check, {
|
|
56
56
|
[css.selectSummary__check_disabled]: resetAllDisabled
|
|
57
57
|
}),
|
|
@@ -66,7 +66,7 @@ export const SelectSummary = props => {
|
|
|
66
66
|
children: label_uncheck_all
|
|
67
67
|
})
|
|
68
68
|
})
|
|
69
|
-
}), onSubmit && /*#__PURE__*/_jsx("div", {
|
|
69
|
+
}), !!onSubmit && /*#__PURE__*/_jsx("div", {
|
|
70
70
|
children: /*#__PURE__*/_jsx(Button, {
|
|
71
71
|
className: css.selectSummary__button,
|
|
72
72
|
disabled: disabled,
|
|
@@ -99,7 +99,7 @@ export const TextFieldContainer = props => {
|
|
|
99
99
|
return /*#__PURE__*/_jsx(_Fragment, {
|
|
100
100
|
children: /*#__PURE__*/_jsx("div", {
|
|
101
101
|
...restProps,
|
|
102
|
-
className: clsx(css.textfield, css['textfield_' + variant], css['size_' + size], {
|
|
102
|
+
className: clsx('textfield__container', css.textfield, css['textfield_' + variant], css['size_' + size], {
|
|
103
103
|
[css.textfield_focused]: focused,
|
|
104
104
|
[css.textfield_disabled]: disabled,
|
|
105
105
|
[css.textfield_error]: error
|
|
@@ -121,6 +121,9 @@ export const TextFieldInput = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
121
121
|
className,
|
|
122
122
|
...inputProps
|
|
123
123
|
} = props;
|
|
124
|
+
const handleWheel = e => {
|
|
125
|
+
if (inputProps.type === 'number' && e.target instanceof HTMLElement) e.target.blur();else if (props.onWheel) props.onWheel(e);
|
|
126
|
+
};
|
|
124
127
|
return /*#__PURE__*/_jsx(_Fragment, {
|
|
125
128
|
children: /*#__PURE__*/_jsxs("div", {
|
|
126
129
|
className: clsx(css.textfield__container, css['size_' + size], {
|
|
@@ -131,6 +134,7 @@ export const TextFieldInput = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
131
134
|
ref: ref,
|
|
132
135
|
value: value,
|
|
133
136
|
...inputProps,
|
|
137
|
+
onWheel: handleWheel,
|
|
134
138
|
className: clsx(css.textfield__input, css['size_' + size], css['textfield__input_' + variant], {
|
|
135
139
|
[css._label]: !!label,
|
|
136
140
|
[css.textfield_focused]: focused,
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
@import "../../../assets/TextField";
|
|
1
|
+
@import "../../../assets/TextField";
|
|
2
|
+
@import "../../../assets/TextArea";
|