@activecollab/components 2.0.90 → 2.0.91

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

@@ -1,21 +1,12 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Checkbox = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _CheckboxIcon = _interopRequireDefault(require("./CheckboxIcon"));
-var _Styles = require("./Styles");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { forwardRef, useState, useCallback, useEffect } from "react";
+import classnames from "classnames";
+import CheckboxIcon from "./CheckboxIcon";
+import { StyledCheckbox, StyledInput, StyledLabel } from "./Styles";
 /**
  * Checkbox component
  */
-const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+export const Checkbox = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
     className,
     hover,
@@ -26,28 +17,28 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((_ref, r
     disabled,
     ...rest
   } = _ref;
-  const [indeterminate, setIndeterminate] = (0, _react.useState)(mixed && !checked);
-  const [initialChecked, setInitialChecked] = (0, _react.useState)(checked);
-  const handleChange = (0, _react.useCallback)(e => {
+  const [indeterminate, setIndeterminate] = useState(mixed && !checked);
+  const [initialChecked, setInitialChecked] = useState(checked);
+  const handleChange = useCallback(e => {
     typeof onChange === "function" && onChange(e);
     setInitialChecked(prev => !prev);
     setIndeterminate(false);
   }, [onChange]);
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     if (checked !== initialChecked) {
       setInitialChecked(checked);
       setIndeterminate(false);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [checked]);
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     if (mixed !== indeterminate && !checked) {
       setIndeterminate(mixed);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [mixed]);
-  return /*#__PURE__*/_react.default.createElement(_Styles.StyledCheckbox, {
-    className: (0, _classnames.default)("c-checkbox", {
+  return /*#__PURE__*/React.createElement(StyledCheckbox, {
+    className: classnames("c-checkbox", {
       "c-checkbox__hover": hover,
       "c-checkbox__controlled": typeof hover === "boolean"
     }, className),
@@ -55,7 +46,7 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((_ref, r
     tabIndex: -1,
     mixed: indeterminate,
     $disabled: disabled
-  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledInput, (0, _extends2.default)({
+  }, /*#__PURE__*/React.createElement(StyledInput, _extends({
     role: "checkbox",
     id: id,
     className: "c-checkbox--input",
@@ -65,10 +56,10 @@ const Checkbox = exports.Checkbox = /*#__PURE__*/(0, _react.forwardRef)((_ref, r
     checked: initialChecked,
     onChange: handleChange,
     disabled: disabled
-  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledLabel, {
+  })), /*#__PURE__*/React.createElement(StyledLabel, {
     htmlFor: id,
     className: "c-checkbox--label"
-  }, /*#__PURE__*/_react.default.createElement(_CheckboxIcon.default, {
+  }, /*#__PURE__*/React.createElement(CheckboxIcon, {
     "data-testid": "checkbox-icon",
     height: 16,
     width: 16,

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_CheckboxIcon","_Styles","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Checkbox","exports","forwardRef","_ref","ref","className","hover","id","mixed","checked","onChange","disabled","rest","indeterminate","setIndeterminate","useState","initialChecked","setInitialChecked","handleChange","useCallback","prev","useEffect","createElement","StyledCheckbox","classnames","tabIndex","$disabled","StyledInput","_extends2","role","type","StyledLabel","htmlFor","height","width","displayName"],"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  InputHTMLAttributes,\n  useState,\n  useCallback,\n  useEffect,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport CheckboxIcon from \"./CheckboxIcon\";\nimport { StyledCheckbox, StyledInput, StyledLabel } from \"./Styles\";\n\nexport interface CheckBoxProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"onChange\"> {\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  /** mixed state */\n  mixed?: boolean;\n  /** On change callback */\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\n/**\n * Checkbox component\n */\nexport const Checkbox = forwardRef(\n  (\n    {\n      className,\n      hover,\n      id = \"checkbox\",\n      mixed = false,\n      checked,\n      onChange,\n      disabled,\n      ...rest\n    }: CheckBoxProps,\n    ref: Ref<HTMLInputElement> | null | undefined\n  ) => {\n    const [indeterminate, setIndeterminate] = useState(mixed && !checked);\n    const [initialChecked, setInitialChecked] = useState(checked);\n    const handleChange = useCallback(\n      (e) => {\n        typeof onChange === \"function\" && onChange(e);\n        setInitialChecked((prev) => !prev);\n        setIndeterminate(false);\n      },\n      [onChange]\n    );\n\n    useEffect(() => {\n      if (checked !== initialChecked) {\n        setInitialChecked(checked);\n        setIndeterminate(false);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [checked]);\n\n    useEffect(() => {\n      if (mixed !== indeterminate && !checked) {\n        setIndeterminate(mixed);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [mixed]);\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        tabIndex={-1}\n        mixed={indeterminate}\n        $disabled={disabled}\n      >\n        <StyledInput\n          role=\"checkbox\"\n          id={id}\n          className=\"c-checkbox--input\"\n          type=\"checkbox\"\n          ref={ref}\n          {...rest}\n          checked={initialChecked}\n          onChange={handleChange}\n          disabled={disabled}\n        />\n        <StyledLabel htmlFor={id} className=\"c-checkbox--label\">\n          <CheckboxIcon\n            data-testid=\"checkbox-icon\"\n            height={16}\n            width={16}\n            mixed={indeterminate}\n          />\n        </StyledLabel>\n      </StyledCheckbox>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","names":["React","forwardRef","useState","useCallback","useEffect","classnames","CheckboxIcon","StyledCheckbox","StyledInput","StyledLabel","Checkbox","_ref","ref","className","hover","id","mixed","checked","onChange","disabled","rest","indeterminate","setIndeterminate","initialChecked","setInitialChecked","handleChange","e","prev","createElement","tabIndex","$disabled","_extends","role","type","htmlFor","height","width","displayName"],"sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  Ref,\n  InputHTMLAttributes,\n  useState,\n  useCallback,\n  useEffect,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport CheckboxIcon from \"./CheckboxIcon\";\nimport { StyledCheckbox, StyledInput, StyledLabel } from \"./Styles\";\n\nexport interface CheckBoxProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"onChange\"> {\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  /** mixed state */\n  mixed?: boolean;\n  /** On change callback */\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\n/**\n * Checkbox component\n */\nexport const Checkbox = forwardRef(\n  (\n    {\n      className,\n      hover,\n      id = \"checkbox\",\n      mixed = false,\n      checked,\n      onChange,\n      disabled,\n      ...rest\n    }: CheckBoxProps,\n    ref: Ref<HTMLInputElement> | null | undefined\n  ) => {\n    const [indeterminate, setIndeterminate] = useState(mixed && !checked);\n    const [initialChecked, setInitialChecked] = useState(checked);\n    const handleChange = useCallback(\n      (e) => {\n        typeof onChange === \"function\" && onChange(e);\n        setInitialChecked((prev) => !prev);\n        setIndeterminate(false);\n      },\n      [onChange]\n    );\n\n    useEffect(() => {\n      if (checked !== initialChecked) {\n        setInitialChecked(checked);\n        setIndeterminate(false);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [checked]);\n\n    useEffect(() => {\n      if (mixed !== indeterminate && !checked) {\n        setIndeterminate(mixed);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [mixed]);\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        tabIndex={-1}\n        mixed={indeterminate}\n        $disabled={disabled}\n      >\n        <StyledInput\n          role=\"checkbox\"\n          id={id}\n          className=\"c-checkbox--input\"\n          type=\"checkbox\"\n          ref={ref}\n          {...rest}\n          checked={initialChecked}\n          onChange={handleChange}\n          disabled={disabled}\n        />\n        <StyledLabel htmlFor={id} className=\"c-checkbox--label\">\n          <CheckboxIcon\n            data-testid=\"checkbox-icon\"\n            height={16}\n            width={16}\n            mixed={indeterminate}\n          />\n        </StyledLabel>\n      </StyledCheckbox>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\n"],"mappings":";AAAA,OAAOA,KAAK,IACVC,UAAU,EAGVC,QAAQ,EACRC,WAAW,EACXC,SAAS,QACJ,OAAO;AAEd,OAAOC,UAAU,MAAM,YAAY;AAEnC,OAAOC,YAAY,MAAM,gBAAgB;AACzC,SAASC,cAAc,EAAEC,WAAW,EAAEC,WAAW,QAAQ,UAAU;AAgBnE;AACA;AACA;AACA,OAAO,MAAMC,QAAQ,gBAAGT,UAAU,CAChC,CAAAU,IAAA,EAWEC,GAA6C,KAC1C;EAAA,IAXH;IACEC,SAAS;IACTC,KAAK;IACLC,EAAE,GAAG,UAAU;IACfC,KAAK,GAAG,KAAK;IACbC,OAAO;IACPC,QAAQ;IACRC,QAAQ;IACR,GAAGC;EACU,CAAC,GAAAT,IAAA;EAGhB,MAAM,CAACU,aAAa,EAAEC,gBAAgB,CAAC,GAAGpB,QAAQ,CAACc,KAAK,IAAI,CAACC,OAAO,CAAC;EACrE,MAAM,CAACM,cAAc,EAAEC,iBAAiB,CAAC,GAAGtB,QAAQ,CAACe,OAAO,CAAC;EAC7D,MAAMQ,YAAY,GAAGtB,WAAW,CAC7BuB,CAAC,IAAK;IACL,OAAOR,QAAQ,KAAK,UAAU,IAAIA,QAAQ,CAACQ,CAAC,CAAC;IAC7CF,iBAAiB,CAAEG,IAAI,IAAK,CAACA,IAAI,CAAC;IAClCL,gBAAgB,CAAC,KAAK,CAAC;EACzB,CAAC,EACD,CAACJ,QAAQ,CACX,CAAC;EAEDd,SAAS,CAAC,MAAM;IACd,IAAIa,OAAO,KAAKM,cAAc,EAAE;MAC9BC,iBAAiB,CAACP,OAAO,CAAC;MAC1BK,gBAAgB,CAAC,KAAK,CAAC;IACzB;IACA;EACF,CAAC,EAAE,CAACL,OAAO,CAAC,CAAC;EAEbb,SAAS,CAAC,MAAM;IACd,IAAIY,KAAK,KAAKK,aAAa,IAAI,CAACJ,OAAO,EAAE;MACvCK,gBAAgB,CAACN,KAAK,CAAC;IACzB;IACA;EACF,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,oBACEhB,KAAA,CAAA4B,aAAA,CAACrB,cAAc;IACbM,SAAS,EAAER,UAAU,CACnB,YAAY,EACZ;MACE,mBAAmB,EAAES,KAAK;MAC1B,wBAAwB,EAAE,OAAOA,KAAK,KAAK;IAC7C,CAAC,EACDD,SACF,CAAE;IACFC,KAAK,EAAEA,KAAM;IACbe,QAAQ,EAAE,CAAC,CAAE;IACbb,KAAK,EAAEK,aAAc;IACrBS,SAAS,EAAEX;EAAS,gBAEpBnB,KAAA,CAAA4B,aAAA,CAACpB,WAAW,EAAAuB,QAAA;IACVC,IAAI,EAAC,UAAU;IACfjB,EAAE,EAAEA,EAAG;IACPF,SAAS,EAAC,mBAAmB;IAC7BoB,IAAI,EAAC,UAAU;IACfrB,GAAG,EAAEA;EAAI,GACLQ,IAAI;IACRH,OAAO,EAAEM,cAAe;IACxBL,QAAQ,EAAEO,YAAa;IACvBN,QAAQ,EAAEA;EAAS,EACpB,CAAC,eACFnB,KAAA,CAAA4B,aAAA,CAACnB,WAAW;IAACyB,OAAO,EAAEnB,EAAG;IAACF,SAAS,EAAC;EAAmB,gBACrDb,KAAA,CAAA4B,aAAA,CAACtB,YAAY;IACX,eAAY,eAAe;IAC3B6B,MAAM,EAAE,EAAG;IACXC,KAAK,EAAE,EAAG;IACVpB,KAAK,EAAEK;EAAc,CACtB,CACU,CACC,CAAC;AAErB,CACF,CAAC;AAEDX,QAAQ,CAAC2B,WAAW,GAAG,UAAU"}

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

@@ -1,12 +1,6 @@
-"use strict";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React from "react";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-var _react = _interopRequireDefault(require("react"));
 /**
  * @component CheckboxIcon
  * @description
@@ -26,7 +20,7 @@ var _react = _interopRequireDefault(require("react"));
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const CheckboxIcon = /*#__PURE__*/_react.default.forwardRef((_ref, svgRef) => {
+const CheckboxIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
   let {
     mixed,
     "data-testid": testId,
@@ -44,19 +38,19 @@ const CheckboxIcon = /*#__PURE__*/_react.default.forwardRef((_ref, svgRef) => {
   // }, [mixed]);
 
   if (mixed) {
-    return /*#__PURE__*/_react.default.createElement("svg", {
+    return /*#__PURE__*/React.createElement("svg", {
       width: "16",
       height: "16",
       viewBox: "0 0 16 16",
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       "data-testid": "checkbox-mixed-icon"
-    }, /*#__PURE__*/_react.default.createElement("path", {
+    }, /*#__PURE__*/React.createElement("path", {
       fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M14.2222 0C15.2041 0 16 0.795938 16 1.77778V14.2222C16 15.2041 15.2041 16 14.2222 16H1.77778C0.795938 16 0 15.2041 0 14.2222V1.77778C0 0.795938 0.795938 0 1.77778 0H14.2222Z",
       fill: "var(--color-secondary)"
-    }), /*#__PURE__*/_react.default.createElement("rect", {
+    }), /*#__PURE__*/React.createElement("rect", {
       x: "3",
       y: "7",
       width: 10,
@@ -65,7 +59,7 @@ const CheckboxIcon = /*#__PURE__*/_react.default.forwardRef((_ref, svgRef) => {
       fill: "var(--page-paper-main)"
     }));
   }
-  return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({
+  return /*#__PURE__*/React.createElement("svg", _extends({
     width: 16,
     height: 16,
     viewBox: "0 0 16 16",
@@ -75,21 +69,21 @@ const CheckboxIcon = /*#__PURE__*/_react.default.forwardRef((_ref, svgRef) => {
     ref: svgRef
   }, props, {
     "data-testid": testId
-  }), /*#__PURE__*/_react.default.createElement("g", {
+  }), /*#__PURE__*/React.createElement("g", {
     fillRule: "evenodd"
-  }, /*#__PURE__*/_react.default.createElement("rect", {
+  }, /*#__PURE__*/React.createElement("rect", {
     stroke: "#8E8E8E",
     x: 0.5,
     y: 0.5,
     width: 15,
     height: 15,
     rx: 2
-  }), /*#__PURE__*/_react.default.createElement("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     stroke: "#979797",
     strokeWidth: 2,
     d: "M12.243 5l-5.657 5.657-2.829-2.829"
   })));
 });
 CheckboxIcon.displayName = "CheckboxIcon";
-var _default = exports.default = CheckboxIcon;
+export default CheckboxIcon;
 //# sourceMappingURL=CheckboxIcon.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CheckboxIcon.js","names":["_react","_interopRequireDefault","require","CheckboxIcon","React","forwardRef","_ref","svgRef","mixed","testId","props","default","createElement","width","height","viewBox","fill","xmlns","fillRule","clipRule","d","x","y","rx","_extends2","focusable","ref","stroke","strokeWidth","displayName","_default","exports"],"sources":["../../../../src/components/Checkbox/CheckboxIcon.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component CheckboxIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <CheckboxIcon className=\"mr-2\" showAdditionalIcon={true} />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst CheckboxIcon = React.forwardRef(\n  (\n    {\n      mixed,\n      \"data-testid\": testId,\n      ...props\n    }: {\n      mixed?: boolean;\n      \"data-testid\"?: string;\n    } & React.SVGProps<SVGSVGElement>,\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => {\n    // const [animate, setAnimate] = useState(false);\n    // const mountRef = useRef(false);\n\n    // useEffect(() => {\n    //   if (mountRef.current) {\n    //     setAnimate(true);\n    //   } else {\n    //     mountRef.current = true;\n    //   }\n    // }, [mixed]);\n\n    if (mixed) {\n      return (\n        <svg\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          data-testid=\"checkbox-mixed-icon\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M14.2222 0C15.2041 0 16 0.795938 16 1.77778V14.2222C16 15.2041 15.2041 16 14.2222 16H1.77778C0.795938 16 0 15.2041 0 14.2222V1.77778C0 0.795938 0.795938 0 1.77778 0H14.2222Z\"\n            fill=\"var(--color-secondary)\"\n          />\n          <rect\n            x=\"3\"\n            y=\"7\"\n            width={10}\n            height=\"2\"\n            rx=\"1\"\n            fill=\"var(--page-paper-main)\"\n          ></rect>\n        </svg>\n      );\n    }\n    return (\n      <svg\n        width={16}\n        height={16}\n        viewBox=\"0 0 16 16\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"var(--color-theme-600)\"\n        focusable={false}\n        ref={svgRef}\n        {...props}\n        data-testid={testId}\n      >\n        <g fillRule=\"evenodd\">\n          <rect\n            stroke=\"#8E8E8E\"\n            x={0.5}\n            y={0.5}\n            width={15}\n            height={15}\n            rx={2}\n          />\n          <path\n            stroke=\"#979797\"\n            strokeWidth={2}\n            d=\"M12.243 5l-5.657 5.657-2.829-2.829\"\n          />\n        </g>\n      </svg>\n    );\n  }\n);\nCheckboxIcon.displayName = \"CheckboxIcon\";\nexport default CheckboxIcon;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAAY,gBAAGC,cAAK,CAACC,UAAU,CACnC,CAAAC,IAAA,EASEC,MAAiC,KAC9B;EAAA,IATH;IACEC,KAAK;IACL,aAAa,EAAEC,MAAM;IACrB,GAAGC;EAI2B,CAAC,GAAAJ,IAAA;EAGjC;EACA;;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;EAEA,IAAIE,KAAK,EAAE;IACT,oBACER,MAAA,CAAAW,OAAA,CAAAC,aAAA;MACEC,KAAK,EAAC,IAAI;MACVC,MAAM,EAAC,IAAI;MACXC,OAAO,EAAC,WAAW;MACnBC,IAAI,EAAC,MAAM;MACXC,KAAK,EAAC,4BAA4B;MAClC,eAAY;IAAqB,gBAEjCjB,MAAA,CAAAW,OAAA,CAAAC,aAAA;MACEM,QAAQ,EAAC,SAAS;MAClBC,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC,+KAA+K;MACjLJ,IAAI,EAAC;IAAwB,CAC9B,CAAC,eACFhB,MAAA,CAAAW,OAAA,CAAAC,aAAA;MACES,CAAC,EAAC,GAAG;MACLC,CAAC,EAAC,GAAG;MACLT,KAAK,EAAE,EAAG;MACVC,MAAM,EAAC,GAAG;MACVS,EAAE,EAAC,GAAG;MACNP,IAAI,EAAC;IAAwB,CACxB,CACJ,CAAC;EAEV;EACA,oBACEhB,MAAA,CAAAW,OAAA,CAAAC,aAAA,YAAAY,SAAA,CAAAb,OAAA;IACEE,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBE,KAAK,EAAC,4BAA4B;IAClCD,IAAI,EAAC,wBAAwB;IAC7BS,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEnB;EAAO,GACRG,KAAK;IACT,eAAaD;EAAO,iBAEpBT,MAAA,CAAAW,OAAA,CAAAC,aAAA;IAAGM,QAAQ,EAAC;EAAS,gBACnBlB,MAAA,CAAAW,OAAA,CAAAC,aAAA;IACEe,MAAM,EAAC,SAAS;IAChBN,CAAC,EAAE,GAAI;IACPC,CAAC,EAAE,GAAI;IACPT,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXS,EAAE,EAAE;EAAE,CACP,CAAC,eACFvB,MAAA,CAAAW,OAAA,CAAAC,aAAA;IACEe,MAAM,EAAC,SAAS;IAChBC,WAAW,EAAE,CAAE;IACfR,CAAC,EAAC;EAAoC,CACvC,CACA,CACA,CAAC;AAEV,CACF,CAAC;AACDjB,YAAY,CAAC0B,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAApB,OAAA,GAC3BR,YAAY"}
+{"version":3,"file":"CheckboxIcon.js","names":["React","CheckboxIcon","forwardRef","_ref","svgRef","mixed","testId","props","createElement","width","height","viewBox","fill","xmlns","fillRule","clipRule","d","x","y","rx","_extends","focusable","ref","stroke","strokeWidth","displayName"],"sources":["../../../../src/components/Checkbox/CheckboxIcon.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component CheckboxIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <CheckboxIcon className=\"mr-2\" showAdditionalIcon={true} />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst CheckboxIcon = React.forwardRef(\n  (\n    {\n      mixed,\n      \"data-testid\": testId,\n      ...props\n    }: {\n      mixed?: boolean;\n      \"data-testid\"?: string;\n    } & React.SVGProps<SVGSVGElement>,\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => {\n    // const [animate, setAnimate] = useState(false);\n    // const mountRef = useRef(false);\n\n    // useEffect(() => {\n    //   if (mountRef.current) {\n    //     setAnimate(true);\n    //   } else {\n    //     mountRef.current = true;\n    //   }\n    // }, [mixed]);\n\n    if (mixed) {\n      return (\n        <svg\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          data-testid=\"checkbox-mixed-icon\"\n        >\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M14.2222 0C15.2041 0 16 0.795938 16 1.77778V14.2222C16 15.2041 15.2041 16 14.2222 16H1.77778C0.795938 16 0 15.2041 0 14.2222V1.77778C0 0.795938 0.795938 0 1.77778 0H14.2222Z\"\n            fill=\"var(--color-secondary)\"\n          />\n          <rect\n            x=\"3\"\n            y=\"7\"\n            width={10}\n            height=\"2\"\n            rx=\"1\"\n            fill=\"var(--page-paper-main)\"\n          ></rect>\n        </svg>\n      );\n    }\n    return (\n      <svg\n        width={16}\n        height={16}\n        viewBox=\"0 0 16 16\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"var(--color-theme-600)\"\n        focusable={false}\n        ref={svgRef}\n        {...props}\n        data-testid={testId}\n      >\n        <g fillRule=\"evenodd\">\n          <rect\n            stroke=\"#8E8E8E\"\n            x={0.5}\n            y={0.5}\n            width={15}\n            height={15}\n            rx={2}\n          />\n          <path\n            stroke=\"#979797\"\n            strokeWidth={2}\n            d=\"M12.243 5l-5.657 5.657-2.829-2.829\"\n          />\n        </g>\n      </svg>\n    );\n  }\n);\nCheckboxIcon.displayName = \"CheckboxIcon\";\nexport default CheckboxIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAAY,gBAAGD,KAAK,CAACE,UAAU,CACnC,CAAAC,IAAA,EASEC,MAAiC,KAC9B;EAAA,IATH;IACEC,KAAK;IACL,aAAa,EAAEC,MAAM;IACrB,GAAGC;EAI2B,CAAC,GAAAJ,IAAA;EAGjC;EACA;;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;EAEA,IAAIE,KAAK,EAAE;IACT,oBACEL,KAAA,CAAAQ,aAAA;MACEC,KAAK,EAAC,IAAI;MACVC,MAAM,EAAC,IAAI;MACXC,OAAO,EAAC,WAAW;MACnBC,IAAI,EAAC,MAAM;MACXC,KAAK,EAAC,4BAA4B;MAClC,eAAY;IAAqB,gBAEjCb,KAAA,CAAAQ,aAAA;MACEM,QAAQ,EAAC,SAAS;MAClBC,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC,+KAA+K;MACjLJ,IAAI,EAAC;IAAwB,CAC9B,CAAC,eACFZ,KAAA,CAAAQ,aAAA;MACES,CAAC,EAAC,GAAG;MACLC,CAAC,EAAC,GAAG;MACLT,KAAK,EAAE,EAAG;MACVC,MAAM,EAAC,GAAG;MACVS,EAAE,EAAC,GAAG;MACNP,IAAI,EAAC;IAAwB,CACxB,CACJ,CAAC;EAEV;EACA,oBACEZ,KAAA,CAAAQ,aAAA,QAAAY,QAAA;IACEX,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBE,KAAK,EAAC,4BAA4B;IAClCD,IAAI,EAAC,wBAAwB;IAC7BS,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAElB;EAAO,GACRG,KAAK;IACT,eAAaD;EAAO,iBAEpBN,KAAA,CAAAQ,aAAA;IAAGM,QAAQ,EAAC;EAAS,gBACnBd,KAAA,CAAAQ,aAAA;IACEe,MAAM,EAAC,SAAS;IAChBN,CAAC,EAAE,GAAI;IACPC,CAAC,EAAE,GAAI;IACPT,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXS,EAAE,EAAE;EAAE,CACP,CAAC,eACFnB,KAAA,CAAAQ,aAAA;IACEe,MAAM,EAAC,SAAS;IAChBC,WAAW,EAAE,CAAE;IACfR,CAAC,EAAC;EAAoC,CACvC,CACA,CACA,CAAC;AAEV,CACF,CAAC;AACDf,YAAY,CAACwB,WAAW,GAAG,cAAc;AACzC,eAAexB,YAAY"}

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

@@ -1,25 +1,17 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StyledLabel = exports.StyledInput = exports.StyledCheckbox = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const StyledInput = exports.StyledInput = _styledComponents.default.input.withConfig({
+import styled, { css } from "styled-components";
+export const StyledInput = styled.input.withConfig({
   displayName: "Styles__StyledInput",
   componentId: "sc-y7zymm-0"
 })(["border:0px;clip:rect(0px,0px,0px,0px);cursor:pointer;height:1px;margin:-1px;opacity:0;overflow:hidden;padding:0px;position:absolute;white-space:nowrap;width:1px;"]);
 StyledInput.displayName = "StyledInput";
-const StyledLabel = exports.StyledLabel = _styledComponents.default.label.withConfig({
+export const StyledLabel = styled.label.withConfig({
   displayName: "Styles__StyledLabel",
   componentId: "sc-y7zymm-1"
 })([""]);
 StyledLabel.displayName = "StyledLabel";
-const StyledCheckbox = exports.StyledCheckbox = _styledComponents.default.div.withConfig({
+export const 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;", " ", "}", ":disabled ~ ", "{opacity:0.5;cursor:not-allowed;}", ":focus ~ ", "{", "}&:not(.c-checkbox__controlled) ", ":hover:not(:checked) ~ ", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);", " stroke-width:3px;}}", " ", ":checked ~ ", "{path{", "}rect{stroke:var(--color-secondary);stroke-width:19px;", "}}"], props => props.$disabled && (0, _styledComponents.css)(["svg{cursor:not-allowed;}"]), props => !props.mixed && (0, _styledComponents.css)(["stroke:var(--color-theme-500);"]), props => props.mixed && (0, _styledComponents.css)(["stroke:transparent;"]), StyledInput, StyledLabel, StyledInput, StyledLabel, props => !props.mixed && (0, _styledComponents.css)(["rect{stroke:var(--color-secondary);stroke-width:3px;}"]), StyledInput, StyledLabel, props => props.mixed && (0, _styledComponents.css)(["stroke:transparent;"]), props => props.hover && !props.mixed && (0, _styledComponents.css)(["", ":not(:checked) ~ ", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);stroke-width:3px;}}"], StyledInput, StyledLabel), StyledInput, StyledLabel, props => !props.mixed && (0, _styledComponents.css)(["stroke:var(--page-paper-main);stroke-dashoffset:24;"]), props => props.mixed && (0, _styledComponents.css)(["stroke:transparent;"]));
+})(["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;", " ", "}", ":disabled ~ ", "{opacity:0.5;cursor:not-allowed;}", ":focus ~ ", "{", "}&:not(.c-checkbox__controlled) ", ":hover:not(:checked) ~ ", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);", " stroke-width:3px;}}", " ", ":checked ~ ", "{path{", "}rect{stroke:var(--color-secondary);stroke-width:19px;", "}}"], props => props.$disabled && css(["svg{cursor:not-allowed;}"]), props => !props.mixed && css(["stroke:var(--color-theme-500);"]), props => props.mixed && css(["stroke:transparent;"]), StyledInput, StyledLabel, StyledInput, StyledLabel, props => !props.mixed && css(["rect{stroke:var(--color-secondary);stroke-width:3px;}"]), StyledInput, StyledLabel, props => props.mixed && css(["stroke:transparent;"]), props => props.hover && !props.mixed && css(["", ":not(:checked) ~ ", "{path{stroke:var(--color-secondary-500);stroke-dashoffset:24;}rect{stroke:var(--color-secondary);stroke-width:3px;}}"], StyledInput, StyledLabel), StyledInput, StyledLabel, props => !props.mixed && css(["stroke:var(--page-paper-main);stroke-dashoffset:24;"]), props => props.mixed && css(["stroke:transparent;"]));
 StyledCheckbox.displayName = "StyledCheckbox";
 //# sourceMappingURL=Styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","StyledInput","exports","styled","input","withConfig","displayName","componentId","StyledLabel","label","StyledCheckbox","div","props","$disabled","css","mixed","hover"],"sources":["../../../../src/components/Checkbox/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport type { CheckBoxProps } from \"./Checkbox\";\n\nexport const StyledInput = styled.input`\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  cursor: pointer;\n  height: 1px;\n  margin: -1px;\n  opacity: 0;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n`;\nStyledInput.displayName = \"StyledInput\";\n\nexport const StyledLabel = styled.label``;\nStyledLabel.displayName = \"StyledLabel\";\n\nexport const StyledCheckbox = styled.div<\n  Partial<CheckBoxProps & { $disabled: boolean }>\n>`\n  height: 16px;\n  width: 16px;\n  position: relative;\n  transition-duration: 0.2s;\n  border-radius: 2px;\n\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\n  ${(props) =>\n    props.$disabled &&\n    css`\n      svg {\n        cursor: not-allowed;\n      }\n    `}\n\n  rect {\n    transition-duration: 0.2s;\n\n    ${(props) =>\n      !props.mixed &&\n      css`\n        stroke: var(--color-theme-500);\n      `}\n\n    ${(props) =>\n      props.mixed &&\n      css`\n        stroke: transparent;\n      `}\n  }\n\n  ${StyledInput}:disabled ~ ${StyledLabel} {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  ${StyledInput}:focus ~ ${StyledLabel} {\n    ${(props) =>\n      !props.mixed &&\n      css`\n        rect {\n          stroke: var(--color-secondary);\n          stroke-width: 3px;\n        }\n      `}\n  }\n\n  // prettier-ignore\n  &:not(.c-checkbox__controlled) ${StyledInput}:hover:not(:checked) ~ ${StyledLabel} {\n    path {\n      stroke: var(--color-secondary-500);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n\n      ${(props) =>\n    props.mixed &&\n    css`\n      stroke: transparent;\n    `}\n      stroke-width: 3px;\n    }\n  }\n\n  ${(props) =>\n    props.hover &&\n    !props.mixed &&\n    css`\n      ${StyledInput}:not(:checked) ~ ${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\n  ${StyledInput}:checked ~ ${StyledLabel} {\n    path {\n      ${(props) =>\n        !props.mixed &&\n        css`\n          stroke: var(--page-paper-main);\n          stroke-dashoffset: 24;\n        `}\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 19px;\n\n      ${(props) =>\n        props.mixed &&\n        css`\n          stroke: transparent;\n        `}\n    }\n  }\n`;\nStyledCheckbox.displayName = \"StyledCheckbox\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAIzC,MAAMY,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAGE,yBAAM,CAACC,KAAK,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,yKAYtC;AACDN,WAAW,CAACK,WAAW,GAAG,aAAa;AAEhC,MAAME,WAAW,GAAAN,OAAA,CAAAM,WAAA,GAAGL,yBAAM,CAACM,KAAK,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAE;AACzCC,WAAW,CAACF,WAAW,GAAG,aAAa;AAEhC,MAAMI,cAAc,GAAAR,OAAA,CAAAQ,cAAA,GAAGP,yBAAM,CAACQ,GAAG,CAAAN,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6nBAqBnCK,KAAK,IACNA,KAAK,CAACC,SAAS,QACfC,qBAAG,+BAIF,EAKEF,KAAK,IACN,CAACA,KAAK,CAACG,KAAK,QACZD,qBAAG,qCAEF,EAEAF,KAAK,IACNA,KAAK,CAACG,KAAK,QACXD,qBAAG,0BAEF,EAGHb,WAAW,EAAeO,WAAW,EAKrCP,WAAW,EAAYO,WAAW,EAC/BI,KAAK,IACN,CAACA,KAAK,CAACG,KAAK,QACZD,qBAAG,4DAKF,EAI4Bb,WAAW,EAA0BO,WAAW,EAQ1EI,KAAK,IACVA,KAAK,CAACG,KAAK,QACXD,qBAAG,0BAEF,EAKAF,KAAK,IACNA,KAAK,CAACI,KAAK,IACX,CAACJ,KAAK,CAACG,KAAK,QACZD,qBAAG,qJACCb,WAAW,EAAoBO,WAAW,CAU7C,EAEDP,WAAW,EAAcO,WAAW,EAE/BI,KAAK,IACN,CAACA,KAAK,CAACG,KAAK,QACZD,qBAAG,0DAGF,EAMAF,KAAK,IACNA,KAAK,CAACG,KAAK,QACXD,qBAAG,0BAEF,CAGR;AACDJ,cAAc,CAACJ,WAAW,GAAG,gBAAgB"}
+{"version":3,"file":"Styles.js","names":["styled","css","StyledInput","input","withConfig","displayName","componentId","StyledLabel","label","StyledCheckbox","div","props","$disabled","mixed","hover"],"sources":["../../../../src/components/Checkbox/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport type { CheckBoxProps } from \"./Checkbox\";\n\nexport const StyledInput = styled.input`\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  cursor: pointer;\n  height: 1px;\n  margin: -1px;\n  opacity: 0;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n`;\nStyledInput.displayName = \"StyledInput\";\n\nexport const StyledLabel = styled.label``;\nStyledLabel.displayName = \"StyledLabel\";\n\nexport const StyledCheckbox = styled.div<\n  Partial<CheckBoxProps & { $disabled: boolean }>\n>`\n  height: 16px;\n  width: 16px;\n  position: relative;\n  transition-duration: 0.2s;\n  border-radius: 2px;\n\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\n  ${(props) =>\n    props.$disabled &&\n    css`\n      svg {\n        cursor: not-allowed;\n      }\n    `}\n\n  rect {\n    transition-duration: 0.2s;\n\n    ${(props) =>\n      !props.mixed &&\n      css`\n        stroke: var(--color-theme-500);\n      `}\n\n    ${(props) =>\n      props.mixed &&\n      css`\n        stroke: transparent;\n      `}\n  }\n\n  ${StyledInput}:disabled ~ ${StyledLabel} {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  ${StyledInput}:focus ~ ${StyledLabel} {\n    ${(props) =>\n      !props.mixed &&\n      css`\n        rect {\n          stroke: var(--color-secondary);\n          stroke-width: 3px;\n        }\n      `}\n  }\n\n  // prettier-ignore\n  &:not(.c-checkbox__controlled) ${StyledInput}:hover:not(:checked) ~ ${StyledLabel} {\n    path {\n      stroke: var(--color-secondary-500);\n      stroke-dashoffset: 24;\n    }\n    rect {\n      stroke: var(--color-secondary);\n\n      ${(props) =>\n    props.mixed &&\n    css`\n      stroke: transparent;\n    `}\n      stroke-width: 3px;\n    }\n  }\n\n  ${(props) =>\n    props.hover &&\n    !props.mixed &&\n    css`\n      ${StyledInput}:not(:checked) ~ ${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\n  ${StyledInput}:checked ~ ${StyledLabel} {\n    path {\n      ${(props) =>\n        !props.mixed &&\n        css`\n          stroke: var(--page-paper-main);\n          stroke-dashoffset: 24;\n        `}\n    }\n    rect {\n      stroke: var(--color-secondary);\n      stroke-width: 19px;\n\n      ${(props) =>\n        props.mixed &&\n        css`\n          stroke: transparent;\n        `}\n    }\n  }\n`;\nStyledCheckbox.displayName = \"StyledCheckbox\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAI/C,OAAO,MAAMC,WAAW,GAAGF,MAAM,CAACG,KAAK,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,yKAYtC;AACDJ,WAAW,CAACG,WAAW,GAAG,aAAa;AAEvC,OAAO,MAAME,WAAW,GAAGP,MAAM,CAACQ,KAAK,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,QAAE;AACzCC,WAAW,CAACF,WAAW,GAAG,aAAa;AAEvC,OAAO,MAAMI,cAAc,GAAGT,MAAM,CAACU,GAAG,CAAAN,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6nBAqBnCK,KAAK,IACNA,KAAK,CAACC,SAAS,IACfX,GAAG,8BAIF,EAKEU,KAAK,IACN,CAACA,KAAK,CAACE,KAAK,IACZZ,GAAG,oCAEF,EAEAU,KAAK,IACNA,KAAK,CAACE,KAAK,IACXZ,GAAG,yBAEF,EAGHC,WAAW,EAAeK,WAAW,EAKrCL,WAAW,EAAYK,WAAW,EAC/BI,KAAK,IACN,CAACA,KAAK,CAACE,KAAK,IACZZ,GAAG,2DAKF,EAI4BC,WAAW,EAA0BK,WAAW,EAQ1EI,KAAK,IACVA,KAAK,CAACE,KAAK,IACXZ,GAAG,yBAEF,EAKAU,KAAK,IACNA,KAAK,CAACG,KAAK,IACX,CAACH,KAAK,CAACE,KAAK,IACZZ,GAAG,oJACCC,WAAW,EAAoBK,WAAW,CAU7C,EAEDL,WAAW,EAAcK,WAAW,EAE/BI,KAAK,IACN,CAACA,KAAK,CAACE,KAAK,IACZZ,GAAG,yDAGF,EAMAU,KAAK,IACNA,KAAK,CAACE,KAAK,IACXZ,GAAG,yBAEF,CAGR;AACDQ,cAAc,CAACJ,WAAW,GAAG,gBAAgB"}

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

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

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

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

package/dist/esm/components/Chip/Chip.js

@@ -1,17 +1,8 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Chip = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-var _react = _interopRequireWildcard(require("react"));
-var _Styles = require("./Styles");
-var _Typography = require("../Typography/Typography");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const Chip = exports.Chip = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useMemo } from "react";
+import { ChipCloseIcon, ChipContainer, ChipTrigger } from "./Styles";
+import { Typography } from "../Typography/Typography";
+export const Chip = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     leftAdornment,
     label,
@@ -25,7 +16,7 @@ const Chip = exports.Chip = /*#__PURE__*/_react.default.forwardRef((_ref, ref) =
     ...rest
   } = _ref;
   const showClose = typeof onClose === "function";
-  const _variant = (0, _react.useMemo)(() => {
+  const _variant = useMemo(() => {
     if (typeof variant !== "undefined") {
       return variant;
     }
@@ -38,21 +29,21 @@ const Chip = exports.Chip = /*#__PURE__*/_react.default.forwardRef((_ref, ref) =
         return "Caption 1";
     }
   }, [variant, size]);
-  return /*#__PURE__*/_react.default.createElement(_Styles.ChipContainer, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/React.createElement(ChipContainer, _extends({}, rest, {
     ref: ref,
     size: size,
     showClose: showClose,
     color: color,
     backgroundColor: backgroundColor,
     "data-testid": "chip-container"
-  }), leftAdornment, /*#__PURE__*/_react.default.createElement(_Typography.Typography, (0, _extends2.default)({
+  }), leftAdornment, /*#__PURE__*/React.createElement(Typography, _extends({
     variant: _variant,
     "data-testid": "chip-typography"
-  }, typographyProps), label), showClose ? /*#__PURE__*/_react.default.createElement(_Styles.ChipTrigger, {
+  }, typographyProps), label), showClose ? /*#__PURE__*/React.createElement(ChipTrigger, {
     size: size,
     onClick: onClose,
     className: closeClassName
-  }, /*#__PURE__*/_react.default.createElement(_Styles.ChipCloseIcon, {
+  }, /*#__PURE__*/React.createElement(ChipCloseIcon, {
     fill: color ? color : "currentColor"
   })) : null);
 });

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

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","names":["_react","_interopRequireWildcard","require","_Styles","_Typography","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Chip","exports","React","forwardRef","_ref","ref","leftAdornment","label","onClose","size","color","backgroundColor","closeClassName","variant","typographyProps","rest","showClose","_variant","useMemo","createElement","ChipContainer","_extends2","Typography","ChipTrigger","onClick","className","ChipCloseIcon","fill","displayName"],"sources":["../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport {\n  Typography,\n  Variant,\n  ITypographyProps,\n} from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n  color?: string;\n  backgroundColor?: string;\n  closeClassName?: string;\n  variant?: Variant;\n  typographyProps?: ITypographyProps;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(\n  (\n    {\n      leftAdornment,\n      label,\n      onClose,\n      size = \"regular\",\n      color,\n      backgroundColor,\n      closeClassName,\n      variant,\n      typographyProps,\n      ...rest\n    },\n    ref\n  ) => {\n    const showClose = typeof onClose === \"function\";\n    const _variant = useMemo(() => {\n      if (typeof variant !== \"undefined\") {\n        return variant;\n      }\n      switch (size) {\n        case \"regular\":\n          return \"Body 2\";\n        case \"big\":\n          return \"Body 1\";\n        default:\n          return \"Caption 1\";\n      }\n    }, [variant, size]);\n    return (\n      <ChipContainer\n        {...rest}\n        ref={ref}\n        size={size}\n        showClose={showClose}\n        color={color}\n        backgroundColor={backgroundColor}\n        data-testid=\"chip-container\"\n      >\n        {leftAdornment}\n        <Typography\n          variant={_variant}\n          data-testid=\"chip-typography\"\n          {...typographyProps}\n        >\n          {label}\n        </Typography>\n        {showClose ? (\n          <ChipTrigger size={size} onClick={onClose} className={closeClassName}>\n            <ChipCloseIcon fill={color ? color : \"currentColor\"} />\n          </ChipTrigger>\n        ) : null}\n      </ChipContainer>\n    );\n  }\n);\n\nChip.displayName = \"Chip\";\n"],"mappings":"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"}
+{"version":3,"file":"Chip.js","names":["React","useMemo","ChipCloseIcon","ChipContainer","ChipTrigger","Typography","Chip","forwardRef","_ref","ref","leftAdornment","label","onClose","size","color","backgroundColor","closeClassName","variant","typographyProps","rest","showClose","_variant","createElement","_extends","onClick","className","fill","displayName"],"sources":["../../../../src/components/Chip/Chip.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\n\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport {\n  Typography,\n  Variant,\n  ITypographyProps,\n} from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n  color?: string;\n  backgroundColor?: string;\n  closeClassName?: string;\n  variant?: Variant;\n  typographyProps?: ITypographyProps;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(\n  (\n    {\n      leftAdornment,\n      label,\n      onClose,\n      size = \"regular\",\n      color,\n      backgroundColor,\n      closeClassName,\n      variant,\n      typographyProps,\n      ...rest\n    },\n    ref\n  ) => {\n    const showClose = typeof onClose === \"function\";\n    const _variant = useMemo(() => {\n      if (typeof variant !== \"undefined\") {\n        return variant;\n      }\n      switch (size) {\n        case \"regular\":\n          return \"Body 2\";\n        case \"big\":\n          return \"Body 1\";\n        default:\n          return \"Caption 1\";\n      }\n    }, [variant, size]);\n    return (\n      <ChipContainer\n        {...rest}\n        ref={ref}\n        size={size}\n        showClose={showClose}\n        color={color}\n        backgroundColor={backgroundColor}\n        data-testid=\"chip-container\"\n      >\n        {leftAdornment}\n        <Typography\n          variant={_variant}\n          data-testid=\"chip-typography\"\n          {...typographyProps}\n        >\n          {label}\n        </Typography>\n        {showClose ? (\n          <ChipTrigger size={size} onClick={onClose} className={closeClassName}>\n            <ChipCloseIcon fill={color ? color : \"currentColor\"} />\n          </ChipTrigger>\n        ) : null}\n      </ChipContainer>\n    );\n  }\n);\n\nChip.displayName = \"Chip\";\n"],"mappings":";AAAA,OAAOA,KAAK,IAAeC,OAAO,QAAQ,OAAO;AAEjD,SAASC,aAAa,EAAEC,aAAa,EAAEC,WAAW,QAAQ,UAAU;AAEpE,SACEC,UAAU,QAGL,0BAA0B;AAcjC,OAAO,MAAMC,IAAI,gBAAGN,KAAK,CAACO,UAAU,CAIlC,CAAAC,IAAA,EAaEC,GAAG,KACA;EAAA,IAbH;IACEC,aAAa;IACbC,KAAK;IACLC,OAAO;IACPC,IAAI,GAAG,SAAS;IAChBC,KAAK;IACLC,eAAe;IACfC,cAAc;IACdC,OAAO;IACPC,eAAe;IACf,GAAGC;EACL,CAAC,GAAAX,IAAA;EAGD,MAAMY,SAAS,GAAG,OAAOR,OAAO,KAAK,UAAU;EAC/C,MAAMS,QAAQ,GAAGpB,OAAO,CAAC,MAAM;IAC7B,IAAI,OAAOgB,OAAO,KAAK,WAAW,EAAE;MAClC,OAAOA,OAAO;IAChB;IACA,QAAQJ,IAAI;MACV,KAAK,SAAS;QACZ,OAAO,QAAQ;MACjB,KAAK,KAAK;QACR,OAAO,QAAQ;MACjB;QACE,OAAO,WAAW;IACtB;EACF,CAAC,EAAE,CAACI,OAAO,EAAEJ,IAAI,CAAC,CAAC;EACnB,oBACEb,KAAA,CAAAsB,aAAA,CAACnB,aAAa,EAAAoB,QAAA,KACRJ,IAAI;IACRV,GAAG,EAAEA,GAAI;IACTI,IAAI,EAAEA,IAAK;IACXO,SAAS,EAAEA,SAAU;IACrBN,KAAK,EAAEA,KAAM;IACbC,eAAe,EAAEA,eAAgB;IACjC,eAAY;EAAgB,IAE3BL,aAAa,eACdV,KAAA,CAAAsB,aAAA,CAACjB,UAAU,EAAAkB,QAAA;IACTN,OAAO,EAAEI,QAAS;IAClB,eAAY;EAAiB,GACzBH,eAAe,GAElBP,KACS,CAAC,EACZS,SAAS,gBACRpB,KAAA,CAAAsB,aAAA,CAAClB,WAAW;IAACS,IAAI,EAAEA,IAAK;IAACW,OAAO,EAAEZ,OAAQ;IAACa,SAAS,EAAET;EAAe,gBACnEhB,KAAA,CAAAsB,aAAA,CAACpB,aAAa;IAACwB,IAAI,EAAEZ,KAAK,GAAGA,KAAK,GAAG;EAAe,CAAE,CAC3C,CAAC,GACZ,IACS,CAAC;AAEpB,CACF,CAAC;AAEDR,IAAI,CAACqB,WAAW,GAAG,MAAM"}

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

@@ -1,44 +1,37 @@
-"use strict";
+import styled, { css } from "styled-components";
+import { BoxSizingStyle } from "../BoxSizingStyle";
+import { FontStyle } from "../FontStyle";
+import { CloseSmallIcon } from "../Icons";
+import { Trigger } from "../Trigger";
+import { StyledTypography } from "../Typography/Styles";
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ChipTrigger = exports.ChipLabel = exports.ChipContainer = exports.ChipCloseIcon = void 0;
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _BoxSizingStyle = require("../BoxSizingStyle");
-var _FontStyle = require("../FontStyle");
-var _Icons = require("../Icons");
-var _Trigger = require("../Trigger");
-var _Styles = require("../Typography/Styles");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 // prettier-ignore
-const ChipContainer = exports.ChipContainer = _styledComponents.default.div.withConfig({
+export const ChipContainer = styled.div.withConfig({
   displayName: "Styles__ChipContainer",
   componentId: "sc-7s0bd1-0"
-})(["align-items:center;border-radius:0.25rem;display:flex;height:1.5rem;max-width:220px;overflow:hidden;padding-left:0.375rem;", " ", " background-color:var(--color-theme-400);color:var(--color-theme-900);font-size:0.875rem;font-weight:400;letter-spacing:0.02em;line-height:1.375;", "{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, _Styles.StyledTypography, _ref => {
+})(["align-items:center;border-radius:0.25rem;display:flex;height:1.5rem;max-width:220px;overflow:hidden;padding-left:0.375rem;", " ", " background-color:var(--color-theme-400);color:var(--color-theme-900);font-size:0.875rem;font-weight:400;letter-spacing:0.02em;line-height:1.375;", "{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, StyledTypography, _ref => {
   let {
     color
   } = _ref;
-  return color && (0, _styledComponents.css)(["", "{color:", ";}"], _Styles.StyledTypography, color);
+  return color && css(["", "{color:", ";}"], StyledTypography, color);
 }, _ref2 => {
   let {
     backgroundColor
   } = _ref2;
-  return backgroundColor && (0, _styledComponents.css)(["background-color:", ";"], backgroundColor);
-}, props => props.showClose ? null : (0, _styledComponents.css)(["padding-right:0.375rem;"]), props => props.size === "regular" && (0, _styledComponents.css)(["height:24px;"]), props => props.size === "small" && (0, _styledComponents.css)(["height:18px;"]), props => props.size === "big" && (0, _styledComponents.css)(["height:30px;"]));
+  return backgroundColor && css(["background-color:", ";"], backgroundColor);
+}, props => props.showClose ? null : css(["padding-right:0.375rem;"]), props => props.size === "regular" && css(["height:24px;"]), props => props.size === "small" && css(["height:18px;"]), props => props.size === "big" && css(["height:30px;"]));
 ChipContainer.displayName = "ChipContainer";
-const ChipLabel = exports.ChipLabel = _styledComponents.default.span.withConfig({
+export const ChipLabel = styled.span.withConfig({
   displayName: "Styles__ChipLabel",
   componentId: "sc-7s0bd1-1"
 })(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;"]);
 ChipLabel.displayName = "ChipLabel";
-const ChipTrigger = exports.ChipTrigger = (0, _styledComponents.default)(_Trigger.Trigger).withConfig({
+export const ChipTrigger = styled(Trigger).withConfig({
   displayName: "Styles__ChipTrigger",
   componentId: "sc-7s0bd1-2"
-})(["align-items:center;display:flex;justify-content:center;margin-left:0.125rem;&:hover{background-color:var(--color-theme-transparent-400);}", " ", " ", ""], props => props.size === "regular" && (0, _styledComponents.css)(["height:24px;width:24px;"]), props => props.size === "small" && (0, _styledComponents.css)(["height:18px;width:18px;"]), props => props.size === "big" && (0, _styledComponents.css)(["height:30px;width:30px;"]));
+})(["align-items:center;display:flex;justify-content:center;margin-left:0.125rem;&:hover{background-color:var(--color-theme-transparent-400);}", " ", " ", ""], props => props.size === "regular" && css(["height:24px;width:24px;"]), props => props.size === "small" && css(["height:18px;width:18px;"]), props => props.size === "big" && css(["height:30px;width:30px;"]));
 ChipTrigger.displayName = "ChipTrigger";
-const ChipCloseIcon = exports.ChipCloseIcon = (0, _styledComponents.default)(_Icons.CloseSmallIcon).withConfig({
+export const ChipCloseIcon = styled(CloseSmallIcon).withConfig({
   displayName: "Styles__ChipCloseIcon",
   componentId: "sc-7s0bd1-3"
 })(["color:var(--color-theme-700);"]);

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

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_BoxSizingStyle","_FontStyle","_Icons","_Trigger","_Styles","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","ChipContainer","exports","styled","div","withConfig","displayName","componentId","FontStyle","BoxSizingStyle","StyledTypography","_ref","color","css","_ref2","backgroundColor","props","showClose","size","ChipLabel","span","ChipTrigger","Trigger","ChipCloseIcon","CloseSmallIcon"],"sources":["../../../../src/components/Chip/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport type { ChipProps } from \"./Chip\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { Trigger } from \"../Trigger\";\nimport { StyledTypography } from \"../Typography/Styles\";\n\n// prettier-ignore\nexport const ChipContainer = styled.div<Partial<ChipProps> & { showClose: boolean }>`\n  align-items: center;\n  border-radius: 0.25rem;\n  display: flex;\n  height: 1.5rem;\n  max-width: 220px;\n  overflow: hidden;\n  padding-left: 0.375rem;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  background-color: var(--color-theme-400);\n  color: var(--color-theme-900);\n  font-size: 0.875rem;\n  font-weight: 400;\n  letter-spacing: 0.02em;\n  line-height: 1.375;\n\n  ${StyledTypography} {\n    flex: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  ${({ color }) =>\n    color &&\n    css`\n      ${StyledTypography} {\n        color: ${color};\n      }\n    `}\n\n  ${({ backgroundColor }) =>\n    backgroundColor &&\n    css`\n      background-color: ${backgroundColor};\n    `}\n\n  ${(props) =>\n    props.showClose\n      ? null\n      : css`\n          padding-right: 0.375rem;\n        `}\n\n  ${(props) =>\n    props.size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  width: 100%;\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<Pick<ChipProps, \"size\">>`\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  margin-left: 0.125rem;\n\n  &:hover {\n    background-color: var(--color-theme-transparent-400);\n  }\n\n  ${(props) =>\n    props.size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  color: var(--color-theme-700);\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"mappings":"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"}
+{"version":3,"file":"Styles.js","names":["styled","css","BoxSizingStyle","FontStyle","CloseSmallIcon","Trigger","StyledTypography","ChipContainer","div","withConfig","displayName","componentId","_ref","color","_ref2","backgroundColor","props","showClose","size","ChipLabel","span","ChipTrigger","ChipCloseIcon"],"sources":["../../../../src/components/Chip/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport type { ChipProps } from \"./Chip\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { Trigger } from \"../Trigger\";\nimport { StyledTypography } from \"../Typography/Styles\";\n\n// prettier-ignore\nexport const ChipContainer = styled.div<Partial<ChipProps> & { showClose: boolean }>`\n  align-items: center;\n  border-radius: 0.25rem;\n  display: flex;\n  height: 1.5rem;\n  max-width: 220px;\n  overflow: hidden;\n  padding-left: 0.375rem;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  background-color: var(--color-theme-400);\n  color: var(--color-theme-900);\n  font-size: 0.875rem;\n  font-weight: 400;\n  letter-spacing: 0.02em;\n  line-height: 1.375;\n\n  ${StyledTypography} {\n    flex: 1;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  ${({ color }) =>\n    color &&\n    css`\n      ${StyledTypography} {\n        color: ${color};\n      }\n    `}\n\n  ${({ backgroundColor }) =>\n    backgroundColor &&\n    css`\n      background-color: ${backgroundColor};\n    `}\n\n  ${(props) =>\n    props.showClose\n      ? null\n      : css`\n          padding-right: 0.375rem;\n        `}\n\n  ${(props) =>\n    props.size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  width: 100%;\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<Pick<ChipProps, \"size\">>`\n  align-items: center;\n  display: flex;\n  justify-content: center;\n  margin-left: 0.125rem;\n\n  &:hover {\n    background-color: var(--color-theme-transparent-400);\n  }\n\n  ${(props) =>\n    props.size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  color: var(--color-theme-700);\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,SAAS,QAAQ,cAAc;AACxC,SAASC,cAAc,QAAQ,UAAU;AACzC,SAASC,OAAO,QAAQ,YAAY;AACpC,SAASC,gBAAgB,QAAQ,sBAAsB;;AAEvD;AACA,OAAO,MAAMC,aAAa,GAAGP,MAAM,CAACQ,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iYASnCR,SAAS,EACTD,cAAc,EASdI,gBAAgB,EAOhBM,IAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,IAAA;EAAA,OACVC,KAAK,IACLZ,GAAG,wBACCK,gBAAgB,EACPO,KAAK,CAEjB;AAAA,GAEDC,KAAA;EAAA,IAAC;IAAEC;EAAgB,CAAC,GAAAD,KAAA;EAAA,OACpBC,eAAe,IACfd,GAAG,6BACmBc,eAAe,CACpC;AAAA,GAEAC,KAAK,IACNA,KAAK,CAACC,SAAS,GACX,IAAI,GACJhB,GAAG,6BAEF,EAEJe,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,SAAS,IACxBjB,GAAG,kBAEF,EAEAe,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,OAAO,IACtBjB,GAAG,kBAEF,EAEAe,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,KAAK,IACpBjB,GAAG,kBAEF,CACJ;AAEDM,aAAa,CAACG,WAAW,GAAG,eAAe;AAE3C,OAAO,MAAMS,SAAS,GAAGnB,MAAM,CAACoB,IAAI,CAAAX,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6EAKnC;AAEDQ,SAAS,CAACT,WAAW,GAAG,WAAW;AAEnC,OAAO,MAAMW,WAAW,GAAGrB,MAAM,CAACK,OAAO,CAAC,CAAAI,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gKAUrCK,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,SAAS,IACxBjB,GAAG,6BAGF,EAEAe,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,OAAO,IACtBjB,GAAG,6BAGF,EAEAe,KAAK,IACNA,KAAK,CAACE,IAAI,KAAK,KAAK,IACpBjB,GAAG,6BAGF,CACJ;AAEDoB,WAAW,CAACX,WAAW,GAAG,aAAa;AAEvC,OAAO,MAAMY,aAAa,GAAGtB,MAAM,CAACI,cAAc,CAAC,CAAAK,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qCAElD;AAEDW,aAAa,CAACZ,WAAW,GAAG,eAAe"}

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

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

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

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

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

@@ -1,18 +1,11 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Choose = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/extends"));
-var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _Styles = require("./Styles");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React from "react";
+import classNames from "classnames";
+import { StyledChoose } from "./Styles";
 /**
  * Choose component
  */
-const Choose = _ref => {
+export const Choose = _ref => {
   let {
     children,
     disabled = false,
@@ -20,12 +13,11 @@ const Choose = _ref => {
     className,
     ...args
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_Styles.StyledChoose, (0, _extends2.default)({
+  return /*#__PURE__*/React.createElement(StyledChoose, _extends({
     disabled: disabled,
-    className: (0, _classnames.default)("c-choose", className),
+    className: classNames("c-choose", className),
     active: active
   }, args), children);
 };
-exports.Choose = Choose;
 Choose.displayName = "Choose";
 //# sourceMappingURL=Choose.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Choose.js","names":["_react","_interopRequireDefault","require","_classnames","_Styles","Choose","_ref","children","disabled","active","className","args","default","createElement","StyledChoose","_extends2","classNames","exports","displayName"],"sources":["../../../../src/components/Choose/Choose.tsx"],"sourcesContent":["import React, { FC, BaseHTMLAttributes, ReactElement } from \"react\";\n\nimport classNames from \"classnames\";\n\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"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,OAAA,GAAAF,OAAA;AAaA;AACA;AACA;AACO,MAAMG,MAAwB,GAAGC,IAAA,IAMlC;EAAA,IANmC;IACvCC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,MAAM,GAAG,KAAK;IACdC,SAAS;IACT,GAAGC;EACL,CAAC,GAAAL,IAAA;EACC,oBACEN,MAAA,CAAAY,OAAA,CAAAC,aAAA,CAACT,OAAA,CAAAU,YAAY,MAAAC,SAAA,CAAAH,OAAA;IACXJ,QAAQ,EAAEA,QAAS;IACnBE,SAAS,EAAE,IAAAM,mBAAU,EAAC,UAAU,EAAEN,SAAS,CAAE;IAC7CD,MAAM,EAAEA;EAAO,GACXE,IAAI,GAEPJ,QACW,CAAC;AAEnB,CAAC;AAACU,OAAA,CAAAZ,MAAA,GAAAA,MAAA;AAEFA,MAAM,CAACa,WAAW,GAAG,QAAQ"}
+{"version":3,"file":"Choose.js","names":["React","classNames","StyledChoose","Choose","_ref","children","disabled","active","className","args","createElement","_extends","displayName"],"sources":["../../../../src/components/Choose/Choose.tsx"],"sourcesContent":["import React, { FC, BaseHTMLAttributes, ReactElement } from \"react\";\n\nimport classNames from \"classnames\";\n\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"],"mappings":";AAAA,OAAOA,KAAK,MAAgD,OAAO;AAEnE,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,YAAY,QAAQ,UAAU;AAavC;AACA;AACA;AACA,OAAO,MAAMC,MAAwB,GAAGC,IAAA,IAMlC;EAAA,IANmC;IACvCC,QAAQ;IACRC,QAAQ,GAAG,KAAK;IAChBC,MAAM,GAAG,KAAK;IACdC,SAAS;IACT,GAAGC;EACL,CAAC,GAAAL,IAAA;EACC,oBACEJ,KAAA,CAAAU,aAAA,CAACR,YAAY,EAAAS,QAAA;IACXL,QAAQ,EAAEA,QAAS;IACnBE,SAAS,EAAEP,UAAU,CAAC,UAAU,EAAEO,SAAS,CAAE;IAC7CD,MAAM,EAAEA;EAAO,GACXE,IAAI,GAEPJ,QACW,CAAC;AAEnB,CAAC;AAEDF,MAAM,CAACS,WAAW,GAAG,QAAQ"}