@activecollab/components 2.0.222 → 2.0.223

package/dist/cjs/components/Icons/collection/EyeOffSmall.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component EyeOffSmallIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <EyeOffSmallIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var EyeOffSmallIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var EyeOffSmallIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 12,
     height: 12,
     viewBox: "0 0 12 12",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "EyeOffSmallIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M1.05 1.05l9.9 9.9-.707.707L8.205 9.62C7.517 9.866 6.775 10 6 10 3.273 10 .944 8.341 0 6a6.35 6.35 0 011.971-2.615L.343 1.757l.707-.707zM1.19 6C2.09 7.792 3.95 8.933 6 8.933c.463 0 .915-.058 1.35-.168L6.176 7.59c-.058.006-.117.009-.176.009-.904 0-1.636-.716-1.636-1.6 0-.07.004-.14.013-.207L2.736 4.15A5.273 5.273 0 001.189 6zM6 2c2.727 0 5.056 1.659 6 4a6.35 6.35 0 01-1.972 2.615l-.765-.766A5.273 5.273 0 0010.811 6C9.91 4.208 8.05 3.067 6 3.067c-.463 0-.916.058-1.35.168l-.857-.855A6.553 6.553 0 016 2zm0 2.4c.904 0 1.636.716 1.636 1.6 0 .07-.004.14-.013.208l-1.8-1.799C5.88 4.403 5.94 4.4 6 4.4z",
     fillRule: "evenodd"
   }));

package/dist/cjs/components/Icons/collection/EyeOffSmall.js.map

@@ -1 +1 @@
-{"version":3,"file":"EyeOffSmall.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","EyeOffSmallIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/EyeOffSmall.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component EyeOffSmallIcon\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 *   <EyeOffSmallIcon 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 EyeOffSmallIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={12}\n      height={12}\n      viewBox=\"0 0 12 12\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"EyeOffSmallIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M1.05 1.05l9.9 9.9-.707.707L8.205 9.62C7.517 9.866 6.775 10 6 10 3.273 10 .944 8.341 0 6a6.35 6.35 0 011.971-2.615L.343 1.757l.707-.707zM1.19 6C2.09 7.792 3.95 8.933 6 8.933c.463 0 .915-.058 1.35-.168L6.176 7.59c-.058.006-.117.009-.176.009-.904 0-1.636-.716-1.636-1.6 0-.07.004-.14.013-.207L2.736 4.15A5.273 5.273 0 001.189 6zM6 2c2.727 0 5.056 1.659 6 4a6.35 6.35 0 01-1.972 2.615l-.765-.766A5.273 5.273 0 0010.811 6C9.91 4.208 8.05 3.067 6 3.067c-.463 0-.916.058-1.35.168l-.857-.855A6.553 6.553 0 016 2zm0 2.4c.904 0 1.636.716 1.636 1.6 0 .07-.004.14-.013.208l-1.8-1.799C5.88 4.403 5.94 4.4 6 4.4z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nEyeOffSmallIcon.displayName = \"EyeOffSmallIcon\";\nexport default EyeOffSmallIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,eAAe,gBAAGC,cAAK,CAACC,UAAU,CACtC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,iBAAiB;IAC7BC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,CAAC,EAAC,ylBAAylB;IAC3lBC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDd,eAAe,CAACe,WAAW,GAAG,iBAAiB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GACjCe,eAAe"}
+{"version":3,"file":"EyeOffSmall.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","EyeOffSmallIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/EyeOffSmall.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component EyeOffSmallIcon\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 * <EyeOffSmallIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <EyeOffSmallIcon 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 EyeOffSmallIcon = 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={12}\n      height={12}\n      viewBox=\"0 0 12 12\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"EyeOffSmallIcon\"\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=\"M1.05 1.05l9.9 9.9-.707.707L8.205 9.62C7.517 9.866 6.775 10 6 10 3.273 10 .944 8.341 0 6a6.35 6.35 0 011.971-2.615L.343 1.757l.707-.707zM1.19 6C2.09 7.792 3.95 8.933 6 8.933c.463 0 .915-.058 1.35-.168L6.176 7.59c-.058.006-.117.009-.176.009-.904 0-1.636-.716-1.636-1.6 0-.07.004-.14.013-.207L2.736 4.15A5.273 5.273 0 001.189 6zM6 2c2.727 0 5.056 1.659 6 4a6.35 6.35 0 01-1.972 2.615l-.765-.766A5.273 5.273 0 0010.811 6C9.91 4.208 8.05 3.067 6 3.067c-.463 0-.916.058-1.35.168l-.857-.855A6.553 6.553 0 016 2zm0 2.4c.904 0 1.636.716 1.636 1.6 0 .07-.004.14-.013.208l-1.8-1.799C5.88 4.403 5.94 4.4 6 4.4z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nEyeOffSmallIcon.displayName = \"EyeOffSmallIcon\";\nexport default EyeOffSmallIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/EyeSmall.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component EyeSmallIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <EyeSmallIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var EyeSmallIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var EyeSmallIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 12,
     height: 12,
     viewBox: "0 0 12 12",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "EyeSmallIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M6 4.4c.904 0 1.636.716 1.636 1.6 0 .884-.732 1.6-1.636 1.6-.904 0-1.636-.716-1.636-1.6 0-.884.732-1.6 1.636-1.6M6 2c2.727 0 5.056 1.659 6 4-.944 2.341-3.273 4-6 4S.944 8.341 0 6c.944-2.341 3.273-4 6-4M1.19 6C2.09 7.792 3.95 8.933 6 8.933S9.91 7.792 10.81 6C9.91 4.208 8.05 3.067 6 3.067S2.09 4.208 1.19 6z",
     fillRule: "evenodd"
   }));

package/dist/cjs/components/Icons/collection/EyeSmall.js.map

@@ -1 +1 @@
-{"version":3,"file":"EyeSmall.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","EyeSmallIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/EyeSmall.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component EyeSmallIcon\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 *   <EyeSmallIcon 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 EyeSmallIcon = React.forwardRef(\n  (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n    <svg\n      width={12}\n      height={12}\n      viewBox=\"0 0 12 12\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"EyeSmallIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M6 4.4c.904 0 1.636.716 1.636 1.6 0 .884-.732 1.6-1.636 1.6-.904 0-1.636-.716-1.636-1.6 0-.884.732-1.6 1.636-1.6M6 2c2.727 0 5.056 1.659 6 4-.944 2.341-3.273 4-6 4S.944 8.341 0 6c.944-2.341 3.273-4 6-4M1.19 6C2.09 7.792 3.95 8.933 6 8.933S9.91 7.792 10.81 6C9.91 4.208 8.05 3.067 6 3.067S2.09 4.208 1.19 6z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nEyeSmallIcon.displayName = \"EyeSmallIcon\";\nexport default EyeSmallIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,YAAY,gBAAGC,cAAK,CAACC,UAAU,CACnC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,cAAc;IAC1BC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,CAAC,EAAC,oTAAoT;IACtTC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDd,YAAY,CAACe,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAC3Be,YAAY"}
+{"version":3,"file":"EyeSmall.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","EyeSmallIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/EyeSmall.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component EyeSmallIcon\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 * <EyeSmallIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <EyeSmallIcon 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 EyeSmallIcon = 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={12}\n      height={12}\n      viewBox=\"0 0 12 12\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      data-testid=\"EyeSmallIcon\"\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=\"M6 4.4c.904 0 1.636.716 1.636 1.6 0 .884-.732 1.6-1.636 1.6-.904 0-1.636-.716-1.636-1.6 0-.884.732-1.6 1.636-1.6M6 2c2.727 0 5.056 1.659 6 4-.944 2.341-3.273 4-6 4S.944 8.341 0 6c.944-2.341 3.273-4 6-4M1.19 6C2.09 7.792 3.95 8.933 6 8.933S9.91 7.792 10.81 6C9.91 4.208 8.05 3.067 6 3.067S2.09 4.208 1.19 6z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nEyeSmallIcon.displayName = \"EyeSmallIcon\";\nexport default EyeSmallIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/Filter.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component FilterIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <FilterIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var FilterIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var FilterIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "FilterIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M7 13h10a1 1 0 000-2H7a1 1 0 000 2zM3 7a1 1 0 001 1h16a1 1 0 000-2H4a1 1 0 00-1 1zm8 11h2a1 1 0 000-2h-2a1 1 0 000 2z",
     fillRule: "evenodd"
   }));

package/dist/cjs/components/Icons/collection/Filter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filter.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","FilterIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/Filter.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component FilterIcon\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 *   <FilterIcon 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 FilterIcon = 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=\"FilterIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M7 13h10a1 1 0 000-2H7a1 1 0 000 2zM3 7a1 1 0 001 1h16a1 1 0 000-2H4a1 1 0 00-1 1zm8 11h2a1 1 0 000-2h-2a1 1 0 000 2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFilterIcon.displayName = \"FilterIcon\";\nexport default FilterIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,UAAU,gBAAGC,cAAK,CAACC,UAAU,CACjC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,YAAY;IACxBC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,CAAC,EAAC,uHAAuH;IACzHC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDd,UAAU,CAACe,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GACvBe,UAAU"}
+{"version":3,"file":"Filter.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","FilterIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/Filter.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component FilterIcon\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 * <FilterIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <FilterIcon 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 FilterIcon = 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=\"FilterIcon\"\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=\"M7 13h10a1 1 0 000-2H7a1 1 0 000 2zM3 7a1 1 0 001 1h16a1 1 0 000-2H4a1 1 0 00-1 1zm8 11h2a1 1 0 000-2h-2a1 1 0 000 2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFilterIcon.displayName = \"FilterIcon\";\nexport default FilterIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/FolderMove.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component FolderMoveIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <FolderMoveIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var FolderMoveIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var FolderMoveIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "FolderMoveIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M10 4l2 2h8a2 2 0 011.995 1.851L22 8v10c0 1.06-.81 1.919-1.85 1.995L20 20H4a2 2 0 01-1.994-1.85L2 18V6a2 2 0 011.851-1.995L4 4h6zm10 4H4v10h16V8zm-10 2l4 3-4 3v-2H6v-2h4v-2z",
     fillRule: "evenodd"
   }));

package/dist/cjs/components/Icons/collection/FolderMove.js.map

@@ -1 +1 @@
-{"version":3,"file":"FolderMove.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","FolderMoveIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/FolderMove.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component FolderMoveIcon\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 *   <FolderMoveIcon 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 FolderMoveIcon = 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=\"FolderMoveIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M10 4l2 2h8a2 2 0 011.995 1.851L22 8v10c0 1.06-.81 1.919-1.85 1.995L20 20H4a2 2 0 01-1.994-1.85L2 18V6a2 2 0 011.851-1.995L4 4h6zm10 4H4v10h16V8zm-10 2l4 3-4 3v-2H6v-2h4v-2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFolderMoveIcon.displayName = \"FolderMoveIcon\";\nexport default FolderMoveIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,cAAc,gBAAGC,cAAK,CAACC,UAAU,CACrC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,gBAAgB;IAC5BC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,CAAC,EAAC,+KAA+K;IACjLC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDd,cAAc,CAACe,WAAW,GAAG,gBAAgB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GAC/Be,cAAc"}
+{"version":3,"file":"FolderMove.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","FolderMoveIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/FolderMove.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component FolderMoveIcon\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 * <FolderMoveIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <FolderMoveIcon 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 FolderMoveIcon = 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=\"FolderMoveIcon\"\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=\"M10 4l2 2h8a2 2 0 011.995 1.851L22 8v10c0 1.06-.81 1.919-1.85 1.995L20 20H4a2 2 0 01-1.994-1.85L2 18V6a2 2 0 011.851-1.995L4 4h6zm10 4H4v10h16V8zm-10 2l4 3-4 3v-2H6v-2h4v-2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFolderMoveIcon.displayName = \"FolderMoveIcon\";\nexport default FolderMoveIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/FolderOutline.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component FolderOutlineIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <FolderOutlineIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var FolderOutlineIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var FolderOutlineIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "FolderOutlineIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M20 18H4V8h16m0-2h-8l-2-2H4c-1.11 0-2 .89-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2z",
     fillRule: "evenodd"
   }));

package/dist/cjs/components/Icons/collection/FolderOutline.js.map

@@ -1 +1 @@
-{"version":3,"file":"FolderOutline.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","FolderOutlineIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/FolderOutline.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component FolderOutlineIcon\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 *   <FolderOutlineIcon 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 FolderOutlineIcon = 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=\"FolderOutlineIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path\n        d=\"M20 18H4V8h16m0-2h-8l-2-2H4c-1.11 0-2 .89-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFolderOutlineIcon.displayName = \"FolderOutlineIcon\";\nexport default FolderOutlineIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,iBAAiB,gBAAGC,cAAK,CAACC,UAAU,CACxC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,mBAAmB;IAC/BC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,CAAC,EAAC,6FAA6F;IAC/FC,QAAQ,EAAC;EAAS,CACnB,CACE,CAAC;AAAA,CAEV,CAAC;AACDd,iBAAiB,CAACe,WAAW,GAAG,mBAAmB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAhC,OAAA,GACrCe,iBAAiB"}
+{"version":3,"file":"FolderOutline.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","FolderOutlineIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","fillRule","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/FolderOutline.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component FolderOutlineIcon\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 * <FolderOutlineIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <FolderOutlineIcon 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 FolderOutlineIcon = 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=\"FolderOutlineIcon\"\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=\"M20 18H4V8h16m0-2h-8l-2-2H4c-1.11 0-2 .89-2 2v12a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2z\"\n        fillRule=\"evenodd\"\n      />\n    </svg>\n  )\n);\nFolderOutlineIcon.displayName = \"FolderOutlineIcon\";\nexport default FolderOutlineIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/Gift.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component GiftIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <GiftIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var GiftIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var GiftIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "GiftIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M22 12v8a2 2 0 01-2 2H4a2 2 0 01-2-2v-8a1 1 0 01-1-1V8a2 2 0 012-2h3.17A3 3 0 019 2c1 0 1.88.5 2.43 1.24v-.01L12 4l.57-.77v.01C13.12 2.5 14 2 15 2a3 3 0 012.83 4H21a2 2 0 012 2v3a1 1 0 01-1 1zM4 20h7v-8H4v8zm16 0v-8h-7v8h7zM9 4a1 1 0 100 2 1 1 0 000-2zm6 0a1 1 0 100 2 1 1 0 000-2zM3 8v2h8V8H3zm10 0v2h8V8h-8z"

package/dist/cjs/components/Icons/collection/Gift.js.map

@@ -1 +1 @@
-{"version":3,"file":"Gift.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","GiftIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","fillRule","clipRule","d","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/Gift.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component GiftIcon\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 *   <GiftIcon 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 GiftIcon = 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=\"GiftIcon\"\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=\"M22 12v8a2 2 0 01-2 2H4a2 2 0 01-2-2v-8a1 1 0 01-1-1V8a2 2 0 012-2h3.17A3 3 0 019 2c1 0 1.88.5 2.43 1.24v-.01L12 4l.57-.77v.01C13.12 2.5 14 2 15 2a3 3 0 012.83 4H21a2 2 0 012 2v3a1 1 0 01-1 1zM4 20h7v-8H4v8zm16 0v-8h-7v8h7zM9 4a1 1 0 100 2 1 1 0 000-2zm6 0a1 1 0 100 2 1 1 0 000-2zM3 8v2h8V8H3zm10 0v2h8V8h-8z\"\n      />\n    </svg>\n  )\n);\nGiftIcon.displayName = \"GiftIcon\";\nexport default GiftIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,QAAQ,gBAAGC,cAAK,CAACC,UAAU,CAC/B,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,UAAU;IACtBC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IACEQ,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC;EAAuT,CAC1T,CACE,CAAC;AAAA,CAEV,CAAC;AACDf,QAAQ,CAACgB,WAAW,GAAG,UAAU;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAjC,OAAA,GACnBe,QAAQ"}
+{"version":3,"file":"Gift.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","GiftIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","fillRule","clipRule","d","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/Gift.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component GiftIcon\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 * <GiftIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <GiftIcon 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 GiftIcon = 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=\"GiftIcon\"\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=\"M22 12v8a2 2 0 01-2 2H4a2 2 0 01-2-2v-8a1 1 0 01-1-1V8a2 2 0 012-2h3.17A3 3 0 019 2c1 0 1.88.5 2.43 1.24v-.01L12 4l.57-.77v.01C13.12 2.5 14 2 15 2a3 3 0 012.83 4H21a2 2 0 012 2v3a1 1 0 01-1 1zM4 20h7v-8H4v8zm16 0v-8h-7v8h7zM9 4a1 1 0 100 2 1 1 0 000-2zm6 0a1 1 0 100 2 1 1 0 000-2zM3 8v2h8V8H3zm10 0v2h8V8h-8z\"\n      />\n    </svg>\n  )\n);\nGiftIcon.displayName = \"GiftIcon\";\nexport default GiftIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/GroupBy.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component GroupByIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <GroupByIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var GroupByIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var GroupByIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "GroupByIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     d: "M20.598 9a1 1 0 01-1.994-.123V5.392h-3.486a.997.997 0 110-1.995l4.486-.005.118.007a1 1 0 01.883.993v4.49l-.007.12V9zM5.396 15.122v3.487h3.486a.998.998 0 010 1.995l-4.486.005-.118-.007a1 1 0 01-.883-.993v-4.49l.007-.12a.997.997 0 01.993-.877l.12.008a1 1 0 01.881.992zm8.726 4.478a.998.998 0 00.878.998l.12.008h4.489a1 1 0 00.993-.884l.007-.118-.005-4.486a.998.998 0 00-1.995 0v3.486h-3.487a1 1 0 00-1 .996zM5.391 5.396h3.487a1 1 0 00.992-.88l.008-.12A.997.997 0 009 3.401l-.12-.008H4.392a1 1 0 00-.993.884l-.007.118.005 4.486a.998.998 0 001.995 0V5.396h-.001zM8 9a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1zm1 2a1 1 0 100 2h6a1 1 0 000-2H9zm-1 4a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1z"
   }));
 });

package/dist/cjs/components/Icons/collection/GroupBy.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupBy.js","names":["_react","_interopRequireDefault","require","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","GroupByIcon","React","forwardRef","props","svgRef","createElement","width","height","viewBox","xmlns","fill","focusable","ref","d","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/GroupBy.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component GroupByIcon\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 *   <GroupByIcon 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 GroupByIcon = 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=\"GroupByIcon\"\n      fill=\"var(--color-theme-600)\"\n      focusable={false}\n      ref={svgRef}\n      {...props}\n    >\n      <path d=\"M20.598 9a1 1 0 01-1.994-.123V5.392h-3.486a.997.997 0 110-1.995l4.486-.005.118.007a1 1 0 01.883.993v4.49l-.007.12V9zM5.396 15.122v3.487h3.486a.998.998 0 010 1.995l-4.486.005-.118-.007a1 1 0 01-.883-.993v-4.49l.007-.12a.997.997 0 01.993-.877l.12.008a1 1 0 01.881.992zm8.726 4.478a.998.998 0 00.878.998l.12.008h4.489a1 1 0 00.993-.884l.007-.118-.005-4.486a.998.998 0 00-1.995 0v3.486h-3.487a1 1 0 00-1 .996zM5.391 5.396h3.487a1 1 0 00.992-.88l.008-.12A.997.997 0 009 3.401l-.12-.008H4.392a1 1 0 00-.993.884l-.007.118.005 4.486a.998.998 0 001.995 0V5.396h-.001zM8 9a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1zm1 2a1 1 0 100 2h6a1 1 0 000-2H9zm-1 4a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1z\" />\n    </svg>\n  )\n);\nGroupByIcon.displayName = \"GroupByIcon\";\nexport default GroupByIcon;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,SAAA,IAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAI,GAAA,IAAAD,MAAA,QAAAP,MAAA,CAAAS,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAJ,MAAA,EAAAC,GAAA,KAAAL,MAAA,CAAAK,GAAA,IAAAD,MAAA,CAAAC,GAAA,gBAAAL,MAAA,YAAAJ,QAAA,CAAAa,KAAA,OAAAP,SAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMQ,WAAW,gBAAGC,cAAK,CAACC,UAAU,CAClC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtExB,MAAA,CAAAK,OAAA,CAAAoB,aAAA,QAAAnB,QAAA;IACEoB,KAAK,EAAE,EAAG;IACVC,MAAM,EAAE,EAAG;IACXC,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClC,eAAY,aAAa;IACzBC,IAAI,EAAC,wBAAwB;IAC7BC,SAAS,EAAE,KAAM;IACjBC,GAAG,EAAER;EAAO,GACRD,KAAK,gBAETvB,MAAA,CAAAK,OAAA,CAAAoB,aAAA;IAAMQ,CAAC,EAAC;EAA8qB,CAAE,CACrrB,CAAC;AAAA,CAEV,CAAC;AACDb,WAAW,CAACc,WAAW,GAAG,aAAa;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GACzBe,WAAW"}
+{"version":3,"file":"GroupBy.js","names":["_react","_interopRequireDefault","require","_GradientDefs","_excluded","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","GroupByIcon","React","forwardRef","_ref","svgRef","gradient","props","createElement","width","height","viewBox","xmlns","fill","focusable","ref","GradientDefs","d","displayName","_default","exports"],"sources":["../../../../../src/components/Icons/collection/GroupBy.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { GradientDefs } from \"../../GradientDefs\";\n\n/**\n * @component GroupByIcon\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 * <GroupByIcon gradient=\"linear-gradient(135deg, #4da2ed, #f72222)\" />\n * )\n *\n * @example\n * return (\n *   <GroupByIcon 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 GroupByIcon = 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=\"GroupByIcon\"\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 d=\"M20.598 9a1 1 0 01-1.994-.123V5.392h-3.486a.997.997 0 110-1.995l4.486-.005.118.007a1 1 0 01.883.993v4.49l-.007.12V9zM5.396 15.122v3.487h3.486a.998.998 0 010 1.995l-4.486.005-.118-.007a1 1 0 01-.883-.993v-4.49l.007-.12a.997.997 0 01.993-.877l.12.008a1 1 0 01.881.992zm8.726 4.478a.998.998 0 00.878.998l.12.008h4.489a1 1 0 00.993-.884l.007-.118-.005-4.486a.998.998 0 00-1.995 0v3.486h-3.487a1 1 0 00-1 .996zM5.391 5.396h3.487a1 1 0 00.992-.88l.008-.12A.997.997 0 009 3.401l-.12-.008H4.392a1 1 0 00-.993.884l-.007.118.005 4.486a.998.998 0 001.995 0V5.396h-.001zM8 9a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1zm1 2a1 1 0 100 2h6a1 1 0 000-2H9zm-1 4a1 1 0 011-1h6a1 1 0 110 2H9a1 1 0 01-1-1z\" />\n    </svg>\n  )\n);\nGroupByIcon.displayName = \"GroupByIcon\";\nexport default GroupByIcon;\n"],"mappings":"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"}

package/dist/cjs/components/Icons/collection/Hashtag.js

@@ -5,8 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _GradientDefs = require("../../GradientDefs");
+var _excluded = ["gradient"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 /**
  * @component HashtagIcon
  * @description
@@ -15,6 +19,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * 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 (
+ * <HashtagIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" />
+ * )
  *
  * @example
  * return (
@@ -26,17 +37,21 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
  * @see
  * https://design.activecollab.com/docs/foundations/icons
  */
-var HashtagIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
+var HashtagIcon = /*#__PURE__*/_react.default.forwardRef(function (_ref, svgRef) {
+  var gradient = _ref.gradient,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("svg", _extends({
     width: 24,
     height: 24,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     "data-testid": "HashtagIcon",
-    fill: "var(--color-theme-600)",
+    fill: gradient ? "url(#icon-gradient)" : props !== null && props !== void 0 && props.fill ? props.fill : "var(--color-theme-600)",
     focusable: false,
     ref: svgRef
-  }, props), /*#__PURE__*/_react.default.createElement("path", {
+  }, props), /*#__PURE__*/_react.default.createElement(_GradientDefs.GradientDefs, {
+    gradient: gradient
+  }), /*#__PURE__*/_react.default.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M5.33 21l.719-4H2l.354-2h4.049l1.073-6H3.427l.354-2H7.83l.719-4h2.024l-.719 4h6.073l.719-4h2.024l-.719 4H22l-.354 2h-4.049l-1.073 6h4.049l-.354 2H16.17l-.719 4h-2.024l.719-4H8.073l-.719 4H5.33zM9.5 9l-1.073 6H14.5l1.073-6H9.5z"