@itcase/ui 1.3.17 → 1.3.19

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 (59) hide show
  1. package/dist/{Button-BIVXOiP4.js → Button-BSygAkO5.js} +2 -2
  2. package/dist/{Button-C4oPIe_E.js → Button-Bn8Mjoeh.js} +2 -2
  3. package/dist/{DropdownItem-BGsCHiqr.js → DropdownItem-CExjlJjQ.js} +1 -1
  4. package/dist/{DropdownItem-CRvS3KEp.js → DropdownItem-DFE1HsyX.js} +1 -1
  5. package/dist/{Icon-DJSIqu5Z.js → Icon-ByLHEhHL.js} +1 -1
  6. package/dist/{Icon-Dz1q9WC2.js → Icon-DotE-03d.js} +1 -1
  7. package/dist/{Link-U60OVrcS.js → Link-C53o3P6_.js} +2 -2
  8. package/dist/{Link-CH-W1dww.js → Link-CoAhRbFg.js} +2 -2
  9. package/dist/{MenuItem-C422Veuw.js → MenuItem-Cu6wlj-X.js} +1 -1
  10. package/dist/{MenuItem-GoaeJJ04.js → MenuItem-Ybh5Mpoi.js} +1 -1
  11. package/dist/cjs/components/Accordion.js +2 -2
  12. package/dist/cjs/components/Avatar.js +2 -2
  13. package/dist/cjs/components/Breadcrumbs.js +2 -2
  14. package/dist/cjs/components/Button.js +3 -3
  15. package/dist/cjs/components/Cell.js +2 -2
  16. package/dist/cjs/components/Choice.js +2 -2
  17. package/dist/cjs/components/CookiesWarning.js +3 -3
  18. package/dist/cjs/components/DatePicker.js +3 -3
  19. package/dist/cjs/components/Dropdown.js +2 -2
  20. package/dist/cjs/components/Icon.js +2 -2
  21. package/dist/cjs/components/InputPassword.js +2 -2
  22. package/dist/cjs/components/Link.js +1 -1
  23. package/dist/cjs/components/List.js +1 -1
  24. package/dist/cjs/components/Logo.js +1 -1
  25. package/dist/cjs/components/Menu.js +2 -2
  26. package/dist/cjs/components/MenuItem.js +2 -2
  27. package/dist/cjs/components/Pagination.js +3 -3
  28. package/dist/cjs/components/Response.js +3 -3
  29. package/dist/cjs/components/Search.js +2 -2
  30. package/dist/cjs/components/Select.js +2 -2
  31. package/dist/cjs/components/SiteMenu.js +2 -2
  32. package/dist/cjs/components/Tab.js +1 -1
  33. package/dist/cjs/hooks/useStyles.js +41 -18
  34. package/dist/components/Accordion.js +2 -2
  35. package/dist/components/Avatar.js +2 -2
  36. package/dist/components/Breadcrumbs.js +2 -2
  37. package/dist/components/Button.js +3 -3
  38. package/dist/components/Cell.js +2 -2
  39. package/dist/components/Choice.js +2 -2
  40. package/dist/components/CookiesWarning.js +3 -3
  41. package/dist/components/DatePicker.js +3 -3
  42. package/dist/components/Dropdown.js +2 -2
  43. package/dist/components/Icon.js +2 -2
  44. package/dist/components/InputPassword.js +2 -2
  45. package/dist/components/Link.js +1 -1
  46. package/dist/components/List.js +1 -1
  47. package/dist/components/Logo.js +1 -1
  48. package/dist/components/Menu.js +2 -2
  49. package/dist/components/MenuItem.js +2 -2
  50. package/dist/components/Pagination.js +3 -3
  51. package/dist/components/Response.js +3 -3
  52. package/dist/components/Search.js +2 -2
  53. package/dist/components/Select.js +2 -2
  54. package/dist/components/SiteMenu.js +2 -2
  55. package/dist/components/Tab.js +1 -1
  56. package/dist/css/components/Cell/Cell.css +2 -4
  57. package/dist/css/components/Label/Label.css +1 -1
  58. package/dist/hooks/useStyles.js +41 -18
  59. package/package.json +1 -1
@@ -5,8 +5,8 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
7
7
  var useStyles = require('./cjs/hooks/useStyles.js');
8
- var Icon = require('./Icon-DJSIqu5Z.js');
9
- var Link = require('./Link-CH-W1dww.js');
8
+ var Icon = require('./Icon-ByLHEhHL.js');
9
+ var Link = require('./Link-CoAhRbFg.js');
10
10
  var Loader = require('./Loader-D_53c71f.js');
11
11
  var Text = require('./Text-COHpLTYr.js');
12
12
 
@@ -3,8 +3,8 @@ import React from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
5
5
  import { useStyles } from './hooks/useStyles.js';
6
- import { I as Icon } from './Icon-Dz1q9WC2.js';
7
- import { a as LinkWrapper } from './Link-U60OVrcS.js';
6
+ import { I as Icon } from './Icon-DotE-03d.js';
7
+ import { a as LinkWrapper } from './Link-C53o3P6_.js';
8
8
  import { L as Loader } from './Loader-Cm98w6lJ.js';
9
9
  import { T as Text } from './Text-D9sEeRE4.js';
10
10
 
@@ -4,7 +4,7 @@ import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
5
5
  import { useStyles } from './hooks/useStyles.js';
6
6
  import { D as Divider } from './Divider-DBvDCUqP.js';
7
- import { L as Link } from './Link-U60OVrcS.js';
7
+ import { L as Link } from './Link-C53o3P6_.js';
8
8
  import { T as Text } from './Text-D9sEeRE4.js';
9
9
 
10
10
  function Dropdown(props) {
@@ -6,7 +6,7 @@ var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
7
7
  var useStyles = require('./cjs/hooks/useStyles.js');
8
8
  var Divider = require('./Divider-Goh6mpPK.js');
9
- var Link = require('./Link-CH-W1dww.js');
9
+ var Link = require('./Link-CoAhRbFg.js');
10
10
  var Text = require('./Text-COHpLTYr.js');
11
11
 
12
12
  function Dropdown(props) {
@@ -7,7 +7,7 @@ var clsx = require('clsx');
7
7
  var SVG = require('react-inlinesvg');
8
8
  var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
9
9
  var useStyles = require('./cjs/hooks/useStyles.js');
10
- var Link = require('./Link-CH-W1dww.js');
10
+ var Link = require('./Link-CoAhRbFg.js');
11
11
  var Tooltip = require('./Tooltip-CyZCVyba.js');
12
12
 
13
13
  var iconAppearance = {
@@ -5,7 +5,7 @@ import clsx from 'clsx';
5
5
  import SVG from 'react-inlinesvg';
6
6
  import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
7
7
  import { useStyles } from './hooks/useStyles.js';
8
- import { a as LinkWrapper } from './Link-U60OVrcS.js';
8
+ import { a as LinkWrapper } from './Link-C53o3P6_.js';
9
9
  import { T as Tooltip } from './Tooltip-BsbXMzGd.js';
10
10
 
11
11
  var iconAppearance = {
@@ -22,7 +22,7 @@ function Link(props) {
22
22
  // @ts-expect-error
23
23
  var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
24
24
  var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
25
- var directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, heightClass = classGenerator.heightClass, sizeClass = classGenerator.sizeClass, svgFillClass = classGenerator.svgFillClass, svgFillHoverClass = classGenerator.svgFillHoverClass, textColorClass = classGenerator.textColorClass, textColorHoverClass = classGenerator.textColorHoverClass, textGradientClass = classGenerator.textGradientClass, textStyleClass = classGenerator.textStyleClass, textWeightClass = classGenerator.textWeightClass, widthClass = classGenerator.widthClass;
25
+ var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, heightClass = classGenerator.heightClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, svgFillClass = classGenerator.svgFillClass, svgFillHoverClass = classGenerator.svgFillHoverClass, textColorClass = classGenerator.textColorClass, textColorHoverClass = classGenerator.textColorHoverClass, textGradientClass = classGenerator.textGradientClass, textStyleClass = classGenerator.textStyleClass, textWeightClass = classGenerator.textWeightClass, widthClass = classGenerator.widthClass;
26
26
  // @ts-expect-error
27
27
  var styles = useStyles(props).styles;
28
28
  return (jsxs(LinkWrapper, { className: clsx(className, 'link', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), directionClass && "link_direction_".concat(directionClass), sizeClass && "text_size_".concat(sizeClass), svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass), underline && "link_underline_".concat(underline), 'text', (textColorClass ||
@@ -30,7 +30,7 @@ function Link(props) {
30
30
  textGradientClass ||
31
31
  textStyleClass ||
32
32
  textWeightClass) &&
33
- 'text', textColorClass && "text-color_".concat(textColorClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textGradientClass && "text-gradient_".concat(textGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), fillClass && "fill_".concat(fillClass)), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
33
+ 'text', textColorClass && "text-color_".concat(textColorClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textGradientClass && "text-gradient_".concat(textGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "badge_shape_".concat(shapeClass)), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
34
34
  }
35
35
  // Wrapper with "Link" by condition
36
36
  function LinkWrapper(props) {
@@ -24,7 +24,7 @@ function Link(props) {
24
24
  // @ts-expect-error
25
25
  var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
26
26
  var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
27
- var directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, heightClass = classGenerator.heightClass, sizeClass = classGenerator.sizeClass, svgFillClass = classGenerator.svgFillClass, svgFillHoverClass = classGenerator.svgFillHoverClass, textColorClass = classGenerator.textColorClass, textColorHoverClass = classGenerator.textColorHoverClass, textGradientClass = classGenerator.textGradientClass, textStyleClass = classGenerator.textStyleClass, textWeightClass = classGenerator.textWeightClass, widthClass = classGenerator.widthClass;
27
+ var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, directionClass = classGenerator.directionClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, heightClass = classGenerator.heightClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, svgFillClass = classGenerator.svgFillClass, svgFillHoverClass = classGenerator.svgFillHoverClass, textColorClass = classGenerator.textColorClass, textColorHoverClass = classGenerator.textColorHoverClass, textGradientClass = classGenerator.textGradientClass, textStyleClass = classGenerator.textStyleClass, textWeightClass = classGenerator.textWeightClass, widthClass = classGenerator.widthClass;
28
28
  // @ts-expect-error
29
29
  var styles = useStyles.useStyles(props).styles;
30
30
  return (jsxRuntime.jsxs(LinkWrapper, { className: clsx(className, 'link', widthClass && "width_".concat(widthClass), heightClass && "height_".concat(heightClass), directionClass && "link_direction_".concat(directionClass), sizeClass && "text_size_".concat(sizeClass), svgFillClass && "svg_fill_".concat(svgFillClass), svgFillHoverClass && "svg_fill_hover_".concat(svgFillHoverClass), underline && "link_underline_".concat(underline), 'text', (textColorClass ||
@@ -32,7 +32,7 @@ function Link(props) {
32
32
  textGradientClass ||
33
33
  textStyleClass ||
34
34
  textWeightClass) &&
35
- 'text', textColorClass && "text-color_".concat(textColorClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textGradientClass && "text-gradient_".concat(textGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), fillClass && "fill_".concat(fillClass)), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
35
+ 'text', textColorClass && "text-color_".concat(textColorClass), textColorHoverClass && "text-color_hover_".concat(textColorHoverClass), textGradientClass && "text-gradient_".concat(textGradientClass), textStyleClass && "text-style_".concat(textStyleClass), textWeightClass && "text-weight_".concat(textWeightClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), shapeClass && "badge_shape_".concat(shapeClass)), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
36
36
  }
37
37
  // Wrapper with "Link" by condition
38
38
  function LinkWrapper(props) {
@@ -3,7 +3,7 @@ import React from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
5
5
  import { useStyles } from './hooks/useStyles.js';
6
- import { L as Link } from './Link-U60OVrcS.js';
6
+ import { L as Link } from './Link-C53o3P6_.js';
7
7
  import { T as Text } from './Text-D9sEeRE4.js';
8
8
 
9
9
  var menuItemAppearance = {
@@ -5,7 +5,7 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
7
7
  var useStyles = require('./cjs/hooks/useStyles.js');
8
- var Link = require('./Link-CH-W1dww.js');
8
+ var Link = require('./Link-CoAhRbFg.js');
9
9
  var Text = require('./Text-COHpLTYr.js');
10
10
 
11
11
  var menuItemAppearance = {
@@ -9,7 +9,7 @@ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenera
9
9
  var useStyles = require('../hooks/useStyles.js');
10
10
  var _default = require('@itcase/icons/default');
11
11
  var Divider = require('../../Divider-Goh6mpPK.js');
12
- var Icon = require('../../Icon-DJSIqu5Z.js');
12
+ var Icon = require('../../Icon-ByLHEhHL.js');
13
13
  var Text = require('../../Text-COHpLTYr.js');
14
14
  require('lodash/camelCase');
15
15
  require('../context/UIContext.js');
@@ -19,7 +19,7 @@ require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
21
  require('react-inlinesvg');
22
- require('../../Link-CH-W1dww.js');
22
+ require('../../Link-CoAhRbFg.js');
23
23
  require('../../Tooltip-CyZCVyba.js');
24
24
  require('../../Title-BduD-TXE.js');
25
25
 
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
7
- var Icon = require('../../Icon-DJSIqu5Z.js');
7
+ var Icon = require('../../Icon-ByLHEhHL.js');
8
8
  var Image = require('../../Image-BbBG_UGI.js');
9
9
  var Text = require('../../Text-COHpLTYr.js');
10
10
  require('../../tslib.es6-CCZ3TN_7.js');
@@ -18,7 +18,7 @@ require('../hooks/useStyles.js');
18
18
  require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
- require('../../Link-CH-W1dww.js');
21
+ require('../../Link-CoAhRbFg.js');
22
22
  require('../../Tooltip-CyZCVyba.js');
23
23
  require('../../Title-BduD-TXE.js');
24
24
 
@@ -7,8 +7,8 @@ var clsx = require('clsx');
7
7
  var camelCase = require('lodash/camelCase');
8
8
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
9
9
  var useStyles = require('../hooks/useStyles.js');
10
- var Icon = require('../../Icon-DJSIqu5Z.js');
11
- var Link = require('../../Link-CH-W1dww.js');
10
+ var Icon = require('../../Icon-ByLHEhHL.js');
11
+ var Link = require('../../Link-CoAhRbFg.js');
12
12
  var Text = require('../../Text-COHpLTYr.js');
13
13
  require('lodash/castArray');
14
14
  require('../context/UIContext.js');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Button = require('../../Button-BIVXOiP4.js');
3
+ var Button = require('../../Button-BSygAkO5.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -15,9 +15,9 @@ require('../hooks/useStyles.js');
15
15
  require('lodash/maxBy');
16
16
  require('lodash/upperFirst');
17
17
  require('../hooks/styleAttributes.js');
18
- require('../../Icon-DJSIqu5Z.js');
18
+ require('../../Icon-ByLHEhHL.js');
19
19
  require('react-inlinesvg');
20
- require('../../Link-CH-W1dww.js');
20
+ require('../../Link-CoAhRbFg.js');
21
21
  require('../../Tooltip-CyZCVyba.js');
22
22
  require('../../Text-COHpLTYr.js');
23
23
  require('../../Title-BduD-TXE.js');
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var clsx = require('clsx');
5
5
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
6
6
  var useStyles = require('../hooks/useStyles.js');
7
- var Icon = require('../../Icon-DJSIqu5Z.js');
7
+ var Icon = require('../../Icon-ByLHEhHL.js');
8
8
  var Label = require('../../Label-GEBQXoVJ.js');
9
9
  var Text = require('../../Text-COHpLTYr.js');
10
10
  require('../../tslib.es6-CCZ3TN_7.js');
@@ -18,7 +18,7 @@ require('lodash/maxBy');
18
18
  require('lodash/upperFirst');
19
19
  require('../hooks/styleAttributes.js');
20
20
  require('react-inlinesvg');
21
- require('../../Link-CH-W1dww.js');
21
+ require('../../Link-CoAhRbFg.js');
22
22
  require('../../Tooltip-CyZCVyba.js');
23
23
  require('../../Title-BduD-TXE.js');
24
24
 
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
7
- var Icon = require('../../Icon-DJSIqu5Z.js');
7
+ var Icon = require('../../Icon-ByLHEhHL.js');
8
8
  var Loader = require('../../Loader-D_53c71f.js');
9
9
  var Text = require('../../Text-COHpLTYr.js');
10
10
  require('../../tslib.es6-CCZ3TN_7.js');
@@ -18,7 +18,7 @@ require('../hooks/useStyles.js');
18
18
  require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
- require('../../Link-CH-W1dww.js');
21
+ require('../../Link-CoAhRbFg.js');
22
22
  require('../../Tooltip-CyZCVyba.js');
23
23
  require('../../Title-BduD-TXE.js');
24
24
 
@@ -5,7 +5,7 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var Cookies = require('js-cookie');
7
7
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
8
- var Button = require('../../Button-BIVXOiP4.js');
8
+ var Button = require('../../Button-BSygAkO5.js');
9
9
  var Group = require('../../Group-pMTTxQH4.js');
10
10
  var Text = require('../../Text-COHpLTYr.js');
11
11
  require('../../tslib.es6-CCZ3TN_7.js');
@@ -18,9 +18,9 @@ require('../hooks/useStyles.js');
18
18
  require('lodash/maxBy');
19
19
  require('lodash/upperFirst');
20
20
  require('../hooks/styleAttributes.js');
21
- require('../../Icon-DJSIqu5Z.js');
21
+ require('../../Icon-ByLHEhHL.js');
22
22
  require('react-inlinesvg');
23
- require('../../Link-CH-W1dww.js');
23
+ require('../../Link-CoAhRbFg.js');
24
24
  require('../../Tooltip-CyZCVyba.js');
25
25
  require('../../Title-BduD-TXE.js');
26
26
  require('../../Loader-D_53c71f.js');
@@ -8,8 +8,8 @@ var locale = require('date-fns/locale');
8
8
  var DatePicker = require('react-datepicker');
9
9
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
10
10
  var useStyles = require('../hooks/useStyles.js');
11
- var Button = require('../../Button-BIVXOiP4.js');
12
- var Icon = require('../../Icon-DJSIqu5Z.js');
11
+ var Button = require('../../Button-BSygAkO5.js');
12
+ var Icon = require('../../Icon-ByLHEhHL.js');
13
13
  var Input = require('../../Input-zkYoZhQk.js');
14
14
  var Label = require('../../Label-GEBQXoVJ.js');
15
15
  var Text = require('../../Text-COHpLTYr.js');
@@ -21,7 +21,7 @@ require('react-responsive');
21
21
  require('lodash/maxBy');
22
22
  require('lodash/upperFirst');
23
23
  require('../hooks/styleAttributes.js');
24
- require('../../Link-CH-W1dww.js');
24
+ require('../../Link-CoAhRbFg.js');
25
25
  require('../../Loader-D_53c71f.js');
26
26
  require('react-inlinesvg');
27
27
  require('../../Tooltip-CyZCVyba.js');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var DropdownItem = require('../../DropdownItem-CRvS3KEp.js');
3
+ var DropdownItem = require('../../DropdownItem-DFE1HsyX.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -16,7 +16,7 @@ require('lodash/maxBy');
16
16
  require('lodash/upperFirst');
17
17
  require('../hooks/styleAttributes.js');
18
18
  require('../../Divider-Goh6mpPK.js');
19
- require('../../Link-CH-W1dww.js');
19
+ require('../../Link-CoAhRbFg.js');
20
20
  require('../../Text-COHpLTYr.js');
21
21
 
22
22
 
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Icon = require('../../Icon-DJSIqu5Z.js');
3
+ var Icon = require('../../Icon-ByLHEhHL.js');
4
4
  require('../../tslib.es6-CCZ3TN_7.js');
5
5
  require('react/jsx-runtime');
6
6
  require('react');
@@ -16,7 +16,7 @@ require('../hooks/useStyles.js');
16
16
  require('lodash/maxBy');
17
17
  require('lodash/upperFirst');
18
18
  require('../hooks/styleAttributes.js');
19
- require('../../Link-CH-W1dww.js');
19
+ require('../../Link-CoAhRbFg.js');
20
20
  require('../../Tooltip-CyZCVyba.js');
21
21
  require('../../Text-COHpLTYr.js');
22
22
  require('../../Title-BduD-TXE.js');
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
7
- var Icon = require('../../Icon-DJSIqu5Z.js');
7
+ var Icon = require('../../Icon-ByLHEhHL.js');
8
8
  require('../../tslib.es6-CCZ3TN_7.js');
9
9
  require('lodash/camelCase');
10
10
  require('lodash/castArray');
@@ -16,7 +16,7 @@ require('../hooks/useStyles.js');
16
16
  require('lodash/maxBy');
17
17
  require('lodash/upperFirst');
18
18
  require('../hooks/styleAttributes.js');
19
- require('../../Link-CH-W1dww.js');
19
+ require('../../Link-CoAhRbFg.js');
20
20
  require('../../Tooltip-CyZCVyba.js');
21
21
  require('../../Text-COHpLTYr.js');
22
22
  require('../../Title-BduD-TXE.js');
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var Link = require('../../Link-CH-W1dww.js');
3
+ var Link = require('../../Link-CoAhRbFg.js');
4
4
  require('../../tslib.es6-CCZ3TN_7.js');
5
5
  require('react/jsx-runtime');
6
6
  require('react');
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var clsx = require('clsx');
5
5
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
6
6
  var useStyles = require('../hooks/useStyles.js');
7
- var Link = require('../../Link-CH-W1dww.js');
7
+ var Link = require('../../Link-CoAhRbFg.js');
8
8
  require('../../tslib.es6-CCZ3TN_7.js');
9
9
  require('react');
10
10
  require('lodash/camelCase');
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var clsx = require('clsx');
5
5
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
6
6
  var useStyles = require('../hooks/useStyles.js');
7
- var Link = require('../../Link-CH-W1dww.js');
7
+ var Link = require('../../Link-CoAhRbFg.js');
8
8
  require('../../tslib.es6-CCZ3TN_7.js');
9
9
  require('react');
10
10
  require('lodash/camelCase');
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var clsx = require('clsx');
5
5
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
6
6
  var useStyles = require('../hooks/useStyles.js');
7
- var MenuItem = require('../../MenuItem-GoaeJJ04.js');
7
+ var MenuItem = require('../../MenuItem-Ybh5Mpoi.js');
8
8
  require('../../tslib.es6-CCZ3TN_7.js');
9
9
  require('react');
10
10
  require('lodash/camelCase');
@@ -15,7 +15,7 @@ require('react-responsive');
15
15
  require('lodash/maxBy');
16
16
  require('lodash/upperFirst');
17
17
  require('../hooks/styleAttributes.js');
18
- require('../../Link-CH-W1dww.js');
18
+ require('../../Link-CoAhRbFg.js');
19
19
  require('../../Text-COHpLTYr.js');
20
20
 
21
21
  var menuAppearance = {
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var MenuItem = require('../../MenuItem-GoaeJJ04.js');
3
+ var MenuItem = require('../../MenuItem-Ybh5Mpoi.js');
4
4
  require('react/jsx-runtime');
5
5
  require('react');
6
6
  require('clsx');
@@ -15,7 +15,7 @@ require('../hooks/useStyles.js');
15
15
  require('lodash/maxBy');
16
16
  require('lodash/upperFirst');
17
17
  require('../hooks/styleAttributes.js');
18
- require('../../Link-CH-W1dww.js');
18
+ require('../../Link-CoAhRbFg.js');
19
19
  require('../../Text-COHpLTYr.js');
20
20
 
21
21
 
@@ -6,8 +6,8 @@ var clsx = require('clsx');
6
6
  var ceil = require('lodash/ceil');
7
7
  var ReactPaginate = require('react-paginate');
8
8
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
9
- var DropdownItem = require('../../DropdownItem-CRvS3KEp.js');
10
- var Icon = require('../../Icon-DJSIqu5Z.js');
9
+ var DropdownItem = require('../../DropdownItem-DFE1HsyX.js');
10
+ var Icon = require('../../Icon-ByLHEhHL.js');
11
11
  var Text = require('../../Text-COHpLTYr.js');
12
12
  require('../../tslib.es6-CCZ3TN_7.js');
13
13
  require('lodash/camelCase');
@@ -20,7 +20,7 @@ require('lodash/maxBy');
20
20
  require('lodash/upperFirst');
21
21
  require('../hooks/styleAttributes.js');
22
22
  require('../../Divider-Goh6mpPK.js');
23
- require('../../Link-CH-W1dww.js');
23
+ require('../../Link-CoAhRbFg.js');
24
24
  require('react-inlinesvg');
25
25
  require('../../Tooltip-CyZCVyba.js');
26
26
  require('../../Title-BduD-TXE.js');
@@ -7,7 +7,7 @@ var clsx = require('clsx');
7
7
  var SVG = require('react-inlinesvg');
8
8
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
9
9
  var useStyles = require('../hooks/useStyles.js');
10
- var Button = require('../../Button-BIVXOiP4.js');
10
+ var Button = require('../../Button-BSygAkO5.js');
11
11
  var Group = require('../../Group-pMTTxQH4.js');
12
12
  var Text = require('../../Text-COHpLTYr.js');
13
13
  var Title = require('../../Title-BduD-TXE.js');
@@ -19,8 +19,8 @@ require('react-responsive');
19
19
  require('lodash/maxBy');
20
20
  require('lodash/upperFirst');
21
21
  require('../hooks/styleAttributes.js');
22
- require('../../Icon-DJSIqu5Z.js');
23
- require('../../Link-CH-W1dww.js');
22
+ require('../../Icon-ByLHEhHL.js');
23
+ require('../../Link-CoAhRbFg.js');
24
24
  require('../../Tooltip-CyZCVyba.js');
25
25
  require('../../Loader-D_53c71f.js');
26
26
 
@@ -5,7 +5,7 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
7
7
  var useStyles = require('../hooks/useStyles.js');
8
- var Icon = require('../../Icon-DJSIqu5Z.js');
8
+ var Icon = require('../../Icon-ByLHEhHL.js');
9
9
  var Text = require('../../Text-COHpLTYr.js');
10
10
  var Scrollbar = require('../../Scrollbar-CL9V8d1X.js');
11
11
  require('../../tslib.es6-CCZ3TN_7.js');
@@ -18,7 +18,7 @@ require('lodash/maxBy');
18
18
  require('lodash/upperFirst');
19
19
  require('../hooks/styleAttributes.js');
20
20
  require('react-inlinesvg');
21
- require('../../Link-CH-W1dww.js');
21
+ require('../../Link-CoAhRbFg.js');
22
22
  require('../../Tooltip-CyZCVyba.js');
23
23
  require('../../Title-BduD-TXE.js');
24
24
  require('react-scrollbars-custom');
@@ -3,7 +3,7 @@
3
3
  var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
4
4
  var jsxRuntime = require('react/jsx-runtime');
5
5
  var Select = require('react-select');
6
- var Icon = require('../../Icon-DJSIqu5Z.js');
6
+ var Icon = require('../../Icon-ByLHEhHL.js');
7
7
  var React = require('react');
8
8
  var clsx = require('clsx');
9
9
  var CreatableSelect = require('react-select/creatable');
@@ -21,7 +21,7 @@ require('../context/UIContext.js');
21
21
  require('../hooks/useMediaQueries.js');
22
22
  require('react-responsive');
23
23
  require('../hooks/styleAttributes.js');
24
- require('../../Link-CH-W1dww.js');
24
+ require('../../Link-CoAhRbFg.js');
25
25
  require('../../Tooltip-CyZCVyba.js');
26
26
  require('../../Title-BduD-TXE.js');
27
27
  require('lodash/castArray');
@@ -5,7 +5,7 @@ var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var UIContext = require('../context/UIContext.js');
7
7
  var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
8
- var Icon = require('../../Icon-DJSIqu5Z.js');
8
+ var Icon = require('../../Icon-ByLHEhHL.js');
9
9
  var Text = require('../../Text-COHpLTYr.js');
10
10
  require('../hooks/useMediaQueries.js');
11
11
  require('react-responsive');
@@ -17,7 +17,7 @@ require('../hooks/useStyles.js');
17
17
  require('lodash/maxBy');
18
18
  require('lodash/upperFirst');
19
19
  require('../hooks/styleAttributes.js');
20
- require('../../Link-CH-W1dww.js');
20
+ require('../../Link-CoAhRbFg.js');
21
21
  require('../../Tooltip-CyZCVyba.js');
22
22
  require('../../Title-BduD-TXE.js');
23
23
 
@@ -7,7 +7,7 @@ var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenera
7
7
  var useStyles = require('../hooks/useStyles.js');
8
8
  var Badge = require('../../Badge-DxHwStfq.js');
9
9
  var Divider = require('../../Divider-Goh6mpPK.js');
10
- var Link = require('../../Link-CH-W1dww.js');
10
+ var Link = require('../../Link-CoAhRbFg.js');
11
11
  var Text = require('../../Text-COHpLTYr.js');
12
12
  require('../../tslib.es6-CCZ3TN_7.js');
13
13
  require('lodash/camelCase');
@@ -109,22 +109,39 @@ function useStyles(props) {
109
109
  }
110
110
  if (value) {
111
111
  // Check not digit symbols. Chars means some unit ("px", "em", "rem" or custom "m")
112
- const hasUnitRegExp = /\D/;
112
+ const isValueHasUnit = /\D/.test(value);
113
113
  // If value has some unit
114
- if (hasUnitRegExp.test(value)) {
114
+ if (isValueHasUnit) {
115
115
  // Check value on our custom "m"(module) unit
116
- const hasModuleUnitRegExp = /^\d+\.?\d*m$/;
116
+ /** Pattern for:
117
+ * 1m
118
+ * 1.5m
119
+ * 1m 1m 1.5m
120
+ * 0 0 1m 1m
121
+ */
122
+ const isValueHasModuleUnit = /\d+\.?\d*m\s?(?![a-zA-Z]+)/.test(value);
117
123
  // If value has module unit
118
- if (hasModuleUnitRegExp.test(value)) {
119
- // Find numbers from value value
120
- const numberMatchesList = value.match(/\d+\.?\d*/);
121
- // If "numberMatchesList" not null (has matches)
122
- if (numberMatchesList) {
123
- // Parse module value to px value
124
- const valueModule = parseFloat(numberMatchesList[0]);
125
- const valuePx = valueModule * 8;
126
- value = `${valuePx}px`;
127
- }
124
+ if (isValueHasModuleUnit) {
125
+ /** Order for shorthand properties:
126
+ * top
127
+ * right
128
+ * bottom
129
+ * left
130
+ * or:
131
+ * top
132
+ * right and left
133
+ * bottom
134
+ * or:
135
+ * top and bottom
136
+ * right and left
137
+ */
138
+
139
+ const valuePxPartsList = value.split(' ').map(valuePart => {
140
+ const valueModule = valuePart.replace(/[a-z]/gi, '');
141
+ const valuePx = parseFloat(valueModule) * 8;
142
+ return `${valuePx}px`;
143
+ }, []);
144
+ value = valuePxPartsList.join(' ');
128
145
  }
129
146
  } else {
130
147
  // Some properties doesn't have any units
@@ -135,15 +152,21 @@ function useStyles(props) {
135
152
  }
136
153
  }
137
154
  if (styleAttributeKey.includes('Horizontal')) {
138
- const keyLeft = styleAttributeKey.replace('Horizontal', 'Left');
139
155
  const keyRight = styleAttributeKey.replace('Horizontal', 'Right');
140
- resultStylesGroups[targetElementGroupKey][keyLeft] = value;
141
- resultStylesGroups[targetElementGroupKey][keyRight] = value;
156
+ const keyLeft = styleAttributeKey.replace('Horizontal', 'Left');
157
+ const valuePartsList = value.split(' ');
158
+ const valueRight = valuePartsList[0];
159
+ const valueLeft = valuePartsList[1] || valuePartsList[0];
160
+ resultStylesGroups[targetElementGroupKey][keyRight] = valueRight;
161
+ resultStylesGroups[targetElementGroupKey][keyLeft] = valueLeft;
142
162
  } else if (styleAttributeKey.includes('Vertical')) {
143
163
  const keyTop = styleAttributeKey.replace('Vertical', 'Top');
144
164
  const keyBottom = styleAttributeKey.replace('Vertical', 'Bottom');
145
- resultStylesGroups[targetElementGroupKey][keyTop] = value;
146
- resultStylesGroups[targetElementGroupKey][keyBottom] = value;
165
+ const valuePartsList = value.split(' ');
166
+ const valueTop = valuePartsList[0];
167
+ const valueBottom = valuePartsList[1] || valuePartsList[0];
168
+ resultStylesGroups[targetElementGroupKey][keyTop] = valueTop;
169
+ resultStylesGroups[targetElementGroupKey][keyBottom] = valueBottom;
147
170
  } else {
148
171
  resultStylesGroups[targetElementGroupKey][styleAttributeKey] = value;
149
172
  }
@@ -7,7 +7,7 @@ import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGene
7
7
  import { useStyles } from '../hooks/useStyles.js';
8
8
  import { icon16 } from '@itcase/icons/default';
9
9
  import { D as Divider } from '../Divider-DBvDCUqP.js';
10
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
10
+ import { I as Icon } from '../Icon-DotE-03d.js';
11
11
  import { T as Text } from '../Text-D9sEeRE4.js';
12
12
  import 'lodash/camelCase';
13
13
  import '../context/UIContext.js';
@@ -17,7 +17,7 @@ import 'lodash/maxBy';
17
17
  import 'lodash/upperFirst';
18
18
  import '../hooks/styleAttributes.js';
19
19
  import 'react-inlinesvg';
20
- import '../Link-U60OVrcS.js';
20
+ import '../Link-C53o3P6_.js';
21
21
  import '../Tooltip-BsbXMzGd.js';
22
22
  import '../Title-Cl95USIn.js';
23
23
 
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { useMemo } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
5
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
5
+ import { I as Icon } from '../Icon-DotE-03d.js';
6
6
  import { I as Image } from '../Image-D-QHhsrC.js';
7
7
  import { T as Text } from '../Text-D9sEeRE4.js';
8
8
  import '../tslib.es6-5FtW-kfi.js';
@@ -16,7 +16,7 @@ import '../hooks/useStyles.js';
16
16
  import 'lodash/maxBy';
17
17
  import 'lodash/upperFirst';
18
18
  import '../hooks/styleAttributes.js';
19
- import '../Link-U60OVrcS.js';
19
+ import '../Link-C53o3P6_.js';
20
20
  import '../Tooltip-BsbXMzGd.js';
21
21
  import '../Title-Cl95USIn.js';
22
22
 
@@ -5,8 +5,8 @@ import clsx from 'clsx';
5
5
  import camelCase from 'lodash/camelCase';
6
6
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
7
7
  import { useStyles } from '../hooks/useStyles.js';
8
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
9
- import { a as LinkWrapper } from '../Link-U60OVrcS.js';
8
+ import { I as Icon } from '../Icon-DotE-03d.js';
9
+ import { a as LinkWrapper } from '../Link-C53o3P6_.js';
10
10
  import { T as Text } from '../Text-D9sEeRE4.js';
11
11
  import 'lodash/castArray';
12
12
  import '../context/UIContext.js';
@@ -1,4 +1,4 @@
1
- export { B as Button, a as buttonAppearance, b as buttonConfig } from '../Button-C4oPIe_E.js';
1
+ export { B as Button, a as buttonAppearance, b as buttonConfig } from '../Button-Bn8Mjoeh.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';
@@ -13,9 +13,9 @@ import '../hooks/useStyles.js';
13
13
  import 'lodash/maxBy';
14
14
  import 'lodash/upperFirst';
15
15
  import '../hooks/styleAttributes.js';
16
- import '../Icon-Dz1q9WC2.js';
16
+ import '../Icon-DotE-03d.js';
17
17
  import 'react-inlinesvg';
18
- import '../Link-U60OVrcS.js';
18
+ import '../Link-C53o3P6_.js';
19
19
  import '../Tooltip-BsbXMzGd.js';
20
20
  import '../Text-D9sEeRE4.js';
21
21
  import '../Title-Cl95USIn.js';
@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
4
4
  import { useStyles } from '../hooks/useStyles.js';
5
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
5
+ import { I as Icon } from '../Icon-DotE-03d.js';
6
6
  import { L as Label } from '../Label-9O3dQlUa.js';
7
7
  import { T as Text } from '../Text-D9sEeRE4.js';
8
8
  import '../tslib.es6-5FtW-kfi.js';
@@ -16,7 +16,7 @@ import 'lodash/maxBy';
16
16
  import 'lodash/upperFirst';
17
17
  import '../hooks/styleAttributes.js';
18
18
  import 'react-inlinesvg';
19
- import '../Link-U60OVrcS.js';
19
+ import '../Link-C53o3P6_.js';
20
20
  import '../Tooltip-BsbXMzGd.js';
21
21
  import '../Title-Cl95USIn.js';
22
22
 
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { useRef, useMemo, createRef, useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
5
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
5
+ import { I as Icon } from '../Icon-DotE-03d.js';
6
6
  import { L as Loader } from '../Loader-Cm98w6lJ.js';
7
7
  import { T as Text } from '../Text-D9sEeRE4.js';
8
8
  import '../tslib.es6-5FtW-kfi.js';
@@ -16,7 +16,7 @@ import '../hooks/useStyles.js';
16
16
  import 'lodash/maxBy';
17
17
  import 'lodash/upperFirst';
18
18
  import '../hooks/styleAttributes.js';
19
- import '../Link-U60OVrcS.js';
19
+ import '../Link-C53o3P6_.js';
20
20
  import '../Tooltip-BsbXMzGd.js';
21
21
  import '../Title-Cl95USIn.js';
22
22
 
@@ -3,7 +3,7 @@ import { useRef, useMemo, useCallback, useEffect } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import Cookies from 'js-cookie';
5
5
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
6
- import { B as Button } from '../Button-C4oPIe_E.js';
6
+ import { B as Button } from '../Button-Bn8Mjoeh.js';
7
7
  import { G as Group } from '../Group-CIIZoSm5.js';
8
8
  import { T as Text } from '../Text-D9sEeRE4.js';
9
9
  import '../tslib.es6-5FtW-kfi.js';
@@ -16,9 +16,9 @@ import '../hooks/useStyles.js';
16
16
  import 'lodash/maxBy';
17
17
  import 'lodash/upperFirst';
18
18
  import '../hooks/styleAttributes.js';
19
- import '../Icon-Dz1q9WC2.js';
19
+ import '../Icon-DotE-03d.js';
20
20
  import 'react-inlinesvg';
21
- import '../Link-U60OVrcS.js';
21
+ import '../Link-C53o3P6_.js';
22
22
  import '../Tooltip-BsbXMzGd.js';
23
23
  import '../Title-Cl95USIn.js';
24
24
  import '../Loader-Cm98w6lJ.js';
@@ -6,8 +6,8 @@ import { ru } from 'date-fns/locale';
6
6
  import DatePicker from 'react-datepicker';
7
7
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
8
8
  import { useStyles } from '../hooks/useStyles.js';
9
- import { B as Button } from '../Button-C4oPIe_E.js';
10
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
9
+ import { B as Button } from '../Button-Bn8Mjoeh.js';
10
+ import { I as Icon } from '../Icon-DotE-03d.js';
11
11
  import { I as Input } from '../Input-Ck5IbuH6.js';
12
12
  import { L as Label } from '../Label-9O3dQlUa.js';
13
13
  import { T as Text } from '../Text-D9sEeRE4.js';
@@ -19,7 +19,7 @@ import 'react-responsive';
19
19
  import 'lodash/maxBy';
20
20
  import 'lodash/upperFirst';
21
21
  import '../hooks/styleAttributes.js';
22
- import '../Link-U60OVrcS.js';
22
+ import '../Link-C53o3P6_.js';
23
23
  import '../Loader-Cm98w6lJ.js';
24
24
  import 'react-inlinesvg';
25
25
  import '../Tooltip-BsbXMzGd.js';
@@ -1,4 +1,4 @@
1
- export { D as Dropdown, a as DropdownItem, d as dropdownItemAppearance, b as dropdownItemConfig } from '../DropdownItem-BGsCHiqr.js';
1
+ export { D as Dropdown, a as DropdownItem, d as dropdownItemAppearance, b as dropdownItemConfig } from '../DropdownItem-CExjlJjQ.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';
@@ -14,5 +14,5 @@ import 'lodash/maxBy';
14
14
  import 'lodash/upperFirst';
15
15
  import '../hooks/styleAttributes.js';
16
16
  import '../Divider-DBvDCUqP.js';
17
- import '../Link-U60OVrcS.js';
17
+ import '../Link-C53o3P6_.js';
18
18
  import '../Text-D9sEeRE4.js';
@@ -1,4 +1,4 @@
1
- export { I as Icon, a as iconAppearance, i as iconConfig } from '../Icon-Dz1q9WC2.js';
1
+ export { I as Icon, a as iconAppearance, i as iconConfig } from '../Icon-DotE-03d.js';
2
2
  import '../tslib.es6-5FtW-kfi.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
@@ -14,7 +14,7 @@ import '../hooks/useStyles.js';
14
14
  import 'lodash/maxBy';
15
15
  import 'lodash/upperFirst';
16
16
  import '../hooks/styleAttributes.js';
17
- import '../Link-U60OVrcS.js';
17
+ import '../Link-C53o3P6_.js';
18
18
  import '../Tooltip-BsbXMzGd.js';
19
19
  import '../Text-D9sEeRE4.js';
20
20
  import '../Title-Cl95USIn.js';
@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import { useState, useMemo, useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
5
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
5
+ import { I as Icon } from '../Icon-DotE-03d.js';
6
6
  import '../tslib.es6-5FtW-kfi.js';
7
7
  import 'lodash/camelCase';
8
8
  import 'lodash/castArray';
@@ -14,7 +14,7 @@ import '../hooks/useStyles.js';
14
14
  import 'lodash/maxBy';
15
15
  import 'lodash/upperFirst';
16
16
  import '../hooks/styleAttributes.js';
17
- import '../Link-U60OVrcS.js';
17
+ import '../Link-C53o3P6_.js';
18
18
  import '../Tooltip-BsbXMzGd.js';
19
19
  import '../Text-D9sEeRE4.js';
20
20
  import '../Title-Cl95USIn.js';
@@ -1,4 +1,4 @@
1
- export { L as Link, a as LinkWrapper, l as linkConfig } from '../Link-U60OVrcS.js';
1
+ export { L as Link, a as LinkWrapper, l as linkConfig } from '../Link-C53o3P6_.js';
2
2
  import '../tslib.es6-5FtW-kfi.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
4
4
  import { useStyles } from '../hooks/useStyles.js';
5
- import { L as Link } from '../Link-U60OVrcS.js';
5
+ import { L as Link } from '../Link-C53o3P6_.js';
6
6
  import '../tslib.es6-5FtW-kfi.js';
7
7
  import 'react';
8
8
  import 'lodash/camelCase';
@@ -2,7 +2,7 @@ import { jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
4
4
  import { useStyles } from '../hooks/useStyles.js';
5
- import { a as LinkWrapper } from '../Link-U60OVrcS.js';
5
+ import { a as LinkWrapper } from '../Link-C53o3P6_.js';
6
6
  import '../tslib.es6-5FtW-kfi.js';
7
7
  import 'react';
8
8
  import 'lodash/camelCase';
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
3
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
4
4
  import { useStyles } from '../hooks/useStyles.js';
5
- import { M as MenuItem } from '../MenuItem-C422Veuw.js';
5
+ import { M as MenuItem } from '../MenuItem-Cu6wlj-X.js';
6
6
  import '../tslib.es6-5FtW-kfi.js';
7
7
  import 'react';
8
8
  import 'lodash/camelCase';
@@ -13,7 +13,7 @@ import 'react-responsive';
13
13
  import 'lodash/maxBy';
14
14
  import 'lodash/upperFirst';
15
15
  import '../hooks/styleAttributes.js';
16
- import '../Link-U60OVrcS.js';
16
+ import '../Link-C53o3P6_.js';
17
17
  import '../Text-D9sEeRE4.js';
18
18
 
19
19
  var menuAppearance = {
@@ -1,4 +1,4 @@
1
- export { M as MenuItem, a as menuItemAppearance, m as menuItemConfig } from '../MenuItem-C422Veuw.js';
1
+ export { M as MenuItem, a as menuItemAppearance, m as menuItemConfig } from '../MenuItem-Cu6wlj-X.js';
2
2
  import 'react/jsx-runtime';
3
3
  import 'react';
4
4
  import 'clsx';
@@ -13,5 +13,5 @@ import '../hooks/useStyles.js';
13
13
  import 'lodash/maxBy';
14
14
  import 'lodash/upperFirst';
15
15
  import '../hooks/styleAttributes.js';
16
- import '../Link-U60OVrcS.js';
16
+ import '../Link-C53o3P6_.js';
17
17
  import '../Text-D9sEeRE4.js';
@@ -4,8 +4,8 @@ import clsx from 'clsx';
4
4
  import ceil from 'lodash/ceil';
5
5
  import ReactPaginate from 'react-paginate';
6
6
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
7
- import { D as Dropdown, a as DropdownItem } from '../DropdownItem-BGsCHiqr.js';
8
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
7
+ import { D as Dropdown, a as DropdownItem } from '../DropdownItem-CExjlJjQ.js';
8
+ import { I as Icon } from '../Icon-DotE-03d.js';
9
9
  import { T as Text } from '../Text-D9sEeRE4.js';
10
10
  import '../tslib.es6-5FtW-kfi.js';
11
11
  import 'lodash/camelCase';
@@ -18,7 +18,7 @@ import 'lodash/maxBy';
18
18
  import 'lodash/upperFirst';
19
19
  import '../hooks/styleAttributes.js';
20
20
  import '../Divider-DBvDCUqP.js';
21
- import '../Link-U60OVrcS.js';
21
+ import '../Link-C53o3P6_.js';
22
22
  import 'react-inlinesvg';
23
23
  import '../Tooltip-BsbXMzGd.js';
24
24
  import '../Title-Cl95USIn.js';
@@ -5,7 +5,7 @@ import clsx from 'clsx';
5
5
  import SVG from 'react-inlinesvg';
6
6
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
7
7
  import { useStyles } from '../hooks/useStyles.js';
8
- import { B as Button } from '../Button-C4oPIe_E.js';
8
+ import { B as Button } from '../Button-Bn8Mjoeh.js';
9
9
  import { G as Group } from '../Group-CIIZoSm5.js';
10
10
  import { T as Text } from '../Text-D9sEeRE4.js';
11
11
  import { T as Title } from '../Title-Cl95USIn.js';
@@ -17,8 +17,8 @@ import 'react-responsive';
17
17
  import 'lodash/maxBy';
18
18
  import 'lodash/upperFirst';
19
19
  import '../hooks/styleAttributes.js';
20
- import '../Icon-Dz1q9WC2.js';
21
- import '../Link-U60OVrcS.js';
20
+ import '../Icon-DotE-03d.js';
21
+ import '../Link-C53o3P6_.js';
22
22
  import '../Tooltip-BsbXMzGd.js';
23
23
  import '../Loader-Cm98w6lJ.js';
24
24
 
@@ -3,7 +3,7 @@ import React, { useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
5
5
  import { useStyles } from '../hooks/useStyles.js';
6
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
6
+ import { I as Icon } from '../Icon-DotE-03d.js';
7
7
  import { T as Text } from '../Text-D9sEeRE4.js';
8
8
  import { S as Scrollbar } from '../Scrollbar-DkJr3S-w.js';
9
9
  import '../tslib.es6-5FtW-kfi.js';
@@ -16,7 +16,7 @@ import 'lodash/maxBy';
16
16
  import 'lodash/upperFirst';
17
17
  import '../hooks/styleAttributes.js';
18
18
  import 'react-inlinesvg';
19
- import '../Link-U60OVrcS.js';
19
+ import '../Link-C53o3P6_.js';
20
20
  import '../Tooltip-BsbXMzGd.js';
21
21
  import '../Title-Cl95USIn.js';
22
22
  import 'react-scrollbars-custom';
@@ -1,7 +1,7 @@
1
1
  import { _ as __assign } from '../tslib.es6-5FtW-kfi.js';
2
2
  import { jsx, jsxs } from 'react/jsx-runtime';
3
3
  import Select, { components } from 'react-select';
4
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
4
+ import { I as Icon } from '../Icon-DotE-03d.js';
5
5
  import React, { useRef, useCallback, useEffect, useMemo } from 'react';
6
6
  import clsx from 'clsx';
7
7
  import CreatableSelect from 'react-select/creatable';
@@ -19,7 +19,7 @@ import '../context/UIContext.js';
19
19
  import '../hooks/useMediaQueries.js';
20
20
  import 'react-responsive';
21
21
  import '../hooks/styleAttributes.js';
22
- import '../Link-U60OVrcS.js';
22
+ import '../Link-C53o3P6_.js';
23
23
  import '../Tooltip-BsbXMzGd.js';
24
24
  import '../Title-Cl95USIn.js';
25
25
  import 'lodash/castArray';
@@ -3,7 +3,7 @@ import { useCallback } from 'react';
3
3
  import clsx from 'clsx';
4
4
  import { useSiteMenuContext } from '../context/UIContext.js';
5
5
  import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
6
- import { I as Icon } from '../Icon-Dz1q9WC2.js';
6
+ import { I as Icon } from '../Icon-DotE-03d.js';
7
7
  import { T as Text } from '../Text-D9sEeRE4.js';
8
8
  import '../hooks/useMediaQueries.js';
9
9
  import 'react-responsive';
@@ -15,7 +15,7 @@ import '../hooks/useStyles.js';
15
15
  import 'lodash/maxBy';
16
16
  import 'lodash/upperFirst';
17
17
  import '../hooks/styleAttributes.js';
18
- import '../Link-U60OVrcS.js';
18
+ import '../Link-C53o3P6_.js';
19
19
  import '../Tooltip-BsbXMzGd.js';
20
20
  import '../Title-Cl95USIn.js';
21
21
 
@@ -5,7 +5,7 @@ import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGene
5
5
  import { useStyles } from '../hooks/useStyles.js';
6
6
  import { B as Badge } from '../Badge-Bcj5H3vs.js';
7
7
  import { D as Divider } from '../Divider-DBvDCUqP.js';
8
- import { L as Link } from '../Link-U60OVrcS.js';
8
+ import { L as Link } from '../Link-C53o3P6_.js';
9
9
  import { T as Text } from '../Text-D9sEeRE4.js';
10
10
  import '../tslib.es6-5FtW-kfi.js';
11
11
  import 'lodash/camelCase';
@@ -35,7 +35,7 @@
35
35
  }
36
36
  .cell {
37
37
  &_size {
38
- @each $size in s, m, l, xl {
38
+ @each $size in xs, s, m, l, xl {
39
39
  &_$(size) {
40
40
  ^^&__wrapper {
41
41
  padding: var(--cell-size-$(size)-padding);
@@ -141,11 +141,9 @@
141
141
  }
142
142
  }
143
143
  :root {
144
+ --cell-size-xs-padding: 6px;
144
145
  --cell-size-s-padding: 6px;
145
-
146
146
  --cell-size-m-padding: 6px;
147
-
148
147
  --cell-size-l-padding: 6px;
149
-
150
148
  --cell-size-xl-padding: 12px;
151
149
  }
@@ -47,7 +47,7 @@
47
47
  }
48
48
  }
49
49
  &_circular {
50
- border-radius: 50%;
50
+ border-radius: 9999px;
51
51
  }
52
52
  }
53
53
  }
@@ -107,22 +107,39 @@ function useStyles(props) {
107
107
  }
108
108
  if (value) {
109
109
  // Check not digit symbols. Chars means some unit ("px", "em", "rem" or custom "m")
110
- const hasUnitRegExp = /\D/;
110
+ const isValueHasUnit = /\D/.test(value);
111
111
  // If value has some unit
112
- if (hasUnitRegExp.test(value)) {
112
+ if (isValueHasUnit) {
113
113
  // Check value on our custom "m"(module) unit
114
- const hasModuleUnitRegExp = /^\d+\.?\d*m$/;
114
+ /** Pattern for:
115
+ * 1m
116
+ * 1.5m
117
+ * 1m 1m 1.5m
118
+ * 0 0 1m 1m
119
+ */
120
+ const isValueHasModuleUnit = /\d+\.?\d*m\s?(?![a-zA-Z]+)/.test(value);
115
121
  // If value has module unit
116
- if (hasModuleUnitRegExp.test(value)) {
117
- // Find numbers from value value
118
- const numberMatchesList = value.match(/\d+\.?\d*/);
119
- // If "numberMatchesList" not null (has matches)
120
- if (numberMatchesList) {
121
- // Parse module value to px value
122
- const valueModule = parseFloat(numberMatchesList[0]);
123
- const valuePx = valueModule * 8;
124
- value = `${valuePx}px`;
125
- }
122
+ if (isValueHasModuleUnit) {
123
+ /** Order for shorthand properties:
124
+ * top
125
+ * right
126
+ * bottom
127
+ * left
128
+ * or:
129
+ * top
130
+ * right and left
131
+ * bottom
132
+ * or:
133
+ * top and bottom
134
+ * right and left
135
+ */
136
+
137
+ const valuePxPartsList = value.split(' ').map(valuePart => {
138
+ const valueModule = valuePart.replace(/[a-z]/gi, '');
139
+ const valuePx = parseFloat(valueModule) * 8;
140
+ return `${valuePx}px`;
141
+ }, []);
142
+ value = valuePxPartsList.join(' ');
126
143
  }
127
144
  } else {
128
145
  // Some properties doesn't have any units
@@ -133,15 +150,21 @@ function useStyles(props) {
133
150
  }
134
151
  }
135
152
  if (styleAttributeKey.includes('Horizontal')) {
136
- const keyLeft = styleAttributeKey.replace('Horizontal', 'Left');
137
153
  const keyRight = styleAttributeKey.replace('Horizontal', 'Right');
138
- resultStylesGroups[targetElementGroupKey][keyLeft] = value;
139
- resultStylesGroups[targetElementGroupKey][keyRight] = value;
154
+ const keyLeft = styleAttributeKey.replace('Horizontal', 'Left');
155
+ const valuePartsList = value.split(' ');
156
+ const valueRight = valuePartsList[0];
157
+ const valueLeft = valuePartsList[1] || valuePartsList[0];
158
+ resultStylesGroups[targetElementGroupKey][keyRight] = valueRight;
159
+ resultStylesGroups[targetElementGroupKey][keyLeft] = valueLeft;
140
160
  } else if (styleAttributeKey.includes('Vertical')) {
141
161
  const keyTop = styleAttributeKey.replace('Vertical', 'Top');
142
162
  const keyBottom = styleAttributeKey.replace('Vertical', 'Bottom');
143
- resultStylesGroups[targetElementGroupKey][keyTop] = value;
144
- resultStylesGroups[targetElementGroupKey][keyBottom] = value;
163
+ const valuePartsList = value.split(' ');
164
+ const valueTop = valuePartsList[0];
165
+ const valueBottom = valuePartsList[1] || valuePartsList[0];
166
+ resultStylesGroups[targetElementGroupKey][keyTop] = valueTop;
167
+ resultStylesGroups[targetElementGroupKey][keyBottom] = valueBottom;
145
168
  } else {
146
169
  resultStylesGroups[targetElementGroupKey][styleAttributeKey] = value;
147
170
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.3.17",
3
+ "version": "1.3.19",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",