virtual-ui-lib 1.0.27 → 1.0.29

package/dist/index.js

@@ -35,6 +35,7 @@ __export(index_exports, {
   CopyButton: () => CopyButton,
   Dropdown: () => Dropdown,
   EmptyState: () => EmptyState,
+  Footer: () => Footer,
   FormInput: () => FormInput,
   GridLayout: () => GridLayout,
   ImageUploadPreview: () => ImageUploadPreview,
@@ -42,7 +43,8 @@ __export(index_exports, {
   Navbar: () => Navbar,
   OTPInput: () => OTPInput,
   RatingStars: () => RatingStars,
-  UserAvatar: () => UserAvatar
+  UserAvatar: () => UserAvatar,
+  WishlistButton: () => WishlistButton
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -828,6 +830,51 @@ var Navbar = ({
     margin: "15px 0"
   } }, link.name)))));
 };
+
+// src/components/WishlistButton/WishlistButton.jsx
+var import_react15 = __toESM(require("react"));
+var WishlistButton = ({
+  isActive = false,
+  size = "40px",
+  inactiveColor = "#d1d5db",
+  activeColor = "#ff3e30",
+  onToggle
+}) => {
+  const [active, setActive] = (0, import_react15.useState)(isActive);
+  const handleClick = () => {
+    setActive((prev) => !prev);
+    if (onToggle) onToggle(!active);
+  };
+  return /* @__PURE__ */ import_react15.default.createElement("div", { onClick: handleClick, style: { cursor: "pointer", width: size, height: size, display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ import_react15.default.createElement(
+    "svg",
+    {
+      width: "100%",
+      height: "100%",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      style: {
+        transition: "transform 0.2s",
+        transform: active ? "scale(1.2)" : "scale(1)",
+        fill: active ? activeColor : inactiveColor
+      }
+    },
+    /* @__PURE__ */ import_react15.default.createElement("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" })
+  ));
+};
+
+// src/components/Footer/Footer.jsx
+var import_react16 = __toESM(require("react"));
+var Footer = ({
+  bg = "#1e293b",
+  textColor = "#f1f5f9",
+  links = [{ text: "Home", url: "/" }, { text: "About", url: "/about" }, { text: "Services", url: "/services" }, { text: "Contact", url: "/contact" }],
+  brandTitle = "Company Name",
+  description = "Your reliable partner in success.",
+  socialLinks = [{ icon: "\u{1F3E0}", url: "https://facebook.com" }, { icon: "\u{1F426}", url: "https://twitter.com" }, { icon: "\u{1F4F8}", url: "https://instagram.com" }]
+}) => {
+  return /* @__PURE__ */ import_react16.default.createElement("footer", { style: { background: bg, color: textColor, padding: "20px 40px", fontFamily: "system-ui, sans-serif" } }, /* @__PURE__ */ import_react16.default.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ import_react16.default.createElement("h2", { style: { margin: "0 0 10px", fontSize: "24px", fontWeight: "700" } }, brandTitle), /* @__PURE__ */ import_react16.default.createElement("p", { style: { margin: "0 0 20px", fontSize: "14px", textAlign: "center" } }, description), /* @__PURE__ */ import_react16.default.createElement("nav", { style: { display: "flex", justifyContent: "center", gap: "20px", marginBottom: "20px" } }, links.map((link) => /* @__PURE__ */ import_react16.default.createElement("a", { key: link.text, href: link.url, style: { color: textColor, textDecoration: "none", fontSize: "16px", transition: "color 0.3s" }, onMouseOver: (e) => e.currentTarget.style.color = "#7c3aed", onMouseOut: (e) => e.currentTarget.style.color = textColor }, link.text))), /* @__PURE__ */ import_react16.default.createElement("div", { style: { display: "flex", gap: "20px" } }, socialLinks.map((social) => /* @__PURE__ */ import_react16.default.createElement("a", { key: social.url, href: social.url, style: { color: textColor, fontSize: "24px", textDecoration: "none", transition: "color 0.3s" }, onMouseOver: (e) => e.currentTarget.style.color = "#7c3aed", onMouseOut: (e) => e.currentTarget.style.color = textColor }, social.icon)))), /* @__PURE__ */ import_react16.default.createElement("div", { style: { marginTop: "20px", fontSize: "12px", textAlign: "center", color: "#94a3b8" } }, "\xA9 ", (/* @__PURE__ */ new Date()).getFullYear(), " ", brandTitle, ". All rights reserved."));
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AlertBanner,
@@ -836,6 +883,7 @@ var Navbar = ({
   CopyButton,
   Dropdown,
   EmptyState,
+  Footer,
   FormInput,
   GridLayout,
   ImageUploadPreview,
@@ -843,5 +891,6 @@ var Navbar = ({
   Navbar,
   OTPInput,
   RatingStars,
-  UserAvatar
+  UserAvatar,
+  WishlistButton
 });

package/dist/index.mjs

@@ -780,6 +780,51 @@ var Navbar = ({
     margin: "15px 0"
   } }, link.name)))));
 };
+
+// src/components/WishlistButton/WishlistButton.jsx
+import React15, { useState as useState11 } from "react";
+var WishlistButton = ({
+  isActive = false,
+  size = "40px",
+  inactiveColor = "#d1d5db",
+  activeColor = "#ff3e30",
+  onToggle
+}) => {
+  const [active, setActive] = useState11(isActive);
+  const handleClick = () => {
+    setActive((prev) => !prev);
+    if (onToggle) onToggle(!active);
+  };
+  return /* @__PURE__ */ React15.createElement("div", { onClick: handleClick, style: { cursor: "pointer", width: size, height: size, display: "flex", alignItems: "center", justifyContent: "center" } }, /* @__PURE__ */ React15.createElement(
+    "svg",
+    {
+      width: "100%",
+      height: "100%",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      style: {
+        transition: "transform 0.2s",
+        transform: active ? "scale(1.2)" : "scale(1)",
+        fill: active ? activeColor : inactiveColor
+      }
+    },
+    /* @__PURE__ */ React15.createElement("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" })
+  ));
+};
+
+// src/components/Footer/Footer.jsx
+import React16 from "react";
+var Footer = ({
+  bg = "#1e293b",
+  textColor = "#f1f5f9",
+  links = [{ text: "Home", url: "/" }, { text: "About", url: "/about" }, { text: "Services", url: "/services" }, { text: "Contact", url: "/contact" }],
+  brandTitle = "Company Name",
+  description = "Your reliable partner in success.",
+  socialLinks = [{ icon: "\u{1F3E0}", url: "https://facebook.com" }, { icon: "\u{1F426}", url: "https://twitter.com" }, { icon: "\u{1F4F8}", url: "https://instagram.com" }]
+}) => {
+  return /* @__PURE__ */ React16.createElement("footer", { style: { background: bg, color: textColor, padding: "20px 40px", fontFamily: "system-ui, sans-serif" } }, /* @__PURE__ */ React16.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center" } }, /* @__PURE__ */ React16.createElement("h2", { style: { margin: "0 0 10px", fontSize: "24px", fontWeight: "700" } }, brandTitle), /* @__PURE__ */ React16.createElement("p", { style: { margin: "0 0 20px", fontSize: "14px", textAlign: "center" } }, description), /* @__PURE__ */ React16.createElement("nav", { style: { display: "flex", justifyContent: "center", gap: "20px", marginBottom: "20px" } }, links.map((link) => /* @__PURE__ */ React16.createElement("a", { key: link.text, href: link.url, style: { color: textColor, textDecoration: "none", fontSize: "16px", transition: "color 0.3s" }, onMouseOver: (e) => e.currentTarget.style.color = "#7c3aed", onMouseOut: (e) => e.currentTarget.style.color = textColor }, link.text))), /* @__PURE__ */ React16.createElement("div", { style: { display: "flex", gap: "20px" } }, socialLinks.map((social) => /* @__PURE__ */ React16.createElement("a", { key: social.url, href: social.url, style: { color: textColor, fontSize: "24px", textDecoration: "none", transition: "color 0.3s" }, onMouseOver: (e) => e.currentTarget.style.color = "#7c3aed", onMouseOut: (e) => e.currentTarget.style.color = textColor }, social.icon)))), /* @__PURE__ */ React16.createElement("div", { style: { marginTop: "20px", fontSize: "12px", textAlign: "center", color: "#94a3b8" } }, "\xA9 ", (/* @__PURE__ */ new Date()).getFullYear(), " ", brandTitle, ". All rights reserved."));
+};
 export {
   AlertBanner,
   Button,
@@ -787,6 +832,7 @@ export {
   CopyButton,
   Dropdown,
   EmptyState,
+  Footer,
   FormInput,
   GridLayout,
   ImageUploadPreview,
@@ -794,5 +840,6 @@ export {
   Navbar,
   OTPInput,
   RatingStars,
-  UserAvatar
+  UserAvatar,
+  WishlistButton
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "virtual-ui-lib",
-  "version": "1.0.27",
+  "version": "1.0.29",
   "description": "Virtual UI React Component Library",
   "author": "Ankush",
   "license": "ISC",