@activecollab/components 1.0.6 → 1.0.10

package/dist/cjs/components/Paper/Paper.js

@@ -0,0 +1,59 @@
+"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
+});
+exports.Paper = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _Styles = require("./Styles");
+
+var _excluded = ["children", "className", "type", "hover", "useOptimizedShadow"];
+
+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 _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+/**
+ * This is a component description and should sit directly above your component
+ */
+var Paper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, innerRef) {
+  var children = _ref.children,
+      className = _ref.className,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? "paper-1" : _ref$type,
+      _ref$hover = _ref.hover,
+      hover = _ref$hover === void 0 ? false : _ref$hover,
+      _ref$useOptimizedShad = _ref.useOptimizedShadow,
+      useOptimizedShadow = _ref$useOptimizedShad === void 0 ? false : _ref$useOptimizedShad,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledPaper, _extends({
+    className: (0, _classnames.default)(className, {
+      "ac-shadow--hover--lg": !useOptimizedShadow && hover && type === "paper-1",
+      "ac-shadow-optimized--lg": useOptimizedShadow && hover && type === "paper-1",
+      "ac-shadow--lg": !hover && type === "paper-1",
+      "ac-shadow--hover--sm": !useOptimizedShadow && hover && type === "paper-2" || !useOptimizedShadow && hover && type === "paper-3",
+      "ac-shadow-optimized--sm": useOptimizedShadow && hover && type === "paper-2" || useOptimizedShadow && hover && type === "paper-3",
+      "ac-shadow--sm": !hover && type === "paper-2" || !hover && type === "paper-3"
+    }),
+    ref: innerRef,
+    type: type
+  }, rest), children);
+});
+exports.Paper = Paper;
+Paper.displayName = "Paper";
+//# sourceMappingURL=Paper.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Paper/Paper.tsx"],"names":["Paper","innerRef","children","className","type","hover","useOptimizedShadow","rest","displayName"],"mappings":";;;;;;;;;AAAA;;AAOA;;AACA;;;;;;;;;;;;;;;;AAmBA;AACA;AACA;AACO,IAAMA,KAAK,gBAAG,uBACnB,gBASEC,QATF,EAUK;AAAA,MARDC,QAQC,QARDA,QAQC;AAAA,MAPDC,SAOC,QAPDA,SAOC;AAAA,uBANDC,IAMC;AAAA,MANDA,IAMC,0BANM,SAMN;AAAA,wBALDC,KAKC;AAAA,MALDA,KAKC,2BALO,KAKP;AAAA,mCAJDC,kBAIC;AAAA,MAJDA,kBAIC,sCAJoB,KAIpB;AAAA,MAHEC,IAGF;;AACH,sBACE,6BAAC,mBAAD;AACE,IAAA,SAAS,EAAE,yBAAWJ,SAAX,EAAsB;AAC/B,8BACE,CAACG,kBAAD,IAAuBD,KAAvB,IAAgCD,IAAI,KAAK,SAFZ;AAG/B,iCACEE,kBAAkB,IAAID,KAAtB,IAA+BD,IAAI,KAAK,SAJX;AAK/B,uBAAiB,CAACC,KAAD,IAAUD,IAAI,KAAK,SALL;AAM/B,8BACG,CAACE,kBAAD,IAAuBD,KAAvB,IAAgCD,IAAI,KAAK,SAA1C,IACC,CAACE,kBAAD,IAAuBD,KAAvB,IAAgCD,IAAI,KAAK,SARb;AAS/B,iCACGE,kBAAkB,IAAID,KAAtB,IAA+BD,IAAI,KAAK,SAAzC,IACCE,kBAAkB,IAAID,KAAtB,IAA+BD,IAAI,KAAK,SAXZ;AAY/B,uBACG,CAACC,KAAD,IAAUD,IAAI,KAAK,SAApB,IAAmC,CAACC,KAAD,IAAUD,IAAI,KAAK;AAbzB,KAAtB,CADb;AAgBE,IAAA,GAAG,EAAEH,QAhBP;AAiBE,IAAA,IAAI,EAAEG;AAjBR,KAkBMG,IAlBN,GAoBGL,QApBH,CADF;AAwBD,CApCkB,CAAd;;AAuCPF,KAAK,CAACQ,WAAN,GAAoB,OAApB","sourcesContent":["import React, {\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  Ref,\n  RefObject,\n} from \"react\";\nimport classNames from \"classnames\";\nimport { StyledPaper } from \"./Styles\";\n\nexport interface IPaperProps {\n  /** Children type of node or string */\n  children: ReactNode;\n  /** CSS classes */\n  className?: string;\n  /** Ref object. */\n  innerRef?: RefObject<HTMLDivElement>;\n  /** Define custom style */\n  style?: object;\n  /** Type of paper to be used */\n  type?: \"paper-1\" | \"paper-2\" | \"paper-3\";\n  /** Paper has hover or not */\n  hover?: boolean;\n  /** Use optimized shadow */\n  useOptimizedShadow?: boolean;\n}\n\n/**\n * This is a component description and should sit directly above your component\n */\nexport const Paper = forwardRef(\n  (\n    {\n      children,\n      className,\n      type = \"paper-1\",\n      hover = false,\n      useOptimizedShadow = false,\n      ...rest\n    }: HTMLAttributes<HTMLDivElement> & IPaperProps,\n    innerRef: Ref<HTMLDivElement> | null | undefined\n  ) => {\n    return (\n      <StyledPaper\n        className={classNames(className, {\n          \"ac-shadow--hover--lg\":\n            !useOptimizedShadow && hover && type === \"paper-1\",\n          \"ac-shadow-optimized--lg\":\n            useOptimizedShadow && hover && type === \"paper-1\",\n          \"ac-shadow--lg\": !hover && type === \"paper-1\",\n          \"ac-shadow--hover--sm\":\n            (!useOptimizedShadow && hover && type === \"paper-2\") ||\n            (!useOptimizedShadow && hover && type === \"paper-3\"),\n          \"ac-shadow-optimized--sm\":\n            (useOptimizedShadow && hover && type === \"paper-2\") ||\n            (useOptimizedShadow && hover && type === \"paper-3\"),\n          \"ac-shadow--sm\":\n            (!hover && type === \"paper-2\") || (!hover && type === \"paper-3\"),\n        })}\n        ref={innerRef}\n        type={type}\n        {...rest}\n      >\n        {children}\n      </StyledPaper>\n    );\n  }\n);\n\nPaper.displayName = \"Paper\";\n"],"file":"Paper.js"}

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

@@ -0,0 +1,31 @@
+"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
+});
+exports.StyledPaper = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+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 StyledPaper = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledPaper",
+  componentId: "sc-1ld1e2o-0"
+})(["", " border-radius:var(--ac-br-8);", " ", " ", ""], {
+  "backgroundColor": "var(--page-paper-main)"
+}, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, function (props) {
+  return props.type === "paper-3" && (0, _styledComponents.css)(["border:solid 1px var(--border-primary);"]);
+});
+
+exports.StyledPaper = StyledPaper;
+StyledPaper.displayName = "StyledPaper";
+//# sourceMappingURL=Styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Paper/Styles.ts"],"names":["StyledPaper","styled","div","FontStyle","BoxSizingStyle","props","type","css","displayName"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;;;;;AAGO,IAAMA,WAAW,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,yDAClB;AAAA;AAAA,CADkB,EAIpBC,oBAJoB,EAKpBC,8BALoB,EAOpB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,IAAN,KAAe,SAAf,QACAC,qBADA,8CADA;AAAA,CAPoB,CAAjB;;;AAcPP,WAAW,CAACQ,WAAZ,GAA0B,aAA1B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { IPaperProps } from \"./Paper\";\n\nexport const StyledPaper = styled.div<IPaperProps>`\n  ${tw`tw-bg-page-paper-main`}\n  border-radius: var(--ac-br-8);\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${(props) =>\n    props.type === \"paper-3\" &&\n    css`\n      border: solid 1px var(--border-primary);\n    `}\n`;\n\nStyledPaper.displayName = \"StyledPaper\";\n"],"file":"Styles.js"}

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

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Paper = require("./Paper");
+
+Object.keys(_Paper).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Paper[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Paper[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Paper/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./Paper\";\n"],"file":"index.js"}

package/dist/cjs/components/Pickers/NavBarElement.js

@@ -0,0 +1,61 @@
+"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
+});
+exports.NavBarElement = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _MenuNavIcon = _interopRequireDefault(require("../Icons/collection/MenuNavIcon"));
+
+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; }
+
+var NavBarElement = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var onPreviousClick = _ref.onPreviousClick,
+      onNextClick = _ref.onNextClick;
+  var onPrevious = (0, _react.useCallback)(function () {
+    onPreviousClick();
+  }, [onPreviousClick]);
+  var onNext = (0, _react.useCallback)(function () {
+    onNextClick();
+  }, [onNextClick]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "c-DayPicker-NavBar",
+    ref: ref,
+    tabIndex: 0
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledNavBarButton, {
+    type: "button",
+    variant: "text gray",
+    size: "small",
+    tabIndex: 0,
+    onClick: onPrevious,
+    $direction: "previous"
+  }, /*#__PURE__*/_react.default.createElement(_MenuNavIcon.default, {
+    "aria-label": "Previous Month",
+    width: "24",
+    height: "24"
+  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledNavBarButton, {
+    type: "button",
+    variant: "text gray",
+    size: "small",
+    tabIndex: 0,
+    onClick: onNext,
+    $direction: "next"
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledMenuNavIcon, {
+    "aria-label": "Next Month",
+    width: "24",
+    height: "24"
+  })));
+});
+exports.NavBarElement = NavBarElement;
+NavBarElement.displayName = "NavBarElement";
+//# sourceMappingURL=NavBarElement.js.map

package/dist/cjs/components/Pickers/NavBarElement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Pickers/NavBarElement.tsx"],"names":["NavBarElement","ref","onPreviousClick","onNextClick","onPrevious","onNext","displayName"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;;;;;;;AAMO,IAAMA,aAAa,gBAAG,uBAG3B,gBAAmCC,GAAnC,EAA2C;AAAA,MAAxCC,eAAwC,QAAxCA,eAAwC;AAAA,MAAvBC,WAAuB,QAAvBA,WAAuB;AAC3C,MAAMC,UAAU,GAAG,wBAAY,YAAM;AACnCF,IAAAA,eAAe;AAChB,GAFkB,EAEhB,CAACA,eAAD,CAFgB,CAAnB;AAIA,MAAMG,MAAM,GAAG,wBAAY,YAAM;AAC/BF,IAAAA,WAAW;AACZ,GAFc,EAEZ,CAACA,WAAD,CAFY,CAAf;AAIA,sBACE;AAAK,IAAA,SAAS,EAAC,oBAAf;AAAoC,IAAA,GAAG,EAAEF,GAAzC;AAA8C,IAAA,QAAQ,EAAE;AAAxD,kBACE,6BAAC,0BAAD;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,IAAI,EAAC,OAHP;AAIE,IAAA,QAAQ,EAAE,CAJZ;AAKE,IAAA,OAAO,EAAEG,UALX;AAME,IAAA,UAAU,EAAC;AANb,kBAQE,6BAAC,oBAAD;AAAa,kBAAW,gBAAxB;AAAyC,IAAA,KAAK,EAAC,IAA/C;AAAoD,IAAA,MAAM,EAAC;AAA3D,IARF,CADF,eAWE,6BAAC,0BAAD;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,IAAI,EAAC,OAHP;AAIE,IAAA,QAAQ,EAAE,CAJZ;AAKE,IAAA,OAAO,EAAEC,MALX;AAME,IAAA,UAAU,EAAC;AANb,kBAQE,6BAAC,yBAAD;AAAmB,kBAAW,YAA9B;AAA2C,IAAA,KAAK,EAAC,IAAjD;AAAsD,IAAA,MAAM,EAAC;AAA7D,IARF,CAXF,CADF;AAwBD,CApC4B,CAAtB;;AAsCPL,aAAa,CAACM,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { MouseEvent, forwardRef, useCallback } from \"react\";\nimport { NavbarElementProps } from \"react-day-picker\";\nimport MenuNavIcon from \"../Icons/collection/MenuNavIcon\";\nimport { StyledMenuNavIcon, StyledNavBarButton } from \"./Styles\";\n\ninterface INavBarElementProps {\n  onClick?: (e: MouseEvent) => void;\n}\n\nexport const NavBarElement = forwardRef<\n  HTMLDivElement,\n  NavbarElementProps & INavBarElementProps\n>(({ onPreviousClick, onNextClick }, ref) => {\n  const onPrevious = useCallback(() => {\n    onPreviousClick();\n  }, [onPreviousClick]);\n\n  const onNext = useCallback(() => {\n    onNextClick();\n  }, [onNextClick]);\n\n  return (\n    <div className=\"c-DayPicker-NavBar\" ref={ref} tabIndex={0}>\n      <StyledNavBarButton\n        type=\"button\"\n        variant=\"text gray\"\n        size=\"small\"\n        tabIndex={0}\n        onClick={onPrevious}\n        $direction=\"previous\"\n      >\n        <MenuNavIcon aria-label=\"Previous Month\" width=\"24\" height=\"24\" />\n      </StyledNavBarButton>\n      <StyledNavBarButton\n        type=\"button\"\n        variant=\"text gray\"\n        size=\"small\"\n        tabIndex={0}\n        onClick={onNext}\n        $direction=\"next\"\n      >\n        <StyledMenuNavIcon aria-label=\"Next Month\" width=\"24\" height=\"24\" />\n      </StyledNavBarButton>\n    </div>\n  );\n});\n\nNavBarElement.displayName = \"NavBarElement\";\n"],"file":"NavBarElement.js"}

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

@@ -0,0 +1,109 @@
+"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
+});
+exports.StyledYearMonthPickerNavBarItem = exports.StyledYearMonthPickerNavBar = exports.StyledYearMonthPicker = exports.StyledNavBarButton = exports.StyledMonths = exports.StyledMonth = exports.StyledMenuNavIcon = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _Button = require("../Button/Button");
+
+var _MenuNavIcon = _interopRequireDefault(require("../Icons/collection/MenuNavIcon"));
+
+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; }
+
+var StyledNavBarButton = (0, _styledComponents.default)(_Button.Button).withConfig({
+  displayName: "Styles__StyledNavBarButton",
+  componentId: "sc-1owijsg-0"
+})(["position:absolute;margin-top:1px;cursor:pointer;z-index:2;background-image:none;", " ", ""], function (props) {
+  return props.$direction === "previous" && (0, _styledComponents.css)(["right:auto;left:1px;"]);
+}, function (props) {
+  return props.$direction === "next" && (0, _styledComponents.css)(["right:1px;"]);
+});
+exports.StyledNavBarButton = StyledNavBarButton;
+var StyledMenuNavIcon = (0, _styledComponents.default)(_MenuNavIcon.default).withConfig({
+  displayName: "Styles__StyledMenuNavIcon",
+  componentId: "sc-1owijsg-1"
+})(["", " transform:rotate(180deg);"], {
+  "transform": "var(--tw-transform)"
+});
+exports.StyledMenuNavIcon = StyledMenuNavIcon;
+
+var StyledMonths = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledMonths",
+  componentId: "sc-1owijsg-2"
+})(["top:30px;height:230px;", ""], {
+  "position": "absolute",
+  "left": "0px",
+  "padding": "1.25rem",
+  "display": "flex",
+  "flexWrap": "wrap",
+  "backgroundColor": "var(--page-paper-main)",
+  "zIndex": "10"
+});
+
+exports.StyledMonths = StyledMonths;
+
+var StyledMonth = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledMonth",
+  componentId: "sc-1owijsg-3"
+})(["width:26%;transition-duration:0.3s;", " ", " ", " ", ""], {
+  "margin": "auto",
+  "cursor": "pointer",
+  "borderRadius": "1rem",
+  "fontWeight": "700",
+  "fontSize": "0.875rem",
+  "lineHeight": "1.25rem"
+}, function (props) {
+  return !props.$isSelected ? (0, _styledComponents.css)(["&:hover{background-color:var(--color-primary-300);}"]) : (0, _styledComponents.css)(["", " background-color:var(--color-primary);"], {
+    "color": "var(--color-theme-100)"
+  });
+}, function (props) {
+  return props.$isCurrent && (0, _styledComponents.css)(["", ""], {
+    "color": "var(--color-primary)"
+  });
+}, function (props) {
+  return props.$isCurrentQuarter && (0, _styledComponents.css)(["background-color:var(--color-primary-300);"]);
+});
+
+exports.StyledMonth = StyledMonth;
+
+var StyledYearMonthPicker = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledYearMonthPicker",
+  componentId: "sc-1owijsg-4"
+})(["display:table-caption;margin-bottom:0.5em;padding:0 0.5em;", " &> div{font-weight:500;font-size:1.15em;}"], {
+  "textAlign": "center",
+  "color": "var(--color-theme-900)"
+});
+
+exports.StyledYearMonthPicker = StyledYearMonthPicker;
+
+var StyledYearMonthPickerNavBar = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledYearMonthPickerNavBar",
+  componentId: "sc-1owijsg-5"
+})(["width:auto;margin:0 auto;"]);
+
+exports.StyledYearMonthPickerNavBar = StyledYearMonthPickerNavBar;
+
+var StyledYearMonthPickerNavBarItem = _styledComponents.default.span.withConfig({
+  displayName: "Styles__StyledYearMonthPickerNavBarItem",
+  componentId: "sc-1owijsg-6"
+})(["", " transition-duration:0.3s;&:hover{background-color:var(--color-primary-300);border-radius:15px;}"], {
+  "paddingLeft": "1rem",
+  "paddingRight": "1rem",
+  "cursor": "pointer"
+});
+
+exports.StyledYearMonthPickerNavBarItem = StyledYearMonthPickerNavBarItem;
+StyledNavBarButton.displayName = "StyledNavBarButton";
+StyledMenuNavIcon.displayName = "StyledMenuNavIcon";
+StyledMonths.displayName = "StyledMonths";
+StyledMonth.displayName = "StyledMonth";
+//# sourceMappingURL=Styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Pickers/Styles.ts"],"names":["StyledNavBarButton","Button","props","$direction","css","StyledMenuNavIcon","MenuNavIcon","StyledMonths","styled","div","StyledMonth","$isSelected","$isCurrent","$isCurrentQuarter","StyledYearMonthPicker","StyledYearMonthPickerNavBar","StyledYearMonthPickerNavBarItem","span","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;;;;;;;AAEO,IAAMA,kBAAkB,GAAG,+BAAOC,cAAP,CAAH;AAAA;AAAA;AAAA,kGAS3B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,UAArB,QACAC,qBADA,2BADA;AAAA,CAT2B,EAgB3B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,MAArB,QACAC,qBADA,iBADA;AAAA,CAhB2B,CAAxB;;AAuBA,IAAMC,iBAAiB,GAAG,+BAAOC,oBAAP,CAAH;AAAA;AAAA;AAAA,uCACxB;AAAA;AAAA,CADwB,CAAvB;;;AAWA,IAAMC,YAAY,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,mCAInB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAJmB,CAAlB;;;;AAcA,IAAMC,WAAW,GAAGF,0BAAOC,GAAV;AAAA;AAAA;AAAA,+DAIlB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAJkB,EAYpB,UAACP,KAAD;AAAA,SACA,CAACA,KAAK,CAACS,WAAP,OACIP,qBADJ,iEAMIA,qBANJ,mDAOU;AAAA;AAAA,GAPV,CADA;AAAA,CAZoB,EAwBnB,UAACF,KAAD;AAAA,SACDA,KAAK,CAACU,UAAN,QACAR,qBADA,YAEM;AAAA;AAAA,GAFN,CADC;AAAA,CAxBmB,EA8BnB,UAACF,KAAD;AAAA,SACDA,KAAK,CAACW,iBAAN,QACAT,qBADA,iDADC;AAAA,CA9BmB,CAAjB;;;;AAqCA,IAAMU,qBAAqB,GAAGN,0BAAOC,GAAV;AAAA;AAAA;AAAA,iHAK5B;AAAA;AAAA;AAAA,CAL4B,CAA3B;;;;AAaA,IAAMM,2BAA2B,GAAGP,0BAAOC,GAAV;AAAA;AAAA;AAAA,iCAAjC;;;;AAKA,IAAMO,+BAA+B,GAAGR,0BAAOS,IAAV;AAAA;AAAA;AAAA,6GACtC;AAAA;AAAA;AAAA;AAAA,CADsC,CAArC;;;AAUPjB,kBAAkB,CAACkB,WAAnB,GAAiC,oBAAjC;AACAb,iBAAiB,CAACa,WAAlB,GAAgC,mBAAhC;AACAX,YAAY,CAACW,WAAb,GAA2B,cAA3B;AACAR,WAAW,CAACQ,WAAZ,GAA0B,aAA1B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Button } from \"../Button/Button\";\nimport tw from \"twin.macro\";\nimport MenuNavIcon from \"../Icons/collection/MenuNavIcon\";\n\nexport const StyledNavBarButton = styled(Button)<{\n  $direction: \"next\" | \"previous\";\n}>`\n  position: absolute;\n  margin-top: 1px;\n  cursor: pointer;\n  z-index: 2;\n  background-image: none;\n\n  ${(props) =>\n    props.$direction === \"previous\" &&\n    css`\n      right: auto;\n      left: 1px;\n    `}\n\n  ${(props) =>\n    props.$direction === \"next\" &&\n    css`\n      right: 1px;\n    `}\n`;\n\nexport const StyledMenuNavIcon = styled(MenuNavIcon)`\n  ${tw`tw-transform`}\n  transform: rotate(180deg);\n`;\n\ninterface StyledMonthInterface {\n  $isCurrent: boolean;\n  $isSelected: boolean;\n  $isCurrentQuarter: boolean;\n}\n\nexport const StyledMonths = styled.div`\n  top: 30px;\n  height: 230px;\n\n  ${tw`\n    tw-absolute\n    tw-left-0\n    tw-p-5\n    tw-flex\n    tw-flex-wrap\n    tw-bg-page-paper-main\n    tw-z-10\n  `}\n`;\nexport const StyledMonth = styled.div<StyledMonthInterface>`\n  width: 26%;\n  transition-duration: 0.3s;\n\n  ${tw`\n    tw-m-auto\n    tw-cursor-pointer\n    tw-rounded-xl\n    tw-font-bold\n    tw-text-sm\n  `}\n\n  ${(props) =>\n    !props.$isSelected\n      ? css`\n          &:hover {\n            background-color: var(--color-primary-300);\n          }\n        `\n      : css`\n          ${tw`tw-text-theme-100`}\n          background-color: var(--color-primary);\n        `}\n\n   ${(props) =>\n    props.$isCurrent &&\n    css`\n      ${tw`tw-text-primary`}\n    `}\n\n   ${(props) =>\n    props.$isCurrentQuarter &&\n    css`\n      background-color: var(--color-primary-300);\n    `}\n`;\n\nexport const StyledYearMonthPicker = styled.div`\n  display: table-caption;\n  margin-bottom: 0.5em;\n  padding: 0 0.5em;\n\n  ${tw`tw-text-center tw-text-theme-900`}\n\n  &> div {\n    font-weight: 500;\n    font-size: 1.15em;\n  }\n`;\n\nexport const StyledYearMonthPickerNavBar = styled.div`\n  width: auto;\n  margin: 0 auto;\n`;\n\nexport const StyledYearMonthPickerNavBarItem = styled.span`\n  ${tw`tw-px-4 tw-cursor-pointer`}\n  transition-duration: 0.3s;\n\n  &:hover {\n    background-color: var(--color-primary-300);\n    border-radius: 15px;\n  }\n`;\n\nStyledNavBarButton.displayName = \"StyledNavBarButton\";\nStyledMenuNavIcon.displayName = \"StyledMenuNavIcon\";\nStyledMonths.displayName = \"StyledMonths\";\nStyledMonth.displayName = \"StyledMonth\";\n"],"file":"Styles.js"}

package/dist/cjs/components/Pickers/YearMonthPicker.js

@@ -0,0 +1,93 @@
+"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
+});
+exports.YearMonthPicker = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Styles = require("./Styles");
+
+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 YearMonthPicker = function YearMonthPicker(_ref) {
+  var date = _ref.date,
+      localeUtils = _ref.localeUtils,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {
+    return null;
+  } : _ref$onChange,
+      _ref$isShown = _ref.isShown,
+      isShown = _ref$isShown === void 0 ? true : _ref$isShown,
+      onClick = _ref.onClick,
+      text = _ref.text,
+      selectedDays = _ref.selectedDays,
+      selectionMode = _ref.selectionMode;
+
+  var _useState = (0, _react.useState)(),
+      _useState2 = _slicedToArray(_useState, 2),
+      enteredTo = _useState2[0],
+      setEnteredTo = _useState2[1];
+
+  var months = localeUtils.getMonths();
+  var handleMonthChange = (0, _react.useCallback)(function (e) {
+    onChange(new Date(date.getFullYear(), e.target.dataset.value));
+
+    if (onClick) {
+      onClick(e);
+    }
+  }, [date, onChange, onClick]);
+  var onMouseEnterCallback = (0, _react.useCallback)(function (e) {
+    if (selectionMode === "quarterly") {
+      setEnteredTo(Math.floor(e.target.getAttribute("data-value") / 3));
+    }
+  }, [selectionMode]);
+  var renderMonths = (0, _react.useMemo)(function () {
+    return /*#__PURE__*/_react.default.createElement(_Styles.StyledMonths, {
+      className: "c-monthPicker",
+      "data-test": "months"
+    }, months.map(function (month, i) {
+      return /*#__PURE__*/_react.default.createElement(_Styles.StyledMonth, {
+        className: "c-monthPicker__month",
+        key: i,
+        onClick: handleMonthChange,
+        onMouseEnter: onMouseEnterCallback,
+        "data-value": i,
+        "data-test": "month",
+        $isCurrent: date.getFullYear() === new Date().getFullYear() && new Date().getMonth() === i,
+        $isCurrentQuarter: Math.floor(i / 3) === enteredTo,
+        $isSelected: selectedDays && !(selectedDays instanceof Date) && selectedDays.from && selectedDays.to && selectedDays.from.getFullYear() === date.getFullYear() && i >= selectedDays.from.getMonth() && i <= selectedDays.to.getMonth()
+      }, month.substring(0, 3));
+    }));
+  }, [date, handleMonthChange, months, selectedDays, enteredTo, onMouseEnterCallback]);
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledYearMonthPicker, {
+    className: "c-DayPicker-Caption",
+    role: "button"
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledYearMonthPickerNavBar, {
+    role: "button"
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledYearMonthPickerNavBarItem, {
+    "data-test": "show-picker",
+    onClick: onClick
+  }, text)), isShown && renderMonths);
+};
+
+exports.YearMonthPicker = YearMonthPicker;
+YearMonthPicker.displayName = "YearMonthPicker";
+//# sourceMappingURL=YearMonthPicker.js.map

package/dist/cjs/components/Pickers/YearMonthPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Pickers/YearMonthPicker.tsx"],"names":["YearMonthPicker","date","localeUtils","onChange","isShown","onClick","text","selectedDays","selectionMode","enteredTo","setEnteredTo","months","getMonths","handleMonthChange","e","Date","getFullYear","target","dataset","value","onMouseEnterCallback","Math","floor","getAttribute","renderMonths","map","month","i","getMonth","from","to","substring","displayName"],"mappings":"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","sourcesContent":["import React, { FC, useCallback, useMemo, useState } from \"react\";\nimport { CaptionElementProps } from \"react-day-picker\";\nimport {\n  StyledMonth,\n  StyledMonths,\n  StyledYearMonthPicker,\n  StyledYearMonthPickerNavBar,\n  StyledYearMonthPickerNavBarItem,\n} from \"./Styles\";\n\ninterface IYearMonthForm {\n  onChange?: (modifiersArg) => void;\n  isShown?: boolean;\n  text: string;\n  selectedDays?: { from; to } | Date;\n  selectionMode?: string;\n}\n\nexport const YearMonthPicker: FC<CaptionElementProps & IYearMonthForm> = ({\n  date,\n  localeUtils,\n  onChange = (): null => null,\n  isShown = true,\n  onClick,\n  text,\n  selectedDays,\n  selectionMode,\n}) => {\n  const [enteredTo, setEnteredTo] = useState<number | undefined>();\n  const months = localeUtils.getMonths();\n\n  const handleMonthChange = useCallback(\n    (e) => {\n      onChange(new Date(date.getFullYear(), e.target.dataset.value));\n      if (onClick) {\n        onClick(e);\n      }\n    },\n    [date, onChange, onClick]\n  );\n\n  const onMouseEnterCallback = useCallback(\n    (e) => {\n      if (selectionMode === \"quarterly\") {\n        setEnteredTo(Math.floor(e.target.getAttribute(\"data-value\") / 3));\n      }\n    },\n    [selectionMode]\n  );\n\n  const renderMonths = useMemo(() => {\n    return (\n      <StyledMonths className=\"c-monthPicker\" data-test=\"months\">\n        {months.map((month, i) => {\n          return (\n            <StyledMonth\n              className=\"c-monthPicker__month\"\n              key={i}\n              onClick={handleMonthChange}\n              onMouseEnter={onMouseEnterCallback}\n              data-value={i}\n              data-test=\"month\"\n              $isCurrent={\n                date.getFullYear() === new Date().getFullYear() &&\n                new Date().getMonth() === i\n              }\n              $isCurrentQuarter={Math.floor(i / 3) === enteredTo}\n              $isSelected={\n                selectedDays &&\n                !(selectedDays instanceof Date) &&\n                selectedDays.from &&\n                selectedDays.to &&\n                selectedDays.from.getFullYear() === date.getFullYear() &&\n                i >= selectedDays.from.getMonth() &&\n                i <= selectedDays.to.getMonth()\n              }\n            >\n              {month.substring(0, 3)}\n            </StyledMonth>\n          );\n        })}\n      </StyledMonths>\n    );\n  }, [\n    date,\n    handleMonthChange,\n    months,\n    selectedDays,\n    enteredTo,\n    onMouseEnterCallback,\n  ]);\n\n  return (\n    <StyledYearMonthPicker className=\"c-DayPicker-Caption\" role=\"button\">\n      <StyledYearMonthPickerNavBar role=\"button\">\n        <StyledYearMonthPickerNavBarItem\n          data-test=\"show-picker\"\n          onClick={onClick}\n        >\n          {text}\n        </StyledYearMonthPickerNavBarItem>\n      </StyledYearMonthPickerNavBar>\n      {isShown && renderMonths}\n    </StyledYearMonthPicker>\n  );\n};\n\nYearMonthPicker.displayName = \"YearMonthPicker\";\n"],"file":"YearMonthPicker.js"}

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

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _YearMonthPicker = require("./YearMonthPicker");
+
+Object.keys(_YearMonthPicker).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _YearMonthPicker[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _YearMonthPicker[key];
+    }
+  });
+});
+
+var _NavBarElement = require("./NavBarElement");
+
+Object.keys(_NavBarElement).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _NavBarElement[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _NavBarElement[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Pickers/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./YearMonthPicker\";\nexport * from \"./NavBarElement\";\n"],"file":"index.js"}

package/dist/cjs/components/Popper/Placement.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=Placement.js.map

package/dist/cjs/components/Popper/Placement.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"Placement.js"}