armtek-uikit-react 1.0.13 → 1.0.15

package/cjs/ui/Alert/Alert.module.scss

@@ -1,38 +0,0 @@
-@import "../../assets/styles";
-
-.alert{
-  padding: calc($size-step * 2) calc($size-step * 5) calc($size-step * 2) calc($size-step * 7);
-  background: $color-gray-300;
-  border-radius: $radius;
-  position: relative;
-}
-.alert__title{
-  font-weight: 700;
-  margin-bottom: calc($size-step / 2);
-}
-.alert__close{
-  position: absolute;
-  top: calc($size-step / 2);
-  right: calc($size-step / 2);
-}
-.alert__icon{
-  position: absolute;
-  top: calc($size-step * 2);
-  left: calc($size-step * 2);
-}
-.alert_success{
-  color: $color-success-dark;
-  background: $color-greent-50;
-}
-.alert_warning{
-  color: $color-secondary-dark;
-  background: $color-orange-50;
-}
-.alert_info{
-  color: $color-primary-dark;
-  background: $color-blue-50;
-}
-.alert_error{
-  color: $color-error-dark;
-  background: $color-red-50;
-}

package/cjs/ui/Avatar/Avatar.js

@@ -1,50 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _AvatarModule = _interopRequireDefault(require("./Avatar.module.scss"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-const getLetters = name => {
-  let nameParts = name.split(' ');
-  return nameParts[0].split('')[0] + (nameParts[1] ? nameParts[1].split('')[0] : '');
-};
-const Avatar = props => {
-  let icon = props.icon;
-  if (!props.icon && !props.name && !props.photo) icon = 'person';
-  let content = props.photo ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-    src: props.photo,
-    className: _AvatarModule.default.avatar__img,
-    alt: props.name,
-    title: props.name
-  }) : props.name ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    className: _AvatarModule.default.avatar__name,
-    children: getLetters(props.name)
-  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    className: (0, _clsx.default)(_AvatarModule.default.avatar__icon, 'material_icon_solid'),
-    children: icon
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _clsx.default)(_AvatarModule.default.avatar, _AvatarModule.default['avatar_' + props.size]),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: _AvatarModule.default.avatar__inner,
-        children: props.href ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
-          href: props.href,
-          ...props.linkProps,
-          className: _AvatarModule.default.avatar__inner,
-          children: content
-        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: _AvatarModule.default.avatar__inner,
-          children: content
-        })
-      }), props.status && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: (0, _clsx.default)(_AvatarModule.default.avatar__status, _AvatarModule.default['avatar__status_' + props.status])
-      })]
-    })
-  });
-};
-var _default = Avatar;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Avatar/Avatar.module.scss

@@ -1,82 +0,0 @@
-@import "../../assets/styles";
-
-.avatar{
-  width: $size-elarge;
-  height: $size-elarge;
-  min-width: $size-elarge;
-  border-radius: 50%;
-  background: $color-primary;
-  color: #fff;
-  position: relative;
-}
-.avatar__inner{
-  overflow: hidden;
-  border-radius: 50%;
-  width: 100%;
-  height: 100%;
-  @include flex(center);
-}
-.avatar_medium{
-  width: 40px;
-  height: 40px;
-  min-width: 40px;
-  & .avatar__name{
-    font-size: 16px;
-  }
-  & .avatar__icon{
-    font-size: 30px;
-  }
-  & .avatar__status{
-    right: -2px;
-    bottom: -2px;
-  }
-}
-.avatar_small{
-  width: 24px;
-  height: 24px;
-  min-width: 24px;
-  & .avatar__name{
-    font-size: 12px;
-  }
-  & .avatar__icon{
-    font-size: 20px;
-  }
-  & .avatar__status{
-    right: -5px;
-    bottom: -2px;
-  }
-}
-.avatar__inner{
-  font-size: 0;
-}
-.avatar__name{
-  font-size: 24px;
-}
-.avatar__icon{
-  font-size: 50px;
-}
-.avatar__img{
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-.avatar__status{
-  position: absolute;
-  width: 14px;
-  height: 14px;
-  border:1px solid #fff;
-  border-radius: 50%;
-  right: 0;
-  bottom: 0;
-}
-.avatar__status_success{
-  background: $color-success;
-}
-.avatar__status_error{
-  background: $color-error-dark;
-}
-.avatar__status_warning{
-  background: $color-warning;
-}

package/cjs/ui/Avatar/AvatarGroup.js

@@ -1,34 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _react = require("react");
-var _AvatarGroupModule = _interopRequireDefault(require("./AvatarGroup.module.scss"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-const AvatarGroup = props => {
-  let arrChildren = _react.Children.toArray(props.children);
-  let visiblePart = arrChildren.slice(0, props.limit || 3);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _clsx.default)(_AvatarGroupModule.default.avatarGroup, _AvatarGroupModule.default['avatarGroup_' + props.size]),
-      children: [visiblePart.length < arrChildren.length && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _clsx.default)(_AvatarGroupModule.default.avatarGroup__item, _AvatarGroupModule.default.avatarGroup__remains, _AvatarGroupModule.default['avatarGroup__remains_' + props.size]),
-        children: ["+", arrChildren.length - visiblePart.length]
-      }), visiblePart.map((item, index) => {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: _AvatarGroupModule.default.avatarGroup__item,
-          children: /*#__PURE__*/(0, _react.isValidElement)(item) && /*#__PURE__*/(0, _react.cloneElement)(item, {
-            ...item.props,
-            size: props.size,
-            key: index
-          })
-        }, index);
-      })]
-    })
-  });
-};
-var _default = AvatarGroup;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Badge/Badge.js

@@ -1,34 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _BadgeModule = _interopRequireDefault(require("./Badge.module.scss"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-function Badge(props) {
-  let {
-    color,
-    shape,
-    position
-  } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-      className: _BadgeModule.default.badge,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: _BadgeModule.default.badge__content,
-        children: props.children
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: (0, _clsx.default)(_BadgeModule.default.badge__item, _BadgeModule.default['badge__item_' + color], _BadgeModule.default['badge__item_' + shape], _BadgeModule.default['badge__item_' + position], {
-          [_BadgeModule.default.badge__item_content]: !!props.badgeText && !shape,
-          [_BadgeModule.default.badge__item_content_circle]: !!props.badgeText && shape === 'circle',
-          [_BadgeModule.default.badge__item_content_square]: !!props.badgeText && shape === 'square'
-        }),
-        children: props.badgeText
-      })]
-    })
-  });
-}
-var _default = Badge;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Button/Button.css

@@ -1,3 +0,0 @@
-.button{
-  background: red;
-}

package/cjs/ui/Button/Button.js

@@ -1,43 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _ButtonClasses = require("./ButtonClasses");
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-const Button = props => {
-  let {
-    size = 'extraLarge',
-    color = 'primary',
-    variant = 'contained',
-    endAdornment,
-    startAdornment,
-    children,
-    className,
-    group,
-    as,
-    ...restProps
-  } = props;
-  let Component = as || 'button';
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Component, {
-      ...restProps,
-      className: (0, _clsx.default)(_ButtonClasses.ButtonClasses.button, _ButtonClasses.ButtonClasses['button_' + size], _ButtonClasses.ButtonClasses['button_' + variant], _ButtonClasses.ButtonClasses['button_' + color], className, {
-        [_ButtonClasses.ButtonClasses['button_grouped_' + group]]: group
-      }),
-      children: [startAdornment && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: (0, _clsx.default)(_ButtonClasses.ButtonClasses.button__adornment, _ButtonClasses.ButtonClasses.button__adornment_start),
-        children: startAdornment
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: children
-      }), endAdornment && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: (0, _clsx.default)(_ButtonClasses.ButtonClasses.button__adornment, _ButtonClasses.ButtonClasses.button__adornment_end),
-        children: endAdornment
-      })]
-    })
-  });
-};
-var _default = Button;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Button/Button.module.scss

@@ -1,298 +0,0 @@
-@import "../../assets/styles";
-
-.button{
-  outline: none;
-  border:1px solid transparent;
-  border-radius: $radius;
-  text-transform: uppercase;
-  padding: $size-step calc(3 * $size-step);
-  cursor: pointer;
-  @include transition(0.3s);
-  font-weight: 500;
-  font-size: 16px;
-  height: $size-elarge;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  &:disabled{
-    cursor: initial;
-  }
-}
-.button_contained {
-  &.button_primary{
-    color: #fff;
-    background: $color-primary;
-    &:hover{
-      background: $color-primary-dark;
-    }
-    &:active{
-      background: $color-blue-800;
-    }
-    &:disabled{
-      background: $color-primary-light;
-    }
-  }
-  &.button_secondary {
-    background: $color-secondary;
-    color: #fff;
-    &:hover{
-      background: $color-secondary-dark;
-    }
-    &:active{
-      background: $color-orange-800;
-    }
-    &:disabled{
-      background: $color-secondary-light;
-    }
-  }
-  &.button_neutral {
-    background: $color-neutral;
-    &:hover{
-      background: $color-neutral-dark;
-    }
-    &:active{
-      background: $color-gray-600;
-    }
-    &:disabled{
-      background: $color-secondary-light;
-    }
-  }
-  &.button_black {
-    background: $color-gray-900;
-    &:hover{
-      background: $color-neutral-dark;
-    }
-    &:active{
-      background: $color-gray-600;
-    }
-    &:disabled{
-      background: $color-secondary-light;
-    }
-  }
-}
-.button_outlined {
-  background: transparent;
-  &.button_primary{
-
-    color: $color-primary;
-    border-color: $color-primary;
-    background: transparent;
-    &:hover{
-      background: rgba($color-primary, 0.1);
-    }
-    &:active{
-      background: $color-blue-A100;
-    }
-    &:disabled{
-      color: $color-primary-light;
-      border-color: $color-primary-light;
-    }
-  }
-  &.button_secondary {
-    border-color: $color-secondary;
-    color: $color-secondary;
-    &:hover{
-      background: rgba($color-secondary, 0.1);
-    }
-    &:active{
-      background: $color-orange-100;
-    }
-    &:disabled{
-      color: $color-primary-light;
-      border-color: $color-primary-light;
-    }
-  }
-  &.button_neutral,
-  &.button_black {
-    border-color: $color-gray-900;
-    color: $color-gray-900;
-    &:hover{
-      background: rgba($color-neutral, 0.1);
-    }
-    &:active{
-      background: $color-gray-300;
-    }
-    &:disabled{
-      color: $color-neutral-light;
-      border-color: $color-neutral-light;
-    }
-  }
-}
-.button_transparent {
-  background: transparent;
-  &.button_primary{
-    color: $color-primary;
-    background: transparent;
-    &:hover{
-      background: rgba($color-primary, 0.1);
-    }
-    &:active{
-      background: $color-blue-A100;
-    }
-    &:disabled{
-      color: $color-primary-light;
-      background: none;
-    }
-  }
-  &.button_secondary {
-    color: $color-secondary;
-    &:hover{
-      background: rgba($color-secondary, 0.1);
-    }
-    &:active{
-      background: $color-orange-100;
-    }
-    &:disabled{
-      color: $color-primary-light;
-      background: none;
-    }
-  }
-  &.button_neutral,
-  &.button_black {
-    color: $color-gray-900;
-    &:hover{
-      background: rgba($color-neutral, 0.1);
-    }
-    &:active{
-      background: $color-gray-300;
-    }
-    &:disabled{
-      color: $color-neutral-light;
-      background: none;
-    }
-  }
-}
-
-.button__adornment{
-  font-size: inherit;
-}
-.button__adornment_end{
-  margin-left: $size-step;
-}
-.button__adornment_start{
-  margin-right: $size-step;
-}
-
-.button_large{
-  height: $size-large;
-  font-size: 15px;
-}
-.button_medium{
-  height: $size-medium;
-  font-size: 14px;
-}
-.button_small{
-  height: $size-small;
-  font-size: 13px;
-}
-
-.button_icon{
-  padding: $size-step;
-  width: $size-elarge;
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 30px;
-  &.button_large{
-    width: $size-large;
-    font-size: 24px;
-  }
-  &.button_medium{
-    width: $size-medium;
-    font-size: 20px;
-  }
-  &.button_small{
-    width: $size-small;
-    padding: calc($size-step / 2);
-    font-size: 16px;
-  }
-}
-
-.button_group{
-  display: flex;
-  align-items: center;
-}
-.button_group_inline{
-  flex-direction: row;
-}
-.button_group_column{
-  flex-direction: column;
-}
-
-.button_grouped_inline{
-  border-radius: 0;
-  &:first-child{
-    border-top-left-radius: $radius;
-    border-bottom-left-radius: $radius;
-  }
-  &:last-child{
-    border-top-right-radius: $radius;
-    border-bottom-right-radius: $radius;
-  }
-  &.button_contained{
-    &.button_primary + *{
-      border-left-color: $color-info-dark;
-    }
-    &.button_secondary + *{
-      border-left-color: $color-primary-dark;
-    }
-    &.button_neutral + *{
-      border-left-color: $color-neutral-dark;
-    }
-    &.button_black + *{
-      border-left-color: $color-neutral-dark;
-    }
-  }
-  &.button_outlined{
-    &.button_primary + *{
-      border-left-color: $color-info-dark;
-    }
-    &.button_primary:not(:last-child){
-      border-right: 0;
-    }
-    &.button_secondary + *{
-      border-left-color: $color-secondary;
-    }
-    &.button_secondary:not(:last-child){
-      border-right: 0;
-    }
-    &.button_neutral + *{
-      border-left-color: $color-neutral;
-    }
-    &.button_neutral:not(:last-child){
-      border-right: 0;
-    }
-    &.button_black + *{
-      border-left-color: $color-neutral;
-    }
-    &.button_black:not(:last-child){
-      border-right: 0;
-    }
-  }
-  &.button_transparent{
-    &.button_primary + *{
-      border-left-color: $color-gray-200;
-    }
-    &.button_secondary + *{
-      border-left-color: $color-gray-200;
-    }
-    &.button_neutral + *{
-      border-left-color: $color-gray-200;
-    }
-    &.button_black + *{
-      border-left-color: $color-gray-200;
-    }
-  }
-}
-.button_grouped_column{
-  border-radius: 0;
-  &:first-child{
-    border-top-left-radius: $radius;
-    border-top-right-radius: $radius;
-  }
-  &:last-child{
-    border-bottom-left-radius: $radius;
-    border-bottom-right-radius: $radius;
-  }
-}

package/cjs/ui/Button/ButtonClasses.d.ts

@@ -1,3 +0,0 @@
-declare const ButtonClassesClean: string[];
-declare const ButtonClasses: Record<string, string>;
-export { ButtonClasses, ButtonClassesClean };

package/cjs/ui/Button/ButtonClasses.js

@@ -1,12 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.ButtonClassesClean = exports.ButtonClasses = void 0;
-var _styles = require("lib/const/styles");
-const ButtonClassesClean = ['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'];
-exports.ButtonClassesClean = ButtonClassesClean;
-const ButtonClasses = ButtonClassesClean.reduce((prev, current) => {
-  prev[current] = _styles.CSS_PREFIX + current;
-  return prev;
-}, {});
-exports.ButtonClasses = ButtonClasses;

package/cjs/ui/Button/ButtonGroup.js

@@ -1,26 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _ButtonModule = _interopRequireDefault(require("./Button.module.scss"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-const ButtonGroup = props => {
-  let {
-    orientation = 'inline',
-    className,
-    children,
-    ...restProps
-  } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      ...restProps,
-      className: (0, _clsx.default)(_ButtonModule.default.button_group, _ButtonModule.default['button_group_' + orientation], className),
-      children: children
-    })
-  });
-};
-var _default = ButtonGroup;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Button/ButtonIcon.d.ts

@@ -1,3 +0,0 @@
-import { ButtonProps } from './Button';
-declare const ButtonIcon: (props: ButtonProps) => import("react/jsx-runtime").JSX.Element;
-export default ButtonIcon;

package/cjs/ui/Button/ButtonIcon.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _Button = _interopRequireDefault(require("./Button"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _ButtonModule = _interopRequireDefault(require("./Button.module.scss"));
-var _jsxRuntime = require("react/jsx-runtime");
-const ButtonIcon = props => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-      ...props,
-      className: (0, _clsx.default)(_ButtonModule.default.button_icon, props.className),
-      children: props.children
-    })
-  });
-};
-var _default = ButtonIcon;
-exports.default = _default;
-module.exports = exports.default;

package/cjs/ui/Card/Card.js

@@ -1,19 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.default = void 0;
-var _CardModule = _interopRequireDefault(require("./Card.module.scss"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _jsxRuntime = require("react/jsx-runtime");
-const Card = props => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      ...props,
-      className: (0, _clsx.default)(_CardModule.default.card, props.className)
-    })
-  });
-};
-var _default = Card;
-exports.default = _default;
-module.exports = exports.default;