npm - @drivy/cobalt - Versions diffs - 0.13.0 → 0.14.2 - Mend

@drivy/cobalt 0.13.0 → 0.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (319) hide show

package/components/Icon/__generated__/SocialWhatsappIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SocialWhatsappIcon.js","sources":["../../../../src/components/Icon/__generated__/SocialWhatsappIcon.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 = \"socialWhatsapp\"\n\nconst SocialWhatsappIcon = ({\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=\"M13.413 13.275c.29-.365.484-.547.58-.547.097 0 .46.163 1.088.49.63.328.962.525 1 .592a.476.476 0 0 1 .022.168c0 .245-.064.528-.19.848-.12.29-.383.534-.792.73-.41.198-.79.297-1.139.297-.424 0-1.13-.231-2.12-.692a6.37 6.37 0 0 1-1.898-1.317c-.535-.543-1.086-1.232-1.652-2.065-.535-.796-.8-1.518-.792-2.165v-.09c.022-.677.298-1.264.826-1.763a.844.844 0 0 1 .58-.245c.045 0 .112.005.201.016.09.012.16.017.212.017.142 0 .24.024.296.073.056.048.114.15.173.307.06.148.182.476.368.982s.28.785.28.837c0 .156-.129.37-.386.642-.256.271-.385.444-.385.518a.32.32 0 0 0 .056.168c.253.543.633 1.053 1.138 1.529.417.394.979.77 1.686 1.127.089.052.17.078.245.078.112 0 .313-.178.603-.535zm-1.685 5.368a6.82 6.82 0 0 0 2.717-.558 7.068 7.068 0 0 0 2.238-1.496 7.068 7.068 0 0 0 1.496-2.237 6.82 6.82 0 0 0 .558-2.718 6.82 6.82 0 0 0-.558-2.718 7.068 7.068 0 0 0-1.496-2.237 7.068 7.068 0 0 0-2.238-1.496 6.82 6.82 0 0 0-2.717-.558 6.82 6.82 0 0 0-2.718.558 7.068 7.068 0 0 0-2.238 1.496 7.068 7.068 0 0 0-1.495 2.237 6.82 6.82 0 0 0-.558 2.718c0 1.51.446 2.88 1.339 4.107l-.882 2.6 2.701-.859a6.863 6.863 0 0 0 3.85 1.16zM8.458 3.888a8.217 8.217 0 0 1 3.27-.67c1.138 0 2.226.224 3.264.67a8.5 8.5 0 0 1 2.684 1.797 8.5 8.5 0 0 1 1.797 2.684 8.177 8.177 0 0 1 .67 3.265 8.177 8.177 0 0 1-.67 3.264 8.5 8.5 0 0 1-1.797 2.685 8.5 8.5 0 0 1-2.684 1.796 8.177 8.177 0 0 1-3.264.67c-1.451 0-2.81-.35-4.074-1.049L3 20.496l1.518-4.52a8.214 8.214 0 0 1-1.205-4.342c0-1.138.223-2.227.67-3.265a8.5 8.5 0 0 1 1.796-2.684 8.516 8.516 0 0 1 2.679-1.797z\" />\n </svg>\n )\n}\n\nexport default SocialWhatsappIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,gBAAgB,CAAA;IAE7B,kBAAkB,GAAG,UAAC,EAKhB;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,k/CAAk/C,GAAG,CACz/C,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SocialWhatsappIcon.js","sources":["../../../../src/components/Icon/__generated__/SocialWhatsappIcon.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 = \"socialWhatsapp\"\n\nconst SocialWhatsappIcon = ({\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=\"M13.413 13.275c.29-.365.484-.547.58-.547.097 0 .46.163 1.088.49.63.328.962.525 1 .592a.476.476 0 0 1 .022.168c0 .245-.064.528-.19.848-.12.29-.383.534-.792.73-.41.198-.79.297-1.139.297-.424 0-1.13-.231-2.12-.692a6.37 6.37 0 0 1-1.898-1.317c-.535-.543-1.086-1.232-1.652-2.065-.535-.796-.8-1.518-.792-2.165v-.09c.022-.677.298-1.264.826-1.763a.844.844 0 0 1 .58-.245c.045 0 .112.005.201.016.09.012.16.017.212.017.142 0 .24.024.296.073.056.048.114.15.173.307.06.148.182.476.368.982s.28.785.28.837c0 .156-.129.37-.386.642-.256.271-.385.444-.385.518a.32.32 0 0 0 .056.168c.253.543.633 1.053 1.138 1.529.417.394.979.77 1.686 1.127.089.052.17.078.245.078.112 0 .313-.178.603-.535zm-1.685 5.368a6.82 6.82 0 0 0 2.717-.558 7.068 7.068 0 0 0 2.238-1.496 7.068 7.068 0 0 0 1.496-2.237 6.82 6.82 0 0 0 .558-2.718 6.82 6.82 0 0 0-.558-2.718 7.068 7.068 0 0 0-1.496-2.237 7.068 7.068 0 0 0-2.238-1.496 6.82 6.82 0 0 0-2.717-.558 6.82 6.82 0 0 0-2.718.558 7.068 7.068 0 0 0-2.238 1.496 7.068 7.068 0 0 0-1.495 2.237 6.82 6.82 0 0 0-.558 2.718c0 1.51.446 2.88 1.339 4.107l-.882 2.6 2.701-.859a6.863 6.863 0 0 0 3.85 1.16zM8.458 3.888a8.217 8.217 0 0 1 3.27-.67c1.138 0 2.226.224 3.264.67a8.5 8.5 0 0 1 2.684 1.797 8.5 8.5 0 0 1 1.797 2.684 8.177 8.177 0 0 1 .67 3.265 8.177 8.177 0 0 1-.67 3.264 8.5 8.5 0 0 1-1.797 2.685 8.5 8.5 0 0 1-2.684 1.796 8.177 8.177 0 0 1-3.264.67c-1.451 0-2.81-.35-4.074-1.049L3 20.496l1.518-4.52a8.214 8.214 0 0 1-1.205-4.342c0-1.138.223-2.227.67-3.265a8.5 8.5 0 0 1 1.796-2.684 8.516 8.516 0 0 1 2.679-1.797z\" />\n </svg>\n )\n}\n\nexport default SocialWhatsappIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,gBAAgB,CAAA;IAE7B,kBAAkB,GAAG,UAAC,EAKhB;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,k/CAAk/C,GAAG,CACz/C,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/StarIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "star";
 var StarIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/StarIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StarIcon.js","sources":["../../../../src/components/Icon/__generated__/StarIcon.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 = \"star\"\n\nconst StarIcon = ({\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=\"M7.71163405,20.8562867 C6.84949963,21.3296772 5.84187365,20.5650648 6.00652667,19.5624075 L6.84488987,14.594771 L3.35617076,11.043006 C2.65868936,10.3329201 3.04356824,9.09575128 4.00746382,8.94946555 L8.80363311,8.21837144 L10.9461857,3.68418581 C11.3772529,2.77193806 12.6227471,2.77193806 13.0538143,3.68418581 L15.2307871,8.22679814 L19.9925362,8.94946555 C20.9564318,9.09575128 21.3413106,10.3329201 20.6438292,11.043006 L17.176653,14.5883666 L17.9934733,19.5624075 C18.1581264,20.5650648 17.1505004,21.3296772 16.2883659,20.8562867 L12.0263592,18.5160556 L7.71163405,20.8562867 Z\" />\n </svg>\n )\n}\n\nexport default StarIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,MAAM,CAAA;IAEnB,QAAQ,GAAG,UAAC,EAKN;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,2kBAA2kB,GAAG,CACllB,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"StarIcon.js","sources":["../../../../src/components/Icon/__generated__/StarIcon.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 = \"star\"\n\nconst StarIcon = ({\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=\"M7.71163405,20.8562867 C6.84949963,21.3296772 5.84187365,20.5650648 6.00652667,19.5624075 L6.84488987,14.594771 L3.35617076,11.043006 C2.65868936,10.3329201 3.04356824,9.09575128 4.00746382,8.94946555 L8.80363311,8.21837144 L10.9461857,3.68418581 C11.3772529,2.77193806 12.6227471,2.77193806 13.0538143,3.68418581 L15.2307871,8.22679814 L19.9925362,8.94946555 C20.9564318,9.09575128 21.3413106,10.3329201 20.6438292,11.043006 L17.176653,14.5883666 L17.9934733,19.5624075 C18.1581264,20.5650648 17.1505004,21.3296772 16.2883659,20.8562867 L12.0263592,18.5160556 L7.71163405,20.8562867 Z\" />\n </svg>\n )\n}\n\nexport default StarIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,MAAM,CAAA;IAEnB,QAAQ,GAAG,UAAC,EAKN;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,2kBAA2kB,GAAG,CACllB,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/SubwayIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "subway";
 var SubwayIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/SubwayIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SubwayIcon.js","sources":["../../../../src/components/Icon/__generated__/SubwayIcon.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 = \"subway\"\n\nconst SubwayIcon = ({\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=\"M21,11 C21,6.02943725 16.9705627,2 12,2 C7.02943725,2 3,6.02943725 3,11 L3,20.007983 C3,21.0998238 3.8932319,22 4.99508929,22 L19.0049107,22 C20.1073772,22 21,21.1081436 21,20.007983 L21,11 Z M6,19 L18,19 L18,20 L6,20 L6,19 Z M14,17 L10,17 L10,18 L8,18 L8,17 L7.99539757,17 C7.44565467,17 7,16.5621186 7,15.9970707 L7,10 C7,8 7,7 12,7 C17,7 17,8 17,10 L17,15.9970707 C17,16.5509732 16.5443356,17 16.0046024,17 L16,17 L16,18 L14,18 L14,17 Z M9,16 C9.55228475,16 10,15.5522847 10,15 C10,14.4477153 9.55228475,14 9,14 C8.44771525,14 8,14.4477153 8,15 C8,15.5522847 8.44771525,16 9,16 Z M15,16 C15.5522847,16 16,15.5522847 16,15 C16,14.4477153 15.5522847,14 15,14 C14.4477153,14 14,14.4477153 14,15 C14,15.5522847 14.4477153,16 15,16 Z M9,9.49538898 C9,9.2217932 9.22788048,9 9.49100518,9 L14.5089948,9 C14.7801695,9 15,9.2157526 15,9.49538898 L15,11.504611 C15,11.7782068 14.7721195,12 14.5089948,12 L9.49100518,12 C9.21983051,12 9,11.7842474 9,11.504611 L9,9.49538898 Z\" />\n </svg>\n )\n}\n\nexport default SubwayIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,QAAQ,CAAA;IAErB,UAAU,GAAG,UAAC,EAKR;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,y8BAAy8B,GAAG,CACh9B,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SubwayIcon.js","sources":["../../../../src/components/Icon/__generated__/SubwayIcon.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 = \"subway\"\n\nconst SubwayIcon = ({\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=\"M21,11 C21,6.02943725 16.9705627,2 12,2 C7.02943725,2 3,6.02943725 3,11 L3,20.007983 C3,21.0998238 3.8932319,22 4.99508929,22 L19.0049107,22 C20.1073772,22 21,21.1081436 21,20.007983 L21,11 Z M6,19 L18,19 L18,20 L6,20 L6,19 Z M14,17 L10,17 L10,18 L8,18 L8,17 L7.99539757,17 C7.44565467,17 7,16.5621186 7,15.9970707 L7,10 C7,8 7,7 12,7 C17,7 17,8 17,10 L17,15.9970707 C17,16.5509732 16.5443356,17 16.0046024,17 L16,17 L16,18 L14,18 L14,17 Z M9,16 C9.55228475,16 10,15.5522847 10,15 C10,14.4477153 9.55228475,14 9,14 C8.44771525,14 8,14.4477153 8,15 C8,15.5522847 8.44771525,16 9,16 Z M15,16 C15.5522847,16 16,15.5522847 16,15 C16,14.4477153 15.5522847,14 15,14 C14.4477153,14 14,14.4477153 14,15 C14,15.5522847 14.4477153,16 15,16 Z M9,9.49538898 C9,9.2217932 9.22788048,9 9.49100518,9 L14.5089948,9 C14.7801695,9 15,9.2157526 15,9.49538898 L15,11.504611 C15,11.7782068 14.7721195,12 14.5089948,12 L9.49100518,12 C9.21983051,12 9,11.7842474 9,11.504611 L9,9.49538898 Z\" />\n </svg>\n )\n}\n\nexport default SubwayIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,QAAQ,CAAA;IAErB,UAAU,GAAG,UAAC,EAKR;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,y8BAAy8B,GAAG,CACh9B,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/TimeAlertIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "timeAlert";
 var TimeAlertIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/TimeAlertIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeAlertIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeAlertIcon.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 = \"timeAlert\"\n\nconst TimeAlertIcon = ({\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 id=\"a\"\n d=\"M12 2C6.47 2 2 6.5 2 12a10 10 0 0 0 10 10c2.25 0 4.33-.76 6-2v-2.72C16.53 18.94 14.39 20 12 20a8 8 0 1 1 0-16c3.36 0 6.23 2.07 7.41 5h2.13C20.27 4.94 16.5 2 12 2zm-1 5v6l5.25 3.15.75-1.23-4.5-2.67V7H11zm9 4v7h2v-7h-2zm0 9v2h2v-2h-2z\"\n />\n </svg>\n )\n}\n\nexport default TimeAlertIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,WAAW,CAAA;IAExB,aAAa,GAAG,UAAC,EAKX;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BACE,EAAE,EAAC,GAAG,EACN,CAAC,EAAC,0OAA0O,GAC5O,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"TimeAlertIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeAlertIcon.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 = \"timeAlert\"\n\nconst TimeAlertIcon = ({\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 id=\"a\"\n d=\"M12 2C6.47 2 2 6.5 2 12a10 10 0 0 0 10 10c2.25 0 4.33-.76 6-2v-2.72C16.53 18.94 14.39 20 12 20a8 8 0 1 1 0-16c3.36 0 6.23 2.07 7.41 5h2.13C20.27 4.94 16.5 2 12 2zm-1 5v6l5.25 3.15.75-1.23-4.5-2.67V7H11zm9 4v7h2v-7h-2zm0 9v2h2v-2h-2z\"\n />\n </svg>\n )\n}\n\nexport default TimeAlertIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,WAAW,CAAA;IAExB,aAAa,GAAG,UAAC,EAKX;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BACE,EAAE,EAAC,GAAG,EACN,CAAC,EAAC,0OAA0O,GAC5O,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/TimeBackwardsIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "timeBackwards";
 var TimeBackwardsIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/TimeBackwardsIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeBackwardsIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeBackwardsIcon.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 = \"timeBackwards\"\n\nconst TimeBackwardsIcon = ({\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=\"M13 3a9 9 0 00-9 9H1l3.89 3.89.07.14L9 12H6a7 7 0 117 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42A8.896 8.896 0 0013 21a9 9 0 100-18zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z\" />\n </svg>\n )\n}\n\nexport default TimeBackwardsIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,eAAe,CAAA;IAE5B,iBAAiB,GAAG,UAAC,EAKf;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,2KAA2K,GAAG,CAClL,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"TimeBackwardsIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeBackwardsIcon.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 = \"timeBackwards\"\n\nconst TimeBackwardsIcon = ({\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=\"M13 3a9 9 0 00-9 9H1l3.89 3.89.07.14L9 12H6a7 7 0 117 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42A8.896 8.896 0 0013 21a9 9 0 100-18zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z\" />\n </svg>\n )\n}\n\nexport default TimeBackwardsIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,eAAe,CAAA;IAE5B,iBAAiB,GAAG,UAAC,EAKf;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,2KAA2K,GAAG,CAClL,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/TimeCalendarIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "timeCalendar";
 var TimeCalendarIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/TimeCalendarIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeCalendarIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeCalendarIcon.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 = \"timeCalendar\"\n\nconst TimeCalendarIcon = ({\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=\"M14,15 L7,15 L7,17 L14,17 L14,15 Z M19,20 L5,20 L5,9 L19,9 L19,20 Z M19,4 L18,4 L18,2 L16,2 L16,4 L8,4 L8,2 L6,2 L6,4 L5,4 C3.89,4 3,4.9 3,6 L3,20 C3,21.1045695 3.8954305,22 5,22 L19,22 C20.1045695,22 21,21.1045695 21,20 L21,6 C21,4.8954305 20.1045695,4 19,4 L19,4 Z M17,11 L7,11 L7,13 L17,13 L17,11 Z\" />\n </svg>\n )\n}\n\nexport default TimeCalendarIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,cAAc,CAAA;IAE3B,gBAAgB,GAAG,UAAC,EAKd;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,+SAA+S,GAAG,CACtT,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"TimeCalendarIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeCalendarIcon.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 = \"timeCalendar\"\n\nconst TimeCalendarIcon = ({\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=\"M14,15 L7,15 L7,17 L14,17 L14,15 Z M19,20 L5,20 L5,9 L19,9 L19,20 Z M19,4 L18,4 L18,2 L16,2 L16,4 L8,4 L8,2 L6,2 L6,4 L5,4 C3.89,4 3,4.9 3,6 L3,20 C3,21.1045695 3.8954305,22 5,22 L19,22 C20.1045695,22 21,21.1045695 21,20 L21,6 C21,4.8954305 20.1045695,4 19,4 L19,4 Z M17,11 L7,11 L7,13 L17,13 L17,11 Z\" />\n </svg>\n )\n}\n\nexport default TimeCalendarIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,cAAc,CAAA;IAE3B,gBAAgB,GAAG,UAAC,EAKd;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,+SAA+S,GAAG,CACtT,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/TimeForwardIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "timeForward";
 var TimeForwardIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/TimeForwardIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TimeForwardIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeForwardIcon.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 = \"timeForward\"\n\nconst TimeForwardIcon = ({\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=\"M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1a6.887 6.887 0 000 9.8c2.73 2.7 7.15 2.7 9.88 0 1.36-1.35 2.04-2.92 2.04-4.9h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58a8.987 8.987 0 0112.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z\" />\n </svg>\n )\n}\n\nexport default TimeForwardIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,aAAa,CAAA;IAE1B,eAAe,GAAG,UAAC,EAKb;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,qSAAqS,GAAG,CAC5S,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"TimeForwardIcon.js","sources":["../../../../src/components/Icon/__generated__/TimeForwardIcon.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 = \"timeForward\"\n\nconst TimeForwardIcon = ({\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=\"M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1a6.887 6.887 0 000 9.8c2.73 2.7 7.15 2.7 9.88 0 1.36-1.35 2.04-2.92 2.04-4.9h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58a8.987 8.987 0 0112.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z\" />\n </svg>\n )\n}\n\nexport default TimeForwardIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,aAAa,CAAA;IAE1B,eAAe,GAAG,UAAC,EAKb;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,qSAAqS,GAAG,CAC5S,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/TrainIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "train";
 var TrainIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/TrainIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TrainIcon.js","sources":["../../../../src/components/Icon/__generated__/TrainIcon.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 = \"train\"\n\nconst TrainIcon = ({\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=\"M12 4c-3.5 0-7 .447-7 3.579v8.5c0 1.73 1.371 3.131 3.063 3.131L6.75 20.553V21h1.951l1.75-1.79h3.299L15.5 21h1.75v-.447l-1.313-1.343c1.693 0 3.063-1.402 3.063-3.13v-8.5C19 4.447 15.867 4 12 4zM8.062 17.421c-.724 0-1.312-.6-1.312-1.342 0-.741.588-1.342 1.313-1.342.724 0 1.312.6 1.312 1.342 0 .741-.588 1.342-1.313 1.342zm3.063-6.263H6.75V7.579h4.375v3.579zm1.75 0V7.579h4.375v3.579h-4.375zm3.063 6.263c-.725 0-1.313-.6-1.313-1.342 0-.741.588-1.342 1.313-1.342.724 0 1.312.6 1.312 1.342 0 .741-.588 1.342-1.313 1.342z\" />\n </svg>\n )\n}\n\nexport default TrainIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,OAAO,CAAA;IAEpB,SAAS,GAAG,UAAC,EAKP;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,qgBAAqgB,GAAG,CAC5gB,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"TrainIcon.js","sources":["../../../../src/components/Icon/__generated__/TrainIcon.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 = \"train\"\n\nconst TrainIcon = ({\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=\"M12 4c-3.5 0-7 .447-7 3.579v8.5c0 1.73 1.371 3.131 3.063 3.131L6.75 20.553V21h1.951l1.75-1.79h3.299L15.5 21h1.75v-.447l-1.313-1.343c1.693 0 3.063-1.402 3.063-3.13v-8.5C19 4.447 15.867 4 12 4zM8.062 17.421c-.724 0-1.312-.6-1.312-1.342 0-.741.588-1.342 1.313-1.342.724 0 1.312.6 1.312 1.342 0 .741-.588 1.342-1.313 1.342zm3.063-6.263H6.75V7.579h4.375v3.579zm1.75 0V7.579h4.375v3.579h-4.375zm3.063 6.263c-.725 0-1.313-.6-1.313-1.342 0-.741.588-1.342 1.313-1.342.724 0 1.312.6 1.312 1.342 0 .741-.588 1.342-1.313 1.342z\" />\n </svg>\n )\n}\n\nexport default TrainIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,OAAO,CAAA;IAEpB,SAAS,GAAG,UAAC,EAKP;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,qgBAAqgB,GAAG,CAC5gB,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/UserShieldIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "userShield";
 var UserShieldIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/UserShieldIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UserShieldIcon.js","sources":["../../../../src/components/Icon/__generated__/UserShieldIcon.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 = \"userShield\"\n\nconst UserShieldIcon = ({\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=\"M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 4a3 3 0 110 6 3 3 0 010-6zm5.13 12A9.69 9.69 0 0112 20.92 9.69 9.69 0 016.87 17c-.34-.5-.63-1-.87-1.53 0-1.65 2.71-3 6-3s6 1.32 6 3c-.24.53-.53 1.03-.87 1.53z\" />\n </svg>\n )\n}\n\nexport default UserShieldIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,YAAY,CAAA;IAEzB,cAAc,GAAG,UAAC,EAKZ;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,mOAAmO,GAAG,CAC1O,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"UserShieldIcon.js","sources":["../../../../src/components/Icon/__generated__/UserShieldIcon.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 = \"userShield\"\n\nconst UserShieldIcon = ({\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=\"M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 4a3 3 0 110 6 3 3 0 010-6zm5.13 12A9.69 9.69 0 0112 20.92 9.69 9.69 0 016.87 17c-.34-.5-.63-1-.87-1.53 0-1.65 2.71-3 6-3s6 1.32 6 3c-.24.53-.53 1.03-.87 1.53z\" />\n </svg>\n )\n}\n\nexport default UserShieldIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,YAAY,CAAA;IAEzB,cAAc,GAAG,UAAC,EAKZ;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BAAM,CAAC,EAAC,mOAAmO,GAAG,CAC1O,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/VerifiedSealIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ var iconSource = "verifiedSeal";
 var VerifiedSealIcon = 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

package/components/Icon/__generated__/VerifiedSealIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VerifiedSealIcon.js","sources":["../../../../src/components/Icon/__generated__/VerifiedSealIcon.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 = \"verifiedSeal\"\n\nconst VerifiedSealIcon = ({\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 d=\"m22 11.51-2.218-2.528.309-3.346-3.282-.745-1.718-2.891-3.091 1.327-3.09-1.327-1.72 2.89-3.28.737.308 3.346-2.218 2.536 2.218 2.527-.309 3.355 3.282.745 1.718 2.891 3.091-1.336 3.09 1.327 1.72-2.89 3.28-.746-.308-3.346zm-11.818 4.545-3.637-3.637 1.282-1.282 2.355 2.346 5.99-5.991 1.283 1.29z\"\n fillRule=\"evenodd\"\n />\n </svg>\n )\n}\n\nexport default VerifiedSealIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,cAAc,CAAA;IAE3B,gBAAgB,GAAG,UAAC,EAKd;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BACE,CAAC,EAAC,qSAAqS,EACvS,QAAQ,EAAC,SAAS,GAClB,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"VerifiedSealIcon.js","sources":["../../../../src/components/Icon/__generated__/VerifiedSealIcon.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 = \"verifiedSeal\"\n\nconst VerifiedSealIcon = ({\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 d=\"m22 11.51-2.218-2.528.309-3.346-3.282-.745-1.718-2.891-3.091 1.327-3.09-1.327-1.72 2.89-3.28.737.308 3.346-2.218 2.536 2.218 2.527-.309 3.355 3.282.745 1.718 2.891 3.091-1.336 3.09 1.327 1.72-2.89 3.28-.746-.308-3.346zm-11.818 4.545-3.637-3.637 1.282-1.282 2.355 2.346 5.99-5.991 1.283 1.29z\"\n fillRule=\"evenodd\"\n />\n </svg>\n )\n}\n\nexport default VerifiedSealIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,cAAc,CAAA;IAE3B,gBAAgB,GAAG,UAAC,EAKd;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B;QACzD,8BACE,CAAC,EAAC,qSAAqS,EACvS,QAAQ,EAAC,SAAS,GAClB,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/WrenchIcon.js CHANGED Viewed

@@ -7,8 +7,8 @@ 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--" + iconSource, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,

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

	@@ -1 +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 xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M6.53 3.53a6 6 0 0 1 7.885 8.057l6 5.999a2 2 0 0 1-2.83 2.828l-5.998-5.999A6 6 0 0 1 3.53 6.53L8 11l3-3-4.47-4.47z\" />\n </svg>\n )\n}\n\nexport default WrenchIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,QAAQ,CAAA;IAErB,UAAU,GAAG,UAAC,EAKR;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~UAAY~~;QAEtC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW;QACzD,8BAAM,CAAC,EAAC,oHAAoH,GAAG,CAC3H,CACP,CAAA;AACH;;;;"}
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 xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M6.53 3.53a6 6 0 0 1 7.885 8.057l6 5.999a2 2 0 0 1-2.83 2.828l-5.998-5.999A6 6 0 0 1 3.53 6.53L8 11l3-3-4.47-4.47z\" />\n </svg>\n )\n}\n\nexport default WrenchIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,QAAQ,CAAA;IAErB,UAAU,GAAG,UAAC,EAKR;;QAJV,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,UAAU,CAAE;QAEtC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,IAAI,GAAG,UAAC,OAAwB,IAAK,QACzC,8BAAM,SAAS,EAAE,iBAAiB,IAAG,OAAO,CAAQ,IACrD,CAAA;IAED,OAAO,IAAI,CACT,6BAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW;QACzD,8BAAM,CAAC,EAAC,oHAAoH,GAAG,CAC3H,CACP,CAAA;AACH;;;;"}

package/components/Icon/index.js CHANGED Viewed

@@ -45,8 +45,8 @@ var isIconSource = function (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--" + source, (_b = {},
-        _b["cobalt-Icon--color" + capitalize(color)] = color,
+    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,
@@ -54,7 +54,7 @@ var Icon = function (_a) {
         _b));
     var iconSource = BUNDLED_ICONS[source];
     if (iconSource == null)
-        throw new Error("Icon '" + source + "' can not be found. Did you add the source, export it and run 'yarn run icons:update'?");
+        throw new Error("Icon '".concat(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 CHANGED Viewed

	@@ -1 +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;IAED,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;;IAAK,8BACnB,YAAY,gBACd,IAAI,IAAID,KAAkB,CAAC,IAAI,CAAC;AAFX,CAGtB,EACF,EAAE,CACH,EACF;IAIY,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;IAoBG,YAAY,GAAG,UAAC,MAAc;IACzC,OAAA,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC;AAA9C,EAA8C;IAEnC,IAAI,GAAG,UAAC,EAMT;;QALV,MAAM,YAAA,EACN,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,~~8BAA4B~~,~~MAAQ~~;QAElC,GAAC,~~uBAAqB~~,UAAU,CAAC,KAAK,~~CAAG~~,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAA;IAExC,IAAI,UAAU,IAAI,IAAI;QACpB,MAAM,IAAI,KAAK,CACb,~~WAAS~~,MAAM,2FAAwF,CACxG,CAAA;IAEH,QACE,8BACE,SAAS,EAAE,iBAAiB,EAC5B,uBAAuB,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,GAC/C,EACH;AACH;;;;"}
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;IAED,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;;IAAK,8BACnB,YAAY,gBACd,IAAI,IAAID,KAAkB,CAAC,IAAI,CAAC;AAFX,CAGtB,EACF,EAAE,CACH,EACF;IAIY,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;IAoBG,YAAY,GAAG,UAAC,MAAc;IACzC,OAAA,MAAM,CAAC,IAAI,CAACC,KAAU,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC;AAA9C,EAA8C;IAEnC,IAAI,GAAG,UAAC,EAMT;;QALV,MAAM,YAAA,EACN,KAAK,WAAA,EACL,YAAS,EAAT,IAAI,mBAAG,EAAE,KAAA,EACT,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,SAAS,eAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,mCAA4B,MAAM,CAAE;QAElC,GAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,yBAAqB,GAAE,IAAI,KAAK,EAAE;QAClC,4BAAwB,GAAE,SAAS;YAEtC,CAAA;IAED,IAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAA;IAExC,IAAI,UAAU,IAAI,IAAI;QACpB,MAAM,IAAI,KAAK,CACb,gBAAS,MAAM,2FAAwF,CACxG,CAAA;IAEH,QACE,8BACE,SAAS,EAAE,iBAAiB,EAC5B,uBAAuB,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,GAC/C,EACH;AACH;;;;"}

package/components/Modal/index.js CHANGED Viewed

@@ -41,8 +41,8 @@ var _Modal = forwardRef(function (_a, ref) {
         // dangerouslyBypassScrollLock is used to disabled it
         // + fake scrollbar width to avoid visual layout shift
         if (isOpen) {
-            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.paddingRight = "".concat(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 () {
@@ -99,7 +99,7 @@ var _Modal = forwardRef(function (_a, ref) {
         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 }, dangerouslyBypassScrollLock: true },
+        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,

package/components/Modal/index.js.map CHANGED Viewed

	@@ -1 +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 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 }: ModalPropsType,\n ref\n ) => {\n const defaultBodyStyle =\n useRef<Record<\"paddingRight\" \| \"overflow\", string>>()\n\n useEffect(() => {\n defaultBodyStyle.current = {\n paddingRight: document.body.style.paddingRight,\n overflow: document.body.style.overflow,\n }\n }, [])\n\n const restoreDefaultBodyStyle = () => {\n if (defaultBodyStyle.current) {\n const { overflow, paddingRight } = defaultBodyStyle.current\n setTimeout(() => {\n // setTimeout is used to ensure that the restore style job is done as a final step\n document.body.style.overflow = overflow\n document.body.style.paddingRight = paddingRight\n }, 0)\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 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 overlayOpacity: 1,\n modalTransform: 0,\n config: springConfig,\n },\n 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 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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"}
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 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 }: ModalPropsType,\n ref\n ) => {\n const defaultBodyStyle =\n useRef<Record<\"paddingRight\" \| \"overflow\", string>>()\n\n useEffect(() => {\n defaultBodyStyle.current = {\n paddingRight: document.body.style.paddingRight,\n overflow: document.body.style.overflow,\n }\n }, [])\n\n const restoreDefaultBodyStyle = () => {\n if (defaultBodyStyle.current) {\n const { overflow, paddingRight } = defaultBodyStyle.current\n setTimeout(() => {\n // setTimeout is used to ensure that the restore style job is done as a final step\n document.body.style.overflow = overflow\n document.body.style.paddingRight = paddingRight\n }, 0)\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 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 overlayOpacity: 1,\n modalTransform: 0,\n config: springConfig,\n },\n 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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"}

package/components/PhotoDropzone/index.js ADDED Viewed

@@ -0,0 +1,189 @@
+import { __read, __awaiter, __generator } from '../../_virtual/_tslib.js';
+import VisuallyHidden from '@reach/visually-hidden';
+import React, { useRef, useState } from 'react';
+import cx from 'classnames';
+import '../Icon/index.js';
+import { validateFile } from '../utils/validateFile.js';
+import Popover from '../Popover/index.js';
+import ContextualWarningCircleFilledIcon from '../Icon/__generated__/ContextualWarningCircleFilledIcon.js';
+import BinIcon from '../Icon/__generated__/BinIcon.js';
+import PlusIcon from '../Icon/__generated__/PlusIcon.js';
+import LoadingIcon from '../Icon/__generated__/LoadingIcon.js';
+var ACCEPTED_MAX_SIZE_MB = 10;
+var ACCEPTED_PHOTOS_TYPES = ["jpg", "jpeg", "png", "gif"];
+var ERROR_DISPLAY_TIME = 6000;
+var ACCEPTED_TYPES_LOCALE_STRING = ACCEPTED_PHOTOS_TYPES.join(", ");
+var preventEventDefaults = function (e) {
+    e.preventDefault && e.preventDefault();
+    e.stopPropagation && e.stopPropagation();
+};
+var isEnterOrSpaceKey = function (event) {
+    return event.key === "Enter" || event.key === " ";
+};
+var PhotoDropzone = function (_a) {
+    var className = _a.className, description = _a.description, deletePopoverContent = _a.deletePopoverContent, errorContent = _a.errorContent, onDropped = _a.onDropped, onPhotoDelete = _a.onPhotoDelete, _b = _a.initialImageUrl, initialImageUrl = _b === void 0 ? "" : _b;
+    var fileInputRef = useRef(null);
+    var deleteButtonRef = useRef(null);
+    var _c = __read(useState(false), 2), isDragging = _c[0], setIsDragging = _c[1];
+    var _d = __read(useState(false), 2), isLoading = _d[0], setIsLoading = _d[1];
+    var _e = __read(useState(false), 2), isErrored = _e[0], setIsErrored = _e[1];
+    var _f = __read(useState(initialImageUrl), 2), imagePreviewUrl = _f[0], setImagePreviewUrl = _f[1];
+    var _g = __read(useState(false), 2), displayDeletion = _g[0], setDisplayDeletion = _g[1];
+    var _h = __read(useState(false), 2), showDeletePopover = _h[0], setShowDeletePopover = _h[1];
+    var openDeletePopover = function (event) {
+        event && preventEventDefaults(event);
+        setShowDeletePopover(true);
+    };
+    var closeDeletePopover = function (event) {
+        event && preventEventDefaults(event);
+        setShowDeletePopover(false);
+    };
+    var onDropzoneMouseEnter = function (event) {
+        event && preventEventDefaults(event);
+        if (imagePreviewUrl)
+            setDisplayDeletion(true);
+    };
+    var onDropzoneMouseLeave = function (event) {
+        event && preventEventDefaults(event);
+        if (displayDeletion && !showDeletePopover)
+            setDisplayDeletion(false);
+    };
+    var onDropzoneClick = function (event) {
+        var _a;
+        event && preventEventDefaults(event);
+        if (isLoading)
+            return;
+        if (isErrored)
+            setIsErrored(false);
+        if (imagePreviewUrl) {
+            if (showDeletePopover)
+                closeDeletePopover();
+            return setDisplayDeletion(!displayDeletion);
+        }
+        (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    var onDropzoneKey = function (event) {
+        if (showDeletePopover)
+            return;
+        if (isEnterOrSpaceKey(event)) {
+            onDropzoneClick();
+        }
+    };
+    var onDeleteKey = function (event) {
+        if (isEnterOrSpaceKey(event)) {
+            openDeletePopover(event);
+        }
+    };
+    var onDelete = function () {
+        if (fileInputRef.current)
+            fileInputRef.current.value = "";
+        closeDeletePopover();
+        setImagePreviewUrl("");
+        onPhotoDelete && onPhotoDelete();
+    };
+    var onDragEnter = function (event) {
+        preventEventDefaults(event);
+        if (isErrored)
+            setIsErrored(false);
+        !imagePreviewUrl && setIsDragging(true);
+    };
+    var onDragLeave = function (event) {
+        preventEventDefaults(event);
+        setIsDragging(false);
+    };
+    var processFile = function (fileToProcess) { return __awaiter(void 0, void 0, void 0, function () {
+        var isValidFile, imageSrc;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setIsDragging(false);
+                    setIsErrored(false);
+                    setIsLoading(true);
+                    return [4 /*yield*/, validateFile(fileToProcess, function (fileToValidate, extension) {
+                            var maxFileSize = ACCEPTED_MAX_SIZE_MB * 1000 * 1000;
+                            var acceptedFileTypes = ACCEPTED_PHOTOS_TYPES;
+                            if (fileToValidate.size > maxFileSize) {
+                                return false;
+                            }
+                            else if (!extension || !acceptedFileTypes.includes(extension)) {
+                                return false;
+                            }
+                            else {
+                                return true;
+                            }
+                        })];
+                case 1:
+                    isValidFile = _a.sent();
+                    if (!isValidFile) return [3 /*break*/, 3];
+                    imageSrc = URL.createObjectURL(fileToProcess);
+                    setImagePreviewUrl(imageSrc);
+                    return [4 /*yield*/, onDropped(fileToProcess)];
+                case 2:
+                    _a.sent();
+                    setIsLoading(false);
+                    return [3 /*break*/, 4];
+                case 3:
+                    setIsLoading(false);
+                    setIsErrored(true);
+                    setTimeout(function () {
+                        setIsErrored(false);
+                    }, ERROR_DISPLAY_TIME);
+                    _a.label = 4;
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    var onFileInputChanged = function (event) {
+        var _a;
+        if ((_a = event.target.files) === null || _a === void 0 ? void 0 : _a.length) {
+            processFile(event.target.files[0]);
+        }
+    };
+    var onDrop = function (event) {
+        var _a, _b;
+        preventEventDefaults(event);
+        if (((_b = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b.length) && !imagePreviewUrl) {
+            processFile(event.dataTransfer.files[0]);
+        }
+    };
+    var onDeleteButtonClick = showDeletePopover
+        ? closeDeletePopover
+        : openDeletePopover;
+    return (React.createElement("div", { tabIndex: 0, className: cx("cobalt-photo-dropzone", className, {
+            "cobalt-photo-dropzone--filled": imagePreviewUrl,
+            "cobalt-photo-dropzone--dragging": isDragging,
+            "cobalt-photo-dropzone--loading": isLoading,
+            "cobalt-photo-dropzone--errored": isErrored,
+        }), onMouseEnter: onDropzoneMouseEnter, onMouseLeave: onDropzoneMouseLeave, onDragEnter: onDragEnter, onDragLeave: onDragLeave,
+        // Not on click because we also use mouseEnter listener
+        onMouseUp: onDropzoneClick, onTouchEnd: onDropzoneClick, onKeyUp: onDropzoneKey, onDrop: onDrop,
+        // Need to reset those listeners to avoid default browser behaviour
+        onDragStart: preventEventDefaults, onDragEnd: preventEventDefaults, onDragOver: preventEventDefaults },
+        isErrored && (React.createElement("div", { className: "cobalt-photo-dropzone__description" },
+            React.createElement(ContextualWarningCircleFilledIcon, { color: "red" }),
+            errorContent(ACCEPTED_TYPES_LOCALE_STRING, ACCEPTED_MAX_SIZE_MB))),
+        isLoading && (React.createElement("div", { className: "cobalt-photo-dropzone__description" },
+            React.createElement(LoadingIcon, null))),
+        !isLoading &&
+            !isErrored &&
+            (imagePreviewUrl ? (React.createElement(React.Fragment, null,
+                React.createElement("img", { className: "cobalt-photo-dropzone__preview", src: imagePreviewUrl }),
+                React.createElement("div", null,
+                    React.createElement("button", { className: cx("cobalt-photo-dropzone__delete-button", {
+                            "cobalt-photo-dropzone__delete-button--triggered": displayDeletion,
+                        }), ref: deleteButtonRef,
+                        // Must follow the click listeners on the dropzone,
+                        // in order to have the correct events bubbling
+                        onTouchEnd: onDeleteButtonClick, onMouseUp: onDeleteButtonClick, onKeyUp: onDeleteKey },
+                        React.createElement(VisuallyHidden, null, "Delete"),
+                        React.createElement(BinIcon, { color: "indigo" })),
+                    React.createElement(Popover, { targetRef: deleteButtonRef, isOpen: showDeletePopover, close: closeDeletePopover, placement: "left-start", distance: 12, bodySpacing: false, arrow: true }, deletePopoverContent(onDelete, closeDeletePopover))))) : (React.createElement("div", { className: "cobalt-photo-dropzone__description cobalt-photo-dropzone__description--strong" },
+                React.createElement("p", null, description),
+                React.createElement(PlusIcon, null)))),
+        React.createElement(VisuallyHidden, null,
+            React.createElement("input", { ref: fileInputRef, type: "file", onChange: onFileInputChanged, accept: ACCEPTED_PHOTOS_TYPES.map(function (ext) { return ".".concat(ext); }).join(","), multiple: false }))));
+};
+export { PhotoDropzone as default };
+//# sourceMappingURL=index.js.map