@aws505/sheetsite 1.0.0 → 1.0.2

package/dist/components/index.mjs

@@ -1,3 +1,5 @@
+"use client";
+
 // src/components/layout/Header.tsx
 import { useState } from "react";
 
@@ -469,10 +471,10 @@ function Icon({ name, ...props }) {
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var defaultNavigation = [
   { label: "Home", href: "/" },
-  { label: "Services", href: "/services" },
-  { label: "Gallery", href: "/gallery" },
-  { label: "About", href: "/about" },
-  { label: "Contact", href: "/contact" }
+  { label: "Services", href: "/#services" },
+  { label: "Hours", href: "/#hours" },
+  { label: "Reviews", href: "/#reviews" },
+  { label: "FAQ", href: "/#faq" }
 ];
 function Header({
   business,
@@ -565,10 +567,10 @@ function Header({
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var defaultQuickLinks = [
   { label: "Home", href: "/" },
-  { label: "Services", href: "/services" },
-  { label: "About", href: "/about" },
-  { label: "Contact", href: "/contact" },
-  { label: "Privacy Policy", href: "/privacy" }
+  { label: "Services", href: "/#services" },
+  { label: "Hours", href: "/#hours" },
+  { label: "Reviews", href: "/#reviews" },
+  { label: "FAQ", href: "/#faq" }
 ];
 var dayNames = {
   monday: "Mon",
@@ -882,7 +884,8 @@ function Services({
   showIcons = true,
   variant = "cards",
   limit,
-  className = ""
+  className = "",
+  id = "services"
 }) {
   const displayedServices = limit ? services.slice(0, limit) : services;
   const gridCols = {
@@ -891,7 +894,7 @@ function Services({
     4: "md:grid-cols-2 lg:grid-cols-4"
   };
   if (variant === "list") {
-    return /* @__PURE__ */ jsx5("section", { className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
+    return /* @__PURE__ */ jsx5("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
       /* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
       /* @__PURE__ */ jsx5("div", { className: "max-w-3xl mx-auto divide-y divide-gray-200", children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
         ServiceListItem,
@@ -905,7 +908,7 @@ function Services({
     ] }) });
   }
   if (variant === "minimal") {
-    return /* @__PURE__ */ jsx5("section", { className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
+    return /* @__PURE__ */ jsx5("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
       /* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
       /* @__PURE__ */ jsx5("div", { className: `grid gap-6 ${gridCols[columns]}`, children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
         ServiceMinimalCard,
@@ -917,7 +920,7 @@ function Services({
       )) })
     ] }) });
   }
-  return /* @__PURE__ */ jsx5("section", { className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
+  return /* @__PURE__ */ jsx5("section", { id, className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
     /* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
     /* @__PURE__ */ jsx5("div", { className: `grid gap-6 ${gridCols[columns]}`, children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
       ServiceCard,
@@ -991,7 +994,8 @@ function Testimonials({
   showRatings = true,
   variant = "cards",
   limit,
-  className = ""
+  className = "",
+  id = "reviews"
 }) {
   const displayedTestimonials = limit ? testimonials.slice(0, limit) : testimonials;
   const gridCols = {
@@ -999,7 +1003,7 @@ function Testimonials({
     2: "md:grid-cols-2 max-w-4xl mx-auto",
     3: "md:grid-cols-2 lg:grid-cols-3"
   };
-  return /* @__PURE__ */ jsx6("section", { className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs6("div", { className: "container mx-auto px-4", children: [
+  return /* @__PURE__ */ jsx6("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs6("div", { className: "container mx-auto px-4", children: [
     /* @__PURE__ */ jsxs6("div", { className: "text-center mb-12", children: [
       /* @__PURE__ */ jsx6("h2", { className: "text-3xl md:text-4xl font-bold text-gray-900 mb-4", children: title }),
       subtitle && /* @__PURE__ */ jsx6("p", { className: "text-lg text-gray-600 max-w-2xl mx-auto", children: subtitle })
@@ -1102,7 +1106,8 @@ function FAQ({
   variant = "accordion",
   defaultOpen = 0,
   allowMultiple = false,
-  className = ""
+  className = "",
+  id = "faq"
 }) {
   const initialOpen = Array.isArray(defaultOpen) ? defaultOpen : [defaultOpen];
   const [openItems, setOpenItems] = useState2(initialOpen);
@@ -1118,18 +1123,18 @@ function FAQ({
     }
   };
   if (variant === "cards") {
-    return /* @__PURE__ */ jsx7("section", { className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
+    return /* @__PURE__ */ jsx7("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
       /* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
       /* @__PURE__ */ jsx7("div", { className: "grid md:grid-cols-2 gap-6 max-w-4xl mx-auto", children: items.map((item) => /* @__PURE__ */ jsx7(FAQCard, { item }, item.id || item.question)) })
     ] }) });
   }
   if (variant === "simple") {
-    return /* @__PURE__ */ jsx7("section", { className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
+    return /* @__PURE__ */ jsx7("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
       /* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
       /* @__PURE__ */ jsx7("div", { className: "max-w-3xl mx-auto space-y-8", children: items.map((item) => /* @__PURE__ */ jsx7(FAQSimple, { item }, item.id || item.question)) })
     ] }) });
   }
-  return /* @__PURE__ */ jsx7("section", { className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
+  return /* @__PURE__ */ jsx7("section", { id, className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
     /* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
     /* @__PURE__ */ jsx7("div", { className: "max-w-3xl mx-auto", children: items.map((item, index) => /* @__PURE__ */ jsx7(
       FAQAccordionItem,
@@ -1226,14 +1231,15 @@ function Hours({
   highlightToday = true,
   variant = "card",
   timezone,
-  className = ""
+  className = "",
+  id = "hours"
 }) {
   const todayDay = getTodayDay(timezone);
   const sortedHours = [...hours].sort(
     (a, b) => dayOrder.indexOf(a.day) - dayOrder.indexOf(b.day)
   );
   if (variant === "inline") {
-    return /* @__PURE__ */ jsx8("div", { className: `flex flex-wrap gap-4 ${className}`, children: sortedHours.map((entry) => /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx8("div", { id, className: `flex flex-wrap gap-4 ${className}`, children: sortedHours.map((entry) => /* @__PURE__ */ jsx8(
       HoursInlineItem,
       {
         entry,
@@ -1243,7 +1249,7 @@ function Hours({
     )) });
   }
   if (variant === "minimal") {
-    return /* @__PURE__ */ jsx8("div", { className: `space-y-1 ${className}`, children: sortedHours.map((entry) => /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx8("div", { id, className: `space-y-1 ${className}`, children: sortedHours.map((entry) => /* @__PURE__ */ jsx8(
       HoursMinimalItem,
       {
         entry,
@@ -1252,7 +1258,7 @@ function Hours({
       entry.day
     )) });
   }
-  return /* @__PURE__ */ jsxs8("div", { className: `bg-white rounded-lg shadow p-6 ${className}`, children: [
+  return /* @__PURE__ */ jsxs8("div", { id, className: `bg-white rounded-lg shadow p-6 ${className}`, children: [
     /* @__PURE__ */ jsxs8("div", { className: "flex items-center mb-4", children: [
       /* @__PURE__ */ jsx8(ClockIcon, { size: 24, className: "text-primary-600 mr-2" }),
       /* @__PURE__ */ jsx8("h3", { className: "text-xl font-semibold text-gray-900", children: title })