armtek-uikit-react 1.0.23 → 1.0.24
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/Button.scss +52 -20
- package/assets/ButtonGroup.scss +27 -0
- package/package.json +1 -1
- package/ui/Button/Button.js +2 -2
package/assets/Button.scss
CHANGED
|
@@ -198,21 +198,12 @@
|
|
|
198
198
|
|
|
199
199
|
|
|
200
200
|
.button_grouped_inline{
|
|
201
|
-
border-radius: 0;
|
|
202
|
-
&:first-child{
|
|
203
|
-
border-top-left-radius: $radius;
|
|
204
|
-
border-bottom-left-radius: $radius;
|
|
205
|
-
}
|
|
206
|
-
&:last-child{
|
|
207
|
-
border-top-right-radius: $radius;
|
|
208
|
-
border-bottom-right-radius: $radius;
|
|
209
|
-
}
|
|
210
201
|
&.button_contained{
|
|
211
202
|
&.button_primary + *{
|
|
212
203
|
border-left-color: $color-info-dark;
|
|
213
204
|
}
|
|
214
205
|
&.button_secondary + *{
|
|
215
|
-
border-left-color: $color-
|
|
206
|
+
border-left-color: $color-secondary-dark;
|
|
216
207
|
}
|
|
217
208
|
&.button_neutral + *{
|
|
218
209
|
border-left-color: $color-neutral-dark;
|
|
@@ -262,18 +253,59 @@
|
|
|
262
253
|
}
|
|
263
254
|
}
|
|
264
255
|
}
|
|
265
|
-
|
|
266
256
|
.button_grouped_column{
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
257
|
+
&.button_contained{
|
|
258
|
+
&.button_primary + *{
|
|
259
|
+
border-top-color: $color-info-dark;
|
|
260
|
+
}
|
|
261
|
+
&.button_secondary + *{
|
|
262
|
+
border-top-color: $color-secondary-dark;
|
|
263
|
+
}
|
|
264
|
+
&.button_neutral + *{
|
|
265
|
+
border-top-color: $color-neutral-dark;
|
|
266
|
+
}
|
|
267
|
+
&.button_black + *{
|
|
268
|
+
border-top-color: $color-neutral-dark;
|
|
269
|
+
}
|
|
270
270
|
}
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
271
|
+
&.button_outlined{
|
|
272
|
+
&.button_primary + *{
|
|
273
|
+
border-top-color: $color-info-dark;
|
|
274
|
+
}
|
|
275
|
+
&.button_primary:not(:last-child){
|
|
276
|
+
border-bottom: 0;
|
|
277
|
+
}
|
|
278
|
+
&.button_secondary + *{
|
|
279
|
+
border-top-color: $color-secondary;
|
|
280
|
+
}
|
|
281
|
+
&.button_secondary:not(:last-child){
|
|
282
|
+
border-bottom: 0;
|
|
283
|
+
}
|
|
284
|
+
&.button_neutral + *{
|
|
285
|
+
border-top-color: $color-neutral;
|
|
286
|
+
}
|
|
287
|
+
&.button_neutral:not(:last-child){
|
|
288
|
+
border-bottom: 0;
|
|
289
|
+
}
|
|
290
|
+
&.button_black + *{
|
|
291
|
+
border-top-color: $color-neutral;
|
|
292
|
+
}
|
|
293
|
+
&.button_black:not(:last-child){
|
|
294
|
+
border-bottom: 0;
|
|
295
|
+
}
|
|
274
296
|
}
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
297
|
+
&.button_transparent{
|
|
298
|
+
&.button_primary + *{
|
|
299
|
+
border-top-color: $color-gray-200;
|
|
300
|
+
}
|
|
301
|
+
&.button_secondary + *{
|
|
302
|
+
border-top-color: $color-gray-200;
|
|
303
|
+
}
|
|
304
|
+
&.button_neutral + *{
|
|
305
|
+
border-top-color: $color-gray-200;
|
|
306
|
+
}
|
|
307
|
+
&.button_black + *{
|
|
308
|
+
border-top-color: $color-gray-200;
|
|
309
|
+
}
|
|
278
310
|
}
|
|
279
311
|
}
|
package/assets/ButtonGroup.scss
CHANGED
|
@@ -6,7 +6,34 @@
|
|
|
6
6
|
}
|
|
7
7
|
.button_group_inline{
|
|
8
8
|
flex-direction: row;
|
|
9
|
+
& > * {
|
|
10
|
+
border-radius: 0;
|
|
11
|
+
&:first-child{
|
|
12
|
+
border-top-left-radius: $radius;
|
|
13
|
+
border-bottom-left-radius: $radius;
|
|
14
|
+
}
|
|
15
|
+
&:last-child{
|
|
16
|
+
border-top-right-radius: $radius;
|
|
17
|
+
border-bottom-right-radius: $radius;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
9
20
|
}
|
|
10
21
|
.button_group_column{
|
|
11
22
|
flex-direction: column;
|
|
23
|
+
display: inline-block;
|
|
24
|
+
& > * {
|
|
25
|
+
border-radius: 0;
|
|
26
|
+
width: 100%;
|
|
27
|
+
&:not(:first-child){
|
|
28
|
+
border-top-color: transparent;
|
|
29
|
+
}
|
|
30
|
+
&:first-child{
|
|
31
|
+
border-top-left-radius: $radius;
|
|
32
|
+
border-top-right-radius: $radius;
|
|
33
|
+
}
|
|
34
|
+
&:last-child{
|
|
35
|
+
border-bottom-left-radius: $radius;
|
|
36
|
+
border-bottom-right-radius: $radius;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
12
39
|
}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"armtek-uikit-react","version":"1.0.
|
|
1
|
+
{"name":"armtek-uikit-react","version":"1.0.24","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":"*"},"peerDependencies":{"react":"*","react-dom":"*"},"scripts":{"pub":"npm version patch && npm publish"}}
|
package/ui/Button/Button.js
CHANGED
|
@@ -3,7 +3,7 @@ import css from "./Button.module.scss";
|
|
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
4
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
6
|
-
const ButtonClasses = ['button', 'button_contained', 'button_transparent', 'button_outlined', 'button_primary', 'button_secondary', 'button_neutral', 'button_black', 'button__adornment', 'button__adornment_end', 'button__adornment_start', 'button_large', 'button_medium', 'button_small', 'button_icon', 'button_group', 'button_group_inline', 'button_group_column', 'button_grouped_inline', 'button_grouped_column'];
|
|
6
|
+
const ButtonClasses = ['Arm-button', 'button', 'button_contained', 'button_transparent', 'button_outlined', 'button_primary', 'button_secondary', 'button_neutral', 'button_black', 'button__adornment', 'button__adornment_end', 'button__adornment_start', 'button_large', 'button_medium', 'button_small', 'button_icon', 'button_group', 'button_group_inline', 'button_group_column', 'button_grouped_inline', 'button_grouped_column'];
|
|
7
7
|
|
|
8
8
|
// const css = getCssPrefix(ButtonClasses)
|
|
9
9
|
|
|
@@ -25,7 +25,7 @@ const Button = props => {
|
|
|
25
25
|
return /*#__PURE__*/_jsx(_Fragment, {
|
|
26
26
|
children: /*#__PURE__*/_jsxs(Component, {
|
|
27
27
|
...restProps,
|
|
28
|
-
className: clsx(css.button, css['button_' + size], css['button_' + variant], css['button_' + color], className, {
|
|
28
|
+
className: clsx('Arm-button', css.button, css['button_' + size], css['button_' + variant], css['button_' + color], className, {
|
|
29
29
|
[css['button_grouped_' + group]]: group,
|
|
30
30
|
[css.button_radius_none]: radius === false,
|
|
31
31
|
[css.button_radius_full]: radius === true
|