@sanvika/ui 0.1.0

package/src/components/icons/FaLocationArrow.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaLocationArrow(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M492 0L0 220l124 44 44 124L512 20 492 0z" />
+    </svg>
+  );
+}

package/src/components/icons/FaMapMarkerAlt.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaMapMarkerAlt(props) {
+  return (
+    <svg viewBox="0 0 384 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M172.3 501.7C35.4 343.1 0 301.1 0 208 0 93 93 0 208 0s208 93 208 208c0 93.1-35.4 135.1-172.3 293.7-12 14-31.9 14-43.4 0zM208 272a64 64 0 1 0-64-64 64 64 0 0 0 64 64z" />
+    </svg>
+  );
+}

package/src/components/icons/FaMoon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaMoon(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" aria-hidden="true" {...props}>
+      <path d="M279.135 512c129.416 0 234.865-105.45 234.865-234.865 0-109.39-71.8-202.553-170.09-231.44-11.9-3.443-24.57 4.417-26.91 16.77-20.44 87.05-95.66 153.43-186.62 176.77-12.77 3.18-19.98 16.99-15.37 29.38 34.1 85.77 121.02 147.25 264.12 142.3z"/>
+    </svg>
+  );
+}

package/src/components/icons/FaPaperPlane.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaPaperPlane(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M476 3L12 232c-23 11-20 42 5 49l111 34 34 111c7 25 38 28 49 5L509 36c10-20-11-41-33-33z" />
+    </svg>
+  );
+}

package/src/components/icons/FaPaperclip.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaPaperclip(props) {
+  return (
+    <svg viewBox="0 0 448 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M43.03 466.5C16.3 439.78 5.2 400.6 15.7 366.4l168-416C189.6-14.9 214.6-9.7 223.8 9.9l26.4 61.5c9.9 23-4.8 50.5-29.7 50.5H192L83.4 213.9c-24.9 0-44.9 20.1-44.9 45s20 45 44.9 45H288c53 0 96 43 96 96s-43 96-96 96H160c-35.35 0-64-28.65-64-64V256" />
+    </svg>
+  );
+}

package/src/components/icons/FaSignInAlt.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaSignInAlt(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M192 96v64H80v192h112v64H48a48 48 0 0 1-48-48V144a48 48 0 0 1 48-48h144zm288 176L320 432c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9L372.1 288H160c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h212.1L263.5 177.5c-9.4-9.4-9.4-24.6 0-33.9L286.1 121c9.4-9.4 24.6-9.4 33.9 0l192 192c9.4 9.4 9.4 24.6 0 33.9z" />
+    </svg>
+  );
+}

package/src/components/icons/FaSmile.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaSmile(props) {
+  return (
+    <svg viewBox="0 0 496 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm-80 192a24 24 0 1 1 24-24 24 24 0 0 1-24 24zm160 0a24 24 0 1 1 24-24 24 24 0 0 1-24 24zm-80 160c-44.2 0-80-35.8-80-48h160c0 12.2-35.8 48-80 48z" />
+    </svg>
+  );
+}

package/src/components/icons/FaStar.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaStar(props) {
+  return (
+    <svg viewBox="0 0 576 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M259.3 17.8L194 150.2 47.9 171.5c-26.2 3.8-36.7 36-17.7 54.6l105.7 103L120 470.6c-4.5 26.3 23 46 46.4 33.7L288 405.3l121.6 63.9c23.4 12.3 50.9-7.4 46.4-33.7l-16-93.5 105.7-103c19-18.6 8.5-50.8-17.7-54.6L382 150.2 316.7 17.8c-11.7-23.6-45.6-23.9-57.4 0z" />
+    </svg>
+  );
+}

package/src/components/icons/FaTag.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaTag(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M497.9 225.9L286.1 14.1C277.7 5.7 266.1 0 253.9 0H80C35.8 0 0 35.8 0 80v173.9c0 12.2 5.7 23.8 14.1 32.2L225.9 497.9c17 17 44.6 17 61.6 0L497.9 287.5c17-17 17-44.6 0-61.6zM144 176a48 48 0 1 1 48-48 48 48 0 0 1-48 48z" />
+    </svg>
+  );
+}

package/src/components/icons/FaThumbsDown.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaThumbsDown(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M408 288h80a24 24 0 0 0 24-24V24a24 24 0 0 0-24-24h-80v288zM56 320c-6.6 11.3-8 24.4-3.9 36.8 8.8 25.8 36.2 49.2 74.7 49.2H192c-10.3 12.9-20.3 31.4-23.1 58.8-3.8 38 8.9 64 58.3 64 22.8 0 41.4-10.6 50.6-28.3C285.2 445.6 304 416 304 384V224H144c-11.8 0-22.8 4.4-30.6 12.4-14.9 14.7-19.2 38.7-12.4 63.6z" />
+    </svg>
+  );
+}

package/src/components/icons/FaThumbsUp.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaThumbsUp(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M104 224H24a24 24 0 0 0-24 24v240a24 24 0 0 0 24 24h80V224zM456 192c6.6-11.3 8-24.4 3.9-36.8-8.8-25.8-36.2-49.2-74.7-49.2H320c10.3-12.9 20.3-31.4 23.1-58.8 3.8-38-8.9-64-58.3-64-22.8 0-41.4 10.6-50.6 28.3C226.8 66.4 208 96 208 128v160h160c11.8 0 22.8-4.4 30.6-12.4 14.9-14.7 19.2-38.7 12.4-63.6z" />
+    </svg>
+  );
+}

package/src/components/icons/FaTrash.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaTrash(props) {
+  return (
+    <svg viewBox="0 0 448 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M32 464a48 48 0 0 0 48 48h288a48 48 0 0 0 48-48V128H32zM432 32H312l-9.4-18.8A24 24 0 0 0 279.1 0H168.9a24 24 0 0 0-23.5 13.2L136 32H16A16 16 0 0 0 0 48v16a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16V48a16 16 0 0 0-16-16z" />
+    </svg>
+  );
+}

package/src/components/icons/FaUser.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaUser(props) {
+  return (
+    <svg viewBox="0 0 448 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M313.6 304h-16.7a174.6 174.6 0 0 1-145.8 0H134.4A134.4 134.4 0 0 0 0 438.4V464a48 48 0 0 0 48 48h352a48 48 0 0 0 48-48v-25.6A134.4 134.4 0 0 0 313.6 304zM224 256a128 128 0 1 0-128-128 128 128 0 0 0 128 128z" />
+    </svg>
+  );
+}

package/src/components/icons/FaUserCircle.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function FaUserCircle(props) {
+  return (
+    <svg viewBox="0 0 496 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 120a88 88 0 1 1-88 88 88 88 0 0 1 88-88zm0 312c-59.6 0-112.9-29.6-146.6-74.6 6.2-45.6 91-70.6 146.6-70.6s140.4 25 146.6 70.6C360.9 410.4 307.6 440 248 440z" />
+    </svg>
+  );
+}

package/src/components/icons/FacebookIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const FacebookIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M22 12.07C22 6.48 17.52 2 11.93 2S2 6.48 2 12.07c0 4.99 3.66 9.128 8.438 9.878v-6.99H7.897v-2.888h2.541V9.845c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.196 2.238.196v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562v1.875h2.773l-.443 2.888h-2.33v6.99C18.34 21.198 22 17.062 22 12.07z" />
+  </svg>
+);
+
+export default FacebookIcon;

package/src/components/icons/HalfMoonIcon.jsx

@@ -0,0 +1,18 @@
+import React from "react";
+
+const HalfMoonIcon = ({ className, style }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    fill="currentColor"
+    aria-hidden="true"
+    className={className}
+    style={style}
+  >
+    <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79Z"/>
+  </svg>
+);
+
+export default HalfMoonIcon;

package/src/components/icons/HeartIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export const HeartIcon = ({ className, style, title = "Favorite" }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" className={className} style={style} role="img">
+    <title>{title}</title>
+    <path d="M12 21s-7-4.35-10-7.045C-0.334 10.668 3.213 4 8 4c2.206 0 3.813 1.093 4 2.09C12.187 5.093 13.794 4 16 4c4.787 0 8.334 6.668 6 9.955C19 16.65 12 21 12 21z" />
+  </svg>
+);
+export default HeartIcon;

package/src/components/icons/InstagramIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const InstagramIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M7 2C4.243 2 2 4.243 2 7v10c0 2.757 2.243 5 5 5h10c2.757 0 5-2.243 5-5V7c0-2.757-2.243-5-5-5H7zm10 3a1 1 0 110 2 1 1 0 010-2zM12 7a5 5 0 110 10 5 5 0 010-10z" />
+  </svg>
+);
+
+export default InstagramIcon;

package/src/components/icons/LinkedInIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const LinkedInIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M4.98 3.5C4.98 4.88 3.86 6 2.5 6S0 4.88 0 3.5 1.12 1 2.5 1s2.48 1.12 2.48 2.5zM.5 8h4V24h-4V8zM8.5 8h3.83v2.18h.05c.53-1 1.83-2.18 3.77-2.18 4.03 0 4.77 2.65 4.77 6.1V24h-4v-7.1c0-1.69-.03-3.87-2.36-3.87-2.36 0-2.72 1.84-2.72 3.74V24h-4V8z" />
+  </svg>
+);
+
+export default LinkedInIcon;

package/src/components/icons/MapMarkerIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export const MapMarkerIcon = ({ className, style, title = "Location" }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" className={className} style={style} role="img">
+    <title>{title}</title>
+    <path d="M12 2C8.14 2 5 5.14 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.86-3.14-7-7-7zm0 9.5A2.5 2.5 0 1112 6.5a2.5 2.5 0 010 5z" />
+  </svg>
+);
+export default MapMarkerIcon;

package/src/components/icons/MdWbSunny.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function MdWbSunny(props) {
+  return (
+    <svg viewBox="0 0 512 512" width="1em" height="1em" fill="currentColor" {...props}>
+      <path d="M256 128a128 128 0 1 0 128 128A128 128 0 0 0 256 128zm0-96a16 16 0 0 0 16-16V16a16 16 0 0 0-32 0v.02A16 16 0 0 0 256 32zM256 480a16 16 0 0 0-16 16v16a16 16 0 0 0 32 0v-16a16 16 0 0 0-16-16zM480 240a16 16 0 0 0 16 16h16a16 16 0 0 0 0-32h-16a16 16 0 0 0-16 16zM16 240a16 16 0 0 0 16 16H48a16 16 0 0 0 0-32H32A16 16 0 0 0 16 240z" />
+    </svg>
+  );
+}

package/src/components/icons/ReFreshIcon.jsx

@@ -0,0 +1,49 @@
+// src/components/icons/ReFreshIcon.jsx
+import React from "react";
+
+// Variant D: Twin arrows forming a bold ring — prominent circular motion icon.
+const ReFreshIcon = ({ className, style }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    aria-hidden="true"
+    className={className}
+    style={style}
+  >
+    <path
+      d="M4 12a8 8 0 0113-6"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2.2"
+      strokeLinecap="round"
+    />
+    <path
+      d="M17 6 l2-2 l-1 4"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2.2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+
+    <path
+      d="M20 12a8 8 0 01-13 6"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2.2"
+      strokeLinecap="round"
+    />
+    <path
+      d="M7 18 l-2 2 l1-4"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2.2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+export default ReFreshIcon;

package/src/components/icons/SearchIcon.jsx

@@ -0,0 +1,20 @@
+// src/components/icons/SearchIcon.jsx
+import React from "react";
+
+export const SearchIcon = ({ className, style, title = "Search" }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    fill="currentColor"
+    aria-hidden="true"
+    className={className}
+    style={style}
+    role="img"
+  >
+    <title>{title}</title>
+    <path d="M10 2a8 8 0 105.293 14.293l4.707 4.707 1.414-1.414-4.707-4.707A8 8 0 0010 2zm0 2a6 6 0 110 12A6 6 0 0110 4z" />
+  </svg>
+);
+export default SearchIcon;

package/src/components/icons/StarIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export const StarIcon = ({ className, style, title = "Star" }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" className={className} style={style} role="img">
+    <title>{title}</title>
+    <path d="M12 .587l3.668 7.431L23.6 9.75l-5.8 5.655L19.335 24 12 20.09 4.665 24 6.2 15.405 0.4 9.75l7.932-1.732L12 .587z" />
+  </svg>
+);
+export default StarIcon;

package/src/components/icons/TelegramIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const TelegramIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M9.036 15.803l-.377 5.313c.54 0 .774-.232 1.054-.51l2.53-2.422 5.24 3.842c.961.53 1.643.25 1.906-.891l3.454-16.158c.352-1.643-.629-2.281-1.644-1.877L1.12 10.177C-.485 10.83-.46 11.742.848 12.144l5.87 1.83L18.92 6.38c.553-.362 1.058-.162.644.2" />
+  </svg>
+);
+
+export default TelegramIcon;

package/src/components/icons/TwitterIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const TwitterIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M22.46 6c-.77.35-1.6.58-2.46.69a4.3 4.3 0 001.88-2.37 8.59 8.59 0 01-2.72 1.04 4.28 4.28 0 00-7.29 3.9A12.14 12.14 0 013 4.79a4.28 4.28 0 001.33 5.71c-.66-.02-1.28-.2-1.82-.5v.05c0 2.04 1.45 3.74 3.37 4.12-.35.1-.72.15-1.1.15-.27 0-.53-.03-.78-.07a4.29 4.29 0 003.99 2.98A8.6 8.6 0 012 19.54a12.13 12.13 0 006.56 1.92c7.87 0 12.18-6.52 12.18-12.18v-.56A8.7 8.7 0 0022.46 6z" />
+  </svg>
+);
+
+export default TwitterIcon;

package/src/components/icons/UserIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export const UserIcon = ({ className, style, title = "User" }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" className={className} style={style} role="img">
+    <title>{title}</title>
+    <path d="M12 12a5 5 0 100-10 5 5 0 000 10zm0 2c-4.418 0-8 2.239-8 5v1h16v-1c0-2.761-3.582-5-8-5z" />
+  </svg>
+);
+export default UserIcon;

package/src/components/icons/WhatsappIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const WhatsappIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M20.52 3.48A11.93 11.93 0 0012 .5 11.94 11.94 0 003.48 3.48 11.94 11.94 0 000 12c0 2.1.55 4.16 1.6 5.98L0 24l6.32-1.66A11.94 11.94 0 0012 24c2.1 0 4.16-.55 5.98-1.6A11.94 11.94 0 0024 12a11.93 11.93 0 00-3.48-8.52zM12 21.5c-1.55 0-3.07-.38-4.42-1.12l-.32-.18-3.76 1 1.02-3.67-.21-.36A8.45 8.45 0 013.5 12c0-4.69 3.81-8.5 8.5-8.5S20.5 7.31 20.5 12 16.69 21.5 12 21.5zM16.5 14.5c-.27-.13-1.6-.79-1.85-.88-.25-.09-.43-.13-.62.13s-.71.88-.87 1.06c-.16.18-.32.2-.6.07-.27-.13-1.13-.42-2.15-1.33-.79-.71-1.32-1.58-1.48-1.86-.16-.28-.02-.43.12-.56.12-.12.27-.32.4-.48.13-.16.17-.27.27-.45.09-.18.05-.34-.02-.47-.07-.13-.62-1.5-.85-2.05-.22-.53-.45-.46-.62-.47l-.53-.01c-.18 0-.47.07-.72.34-.25.27-.96.94-.96 2.29 0 1.35.98 2.66 1.12 2.85.14.18 1.95 3.02 4.73 4.24 3.28 1.5 3.28 1 3.87.94.59-.07 1.92-.78 2.19-1.53.27-.75.27-1.39.19-1.53-.08-.14-.52-.22-.79-.35z" />
+  </svg>
+);
+
+export default WhatsappIcon;

package/src/components/icons/YoutubeIcon.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+const YoutubeIcon = ({ className, style }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em" fill="currentColor" className={className} style={style} aria-hidden="true">
+    <path d="M23 7.001a2.9 2.9 0 00-2.042-2.05C19.24 4.5 12 4.5 12 4.5s-7.241 0-8.958.451A2.9 2.9 0 001 7.001 29.24 29.24 0 001 12a29.24 29.24 0 00.042 4.999 2.9 2.9 0 002.042 2.05C4.759 19.5 12 19.5 12 19.5s7.241 0 8.958-.451A2.9 2.9 0 0023 16.999 29.24 29.24 0 0023 12a29.24 29.24 0 00-.042-4.999zM10 15.5v-7l6 3.5-6 3.5z" />
+  </svg>
+);
+
+export default YoutubeIcon;

package/src/components/icons/index.js

@@ -0,0 +1,60 @@
+// src/components/icons/index.js
+// SSOT: All icons exported from custom SVG files only.
+// NO react-icons direct re-exports here — use custom .jsx files for all icons.
+
+export { default as FaCheckCircle } from "./FaCheckCircle.jsx";
+export { default as FaStar } from "./FaStar.jsx";
+export { default as FaEye } from "./FaEye.jsx";
+export { default as FaEyeSlash } from "./FaEyeSlash.jsx";
+export { default as FaTrash } from "./FaTrash.jsx";
+export { default as FaUser } from "./FaUser.jsx";
+export { default as FaCalendarAlt } from "./FaCalendarAlt.jsx";
+export { default as FaThumbsUp } from "./FaThumbsUp.jsx";
+export { default as FaThumbsDown } from "./FaThumbsDown.jsx";
+export { default as FaAngleRight } from "./FaAngleRight.jsx";
+export { default as FaMapMarkerAlt } from "./FaMapMarkerAlt.jsx";
+export { default as FaAngleDown } from "./FaAngleDown.jsx";
+export { default as FaLocationArrow } from "./FaLocationArrow.jsx";
+export { default as FaCheck } from "./FaCheck.jsx";
+export { default as FaCheckDouble } from "./FaCheckDouble.jsx";
+export { default as FaPaperPlane } from "./FaPaperPlane.jsx";
+export { default as FaSmile } from "./FaSmile.jsx";
+export { default as FaPaperclip } from "./FaPaperclip.jsx";
+export { default as FaCircle } from "./FaCircle.jsx";
+export { default as FaArrowUp } from "./FaArrowUp.jsx";
+export { default as FaArrowDown } from "./FaArrowDown.jsx";
+export { default as FaUserCircle } from "./FaUserCircle.jsx";
+export { default as FaChevronRight } from "./FaChevronRight.jsx";
+export { default as FaChevronDown } from "./FaChevronDown.jsx";
+export { default as FaComments } from "./FaComments.jsx";
+export { default as FaStarButton } from "./FaStar.jsx";
+export { default as FaArrowLeft } from "./FaArrowLeft.jsx";
+export { default as FaBell } from "./FaBell.jsx";
+export { default as FaTag } from "./FaTag.jsx";
+export { default as FaMapMarker } from "./FaMapMarkerAlt.jsx";
+export { default as FaHome } from "./FaHome.jsx";
+export { default as FaUserIcon } from "./FaUser.jsx";
+export { default as FaMoon } from "./FaMoon.jsx";
+export { default as MdWbSunny } from "./MdWbSunny.jsx";
+export { default as FaSignInAlt } from "./FaSignInAlt.jsx";
+export { default as FaBullhorn } from "./FaBullhorn.jsx";
+export { default as SearchIcon } from "./SearchIcon";
+export { default as BellIcon } from "./BellIcon";
+export { default as MapMarkerIcon } from "./MapMarkerIcon";
+export { default as UserIcon } from "./UserIcon";
+export { default as HeartIcon } from "./HeartIcon";
+export { default as StarIcon } from "./StarIcon";
+export { default as FacebookIcon } from "./FacebookIcon";
+export { default as InstagramIcon } from "./InstagramIcon";
+export { default as YoutubeIcon } from "./YoutubeIcon";
+export { default as RefreshIcon } from "./ReFreshIcon";
+export { default as SyncIcon } from "./ReFreshIcon";
+export { default as ChevronDown } from "./ChevronDown";
+export { default as TwitterIcon } from "./TwitterIcon";
+export { default as WhatsappIcon } from "./WhatsappIcon";
+export { default as FaKeyboard } from "./FaKeyboard.jsx";
+export { default as LinkedInIcon } from "./LinkedInIcon.jsx";
+export { default as TelegramIcon } from "./TelegramIcon.jsx";
+export { default as HalfMoonIcon } from "./HalfMoonIcon.jsx";
+export { default as EmailIcon } from "./EmailIcon.jsx";
+

package/src/components/layout/Footer.jsx

@@ -0,0 +1,142 @@
+// src/components/layout/Footer.jsx
+import styles from "@/styles/components/layouts/Footer.module.css";
+
+const DEFAULT_LEGAL_LINKS = [
+  { href: "/about", label: "About" },
+  { href: "/contact", label: "Contact" },
+  { href: "/legal/privacy-policy", label: "Privacy" },
+  { href: "/legal/terms-of-use", label: "Terms" },
+  { href: "/sitemap", label: "Sitemap" },
+];
+
+const DEFAULT_SOCIAL_LINKS = [
+  {
+    href: "https://www.facebook.com/sanvikaproduction",
+    label: "Visit our Facebook page",
+    type: "facebook",
+  },
+  {
+    href: "https://www.instagram.com/sanvikaproduction",
+    label: "Visit our Instagram page",
+    type: "instagram",
+  },
+  {
+    href: "https://www.youtube.com/@SanvikaProduction",
+    label: "Visit our YouTube channel",
+    type: "youtube",
+  },
+];
+
+/**
+ * Footer — pure props-driven, no Next.js router dependency.
+ *
+ * @param {Array<{href: string, label: string}>} [legalLinks]
+ * @param {Array<{href: string, label: string, type: string}>} [socialLinks]
+ * @param {string} [trustBadgeHref]
+ * @param {string} [trustText]
+ */
+const Footer = ({
+  legalLinks = DEFAULT_LEGAL_LINKS,
+  socialLinks = DEFAULT_SOCIAL_LINKS,
+  trustBadgeHref = "/legal/legal-info",
+  trustText = "D-U-N-S® Verified · Sanvika Production",
+}) => {
+  return (
+    <footer className={styles.footer}>
+      <div className={styles.content}>
+        {/* Social icons */}
+        <div className={styles.social}>
+          {socialLinks.map(({ href, label, type }) => (
+            <a
+              key={href}
+              href={href}
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label={label}
+              className={`${styles.socialLink} ${styles[type] ?? ""}`}
+            >
+              <SocialIcon name={type} />
+            </a>
+          ))}
+        </div>
+
+        {/* Legal links */}
+        <nav aria-label="Footer navigation">
+          <ul className={styles.links}>
+            {legalLinks.map(({ href, label }) => (
+              <li key={href}>
+                <a href={href} className={styles.link}>
+                  {label}
+                </a>
+              </li>
+            ))}
+          </ul>
+        </nav>
+
+        {/* Trust badge */}
+        <p className={styles.trust}>
+          <a href={trustBadgeHref} className={styles.trustBadge}>
+            <span className={styles.checkIcon}>✓</span>
+            <span>{trustText}</span>
+          </a>
+        </p>
+      </div>
+    </footer>
+  );
+};
+
+/* Inline SVG social icons — no external dependency */
+const SocialIcon = ({ name }) => {
+  if (name === "facebook") {
+    return (
+      <svg
+        viewBox="0 0 24 24"
+        width="1em"
+        height="1em"
+        fill="currentColor"
+        aria-hidden="true"
+      >
+        <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z" />
+      </svg>
+    );
+  }
+  if (name === "instagram") {
+    return (
+      <svg
+        viewBox="0 0 24 24"
+        width="1em"
+        height="1em"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        aria-hidden="true"
+      >
+        <rect x="2" y="2" width="20" height="20" rx="5" ry="5" />
+        <circle cx="12" cy="12" r="4" />
+        <circle cx="17.5" cy="6.5" r="0.5" fill="currentColor" stroke="none" />
+      </svg>
+    );
+  }
+  if (name === "youtube") {
+    return (
+      <svg
+        viewBox="0 0 24 24"
+        width="1em"
+        height="1em"
+        fill="currentColor"
+        aria-hidden="true"
+      >
+        <path d="M22.54 6.42a2.78 2.78 0 0 0-1.95-1.97C18.88 4 12 4 12 4s-6.88 0-8.59.45A2.78 2.78 0 0 0 1.46 6.42 29 29 0 0 0 1 12a29 29 0 0 0 .46 5.58A2.78 2.78 0 0 0 3.41 19.6C5.12 20 12 20 12 20s6.88 0 8.59-.4a2.78 2.78 0 0 0 1.95-1.97A29 29 0 0 0 23 12a29 29 0 0 0-.46-5.58z" />
+        <polygon
+          points="9.75 15.02 15.5 12 9.75 8.98 9.75 15.02"
+          fill="var(--nav-bg, #fff)"
+        />
+      </svg>
+    );
+  }
+  return null;
+};
+
+export default Footer;

package/src/components/layout/Navbar.jsx

@@ -0,0 +1,65 @@
+"use client";
+// src/components/layout/Navbar.jsx
+import { useTheme } from "@/context/ThemeContext";
+import styles from "@/styles/components/layouts/Navbar.module.css";
+
+const DEFAULT_NAV_LINKS = [{ href: "/", label: "Home" }];
+
+const SunIcon = () => <span aria-hidden="true">☀️</span>;
+const MoonIcon = () => <span aria-hidden="true">🌙</span>;
+
+/**
+ * Navbar — pure props-driven, no Next.js router dependency.
+ *
+ * @param {Array<{href: string, label: string}>} [navLinks]
+ * @param {string} [activePath] - marks which nav link as active
+ * @param {string} [logoText]
+ * @param {string} [logoHref]
+ */
+const Navbar = ({
+  navLinks = DEFAULT_NAV_LINKS,
+  activePath = "/",
+  logoText = "Sanvika",
+  logoHref = "/",
+}) => {
+  const { theme, toggleTheme } = useTheme();
+
+  return (
+    <header className={styles.header}>
+      {/* Left: Logo */}
+      <a href={logoHref} className={styles.logo} aria-label={`${logoText} — Home`}>
+        <span className={styles.logoText}>{logoText}</span>
+      </a>
+
+      {/* Center: Navigation */}
+      <nav aria-label="Main navigation">
+        <ul className={styles.nav}>
+          {navLinks.map(({ href, label }) => (
+            <li key={href}>
+              <a
+                href={href}
+                className={`${styles.navLink} ${activePath === href ? styles.navLinkActive : ""}`}
+              >
+                {label}
+              </a>
+            </li>
+          ))}
+        </ul>
+      </nav>
+
+      {/* Right: Actions */}
+      <div className={styles.right}>
+        <button
+          className={styles.themeToggle}
+          onClick={toggleTheme}
+          aria-label={`Switch to ${theme === "dark" ? "light" : "dark"} mode`}
+          title={`Switch to ${theme === "dark" ? "light" : "dark"} mode`}
+        >
+          {theme === "dark" ? <SunIcon /> : <MoonIcon />}
+        </button>
+      </div>
+    </header>
+  );
+};
+
+export default Navbar;