@freightos/icons 1.0.3 → 1.0.4

package/dist/esm/icons/IconAirport.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAirport = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.372 5.699c.452-.163.92.191 1.038.782.119.59-.146 1.196-.603 1.366-5.33 1.867-9.346 3.27-9.346 3.27L2 7.802l.818-.287 1.11 1.136 2.804-.981-2.335-5.294L5.486 2l3.891 4.747 2.995-1.048zM20 11.217l1-2.157-1-1.079h-2V5.825h-1V7.98h-2l-1 1.08 1 2.156h5zM22 22v-2.157h-2v-7.548h-5v7.548H2V22h20z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAirport = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.372 5.699c.452-.163.92.191 1.038.782.119.59-.146 1.196-.603 1.366-5.33 1.867-9.346 3.27-9.346 3.27L2 7.802l.818-.287 1.11 1.136 2.804-.981-2.335-5.294L5.486 2l3.891 4.747 2.995-1.048zM20 11.217l1-2.157-1-1.079h-2V5.825h-1V7.98h-2l-1 1.08 1 2.156h5zM22 22v-2.157h-2v-7.548h-5v7.548H2V22h20z", fill: "currentColor" })));
+});
 IconAirport.displayName = 'IconAirport';

package/dist/esm/icons/IconAirportArrival.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAirportArrival = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21.323 9.28c.475.132.703.687.507 1.228-.196.542-.734.872-1.218.743-5.59-1.596-9.799-2.802-9.799-2.802l.408-3.498.858.244.392 1.553 2.94.84L16.06 2l1.139.33.984 6.053 3.14.898zM4 11.715L3 9.657 4 8.63h2V6.57h1v2.06h2l1 1.028-1 2.057H4zM2 22v-2.057h2v-7.2h5v7.2h13V22H2z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAirportArrival = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M21.323 9.28c.475.132.703.687.507 1.228-.196.542-.734.872-1.218.743-5.59-1.596-9.799-2.802-9.799-2.802l.408-3.498.858.244.392 1.553 2.94.84L16.06 2l1.139.33.984 6.053 3.14.898zM4 11.715L3 9.657 4 8.63h2V6.57h1v2.06h2l1 1.028-1 2.057H4zM2 22v-2.057h2v-7.2h5v7.2h13V22H2z", fill: "currentColor" })));
+});
 IconAirportArrival.displayName = 'IconAirportArrival';

package/dist/esm/icons/IconAlarm.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAlarm = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.505 8.137h-1.508v5.943l4.774 2.823.754-1.218-4.02-2.348v-5.2zM17.37 2L22 5.811l-1.29 1.523-4.63-3.811L17.37 2zM6.63 2l1.29 1.523-4.63 3.811L2 5.848 6.63 2zM12 4.17c-1.79 0-3.54.522-5.028 1.502A8.946 8.946 0 003.64 9.673a8.792 8.792 0 00-.515 5.151 8.875 8.875 0 002.477 4.565 9.093 9.093 0 004.634 2.44 9.177 9.177 0 005.228-.508 9.022 9.022 0 004.062-3.283 8.821 8.821 0 001.525-4.953A8.849 8.849 0 0018.4 6.78 9.12 9.12 0 0012 4.169zm0 15.854a7.12 7.12 0 01-3.915-1.166 6.962 6.962 0 01-2.598-3.113 6.843 6.843 0 01-.404-4.01A6.908 6.908 0 017.01 8.181a7.077 7.077 0 013.607-1.901 7.142 7.142 0 014.07.393A7.022 7.022 0 0117.85 9.23a6.866 6.866 0 011.187 3.856c0 1.839-.74 3.603-2.06 4.904A7.098 7.098 0 0112 20.024z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAlarm = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.505 8.137h-1.508v5.943l4.774 2.823.754-1.218-4.02-2.348v-5.2zM17.37 2L22 5.811l-1.29 1.523-4.63-3.811L17.37 2zM6.63 2l1.29 1.523-4.63 3.811L2 5.848 6.63 2zM12 4.17c-1.79 0-3.54.522-5.028 1.502A8.946 8.946 0 003.64 9.673a8.792 8.792 0 00-.515 5.151 8.875 8.875 0 002.477 4.565 9.093 9.093 0 004.634 2.44 9.177 9.177 0 005.228-.508 9.022 9.022 0 004.062-3.283 8.821 8.821 0 001.525-4.953A8.849 8.849 0 0018.4 6.78 9.12 9.12 0 0012 4.169zm0 15.854a7.12 7.12 0 01-3.915-1.166 6.962 6.962 0 01-2.598-3.113 6.843 6.843 0 01-.404-4.01A6.908 6.908 0 017.01 8.181a7.077 7.077 0 013.607-1.901 7.142 7.142 0 014.07.393A7.022 7.022 0 0117.85 9.23a6.866 6.866 0 011.187 3.856c0 1.839-.74 3.603-2.06 4.904A7.098 7.098 0 0112 20.024z", fill: "currentColor" })));
+});
 IconAlarm.displayName = 'IconAlarm';

package/dist/esm/icons/IconAlertCircled.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAlertCircled = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.003 14.991h2.002v1.994h-2.002v-1.994zm0-7.998h2.002v5.996h-2.002V6.993zM12 2a10 10 0 1010 9.992A9.987 9.987 0 0012 2zm0 17.991a7.998 7.998 0 117.998-7.998A7.991 7.991 0 0112 19.99z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAlertCircled = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.003 14.991h2.002v1.994h-2.002v-1.994zm0-7.998h2.002v5.996h-2.002V6.993zM12 2a10 10 0 1010 9.992A9.987 9.987 0 0012 2zm0 17.991a7.998 7.998 0 117.998-7.998A7.991 7.991 0 0112 19.99z", fill: "currentColor" })));
+});
 IconAlertCircled.displayName = 'IconAlertCircled';

package/dist/esm/icons/IconAmazon.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAmazon = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { d: "M15.827 18.09a.548.548 0 01-.633.06c-.894-.74-1.055-1.08-1.547-1.79-1.476 1.5-2.521 1.95-4.44 1.95-2.26 0-4.028-1.39-4.028-4.17 0-2.18 1.176-3.64 2.873-4.38 1.467-.64 3.506-.76 5.063-.93V8.5c0-.66.05-1.41-.332-1.96-.321-.49-.954-.7-1.506-.7-1.025 0-1.939.53-2.16 1.61-.05.24-.251.48-.472.49l-2.612-.28c-.22-.05-.462-.22-.402-.56C6.234 3.95 9.097 3 11.658 3c1.306 0 3.014.35 4.048 1.33 1.306 1.22 1.196 2.85 1.196 4.62v4.17c0 1.25.502 1.81 1.004 2.48.17.25.211.54 0 .71l-2.07 1.78h-.01zm-2.712-6.53V11c-1.949 0-4.008.39-4.008 2.67 0 1.16.613 1.95 1.637 1.95.764 0 1.437-.47 1.869-1.22.522-.93.502-1.8.502-2.84zm6.96 8.98C17.907 22.14 14.713 23 11.98 23c-3.827 0-7.283-1.41-9.894-3.76-.201-.18-.02-.43.25-.29 2.793 1.63 6.279 2.61 9.875 2.61 2.42 0 5.092-.5 7.543-1.53.372-.16.663.24.322.51zm.915-1.04c-.281-.36-1.858-.17-2.582-.08-.19.02-.22-.16-.03-.3 1.246-.88 3.305-.62 3.546-.33.241.3-.07 2.35-1.245 3.32-.181.16-.352.07-.262-.11.261-.67.854-2.14.573-2.5z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAmazon = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { d: "M15.827 18.09a.548.548 0 01-.633.06c-.894-.74-1.055-1.08-1.547-1.79-1.476 1.5-2.521 1.95-4.44 1.95-2.26 0-4.028-1.39-4.028-4.17 0-2.18 1.176-3.64 2.873-4.38 1.467-.64 3.506-.76 5.063-.93V8.5c0-.66.05-1.41-.332-1.96-.321-.49-.954-.7-1.506-.7-1.025 0-1.939.53-2.16 1.61-.05.24-.251.48-.472.49l-2.612-.28c-.22-.05-.462-.22-.402-.56C6.234 3.95 9.097 3 11.658 3c1.306 0 3.014.35 4.048 1.33 1.306 1.22 1.196 2.85 1.196 4.62v4.17c0 1.25.502 1.81 1.004 2.48.17.25.211.54 0 .71l-2.07 1.78h-.01zm-2.712-6.53V11c-1.949 0-4.008.39-4.008 2.67 0 1.16.613 1.95 1.637 1.95.764 0 1.437-.47 1.869-1.22.522-.93.502-1.8.502-2.84zm6.96 8.98C17.907 22.14 14.713 23 11.98 23c-3.827 0-7.283-1.41-9.894-3.76-.201-.18-.02-.43.25-.29 2.793 1.63 6.279 2.61 9.875 2.61 2.42 0 5.092-.5 7.543-1.53.372-.16.663.24.322.51zm.915-1.04c-.281-.36-1.858-.17-2.582-.08-.19.02-.22-.16-.03-.3 1.246-.88 3.305-.62 3.546-.33.241.3-.07 2.35-1.245 3.32-.181.16-.352.07-.262-.11.261-.67.854-2.14.573-2.5z", fill: "currentColor" })));
+});
 IconAmazon.displayName = 'IconAmazon';

package/dist/esm/icons/IconArchive.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArchive = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.543 5.25l-1.395-1.702A1.448 1.448 0 0018 3H6a1.5 1.5 0 00-1.162.548L3.458 5.25A2.01 2.01 0 003 6.503v12.494A2.01 2.01 0 005.003 21h13.994A2.01 2.01 0 0021 18.997V6.503a2.01 2.01 0 00-.457-1.253zM6.24 5.003h11.52l.81.997H5.437l.803-.997zM5.003 18.997V8.003h13.994v10.994H5.003zm8.445-9h-2.896v3h-2.55L12 17.004l3.998-4.005h-2.55v-3z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArchive = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.543 5.25l-1.395-1.702A1.448 1.448 0 0018 3H6a1.5 1.5 0 00-1.162.548L3.458 5.25A2.01 2.01 0 003 6.503v12.494A2.01 2.01 0 005.003 21h13.994A2.01 2.01 0 0021 18.997V6.503a2.01 2.01 0 00-.457-1.253zM6.24 5.003h11.52l.81.997H5.437l.803-.997zM5.003 18.997V8.003h13.994v10.994H5.003zm8.445-9h-2.896v3h-2.55L12 17.004l3.998-4.005h-2.55v-3z", fill: "currentColor" })));
+});
 IconArchive.displayName = 'IconArchive';

package/dist/esm/icons/IconArrowBack.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArrowBack = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20 11.003H7.831l5.586-5.593L12 4l-8 8 8 8 1.41-1.41-5.579-5.593H20v-1.994z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowBack = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20 11.003H7.831l5.586-5.593L12 4l-8 8 8 8 1.41-1.41-5.579-5.593H20v-1.994z", fill: "currentColor" })));
+});
 IconArrowBack.displayName = 'IconArrowBack';

package/dist/esm/icons/IconArrowForward.js

@@ -1,17 +1,21 @@
 import React, { forwardRef } from 'react';
-export const IconArrowForward = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("g", { "clip-path": "url(#clip0_805_28001)" },
-        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.998 3.998l-1.41 1.41L16.166 11H3.998v1.995h12.168l-5.578 5.593 1.41 1.41 8-8-8-8z", fill: "currentColor" })),
-    React.createElement("defs", null,
-        React.createElement("clipPath", { id: "clip0_805_28001" },
-            React.createElement("path", { fill: "currentColor", d: "M0 0h24v24H0z" }))))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowForward = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("g", { "clip-path": "url(#clip0_805_28001)" },
+            React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.998 3.998l-1.41 1.41L16.166 11H3.998v1.995h12.168l-5.578 5.593 1.41 1.41 8-8-8-8z", fill: "currentColor" })),
+        React.createElement("defs", null,
+            React.createElement("clipPath", { id: "clip0_805_28001" },
+                React.createElement("path", { fill: "currentColor", d: "M0 0h24v24H0z" })))));
+});
 IconArrowForward.displayName = 'IconArrowForward';

package/dist/esm/icons/IconArrowSmallDown.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArrowSmallDown = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6 9l6 6 6-6H6z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowSmallDown = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6 9l6 6 6-6H6z", fill: "currentColor" })));
+});
 IconArrowSmallDown.displayName = 'IconArrowSmallDown';

package/dist/esm/icons/IconArrowSmallLeft.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArrowSmallLeft = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.498 6l-6 6 6 6V6z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowSmallLeft = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.498 6l-6 6 6 6V6z", fill: "currentColor" })));
+});
 IconArrowSmallLeft.displayName = 'IconArrowSmallLeft';

package/dist/esm/icons/IconArrowSmallRight.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArrowSmallRight = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9.502 18l6-6-6-6v12z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowSmallRight = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9.502 18l6-6-6-6v12z", fill: "currentColor" })));
+});
 IconArrowSmallRight.displayName = 'IconArrowSmallRight';

package/dist/esm/icons/IconArrowSmallUp.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconArrowSmallUp = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6 14.498l6-6 6 6H6z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconArrowSmallUp = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M6 14.498l6-6 6 6H6z", fill: "currentColor" })));
+});
 IconArrowSmallUp.displayName = 'IconArrowSmallUp';

package/dist/esm/icons/IconAttachment.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAttachment = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M15.634 6.625V16.9c.021.483-.057.965-.23 1.417a3.57 3.57 0 01-.777 1.213 3.64 3.64 0 01-1.199.817 3.69 3.69 0 01-2.856 0 3.64 3.64 0 01-1.2-.817 3.57 3.57 0 01-.776-1.213 3.526 3.526 0 01-.23-1.417V5.734a2.206 2.206 0 01.62-1.662c.212-.22.468-.397.752-.517a2.307 2.307 0 012.552.517 2.206 2.206 0 01.62 1.661v9.383a.893.893 0 01-.293.585.921.921 0 01-1.234 0 .893.893 0 01-.292-.585v-8.49H9.728v8.49c.032.572.285 1.11.708 1.504.422.393.982.613 1.564.613.582 0 1.142-.22 1.564-.613.423-.394.676-.932.708-1.504V5.735a3.527 3.527 0 00-.23-1.417 3.57 3.57 0 00-.777-1.213 3.64 3.64 0 00-1.2-.817 3.69 3.69 0 00-2.856 0 3.64 3.64 0 00-1.199.817c-.34.348-.603.761-.777 1.213a3.527 3.527 0 00-.23 1.417V16.9c-.024.661.086 1.32.326 1.938a4.91 4.91 0 001.07 1.657 5.004 5.004 0 001.645 1.114 5.071 5.071 0 003.912 0 5.005 5.005 0 001.644-1.114 4.91 4.91 0 001.07-1.657c.24-.618.351-1.277.327-1.938V6.625h-1.363z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAttachment = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M15.634 6.625V16.9c.021.483-.057.965-.23 1.417a3.57 3.57 0 01-.777 1.213 3.64 3.64 0 01-1.199.817 3.69 3.69 0 01-2.856 0 3.64 3.64 0 01-1.2-.817 3.57 3.57 0 01-.776-1.213 3.526 3.526 0 01-.23-1.417V5.734a2.206 2.206 0 01.62-1.662c.212-.22.468-.397.752-.517a2.307 2.307 0 012.552.517 2.206 2.206 0 01.62 1.661v9.383a.893.893 0 01-.293.585.921.921 0 01-1.234 0 .893.893 0 01-.292-.585v-8.49H9.728v8.49c.032.572.285 1.11.708 1.504.422.393.982.613 1.564.613.582 0 1.142-.22 1.564-.613.423-.394.676-.932.708-1.504V5.735a3.527 3.527 0 00-.23-1.417 3.57 3.57 0 00-.777-1.213 3.64 3.64 0 00-1.2-.817 3.69 3.69 0 00-2.856 0 3.64 3.64 0 00-1.199.817c-.34.348-.603.761-.777 1.213a3.527 3.527 0 00-.23 1.417V16.9c-.024.661.086 1.32.326 1.938a4.91 4.91 0 001.07 1.657 5.004 5.004 0 001.645 1.114 5.071 5.071 0 003.912 0 5.005 5.005 0 001.644-1.114 4.91 4.91 0 001.07-1.657c.24-.618.351-1.277.327-1.938V6.625h-1.363z", fill: "currentColor" })));
+});
 IconAttachment.displayName = 'IconAttachment';

package/dist/esm/icons/IconAuto.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAuto = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M19 8l-4 4h3c0 3.31-2.69 6-6 6a5.87 5.87 0 01-2.8-.7l-1.46 1.46A7.93 7.93 0 0012 20c4.42 0 8-3.58 8-8h3l-4-4zM6 12c0-3.31 2.69-6 6-6 1.01 0 1.97.25 2.8.7l1.46-1.46A7.93 7.93 0 0012 4c-4.42 0-8 3.58-8 8H1l4 4 4-4H6z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAuto = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M19 8l-4 4h3c0 3.31-2.69 6-6 6a5.87 5.87 0 01-2.8-.7l-1.46 1.46A7.93 7.93 0 0012 20c4.42 0 8-3.58 8-8h3l-4-4zM6 12c0-3.31 2.69-6 6-6 1.01 0 1.97.25 2.8.7l1.46-1.46A7.93 7.93 0 0012 4c-4.42 0-8 3.58-8 8H1l4 4 4-4H6z", fill: "currentColor" })));
+});
 IconAuto.displayName = 'IconAuto';

package/dist/esm/icons/IconAutomated.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconAutomated = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M16 12.4l3-4 3 4h-2c0 4.42-3.58 8-8 8a7.93 7.93 0 01-4.26-1.24L9.2 17.7c.83.45 1.79.7 2.8.7 3.31 0 6-2.69 6-6h-2zm-4-6c-3.31 0-6 2.69-6 6h2l-3 3-3-3h2c0-4.42 3.58-8 8-8 1.51 0 2.987.43 4.26 1.24L14.8 7.1a5.87 5.87 0 00-2.8-.7zm1.044 2.49a.187.187 0 00-.189-.157h-1.542a.186.186 0 00-.189.158l-.146.994a2.962 2.962 0 00-.652.367l-.96-.375a.224.224 0 00-.069-.011.192.192 0 00-.165.094l-.772 1.297a.181.181 0 00.047.24l.814.619c-.016.12-.027.244-.027.367s.01.246.027.368l-.814.618a.185.185 0 00-.046.24l.77 1.298a.193.193 0 00.17.094.183.183 0 00.066-.011l.96-.375c.2.15.419.274.651.367l.146.994a.187.187 0 00.19.157h1.541a.186.186 0 00.19-.157l.146-.994c.232-.095.45-.218.651-.367l.96.375a.222.222 0 00.07.01.192.192 0 00.165-.093l.771-1.297a.185.185 0 00-.046-.24l-.813-.62c.015-.12.027-.24.027-.367a2.92 2.92 0 00-.027-.367l.813-.619a.185.185 0 00.046-.24l-.77-1.297a.193.193 0 00-.17-.094.185.185 0 00-.066.011l-.96.375c-.2-.15-.416-.274-.651-.367l-.147-.994zm-2.46 3.593c0-.825.675-1.5 1.5-1.5s1.5.675 1.5 1.5-.675 1.5-1.5 1.5-1.5-.675-1.5-1.5z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconAutomated = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M16 12.4l3-4 3 4h-2c0 4.42-3.58 8-8 8a7.93 7.93 0 01-4.26-1.24L9.2 17.7c.83.45 1.79.7 2.8.7 3.31 0 6-2.69 6-6h-2zm-4-6c-3.31 0-6 2.69-6 6h2l-3 3-3-3h2c0-4.42 3.58-8 8-8 1.51 0 2.987.43 4.26 1.24L14.8 7.1a5.87 5.87 0 00-2.8-.7zm1.044 2.49a.187.187 0 00-.189-.157h-1.542a.186.186 0 00-.189.158l-.146.994a2.962 2.962 0 00-.652.367l-.96-.375a.224.224 0 00-.069-.011.192.192 0 00-.165.094l-.772 1.297a.181.181 0 00.047.24l.814.619c-.016.12-.027.244-.027.367s.01.246.027.368l-.814.618a.185.185 0 00-.046.24l.77 1.298a.193.193 0 00.17.094.183.183 0 00.066-.011l.96-.375c.2.15.419.274.651.367l.146.994a.187.187 0 00.19.157h1.541a.186.186 0 00.19-.157l.146-.994c.232-.095.45-.218.651-.367l.96.375a.222.222 0 00.07.01.192.192 0 00.165-.093l.771-1.297a.185.185 0 00-.046-.24l-.813-.62c.015-.12.027-.24.027-.367a2.92 2.92 0 00-.027-.367l.813-.619a.185.185 0 00.046-.24l-.77-1.297a.193.193 0 00-.17-.094.185.185 0 00-.066.011l-.96.375c-.2-.15-.416-.274-.651-.367l-.147-.994zm-2.46 3.593c0-.825.675-1.5 1.5-1.5s1.5.675 1.5 1.5-.675 1.5-1.5 1.5-1.5-.675-1.5-1.5z", fill: "currentColor" })));
+});
 IconAutomated.displayName = 'IconAutomated';

package/dist/esm/icons/IconBank.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconBank = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { d: "M6.737 11H4.632v7h2.105v-7zm6.316 0h-2.106v7h2.106v-7zM22 20H2v2h20v-2zm-2.632-9h-2.105v7h2.105v-7zM12 4.26L17.484 7H6.516L12 4.26zM12 2L2 7v2h20V7L12 2z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconBank = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { d: "M6.737 11H4.632v7h2.105v-7zm6.316 0h-2.106v7h2.106v-7zM22 20H2v2h20v-2zm-2.632-9h-2.105v7h2.105v-7zM12 4.26L17.484 7H6.516L12 4.26zM12 2L2 7v2h20V7L12 2z", fill: "currentColor" })));
+});
 IconBank.displayName = 'IconBank';

package/dist/esm/icons/IconBilling.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconBilling = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.18 4c.488.01.953.212 1.294.565.34.353.53.827.526 1.32v12.23a1.88 1.88 0 01-.526 1.32 1.847 1.847 0 01-1.295.565H3.821a1.848 1.848 0 01-1.295-.565A1.88 1.88 0 012 18.115V5.885a1.88 1.88 0 01.526-1.32A1.847 1.847 0 013.821 4h16.358zm-9.09 1.885H3.82v12.23h7.27V5.885zm9.09 0h-7.27v12.23h7.27V5.885zM8.165 7.826v1.016c.38.107.714.34.95.659.236.32.36.71.353 1.108h-.917a.918.918 0 00-.28-.733.902.902 0 00-.74-.241c-.69 0-1.097.355-1.097.856 0 .5.296.695 1.22 1.001.924.306 1.91.696 1.91 2.038.007.404-.135.795-.397 1.1-.262.304-.626.5-1.023.55v.994h-1.2v-1.009a1.831 1.831 0 01-1.06-.62 1.86 1.86 0 01-.437-1.154h.897c.041.55.372.974 1.207.974.834 0 1.096-.508 1.096-.828 0-.43-.2-.841-1.213-1.12-1.138-.313-1.91-.841-1.91-1.913.006-.402.152-.79.41-1.095.26-.306.617-.512 1.01-.581V7.826h1.22zm11.11 6.06v1.39H13.82v-1.39h5.455zm0-2.359v1.391H13.82v-1.391h5.455zm0-2.351v1.391H13.82V9.176h5.455z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconBilling = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M20.18 4c.488.01.953.212 1.294.565.34.353.53.827.526 1.32v12.23a1.88 1.88 0 01-.526 1.32 1.847 1.847 0 01-1.295.565H3.821a1.848 1.848 0 01-1.295-.565A1.88 1.88 0 012 18.115V5.885a1.88 1.88 0 01.526-1.32A1.847 1.847 0 013.821 4h16.358zm-9.09 1.885H3.82v12.23h7.27V5.885zm9.09 0h-7.27v12.23h7.27V5.885zM8.165 7.826v1.016c.38.107.714.34.95.659.236.32.36.71.353 1.108h-.917a.918.918 0 00-.28-.733.902.902 0 00-.74-.241c-.69 0-1.097.355-1.097.856 0 .5.296.695 1.22 1.001.924.306 1.91.696 1.91 2.038.007.404-.135.795-.397 1.1-.262.304-.626.5-1.023.55v.994h-1.2v-1.009a1.831 1.831 0 01-1.06-.62 1.86 1.86 0 01-.437-1.154h.897c.041.55.372.974 1.207.974.834 0 1.096-.508 1.096-.828 0-.43-.2-.841-1.213-1.12-1.138-.313-1.91-.841-1.91-1.913.006-.402.152-.79.41-1.095.26-.306.617-.512 1.01-.581V7.826h1.22zm11.11 6.06v1.39H13.82v-1.39h5.455zm0-2.359v1.391H13.82v-1.391h5.455zm0-2.351v1.391H13.82V9.176h5.455z", fill: "currentColor" })));
+});
 IconBilling.displayName = 'IconBilling';

package/dist/esm/icons/IconBlankCircled.js

@@ -1,13 +1,17 @@
 import React, { forwardRef } from 'react';
-export const IconBlankCircled = forwardRef(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
-        width: size,
-        height: size,
-        minWidth: size,
-        minHeight: size,
-        flexShrink: 0,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...style,
-    }, ...props },
-    React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 2a10 10 0 100 20 10 10 0 000-20zm0 18.005A8.005 8.005 0 1120.005 12 8.02 8.02 0 0112 20.005z", fill: "currentColor" }))));
+import { FREIGHTOS_COLORS } from '../colors';
+export const IconBlankCircled = forwardRef(({ size = '1em', color = 'currentColor', style, ...props }, ref) => {
+    const resolvedColor = color && color in FREIGHTOS_COLORS ? FREIGHTOS_COLORS[color] : color;
+    return (React.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: resolvedColor, style: {
+            width: size,
+            height: size,
+            minWidth: size,
+            minHeight: size,
+            flexShrink: 0,
+            display: 'inline-block',
+            verticalAlign: 'middle',
+            ...style,
+        }, ...props },
+        React.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 2a10 10 0 100 20 10 10 0 000-20zm0 18.005A8.005 8.005 0 1120.005 12 8.02 8.02 0 0112 20.005z", fill: "currentColor" })));
+});
 IconBlankCircled.displayName = 'IconBlankCircled';