@orfium/ictinus 4.80.2 → 4.81.0

package/dist/components/Button/Button.d.ts

@@ -6,5 +6,5 @@ export declare type Props = ButtonBaseProps & TestProps & onClickProp;
 declare type onClickProp = {
     onClick: ClickHandler;
 };
-declare const Button: React.ForwardRefExoticComponent<ButtonBaseProps & TestProps & onClickProp & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "css" | "onBlur" | "onClick" | "type">> & React.RefAttributes<HTMLButtonElement>>;
+declare const Button: React.ForwardRefExoticComponent<ButtonBaseProps & TestProps & onClickProp & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "size" | "css" | "onBlur" | "onClick">> & React.RefAttributes<HTMLButtonElement>>;
 export default Button;

package/dist/components/ButtonBase/ButtonBase.d.ts

@@ -38,5 +38,5 @@ export declare type Props = {
         container?: CSSObject;
     };
 };
-declare const ButtonBase: React.ForwardRefExoticComponent<Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "css" | "onBlur" | "onClick" | "type">> & Props & TestProps & EventButtonProps & React.RefAttributes<HTMLButtonElement>>;
+declare const ButtonBase: React.ForwardRefExoticComponent<Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "size" | "css" | "onBlur" | "onClick">> & Props & TestProps & EventButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export default ButtonBase;

package/dist/components/Chip/Chip.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-declare const Chip: React.ForwardRefExoticComponent<import("./Chip.types").Props & import("../../utils/types").TestProps & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "css" | "onBlur" | "onClick" | "type">> & React.RefAttributes<HTMLButtonElement | HTMLDivElement>>;
+declare const Chip: React.ForwardRefExoticComponent<import("./Chip.types").Props & import("../../utils/types").TestProps & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "size" | "css" | "onBlur" | "onClick">> & React.RefAttributes<HTMLButtonElement | HTMLDivElement>>;
 export default Chip;

package/dist/components/Menu/Menu.js

@@ -12,8 +12,8 @@ var _utils = require("../Button/utils");
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _ClickAwayListener = _interopRequireDefault(require("../utils/ClickAwayListener"));
 var _DropdownOptions = require("../utils/DropdownOptions");
-var _Menu = require("./Menu.style");
 var _List = _interopRequireDefault(require("../List"));
+var _PositionInScreen = _interopRequireDefault(require("../utils/PositionInScreen"));
 var _react2 = require("@emotion/react");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -54,33 +54,36 @@ var Menu = function Menu(props) {
       return setOpen(false);
     }
   }, (0, _react2.jsx)("div", {
-    css: (0, _Menu.wrapperStyle)(),
     "data-testid": dataTestId
-  }, (0, _react2.jsx)(_Button["default"], {
-    size: size,
-    onClick: function onClick() {
-      return setOpen(!open);
-    },
-    type: buttonType,
-    color: color,
-    disabled: disabled,
-    filled: filled,
-    iconRight: rightIconName ? (0, _react2.jsx)(_Icon["default"], {
-      name: rightIconName,
-      color: iconColor,
-      size: iconSize
-    }) : null,
-    iconLeft: !(0, _isEmpty["default"])(avatar) ? (0, _react2.jsx)(_Avatar["default"], {
-      size: 'sm',
-      src: avatar == null ? void 0 : avatar.src,
-      color: avatar == null ? void 0 : avatar.color,
-      iconName: 'user'
-    }, avatar == null ? void 0 : avatar.letter) : leftIconName ? (0, _react2.jsx)(_Icon["default"], {
-      name: leftIconName,
-      color: iconColor,
-      size: iconSize
-    }) : null
-  }, (0, _react2.jsx)("span", null, buttonText)), open && (0, _react2.jsx)("div", {
+  }, (0, _react2.jsx)(_PositionInScreen["default"], {
+    visible: open,
+    offsetY: 8,
+    parent: (0, _react2.jsx)(_Button["default"], {
+      size: size,
+      onClick: function onClick() {
+        return setOpen(!open);
+      },
+      type: buttonType,
+      color: color,
+      disabled: disabled,
+      filled: filled,
+      iconRight: rightIconName ? (0, _react2.jsx)(_Icon["default"], {
+        name: rightIconName,
+        color: iconColor,
+        size: iconSize
+      }) : null,
+      iconLeft: !(0, _isEmpty["default"])(avatar) ? (0, _react2.jsx)(_Avatar["default"], {
+        size: 'sm',
+        src: avatar == null ? void 0 : avatar.src,
+        color: avatar == null ? void 0 : avatar.color,
+        iconName: 'user'
+      }, avatar == null ? void 0 : avatar.letter) : leftIconName ? (0, _react2.jsx)(_Icon["default"], {
+        name: leftIconName,
+        color: iconColor,
+        size: iconSize
+      }) : null
+    }, (0, _react2.jsx)("span", null, buttonText))
+  }, (0, _react2.jsx)("div", {
     css: (0, _DropdownOptions.optionsStyle)({
       menuPosition: menuPosition
     })(theme)
@@ -91,6 +94,6 @@ var Menu = function Menu(props) {
       setOpen(false);
       onSelect(option);
     }
-  }))));
+  })))));
 };
 var _default = exports["default"] = Menu;

package/dist/components/Menu/Menu.style.d.ts

@@ -1,7 +1,6 @@
 import { Theme } from '../../theme';
 import { RequiredProperties } from '../../utils/common';
 import { Props } from '../Button/Button';
-export declare const wrapperStyle: () => () => import("@emotion/react").SerializedStyles;
 export declare const buttonSpanStyle: ({ size, iconLeft, iconRight, hasChildren, }: RequiredProperties<import("../ButtonBase/ButtonBase").Props & import("../../utils/types").TestProps & {
     onClick: import("../../hooks/useLoading").ClickHandler;
 } & {

package/dist/components/Menu/Menu.style.js

@@ -1,28 +1,12 @@
 "use strict";
 
 exports.__esModule = true;
-exports.wrapperStyle = exports.buttonSpanStyle = void 0;
-var _react = require("@emotion/react");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1nrevy2",
-  styles: "position:relative;display:inline-block"
-} : {
-  name: "1yhb7nc-wrapperStyle",
-  styles: "position:relative;display:inline-block;label:wrapperStyle;",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL01lbnUvTWVudS5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMkMiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvTWVudS9NZW51LnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5pbXBvcnQgeyBUaGVtZSB9IGZyb20gJy4uLy4uL3RoZW1lJztcbmltcG9ydCB7IFJlcXVpcmVkUHJvcGVydGllcyB9IGZyb20gJy4uLy4uL3V0aWxzL2NvbW1vbic7XG5pbXBvcnQgeyBQcm9wcyB9IGZyb20gJy4uL0J1dHRvbi9CdXR0b24nO1xuXG5leHBvcnQgY29uc3Qgd3JhcHBlclN0eWxlID0gKCkgPT4gKCkgPT4gY3NzYFxuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBidXR0b25TcGFuU3R5bGUgPSAoe1xuICBzaXplLFxuICBpY29uTGVmdCxcbiAgaWNvblJpZ2h0LFxuICBoYXNDaGlsZHJlbixcbn06IFJlcXVpcmVkUHJvcGVydGllczxQcm9wcyAmIHsgaGFzQ2hpbGRyZW46IGJvb2xlYW4gfT4pID0+ICh0aGVtZTogVGhlbWUpID0+ICh7XG4gIGRpc3BsYXk6IGljb25MZWZ0IHx8IGljb25SaWdodCA/ICdmbGV4JyA6ICdibG9jaycsXG4gIGZsZXhEaXJlY3Rpb246IGljb25MZWZ0IHx8IGljb25SaWdodCA/ICdyb3cnIDogJ2NvbHVtbicsXG4gIGFsaWduSXRlbXM6IGljb25MZWZ0IHx8IGljb25SaWdodCA/ICgnY2VudGVyJyBhcyBjb25zdCkgOiAoJ2ZsZXgtc3RhcnQnIGFzIGNvbnN0KSxcbiAgJz4gOmZpcnN0LW9mLXR5cGUnOiB7XG4gICAgbWFyZ2luTGVmdDogaWNvbkxlZnQgfHwgaWNvblJpZ2h0ID8gKHNpemUgPT09ICdzbScgPyB0aGVtZS5zcGFjaW5nLnNtIDogdGhlbWUuc3BhY2luZy5tZCkgOiAwLFxuICAgIG1hcmdpblJpZ2h0OiBoYXNDaGlsZHJlbiA/IHRoZW1lLnNwYWNpbmcuc20gOiAwLFxuICB9LFxufSk7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-var wrapperStyle = exports.wrapperStyle = function wrapperStyle() {
-  return function () {
-    return _ref;
-  };
-};
-var buttonSpanStyle = exports.buttonSpanStyle = function buttonSpanStyle(_ref2) {
-  var size = _ref2.size,
-    iconLeft = _ref2.iconLeft,
-    iconRight = _ref2.iconRight,
-    hasChildren = _ref2.hasChildren;
+exports.buttonSpanStyle = void 0;
+var buttonSpanStyle = exports.buttonSpanStyle = function buttonSpanStyle(_ref) {
+  var size = _ref.size,
+    iconLeft = _ref.iconLeft,
+    iconRight = _ref.iconRight,
+    hasChildren = _ref.hasChildren;
   return function (theme) {
     return {
       display: iconLeft || iconRight ? 'flex' : 'block',

package/dist/components/TextArea/TextArea.style.js

@@ -2,8 +2,6 @@
 
 exports.__esModule = true;
 exports.sxProp = void 0;
-var _utils = require("../../theme/utils");
-var _config = require("../TextInputBase/config");
 var sxProp = exports.sxProp = function sxProp(resizeEnabled, theme) {
   return {
     wrapper: {
@@ -14,8 +12,7 @@ var sxProp = exports.sxProp = function sxProp(resizeEnabled, theme) {
       padding: theme.spacing.sm
     },
     input: {
-      width: (0, _utils.rem)(_config.MIN_WIDTH),
-      minWidth: (0, _utils.rem)(_config.MIN_WIDTH),
+      maxWidth: '100%',
       resize: !resizeEnabled ? 'none' : 'both'
     }
   };

package/dist/components/utils/DropdownOptions/index.js

@@ -10,7 +10,7 @@ var optionsStyle = exports.optionsStyle = function optionsStyle(_ref) {
     return (
       /*#__PURE__*/
       /*#__PURE__*/
-      (0, _react.css)("max-height:", (0, _utils.rem)(253), ";overflow-y:auto;position:absolute;top:", (0, _utils.rem)(48), ";left:", menuPosition === 'left' ? 0 : 'initial', ";right:0;min-width:", (0, _utils.rem)(150), ";width:100%;height:auto;background-color:", theme.palette.white, ";box-shadow:", theme.elevation['02'], ";border-radius:", (0, _utils.rem)(4), ";z-index:1;" + (process.env.NODE_ENV === "production" ? "" : ";label:optionsStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3V0aWxzL0Ryb3Bkb3duT3B0aW9ucy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBV29GIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3V0aWxzL0Ryb3Bkb3duT3B0aW9ucy9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyByZW0gfSBmcm9tICd0aGVtZS91dGlscyc7XG5cbmltcG9ydCB7IFRoZW1lIH0gZnJvbSAnLi4vLi4vLi4vdGhlbWUnO1xuXG5leHBvcnQgdHlwZSBNZW51UG9zaXRpb25BbGxvd2VkID0gJ2xlZnQnIHwgJ3JpZ2h0JztcblxuZXhwb3J0IHR5cGUgTWVudU9wdGlvbnMgPSB7XG4gIG1lbnVQb3NpdGlvbj86IE1lbnVQb3NpdGlvbkFsbG93ZWQ7XG59O1xuXG5leHBvcnQgY29uc3Qgb3B0aW9uc1N0eWxlID0gKHsgbWVudVBvc2l0aW9uIH06IE1lbnVPcHRpb25zKSA9PiAodGhlbWU6IFRoZW1lKSA9PiBjc3NgXG4gIG1heC1oZWlnaHQ6ICR7cmVtKDI1Myl9O1xuICBvdmVyZmxvdy15OiBhdXRvO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogJHtyZW0oNDgpfTtcbiAgbGVmdDogJHttZW51UG9zaXRpb24gPT09ICdsZWZ0JyA/IDAgOiAnaW5pdGlhbCd9O1xuICByaWdodDogMDtcbiAgbWluLXdpZHRoOiAke3JlbSgxNTApfTtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogYXV0bztcbiAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5wYWxldHRlLndoaXRlfTtcbiAgYm94LXNoYWRvdzogJHt0aGVtZS5lbGV2YXRpb25bJzAyJ119O1xuICBib3JkZXItcmFkaXVzOiAke3JlbSg0KX07XG4gIHotaW5kZXg6IDE7XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:optionsStyle;")
+      (0, _react.css)("max-height:", (0, _utils.rem)(253), ";overflow-y:auto;position:absolute;left:", menuPosition === 'left' ? 0 : 'initial', ";right:0;min-width:", (0, _utils.rem)(150), ";max-width:", (0, _utils.rem)(620), ";width:fit-content;height:auto;background-color:", theme.palette.white, ";box-shadow:", theme.elevation['02'], ";border-radius:", (0, _utils.rem)(4), ";z-index:1;" + (process.env.NODE_ENV === "production" ? "" : ";label:optionsStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3V0aWxzL0Ryb3Bkb3duT3B0aW9ucy9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBV29GIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3V0aWxzL0Ryb3Bkb3duT3B0aW9ucy9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyByZW0gfSBmcm9tICd0aGVtZS91dGlscyc7XG5cbmltcG9ydCB7IFRoZW1lIH0gZnJvbSAnLi4vLi4vLi4vdGhlbWUnO1xuXG5leHBvcnQgdHlwZSBNZW51UG9zaXRpb25BbGxvd2VkID0gJ2xlZnQnIHwgJ3JpZ2h0JztcblxuZXhwb3J0IHR5cGUgTWVudU9wdGlvbnMgPSB7XG4gIG1lbnVQb3NpdGlvbj86IE1lbnVQb3NpdGlvbkFsbG93ZWQ7XG59O1xuXG5leHBvcnQgY29uc3Qgb3B0aW9uc1N0eWxlID0gKHsgbWVudVBvc2l0aW9uIH06IE1lbnVPcHRpb25zKSA9PiAodGhlbWU6IFRoZW1lKSA9PiBjc3NgXG4gIG1heC1oZWlnaHQ6ICR7cmVtKDI1Myl9O1xuICBvdmVyZmxvdy15OiBhdXRvO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGxlZnQ6ICR7bWVudVBvc2l0aW9uID09PSAnbGVmdCcgPyAwIDogJ2luaXRpYWwnfTtcbiAgcmlnaHQ6IDA7XG4gIG1pbi13aWR0aDogJHtyZW0oMTUwKX07XG4gIG1heC13aWR0aDogJHtyZW0oNjIwKX07XG4gIHdpZHRoOiBmaXQtY29udGVudDtcbiAgaGVpZ2h0OiBhdXRvO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUud2hpdGV9O1xuICBib3gtc2hhZG93OiAke3RoZW1lLmVsZXZhdGlvblsnMDInXX07XG4gIGJvcmRlci1yYWRpdXM6ICR7cmVtKDQpfTtcbiAgei1pbmRleDogMTtcbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:optionsStyle;")
     );
   };
 };

package/dist/hooks/useBreakpoints.d.ts

@@ -1,4 +1,4 @@
 export declare const queriesKeys: readonly ["des1920", "des1440", "des1366", "des1200", "tab1024", "tab970", "tab750", "mob480", "mob320"];
-export declare const queriesSizes: Record<typeof queriesKeys[number], string>;
-declare const useBreakpoints: () => import("react-media").QueryResults<Record<"des1920" | "des1440" | "des1366" | "des1200" | "tab1024" | "tab970" | "tab750" | "mob480" | "mob320", string>>;
+export declare const queriesSizes: Record<(typeof queriesKeys)[number], number>;
+export declare const useBreakpoints: () => Record<"des1920" | "des1440" | "des1366" | "des1200" | "tab1024" | "tab970" | "tab750" | "mob480" | "mob320", boolean>;
 export default useBreakpoints;

package/dist/hooks/useBreakpoints.js

@@ -1,29 +1,37 @@
 "use strict";
 
 exports.__esModule = true;
-exports.queriesSizes = exports.queriesKeys = exports["default"] = void 0;
-var _toPairs = _interopRequireDefault(require("lodash/toPairs"));
-var _reactMedia = require("react-media");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+exports.useBreakpoints = exports.queriesSizes = exports.queriesKeys = exports["default"] = void 0;
+var _reactResponsive = require("react-responsive");
 var queriesKeys = exports.queriesKeys = ['des1920', 'des1440', 'des1366', 'des1200', 'tab1024', 'tab970', 'tab750', 'mob480', 'mob320'];
 var queriesSizes = exports.queriesSizes = {
-  des1920: '1920',
-  des1440: '1440',
-  des1366: '1366',
-  des1200: '1200',
-  tab1024: '1024',
-  tab970: '970',
-  tab750: '750',
-  mob480: '480',
-  mob320: '320'
+  des1920: 1920,
+  des1440: 1440,
+  des1366: 1366,
+  des1200: 1200,
+  tab1024: 1024,
+  tab970: 970,
+  tab750: 750,
+  mob480: 480,
+  mob320: 320
 };
-var queries = (0, _toPairs["default"])(queriesSizes).reduce(function (acc, size) {
-  acc[size[0]] = "(min-width: " + size[1] + "px)";
-  return acc;
-}, {});
-var useBreakpoints = function useBreakpoints() {
-  return (0, _reactMedia.useMedia)({
-    queries: queries
+var useIctinusMediaQuery = function useIctinusMediaQuery(key) {
+  return (0, _reactResponsive.useMediaQuery)({
+    minWidth: queriesSizes[key]
   });
 };
+var useBreakpoints = exports.useBreakpoints = function useBreakpoints() {
+  var breakpoints = {
+    des1920: useIctinusMediaQuery('des1920'),
+    des1440: useIctinusMediaQuery('des1440'),
+    des1366: useIctinusMediaQuery('des1366'),
+    des1200: useIctinusMediaQuery('des1200'),
+    tab1024: useIctinusMediaQuery('tab1024'),
+    tab970: useIctinusMediaQuery('tab970'),
+    tab750: useIctinusMediaQuery('tab750'),
+    mob480: useIctinusMediaQuery('mob480'),
+    mob320: useIctinusMediaQuery('mob320')
+  };
+  return breakpoints;
+};
 var _default = exports["default"] = useBreakpoints;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orfium/ictinus",
-  "version": "4.80.2",
+  "version": "4.81.0",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",
@@ -106,8 +106,8 @@
     "polished": "^3.4.4",
     "react-fast-compare": "^3.2.0",
     "react-highlight-words": "^0.20.0",
-    "react-media": "^2.0.0-rc.1",
     "react-range": "^1.8.12",
+    "react-responsive": "^9.0.2",
     "react-switch": "^6.0.0",
     "react-window": "^1.8.6",
     "recharts": "^2.8.0",