@telus-uds/palette-koodo 3.2.0 → 3.3.0

package/build/rn/icons/Visa.js

@@ -6,33 +6,49 @@ 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", {
-    fill: "#00579F",
-    d: "M15.704 8c.752 0 1.36.151 1.744.288l-.265 1.464-.175-.072a3.615 3.615 0 0 0-1.449-.26c-.767 0-1.111.296-1.12.584 0 .317.417.526 1.097.836 1.12.483 1.64 1.075 1.632 1.846C17.152 14.092 15.824 15 13.784 15c-.872-.007-1.712-.173-2.168-.36l.272-1.522.256.108c.632.253 1.048.361 1.824.361.56 0 1.16-.21 1.168-.663 0-.296-.256-.512-1.008-.844-.736-.324-1.72-.865-1.704-1.838.008-1.32 1.36-2.242 3.28-2.242Zm-7.248 6.899H10.4l1.216-6.776H9.672l-1.216 6.776Z"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    fill: "#00579F",
-    fillRule: "evenodd",
-    d: "M22.432 8.123h-1.504c-.464 0-.816.122-1.016.562L17.024 14.9h2.04l.408-1.016h2.496c.056.237.232 1.016.232 1.016H24l-1.568-6.776Zm-2.4 4.376a2035.23 2035.23 0 0 0 .836-2.049c.056-.14.139-.346.196-.496l.136.584s.368 1.622.448 1.96h-1.616Z",
-    clipRule: "evenodd"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    fill: "#00579F",
-    d: "m4.928 12.743 1.904-4.62h2.056l-3.056 6.769H3.776L2.032 8.966c1.232.584 2.336 1.76 2.688 2.84l.208.938Z"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    fill: "#FAA61A",
-    d: "M3.16 8.123H.032L0 8.26c2.44.562 4.056 1.918 4.72 3.547l-.68-3.115c-.112-.432-.456-.555-.88-.57Z"
-  })]
-});
+}) => {
+  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", {
+      fill: "#00579F",
+      d: "M15.704 8c.752 0 1.36.151 1.744.288l-.265 1.464-.175-.072a3.615 3.615 0 0 0-1.449-.26c-.767 0-1.111.296-1.12.584 0 .317.417.526 1.097.836 1.12.483 1.64 1.075 1.632 1.846C17.152 14.092 15.824 15 13.784 15c-.872-.007-1.712-.173-2.168-.36l.272-1.522.256.108c.632.253 1.048.361 1.824.361.56 0 1.16-.21 1.168-.663 0-.296-.256-.512-1.008-.844-.736-.324-1.72-.865-1.704-1.838.008-1.32 1.36-2.242 3.28-2.242Zm-7.248 6.899H10.4l1.216-6.776H9.672l-1.216 6.776Z"
+    }), (0, _jsxRuntime.jsx)("path", {
+      fill: "#00579F",
+      fillRule: "evenodd",
+      d: "M22.432 8.123h-1.504c-.464 0-.816.122-1.016.562L17.024 14.9h2.04l.408-1.016h2.496c.056.237.232 1.016.232 1.016H24l-1.568-6.776Zm-2.4 4.376a2035.23 2035.23 0 0 0 .836-2.049c.056-.14.139-.346.196-.496l.136.584s.368 1.622.448 1.96h-1.616Z",
+      clipRule: "evenodd"
+    }), (0, _jsxRuntime.jsx)("path", {
+      fill: "#00579F",
+      d: "m4.928 12.743 1.904-4.62h2.056l-3.056 6.769H3.776L2.032 8.966c1.232.584 2.336 1.76 2.688 2.84l.208.938Z"
+    }), (0, _jsxRuntime.jsx)("path", {
+      fill: "#FAA61A",
+      d: "M3.16 8.123H.032L0 8.26c2.44.562 4.056 1.918 4.72 3.547l-.68-3.115c-.112-.432-.456-.555-.88-.57Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

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

@@ -7,31 +7,47 @@ 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, {
-    fill: "#00579F",
-    d: "M15.704 8c.752 0 1.36.151 1.744.288l-.265 1.464-.175-.072a3.615 3.615 0 0 0-1.449-.26c-.767 0-1.111.296-1.12.584 0 .317.417.526 1.097.836 1.12.483 1.64 1.075 1.632 1.846C17.152 14.092 15.824 15 13.784 15c-.872-.007-1.712-.173-2.168-.36l.272-1.522.256.108c.632.253 1.048.361 1.824.361.56 0 1.16-.21 1.168-.663 0-.296-.256-.512-1.008-.844-.736-.324-1.72-.865-1.704-1.838.008-1.32 1.36-2.242 3.28-2.242Zm-7.248 6.899H10.4l1.216-6.776H9.672l-1.216 6.776Z"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    fill: "#00579F",
-    fillRule: "evenodd",
-    d: "M22.432 8.123h-1.504c-.464 0-.816.122-1.016.562L17.024 14.9h2.04l.408-1.016h2.496c.056.237.232 1.016.232 1.016H24l-1.568-6.776Zm-2.4 4.376a2035.23 2035.23 0 0 0 .836-2.049c.056-.14.139-.346.196-.496l.136.584s.368 1.622.448 1.96h-1.616Z",
-    clipRule: "evenodd"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    fill: "#00579F",
-    d: "m4.928 12.743 1.904-4.62h2.056l-3.056 6.769H3.776L2.032 8.966c1.232.584 2.336 1.76 2.688 2.84l.208.938Z"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
-    fill: "#FAA61A",
-    d: "M3.16 8.123H.032L0 8.26c2.44.562 4.056 1.918 4.72 3.547l-.68-3.115c-.112-.432-.456-.555-.88-.57Z"
-  })]
-});
+}) => {
+  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, {
+      fill: "#00579F",
+      d: "M15.704 8c.752 0 1.36.151 1.744.288l-.265 1.464-.175-.072a3.615 3.615 0 0 0-1.449-.26c-.767 0-1.111.296-1.12.584 0 .317.417.526 1.097.836 1.12.483 1.64 1.075 1.632 1.846C17.152 14.092 15.824 15 13.784 15c-.872-.007-1.712-.173-2.168-.36l.272-1.522.256.108c.632.253 1.048.361 1.824.361.56 0 1.16-.21 1.168-.663 0-.296-.256-.512-1.008-.844-.736-.324-1.72-.865-1.704-1.838.008-1.32 1.36-2.242 3.28-2.242Zm-7.248 6.899H10.4l1.216-6.776H9.672l-1.216 6.776Z"
+    }), (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      fill: "#00579F",
+      fillRule: "evenodd",
+      d: "M22.432 8.123h-1.504c-.464 0-.816.122-1.016.562L17.024 14.9h2.04l.408-1.016h2.496c.056.237.232 1.016.232 1.016H24l-1.568-6.776Zm-2.4 4.376a2035.23 2035.23 0 0 0 .836-2.049c.056-.14.139-.346.196-.496l.136.584s.368 1.622.448 1.96h-1.616Z",
+      clipRule: "evenodd"
+    }), (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      fill: "#00579F",
+      d: "m4.928 12.743 1.904-4.62h2.056l-3.056 6.769H3.776L2.032 8.966c1.232.584 2.336 1.76 2.688 2.84l.208.938Z"
+    }), (0, _jsxRuntime.jsx)(_reactNativeSvg.Path, {
+      fill: "#FAA61A",
+      d: "M3.16 8.123H.032L0 8.26c2.44.562 4.056 1.918 4.72 3.547l-.68-3.115c-.112-.432-.456-.555-.88-.57Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/rn/icons/canada-filled.icon.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+  <path d="M11.763 1.124c.1-.165.34-.165.44 0l1.907 3.183a.256.256 0 0 0 .3.11l1.507-.5a.256.256 0 0 1 .331.299L15.03 9.67c-.111.5.5.836.862.474l2.803-2.806a.257.257 0 0 1 .425.101l.515 1.573c.042.127.175.2.305.168l2.054-.512a.256.256 0 0 1 .291.362l-.997 2a.255.255 0 0 0 .128.349l1.429.61c.18.078.21.322.053.44l-5.493 4.12a.257.257 0 0 0-.088.287l.537 1.604a.26.26 0 0 1-.294.336c-.862-.164-2.7-.515-4.403-.628V22a.998.998 0 0 1-.96.998c-.007 0-.014.003-.022.003L12.168 23h-.01a1 1 0 0 1-1-1v-3.862c-1.737.094-3.766.467-4.664.64a.259.259 0 0 1-.294-.337l.52-1.554a.256.256 0 0 0-.09-.285L1.103 12.46a.256.256 0 0 1 .072-.448l1.44-.477a.256.256 0 0 0 .149-.357L1.692 9.025a.256.256 0 0 1 .29-.362l2.047.51a.256.256 0 0 0 .305-.168l.517-1.563a.256.256 0 0 1 .424-.1l2.808 2.817c.362.363.973.027.86-.474l-1.23-5.461a.256.256 0 0 1 .332-.3l1.491.506a.256.256 0 0 0 .302-.11l1.925-3.196Z"/>
+</svg>

package/build/rn/icons/index.js

@@ -11,6 +11,7 @@ module.exports = {
   Bullet: require('./Bullet'),
   BulletCircle: require('./BulletCircle'),
   BulletFill: require('./BulletFill'),
+  CanadaFilled: require('./CanadaFilled'),
   Cart: require('./Cart'),
   CartFilled: require('./CartFilled'),
   Caution: require('./Caution'),

package/build/rn/icons/utils/icon-native-utils.js

@@ -0,0 +1,63 @@
+"use strict";
+
+const iconNativeUtils = {
+  renderNativeGradientDefs: (gradient, gradientId) => {
+    if (!gradient || !gradientId) return null;
+    const React = require('react');
+    const {
+      Defs,
+      LinearGradient,
+      RadialGradient,
+      Stop
+    } = require('react-native-svg');
+    if (gradient.type === 'linear') {
+      const angle = gradient.angle || 0;
+      const angleInRadians = (angle - 90) * Math.PI / 180;
+      const x1 = 0.5 - 0.5 * Math.cos(angleInRadians);
+      const y1 = 0.5 - 0.5 * Math.sin(angleInRadians);
+      const x2 = 0.5 + 0.5 * Math.cos(angleInRadians);
+      const y2 = 0.5 + 0.5 * Math.sin(angleInRadians);
+      return React.createElement(Defs, null, React.createElement(LinearGradient, {
+        id: gradientId,
+        x1: x1,
+        y1: y1,
+        x2: x2,
+        y2: y2
+      }, gradient.stops.map((stopItem, index) => {
+        const offset = stopItem.hint !== undefined ? stopItem.hint : stopItem.stop !== undefined ? stopItem.stop : index / (gradient.stops.length - 1);
+        return React.createElement(Stop, {
+          key: index,
+          offset: offset,
+          stopColor: stopItem.color
+        });
+      })));
+    } else if (gradient.type === 'radial') {
+      let cx = 0.5,
+        cy = 0.5,
+        r = 0.5;
+      if (gradient.specification) {
+        const match = gradient.specification.match(/([0-9.]+)%\s+([0-9.]+)%\s+at\s+([0-9.]+)%\s+([0-9.]+)%/);
+        if (match) {
+          r = parseFloat(match[1]) / 100;
+          cx = parseFloat(match[3]) / 100;
+          cy = parseFloat(match[4]) / 100;
+        }
+      }
+      return React.createElement(Defs, null, React.createElement(RadialGradient, {
+        id: gradientId,
+        cx: cx,
+        cy: cy,
+        r: r
+      }, gradient.stops.map((stopItem, index) => {
+        const offset = stopItem.hint !== undefined ? stopItem.hint : stopItem.stop !== undefined ? stopItem.stop : index / (gradient.stops.length - 1);
+        return React.createElement(Stop, {
+          key: index,
+          offset: offset,
+          stopColor: stopItem.color
+        });
+      })));
+    }
+    return null;
+  }
+};
+module.exports = iconNativeUtils;

package/build/rn/icons/utils/icon-shared-utils.js

@@ -0,0 +1,34 @@
+"use strict";
+
+const iconSharedUtils = {
+  hasValidGradient: gradient => {
+    return gradient && gradient.type && gradient.stops && gradient.stops.length > 0;
+  }
+};
+const gradientUtils = {
+  generateGradientId: gradient => {
+    if (!gradient) return '';
+    const type = gradient.type || '';
+    const angle = gradient.angle || 0;
+    const spec = gradient.specification || '';
+    const stopsStr = gradient.stops ? gradient.stops.map(s => `${s.color}-${s.stop || s.hint || 0}`).join('_') : '';
+    const gradientStr = `${type}-${angle}-${spec}-${stopsStr}`;
+    let hash = 0;
+    for (let i = 0; i < gradientStr.length; i++) {
+      const char = gradientStr.charCodeAt(i);
+      hash = (hash << 5) - hash + char;
+      hash = hash & hash;
+    }
+    const random = Math.floor(Math.random() * 10000);
+    return `gradient-${type}-${Math.abs(hash).toString(16)}-${random}`;
+  },
+  addGradientToSvg: (svgContent, gradientDefs) => {
+    if (!gradientDefs) return svgContent;
+    const React = require('react');
+    return React.cloneElement(svgContent, svgContent.props, gradientDefs, ...React.Children.toArray(svgContent.props.children));
+  }
+};
+iconSharedUtils.getGradientUtils = () => {
+  return gradientUtils;
+};
+module.exports = iconSharedUtils;

package/build/rn/icons/utils/icon-web-utils.js

@@ -0,0 +1,50 @@
+"use strict";
+
+const iconWebUtils = {
+  renderWebGradientDefs: (gradient, gradientId) => {
+    if (!gradient || !gradientId) return null;
+    const React = require('react');
+    if (gradient.type === 'linear') {
+      const angle = 180 - (gradient.angle || 0);
+      return React.createElement('defs', null, React.createElement('linearGradient', {
+        id: gradientId,
+        gradientTransform: `rotate(${angle})`
+      }, gradient.stops.map((stop, index) => {
+        const offset = stop.hint !== undefined ? stop.hint * 100 : stop.stop !== undefined ? stop.stop * 100 : '';
+        return React.createElement('stop', {
+          key: index,
+          offset: `${offset}%`,
+          stopColor: stop.color
+        });
+      })));
+    } else if (gradient.type === 'radial') {
+      let cx = '50%',
+        cy = '50%',
+        r = '50%';
+      if (typeof gradient.specification === 'string' && gradient.specification.length < 1000) {
+        const match = gradient.specification.match(/^(\d+(?:\.\d+)?)%\s+(\d+(?:\.\d+)?)%\s+at\s+(\d+(?:\.\d+)?)%\s+(\d+(?:\.\d+)?)%$/);
+        if (match) {
+          r = match[1] + '%';
+          cx = match[3] + '%';
+          cy = match[4] + '%';
+        }
+      }
+      return React.createElement('defs', null, React.createElement('radialGradient', {
+        id: gradientId,
+        cx: cx,
+        cy: cy,
+        r: r,
+        gradientUnits: "userSpaceOnUse"
+      }, gradient.stops.map((stop, index) => {
+        const offset = stop.hint !== undefined ? stop.hint * 100 : stop.stop !== undefined ? stop.stop * 100 : '';
+        return React.createElement('stop', {
+          key: index,
+          offset: `${offset}%`,
+          stopColor: stop.color
+        });
+      })));
+    }
+    return null;
+  }
+};
+module.exports = iconWebUtils;

package/build/rn/palette.js

@@ -1,6 +1,6 @@
 /**
 * Do not edit directly
-* Generated on Wed, 05 Mar 2025 00:03:19 GMT
+* Generated on Fri, 23 May 2025 15:14:19 GMT
 */
 module.exports = {
   border: {
@@ -128,6 +128,7 @@ module.exports = {
     Bullet: '@telus-uds/palette-koodo/build/rn/icons/bullet.icon.svg',
     BulletCircle: '@telus-uds/palette-koodo/build/rn/icons/bullet-circle.icon.svg',
     BulletFill: '@telus-uds/palette-koodo/build/rn/icons/bullet-fill.icon.svg',
+    CanadaFilled: '@telus-uds/palette-koodo/build/rn/icons/canada-filled.icon.svg',
     Cart: '@telus-uds/palette-koodo/build/rn/icons/cart.icon.svg',
     CartFilled: '@telus-uds/palette-koodo/build/rn/icons/cart-filled.icon.svg',
     Caution: '@telus-uds/palette-koodo/build/rn/icons/caution.icon.svg',

package/build/web/fonts/fonts-cdn-family.css

@@ -1,34 +1,34 @@
 @font-face {
   font-family: 'StagSans';
-  src: url('https://cdn.telus.digital/uds/StagSans-Light-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Light-v3_3_0.otf');
   font-weight: 300;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('https://cdn.telus.digital/uds/StagSans-Regular-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Regular-v3_3_0.otf');
   font-weight: 400;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('https://cdn.telus.digital/uds/StagSans-Medium-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Medium-v3_3_0.otf');
   font-weight: 500;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('https://cdn.telus.digital/uds/StagSans-Semibold-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Semibold-v3_3_0.otf');
   font-weight: 600;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('https://cdn.telus.digital/uds/StagSans-Bold-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Bold-v3_3_0.otf');
   font-weight: 700;
   font-style: normal;
   font-display: block;

package/build/web/fonts/fonts-cdn.css

@@ -1,25 +1,25 @@
 @font-face {
   font-family: 'StagSans300normal';
-  src: url('https://cdn.telus.digital/uds/StagSans-Light-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Light-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans400normal';
-  src: url('https://cdn.telus.digital/uds/StagSans-Regular-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Regular-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans500normal';
-  src: url('https://cdn.telus.digital/uds/StagSans-Medium-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Medium-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans600normal';
-  src: url('https://cdn.telus.digital/uds/StagSans-Semibold-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Semibold-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans700normal';
-  src: url('https://cdn.telus.digital/uds/StagSans-Bold-v3_2_0.otf');
+  src: url('https://cdn.telus.digital/uds/StagSans-Bold-v3_3_0.otf');
   font-display: block;
 }

package/build/web/fonts/fonts-local-family.css

@@ -1,34 +1,34 @@
 @font-face {
   font-family: 'StagSans';
-  src: url('./StagSans-Light-v3_2_0.otf');
+  src: url('./StagSans-Light-v3_3_0.otf');
   font-weight: 300;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('./StagSans-Regular-v3_2_0.otf');
+  src: url('./StagSans-Regular-v3_3_0.otf');
   font-weight: 400;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('./StagSans-Medium-v3_2_0.otf');
+  src: url('./StagSans-Medium-v3_3_0.otf');
   font-weight: 500;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('./StagSans-Semibold-v3_2_0.otf');
+  src: url('./StagSans-Semibold-v3_3_0.otf');
   font-weight: 600;
   font-style: normal;
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans';
-  src: url('./StagSans-Bold-v3_2_0.otf');
+  src: url('./StagSans-Bold-v3_3_0.otf');
   font-weight: 700;
   font-style: normal;
   font-display: block;

package/build/web/fonts/fonts-local.css

@@ -1,25 +1,25 @@
 @font-face {
   font-family: 'StagSans300normal';
-  src: url('./StagSans-Light-v3_2_0.otf');
+  src: url('./StagSans-Light-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans400normal';
-  src: url('./StagSans-Regular-v3_2_0.otf');
+  src: url('./StagSans-Regular-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans500normal';
-  src: url('./StagSans-Medium-v3_2_0.otf');
+  src: url('./StagSans-Medium-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans600normal';
-  src: url('./StagSans-Semibold-v3_2_0.otf');
+  src: url('./StagSans-Semibold-v3_3_0.otf');
   font-display: block;
 }
 @font-face {
   font-family: 'StagSans700normal';
-  src: url('./StagSans-Bold-v3_2_0.otf');
+  src: url('./StagSans-Bold-v3_3_0.otf');
   font-display: block;
 }

package/build/web/icons/Add.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 32 32",
-  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: "M31.63 15.81a2.79 2.79 0 0 0-2.793-2.79l-10.233.003-.003-10.233a2.79 2.79 0 0 0-5.582.002l.004 10.233-10.233.003a2.79 2.79 0 1 0 .002 5.582l10.233-.004.003 10.233a2.79 2.79 0 1 0 5.582-.002l-.004-10.233 10.233-.003a2.79 2.79 0 0 0 2.79-2.792Z"
-  })]
-});
+}) => {
+  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 32 32",
+    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: "M31.63 15.81a2.79 2.79 0 0 0-2.793-2.79l-10.233.003-.003-10.233a2.79 2.79 0 0 0-5.582.002l.004 10.233-10.233.003a2.79 2.79 0 1 0 .002 5.582l10.233-.004.003 10.233a2.79 2.79 0 1 0 5.582-.002l-.004-10.233 10.233-.003a2.79 2.79 0 0 0 2.79-2.792Z"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};

package/build/web/icons/Amex.js

@@ -6,24 +6,40 @@ 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", {
-    fill: "#016FD0",
-    fillRule: "evenodd",
-    d: "M2.709 8 0 14.991h3.243l.402-1.115h.918l.402 1.115h3.57v-.85l.318.85h1.846l.318-.869v.869h7.423l.902-1.086.846 1.086L24 15l-2.717-3.485L24 8h-3.753l-.879 1.066L18.549 8h-8.075l-.693 1.804L9.07 8H5.835v.822L5.475 8H2.71Zm.627.993h1.58l1.797 4.74v-4.74h1.732l1.387 3.399 1.28-3.4h1.722v5.017h-1.048l-.009-3.93-1.528 3.93h-.938l-1.537-3.93v3.93H5.618l-.41-1.124H3l-.408 1.123H1.437l1.9-5.015Zm14.72 0h-4.263v5.013h4.197l1.352-1.661 1.304 1.661h1.363l-1.98-2.492 1.98-2.521h-1.304l-1.345 1.642-1.304-1.642ZM4.105 9.84l-.728 2.004h1.455L4.105 9.84Zm10.74 1.106v-.916h2.66l1.161 1.464-1.212 1.473h-2.608v-1h2.325v-1.02h-2.325Z",
-    clipRule: "evenodd"
-  })]
-});
+}) => {
+  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", {
+      fill: "#016FD0",
+      fillRule: "evenodd",
+      d: "M2.709 8 0 14.991h3.243l.402-1.115h.918l.402 1.115h3.57v-.85l.318.85h1.846l.318-.869v.869h7.423l.902-1.086.846 1.086L24 15l-2.717-3.485L24 8h-3.753l-.879 1.066L18.549 8h-8.075l-.693 1.804L9.07 8H5.835v.822L5.475 8H2.71Zm.627.993h1.58l1.797 4.74v-4.74h1.732l1.387 3.399 1.28-3.4h1.722v5.017h-1.048l-.009-3.93-1.528 3.93h-.938l-1.537-3.93v3.93H5.618l-.41-1.124H3l-.408 1.123H1.437l1.9-5.015Zm14.72 0h-4.263v5.013h4.197l1.352-1.661 1.304 1.661h1.363l-1.98-2.492 1.98-2.521h-1.304l-1.345 1.642-1.304-1.642ZM4.105 9.84l-.728 2.004h1.455L4.105 9.84Zm10.74 1.106v-.916h2.66l1.161 1.464-1.212 1.473h-2.608v-1h2.325v-1.02h-2.325Z",
+      clipRule: "evenodd"
+    })]
+  });
+  return hasGradient ? gradientUtils.addGradientToSvg(svgContent, gradientDefs) : svgContent;
+};