@qite/tide-booking-component 1.4.2 → 1.4.5

package/src/booking-product/components/icon.tsx

@@ -1,251 +1,251 @@
-import { isEmpty } from "lodash";
-import React, { useContext } from "react";
-import SettingsContext from "../settings-context";
-import HTMLComment from "react-html-comment";
-
-interface IconProps {
-  name: string;
-  className?: string;
-  title?: string;
-  width?: number;
-  height?: number;
-}
-
-const Icon: React.FC<IconProps> = ({
-  name,
-  className,
-  title,
-  width,
-  height,
-}) => {
-  const { icons } = useContext(SettingsContext);
-
-  if (icons) {
-    return (
-      <svg
-        className={["icon", `icon--${name}`, className]
-          .filter((className) => !isEmpty(className))
-          .join(" ")}
-        width={width}
-        height={height}
-      >
-        {title && <title>{title}</title>}
-        <use href={`${icons}#${name}`}></use>
-      </svg>
-    );
-  }
-
-  switch (name) {
-    case "ui-close":
-      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="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" />
-        </svg>
-      );
-
-    case "ui-plus":
-      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="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" />
-        </svg>
-      );
-
-    case "ui-min":
-      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="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" />
-        </svg>
-      );
-
-    case "ui-chevron":
-      return (
-        <svg
-          className={["icon", `icon--${name}`, className]
-            .filter((className) => !isEmpty(className))
-            .join(" ")}
-          width={width}
-          height={height}
-          viewBox="0 0 320 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="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>
-      );
-
-    case "ui-calendar":
-      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="M96 32l0 32L48 64C21.5 64 0 85.5 0 112l0 48 448 0 0-48c0-26.5-21.5-48-48-48l-48 0 0-32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 32L160 64l0-32c0-17.7-14.3-32-32-32S96 14.3 96 32zM448 192L0 192 0 464c0 26.5 21.5 48 48 48l352 0c26.5 0 48-21.5 48-48l0-272z" />
-        </svg>
-      );
-
-    case "ui-bed":
-      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="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" />
-        </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"
-        >
-          <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" />
-        </svg>
-      );
-
-    case "ui-transfer":
-      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="M192 0c-17.7 0-32 14.3-32 32l0 32 0 .2c-38.6 2.2-72.3 27.3-85.2 64.1L39.6 228.8C16.4 238.4 0 261.3 0 288L0 432l0 48c0 17.7 14.3 32 32 32l32 0c17.7 0 32-14.3 32-32l0-48 320 0 0 48c0 17.7 14.3 32 32 32l32 0c17.7 0 32-14.3 32-32l0-48 0-144c0-26.7-16.4-49.6-39.6-59.2L437.2 128.3c-12.9-36.8-46.6-62-85.2-64.1l0-.2 0-32c0-17.7-14.3-32-32-32L192 0zM165.4 128l181.2 0c13.6 0 25.7 8.6 30.2 21.4L402.9 224l-293.8 0 26.1-74.6c4.5-12.8 16.6-21.4 30.2-21.4zM96 288a32 32 0 1 1 0 64 32 32 0 1 1 0-64zm288 32a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" />
-        </svg>
-      );
-
-    case "ui-star":
-      return (
-        <svg
-          className={["icon", `icon--${name}`, className]
-            .filter((className) => !isEmpty(className))
-            .join(" ")}
-          width={width}
-          height={height}
-          viewBox="0 0 576 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="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" />
-        </svg>
-      );
-
-    case "ui-halfstar":
-      return (
-        <svg
-          className={["icon", `icon--${name}`, className]
-            .filter((className) => !isEmpty(className))
-            .join(" ")}
-          width={width}
-          height={height}
-          viewBox="0 0 576 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="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" />
-        </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 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" />
-        </svg>
-      );
-
-    case "ui-pencil":
-      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="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" />
-        </svg>
-      );
-
-    case "ui-check":
-      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="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>
-      );
-    default:
-      return null;
-  }
-};
-
-export default Icon;
+import { isEmpty } from "lodash";
+import React, { useContext } from "react";
+import SettingsContext from "../settings-context";
+import HTMLComment from "react-html-comment";
+
+interface IconProps {
+  name: string;
+  className?: string;
+  title?: string;
+  width?: number;
+  height?: number;
+}
+
+const Icon: React.FC<IconProps> = ({
+  name,
+  className,
+  title,
+  width,
+  height,
+}) => {
+  const { icons } = useContext(SettingsContext);
+
+  if (icons) {
+    return (
+      <svg
+        className={["icon", `icon--${name}`, className]
+          .filter((className) => !isEmpty(className))
+          .join(" ")}
+        width={width}
+        height={height}
+      >
+        {title && <title>{title}</title>}
+        <use href={`${icons}#${name}`}></use>
+      </svg>
+    );
+  }
+
+  switch (name) {
+    case "ui-close":
+      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="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" />
+        </svg>
+      );
+
+    case "ui-plus":
+      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="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" />
+        </svg>
+      );
+
+    case "ui-min":
+      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="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" />
+        </svg>
+      );
+
+    case "ui-chevron":
+      return (
+        <svg
+          className={["icon", `icon--${name}`, className]
+            .filter((className) => !isEmpty(className))
+            .join(" ")}
+          width={width}
+          height={height}
+          viewBox="0 0 320 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="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>
+      );
+
+    case "ui-calendar":
+      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="M96 32l0 32L48 64C21.5 64 0 85.5 0 112l0 48 448 0 0-48c0-26.5-21.5-48-48-48l-48 0 0-32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 32L160 64l0-32c0-17.7-14.3-32-32-32S96 14.3 96 32zM448 192L0 192 0 464c0 26.5 21.5 48 48 48l352 0c26.5 0 48-21.5 48-48l0-272z" />
+        </svg>
+      );
+
+    case "ui-bed":
+      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="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" />
+        </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"
+        >
+          <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" />
+        </svg>
+      );
+
+    case "ui-transfer":
+      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="M192 0c-17.7 0-32 14.3-32 32l0 32 0 .2c-38.6 2.2-72.3 27.3-85.2 64.1L39.6 228.8C16.4 238.4 0 261.3 0 288L0 432l0 48c0 17.7 14.3 32 32 32l32 0c17.7 0 32-14.3 32-32l0-48 320 0 0 48c0 17.7 14.3 32 32 32l32 0c17.7 0 32-14.3 32-32l0-48 0-144c0-26.7-16.4-49.6-39.6-59.2L437.2 128.3c-12.9-36.8-46.6-62-85.2-64.1l0-.2 0-32c0-17.7-14.3-32-32-32L192 0zM165.4 128l181.2 0c13.6 0 25.7 8.6 30.2 21.4L402.9 224l-293.8 0 26.1-74.6c4.5-12.8 16.6-21.4 30.2-21.4zM96 288a32 32 0 1 1 0 64 32 32 0 1 1 0-64zm288 32a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" />
+        </svg>
+      );
+
+    case "ui-star":
+      return (
+        <svg
+          className={["icon", `icon--${name}`, className]
+            .filter((className) => !isEmpty(className))
+            .join(" ")}
+          width={width}
+          height={height}
+          viewBox="0 0 576 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="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" />
+        </svg>
+      );
+
+    case "ui-halfstar":
+      return (
+        <svg
+          className={["icon", `icon--${name}`, className]
+            .filter((className) => !isEmpty(className))
+            .join(" ")}
+          width={width}
+          height={height}
+          viewBox="0 0 576 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="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" />
+        </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 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" />
+        </svg>
+      );
+
+    case "ui-pencil":
+      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="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" />
+        </svg>
+      );
+
+    case "ui-check":
+      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="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>
+      );
+    default:
+      return null;
+  }
+};
+
+export default Icon;

package/src/booking-product/components/rating.tsx

@@ -1,21 +1,21 @@
-import React from "react";
-import { clamp, range } from "lodash";
-import Icon from "./icon";
-
-interface RatingProps {
-  rating: number;
-}
-
-const Rating: React.FC<RatingProps> = ({ rating }) => {
-  const clampedRating = clamp(rating, 0, 5);
-  return (
-    <div className="rating">
-      {range(0, Math.floor(clampedRating)).map((i) => (
-        <Icon name="ui-star" key={`rating-star-${i}`} width={25} height={25} />
-      ))}
-      {rating % 1 > 0 && <Icon name="ui-halfstar" width={25} height={25} />}
-    </div>
-  );
-};
-
-export default Rating;
+import React from "react";
+import { clamp, range } from "lodash";
+import Icon from "./icon";
+
+interface RatingProps {
+  rating: number;
+}
+
+const Rating: React.FC<RatingProps> = ({ rating }) => {
+  const clampedRating = clamp(rating, 0, 5);
+  return (
+    <div className="rating">
+      {range(0, Math.floor(clampedRating)).map((i) => (
+        <Icon name="ui-star" key={`rating-star-${i}`} width={25} height={25} />
+      ))}
+      {rating % 1 > 0 && <Icon name="ui-halfstar" width={25} height={25} />}
+    </div>
+  );
+};
+
+export default Rating;