@aws505/sheetsite 1.0.2 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +185 -40
- package/dist/components/index.js +932 -60
- package/dist/components/index.js.map +1 -1
- package/dist/components/index.mjs +916 -60
- package/dist/components/index.mjs.map +1 -1
- package/dist/index.js +195 -62
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +185 -62
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/index.ts +15 -0
- package/src/components/layout/Header.tsx +1 -0
- package/src/components/sections/BeforeAfter.tsx +345 -0
- package/src/components/sections/FAQ.tsx +3 -3
- package/src/components/sections/Gallery.tsx +104 -4
- package/src/components/sections/Hero.tsx +19 -3
- package/src/components/sections/Menu.tsx +312 -0
- package/src/components/sections/Services.tsx +3 -3
- package/src/components/sections/Testimonials.tsx +1 -1
- package/src/components/sections/TrustBadges.tsx +283 -0
- package/src/components/ui/AnimatedSection.tsx +136 -0
- package/src/components/ui/FloatingClaimBanner.tsx +160 -0
package/dist/index.mjs
CHANGED
|
@@ -3747,6 +3747,7 @@ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
|
3747
3747
|
var defaultNavigation = [
|
|
3748
3748
|
{ label: "Home", href: "/" },
|
|
3749
3749
|
{ label: "Services", href: "/#services" },
|
|
3750
|
+
{ label: "Gallery", href: "/#gallery" },
|
|
3750
3751
|
{ label: "Hours", href: "/#hours" },
|
|
3751
3752
|
{ label: "Reviews", href: "/#reviews" },
|
|
3752
3753
|
{ label: "FAQ", href: "/#faq" }
|
|
@@ -4005,6 +4006,15 @@ function Footer({
|
|
|
4005
4006
|
|
|
4006
4007
|
// src/components/sections/Hero.tsx
|
|
4007
4008
|
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
4009
|
+
var defaultTrustSignals = {
|
|
4010
|
+
salon: ["Expert Stylists", "Walk-Ins Welcome", "Quality Products"],
|
|
4011
|
+
restaurant: ["Fresh Ingredients", "Family Recipes", "Friendly Service"],
|
|
4012
|
+
repair: ["Certified Technicians", "Honest Estimates", "Quality Parts"],
|
|
4013
|
+
tailor: ["Expert Craftsmanship", "Perfect Fit Guaranteed", "Quick Turnaround"],
|
|
4014
|
+
professional: ["Quality Work", "Fair Prices", "Fast Service"],
|
|
4015
|
+
retail: ["Quality Products", "Great Selection", "Friendly Service"],
|
|
4016
|
+
default: ["Quality Work", "Fair Prices", "Fast Service"]
|
|
4017
|
+
};
|
|
4008
4018
|
function Hero({
|
|
4009
4019
|
business,
|
|
4010
4020
|
variant = "centered",
|
|
@@ -4013,8 +4023,11 @@ function Hero({
|
|
|
4013
4023
|
todayHours,
|
|
4014
4024
|
backgroundImage,
|
|
4015
4025
|
overlay = true,
|
|
4016
|
-
className = ""
|
|
4026
|
+
className = "",
|
|
4027
|
+
trustSignals
|
|
4017
4028
|
}) {
|
|
4029
|
+
const businessType = business.type || "default";
|
|
4030
|
+
const signals = trustSignals || defaultTrustSignals[businessType] || defaultTrustSignals.default;
|
|
4018
4031
|
const bgStyle = backgroundImage ? { backgroundImage: `url(${backgroundImage})` } : void 0;
|
|
4019
4032
|
const handleCallClick = () => {
|
|
4020
4033
|
if (business.phone) {
|
|
@@ -4094,8 +4107,8 @@ function Hero({
|
|
|
4094
4107
|
) }),
|
|
4095
4108
|
/* @__PURE__ */ jsx4("h1", { className: "text-4xl md:text-5xl lg:text-6xl font-bold text-white mb-4", children: business.name }),
|
|
4096
4109
|
business.tagline && /* @__PURE__ */ jsx4("p", { className: "text-xl md:text-2xl text-white/90 mb-6", children: business.tagline }),
|
|
4097
|
-
business.aboutShort && /* @__PURE__ */ jsx4("p", { className:
|
|
4098
|
-
/* @__PURE__ */ jsx4("div", { className:
|
|
4110
|
+
business.aboutShort && /* @__PURE__ */ jsx4("p", { className: `text-lg text-white/80 mb-8 max-w-xl ${variant === "centered" ? "mx-auto" : ""}`, children: business.aboutShort }),
|
|
4111
|
+
/* @__PURE__ */ jsx4("div", { className: `flex flex-wrap gap-4 mb-8 ${variant === "centered" ? "justify-center" : ""}`, children: signals.map((signal) => /* @__PURE__ */ jsxs4("div", { className: "flex items-center text-white/90", children: [
|
|
4099
4112
|
/* @__PURE__ */ jsx4("svg", { className: "w-5 h-5 text-accent-400 mr-2", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx4(
|
|
4100
4113
|
"path",
|
|
4101
4114
|
{
|
|
@@ -4169,7 +4182,7 @@ function Services({
|
|
|
4169
4182
|
4: "md:grid-cols-2 lg:grid-cols-4"
|
|
4170
4183
|
};
|
|
4171
4184
|
if (variant === "list") {
|
|
4172
|
-
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4185
|
+
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4173
4186
|
/* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
|
|
4174
4187
|
/* @__PURE__ */ jsx5("div", { className: "max-w-3xl mx-auto divide-y divide-gray-200", children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
|
|
4175
4188
|
ServiceListItem,
|
|
@@ -4183,7 +4196,7 @@ function Services({
|
|
|
4183
4196
|
] }) });
|
|
4184
4197
|
}
|
|
4185
4198
|
if (variant === "minimal") {
|
|
4186
|
-
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4199
|
+
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4187
4200
|
/* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
|
|
4188
4201
|
/* @__PURE__ */ jsx5("div", { className: `grid gap-6 ${gridCols[columns]}`, children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
|
|
4189
4202
|
ServiceMinimalCard,
|
|
@@ -4195,7 +4208,7 @@ function Services({
|
|
|
4195
4208
|
)) })
|
|
4196
4209
|
] }) });
|
|
4197
4210
|
}
|
|
4198
|
-
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4211
|
+
return /* @__PURE__ */ jsx5("section", { id, className: `py-16 scroll-mt-20 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs5("div", { className: "container mx-auto px-4", children: [
|
|
4199
4212
|
/* @__PURE__ */ jsx5(SectionHeader, { title, subtitle }),
|
|
4200
4213
|
/* @__PURE__ */ jsx5("div", { className: `grid gap-6 ${gridCols[columns]}`, children: displayedServices.map((service) => /* @__PURE__ */ jsx5(
|
|
4201
4214
|
ServiceCard,
|
|
@@ -4278,7 +4291,7 @@ function Testimonials({
|
|
|
4278
4291
|
2: "md:grid-cols-2 max-w-4xl mx-auto",
|
|
4279
4292
|
3: "md:grid-cols-2 lg:grid-cols-3"
|
|
4280
4293
|
};
|
|
4281
|
-
return /* @__PURE__ */ jsx6("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs6("div", { className: "container mx-auto px-4", children: [
|
|
4294
|
+
return /* @__PURE__ */ jsx6("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: /* @__PURE__ */ jsxs6("div", { className: "container mx-auto px-4", children: [
|
|
4282
4295
|
/* @__PURE__ */ jsxs6("div", { className: "text-center mb-12", children: [
|
|
4283
4296
|
/* @__PURE__ */ jsx6("h2", { className: "text-3xl md:text-4xl font-bold text-gray-900 mb-4", children: title }),
|
|
4284
4297
|
subtitle && /* @__PURE__ */ jsx6("p", { className: "text-lg text-gray-600 max-w-2xl mx-auto", children: subtitle })
|
|
@@ -4398,18 +4411,18 @@ function FAQ({
|
|
|
4398
4411
|
}
|
|
4399
4412
|
};
|
|
4400
4413
|
if (variant === "cards") {
|
|
4401
|
-
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4414
|
+
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4402
4415
|
/* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
|
|
4403
4416
|
/* @__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)) })
|
|
4404
4417
|
] }) });
|
|
4405
4418
|
}
|
|
4406
4419
|
if (variant === "simple") {
|
|
4407
|
-
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4420
|
+
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4408
4421
|
/* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
|
|
4409
4422
|
/* @__PURE__ */ jsx7("div", { className: "max-w-3xl mx-auto space-y-8", children: items.map((item) => /* @__PURE__ */ jsx7(FAQSimple, { item }, item.id || item.question)) })
|
|
4410
4423
|
] }) });
|
|
4411
4424
|
}
|
|
4412
|
-
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4425
|
+
return /* @__PURE__ */ jsx7("section", { id, className: `py-16 scroll-mt-20 bg-gray-50 ${className}`, children: /* @__PURE__ */ jsxs7("div", { className: "container mx-auto px-4", children: [
|
|
4413
4426
|
/* @__PURE__ */ jsx7(SectionHeader2, { title, subtitle }),
|
|
4414
4427
|
/* @__PURE__ */ jsx7("div", { className: "max-w-3xl mx-auto", children: items.map((item, index) => /* @__PURE__ */ jsx7(
|
|
4415
4428
|
FAQAccordionItem,
|
|
@@ -4621,53 +4634,155 @@ function Gallery({
|
|
|
4621
4634
|
columns = 3,
|
|
4622
4635
|
variant = "grid",
|
|
4623
4636
|
showCaptions = true,
|
|
4637
|
+
enableLightbox = true,
|
|
4624
4638
|
limit,
|
|
4625
|
-
className = ""
|
|
4639
|
+
className = "",
|
|
4640
|
+
id = "gallery"
|
|
4626
4641
|
}) {
|
|
4627
4642
|
const displayedItems = limit ? items.slice(0, limit) : items;
|
|
4628
4643
|
const [failedImages, setFailedImages] = useState3(/* @__PURE__ */ new Set());
|
|
4629
|
-
const
|
|
4630
|
-
|
|
4644
|
+
const [lightboxIndex, setLightboxIndex] = useState3(null);
|
|
4645
|
+
const handleImageError = (id2) => {
|
|
4646
|
+
setFailedImages((prev) => new Set(prev).add(id2));
|
|
4631
4647
|
};
|
|
4632
4648
|
const gridCols = {
|
|
4633
4649
|
2: "grid-cols-1 sm:grid-cols-2",
|
|
4634
4650
|
3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
|
|
4635
4651
|
4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
|
|
4636
4652
|
};
|
|
4637
|
-
|
|
4638
|
-
(
|
|
4639
|
-
|
|
4640
|
-
|
|
4653
|
+
const openLightbox = (index) => {
|
|
4654
|
+
if (enableLightbox) {
|
|
4655
|
+
setLightboxIndex(index);
|
|
4656
|
+
}
|
|
4657
|
+
};
|
|
4658
|
+
const closeLightbox = () => setLightboxIndex(null);
|
|
4659
|
+
const goToPrevious = () => {
|
|
4660
|
+
if (lightboxIndex !== null) {
|
|
4661
|
+
setLightboxIndex(lightboxIndex === 0 ? displayedItems.length - 1 : lightboxIndex - 1);
|
|
4662
|
+
}
|
|
4663
|
+
};
|
|
4664
|
+
const goToNext = () => {
|
|
4665
|
+
if (lightboxIndex !== null) {
|
|
4666
|
+
setLightboxIndex(lightboxIndex === displayedItems.length - 1 ? 0 : lightboxIndex + 1);
|
|
4667
|
+
}
|
|
4668
|
+
};
|
|
4669
|
+
return /* @__PURE__ */ jsxs9("section", { id, className: `py-16 scroll-mt-20 ${className}`, children: [
|
|
4670
|
+
/* @__PURE__ */ jsxs9("div", { className: "container mx-auto px-4", children: [
|
|
4671
|
+
(title || subtitle) && /* @__PURE__ */ jsxs9("div", { className: "text-center mb-12", children: [
|
|
4672
|
+
title && /* @__PURE__ */ jsx9("h2", { className: "text-3xl md:text-4xl font-bold text-gray-900 mb-4", children: title }),
|
|
4673
|
+
subtitle && /* @__PURE__ */ jsx9("p", { className: "text-lg text-gray-600 max-w-2xl mx-auto", children: subtitle })
|
|
4674
|
+
] }),
|
|
4675
|
+
/* @__PURE__ */ jsx9("div", { className: `grid gap-4 ${gridCols[columns]}`, children: displayedItems.map((item, index) => {
|
|
4676
|
+
const itemId = item.id || item.imageUrl;
|
|
4677
|
+
const hasFailed = failedImages.has(itemId);
|
|
4678
|
+
return /* @__PURE__ */ jsx9(
|
|
4679
|
+
"div",
|
|
4680
|
+
{
|
|
4681
|
+
className: `group relative aspect-square overflow-hidden rounded-lg bg-gray-100 ${enableLightbox ? "cursor-pointer" : ""}`,
|
|
4682
|
+
onClick: () => openLightbox(index),
|
|
4683
|
+
role: enableLightbox ? "button" : void 0,
|
|
4684
|
+
tabIndex: enableLightbox ? 0 : void 0,
|
|
4685
|
+
onKeyDown: enableLightbox ? (e) => e.key === "Enter" && openLightbox(index) : void 0,
|
|
4686
|
+
children: hasFailed ? /* @__PURE__ */ jsx9("div", { className: "absolute inset-0 flex items-center justify-center text-gray-400", children: /* @__PURE__ */ jsx9("span", { children: "Image unavailable" }) }) : /* @__PURE__ */ jsxs9(Fragment, { children: [
|
|
4687
|
+
/* @__PURE__ */ jsx9(
|
|
4688
|
+
"img",
|
|
4689
|
+
{
|
|
4690
|
+
src: item.imageUrl,
|
|
4691
|
+
alt: item.alt || "",
|
|
4692
|
+
loading: "lazy",
|
|
4693
|
+
className: "w-full h-full object-cover transition-transform duration-300 group-hover:scale-105",
|
|
4694
|
+
onError: () => handleImageError(itemId)
|
|
4695
|
+
}
|
|
4696
|
+
),
|
|
4697
|
+
enableLightbox && /* @__PURE__ */ jsx9("div", { className: "absolute inset-0 bg-black/30 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-center justify-center", children: /* @__PURE__ */ jsx9("svg", { className: "w-10 h-10 text-white", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx9("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM10 7v3m0 0v3m0-3h3m-3 0H7" }) }) }),
|
|
4698
|
+
showCaptions && item.caption && !enableLightbox && /* @__PURE__ */ jsx9("div", { className: "absolute inset-0 bg-gradient-to-t from-black/60 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300", children: /* @__PURE__ */ jsx9("div", { className: "absolute bottom-0 left-0 right-0 p-4", children: /* @__PURE__ */ jsx9("p", { className: "text-white text-sm", children: item.caption }) }) })
|
|
4699
|
+
] })
|
|
4700
|
+
},
|
|
4701
|
+
itemId
|
|
4702
|
+
);
|
|
4703
|
+
}) })
|
|
4641
4704
|
] }),
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
|
|
4648
|
-
|
|
4649
|
-
|
|
4650
|
-
|
|
4651
|
-
|
|
4652
|
-
|
|
4653
|
-
|
|
4654
|
-
|
|
4655
|
-
|
|
4656
|
-
|
|
4657
|
-
|
|
4658
|
-
|
|
4659
|
-
|
|
4660
|
-
|
|
4705
|
+
enableLightbox && lightboxIndex !== null && /* @__PURE__ */ jsxs9(
|
|
4706
|
+
"div",
|
|
4707
|
+
{
|
|
4708
|
+
className: "fixed inset-0 z-50 bg-black/90 flex items-center justify-center",
|
|
4709
|
+
onClick: closeLightbox,
|
|
4710
|
+
children: [
|
|
4711
|
+
/* @__PURE__ */ jsx9(
|
|
4712
|
+
"button",
|
|
4713
|
+
{
|
|
4714
|
+
onClick: closeLightbox,
|
|
4715
|
+
className: "absolute top-4 right-4 text-white hover:text-gray-300 transition-colors z-10",
|
|
4716
|
+
"aria-label": "Close lightbox",
|
|
4717
|
+
children: /* @__PURE__ */ jsx9("svg", { className: "w-8 h-8", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx9("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
4718
|
+
}
|
|
4719
|
+
),
|
|
4720
|
+
/* @__PURE__ */ jsx9(
|
|
4721
|
+
"button",
|
|
4722
|
+
{
|
|
4723
|
+
onClick: (e) => {
|
|
4724
|
+
e.stopPropagation();
|
|
4725
|
+
goToPrevious();
|
|
4726
|
+
},
|
|
4727
|
+
className: "absolute left-4 top-1/2 -translate-y-1/2 text-white hover:text-gray-300 transition-colors z-10",
|
|
4728
|
+
"aria-label": "Previous image",
|
|
4729
|
+
children: /* @__PURE__ */ jsx9("svg", { className: "w-10 h-10", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx9("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) })
|
|
4730
|
+
}
|
|
4731
|
+
),
|
|
4732
|
+
/* @__PURE__ */ jsx9(
|
|
4733
|
+
"button",
|
|
4734
|
+
{
|
|
4735
|
+
onClick: (e) => {
|
|
4736
|
+
e.stopPropagation();
|
|
4737
|
+
goToNext();
|
|
4738
|
+
},
|
|
4739
|
+
className: "absolute right-4 top-1/2 -translate-y-1/2 text-white hover:text-gray-300 transition-colors z-10",
|
|
4740
|
+
"aria-label": "Next image",
|
|
4741
|
+
children: /* @__PURE__ */ jsx9("svg", { className: "w-10 h-10", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx9("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })
|
|
4742
|
+
}
|
|
4743
|
+
),
|
|
4744
|
+
/* @__PURE__ */ jsxs9(
|
|
4745
|
+
"div",
|
|
4746
|
+
{
|
|
4747
|
+
className: "max-w-5xl max-h-[85vh] mx-4",
|
|
4748
|
+
onClick: (e) => e.stopPropagation(),
|
|
4749
|
+
children: [
|
|
4750
|
+
/* @__PURE__ */ jsx9(
|
|
4751
|
+
"img",
|
|
4752
|
+
{
|
|
4753
|
+
src: displayedItems[lightboxIndex].imageUrl,
|
|
4754
|
+
alt: displayedItems[lightboxIndex].alt || "",
|
|
4755
|
+
className: "max-w-full max-h-[85vh] object-contain"
|
|
4756
|
+
}
|
|
4757
|
+
),
|
|
4758
|
+
showCaptions && displayedItems[lightboxIndex].caption && /* @__PURE__ */ jsx9("p", { className: "text-white text-center mt-4 text-lg", children: displayedItems[lightboxIndex].caption })
|
|
4759
|
+
]
|
|
4760
|
+
}
|
|
4761
|
+
),
|
|
4762
|
+
/* @__PURE__ */ jsxs9("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 text-white text-sm", children: [
|
|
4763
|
+
lightboxIndex + 1,
|
|
4764
|
+
" / ",
|
|
4765
|
+
displayedItems.length
|
|
4661
4766
|
] })
|
|
4662
|
-
|
|
4663
|
-
|
|
4664
|
-
|
|
4665
|
-
|
|
4666
|
-
] }) });
|
|
4767
|
+
]
|
|
4768
|
+
}
|
|
4769
|
+
)
|
|
4770
|
+
] });
|
|
4667
4771
|
}
|
|
4668
4772
|
|
|
4773
|
+
// src/components/sections/Menu.tsx
|
|
4774
|
+
import { useState as useState4 } from "react";
|
|
4775
|
+
import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
4776
|
+
|
|
4777
|
+
// src/components/sections/TrustBadges.tsx
|
|
4778
|
+
import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
4779
|
+
|
|
4780
|
+
// src/components/sections/BeforeAfter.tsx
|
|
4781
|
+
import { useState as useState5, useRef, useCallback } from "react";
|
|
4782
|
+
import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
4783
|
+
|
|
4669
4784
|
// src/components/ui/Button.tsx
|
|
4670
|
-
import { Fragment as Fragment2, jsx as
|
|
4785
|
+
import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
4671
4786
|
function getButtonClasses(props) {
|
|
4672
4787
|
const { variant = "primary", size = "md", fullWidth, disabled } = props;
|
|
4673
4788
|
const baseClasses = [
|
|
@@ -4709,16 +4824,16 @@ function Button({
|
|
|
4709
4824
|
...props
|
|
4710
4825
|
}) {
|
|
4711
4826
|
const classes = getButtonClasses({ variant, size, fullWidth, disabled: disabled || loading });
|
|
4712
|
-
return /* @__PURE__ */
|
|
4827
|
+
return /* @__PURE__ */ jsx13(
|
|
4713
4828
|
"button",
|
|
4714
4829
|
{
|
|
4715
4830
|
className: `${classes} ${className}`,
|
|
4716
4831
|
disabled: disabled || loading,
|
|
4717
4832
|
...props,
|
|
4718
|
-
children: loading ? /* @__PURE__ */
|
|
4719
|
-
leftIcon && /* @__PURE__ */
|
|
4833
|
+
children: loading ? /* @__PURE__ */ jsx13(LoadingSpinner, { size }) : /* @__PURE__ */ jsxs13(Fragment2, { children: [
|
|
4834
|
+
leftIcon && /* @__PURE__ */ jsx13("span", { className: "mr-2", children: leftIcon }),
|
|
4720
4835
|
children,
|
|
4721
|
-
rightIcon && /* @__PURE__ */
|
|
4836
|
+
rightIcon && /* @__PURE__ */ jsx13("span", { className: "ml-2", children: rightIcon })
|
|
4722
4837
|
] })
|
|
4723
4838
|
}
|
|
4724
4839
|
);
|
|
@@ -4729,7 +4844,7 @@ function LoadingSpinner({ size }) {
|
|
|
4729
4844
|
md: "w-5 h-5",
|
|
4730
4845
|
lg: "w-6 h-6"
|
|
4731
4846
|
};
|
|
4732
|
-
return /* @__PURE__ */
|
|
4847
|
+
return /* @__PURE__ */ jsxs13(
|
|
4733
4848
|
"svg",
|
|
4734
4849
|
{
|
|
4735
4850
|
className: `animate-spin ${sizeClasses[size || "md"]}`,
|
|
@@ -4737,7 +4852,7 @@ function LoadingSpinner({ size }) {
|
|
|
4737
4852
|
fill: "none",
|
|
4738
4853
|
viewBox: "0 0 24 24",
|
|
4739
4854
|
children: [
|
|
4740
|
-
/* @__PURE__ */
|
|
4855
|
+
/* @__PURE__ */ jsx13(
|
|
4741
4856
|
"circle",
|
|
4742
4857
|
{
|
|
4743
4858
|
className: "opacity-25",
|
|
@@ -4748,7 +4863,7 @@ function LoadingSpinner({ size }) {
|
|
|
4748
4863
|
strokeWidth: "4"
|
|
4749
4864
|
}
|
|
4750
4865
|
),
|
|
4751
|
-
/* @__PURE__ */
|
|
4866
|
+
/* @__PURE__ */ jsx13(
|
|
4752
4867
|
"path",
|
|
4753
4868
|
{
|
|
4754
4869
|
className: "opacity-75",
|
|
@@ -4771,15 +4886,15 @@ function ButtonLink({
|
|
|
4771
4886
|
...props
|
|
4772
4887
|
}) {
|
|
4773
4888
|
const classes = getButtonClasses({ variant, size, fullWidth, disabled: false });
|
|
4774
|
-
return /* @__PURE__ */
|
|
4775
|
-
leftIcon && /* @__PURE__ */
|
|
4889
|
+
return /* @__PURE__ */ jsxs13("a", { className: `${classes} ${className}`, ...props, children: [
|
|
4890
|
+
leftIcon && /* @__PURE__ */ jsx13("span", { className: "mr-2", children: leftIcon }),
|
|
4776
4891
|
children,
|
|
4777
|
-
rightIcon && /* @__PURE__ */
|
|
4892
|
+
rightIcon && /* @__PURE__ */ jsx13("span", { className: "ml-2", children: rightIcon })
|
|
4778
4893
|
] });
|
|
4779
4894
|
}
|
|
4780
4895
|
|
|
4781
4896
|
// src/components/ui/Card.tsx
|
|
4782
|
-
import { jsx as
|
|
4897
|
+
import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
4783
4898
|
function getCardClasses(props) {
|
|
4784
4899
|
const { variant = "default", padding = "md", hover = false } = props;
|
|
4785
4900
|
const baseClasses = ["rounded-lg", "overflow-hidden"];
|
|
@@ -4812,7 +4927,7 @@ function Card({
|
|
|
4812
4927
|
...props
|
|
4813
4928
|
}) {
|
|
4814
4929
|
const classes = getCardClasses({ variant, padding, hover });
|
|
4815
|
-
return /* @__PURE__ */
|
|
4930
|
+
return /* @__PURE__ */ jsx14("div", { className: `${classes} ${className}`, ...props, children });
|
|
4816
4931
|
}
|
|
4817
4932
|
function CardHeader({
|
|
4818
4933
|
title,
|
|
@@ -4822,13 +4937,13 @@ function CardHeader({
|
|
|
4822
4937
|
className = "",
|
|
4823
4938
|
...props
|
|
4824
4939
|
}) {
|
|
4825
|
-
return /* @__PURE__ */
|
|
4826
|
-
/* @__PURE__ */
|
|
4827
|
-
title && /* @__PURE__ */
|
|
4828
|
-
subtitle && /* @__PURE__ */
|
|
4940
|
+
return /* @__PURE__ */ jsxs14("div", { className: `flex items-start justify-between ${className}`, ...props, children: [
|
|
4941
|
+
/* @__PURE__ */ jsxs14("div", { children: [
|
|
4942
|
+
title && /* @__PURE__ */ jsx14("h3", { className: "text-lg font-semibold text-gray-900", children: title }),
|
|
4943
|
+
subtitle && /* @__PURE__ */ jsx14("p", { className: "mt-1 text-sm text-gray-500", children: subtitle }),
|
|
4829
4944
|
children
|
|
4830
4945
|
] }),
|
|
4831
|
-
action && /* @__PURE__ */
|
|
4946
|
+
action && /* @__PURE__ */ jsx14("div", { className: "flex-shrink-0 ml-4", children: action })
|
|
4832
4947
|
] });
|
|
4833
4948
|
}
|
|
4834
4949
|
function CardBody({
|
|
@@ -4836,14 +4951,14 @@ function CardBody({
|
|
|
4836
4951
|
className = "",
|
|
4837
4952
|
...props
|
|
4838
4953
|
}) {
|
|
4839
|
-
return /* @__PURE__ */
|
|
4954
|
+
return /* @__PURE__ */ jsx14("div", { className: `mt-4 ${className}`, ...props, children });
|
|
4840
4955
|
}
|
|
4841
4956
|
function CardFooter({
|
|
4842
4957
|
children,
|
|
4843
4958
|
className = "",
|
|
4844
4959
|
...props
|
|
4845
4960
|
}) {
|
|
4846
|
-
return /* @__PURE__ */
|
|
4961
|
+
return /* @__PURE__ */ jsx14("div", { className: `mt-4 pt-4 border-t border-gray-100 ${className}`, ...props, children });
|
|
4847
4962
|
}
|
|
4848
4963
|
function CardImage({
|
|
4849
4964
|
aspectRatio = "video",
|
|
@@ -4857,7 +4972,7 @@ function CardImage({
|
|
|
4857
4972
|
wide: "aspect-[2/1]",
|
|
4858
4973
|
auto: ""
|
|
4859
4974
|
};
|
|
4860
|
-
return /* @__PURE__ */
|
|
4975
|
+
return /* @__PURE__ */ jsx14("div", { className: `-m-5 mb-4 ${aspectClasses[aspectRatio]} overflow-hidden`, children: /* @__PURE__ */ jsx14(
|
|
4861
4976
|
"img",
|
|
4862
4977
|
{
|
|
4863
4978
|
className: `w-full h-full object-cover ${className}`,
|
|
@@ -4867,6 +4982,14 @@ function CardImage({
|
|
|
4867
4982
|
) });
|
|
4868
4983
|
}
|
|
4869
4984
|
|
|
4985
|
+
// src/components/ui/AnimatedSection.tsx
|
|
4986
|
+
import React6, { useEffect, useRef as useRef2, useState as useState6 } from "react";
|
|
4987
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
4988
|
+
|
|
4989
|
+
// src/components/ui/FloatingClaimBanner.tsx
|
|
4990
|
+
import { useState as useState7, useEffect as useEffect2 } from "react";
|
|
4991
|
+
import { jsx as jsx16, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
4992
|
+
|
|
4870
4993
|
// src/seo/index.ts
|
|
4871
4994
|
function generateMetadata(business, pageTitle, pageDescription, options = {}) {
|
|
4872
4995
|
const { titleTemplate = "%s", baseUrl } = options;
|