@drivy/cobalt 0.16.1 → 0.16.2

package/components/Icon/__generated__/WheelIcon.js

@@ -3,18 +3,16 @@ import capitalize from '../../utils/capitalize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 
-var iconSource = "wheel";
-var WheelIcon = function (_a) {
-    var _b;
-    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
-    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
-        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
-        _b["cobalt-Icon--size16"] = size === 16,
-        _b["cobalt-Icon--size20"] = size === 20,
-        _b["cobalt-Icon--size32"] = size === 32,
-        _b["cobalt-Icon--contained"] = contained,
-        _b));
-    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+const iconSource = "wheel";
+const WheelIcon = ({ color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
+        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const wrap = (content) => (React.createElement("span", { className: computedClassName }, content));
     return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
         React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm0 8a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm6.966-1.937-4.138 1.109A3.987 3.987 0 0 0 12 8a3.987 3.987 0 0 0-2.828 1.172L5.034 8.063A7.997 7.997 0 0 1 12 4a7.998 7.998 0 0 1 6.966 4.063ZM14 15.465v4.283a8.003 8.003 0 0 0 6-7.821l-4.135 1.108A4.009 4.009 0 0 1 14 15.465ZM4 11.927V12c0 3.728 2.55 6.86 6 7.748v-4.283a4.009 4.009 0 0 1-1.865-2.43L4 11.927Z" })));
 };

package/components/Icon/__generated__/WheelIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"WheelIcon.js","sources":["../../../../src/components/Icon/__generated__/WheelIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wheel\"\n\nconst WheelIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm0 8a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm6.966-1.937-4.138 1.109A3.987 3.987 0 0 0 12 8a3.987 3.987 0 0 0-2.828 1.172L5.034 8.063A7.997 7.997 0 0 1 12 4a7.998 7.998 0 0 1 6.966 4.063ZM14 15.465v4.283a8.003 8.003 0 0 0 6-7.821l-4.135 1.108A4.009 4.009 0 0 1 14 15.465ZM4 11.927V12c0 3.728 2.55 6.86 6 7.748v-4.283a4.009 4.009 0 0 1-1.865-2.43L4 11.927Z\"\n      />\n    </svg>\n  )\n}\n\nexport default WheelIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,OAAO,CAAA;AAEpB,IAAA,SAAS,GAAG,UAAC,EAKP,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,iaAAia,EACna,CAAA,CACE,CACP,CAAA;AACH;;;;"}
+{"version":3,"file":"WheelIcon.js","sources":["../../../../src/components/Icon/__generated__/WheelIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wheel\"\n\nconst WheelIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2Zm0 8a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm6.966-1.937-4.138 1.109A3.987 3.987 0 0 0 12 8a3.987 3.987 0 0 0-2.828 1.172L5.034 8.063A7.997 7.997 0 0 1 12 4a7.998 7.998 0 0 1 6.966 4.063ZM14 15.465v4.283a8.003 8.003 0 0 0 6-7.821l-4.135 1.108A4.009 4.009 0 0 1 14 15.465ZM4 11.927V12c0 3.728 2.55 6.86 6 7.748v-4.283a4.009 4.009 0 0 1-1.865-2.43L4 11.927Z\"\n      />\n    </svg>\n  )\n}\n\nexport default WheelIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,OAAO,CAAA;AAE1B,MAAM,SAAS,GAAG,CAAC,EACjB,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,UAAU,CAAA,CAAE,EACxC;QACE,CAAC,CAAA,kBAAA,EAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,CAAA,GAAG,KAAK;QACjD,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,iaAAia,EACna,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/WheelchairIcon.js

@@ -3,18 +3,16 @@ import capitalize from '../../utils/capitalize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 
-var iconSource = "wheelchair";
-var WheelchairIcon = function (_a) {
-    var _b;
-    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
-    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
-        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
-        _b["cobalt-Icon--size16"] = size === 16,
-        _b["cobalt-Icon--size20"] = size === 20,
-        _b["cobalt-Icon--size32"] = size === 32,
-        _b["cobalt-Icon--contained"] = contained,
-        _b));
-    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+const iconSource = "wheelchair";
+const WheelchairIcon = ({ color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
+        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const wrap = (content) => (React.createElement("span", { className: computedClassName }, content));
     return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
         React.createElement("path", { d: "M9 5.4c.8.8 2 .8 2.8 0 .8-.8.8-2 0-2.8-.4-.4-.9-.6-1.4-.6-.5 0-1 .2-1.4.6-.8.8-.8 2 0 2.8Zm5.1 11h-2c-.1 1.8-1.6 3.3-3.5 3.3s-3.5-1.6-3.5-3.5c0-1.5 1-2.8 2.3-3.3v-2.1c-2.5.5-4.4 2.8-4.4 5.4 0 3.1 2.5 5.5 5.5 5.5s5.5-2.3 5.6-5.3Z" }),
         React.createElement("path", { d: "M10.9 6.9h-.5c-1.1 0-2 .9-2 2v3.6c0 1.7 1.3 3 3 3h5.1L20 19l1.4-1.4-5.1-5.1h-3.4V8.9c0-1.1-.9-2-2-2Z" }),

package/components/Icon/__generated__/WheelchairIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"WheelchairIcon.js","sources":["../../../../src/components/Icon/__generated__/WheelchairIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wheelchair\"\n\nconst WheelchairIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M9 5.4c.8.8 2 .8 2.8 0 .8-.8.8-2 0-2.8-.4-.4-.9-.6-1.4-.6-.5 0-1 .2-1.4.6-.8.8-.8 2 0 2.8Zm5.1 11h-2c-.1 1.8-1.6 3.3-3.5 3.3s-3.5-1.6-3.5-3.5c0-1.5 1-2.8 2.3-3.3v-2.1c-2.5.5-4.4 2.8-4.4 5.4 0 3.1 2.5 5.5 5.5 5.5s5.5-2.3 5.6-5.3Z\" />\n      <path d=\"M10.9 6.9h-.5c-1.1 0-2 .9-2 2v3.6c0 1.7 1.3 3 3 3h5.1L20 19l1.4-1.4-5.1-5.1h-3.4V8.9c0-1.1-.9-2-2-2Z\" />\n      <path d=\"M16 10.8h-4.5c-.5 0-.9-.4-.9-.9s.4-.9.9-.9H16c.5 0 .9.4.9.9s-.4.9-.9.9Z\" />\n    </svg>\n  )\n}\n\nexport default WheelchairIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,YAAY,CAAA;AAEzB,IAAA,cAAc,GAAG,UAAC,EAKZ,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;QACzD,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sOAAsO,EAAG,CAAA;QACjP,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sGAAsG,EAAG,CAAA;AACjH,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,yEAAyE,EAAG,CAAA,CAChF,CACP,CAAA;AACH;;;;"}
+{"version":3,"file":"WheelchairIcon.js","sources":["../../../../src/components/Icon/__generated__/WheelchairIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wheelchair\"\n\nconst WheelchairIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M9 5.4c.8.8 2 .8 2.8 0 .8-.8.8-2 0-2.8-.4-.4-.9-.6-1.4-.6-.5 0-1 .2-1.4.6-.8.8-.8 2 0 2.8Zm5.1 11h-2c-.1 1.8-1.6 3.3-3.5 3.3s-3.5-1.6-3.5-3.5c0-1.5 1-2.8 2.3-3.3v-2.1c-2.5.5-4.4 2.8-4.4 5.4 0 3.1 2.5 5.5 5.5 5.5s5.5-2.3 5.6-5.3Z\" />\n      <path d=\"M10.9 6.9h-.5c-1.1 0-2 .9-2 2v3.6c0 1.7 1.3 3 3 3h5.1L20 19l1.4-1.4-5.1-5.1h-3.4V8.9c0-1.1-.9-2-2-2Z\" />\n      <path d=\"M16 10.8h-4.5c-.5 0-.9-.4-.9-.9s.4-.9.9-.9H16c.5 0 .9.4.9.9s-.4.9-.9.9Z\" />\n    </svg>\n  )\n}\n\nexport default WheelchairIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,YAAY,CAAA;AAE/B,MAAM,cAAc,GAAG,CAAC,EACtB,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,UAAU,CAAA,CAAE,EACxC;QACE,CAAC,CAAA,kBAAA,EAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,CAAA,GAAG,KAAK;QACjD,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;QACzD,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sOAAsO,EAAG,CAAA;QACjP,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sGAAsG,EAAG,CAAA;AACjH,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,yEAAyE,EAAG,CAAA,CAChF,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/WrenchIcon.js

@@ -3,18 +3,16 @@ import capitalize from '../../utils/capitalize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 
-var iconSource = "wrench";
-var WrenchIcon = function (_a) {
-    var _b;
-    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
-    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
-        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
-        _b["cobalt-Icon--size16"] = size === 16,
-        _b["cobalt-Icon--size20"] = size === 20,
-        _b["cobalt-Icon--size32"] = size === 32,
-        _b["cobalt-Icon--contained"] = contained,
-        _b));
-    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+const iconSource = "wrench";
+const WrenchIcon = ({ color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
+        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const wrap = (content) => (React.createElement("span", { className: computedClassName }, content));
     return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
         React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.53 3.53a6 6 0 0 1 7.885 8.057l6 5.999a2 2 0 1 1-2.83 2.828l-5.998-5.999A6 6 0 0 1 3.53 6.53L8 11l3-3-4.47-4.47Z" })));
 };

package/components/Icon/__generated__/WrenchIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"WrenchIcon.js","sources":["../../../../src/components/Icon/__generated__/WrenchIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wrench\"\n\nconst WrenchIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M6.53 3.53a6 6 0 0 1 7.885 8.057l6 5.999a2 2 0 1 1-2.83 2.828l-5.998-5.999A6 6 0 0 1 3.53 6.53L8 11l3-3-4.47-4.47Z\"\n      />\n    </svg>\n  )\n}\n\nexport default WrenchIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,QAAQ,CAAA;AAErB,IAAA,UAAU,GAAG,UAAC,EAKR,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,oHAAoH,EACtH,CAAA,CACE,CACP,CAAA;AACH;;;;"}
+{"version":3,"file":"WrenchIcon.js","sources":["../../../../src/components/Icon/__generated__/WrenchIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"wrench\"\n\nconst WrenchIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M6.53 3.53a6 6 0 0 1 7.885 8.057l6 5.999a2 2 0 1 1-2.83 2.828l-5.998-5.999A6 6 0 0 1 3.53 6.53L8 11l3-3-4.47-4.47Z\"\n      />\n    </svg>\n  )\n}\n\nexport default WrenchIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,QAAQ,CAAA;AAE3B,MAAM,UAAU,GAAG,CAAC,EAClB,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,UAAU,CAAA,CAAE,EACxC;QACE,CAAC,CAAA,kBAAA,EAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,CAAA,GAAG,KAAK;QACjD,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,oHAAoH,EACtH,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/YingyangIcon.js

@@ -3,18 +3,16 @@ import capitalize from '../../utils/capitalize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 
-var iconSource = "yingyang";
-var YingyangIcon = function (_a) {
-    var _b;
-    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
-    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
-        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
-        _b["cobalt-Icon--size16"] = size === 16,
-        _b["cobalt-Icon--size20"] = size === 20,
-        _b["cobalt-Icon--size32"] = size === 32,
-        _b["cobalt-Icon--contained"] = contained,
-        _b));
-    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+const iconSource = "yingyang";
+const YingyangIcon = ({ color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
+        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const wrap = (content) => (React.createElement("span", { className: computedClassName }, content));
     return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
         React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2 12c0 5.523 4.477 10 10 10s10-4.477 10-10S17.523 2 12 2 2 6.477 2 12Zm18.5 0a8.494 8.494 0 0 0-4.022-7.226A5 5 0 0 1 12 12a5 5 0 0 0-4.478 7.226A8.5 8.5 0 0 0 20.5 12Zm-8-3a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm-1 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" })));
 };

package/components/Icon/__generated__/YingyangIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"YingyangIcon.js","sources":["../../../../src/components/Icon/__generated__/YingyangIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"yingyang\"\n\nconst YingyangIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M2 12c0 5.523 4.477 10 10 10s10-4.477 10-10S17.523 2 12 2 2 6.477 2 12Zm18.5 0a8.494 8.494 0 0 0-4.022-7.226A5 5 0 0 1 12 12a5 5 0 0 0-4.478 7.226A8.5 8.5 0 0 0 20.5 12Zm-8-3a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm-1 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z\"\n      />\n    </svg>\n  )\n}\n\nexport default YingyangIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,UAAU,CAAA;AAEvB,IAAA,YAAY,GAAG,UAAC,EAKV,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+PAA+P,EACjQ,CAAA,CACE,CACP,CAAA;AACH;;;;"}
+{"version":3,"file":"YingyangIcon.js","sources":["../../../../src/components/Icon/__generated__/YingyangIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"yingyang\"\n\nconst YingyangIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M2 12c0 5.523 4.477 10 10 10s10-4.477 10-10S17.523 2 12 2 2 6.477 2 12Zm18.5 0a8.494 8.494 0 0 0-4.022-7.226A5 5 0 0 1 12 12a5 5 0 0 0-4.478 7.226A8.5 8.5 0 0 0 20.5 12Zm-8-3a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Zm-1 9a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z\"\n      />\n    </svg>\n  )\n}\n\nexport default YingyangIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,UAAU,CAAA;AAE7B,MAAM,YAAY,GAAG,CAAC,EACpB,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,UAAU,CAAA,CAAE,EACxC;QACE,CAAC,CAAA,kBAAA,EAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,CAAA,GAAG,KAAK;QACjD,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AAED,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+PAA+P,EACjQ,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/index.js

@@ -1,4 +1,3 @@
-import { __assign } from '../../_virtual/_tslib.js';
 import React from 'react';
 import cx from 'classnames';
 import { icons } from '../../tokens/index.js';
@@ -9,11 +8,11 @@ import 'lodash.throttle';
 
 if (!eqSet(new Set(Object.keys(index)), new Set(Object.keys(icons.icons))))
     throw new Error("Icon sources and tokens are not consistent. Did you add the source, export it and run 'yarn run icons:update'");
-var BUNDLED_ICONS = Object.freeze(Object.keys(icons.icons).reduce(function (bundledIcons, name) {
-    var _a;
-    return (__assign(__assign({}, bundledIcons), (_a = {}, _a[name] = index[name], _a)));
-}, {}));
-var IconColorsOptions = [
+const BUNDLED_ICONS = Object.freeze(Object.keys(icons.icons).reduce((bundledIcons, name) => ({
+    ...bundledIcons,
+    [name]: index[name],
+}), {}));
+const IconColorsOptions = [
     "aller",
     "amber",
     "asphalt",
@@ -39,22 +38,18 @@ var IconColorsOptions = [
     "turquoise",
     "white",
 ];
-var isIconSource = function (source) {
-    return Object.keys(icons.icons).includes(source);
-};
-var Icon = function (_a) {
-    var _b;
-    var source = _a.source, color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
-    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(source), (_b = {},
-        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
-        _b["cobalt-Icon--size16"] = size === 16,
-        _b["cobalt-Icon--size20"] = size === 20,
-        _b["cobalt-Icon--size32"] = size === 32,
-        _b["cobalt-Icon--contained"] = contained,
-        _b));
-    var iconSource = BUNDLED_ICONS[source];
+const isIconSource = (source) => Object.keys(icons.icons).includes(source);
+const Icon = ({ source, color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${source}`, {
+        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const iconSource = BUNDLED_ICONS[source];
     if (iconSource == null)
-        throw new Error("Icon '".concat(source, "' can not be found. Did you add the source, export it and run 'yarn run icons:update'?"));
+        throw new Error(`Icon '${source}' can not be found. Did you add the source, export it and run 'yarn run icons:update'?`);
     return (React.createElement("span", { className: computedClassName, dangerouslySetInnerHTML: { __html: iconSource } }));
 };
 

package/components/Icon/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/Icon/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\nimport { icons as iconTokens } from \"../../tokens\"\n\nimport * as icons from \"../../icons\"\nimport { eqSet, capitalize } from \"../utils\"\n\nif (\n  !eqSet<string>(\n    new Set(Object.keys(icons)),\n    new Set(Object.keys(iconTokens.icons))\n  )\n)\n  throw new Error(\n    \"Icon sources and tokens are not consistent. Did you add the source, export it and run 'yarn run icons:update'\"\n  )\n\ninterface IconsMap {\n  [name: string]: string | undefined\n}\n\nexport const BUNDLED_ICONS: IconsMap = Object.freeze(\n  Object.keys(iconTokens.icons).reduce(\n    (bundledIcons, name) => ({\n      ...bundledIcons,\n      [name]: (icons as IconsMap)[name],\n    }),\n    {}\n  )\n)\n\nexport type IconSources = keyof typeof iconTokens.icons\n\nexport const IconColorsOptions = [\n  \"aller\",\n  \"amber\",\n  \"asphalt\",\n  \"asphaltLight\",\n  \"blue\",\n  \"coral\",\n  \"essence\",\n  \"graphite\",\n  \"graphiteLight\",\n  \"green\",\n  \"greenDark\",\n  \"greenLight\",\n  \"grey\",\n  \"greyDark\",\n  \"greyLight\",\n  \"greyLighter\",\n  \"indigo\",\n  \"indigoDark\",\n  \"purple\",\n  \"purpleLight\",\n  \"red\",\n  \"signal\",\n  \"turquoise\",\n  \"white\",\n] as const\n\nexport type IconColors = typeof IconColorsOptions[number]\n\nexport interface IconProps {\n  source: IconSources\n  /**\n   * Available colors\n   * @default asphaltLight\n   */\n  color?: IconColors\n  /**\n   * Available size in px\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\n\nexport const isIconSource = (source: string): source is IconSources =>\n  Object.keys(iconTokens.icons).includes(source)\n\nexport const Icon = ({\n  source,\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${source}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const iconSource = BUNDLED_ICONS[source]\n\n  if (iconSource == null)\n    throw new Error(\n      `Icon '${source}' can not be found. Did you add the source, export it and run 'yarn run icons:update'?`\n    )\n\n  return (\n    <span\n      className={computedClassName}\n      dangerouslySetInnerHTML={{ __html: iconSource }}\n    />\n  )\n}\n\nexport * from \"./__generated__/index\"\n\nexport default Icon\n"],"names":["icons","iconTokens"],"mappings":";;;;;;;;;AAOA,IACE,CAAC,KAAK,CACJ,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAACA,KAAK,CAAC,CAAC,EAC3B,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,CACvC;AAED,IAAA,MAAM,IAAI,KAAK,CACb,+GAA+G,CAChH,CAAA;IAMU,aAAa,GAAa,MAAM,CAAC,MAAM,CAClD,MAAM,CAAC,IAAI,CAACA,KAAU,CAAC,KAAK,CAAC,CAAC,MAAM,CAClC,UAAC,YAAY,EAAE,IAAI,EAAA;;IAAK,QAAA,QAAA,CAAA,QAAA,CAAA,EAAA,EACnB,YAAY,CACd,GAAA,EAAA,GAAA,EAAA,EAAA,EAAA,CAAA,IAAI,IAAID,KAAkB,CAAC,IAAI,CAAC,EACjC,EAAA,EAAA,EAAA;AAHsB,CAGtB,EACF,EAAE,CACH,EACF;AAIY,IAAA,iBAAiB,GAAG;IAC/B,OAAO;IACP,OAAO;IACP,SAAS;IACT,cAAc;IACd,MAAM;IACN,OAAO;IACP,SAAS;IACT,UAAU;IACV,eAAe;IACf,OAAO;IACP,WAAW;IACX,YAAY;IACZ,MAAM;IACN,UAAU;IACV,WAAW;IACX,aAAa;IACb,QAAQ;IACR,YAAY;IACZ,QAAQ;IACR,aAAa;IACb,KAAK;IACL,QAAQ;IACR,WAAW;IACX,OAAO;EACC;AAoBH,IAAM,YAAY,GAAG,UAAC,MAAc,EAAA;AACzC,IAAA,OAAA,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;AAA9C,EAA8C;AAEzC,IAAM,IAAI,GAAG,UAAC,EAMT,EAAA;;QALV,MAAM,GAAA,EAAA,CAAA,MAAA,EACN,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,EAAS,GAAA,EAAA,CAAA,IAAA,EAAT,IAAI,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,EAAE,KAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,MAAM,CAAE,GAAA,EAAA,GAAA,EAAA;AAElC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAA;IAExC,IAAI,UAAU,IAAI,IAAI;AACpB,QAAA,MAAM,IAAI,KAAK,CACb,gBAAS,MAAM,EAAA,wFAAA,CAAwF,CACxG,CAAA;AAEH,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,iBAAiB,EAC5B,uBAAuB,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,EAAA,CAC/C,EACH;AACH;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/Icon/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\nimport { icons as iconTokens } from \"../../tokens\"\n\nimport * as icons from \"../../icons\"\nimport { eqSet, capitalize } from \"../utils\"\n\nif (\n  !eqSet<string>(\n    new Set(Object.keys(icons)),\n    new Set(Object.keys(iconTokens.icons))\n  )\n)\n  throw new Error(\n    \"Icon sources and tokens are not consistent. Did you add the source, export it and run 'yarn run icons:update'\"\n  )\n\ninterface IconsMap {\n  [name: string]: string | undefined\n}\n\nexport const BUNDLED_ICONS: IconsMap = Object.freeze(\n  Object.keys(iconTokens.icons).reduce(\n    (bundledIcons, name) => ({\n      ...bundledIcons,\n      [name]: (icons as IconsMap)[name],\n    }),\n    {}\n  )\n)\n\nexport type IconSources = keyof typeof iconTokens.icons\n\nexport const IconColorsOptions = [\n  \"aller\",\n  \"amber\",\n  \"asphalt\",\n  \"asphaltLight\",\n  \"blue\",\n  \"coral\",\n  \"essence\",\n  \"graphite\",\n  \"graphiteLight\",\n  \"green\",\n  \"greenDark\",\n  \"greenLight\",\n  \"grey\",\n  \"greyDark\",\n  \"greyLight\",\n  \"greyLighter\",\n  \"indigo\",\n  \"indigoDark\",\n  \"purple\",\n  \"purpleLight\",\n  \"red\",\n  \"signal\",\n  \"turquoise\",\n  \"white\",\n] as const\n\nexport type IconColors = typeof IconColorsOptions[number]\n\nexport interface IconProps {\n  source: IconSources\n  /**\n   * Available colors\n   * @default asphaltLight\n   */\n  color?: IconColors\n  /**\n   * Available size in px\n   * @default 24\n   */\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\n\nexport const isIconSource = (source: string): source is IconSources =>\n  Object.keys(iconTokens.icons).includes(source)\n\nexport const Icon = ({\n  source,\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${source}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const iconSource = BUNDLED_ICONS[source]\n\n  if (iconSource == null)\n    throw new Error(\n      `Icon '${source}' can not be found. Did you add the source, export it and run 'yarn run icons:update'?`\n    )\n\n  return (\n    <span\n      className={computedClassName}\n      dangerouslySetInnerHTML={{ __html: iconSource }}\n    />\n  )\n}\n\nexport * from \"./__generated__/index\"\n\nexport default Icon\n"],"names":["icons","iconTokens"],"mappings":";;;;;;;;AAOA,IACE,CAAC,KAAK,CACJ,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAACA,KAAK,CAAC,CAAC,EAC3B,IAAI,GAAG,CAAC,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,CACvC;AAED,IAAA,MAAM,IAAI,KAAK,CACb,+GAA+G,CAChH,CAAA;AAMU,MAAA,aAAa,GAAa,MAAM,CAAC,MAAM,CAClD,MAAM,CAAC,IAAI,CAACA,KAAU,CAAC,KAAK,CAAC,CAAC,MAAM,CAClC,CAAC,YAAY,EAAE,IAAI,MAAM;AACvB,IAAA,GAAG,YAAY;AACf,IAAA,CAAC,IAAI,GAAID,KAAkB,CAAC,IAAI,CAAC;AAClC,CAAA,CAAC,EACF,EAAE,CACH,EACF;AAIY,MAAA,iBAAiB,GAAG;IAC/B,OAAO;IACP,OAAO;IACP,SAAS;IACT,cAAc;IACd,MAAM;IACN,OAAO;IACP,SAAS;IACT,UAAU;IACV,eAAe;IACf,OAAO;IACP,WAAW;IACX,YAAY;IACZ,MAAM;IACN,UAAU;IACV,WAAW;IACX,aAAa;IACb,QAAQ;IACR,YAAY;IACZ,QAAQ;IACR,aAAa;IACb,KAAK;IACL,QAAQ;IACR,WAAW;IACX,OAAO;EACC;MAoBG,YAAY,GAAG,CAAC,MAAc,KACzC,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,MAAM,EAAC;MAEnC,IAAI,GAAG,CAAC,EACnB,MAAM,EACN,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,MAAM,CAAA,CAAE,EACpC;QACE,CAAC,CAAA,kBAAA,EAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,CAAA,GAAG,KAAK;QACjD,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AAED,IAAA,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAA;IAExC,IAAI,UAAU,IAAI,IAAI;AACpB,QAAA,MAAM,IAAI,KAAK,CACb,SAAS,MAAM,CAAA,sFAAA,CAAwF,CACxG,CAAA;AAEH,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,SAAS,EAAE,iBAAiB,EAC5B,uBAAuB,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,EAAA,CAC/C,EACH;AACH;;;;"}

package/components/Modal/ModalBody.js

@@ -1,14 +1,11 @@
 import React from 'react';
 import cx from 'classnames';
 
-var ModalBody = function (_a) {
-    var children = _a.children, _b = _a.bodySpacing, bodySpacing = _b === void 0 ? true : _b, hasHeader = _a.hasHeader, hasFooter = _a.hasFooter;
-    return (React.createElement("div", { className: cx("cobalt-modal-body", {
-            "cobalt-modal-body--bodySpacing": bodySpacing,
-            "cobalt-modal-body--hasHeader": hasHeader,
-            "cobalt-modal-body--hasFooter": hasFooter,
-        }) }, children));
-};
+const ModalBody = ({ children, bodySpacing = true, hasHeader, hasFooter }) => (React.createElement("div", { className: cx("cobalt-modal-body", {
+        "cobalt-modal-body--bodySpacing": bodySpacing,
+        "cobalt-modal-body--hasHeader": hasHeader,
+        "cobalt-modal-body--hasFooter": hasFooter,
+    }) }, children));
 
 export { ModalBody as default };
 //# sourceMappingURL=ModalBody.js.map

package/components/Modal/ModalBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalBody.js","sources":["../../../src/components/Modal/ModalBody.tsx"],"sourcesContent":["import React, { FunctionComponent } from \"react\"\nimport cx from \"classnames\"\n\nconst ModalBody: FunctionComponent<{\n  bodySpacing?: boolean\n  hasHeader: boolean\n  hasFooter: boolean\n}> = ({ children, bodySpacing = true, hasHeader, hasFooter }) => (\n  <div\n    className={cx(\"cobalt-modal-body\", {\n      \"cobalt-modal-body--bodySpacing\": bodySpacing,\n      \"cobalt-modal-body--hasHeader\": hasHeader,\n      \"cobalt-modal-body--hasFooter\": hasFooter,\n    })}\n  >\n    {children}\n  </div>\n)\n\nexport default ModalBody\n"],"names":[],"mappings":";;;AAGM,IAAA,SAAS,GAIV,UAAC,EAAsD,EAAA;AAApD,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EAAE,EAAkB,GAAA,EAAA,CAAA,WAAA,EAAlB,WAAW,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,IAAI,GAAA,EAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;AAAO,IAAA,QAC/D,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE;AACjC,YAAA,gCAAgC,EAAE,WAAW;AAC7C,YAAA,8BAA8B,EAAE,SAAS;AACzC,YAAA,8BAA8B,EAAE,SAAS;SAC1C,CAAC,EAAA,EAED,QAAQ,CACL,EACP;AAVgE;;;;"}
+{"version":3,"file":"ModalBody.js","sources":["../../../src/components/Modal/ModalBody.tsx"],"sourcesContent":["import React, { FunctionComponent } from \"react\"\nimport cx from \"classnames\"\n\nconst ModalBody: FunctionComponent<{\n  bodySpacing?: boolean\n  hasHeader: boolean\n  hasFooter: boolean\n}> = ({ children, bodySpacing = true, hasHeader, hasFooter }) => (\n  <div\n    className={cx(\"cobalt-modal-body\", {\n      \"cobalt-modal-body--bodySpacing\": bodySpacing,\n      \"cobalt-modal-body--hasHeader\": hasHeader,\n      \"cobalt-modal-body--hasFooter\": hasFooter,\n    })}\n  >\n    {children}\n  </div>\n)\n\nexport default ModalBody\n"],"names":[],"mappings":";;;AAGM,MAAA,SAAS,GAIV,CAAC,EAAE,QAAQ,EAAE,WAAW,GAAG,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,MAC1D,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE;AACjC,QAAA,gCAAgC,EAAE,WAAW;AAC7C,QAAA,8BAA8B,EAAE,SAAS;AACzC,QAAA,8BAA8B,EAAE,SAAS;AAC1C,KAAA,CAAC,EAED,EAAA,QAAQ,CACL;;;;"}

package/components/Modal/ModalFooter.js

@@ -1,8 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
 
-var ModalFooter = function (_a) {
-    var children = _a.children, className = _a.className;
+const ModalFooter = ({ children, className }) => {
     return React.createElement("div", { className: cx("cobalt-modal-footer", className) }, children);
 };
 

package/components/Modal/ModalFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalFooter.js","sources":["../../../src/components/Modal/ModalFooter.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nexport type ModalFooterPropsType = PropsWithChildren<{ className?: string }>\n\nconst ModalFooter = ({ children, className }: ModalFooterPropsType) => {\n  return <div className={cx(\"cobalt-modal-footer\", className)}>{children}</div>\n}\n\nexport default ModalFooter\n"],"names":[],"mappings":";;;AAKM,IAAA,WAAW,GAAG,UAAC,EAA6C,EAAA;QAA3C,QAAQ,GAAA,EAAA,CAAA,QAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;AACxC,IAAA,OAAO,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAA,EAAG,QAAQ,CAAO,CAAA;AAC/E;;;;"}
+{"version":3,"file":"ModalFooter.js","sources":["../../../src/components/Modal/ModalFooter.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nexport type ModalFooterPropsType = PropsWithChildren<{ className?: string }>\n\nconst ModalFooter = ({ children, className }: ModalFooterPropsType) => {\n  return <div className={cx(\"cobalt-modal-footer\", className)}>{children}</div>\n}\n\nexport default ModalFooter\n"],"names":[],"mappings":";;;AAKM,MAAA,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAwB,KAAI;AACpE,IAAA,OAAO,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAA,EAAG,QAAQ,CAAO,CAAA;AAC/E;;;;"}

package/components/Modal/ModalHeader.js

@@ -2,15 +2,12 @@ import React from 'react';
 import VisuallyHidden from '@reach/visually-hidden';
 import { Icon } from '../Icon/index.js';
 
-var ModalHeader = function (_a) {
-    var title = _a.title, close = _a.close;
-    return (React.createElement("div", { className: "cobalt-modal-header" },
-        React.createElement("h2", { className: "cobalt-modal-header__title" }, title),
-        close && (React.createElement("button", { type: "button", className: "cobalt-modal-header__close-button", onClick: close },
-            React.createElement(VisuallyHidden, null, "Close"),
-            React.createElement("span", { "aria-hidden": true },
-                React.createElement(Icon, { source: "close", color: "graphiteLight" }))))));
-};
+const ModalHeader = ({ title, close, }) => (React.createElement("div", { className: "cobalt-modal-header" },
+    React.createElement("h2", { className: "cobalt-modal-header__title" }, title),
+    close && (React.createElement("button", { type: "button", className: "cobalt-modal-header__close-button", onClick: close },
+        React.createElement(VisuallyHidden, null, "Close"),
+        React.createElement("span", { "aria-hidden": true },
+            React.createElement(Icon, { source: "close", color: "graphiteLight" }))))));
 
 export { ModalHeader as default };
 //# sourceMappingURL=ModalHeader.js.map

package/components/Modal/ModalHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalHeader.js","sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport VisuallyHidden from \"@reach/visually-hidden\"\n\nimport { Icon } from \"../Icon\"\n\nconst ModalHeader = ({\n  title,\n  close,\n}: {\n  title?: string\n  close?: () => void\n}) => (\n  <div className=\"cobalt-modal-header\">\n    <h2 className=\"cobalt-modal-header__title\">{title}</h2>\n    {close && (\n      <button\n        type=\"button\"\n        className=\"cobalt-modal-header__close-button\"\n        onClick={close}\n      >\n        <VisuallyHidden>Close</VisuallyHidden>\n        <span aria-hidden>\n          <Icon source=\"close\" color=\"graphiteLight\" />\n        </span>\n      </button>\n    )}\n  </div>\n)\n\nexport default ModalHeader\n"],"names":[],"mappings":";;;;AAKM,IAAA,WAAW,GAAG,UAAC,EAMpB,EAAA;QALC,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,KAAK,GAAA,EAAA,CAAA,KAAA,CAAA;AAID,IAAA,QACJ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,EAAA;AAClC,QAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,4BAA4B,EAAA,EAAE,KAAK,CAAM;AACtD,QAAA,KAAK,KACJ,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,KAAK,EAAA;AAEd,YAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EAAuB,IAAA,EAAA,OAAA,CAAA;AACtC,YAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA;AACE,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,EAAG,CAAA,CACxC,CACA,CACV,CACG,EACP;AAhBK;;;;"}
+{"version":3,"file":"ModalHeader.js","sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport VisuallyHidden from \"@reach/visually-hidden\"\n\nimport { Icon } from \"../Icon\"\n\nconst ModalHeader = ({\n  title,\n  close,\n}: {\n  title?: string\n  close?: () => void\n}) => (\n  <div className=\"cobalt-modal-header\">\n    <h2 className=\"cobalt-modal-header__title\">{title}</h2>\n    {close && (\n      <button\n        type=\"button\"\n        className=\"cobalt-modal-header__close-button\"\n        onClick={close}\n      >\n        <VisuallyHidden>Close</VisuallyHidden>\n        <span aria-hidden>\n          <Icon source=\"close\" color=\"graphiteLight\" />\n        </span>\n      </button>\n    )}\n  </div>\n)\n\nexport default ModalHeader\n"],"names":[],"mappings":";;;;AAKA,MAAM,WAAW,GAAG,CAAC,EACnB,KAAK,EACL,KAAK,GAIN,MACC,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,qBAAqB,EAAA;AAClC,IAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,4BAA4B,EAAA,EAAE,KAAK,CAAM;AACtD,IAAA,KAAK,KACJ,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,KAAK,EAAA;AAEd,QAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EAAuB,IAAA,EAAA,OAAA,CAAA;AACtC,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA;AACE,YAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,GAAG,CACxC,CACA,CACV,CACG;;;;"}

package/components/Modal/index.js

@@ -1,4 +1,3 @@
-import { __assign } from '../../_virtual/_tslib.js';
 import React, { forwardRef, useRef, useEffect } from 'react';
 import cx from 'classnames';
 import { DialogOverlay, DialogContent } from '@reach/dialog';
@@ -11,26 +10,23 @@ import 'lodash.throttle';
 import { getScrollbarWidth } from '../utils/dom.js';
 
 // Only for the API, render nothing, we use ModalFooterInternal internally
-var ModalFooterAPI = function (_props) { return null; };
-var isModalFooterAPIComponent = function (component) {
-    return React.isValidElement(component) && component.type === ModalFooterAPI;
-};
-var _Modal = forwardRef(function (_a, ref) {
-    var ariaLabel = _a["aria-label"], children = _a.children, isOpen = _a.isOpen, close = _a.close, _b = _a.overflowHidden, overflowHidden = _b === void 0 ? true : _b, initialFocusRef = _a.initialFocusRef, bodySpacing = _a.bodySpacing, onDismissAttempt = _a.onDismissAttempt, onHidden = _a.onHidden, onShow = _a.onShow, title = _a.title, _c = _a.skipAnimation, skipAnimation = _c === void 0 ? { enter: false, leave: false } : _c;
-    var defaultBodyStyle = useRef({
+const ModalFooterAPI = (_props) => null;
+const isModalFooterAPIComponent = (component) => React.isValidElement(component) && component.type === ModalFooterAPI;
+const _Modal = forwardRef(({ ["aria-label"]: ariaLabel, children, isOpen, close, overflowHidden = true, initialFocusRef, bodySpacing, onDismissAttempt, onHidden, onShow, title, skipAnimation = { enter: false, leave: false }, }, ref) => {
+    const defaultBodyStyle = useRef({
         paddingRight: document.body.style.paddingRight,
         overflow: document.body.style.overflow,
         isRestored: false,
     });
-    var restoreDefaultBodyStyle = function () {
+    const restoreDefaultBodyStyle = () => {
         if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {
-            var _a = defaultBodyStyle.current, overflow = _a.overflow, paddingRight = _a.paddingRight;
+            const { overflow, paddingRight } = defaultBodyStyle.current;
             document.body.style.overflow = overflow;
             document.body.style.paddingRight = paddingRight;
             defaultBodyStyle.current.isRestored = true;
         }
     };
-    useEffect(function () {
+    useEffect(() => {
         // disable / enable body scroll
         // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)
         // https://github.com/reach/reach-ui/issues/678
@@ -38,18 +34,18 @@ var _Modal = forwardRef(function (_a, ref) {
         // + fake scrollbar width to avoid visual layout shift
         if (isOpen) {
             defaultBodyStyle.current.isRestored = false;
-            document.body.style.paddingRight = "".concat(getScrollbarWidth() +
-                parseInt(window.getComputedStyle(document.body).paddingRight, 10), "px"); // to avoid visual shift due to removing an existing scrollbar
+            document.body.style.paddingRight = `${getScrollbarWidth() +
+                parseInt(window.getComputedStyle(document.body).paddingRight, 10)}px`; // to avoid visual shift due to removing an existing scrollbar
             document.body.style.overflow = "hidden";
         }
-        return function () {
+        return () => {
             isOpen && restoreDefaultBodyStyle();
         };
     }, [isOpen]);
-    var isMobile = useBreakpoint().isMobile;
-    var transformTransitionOut = isMobile ? 500 : -20;
-    var springConfig = { tension: 300, friction: 30, clamp: true };
-    var transition = useTransition(isOpen, {
+    const { isMobile } = useBreakpoint();
+    const transformTransitionOut = isMobile ? 500 : -20;
+    const springConfig = { tension: 300, friction: 30, clamp: true };
+    const transition = useTransition(isOpen, {
         from: {
             overlayOpacity: 0,
             modalTransform: transformTransitionOut,
@@ -66,51 +62,46 @@ var _Modal = forwardRef(function (_a, ref) {
             modalTransform: transformTransitionOut,
             config: springConfig,
         },
-        onStart: function () {
-            if (onShow)
-                onShow();
+        onStart: (_a, _b, isReady) => {
+            isReady && isOpen && onShow && onShow();
         },
-        onDestroyed: function (isTransitioned) {
+        onDestroyed: (isTransitioned) => {
             !isOpen && restoreDefaultBodyStyle();
             if (onHidden && isTransitioned)
                 onHidden();
         },
     });
-    var AnimatedDialogOverlay = animated(DialogOverlay);
-    var AnimatedDialogContent = animated(DialogContent);
-    var modalFooter = React.Children.toArray(children).find(function (c) {
-        return isModalFooterAPIComponent(c);
-    });
-    var header = null;
+    const AnimatedDialogOverlay = animated(DialogOverlay);
+    const AnimatedDialogContent = animated(DialogContent);
+    const modalFooter = React.Children.toArray(children).find((c) => isModalFooterAPIComponent(c));
+    let header = null;
     if (title || close) {
-        header = React.createElement(ModalHeader, __assign({ title: title }, (close ? { close: close } : {})));
+        header = React.createElement(ModalHeader, { title: title, ...(close ? { close } : {}) });
     }
-    var hasHeader = !!title || !!close;
-    var footer = null;
+    const hasHeader = !!title || !!close;
+    let footer = null;
     if (React.isValidElement(modalFooter)) {
-        footer = React.createElement(ModalFooter, __assign({}, modalFooter.props));
+        footer = React.createElement(ModalFooter, { ...modalFooter.props });
     }
-    var getDismissHandler = function (onClose) {
+    const getDismissHandler = (onClose) => {
         if (onClose)
             return onClose;
         if (onDismissAttempt)
             return onDismissAttempt;
         return;
     };
-    return (React.createElement(React.Fragment, null, transition(function (styles, isOpenState) {
-        return isOpenState && (React.createElement(AnimatedDialogOverlay, { initialFocusRef: initialFocusRef, onDismiss: getDismissHandler(close), className: "cobalt-modal__overlay", style: { opacity: styles.overlayOpacity }, onTouchEnd: function (e) { return e.stopPropagation(); }, onMouseUp: function (e) { return e.stopPropagation(); }, dangerouslyBypassScrollLock: true },
-            React.createElement(AnimatedDialogContent, { className: cx("cobalt-modal", {
-                    "cobalt-modal--desktop": !isMobile,
-                    "cobalt-modal--mobile": isMobile,
-                    "cobalt-modal--overflowHidden": overflowHidden,
-                }), "aria-label": ariaLabel, style: { translateY: styles.modalTransform }, ref: ref },
-                header,
-                React.createElement(ModalBody, { bodySpacing: bodySpacing, hasHeader: hasHeader, hasFooter: !!footer }, children),
-                footer)));
-    })));
+    return (React.createElement(React.Fragment, null, transition((styles, isOpenState) => isOpenState && (React.createElement(AnimatedDialogOverlay, { initialFocusRef: initialFocusRef, onDismiss: getDismissHandler(close), className: "cobalt-modal__overlay", style: { opacity: styles.overlayOpacity }, onTouchEnd: (e) => e.stopPropagation(), onMouseUp: (e) => e.stopPropagation(), dangerouslyBypassScrollLock: true },
+        React.createElement(AnimatedDialogContent, { className: cx("cobalt-modal", {
+                "cobalt-modal--desktop": !isMobile,
+                "cobalt-modal--mobile": isMobile,
+                "cobalt-modal--overflowHidden": overflowHidden,
+            }), "aria-label": ariaLabel, style: { translateY: styles.modalTransform }, ref: ref },
+            header,
+            React.createElement(ModalBody, { bodySpacing: bodySpacing, hasHeader: hasHeader, hasFooter: !!footer }, children),
+            footer))))));
 });
 _Modal.displayName = "Modal";
-var Modal = Object.assign(_Modal, { Footer: ModalFooterAPI });
+const Modal = Object.assign(_Modal, { Footer: ModalFooterAPI });
 
 export { ModalFooterAPI, Modal as default, isModalFooterAPIComponent };
 //# sourceMappingURL=index.js.map

package/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useRef } from \"react\"\nimport cx from \"classnames\"\nimport { DialogOverlay, DialogContent } from \"@reach/dialog\"\nimport { useTransition, animated } from \"@react-spring/web\"\n\nimport useBreakpoint from \"../../hooks/useBreakpoint\"\nimport ModalHeader from \"./ModalHeader\"\nimport ModalBody from \"./ModalBody\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\nimport { getScrollbarWidth } from \"../utils/\"\n\nexport type ModalPropsType = {\n  /**\n   * mandatory for A11y\n   */\n  [\"aria-label\"]: string\n  /**\n   * Function called to close the modal, providing it make the modal closeable\n   */\n  close?: () => void\n  /**\n   * React.ref of the element to focus first when the modal opens\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>\n  /**\n   * State to show or hide the modal/dialog\n   */\n  isOpen: boolean\n  /**\n   * Action to fire if the user try to dismiss when the modal is not closeable\n   */\n  onDismissAttempt?: () => void\n  /**\n   * Listener called when the modal has been fully hidden\n   */\n  onHidden?: () => void\n  /**\n   * Listener called when the modal begins to show\n   */\n  onShow?: () => void\n  /**\n   * Modal title\n   */\n  title?: string\n  /**\n   * Disable/Enable body paddings (enabled by default)\n   */\n  bodySpacing?: boolean\n  /**\n   * Disable/Enable hidding overflowing absolute elements (enabled by default)\n   */\n  overflowHidden?: boolean\n  /**\n   * Disable enter/leave animation (animation enabled by default)\n   */\n  skipAnimation?: {\n    enter: boolean\n    leave: boolean\n  }\n  /**\n   * Modal body content\n   */\n  children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n  component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n  React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst _Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n  (\n    {\n      [\"aria-label\"]: ariaLabel,\n      children,\n      isOpen,\n      close,\n      overflowHidden = true,\n      initialFocusRef,\n      bodySpacing,\n      onDismissAttempt,\n      onHidden,\n      onShow,\n      title,\n      skipAnimation = { enter: false, leave: false },\n    }: ModalPropsType,\n    ref\n  ) => {\n    const defaultBodyStyle = useRef({\n      paddingRight: document.body.style.paddingRight,\n      overflow: document.body.style.overflow,\n      isRestored: false,\n    })\n\n    const restoreDefaultBodyStyle = () => {\n      if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {\n        const { overflow, paddingRight } = defaultBodyStyle.current\n\n        document.body.style.overflow = overflow\n        document.body.style.paddingRight = paddingRight\n\n        defaultBodyStyle.current.isRestored = true\n      }\n    }\n\n    useEffect(() => {\n      // disable / enable body scroll\n      // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)\n      // https://github.com/reach/reach-ui/issues/678\n      // dangerouslyBypassScrollLock is used to disabled it\n      // + fake scrollbar width to avoid visual layout shift\n      if (isOpen) {\n        defaultBodyStyle.current.isRestored = false\n\n        document.body.style.paddingRight = `${\n          getScrollbarWidth() +\n          parseInt(window.getComputedStyle(document.body).paddingRight, 10)\n        }px` // to avoid visual shift due to removing an existing scrollbar\n\n        document.body.style.overflow = \"hidden\"\n      }\n      return () => {\n        isOpen && restoreDefaultBodyStyle()\n      }\n    }, [isOpen])\n\n    const { isMobile } = useBreakpoint()\n\n    const transformTransitionOut = isMobile ? 500 : -20\n\n    const springConfig = { tension: 300, friction: 30, clamp: true }\n\n    const transition = useTransition(isOpen, {\n      from: {\n        overlayOpacity: 0,\n        modalTransform: transformTransitionOut,\n      },\n      enter: {\n        immediate: skipAnimation.enter,\n        overlayOpacity: 1,\n        modalTransform: 0,\n        config: springConfig,\n      },\n      leave: {\n        immediate: skipAnimation.leave,\n        overlayOpacity: 0,\n        modalTransform: transformTransitionOut,\n        config: springConfig,\n      },\n      onStart: () => {\n        if (onShow) onShow()\n      },\n      onDestroyed: (isTransitioned) => {\n        !isOpen && restoreDefaultBodyStyle()\n        if (onHidden && isTransitioned) onHidden()\n      },\n    })\n\n    const AnimatedDialogOverlay = animated(DialogOverlay)\n    const AnimatedDialogContent = animated(DialogContent)\n\n    const modalFooter = React.Children.toArray(children).find((c) =>\n      isModalFooterAPIComponent(c)\n    )\n\n    let header: React.ReactNode = null\n    if (title || close) {\n      header = <ModalHeader title={title} {...(close ? { close } : {})} />\n    }\n    const hasHeader = !!title || !!close\n\n    let footer: React.ReactNode = null\n    if (React.isValidElement(modalFooter)) {\n      footer = <ModalFooter {...modalFooter.props} />\n    }\n\n    const getDismissHandler = (onClose?: ModalPropsType[\"close\"]) => {\n      if (onClose) return onClose\n      if (onDismissAttempt) return onDismissAttempt\n      return\n    }\n\n    return (\n      <>\n        {transition(\n          (styles, isOpenState) =>\n            isOpenState && (\n              <AnimatedDialogOverlay\n                initialFocusRef={initialFocusRef}\n                onDismiss={getDismissHandler(close)}\n                className=\"cobalt-modal__overlay\"\n                style={{ opacity: styles.overlayOpacity }}\n                onTouchEnd={(e) => e.stopPropagation()}\n                onMouseUp={(e) => e.stopPropagation()}\n                dangerouslyBypassScrollLock\n              >\n                <AnimatedDialogContent\n                  className={cx(\"cobalt-modal\", {\n                    \"cobalt-modal--desktop\": !isMobile,\n                    \"cobalt-modal--mobile\": isMobile,\n                    \"cobalt-modal--overflowHidden\": overflowHidden,\n                  })}\n                  aria-label={ariaLabel}\n                  style={{ translateY: styles.modalTransform }}\n                  ref={ref}\n                >\n                  {header}\n                  <ModalBody\n                    bodySpacing={bodySpacing}\n                    hasHeader={hasHeader}\n                    hasFooter={!!footer}\n                  >\n                    {children}\n                  </ModalBody>\n                  {footer}\n                </AnimatedDialogContent>\n              </AnimatedDialogOverlay>\n            )\n        )}\n      </>\n    )\n  }\n)\n\n_Modal.displayName = \"Modal\"\n\nconst Modal = Object.assign(_Modal, { Footer: ModalFooterAPI })\n\nexport default Modal\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useRef } from \"react\"\nimport cx from \"classnames\"\nimport { DialogOverlay, DialogContent } from \"@reach/dialog\"\nimport { useTransition, animated } from \"@react-spring/web\"\n\nimport useBreakpoint from \"../../hooks/useBreakpoint\"\nimport ModalHeader from \"./ModalHeader\"\nimport ModalBody from \"./ModalBody\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\nimport { getScrollbarWidth } from \"../utils/\"\n\nexport type ModalPropsType = {\n  /**\n   * mandatory for A11y\n   */\n  [\"aria-label\"]: string\n  /**\n   * Function called to close the modal, providing it make the modal closeable\n   */\n  close?: () => void\n  /**\n   * React.ref of the element to focus first when the modal opens\n   */\n  initialFocusRef?: React.RefObject<HTMLElement>\n  /**\n   * State to show or hide the modal/dialog\n   */\n  isOpen: boolean\n  /**\n   * Action to fire if the user try to dismiss when the modal is not closeable\n   */\n  onDismissAttempt?: () => void\n  /**\n   * Listener called when the modal has been fully hidden\n   */\n  onHidden?: () => void\n  /**\n   * Listener called when the modal begins to show\n   */\n  onShow?: () => void\n  /**\n   * Modal title\n   */\n  title?: string\n  /**\n   * Disable/Enable body paddings (enabled by default)\n   */\n  bodySpacing?: boolean\n  /**\n   * Disable/Enable hidding overflowing absolute elements (enabled by default)\n   */\n  overflowHidden?: boolean\n  /**\n   * Disable enter/leave animation (animation enabled by default)\n   */\n  skipAnimation?: {\n    enter: boolean\n    leave: boolean\n  }\n  /**\n   * Modal body content\n   */\n  children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n  component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n  React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst _Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n  (\n    {\n      [\"aria-label\"]: ariaLabel,\n      children,\n      isOpen,\n      close,\n      overflowHidden = true,\n      initialFocusRef,\n      bodySpacing,\n      onDismissAttempt,\n      onHidden,\n      onShow,\n      title,\n      skipAnimation = { enter: false, leave: false },\n    }: ModalPropsType,\n    ref\n  ) => {\n    const defaultBodyStyle = useRef({\n      paddingRight: document.body.style.paddingRight,\n      overflow: document.body.style.overflow,\n      isRestored: false,\n    })\n\n    const restoreDefaultBodyStyle = () => {\n      if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {\n        const { overflow, paddingRight } = defaultBodyStyle.current\n\n        document.body.style.overflow = overflow\n        document.body.style.paddingRight = paddingRight\n\n        defaultBodyStyle.current.isRestored = true\n      }\n    }\n\n    useEffect(() => {\n      // disable / enable body scroll\n      // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)\n      // https://github.com/reach/reach-ui/issues/678\n      // dangerouslyBypassScrollLock is used to disabled it\n      // + fake scrollbar width to avoid visual layout shift\n      if (isOpen) {\n        defaultBodyStyle.current.isRestored = false\n\n        document.body.style.paddingRight = `${\n          getScrollbarWidth() +\n          parseInt(window.getComputedStyle(document.body).paddingRight, 10)\n        }px` // to avoid visual shift due to removing an existing scrollbar\n\n        document.body.style.overflow = \"hidden\"\n      }\n      return () => {\n        isOpen && restoreDefaultBodyStyle()\n      }\n    }, [isOpen])\n\n    const { isMobile } = useBreakpoint()\n\n    const transformTransitionOut = isMobile ? 500 : -20\n\n    const springConfig = { tension: 300, friction: 30, clamp: true }\n\n    const transition = useTransition(isOpen, {\n      from: {\n        overlayOpacity: 0,\n        modalTransform: transformTransitionOut,\n      },\n      enter: {\n        immediate: skipAnimation.enter,\n        overlayOpacity: 1,\n        modalTransform: 0,\n        config: springConfig,\n      },\n      leave: {\n        immediate: skipAnimation.leave,\n        overlayOpacity: 0,\n        modalTransform: transformTransitionOut,\n        config: springConfig,\n      },\n      onStart: (_a: unknown, _b: unknown, isReady: boolean) => {\n        isReady && isOpen && onShow && onShow()\n      },\n      onDestroyed: (isTransitioned) => {\n        !isOpen && restoreDefaultBodyStyle()\n        if (onHidden && isTransitioned) onHidden()\n      },\n    })\n\n    const AnimatedDialogOverlay = animated(DialogOverlay)\n    const AnimatedDialogContent = animated(DialogContent)\n\n    const modalFooter = React.Children.toArray(children).find((c) =>\n      isModalFooterAPIComponent(c)\n    )\n\n    let header: React.ReactNode = null\n    if (title || close) {\n      header = <ModalHeader title={title} {...(close ? { close } : {})} />\n    }\n    const hasHeader = !!title || !!close\n\n    let footer: React.ReactNode = null\n    if (React.isValidElement(modalFooter)) {\n      footer = <ModalFooter {...modalFooter.props} />\n    }\n\n    const getDismissHandler = (onClose?: ModalPropsType[\"close\"]) => {\n      if (onClose) return onClose\n      if (onDismissAttempt) return onDismissAttempt\n      return\n    }\n\n    return (\n      <>\n        {transition(\n          (styles, isOpenState) =>\n            isOpenState && (\n              <AnimatedDialogOverlay\n                initialFocusRef={initialFocusRef}\n                onDismiss={getDismissHandler(close)}\n                className=\"cobalt-modal__overlay\"\n                style={{ opacity: styles.overlayOpacity }}\n                onTouchEnd={(e) => e.stopPropagation()}\n                onMouseUp={(e) => e.stopPropagation()}\n                dangerouslyBypassScrollLock\n              >\n                <AnimatedDialogContent\n                  className={cx(\"cobalt-modal\", {\n                    \"cobalt-modal--desktop\": !isMobile,\n                    \"cobalt-modal--mobile\": isMobile,\n                    \"cobalt-modal--overflowHidden\": overflowHidden,\n                  })}\n                  aria-label={ariaLabel}\n                  style={{ translateY: styles.modalTransform }}\n                  ref={ref}\n                >\n                  {header}\n                  <ModalBody\n                    bodySpacing={bodySpacing}\n                    hasHeader={hasHeader}\n                    hasFooter={!!footer}\n                  >\n                    {children}\n                  </ModalBody>\n                  {footer}\n                </AnimatedDialogContent>\n              </AnimatedDialogOverlay>\n            )\n        )}\n      </>\n    )\n  }\n)\n\n_Modal.displayName = \"Modal\"\n\nconst Modal = Object.assign(_Modal, { Footer: ModalFooterAPI })\n\nexport default Modal\n"],"names":[],"mappings":";;;;;;;;;;;AAiEA;AACa,MAAA,cAAc,GAAG,CAAC,MAA4B,KAAK,KAAI;MAEvD,yBAAyB,GAAG,CACvC,SAA0B,KAE1B,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,IAAI,SAAS,CAAC,IAAI,KAAK,eAAc;AAEtE,MAAM,MAAM,GAAG,UAAU,CACvB,CACE,EACE,CAAC,YAAY,GAAG,SAAS,EACzB,QAAQ,EACR,MAAM,EACN,KAAK,EACL,cAAc,GAAG,IAAI,EACrB,eAAe,EACf,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,MAAM,EACN,KAAK,EACL,aAAa,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,GAC/B,EACjB,GAAG,KACD;IACF,MAAM,gBAAgB,GAAG,MAAM,CAAC;AAC9B,QAAA,YAAY,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY;AAC9C,QAAA,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ;AACtC,QAAA,UAAU,EAAE,KAAK;AAClB,KAAA,CAAC,CAAA;IAEF,MAAM,uBAAuB,GAAG,MAAK;QACnC,IAAI,gBAAgB,CAAC,OAAO,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,UAAU,EAAE;YACpE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,gBAAgB,CAAC,OAAO,CAAA;YAE3D,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;YACvC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,YAAY,CAAA;AAE/C,YAAA,gBAAgB,CAAC,OAAO,CAAC,UAAU,GAAG,IAAI,CAAA;AAC3C,SAAA;AACH,KAAC,CAAA;IAED,SAAS,CAAC,MAAK;;;;;;AAMb,QAAA,IAAI,MAAM,EAAE;AACV,YAAA,gBAAgB,CAAC,OAAO,CAAC,UAAU,GAAG,KAAK,CAAA;YAE3C,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,GAAG,CACjC,EAAA,iBAAiB,EAAE;AACnB,gBAAA,QAAQ,CAAC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,EAAE,CAClE,CAAI,EAAA,CAAA,CAAA;YAEJ,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;AACxC,SAAA;AACD,QAAA,OAAO,MAAK;YACV,MAAM,IAAI,uBAAuB,EAAE,CAAA;AACrC,SAAC,CAAA;AACH,KAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;AAEZ,IAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,CAAA;AAEpC,IAAA,MAAM,sBAAsB,GAAG,QAAQ,GAAG,GAAG,GAAG,CAAC,EAAE,CAAA;AAEnD,IAAA,MAAM,YAAY,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAA;AAEhE,IAAA,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,EAAE;AACvC,QAAA,IAAI,EAAE;AACJ,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,cAAc,EAAE,sBAAsB;AACvC,SAAA;AACD,QAAA,KAAK,EAAE;YACL,SAAS,EAAE,aAAa,CAAC,KAAK;AAC9B,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,MAAM,EAAE,YAAY;AACrB,SAAA;AACD,QAAA,KAAK,EAAE;YACL,SAAS,EAAE,aAAa,CAAC,KAAK;AAC9B,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,cAAc,EAAE,sBAAsB;AACtC,YAAA,MAAM,EAAE,YAAY;AACrB,SAAA;QACD,OAAO,EAAE,CAAC,EAAW,EAAE,EAAW,EAAE,OAAgB,KAAI;AACtD,YAAA,OAAO,IAAI,MAAM,IAAI,MAAM,IAAI,MAAM,EAAE,CAAA;SACxC;AACD,QAAA,WAAW,EAAE,CAAC,cAAc,KAAI;AAC9B,YAAA,CAAC,MAAM,IAAI,uBAAuB,EAAE,CAAA;YACpC,IAAI,QAAQ,IAAI,cAAc;AAAE,gBAAA,QAAQ,EAAE,CAAA;SAC3C;AACF,KAAA,CAAC,CAAA;AAEF,IAAA,MAAM,qBAAqB,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;AACrD,IAAA,MAAM,qBAAqB,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;IAErD,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAC1D,yBAAyB,CAAC,CAAC,CAAC,CAC7B,CAAA;IAED,IAAI,MAAM,GAAoB,IAAI,CAAA;IAClC,IAAI,KAAK,IAAI,KAAK,EAAE;QAClB,MAAM,GAAG,oBAAC,WAAW,EAAA,EAAC,KAAK,EAAE,KAAK,EAAM,IAAC,KAAK,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,EAAA,CAAI,CAAA;AACrE,KAAA;IACD,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAA;IAEpC,IAAI,MAAM,GAAoB,IAAI,CAAA;AAClC,IAAA,IAAI,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE;QACrC,MAAM,GAAG,oBAAC,WAAW,EAAA,EAAA,GAAK,WAAW,CAAC,KAAK,GAAI,CAAA;AAChD,KAAA;AAED,IAAA,MAAM,iBAAiB,GAAG,CAAC,OAAiC,KAAI;AAC9D,QAAA,IAAI,OAAO;AAAE,YAAA,OAAO,OAAO,CAAA;AAC3B,QAAA,IAAI,gBAAgB;AAAE,YAAA,OAAO,gBAAgB,CAAA;QAC7C,OAAM;AACR,KAAC,CAAA;AAED,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EACG,UAAU,CACT,CAAC,MAAM,EAAE,WAAW,KAClB,WAAW,KACT,KAAA,CAAA,aAAA,CAAC,qBAAqB,EAAA,EACpB,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,iBAAiB,CAAC,KAAK,CAAC,EACnC,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,CAAC,cAAc,EAAE,EACzC,UAAU,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,eAAe,EAAE,EACtC,SAAS,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,eAAe,EAAE,EACrC,2BAA2B,EAAA,IAAA,EAAA;AAE3B,QAAA,KAAA,CAAA,aAAA,CAAC,qBAAqB,EACpB,EAAA,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE;gBAC5B,uBAAuB,EAAE,CAAC,QAAQ;AAClC,gBAAA,sBAAsB,EAAE,QAAQ;AAChC,gBAAA,8BAA8B,EAAE,cAAc;AAC/C,aAAA,CAAC,EACU,YAAA,EAAA,SAAS,EACrB,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,CAAC,cAAc,EAAE,EAC5C,GAAG,EAAE,GAAG,EAAA;YAEP,MAAM;AACP,YAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EACR,EAAA,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,CAAC,CAAC,MAAM,EAAA,EAElB,QAAQ,CACC;AACX,YAAA,MAAM,CACe,CACF,CACzB,CACJ,CACA,EACJ;AACH,CAAC,CACF,CAAA;AAED,MAAM,CAAC,WAAW,GAAG,OAAO,CAAA;AAE5B,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,MAAM,EAAE,cAAc,EAAE;;;;"}