@activecollab/components 2.0.222 → 2.0.223

package/dist/esm/components/Icons/collection/PersonArrowOutCircle.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
+import { GradientDefs } from "../../GradientDefs";
 
 /**
  * @component PersonArrowOutCircleIcon
@@ -9,6 +10,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonArrowOutCircleIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -20,20 +28,28 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const PersonArrowOutCircleIcon = /*#__PURE__*/React.forwardRef((props, svgRef) => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg",
-  "data-testid": "PersonArrowOutCircleIcon",
-  fill: "var(--color-theme-600)",
-  focusable: false,
-  ref: svgRef
-}, props), /*#__PURE__*/React.createElement("path", {
-  fillRule: "evenodd",
-  clipRule: "evenodd",
-  d: "M12 2c.338 0 .672.017 1.001.05L13 3.5c0 .19.008.38.024.566a8 8 0 00-6.883 13.38A3.987 3.987 0 018.122 16.4 19.252 19.252 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048A7.97 7.97 0 0020 12c0-.69-.087-1.36-.252-2H21.8c.131.646.2 1.315.2 2a9.968 9.968 0 01-2.85 6.99l-.224.223-.329.302-.325.274-.353.272-.314.222-.345.223A9.953 9.953 0 0112 22a9.954 9.954 0 01-4.951-1.31l-.33-.197-.324-.21-.374-.266-.137-.105-.223-.177-.293-.25-.295-.273A9.971 9.971 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.999 1.999 0 00-.831.385A7.958 7.958 0 0012 20a7.963 7.963 0 004.307-1.257 1.983 1.983 0 00-.832-.386A17.253 17.253 0 0012 18zm0-11a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4zm6-8v3h-3v2h3v3l5-4-5-4z"
-})));
+const PersonArrowOutCircleIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
+  let {
+    gradient,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "PersonArrowOutCircleIcon",
+    fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)",
+    focusable: false,
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement(GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M12 2c.338 0 .672.017 1.001.05L13 3.5c0 .19.008.38.024.566a8 8 0 00-6.883 13.38A3.987 3.987 0 018.122 16.4 19.252 19.252 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048A7.97 7.97 0 0020 12c0-.69-.087-1.36-.252-2H21.8c.131.646.2 1.315.2 2a9.968 9.968 0 01-2.85 6.99l-.224.223-.329.302-.325.274-.353.272-.314.222-.345.223A9.953 9.953 0 0112 22a9.954 9.954 0 01-4.951-1.31l-.33-.197-.324-.21-.374-.266-.137-.105-.223-.177-.293-.25-.295-.273A9.971 9.971 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.999 1.999 0 00-.831.385A7.958 7.958 0 0012 20a7.963 7.963 0 004.307-1.257 1.983 1.983 0 00-.832-.386A17.253 17.253 0 0012 18zm0-11a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4zm6-8v3h-3v2h3v3l5-4-5-4z"
+  }));
+});
 PersonArrowOutCircleIcon.displayName = "PersonArrowOutCircleIcon";
 export default PersonArrowOutCircleIcon;
 //# sourceMappingURL=PersonArrowOutCircle.js.map

package/dist/esm/components/Icons/collection/PersonArrowOutCircle.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonArrowOutCircle.js","names":["React","PersonArrowOutCircleIcon","forwardRef","props","svgRef","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","fillRule","clipRule","d","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonArrowOutCircle.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component PersonArrowOutCircleIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <PersonArrowOutCircleIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonArrowOutCircleIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonArrowOutCircleIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M12 2c.338 0 .672.017 1.001.05L13 3.5c0 .19.008.38.024.566a8 8 0 00-6.883 13.38A3.987 3.987 0 018.122 16.4 19.252 19.252 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048A7.97 7.97 0 0020 12c0-.69-.087-1.36-.252-2H21.8c.131.646.2 1.315.2 2a9.968 9.968 0 01-2.85 6.99l-.224.223-.329.302-.325.274-.353.272-.314.222-.345.223A9.953 9.953 0 0112 22a9.954 9.954 0 01-4.951-1.31l-.33-.197-.324-.21-.374-.266-.137-.105-.223-.177-.293-.25-.295-.273A9.971 9.971 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.999 1.999 0 00-.831.385A7.958 7.958 0 0012 20a7.963 7.963 0 004.307-1.257 1.983 1.983 0 00-.832-.386A17.253 17.253 0 0012 18zm0-11a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4zm6-8v3h-3v2h3v3l5-4-5-4z\"\n      />\n    </svg>\n  )\n);\nPersonArrowOutCircleIcon.displayName = \"PersonArrowOutCircleIcon\";\nexport default PersonArrowOutCircleIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,wBAAwB,gBAAGD,KAAK,CAACE,UAAU,CAC/C,CAACC,KAAoC,EAAEC,MAAiC,kBACtEJ,KAAA,CAAAK,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAE,EAAG;EACVC,MAAM,EAAE,EAAG;EACXC,OAAO,EAAC,WAAW;EACnBC,KAAK,EAAC,4BAA4B;EAClC,eAAY,0BAA0B;EACtCC,IAAI,EAAC,wBAAwB;EAC7BC,SAAS,EAAE,KAAM;EACjBC,GAAG,EAAET;AAAO,GACRD,KAAK,gBAETH,KAAA,CAAAK,aAAA;EACES,QAAQ,EAAC,SAAS;EAClBC,QAAQ,EAAC,SAAS;EAClBC,CAAC,EAAC;AAA0uB,CAC7uB,CACE,CAET,CAAC;AACDf,wBAAwB,CAACgB,WAAW,GAAG,0BAA0B;AACjE,eAAehB,wBAAwB"}
+{"version":3,"file":"PersonArrowOutCircle.js","names":["React","GradientDefs","PersonArrowOutCircleIcon","forwardRef","_ref","svgRef","gradient","props","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","fillRule","clipRule","d","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonArrowOutCircle.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component PersonArrowOutCircleIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.\n * Format: \"linear-gradient(<angle>deg, <color1>, <color2>, ...)\"\n *\n * @example\n * return (\n * <PersonArrowOutCircleIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <PersonArrowOutCircleIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonArrowOutCircleIcon = React.forwardRef(\n  (\n    {\n      gradient,\n      ...props\n    }: React.SVGProps<SVGSVGElement> & {\n      gradient?: string;\n    },\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonArrowOutCircleIcon\"\n      fill={\n        gradient\n          ? \"url(#icon-gradient)\"\n          : props?.fill\n          ? props.fill\n          : \"var(--color-theme-600)\"\n      }\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <GradientDefs gradient={gradient} />\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M12 2c.338 0 .672.017 1.001.05L13 3.5c0 .19.008.38.024.566a8 8 0 00-6.883 13.38A3.987 3.987 0 018.122 16.4 19.252 19.252 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048A7.97 7.97 0 0020 12c0-.69-.087-1.36-.252-2H21.8c.131.646.2 1.315.2 2a9.968 9.968 0 01-2.85 6.99l-.224.223-.329.302-.325.274-.353.272-.314.222-.345.223A9.953 9.953 0 0112 22a9.954 9.954 0 01-4.951-1.31l-.33-.197-.324-.21-.374-.266-.137-.105-.223-.177-.293-.25-.295-.273A9.971 9.971 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.999 1.999 0 00-.831.385A7.958 7.958 0 0012 20a7.963 7.963 0 004.307-1.257 1.983 1.983 0 00-.832-.386A17.253 17.253 0 0012 18zm0-11a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4zm6-8v3h-3v2h3v3l5-4-5-4z\"\n      />\n    </svg>\n  )\n);\nPersonArrowOutCircleIcon.displayName = \"PersonArrowOutCircleIcon\";\nexport default PersonArrowOutCircleIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,wBAAwB,gBAAGF,KAAK,CAACG,UAAU,CAC/C,CAAAC,IAAA,EAOEC,MAAiC;EAAA,IANjC;IACEC,QAAQ;IACR,GAAGC;EAGL,CAAC,GAAAH,IAAA;EAAA,oBAGDJ,KAAA,CAAAQ,aAAA,QAAAC,QAAA;IACEC,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,0BAA0B;IACtCC,IAAI,EACFR,QAAQ,GACJ,qBAAqB,GACrBC,KAAK,YAALA,KAAK,CAAEO,IAAI,GACXP,KAAK,CAACO,IAAI,GACV,wBACL;IACDC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEX;EAAO,GACRE,KAAK,gBAETP,KAAA,CAAAQ,aAAA,CAACP,YAAY;IAACK,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpCN,KAAA,CAAAQ,aAAA;IACES,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC;EAA0uB,CAC7uB,CACE,CAAC;AAAA,CAEV,CAAC;AACDjB,wBAAwB,CAACkB,WAAW,GAAG,0BAA0B;AACjE,eAAelB,wBAAwB"}

package/dist/esm/components/Icons/collection/PersonCircle.d.ts

@@ -7,6 +7,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonCircleIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -18,6 +25,8 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-declare const PersonCircleIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+declare const PersonCircleIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & {
+    gradient?: string | undefined;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
 export default PersonCircleIcon;
 //# sourceMappingURL=PersonCircle.d.ts.map

package/dist/esm/components/Icons/collection/PersonCircle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PersonCircle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,gBAAgB,kHAmBrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"PersonCircle.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonCircle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,gBAAgB;;+CAkCrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/esm/components/Icons/collection/PersonCircle.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
+import { GradientDefs } from "../../GradientDefs";
 
 /**
  * @component PersonCircleIcon
@@ -9,6 +10,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonCircleIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -20,19 +28,27 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const PersonCircleIcon = /*#__PURE__*/React.forwardRef((props, svgRef) => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg",
-  "data-testid": "PersonCircleIcon",
-  fill: "var(--color-theme-600)",
-  focusable: false,
-  ref: svgRef
-}, props), /*#__PURE__*/React.createElement("path", {
-  d: "M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.01 10.01 0 017.864 8.151L21.8 10l.046.244.056.352.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm0-14a8 8 0 00-8 8l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048l.236-.265.193-.236.125-.163.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046a8.054 8.054 0 00-.409-.033l.359.028-.213-.019-.214-.012L12 4zm0 3a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4z",
-  fillRule: "evenodd"
-})));
+const PersonCircleIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
+  let {
+    gradient,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "PersonCircleIcon",
+    fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)",
+    focusable: false,
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement(GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.01 10.01 0 017.864 8.151L21.8 10l.046.244.056.352.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm0-14a8 8 0 00-8 8l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048l.236-.265.193-.236.125-.163.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046a8.054 8.054 0 00-.409-.033l.359.028-.213-.019-.214-.012L12 4zm0 3a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4z",
+    fillRule: "evenodd"
+  }));
+});
 PersonCircleIcon.displayName = "PersonCircleIcon";
 export default PersonCircleIcon;
 //# sourceMappingURL=PersonCircle.js.map

package/dist/esm/components/Icons/collection/PersonCircle.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonCircle.js","names":["React","PersonCircleIcon","forwardRef","props","svgRef","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonCircle.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component PersonCircleIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <PersonCircleIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonCircleIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonCircleIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.01 10.01 0 017.864 8.151L21.8 10l.046.244.056.352.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm0-14a8 8 0 00-8 8l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048l.236-.265.193-.236.125-.163.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046a8.054 8.054 0 00-.409-.033l.359.028-.213-.019-.214-.012L12 4zm0 3a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonCircleIcon.displayName = \"PersonCircleIcon\";\nexport default PersonCircleIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,gBAAgB,gBAAGD,KAAK,CAACE,UAAU,CACvC,CAACC,KAAoC,EAAEC,MAAiC,kBACtEJ,KAAA,CAAAK,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAE,EAAG;EACVC,MAAM,EAAE,EAAG;EACXC,OAAO,EAAC,WAAW;EACnBC,KAAK,EAAC,4BAA4B;EAClC,eAAY,kBAAkB;EAC9BC,IAAI,EAAC,wBAAwB;EAC7BC,SAAS,EAAE,KAAM;EACjBC,GAAG,EAAET;AAAO,GACRD,KAAK,gBAETH,KAAA,CAAAK,aAAA;EACES,CAAC,EAAC,6tEAA6tE;EAC/tEC,QAAQ,EAAC;AAAS,CACnB,CACE,CAET,CAAC;AACDd,gBAAgB,CAACe,WAAW,GAAG,kBAAkB;AACjD,eAAef,gBAAgB"}
+{"version":3,"file":"PersonCircle.js","names":["React","GradientDefs","PersonCircleIcon","forwardRef","_ref","svgRef","gradient","props","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonCircle.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component PersonCircleIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.\n * Format: \"linear-gradient(<angle>deg, <color1>, <color2>, ...)\"\n *\n * @example\n * return (\n * <PersonCircleIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <PersonCircleIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonCircleIcon = React.forwardRef(\n  (\n    {\n      gradient,\n      ...props\n    }: React.SVGProps<SVGSVGElement> & {\n      gradient?: string;\n    },\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonCircleIcon\"\n      fill={\n        gradient\n          ? \"url(#icon-gradient)\"\n          : props?.fill\n          ? props.fill\n          : \"var(--color-theme-600)\"\n      }\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <GradientDefs gradient={gradient} />\n      <path\n        d=\"M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.01 10.01 0 017.864 8.151L21.8 10l.046.244.056.352.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm0-14a8 8 0 00-8 8l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.292 0 2.585.133 3.877.398.76.156 1.444.525 1.983 1.048l.236-.265.193-.236.125-.163.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046a8.054 8.054 0 00-.409-.033l.359.028-.213-.019-.214-.012L12 4zm0 3a4 4 0 110 8 4 4 0 010-8zm0 2a2 2 0 100 4 2 2 0 000-4z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonCircleIcon.displayName = \"PersonCircleIcon\";\nexport default PersonCircleIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,gBAAgB,gBAAGF,KAAK,CAACG,UAAU,CACvC,CAAAC,IAAA,EAOEC,MAAiC;EAAA,IANjC;IACEC,QAAQ;IACR,GAAGC;EAGL,CAAC,GAAAH,IAAA;EAAA,oBAGDJ,KAAA,CAAAQ,aAAA,QAAAC,QAAA;IACEC,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,kBAAkB;IAC9BC,IAAI,EACFR,QAAQ,GACJ,qBAAqB,GACrBC,KAAK,YAALA,KAAK,CAAEO,IAAI,GACXP,KAAK,CAACO,IAAI,GACV,wBACL;IACDC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEX;EAAO,GACRE,KAAK,gBAETP,KAAA,CAAAQ,aAAA,CAACP,YAAY;IAACK,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpCN,KAAA,CAAAQ,aAAA;IACES,CAAC,EAAC,6tEAA6tE;IAC/tEC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDhB,gBAAgB,CAACiB,WAAW,GAAG,kBAAkB;AACjD,eAAejB,gBAAgB"}

package/dist/esm/components/Icons/collection/PersonCircleOff.d.ts

@@ -7,6 +7,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonCircleOffIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -18,6 +25,8 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-declare const PersonCircleOffIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+declare const PersonCircleOffIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & {
+    gradient?: string | undefined;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
 export default PersonCircleOffIcon;
 //# sourceMappingURL=PersonCircleOff.d.ts.map

package/dist/esm/components/Icons/collection/PersonCircleOff.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PersonCircleOff.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonCircleOff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,mBAAmB,kHAmBxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"PersonCircleOff.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonCircleOff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,mBAAmB;;+CAkCxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/esm/components/Icons/collection/PersonCircleOff.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
+import { GradientDefs } from "../../GradientDefs";
 
 /**
  * @component PersonCircleOffIcon
@@ -9,6 +10,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonCircleOffIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -20,19 +28,27 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const PersonCircleOffIcon = /*#__PURE__*/React.forwardRef((props, svgRef) => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg",
-  "data-testid": "PersonCircleOffIcon",
-  fill: "var(--color-theme-600)",
-  focusable: false,
-  ref: svgRef
-}, props), /*#__PURE__*/React.createElement("path", {
-  d: "M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.013 10.013 0 017.753 7.587l.062.3.042.233.044.276.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm-8-6l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.05 0 2.102.088 3.152.263L13.57 14.68a4 4 0 01-5.25-5.25L5.814 6.927A7.967 7.967 0 004 12zm8-8a7.966 7.966 0 00-4.935 1.703l11.231 11.231.118-.152.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046-.477-.036L12 4zm-.117 8.997l-1.879-1.881L10 11a2 2 0 001.883 1.997zM12 7a4 4 0 013.92 4.804L11.194 7.08c.26-.053.53-.081.805-.081z",
-  fillRule: "evenodd"
-})));
+const PersonCircleOffIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
+  let {
+    gradient,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "PersonCircleOffIcon",
+    fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)",
+    focusable: false,
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement(GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.013 10.013 0 017.753 7.587l.062.3.042.233.044.276.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm-8-6l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.05 0 2.102.088 3.152.263L13.57 14.68a4 4 0 01-5.25-5.25L5.814 6.927A7.967 7.967 0 004 12zm8-8a7.966 7.966 0 00-4.935 1.703l11.231 11.231.118-.152.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046-.477-.036L12 4zm-.117 8.997l-1.879-1.881L10 11a2 2 0 001.883 1.997zM12 7a4 4 0 013.92 4.804L11.194 7.08c.26-.053.53-.081.805-.081z",
+    fillRule: "evenodd"
+  }));
+});
 PersonCircleOffIcon.displayName = "PersonCircleOffIcon";
 export default PersonCircleOffIcon;
 //# sourceMappingURL=PersonCircleOff.js.map

package/dist/esm/components/Icons/collection/PersonCircleOff.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonCircleOff.js","names":["React","PersonCircleOffIcon","forwardRef","props","svgRef","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonCircleOff.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component PersonCircleOffIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <PersonCircleOffIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonCircleOffIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonCircleOffIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.013 10.013 0 017.753 7.587l.062.3.042.233.044.276.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm-8-6l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.05 0 2.102.088 3.152.263L13.57 14.68a4 4 0 01-5.25-5.25L5.814 6.927A7.967 7.967 0 004 12zm8-8a7.966 7.966 0 00-4.935 1.703l11.231 11.231.118-.152.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046-.477-.036L12 4zm-.117 8.997l-1.879-1.881L10 11a2 2 0 001.883 1.997zM12 7a4 4 0 013.92 4.804L11.194 7.08c.26-.053.53-.081.805-.081z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonCircleOffIcon.displayName = \"PersonCircleOffIcon\";\nexport default PersonCircleOffIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,mBAAmB,gBAAGD,KAAK,CAACE,UAAU,CAC1C,CAACC,KAAoC,EAAEC,MAAiC,kBACtEJ,KAAA,CAAAK,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAE,EAAG;EACVC,MAAM,EAAE,EAAG;EACXC,OAAO,EAAC,WAAW;EACnBC,KAAK,EAAC,4BAA4B;EAClC,eAAY,qBAAqB;EACjCC,IAAI,EAAC,wBAAwB;EAC7BC,SAAS,EAAE,KAAM;EACjBC,GAAG,EAAET;AAAO,GACRD,KAAK,gBAETH,KAAA,CAAAK,aAAA;EACES,CAAC,EAAC,0xEAA0xE;EAC5xEC,QAAQ,EAAC;AAAS,CACnB,CACE,CAET,CAAC;AACDd,mBAAmB,CAACe,WAAW,GAAG,qBAAqB;AACvD,eAAef,mBAAmB"}
+{"version":3,"file":"PersonCircleOff.js","names":["React","GradientDefs","PersonCircleOffIcon","forwardRef","_ref","svgRef","gradient","props","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonCircleOff.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component PersonCircleOffIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.\n * Format: \"linear-gradient(<angle>deg, <color1>, <color2>, ...)\"\n *\n * @example\n * return (\n * <PersonCircleOffIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <PersonCircleOffIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonCircleOffIcon = React.forwardRef(\n  (\n    {\n      gradient,\n      ...props\n    }: React.SVGProps<SVGSVGElement> & {\n      gradient?: string;\n    },\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonCircleOffIcon\"\n      fill={\n        gradient\n          ? \"url(#icon-gradient)\"\n          : props?.fill\n          ? props.fill\n          : \"var(--color-theme-600)\"\n      }\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <GradientDefs gradient={gradient} />\n      <path\n        d=\"M12 2l.28.004.316.013.244.018.402.041.14.019.267.04.162.029.19.036a10.013 10.013 0 017.753 7.587l.062.3.042.233.044.276.031.244.017.154.022.257.02.367c.006.127.008.254.008.382l-.002.207-.01.299-.022.323-.04.397-.032.238-.059.354-.062.308-.05.22-.046.184a9.93 9.93 0 01-.12.422l-.092.283-.13.357-.113.283-.094.215-.161.341-.136.265-.178.32-.13.217c-.145.237-.302.47-.47.696l-.274.356-.229.273-.14.157-.258.274-.226.224-.104.099-.238.215-.312.262-.398.305-.284.199-.33.213a9.99 9.99 0 01-.35.208l-.266.145-.383.19-.291.132-.346.142-.358.132-.31.1-.402.116-.138.035-.187.045-.347.072-.443.074-.305.04-.16.016-.423.032-.271.011L12 22l-.2-.002-.331-.012-.373-.026-.167-.017-.164-.019-.246-.033-.336-.056-.3-.06-.31-.072-.415-.113-.297-.093-.323-.112-.284-.11-.343-.147-.266-.124-.28-.14-.159-.086-.328-.188-.177-.108-.297-.193-.383-.272-.316-.247-.316-.267-.333-.307-.208-.207-.247-.262-.17-.192-.245-.294-.18-.233a10.017 10.017 0 01-.361-.511l-.171-.27-.063-.103-.1-.17-.142-.259-.198-.392-.1-.213-.126-.295-.11-.281a9.91 9.91 0 01-.312-.984l-.096-.403-.062-.309-.059-.354-.06-.49-.028-.376-.013-.278A10.18 10.18 0 012 12C2 6.477 6.477 2 12 2zm0 16c-1.157 0-2.315.119-3.476.357a1.998 1.998 0 00-.831.385c.264.17.538.323.822.46l.287.133.295.122.356.13.292.09.146.042.27.068.248.055.281.051c.108.018.216.034.325.047l.38.037.28.017L12 20l.368-.008.167-.01.167-.012c.12-.01.24-.024.36-.04l.289-.044.24-.044.248-.054.313-.08.16-.047.234-.075.3-.107.395-.163.247-.114.304-.156.214-.12a8 8 0 00.3-.183 1.984 1.984 0 00-.83-.386A17.249 17.249 0 0012 18zm-8-6l.008.352.014.24.025.28.024.196.04.265.043.236.063.29.046.184.083.29.034.11.113.329.17.42.07.158c.09.193.186.382.29.567l.202.34.126.194.241.34.18.23.134.162.235.264a3.988 3.988 0 011.981-1.05A19.248 19.248 0 0112 16c1.05 0 2.102.088 3.152.263L13.57 14.68a4 4 0 01-5.25-5.25L5.814 6.927A7.967 7.967 0 004 12zm8-8a7.966 7.966 0 00-4.935 1.703l11.231 11.231.118-.152.18-.25.17-.258.097-.157.094-.16.14-.257.131-.263.103-.225.133-.321.119-.328.098-.313.104-.39.063-.291.053-.297c.02-.12.036-.242.05-.365l.03-.32.01-.181c.008-.135.011-.27.011-.406l-.012-.443a8.034 8.034 0 00-.078-.762l-.081-.449a8.012 8.012 0 00-5.843-6.097l-.422-.096-.353-.062-.358-.046-.477-.036L12 4zm-.117 8.997l-1.879-1.881L10 11a2 2 0 001.883 1.997zM12 7a4 4 0 013.92 4.804L11.194 7.08c.26-.053.53-.081.805-.081z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonCircleOffIcon.displayName = \"PersonCircleOffIcon\";\nexport default PersonCircleOffIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,mBAAmB,gBAAGF,KAAK,CAACG,UAAU,CAC1C,CAAAC,IAAA,EAOEC,MAAiC;EAAA,IANjC;IACEC,QAAQ;IACR,GAAGC;EAGL,CAAC,GAAAH,IAAA;EAAA,oBAGDJ,KAAA,CAAAQ,aAAA,QAAAC,QAAA;IACEC,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,qBAAqB;IACjCC,IAAI,EACFR,QAAQ,GACJ,qBAAqB,GACrBC,KAAK,YAALA,KAAK,CAAEO,IAAI,GACXP,KAAK,CAACO,IAAI,GACV,wBACL;IACDC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEX;EAAO,GACRE,KAAK,gBAETP,KAAA,CAAAQ,aAAA,CAACP,YAAY;IAACK,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpCN,KAAA,CAAAQ,aAAA;IACES,CAAC,EAAC,0xEAA0xE;IAC5xEC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDhB,mBAAmB,CAACiB,WAAW,GAAG,qBAAqB;AACvD,eAAejB,mBAAmB"}

package/dist/esm/components/Icons/collection/PersonList.d.ts

@@ -7,6 +7,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonListIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -18,6 +25,8 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-declare const PersonListIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+declare const PersonListIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & {
+    gradient?: string | undefined;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
 export default PersonListIcon;
 //# sourceMappingURL=PersonList.d.ts.map

package/dist/esm/components/Icons/collection/PersonList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PersonList.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,cAAc,kHAoBnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"PersonList.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,cAAc;;+CAmCnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/components/Icons/collection/PersonList.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
+import { GradientDefs } from "../../GradientDefs";
 
 /**
  * @component PersonListIcon
@@ -9,6 +10,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonListIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -20,20 +28,28 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const PersonListIcon = /*#__PURE__*/React.forwardRef((props, svgRef) => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg",
-  "data-testid": "PersonListIcon",
-  fill: "var(--color-theme-600)",
-  focusable: false,
-  ref: svgRef
-}, props), /*#__PURE__*/React.createElement("path", {
-  fillRule: "evenodd",
-  clipRule: "evenodd",
-  d: "M17 16c1.33 0 3.216.507 3.683 2l.216.682a.5.5 0 01-.191.562c-.726.504-1.96.756-3.703.756-1.77 0-3.019-.26-3.745-.78a.5.5 0 01-.198-.511l.15-.709c.423-1.38 2.458-2 3.788-2zm0-5a2 2 0 110 4 2 2 0 010-4zm-4.2 1a1 1 0 01-1 1H9a1 1 0 110-2h2.8a1 1 0 011 1zm-1.133 5a1 1 0 01-1 1H9a1 1 0 110-2h1.667a1 1 0 011 1zM19 6a1 1 0 110 2H9a1 1 0 010-2h10zM5 5.5c.83 0 1.5.67 1.5 1.5S5.83 8.5 5 8.5 3.5 7.83 3.5 7 4.17 5.5 5 5.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z"
-})));
+const PersonListIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
+  let {
+    gradient,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "PersonListIcon",
+    fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)",
+    focusable: false,
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement(GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M17 16c1.33 0 3.216.507 3.683 2l.216.682a.5.5 0 01-.191.562c-.726.504-1.96.756-3.703.756-1.77 0-3.019-.26-3.745-.78a.5.5 0 01-.198-.511l.15-.709c.423-1.38 2.458-2 3.788-2zm0-5a2 2 0 110 4 2 2 0 010-4zm-4.2 1a1 1 0 01-1 1H9a1 1 0 110-2h2.8a1 1 0 011 1zm-1.133 5a1 1 0 01-1 1H9a1 1 0 110-2h1.667a1 1 0 011 1zM19 6a1 1 0 110 2H9a1 1 0 010-2h10zM5 5.5c.83 0 1.5.67 1.5 1.5S5.83 8.5 5 8.5 3.5 7.83 3.5 7 4.17 5.5 5 5.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z"
+  }));
+});
 PersonListIcon.displayName = "PersonListIcon";
 export default PersonListIcon;
 //# sourceMappingURL=PersonList.js.map

package/dist/esm/components/Icons/collection/PersonList.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonList.js","names":["React","PersonListIcon","forwardRef","props","svgRef","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","fillRule","clipRule","d","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonList.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component PersonListIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <PersonListIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonListIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonListIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M17 16c1.33 0 3.216.507 3.683 2l.216.682a.5.5 0 01-.191.562c-.726.504-1.96.756-3.703.756-1.77 0-3.019-.26-3.745-.78a.5.5 0 01-.198-.511l.15-.709c.423-1.38 2.458-2 3.788-2zm0-5a2 2 0 110 4 2 2 0 010-4zm-4.2 1a1 1 0 01-1 1H9a1 1 0 110-2h2.8a1 1 0 011 1zm-1.133 5a1 1 0 01-1 1H9a1 1 0 110-2h1.667a1 1 0 011 1zM19 6a1 1 0 110 2H9a1 1 0 010-2h10zM5 5.5c.83 0 1.5.67 1.5 1.5S5.83 8.5 5 8.5 3.5 7.83 3.5 7 4.17 5.5 5 5.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z\"\n      />\n    </svg>\n  )\n);\nPersonListIcon.displayName = \"PersonListIcon\";\nexport default PersonListIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,cAAc,gBAAGD,KAAK,CAACE,UAAU,CACrC,CAACC,KAAoC,EAAEC,MAAiC,kBACtEJ,KAAA,CAAAK,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAE,EAAG;EACVC,MAAM,EAAE,EAAG;EACXC,OAAO,EAAC,WAAW;EACnBC,KAAK,EAAC,4BAA4B;EAClC,eAAY,gBAAgB;EAC5BC,IAAI,EAAC,wBAAwB;EAC7BC,SAAS,EAAE,KAAM;EACjBC,GAAG,EAAET;AAAO,GACRD,KAAK,gBAETH,KAAA,CAAAK,aAAA;EACES,QAAQ,EAAC,SAAS;EAClBC,QAAQ,EAAC,SAAS;EAClBC,CAAC,EAAC;AAAojB,CACvjB,CACE,CAET,CAAC;AACDf,cAAc,CAACgB,WAAW,GAAG,gBAAgB;AAC7C,eAAehB,cAAc"}
+{"version":3,"file":"PersonList.js","names":["React","GradientDefs","PersonListIcon","forwardRef","_ref","svgRef","gradient","props","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","fillRule","clipRule","d","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonList.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component PersonListIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.\n * Format: \"linear-gradient(<angle>deg, <color1>, <color2>, ...)\"\n *\n * @example\n * return (\n * <PersonListIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <PersonListIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonListIcon = React.forwardRef(\n  (\n    {\n      gradient,\n      ...props\n    }: React.SVGProps<SVGSVGElement> & {\n      gradient?: string;\n    },\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonListIcon\"\n      fill={\n        gradient\n          ? \"url(#icon-gradient)\"\n          : props?.fill\n          ? props.fill\n          : \"var(--color-theme-600)\"\n      }\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <GradientDefs gradient={gradient} />\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M17 16c1.33 0 3.216.507 3.683 2l.216.682a.5.5 0 01-.191.562c-.726.504-1.96.756-3.703.756-1.77 0-3.019-.26-3.745-.78a.5.5 0 01-.198-.511l.15-.709c.423-1.38 2.458-2 3.788-2zm0-5a2 2 0 110 4 2 2 0 010-4zm-4.2 1a1 1 0 01-1 1H9a1 1 0 110-2h2.8a1 1 0 011 1zm-1.133 5a1 1 0 01-1 1H9a1 1 0 110-2h1.667a1 1 0 011 1zM19 6a1 1 0 110 2H9a1 1 0 010-2h10zM5 5.5c.83 0 1.5.67 1.5 1.5S5.83 8.5 5 8.5 3.5 7.83 3.5 7 4.17 5.5 5 5.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zm0 5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z\"\n      />\n    </svg>\n  )\n);\nPersonListIcon.displayName = \"PersonListIcon\";\nexport default PersonListIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,cAAc,gBAAGF,KAAK,CAACG,UAAU,CACrC,CAAAC,IAAA,EAOEC,MAAiC;EAAA,IANjC;IACEC,QAAQ;IACR,GAAGC;EAGL,CAAC,GAAAH,IAAA;EAAA,oBAGDJ,KAAA,CAAAQ,aAAA,QAAAC,QAAA;IACEC,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,gBAAgB;IAC5BC,IAAI,EACFR,QAAQ,GACJ,qBAAqB,GACrBC,KAAK,YAALA,KAAK,CAAEO,IAAI,GACXP,KAAK,CAACO,IAAI,GACV,wBACL;IACDC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEX;EAAO,GACRE,KAAK,gBAETP,KAAA,CAAAQ,aAAA,CAACP,YAAY;IAACK,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpCN,KAAA,CAAAQ,aAAA;IACES,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC;EAAojB,CACvjB,CACE,CAAC;AAAA,CAEV,CAAC;AACDjB,cAAc,CAACkB,WAAW,GAAG,gBAAgB;AAC7C,eAAelB,cAAc"}

package/dist/esm/components/Icons/collection/PersonPlus.d.ts

@@ -7,6 +7,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonPlusIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -18,6 +25,8 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-declare const PersonPlusIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+declare const PersonPlusIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & {
+    gradient?: string | undefined;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
 export default PersonPlusIcon;
 //# sourceMappingURL=PersonPlus.d.ts.map

package/dist/esm/components/Icons/collection/PersonPlus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PersonPlus.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonPlus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,cAAc,kHAmBnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"PersonPlus.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/PersonPlus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,cAAc;;+CAkCnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/components/Icons/collection/PersonPlus.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from "react";
+import { GradientDefs } from "../../GradientDefs";
 
 /**
  * @component PersonPlusIcon
@@ -9,6 +10,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PersonPlusIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -20,19 +28,27 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-const PersonPlusIcon = /*#__PURE__*/React.forwardRef((props, svgRef) => /*#__PURE__*/React.createElement("svg", _extends({
-  width: 24,
-  height: 24,
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg",
-  "data-testid": "PersonPlusIcon",
-  fill: "var(--color-theme-600)",
-  focusable: false,
-  ref: svgRef
-}, props), /*#__PURE__*/React.createElement("path", {
-  d: "M12 13c1.382 0 2.764.119 4.145.357 1.687.29 3.06 1.306 3.598 2.665l1.135 2.862c.417 1.05-.27 2.18-1.534 2.526-.107.03-.217.052-.329.069A47.673 47.673 0 0112 22c-2.339 0-4.677-.174-7.015-.521-1.31-.195-2.181-1.234-1.947-2.321a1.73 1.73 0 01.083-.274l1.136-2.862c.539-1.359 1.91-2.375 3.597-2.665A24.402 24.402 0 0112 13zm0 2c-1.292 0-2.586.105-3.884.315-.896.145-1.624.653-1.91 1.333L5 19.51c2.335.327 4.668.49 7 .49a50.46 50.46 0 007-.49l-1.206-2.862c-.286-.68-1.014-1.188-1.91-1.333A24.237 24.237 0 0012 15zm0-13c.711 0 1.388.149 2 .416v2.349A3 3 0 1014.829 8h2.072A5.002 5.002 0 017 7a5 5 0 015-5zm8 0v2h2v2h-2v2h-2V5.999L16 6V4l2-.001V2h2z",
-  fillRule: "evenodd"
-})));
+const PersonPlusIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => {
+  let {
+    gradient,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    "data-testid": "PersonPlusIcon",
+    fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)",
+    focusable: false,
+    ref: svgRef
+  }, props), /*#__PURE__*/React.createElement(GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M12 13c1.382 0 2.764.119 4.145.357 1.687.29 3.06 1.306 3.598 2.665l1.135 2.862c.417 1.05-.27 2.18-1.534 2.526-.107.03-.217.052-.329.069A47.673 47.673 0 0112 22c-2.339 0-4.677-.174-7.015-.521-1.31-.195-2.181-1.234-1.947-2.321a1.73 1.73 0 01.083-.274l1.136-2.862c.539-1.359 1.91-2.375 3.597-2.665A24.402 24.402 0 0112 13zm0 2c-1.292 0-2.586.105-3.884.315-.896.145-1.624.653-1.91 1.333L5 19.51c2.335.327 4.668.49 7 .49a50.46 50.46 0 007-.49l-1.206-2.862c-.286-.68-1.014-1.188-1.91-1.333A24.237 24.237 0 0012 15zm0-13c.711 0 1.388.149 2 .416v2.349A3 3 0 1014.829 8h2.072A5.002 5.002 0 017 7a5 5 0 015-5zm8 0v2h2v2h-2v2h-2V5.999L16 6V4l2-.001V2h2z",
+    fillRule: "evenodd"
+  }));
+});
 PersonPlusIcon.displayName = "PersonPlusIcon";
 export default PersonPlusIcon;
 //# sourceMappingURL=PersonPlus.js.map

package/dist/esm/components/Icons/collection/PersonPlus.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersonPlus.js","names":["React","PersonPlusIcon","forwardRef","props","svgRef","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonPlus.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component PersonPlusIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n *   <PersonPlusIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonPlusIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonPlusIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M12 13c1.382 0 2.764.119 4.145.357 1.687.29 3.06 1.306 3.598 2.665l1.135 2.862c.417 1.05-.27 2.18-1.534 2.526-.107.03-.217.052-.329.069A47.673 47.673 0 0112 22c-2.339 0-4.677-.174-7.015-.521-1.31-.195-2.181-1.234-1.947-2.321a1.73 1.73 0 01.083-.274l1.136-2.862c.539-1.359 1.91-2.375 3.597-2.665A24.402 24.402 0 0112 13zm0 2c-1.292 0-2.586.105-3.884.315-.896.145-1.624.653-1.91 1.333L5 19.51c2.335.327 4.668.49 7 .49a50.46 50.46 0 007-.49l-1.206-2.862c-.286-.68-1.014-1.188-1.91-1.333A24.237 24.237 0 0012 15zm0-13c.711 0 1.388.149 2 .416v2.349A3 3 0 1014.829 8h2.072A5.002 5.002 0 017 7a5 5 0 015-5zm8 0v2h2v2h-2v2h-2V5.999L16 6V4l2-.001V2h2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonPlusIcon.displayName = \"PersonPlusIcon\";\nexport default PersonPlusIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,cAAc,gBAAGD,KAAK,CAACE,UAAU,CACrC,CAACC,KAAoC,EAAEC,MAAiC,kBACtEJ,KAAA,CAAAK,aAAA,QAAAC,QAAA;EACEC,KAAK,EAAE,EAAG;EACVC,MAAM,EAAE,EAAG;EACXC,OAAO,EAAC,WAAW;EACnBC,KAAK,EAAC,4BAA4B;EAClC,eAAY,gBAAgB;EAC5BC,IAAI,EAAC,wBAAwB;EAC7BC,SAAS,EAAE,KAAM;EACjBC,GAAG,EAAET;AAAO,GACRD,KAAK,gBAETH,KAAA,CAAAK,aAAA;EACES,CAAC,EAAC,ooBAAooB;EACtoBC,QAAQ,EAAC;AAAS,CACnB,CACE,CAET,CAAC;AACDd,cAAc,CAACe,WAAW,GAAG,gBAAgB;AAC7C,eAAef,cAAc"}
+{"version":3,"file":"PersonPlus.js","names":["React","GradientDefs","PersonPlusIcon","forwardRef","_ref","svgRef","gradient","props","createElement","_extends","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName"],"sources":["../../../../../src/components/Icons/collection/PersonPlus.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component PersonPlusIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.\n * Format: \"linear-gradient(<angle>deg, <color1>, <color2>, ...)\"\n *\n * @example\n * return (\n * <PersonPlusIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <PersonPlusIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst PersonPlusIcon = React.forwardRef(\n  (\n    {\n      gradient,\n      ...props\n    }: React.SVGProps<SVGSVGElement> & {\n      gradient?: string;\n    },\n    svgRef?: React.Ref<SVGSVGElement>\n  ) => (\n    <svg\n      width={24}\n      height={24}\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"PersonPlusIcon\"\n      fill={\n        gradient\n          ? \"url(#icon-gradient)\"\n          : props?.fill\n          ? props.fill\n          : \"var(--color-theme-600)\"\n      }\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <GradientDefs gradient={gradient} />\n      <path\n        d=\"M12 13c1.382 0 2.764.119 4.145.357 1.687.29 3.06 1.306 3.598 2.665l1.135 2.862c.417 1.05-.27 2.18-1.534 2.526-.107.03-.217.052-.329.069A47.673 47.673 0 0112 22c-2.339 0-4.677-.174-7.015-.521-1.31-.195-2.181-1.234-1.947-2.321a1.73 1.73 0 01.083-.274l1.136-2.862c.539-1.359 1.91-2.375 3.597-2.665A24.402 24.402 0 0112 13zm0 2c-1.292 0-2.586.105-3.884.315-.896.145-1.624.653-1.91 1.333L5 19.51c2.335.327 4.668.49 7 .49a50.46 50.46 0 007-.49l-1.206-2.862c-.286-.68-1.014-1.188-1.91-1.333A24.237 24.237 0 0012 15zm0-13c.711 0 1.388.149 2 .416v2.349A3 3 0 1014.829 8h2.072A5.002 5.002 0 017 7a5 5 0 015-5zm8 0v2h2v2h-2v2h-2V5.999L16 6V4l2-.001V2h2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nPersonPlusIcon.displayName = \"PersonPlusIcon\";\nexport default PersonPlusIcon;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,oBAAoB;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,cAAc,gBAAGF,KAAK,CAACG,UAAU,CACrC,CAAAC,IAAA,EAOEC,MAAiC;EAAA,IANjC;IACEC,QAAQ;IACR,GAAGC;EAGL,CAAC,GAAAH,IAAA;EAAA,oBAGDJ,KAAA,CAAAQ,aAAA,QAAAC,QAAA;IACEC,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,gBAAgB;IAC5BC,IAAI,EACFR,QAAQ,GACJ,qBAAqB,GACrBC,KAAK,YAALA,KAAK,CAAEO,IAAI,GACXP,KAAK,CAACO,IAAI,GACV,wBACL;IACDC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAEX;EAAO,GACRE,KAAK,gBAETP,KAAA,CAAAQ,aAAA,CAACP,YAAY;IAACK,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACpCN,KAAA,CAAAQ,aAAA;IACES,CAAC,EAAC,ooBAAooB;IACtoBC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDhB,cAAc,CAACiB,WAAW,GAAG,gBAAgB;AAC7C,eAAejB,cAAc"}

package/dist/esm/components/Icons/collection/Pin.d.ts

@@ -7,6 +7,13 @@ import React from "react";
  * The Icon component is
  * customizable, allowing for variations in size, color, and style to fit the needs of the application.
  *
+ * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill.
+ * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)"
+ *
+ * @example
+ * return (
+ * <PinIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -18,6 +25,8 @@ import React from "react";
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-declare const PinIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+declare const PinIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement> & {
+    gradient?: string | undefined;
+}, "ref"> & React.RefAttributes<SVGSVGElement>>;
 export default PinIcon;
 //# sourceMappingURL=Pin.d.ts.map

package/dist/esm/components/Icons/collection/Pin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pin.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/Pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,OAAO,kHAmBZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Pin.d.ts","sourceRoot":"","sources":["../../../../../src/components/Icons/collection/Pin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,OAAO;;+CAkCZ,CAAC;AAEF,eAAe,OAAO,CAAC"}