@lanaco/lnc-react-ui 3.4.0 → 3.7.0

package/lib/index.esm.js

@@ -3720,12 +3720,14 @@ var lanaco_light = {
         enabled: {
           text: 500,
           line: 300,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           text: 500,
           line: 300,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           text: 500,
@@ -3957,14 +3959,16 @@ var lanaco_light = {
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 0,
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 0,
@@ -7122,12 +7126,14 @@ var lanaco_dark = {
         enabled: {
           text: 400,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           text: 400,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           text: 400,
@@ -7357,14 +7363,16 @@ var lanaco_dark = {
           backgroundOpacity: 0,
           text: 300,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 700,
           backgroundOpacity: 0,
           text: 300,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 800,
@@ -10508,11 +10516,14 @@ var lanaco_e_commerce = {
         enabled: {
           text: 500,
           line: 300,
+          lineHeight: "2px",
+          lineRadius: "0",
           fontWeight: 700
         },
         hover: {
           text: 500,
           line: 300,
+          lineHeight: "1px",
           fontWeight: 700
         },
         active: {
@@ -10745,14 +10756,16 @@ var lanaco_e_commerce = {
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 0,
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 0,
@@ -53781,7 +53794,7 @@ Dropdown.propTypes = {
   openMenuOnClick: PropTypes.bool,
   //----
   autoFocus: PropTypes.bool,
-  placeholder: PropTypes.string,
+  placeholder: PropTypes.any,
   noOptionsMessage: PropTypes.string,
   menuIsOpen: PropTypes.bool,
   /**
@@ -70760,7 +70773,7 @@ const useInteractions = function (propsList) {
 
 var _excluded$N = ["children", "modal"],
   _excluded2$3 = ["children", "asChild"],
-  _excluded3$1 = ["borderRadius", "className", "style"],
+  _excluded3$1 = ["borderRadius", "className", "zIndex", "style"],
   _excluded4$1 = ["children"],
   _excluded6 = ["children"];
 var _templateObject$K;
@@ -70906,6 +70919,7 @@ var PopoverContent = /*#__PURE__*/React.forwardRef(function PopoverContent(_ref4
   var _state$y, _state$x;
   var borderRadius = _ref4.borderRadius,
     className = _ref4.className,
+    zIndex = _ref4.zIndex,
     style = _ref4.style,
     props = _objectWithoutProperties$1(_ref4, _excluded3$1);
   var state = usePopoverState();
@@ -70920,7 +70934,8 @@ var PopoverContent = /*#__PURE__*/React.forwardRef(function PopoverContent(_ref4
       position: state.strategy,
       top: (_state$y = state.y) !== null && _state$y !== void 0 ? _state$y : 0,
       left: (_state$x = state.x) !== null && _state$x !== void 0 ? _state$x : 0,
-      width: "max-content"
+      width: "max-content",
+      zIndex: zIndex
     },
     "aria-labelledby": state.labelId,
     "aria-describedby": state.descriptionId
@@ -70938,7 +70953,8 @@ PopoverContent.defaultProps = {
 };
 PopoverContent.propTypes = {
   className: PropTypes.string,
-  style: PropTypes.object
+  style: PropTypes.object,
+  zIndex: PropTypes.number
 };
 var PopoverHeading = /*#__PURE__*/React.forwardRef(function PopoverHeading(_ref5, ref) {
   var children = _ref5.children,
@@ -70972,7 +70988,7 @@ var PopoverClose = /*#__PURE__*/React.forwardRef(function PopoverClose(_ref7, re
   }), children);
 });
 
-var _excluded$M = ["control", "offsetValue", "placement", "widthFitContent", "closeOnItemSelect", "onFocus", "onBlur", "onClick", "onKeyDown", "onMouseEnter", "onMouseLeave", "onItemSelected", "animation", "className", "style", "color", "size", "popoverProps", "children"];
+var _excluded$M = ["control", "offsetValue", "placement", "widthFitContent", "closeOnItemSelect", "zIndex", "onFocus", "onBlur", "onClick", "onKeyDown", "onMouseEnter", "onMouseLeave", "onItemSelected", "animation", "className", "style", "color", "size", "popoverProps", "children"];
 var _templateObject$J, _templateObject2$f;
 var StyledDropDown = newStyled.div(_templateObject$J || (_templateObject$J = _taggedTemplateLiteral([""])));
 var StyledContent = newStyled(motion.div)(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteral(["\n  gap: 0.25rem;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  background-color: ", ";\n"])), function (props) {
@@ -70986,6 +71002,7 @@ var DropdownMenu = /*#__PURE__*/React__default.forwardRef(function (props, ref)
     placement = props.placement,
     widthFitContent = props.widthFitContent,
     closeOnItemSelect = props.closeOnItemSelect,
+    zIndex = props.zIndex,
     onFocus = props.onFocus,
     onBlur = props.onBlur,
     onClick = props.onClick,
@@ -71024,14 +71041,14 @@ var DropdownMenu = /*#__PURE__*/React__default.forwardRef(function (props, ref)
           return /*#__PURE__*/React__default.cloneElement(child, {
             ref: ref ? ref : firstItemRef,
             //needed to focus on navigation
-            color: color,
+            color: child.props.color ? child.props.color : color,
             size: size,
             onItemSelected: handleOnItemSelected,
             animation: animation
           });
         }
         return /*#__PURE__*/React__default.cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: handleOnItemSelected
         });
@@ -71081,7 +71098,9 @@ var DropdownMenu = /*#__PURE__*/React__default.forwardRef(function (props, ref)
         return !v;
       });
     }
-  }, clonedControl()), /*#__PURE__*/React__default.createElement(PopoverContent, null, /*#__PURE__*/React__default.createElement(StyledContent, {
+  }, clonedControl()), /*#__PURE__*/React__default.createElement(PopoverContent, {
+    zIndex: zIndex
+  }, /*#__PURE__*/React__default.createElement(StyledContent, {
     ref: menuContentRef,
     widthFitContent: widthFitContent,
     color: color,
@@ -71148,6 +71167,10 @@ DropdownMenu.propTypes = {
    * Close menu when item is selected
    */
   closeOnItemSelect: PropTypes.bool,
+  /**
+   * zIndex of dropdown popup
+   */
+  zIndex: PropTypes.number,
   //---------------------------------------------------------------
   onBlur: PropTypes.func,
   onFocus: PropTypes.func,
@@ -71376,7 +71399,6 @@ DropdownItem.defaultProps = {
   //-------------------------
   style: {},
   className: "",
-  color: "primary",
   size: "small",
   __TYPE__: "MENU_ITEM"
 };
@@ -77999,7 +78021,7 @@ DropdownLookup.propTypes = {
   openMenuOnClick: PropTypes.bool,
   //----
   autoFocus: PropTypes.bool,
-  placeholder: PropTypes.string,
+  placeholder: PropTypes.any,
   noOptionsMessage: PropTypes.string,
   menuIsOpen: PropTypes.bool,
   /**
@@ -78303,7 +78325,7 @@ MultiSelectDropdown.propTypes = {
   openMenuOnClick: PropTypes.bool,
   //----
   autoFocus: PropTypes.bool,
-  placeholder: PropTypes.string,
+  placeholder: PropTypes.any,
   noOptionsMessage: PropTypes.string,
   menuIsOpen: PropTypes.bool,
   /**
@@ -78627,7 +78649,7 @@ MultiSelectDropdownLookup.propTypes = {
   openMenuOnClick: PropTypes.bool,
   //----
   autoFocus: PropTypes.bool,
-  placeholder: PropTypes.string,
+  placeholder: PropTypes.any,
   noOptionsMessage: PropTypes.string,
   menuIsOpen: PropTypes.bool,
   /**
@@ -81125,7 +81147,7 @@ var getBorderRadius = function getBorderRadius(theme, type, first, last) {
 };
 var getBottomLine = function getBottomLine(theme, type, active, disabled, color, state) {
   if (type == "pill") return;
-  return "border-bottom: ".concat(!disabled && (active || state == "hover") ? "2px" : "1px", " solid ").concat(getColorRgbaValue(theme, getTypeName(type), color, active && !disabled ? "active" : disabled ? "enabled" : state, "line"));
+  return "border-bottom: ".concat(!disabled && (active || state == "hover") ? theme.components[type === "regular" ? "TabRegular" : "TabUnderline"]["default"].enabled.lineHeight + "" : theme.components[type === "regular" ? "TabRegular" : "TabUnderline"]["default"].hover.lineHeight + "", " solid ").concat(getColorRgbaValue(theme, getTypeName(type), color, active && !disabled ? "active" : disabled ? "enabled" : state, "line"));
 };
 var TabItem = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
   var type = props.type,
@@ -82327,7 +82349,7 @@ var NestedDropdownItem = /*#__PURE__*/React__default.forwardRef(function (props,
     if ( /*#__PURE__*/React__default.isValidElement(child)) {
       if (child.props.__TYPE__ == "MENU_ITEM" || child.props.__TYPE__ == "NESTED_ITEM") {
         return /*#__PURE__*/React__default.cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });
@@ -82684,13 +82706,13 @@ var TreeMenu = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
           return /*#__PURE__*/React__default.cloneElement(child, {
             ref: ref ? ref : firstItemRef,
             //needed to focus on navigation
-            color: color,
+            color: child.props.color ? child.props.color : color,
             size: size,
             onItemSelected: onItemSelected
           });
         }
         return /*#__PURE__*/React__default.cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });
@@ -82949,7 +82971,6 @@ MenuItem.defaultProps = {
   //-------------------------
   style: {},
   className: "",
-  color: "primary",
   size: "small",
   __TYPE__: "MENU_ITEM"
 };
@@ -83018,7 +83039,7 @@ var NestedMenuItem = /*#__PURE__*/React__default.forwardRef(function (props, ref
     if ( /*#__PURE__*/React__default.isValidElement(child)) {
       if (child.props.__TYPE__ == "MENU_ITEM" || child.props.__TYPE__ == "NESTED_ITEM") {
         return /*#__PURE__*/React__default.cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });

package/lib/index.js

@@ -3769,12 +3769,14 @@ var lanaco_light = {
         enabled: {
           text: 500,
           line: 300,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           text: 500,
           line: 300,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           text: 500,
@@ -4006,14 +4008,16 @@ var lanaco_light = {
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 0,
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 0,
@@ -7171,12 +7175,14 @@ var lanaco_dark = {
         enabled: {
           text: 400,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           text: 400,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           text: 400,
@@ -7406,14 +7412,16 @@ var lanaco_dark = {
           backgroundOpacity: 0,
           text: 300,
           line: 700,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 700,
           backgroundOpacity: 0,
           text: 300,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 800,
@@ -10557,11 +10565,14 @@ var lanaco_e_commerce = {
         enabled: {
           text: 500,
           line: 300,
+          lineHeight: "2px",
+          lineRadius: "0",
           fontWeight: 700
         },
         hover: {
           text: 500,
           line: 300,
+          lineHeight: "1px",
           fontWeight: 700
         },
         active: {
@@ -10794,14 +10805,16 @@ var lanaco_e_commerce = {
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "2px"
         },
         hover: {
           background: 0,
           backgroundOpacity: 0,
           text: 500,
           line: 200,
-          fontWeight: 700
+          fontWeight: 700,
+          lineHeight: "1px"
         },
         active: {
           background: 0,
@@ -53830,7 +53843,7 @@ Dropdown.propTypes = {
   openMenuOnClick: PropTypes__default["default"].bool,
   //----
   autoFocus: PropTypes__default["default"].bool,
-  placeholder: PropTypes__default["default"].string,
+  placeholder: PropTypes__default["default"].any,
   noOptionsMessage: PropTypes__default["default"].string,
   menuIsOpen: PropTypes__default["default"].bool,
   /**
@@ -70809,7 +70822,7 @@ const useInteractions = function (propsList) {
 
 var _excluded$N = ["children", "modal"],
   _excluded2$3 = ["children", "asChild"],
-  _excluded3$1 = ["borderRadius", "className", "style"],
+  _excluded3$1 = ["borderRadius", "className", "zIndex", "style"],
   _excluded4$1 = ["children"],
   _excluded6 = ["children"];
 var _templateObject$K;
@@ -70955,6 +70968,7 @@ var PopoverContent = /*#__PURE__*/React__namespace.forwardRef(function PopoverCo
   var _state$y, _state$x;
   var borderRadius = _ref4.borderRadius,
     className = _ref4.className,
+    zIndex = _ref4.zIndex,
     style = _ref4.style,
     props = _objectWithoutProperties__default["default"](_ref4, _excluded3$1);
   var state = usePopoverState();
@@ -70969,7 +70983,8 @@ var PopoverContent = /*#__PURE__*/React__namespace.forwardRef(function PopoverCo
       position: state.strategy,
       top: (_state$y = state.y) !== null && _state$y !== void 0 ? _state$y : 0,
       left: (_state$x = state.x) !== null && _state$x !== void 0 ? _state$x : 0,
-      width: "max-content"
+      width: "max-content",
+      zIndex: zIndex
     },
     "aria-labelledby": state.labelId,
     "aria-describedby": state.descriptionId
@@ -70987,7 +71002,8 @@ PopoverContent.defaultProps = {
 };
 PopoverContent.propTypes = {
   className: PropTypes__default["default"].string,
-  style: PropTypes__default["default"].object
+  style: PropTypes__default["default"].object,
+  zIndex: PropTypes__default["default"].number
 };
 var PopoverHeading = /*#__PURE__*/React__namespace.forwardRef(function PopoverHeading(_ref5, ref) {
   var children = _ref5.children,
@@ -71021,7 +71037,7 @@ var PopoverClose = /*#__PURE__*/React__namespace.forwardRef(function PopoverClos
   }), children);
 });
 
-var _excluded$M = ["control", "offsetValue", "placement", "widthFitContent", "closeOnItemSelect", "onFocus", "onBlur", "onClick", "onKeyDown", "onMouseEnter", "onMouseLeave", "onItemSelected", "animation", "className", "style", "color", "size", "popoverProps", "children"];
+var _excluded$M = ["control", "offsetValue", "placement", "widthFitContent", "closeOnItemSelect", "zIndex", "onFocus", "onBlur", "onClick", "onKeyDown", "onMouseEnter", "onMouseLeave", "onItemSelected", "animation", "className", "style", "color", "size", "popoverProps", "children"];
 var _templateObject$J, _templateObject2$f;
 var StyledDropDown = newStyled.div(_templateObject$J || (_templateObject$J = _taggedTemplateLiteral__default["default"]([""])));
 var StyledContent = newStyled(motion.div)(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteral__default["default"](["\n  gap: 0.25rem;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  background-color: ", ";\n"])), function (props) {
@@ -71035,6 +71051,7 @@ var DropdownMenu = /*#__PURE__*/React__default["default"].forwardRef(function (p
     placement = props.placement,
     widthFitContent = props.widthFitContent,
     closeOnItemSelect = props.closeOnItemSelect,
+    zIndex = props.zIndex,
     onFocus = props.onFocus,
     onBlur = props.onBlur,
     onClick = props.onClick,
@@ -71073,14 +71090,14 @@ var DropdownMenu = /*#__PURE__*/React__default["default"].forwardRef(function (p
           return /*#__PURE__*/React__default["default"].cloneElement(child, {
             ref: ref ? ref : firstItemRef,
             //needed to focus on navigation
-            color: color,
+            color: child.props.color ? child.props.color : color,
             size: size,
             onItemSelected: handleOnItemSelected,
             animation: animation
           });
         }
         return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: handleOnItemSelected
         });
@@ -71130,7 +71147,9 @@ var DropdownMenu = /*#__PURE__*/React__default["default"].forwardRef(function (p
         return !v;
       });
     }
-  }, clonedControl()), /*#__PURE__*/React__default["default"].createElement(PopoverContent, null, /*#__PURE__*/React__default["default"].createElement(StyledContent, {
+  }, clonedControl()), /*#__PURE__*/React__default["default"].createElement(PopoverContent, {
+    zIndex: zIndex
+  }, /*#__PURE__*/React__default["default"].createElement(StyledContent, {
     ref: menuContentRef,
     widthFitContent: widthFitContent,
     color: color,
@@ -71197,6 +71216,10 @@ DropdownMenu.propTypes = {
    * Close menu when item is selected
    */
   closeOnItemSelect: PropTypes__default["default"].bool,
+  /**
+   * zIndex of dropdown popup
+   */
+  zIndex: PropTypes__default["default"].number,
   //---------------------------------------------------------------
   onBlur: PropTypes__default["default"].func,
   onFocus: PropTypes__default["default"].func,
@@ -71425,7 +71448,6 @@ DropdownItem.defaultProps = {
   //-------------------------
   style: {},
   className: "",
-  color: "primary",
   size: "small",
   __TYPE__: "MENU_ITEM"
 };
@@ -78048,7 +78070,7 @@ DropdownLookup.propTypes = {
   openMenuOnClick: PropTypes__default["default"].bool,
   //----
   autoFocus: PropTypes__default["default"].bool,
-  placeholder: PropTypes__default["default"].string,
+  placeholder: PropTypes__default["default"].any,
   noOptionsMessage: PropTypes__default["default"].string,
   menuIsOpen: PropTypes__default["default"].bool,
   /**
@@ -78352,7 +78374,7 @@ MultiSelectDropdown.propTypes = {
   openMenuOnClick: PropTypes__default["default"].bool,
   //----
   autoFocus: PropTypes__default["default"].bool,
-  placeholder: PropTypes__default["default"].string,
+  placeholder: PropTypes__default["default"].any,
   noOptionsMessage: PropTypes__default["default"].string,
   menuIsOpen: PropTypes__default["default"].bool,
   /**
@@ -78676,7 +78698,7 @@ MultiSelectDropdownLookup.propTypes = {
   openMenuOnClick: PropTypes__default["default"].bool,
   //----
   autoFocus: PropTypes__default["default"].bool,
-  placeholder: PropTypes__default["default"].string,
+  placeholder: PropTypes__default["default"].any,
   noOptionsMessage: PropTypes__default["default"].string,
   menuIsOpen: PropTypes__default["default"].bool,
   /**
@@ -81174,7 +81196,7 @@ var getBorderRadius = function getBorderRadius(theme, type, first, last) {
 };
 var getBottomLine = function getBottomLine(theme, type, active, disabled, color, state) {
   if (type == "pill") return;
-  return "border-bottom: ".concat(!disabled && (active || state == "hover") ? "2px" : "1px", " solid ").concat(getColorRgbaValue(theme, getTypeName(type), color, active && !disabled ? "active" : disabled ? "enabled" : state, "line"));
+  return "border-bottom: ".concat(!disabled && (active || state == "hover") ? theme.components[type === "regular" ? "TabRegular" : "TabUnderline"]["default"].enabled.lineHeight + "" : theme.components[type === "regular" ? "TabRegular" : "TabUnderline"]["default"].hover.lineHeight + "", " solid ").concat(getColorRgbaValue(theme, getTypeName(type), color, active && !disabled ? "active" : disabled ? "enabled" : state, "line"));
 };
 var TabItem = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
   var type = props.type,
@@ -82376,7 +82398,7 @@ var NestedDropdownItem = /*#__PURE__*/React__default["default"].forwardRef(funct
     if ( /*#__PURE__*/React__default["default"].isValidElement(child)) {
       if (child.props.__TYPE__ == "MENU_ITEM" || child.props.__TYPE__ == "NESTED_ITEM") {
         return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });
@@ -82733,13 +82755,13 @@ var TreeMenu = /*#__PURE__*/React__default["default"].forwardRef(function (props
           return /*#__PURE__*/React__default["default"].cloneElement(child, {
             ref: ref ? ref : firstItemRef,
             //needed to focus on navigation
-            color: color,
+            color: child.props.color ? child.props.color : color,
             size: size,
             onItemSelected: onItemSelected
           });
         }
         return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });
@@ -82998,7 +83020,6 @@ MenuItem.defaultProps = {
   //-------------------------
   style: {},
   className: "",
-  color: "primary",
   size: "small",
   __TYPE__: "MENU_ITEM"
 };
@@ -83067,7 +83088,7 @@ var NestedMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function
     if ( /*#__PURE__*/React__default["default"].isValidElement(child)) {
       if (child.props.__TYPE__ == "MENU_ITEM" || child.props.__TYPE__ == "NESTED_ITEM") {
         return /*#__PURE__*/React__default["default"].cloneElement(child, {
-          color: color,
+          color: child.props.color ? child.props.color : color,
           size: size,
           onItemSelected: onItemSelected
         });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lanaco/lnc-react-ui",
   "type": "module",
-  "version": "3.4.0",
+  "version": "3.7.0",
   "description": "component library",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",