@activecollab/components 1.0.4 → 1.0.8

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

@@ -1,13 +1,10 @@
-import styled from 'styled-components';
-import { Paper } from '../Paper/Paper.js';
-
-var StyledCard = styled(Paper).withConfig({
+import styled from "styled-components";
+import { Paper } from "../Paper";
+export var StyledCard = styled(Paper).withConfig({
   displayName: "Styles__StyledCard",
   componentId: "sc-hllbj1-0"
 })(["", ""], {
   "color": "var(--color-theme-900)"
 });
 StyledCard.displayName = "StyledCard";
-
-export { StyledCard };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","sources":["../../../../src/components/Card/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Paper } from \"../Paper\";\n\nexport const StyledCard = styled(Paper)`\n  ${tw`tw-text-theme-900`}\n`;\n\nStyledCard.displayName = \"StyledCard\";\n"],"names":["StyledCard","styled","Paper","displayName"],"mappings":";;;IAIaA,UAAU,GAAGC,MAAM,CAACC,KAAD,CAAT;AAAA;AAAA;AAAA,aACjB;AAAA;AAAA,CADiB;AAIvBF,UAAU,CAACG,WAAX,GAAyB,YAAzB;;;;"}
+{"version":3,"sources":["../../../../src/components/Card/Styles.ts"],"names":["styled","Paper","StyledCard","displayName"],"mappings":"AAAA,OAAOA,MAAP,MAAmB,mBAAnB;AAEA,SAASC,KAAT,QAAsB,UAAtB;AAEA,OAAO,IAAMC,UAAU,GAAGF,MAAM,CAACC,KAAD,CAAT;AAAA;AAAA;AAAA,aACjB;AAAA;AAAA,CADiB,CAAhB;AAIPC,UAAU,CAACC,WAAX,GAAyB,YAAzB","sourcesContent":["import styled from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Paper } from \"../Paper\";\n\nexport const StyledCard = styled(Paper)`\n  ${tw`tw-text-theme-900`}\n`;\n\nStyledCard.displayName = \"StyledCard\";\n"],"file":"Styles.js"}

package/dist/esm/components/Card/index.js

@@ -0,0 +1,2 @@
+export * from "./Card";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Card/index.js.map

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

package/dist/esm/components/Checkbox/Checkbox.js

@@ -1,49 +1,39 @@
-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 CheckboxIcon from '../Icons/collection/Checkbox.js';
-import { StyledCheckbox, StyledInput, StyledLabel } from './Styles.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _excluded = ["className", "hover", "id"];
-
-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; }
+import React, { forwardRef } from "react";
+import classnames from "classnames";
+import CheckboxIcon from "../Icons/collection/Checkbox";
+import { StyledCheckbox, StyledInput, StyledLabel } from "./Styles";
 
 /**
  * Checkbox component
  */
-var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
+export var Checkbox = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
       hover = _ref.hover,
       _ref$id = _ref.id,
       id = _ref$id === void 0 ? "checkbox" : _ref$id,
-      rest = _objectWithoutProperties(_ref, _excluded);
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
-  return /*#__PURE__*/jsxs(StyledCheckbox, {
+  return /*#__PURE__*/React.createElement(StyledCheckbox, {
     className: classnames("c-checkbox", {
       "c-checkbox__hover": hover,
       "c-checkbox__controlled": typeof hover === "boolean"
     }, className),
-    hover: hover,
-    children: [/*#__PURE__*/jsx(StyledInput, _objectSpread({
-      id: id,
-      className: "c-checkbox--input",
-      type: "checkbox",
-      ref: ref
-    }, rest)), /*#__PURE__*/jsx(StyledLabel, {
-      htmlFor: id,
-      className: "c-checkbox--label",
-      children: /*#__PURE__*/jsx(CheckboxIcon, {
-        height: 16,
-        width: 16
-      })
-    })]
-  });
+    hover: hover
+  }, /*#__PURE__*/React.createElement(StyledInput, _extends({
+    id: id,
+    className: "c-checkbox--input",
+    type: "checkbox",
+    ref: ref
+  }, rest)), /*#__PURE__*/React.createElement(StyledLabel, {
+    htmlFor: id,
+    className: "c-checkbox--label"
+  }, /*#__PURE__*/React.createElement(CheckboxIcon, {
+    height: 16,
+    width: 16
+  })));
 });
 Checkbox.displayName = "Checkbox";
-
-export { Checkbox };
-//# sourceMappingURL=Checkbox.js.map
+//# sourceMappingURL=Checkbox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  BaseHTMLAttributes,\n  InputHTMLAttributes,\n  Ref,\n} from \"react\";\nimport classnames from \"classnames\";\nimport CheckboxIcon from \"../Icons/collection/Checkbox\";\nimport { StyledCheckbox, StyledInput, StyledLabel } from \"./Styles\";\n\nexport interface ICheckboxProps extends BaseHTMLAttributes<HTMLInputElement> {\n  /** CSS classes */\n  className?: string;\n  /** Set hover style */\n  hover?: boolean;\n  /** Id of input and for of label */\n  id?: string;\n}\n\n/**\n * Checkbox component\n */\nexport const Checkbox = forwardRef(\n  (\n    {\n      className,\n      hover,\n      id = \"checkbox\",\n      ...rest\n    }: InputHTMLAttributes<HTMLInputElement> & ICheckboxProps,\n    ref: Ref<HTMLInputElement> | null | undefined\n  ) => {\n    return (\n      <StyledCheckbox\n        className={classnames(\n          \"c-checkbox\",\n          {\n            \"c-checkbox__hover\": hover,\n            \"c-checkbox__controlled\": typeof hover === \"boolean\",\n          },\n          className\n        )}\n        hover={hover}\n      >\n        <StyledInput\n          id={id}\n          className=\"c-checkbox--input\"\n          type=\"checkbox\"\n          ref={ref}\n          {...rest}\n        />\n        <StyledLabel htmlFor={id} className=\"c-checkbox--label\">\n          <CheckboxIcon height={16} width={16} />\n        </StyledLabel>\n      </StyledCheckbox>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["Checkbox","forwardRef","ref","className","hover","id","rest","_jsxs","classnames","_jsx","displayName"],"mappings":";;;;;;;;;;;;;;AAmBA;AACA;AACA;IACaA,QAAQ,gBAAGC,UAAU,CAChC,gBAOEC,GAPF,EAQK;AAAA,MANDC,SAMC,QANDA,SAMC;AAAA,MALDC,KAKC,QALDA,KAKC;AAAA,qBAJDC,EAIC;AAAA,MAJDA,EAIC,wBAJI,UAIJ;AAAA,MAHEC,IAGF;;AACH,sBACEC,KAAC,cAAD;AACE,IAAA,SAAS,EAAEC,UAAU,CACnB,YADmB,EAEnB;AACE,2BAAqBJ,KADvB;AAEE,gCAA0B,OAAOA,KAAP,KAAiB;AAF7C,KAFmB,EAMnBD,SANmB,CADvB;AASE,IAAA,KAAK,EAAEC,KATT;AAAA,4BAWEK,IAAC,WAAD;AACE,MAAA,EAAE,EAAEJ,EADN;AAEE,MAAA,SAAS,EAAC,mBAFZ;AAGE,MAAA,IAAI,EAAC,UAHP;AAIE,MAAA,GAAG,EAAEH;AAJP,OAKMI,IALN,EAXF,eAkBEG,IAAC,WAAD;AAAa,MAAA,OAAO,EAAEJ,EAAtB;AAA0B,MAAA,SAAS,EAAC,mBAApC;AAAA,6BACEI,IAAC,YAAD;AAAc,QAAA,MAAM,EAAE,EAAtB;AAA0B,QAAA,KAAK,EAAE;AAAjC;AADF,MAlBF;AAAA,IADF;AAwBD,CAlC+B;AAqClCT,QAAQ,CAACU,WAAT,GAAuB,UAAvB;;;;"}
+{"version":3,"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"names":["React","forwardRef","classnames","CheckboxIcon","StyledCheckbox","StyledInput","StyledLabel","Checkbox","ref","className","hover","id","rest","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IACEC,UADF,QAKO,OALP;AAMA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,YAAP,MAAyB,8BAAzB;AACA,SAASC,cAAT,EAAyBC,WAAzB,EAAsCC,WAAtC,QAAyD,UAAzD;;AAWA;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,gBAAGN,UAAU,CAChC,gBAOEO,GAPF,EAQK;AAAA,MANDC,SAMC,QANDA,SAMC;AAAA,MALDC,KAKC,QALDA,KAKC;AAAA,qBAJDC,EAIC;AAAA,MAJDA,EAIC,wBAJI,UAIJ;AAAA,MAHEC,IAGF;;AACH,sBACE,oBAAC,cAAD;AACE,IAAA,SAAS,EAAEV,UAAU,CACnB,YADmB,EAEnB;AACE,2BAAqBQ,KADvB;AAEE,gCAA0B,OAAOA,KAAP,KAAiB;AAF7C,KAFmB,EAMnBD,SANmB,CADvB;AASE,IAAA,KAAK,EAAEC;AATT,kBAWE,oBAAC,WAAD;AACE,IAAA,EAAE,EAAEC,EADN;AAEE,IAAA,SAAS,EAAC,mBAFZ;AAGE,IAAA,IAAI,EAAC,UAHP;AAIE,IAAA,GAAG,EAAEH;AAJP,KAKMI,IALN,EAXF,eAkBE,oBAAC,WAAD;AAAa,IAAA,OAAO,EAAED,EAAtB;AAA0B,IAAA,SAAS,EAAC;AAApC,kBACE,oBAAC,YAAD;AAAc,IAAA,MAAM,EAAE,EAAtB;AAA0B,IAAA,KAAK,EAAE;AAAjC,IADF,CAlBF,CADF;AAwBD,CAlC+B,CAA3B;AAqCPJ,QAAQ,CAACM,WAAT,GAAuB,UAAvB","sourcesContent":["import React, {\n  forwardRef,\n  BaseHTMLAttributes,\n  InputHTMLAttributes,\n  Ref,\n} from \"react\";\nimport classnames from \"classnames\";\nimport CheckboxIcon from \"../Icons/collection/Checkbox\";\nimport { StyledCheckbox, StyledInput, StyledLabel } from \"./Styles\";\n\nexport interface ICheckboxProps extends BaseHTMLAttributes<HTMLInputElement> {\n  /** CSS classes */\n  className?: string;\n  /** Set hover style */\n  hover?: boolean;\n  /** Id of input and for of label */\n  id?: string;\n}\n\n/**\n * Checkbox component\n */\nexport const Checkbox = forwardRef(\n  (\n    {\n      className,\n      hover,\n      id = \"checkbox\",\n      ...rest\n    }: InputHTMLAttributes<HTMLInputElement> & ICheckboxProps,\n    ref: Ref<HTMLInputElement> | null | undefined\n  ) => {\n    return (\n      <StyledCheckbox\n        className={classnames(\n          \"c-checkbox\",\n          {\n            \"c-checkbox__hover\": hover,\n            \"c-checkbox__controlled\": typeof hover === \"boolean\",\n          },\n          className\n        )}\n        hover={hover}\n      >\n        <StyledInput\n          id={id}\n          className=\"c-checkbox--input\"\n          type=\"checkbox\"\n          ref={ref}\n          {...rest}\n        />\n        <StyledLabel htmlFor={id} className=\"c-checkbox--label\">\n          <CheckboxIcon height={16} width={16} />\n        </StyledLabel>\n      </StyledCheckbox>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"file":"Checkbox.js"}

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

@@ -1,22 +1,19 @@
-import styled, { css } from 'styled-components';
-
-var StyledInput = styled.input.withConfig({
+import styled, { css } from "styled-components";
+export var StyledInput = styled.input.withConfig({
   displayName: "Styles__StyledInput",
   componentId: "sc-y7zymm-0"
 })(["display:none;"]);
 StyledInput.displayName = "StyledInput";
-var StyledLabel = styled.label.withConfig({
+export var StyledLabel = styled.label.withConfig({
   displayName: "Styles__StyledLabel",
   componentId: "sc-y7zymm-1"
 })([""]);
 StyledLabel.displayName = "StyledLabel";
-var StyledCheckbox = styled.div.withConfig({
+export var StyledCheckbox = styled.div.withConfig({
   displayName: "Styles__StyledCheckbox",
   componentId: "sc-y7zymm-2"
 })(["height:16px;width:16px;position:relative;transition-duration:0.2s;border-radius:2px;path{transition-duration:0.2s;stroke:transparent;stroke-dashoffset:12;stroke-dasharray:12;}svg{cursor:pointer;border-radius:2px;fill:transparent;}rect{transition-duration:0.2s;stroke:var(--color-theme-500);}", ":disabled ~ ", "{pointer-events:none;opacity:0.5;}", ":focus ~ ", "{rect{stroke:var(--color-secondary);stroke-width:3px;}}&:not(.c-checkbox__controlled) ", ":hover ~ ", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);stroke-width:3px;}}", " ", ":checked ~ ", "{path{stroke:var(--page-paper-main);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);stroke-width:19px;}}"], StyledInput, StyledLabel, StyledInput, StyledLabel, StyledInput, StyledLabel, function (props) {
   return props.hover && css(["", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);stroke-width:3px;}"], StyledLabel);
 }, StyledInput, StyledLabel);
 StyledCheckbox.displayName = "StyledCheckbox";
-
-export { StyledCheckbox, StyledInput, StyledLabel };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","sources":["../../../../src/components/Checkbox/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { ICheckboxProps } from \"./Checkbox\";\n\nexport const StyledInput = styled.input`\n  display: none;\n`;\nStyledInput.displayName = \"StyledInput\";\n\nexport const StyledLabel = styled.label``;\nStyledLabel.displayName = \"StyledLabel\";\n\nexport const StyledCheckbox = styled.div<ICheckboxProps>`\n  height: 16px;\n  width: 16px;\n  position: relative;\n  transition-duration: 0.2s;\n  border-radius: 2px;\n  path {\n    transition-duration: 0.2s;\n    stroke: transparent;\n    stroke-dashoffset: 12;\n    stroke-dasharray: 12;\n  }\n  svg {\n    cursor: pointer;\n    border-radius: 2px;\n    fill: transparent;\n  }\n  rect {\n    transition-duration: 0.2s;\n    stroke: var(--color-theme-500);\n  }\n\n  ${StyledInput}:disabled ~ ${StyledLabel} {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n\n  ${StyledInput}:focus ~ ${StyledLabel} {\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 3px;\n    }\n  }\n\n  &:not(.c-checkbox__controlled) ${StyledInput}:hover ~ ${StyledLabel} {\n    path {\n      stroke: var(--color-secondary-500);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 3px;\n    }\n  }\n\n  ${(props) =>\n    props.hover &&\n    css`\n      ${StyledLabel} {\n        path {\n          stroke: var(--color-secondary-500);\n          stroke-dashoffset: 24;\n        }\n        rect {\n          stroke: var(--color-secondary);\n          stroke-width: 3px;\n        }\n    `}\n\n  ${StyledInput}:checked ~ ${StyledLabel} {\n    path {\n      stroke: var(--page-paper-main);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 19px;\n    }\n  }\n`;\nStyledCheckbox.displayName = \"StyledCheckbox\";\n"],"names":["StyledInput","styled","input","displayName","StyledLabel","label","StyledCheckbox","div","props","hover","css"],"mappings":";;IAGaA,WAAW,GAAGC,MAAM,CAACC,KAAV;AAAA;AAAA;AAAA;AAGxBF,WAAW,CAACG,WAAZ,GAA0B,aAA1B;IAEaC,WAAW,GAAGH,MAAM,CAACI,KAAV;AAAA;AAAA;AAAA;AACxBD,WAAW,CAACD,WAAZ,GAA0B,aAA1B;IAEaG,cAAc,GAAGL,MAAM,CAACM,GAAV;AAAA;AAAA;AAAA,utBAsBvBP,WAtBuB,EAsBGI,WAtBH,EA2BvBJ,WA3BuB,EA2BAI,WA3BA,EAkCQJ,WAlCR,EAkC+BI,WAlC/B,EA6CvB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAC,GADA,8HAEIN,WAFJ,CADA;AAAA,CA7CuB,EA2DvBJ,WA3DuB,EA2DEI,WA3DF;AAsE3BE,cAAc,CAACH,WAAf,GAA6B,gBAA7B;;;;"}
+{"version":3,"sources":["../../../../src/components/Checkbox/Styles.ts"],"names":["styled","css","StyledInput","input","displayName","StyledLabel","label","StyledCheckbox","div","props","hover"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAGA,OAAO,IAAMC,WAAW,GAAGF,MAAM,CAACG,KAAV;AAAA;AAAA;AAAA,qBAAjB;AAGPD,WAAW,CAACE,WAAZ,GAA0B,aAA1B;AAEA,OAAO,IAAMC,WAAW,GAAGL,MAAM,CAACM,KAAV;AAAA;AAAA;AAAA,QAAjB;AACPD,WAAW,CAACD,WAAZ,GAA0B,aAA1B;AAEA,OAAO,IAAMG,cAAc,GAAGP,MAAM,CAACQ,GAAV;AAAA;AAAA;AAAA,utBAsBvBN,WAtBuB,EAsBGG,WAtBH,EA2BvBH,WA3BuB,EA2BAG,WA3BA,EAkCQH,WAlCR,EAkC+BG,WAlC/B,EA6CvB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,IACAT,GADA,8HAEII,WAFJ,CADA;AAAA,CA7CuB,EA2DvBH,WA3DuB,EA2DEG,WA3DF,CAApB;AAsEPE,cAAc,CAACH,WAAf,GAA6B,gBAA7B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { ICheckboxProps } from \"./Checkbox\";\n\nexport const StyledInput = styled.input`\n  display: none;\n`;\nStyledInput.displayName = \"StyledInput\";\n\nexport const StyledLabel = styled.label``;\nStyledLabel.displayName = \"StyledLabel\";\n\nexport const StyledCheckbox = styled.div<ICheckboxProps>`\n  height: 16px;\n  width: 16px;\n  position: relative;\n  transition-duration: 0.2s;\n  border-radius: 2px;\n  path {\n    transition-duration: 0.2s;\n    stroke: transparent;\n    stroke-dashoffset: 12;\n    stroke-dasharray: 12;\n  }\n  svg {\n    cursor: pointer;\n    border-radius: 2px;\n    fill: transparent;\n  }\n  rect {\n    transition-duration: 0.2s;\n    stroke: var(--color-theme-500);\n  }\n\n  ${StyledInput}:disabled ~ ${StyledLabel} {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n\n  ${StyledInput}:focus ~ ${StyledLabel} {\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 3px;\n    }\n  }\n\n  &:not(.c-checkbox__controlled) ${StyledInput}:hover ~ ${StyledLabel} {\n    path {\n      stroke: var(--color-secondary-500);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 3px;\n    }\n  }\n\n  ${(props) =>\n    props.hover &&\n    css`\n      ${StyledLabel} {\n        path {\n          stroke: var(--color-secondary-500);\n          stroke-dashoffset: 24;\n        }\n        rect {\n          stroke: var(--color-secondary);\n          stroke-width: 3px;\n        }\n    `}\n\n  ${StyledInput}:checked ~ ${StyledLabel} {\n    path {\n      stroke: var(--page-paper-main);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 19px;\n    }\n  }\n`;\nStyledCheckbox.displayName = \"StyledCheckbox\";\n"],"file":"Styles.js"}

package/dist/esm/components/Checkbox/index.js

@@ -0,0 +1,2 @@
+export * from "./Checkbox";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Checkbox/index.js.map

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

package/dist/esm/components/Choose/Choose.js

@@ -1,37 +1,27 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import 'react';
-import classnames from 'classnames';
-import { StyledChoose } from './Styles.js';
-import { jsx } from 'react/jsx-runtime';
-
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _excluded = ["children", "disabled", "active", "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; }
+import React from "react";
+import classNames from "classnames";
+import { StyledChoose } from "./Styles";
 
 /**
  * Choose component
  */
-var Choose = function Choose(_ref) {
+export var Choose = function Choose(_ref) {
   var children = _ref.children,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       _ref$active = _ref.active,
       active = _ref$active === void 0 ? false : _ref$active,
       className = _ref.className,
-      args = _objectWithoutProperties(_ref, _excluded);
+      args = _objectWithoutPropertiesLoose(_ref, _excluded);
 
-  return /*#__PURE__*/jsx(StyledChoose, _objectSpread(_objectSpread({
+  return /*#__PURE__*/React.createElement(StyledChoose, _extends({
     disabled: disabled,
-    className: classnames("c-choose", className),
+    className: classNames("c-choose", className),
     active: active
-  }, args), {}, {
-    children: children
-  }));
+  }, args), children);
 };
 Choose.displayName = "Choose";
-
-export { Choose };
-//# sourceMappingURL=Choose.js.map
+//# sourceMappingURL=Choose.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Choose.js","sources":["../../../../src/components/Choose/Choose.tsx"],"sourcesContent":["import React, { FC, BaseHTMLAttributes, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledChoose } from \"./Styles\";\n\nexport interface IChooseProps extends BaseHTMLAttributes<HTMLButtonElement> {\n  /** Children type of node or string */\n  children: ReactElement | string;\n  /** Disabled prop */\n  disabled?: boolean;\n  /** Active prop */\n  active?: boolean;\n  /** CSS classes */\n  className?: string;\n}\n\n/**\n * Choose component\n */\nexport const Choose: FC<IChooseProps> = ({\n  children,\n  disabled = false,\n  active = false,\n  className,\n  ...args\n}) => {\n  return (\n    <StyledChoose\n      disabled={disabled}\n      className={classNames(\"c-choose\", className)}\n      active={active}\n      {...args}\n    >\n      {children}\n    </StyledChoose>\n  );\n};\n\nChoose.displayName = \"Choose\";\n"],"names":["Choose","children","disabled","active","className","args","_jsx","classNames","displayName"],"mappings":";;;;;;;;;;;;;AAeA;AACA;AACA;IACaA,MAAwB,GAAG,SAA3BA,MAA2B,OAMlC;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,2BAJJC,QAII;AAAA,MAJJA,QAII,8BAJO,KAIP;AAAA,yBAHJC,MAGI;AAAA,MAHJA,MAGI,4BAHK,KAGL;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,IACC;;AACJ,sBACEC,IAAC,YAAD;AACE,IAAA,QAAQ,EAAEJ,QADZ;AAEE,IAAA,SAAS,EAAEK,UAAU,CAAC,UAAD,EAAaH,SAAb,CAFvB;AAGE,IAAA,MAAM,EAAED;AAHV,KAIME,IAJN;AAAA,cAMGJ;AANH,KADF;AAUD;AAEDD,MAAM,CAACQ,WAAP,GAAqB,QAArB;;;;"}
+{"version":3,"sources":["../../../../src/components/Choose/Choose.tsx"],"names":["React","classNames","StyledChoose","Choose","children","disabled","active","className","args","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,MAA4D,OAA5D;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,YAAT,QAA6B,UAA7B;;AAaA;AACA;AACA;AACA,OAAO,IAAMC,MAAwB,GAAG,SAA3BA,MAA2B,OAMlC;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,2BAJJC,QAII;AAAA,MAJJA,QAII,8BAJO,KAIP;AAAA,yBAHJC,MAGI;AAAA,MAHJA,MAGI,4BAHK,KAGL;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,IACC;;AACJ,sBACE,oBAAC,YAAD;AACE,IAAA,QAAQ,EAAEH,QADZ;AAEE,IAAA,SAAS,EAAEJ,UAAU,CAAC,UAAD,EAAaM,SAAb,CAFvB;AAGE,IAAA,MAAM,EAAED;AAHV,KAIME,IAJN,GAMGJ,QANH,CADF;AAUD,CAjBM;AAmBPD,MAAM,CAACM,WAAP,GAAqB,QAArB","sourcesContent":["import React, { FC, BaseHTMLAttributes, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { StyledChoose } from \"./Styles\";\n\nexport interface IChooseProps extends BaseHTMLAttributes<HTMLButtonElement> {\n  /** Children type of node or string */\n  children: ReactElement | string;\n  /** Disabled prop */\n  disabled?: boolean;\n  /** Active prop */\n  active?: boolean;\n  /** CSS classes */\n  className?: string;\n}\n\n/**\n * Choose component\n */\nexport const Choose: FC<IChooseProps> = ({\n  children,\n  disabled = false,\n  active = false,\n  className,\n  ...args\n}) => {\n  return (\n    <StyledChoose\n      disabled={disabled}\n      className={classNames(\"c-choose\", className)}\n      active={active}\n      {...args}\n    >\n      {children}\n    </StyledChoose>\n  );\n};\n\nChoose.displayName = \"Choose\";\n"],"file":"Choose.js"}

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

@@ -1,8 +1,7 @@
-import styled, { css } from 'styled-components';
-import { BoxSizingStyle } from '../BoxSizingStyle.js';
-import { FontStyle } from '../FontStyle.js';
-
-var StyledChoose = styled.button.withConfig({
+import styled, { css } from "styled-components";
+import { BoxSizingStyle } from "../BoxSizingStyle";
+import { FontStyle } from "../FontStyle";
+export var StyledChoose = styled.button.withConfig({
   displayName: "Styles__StyledChoose",
   componentId: "sc-1j2qv02-0"
 })(["", " ", " ", " ", " height:32px;padding:0 16px;transition:all 0.3s ease;border:1px solid var(--border-primary);font-size:13px;transition-duration:0.3s;&:hover{", " box-shadow:inset 0 0 5px 3px var(--color-primary-300);}", ""], {
@@ -29,6 +28,4 @@ var StyledChoose = styled.button.withConfig({
   });
 });
 StyledChoose.displayName = "StyledChoose";
-
-export { StyledChoose };
-//# sourceMappingURL=Styles.js.map
+//# sourceMappingURL=Styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","sources":["../../../../src/components/Choose/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { IChooseProps } from \"./Choose\";\n\nexport const StyledChoose = styled.button<IChooseProps>`\n  ${tw`tw-antialiased tw-align-middle tw-font-medium tw-inline-block tw-leading-none tw-m-0 tw-no-underline`}\n  ${tw`tw-select-none tw-cursor-pointer tw-text-center tw-rounded-lg tw-text-theme-700`}\n  ${FontStyle}\n  ${BoxSizingStyle}\n  height: 32px;\n  padding: 0 16px;\n  transition: all 0.3s ease;\n  border: 1px solid var(--border-primary);\n  font-size: 13px;\n  transition-duration: 0.3s;\n  &:hover {\n    ${tw`tw-border-primary`}\n    box-shadow: inset 0 0 5px 3px var(--color-primary-300);\n  }\n  ${(props) =>\n    props.active &&\n    css`\n      ${tw`tw-border-primary tw-z-0`}\n      background-color: var(--color-primary-300);\n    `}\n`;\n\nStyledChoose.displayName = \"StyledChoose\";\n"],"names":["StyledChoose","styled","button","FontStyle","BoxSizingStyle","props","active","css","displayName"],"mappings":";;;;IAMaA,YAAY,GAAGC,MAAM,CAACC,MAAV;AAAA;AAAA;AAAA,wOACnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CADmB,EAEnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAFmB,EAGrBC,SAHqB,EAIrBC,cAJqB,EAYjB;AAAA;AAAA,CAZiB,EAerB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,MAAN,IACAC,GADA,sDAEM;AAAA;AAAA;AAAA,GAFN,CADA;AAAA,CAfqB;AAuBzBP,YAAY,CAACQ,WAAb,GAA2B,cAA3B;;;;"}
+{"version":3,"sources":["../../../../src/components/Choose/Styles.ts"],"names":["styled","css","BoxSizingStyle","FontStyle","StyledChoose","button","props","active","displayName"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAGA,OAAO,IAAMC,YAAY,GAAGJ,MAAM,CAACK,MAAV;AAAA;AAAA;AAAA,wOACnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CADmB,EAEnB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAFmB,EAGrBF,SAHqB,EAIrBD,cAJqB,EAYjB;AAAA;AAAA,CAZiB,EAerB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,MAAN,IACAN,GADA,sDAEM;AAAA;AAAA;AAAA,GAFN,CADA;AAAA,CAfqB,CAAlB;AAuBPG,YAAY,CAACI,WAAb,GAA2B,cAA3B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { IChooseProps } from \"./Choose\";\n\nexport const StyledChoose = styled.button<IChooseProps>`\n  ${tw`tw-antialiased tw-align-middle tw-font-medium tw-inline-block tw-leading-none tw-m-0 tw-no-underline`}\n  ${tw`tw-select-none tw-cursor-pointer tw-text-center tw-rounded-lg tw-text-theme-700`}\n  ${FontStyle}\n  ${BoxSizingStyle}\n  height: 32px;\n  padding: 0 16px;\n  transition: all 0.3s ease;\n  border: 1px solid var(--border-primary);\n  font-size: 13px;\n  transition-duration: 0.3s;\n  &:hover {\n    ${tw`tw-border-primary`}\n    box-shadow: inset 0 0 5px 3px var(--color-primary-300);\n  }\n  ${(props) =>\n    props.active &&\n    css`\n      ${tw`tw-border-primary tw-z-0`}\n      background-color: var(--color-primary-300);\n    `}\n`;\n\nStyledChoose.displayName = \"StyledChoose\";\n"],"file":"Styles.js"}

package/dist/esm/components/Choose/index.js

@@ -0,0 +1,2 @@
+export * from "./Choose";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Choose/index.js.map

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

package/dist/esm/components/ComboBox/ComboBox.js

@@ -1,24 +1,17 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/esm/slicedToArray';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import { useMemo, useState, useCallback, useRef, useEffect } from 'react';
-import { Button } from '../Button/Button.js';
-import useForkRef from '../../utils/useForkRef.js';
-import { RemoveScroll } from 'react-remove-scroll';
-import { SpinnerLoader } from '../Loaders/Spinner/SpinnerLoader.js';
-import { OptionContent } from '../Select/OptionContent/OptionContent.js';
-import { StyledComboBox, StyledComboBoxWrapper, StyledComboBoxInput, StyledComboBoxCloseSmallIcon, StyledComboBoxCollapseExpandSingleIcon, StyledComboBoxList } from './Styles.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { RadioButton } from '../RadioButton/RadioButton.js';
-import { Popper } from '../Popper/Popper.js';
-import { Autocomplete } from '../Autocomplete/Autocomplete.js';
-
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 var _excluded = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled"];
-
-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 ComboBox = function ComboBox(_ref) {
+import React, { useCallback, useState, useEffect, useRef, useMemo } from "react";
+import { RadioButton } from "../RadioButton";
+import { Autocomplete } from "../Autocomplete";
+import { Button } from "../Button/Button";
+import useForkRef from "../../utils/useForkRef";
+import { Popper } from "../Popper";
+import { RemoveScroll } from "react-remove-scroll";
+import { SpinnerLoader } from "../Loaders/Spinner/SpinnerLoader";
+import { OptionContent } from "../Select/OptionContent/OptionContent";
+import { StyledComboBox, StyledComboBoxCloseSmallIcon, StyledComboBoxCollapseExpandSingleIcon, StyledComboBoxInput, StyledComboBoxList, StyledComboBoxWrapper } from "./Styles";
+export var ComboBox = function ComboBox(_ref) {
   var _formRef$current;
 
   var _ref$options = _ref.options,
@@ -32,7 +25,7 @@ var ComboBox = function ComboBox(_ref) {
       handleEmptyAction = _ref.handleEmptyAction,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      prop = _objectWithoutProperties(_ref, _excluded);
+      prop = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var selectedName = useMemo(function () {
     var value = "";
@@ -42,7 +35,7 @@ var ComboBox = function ComboBox(_ref) {
     }
 
     options.map(function (v) {
-      if (v !== null && v !== void 0 && v.options) {
+      if (v != null && v.options) {
         return v.options.find(function (q) {
           if (q.id === selected) {
             value = q.name;
@@ -60,26 +53,23 @@ var ComboBox = function ComboBox(_ref) {
   }, [options, selected]);
 
   var _useState = useState(selectedName),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
+      value = _useState[0],
+      setValue = _useState[1];
 
   var handleOnChange = useCallback(function (e) {
     return setValue(e.target.value);
   }, []);
 
-  var _useState3 = useState(),
-      _useState4 = _slicedToArray(_useState3, 2),
-      childNode = _useState4[0],
-      setChildNode = _useState4[1];
+  var _useState2 = useState(),
+      childNode = _useState2[0],
+      setChildNode = _useState2[1];
 
   var elementRef = useRef(null);
   var handleRef = useForkRef(setChildNode, elementRef);
 
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      open = _useState6[0],
-      setOpen = _useState6[1];
+  var _useState3 = useState(false),
+      open = _useState3[0],
+      setOpen = _useState3[1];
 
   var handleOnKeyDown = useCallback(function (e) {
     if (e.key === "Escape" && open) {
@@ -90,19 +80,19 @@ var ComboBox = function ComboBox(_ref) {
   }, [open, selectedName]);
   var formRef = useRef(null);
   useEffect(function () {
-    open && (childNode === null || childNode === void 0 ? void 0 : childNode.focus());
-    !open && (childNode === null || childNode === void 0 ? void 0 : childNode.blur());
+    open && (childNode == null ? void 0 : childNode.focus());
+    !open && (childNode == null ? void 0 : childNode.blur());
   }, [childNode, open]);
   useEffect(function () {
     setValue(selectedName);
   }, [selectedName]);
   var emptyAction = useCallback(function (v) {
-    handleEmptyAction === null || handleEmptyAction === void 0 ? void 0 : handleEmptyAction(v);
+    handleEmptyAction == null ? void 0 : handleEmptyAction(v);
     setOpen(false);
   }, [handleEmptyAction]);
   var handleChange = useCallback(function (selectedValue) {
     if (selectedValue) {
-      onChange === null || onChange === void 0 ? void 0 : onChange(selectedValue);
+      onChange == null ? void 0 : onChange(selectedValue);
       setOpen(false);
     }
   }, [onChange]);
@@ -118,77 +108,65 @@ var ComboBox = function ComboBox(_ref) {
     }
   }, [disabled]);
   var handleRenderOption = useCallback(function (option, props) {
-    return /*#__PURE__*/jsxs(Fragment, {
-      children: [/*#__PURE__*/jsx(OptionContent, {
-        imageUrl: option.image,
-        color: option.color,
-        textColor: option.textColor,
-        name: option.name
-      }), /*#__PURE__*/jsx(RadioButton, _objectSpread({}, props))]
-    });
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OptionContent, {
+      imageUrl: option.image,
+      color: option.color,
+      textColor: option.textColor,
+      name: option.name
+    }), /*#__PURE__*/React.createElement(RadioButton, props));
   }, []);
   var handleDeselect = useCallback(function (e) {
     e.stopPropagation();
-    onChange === null || onChange === void 0 ? void 0 : onChange("");
+    onChange == null ? void 0 : onChange("");
     setOpen(false);
   }, [onChange]);
   var handleMouseDown = useCallback(function (e) {
     e.preventDefault();
   }, []);
-  return /*#__PURE__*/jsxs(StyledComboBox, {
+  return /*#__PURE__*/React.createElement(StyledComboBox, {
     className: "c-combo-box",
     $open: open,
-    $loading: loading,
-    children: [/*#__PURE__*/jsxs(StyledComboBoxWrapper, {
-      onClick: onOpen,
-      onFocus: onOpen,
-      onBlur: onClose,
-      ref: formRef,
-      $loading: loading,
-      children: [/*#__PURE__*/jsx(StyledComboBoxInput, {
-        ref: handleRef,
-        value: loading && loadingText ? loadingText : value,
-        onKeyDown: handleOnKeyDown,
-        onChange: handleOnChange,
-        placeholder: placeholder,
-        disabled: disabled
-      }), !disabled ? /*#__PURE__*/jsxs(Fragment, {
-        children: [loading ? /*#__PURE__*/jsx(SpinnerLoader, {}) : selected ? /*#__PURE__*/jsx(Button, {
-          onMouseDown: handleMouseDown,
-          onClick: handleDeselect,
-          variant: "text gray",
-          children: /*#__PURE__*/jsx(StyledComboBoxCloseSmallIcon, {})
-        }) : null, /*#__PURE__*/jsx(StyledComboBoxCollapseExpandSingleIcon, {
-          $open: open
-        })]
-      }) : null]
-    }), !disabled ? /*#__PURE__*/jsx(Popper, {
-      anchorEl: formRef.current,
-      open: open,
-      placement: "bottom",
-      style: {
-        zIndex: 10
-      },
-      children: /*#__PURE__*/jsx(RemoveScroll, {
-        noIsolation: true,
-        allowPinchZoom: true,
-        children: /*#__PURE__*/jsx(StyledComboBoxList, {
-          $width: (_formRef$current = formRef.current) === null || _formRef$current === void 0 ? void 0 : _formRef$current.clientWidth,
-          children: /*#__PURE__*/jsx(Autocomplete, _objectSpread(_objectSpread({}, prop), {}, {
-            inputEl: childNode,
-            selected: selected,
-            handleChange: handleChange,
-            renderOption: handleRenderOption,
-            options: options,
-            type: "single",
-            handleEmptyAction: emptyAction
-          }))
-        })
-      })
-    }) : null]
-  });
+    $loading: loading
+  }, /*#__PURE__*/React.createElement(StyledComboBoxWrapper, {
+    onClick: onOpen,
+    onFocus: onOpen,
+    onBlur: onClose,
+    ref: formRef,
+    $loading: loading
+  }, /*#__PURE__*/React.createElement(StyledComboBoxInput, {
+    ref: handleRef,
+    value: loading && loadingText ? loadingText : value,
+    onKeyDown: handleOnKeyDown,
+    onChange: handleOnChange,
+    placeholder: placeholder,
+    disabled: disabled
+  }), !disabled ? /*#__PURE__*/React.createElement(React.Fragment, null, loading ? /*#__PURE__*/React.createElement(SpinnerLoader, null) : selected ? /*#__PURE__*/React.createElement(Button, {
+    onMouseDown: handleMouseDown,
+    onClick: handleDeselect,
+    variant: "text gray"
+  }, /*#__PURE__*/React.createElement(StyledComboBoxCloseSmallIcon, null)) : null, /*#__PURE__*/React.createElement(StyledComboBoxCollapseExpandSingleIcon, {
+    $open: open
+  })) : null), !disabled ? /*#__PURE__*/React.createElement(Popper, {
+    anchorEl: formRef.current,
+    open: open,
+    placement: "bottom",
+    style: {
+      zIndex: 10
+    }
+  }, /*#__PURE__*/React.createElement(RemoveScroll, {
+    noIsolation: true,
+    allowPinchZoom: true
+  }, /*#__PURE__*/React.createElement(StyledComboBoxList, {
+    $width: (_formRef$current = formRef.current) == null ? void 0 : _formRef$current.clientWidth
+  }, /*#__PURE__*/React.createElement(Autocomplete, _extends({}, prop, {
+    inputEl: childNode,
+    selected: selected,
+    handleChange: handleChange,
+    renderOption: handleRenderOption,
+    options: options,
+    type: "single",
+    handleEmptyAction: emptyAction
+  }))))) : null);
 };
 ComboBox.displayName = "ComboBox";
-
-export { ComboBox };
-//# sourceMappingURL=ComboBox.js.map
+//# sourceMappingURL=ComboBox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.js","sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useEffect,\n  useRef,\n  useMemo,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n  StyledComboBox,\n  StyledComboBoxCloseSmallIcon,\n  StyledComboBoxCollapseExpandSingleIcon,\n  StyledComboBoxInput,\n  StyledComboBoxList,\n  StyledComboBoxWrapper,\n} from \"./Styles\";\n\ninterface IComboBoxProps {\n  /** Set selected items */\n  selected?: string | number;\n  /** Set combobox in to loading state */\n  loading?: boolean;\n  /** Text to display while in loading state */\n  loadingText?: string;\n  /** onChange callback */\n  onChange?: (e: string | number) => void;\n  /** Placeholder for Select input */\n  placeholder?: string;\n  /** disable Input element */\n  disabled?: boolean;\n}\n\nexport const ComboBox: FC<IComboBoxProps & IAutocompleteProps> = ({\n  options = [],\n  selected,\n  loading = false,\n  loadingText,\n  onChange,\n  placeholder,\n  handleEmptyAction,\n  disabled = false,\n  ...prop\n}) => {\n  const selectedName = useMemo(() => {\n    let value = \"\";\n    if (!selected) {\n      return value;\n    }\n    options.map((v) => {\n      if ((v as IOptionGroupProps)?.options) {\n        return (v as IOptionGroupProps).options.find((q) => {\n          if (q.id === selected) {\n            value = q.name;\n            return;\n          }\n        });\n      } else {\n        if (v.id === selected) {\n          value = v.name;\n          return;\n        }\n      }\n    });\n    return value;\n  }, [options, selected]);\n  const [value, setValue] = useState(selectedName);\n  const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n  const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n  const elementRef = useRef<HTMLInputElement | null>(null);\n  const handleRef = useForkRef(setChildNode, elementRef);\n\n  const [open, setOpen] = useState(false);\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Escape\" && open) {\n        setOpen(false);\n        setValue(selectedName);\n        e.stopPropagation();\n      }\n    },\n    [open, selectedName]\n  );\n\n  const formRef = useRef<HTMLDivElement | null>(null);\n\n  useEffect(() => {\n    open && childNode?.focus();\n    !open && childNode?.blur();\n  }, [childNode, open]);\n\n  useEffect(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const emptyAction = useCallback(\n    (v) => {\n      handleEmptyAction?.(v);\n      setOpen(false);\n    },\n    [handleEmptyAction]\n  );\n\n  const handleChange = useCallback(\n    (selectedValue) => {\n      if (selectedValue) {\n        onChange?.(selectedValue);\n        setOpen(false);\n      }\n    },\n    [onChange]\n  );\n\n  const onClose = useCallback(() => {\n    setTimeout(() => {\n      setOpen(false);\n    }, 200);\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const onOpen = useCallback(() => {\n    if (!disabled) {\n      setOpen(true);\n    }\n  }, [disabled]);\n\n  const handleRenderOption = useCallback((option, props) => {\n    return (\n      <>\n        <OptionContent\n          imageUrl={option.image}\n          color={option.color}\n          textColor={option.textColor}\n          name={option.name}\n        />\n        <RadioButton {...props} />\n      </>\n    );\n  }, []);\n\n  const handleDeselect = useCallback(\n    (e) => {\n      e.stopPropagation();\n      onChange?.(\"\");\n      setOpen(false);\n    },\n    [onChange]\n  );\n\n  const handleMouseDown = useCallback((e) => {\n    e.preventDefault();\n  }, []);\n\n  return (\n    <StyledComboBox className=\"c-combo-box\" $open={open} $loading={loading}>\n      <StyledComboBoxWrapper\n        onClick={onOpen}\n        onFocus={onOpen}\n        onBlur={onClose}\n        ref={formRef}\n        $loading={loading}\n      >\n        <StyledComboBoxInput\n          ref={handleRef}\n          value={loading && loadingText ? loadingText : value}\n          onKeyDown={handleOnKeyDown}\n          onChange={handleOnChange}\n          placeholder={placeholder}\n          disabled={disabled}\n        />\n        {!disabled ? (\n          <>\n            {loading ? (\n              <SpinnerLoader />\n            ) : selected ? (\n              <Button\n                onMouseDown={handleMouseDown}\n                onClick={handleDeselect}\n                variant=\"text gray\"\n              >\n                <StyledComboBoxCloseSmallIcon />\n              </Button>\n            ) : null}\n            <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n          </>\n        ) : null}\n      </StyledComboBoxWrapper>\n      {!disabled ? (\n        <Popper\n          anchorEl={formRef.current}\n          open={open}\n          placement=\"bottom\"\n          style={{ zIndex: 10 }}\n        >\n          <RemoveScroll noIsolation allowPinchZoom>\n            <StyledComboBoxList $width={formRef.current?.clientWidth}>\n              <Autocomplete\n                {...prop}\n                inputEl={childNode}\n                selected={selected}\n                handleChange={handleChange}\n                renderOption={handleRenderOption}\n                options={options}\n                type=\"single\"\n                handleEmptyAction={emptyAction}\n              />\n            </StyledComboBoxList>\n          </RemoveScroll>\n        </Popper>\n      ) : null}\n    </StyledComboBox>\n  );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"names":["ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","prop","selectedName","useMemo","value","map","v","find","q","id","name","useState","setValue","handleOnChange","useCallback","e","target","childNode","setChildNode","elementRef","useRef","handleRef","useForkRef","open","setOpen","handleOnKeyDown","key","stopPropagation","formRef","useEffect","focus","blur","emptyAction","handleChange","selectedValue","onClose","setTimeout","onOpen","handleRenderOption","option","props","_jsxs","_jsx","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","current","zIndex","clientWidth","displayName"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":["React","useCallback","useState","useEffect","useRef","useMemo","RadioButton","Autocomplete","Button","useForkRef","Popper","RemoveScroll","SpinnerLoader","OptionContent","StyledComboBox","StyledComboBoxCloseSmallIcon","StyledComboBoxCollapseExpandSingleIcon","StyledComboBoxInput","StyledComboBoxList","StyledComboBoxWrapper","ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","prop","selectedName","value","map","v","find","q","id","name","setValue","handleOnChange","e","target","childNode","setChildNode","elementRef","handleRef","open","setOpen","handleOnKeyDown","key","stopPropagation","formRef","focus","blur","emptyAction","handleChange","selectedValue","onClose","setTimeout","onOpen","handleRenderOption","option","props","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","current","zIndex","clientWidth","displayName"],"mappings":"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","sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useEffect,\n  useRef,\n  useMemo,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport { IAutocompleteProps } from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n  StyledComboBox,\n  StyledComboBoxCloseSmallIcon,\n  StyledComboBoxCollapseExpandSingleIcon,\n  StyledComboBoxInput,\n  StyledComboBoxList,\n  StyledComboBoxWrapper,\n} from \"./Styles\";\n\ninterface IComboBoxProps {\n  /** Set selected items */\n  selected?: string | number;\n  /** Set combobox in to loading state */\n  loading?: boolean;\n  /** Text to display while in loading state */\n  loadingText?: string;\n  /** onChange callback */\n  onChange?: (e: string | number) => void;\n  /** Placeholder for Select input */\n  placeholder?: string;\n  /** disable Input element */\n  disabled?: boolean;\n}\n\nexport const ComboBox: FC<IComboBoxProps & IAutocompleteProps> = ({\n  options = [],\n  selected,\n  loading = false,\n  loadingText,\n  onChange,\n  placeholder,\n  handleEmptyAction,\n  disabled = false,\n  ...prop\n}) => {\n  const selectedName = useMemo(() => {\n    let value = \"\";\n    if (!selected) {\n      return value;\n    }\n    options.map((v) => {\n      if ((v as IOptionGroupProps)?.options) {\n        return (v as IOptionGroupProps).options.find((q) => {\n          if (q.id === selected) {\n            value = q.name;\n            return;\n          }\n        });\n      } else {\n        if (v.id === selected) {\n          value = v.name;\n          return;\n        }\n      }\n    });\n    return value;\n  }, [options, selected]);\n  const [value, setValue] = useState(selectedName);\n  const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n  const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n  const elementRef = useRef<HTMLInputElement | null>(null);\n  const handleRef = useForkRef(setChildNode, elementRef);\n\n  const [open, setOpen] = useState(false);\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Escape\" && open) {\n        setOpen(false);\n        setValue(selectedName);\n        e.stopPropagation();\n      }\n    },\n    [open, selectedName]\n  );\n\n  const formRef = useRef<HTMLDivElement | null>(null);\n\n  useEffect(() => {\n    open && childNode?.focus();\n    !open && childNode?.blur();\n  }, [childNode, open]);\n\n  useEffect(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const emptyAction = useCallback(\n    (v) => {\n      handleEmptyAction?.(v);\n      setOpen(false);\n    },\n    [handleEmptyAction]\n  );\n\n  const handleChange = useCallback(\n    (selectedValue) => {\n      if (selectedValue) {\n        onChange?.(selectedValue);\n        setOpen(false);\n      }\n    },\n    [onChange]\n  );\n\n  const onClose = useCallback(() => {\n    setTimeout(() => {\n      setOpen(false);\n    }, 200);\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const onOpen = useCallback(() => {\n    if (!disabled) {\n      setOpen(true);\n    }\n  }, [disabled]);\n\n  const handleRenderOption = useCallback((option, props) => {\n    return (\n      <>\n        <OptionContent\n          imageUrl={option.image}\n          color={option.color}\n          textColor={option.textColor}\n          name={option.name}\n        />\n        <RadioButton {...props} />\n      </>\n    );\n  }, []);\n\n  const handleDeselect = useCallback(\n    (e) => {\n      e.stopPropagation();\n      onChange?.(\"\");\n      setOpen(false);\n    },\n    [onChange]\n  );\n\n  const handleMouseDown = useCallback((e) => {\n    e.preventDefault();\n  }, []);\n\n  return (\n    <StyledComboBox className=\"c-combo-box\" $open={open} $loading={loading}>\n      <StyledComboBoxWrapper\n        onClick={onOpen}\n        onFocus={onOpen}\n        onBlur={onClose}\n        ref={formRef}\n        $loading={loading}\n      >\n        <StyledComboBoxInput\n          ref={handleRef}\n          value={loading && loadingText ? loadingText : value}\n          onKeyDown={handleOnKeyDown}\n          onChange={handleOnChange}\n          placeholder={placeholder}\n          disabled={disabled}\n        />\n        {!disabled ? (\n          <>\n            {loading ? (\n              <SpinnerLoader />\n            ) : selected ? (\n              <Button\n                onMouseDown={handleMouseDown}\n                onClick={handleDeselect}\n                variant=\"text gray\"\n              >\n                <StyledComboBoxCloseSmallIcon />\n              </Button>\n            ) : null}\n            <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n          </>\n        ) : null}\n      </StyledComboBoxWrapper>\n      {!disabled ? (\n        <Popper\n          anchorEl={formRef.current}\n          open={open}\n          placement=\"bottom\"\n          style={{ zIndex: 10 }}\n        >\n          <RemoveScroll noIsolation allowPinchZoom>\n            <StyledComboBoxList $width={formRef.current?.clientWidth}>\n              <Autocomplete\n                {...prop}\n                inputEl={childNode}\n                selected={selected}\n                handleChange={handleChange}\n                renderOption={handleRenderOption}\n                options={options}\n                type=\"single\"\n                handleEmptyAction={emptyAction}\n              />\n            </StyledComboBoxList>\n          </RemoveScroll>\n        </Popper>\n      ) : null}\n    </StyledComboBox>\n  );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"file":"ComboBox.js"}