@qite/tide-booking-component 1.4.106 → 1.4.107

package/src/shared/components/icon.tsx

@@ -1,5 +1,5 @@
 import { isEmpty } from 'lodash';
-import React, { useContext } from 'react';
+import React from 'react';
 // import SettingsContext from '../settings-context'; // TODO: SETTINGS LOGIC FOR QSM
 import HTMLComment from 'react-html-comment';
 
@@ -9,14 +9,19 @@ interface IconProps {
   title?: string;
   width?: number;
   height?: number;
+  fill?: string;
 }
 
-const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) => {
+const Icon: React.FC<IconProps> = ({ name, className, title, width, height, fill }) => {
   const { icons } = { icons: '' }; // useContext(SettingsContext);
 
   if (icons) {
     return (
-      <svg className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')} width={width} height={height}>
+      <svg
+        className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+        width={width}
+        height={height}
+        fill={fill ?? 'currentColor'}>
         {title && <title>{title}</title>}
         <use href={`${icons}#${name}`}></use>
       </svg>
@@ -30,7 +35,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 384 512">
+          viewBox="0 0 384 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -46,7 +52,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 144L48 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l144 0 0 144c0 17.7 14.3 32 32 32s32-14.3 32-32l0-144 144 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-144 0 0-144z" />
@@ -59,7 +66,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z" />
@@ -72,13 +80,11 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 320 512">
+          viewBox="0 0 320 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
-          <path
-            d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"
-            fill="currentColor"
-          />
+          <path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z" />
         </svg>
       );
 
@@ -88,7 +94,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -104,7 +111,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -120,29 +128,42 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 640 512">
+          viewBox="0 0 640 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
             d="M32 32c17.7 0 32 14.3 32 32l0 256 224 0 0-160c0-17.7 14.3-32 32-32l224 0c53 0 96 43 96 96l0 224c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-32-224 0-32 0L64 416l0 32c0 17.7-14.3 32-32 32s-32-14.3-32-32L0 64C0 46.3 14.3 32 32 32zm144 96a80 80 0 1 1 0 160 80 80 0 1 1 0-160z"
-            fill="currentColor"
+            fill={fill ?? 'currentColor'}
           />
         </svg>
       );
 
+    case 'ui-utensils':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 416 512"
+          fill={fill ?? 'currentColor'}>
+          <HTMLComment text="!Font Awesome Free v5.15.4 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M207.9 15.2c.8 4.7 16.1 94.5 16.1 128.8 0 52.3-27.8 89.6-68.9 104.6L168 486.7c.7 13.7-10.2 25.3-24 25.3H80c-13.7 0-24.7-11.5-24-25.3l12.9-238.1C27.7 233.6 0 196.2 0 144 0 109.6 15.3 19.9 16.1 15.2 19.3-5.1 61.4-5.4 64 16.3v141.2c1.3 3.4 15.1 3.2 16 0 1.4-25.3 7.9-139.2 8-141.8 3.3-20.8 44.7-20.8 47.9 0 .2 2.7 6.6 116.5 8 141.8.9 3.2 14.8 3.4 16 0V16.3c2.6-21.6 44.8-21.4 48-1.1zm119.2 285.7l-15 185.1c-1.2 14 9.9 26 23.9 26h56c13.3 0 24-10.7 24-24V24c0-13.2-10.7-24-24-24-82.5 0-221.4 178.5-64.9 300.9z" />
+        </svg>
+      );
+
     case 'ui-flight':
       return (
         <svg
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
-          <path
-            d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.2-15.4-20.4l49-171.6L112 320 68.8 377.6c-3 4-7.8 6.4-12.8 6.4l-42 0c-7.8 0-14-6.3-14-14c0-1.3 .2-2.6 .5-3.9L32 256 .5 145.9c-.4-1.3-.5-2.6-.5-3.9c0-7.8 6.3-14 14-14l42 0c5 0 9.8 2.4 12.8 6.4L112 192l102.9 0-49-171.6C162.9 10.2 170.6 0 181.2 0l56.2 0c11.5 0 22.1 6.2 27.8 16.1L365.7 192l116.6 0z"
-            fill="currentColor"
-          />
+          <path d="M482.3 192c34.2 0 93.7 29 93.7 64c0 36-59.5 64-93.7 64l-116.6 0L265.2 495.9c-5.7 10-16.3 16.1-27.8 16.1l-56.2 0c-10.6 0-18.3-10.2-15.4-20.4l49-171.6L112 320 68.8 377.6c-3 4-7.8 6.4-12.8 6.4l-42 0c-7.8 0-14-6.3-14-14c0-1.3 .2-2.6 .5-3.9L32 256 .5 145.9c-.4-1.3-.5-2.6-.5-3.9c0-7.8 6.3-14 14-14l42 0c5 0 9.8 2.4 12.8 6.4L112 192l102.9 0-49-171.6C162.9 10.2 170.6 0 181.2 0l56.2 0c11.5 0 22.1 6.2 27.8 16.1L365.7 192l116.6 0z" />
         </svg>
       );
 
@@ -152,7 +173,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -168,7 +190,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z" />
@@ -181,7 +204,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M288 0c-12.2 .1-23.3 7-28.6 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3L288 439.8 288 0zM429.9 512c1.1 .1 2.1 .1 3.2 0l-3.2 0z" />
@@ -194,7 +218,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512l388.6 0c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304l-91.4 0z" />
@@ -207,7 +232,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M410.3 231l11.3-11.3-33.9-33.9-62.1-62.1L291.7 89.8l-11.3 11.3-22.6 22.6L58.6 322.9c-10.4 10.4-18 23.3-22.2 37.4L1 480.7c-2.5 8.4-.2 17.5 6.1 23.7s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L387.7 253.7 410.3 231zM160 399.4l-9.1 22.7c-4 3.1-8.5 5.4-13.3 6.9L59.4 452l23-78.1c1.4-4.9 3.8-9.4 6.9-13.3l22.7-9.1 0 32c0 8.8 7.2 16 16 16l32 0zM362.7 18.7L348.3 33.2 325.7 55.8 314.3 67.1l33.9 33.9 62.1 62.1 33.9 33.9 11.3-11.3 22.6-22.6 14.5-14.5c25-25 25-65.5 0-90.5L453.3 18.7c-25-25-65.5-25-90.5 0zm-47.4 168l-144 144c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l144-144c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6z" />
@@ -220,13 +246,11 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
-          <path
-            d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"
-            fill="currentColor"
-          />
+          <path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" />
         </svg>
       );
 
@@ -236,7 +260,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 640 640">
+          viewBox="0 0 640 640"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -252,7 +277,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 384 512">
+          viewBox="0 0 384 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -268,7 +294,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -284,13 +311,11 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
-          <path
-            d="M64 64C28.7 64 0 92.7 0 128l0 64C0 200.8 7.4 207.7 15.7 210.6 34.5 217.1 48 235 48 256s-13.5 38.9-32.3 45.4C7.4 304.3 0 311.2 0 320l0 64c0 35.3 28.7 64 64 64l448 0c35.3 0 64-28.7 64-64l0-64c0-8.8-7.4-15.7-15.7-18.6-18.8-6.5-32.3-24.4-32.3-45.4s13.5-38.9 32.3-45.4c8.3-2.9 15.7-9.8 15.7-18.6l0-64c0-35.3-28.7-64-64-64L64 64zM416 336l0-160-256 0 0 160 256 0zM112 160c0-17.7 14.3-32 32-32l288 0c17.7 0 32 14.3 32 32l0 192c0 17.7-14.3 32-32 32l-288 0c-17.7 0-32-14.3-32-32l0-192z"
-            fill="currentColor"
-          />
+          <path d="M64 64C28.7 64 0 92.7 0 128l0 64C0 200.8 7.4 207.7 15.7 210.6 34.5 217.1 48 235 48 256s-13.5 38.9-32.3 45.4C7.4 304.3 0 311.2 0 320l0 64c0 35.3 28.7 64 64 64l448 0c35.3 0 64-28.7 64-64l0-64c0-8.8-7.4-15.7-15.7-18.6-18.8-6.5-32.3-24.4-32.3-45.4s13.5-38.9 32.3-45.4c8.3-2.9 15.7-9.8 15.7-18.6l0-64c0-35.3-28.7-64-64-64L64 64zM416 336l0-160-256 0 0 160 256 0zM112 160c0-17.7 14.3-32 32-32l288 0c17.7 0 32 14.3 32 32l0 192c0 17.7-14.3 32-32 32l-288 0c-17.7 0-32-14.3-32-32l0-192z" />
         </svg>
       );
 
@@ -300,7 +325,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -316,7 +342,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -332,7 +359,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 640 512">
+          viewBox="0 0 640 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -342,29 +370,14 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
         </svg>
       );
 
-    case 'ui-user':
-      return (
-        <svg
-          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
-          width={width}
-          height={height}
-          viewBox="0 0 448 512">
-          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
-          {title && <title>{title}</title>}
-          <path
-            d="M224 248a120 120 0 1 0 0-240 120 120 0 1 0 0 240zm-29.7 56C95.8 304 16 383.8 16 482.3 16 498.7 29.3 512 45.7 512l356.6 0c16.4 0 29.7-13.3 29.7-29.7 0-98.5-79.8-178.3-178.3-178.3l-59.4 0z"
-            fill="currentColor"
-          />
-        </svg>
-      );
-
     case 'ui-wifi':
       return (
         <svg
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -380,7 +393,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 10.701 9.698">
+          viewBox="0 0 10.701 9.698"
+          fill={fill ?? 'currentColor'}>
           {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
           {title && <title>{title}</title>}
           <g id="filter-solid" transform="translate(-2.667 -5.333)">
@@ -406,7 +420,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 576 512">
+          viewBox="0 0 576 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -422,7 +437,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 640 512">
+          viewBox="0 0 640 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M381 114.9L186.1 41.8c-16.7-6.2-35.2-5.3-51.1 2.7L89.1 67.4C78 73 77.2 88.5 87.6 95.2l146.9 94.5L136 240 77.8 214.1c-8.7-3.9-18.8-3.7-27.3 .6L18.3 230.8c-9.3 4.7-11.8 16.8-5 24.7l73.1 85.3c6.1 7.1 15 11.2 24.3 11.2l137.7 0c5 0 9.9-1.2 14.3-3.4L535.6 212.2c46.5-23.3 82.5-63.3 100.8-112C645.9 75 627.2 48 600.2 48l-57.4 0c-20.2 0-40.2 4.8-58.2 14L381 114.9zM0 480c0 17.7 14.3 32 32 32l576 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 448c-17.7 0-32 14.3-32 32z" />
@@ -435,7 +451,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 640 512">
+          viewBox="0 0 640 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M.3 166.9L0 68C0 57.7 9.5 50.1 19.5 52.3l35.6 7.9c10.6 2.3 19.2 9.9 23 20L96 128l127.3 37.6L181.8 20.4C178.9 10.2 186.6 0 197.2 0l40.1 0c11.6 0 22.2 6.2 27.9 16.3l109 193.8 107.2 31.7c15.9 4.7 30.8 12.5 43.7 22.8l34.4 27.6c24 19.2 18.1 57.3-10.7 68.2c-41.2 15.6-86.2 18.1-128.8 7L121.7 289.8c-11.1-2.9-21.2-8.7-29.3-16.9L9.5 189.4c-5.9-6-9.3-14.1-9.3-22.5zM32 448l576 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 512c-17.7 0-32-14.3-32-32s14.3-32 32-32zm96-80a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm128-16a32 32 0 1 1 0 64 32 32 0 1 1 0-64z" />
@@ -448,7 +465,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 19 19">
+          viewBox="0 0 19 19"
+          fill={fill ?? 'currentColor'}>
           {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
           {title && <title>{title}</title>}
           <g id="Group_56" data-name="Group 56" transform="translate(-390 -665)">
@@ -472,7 +490,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -488,7 +507,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -504,7 +524,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -520,7 +541,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 448 512">
+          viewBox="0 0 448 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -536,7 +558,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -552,7 +575,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -568,7 +592,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path d="M448 256c0-106-86-192-192-192l0 384c106 0 192-86 192-192zM0 256a256 256 0 1 1 512 0 256 256 0 1 1 -512 0z" fill="currentColor" />
@@ -581,7 +606,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 512 512">
+          viewBox="0 0 512 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -597,7 +623,8 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
           width={width}
           height={height}
-          viewBox="0 0 384 512">
+          viewBox="0 0 384 512"
+          fill={fill ?? 'currentColor'}>
           <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
           {title && <title>{title}</title>}
           <path
@@ -607,6 +634,24 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
         </svg>
       );
 
+    case 'ui-other':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 640 512"
+          fill={fill ?? 'currentColor'}>
+          <HTMLComment text="!Font Awesome Free 6.7.2 - mars-and-venus" />
+          {title && <title>{title}</title>}
+
+          <path
+            d="M320 32c0-17.7 14.3-32 32-32l128 0c17.7 0 32 14.3 32 32l0 128c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-50.7-64.2 64.2c19.5 28.4 31 62.7 31 99.8 0 97.2-78.8 176-176 176S32 401.2 32 304s78.8-176 176-176c37.1 0 71.4 11.5 99.8 31l64.2-64.2L320 96c-17.7 0-32-14.3-32-32zM208 416a112 112 0 1 0 0-224 112 112 0 1 0 0 224z"
+            fill="currentColor"
+          />
+        </svg>
+      );
+
     case 'ui-facebook':
       return (
         <svg
@@ -703,22 +748,6 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
         </svg>
       );
 
-    case 'ui-suitcase':
-      return (
-        <svg
-          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
-          width={width}
-          height={height}
-          viewBox="0 0 512 512">
-          <HTMLComment text="!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc." />
-          {title && <title>{title}</title>}
-          <path
-            d="M200 48l112 0c4.4 0 8 3.6 8 8l0 40-128 0 0-40c0-4.4 3.6-8 8-8zm-56 8l0 424 224 0 0-424c0-30.9-25.1-56-56-56L200 0c-30.9 0-56 25.1-56 56zM416 96l0 384 32 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64l-32 0zM96 480l0-384-32 0C28.7 96 0 124.7 0 160L0 416c0 35.3 28.7 64 64 64l32 0z"
-            fill="currentColor"
-          />
-        </svg>
-      );
-
     case 'ui-bag':
       return (
         <svg
@@ -818,6 +847,238 @@ const Icon: React.FC<IconProps> = ({ name, className, title, width, height }) =>
           />
         </svg>
       );
+
+    case 'ui-excursion':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 384 512"
+          fill={fill ?? 'currentColor'}>
+          <HTMLComment text="!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M80.95 472.23c-4.28 17.16 6.14 34.53 23.28 38.81 2.61.66 5.22.95 7.8.95 14.33 0 27.37-9.7 31.02-24.23l25.24-100.97-52.78-52.78-34.56 138.22zm14.89-196.12L137 117c2.19-8.42-3.14-16.95-11.92-19.06-43.88-10.52-88.35 15.07-99.32 57.17L.49 253.24c-2.19 8.42 3.14 16.95 11.92 19.06l63.56 15.25c8.79 2.1 17.68-3.02 19.87-11.44zM368 160h-16c-8.84 0-16 7.16-16 16v16h-34.75l-46.78-46.78C243.38 134.11 228.61 128 212.91 128c-27.02 0-50.47 18.3-57.03 44.52l-26.92 107.72a32.012 32.012 0 0 0 8.42 30.39L224 397.25V480c0 17.67 14.33 32 32 32s32-14.33 32-32v-82.75c0-17.09-6.66-33.16-18.75-45.25l-46.82-46.82c.15-.5.49-.89.62-1.41l19.89-79.57 22.43 22.43c6 6 14.14 9.38 22.62 9.38h48v240c0 8.84 7.16 16 16 16h16c8.84 0 16-7.16 16-16V176c.01-8.84-7.15-16-15.99-16zM240 96c26.51 0 48-21.49 48-48S266.51 0 240 0s-48 21.49-48 48 21.49 48 48 48z" />
+        </svg>
+      );
+
+    case 'ui-group':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 640 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path
+            d="M72 88a56 56 0 1 1 112 0A56 56 0 1 1 72 88zM64 245.7C54 256.9 48 271.8 48 288s6 31.1 16 42.3l0-84.7zm144.4-49.3C178.7 222.7 160 261.2 160 304c0 34.3 12 65.8 32 90.5l0 21.5c0 17.7-14.3 32-32 32l-64 0c-17.7 0-32-14.3-32-32l0-26.8C26.2 371.2 0 332.7 0 288c0-61.9 50.1-112 112-112l32 0c24 0 46.2 7.5 64.4 20.3zM448 416l0-21.5c20-24.7 32-56.2 32-90.5c0-42.8-18.7-81.3-48.4-107.7C449.8 183.5 472 176 496 176l32 0c61.9 0 112 50.1 112 112c0 44.7-26.2 83.2-64 101.2l0 26.8c0 17.7-14.3 32-32 32l-64 0c-17.7 0-32-14.3-32-32zm8-328a56 56 0 1 1 112 0A56 56 0 1 1 456 88zM576 245.7l0 84.7c10-11.3 16-26.1 16-42.3s-6-31.1-16-42.3zM320 32a64 64 0 1 1 0 128 64 64 0 1 1 0-128zM240 304c0 16.2 6 31 16 42.3l0-84.7c-10 11.3-16 26.1-16 42.3zm144-42.3l0 84.7c10-11.3 16-26.1 16-42.3s-6-31.1-16-42.3zM448 304c0 44.7-26.2 83.2-64 101.2l0 42.8c0 17.7-14.3 32-32 32l-64 0c-17.7 0-32-14.3-32-32l0-42.8c-37.8-18-64-56.5-64-101.2c0-61.9 50.1-112 112-112l32 0c61.9 0 112 50.1 112 112z"
+            fill="currentColor"
+          />
+        </svg>
+      );
+
+    case 'ui-error':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 512 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24l0 112c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-112c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" />
+        </svg>
+      );
+
+    case 'ui-tel':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 512 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M164.9 24.6c-7.7-18.6-28-28.5-47.4-23.2l-88 24C12.1 30.2 0 46 0 64C0 311.4 200.6 512 448 512c18 0 33.8-12.1 38.6-29.5l24-88c5.3-19.4-4.6-39.7-23.2-47.4l-96-40c-16.3-6.8-35.2-2.1-46.3 11.6L304.7 368C234.3 334.7 177.3 277.7 144 207.3L193.3 167c13.7-11.2 18.4-30 11.6-46.3l-40-96z" />
+        </svg>
+      );
+
+    case 'ui-mail':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 512 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M48 64C21.5 64 0 85.5 0 112c0 15.1 7.1 29.3 19.2 38.4L236.8 313.6c11.4 8.5 27 8.5 38.4 0L492.8 150.4c12.1-9.1 19.2-23.3 19.2-38.4c0-26.5-21.5-48-48-48L48 64zM0 176L0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-208L294.4 339.2c-22.8 17.1-54 17.1-76.8 0L0 176z" />
+        </svg>
+      );
+
+    case 'ui-trashcan':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 448 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M135.2 17.7L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-7.2-14.3C307.4 6.8 296.3 0 284.2 0L163.8 0c-12.1 0-23.2 6.8-28.6 17.7zM416 128L32 128 53.2 467c1.6 25.3 22.6 45 47.9 45l245.8 0c25.3 0 46.3-19.7 47.9-45L416 128z" />
+        </svg>
+      );
+
+    case 'ui-payback':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 20 20.154">
+          {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
+          {title && <title>{title}</title>}
+          <g id="layer1" transform="translate(-205.148 -293.014)">
+            <path
+              id="path453469"
+              d="M223.472,306.895a1.674,1.674,0,0,0-1.188.487l-1.971,1.972a1.67,1.67,0,0,0-.978-.726l-4.652-1.247a2.766,2.766,0,0,0-2.182.331l-2.9,1.832-.235-.408a1.089,1.089,0,0,0-1.471-.394l-2.209,1.274a1.089,1.089,0,0,0-.394,1.471l3.291,5.7a1.088,1.088,0,0,0,1.47.4l2.209-1.276a1.09,1.09,0,0,0,.395-1.471l-.043-.076,1.258-.85,4.63.911a1.742,1.742,0,0,0,1.653-.514c1.493-1.527,2.988-3.048,4.505-4.544l0,0a1.675,1.675,0,0,0-1.189-2.863Zm0,1.332a.336.336,0,0,1,.238.1.323.323,0,0,1,0,.476c-1.525,1.5-3.024,3.031-4.518,4.559a1.847,1.847,0,0,1-.433.134l-4.9-.963a.672.672,0,0,0-.507.1l-1.411.954-1.667-2.886,2.947-1.858a1.411,1.411,0,0,1,1.118-.171l4.652,1.247a.336.336,0,1,1-.175.65l-2.92-.782a.672.672,0,0,0-.348,1.3l2.92.782a1.693,1.693,0,0,0,1.741-.572.672.672,0,0,0,.177-.118l2.85-2.852A.336.336,0,0,1,223.472,308.226Zm-15.14,1.812.325.564a.615.615,0,0,0,.253.438l2.445,4.235-1.745,1.008-3.024-5.237Z"
+              transform="translate(0 -4.554)"
+              fill-rule="evenodd"
+            />
+            <path
+              id="path453459"
+              d="M223.672,301.014a.672.672,0,1,0,0,1.344h1.344a.672.672,0,1,0,0-1.344Z"
+              transform="translate(-5.857 -2.625)"
+              fill-rule="evenodd"
+            />
+            <path
+              id="path453437"
+              d="M223.672,297.014a.672.672,0,0,0,0,1.344h1.344a.672.672,0,0,0,0-1.344Z"
+              transform="translate(-5.857 -1.312)"
+              fill-rule="evenodd"
+            />
+            <path
+              id="rect18334"
+              d="M222.7,293.014a4.7,4.7,0,1,0,4.7,4.7A4.714,4.714,0,0,0,222.7,293.014Zm0,1.344a3.359,3.359,0,1,1-3.359,3.359A3.349,3.349,0,0,1,222.7,294.357Z"
+              transform="translate(-4.217)"
+              fill-rule="evenodd"
+            />
+          </g>
+        </svg>
+      );
+
+    case 'ui-backpack':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 14.499 16.11">
+          {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
+          {title && <title>{title}</title>}
+          <path
+            id="Path_2"
+            data-name="Path 2"
+            d="M22.444,28.805A.805.805,0,0,0,21.639,28H16.806a.806.806,0,0,0-.806.806v1.611h6.444ZM16,32.027h6.444v2.417H16Z"
+            transform="translate(-11.972 -18.334)"
+          />
+          <path
+            id="Path_3"
+            data-name="Path 3"
+            d="M20.5,12.055a4.837,4.837,0,0,0-4.028-4.761V6.417A2.419,2.419,0,0,0,14.055,4H12.444a2.419,2.419,0,0,0-2.417,2.417v.878A4.837,4.837,0,0,0,6,12.055V18.5A1.613,1.613,0,0,0,7.611,20.11h.806V14.472a2.419,2.419,0,0,1,2.417-2.417h4.833a2.419,2.419,0,0,1,2.417,2.417V20.11h.806A1.613,1.613,0,0,0,20.5,18.5ZM11.639,6.417a.806.806,0,0,1,.806-.806h1.611a.805.805,0,0,1,.805.806v.806H11.639Z"
+            transform="translate(-6 -4)"
+          />
+        </svg>
+      );
+
+    case 'ui-business-lounge':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 20 19.999">
+          {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
+          {title && <title>{title}</title>}
+          <g id="waiting-room-svgrepo-com" transform="translate(0 -0.008)">
+            <g id="Group_46" data-name="Group 46" transform="translate(0 0.008)">
+              <g id="Group_45" data-name="Group 45" transform="translate(0)">
+                <path
+                  id="Path_33"
+                  data-name="Path 33"
+                  d="M65.683,110.007a1.667,1.667,0,1,0-1.667-1.667A1.666,1.666,0,0,0,65.683,110.007Z"
+                  transform="translate(-61.515 -102.507)"
+                />
+                <path
+                  id="Path_34"
+                  data-name="Path 34"
+                  d="M6.25,242.2H2.418L.824,235.025a.417.417,0,1,0-.814.181l1.657,7.455v2.454a.417.417,0,1,0,.833,0v-2.083H5v2.083a.417.417,0,1,0,.833,0v-2.083h.417a.417.417,0,0,0,0-.833Z"
+                  transform="translate(0 -225.532)"
+                />
+                <path
+                  id="Path_35"
+                  data-name="Path 35"
+                  d="M281.933.008a4.583,4.583,0,1,0,4.583,4.583A4.588,4.588,0,0,0,281.933.008Zm1.667,5h-1.667a.417.417,0,0,1-.417-.417v-2.5a.417.417,0,0,1,.833,0V4.175h1.25a.417.417,0,1,1,0,.833Z"
+                  transform="translate(-266.516 -0.008)"
+                />
+                <path
+                  id="Path_36"
+                  data-name="Path 36"
+                  d="M70.265,218.341H67.348v-3.333a1.667,1.667,0,0,0-3.333,0v4.583a1.251,1.251,0,0,0,1.25,1.25h3.75v2.917a1.25,1.25,0,1,0,2.5,0v-4.167A1.251,1.251,0,0,0,70.265,218.341Z"
+                  transform="translate(-61.514 -205.008)"
+                />
+              </g>
+            </g>
+          </g>
+        </svg>
+      );
+
+    case 'ui-shopping-bag':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 13.299 14.65">
+          {/* <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." /> */}
+          {title && <title>{title}</title>}
+          <path
+            id="Path_22"
+            data-name="Path 22"
+            d="M9.135.6A3.523,3.523,0,0,0,5.612,4.123V5.691A2.455,2.455,0,0,0,5,5.869,2.967,2.967,0,0,0,3.842,6.8,6.951,6.951,0,0,0,3,9.393c-.452,2.056-.678,3.083-.392,3.885A2.967,2.967,0,0,0,3.835,14.8c.721.451,1.774.451,3.878.451h2.843c2.1,0,3.157,0,3.878-.451a2.967,2.967,0,0,0,1.223-1.521c.285-.8.059-1.829-.392-3.885a6.951,6.951,0,0,0-.837-2.59,2.967,2.967,0,0,0-1.162-.934,2.456,2.456,0,0,0-.608-.178V4.123A3.523,3.523,0,0,0,9.135.6Zm2.411,5.012V4.123a2.411,2.411,0,0,0-4.821,0V5.612c.287,0,.613,0,.989,0h2.843C10.933,5.607,11.259,5.607,11.546,5.612ZM6.168,8.574a.742.742,0,1,0-.742-.742A.742.742,0,0,0,6.168,8.574Zm6.676-.742A.742.742,0,1,1,12.1,7.09.742.742,0,0,1,12.844,7.832Z"
+            transform="translate(-2.486 -0.6)"
+            fill-rule="evenodd"
+          />
+        </svg>
+      );
+
+    case 'ui-tooltip':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 512 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z" />
+        </svg>
+      );
+
+    case 'ui-qsm-location':
+      return (
+        <svg
+          className={['icon', `icon--${name}`, className].filter((className) => !isEmpty(className)).join(' ')}
+          width={width}
+          height={height}
+          viewBox="0 0 384 512">
+          <HTMLComment text="!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc." />
+          {title && <title>{title}</title>}
+          <path d="M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z" />
+        </svg>
+      );
+
     default:
       return null;
   }