@activecollab/components 0.1.534 → 1.0.1

package/dist/esm/components/Loaders/Linear/LinearLoader.js

@@ -0,0 +1,25 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { StyledLinearLoader } from './Styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+var _excluded = ["className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var LinearLoader = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsx(StyledLinearLoader, _objectSpread({
+    ref: ref,
+    className: classnames("c-loader c-loader--linear", className)
+  }, rest));
+});
+LinearLoader.displayName = "LinearLoader";
+
+export { LinearLoader };
+//# sourceMappingURL=LinearLoader.js.map

package/dist/esm/components/Loaders/Linear/LinearLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinearLoader.js","sources":["../../../../../src/components/Loaders/Linear/LinearLoader.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledLinearLoader } from \"./Styles\";\n\nexport const LinearLoader = forwardRef<\n  HTMLDivElement,\n  React.ComponentPropsWithoutRef<\"div\">\n>(({ className, ...rest }, ref) => {\n  return (\n    <StyledLinearLoader\n      ref={ref}\n      className={classNames(\"c-loader c-loader--linear\", className)}\n      {...rest}\n    />\n  );\n});\n\nLinearLoader.displayName = \"LinearLoader\";\n"],"names":["LinearLoader","forwardRef","ref","className","rest","_jsx","classNames","displayName"],"mappings":";;;;;;;;;;;;IAIaA,YAAY,gBAAGC,UAAU,CAGpC,gBAAyBC,GAAzB,EAAiC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;;AACjC,sBACEC,IAAC,kBAAD;AACE,IAAA,GAAG,EAAEH,GADP;AAEE,IAAA,SAAS,EAAEI,UAAU,CAAC,2BAAD,EAA8BH,SAA9B;AAFvB,KAGMC,IAHN,EADF;AAOD,CAXqC;AAatCJ,YAAY,CAACO,WAAb,GAA2B,cAA3B;;;;"}

package/dist/esm/components/Loaders/Linear/Styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledLinearLoader: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Loaders/Linear/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Loaders/Linear/Styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,kBAAkB,oEAyB9B,CAAC"}

package/dist/esm/components/Loaders/Linear/Styles.js

@@ -0,0 +1,10 @@
+import styled, { keyframes } from 'styled-components';
+
+var linearAnimation = keyframes(["0%{background-position:left;}100%{background-position:right;}"]);
+var StyledLinearLoader = styled.div.withConfig({
+  displayName: "Styles__StyledLinearLoader",
+  componentId: "sc-x4ge7a-0"
+})(["width:70%;background:linear-gradient( 90deg,rgba(255,255,255,0) 20%,rgba(0,0,0,0.05) 50%,rgba(255,255,255,0) 60% );background-size:400%;height:16px;border-radius:8px;.neon &{background:linear-gradient( 90deg,rgba(255,255,255,0) 20%,rgba(0,0,0,0.2) 50%,rgba(255,255,255,0) 60% );background-size:500%;}animation-duration:1s;animation-iteration-count:infinite;animation-name:", ";animation-timing-function:linear;animation-direction:reverse;"], linearAnimation);
+
+export { StyledLinearLoader };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Loaders/Linear/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../../src/components/Loaders/Linear/Styles.ts"],"sourcesContent":["import styled, { keyframes } from \"styled-components\";\n\nconst linearAnimation = keyframes`\n  0% {\n    background-position: left;\n  }\n  100% {\n    background-position: right;\n  }\n`;\n\nexport const StyledLinearLoader = styled.div`\n  width: 70%;\n  background: linear-gradient(\n    90deg,\n    rgba(255, 255, 255, 0) 20%,\n    rgba(0, 0, 0, 0.05) 50%,\n    rgba(255, 255, 255, 0) 60%\n  );\n  background-size: 400%;\n  height: 16px;\n  border-radius: 8px;\n  .neon & {\n    background: linear-gradient(\n      90deg,\n      rgba(255, 255, 255, 0) 20%,\n      rgba(0, 0, 0, 0.2) 50%,\n      rgba(255, 255, 255, 0) 60%\n    );\n    background-size: 500%;\n  }\n  animation-duration: 1s;\n  animation-iteration-count: infinite;\n  animation-name: ${linearAnimation};\n  animation-timing-function: linear;\n  animation-direction: reverse;\n`;\n"],"names":["linearAnimation","keyframes","StyledLinearLoader","styled","div"],"mappings":";;AAEA,IAAMA,eAAe,GAAGC,SAAH,mEAArB;IASaC,kBAAkB,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,+bAsBXJ,eAtBW;;;;"}

package/dist/esm/components/Loaders/Linear/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./LinearLoader";
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/Loaders/Linear/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Loaders/Linear/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/esm/components/Loaders/Spinner/SpinnerLoader.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare const SpinnerLoader: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=SpinnerLoader.d.ts.map

package/dist/esm/components/Loaders/Spinner/SpinnerLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpinnerLoader.d.ts","sourceRoot":"","sources":["../../../../../src/components/Loaders/Spinner/SpinnerLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,eAAO,MAAM,aAAa,gNAsBxB,CAAC"}

package/dist/esm/components/Loaders/Spinner/SpinnerLoader.js

@@ -0,0 +1,37 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { StyledSpinnerLoader } from './Styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+var _excluded = ["className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var SpinnerLoader = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsx(StyledSpinnerLoader, _objectSpread(_objectSpread({
+    ref: ref,
+    className: classnames("c-loader c-loader--spinner", className)
+  }, rest), {}, {
+    children: /*#__PURE__*/jsx("svg", {
+      viewBox: "25 25 50 50",
+      children: /*#__PURE__*/jsx("circle", {
+        cx: "50",
+        cy: "50",
+        r: "20",
+        fill: "none",
+        strokeWidth: "4",
+        strokeMiterlimit: "10"
+      })
+    })
+  }));
+});
+SpinnerLoader.displayName = "SpinnerLoader";
+
+export { SpinnerLoader };
+//# sourceMappingURL=SpinnerLoader.js.map

package/dist/esm/components/Loaders/Spinner/SpinnerLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpinnerLoader.js","sources":["../../../../../src/components/Loaders/Spinner/SpinnerLoader.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledSpinnerLoader } from \"./Styles\";\n\nexport const SpinnerLoader = forwardRef<\n  HTMLDivElement,\n  React.ComponentPropsWithoutRef<\"div\">\n>(({ className, ...rest }, ref) => {\n  return (\n    <StyledSpinnerLoader\n      ref={ref}\n      className={classNames(\"c-loader c-loader--spinner\", className)}\n      {...rest}\n    >\n      <svg viewBox=\"25 25 50 50\">\n        <circle\n          cx=\"50\"\n          cy=\"50\"\n          r=\"20\"\n          fill=\"none\"\n          strokeWidth=\"4\"\n          strokeMiterlimit=\"10\"\n        />\n      </svg>\n    </StyledSpinnerLoader>\n  );\n});\n\nSpinnerLoader.displayName = \"SpinnerLoader\";\n"],"names":["SpinnerLoader","forwardRef","ref","className","rest","_jsx","classNames","displayName"],"mappings":";;;;;;;;;;;;IAIaA,aAAa,gBAAGC,UAAU,CAGrC,gBAAyBC,GAAzB,EAAiC;AAAA,MAA9BC,SAA8B,QAA9BA,SAA8B;AAAA,MAAhBC,IAAgB;;AACjC,sBACEC,IAAC,mBAAD;AACE,IAAA,GAAG,EAAEH,GADP;AAEE,IAAA,SAAS,EAAEI,UAAU,CAAC,4BAAD,EAA+BH,SAA/B;AAFvB,KAGMC,IAHN;AAAA,2BAKEC;AAAK,MAAA,OAAO,EAAC,aAAb;AAAA,6BACEA;AACE,QAAA,EAAE,EAAC,IADL;AAEE,QAAA,EAAE,EAAC,IAFL;AAGE,QAAA,CAAC,EAAC,IAHJ;AAIE,QAAA,IAAI,EAAC,MAJP;AAKE,QAAA,WAAW,EAAC,GALd;AAME,QAAA,gBAAgB,EAAC;AANnB;AADF;AALF,KADF;AAkBD,CAtBsC;AAwBvCL,aAAa,CAACO,WAAd,GAA4B,eAA5B;;;;"}

package/dist/esm/components/Loaders/Spinner/Styles.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledSpinnerLoader: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Loaders/Spinner/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Loaders/Spinner/Styles.ts"],"names":[],"mappings":"AAuBA,eAAO,MAAM,mBAAmB,oEA8B/B,CAAC"}

package/dist/esm/components/Loaders/Spinner/Styles.js

@@ -0,0 +1,11 @@
+import styled, { keyframes } from 'styled-components';
+
+var rotateAnimation = keyframes(["100%{transform:rotate(360deg);}"]);
+var dashAnimation = keyframes(["0%{stroke-dasharray:1,200;stroke-dashoffset:0;}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px;}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px;}"]);
+var StyledSpinnerLoader = styled.div.withConfig({
+  displayName: "Styles__StyledSpinnerLoader",
+  componentId: "sc-1ht53g9-0"
+})(["position:relative;width:20px;&:before{content:\"\";display:block;padding-top:100%;}svg{animation:", " 2s linear infinite;height:100%;transform-origin:center center;width:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;circle{stroke-dasharray:1,200;stroke-dashoffset:0;stroke:var(--color-theme-600);animation:", " 1.5s ease-in-out infinite;stroke-linecap:round;}}"], rotateAnimation, dashAnimation);
+
+export { StyledSpinnerLoader };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Loaders/Spinner/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../../src/components/Loaders/Spinner/Styles.ts"],"sourcesContent":["import styled, { keyframes } from \"styled-components\";\n\nconst rotateAnimation = keyframes`\n  100% {\n    transform: rotate(360deg);\n  }\n`;\n\nconst dashAnimation = keyframes`\n  0% {\n    stroke-dasharray: 1, 200;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 89, 200;\n    stroke-dashoffset: -35px;\n  }\n  100% {\n    stroke-dasharray: 89, 200;\n    stroke-dashoffset: -124px;\n  }\n`;\n\nexport const StyledSpinnerLoader = styled.div`\n  position: relative;\n  width: 20px;\n\n  &:before {\n    content: \"\";\n    display: block;\n    padding-top: 100%;\n  }\n\n  svg {\n    animation: ${rotateAnimation} 2s linear infinite;\n    height: 100%;\n    transform-origin: center center;\n    width: 100%;\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    margin: auto;\n\n    circle {\n      stroke-dasharray: 1, 200;\n      stroke-dashoffset: 0;\n      stroke: var(--color-theme-600);\n      animation: ${dashAnimation} 1.5s ease-in-out infinite;\n      stroke-linecap: round;\n    }\n  }\n`;\n"],"names":["rotateAnimation","keyframes","dashAnimation","StyledSpinnerLoader","styled","div"],"mappings":";;AAEA,IAAMA,eAAe,GAAGC,SAAH,qCAArB;AAMA,IAAMC,aAAa,GAAGD,SAAH,iKAAnB;IAeaE,mBAAmB,GAAGC,MAAM,CAACC,GAAV;AAAA;AAAA;AAAA,oYAWfL,eAXe,EA0BbE,aA1Ba;;;;"}

package/dist/esm/components/Loaders/Spinner/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./SpinnerLoader";
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/Loaders/Spinner/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Loaders/Spinner/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}

package/dist/esm/components/Loaders/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Linear";
+export * from "./Dots";
+export * from "./Spinner";
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/Loaders/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Loaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC"}

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

@@ -0,0 +1,26 @@
+import { FC, ReactNode, MouseEvent, ReactElement, Ref } from "react";
+import { Placement } from "@popperjs/core";
+interface ElementWithRef<T> extends ReactElement {
+    ref?: Ref<T>;
+}
+export declare type MenuMode = "normal" | "wider" | "tiny";
+export interface IMenu {
+    children: ReactNode;
+    onMenuClick?: (event: MouseEvent<HTMLElement>) => void;
+    handleScroll?: boolean;
+    disableFocusLock?: boolean;
+    mode?: MenuMode;
+    open?: boolean;
+    onOpen?: () => void;
+    onClose?: () => void;
+    onBeforeClose?: () => boolean;
+    position?: Placement;
+    target?: ElementWithRef<Element>;
+    menuClassName?: string;
+    popperClassName?: string;
+    backgroundElementClass?: string;
+    windowAbsolutelyPositioned?: boolean;
+}
+export declare const Menu: FC<IMenu>;
+export {};
+//# sourceMappingURL=Menu.d.ts.map

package/dist/esm/components/Menu/Menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/Menu.tsx"],"names":[],"mappings":"AAAA,OAAc,EAEZ,EAAE,EACF,SAAS,EACT,UAAU,EAIV,YAAY,EACZ,GAAG,EACJ,MAAM,OAAO,CAAC;AAOf,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAI3C,UAAU,cAAc,CAAC,CAAC,CAAE,SAAQ,YAAY;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CACd;AAED,oBAAY,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;AAEnD,MAAM,WAAW,KAAK;IAEpB,QAAQ,EAAE,SAAS,CAAC;IAEpB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEvD,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC;IAE9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,MAAM,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAEjC,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,KAAK,CAsG1B,CAAC"}

package/dist/esm/components/Menu/Menu.js

@@ -0,0 +1,109 @@
+import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
+import React, { useState, useRef, useEffect, useCallback } from 'react';
+import classnames from 'classnames';
+import useForkRef from '../../utils/useForkRef.js';
+import { MenuContextProvider } from './context/index.js';
+import { StyledMenu } from './Styles.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { Window } from '../Window/Window.js';
+import { Overlay } from '../Overlay/Overlay.js';
+import { Popper } from '../Popper/Popper.js';
+
+var Menu = function Menu(_ref) {
+  var children = _ref.children,
+      _ref$disableFocusLock = _ref.disableFocusLock,
+      disableFocusLock = _ref$disableFocusLock === void 0 ? false : _ref$disableFocusLock,
+      onMenuClick = _ref.onMenuClick,
+      _ref$handleScroll = _ref.handleScroll,
+      handleScroll = _ref$handleScroll === void 0 ? true : _ref$handleScroll,
+      _ref$mode = _ref.mode,
+      mode = _ref$mode === void 0 ? "normal" : _ref$mode,
+      _ref$open = _ref.open,
+      defaultOpen = _ref$open === void 0 ? false : _ref$open,
+      onOpen = _ref.onOpen,
+      onClose = _ref.onClose,
+      onBeforeClose = _ref.onBeforeClose,
+      _ref$position = _ref.position,
+      position = _ref$position === void 0 ? "bottom-start" : _ref$position,
+      target = _ref.target,
+      menuClassName = _ref.menuClassName,
+      popperClassName = _ref.popperClassName,
+      backgroundElementClass = _ref.backgroundElementClass,
+      _ref$windowAbsolutely = _ref.windowAbsolutelyPositioned,
+      windowAbsolutelyPositioned = _ref$windowAbsolutely === void 0 ? false : _ref$windowAbsolutely;
+
+  var _useState = useState(defaultOpen),
+      _useState2 = _slicedToArray(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  var _useState3 = useState(),
+      _useState4 = _slicedToArray(_useState3, 2),
+      childNode = _useState4[0],
+      setChildNode = _useState4[1];
+
+  var elementRef = useRef(null);
+  useEffect(function () {
+    setOpen(defaultOpen);
+  }, [defaultOpen]);
+  var handleRefRef = useForkRef(target ? target.ref : undefined, setChildNode);
+  var handleRef = useForkRef(handleRefRef, elementRef);
+  var handleOpen = useCallback(function (event) {
+    event && event.preventDefault();
+    setOpen(true);
+    typeof onOpen === "function" && onOpen();
+  }, [onOpen]);
+  var handleClose = useCallback(function () {
+    if (typeof onBeforeClose === "function" && !onBeforeClose()) {
+      return;
+    }
+
+    setOpen(false);
+    typeof onClose === "function" && onClose();
+  }, [onClose, onBeforeClose]);
+  var childProps = {
+    forceClose: handleClose
+  };
+  var targetProps = {
+    open: open,
+    ref: handleRef,
+    onClick: handleOpen
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [target && /*#__PURE__*/React.cloneElement(target, targetProps), open ? /*#__PURE__*/jsxs(Window, {
+      onClose: handleClose,
+      disableScrollLock: !handleScroll,
+      disableFocusLock: disableFocusLock,
+      style: {
+        position: windowAbsolutelyPositioned ? "absolute" : "fixed"
+      },
+      children: [/*#__PURE__*/jsx(Overlay, {
+        className: backgroundElementClass,
+        onClick: handleClose,
+        tabIndex: -1
+      }), /*#__PURE__*/jsx(Popper, {
+        anchorEl: childNode,
+        open: childNode ? open : false,
+        placement: position,
+        className: popperClassName,
+        tabIndex: -1,
+        children: /*#__PURE__*/jsx(StyledMenu, {
+          className: classnames("c-simple-menu__paper", "c-simple-menu__".concat(mode), menuClassName),
+          $mode: mode,
+          onMouseDown: onMenuClick,
+          children: /*#__PURE__*/jsx(MenuContextProvider, {
+            value: {
+              open: open,
+              setOpen: setOpen
+            },
+            children: typeof children === "function" ? children(childProps) : children
+          })
+        })
+      })]
+    }) : null]
+  });
+};
+Menu.displayName = "Menu";
+
+export { Menu };
+//# sourceMappingURL=Menu.js.map

package/dist/esm/components/Menu/Menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.js","sources":["../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import React, {\n  useRef,\n  FC,\n  ReactNode,\n  MouseEvent,\n  useState,\n  useCallback,\n  useEffect,\n  ReactElement,\n  Ref,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { Popper } from \"../Popper\";\n// import { Tooltip } from \"../Tooltip\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Overlay } from \"../Overlay\";\nimport { Window } from \"../Window\";\nimport { Placement } from \"@popperjs/core\";\nimport { MenuContextProvider } from \"./context\";\nimport { StyledMenu } from \"./Styles\";\n\ninterface ElementWithRef<T> extends ReactElement {\n  ref?: Ref<T>;\n}\n\nexport type MenuMode = \"normal\" | \"wider\" | \"tiny\";\n\nexport interface IMenu {\n  /** Menu content */\n  children: ReactNode;\n  /** On menu element click */\n  onMenuClick?: (event: MouseEvent<HTMLElement>) => void;\n  /** Handle scroll bar */\n  handleScroll?: boolean;\n  /** Disable Focus Lock */\n  disableFocusLock?: boolean;\n  /** Menu width mode */\n  mode?: MenuMode;\n  /** Should menu be open when it's mounted */\n  open?: boolean;\n  /** Callback triggered when modal has been opened */\n  onOpen?: () => void;\n  /** Callback triggered when modal has been closed */\n  onClose?: () => void;\n  /** Before close callback */\n  onBeforeClose?: () => boolean;\n  /** Position Menu */\n  position?: Placement;\n  /** Target element */\n  target?: ElementWithRef<Element>;\n  /** Menu classes */\n  menuClassName?: string;\n  /** Popper class name*/\n  popperClassName?: string;\n  /** Background style for clickable element after the menu is open (opacity, color, etc...) */\n  backgroundElementClass?: string;\n  /** Should Window be positioned absolutely */\n  windowAbsolutelyPositioned?: boolean;\n}\n\nexport const Menu: FC<IMenu> = ({\n  children,\n  disableFocusLock = false,\n  onMenuClick,\n  handleScroll = true,\n  mode = \"normal\",\n  open: defaultOpen = false,\n  onOpen,\n  onClose,\n  onBeforeClose,\n  position = \"bottom-start\",\n  target,\n  menuClassName,\n  popperClassName,\n  backgroundElementClass,\n  windowAbsolutelyPositioned = false,\n}) => {\n  const [open, setOpen] = useState(defaultOpen);\n  const [childNode, setChildNode] = useState<Element | null>();\n  const elementRef = useRef<Element | null>(null);\n\n  useEffect(() => {\n    setOpen(defaultOpen);\n  }, [defaultOpen]);\n\n  const handleRefRef = useForkRef(\n    target ? target.ref : undefined,\n    setChildNode\n  );\n  const handleRef = useForkRef(handleRefRef, elementRef);\n\n  const handleOpen = useCallback(\n    (event: Pick<MouseEvent<Element>, \"preventDefault\">) => {\n      event && event.preventDefault();\n      setOpen(true);\n      typeof onOpen === \"function\" && onOpen();\n    },\n    [onOpen]\n  );\n\n  const handleClose = useCallback(() => {\n    if (typeof onBeforeClose === \"function\" && !onBeforeClose()) {\n      return;\n    }\n    setOpen(false);\n    typeof onClose === \"function\" && onClose();\n  }, [onClose, onBeforeClose]);\n\n  const childProps = {\n    forceClose: handleClose,\n  };\n\n  const targetProps = {\n    open,\n    ref: handleRef,\n    onClick: handleOpen,\n  };\n\n  return (\n    <>\n      {target && React.cloneElement(target, targetProps)}\n      {open ? (\n        <Window\n          onClose={handleClose}\n          disableScrollLock={!handleScroll}\n          disableFocusLock={disableFocusLock}\n          style={{\n            position: windowAbsolutelyPositioned ? \"absolute\" : \"fixed\",\n          }}\n        >\n          <Overlay\n            className={backgroundElementClass}\n            onClick={handleClose}\n            tabIndex={-1}\n          />\n          <Popper\n            anchorEl={childNode}\n            open={childNode ? open : false}\n            placement={position}\n            className={popperClassName}\n            tabIndex={-1}\n          >\n            <StyledMenu\n              className={classnames(\n                \"c-simple-menu__paper\",\n                `c-simple-menu__${mode}`,\n                menuClassName\n              )}\n              $mode={mode}\n              onMouseDown={onMenuClick}\n            >\n              <MenuContextProvider value={{ open, setOpen }}>\n                {typeof children === \"function\"\n                  ? children(childProps)\n                  : children}\n              </MenuContextProvider>\n            </StyledMenu>\n          </Popper>\n        </Window>\n      ) : null}\n    </>\n  );\n};\n\nMenu.displayName = \"Menu\";\n"],"names":["Menu","children","disableFocusLock","onMenuClick","handleScroll","mode","open","defaultOpen","onOpen","onClose","onBeforeClose","position","target","menuClassName","popperClassName","backgroundElementClass","windowAbsolutelyPositioned","useState","setOpen","childNode","setChildNode","elementRef","useRef","useEffect","handleRefRef","useForkRef","ref","undefined","handleRef","handleOpen","useCallback","event","preventDefault","handleClose","childProps","forceClose","targetProps","onClick","_jsxs","React","cloneElement","_jsx","classnames","displayName"],"mappings":"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"}

package/dist/esm/components/Menu/MenuFooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/MenuFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,SAAS,EACT,cAAc,EAEf,MAAM,OAAO,CAAC;AAIf,UAAU,WAAW;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,GAAG,cAAc,CAAC;CACvC;AAED,eAAO,MAAM,UAAU,2HAmBtB,CAAC"}

package/dist/esm/components/Menu/MenuFooter.js

@@ -0,0 +1,27 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { StyledMenuFooter } from './Styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+var _excluded = ["children", "className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var MenuFooter = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+      className = _ref.className,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsx(StyledMenuFooter, _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames("c-menu-footer", className),
+    ref: ref,
+    children: children
+  }));
+});
+MenuFooter.displayName = "MenuFooter";
+
+export { MenuFooter };
+//# sourceMappingURL=MenuFooter.js.map

package/dist/esm/components/Menu/MenuFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFooter.js","sources":["../../../../src/components/Menu/MenuFooter.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  HTMLAttributes,\n  ReactNode,\n  ReactNodeArray,\n  Ref,\n} from \"react\";\nimport classnames from \"classnames\";\nimport { StyledMenuFooter } from \"./Styles\";\n\ninterface IMenuFooter {\n  className?: string;\n  children?: ReactNode | ReactNodeArray;\n}\n\nexport const MenuFooter = forwardRef(\n  (\n    {\n      children,\n      className,\n      ...props\n    }: IMenuFooter & HTMLAttributes<HTMLDivElement>,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    return (\n      <StyledMenuFooter\n        {...props}\n        className={classnames(\"c-menu-footer\", className)}\n        ref={ref}\n      >\n        {children}\n      </StyledMenuFooter>\n    );\n  }\n);\n\nMenuFooter.displayName = \"MenuFooter\";\n"],"names":["MenuFooter","forwardRef","ref","children","className","props","_jsx","classnames","displayName"],"mappings":";;;;;;;;;;;;IAeaA,UAAU,gBAAGC,UAAU,CAClC,gBAMEC,GANF,EAOK;AAAA,MALDC,QAKC,QALDA,QAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,KAGF;;AACH,sBACEC,IAAC,gBAAD,kCACMD,KADN;AAEE,IAAA,SAAS,EAAEE,UAAU,CAAC,eAAD,EAAkBH,SAAlB,CAFvB;AAGE,IAAA,GAAG,EAAEF,GAHP;AAAA,cAKGC;AALH,KADF;AASD,CAlBiC;AAqBpCH,UAAU,CAACQ,WAAX,GAAyB,YAAzB;;;;"}

package/dist/esm/components/Menu/MenuHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/MenuHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA8B,SAAS,EAAO,MAAM,OAAO,CAAC;AAK1E,UAAU,WAAW;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AAED,eAAO,MAAM,UAAU,2HA+BtB,CAAC"}

package/dist/esm/components/Menu/MenuHeader.js

@@ -0,0 +1,47 @@
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { Typography } from '../Typography/Typography.js';
+import { StyledMenuHeader } from './Styles.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var _excluded = ["title", "className", "leftElement", "rightElement"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var MenuHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var title = _ref.title,
+      className = _ref.className,
+      leftElement = _ref.leftElement,
+      rightElement = _ref.rightElement,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/jsxs(StyledMenuHeader, _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames("c-menu-header", className),
+    ref: ref,
+    children: [leftElement || /*#__PURE__*/jsx("div", {
+      style: {
+        minWidth: "24px"
+      },
+      children: "\xA0"
+    }), /*#__PURE__*/jsx(Typography, {
+      variant: "Body 2",
+      color: "secondary",
+      weight: "bold",
+      overflow: "truncate",
+      className: "tw-mx-1",
+      children: title
+    }), rightElement || /*#__PURE__*/jsx("div", {
+      style: {
+        minWidth: "24px"
+      },
+      children: "\xA0"
+    })]
+  }));
+});
+MenuHeader.displayName = "MenuHeader";
+
+export { MenuHeader };
+//# sourceMappingURL=MenuHeader.js.map

package/dist/esm/components/Menu/MenuHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuHeader.js","sources":["../../../../src/components/Menu/MenuHeader.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes, ReactNode, Ref } from \"react\";\nimport classnames from \"classnames\";\nimport { Typography } from \"../Typography/Typography\";\nimport { StyledMenuHeader } from \"./Styles\";\n\ninterface IMenuHeader {\n  className?: string;\n  title?: string;\n  leftElement?: ReactNode;\n  rightElement?: ReactNode;\n}\n\nexport const MenuHeader = forwardRef(\n  (\n    {\n      title,\n      className,\n      leftElement,\n      rightElement,\n      ...props\n    }: IMenuHeader & HTMLAttributes<HTMLDivElement>,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    return (\n      <StyledMenuHeader\n        {...props}\n        className={classnames(\"c-menu-header\", className)}\n        ref={ref}\n      >\n        {leftElement || <div style={{ minWidth: \"24px\" }}>&nbsp;</div>}\n        <Typography\n          variant=\"Body 2\"\n          color=\"secondary\"\n          weight=\"bold\"\n          overflow=\"truncate\"\n          className=\"tw-mx-1\"\n        >\n          {title}\n        </Typography>\n        {rightElement || <div style={{ minWidth: \"24px\" }}>&nbsp;</div>}\n      </StyledMenuHeader>\n    );\n  }\n);\n\nMenuHeader.displayName = \"MenuHeader\";\n"],"names":["MenuHeader","forwardRef","ref","title","className","leftElement","rightElement","props","_jsxs","classnames","_jsx","minWidth","displayName"],"mappings":";;;;;;;;;;;;;IAYaA,UAAU,gBAAGC,UAAU,CAClC,gBAQEC,GARF,EASK;AAAA,MAPDC,KAOC,QAPDA,KAOC;AAAA,MANDC,SAMC,QANDA,SAMC;AAAA,MALDC,WAKC,QALDA,WAKC;AAAA,MAJDC,YAIC,QAJDA,YAIC;AAAA,MAHEC,KAGF;;AACH,sBACEC,KAAC,gBAAD,kCACMD,KADN;AAEE,IAAA,SAAS,EAAEE,UAAU,CAAC,eAAD,EAAkBL,SAAlB,CAFvB;AAGE,IAAA,GAAG,EAAEF,GAHP;AAAA,eAKGG,WAAW,iBAAIK;AAAK,MAAA,KAAK,EAAE;AAAEC,QAAAA,QAAQ,EAAE;AAAZ,OAAZ;AAAA;AAAA,MALlB,eAMED,IAAC,UAAD;AACE,MAAA,OAAO,EAAC,QADV;AAEE,MAAA,KAAK,EAAC,WAFR;AAGE,MAAA,MAAM,EAAC,MAHT;AAIE,MAAA,QAAQ,EAAC,UAJX;AAKE,MAAA,SAAS,EAAC,SALZ;AAAA,gBAOGP;AAPH,MANF,EAeGG,YAAY,iBAAII;AAAK,MAAA,KAAK,EAAE;AAAEC,QAAAA,QAAQ,EAAE;AAAZ,OAAZ;AAAA;AAAA,MAfnB;AAAA,KADF;AAmBD,CA9BiC;AAiCpCX,UAAU,CAACY,WAAX,GAAyB,YAAzB;;;;"}

package/dist/esm/components/Menu/Styles.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const StyledMenu: import("styled-components").StyledComponent<import("react").FC<import("../Bubble").IBubble & import("react").HTMLAttributes<HTMLDivElement>>, any, {
+    $mode: string;
+}, never>;
+export declare const StyledMenuFooter: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledMenuHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Menu/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/Styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,UAAU;WAA2B,MAAM;SA6BvD,CAAC;AAGF,eAAO,MAAM,gBAAgB,oEAO5B,CAAC;AAGF,eAAO,MAAM,gBAAgB,oEAK5B,CAAC"}

package/dist/esm/components/Menu/Styles.js

@@ -0,0 +1,49 @@
+import styled, { css } from 'styled-components';
+import { BoxSizingStyle } from '../BoxSizingStyle.js';
+import { FontStyle } from '../FontStyle.js';
+import { Bubble } from '../Bubble/Bubble.js';
+
+var StyledMenu = styled(Bubble).withConfig({
+  displayName: "Styles__StyledMenu",
+  componentId: "sc-8fhkp-0"
+})(["", " ", " ", " color:var(--color-theme-700);a:focus,a:active{outline:none;}", " ", " ", ""], {
+  "backgroundColor": "var(--page-paper-main)",
+  "borderColor": "var(--border-primary)",
+  "marginTop": "0.25rem",
+  "marginBottom": "0.25rem",
+  "overflow": "auto"
+}, FontStyle, BoxSizingStyle, function (props) {
+  return props.$mode === "normal" && css(["width:260px;"]);
+}, function (props) {
+  return props.$mode === "wider" && css(["width:350px;"]);
+}, function (props) {
+  return props.$mode === "tiny" && css(["width:180px;"]);
+});
+StyledMenu.displayName = "StyledMenu";
+var StyledMenuFooter = styled.div.withConfig({
+  displayName: "Styles__StyledMenuFooter",
+  componentId: "sc-8fhkp-1"
+})(["", " display:flex;border-top:1px solid var(--border-primary);height:32px;align-items:center;"], {
+  "display": "flex",
+  "paddingLeft": "0.5rem",
+  "paddingRight": "0.5rem",
+  "paddingTop": "0.25rem",
+  "paddingBottom": "0.25rem"
+});
+StyledMenuFooter.displayName = "StyledMenuFooter";
+var StyledMenuHeader = styled.div.withConfig({
+  displayName: "Styles__StyledMenuHeader",
+  componentId: "sc-8fhkp-2"
+})(["", " border-bottom:1px solid var(--border-primary);height:32px;"], {
+  "display": "flex",
+  "alignItems": "center",
+  "justifyContent": "space-between",
+  "paddingLeft": "0.5rem",
+  "paddingRight": "0.5rem",
+  "paddingTop": "0.25rem",
+  "paddingBottom": "0.25rem"
+});
+StyledMenuHeader.displayName = "StyledMenuHeader";
+
+export { StyledMenu, StyledMenuFooter, StyledMenuHeader };
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Menu/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","sources":["../../../../src/components/Menu/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Bubble } from \"../Bubble\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledMenu = styled(Bubble)<{ $mode: string }>`\n  ${tw`tw-bg-page-paper-main tw-border-border-primary tw-my-1 tw-overflow-auto`}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  color: var(--color-theme-700);\n  a:focus,\n  a:active {\n    outline: none;\n  }\n\n  ${(props) =>\n    props.$mode === \"normal\" &&\n    css`\n      width: 260px;\n    `}\n\n  ${(props) =>\n    props.$mode === \"wider\" &&\n    css`\n      width: 350px;\n    `}\n\n  ${(props) =>\n    props.$mode === \"tiny\" &&\n    css`\n      width: 180px;\n    `}\n`;\nStyledMenu.displayName = \"StyledMenu\";\n\nexport const StyledMenuFooter = styled.div`\n  ${tw`tw-flex tw-px-2 tw-py-1`}\n\n  display: flex;\n  border-top: 1px solid var(--border-primary);\n  height: 32px;\n  align-items: center;\n`;\nStyledMenuFooter.displayName = \"StyledMenuFooter\";\n\nexport const StyledMenuHeader = styled.div`\n  ${tw`tw-flex tw-items-center tw-justify-between tw-px-2 tw-py-1`}\n\n  border-bottom: 1px solid var(--border-primary);\n  height: 32px;\n`;\nStyledMenuHeader.displayName = \"StyledMenuHeader\";\n"],"names":["StyledMenu","styled","Bubble","FontStyle","BoxSizingStyle","props","$mode","css","displayName","StyledMenuFooter","div","StyledMenuHeader"],"mappings":";;;;;IAMaA,UAAU,GAAGC,MAAM,CAACC,MAAD,CAAT;AAAA;AAAA;AAAA,kGACjB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CADiB,EAGnBC,SAHmB,EAInBC,cAJmB,EAYnB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,QAAhB,IACAC,GADA,kBADA;AAAA,CAZmB,EAkBnB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,OAAhB,IACAC,GADA,kBADA;AAAA,CAlBmB,EAwBnB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,MAAhB,IACAC,GADA,kBADA;AAAA,CAxBmB;AA8BvBP,UAAU,CAACQ,WAAX,GAAyB,YAAzB;IAEaC,gBAAgB,GAAGR,MAAM,CAACS,GAAV;AAAA;AAAA;AAAA,qGACvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CADuB;AAQ7BD,gBAAgB,CAACD,WAAjB,GAA+B,kBAA/B;IAEaG,gBAAgB,GAAGV,MAAM,CAACS,GAAV;AAAA;AAAA;AAAA,wEACvB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CADuB;AAM7BC,gBAAgB,CAACH,WAAjB,GAA+B,kBAA/B;;;;"}

package/dist/esm/components/Menu/context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Menu/context/index.ts"],"names":[],"mappings":";AAEA,UAAU,YAAY;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACnC;AAED,QAAA,MAAM,WAAW,uCAAkC,CAAC;AAEpD,eAAO,MAAM,mBAAmB,wCAAuB,CAAC;AACxD,eAAO,MAAM,mBAAmB,wCAAuB,CAAC;AAExD,eAAO,MAAM,cAAc,QAAO,YAAuC,CAAC;AAE1E,eAAe,WAAW,CAAC"}

package/dist/esm/components/Menu/context/index.js

@@ -0,0 +1,11 @@
+import { useContext, createContext } from 'react';
+
+var MenuContext = /*#__PURE__*/createContext({});
+var MenuContextProvider = MenuContext.Provider;
+MenuContext.Consumer;
+var useMenuContext = function useMenuContext() {
+  return useContext(MenuContext);
+};
+
+export { MenuContextProvider, MenuContext as default, useMenuContext };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Menu/context/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../src/components/Menu/context/index.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\ninterface IMenuContext {\n  open?: boolean;\n  setOpen?: (open: boolean) => void;\n}\n\nconst MenuContext = createContext<IMenuContext>({});\n\nexport const MenuContextProvider = MenuContext.Provider;\nexport const MenuContextConsumer = MenuContext.Consumer;\n\nexport const useMenuContext = (): IMenuContext => useContext(MenuContext);\n\nexport default MenuContext;\n"],"names":["MenuContext","createContext","MenuContextProvider","Provider","Consumer","useMenuContext","useContext"],"mappings":";;IAOMA,WAAW,gBAAGC,aAAa,CAAe,EAAf;IAEpBC,mBAAmB,GAAGF,WAAW,CAACG;AACZH,WAAW,CAACI;IAElCC,cAAc,GAAG,SAAjBA,cAAiB;AAAA,SAAoBC,UAAU,CAACN,WAAD,CAA9B;AAAA;;;;"}

package/dist/esm/components/Menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAE7B,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/esm/components/MenuSelector/MenuSelector.d.ts

@@ -0,0 +1,16 @@
+import { FC, FocusEvent } from "react";
+interface IMenuSelector {
+    defaultValue?: string;
+    placeholder?: string;
+    onChange?: (value: string) => void;
+    onBack?: () => void;
+    onEdit?: () => void;
+    autoFocus?: boolean;
+    className?: string;
+    onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    autoComplete?: boolean;
+}
+export declare const MenuSelector: FC<IMenuSelector>;
+export {};
+//# sourceMappingURL=MenuSelector.d.ts.map

package/dist/esm/components/MenuSelector/MenuSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSelector.d.ts","sourceRoot":"","sources":["../../../../src/components/MenuSelector/MenuSelector.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,UAAU,EAA4B,MAAM,OAAO,CAAC;AAUxE,UAAU,aAAa;IAErB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAEpD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAEnD,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,aAAa,CA4C1C,CAAC"}

package/dist/esm/components/MenuSelector/MenuSelector.js

@@ -0,0 +1,50 @@
+import { useCallback } from 'react';
+import classnames from 'classnames';
+import { StyledMenuSelector, StyledMenuSelectorInner, StyledMenuSelectorBack, StyledMenuSelectorDots } from './Styles.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Input } from '../Input/Input.js';
+
+var MenuSelector = function MenuSelector(_ref) {
+  var defaultValue = _ref.defaultValue,
+      children = _ref.children,
+      placeholder = _ref.placeholder,
+      onChange = _ref.onChange,
+      onBack = _ref.onBack,
+      onEdit = _ref.onEdit,
+      _ref$autoFocus = _ref.autoFocus,
+      autoFocus = _ref$autoFocus === void 0 ? false : _ref$autoFocus,
+      className = _ref.className,
+      onFocus = _ref.onFocus,
+      onBlur = _ref.onBlur,
+      _ref$autoComplete = _ref.autoComplete,
+      autoComplete = _ref$autoComplete === void 0 ? false : _ref$autoComplete;
+  var handleChange = useCallback(function (e) {
+    if (typeof onChange === "function") {
+      onChange(e.target.value);
+    }
+  }, [onChange]);
+  return /*#__PURE__*/jsxs(StyledMenuSelector, {
+    className: classnames("c-menu-selector", className),
+    children: [/*#__PURE__*/jsxs(StyledMenuSelectorInner, {
+      children: [typeof onBack === "function" ? /*#__PURE__*/jsx(StyledMenuSelectorBack, {
+        onClick: onBack,
+        width: "16px",
+        height: "16px"
+      }) : null, /*#__PURE__*/jsx(Input, {
+        onChange: handleChange,
+        placeholder: placeholder,
+        autoFocus: autoFocus,
+        defaultValue: defaultValue,
+        onFocus: onFocus,
+        onBlur: onBlur,
+        autoComplete: autoComplete ? "on" : "off"
+      }), typeof onEdit === "function" ? /*#__PURE__*/jsx(StyledMenuSelectorDots, {
+        onClick: onEdit
+      }) : null]
+    }), children]
+  });
+};
+MenuSelector.displayName = "MenuSelector";
+
+export { MenuSelector };
+//# sourceMappingURL=MenuSelector.js.map