@commandcenterio/convert-ui 0.0.1

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/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
+ });