@activecollab/components 1.0.414 → 2.0.0

package/dist/cjs/components/Signifier/Signifier.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -12,75 +11,62 @@ var _Tooltip = require("../Tooltip");
 var _Typography = require("../Typography");
 var _Styles = require("./Styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var signifierTypes = ["EyeIcon", "EyeSmallIcon", "PencilIcon", "PencilSmallIcon", "EyeOffIcon", "EyeOffSmallIcon", "ChecklistIcon", "ChecklistSmallIcon", "WarningTriangleIcon", "WarningTriangleSmallIcon", "DependencyIcon", "DependencySmallIcon", "MessageIcon", "MessageSmallIcon", "ClockStopwatchIcon", "ClockStopwatchSmallIcon", "ClockIcon", "ClockSmallIcon", "DollarOffIcon", "DollarOffSmallIcon", "DollarIcon", "DollarSmallIcon", "DollarCheckmarkIcon", "DollarCheckmarkSmallIcon", "DollarClockIcon", "DollarClockSmallIcon", "BellOffIcon", "BellOffSmallIcon", "LockIcon", "LockSmallIcon", "RecurringCheckmarkIcon", "RecurringCheckmarkSmallIcon"];
-exports.signifierTypes = signifierTypes;
-var Signifier = function Signifier(_ref) {
-  var Component = _ref.type,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? null : _ref$value,
-    className = _ref.className,
-    tooltipText = _ref.tooltipText,
-    tooltipClassName = _ref.tooltipClassName;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const signifierTypes = exports.signifierTypes = ["EyeIcon", "EyeSmallIcon", "PencilIcon", "PencilSmallIcon", "EyeOffIcon", "EyeOffSmallIcon", "ChecklistIcon", "ChecklistSmallIcon", "WarningTriangleIcon", "WarningTriangleSmallIcon", "DependencyIcon", "DependencySmallIcon", "MessageIcon", "MessageSmallIcon", "ClockStopwatchIcon", "ClockStopwatchSmallIcon", "ClockIcon", "ClockSmallIcon", "DollarOffIcon", "DollarOffSmallIcon", "DollarIcon", "DollarSmallIcon", "DollarCheckmarkIcon", "DollarCheckmarkSmallIcon", "DollarClockIcon", "DollarClockSmallIcon", "BellOffIcon", "BellOffSmallIcon", "LockIcon", "LockSmallIcon", "RecurringCheckmarkIcon", "RecurringCheckmarkSmallIcon"];
+const Signifier = _ref => {
+  let {
+    type: Component,
+    value = null,
+    className,
+    tooltipText,
+    tooltipClassName
+  } = _ref;
   if (signifierTypes.indexOf(Component.displayName) === -1) {
     console.warn("You are using unsupported Signifier icon");
   }
-  var _useState = (0, _react.useState)("c-signifier--top"),
-    _useState2 = _slicedToArray(_useState, 2),
-    direction = _useState2[0],
-    setDirection = _useState2[1];
-  var _useState3 = (0, _react.useState)(value),
-    _useState4 = _slicedToArray(_useState3, 2),
-    setPrevValue = _useState4[1];
-  var label = (0, _react.useMemo)(function () {
+  const [direction, setDirection] = (0, _react.useState)("c-signifier--top");
+  const [, setPrevValue] = (0, _react.useState)(value);
+  const label = (0, _react.useMemo)(() => {
     if (!value || value < 1) return null;
-    var max = 1000000000;
-    var newValue = value;
+    const max = 1_000_000_000;
+    let newValue = value;
     if (newValue > max) {
       newValue = max;
     }
     if (newValue === max) {
-      return "".concat(Math.floor(newValue / 1000000000), "B+");
-    } else if (newValue > 999999) {
-      return "".concat(Math.floor(newValue / 1000000), "M");
+      return `${Math.floor(newValue / 1_000_000_000)}B+`;
+    } else if (newValue > 999_999) {
+      return `${Math.floor(newValue / 1_000_000)}M`;
     } else if (newValue > 999) {
-      return "".concat(Math.floor(newValue / 1000), "k");
+      return `${Math.floor(newValue / 1000)}k`;
     }
-    return "".concat(newValue);
+    return `${newValue}`;
   }, [value]);
-  (0, _react.useEffect)(function () {
-    value && setPrevValue(function (v) {
+  (0, _react.useEffect)(() => {
+    value && setPrevValue(v => {
       v && setDirection(v - value > 0 ? "c-signifier--top" : "c-signifier--bottom");
       return value;
     });
   }, [value]);
-  var renderSignifier = (0, _react.useMemo)(function () {
-    return /*#__PURE__*/_react.default.createElement(_Styles.StyledSignifier, {
-      className: (0, _classnames.default)("c-signifier", className),
-      $direction: direction
-    }, /*#__PURE__*/_react.default.createElement(_Styles.StyledIcon, {
-      as: Component
-    }), value !== null && /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.SwitchTransition, {
-      mode: "out-in"
-    }, /*#__PURE__*/_react.default.createElement(_Styles.StyledSignifierTransition, {
-      key: label,
-      timeout: 300,
-      classNames: "c-signifier--animate"
-    }, Component.displayName.includes("SmallIcon") ? /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
-      color: "secondary"
-    }, label) : /*#__PURE__*/_react.default.createElement(_Typography.Body1, {
-      color: "secondary"
-    }, label))));
-  }, [className, direction, Component, value, label]);
+  const renderSignifier = (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Styles.StyledSignifier, {
+    className: (0, _classnames.default)("c-signifier", className),
+    $direction: direction
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledIcon, {
+    as: Component
+  }), value !== null && /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.SwitchTransition, {
+    mode: "out-in"
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledSignifierTransition, {
+    key: label,
+    timeout: 300,
+    classNames: "c-signifier--animate"
+  }, Component.displayName.includes("SmallIcon") ? /*#__PURE__*/_react.default.createElement(_Typography.Caption1, {
+    color: "secondary"
+  }, label) : /*#__PURE__*/_react.default.createElement(_Typography.Body1, {
+    color: "secondary"
+  }, label)))), [className, direction, Component, value, label]);
   return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-    title: tooltipText !== null && tooltipText !== void 0 ? tooltipText : "",
+    title: tooltipText ?? "",
     disable: !tooltipText,
     popperTooltipClassName: tooltipClassName
   }, renderSignifier);

package/dist/cjs/components/Signifier/Signifier.js.map

@@ -1 +1 @@
-{"version":3,"file":"Signifier.js","names":["signifierTypes","Signifier","Component","type","value","className","tooltipText","tooltipClassName","indexOf","displayName","console","warn","useState","direction","setDirection","setPrevValue","label","useMemo","max","newValue","Math","floor","useEffect","v","renderSignifier","classnames","includes"],"sources":["../../../../src/components/Signifier/Signifier.tsx"],"sourcesContent":["import React, { FC, useMemo, ElementType, useState, useEffect } from \"react\";\nimport classnames from \"classnames\";\nimport { SwitchTransition } from \"react-transition-group\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Body1, Caption1 } from \"../Typography\";\nimport {\n  StyledIcon,\n  StyledSignifier,\n  StyledSignifierTransition,\n} from \"./Styles\";\n\ninterface ISignifierProps {\n  /** One of icon types */\n  type: ElementType;\n  /** Number that represent total value */\n  value?: number;\n  /** Value that represent class names */\n  className?: string;\n  /** The text that will be displayed on hover in tooltip */\n  tooltipText?: string;\n  /** ClassName for tooltip if there is one */\n  tooltipClassName?: string;\n}\n\nexport const signifierTypes = [\n  \"EyeIcon\",\n  \"EyeSmallIcon\",\n  \"PencilIcon\",\n  \"PencilSmallIcon\",\n  \"EyeOffIcon\",\n  \"EyeOffSmallIcon\",\n  \"ChecklistIcon\",\n  \"ChecklistSmallIcon\",\n  \"WarningTriangleIcon\",\n  \"WarningTriangleSmallIcon\",\n  \"DependencyIcon\",\n  \"DependencySmallIcon\",\n  \"MessageIcon\",\n  \"MessageSmallIcon\",\n  \"ClockStopwatchIcon\",\n  \"ClockStopwatchSmallIcon\",\n  \"ClockIcon\",\n  \"ClockSmallIcon\",\n  \"DollarOffIcon\",\n  \"DollarOffSmallIcon\",\n  \"DollarIcon\",\n  \"DollarSmallIcon\",\n  \"DollarCheckmarkIcon\",\n  \"DollarCheckmarkSmallIcon\",\n  \"DollarClockIcon\",\n  \"DollarClockSmallIcon\",\n  \"BellOffIcon\",\n  \"BellOffSmallIcon\",\n  \"LockIcon\",\n  \"LockSmallIcon\",\n  \"RecurringCheckmarkIcon\",\n  \"RecurringCheckmarkSmallIcon\",\n];\n\nexport const Signifier: FC<ISignifierProps> = ({\n  type: Component,\n  value = null,\n  className,\n  tooltipText,\n  tooltipClassName,\n}) => {\n  if (\n    signifierTypes.indexOf(\n      (Component as { displayName: string }).displayName\n    ) === -1\n  ) {\n    console.warn(\"You are using unsupported Signifier icon\");\n  }\n\n  const [direction, setDirection] = useState(\"c-signifier--top\");\n  const [, setPrevValue] = useState(value);\n\n  const label: string | null = useMemo(() => {\n    if (!value || value < 1) return null;\n\n    const max = 1_000_000_000;\n    let newValue = value;\n\n    if (newValue > max) {\n      newValue = max;\n    }\n\n    if (newValue === max) {\n      return `${Math.floor(newValue / 1_000_000_000)}B+`;\n    } else if (newValue > 999_999) {\n      return `${Math.floor(newValue / 1_000_000)}M`;\n    } else if (newValue > 999) {\n      return `${Math.floor(newValue / 1000)}k`;\n    }\n\n    return `${newValue}`;\n  }, [value]);\n\n  useEffect(() => {\n    value &&\n      setPrevValue((v) => {\n        v &&\n          setDirection(\n            v - value > 0 ? \"c-signifier--top\" : \"c-signifier--bottom\"\n          );\n        return value;\n      });\n  }, [value]);\n\n  const renderSignifier = useMemo(\n    () => (\n      <StyledSignifier\n        className={classnames(\"c-signifier\", className)}\n        $direction={direction}\n      >\n        <StyledIcon as={Component} />\n        {value !== null && (\n          <SwitchTransition mode=\"out-in\">\n            <StyledSignifierTransition\n              key={label}\n              timeout={300}\n              classNames=\"c-signifier--animate\"\n            >\n              {(Component as { displayName: string }).displayName.includes(\n                \"SmallIcon\"\n              ) ? (\n                <Caption1 color=\"secondary\">{label}</Caption1>\n              ) : (\n                <Body1 color=\"secondary\">{label}</Body1>\n              )}\n            </StyledSignifierTransition>\n          </SwitchTransition>\n        )}\n      </StyledSignifier>\n    ),\n    [className, direction, Component, value, label]\n  );\n\n  return (\n    <Tooltip\n      title={tooltipText ?? \"\"}\n      disable={!tooltipText}\n      popperTooltipClassName={tooltipClassName}\n    >\n      {renderSignifier}\n    </Tooltip>\n  );\n};\n\nSignifier.displayName = \"Signifier\";\n"],"mappings":"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"}
+{"version":3,"file":"Signifier.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_reactTransitionGroup","_Tooltip","_Typography","_Styles","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","signifierTypes","exports","Signifier","_ref","type","Component","value","className","tooltipText","tooltipClassName","indexOf","displayName","console","warn","direction","setDirection","useState","setPrevValue","label","useMemo","max","newValue","Math","floor","useEffect","v","renderSignifier","createElement","StyledSignifier","classnames","$direction","StyledIcon","as","SwitchTransition","mode","StyledSignifierTransition","key","timeout","classNames","includes","Caption1","color","Body1","Tooltip","title","disable","popperTooltipClassName"],"sources":["../../../../src/components/Signifier/Signifier.tsx"],"sourcesContent":["import React, { FC, useMemo, ElementType, useState, useEffect } from \"react\";\nimport classnames from \"classnames\";\nimport { SwitchTransition } from \"react-transition-group\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Body1, Caption1 } from \"../Typography\";\nimport {\n  StyledIcon,\n  StyledSignifier,\n  StyledSignifierTransition,\n} from \"./Styles\";\n\ninterface ISignifierProps {\n  /** One of icon types */\n  type: ElementType;\n  /** Number that represent total value */\n  value?: number;\n  /** Value that represent class names */\n  className?: string;\n  /** The text that will be displayed on hover in tooltip */\n  tooltipText?: string;\n  /** ClassName for tooltip if there is one */\n  tooltipClassName?: string;\n}\n\nexport const signifierTypes = [\n  \"EyeIcon\",\n  \"EyeSmallIcon\",\n  \"PencilIcon\",\n  \"PencilSmallIcon\",\n  \"EyeOffIcon\",\n  \"EyeOffSmallIcon\",\n  \"ChecklistIcon\",\n  \"ChecklistSmallIcon\",\n  \"WarningTriangleIcon\",\n  \"WarningTriangleSmallIcon\",\n  \"DependencyIcon\",\n  \"DependencySmallIcon\",\n  \"MessageIcon\",\n  \"MessageSmallIcon\",\n  \"ClockStopwatchIcon\",\n  \"ClockStopwatchSmallIcon\",\n  \"ClockIcon\",\n  \"ClockSmallIcon\",\n  \"DollarOffIcon\",\n  \"DollarOffSmallIcon\",\n  \"DollarIcon\",\n  \"DollarSmallIcon\",\n  \"DollarCheckmarkIcon\",\n  \"DollarCheckmarkSmallIcon\",\n  \"DollarClockIcon\",\n  \"DollarClockSmallIcon\",\n  \"BellOffIcon\",\n  \"BellOffSmallIcon\",\n  \"LockIcon\",\n  \"LockSmallIcon\",\n  \"RecurringCheckmarkIcon\",\n  \"RecurringCheckmarkSmallIcon\",\n];\n\nexport const Signifier: FC<ISignifierProps> = ({\n  type: Component,\n  value = null,\n  className,\n  tooltipText,\n  tooltipClassName,\n}) => {\n  if (\n    signifierTypes.indexOf(\n      (Component as { displayName: string }).displayName\n    ) === -1\n  ) {\n    console.warn(\"You are using unsupported Signifier icon\");\n  }\n\n  const [direction, setDirection] = useState(\"c-signifier--top\");\n  const [, setPrevValue] = useState(value);\n\n  const label: string | null = useMemo(() => {\n    if (!value || value < 1) return null;\n\n    const max = 1_000_000_000;\n    let newValue = value;\n\n    if (newValue > max) {\n      newValue = max;\n    }\n\n    if (newValue === max) {\n      return `${Math.floor(newValue / 1_000_000_000)}B+`;\n    } else if (newValue > 999_999) {\n      return `${Math.floor(newValue / 1_000_000)}M`;\n    } else if (newValue > 999) {\n      return `${Math.floor(newValue / 1000)}k`;\n    }\n\n    return `${newValue}`;\n  }, [value]);\n\n  useEffect(() => {\n    value &&\n      setPrevValue((v) => {\n        v &&\n          setDirection(\n            v - value > 0 ? \"c-signifier--top\" : \"c-signifier--bottom\"\n          );\n        return value;\n      });\n  }, [value]);\n\n  const renderSignifier = useMemo(\n    () => (\n      <StyledSignifier\n        className={classnames(\"c-signifier\", className)}\n        $direction={direction}\n      >\n        <StyledIcon as={Component} />\n        {value !== null && (\n          <SwitchTransition mode=\"out-in\">\n            <StyledSignifierTransition\n              key={label}\n              timeout={300}\n              classNames=\"c-signifier--animate\"\n            >\n              {(Component as { displayName: string }).displayName.includes(\n                \"SmallIcon\"\n              ) ? (\n                <Caption1 color=\"secondary\">{label}</Caption1>\n              ) : (\n                <Body1 color=\"secondary\">{label}</Body1>\n              )}\n            </StyledSignifierTransition>\n          </SwitchTransition>\n        )}\n      </StyledSignifier>\n    ),\n    [className, direction, Component, value, label]\n  );\n\n  return (\n    <Tooltip\n      title={tooltipText ?? \"\"}\n      disable={!tooltipText}\n      popperTooltipClassName={tooltipClassName}\n    >\n      {renderSignifier}\n    </Tooltip>\n  );\n};\n\nSignifier.displayName = \"Signifier\";\n"],"mappings":"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"}

package/dist/cjs/components/Signifier/Styles.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,29 +8,23 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _reactTransitionGroup = require("react-transition-group");
 var _BoxSizingStyle = require("../BoxSizingStyle");
 var _FontStyle = require("../FontStyle");
-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; }
-var StyledSignifier = _styledComponents.default.div.withConfig({
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const StyledSignifier = exports.StyledSignifier = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledSignifier",
   componentId: "sc-1idn4je-0"
 })(["", " ", " ", " cursor:default;", " ", ""], {
   "display": "inline-flex",
   "alignItems": "center",
   "color": "var(--color-theme-800)"
-}, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, function (props) {
-  return props.$direction === "c-signifier--top" && (0, _styledComponents.css)(["--signifier-in:60%;--signifier-out:-60%;"]);
-}, function (props) {
-  return props.$direction === "c-signifier--bottom" && (0, _styledComponents.css)(["--signifier-in:-60%;--signifier-out:60%;"]);
-});
-exports.StyledSignifier = StyledSignifier;
+}, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, props => props.$direction === "c-signifier--top" && (0, _styledComponents.css)(["--signifier-in:60%;--signifier-out:-60%;"]), props => props.$direction === "c-signifier--bottom" && (0, _styledComponents.css)(["--signifier-in:-60%;--signifier-out:60%;"]));
 StyledSignifier.displayName = "StyledSignifier";
-var StyledSignifierTransition = (0, _styledComponents.default)(_reactTransitionGroup.CSSTransition).withConfig({
+const StyledSignifierTransition = exports.StyledSignifierTransition = (0, _styledComponents.default)(_reactTransitionGroup.CSSTransition).withConfig({
   displayName: "Styles__StyledSignifierTransition",
   componentId: "sc-1idn4je-1"
 })(["&.c-signifier--animate-enter{opacity:0;transform:translateY(var(--signifier-in));}&.c-signifier--animate-enter-active{opacity:1;transform:translateY(0%);transition-duration:300ms;}&.c-signifier--animate-exit{transform:translateY(0%);opacity:1;}&.c-signifier--animate-exit-active{transform:translateY(var(--signifier-out));opacity:0;transition-duration:300ms;}"]);
-exports.StyledSignifierTransition = StyledSignifierTransition;
 StyledSignifierTransition.displayName = "StyledSignifierTransition";
-var StyledIcon = _styledComponents.default.svg.withConfig({
+const StyledIcon = exports.StyledIcon = _styledComponents.default.svg.withConfig({
   displayName: "Styles__StyledIcon",
   componentId: "sc-1idn4je-2"
 })(["", ""], {
@@ -39,6 +32,5 @@ var StyledIcon = _styledComponents.default.svg.withConfig({
   "fontSize": "0.75rem",
   "lineHeight": "1rem"
 });
-exports.StyledIcon = StyledIcon;
 StyledIcon.displayName = "StyledIcon";
 //# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Signifier/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["StyledSignifier","styled","div","FontStyle","BoxSizingStyle","props","$direction","css","displayName","StyledSignifierTransition","CSSTransition","StyledIcon","svg"],"sources":["../../../../src/components/Signifier/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledSignifier = styled.div<{ $direction: string }>`\n  ${tw`tw-inline-flex tw-items-center tw-text-theme-800`}\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  cursor: default;\n\n  ${(props) =>\n    props.$direction === \"c-signifier--top\" &&\n    css`\n      --signifier-in: 60%;\n      --signifier-out: -60%;\n    `}\n\n  ${(props) =>\n    props.$direction === \"c-signifier--bottom\" &&\n    css`\n      --signifier-in: -60%;\n      --signifier-out: 60%;\n    `}\n`;\nStyledSignifier.displayName = \"StyledSignifier\";\n\nexport const StyledSignifierTransition = styled(CSSTransition)`\n  &.c-signifier--animate-enter {\n    opacity: 0;\n    transform: translateY(var(--signifier-in));\n  }\n  &.c-signifier--animate-enter-active {\n    opacity: 1;\n    transform: translateY(0%);\n    transition-duration: 300ms;\n  }\n  &.c-signifier--animate-exit {\n    transform: translateY(0%);\n    opacity: 1;\n  }\n  &.c-signifier--animate-exit-active {\n    transform: translateY(var(--signifier-out));\n    opacity: 0;\n    transition-duration: 300ms;\n  }\n`;\nStyledSignifierTransition.displayName = \"StyledSignifierTransition\";\n\nexport const StyledIcon = styled.svg`\n  ${tw`tw-text-xs tw-mr-1`}\n`;\nStyledIcon.displayName = \"StyledIcon\";\n"],"mappings":";;;;;;;AAAA;AAEA;AACA;AACA;AAAyC;AAAA;AAElC,IAAMA,eAAe,GAAGC,yBAAM,CAACC,GAAG;EAAA;EAAA;AAAA,gDACnC;EAAA;EAAA;EAAA;AAAiD,CAAC,EACpDC,oBAAS,EACTC,8BAAc,EAId,UAACC,KAAK;EAAA,OACNA,KAAK,CAACC,UAAU,KAAK,kBAAkB,QACvCC,qBAAG,+CAGF;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACC,UAAU,KAAK,qBAAqB,QAC1CC,qBAAG,+CAGF;AAAA,EACJ;AAAC;AACFP,eAAe,CAACQ,WAAW,GAAG,iBAAiB;AAExC,IAAMC,yBAAyB,GAAG,IAAAR,yBAAM,EAACS,mCAAa,CAAC;EAAA;EAAA;AAAA,+WAmB7D;AAAC;AACFD,yBAAyB,CAACD,WAAW,GAAG,2BAA2B;AAE5D,IAAMG,UAAU,GAAGV,yBAAM,CAACW,GAAG;EAAA;EAAA;AAAA,aAC9B;EAAA;EAAA;EAAA;AAAmB,CAAC,CACzB;AAAC;AACFD,UAAU,CAACH,WAAW,GAAG,YAAY"}
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_reactTransitionGroup","_BoxSizingStyle","_FontStyle","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledSignifier","exports","styled","div","withConfig","displayName","componentId","FontStyle","BoxSizingStyle","props","$direction","css","StyledSignifierTransition","CSSTransition","StyledIcon","svg"],"sources":["../../../../src/components/Signifier/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledSignifier = styled.div<{ $direction: string }>`\n  ${tw`tw-inline-flex tw-items-center tw-text-theme-800`}\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  cursor: default;\n\n  ${(props) =>\n    props.$direction === \"c-signifier--top\" &&\n    css`\n      --signifier-in: 60%;\n      --signifier-out: -60%;\n    `}\n\n  ${(props) =>\n    props.$direction === \"c-signifier--bottom\" &&\n    css`\n      --signifier-in: -60%;\n      --signifier-out: 60%;\n    `}\n`;\nStyledSignifier.displayName = \"StyledSignifier\";\n\nexport const StyledSignifierTransition = styled(CSSTransition)`\n  &.c-signifier--animate-enter {\n    opacity: 0;\n    transform: translateY(var(--signifier-in));\n  }\n  &.c-signifier--animate-enter-active {\n    opacity: 1;\n    transform: translateY(0%);\n    transition-duration: 300ms;\n  }\n  &.c-signifier--animate-exit {\n    transform: translateY(0%);\n    opacity: 1;\n  }\n  &.c-signifier--animate-exit-active {\n    transform: translateY(var(--signifier-out));\n    opacity: 0;\n    transition-duration: 300ms;\n  }\n`;\nStyledSignifierTransition.displayName = \"StyledSignifierTransition\";\n\nexport const StyledIcon = styled.svg`\n  ${tw`tw-text-xs tw-mr-1`}\n`;\nStyledIcon.displayName = \"StyledIcon\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,qBAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AAAyC,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAElC,MAAMY,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gDACnC;EAAA;EAAA;EAAA;AAAiD,CAAC,EACpDC,oBAAS,EACTC,8BAAc,EAIbC,KAAK,IACNA,KAAK,CAACC,UAAU,KAAK,kBAAkB,QACvCC,qBAAG,+CAGF,EAEAF,KAAK,IACNA,KAAK,CAACC,UAAU,KAAK,qBAAqB,QAC1CC,qBAAG,+CAGF,CACJ;AACDX,eAAe,CAACK,WAAW,GAAG,iBAAiB;AAExC,MAAMO,yBAAyB,GAAAX,OAAA,CAAAW,yBAAA,GAAG,IAAAV,yBAAM,EAACW,mCAAa,CAAC,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,+WAmB7D;AACDM,yBAAyB,CAACP,WAAW,GAAG,2BAA2B;AAE5D,MAAMS,UAAU,GAAAb,OAAA,CAAAa,UAAA,GAAGZ,yBAAM,CAACa,GAAG,CAAAX,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aAC9B;EAAA;EAAA;EAAA;AAAmB,CAAC,CACzB;AACDQ,UAAU,CAACT,WAAW,GAAG,YAAY"}

package/dist/cjs/components/Signifier/index.js

@@ -9,7 +9,7 @@ Object.keys(_Signifier).forEach(function (key) {
   if (key in exports && exports[key] === _Signifier[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
-    get: function get() {
+    get: function () {
       return _Signifier[key];
     }
   });

package/dist/cjs/components/Signifier/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/Signifier/index.ts"],"sourcesContent":["export * from \"./Signifier\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"index.js","names":["_Signifier","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../src/components/Signifier/index.ts"],"sourcesContent":["export * from \"./Signifier\";\n"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/dist/cjs/components/Steppers/DateStepper/DateStepper.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -8,65 +7,43 @@ exports.DateStepper = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _moment = _interopRequireDefault(require("moment"));
-var _moment2 = _interopRequireDefault(require("react-day-picker/moment"));
 var _ArrowLeft = _interopRequireDefault(require("../../Icons/collection/ArrowLeft"));
 var _DatePicker = require("../../DatePicker");
-var _ClassNames = require("../../DatePicker/ClassNames");
 var _Styles = require("./Styles");
 var _Icons = require("../../Icons");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * This component allow you to select date range. It accepts two parameters "from" and "to" as valid format
  * onChange and onBack and onForward it will return "from: Date" and "to: Date" as function arguments
  */
-var DateStepper = function DateStepper(_ref) {
-  var step = _ref.step,
-    formatCallback = _ref.formatCallback,
-    onChange = _ref.onChange,
-    from = _ref.from,
-    to = _ref.to,
-    onBack = _ref.onBack,
-    onForward = _ref.onForward,
-    minValue = _ref.minValue,
-    maxValue = _ref.maxValue,
-    className = _ref.className,
-    _ref$period = _ref.period,
-    period = _ref$period === void 0 ? "week" : _ref$period,
-    datePickerClass = _ref.datePickerClass,
-    _ref$withDatePicker = _ref.withDatePicker,
-    withDatePicker = _ref$withDatePicker === void 0 ? true : _ref$withDatePicker,
-    _ref$defaultMonth = _ref.defaultMonth,
-    defaultMonth = _ref$defaultMonth === void 0 ? new Date() : _ref$defaultMonth,
-    popperClassName = _ref.popperClassName,
-    _ref$position = _ref.position,
-    position = _ref$position === void 0 ? "bottom" : _ref$position;
-  var _useState = (0, _react.useState)((0, _moment.default)(from)),
-    _useState2 = _slicedToArray(_useState, 2),
-    fromDate = _useState2[0],
-    setFromDate = _useState2[1];
-  var _useState3 = (0, _react.useState)((0, _moment.default)(to)),
-    _useState4 = _slicedToArray(_useState3, 2),
-    toDate = _useState4[0],
-    setToDate = _useState4[1];
-  var _useState5 = (0, _react.useState)(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    showDatePicker = _useState6[0],
-    setShowDatePicker = _useState6[1];
-  var _useState7 = (0, _react.useState)(defaultMonth),
-    _useState8 = _slicedToArray(_useState7, 2),
-    month = _useState8[0],
-    setMonth = _useState8[1];
-  var getDatesByPeriod = (0, _react.useCallback)(function (interval) {
-    var date = fromDate ? fromDate : (0, _moment.default)();
+
+const DateStepper = _ref => {
+  let {
+    step,
+    formatCallback,
+    onChange,
+    from,
+    to,
+    onBack,
+    onForward,
+    minValue,
+    maxValue,
+    className,
+    period = "week",
+    datePickerClass,
+    withDatePicker = true,
+    defaultMonth = new Date(),
+    popperClassName,
+    position = "bottom"
+  } = _ref;
+  const [fromDate, setFromDate] = (0, _react.useState)((0, _moment.default)(from));
+  const [toDate, setToDate] = (0, _react.useState)((0, _moment.default)(to));
+  const [showDatePicker, setShowDatePicker] = (0, _react.useState)(false);
+  const [month, setMonth] = (0, _react.useState)(defaultMonth);
+  const getDatesByPeriod = (0, _react.useCallback)(interval => {
+    const date = fromDate ? fromDate : (0, _moment.default)();
     if (step === "daily") {
       date.add(interval, "days");
       return [date, date.clone()];
@@ -85,12 +62,12 @@ var DateStepper = function DateStepper(_ref) {
     }
     return [date, date];
   }, [fromDate, period, step]);
-  var getDateFormatted = (0, _react.useMemo)(function () {
+  const getDateFormatted = (0, _react.useMemo)(() => {
     if (formatCallback) {
       return formatCallback(fromDate.toDate(), toDate.toDate());
     }
-    var actualYear = (0, _moment.default)().year();
-    var showWeekOrCustomDateFormat = function showWeekOrCustomDateFormat(start, end) {
+    const actualYear = (0, _moment.default)().year();
+    const showWeekOrCustomDateFormat = (start, end) => {
       if (start.year() === actualYear && end.year() === actualYear) {
         return start.format("MMM DD") + " - " + end.format("MMM DD");
       } else {
@@ -103,13 +80,13 @@ var DateStepper = function DateStepper(_ref) {
       }
       return fromDate.format("MMM DD YYYY");
     } else if (step === "weekly") {
-      var startDate = fromDate.clone().startOf(period);
-      var endDate = startDate.clone().endOf(period);
+      const startDate = fromDate.clone().startOf(period);
+      const endDate = startDate.clone().endOf(period);
       return showWeekOrCustomDateFormat(startDate, endDate);
     } else if (step === "monthly") {
       return fromDate.format("MMM YYYY");
     } else if (step === "quarterly") {
-      return "Q".concat(fromDate.quarter(), "/").concat(fromDate.format("YYYY"));
+      return `Q${fromDate.quarter()}/${fromDate.format("YYYY")}`;
     } else if (step === "yearly") {
       return fromDate.format("YYYY");
     } else if (step === "custom") {
@@ -117,33 +94,30 @@ var DateStepper = function DateStepper(_ref) {
     }
     return "";
   }, [fromDate, step, toDate, formatCallback, period]);
-  var onChangeCallback = (0, _react.useCallback)(function (amount) {
-    var _getDatesByPeriod = getDatesByPeriod(amount),
-      _getDatesByPeriod2 = _slicedToArray(_getDatesByPeriod, 2),
-      newFrom = _getDatesByPeriod2[0],
-      newTo = _getDatesByPeriod2[1];
+  const onChangeCallback = (0, _react.useCallback)(amount => {
+    const [newFrom, newTo] = getDatesByPeriod(amount);
     setFromDate((0, _moment.default)(newFrom));
     setToDate((0, _moment.default)(newTo));
     if (onChange) {
       onChange(newFrom.toDate(), newTo.toDate());
     }
   }, [onChange, getDatesByPeriod]);
-  var onDatePickerChange = (0, _react.useCallback)(function (dates) {
-    var fromDateTemp = dates === null || dates === void 0 ? void 0 : dates.from;
-    var toDateTemp = dates === null || dates === void 0 ? void 0 : dates.to;
+  const onDatePickerChange = (0, _react.useCallback)(dates => {
+    const fromDateTemp = dates?.from;
+    const toDateTemp = dates?.to;
     setFromDate((0, _moment.default)(fromDateTemp));
     setToDate((0, _moment.default)(toDateTemp));
     if (onChange && fromDateTemp instanceof Date && toDateTemp instanceof Date) {
       onChange(fromDateTemp, toDateTemp);
     }
   }, [onChange, setFromDate, setToDate]);
-  var isAfterMaxDate = (0, _react.useMemo)(function () {
+  const isAfterMaxDate = (0, _react.useMemo)(() => {
     return maxValue instanceof Date && (0, _moment.default)((0, _moment.default)(maxValue).format("YYYY-MM-DD")).isSameOrBefore(toDate.format("YYYY-MM-DD"));
   }, [maxValue, toDate]);
-  var isBeforeMinDate = (0, _react.useMemo)(function () {
+  const isBeforeMinDate = (0, _react.useMemo)(() => {
     return minValue instanceof Date && (0, _moment.default)((0, _moment.default)(minValue).format("YYYY-MM-DD")).isSameOrAfter(toDate.format("YYYY-MM-DD"));
   }, [minValue, toDate]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (isBeforeMinDate) {
       if (step === "daily") {
         setFromDate((0, _moment.default)(minValue));
@@ -157,7 +131,7 @@ var DateStepper = function DateStepper(_ref) {
       }
     }
   }, [step, minValue, maxValue, isBeforeMinDate, isAfterMaxDate]);
-  var onRightClickHandler = (0, _react.useCallback)(function () {
+  const onRightClickHandler = (0, _react.useCallback)(() => {
     if (isAfterMaxDate) {
       return;
     }
@@ -166,7 +140,7 @@ var DateStepper = function DateStepper(_ref) {
       onForward(fromDate.toDate(), toDate.toDate());
     }
   }, [isAfterMaxDate, onChangeCallback, onForward, fromDate, toDate]);
-  var onLeftClickHandler = (0, _react.useCallback)(function () {
+  const onLeftClickHandler = (0, _react.useCallback)(() => {
     if (isBeforeMinDate) {
       return;
     }
@@ -175,26 +149,26 @@ var DateStepper = function DateStepper(_ref) {
       onBack(fromDate.toDate(), toDate.toDate());
     }
   }, [isBeforeMinDate, onChangeCallback, onBack, fromDate, toDate]);
-  var renderLeftRightButtons = (0, _react.useMemo)(function () {
+  const renderLeftRightButtons = (0, _react.useMemo)(() => {
     return step !== "custom";
   }, [step]);
-  var handleShow = (0, _react.useCallback)(function () {
+  const handleShow = (0, _react.useCallback)(() => {
     setShowDatePicker(!showDatePicker);
     if (fromDate) {
       setMonth(fromDate.toDate());
     }
   }, [setShowDatePicker, showDatePicker, fromDate]);
-  var closeMenu = (0, _react.useCallback)(function () {
+  const closeMenu = (0, _react.useCallback)(() => {
     setShowDatePicker(false);
   }, []);
-  var onMonthChange = (0, _react.useCallback)(function (m) {
+  const onMonthChange = (0, _react.useCallback)(m => {
     setMonth(m);
   }, [setMonth]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     setFromDate((0, _moment.default)(from));
     setToDate((0, _moment.default)(to));
   }, [from, to]);
-  var dateStepperWidth = function dateStepperWidth(fromDay, toDay, range) {
+  const dateStepperWidth = (fromDay, toDay, range) => {
     if (fromDay.year() !== (0, _moment.default)().year() || toDay.year() !== (0, _moment.default)().year()) {
       switch (range) {
         case "daily":
@@ -224,19 +198,21 @@ var DateStepper = function DateStepper(_ref) {
       minWidth: "102px"
     };
   };
-  var isDisabled = (0, _react.useCallback)(function (day) {
-    var dayFormat = (0, _moment.default)(day).format("YYYY-MM-DD");
-    var isBefore = maxValue instanceof Date && (0, _moment.default)((0, _moment.default)(maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
-    var isAfter = minValue instanceof Date && (0, _moment.default)((0, _moment.default)(minValue).format("YYYY-MM-DD")).isAfter(dayFormat);
+  const isDisabled = (0, _react.useCallback)(day => {
+    const dayFormat = (0, _moment.default)(day).format("YYYY-MM-DD");
+    const isBefore = maxValue instanceof Date && (0, _moment.default)((0, _moment.default)(maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
+    const isAfter = minValue instanceof Date && (0, _moment.default)((0, _moment.default)(minValue).format("YYYY-MM-DD")).isAfter(dayFormat);
     return isBefore || isAfter;
   }, [maxValue, minValue]);
-  var modifiers = (0, _react.useMemo)(function () {
-    var _ref2;
-    return _ref2 = {}, _defineProperty(_ref2, _ClassNames.customClassNames.disabled, function (day) {
-      return isDisabled(day);
-    }), _defineProperty(_ref2, _ClassNames.customClassNames.nonWorkingDay, function (day) {
-      return isDisabled(day);
-    }), _ref2;
+  const modifiers = (0, _react.useMemo)(() => {
+    return {
+      day_disabled: day => {
+        return isDisabled(day);
+      },
+      nonWorkingDay: day => {
+        return isDisabled(day);
+      }
+    };
   }, [isDisabled]);
   return /*#__PURE__*/_react.default.createElement(_Styles.StyledButtonGroup, {
     className: (0, _classnames.default)("c-date-stepper", className)
@@ -260,8 +236,6 @@ var DateStepper = function DateStepper(_ref) {
     position: position
   }, /*#__PURE__*/_react.default.createElement(_DatePicker.DatePicker, {
     month: month,
-    localeUtils: _moment2.default,
-    locale: "en",
     selectionMode: step,
     className: datePickerClass,
     selectedDays: {