npm - @drivy/cobalt - Versions diffs - 1.5.0 → 2.0.0-beta.2 - Mend

@drivy/cobalt 1.5.0 → 2.0.0-beta.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 (733) hide show

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "reset";
 const ResetIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ResetIcon.js","sources":["../../../../src/components/Icon/__generated__/ResetIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"reset\"\nconst ResetIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.418278 0-8 3.581722-8 8s3.581722 8 8 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.3137085 0-6-2.6862915-6-6s2.6862915-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\" />\n </svg>\n )\n}\nexport default ResetIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,OAAO,CAAA;AAC1B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,8NAA8N,EAAG,CAAA,CACrO,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ResetIcon.js","sources":["../../../../src/components/Icon/__generated__/ResetIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"reset\"\nconst ResetIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.418278 0-8 3.581722-8 8s3.581722 8 8 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.3137085 0-6-2.6862915-6-6s2.6862915-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\" />\n </svg>\n )\n}\nexport default ResetIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,OAAO,CAAA;AAC1B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,8NAA8N,EAAG,CAAA,CACrO,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "ride";
 const RideIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RideIcon.js","sources":["../../../../src/components/Icon/__generated__/RideIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"ride\"\nconst RideIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M18.5 7.3h-7.8L6.8 12v2.3h1.6c0 1.3 1 2.3 2.3 2.3 1.3 0 2.3-1 2.3-2.3h4.7c0 1.3 1 2.3 2.3 2.3 1.3 0 2.3-1 2.3-2.3H24V12c0-.9-.7-1.6-1.6-1.6h-1.6l-2.3-3.1Zm-7.4 1.2h3.1v2H9.5l1.6-2Zm4.3 0h2.7l1.5 2h-4.3v-2h.1Zm-4.7 4.7c.6 0 1.2.5 1.2 1.2 0 .6-.5 1.2-1.2 1.2s-1.2-.6-1.2-1.3c0-.6.6-1.1 1.2-1.1Zm9.4 0c.6 0 1.2.5 1.2 1.2 0 .6-.5 1.2-1.2 1.2-.6 0-1.2-.5-1.2-1.2s.5-1.2 1.2-1.2ZM7.5 8.7h-3c-.3 0-.6-.3-.6-.7 0-.4.3-.6.6-.6h2.9c.4 0 .6.3.6.6.1.4-.2.7-.5.7Zm-2.6 5.1h-3c-.4 0-.6-.3-.6-.6 0-.4.3-.6.6-.6h2.9c.4 0 .6.3.6.6.1.3-.2.6-.5.6ZM6 11.1H.6c-.4 0-.6-.3-.6-.6s.3-.6.6-.6H6c.4 0 .6.3.6.6s-.2.6-.6.6Z\"\n />\n </svg>\n )\n}\nexport default RideIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,MAAM,CAAA;AACzB,MAAM,QAAQ,GAAG,CAAC,EAChB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,qlBAAqlB,EACvlB,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"RideIcon.js","sources":["../../../../src/components/Icon/__generated__/RideIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"ride\"\nconst RideIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M18.5 7.3h-7.8L6.8 12v2.3h1.6c0 1.3 1 2.3 2.3 2.3 1.3 0 2.3-1 2.3-2.3h4.7c0 1.3 1 2.3 2.3 2.3 1.3 0 2.3-1 2.3-2.3H24V12c0-.9-.7-1.6-1.6-1.6h-1.6l-2.3-3.1Zm-7.4 1.2h3.1v2H9.5l1.6-2Zm4.3 0h2.7l1.5 2h-4.3v-2h.1Zm-4.7 4.7c.6 0 1.2.5 1.2 1.2 0 .6-.5 1.2-1.2 1.2s-1.2-.6-1.2-1.3c0-.6.6-1.1 1.2-1.1Zm9.4 0c.6 0 1.2.5 1.2 1.2 0 .6-.5 1.2-1.2 1.2-.6 0-1.2-.5-1.2-1.2s.5-1.2 1.2-1.2ZM7.5 8.7h-3c-.3 0-.6-.3-.6-.7 0-.4.3-.6.6-.6h2.9c.4 0 .6.3.6.6.1.4-.2.7-.5.7Zm-2.6 5.1h-3c-.4 0-.6-.3-.6-.6 0-.4.3-.6.6-.6h2.9c.4 0 .6.3.6.6.1.3-.2.6-.5.6ZM6 11.1H.6c-.4 0-.6-.3-.6-.6s.3-.6.6-.6H6c.4 0 .6.3.6.6s-.2.6-.6.6Z\"\n />\n </svg>\n )\n}\nexport default RideIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,MAAM,CAAA;AACzB,MAAM,QAAQ,GAAG,CAAC,EAChB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,qlBAAqlB,EACvlB,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "roofBox";
 const RoofBoxIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RoofBoxIcon.js","sources":["../../../../src/components/Icon/__generated__/RoofBoxIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"roofBox\"\nconst RoofBoxIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M9.497 4h6.006A3.001 3.001 0 0 1 18.5 7v2.009c0 .548-.456.991-1.003.991H7.503A1.002 1.002 0 0 1 6.5 9.009V7c0-1.657 1.342-3 2.997-3ZM7 23a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm11 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3ZM6 18c0-1 0-5 3.5-5h6c3.5 0 3.5 4 3.5 5H6Zm10-7H9c-2.36 0-4.039 1.82-4.882 4.539a1.75 1.75 0 1 0-.59 3.447c-.018.333-.028.671-.028 1.014v4h17.972l.028-4c0-.343-.01-.681-.028-1.014a1.75 1.75 0 1 0-.59-3.447C20.039 12.82 18.36 11 16 11Z\"\n />\n </svg>\n )\n}\nexport default RoofBoxIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,SAAS,CAAA;AAC5B,MAAM,WAAW,GAAG,CAAC,EACnB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,ocAAoc,EACtc,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"RoofBoxIcon.js","sources":["../../../../src/components/Icon/__generated__/RoofBoxIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"roofBox\"\nconst RoofBoxIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M9.497 4h6.006A3.001 3.001 0 0 1 18.5 7v2.009c0 .548-.456.991-1.003.991H7.503A1.002 1.002 0 0 1 6.5 9.009V7c0-1.657 1.342-3 2.997-3ZM7 23a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm11 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3ZM6 18c0-1 0-5 3.5-5h6c3.5 0 3.5 4 3.5 5H6Zm10-7H9c-2.36 0-4.039 1.82-4.882 4.539a1.75 1.75 0 1 0-.59 3.447c-.018.333-.028.671-.028 1.014v4h17.972l.028-4c0-.343-.01-.681-.028-1.014a1.75 1.75 0 1 0-.59-3.447C20.039 12.82 18.36 11 16 11Z\"\n />\n </svg>\n )\n}\nexport default RoofBoxIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,SAAS,CAAA;AAC5B,MAAM,WAAW,GAAG,CAAC,EACnB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,ocAAoc,EACtc,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "rotate";
 const RotateIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RotateIcon.js","sources":["../../../../src/components/Icon/__generated__/RotateIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"rotate\"\nconst RotateIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M13.05 22v-2.05a7.3 7.3 0 0 0 1.662-.45 7 7 0 0 0 1.538-.85l1.4 1.45q-1.05.8-2.2 1.287a8.2 8.2 0 0 1-2.4.613m-2 0q-3.45-.45-5.725-2.988T3.05 13.05q0-1.874.712-3.513a9.2 9.2 0 0 1 1.925-2.85 9.2 9.2 0 0 1 2.85-1.925 8.7 8.7 0 0 1 3.513-.712h.15L10.65 2.5l1.4-1.45 4 4-4 4-1.4-1.4 1.6-1.6h-.2q-2.925 0-4.963 2.037Q5.05 10.125 5.05 13.05q0 2.6 1.7 4.563t4.3 2.337zm8.05-3.35-1.45-1.4q.525-.725.85-1.537a7.3 7.3 0 0 0 .45-1.663H21a8.2 8.2 0 0 1-.613 2.4q-.488 1.15-1.287 2.2m1.9-6.6h-2.05a7.3 7.3 0 0 0-.45-1.663 7.1 7.1 0 0 0-.85-1.537l1.45-1.4q.8.975 1.275 2.15T21 12.05\" />\n </svg>\n )\n}\nexport default RotateIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,QAAQ,CAAA;AAC3B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,0jBAA0jB,EAAG,CAAA,CACjkB,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"RotateIcon.js","sources":["../../../../src/components/Icon/__generated__/RotateIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"rotate\"\nconst RotateIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M13.05 22v-2.05a7.3 7.3 0 0 0 1.662-.45 7 7 0 0 0 1.538-.85l1.4 1.45q-1.05.8-2.2 1.287a8.2 8.2 0 0 1-2.4.613m-2 0q-3.45-.45-5.725-2.988T3.05 13.05q0-1.874.712-3.513a9.2 9.2 0 0 1 1.925-2.85 9.2 9.2 0 0 1 2.85-1.925 8.7 8.7 0 0 1 3.513-.712h.15L10.65 2.5l1.4-1.45 4 4-4 4-1.4-1.4 1.6-1.6h-.2q-2.925 0-4.963 2.037Q5.05 10.125 5.05 13.05q0 2.6 1.7 4.563t4.3 2.337zm8.05-3.35-1.45-1.4q.525-.725.85-1.537a7.3 7.3 0 0 0 .45-1.663H21a8.2 8.2 0 0 1-.613 2.4q-.488 1.15-1.287 2.2m1.9-6.6h-2.05a7.3 7.3 0 0 0-.45-1.663 7.1 7.1 0 0 0-.85-1.537l1.45-1.4q.8.975 1.275 2.15T21 12.05\" />\n </svg>\n )\n}\nexport default RotateIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,QAAQ,CAAA;AAC3B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,0jBAA0jB,EAAG,CAAA,CACjkB,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "sealCheck";
 const SealCheckIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SealCheckIcon.js","sources":["../../../../src/components/Icon/__generated__/SealCheckIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"sealCheck\"\nconst SealCheckIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m22 11.51-2.218-2.528.309-3.346-3.282-.745L15.091 2 12 3.327 8.91 2 7.19 4.89l-3.28.737.308 3.346L2 11.509l2.218 2.527-.309 3.355 3.282.745 1.718 2.891L12 19.691l3.09 1.327 1.72-2.89 3.28-.746-.308-3.346L22 11.51Zm-11.818 4.545-3.637-3.637 1.282-1.282 2.355 2.346 5.99-5.991 1.282 1.29-7.272 7.274Z\"\n />\n </svg>\n )\n}\nexport default SealCheckIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,WAAW,CAAA;AAC9B,MAAM,aAAa,GAAG,CAAC,EACrB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SealCheckIcon.js","sources":["../../../../src/components/Icon/__generated__/SealCheckIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"sealCheck\"\nconst SealCheckIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m22 11.51-2.218-2.528.309-3.346-3.282-.745L15.091 2 12 3.327 8.91 2 7.19 4.89l-3.28.737.308 3.346L2 11.509l2.218 2.527-.309 3.355 3.282.745 1.718 2.891L12 19.691l3.09 1.327 1.72-2.89 3.28-.746-.308-3.346L22 11.51Zm-11.818 4.545-3.637-3.637 1.282-1.282 2.355 2.346 5.99-5.991 1.282 1.29-7.272 7.274Z\"\n />\n </svg>\n )\n}\nexport default SealCheckIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,WAAW,CAAA;AAC9B,MAAM,aAAa,GAAG,CAAC,EACrB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "searchCar";
 const SearchCarIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchCarIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchCarIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"searchCar\"\nconst SearchCarIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlSpace=\"preserve\"\n style={{\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n strokeLinejoin: \"round\",\n strokeMiterlimit: 2,\n }}\n >\n <path\n d=\"M15.695 18.052a9.895 9.895 0 0 1-5.753 1.833C4.451 19.885 0 15.434 0 9.942 0 4.451 4.451 0 9.942 0c5.492 0 9.943 4.451 9.943 9.942a9.9 9.9 0 0 1-1.833 5.754l5.653 5.654a1 1 0 0 1 0 1.414l-.943.943a.999.999 0 0 1-1.414 0l-5.653-5.655Zm-.496-10.179C14.904 6.341 14.141 5 12.171 5H7.886c-1.97 0-2.733 1.341-3.028 2.873A1.072 1.072 0 1 0 4.671 10h.004c-.004.25-.004.49-.004.714v3.57c0 .403.323.716.721.716h1.416a.715.715 0 0 0 .721-.716v-.713h5v.713c0 .403.322.716.721.716h1.415a.715.715 0 0 0 .721-.716v-3.57c0-.224 0-.464-.004-.714h.004a1.072 1.072 0 1 0-.187-2.127Zm-1.309.917c.017.168.03.327.04.496H6.127c.01-.169.023-.328.04-.496.175-1.699.635-2.361 1.719-2.361h4.285c1.084 0 1.544.662 1.719 2.361Zm-7.076 3.531a.892.892 0 1 1-.001-1.785.892.892 0 0 1 .001 1.785Zm6.429 0a.892.892 0 1 1-.001-1.785.892.892 0 0 1 .001 1.785Z\"\n style={{\n fillRule: \"nonzero\",\n }}\n />\n </svg>\n )\n}\nexport default SearchCarIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,WAAW,CAAA;AAC9B,MAAM,aAAa,GAAG,CAAC,EACrB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;AACD,IAAA,OAAO,IAAI,CACT,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,EAClC,QAAQ,EAAC,UAAU,EACnB,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,SAAS;AACnB,YAAA,QAAQ,EAAE,SAAS;AACnB,YAAA,cAAc,EAAE,OAAO;AACvB,YAAA,gBAAgB,EAAE,CAAC;AACpB,SAAA,EAAA;AAED,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,0zBAA0zB,EAC5zB,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,SAAS;aACpB,EACD,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SearchCarIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchCarIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"searchCar\"\nconst SearchCarIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlSpace=\"preserve\"\n style={{\n fillRule: \"evenodd\",\n clipRule: \"evenodd\",\n strokeLinejoin: \"round\",\n strokeMiterlimit: 2,\n }}\n >\n <path\n d=\"M15.695 18.052a9.895 9.895 0 0 1-5.753 1.833C4.451 19.885 0 15.434 0 9.942 0 4.451 4.451 0 9.942 0c5.492 0 9.943 4.451 9.943 9.942a9.9 9.9 0 0 1-1.833 5.754l5.653 5.654a1 1 0 0 1 0 1.414l-.943.943a.999.999 0 0 1-1.414 0l-5.653-5.655Zm-.496-10.179C14.904 6.341 14.141 5 12.171 5H7.886c-1.97 0-2.733 1.341-3.028 2.873A1.072 1.072 0 1 0 4.671 10h.004c-.004.25-.004.49-.004.714v3.57c0 .403.323.716.721.716h1.416a.715.715 0 0 0 .721-.716v-.713h5v.713c0 .403.322.716.721.716h1.415a.715.715 0 0 0 .721-.716v-3.57c0-.224 0-.464-.004-.714h.004a1.072 1.072 0 1 0-.187-2.127Zm-1.309.917c.017.168.03.327.04.496H6.127c.01-.169.023-.328.04-.496.175-1.699.635-2.361 1.719-2.361h4.285c1.084 0 1.544.662 1.719 2.361Zm-7.076 3.531a.892.892 0 1 1-.001-1.785.892.892 0 0 1 .001 1.785Zm6.429 0a.892.892 0 1 1-.001-1.785.892.892 0 0 1 .001 1.785Z\"\n style={{\n fillRule: \"nonzero\",\n }}\n />\n </svg>\n )\n}\nexport default SearchCarIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,WAAW,CAAA;AAC9B,MAAM,aAAa,GAAG,CAAC,EACrB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;AACD,IAAA,OAAO,IAAI,CACT,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,EAClC,QAAQ,EAAC,UAAU,EACnB,KAAK,EAAE;AACL,YAAA,QAAQ,EAAE,SAAS;AACnB,YAAA,QAAQ,EAAE,SAAS;AACnB,YAAA,cAAc,EAAE,OAAO;AACvB,YAAA,gBAAgB,EAAE,CAAC;AACpB,SAAA,EAAA;AAED,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,0zBAA0zB,EAC5zB,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,SAAS;aACpB,EACD,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "search";
 const SearchIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"search\"\nconst SearchIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m19.313 21.082-4.24-4.24a7.457 7.457 0 1 1 1.768-1.768l4.24 4.24a.75.75 0 0 1 0 1.061l-.707.707a.75.75 0 0 1-1.06 0ZM5.802 10.76a4.957 4.957 0 1 0 9.914 0 4.957 4.957 0 0 0-9.914 0Z\"\n />\n </svg>\n )\n}\nexport default SearchIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,QAAQ,CAAA;AAC3B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,uLAAuL,EACzL,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SearchIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"search\"\nconst SearchIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m19.313 21.082-4.24-4.24a7.457 7.457 0 1 1 1.768-1.768l4.24 4.24a.75.75 0 0 1 0 1.061l-.707.707a.75.75 0 0 1-1.06 0ZM5.802 10.76a4.957 4.957 0 1 0 9.914 0 4.957 4.957 0 0 0-9.914 0Z\"\n />\n </svg>\n )\n}\nexport default SearchIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,QAAQ,CAAA;AAC3B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,uLAAuL,EACzL,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "searchPeople";
 const SearchPeopleIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchPeopleIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchPeopleIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"searchPeople\"\nconst SearchPeopleIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m15.073 16.841 4.24 4.241a.75.75 0 0 0 1.06 0l.707-.707a.75.75 0 0 0 0-1.06l-4.24-4.241a7.457 7.457 0 1 0-1.768 1.768ZM10.75 7a1.875 1.875 0 1 1 0 3.75 1.875 1.875 0 0 1 0-3.75Zm3.75 6.563c0-1.036-1.678-1.876-3.75-1.876S7 12.527 7 13.563v.937h7.5v-.938Z\"\n />\n </svg>\n )\n}\nexport default SearchPeopleIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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;;;;"}
1	+ {"version":3,"file":"SearchPeopleIcon.js","sources":["../../../../src/components/Icon/__generated__/SearchPeopleIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"searchPeople\"\nconst SearchPeopleIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"m15.073 16.841 4.24 4.241a.75.75 0 0 0 1.06 0l.707-.707a.75.75 0 0 0 0-1.06l-4.24-4.241a7.457 7.457 0 1 0-1.768 1.768ZM10.75 7a1.875 1.875 0 1 1 0 3.75 1.875 1.875 0 0 1 0-3.75Zm3.75 6.563c0-1.036-1.678-1.876-3.75-1.876S7 12.527 7 13.563v.937h7.5v-.938Z\"\n />\n </svg>\n )\n}\nexport default SearchPeopleIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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/__generated__/SedanIcon.js CHANGED Viewed

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "sedan";
 const SedanIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SedanIcon.js","sources":["../../../../src/components/Icon/__generated__/SedanIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"sedan\"\nconst SedanIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M5 8.5h7l7 3.5h2a2 2 0 0 1 2 2v2h-2.18c-.42 1.2-1.55 2-2.82 2-1.27 0-2.4-.8-2.83-2H7.82C7.4 17.2 6.27 18 5 18c-1.27 0-2.4-.8-2.83-2H1v-4.445a1 1 0 0 1 .47-.849L5 8.5Zm.5 1.5-2.948 2H15.5l-4-2h-6Zm.56 3.94a1.5 1.5 0 1 0-2.12 2.12 1.5 1.5 0 0 0 2.12-2.12Zm13 0a1.5 1.5 0 1 0-2.12 2.12 1.5 1.5 0 0 0 2.12-2.12Z\"\n />\n </svg>\n )\n}\nexport default SedanIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,OAAO,CAAA;AAC1B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,qTAAqT,EACvT,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SedanIcon.js","sources":["../../../../src/components/Icon/__generated__/SedanIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"sedan\"\nconst SedanIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M5 8.5h7l7 3.5h2a2 2 0 0 1 2 2v2h-2.18c-.42 1.2-1.55 2-2.82 2-1.27 0-2.4-.8-2.83-2H7.82C7.4 17.2 6.27 18 5 18c-1.27 0-2.4-.8-2.83-2H1v-4.445a1 1 0 0 1 .47-.849L5 8.5Zm.5 1.5-2.948 2H15.5l-4-2h-6Zm.56 3.94a1.5 1.5 0 1 0-2.12 2.12 1.5 1.5 0 0 0 2.12-2.12Zm13 0a1.5 1.5 0 1 0-2.12 2.12 1.5 1.5 0 0 0 2.12-2.12Z\"\n />\n </svg>\n )\n}\nexport default SedanIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,OAAO,CAAA;AAC1B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,qTAAqT,EACvT,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceBattery";
 const ServiceBatteryIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceBatteryIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceBatteryIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceBattery\"\nconst ServiceBatteryIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg\n fillRule=\"evenodd\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n clipRule=\"evenodd\"\n d=\"m9 2h-3v2h3zm9 0h-3v2h3zm-15 6h-1v-3h20v3h-1v12a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2-2zm11.464 5.215a.248.248 0 0 1 .187.38l-3.476 5.462c-.147.231-.504.09-.453-.179l.743-3.952-2.508-.224a.248.248 0 0 1 -.187-.38l3.476-5.462c.145-.228.498-.093.454.173l-.652 3.958z\"\n />\n </svg>\n )\n}\nexport default ServiceBatteryIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,gBAAgB,CAAA;AACnC,MAAM,kBAAkB,GAAG,CAAC,EAC1B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;AACD,IAAA,OAAO,IAAI,CACT,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,QAAQ,EAAC,SAAS,EAClB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,EAAA;QAElC,KACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,oQAAoQ,EAAA,CACtQ,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceBatteryIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceBatteryIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceBattery\"\nconst ServiceBatteryIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg\n fillRule=\"evenodd\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n clipRule=\"evenodd\"\n d=\"m9 2h-3v2h3zm9 0h-3v2h3zm-15 6h-1v-3h20v3h-1v12a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2-2zm11.464 5.215a.248.248 0 0 1 .187.38l-3.476 5.462c-.147.231-.504.09-.453-.179l.743-3.952-2.508-.224a.248.248 0 0 1 -.187-.38l3.476-5.462c.145-.228.498-.093.454.173l-.652 3.958z\"\n />\n </svg>\n )\n}\nexport default ServiceBatteryIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,gBAAgB,CAAA;AACnC,MAAM,kBAAkB,GAAG,CAAC,EAC1B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;AACD,IAAA,OAAO,IAAI,CACT,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,QAAQ,EAAC,SAAS,EAClB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,EAAA;QAElC,KACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,oQAAoQ,EAAA,CACtQ,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceCleaning";
 const ServiceCleaningIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceCleaningIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceCleaningIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceCleaning\"\nconst ServiceCleaningIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 11.4c-1.657 0-3-1.347-3-3.009C3 6.385 6 3 6 3s3 3.385 3 5.391A3.004 3.004 0 0 1 6 11.4zm12 0c-1.657 0-3-1.347-3-3.009C15 6.385 18 3 18 3s3 3.385 3 5.391a3.004 3.004 0 0 1-3 3.009zm-6 10c-1.657 0-3-1.347-3-3.009C9 16.385 12 13 12 13s3 3.385 3 5.391a3.004 3.004 0 0 1-3 3.009z\" />\n </svg>\n )\n}\nexport default ServiceCleaningIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,iBAAiB,CAAA;AACpC,MAAM,mBAAmB,GAAG,CAAC,EAC3B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,uRAAuR,EAAG,CAAA,CAC9R,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceCleaningIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceCleaningIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceCleaning\"\nconst ServiceCleaningIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M6 11.4c-1.657 0-3-1.347-3-3.009C3 6.385 6 3 6 3s3 3.385 3 5.391A3.004 3.004 0 0 1 6 11.4zm12 0c-1.657 0-3-1.347-3-3.009C15 6.385 18 3 18 3s3 3.385 3 5.391a3.004 3.004 0 0 1-3 3.009zm-6 10c-1.657 0-3-1.347-3-3.009C9 16.385 12 13 12 13s3 3.385 3 5.391a3.004 3.004 0 0 1-3 3.009z\" />\n </svg>\n )\n}\nexport default ServiceCleaningIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,iBAAiB,CAAA;AACpC,MAAM,mBAAmB,GAAG,CAAC,EAC3B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,uRAAuR,EAAG,CAAA,CAC9R,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceFuel";
 const ServiceFuelIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceFuelIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceFuelIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceFuel\"\nconst ServiceFuelIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 10a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-6 0H6V5h6v5zm7.77-2.77l.01-.01-3.72-3.72L15 4.56l2.11 2.11C16.17 7 15.5 7.93 15.5 9a2.5 2.5 0 0 0 2.5 2.5c.36 0 .69-.08 1-.21v7.21a1 1 0 0 1-2 0V14a2 2 0 0 0-2-2h-1V5a2 2 0 0 0-2-2H6c-1.11 0-2 .89-2 2v16h10v-7.5h1.5v5a2.5 2.5 0 1 0 5 0V9c0-.69-.28-1.32-.73-1.77z\" />\n </svg>\n )\n}\nexport default ServiceFuelIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,aAAa,CAAA;AAChC,MAAM,eAAe,GAAG,CAAC,EACvB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,6SAA6S,EAAG,CAAA,CACpT,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceFuelIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceFuelIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceFuel\"\nconst ServiceFuelIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 10a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-6 0H6V5h6v5zm7.77-2.77l.01-.01-3.72-3.72L15 4.56l2.11 2.11C16.17 7 15.5 7.93 15.5 9a2.5 2.5 0 0 0 2.5 2.5c.36 0 .69-.08 1-.21v7.21a1 1 0 0 1-2 0V14a2 2 0 0 0-2-2h-1V5a2 2 0 0 0-2-2H6c-1.11 0-2 .89-2 2v16h10v-7.5h1.5v5a2.5 2.5 0 1 0 5 0V9c0-.69-.28-1.32-.73-1.77z\" />\n </svg>\n )\n}\nexport default ServiceFuelIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,aAAa,CAAA;AAChC,MAAM,eAAe,GAAG,CAAC,EACvB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,6SAA6S,EAAG,CAAA,CACpT,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceHealing";
 const ServiceHealingIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceHealingIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceHealingIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceHealing\"\nconst ServiceHealingIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M17.73 12.02l3.98-3.98a.996.996 0 0 0 0-1.41l-4.34-4.34a.996.996 0 0 0-1.41 0l-3.98 3.98L8 2.29a1.001 1.001 0 0 0-1.41 0L2.25 6.63a.996.996 0 0 0 0 1.41l3.98 3.98L2.25 16a.996.996 0 0 0 0 1.41l4.34 4.34c.39.39 1.02.39 1.41 0l3.98-3.98 3.98 3.98c.2.2.45.29.71.29.26 0 .51-.1.71-.29l4.34-4.34a.996.996 0 0 0 0-1.41l-3.99-3.98zM12 9c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm-4.71 1.96L3.66 7.34l3.63-3.63 3.62 3.62-3.62 3.63zM10 13c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm2 2c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm2-4c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm2.66 9.34l-3.63-3.62 3.63-3.63 3.62 3.62-3.62 3.63z\" />\n </svg>\n )\n}\nexport default ServiceHealingIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,gBAAgB,CAAA;AACnC,MAAM,kBAAkB,GAAG,CAAC,EAC1B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,ioBAAioB,EAAG,CAAA,CACxoB,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceHealingIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceHealingIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceHealing\"\nconst ServiceHealingIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M17.73 12.02l3.98-3.98a.996.996 0 0 0 0-1.41l-4.34-4.34a.996.996 0 0 0-1.41 0l-3.98 3.98L8 2.29a1.001 1.001 0 0 0-1.41 0L2.25 6.63a.996.996 0 0 0 0 1.41l3.98 3.98L2.25 16a.996.996 0 0 0 0 1.41l4.34 4.34c.39.39 1.02.39 1.41 0l3.98-3.98 3.98 3.98c.2.2.45.29.71.29.26 0 .51-.1.71-.29l4.34-4.34a.996.996 0 0 0 0-1.41l-3.99-3.98zM12 9c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm-4.71 1.96L3.66 7.34l3.63-3.63 3.62 3.62-3.62 3.63zM10 13c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm2 2c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm2-4c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm2.66 9.34l-3.63-3.62 3.63-3.63 3.62 3.62-3.62 3.63z\" />\n </svg>\n )\n}\nexport default ServiceHealingIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,gBAAgB,CAAA;AACnC,MAAM,kBAAkB,GAAG,CAAC,EAC1B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,ioBAAioB,EAAG,CAAA,CACxoB,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceLocked";
 const ServiceLockedIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceLockedIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceLockedIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceLocked\"\nconst ServiceLockedIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M7 10c-1.106.003-2 .901-2 2.008v6.983C5 20.098 5.898 21 7.006 21h9.988C18.103 21 19 20.1 19 18.991V12.01A2.009 2.009 0 0 0 17 10V7A5 5 0 0 0 7 7v3Zm8 0H9V7a3 3 0 1 1 6 0v3Z\"\n />\n </svg>\n )\n}\nexport default ServiceLockedIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,eAAe,CAAA;AAClC,MAAM,iBAAiB,GAAG,CAAC,EACzB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,8KAA8K,EAChL,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceLockedIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceLockedIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceLocked\"\nconst ServiceLockedIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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=\"M7 10c-1.106.003-2 .901-2 2.008v6.983C5 20.098 5.898 21 7.006 21h9.988C18.103 21 19 20.1 19 18.991V12.01A2.009 2.009 0 0 0 17 10V7A5 5 0 0 0 7 7v3Zm8 0H9V7a3 3 0 1 1 6 0v3Z\"\n />\n </svg>\n )\n}\nexport default ServiceLockedIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,eAAe,CAAA;AAClC,MAAM,iBAAiB,GAAG,CAAC,EACzB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,8KAA8K,EAChL,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceTolls";
 const ServiceTollsIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceTollsIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceTollsIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceTolls\"\nconst ServiceTollsIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18.81 2.04c-.054-.335.226-.611.565-.611.34 0 .607.279.687.608a2.58 2.58 0 001.9 1.9c.33.08.608.347.608.687 0 .339-.277.62-.612.565A3.81 3.81 0 0118.81 2.04z\" />\n <path d=\"M15.71 1.495c-.045-.432.31-.784.745-.784.433 0 .78.353.836.783a6.049 6.049 0 005.214 5.214c.43.056.783.402.783.836 0 .434-.352.79-.784.745a7.62 7.62 0 01-6.794-6.794z\" />\n <path d=\"M12.603.865c-.036-.477.355-.865.833-.865s.862.388.904.865a9.697 9.697 0 008.794 8.793c.476.043.865.427.865.905 0 .478-.389.869-.865.833A11.43 11.43 0 0112.603.865zM2.944 7.866A1 1 0 014.31 7.5l10.2 5.889a1 1 0 01.366 1.366l-2.444 4.233a1 1 0 01-1.367.367L.867 13.465A1 1 0 01.5 12.1l2.444-4.234zM17.448 17.863a.5.5 0 00-.29-.727l-1.735-.521a.5.5 0 00-.578.23l-.648 1.134a.5.5 0 00.095.615l1.331 1.23a.5.5 0 00.774-.12l1.051-1.841zM4.96 18.389a.689.689 0 111.377 0v4.922a.689.689 0 11-1.377 0V18.39z\" />\n </svg>\n )\n}\nexport default ServiceTollsIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,+JAA+J,EAAG,CAAA;QAC1K,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,wKAAwK,EAAG,CAAA;AACnL,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,ofAAof,EAAG,CAAA,CAC3f,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceTollsIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceTollsIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceTolls\"\nconst ServiceTollsIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18.81 2.04c-.054-.335.226-.611.565-.611.34 0 .607.279.687.608a2.58 2.58 0 001.9 1.9c.33.08.608.347.608.687 0 .339-.277.62-.612.565A3.81 3.81 0 0118.81 2.04z\" />\n <path d=\"M15.71 1.495c-.045-.432.31-.784.745-.784.433 0 .78.353.836.783a6.049 6.049 0 005.214 5.214c.43.056.783.402.783.836 0 .434-.352.79-.784.745a7.62 7.62 0 01-6.794-6.794z\" />\n <path d=\"M12.603.865c-.036-.477.355-.865.833-.865s.862.388.904.865a9.697 9.697 0 008.794 8.793c.476.043.865.427.865.905 0 .478-.389.869-.865.833A11.43 11.43 0 0112.603.865zM2.944 7.866A1 1 0 014.31 7.5l10.2 5.889a1 1 0 01.366 1.366l-2.444 4.233a1 1 0 01-1.367.367L.867 13.465A1 1 0 01.5 12.1l2.444-4.234zM17.448 17.863a.5.5 0 00-.29-.727l-1.735-.521a.5.5 0 00-.578.23l-.648 1.134a.5.5 0 00.095.615l1.331 1.23a.5.5 0 00.774-.12l1.051-1.841zM4.96 18.389a.689.689 0 111.377 0v4.922a.689.689 0 11-1.377 0V18.39z\" />\n </svg>\n )\n}\nexport default ServiceTollsIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,+JAA+J,EAAG,CAAA;QAC1K,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,wKAAwK,EAAG,CAAA;AACnL,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,ofAAof,EAAG,CAAA,CAC3f,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "serviceUnlocked";
 const ServiceUnlockedIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ServiceUnlockedIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceUnlockedIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceUnlocked\"\nconst ServiceUnlockedIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"m7 8v-1a5 5 0 1 1 10 0v3c1.105.003 2 .904 2 2.009v6.982c0 1.11-.897 2.009-2.006 2.009h-9.988a2.009 2.009 0 0 1 -2.006-2.009v-6.981c0-1.11.894-2.007 2-2.01h8v-3a3 3 0 0 0 -6 0v1z\" />\n </svg>\n )\n}\nexport default ServiceUnlockedIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,iBAAiB,CAAA;AACpC,MAAM,mBAAmB,GAAG,CAAC,EAC3B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,mLAAmL,EAAG,CAAA,CAC1L,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ServiceUnlockedIcon.js","sources":["../../../../src/components/Icon/__generated__/ServiceUnlockedIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"serviceUnlocked\"\nconst ServiceUnlockedIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"m7 8v-1a5 5 0 1 1 10 0v3c1.105.003 2 .904 2 2.009v6.982c0 1.11-.897 2.009-2.006 2.009h-9.988a2.009 2.009 0 0 1 -2.006-2.009v-6.981c0-1.11.894-2.007 2-2.01h8v-3a3 3 0 0 0 -6 0v1z\" />\n </svg>\n )\n}\nexport default ServiceUnlockedIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,iBAAiB,CAAA;AACpC,MAAM,mBAAmB,GAAG,CAAC,EAC3B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,mLAAmL,EAAG,CAAA,CAC1L,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "settings";
 const SettingsIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SettingsIcon.js","sources":["../../../../src/components/Icon/__generated__/SettingsIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"settings\"\nconst SettingsIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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 15.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.25.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66Z\"\n />\n </svg>\n )\n}\nexport default SettingsIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,UAAU,CAAA;AAC7B,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,8nBAA8nB,EAChoB,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"SettingsIcon.js","sources":["../../../../src/components/Icon/__generated__/SettingsIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"settings\"\nconst SettingsIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\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 15.5a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7Zm7.43-2.53c.04-.32.07-.64.07-.97 0-.33-.03-.66-.07-1l2.11-1.63c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.31-.61-.22l-2.49 1c-.52-.39-1.06-.73-1.69-.98l-.37-2.65A.506.506 0 0 0 14 2h-4c-.25 0-.46.18-.5.42l-.37 2.65c-.63.25-1.17.59-1.69.98l-2.49-1c-.22-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64L4.57 11c-.04.34-.07.67-.07 1 0 .33.03.65.07.97l-2.11 1.66c-.19.15-.25.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1.01c.52.4 1.06.74 1.69.99l.37 2.65c.04.24.25.42.5.42h4c.25 0 .46-.18.5-.42l.37-2.65c.63-.26 1.17-.59 1.69-.99l2.49 1.01c.22.08.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.66Z\"\n />\n </svg>\n )\n}\nexport default SettingsIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,UAAU,CAAA;AAC7B,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,8nBAA8nB,EAChoB,CAAA,CACE,CACP,CAAA;AACH;;;;"}

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import capitalize from '../../utils/capitalize.js';
+import camelize from '../../utils/camelize.js';
 import 'lodash.throttle';
 import cx from 'classnames';
 const iconSource = "shareAndroid";
 const ShareAndroidIcon = ({ color, size = 24, contained = false, className, }) => {
     const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
-        [`cobalt-Icon--color${capitalize(color)}`]: color,
+        [`c-fill-${camelize(color || "")}`]: color,
         "cobalt-Icon--size16": size === 16,
         "cobalt-Icon--size20": size === 20,
         "cobalt-Icon--size32": size === 32,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ShareAndroidIcon.js","sources":["../../../../src/components/Icon/__generated__/ShareAndroidIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { ~~capitalize~~ } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"shareAndroid\"\nconst ShareAndroidIcon = ({\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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92Z\" />\n </svg>\n )\n}\nexport default ShareAndroidIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,oXAAoX,EAAG,CAAA,CAC3X,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ShareAndroidIcon.js","sources":["../../../../src/components/Icon/__generated__/ShareAndroidIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n color?: IconColorsType\n size?: 16 \| 20 \| 24 \| 32\n contained?: boolean\n className?: string\n}\nconst iconSource = \"shareAndroid\"\nconst ShareAndroidIcon = ({\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 [`c-fill-${camelize(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 const wrap = (content: React.ReactNode) => (\n <span className={computedClassName}>{content}</span>\n )\n return wrap(\n <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92Z\" />\n </svg>\n )\n}\nexport default ShareAndroidIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,cAAc,CAAA;AACjC,MAAM,gBAAgB,GAAG,CAAC,EACxB,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,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,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;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,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,EAAM,CAAC,EAAC,oXAAoX,EAAG,CAAA,CAC3X,CACP,CAAA;AACH;;;;"}