armtek-uikit-react 1.0.38 → 1.0.41

package/assets/Button.scss

@@ -19,6 +19,9 @@
     cursor: initial;
   }
 }
+.button__iconWrapper{
+  font-size: 0;
+}
 .button_radius_none{
   border-radius: 0;
 }

package/assets/Chip.scss

@@ -7,6 +7,11 @@
   font-size: 13px;
   display: inline-block;
 }
+
+.chip_square{
+  border-radius: $radius;
+}
+
 .chip__text{
   line-height: 1.15;
 }
@@ -85,6 +90,68 @@ button.chip_secondary{
   }
 }
 
+.chip_success{
+  background-color: $color-success;
+}
+a.chip_success,
+button.chip_success{
+  &:hover{
+    background-color: $color-success-dark;
+  }
+}
+
+.chip_error{
+  background-color: $color-error;
+}
+a.chip_error,
+button.chip_error{
+  &:hover{
+    color: #fff;
+    background-color: $color-error-dark;
+  }
+}
+
+.chip_warning{
+  background-color: $color-warning;
+}
+a.chip_warning,
+button.chip_warning{
+  &:hover{
+    background-color: $color-warning-dark;
+  }
+}
+
+.chip_info{
+  color: #fff;
+  background-color: $color-info;
+}
+a.chip_info,
+button.chip_info{
+  &:hover{
+    background-color: $color-info-dark;
+  }
+}
+
+.chip_black{
+  color: #fff;
+  background-color: $color-neutral;
+}
+a.chip_info,
+button.chip_info{
+  &:hover{
+    background-color: $color-neutral-dark;
+  }
+}
+
+.chip_white{
+  background: #fff;
+}
+a.chip_white,
+button.chip_white{
+  &:hover{
+    background-color: $color-gray-100;
+  }
+}
 .chip_primary{
   color: #fff;
   background-color: $color-primary;
@@ -96,6 +163,8 @@ button.chip_primary{
     background-color: $color-primary-dark;
   }
 }
+
+
 .chip_disabled{
   pointer-events: none;
   opacity: 0.5;

package/assets/StepItem.scss

@@ -55,6 +55,7 @@
     border-color:transparent;
   }
   & .stepItem__content:before{
+    display: none;
     content: '';
     position: absolute;
     top: -19px;
@@ -64,4 +65,24 @@
     background: #B1BCC6;
     z-index: -1;
   }
+  & .stepItem__inner{
+    position: relative;
+  }
+  & .stepItem__title{
+    margin-left: 0;
+    padding-left: 8px;
+  }
+  & .stepItem__inner:before{
+    content: '';
+    position: absolute;
+    top: 10px;
+    width: 100%;
+    left: 24px;
+    height: 1px;
+    background: #B1BCC6;
+    z-index: -1;
+  }
+  &.stepItem_last .stepItem__inner:before{
+    display: none;
+  }
 }

package/assets/StepItemIcon.scss

@@ -20,6 +20,7 @@
   }
   border-color: $color-primary;
   color: $color-primary;
+  background: #fff;
 }
 
 .stepItemIcon__inner{

package/package.json

@@ -1 +1 @@
-{"name":"armtek-uikit-react","version":"1.0.38","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"}}
+{"name":"armtek-uikit-react","version":"1.0.41","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/Alert/Alert.js

@@ -38,7 +38,10 @@ const Alert = props => {
         color: 'neutral',
         variant: 'transparent',
         className: clsx(css.alert__close, 'material_icon'),
-        children: "close"
+        children: /*#__PURE__*/_jsx("span", {
+          className: 'material_icon',
+          children: "close"
+        })
       })]
     })
   });

package/ui/Button/Button.d.ts

@@ -9,6 +9,7 @@ type OwnProps<T extends ElementType = ElementType> = {
     endAdornment?: string | ReactNode;
     group?: 'inline' | 'column';
     radius?: boolean;
+    icon?: boolean;
     as?: T;
 };
 export type ButtonProps<T extends ElementType = ElementType<HTMLAttributes<HTMLButtonElement>>> = OwnProps<T> & Omit<ComponentPropsWithoutRef<T>, keyof OwnProps>;

package/ui/Button/Button.js

@@ -34,6 +34,7 @@ const Button = props => {
         className: clsx(css.button__adornment, css.button__adornment_start),
         children: startAdornment
       }), /*#__PURE__*/_jsx("div", {
+        className: css.button__iconWrapper,
         children: children
       }), endAdornment && /*#__PURE__*/_jsx("div", {
         className: clsx(css.button__adornment, css.button__adornment_end),

package/ui/ButtonIcon/ButtonIcon.js

@@ -11,6 +11,7 @@ const ButtonIcon = props => {
   return /*#__PURE__*/_jsx(_Fragment, {
     children: /*#__PURE__*/_jsx(Button, {
       ...props,
+      icon: true,
       className: clsx(css.button_icon, css['button_icon_' + props.size], props.className),
       children: props.children
     })

package/ui/Chip/Chip.d.ts

@@ -1,12 +1,13 @@
 import { ComponentPropsWithoutRef, ElementType, MouseEvent, HTMLAttributes } from 'react';
-import { ColorType, SizeType, VariantType } from '../../types/theme';
+import { ColorStatusType, ColorThemeType, ColorType, SizeType, VariantType, ShapeType } from '../../types/theme';
 export type ChipProps<T extends ElementType = ElementType<HTMLAttributes<HTMLSpanElement>>> = Omit<ComponentPropsWithoutRef<T>, 'color'> & {
     size?: Exclude<SizeType, 'large' | 'extraLarge'>;
-    color?: ColorType;
+    color?: ColorType | ColorThemeType | ColorStatusType;
     text?: string;
     onClose?: (e: MouseEvent) => void;
     icon?: string;
     variant?: Exclude<VariantType, 'transparent'>;
+    shape?: ShapeType;
     as?: T;
     disabled?: boolean;
     className?: string;

package/ui/Chip/Chip.js

@@ -13,6 +13,7 @@ function Chip(props) {
     text,
     icon,
     onClose,
+    shape = 'circle',
     as,
     variant,
     color,
@@ -25,7 +26,7 @@ function Chip(props) {
     children: /*#__PURE__*/_jsx(Component, {
       className: clsx('Arm-chip', className, {
         [css.chip_disabled]: !!disabled
-      }, css.chip, css['chip_' + size], css['chip_' + variant], css['chip_' + color]),
+      }, css.chip, css['chip_' + size], css['chip_' + variant], css['chip_' + color], css['chip_' + shape]),
       children: /*#__PURE__*/_jsxs("span", {
         className: css.chip__inner,
         children: [icon && /*#__PURE__*/_jsx("span", {
@@ -39,7 +40,10 @@ function Chip(props) {
             [css.chip__close_disabled]: !!disabled
           }, css['chip__close_' + size], css['chip__close_' + color], css.chip__close),
           onClick: onClose,
-          children: "cancel"
+          children: /*#__PURE__*/_jsx("span", {
+            className: 'material_icon',
+            children: "cancel"
+          })
         })]
       })
     })