armtek-uikit-react 1.0.2 → 1.0.3

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.
Files changed (278) hide show
  1. package/lib/Adornment/package.json +7 -0
  2. package/lib/Alert/package.json +7 -0
  3. package/lib/Avatar/package.json +7 -0
  4. package/lib/AvatarGroup/package.json +6 -0
  5. package/lib/Badge/package.json +7 -0
  6. package/lib/Button/package.json +7 -7
  7. package/lib/ButtonGroup/package.json +6 -0
  8. package/lib/ButtonIcon/package.json +6 -0
  9. package/lib/Card/package.json +7 -0
  10. package/lib/Checkbox/package.json +6 -0
  11. package/lib/Chip/package.json +7 -0
  12. package/lib/DateField/package.json +6 -0
  13. package/lib/DatePicker/package.json +6 -0
  14. package/lib/DateService/package.json +6 -0
  15. package/lib/HelperText/package.json +6 -0
  16. package/lib/Interval/package.json +6 -0
  17. package/lib/IntervalSlide/package.json +6 -0
  18. package/lib/ListItem/package.json +6 -0
  19. package/lib/Loader/package.json +7 -0
  20. package/lib/Logo/package.json +7 -0
  21. package/lib/Password/package.json +6 -0
  22. package/lib/Period/package.json +6 -0
  23. package/lib/PeriodSelect/package.json +6 -0
  24. package/lib/Radio/package.json +6 -0
  25. package/lib/Rating/package.json +6 -0
  26. package/lib/RcSlider/package.json +6 -0
  27. package/lib/Select/package.json +6 -0
  28. package/lib/Slider/package.json +7 -0
  29. package/lib/Status/package.json +7 -0
  30. package/lib/StepItem/package.json +6 -0
  31. package/lib/StepItemIcon/package.json +6 -0
  32. package/lib/Stepper/package.json +7 -0
  33. package/lib/Switch/package.json +6 -0
  34. package/lib/TextArea/package.json +6 -0
  35. package/lib/TextField/package.json +6 -0
  36. package/lib/TimeField/package.json +6 -0
  37. package/lib/TimePicker/package.json +6 -0
  38. package/lib/Tooltip/package.json +7 -0
  39. package/lib/cjs/Adornment/Adornment.d.ts +7 -0
  40. package/lib/cjs/Adornment/Adornment.js +47 -0
  41. package/lib/cjs/Adornment/Adornment.module.scss +18 -0
  42. package/lib/cjs/Alert/Alert.d.ts +10 -0
  43. package/lib/cjs/Alert/Alert.js +46 -0
  44. package/lib/cjs/Alert/Alert.module.scss +38 -0
  45. package/lib/cjs/Avatar/Avatar.d.ts +13 -0
  46. package/lib/cjs/Avatar/Avatar.js +50 -0
  47. package/lib/cjs/Avatar/Avatar.module.scss +82 -0
  48. package/lib/cjs/Avatar/AvatarGroup.d.ts +8 -0
  49. package/lib/cjs/Avatar/AvatarGroup.js +34 -0
  50. package/lib/cjs/Avatar/AvatarGroup.module.scss +48 -0
  51. package/lib/cjs/Badge/Badge.d.ts +11 -0
  52. package/lib/cjs/Badge/Badge.js +34 -0
  53. package/lib/cjs/Badge/Badge.module.scss +83 -0
  54. package/lib/cjs/Button/Button.css +3 -0
  55. package/lib/cjs/{ui/Button → Button}/Button.d.ts +1 -1
  56. package/lib/cjs/{ui/Button → Button}/Button.js +4 -5
  57. package/lib/cjs/{ui/Button → Button}/Button.module.scss +1 -1
  58. package/lib/cjs/Card/Card.d.ts +4 -0
  59. package/lib/cjs/Card/Card.js +19 -0
  60. package/lib/cjs/Card/Card.module.scss +7 -0
  61. package/lib/cjs/Chip/Chip.d.ts +13 -0
  62. package/lib/cjs/Chip/Chip.js +41 -0
  63. package/lib/cjs/Chip/Chip.module.scss +96 -0
  64. package/lib/cjs/Form/Checkbox/Checkbox.d.ts +12 -0
  65. package/lib/cjs/Form/Checkbox/Checkbox.js +53 -0
  66. package/lib/cjs/Form/Checkbox/Checkbox.module.scss +297 -0
  67. package/lib/cjs/Form/Checkbox/Radio.d.ts +3 -0
  68. package/lib/cjs/Form/Checkbox/Radio.js +21 -0
  69. package/lib/cjs/Form/DateField/DateField.d.ts +26 -0
  70. package/lib/cjs/Form/DateField/DateField.js +71 -0
  71. package/lib/cjs/Form/DateField/DateField.module.scss +1 -0
  72. package/lib/cjs/Form/DateField/TimeField.d.ts +3 -0
  73. package/lib/cjs/Form/DateField/TimeField.js +19 -0
  74. package/lib/cjs/Form/DatePicker/DatePicker.d.ts +7 -0
  75. package/lib/cjs/Form/DatePicker/DatePicker.js +49 -0
  76. package/lib/cjs/Form/DatePicker/DatePicker.module.scss +7 -0
  77. package/lib/cjs/Form/DatePicker/PeriodSelect.d.ts +2 -0
  78. package/lib/cjs/Form/DatePicker/PeriodSelect.js +29 -0
  79. package/lib/cjs/Form/DatePicker/TimePicker.d.ts +2 -0
  80. package/lib/cjs/Form/DatePicker/TimePicker.js +28 -0
  81. package/lib/cjs/Form/DatePicker/styles.css +766 -0
  82. package/lib/cjs/Form/Interval/Interval.d.ts +21 -0
  83. package/lib/cjs/Form/Interval/Interval.js +98 -0
  84. package/lib/cjs/Form/Interval/Interval.module.scss +35 -0
  85. package/lib/cjs/Form/Interval/IntervalSlide.d.ts +4 -0
  86. package/lib/cjs/Form/Interval/IntervalSlide.js +48 -0
  87. package/lib/cjs/Form/Password/Password.d.ts +12 -0
  88. package/lib/cjs/Form/Password/Password.js +46 -0
  89. package/lib/cjs/Form/Password/Password.module.scss +2 -0
  90. package/lib/cjs/Form/Period/Period.d.ts +15 -0
  91. package/lib/cjs/Form/Period/Period.js +69 -0
  92. package/lib/cjs/Form/Period/Period.module.scss +10 -0
  93. package/lib/cjs/Form/Rating/Rating.d.ts +10 -0
  94. package/lib/cjs/Form/Rating/Rating.js +54 -0
  95. package/lib/cjs/Form/Rating/Rating.module.scss +19 -0
  96. package/lib/cjs/Form/Select/Select.d.ts +23 -0
  97. package/lib/cjs/Form/Select/Select.js +139 -0
  98. package/lib/cjs/Form/Select/Select.module.scss +26 -0
  99. package/lib/cjs/Form/Switch/Switch.d.ts +7 -0
  100. package/lib/cjs/Form/Switch/Switch.js +30 -0
  101. package/lib/cjs/Form/Switch/Switch.module.scss +69 -0
  102. package/lib/cjs/Form/TextArea/TextArea.d.ts +4 -0
  103. package/lib/cjs/Form/TextArea/TextArea.js +46 -0
  104. package/lib/cjs/Form/TextArea/TextArea.module.scss +15 -0
  105. package/lib/cjs/Form/TextField/TextField.d.ts +40 -0
  106. package/lib/cjs/Form/TextField/TextField.js +152 -0
  107. package/lib/cjs/Form/TextField/TextField.module.scss +160 -0
  108. package/lib/cjs/List/ListItem.d.ts +10 -0
  109. package/lib/cjs/List/ListItem.js +60 -0
  110. package/lib/cjs/List/ListItem.module.scss +34 -0
  111. package/lib/cjs/Loader/Loader.d.ts +6 -0
  112. package/lib/cjs/Loader/Loader.js +120 -0
  113. package/lib/cjs/Loader/Loader.module.scss +37 -0
  114. package/lib/cjs/Logo/Logo.d.ts +12 -0
  115. package/lib/cjs/Logo/Logo.js +102 -0
  116. package/lib/cjs/Logo/Logo.module.scss +29 -0
  117. package/lib/cjs/Slider/RcSlider.d.ts +2 -0
  118. package/lib/cjs/Slider/RcSlider.js +9 -0
  119. package/lib/cjs/Slider/Slider.d.ts +8 -0
  120. package/lib/cjs/Slider/Slider.js +34 -0
  121. package/lib/cjs/Slider/Slider.module.scss +6 -0
  122. package/lib/cjs/Slider/style.css +281 -0
  123. package/lib/cjs/Status/Status.d.ts +10 -0
  124. package/lib/cjs/Status/Status.js +31 -0
  125. package/lib/cjs/Status/Status.module.scss +45 -0
  126. package/lib/cjs/Stepper/StepItem.d.ts +14 -0
  127. package/lib/cjs/Stepper/StepItem.js +56 -0
  128. package/lib/cjs/Stepper/StepItem.module.scss +67 -0
  129. package/lib/cjs/Stepper/StepItemIcon.d.ts +11 -0
  130. package/lib/cjs/Stepper/StepItemIcon.js +40 -0
  131. package/lib/cjs/Stepper/StepItemIcon.module.scss +47 -0
  132. package/lib/cjs/Stepper/Stepper.d.ts +11 -0
  133. package/lib/cjs/Stepper/Stepper.js +45 -0
  134. package/lib/cjs/Stepper/Stepper.module.scss +34 -0
  135. package/lib/cjs/Tooltip/Tooltip.d.ts +7 -0
  136. package/lib/cjs/Tooltip/Tooltip.js +32 -0
  137. package/lib/cjs/Tooltip/Tooltip.module.scss +18 -0
  138. package/lib/cjs/Typography/HelperText/HelperText.d.ts +6 -0
  139. package/lib/cjs/Typography/HelperText/HelperText.js +28 -0
  140. package/lib/cjs/Typography/HelperText/HelperText.module.scss +10 -0
  141. package/lib/cjs/assets/fonts.scss +0 -18
  142. package/lib/cjs/assets/global.css +36 -0
  143. package/lib/cjs/assets/styles.scss +0 -10
  144. package/lib/cjs/index.d.ts +29 -29
  145. package/lib/cjs/index.js +30 -2
  146. package/lib/dist/armtek-uikit-react-index.js +293 -293
  147. package/lib/dist/armtek-uikit-react-index.min.js +1 -1
  148. package/lib/esm/Adornment/Adornment.d.ts +7 -0
  149. package/lib/esm/Adornment/Adornment.js +40 -0
  150. package/lib/esm/Adornment/Adornment.module.scss +18 -0
  151. package/lib/esm/Alert/Alert.d.ts +10 -0
  152. package/lib/esm/Alert/Alert.js +41 -0
  153. package/lib/esm/Alert/Alert.module.scss +38 -0
  154. package/lib/esm/Avatar/Avatar.d.ts +13 -0
  155. package/lib/esm/Avatar/Avatar.js +45 -0
  156. package/lib/esm/Avatar/Avatar.module.scss +82 -0
  157. package/lib/esm/Avatar/AvatarGroup.d.ts +8 -0
  158. package/lib/esm/Avatar/AvatarGroup.js +29 -0
  159. package/lib/esm/Avatar/AvatarGroup.module.scss +48 -0
  160. package/lib/esm/Badge/Badge.d.ts +11 -0
  161. package/lib/esm/Badge/Badge.js +29 -0
  162. package/lib/esm/Badge/Badge.module.scss +83 -0
  163. package/lib/esm/Button/Button.css +3 -0
  164. package/lib/esm/{ui/Button → Button}/Button.d.ts +1 -1
  165. package/lib/esm/{ui/Button → Button}/Button.js +5 -5
  166. package/lib/esm/{ui/Button → Button}/Button.module.scss +1 -1
  167. package/lib/esm/Card/Card.d.ts +4 -0
  168. package/lib/esm/Card/Card.js +13 -0
  169. package/lib/esm/Card/Card.module.scss +7 -0
  170. package/lib/esm/Chip/Chip.d.ts +13 -0
  171. package/lib/esm/Chip/Chip.js +36 -0
  172. package/lib/esm/Chip/Chip.module.scss +96 -0
  173. package/lib/esm/Form/Checkbox/Checkbox.d.ts +12 -0
  174. package/lib/esm/Form/Checkbox/Checkbox.js +49 -0
  175. package/lib/esm/Form/Checkbox/Checkbox.module.scss +297 -0
  176. package/lib/esm/Form/Checkbox/Radio.d.ts +3 -0
  177. package/lib/esm/Form/Checkbox/Radio.js +15 -0
  178. package/lib/esm/Form/DateField/DateField.d.ts +26 -0
  179. package/lib/esm/Form/DateField/DateField.js +66 -0
  180. package/lib/esm/Form/DateField/DateField.module.scss +1 -0
  181. package/lib/esm/Form/DateField/TimeField.d.ts +3 -0
  182. package/lib/esm/Form/DateField/TimeField.js +13 -0
  183. package/lib/esm/Form/DatePicker/DatePicker.d.ts +7 -0
  184. package/lib/esm/Form/DatePicker/DatePicker.js +41 -0
  185. package/lib/esm/Form/DatePicker/DatePicker.module.scss +7 -0
  186. package/lib/esm/Form/DatePicker/PeriodSelect.d.ts +2 -0
  187. package/lib/esm/Form/DatePicker/PeriodSelect.js +24 -0
  188. package/lib/esm/Form/DatePicker/TimePicker.d.ts +2 -0
  189. package/lib/esm/Form/DatePicker/TimePicker.js +23 -0
  190. package/lib/esm/Form/DatePicker/styles.css +766 -0
  191. package/lib/esm/Form/Interval/Interval.d.ts +21 -0
  192. package/lib/esm/Form/Interval/Interval.js +94 -0
  193. package/lib/esm/Form/Interval/Interval.module.scss +35 -0
  194. package/lib/esm/Form/Interval/IntervalSlide.d.ts +4 -0
  195. package/lib/esm/Form/Interval/IntervalSlide.js +44 -0
  196. package/lib/esm/Form/Password/Password.d.ts +12 -0
  197. package/lib/esm/Form/Password/Password.js +41 -0
  198. package/lib/esm/Form/Password/Password.module.scss +2 -0
  199. package/lib/esm/Form/Period/Period.d.ts +15 -0
  200. package/lib/esm/Form/Period/Period.js +65 -0
  201. package/lib/esm/Form/Period/Period.module.scss +10 -0
  202. package/lib/esm/Form/Rating/Rating.d.ts +10 -0
  203. package/lib/esm/Form/Rating/Rating.js +50 -0
  204. package/lib/esm/Form/Rating/Rating.module.scss +19 -0
  205. package/lib/esm/Form/Select/Select.d.ts +23 -0
  206. package/lib/esm/Form/Select/Select.js +135 -0
  207. package/lib/esm/Form/Select/Select.module.scss +26 -0
  208. package/lib/esm/Form/Switch/Switch.d.ts +7 -0
  209. package/lib/esm/Form/Switch/Switch.js +25 -0
  210. package/lib/esm/Form/Switch/Switch.module.scss +69 -0
  211. package/lib/esm/Form/TextArea/TextArea.d.ts +4 -0
  212. package/lib/esm/Form/TextArea/TextArea.js +41 -0
  213. package/lib/esm/Form/TextArea/TextArea.module.scss +15 -0
  214. package/lib/esm/Form/TextField/TextField.d.ts +40 -0
  215. package/lib/esm/Form/TextField/TextField.js +147 -0
  216. package/lib/esm/Form/TextField/TextField.module.scss +160 -0
  217. package/lib/esm/List/ListItem.d.ts +10 -0
  218. package/lib/esm/List/ListItem.js +53 -0
  219. package/lib/esm/List/ListItem.module.scss +34 -0
  220. package/lib/esm/Loader/Loader.d.ts +6 -0
  221. package/lib/esm/Loader/Loader.js +115 -0
  222. package/lib/esm/Loader/Loader.module.scss +37 -0
  223. package/lib/esm/Logo/Logo.d.ts +12 -0
  224. package/lib/esm/Logo/Logo.js +97 -0
  225. package/lib/esm/Logo/Logo.module.scss +29 -0
  226. package/lib/esm/Slider/RcSlider.d.ts +2 -0
  227. package/lib/esm/Slider/RcSlider.js +2 -0
  228. package/lib/esm/Slider/Slider.d.ts +8 -0
  229. package/lib/esm/Slider/Slider.js +29 -0
  230. package/lib/esm/Slider/Slider.module.scss +6 -0
  231. package/lib/esm/Slider/style.css +281 -0
  232. package/lib/esm/Status/Status.d.ts +10 -0
  233. package/lib/esm/Status/Status.js +26 -0
  234. package/lib/esm/Status/Status.module.scss +45 -0
  235. package/lib/esm/Stepper/StepItem.d.ts +14 -0
  236. package/lib/esm/Stepper/StepItem.js +51 -0
  237. package/lib/esm/Stepper/StepItem.module.scss +67 -0
  238. package/lib/esm/Stepper/StepItemIcon.d.ts +11 -0
  239. package/lib/esm/Stepper/StepItemIcon.js +34 -0
  240. package/lib/esm/Stepper/StepItemIcon.module.scss +47 -0
  241. package/lib/esm/Stepper/Stepper.d.ts +11 -0
  242. package/lib/esm/Stepper/Stepper.js +40 -0
  243. package/lib/esm/Stepper/Stepper.module.scss +34 -0
  244. package/lib/esm/Tooltip/Tooltip.d.ts +7 -0
  245. package/lib/esm/Tooltip/Tooltip.js +28 -0
  246. package/lib/esm/Tooltip/Tooltip.module.scss +18 -0
  247. package/lib/esm/Typography/HelperText/HelperText.d.ts +6 -0
  248. package/lib/esm/Typography/HelperText/HelperText.js +22 -0
  249. package/lib/esm/Typography/HelperText/HelperText.module.scss +10 -0
  250. package/lib/esm/assets/fonts.scss +0 -18
  251. package/lib/esm/assets/global.css +36 -0
  252. package/lib/esm/assets/styles.scss +0 -10
  253. package/lib/esm/index.d.ts +29 -29
  254. package/lib/esm/index.js +15 -1
  255. package/lib/helpers/package.json +6 -0
  256. package/lib/theme/package.json +6 -0
  257. package/lib/useClickOutside/package.json +6 -0
  258. package/package.json +6 -2
  259. package/lib/cjs/assets/index.d.ts +0 -16
  260. package/lib/cjs/ui/Button/style.css +0 -299
  261. package/lib/esm/assets/index.d.ts +0 -16
  262. package/lib/esm/ui/Button/style.css +0 -299
  263. /package/lib/cjs/{ui/Button → Button}/ButtonGroup.d.ts +0 -0
  264. /package/lib/cjs/{ui/Button → Button}/ButtonGroup.js +0 -0
  265. /package/lib/cjs/{ui/Button → Button}/ButtonIcon.d.ts +0 -0
  266. /package/lib/cjs/{ui/Button → Button}/ButtonIcon.js +0 -0
  267. /package/lib/cjs/{shared/hooks → hooks}/useClickOutside.d.ts +0 -0
  268. /package/lib/cjs/{shared/hooks → hooks}/useClickOutside.js +0 -0
  269. /package/lib/cjs/{shared/services → services}/DateService.d.ts +0 -0
  270. /package/lib/cjs/{shared/services → services}/DateService.js +0 -0
  271. /package/lib/esm/{ui/Button → Button}/ButtonGroup.d.ts +0 -0
  272. /package/lib/esm/{ui/Button → Button}/ButtonGroup.js +0 -0
  273. /package/lib/esm/{ui/Button → Button}/ButtonIcon.d.ts +0 -0
  274. /package/lib/esm/{ui/Button → Button}/ButtonIcon.js +0 -0
  275. /package/lib/esm/{shared/hooks → hooks}/useClickOutside.d.ts +0 -0
  276. /package/lib/esm/{shared/hooks → hooks}/useClickOutside.js +0 -0
  277. /package/lib/esm/{shared/services → services}/DateService.d.ts +0 -0
  278. /package/lib/esm/{shared/services → services}/DateService.js +0 -0
@@ -0,0 +1,45 @@
1
+ @import "../assets/styles";
2
+
3
+ .status{
4
+ display: inline-flex;
5
+ align-items: center;
6
+ padding: 3px 8px 1px;
7
+ border-radius: 4px;
8
+ }
9
+ .status_primary{
10
+ background: rgba($color-primary-dark, 0.2);
11
+ color: $color-primary-dark;
12
+ }
13
+ .status_secondary{
14
+ background: rgba($color-secondary-dark, 0.2);
15
+ color: $color-secondary-dark;
16
+ }
17
+ .status_neutral{
18
+ background: rgba(#4D5359, 0.2);
19
+ color: rgba(#212529, 0.7);
20
+ }
21
+ .status_error{
22
+ background: rgba($color-error-dark, 0.2);
23
+ color: $color-error-dark;
24
+ }
25
+ .status_warning{
26
+ background: rgba(#FFC61A, 0.2);
27
+ color: $color-secondary-dark;
28
+ }
29
+ .status_info{
30
+ background: rgba(#0D46FF, 0.2);
31
+ color: $color-primary-dark;
32
+ }
33
+ .status_success{
34
+ background: rgba(#0BD998, 0.2);
35
+ color: $color-success-dark;
36
+ }
37
+ .status__content{
38
+ font-size: 14px;
39
+ line-height: 1;
40
+ }
41
+ .status__icon{
42
+ margin-left: 4px;
43
+ font-size: 14px;
44
+ line-height: 1.5;
45
+ }
@@ -0,0 +1,14 @@
1
+ import { ReactNode } from 'react';
2
+ import { StepItemIconProps } from './StepItemIcon';
3
+ import { ButtonProps } from '../Button/Button';
4
+ export type StepItemProps = {
5
+ title: string;
6
+ children?: ReactNode | string;
7
+ content?: ReactNode | string;
8
+ button?: string;
9
+ buttonProps?: ButtonProps;
10
+ last?: boolean;
11
+ orientation?: 'horizontal' | 'vertical';
12
+ } & StepItemIconProps;
13
+ declare const StepItem: (props: StepItemProps) => import("react/jsx-runtime").JSX.Element;
14
+ export default StepItem;
@@ -0,0 +1,56 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ exports.__esModule = true;
5
+ exports.default = void 0;
6
+ var _StepItemIcon = _interopRequireDefault(require("./StepItemIcon"));
7
+ var _StepItemModule = _interopRequireDefault(require("./StepItem.module.scss"));
8
+ var _clsx = _interopRequireDefault(require("clsx"));
9
+ var _Button = _interopRequireDefault(require("../Button/Button"));
10
+ var _jsxRuntime = require("react/jsx-runtime");
11
+ const StepItem = props => {
12
+ let {
13
+ title,
14
+ children,
15
+ content,
16
+ button,
17
+ buttonProps,
18
+ last,
19
+ orientation = 'horizontal',
20
+ ...iconProps
21
+ } = props;
22
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
23
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
24
+ className: (0, _clsx.default)(_StepItemModule.default.stepItem, _StepItemModule.default['stepItem_' + props.size], {
25
+ [_StepItemModule.default.stepItem_last]: last,
26
+ [_StepItemModule.default.stepItem_horizontal]: orientation === 'horizontal'
27
+ }),
28
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
29
+ className: _StepItemModule.default.stepItem__inner,
30
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
31
+ className: _StepItemModule.default.stepItem__icon,
32
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StepItemIcon.default, {
33
+ ...iconProps
34
+ })
35
+ }), !!title && /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
36
+ className: (0, _clsx.default)(_StepItemModule.default.stepItem__title, {
37
+ [_StepItemModule.default.stepItem__title_error]: iconProps.error
38
+ }),
39
+ children: title
40
+ })]
41
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
42
+ className: _StepItemModule.default.stepItem__content,
43
+ children: [content || children, !!button && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
44
+ className: _StepItemModule.default.stepItem__button,
45
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
46
+ ...buttonProps,
47
+ children: button
48
+ })
49
+ })]
50
+ })]
51
+ })
52
+ });
53
+ };
54
+ var _default = StepItem;
55
+ exports.default = _default;
56
+ module.exports = exports.default;
@@ -0,0 +1,67 @@
1
+ @import "../assets/styles";
2
+
3
+ .stepItem__inner{
4
+ @include flex(flex-start, flex-start)
5
+ }
6
+
7
+ .stepItem__title{
8
+ font-weight: 700;
9
+ margin: 2px 0 0 $size-step;
10
+ position: relative;
11
+ background: #fff;
12
+ padding-right: 5px;
13
+ }
14
+ .stepItem__title_error{
15
+ color: $color-error-dark
16
+ }
17
+
18
+ .stepItem__content{
19
+ padding-left: 23px;
20
+ border-left: 1px solid #B1BCC6;
21
+ margin-left: 11px;
22
+ margin-top:5px;
23
+ position: relative;
24
+ }
25
+ .stepItem__button{
26
+ margin-top: $size-step;
27
+ }
28
+
29
+
30
+ .stepItem_small{
31
+ & .stepItem__content,
32
+ & .stepItem__title{
33
+ font-size: 14px;
34
+ }
35
+ & .stepItem__content{
36
+ padding-left: 19px;
37
+ margin-left: 10px;
38
+ }
39
+ &.stepItem_horizontal{
40
+ & .stepItem__content:before{
41
+ top: -15px;
42
+ }
43
+ }
44
+ }
45
+ .stepItem_last{
46
+ & .stepItem__content{
47
+ border-color:transparent;
48
+ &:before{
49
+ display: none;
50
+ }
51
+ }
52
+ }
53
+ .stepItem_horizontal{
54
+ & .stepItem__content{
55
+ border-color:transparent;
56
+ }
57
+ & .stepItem__content:before{
58
+ content: '';
59
+ position: absolute;
60
+ top: -19px;
61
+ width: 100%;
62
+ left: 22px;
63
+ height: 1px;
64
+ background: #B1BCC6;
65
+ z-index: -1;
66
+ }
67
+ }
@@ -0,0 +1,11 @@
1
+ import { SizeType } from '../shared/types/theme';
2
+ export type StepItemIconProps = {
3
+ number?: string | number;
4
+ size?: Exclude<SizeType, 'extraLarge' | 'medium'>;
5
+ active?: boolean;
6
+ error?: boolean;
7
+ complete?: boolean;
8
+ icon?: string;
9
+ };
10
+ declare const StepItemIcon: (props: StepItemIconProps) => import("react/jsx-runtime").JSX.Element;
11
+ export default StepItemIcon;
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ exports.__esModule = true;
5
+ exports.default = void 0;
6
+ var _StepItemIconModule = _interopRequireDefault(require("./StepItemIcon.module.scss"));
7
+ var _clsx = _interopRequireDefault(require("clsx"));
8
+ var _jsxRuntime = require("react/jsx-runtime");
9
+ const StepItemIcon = props => {
10
+ let icon = '';
11
+ if (!props.number) {
12
+ if (props.active) icon = 'schedule';else if (props.complete) icon = 'done';
13
+ }
14
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
15
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
16
+ className: (0, _clsx.default)(_StepItemIconModule.default.stepItemIcon, _StepItemIconModule.default['stepItemIcon_' + props.size], {
17
+ [_StepItemIconModule.default.stepItemIcon_active]: props.active,
18
+ [_StepItemIconModule.default.stepItemIcon_error]: props.error,
19
+ [_StepItemIconModule.default.stepItemIcon_complete]: props.complete,
20
+ [_StepItemIconModule.default.stepItemIcon_icon]: !props.icon
21
+ }),
22
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
23
+ className: _StepItemIconModule.default.stepItemIcon__inner,
24
+ children: !props.error ? !props.number ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
25
+ className: 'material_icon_solid',
26
+ children: icon
27
+ }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
28
+ className: _StepItemIconModule.default.stepItemIcon__number,
29
+ children: props.number
30
+ }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
31
+ className: 'material_icon_solid',
32
+ children: "warning"
33
+ })
34
+ })
35
+ })
36
+ });
37
+ };
38
+ var _default = StepItemIcon;
39
+ exports.default = _default;
40
+ module.exports = exports.default;
@@ -0,0 +1,47 @@
1
+ @import "../assets/styles";
2
+
3
+ .stepItemIcon{
4
+ @include flex(center);
5
+ width: 24px;
6
+ min-width: 24px;
7
+ height: 24px;
8
+ border-radius: 50%;
9
+ border: 1px solid;
10
+ & .stepItemIcon__number{
11
+ font-size: 16px;
12
+ }
13
+ &_small{
14
+ width: 20px;
15
+ min-width: 20px;
16
+ height: 20px;
17
+ & .stepItemIcon__number{
18
+ font-size: 14px;
19
+ }
20
+ }
21
+ border-color: $color-primary;
22
+ color: $color-primary;
23
+ }
24
+
25
+ .stepItemIcon__inner{
26
+ font-size: 0;
27
+ }
28
+
29
+ .stepItemIcon_active{
30
+ color: #fff;
31
+ background: $color-primary;
32
+ &.stepItemIcon_icon{
33
+ background: transparent;
34
+ color: $color-primary;
35
+ border: none;
36
+ }
37
+ }
38
+ .stepItemIcon_complete{
39
+ color: #fff;
40
+ background: $color-success;
41
+ border-color: $color-success;
42
+ }
43
+ .stepItemIcon_error{
44
+ color: $color-error-dark !important;
45
+ background: transparent;
46
+ border-color: transparent;
47
+ }
@@ -0,0 +1,11 @@
1
+ import { StepItemProps } from './StepItem';
2
+ export type StepperProps = {
3
+ steps: Array<StepItemProps | string | number>;
4
+ active?: number;
5
+ error?: number;
6
+ complete?: number;
7
+ orientation?: 'vertical' | 'horizontal';
8
+ size?: StepItemProps['size'];
9
+ };
10
+ declare const Stepper: (props: StepperProps) => import("react/jsx-runtime").JSX.Element;
11
+ export default Stepper;
@@ -0,0 +1,45 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ exports.__esModule = true;
5
+ exports.default = void 0;
6
+ var _StepItem = _interopRequireDefault(require("./StepItem"));
7
+ var _StepperModule = _interopRequireDefault(require("./Stepper.module.scss"));
8
+ var _clsx = _interopRequireDefault(require("clsx"));
9
+ var _react = require("react");
10
+ var _jsxRuntime = require("react/jsx-runtime");
11
+ const Stepper = props => {
12
+ var _props$steps;
13
+ let {
14
+ orientation = 'horizontal'
15
+ } = props;
16
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
17
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
18
+ className: (0, _clsx.default)(_StepperModule.default.stepper, _StepperModule.default['stepper_' + props.size], {
19
+ [_StepperModule.default.stepper_horizontal]: orientation === 'horizontal'
20
+ }),
21
+ children: (_props$steps = props.steps) == null ? void 0 : _props$steps.map((item, index) => {
22
+ var _props$steps2;
23
+ let title = typeof item === 'string' || typeof item === 'number' ? String(item) : item.title;
24
+ let params = typeof item === 'string' || typeof item === 'number' ? {} : item;
25
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Fragment, {
26
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_StepItem.default, {
27
+ error: index + 1 === props.error,
28
+ active: index + 1 === props.active,
29
+ complete: index + 1 === props.complete || index + 1 < (props.active || 0),
30
+ ...params,
31
+ title: title,
32
+ last: index + 1 === ((_props$steps2 = props.steps) == null ? void 0 : _props$steps2.length),
33
+ orientation: orientation,
34
+ size: props.size
35
+ }), index + 1 < props.steps.length && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
36
+ className: _StepperModule.default.stepper__connector
37
+ })]
38
+ }, index);
39
+ })
40
+ })
41
+ });
42
+ };
43
+ var _default = Stepper;
44
+ exports.default = _default;
45
+ module.exports = exports.default;
@@ -0,0 +1,34 @@
1
+ @import "../assets/styles";
2
+
3
+ .stepper{
4
+
5
+ }
6
+ .stepper_horizontal{
7
+ display: flex;
8
+ }
9
+ .stepper__connector{
10
+ padding-left: 23px;
11
+ border-left: 1px solid #B1BCC6;
12
+ margin-left: 11px;
13
+ height: 25px;
14
+ margin-bottom: 5px;
15
+ }
16
+ .stepper_small{
17
+ & .stepper__connector{
18
+ padding-left: 19px;
19
+ margin-left: 10px;
20
+ }
21
+ }
22
+ .stepper_horizontal{
23
+ & .stepper__connector{
24
+ height: 1px;
25
+ width: auto;
26
+ margin-right: 5px;
27
+ margin-bottom: 0;
28
+ padding-left: 0;
29
+ border-left:none;
30
+ border-top: 1px solid #B1BCC6;
31
+ flex: 1 1 0;
32
+ margin-top:10px;
33
+ }
34
+ }
@@ -0,0 +1,7 @@
1
+ import { ReactNode } from 'react';
2
+ export type TooltipProps = {
3
+ text: string;
4
+ children: ReactNode;
5
+ };
6
+ declare function Tooltip(props: TooltipProps): import("react/jsx-runtime").JSX.Element;
7
+ export default Tooltip;
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+ "use client";
3
+
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
5
+ exports.__esModule = true;
6
+ exports.default = void 0;
7
+ var _TooltipModule = _interopRequireDefault(require("./Tooltip.module.scss"));
8
+ var _react = require("react");
9
+ var _jsxRuntime = require("react/jsx-runtime");
10
+ function Tooltip(props) {
11
+ let {
12
+ text,
13
+ children
14
+ } = props;
15
+ let [visible, setVisible] = (0, _react.useState)(false);
16
+ const handleEnter = () => setVisible(true);
17
+ const handleLeave = () => setVisible(false);
18
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
19
+ children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
20
+ className: _TooltipModule.default.tooltip,
21
+ onMouseEnter: handleEnter,
22
+ onMouseLeave: handleLeave,
23
+ children: [children, visible && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
24
+ className: _TooltipModule.default.tooltip__item,
25
+ children: text
26
+ })]
27
+ })
28
+ });
29
+ }
30
+ var _default = Tooltip;
31
+ exports.default = _default;
32
+ module.exports = exports.default;
@@ -0,0 +1,18 @@
1
+ @import "../assets/styles";
2
+
3
+ .tooltip{
4
+ display: inline-block;
5
+ position: relative;
6
+ }
7
+ .tooltip__item{
8
+ position: absolute;
9
+ padding: $size-step;
10
+ border-radius: $radius;
11
+ background: $color-gray-700;
12
+ color: #fff;
13
+ font-weight: 500;
14
+ font-size: 12px;
15
+ left: 50%;
16
+ bottom: 100%;
17
+ transform: translateX(-50%);
18
+ }
@@ -0,0 +1,6 @@
1
+ import { HTMLAttributes } from 'react';
2
+ type PropsType = {
3
+ error?: boolean;
4
+ } & HTMLAttributes<HTMLSpanElement>;
5
+ declare const HelperText: (props: PropsType) => import("react/jsx-runtime").JSX.Element;
6
+ export default HelperText;
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ exports.__esModule = true;
5
+ exports.default = void 0;
6
+ var _HelperTextModule = _interopRequireDefault(require("./HelperText.module.scss"));
7
+ var _clsx = _interopRequireDefault(require("clsx"));
8
+ var _jsxRuntime = require("react/jsx-runtime");
9
+ const HelperText = props => {
10
+ let {
11
+ className,
12
+ error,
13
+ children,
14
+ ...restProps
15
+ } = props;
16
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
17
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
18
+ ...restProps,
19
+ className: (0, _clsx.default)(_HelperTextModule.default.helperText, {
20
+ [_HelperTextModule.default.helperText_error]: !!error
21
+ }, className),
22
+ children: children
23
+ })
24
+ });
25
+ };
26
+ var _default = HelperText;
27
+ exports.default = _default;
28
+ module.exports = exports.default;
@@ -0,0 +1,10 @@
1
+ @import "../../assets/styles";
2
+
3
+ .helperText{
4
+ color: $color-gray-600;
5
+ font-size: 12px;
6
+ display: block;
7
+ }
8
+ .helperText_error{
9
+ color: $color-error-dark;
10
+ }
@@ -1,20 +1,2 @@
1
1
 
2
2
 
3
- .material_icon {
4
- font-family: 'Material Symbols Outlined';
5
- font-weight: normal;
6
- font-style: normal;
7
- font-size: 24px;
8
- line-height: 1;
9
- letter-spacing: normal;
10
- text-transform: none;
11
- display: inline-block;
12
- white-space: nowrap;
13
- word-wrap: normal;
14
- direction: ltr;
15
- -webkit-font-feature-settings: 'liga';
16
- -webkit-font-smoothing: antialiased;
17
- &_solid {
18
- font-weight: 700;
19
- }
20
- }
@@ -33,3 +33,39 @@ body{
33
33
  src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v134/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzazHD_dY43zj-jCxv3fzvRNU22ZXGJpEpjC_1p-p_4MrImHCIJIZrDBIG-ej.woff2) format('woff2');
34
34
  }
35
35
 
36
+ .text_error{
37
+ color: #CC2935;
38
+ }
39
+ .text_success{
40
+ color: #0BD998;
41
+ }
42
+ .material_icon {
43
+ font-family: 'Material Symbols Outlined';
44
+ font-weight: normal;
45
+ font-style: normal;
46
+ font-size: 24px;
47
+ line-height: 1;
48
+ letter-spacing: normal;
49
+ text-transform: none;
50
+ display: inline-block;
51
+ white-space: nowrap;
52
+ word-wrap: normal;
53
+ direction: ltr;
54
+ -webkit-font-feature-settings: 'liga';
55
+ -webkit-font-smoothing: antialiased;
56
+ }
57
+ .material_icon_solid{
58
+ font-family: 'Material Symbols Outlined';
59
+ font-style: normal;
60
+ font-size: 24px;
61
+ line-height: 1;
62
+ letter-spacing: normal;
63
+ text-transform: none;
64
+ display: inline-block;
65
+ white-space: nowrap;
66
+ word-wrap: normal;
67
+ direction: ltr;
68
+ -webkit-font-feature-settings: 'liga';
69
+ -webkit-font-smoothing: antialiased;
70
+ font-weight: 700;
71
+ }
@@ -1,7 +1,6 @@
1
1
  //@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
2
2
  //@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
3
3
 
4
- @import "fonts.scss";
5
4
 
6
5
  $font-family: 'Roboto';
7
6
 
@@ -105,15 +104,6 @@ $box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.1);
105
104
  // }
106
105
 
107
106
 
108
- .text_error{
109
- color: $color-error-dark;
110
- }
111
-
112
- .text_success{
113
- color: $color-success;
114
- }
115
-
116
-
117
107
  .adornmentContainer{
118
108
  display: flex;
119
109
  }
@@ -1,29 +1,29 @@
1
- export { default as Button } from './ui/Button/Button';
2
- export { default as ButtonIcon } from './ui/Button/ButtonIcon';
3
- export type { ButtonProps } from './ui/Button/Button';
4
- export { default as Alert } from './ui/Alert/Alert';
5
- export type { AlertProps } from './ui/Alert/Alert';
6
- export { default as Avatar } from './ui/Avatar/Avatar';
7
- export type { AvatarProps } from './ui/Avatar/Avatar';
8
- export { default as AvatarGroup } from './ui/Avatar/AvatarGroup';
9
- export type { AvatarGroupProps } from './ui/Avatar/AvatarGroup';
10
- export { default as Badge } from './ui/Badge/Badge';
11
- export type { BadgeProps } from './ui/Badge/Badge';
12
- export { default as Card } from './ui/Card/Card';
13
- export type { CardProps } from './ui/Card/Card';
14
- export { default as Chip } from './ui/Chip/Chip';
15
- export type { ChipProps } from './ui/Chip/Chip';
16
- export { default as ListItem } from './ui/List/ListItem';
17
- export type { ListItemProps } from './ui/List/ListItem';
18
- export { default as Loader } from './ui/Loader/Loader';
19
- export type { LoaderProps } from './ui/Loader/Loader';
20
- export { default as Logo } from './ui/Logo/Logo';
21
- export type { LogoProps } from './ui/Logo/Logo';
22
- export { default as Slider } from './ui/Slider/Slider';
23
- export type { SliderProps } from './ui/Slider/Slider';
24
- export { default as Status } from './ui/Status/Status';
25
- export type { StatusProps } from './ui/Status/Status';
26
- export { default as Stepper } from './ui/Stepper/Stepper';
27
- export type { StepperProps } from './ui/Stepper/Stepper';
28
- export { default as Tooltip } from './ui/Tooltip/Tooltip';
29
- export type { TooltipProps } from './ui/Tooltip/Tooltip';
1
+ export { default as Button } from './Button/Button';
2
+ export { default as ButtonIcon } from './Button/ButtonIcon';
3
+ export type { ButtonProps } from './Button/Button';
4
+ export { default as Alert } from './Alert/Alert';
5
+ export type { AlertProps } from './Alert/Alert';
6
+ export { default as Avatar } from './Avatar/Avatar';
7
+ export type { AvatarProps } from './Avatar/Avatar';
8
+ export { default as AvatarGroup } from './Avatar/AvatarGroup';
9
+ export type { AvatarGroupProps } from './Avatar/AvatarGroup';
10
+ export { default as Badge } from './Badge/Badge';
11
+ export type { BadgeProps } from './Badge/Badge';
12
+ export { default as Card } from './Card/Card';
13
+ export type { CardProps } from './Card/Card';
14
+ export { default as Chip } from './Chip/Chip';
15
+ export type { ChipProps } from './Chip/Chip';
16
+ export { default as ListItem } from './List/ListItem';
17
+ export type { ListItemProps } from './List/ListItem';
18
+ export { default as Loader } from './Loader/Loader';
19
+ export type { LoaderProps } from './Loader/Loader';
20
+ export { default as Logo } from './Logo/Logo';
21
+ export type { LogoProps } from './Logo/Logo';
22
+ export { default as Slider } from './Slider/Slider';
23
+ export type { SliderProps } from './Slider/Slider';
24
+ export { default as Status } from './Status/Status';
25
+ export type { StatusProps } from './Status/Status';
26
+ export { default as Stepper } from './Stepper/Stepper';
27
+ export type { StepperProps } from './Stepper/Stepper';
28
+ export { default as Tooltip } from './Tooltip/Tooltip';
29
+ export type { TooltipProps } from './Tooltip/Tooltip';
package/lib/cjs/index.js CHANGED
@@ -3,5 +3,33 @@
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
4
  exports.__esModule = true;
5
5
  exports.Tooltip = exports.Stepper = exports.Status = exports.Slider = exports.Logo = exports.Loader = exports.ListItem = exports.Chip = exports.Card = exports.ButtonIcon = exports.Button = exports.Badge = exports.AvatarGroup = exports.Avatar = exports.Alert = void 0;
6
- var _Button = _interopRequireDefault(require("./ui/Button/Button"));
7
- exports.Button = _Button.default;
6
+ var _Button = _interopRequireDefault(require("./Button/Button"));
7
+ exports.Button = _Button.default;
8
+ var _ButtonIcon = _interopRequireDefault(require("./Button/ButtonIcon"));
9
+ exports.ButtonIcon = _ButtonIcon.default;
10
+ var _Alert = _interopRequireDefault(require("./Alert/Alert"));
11
+ exports.Alert = _Alert.default;
12
+ var _Avatar = _interopRequireDefault(require("./Avatar/Avatar"));
13
+ exports.Avatar = _Avatar.default;
14
+ var _AvatarGroup = _interopRequireDefault(require("./Avatar/AvatarGroup"));
15
+ exports.AvatarGroup = _AvatarGroup.default;
16
+ var _Badge = _interopRequireDefault(require("./Badge/Badge"));
17
+ exports.Badge = _Badge.default;
18
+ var _Card = _interopRequireDefault(require("./Card/Card"));
19
+ exports.Card = _Card.default;
20
+ var _Chip = _interopRequireDefault(require("./Chip/Chip"));
21
+ exports.Chip = _Chip.default;
22
+ var _ListItem = _interopRequireDefault(require("./List/ListItem"));
23
+ exports.ListItem = _ListItem.default;
24
+ var _Loader = _interopRequireDefault(require("./Loader/Loader"));
25
+ exports.Loader = _Loader.default;
26
+ var _Logo = _interopRequireDefault(require("./Logo/Logo"));
27
+ exports.Logo = _Logo.default;
28
+ var _Slider = _interopRequireDefault(require("./Slider/Slider"));
29
+ exports.Slider = _Slider.default;
30
+ var _Status = _interopRequireDefault(require("./Status/Status"));
31
+ exports.Status = _Status.default;
32
+ var _Stepper = _interopRequireDefault(require("./Stepper/Stepper"));
33
+ exports.Stepper = _Stepper.default;
34
+ var _Tooltip = _interopRequireDefault(require("./Tooltip/Tooltip"));
35
+ exports.Tooltip = _Tooltip.default;