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__/CarTypeCityIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeCityIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeCityIcon.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 = \"carTypeCity\"\nconst CarTypeCityIcon = ({\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=\"M16 6H6l-5 6v3h2a3 3 0 006 0h6a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-2l-3-4zM6.5 7.5h4V10h-6l2-2.5zm5.5 0h3.5l1.96 2.5H12V7.5zm-6 6a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeCityIcon\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,yMAAyM,EAAG,CAAA,CAChN,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeCityIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeCityIcon.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 = \"carTypeCity\"\nconst CarTypeCityIcon = ({\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=\"M16 6H6l-5 6v3h2a3 3 0 006 0h6a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-2l-3-4zM6.5 7.5h4V10h-6l2-2.5zm5.5 0h3.5l1.96 2.5H12V7.5zm-6 6a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeCityIcon\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,yMAAyM,EAAG,CAAA,CAChN,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeConvertibleIcon.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 = "carTypeConvertible";
 const CarTypeConvertibleIcon = ({ 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__/CarTypeConvertibleIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeConvertibleIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeConvertibleIcon.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 = \"carTypeConvertible\"\nconst CarTypeConvertibleIcon = ({\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=\"M16 6l-1 .75L17.5 10h-4V8.5H12V10H3c-1.11 0-2 .89-2 2v3h2a3 3 0 006 0h6a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-2l-3-4zM6 13.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeConvertibleIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,oBAAoB,CAAA;AACvC,MAAM,sBAAsB,GAAG,CAAC,EAC9B,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,kMAAkM,EAAG,CAAA,CACzM,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeConvertibleIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeConvertibleIcon.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 = \"carTypeConvertible\"\nconst CarTypeConvertibleIcon = ({\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=\"M16 6l-1 .75L17.5 10h-4V8.5H12V10H3c-1.11 0-2 .89-2 2v3h2a3 3 0 006 0h6a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-2l-3-4zM6 13.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeConvertibleIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,oBAAoB,CAAA;AACvC,MAAM,sBAAsB,GAAG,CAAC,EAC9B,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,kMAAkM,EAAG,CAAA,CACzM,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeCoupeIcon.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 = "carTypeCoupe";
 const CarTypeCoupeIcon = ({ 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__/CarTypeCoupeIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeCoupeIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeCoupeIcon.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 = \"carTypeCoupe\"\nconst CarTypeCoupeIcon = ({\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=\"M3 11s1.5-3 6-3c2.316 0 4.103.795 5.836 1.566C16.471 10.293 18.06 11 20 11h-1.5c4.847 0 4.646 2.245 4.53 3.537-.016.174-.03.331-.03.463v1.5h-1.402a3.001 3.001 0 01-5.196 0H7.598a3 3 0 01-5.196 0H1V11h2zm2 2.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm14 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3zM8.833 11H15.5c-.847 0-1.624-.278-2.509-.595-1.154-.413-2.491-.891-4.408-.905l.25 1.5zm-1 0H5s.046-1.223 2.59-1.46L7.833 11z\"\n />\n </svg>\n )\n}\nexport default CarTypeCoupeIcon\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,qZAAqZ,EACvZ,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeCoupeIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeCoupeIcon.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 = \"carTypeCoupe\"\nconst CarTypeCoupeIcon = ({\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=\"M3 11s1.5-3 6-3c2.316 0 4.103.795 5.836 1.566C16.471 10.293 18.06 11 20 11h-1.5c4.847 0 4.646 2.245 4.53 3.537-.016.174-.03.331-.03.463v1.5h-1.402a3.001 3.001 0 01-5.196 0H7.598a3 3 0 01-5.196 0H1V11h2zm2 2.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm14 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3zM8.833 11H15.5c-.847 0-1.624-.278-2.509-.595-1.154-.413-2.491-.891-4.408-.905l.25 1.5zm-1 0H5s.046-1.223 2.59-1.46L7.833 11z\"\n />\n </svg>\n )\n}\nexport default CarTypeCoupeIcon\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,qZAAqZ,EACvZ,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeFamilyIcon.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 = "carTypeFamily";
 const CarTypeFamilyIcon = ({ 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__/CarTypeFamilyIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeFamilyIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeFamilyIcon.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 = \"carTypeFamily\"\nconst CarTypeFamilyIcon = ({\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=\"M1 8a2 2 0 012-2h11l4 4h3c1.11 0 2 .89 2 2v3h-2a3 3 0 01-6 0H8a3 3 0 01-6 0H1V9 8zm1.5-.5V10h6V7.5h-6zm7.5 0V10h5.8l-2.55-2.5H10zm-5 6a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm13 0a1.5 1.5 0 100 3 1.5 1.5 0 000-3z\" />\n </svg>\n )\n}\nexport default CarTypeFamilyIcon\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,EAAM,CAAC,EAAC,+MAA+M,EAAG,CAAA,CACtN,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeFamilyIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeFamilyIcon.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 = \"carTypeFamily\"\nconst CarTypeFamilyIcon = ({\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=\"M1 8a2 2 0 012-2h11l4 4h3c1.11 0 2 .89 2 2v3h-2a3 3 0 01-6 0H8a3 3 0 01-6 0H1V9 8zm1.5-.5V10h6V7.5h-6zm7.5 0V10h5.8l-2.55-2.5H10zm-5 6a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm13 0a1.5 1.5 0 100 3 1.5 1.5 0 000-3z\" />\n </svg>\n )\n}\nexport default CarTypeFamilyIcon\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,EAAM,CAAC,EAAC,+MAA+M,EAAG,CAAA,CACtN,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeFourFourIcon.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 = "carTypeFourFour";
 const CarTypeFourFourIcon = ({ 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__/CarTypeFourFourIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeFourFourIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeFourFourIcon.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 = \"carTypeFourFour\"\nconst CarTypeFourFourIcon = ({\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 6H4c-1.11 0-2 .89-2 2H1v6h1v1h2a3 3 0 006 0h5a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-3l-3-4zM3.5 10V7.5h6V10h-6zm7.5 0V7.5h3.25l1.89 2.5H11zm-5.06 3.94a1.5 1.5 0 112.12 2.12 1.5 1.5 0 01-2.12-2.12zm11 0a1.5 1.5 0 112.12 2.12 1.5 1.5 0 01-2.12-2.12z\"\n />\n </svg>\n )\n}\nexport default CarTypeFourFourIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,0PAA0P,EAC5P,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeFourFourIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeFourFourIcon.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 = \"carTypeFourFour\"\nconst CarTypeFourFourIcon = ({\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 6H4c-1.11 0-2 .89-2 2H1v6h1v1h2a3 3 0 006 0h5a3 3 0 006 0h2v-3c0-1.11-.89-2-2-2h-3l-3-4zM3.5 10V7.5h6V10h-6zm7.5 0V7.5h3.25l1.89 2.5H11zm-5.06 3.94a1.5 1.5 0 112.12 2.12 1.5 1.5 0 01-2.12-2.12zm11 0a1.5 1.5 0 112.12 2.12 1.5 1.5 0 01-2.12-2.12z\"\n />\n </svg>\n )\n}\nexport default CarTypeFourFourIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,0PAA0P,EAC5P,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeMinibusIcon.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 = "carTypeMinibus";
 const CarTypeMinibusIcon = ({ 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__/CarTypeMinibusIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeMinibusIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeMinibusIcon.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 = \"carTypeMinibus\"\nconst CarTypeMinibusIcon = ({\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=\"M3 7c-1.11 0-2 .89-2 2v8h2a3 3 0 006 0h6a3 3 0 006 0h2v-4c0-1.11-.89-2-2-2l-3-4H3zm0 1.5h4V11H3V8.5zm6 0h4V11H9V8.5zm6 0h2.5l1.96 2.5H15V8.5zm-9 7a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeMinibusIcon\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,2NAA2N,EAAG,CAAA,CAClO,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeMinibusIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeMinibusIcon.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 = \"carTypeMinibus\"\nconst CarTypeMinibusIcon = ({\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=\"M3 7c-1.11 0-2 .89-2 2v8h2a3 3 0 006 0h6a3 3 0 006 0h2v-4c0-1.11-.89-2-2-2l-3-4H3zm0 1.5h4V11H3V8.5zm6 0h4V11H9V8.5zm6 0h2.5l1.96 2.5H15V8.5zm-9 7a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeMinibusIcon\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,2NAA2N,EAAG,CAAA,CAClO,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeSedanIcon.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 = "carTypeSedan";
 const CarTypeSedanIcon = ({ 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__/CarTypeSedanIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeSedanIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeSedanIcon.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 = \"carTypeSedan\"\nconst CarTypeSedanIcon = ({\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 012 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 01.47-.849L5 8.5zm.5 1.5l-2.948 2H15.5l-4-2h-6zm.56 3.94a1.5 1.5 0 10-2.12 2.12 1.5 1.5 0 002.12-2.12zm13 0a1.5 1.5 0 10-2.12 2.12 1.5 1.5 0 002.12-2.12z\"\n />\n </svg>\n )\n}\nexport default CarTypeSedanIcon\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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeSedanIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeSedanIcon.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 = \"carTypeSedan\"\nconst CarTypeSedanIcon = ({\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 012 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 01.47-.849L5 8.5zm.5 1.5l-2.948 2H15.5l-4-2h-6zm.56 3.94a1.5 1.5 0 10-2.12 2.12 1.5 1.5 0 002.12-2.12zm13 0a1.5 1.5 0 10-2.12 2.12 1.5 1.5 0 002.12-2.12z\"\n />\n </svg>\n )\n}\nexport default CarTypeSedanIcon\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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CarTypeUtilityIcon.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 = "carTypeUtility";
 const CarTypeUtilityIcon = ({ 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__/CarTypeUtilityIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarTypeUtilityIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeUtilityIcon.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 = \"carTypeUtility\"\nconst CarTypeUtilityIcon = ({\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=\"M3 6c-1.11 0-2 .89-2 2v8h2a3 3 0 006 0h6a3 3 0 006 0h2v-4c0-1.11-.89-2-2-2l-3-4H3zm12 1.5h2.5l1.96 2.5H15V7.5zm-9 7a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeUtilityIcon\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,4LAA4L,EAAG,CAAA,CACnM,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CarTypeUtilityIcon.js","sources":["../../../../src/components/Icon/__generated__/CarTypeUtilityIcon.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 = \"carTypeUtility\"\nconst CarTypeUtilityIcon = ({\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=\"M3 6c-1.11 0-2 .89-2 2v8h2a3 3 0 006 0h6a3 3 0 006 0h2v-4c0-1.11-.89-2-2-2l-3-4H3zm12 1.5h2.5l1.96 2.5H15V7.5zm-9 7a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm12 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3z\" />\n </svg>\n )\n}\nexport default CarTypeUtilityIcon\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,4LAA4L,EAAG,CAAA,CACnM,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CardIcon.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 = "card";
 const CardIcon = ({ 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__/CardIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardIcon.js","sources":["../../../../src/components/Icon/__generated__/CardIcon.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 = \"card\"\nconst CardIcon = ({\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=\"M4 4.992C4 3.892 4.893 3 5.995 3h12.01C19.107 3 20 3.893 20 4.992v10.016c0 1.1-.893 1.992-1.995 1.992H5.995A1.995 1.995 0 0 1 4 15.008V4.992Zm16 13.476v.54c0 1.1-.893 1.992-1.995 1.992H5.995A1.995 1.995 0 0 1 4 19.008v-.541A3.978 3.978 0 0 0 5.995 19h12.01A3.98 3.98 0 0 0 20 18.468ZM6 13V5h12v8H6Z\"\n />\n </svg>\n )\n}\nexport default CardIcon\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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CardIcon.js","sources":["../../../../src/components/Icon/__generated__/CardIcon.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 = \"card\"\nconst CardIcon = ({\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=\"M4 4.992C4 3.892 4.893 3 5.995 3h12.01C19.107 3 20 3.893 20 4.992v10.016c0 1.1-.893 1.992-1.995 1.992H5.995A1.995 1.995 0 0 1 4 15.008V4.992Zm16 13.476v.54c0 1.1-.893 1.992-1.995 1.992H5.995A1.995 1.995 0 0 1 4 19.008v-.541A3.978 3.978 0 0 0 5.995 19h12.01A3.98 3.98 0 0 0 20 18.468ZM6 13V5h12v8H6Z\"\n />\n </svg>\n )\n}\nexport default CardIcon\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,4SAA4S,EAC9S,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CdPlayerIcon.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 = "cdPlayer";
 const CdPlayerIcon = ({ 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__/CdPlayerIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CdPlayerIcon.js","sources":["../../../../src/components/Icon/__generated__/CdPlayerIcon.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 = \"cdPlayer\"\nconst CdPlayerIcon = ({\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 2a10.001 10.001 0 1 1-.001 20.002A10.001 10.001 0 0 1 12 2Zm4 7V7h-4v5.5a2.5 2.5 0 1 0 1 2V9h3Z\"\n />\n </svg>\n )\n}\nexport default CdPlayerIcon\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,qGAAqG,EACvG,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CdPlayerIcon.js","sources":["../../../../src/components/Icon/__generated__/CdPlayerIcon.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 = \"cdPlayer\"\nconst CdPlayerIcon = ({\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 2a10.001 10.001 0 1 1-.001 20.002A10.001 10.001 0 0 1 12 2Zm4 7V7h-4v5.5a2.5 2.5 0 1 0 1 2V9h3Z\"\n />\n </svg>\n )\n}\nexport default CdPlayerIcon\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,qGAAqG,EACvG,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CertificateIcon.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 = "certificate";
 const CertificateIcon = ({ 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__/CertificateIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CertificateIcon.js","sources":["../../../../src/components/Icon/__generated__/CertificateIcon.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 = \"certificate\"\nconst CertificateIcon = ({\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=\"M8.213 1.833a1 1 0 0 0 1.246.579 7.93 7.93 0 0 1 .857-.235 1 1 0 0 0 .779-1.132 8.942 8.942 0 0 0-2.882.788ZM5.82 4.921a1 1 0 0 1-1.364.171 9.05 9.05 0 0 1 2.022-2.199 1 1 0 0 1-.056 1.373 8.053 8.053 0 0 0-.602.655Zm-2.817 4.9a1 1 0 0 0 1.066-.868c.038-.295.093-.586.164-.873a1 1 0 0 0-.678-1.195 8.974 8.974 0 0 0-.552 2.936Zm1.723 3.512a1 1 0 0 1-.442 1.302 8.944 8.944 0 0 1-1.092-2.78 1 1 0 0 1 1.21.652c.092.281.2.557.324.826Zm3.208 4.698a1 1 0 0 0-.316-1.337 8.028 8.028 0 0 1-.715-.529 1 1 0 0 0-1.372.091 9.028 9.028 0 0 0 2.403 1.775Zm7.997.068a9.025 9.025 0 0 0 2.433-1.734 1 1 0 0 0-1.37-.114 8.026 8.026 0 0 1-.724.516 1 1 0 0 0-.34 1.332ZM13.773 2.197a1 1 0 0 1-.765-1.141 8.94 8.94 0 0 1 2.872.821 1 1 0 0 1-1.253.564 7.933 7.933 0 0 0-.854-.244Zm3.915.828a1 1 0 0 0 .025 1.375c.207.211.403.435.586.668a1 1 0 0 0 1.36.203 9.046 9.046 0 0 0-1.97-2.246Zm2.126 5.252a1 1 0 0 1 .708-1.178c.31.91.478 1.886.478 2.901v.048a1 1 0 0 1-1.044-.894 7.983 7.983 0 0 0-.142-.877Zm.965 3.712a1 1 0 0 0-1.219.634c-.097.28-.21.554-.337.821a1 1 0 0 0 .422 1.308c.522-.839.91-1.77 1.134-2.763ZM9 23v-6.674a7 7 0 1 1 6 0V23l-3-3-3 3Zm9-13a6 6 0 1 1-12 0 6 6 0 0 1 12 0Zm-6 5a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm3-5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"\n />\n </svg>\n )\n}\nexport default CertificateIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,otCAAotC,EACttC,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CertificateIcon.js","sources":["../../../../src/components/Icon/__generated__/CertificateIcon.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 = \"certificate\"\nconst CertificateIcon = ({\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=\"M8.213 1.833a1 1 0 0 0 1.246.579 7.93 7.93 0 0 1 .857-.235 1 1 0 0 0 .779-1.132 8.942 8.942 0 0 0-2.882.788ZM5.82 4.921a1 1 0 0 1-1.364.171 9.05 9.05 0 0 1 2.022-2.199 1 1 0 0 1-.056 1.373 8.053 8.053 0 0 0-.602.655Zm-2.817 4.9a1 1 0 0 0 1.066-.868c.038-.295.093-.586.164-.873a1 1 0 0 0-.678-1.195 8.974 8.974 0 0 0-.552 2.936Zm1.723 3.512a1 1 0 0 1-.442 1.302 8.944 8.944 0 0 1-1.092-2.78 1 1 0 0 1 1.21.652c.092.281.2.557.324.826Zm3.208 4.698a1 1 0 0 0-.316-1.337 8.028 8.028 0 0 1-.715-.529 1 1 0 0 0-1.372.091 9.028 9.028 0 0 0 2.403 1.775Zm7.997.068a9.025 9.025 0 0 0 2.433-1.734 1 1 0 0 0-1.37-.114 8.026 8.026 0 0 1-.724.516 1 1 0 0 0-.34 1.332ZM13.773 2.197a1 1 0 0 1-.765-1.141 8.94 8.94 0 0 1 2.872.821 1 1 0 0 1-1.253.564 7.933 7.933 0 0 0-.854-.244Zm3.915.828a1 1 0 0 0 .025 1.375c.207.211.403.435.586.668a1 1 0 0 0 1.36.203 9.046 9.046 0 0 0-1.97-2.246Zm2.126 5.252a1 1 0 0 1 .708-1.178c.31.91.478 1.886.478 2.901v.048a1 1 0 0 1-1.044-.894 7.983 7.983 0 0 0-.142-.877Zm.965 3.712a1 1 0 0 0-1.219.634c-.097.28-.21.554-.337.821a1 1 0 0 0 .422 1.308c.522-.839.91-1.77 1.134-2.763ZM9 23v-6.674a7 7 0 1 1 6 0V23l-3-3-3 3Zm9-13a6 6 0 1 1-12 0 6 6 0 0 1 12 0Zm-6 5a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm3-5a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"\n />\n </svg>\n )\n}\nexport default CertificateIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,otCAAotC,EACttC,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ChainsIcon.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 = "chains";
 const ChainsIcon = ({ 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__/ChainsIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChainsIcon.js","sources":["../../../../src/components/Icon/__generated__/ChainsIcon.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 = \"chains\"\nconst ChainsIcon = ({\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=\"M3 21c0-.552.139-1.417.316-1.949l.051-.151c.349-1.049 1.362-1.391 2.287-.766 0 0 2.548 1.866 3.447 1.866H15c1 0 3.39-1.849 3.39-1.849.889-.635 1.894-.299 2.243.749l.051.151A7.38 7.38 0 0 1 21 21c0 .552-.445 1-.993 1H3.993A.994.994 0 0 1 3 21Zm8.3-4a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 17Zm0-6a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 11Zm0-6a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 5ZM7 6.707v2.586l1.294-1.294L7 6.707Zm10 8.573v-2.573l-1.288 1.288L17 15.28Zm0-8.573v2.586l-1.294-1.294L17 6.707ZM7 15.28v-2.573l1.288 1.288L7 15.28Zm4.505.518-1.803-1.803L11.5 12.2a1.305 1.305 0 0 1-.705-.71l-1.8 1.798-1.641-1.642L7 11.293v-.586l.34-.34 1.661-1.661 1.798 1.795c.133-.319.389-.574.71-.705L9.708 7.999l1.797-1.797a1.303 1.303 0 0 1-.707-.707L9.001 7.292 7.354 5.646l-.284-.283a3.012 3.012 0 0 1 2.292-2.294l1.436 1.436c.132-.32.387-.575.707-.707L10.707 3h2.586l-.798.798c.32.132.575.387.707.707l1.437-1.437a2.997 2.997 0 0 1 2.292 2.294l-.285.284-1.647 1.646-1.797-1.797c-.132.32-.387.575-.707.707l1.797 1.797-1.801 1.797c.321.131.577.386.71.705l1.798-1.795 1.661 1.661.34.34v.586l-.354.353-1.641 1.642-1.8-1.798c-.131.32-.385.577-.705.71l1.798 1.795-1.803 1.803c.32.132.575.387.707.707l1.803-1.803 1.655 1.652.273.272a3.012 3.012 0 0 1-2.295 2.305l-1.436-1.436c-.132.32-.387.575-.707.707l.798.798h-2.586l.798-.798a1.303 1.303 0 0 1-.707-.707l-1.437 1.437a2.998 2.998 0 0 1-2.295-2.305l.274-.273 1.655-1.652 1.803 1.803c.132-.32.387-.575.707-.707Z\"\n />\n </svg>\n )\n}\nexport default ChainsIcon\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,o6CAAo6C,EACt6C,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ChainsIcon.js","sources":["../../../../src/components/Icon/__generated__/ChainsIcon.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 = \"chains\"\nconst ChainsIcon = ({\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=\"M3 21c0-.552.139-1.417.316-1.949l.051-.151c.349-1.049 1.362-1.391 2.287-.766 0 0 2.548 1.866 3.447 1.866H15c1 0 3.39-1.849 3.39-1.849.889-.635 1.894-.299 2.243.749l.051.151A7.38 7.38 0 0 1 21 21c0 .552-.445 1-.993 1H3.993A.994.994 0 0 1 3 21Zm8.3-4a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 17Zm0-6a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 11Zm0-6a.7.7 0 1 1 1.399-.001A.7.7 0 0 1 11.3 5ZM7 6.707v2.586l1.294-1.294L7 6.707Zm10 8.573v-2.573l-1.288 1.288L17 15.28Zm0-8.573v2.586l-1.294-1.294L17 6.707ZM7 15.28v-2.573l1.288 1.288L7 15.28Zm4.505.518-1.803-1.803L11.5 12.2a1.305 1.305 0 0 1-.705-.71l-1.8 1.798-1.641-1.642L7 11.293v-.586l.34-.34 1.661-1.661 1.798 1.795c.133-.319.389-.574.71-.705L9.708 7.999l1.797-1.797a1.303 1.303 0 0 1-.707-.707L9.001 7.292 7.354 5.646l-.284-.283a3.012 3.012 0 0 1 2.292-2.294l1.436 1.436c.132-.32.387-.575.707-.707L10.707 3h2.586l-.798.798c.32.132.575.387.707.707l1.437-1.437a2.997 2.997 0 0 1 2.292 2.294l-.285.284-1.647 1.646-1.797-1.797c-.132.32-.387.575-.707.707l1.797 1.797-1.801 1.797c.321.131.577.386.71.705l1.798-1.795 1.661 1.661.34.34v.586l-.354.353-1.641 1.642-1.8-1.798c-.131.32-.385.577-.705.71l1.798 1.795-1.803 1.803c.32.132.575.387.707.707l1.803-1.803 1.655 1.652.273.272a3.012 3.012 0 0 1-2.295 2.305l-1.436-1.436c-.132.32-.387.575-.707.707l.798.798h-2.586l.798-.798a1.303 1.303 0 0 1-.707-.707l-1.437 1.437a2.998 2.998 0 0 1-2.295-2.305l.274-.273 1.655-1.652 1.803 1.803c.132-.32.387-.575.707-.707Z\"\n />\n </svg>\n )\n}\nexport default ChainsIcon\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,o6CAAo6C,EACt6C,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CheckCircleFilledIcon.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 = "checkCircleFilled";
 const CheckCircleFilledIcon = ({ 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__/CheckCircleFilledIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckCircleFilledIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckCircleFilledIcon.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 = \"checkCircleFilled\"\nconst CheckCircleFilledIcon = ({\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 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Zm-11.613 4.805-4.273-4.272a.9.9 0 0 1 0-1.273l.694-.694a.9.9 0 0 1 1.272 0l2.96 2.959 5.38-5.412a.9.9 0 0 1 1.272 0l.694.694a.9.9 0 0 1 0 1.273l-6.727 6.725a.9.9 0 0 1-1.272 0Z\"\n />\n </svg>\n )\n}\nexport default CheckCircleFilledIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,mBAAmB,CAAA;AACtC,MAAM,qBAAqB,GAAG,CAAC,EAC7B,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,0PAA0P,EAC5P,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CheckCircleFilledIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckCircleFilledIcon.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 = \"checkCircleFilled\"\nconst CheckCircleFilledIcon = ({\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 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Zm-11.613 4.805-4.273-4.272a.9.9 0 0 1 0-1.273l.694-.694a.9.9 0 0 1 1.272 0l2.96 2.959 5.38-5.412a.9.9 0 0 1 1.272 0l.694.694a.9.9 0 0 1 0 1.273l-6.727 6.725a.9.9 0 0 1-1.272 0Z\"\n />\n </svg>\n )\n}\nexport default CheckCircleFilledIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,mBAAmB,CAAA;AACtC,MAAM,qBAAqB,GAAG,CAAC,EAC7B,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,0PAA0P,EAC5P,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CheckCircleIcon.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 = "checkCircle";
 const CheckCircleIcon = ({ 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__/CheckCircleIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckCircleIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckCircleIcon.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 = \"checkCircle\"\nconst CheckCircleIcon = ({\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 d=\"M12,22 C17.5228475,22 22,17.5228475 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,17.5228475 6.4771525,22 12,22 Z M10.039794,16.4579825 L10.3868138,16.8048824 C10.7382605,17.1562077 11.3079394,17.1562077 11.6593861,16.8048824 L12.0064058,16.4579825 L18.3862862,10.0803058 C18.7379046,9.72880879 18.7379046,9.15879074 18.3862862,8.80729375 L17.6922467,8.11349398 C17.3408,7.76216867 16.771121,7.76216867 16.4196743,8.11349398 L11.0398301,13.5249288 L8.08032565,10.5664466 C7.72887895,10.2151213 7.15920001,10.2151213 6.80775331,10.5664466 L6.11371383,11.2602463 C5.76209539,11.6117433 5.76209539,12.1817614 6.11371383,12.5332584 L10.039794,16.4579825 Z\"\n fillRule=\"evenodd\"\n />\n </svg>\n )\n}\nexport default CheckCircleIcon\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;QACzD,KACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sqBAAsqB,EACxqB,QAAQ,EAAC,SAAS,EAAA,CAClB,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CheckCircleIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckCircleIcon.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 = \"checkCircle\"\nconst CheckCircleIcon = ({\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 d=\"M12,22 C17.5228475,22 22,17.5228475 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,17.5228475 6.4771525,22 12,22 Z M10.039794,16.4579825 L10.3868138,16.8048824 C10.7382605,17.1562077 11.3079394,17.1562077 11.6593861,16.8048824 L12.0064058,16.4579825 L18.3862862,10.0803058 C18.7379046,9.72880879 18.7379046,9.15879074 18.3862862,8.80729375 L17.6922467,8.11349398 C17.3408,7.76216867 16.771121,7.76216867 16.4196743,8.11349398 L11.0398301,13.5249288 L8.08032565,10.5664466 C7.72887895,10.2151213 7.15920001,10.2151213 6.80775331,10.5664466 L6.11371383,11.2602463 C5.76209539,11.6117433 5.76209539,12.1817614 6.11371383,12.5332584 L10.039794,16.4579825 Z\"\n fillRule=\"evenodd\"\n />\n </svg>\n )\n}\nexport default CheckCircleIcon\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;QACzD,KACE,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,sqBAAsqB,EACxqB,QAAQ,EAAC,SAAS,EAAA,CAClB,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/CheckIcon.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 = "check";
 const CheckIcon = ({ 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__/CheckIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckIcon.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 = \"check\"\nconst CheckIcon = ({\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=\"M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59 21 7Z\"\n />\n </svg>\n )\n}\nexport default CheckIcon\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,wDAAwD,EAC1D,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"CheckIcon.js","sources":["../../../../src/components/Icon/__generated__/CheckIcon.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 = \"check\"\nconst CheckIcon = ({\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=\"M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59 21 7Z\"\n />\n </svg>\n )\n}\nexport default CheckIcon\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,wDAAwD,EAC1D,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ChecklistIcon.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 = "checklist";
 const ChecklistIcon = ({ 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__/ChecklistIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChecklistIcon.js","sources":["../../../../src/components/Icon/__generated__/ChecklistIcon.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 = \"checklist\"\nconst ChecklistIcon = ({\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=\"m1.97 5.53 1.06-1.06L5 6.44l3.47-3.47 1.06 1.06L5 8.56 1.97 5.53Zm0 6 1.06-1.06L5 12.44l3.47-3.47 1.06 1.06L5 14.56l-3.03-3.03Zm1.06 4.94-1.06 1.06L5 20.56l4.53-4.53-1.06-1.06L5 18.44l-1.97-1.97ZM21 5H11v2h10V5Zm-10 6h10v2H11v-2Zm10 6H11v2h10v-2Z\"\n />\n </svg>\n )\n}\nexport default ChecklistIcon\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,wPAAwP,EAC1P,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ChecklistIcon.js","sources":["../../../../src/components/Icon/__generated__/ChecklistIcon.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 = \"checklist\"\nconst ChecklistIcon = ({\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=\"m1.97 5.53 1.06-1.06L5 6.44l3.47-3.47 1.06 1.06L5 8.56 1.97 5.53Zm0 6 1.06-1.06L5 12.44l3.47-3.47 1.06 1.06L5 14.56l-3.03-3.03Zm1.06 4.94-1.06 1.06L5 20.56l4.53-4.53-1.06-1.06L5 18.44l-1.97-1.97ZM21 5H11v2h10V5Zm-10 6h10v2H11v-2Zm10 6H11v2h10v-2Z\"\n />\n </svg>\n )\n}\nexport default ChecklistIcon\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,wPAAwP,EAC1P,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ChevronDownIcon.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 = "chevronDown";
 const ChevronDownIcon = ({ 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__/ChevronDownIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChevronDownIcon.js","sources":["../../../../src/components/Icon/__generated__/ChevronDownIcon.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 = \"chevronDown\"\nconst ChevronDownIcon = ({\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.41 8.58 12 13.17l4.59-4.59L18 10l-6 6-6-6 1.41-1.42Z\"\n />\n </svg>\n )\n}\nexport default ChevronDownIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yDAAyD,EAC3D,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ChevronDownIcon.js","sources":["../../../../src/components/Icon/__generated__/ChevronDownIcon.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 = \"chevronDown\"\nconst ChevronDownIcon = ({\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.41 8.58 12 13.17l4.59-4.59L18 10l-6 6-6-6 1.41-1.42Z\"\n />\n </svg>\n )\n}\nexport default ChevronDownIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yDAAyD,EAC3D,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ChevronLeftIcon.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 = "chevronLeft";
 const ChevronLeftIcon = ({ 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__/ChevronLeftIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChevronLeftIcon.js","sources":["../../../../src/components/Icon/__generated__/ChevronLeftIcon.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 = \"chevronLeft\"\nconst ChevronLeftIcon = ({\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=\"M14.41 16.58 9.83 12l4.58-4.59L13 6l-6 6 6 6 1.41-1.42Z\"\n />\n </svg>\n )\n}\nexport default ChevronLeftIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yDAAyD,EAC3D,CAAA,CACE,CACP,CAAA;AACH;;;;"}
1	+ {"version":3,"file":"ChevronLeftIcon.js","sources":["../../../../src/components/Icon/__generated__/ChevronLeftIcon.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 = \"chevronLeft\"\nconst ChevronLeftIcon = ({\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=\"M14.41 16.58 9.83 12l4.58-4.59L13 6l-6 6 6 6 1.41-1.42Z\"\n />\n </svg>\n )\n}\nexport default ChevronLeftIcon\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,EACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yDAAyD,EAC3D,CAAA,CACE,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ChevronRightIcon.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 = "chevronRight";
 const ChevronRightIcon = ({ 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,