@commandcenterio/convert-ui 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.js ADDED
@@ -0,0 +1,1095 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __defProps = Object.defineProperties;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
+ var __getOwnPropNames = Object.getOwnPropertyNames;
8
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
+ var __getProtoOf = Object.getPrototypeOf;
10
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
11
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
12
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
+ var __spreadValues = (a, b) => {
14
+ for (var prop in b || (b = {}))
15
+ if (__hasOwnProp.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ if (__getOwnPropSymbols)
18
+ for (var prop of __getOwnPropSymbols(b)) {
19
+ if (__propIsEnum.call(b, prop))
20
+ __defNormalProp(a, prop, b[prop]);
21
+ }
22
+ return a;
23
+ };
24
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
+ var __objRest = (source, exclude) => {
26
+ var target = {};
27
+ for (var prop in source)
28
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
+ target[prop] = source[prop];
30
+ if (source != null && __getOwnPropSymbols)
31
+ for (var prop of __getOwnPropSymbols(source)) {
32
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
+ target[prop] = source[prop];
34
+ }
35
+ return target;
36
+ };
37
+ var __export = (target, all) => {
38
+ for (var name in all)
39
+ __defProp(target, name, { get: all[name], enumerable: true });
40
+ };
41
+ var __copyProps = (to, from, except, desc) => {
42
+ if (from && typeof from === "object" || typeof from === "function") {
43
+ for (let key of __getOwnPropNames(from))
44
+ if (!__hasOwnProp.call(to, key) && key !== except)
45
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
46
+ }
47
+ return to;
48
+ };
49
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
50
+ // If the importer is in node compatibility mode or this is not an ESM
51
+ // file that has been converted to a CommonJS file using a Babel-
52
+ // compatible transform (i.e. "__esModule" has not been set), then set
53
+ // "default" to the CommonJS "module.exports" for node compatibility.
54
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
55
+ mod
56
+ ));
57
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
58
+
59
+ // src/index.tsx
60
+ var src_exports = {};
61
+ __export(src_exports, {
62
+ AccordionContainer: () => AccordionContainer,
63
+ AccordionItem: () => AccordionItem,
64
+ AnimateBorder: () => AnimateBorder,
65
+ AnimatedHeader: () => AnimatedHeader,
66
+ AnimationObserver: () => AnimationObserver,
67
+ BentoBox: () => BentoBox,
68
+ BookNow: () => BookNow,
69
+ Button: () => Button,
70
+ CTA: () => CTA,
71
+ CookieConsentForm: () => CookieConsentForm,
72
+ Footer: () => Footer,
73
+ Hero: () => Hero,
74
+ Masonry: () => Masonry,
75
+ Navbar: () => Navbar,
76
+ Offer: () => Offer,
77
+ PrettyCard: () => PrettyCard,
78
+ Ratings: () => Ratings,
79
+ SectionContainer: () => SectionContainer,
80
+ SectionHeader: () => SectionHeader,
81
+ SellingPropContainer: () => SellingPropContainer,
82
+ SellingProposition: () => SellingProposition,
83
+ StackedScroller: () => StackedScroller,
84
+ TestimonialCard: () => TestimonialCard,
85
+ TestimonialDisplay: () => TestimonialDisplay
86
+ });
87
+ module.exports = __toCommonJS(src_exports);
88
+
89
+ // src/Accordion/Accordion.tsx
90
+ var import_jsx_runtime = require("react/jsx-runtime");
91
+ var AccordionContainer = ({ children }) => {
92
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "join join-vertical w-full", children });
93
+ };
94
+ var AccordionItem = ({ title, content, isOpen = false }) => {
95
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "collapse collapse-arrow join-item border border-base-300 bg-dark-200 text-base-content", children: [
96
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { type: "radio", name: "my-accordion-4", defaultChecked: isOpen }),
97
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "collapse-title text-xl font-medium", children: title }),
98
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "collapse-content p-0", style: { padding: "0 !important" }, children: content })
99
+ ] });
100
+ };
101
+
102
+ // src/Observer/AnimationObserver.tsx
103
+ var import_react = require("react");
104
+ var import_react_intersection_observer = require("react-intersection-observer");
105
+ var AnimationObserver = function({
106
+ children,
107
+ animationClassNames,
108
+ threshold = 0.2,
109
+ defaultClassNames
110
+ }) {
111
+ const { ref, inView } = (0, import_react_intersection_observer.useInView)({
112
+ threshold
113
+ });
114
+ return (0, import_react.cloneElement)(children, {
115
+ ref,
116
+ className: `${children.props.className} ${inView ? animationClassNames : defaultClassNames}`.trim()
117
+ });
118
+ };
119
+
120
+ // src/BorderAnimation/BorderAnimation.tsx
121
+ var import_react2 = require("react");
122
+ var import_react_intersection_observer2 = require("react-intersection-observer");
123
+ var import_classnames = __toESM(require("classnames"));
124
+ var import_jsx_runtime2 = require("react/jsx-runtime");
125
+ var AnimateBorder = ({
126
+ elementToAnimate,
127
+ children,
128
+ speed = "5s",
129
+ hideOverflow,
130
+ iconsToAnimate,
131
+ borderRadius = "lg"
132
+ }) => {
133
+ const parentRef = (0, import_react2.useRef)(null);
134
+ const { inView, ref: viewRef } = (0, import_react_intersection_observer2.useInView)({ threshold: 0.2 });
135
+ const cloneElementWithAnimation = (element, index = 0) => {
136
+ const animationDelay = `${index * 0.5}s`;
137
+ return (0, import_react2.cloneElement)(element, {
138
+ style: __spreadProps(__spreadValues({}, element.props.style), { animationDelay }),
139
+ className: (0, import_classnames.default)({
140
+ "absolute": inView,
141
+ "hidden": !inView,
142
+ "ml-4": index !== 0,
143
+ [element.props.className]: true,
144
+ "animatedElement": true
145
+ })
146
+ });
147
+ };
148
+ const clonedAnimatedElement = elementToAnimate && cloneElementWithAnimation(elementToAnimate);
149
+ const clonedIconElements = iconsToAnimate == null ? void 0 : iconsToAnimate.map(cloneElementWithAnimation);
150
+ (0, import_react2.useEffect)(() => {
151
+ const handleResize = () => {
152
+ if (parentRef.current) {
153
+ document.documentElement.style.setProperty("--parent-width", `${parentRef.current.offsetWidth}px`);
154
+ document.documentElement.style.setProperty("--parent-height", `${parentRef.current.offsetHeight}px`);
155
+ document.documentElement.style.setProperty("--animated-speed", speed);
156
+ document.documentElement.style.setProperty("--animated-border-radius", `var(--rounded-${borderRadius})`);
157
+ }
158
+ };
159
+ handleResize();
160
+ window.addEventListener("resize", handleResize);
161
+ return () => window.removeEventListener("resize", handleResize);
162
+ }, []);
163
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
164
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: viewRef, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ref: viewRef, className: `relative ${hideOverflow && "overflow-hidden"}`, children: [
165
+ clonedAnimatedElement && !hideOverflow && clonedAnimatedElement,
166
+ clonedIconElements && hideOverflow && clonedIconElements,
167
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: parentRef, className: "flex items-center z-50 relative justify-center p-1", children })
168
+ ] }) }),
169
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("style", { children: `
170
+ ::root {
171
+ /* --border-radius: 0px; */
172
+ --parent-height: 0px;
173
+ --parent-width: 0px;
174
+ --animated-speed: 10s;
175
+ }
176
+ @keyframes moveAround {
177
+ from {
178
+ offset-distance: 0%;
179
+ }
180
+ to {
181
+ offset-distance: 100%;
182
+ }
183
+ }
184
+
185
+ @keyframes loop {
186
+ to {
187
+ offset-distance: 100%;
188
+ }
189
+ }
190
+
191
+ .animatedElement {
192
+ anchor-offset: 100% 50%;
193
+ position: absolute;
194
+ animation: loop var(--animated-speed) infinite linear;
195
+ offset-path: rect(0px var(--parent-width) var(--parent-height) 0px round 5%);
196
+ }
197
+ ` })
198
+ ] });
199
+ };
200
+
201
+ // src/AnimatedHeader/AnimatedHeader.tsx
202
+ var import_react3 = require("@gsap/react");
203
+ var import_gsap_core = require("gsap/gsap-core");
204
+ var import_all = require("gsap/all");
205
+ var import_jsx_runtime3 = require("react/jsx-runtime");
206
+ import_gsap_core.gsap.registerPlugin(import_all.TextPlugin, import_all.ScrollTrigger);
207
+ var AnimatedHeader = function({
208
+ textToAnimate,
209
+ textClassNames,
210
+ containerClassNames,
211
+ textAnimation,
212
+ scaleAnimation,
213
+ identifiers,
214
+ pin = false,
215
+ once = false
216
+ }) {
217
+ const modifiedId = "#" + identifiers.child;
218
+ const modifiedParentId = "#" + identifiers.parent;
219
+ (0, import_react3.useGSAP)(() => {
220
+ import_gsap_core.gsap.timeline().fromTo(
221
+ modifiedId,
222
+ {
223
+ scale: scaleAnimation.start
224
+ },
225
+ {
226
+ scale: scaleAnimation.end,
227
+ scrollTrigger: {
228
+ // markers: true,
229
+ trigger: modifiedParentId,
230
+ start: textAnimation.start,
231
+ end: textAnimation.end,
232
+ once,
233
+ scrub: 1,
234
+ pin,
235
+ pinSpacing: pin
236
+ },
237
+ text: {
238
+ value: textToAnimate,
239
+ delimiter: ""
240
+ },
241
+ ease: "linear",
242
+ duration: 1
243
+ }
244
+ );
245
+ }, []);
246
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
247
+ "div",
248
+ {
249
+ id: identifiers.parent,
250
+ className: `flex items-center justify-center ${containerClassNames} `,
251
+ children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h2", { id: identifiers.child, className: textClassNames })
252
+ }
253
+ );
254
+ };
255
+
256
+ // src/Bento/BentoBox.tsx
257
+ var import_react4 = __toESM(require("react"));
258
+ var import_jsx_runtime4 = require("react/jsx-runtime");
259
+ var BentoBox = ({ children, classNames: classNames2 = "" }) => {
260
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "@container", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: `${classNames2}`, children: import_react4.default.Children.map(
261
+ children,
262
+ (child, index) => import_react4.default.isValidElement(child) ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
263
+ "div",
264
+ {
265
+ className: child.props.className,
266
+ children: child.props.children
267
+ },
268
+ `bento-box-${index}`
269
+ ) : null
270
+ ) }) });
271
+ };
272
+
273
+ // src/BookNow/BookNow.tsx
274
+ var import_react5 = require("react");
275
+ var import_jsx_runtime5 = require("react/jsx-runtime");
276
+ var BookNow = ({
277
+ scriptPathUrl,
278
+ show,
279
+ vendor,
280
+ dataUrl,
281
+ className,
282
+ dataPath
283
+ }) => {
284
+ (0, import_react5.useEffect)(() => {
285
+ if (show) {
286
+ if (document.getElementById("calendar-script")) {
287
+ return;
288
+ }
289
+ const script = document.createElement("script");
290
+ script.id = "calendar-script";
291
+ script.src = scriptPathUrl;
292
+ script.async = true;
293
+ script.defer = true;
294
+ if (vendor === "calendly") {
295
+ script.type = "text/javascript";
296
+ }
297
+ document.body.appendChild(script);
298
+ return () => {
299
+ document.body.removeChild(script);
300
+ };
301
+ }
302
+ }, [show, scriptPathUrl, vendor]);
303
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
304
+ "div",
305
+ {
306
+ id: "book-now",
307
+ className: `w-[100%] ${className}`,
308
+ style: { display: show ? "block" : "none" },
309
+ children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
310
+ "div",
311
+ {
312
+ className: `${vendor === "tidycal" && "tidycal-embed"} ${vendor === "calendly" && "calendly-inline-widget h-[700px] min-w-[320px]"}`,
313
+ "data-path": dataPath,
314
+ "data-url": dataUrl
315
+ }
316
+ )
317
+ }
318
+ );
319
+ };
320
+
321
+ // src/CookieConsentForm/cookieformstyles.module.css
322
+ var cookieformstyles_default = {};
323
+
324
+ // src/CookieConsentForm/CookieConsentForm.tsx
325
+ var import_jsx_runtime6 = require("react/jsx-runtime");
326
+ var CookieConsentForm = function({
327
+ positionX,
328
+ positionY,
329
+ cookieHeader = "We value your privacy",
330
+ cookieText,
331
+ onAccept,
332
+ onReject,
333
+ show,
334
+ classNames: classNames2,
335
+ type = "fixed"
336
+ }) {
337
+ const handleSelection = (permission) => {
338
+ if (permission) {
339
+ onAccept();
340
+ } else {
341
+ onReject();
342
+ }
343
+ };
344
+ return show ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
345
+ "div",
346
+ {
347
+ className: `z-[100] h-auto w-full max-w-[350px] rounded-box p-4 shadow-lg @container ${type} ${positionX} ${positionY} ${classNames2}`,
348
+ children: [
349
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: cookieformstyles_default.header, children: cookieHeader }),
350
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: cookieformstyles_default.text, children: cookieText }),
351
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: cookieformstyles_default.button_container, children: [
352
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
353
+ "button",
354
+ {
355
+ onClick: () => handleSelection(true),
356
+ className: cookieformstyles_default.accept_button,
357
+ children: "Accept"
358
+ }
359
+ ),
360
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
361
+ "button",
362
+ {
363
+ onClick: () => handleSelection(false),
364
+ className: cookieformstyles_default.reject_button,
365
+ children: "Reject"
366
+ }
367
+ )
368
+ ] })
369
+ ]
370
+ }
371
+ ) : null;
372
+ };
373
+
374
+ // src/CTA/CTA.tsx
375
+ var import_jsx_runtime7 = require("react/jsx-runtime");
376
+ var CTA = function({
377
+ type = "basic",
378
+ ctaText,
379
+ onClick,
380
+ subheading,
381
+ paragraph,
382
+ smallheading,
383
+ classNames: classNames2
384
+ }) {
385
+ const basicLayoutStyles = classNames2 ? classNames2 : "bg-base-300 w-[100%] px-4 py-12 sm:px-8 sm:py-24 md:px-16 md:py-32 lg:py-32";
386
+ const renderCTALayout = () => {
387
+ switch (type) {
388
+ case "emphasized":
389
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", {});
390
+ case "minimal":
391
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", {});
392
+ default:
393
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `${basicLayoutStyles} @container`, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex w-full flex-col items-center @2xl:flex-row gap-8", children: [
394
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex w-full flex-col items-center gap-2 @2xl:items-start", children: [
395
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mb-3 text-center text-sm font-semibold uppercase tracking-[0.5px] text-secondary", children: smallheading }),
396
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { className: "mb-4 text-center text-3xl font-semibold @2xl:text-start", children: subheading }),
397
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mb-4 text-center opacity-60 @2xl:text-start", children: paragraph })
398
+ ] }),
399
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "relative z-50 flex flex-col min-w-[15vw] items-center @2xl:items-end", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { onClick, className: "btn btn-primary w-full transform duration-300 hover:scale-[0.95] @xl:w-auto", children: ctaText }) })
400
+ ] }) });
401
+ }
402
+ };
403
+ return renderCTALayout();
404
+ };
405
+
406
+ // src/Footer/Footer.tsx
407
+ var import_jsx_runtime8 = require("react/jsx-runtime");
408
+ var Footer = function({
409
+ links,
410
+ logo,
411
+ logoText,
412
+ newsletter,
413
+ socialLinks,
414
+ maxLogoHeight,
415
+ leftElement,
416
+ openingHours
417
+ }) {
418
+ const logoHeight = maxLogoHeight ? maxLogoHeight : "50px";
419
+ const logoHeightStyle = {
420
+ "--footer-logo-height": logoHeight
421
+ };
422
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "h-full w-full @container", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("footer", { className: "footer flex w-full flex-col items-center justify-center gap-10 bg-base-200 p-10 text-base-content @xl:flex-row @xl:items-start", children: [
423
+ leftElement ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: leftElement }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: [
424
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: logoHeightStyle, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("img", { src: logo || "", alt: "Company Logo", className: "h-[var(--footer-logo-height)]" }) }),
425
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: logoText })
426
+ ] }),
427
+ links == null ? void 0 : links.map((item, index) => {
428
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("nav", { children: [
429
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("header", { className: "footer-title mx-auto @xl:mx-0", children: item.header }),
430
+ item.links.map((link, index2) => {
431
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
432
+ "a",
433
+ {
434
+ className: "link-hover link mx-auto @xl:mx-0",
435
+ href: link.url,
436
+ children: link.text
437
+ },
438
+ index2
439
+ );
440
+ })
441
+ ] }, index);
442
+ }),
443
+ socialLinks && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("nav", { children: [
444
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("header", { className: "footer-title mx-auto @xl:mx-0", children: "Social" }),
445
+ socialLinks == null ? void 0 : socialLinks.map((link, index) => {
446
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
447
+ "a",
448
+ {
449
+ href: link.url,
450
+ className: "link-hover link mx-auto @xl:mx-0",
451
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(link.icon, { className: "text-base-content", size: 30 })
452
+ },
453
+ index
454
+ );
455
+ })
456
+ ] }),
457
+ openingHours && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-col gap-2 w-fit", children: [
458
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("header", { className: "footer-title mx-auto @xl:mx-0", children: openingHours.header }),
459
+ openingHours.hours.map(({ day, openingTime }, index, arr) => {
460
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center w-[200px] justify-between", children: [
461
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { className: "inline-block w-fit", children: day }),
462
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
463
+ "p",
464
+ {
465
+ className: `inline-block w-fit ${openingTime === "Closed" && "font-semibold"}`,
466
+ children: openingTime
467
+ }
468
+ )
469
+ ] }, index);
470
+ })
471
+ ] })
472
+ ] }) });
473
+ };
474
+
475
+ // src/Hero/Hero.tsx
476
+ var import_jsx_runtime9 = require("react/jsx-runtime");
477
+ var Hero = function({
478
+ styleType,
479
+ headline,
480
+ subheadline,
481
+ children,
482
+ imageSrc,
483
+ classNames: classNames2 = "h-screen",
484
+ imageAlt = "",
485
+ imageOverlayOpacity = 0.7
486
+ }) {
487
+ const backgroundImageStyle = styleType === "Image" && imageSrc ? { backgroundImage: `url(${imageSrc})` } : {};
488
+ const overlayOpacityStyle = styleType === "Image" ? { opacity: imageOverlayOpacity } : {};
489
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
490
+ "div",
491
+ {
492
+ style: backgroundImageStyle,
493
+ className: `${classNames2} hero relative w-full overflow-hidden @container`,
494
+ "aria-label": styleType === "Image" ? imageAlt : void 0,
495
+ children: [
496
+ styleType === "Image" && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { style: overlayOpacityStyle, className: "hero-overlay absolute left-0 top-0 z-0 h-[100%] w-[100%] bg-base-100" }),
497
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "hero-content flex h-auto pt-48 max-w-3xl flex-col gap-4 text-center md:gap-6", children: [
498
+ headline && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { className: "text-4xl font-bold md:text-5xl lg:text-6xl xl:text-7xl", children: headline }),
499
+ subheadline && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "mb-8 mt-6 text-base sm:text-lg", children: subheadline }),
500
+ children
501
+ ] })
502
+ ]
503
+ }
504
+ );
505
+ };
506
+
507
+ // src/Masonry/Masonry.tsx
508
+ var import_react6 = __toESM(require("react"));
509
+ var import_jsx_runtime10 = require("react/jsx-runtime");
510
+ var Masonry = ({
511
+ children,
512
+ classNames: classNames2 = "mx-auto w-full columns-1 space-y-4 p-4 @2xl:columns-2 @3xl:columns-3 @4xl:w-[90%] @5xl:w-[85%]",
513
+ itemMaxWidth = "max-w-[425px]"
514
+ }) => {
515
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-full w-full @container", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: `${classNames2}`, children: import_react6.default.Children.map(
516
+ children,
517
+ (child, index) => import_react6.default.isValidElement(child) ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
518
+ "div",
519
+ {
520
+ className: `${child.props.className} mx-auto ${itemMaxWidth}`,
521
+ children: child.props.children
522
+ },
523
+ index
524
+ ) : null
525
+ ) }) });
526
+ };
527
+
528
+ // src/Navbar/Navbar.tsx
529
+ var import_jsx_runtime11 = require("react/jsx-runtime");
530
+ var Navbar = function({
531
+ logo,
532
+ links,
533
+ type = "default",
534
+ ctaElement,
535
+ classNames: classNames2,
536
+ maxLogoHeight,
537
+ children
538
+ }) {
539
+ const renderMenuItem = () => {
540
+ return links.map((link, idx) => {
541
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("a", { href: link.link, className: "btn btn-sm btn-ghost", children: link.text }, idx);
542
+ });
543
+ };
544
+ const roundedClassNames = type === "rounded" ? "navbar mx-auto flex max-w-[95%] items-center justify-between rounded-full bg-base-200 px-4 py-2 shadow-sm @xl:max-w-[90%] @2xl:max-w-[85%] @3xl:max-w-[80%] @4xl:max-w-[75%]" : null;
545
+ const fullClassNames = type === "full" ? "flex w-[100%] items-center justify-between bg-base-200 px-4 py-2" : null;
546
+ const defaultClassNames = type === "default" ? "navbar mx-auto flex w-full items-center justify-between rounded-box px-4 py-2 shadow-sm" : null;
547
+ const containerClasses = roundedClassNames || fullClassNames || defaultClassNames;
548
+ const logoHeight = maxLogoHeight ? maxLogoHeight : "50px";
549
+ const logoHeightStyle = { "--logo-height": logoHeight };
550
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "w-full @container", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: `${containerClasses} ${classNames2}`, children: [
551
+ !!children ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex flex-row justify-between items-center", children }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "h-[var(--logo-height)]", style: logoHeightStyle, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("img", { className: "h-[var(--logo-height)]", src: logo || "", alt: "logo" }) }),
552
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("ul", { className: "menu menu-horizontal hidden items-center gap-2 px-1 @2xl:flex flex-nowrap", children: renderMenuItem() }),
553
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("ul", { className: "menu menu-horizontal items-center gap-2 px-1 @2xl:hidden", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { className: "flex", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("details", { className: "items-start", children: [
554
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("summary", { children: "Navigate" }),
555
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex flex-col gap-2 absolute bg-base-300 rounded-box mt-2 p-4", children: renderMenuItem() })
556
+ ] }) }) }),
557
+ ctaElement && ctaElement
558
+ ] }) });
559
+ };
560
+
561
+ // src/Offer/Offer.tsx
562
+ var import_react7 = require("react");
563
+ var import_jsx_runtime12 = require("react/jsx-runtime");
564
+ var Offer = ({
565
+ offer,
566
+ offerDateEnd,
567
+ ctaText,
568
+ ctaFunctionality,
569
+ btnClassnames = "btn btn-secondary btn-sm",
570
+ fontSize = "text-3xl",
571
+ classNames: classNames2 = "p-4 bg-accent text-white"
572
+ }) => {
573
+ const [timeRemaining, setTimeRemaining] = (0, import_react7.useState)({
574
+ days: 0,
575
+ hours: 0,
576
+ minutes: 0,
577
+ seconds: 0
578
+ });
579
+ (0, import_react7.useEffect)(() => {
580
+ const intervalId = setInterval(() => updateCountdown(offerDateEnd), 1e3);
581
+ return () => clearInterval(intervalId);
582
+ }, [offerDateEnd]);
583
+ function updateCountdown(endDate) {
584
+ const now = /* @__PURE__ */ new Date();
585
+ const difference = endDate.getTime() - now.getTime();
586
+ if (difference <= 0) {
587
+ setTimeRemaining({ days: 0, hours: 0, minutes: 0, seconds: 0 });
588
+ return;
589
+ }
590
+ const seconds = Math.floor(difference / 1e3 % 60);
591
+ const minutes = Math.floor(difference / 1e3 / 60 % 60);
592
+ const hours = Math.floor(difference / (1e3 * 60 * 60) % 24);
593
+ const days = Math.floor(difference / (1e3 * 60 * 60 * 24));
594
+ setTimeRemaining({ days, hours, minutes, seconds });
595
+ }
596
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: `w-full flex items-center justify-between ${classNames2}`, children: [
597
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex flex-col flex-1 justify-center items-start", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "offer_text", children: offer }) }),
598
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex gap-4 items-center justify-center", children: [
599
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "invisible w-0 grid grid-flow-col gap-5 text-center auto-cols-max md:visible md:w-auto", children: [
600
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col", children: [
601
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `countdown font-mono text-5xl ${fontSize}`, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { "--value": timeRemaining.days } }) }),
602
+ "days"
603
+ ] }),
604
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col", children: [
605
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `countdown font-mono text-5xl ${fontSize}`, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { "--value": timeRemaining.hours } }) }),
606
+ "hours"
607
+ ] }),
608
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col", children: [
609
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `countdown font-mono text-5xl ${fontSize}`, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { "--value": timeRemaining.minutes } }) }),
610
+ "min"
611
+ ] }),
612
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col", children: [
613
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: `countdown font-mono text-5xl ${fontSize}`, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { "--value": timeRemaining.seconds } }) }),
614
+ "sec"
615
+ ] })
616
+ ] }),
617
+ ctaText && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { onClick: ctaFunctionality, className: btnClassnames, children: ctaText })
618
+ ] })
619
+ ] });
620
+ };
621
+
622
+ // src/PrettyCard/PrettyCard.tsx
623
+ var import_react8 = __toESM(require("react"));
624
+ var import_react9 = require("@gsap/react");
625
+ var import_gsap = __toESM(require("gsap"));
626
+ var import_all2 = require("gsap/all");
627
+ var import_jsx_runtime13 = require("react/jsx-runtime");
628
+ import_gsap.default.registerPlugin(import_all2.ScrollTrigger);
629
+ var PrettyCard = ({
630
+ buttonText,
631
+ altButtonJsx,
632
+ content,
633
+ cardImage,
634
+ children,
635
+ gradientColors,
636
+ showAnimationOnce = false,
637
+ className = "relative bg-base-300/40 z-10 box-border shadow-lg flex flex-col items-center justify-end md:h-[38.75rem] mb-5 p-12 rounded-box overflow-hidden lg:h-[38.75rem] lg:p-20 xl:h-[45.75rem]"
638
+ }) => {
639
+ (0, import_react9.useGSAP)(() => {
640
+ let btnId = "#cta-button";
641
+ if (import_react8.default.isValidElement(altButtonJsx)) {
642
+ const { id } = altButtonJsx.props;
643
+ btnId = "#" + id;
644
+ }
645
+ const tl = import_gsap.default.timeline();
646
+ tl.fromTo(
647
+ "#gradient-element",
648
+ {
649
+ scale: 2,
650
+ opacity: 0.5
651
+ },
652
+ {
653
+ scale: 1,
654
+ opacity: 1,
655
+ scrollTrigger: {
656
+ once: showAnimationOnce,
657
+ trigger: "#parent-element",
658
+ start: "center center+=80",
659
+ end: "center center+=10",
660
+ scrub: true
661
+ },
662
+ ease: "linear"
663
+ }
664
+ );
665
+ tl.fromTo(
666
+ btnId,
667
+ {
668
+ xPercent: -125,
669
+ opacity: 0
670
+ },
671
+ {
672
+ opacity: 1,
673
+ xPercent: 0,
674
+ scrollTrigger: {
675
+ once: showAnimationOnce,
676
+ trigger: "#parent-element",
677
+ start: "center center+=10",
678
+ end: "center center",
679
+ scrub: true
680
+ },
681
+ ease: "linear"
682
+ }
683
+ );
684
+ tl.fromTo(
685
+ "#image-element",
686
+ {
687
+ opacity: 0,
688
+ scale: 2
689
+ },
690
+ {
691
+ opacity: 1,
692
+ scale: 1,
693
+ scrollTrigger: {
694
+ once: showAnimationOnce,
695
+ trigger: "#parent-element",
696
+ start: "center center+=100",
697
+ end: "center center+=50",
698
+ scrub: true
699
+ },
700
+ ease: "linear"
701
+ }
702
+ );
703
+ tl.fromTo(
704
+ "#card-element",
705
+ {
706
+ xPercent: 125,
707
+ opacity: 0
708
+ },
709
+ {
710
+ xPercent: 0,
711
+ opacity: 1,
712
+ scrollTrigger: {
713
+ once: showAnimationOnce,
714
+ trigger: "#parent-element",
715
+ start: "center center+=80",
716
+ end: "center center+=10",
717
+ scrub: true
718
+ },
719
+ ease: "linear"
720
+ }
721
+ );
722
+ }, []);
723
+ const gradient = gradientColors ? `bg-gradient-to-br ${gradientColors.start} ${gradientColors.end}` : "bg-gradient-to-br from-accent to-primary";
724
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
725
+ "div",
726
+ {
727
+ id: "parent-element",
728
+ className: `${className}`,
729
+ children: [
730
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "absolute top-0 right-0 flex justify-center md:justify-start lg:left-0 lg:top-0 w-full h-full pointer-events-none xl:w-auto", children: cardImage && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
731
+ "img",
732
+ {
733
+ id: "image-element",
734
+ alt: "card",
735
+ loading: "lazy",
736
+ decoding: "async",
737
+ className: "invisible hidden sm:inline-block sm:visible transition-opacity w-full h-full object-cover md:object-left relative z-10 opacity-90 max-w-[65%]",
738
+ src: cardImage
739
+ }
740
+ ) }),
741
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { id: "card-element", className: `relative z-10 lg:ml-auto`, children: [
742
+ content,
743
+ children
744
+ ] }),
745
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex w-full justify-center absolute px-4 bottom-4 lg:justify-start", children: [
746
+ altButtonJsx && altButtonJsx,
747
+ !altButtonJsx && buttonText && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { id: "cta-button", className: "btn btn-primary z-10 shadow-md", children: buttonText })
748
+ ] }),
749
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
750
+ "div",
751
+ {
752
+ id: "gradient-element",
753
+ style: { transform: "translate3d(0, 0, 0)" },
754
+ className: `z-0 w-[80vw] h-[80vh] rounded-full blur-[90px] absolute bottom-0 right-0 opacity-60 ${gradient}`
755
+ }
756
+ )
757
+ ]
758
+ }
759
+ );
760
+ };
761
+
762
+ // src/Ratings/Ratings.tsx
763
+ var import_fa6 = require("react-icons/fa6");
764
+ var import_jsx_runtime14 = require("react/jsx-runtime");
765
+ var Ratings = function({ imagesSrc, rating, trusted, column }) {
766
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex items-center justify-center py-4 @container", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
767
+ "div",
768
+ {
769
+ className: `mx-auto flex items-center justify-center ${column && "flex-col"} gap-2`,
770
+ children: [
771
+ imagesSrc && imagesSrc.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "@apply relative h-[45px] w-[165px]", children: imagesSrc == null ? void 0 : imagesSrc.map((src, idx) => {
772
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
773
+ "div",
774
+ {
775
+ style: { left: `${idx * 30}px` },
776
+ className: "@apply absolute flex h-[40px] w-[40px] items-center justify-center rounded-full bg-base-100",
777
+ children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
778
+ "img",
779
+ {
780
+ src,
781
+ alt: "Client profile picture",
782
+ height: 50,
783
+ width: 50,
784
+ className: "@apply h-[35px] w-[35px] rounded-full object-cover"
785
+ }
786
+ )
787
+ },
788
+ idx
789
+ );
790
+ }) }),
791
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
792
+ "div",
793
+ {
794
+ className: `flex flex-col gap-2 ${column && "items-center"}`,
795
+ children: [
796
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("p", { className: "@apply text-left text-xs", children: [
797
+ "Trusted by ",
798
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("strong", { children: [
799
+ trusted || 100,
800
+ "+"
801
+ ] }),
802
+ " people"
803
+ ] }),
804
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "@apply flex w-full items-center justify-center", children: [...Array(5)].map((_, idx) => {
805
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
806
+ import_fa6.FaStar,
807
+ {
808
+ size: 22.5,
809
+ className: `
810
+ ${idx >= rating ? "text-gray-400" : "text-primary"} `
811
+ },
812
+ idx
813
+ );
814
+ }) })
815
+ ]
816
+ }
817
+ )
818
+ ]
819
+ }
820
+ ) });
821
+ };
822
+
823
+ // src/SectionContainer/SectionContainer.tsx
824
+ var import_jsx_runtime15 = require("react/jsx-runtime");
825
+ var SectionContainer = ({ children, classNames: classNames2, padded = true, id }) => {
826
+ const paddingClasses = padded ? "px-4 py-12 sm:px-8 sm:py-20 md:px-16 md:py-30 lg:px-30 lg:py-32" : "";
827
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: `${paddingClasses} ${classNames2}`, id: id || "", children });
828
+ };
829
+
830
+ // src/SectionHeader/SectionHeader.tsx
831
+ var import_jsx_runtime16 = require("react/jsx-runtime");
832
+ var SectionHeader = function({
833
+ headline,
834
+ subheadline,
835
+ classNames: classNames2,
836
+ children,
837
+ breakpoint = "sm",
838
+ headlineTag = "h2",
839
+ mobileAlignment = "center",
840
+ desktopAlignment = "center",
841
+ gap = "4"
842
+ }) {
843
+ const isTwoColumnLayout = children !== void 0;
844
+ const HeadlineTag = headlineTag;
845
+ const alignmentClass = `${breakpoint}:text-${mobileAlignment} text-${desktopAlignment}`;
846
+ const twoColumnClasses = `flex flex-col ${breakpoint}:flex-row gap-${gap} w-full justify-between items-center`;
847
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
848
+ "div",
849
+ {
850
+ className: `w-full ${classNames2 || ""} mb-${Number(gap) * 2}`,
851
+ children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
852
+ "div",
853
+ {
854
+ className: `${isTwoColumnLayout ? twoColumnClasses : ""}`,
855
+ "data-breakpoint": breakpoint,
856
+ children: [
857
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("article", { className: `prose ${alignmentClass} gap-${gap} flex flex-col`, children: [
858
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HeadlineTag, { className: "text-4xl font-bold", children: headline }),
859
+ subheadline && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("h5", { className: "text-2xl font-semibold", children: subheadline })
860
+ ] }),
861
+ isTwoColumnLayout && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children })
862
+ ]
863
+ }
864
+ )
865
+ }
866
+ );
867
+ };
868
+
869
+ // src/SellingProposition/SellingProposition.tsx
870
+ var import_jsx_runtime17 = require("react/jsx-runtime");
871
+ var SellingProposition = function({
872
+ sellingItems,
873
+ containerClassNames
874
+ }) {
875
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "w-[100%] @container", children: sellingItems == null ? void 0 : sellingItems.map((item, index) => {
876
+ if (typeof item.a === "string") {
877
+ item.a = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { dangerouslySetInnerHTML: { __html: item.a } });
878
+ }
879
+ if (typeof item.b === "string") {
880
+ item.b = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { dangerouslySetInnerHTML: { __html: item.b } });
881
+ }
882
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: `mx-auto mb-8 flex w-[100%] flex-col items-center gap-2 rounded-box py-4 @xs:w-[90%] @sm:w-[85%] @md:max-w-[500px] @3xl:w-[100%] @3xl:max-w-[900px] @3xl:flex-row ${containerClassNames}`, children: [
883
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "card grid w-full max-w-[95%] flex-grow place-items-center rounded-box @3xl:max-w-[50%] @3xl:p-8", children: index % 2 === 0 ? item.a : item.b }),
884
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "card grid w-full max-w-[95%] flex-grow place-items-center rounded-box @3xl:max-w-[50%] @3xl:p-8", children: index % 2 === 0 ? item.b : item.a })
885
+ ] }, index);
886
+ }) });
887
+ };
888
+
889
+ // src/SellingPropContainer/SellingPropContainer.tsx
890
+ var import_jsx_runtime18 = require("react/jsx-runtime");
891
+ var SellingPropContainer = function({
892
+ smallHeader,
893
+ mainHeader,
894
+ text,
895
+ ctaText,
896
+ ctaFunctionality
897
+ }) {
898
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "w-full @container", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex w-full flex-col items-center justify-between gap-4 p-4", children: [
899
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-center text-sm font-semibold uppercase text-secondary", children: smallHeader }),
900
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("h3", { className: "text-center text-2xl font-bold", children: [
901
+ mainHeader,
902
+ mainHeader
903
+ ] }),
904
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-center", children: text }),
905
+ ctaText && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { className: "btn btn-outline", onClick: ctaFunctionality, children: ctaText })
906
+ ] }) });
907
+ };
908
+
909
+ // src/StackedScroller/StackedScroller.tsx
910
+ var import_gsap2 = __toESM(require("gsap"));
911
+ var import_react10 = require("@gsap/react");
912
+ var import_all3 = require("gsap/all");
913
+ var import_react11 = require("react");
914
+ var import_jsx_runtime19 = require("react/jsx-runtime");
915
+ import_gsap2.default.registerPlugin(import_all3.ScrollTrigger);
916
+ var StackedScroller = function({
917
+ services,
918
+ defaultHeading,
919
+ activeHeaderClassNames,
920
+ activeTextClassNames,
921
+ activeContainerClassNames,
922
+ defaultContainerClassNames
923
+ }) {
924
+ const [firstRound, setFirstRound] = (0, import_react11.useState)(true);
925
+ const newServices = services.map((item, index) => {
926
+ return __spreadProps(__spreadValues({}, item), {
927
+ id: "item-" + (index + 1),
928
+ active: false
929
+ });
930
+ });
931
+ const [activeElements, setActiveElements] = (0, import_react11.useState)(newServices);
932
+ const updateActiveElements = (id) => {
933
+ const newOne = newServices.map((item, index) => {
934
+ if (id === `item-${index + 1}`)
935
+ return __spreadProps(__spreadValues({}, item), { active: true });
936
+ return item;
937
+ });
938
+ return newOne;
939
+ };
940
+ const update = (id) => {
941
+ const newActiveElements = updateActiveElements(id);
942
+ setActiveElements(newActiveElements);
943
+ };
944
+ (0, import_react10.useGSAP)(() => {
945
+ newServices.forEach(({ id }, index) => {
946
+ import_gsap2.default.fromTo(
947
+ `#${id}`,
948
+ {
949
+ opacity: firstRound ? 0 : 1,
950
+ x: firstRound ? index % 2 === 0 ? -100 : 100 : 0
951
+ },
952
+ {
953
+ opacity: 1,
954
+ x: 0,
955
+ scrollTrigger: {
956
+ trigger: "#" + id,
957
+ once: firstRound,
958
+ start: "center center+=150",
959
+ end: "center center+=50",
960
+ scrub: true,
961
+ // markers: true,
962
+ onLeave: () => {
963
+ if (index === newServices.length - 1)
964
+ setFirstRound(false);
965
+ },
966
+ onEnter: () => {
967
+ update(id);
968
+ },
969
+ onEnterBack: () => {
970
+ update(id);
971
+ },
972
+ onLeaveBack: () => {
973
+ update(id);
974
+ }
975
+ },
976
+ ease: "linear"
977
+ }
978
+ );
979
+ });
980
+ }, [firstRound]);
981
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
982
+ "div",
983
+ {
984
+ id: "stacked-scroller",
985
+ className: "w-full py-6 flex flex-col items-center gap-20",
986
+ children: newServices.map(({ text, title, id }, index) => {
987
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
988
+ "div",
989
+ {
990
+ id,
991
+ className: `${activeElements[index].active && activeContainerClassNames} ${defaultContainerClassNames} max-w-[90vw] sm:max-w-[80vw] md:max-w-[75vw] duration-200 lg:max-w-[65vw] flex p-4 flex-col gap-2 items-center`,
992
+ children: [
993
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
994
+ "h4",
995
+ {
996
+ className: `${activeElements[index].active ? activeHeaderClassNames : defaultHeading} `,
997
+ children: title
998
+ }
999
+ ),
1000
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: activeTextClassNames, children: text })
1001
+ ]
1002
+ },
1003
+ index
1004
+ );
1005
+ })
1006
+ }
1007
+ );
1008
+ };
1009
+
1010
+ // src/TestimonialCard/TestimonialCard.tsx
1011
+ var import_fa62 = require("react-icons/fa6");
1012
+ var import_jsx_runtime20 = require("react/jsx-runtime");
1013
+ var TestimonialCard = function({
1014
+ testimonialContent,
1015
+ carousel,
1016
+ classNames: classNames2 = ""
1017
+ }) {
1018
+ const { text, author, photoUrl, link, companyOrPosition } = testimonialContent;
1019
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
1020
+ "div",
1021
+ {
1022
+ className: `${classNames2} ${carousel ? "gap-4" : "m-0"} relative flex w-auto break-inside-avoid flex-col items-center justify-center gap-4 rounded-box p-2 px-1 py-4 @container @md:p-4`,
1023
+ children: [
1024
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex w-full items-center justify-center text-4xl opacity-30 @sm:justify-end @sm:text-2xl @lg:text-4xl", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fa62.FaQuoteLeft, {}) }),
1025
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "flex w-full items-center justify-center p-0 text-center leading-[22px] @sm:justify-start @sm:px-6 @sm:py-2 @sm:text-left", children: text }),
1026
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "my-2 h-[0.5px] w-full border-t border-base-content opacity-10" }),
1027
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex w-full flex-col items-center gap-2 px-6 py-2 opacity-70 @sm:flex-row @sm:items-start @sm:gap-4", children: [
1028
+ photoUrl ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("img", { src: photoUrl, alt: "user profile image", className: "rounded-full max-w-[50px]" }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_fa62.FaRegUser, { className: "my-auto h-auto text-inherit" }),
1029
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "", children: [
1030
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("a", { href: link || "", className: "w-full text-center text-sm @sm:text-left", children: author }),
1031
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "w-full text-center text-sm @sm:text-left", children: companyOrPosition })
1032
+ ] })
1033
+ ] })
1034
+ ]
1035
+ }
1036
+ );
1037
+ };
1038
+
1039
+ // src/TestimonialDisplay/TestimonialDisplay.tsx
1040
+ var import_react_fast_marquee = __toESM(require("react-fast-marquee"));
1041
+ var import_jsx_runtime21 = require("react/jsx-runtime");
1042
+ var TestimonialDisplay = function({
1043
+ style,
1044
+ children
1045
+ }) {
1046
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "@container w-full", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "box-border flex items-center justify-center @container/inner", children: style === "carousel" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
1047
+ import_react_fast_marquee.default,
1048
+ {
1049
+ play: true,
1050
+ className: "max-w-[90vw]",
1051
+ direction: "left",
1052
+ speed: 25,
1053
+ loop: 0,
1054
+ autoFill: true,
1055
+ pauseOnHover: true,
1056
+ pauseOnClick: true,
1057
+ children
1058
+ }
1059
+ ) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid w-full columns-1 gap-4 p-4 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4", children }) }) });
1060
+ };
1061
+
1062
+ // src/button.tsx
1063
+ var import_jsx_runtime22 = require("react/jsx-runtime");
1064
+ function Button(_a) {
1065
+ var _b = _a, { children } = _b, other = __objRest(_b, ["children"]);
1066
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", __spreadProps(__spreadValues({ type: "button" }, other), { children }));
1067
+ }
1068
+ Button.displayName = "Button";
1069
+ // Annotate the CommonJS export names for ESM import in node:
1070
+ 0 && (module.exports = {
1071
+ AccordionContainer,
1072
+ AccordionItem,
1073
+ AnimateBorder,
1074
+ AnimatedHeader,
1075
+ AnimationObserver,
1076
+ BentoBox,
1077
+ BookNow,
1078
+ Button,
1079
+ CTA,
1080
+ CookieConsentForm,
1081
+ Footer,
1082
+ Hero,
1083
+ Masonry,
1084
+ Navbar,
1085
+ Offer,
1086
+ PrettyCard,
1087
+ Ratings,
1088
+ SectionContainer,
1089
+ SectionHeader,
1090
+ SellingPropContainer,
1091
+ SellingProposition,
1092
+ StackedScroller,
1093
+ TestimonialCard,
1094
+ TestimonialDisplay
1095
+ });