@telus-uds/palette-koodo 3.2.0 → 3.3.0

package/build/rn/icons/ChevronLeft.native.js

@@ -7,19 +7,35 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    d: "M16.944 20.372a2.143 2.143 0 0 1-3.03 0l-6.858-6.857a2.143 2.143 0 0 1 0-3.03l6.857-6.857a2.143 2.143 0 1 1 3.03 3.03l-5.038 5.039a.429.429 0 0 0 0 .606l5.039 5.039a2.143 2.143 0 0 1 0 3.03Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      d: "M16.944 20.372a2.143 2.143 0 0 1-3.03 0l-6.858-6.857a2.143 2.143 0 0 1 0-3.03l6.857-6.857a2.143 2.143 0 1 1 3.03 3.03l-5.038 5.039a.429.429 0 0 0 0 .606l5.039 5.039a2.143 2.143 0 0 1 0 3.03Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/ChevronRight.js

@@ -6,21 +6,37 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  role: title ? 'img' : undefined,
-  "aria-hidden": !title,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M7.056 3.628a2.143 2.143 0 0 1 3.03 0l6.858 6.857a2.143 2.143 0 0 1 0 3.03l-6.857 6.857a2.143 2.143 0 0 1-3.03-3.03l5.038-5.039a.428.428 0 0 0 0-.606L7.056 6.658a2.143 2.143 0 0 1 0-3.03Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconWebUtils = require('./utils/icon-web-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconWebUtils.renderWebGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)("svg", {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    role: title ? 'img' : undefined,
+    "aria-hidden": !title,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)("path", {
+      d: "M7.056 3.628a2.143 2.143 0 0 1 3.03 0l6.858 6.857a2.143 2.143 0 0 1 0 3.03l-6.857 6.857a2.143 2.143 0 0 1-3.03-3.03l5.038-5.039a.428.428 0 0 0 0-.606L7.056 6.658a2.143 2.143 0 0 1 0-3.03Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/ChevronRight.native.js

@@ -7,19 +7,35 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    d: "M7.056 3.628a2.143 2.143 0 0 1 3.03 0l6.858 6.857a2.143 2.143 0 0 1 0 3.03l-6.857 6.857a2.143 2.143 0 0 1-3.03-3.03l5.038-5.039a.428.428 0 0 0 0-.606L7.056 6.658a2.143 2.143 0 0 1 0-3.03Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      d: "M7.056 3.628a2.143 2.143 0 0 1 3.03 0l6.858 6.857a2.143 2.143 0 0 1 0 3.03l-6.857 6.857a2.143 2.143 0 0 1-3.03-3.03l5.038-5.039a.428.428 0 0 0 0-.606L7.056 6.658a2.143 2.143 0 0 1 0-3.03Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/ChevronUp.js

@@ -6,21 +6,37 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  role: title ? 'img' : undefined,
-  "aria-hidden": !title,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M3.628 16.944a2.143 2.143 0 0 1 0-3.03l6.857-6.858a2.143 2.143 0 0 1 3.03 0l6.857 6.857a2.143 2.143 0 0 1-3.03 3.03l-5.039-5.038a.429.429 0 0 0-.606 0l-5.039 5.039a2.143 2.143 0 0 1-3.03 0Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconWebUtils = require('./utils/icon-web-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconWebUtils.renderWebGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)("svg", {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    role: title ? 'img' : undefined,
+    "aria-hidden": !title,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)("path", {
+      d: "M3.628 16.944a2.143 2.143 0 0 1 0-3.03l6.857-6.858a2.143 2.143 0 0 1 3.03 0l6.857 6.857a2.143 2.143 0 0 1-3.03 3.03l-5.039-5.038a.429.429 0 0 0-.606 0l-5.039 5.039a2.143 2.143 0 0 1-3.03 0Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/ChevronUp.native.js

@@ -7,19 +7,35 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    d: "M3.628 16.944a2.143 2.143 0 0 1 0-3.03l6.857-6.858a2.143 2.143 0 0 1 3.03 0l6.857 6.857a2.143 2.143 0 0 1-3.03 3.03l-5.039-5.038a.429.429 0 0 0-.606 0l-5.039 5.039a2.143 2.143 0 0 1-3.03 0Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      d: "M3.628 16.944a2.143 2.143 0 0 1 0-3.03l6.857-6.858a2.143 2.143 0 0 1 3.03 0l6.857 6.857a2.143 2.143 0 0 1-3.03 3.03l-5.039-5.038a.429.429 0 0 0-.606 0l-5.039 5.039a2.143 2.143 0 0 1-3.03 0Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/CircledLine.js

@@ -6,32 +6,48 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  ...props,
-  viewBox: "0 0 14 14",
-  height: size,
-  width: size,
-  fill: color,
-  role: title ? 'img' : undefined,
-  "aria-hidden": !title,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
-    fill: "none",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M7 0a7 7 0 1 0 7 7 7 7 0 0 0-7-7",
-      fill: "#000",
-      mask: "url(#prefix__mask-2)"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-      fill: "#fff",
-      x: 3,
-      y: 6,
-      width: 8,
-      height: 2,
-      rx: 1
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconWebUtils = require('./utils/icon-web-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconWebUtils.renderWebGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)("svg", {
+    ...props,
+    viewBox: "0 0 14 14",
+    height: size,
+    width: size,
+    fill: fillValue,
+    role: title ? 'img' : undefined,
+    "aria-hidden": !title,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsxs)("g", {
+      fill: "none",
+      children: [(0, _jsxRuntime.jsx)("path", {
+        d: "M7 0a7 7 0 1 0 7 7 7 7 0 0 0-7-7",
+        fill: "#000",
+        mask: "url(#prefix__mask-2)"
+      }), (0, _jsxRuntime.jsx)("rect", {
+        fill: "#fff",
+        x: 3,
+        y: 6,
+        width: 8,
+        height: 2,
+        rx: 1
+      })]
     })]
-  })]
-});
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/CircledLine.native.js

@@ -7,30 +7,46 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  viewBox: "0 0 14 14",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.G, {
-    fill: "none",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-      d: "M7 0a7 7 0 1 0 7 7 7 7 0 0 0-7-7",
-      fill: "#000",
-      mask: "url(#prefix__mask-2)"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Rect, {
-      fill: "#fff",
-      x: 3,
-      y: 6,
-      width: 8,
-      height: 2,
-      rx: 1
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    viewBox: "0 0 14 14",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsxs)(_reactNativeSvg.G, {
+      fill: "none",
+      children: [(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+        d: "M7 0a7 7 0 1 0 7 7 7 7 0 0 0-7-7",
+        fill: "#000",
+        mask: "url(#prefix__mask-2)"
+      }), (0, _jsxRuntime.jsx)(_reactNativeSvg.Rect, {
+        fill: "#fff",
+        x: 3,
+        y: 6,
+        width: 8,
+        height: 2,
+        rx: 1
+      })]
     })]
-  })]
-});
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/Clipboard.js

@@ -6,21 +6,37 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  role: title ? 'img' : undefined,
-  "aria-hidden": !title,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M5.072 22.218a2.19 2.19 0 0 1-1.607-.668 2.19 2.19 0 0 1-.668-1.607V6.087c0-.626.222-1.162.668-1.607a2.19 2.19 0 0 1 1.607-.668H9.02c.207-.596.59-1.083 1.148-1.462A3.195 3.195 0 0 1 12 1.782c.687 0 1.306.19 1.86.568.552.38.934.866 1.145 1.462h3.923a2.19 2.19 0 0 1 1.607.668c.445.445.668.981.668 1.607v13.856a2.19 2.19 0 0 1-.668 1.607 2.19 2.19 0 0 1-1.607.668H5.072Zm0-2.275h13.856V6.087H16.97v1.958c0 .32-.11.588-.33.808-.219.22-.488.33-.807.33H8.167c-.319 0-.588-.11-.808-.33-.22-.22-.33-.489-.33-.808V6.087H5.073v13.856ZM12 5.997c.283 0 .52-.096.713-.287A.967.967 0 0 0 13 4.997a.967.967 0 0 0-.287-.712.968.968 0 0 0-.713-.288.968.968 0 0 0-.713.288.967.967 0 0 0-.287.712c0 .283.096.52.287.713.192.191.43.287.713.287Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconWebUtils = require('./utils/icon-web-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconWebUtils.renderWebGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)("svg", {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    role: title ? 'img' : undefined,
+    "aria-hidden": !title,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)("path", {
+      d: "M5.072 22.218a2.19 2.19 0 0 1-1.607-.668 2.19 2.19 0 0 1-.668-1.607V6.087c0-.626.222-1.162.668-1.607a2.19 2.19 0 0 1 1.607-.668H9.02c.207-.596.59-1.083 1.148-1.462A3.195 3.195 0 0 1 12 1.782c.687 0 1.306.19 1.86.568.552.38.934.866 1.145 1.462h3.923a2.19 2.19 0 0 1 1.607.668c.445.445.668.981.668 1.607v13.856a2.19 2.19 0 0 1-.668 1.607 2.19 2.19 0 0 1-1.607.668H5.072Zm0-2.275h13.856V6.087H16.97v1.958c0 .32-.11.588-.33.808-.219.22-.488.33-.807.33H8.167c-.319 0-.588-.11-.808-.33-.22-.22-.33-.489-.33-.808V6.087H5.073v13.856ZM12 5.997c.283 0 .52-.096.713-.287A.967.967 0 0 0 13 4.997a.967.967 0 0 0-.287-.712.968.968 0 0 0-.713-.288.968.968 0 0 0-.713.288.967.967 0 0 0-.287.712c0 .283.096.52.287.713.192.191.43.287.713.287Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/Clipboard.native.js

@@ -7,19 +7,35 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    d: "M5.072 22.218a2.19 2.19 0 0 1-1.607-.668 2.19 2.19 0 0 1-.668-1.607V6.087c0-.626.222-1.162.668-1.607a2.19 2.19 0 0 1 1.607-.668H9.02c.207-.596.59-1.083 1.148-1.462A3.195 3.195 0 0 1 12 1.782c.687 0 1.306.19 1.86.568.552.38.934.866 1.145 1.462h3.923a2.19 2.19 0 0 1 1.607.668c.445.445.668.981.668 1.607v13.856a2.19 2.19 0 0 1-.668 1.607 2.19 2.19 0 0 1-1.607.668H5.072Zm0-2.275h13.856V6.087H16.97v1.958c0 .32-.11.588-.33.808-.219.22-.488.33-.807.33H8.167c-.319 0-.588-.11-.808-.33-.22-.22-.33-.489-.33-.808V6.087H5.073v13.856ZM12 5.997c.283 0 .52-.096.713-.287A.967.967 0 0 0 13 4.997a.967.967 0 0 0-.287-.712.968.968 0 0 0-.713-.288.968.968 0 0 0-.713.288.967.967 0 0 0-.287.712c0 .283.096.52.287.713.192.191.43.287.713.287Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      d: "M5.072 22.218a2.19 2.19 0 0 1-1.607-.668 2.19 2.19 0 0 1-.668-1.607V6.087c0-.626.222-1.162.668-1.607a2.19 2.19 0 0 1 1.607-.668H9.02c.207-.596.59-1.083 1.148-1.462A3.195 3.195 0 0 1 12 1.782c.687 0 1.306.19 1.86.568.552.38.934.866 1.145 1.462h3.923a2.19 2.19 0 0 1 1.607.668c.445.445.668.981.668 1.607v13.856a2.19 2.19 0 0 1-.668 1.607 2.19 2.19 0 0 1-1.607.668H5.072Zm0-2.275h13.856V6.087H16.97v1.958c0 .32-.11.588-.33.808-.219.22-.488.33-.807.33H8.167c-.319 0-.588-.11-.808-.33-.22-.22-.33-.489-.33-.808V6.087H5.073v13.856ZM12 5.997c.283 0 .52-.096.713-.287A.967.967 0 0 0 13 4.997a.967.967 0 0 0-.287-.712.968.968 0 0 0-.713-.288.968.968 0 0 0-.713.288.967.967 0 0 0-.287.712c0 .283.096.52.287.713.192.191.43.287.713.287Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/Close.js

@@ -6,21 +6,37 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  role: title ? 'img' : undefined,
-  "aria-hidden": !title,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M20.488 20.482a2.118 2.118 0 0 0 0-2.994l-5.493-5.489 5.488-5.492a2.118 2.118 0 1 0-2.995-2.994l-5.489 5.492-5.492-5.488a2.118 2.118 0 0 0-2.994 2.995l5.492 5.489-5.488 5.492a2.118 2.118 0 0 0 2.995 2.994l5.489-5.492 5.492 5.488a2.118 2.118 0 0 0 2.995 0Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconWebUtils = require('./utils/icon-web-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconWebUtils.renderWebGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)("svg", {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    role: title ? 'img' : undefined,
+    "aria-hidden": !title,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)("path", {
+      d: "M20.488 20.482a2.118 2.118 0 0 0 0-2.994l-5.493-5.489 5.488-5.492a2.118 2.118 0 1 0-2.995-2.994l-5.489 5.492-5.492-5.488a2.118 2.118 0 0 0-2.994 2.995l5.492 5.489-5.488 5.492a2.118 2.118 0 0 0 2.995 2.994l5.489-5.492 5.492 5.488a2.118 2.118 0 0 0 2.995 0Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/Close.native.js

@@ -7,19 +7,35 @@ module.exports = ({
   titleId,
   size,
   color,
+  gradient,
   ...props
-}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
-  ...props,
-  xmlns: "http://www.w3.org/2000/svg",
-  viewBox: "0 0 24 24",
-  height: size,
-  width: size,
-  fill: color,
-  "aria-labelledby": titleId,
-  children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-    id: titleId,
-    children: title
-  }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    d: "M20.488 20.482a2.118 2.118 0 0 0 0-2.994l-5.493-5.489 5.488-5.492a2.118 2.118 0 1 0-2.995-2.994l-5.489 5.492-5.492-5.488a2.118 2.118 0 0 0-2.994 2.995l5.492 5.489-5.488 5.492a2.118 2.118 0 0 0 2.995 2.994l5.489-5.492 5.492 5.488a2.118 2.118 0 0 0 2.995 0Z"
-  })]
-});
+}) => {
+  const iconSharedUtils = require('./utils/icon-shared-utils');
+  const hasGradient = iconSharedUtils.hasValidGradient(gradient);
+  let fillValue = color;
+  let gradientDefs;
+  let gradientUtils;
+  if (hasGradient) {
+    gradientUtils = iconSharedUtils.getGradientUtils();
+    const iconNativeUtils = require('./utils/icon-native-utils');
+    const gradientId = gradientUtils.generateGradientId(gradient);
+    fillValue = `url(#${gradientId})`;
+    gradientDefs = iconNativeUtils.renderNativeGradientDefs(gradient, gradientId);
+  }
+  const svgContent = (0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 24 24",
+    height: size,
+    width: size,
+    fill: fillValue,
+    "aria-labelledby": titleId,
+    children: [title ? (0, _jsxRuntime.jsx)("title", {
+      id: titleId,
+      children: title
+    }) : null, (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      d: "M20.488 20.482a2.118 2.118 0 0 0 0-2.994l-5.493-5.489 5.488-5.492a2.118 2.118 0 1 0-2.995-2.994l-5.489 5.492-5.492-5.488a2.118 2.118 0 0 0-2.994 2.995l5.492 5.489-5.488 5.492a2.118 2.118 0 0 0 2.995 2.994l5.489-5.492 5.492 5.488a2.118 2.118 0 0 0 2.995 0Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};