@riligar/components-kit 1.0.1 → 1.1.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 CHANGED
@@ -1,1844 +1 @@
1
- 'use strict';
2
-
3
- var core = require('@mantine/core');
4
- var jsxRuntime = require('react/jsx-runtime');
5
- var hooks = require('@mantine/hooks');
6
- var iconsReact = require('@tabler/icons-react');
7
- var react = require('react');
8
-
9
- // RiLiGar Design System Theme — same as console
10
- const theme = core.createTheme({
11
- fontFamily: 'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
12
- headings: {
13
- fontFamily: 'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
14
- fontWeight: "900"
15
- },
16
- colors: {
17
- // RiLiGar Monochrome Palette - Zen Optimized
18
- gray: ["#FFFFFF",
19
- // 0: App Base (Pure White)
20
- "#F9FAFB",
21
- // 1: Hover / Secondary Background
22
- "#F3F4F6",
23
- // 2: Border Standard
24
- "#E5E7EB",
25
- // 3: Disabled / Muted Border
26
- "#9CA3AF",
27
- // 4: Quaternary Text
28
- "#6B7280",
29
- // 5: Tertiary Text (Labels)
30
- "#4B5563",
31
- // 6: Secondary Text
32
- "#374151",
33
- // 7: Secondary Text Dark
34
- "#1F2937",
35
- // 8: Primary Text Dark
36
- "#11181C" // 9: Primary Text (RiLiGar Absolute)
37
- ]
38
- },
39
- primaryColor: "gray",
40
- primaryShade: 9,
41
- autoContrast: true,
42
- defaultRadius: "0",
43
- // Zen prefers sharp or very subtle radius, defaulting to 0 for inputs/buttons
44
-
45
- components: {
46
- Container: {
47
- defaultProps: {
48
- size: "xl",
49
- // Zen uses XL containers
50
- px: "md"
51
- }
52
- },
53
- Paper: {
54
- defaultProps: {
55
- withBorder: true,
56
- shadow: "none",
57
- radius: "0",
58
- bg: "white"
59
- }
60
- },
61
- Card: {
62
- defaultProps: {
63
- withBorder: false,
64
- // Zen reduces borders
65
- shadow: "none",
66
- radius: "0",
67
- padding: "xl",
68
- bg: "transparent"
69
- }
70
- },
71
- Button: {
72
- defaultProps: {
73
- size: "md",
74
- fw: 800,
75
- radius: "0",
76
- variant: "filled",
77
- color: "gray.9"
78
- },
79
- styles: {
80
- root: {
81
- textTransform: "uppercase",
82
- letterSpacing: "1px"
83
- }
84
- }
85
- },
86
- TextInput: {
87
- defaultProps: {
88
- size: "lg",
89
- radius: "0",
90
- variant: "unstyled" // Zen Minimalist Inputs
91
- },
92
- styles: {
93
- input: {
94
- borderBottom: "1px solid var(--mantine-color-gray-2)",
95
- paddingLeft: 0,
96
- paddingRight: 0
97
- }
98
- }
99
- },
100
- Title: {
101
- defaultProps: {
102
- lh: 1.1,
103
- c: "gray.9",
104
- ls: "-0.04em" // Zen Massive Hierarchy
105
- }
106
- },
107
- Text: {
108
- defaultProps: {
109
- lh: 1.6,
110
- c: "gray.9",
111
- size: "md"
112
- }
113
- },
114
- Badge: {
115
- defaultProps: {
116
- variant: "dot",
117
- // Zen Subtle Badges
118
- color: "gray",
119
- radius: "0",
120
- size: "sm"
121
- },
122
- styles: {
123
- root: {
124
- textTransform: "uppercase",
125
- letterSpacing: "1.5px",
126
- fontWeight: 800
127
- }
128
- }
129
- },
130
- ThemeIcon: {
131
- defaultProps: {
132
- variant: "light",
133
- color: "gray",
134
- radius: "0",
135
- size: "lg"
136
- }
137
- },
138
- Divider: {
139
- defaultProps: {
140
- color: "gray.2"
141
- }
142
- }
143
- }
144
- });
145
-
146
- function SectionHeader({
147
- subtitle,
148
- title,
149
- titleOrder = 2,
150
- titleFz = "var(--fz-section-title)",
151
- ta = "left",
152
- maw
153
- }) {
154
- if (!title && !subtitle) return null;
155
- return /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
156
- gap: "xs",
157
- align: ta === "center" ? "center" : "flex-start",
158
- ta: ta,
159
- children: [subtitle && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
160
- c: "gray.4",
161
- size: "xs",
162
- fw: 800,
163
- tt: "uppercase",
164
- ls: "1.5px",
165
- children: subtitle
166
- }), title && /*#__PURE__*/jsxRuntime.jsx(core.Title, {
167
- order: titleOrder,
168
- fz: titleFz,
169
- maw: maw,
170
- children: title
171
- })]
172
- });
173
- }
174
-
175
- function MediaBlock({
176
- video,
177
- image,
178
- width = "100%",
179
- alt
180
- }) {
181
- if (video) {
182
- return /*#__PURE__*/jsxRuntime.jsx(core.Center, {
183
- children: /*#__PURE__*/jsxRuntime.jsx(core.Box, {
184
- component: "video",
185
- src: video.src,
186
- autoPlay: true,
187
- loop: true,
188
- muted: true,
189
- playsInline: true,
190
- "aria-label": alt || "Demonstração em vídeo",
191
- w: video.width || width,
192
- h: "auto",
193
- style: {
194
- filter: video.filter || "none"
195
- }
196
- })
197
- });
198
- }
199
- if (image) {
200
- return /*#__PURE__*/jsxRuntime.jsx(core.Center, {
201
- children: /*#__PURE__*/jsxRuntime.jsx(core.Box, {
202
- component: "img",
203
- src: image,
204
- alt: alt || "",
205
- w: width,
206
- h: "auto"
207
- })
208
- });
209
- }
210
- return null;
211
- }
212
-
213
- function CTAButton({
214
- label,
215
- href,
216
- onClick,
217
- icon,
218
- size = "lg",
219
- variant = "filled",
220
- color,
221
- target,
222
- px,
223
- fullWidth,
224
- leftSection,
225
- ...rest
226
- }) {
227
- return /*#__PURE__*/jsxRuntime.jsx(core.Button, {
228
- size: size,
229
- component: href ? "a" : "button",
230
- href: href,
231
- onClick: onClick,
232
- target: target,
233
- rightSection: icon,
234
- leftSection: leftSection,
235
- variant: variant,
236
- color: color,
237
- px: px,
238
- fullWidth: fullWidth,
239
- ...rest,
240
- children: label
241
- });
242
- }
243
-
244
- function Layout({
245
- children,
246
- title,
247
- subtitle,
248
- id,
249
- bg = "white",
250
- py = {
251
- base: 80,
252
- md: 120
253
- },
254
- maw = 800,
255
- ta = "left",
256
- stackGap = "xl"
257
- }) {
258
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
259
- component: "section",
260
- id: id,
261
- bg: bg,
262
- py: py,
263
- style: {
264
- overflow: "hidden"
265
- },
266
- children: /*#__PURE__*/jsxRuntime.jsx(core.Container, {
267
- size: "lg",
268
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
269
- gap: stackGap,
270
- children: [/*#__PURE__*/jsxRuntime.jsx(SectionHeader, {
271
- subtitle: subtitle,
272
- title: title,
273
- ta: ta,
274
- maw: maw
275
- }), /*#__PURE__*/jsxRuntime.jsx(core.Box, {
276
- children: children
277
- })]
278
- })
279
- })
280
- });
281
- }
282
-
283
- function Header({
284
- logo,
285
- navLinks = [],
286
- loginCta,
287
- signupCta
288
- }) {
289
- const [scroll] = hooks.useWindowScroll();
290
- const scrolled = scroll.y > 10;
291
- const handleNavClick = target => {
292
- if (target === "top") {
293
- window.scrollTo({
294
- top: 0,
295
- behavior: "smooth"
296
- });
297
- } else {
298
- document.getElementById(target)?.scrollIntoView({
299
- behavior: "smooth"
300
- });
301
- }
302
- };
303
- const handleNavKeyDown = (e, target) => {
304
- if (e.key === "Enter" || e.key === " ") {
305
- e.preventDefault();
306
- handleNavClick(target);
307
- }
308
- };
309
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
310
- component: "header",
311
- pos: "sticky",
312
- top: 0,
313
- w: "100%",
314
- style: {
315
- zIndex: 100,
316
- pointerEvents: "none"
317
- },
318
- children: /*#__PURE__*/jsxRuntime.jsx(core.Container, {
319
- size: "xl",
320
- py: "md",
321
- children: /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
322
- shadow: scrolled ? "sm" : "none",
323
- radius: "0",
324
- p: "xs",
325
- bg: "white",
326
- bd: scrolled ? "1px solid var(--mantine-color-gray-2)" : "1px solid transparent",
327
- style: {
328
- pointerEvents: "auto",
329
- transition: "all 0.2s ease"
330
- },
331
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
332
- justify: "space-between",
333
- align: "center",
334
- px: {
335
- base: "xs",
336
- sm: "md"
337
- },
338
- children: [logo && /*#__PURE__*/jsxRuntime.jsx("a", {
339
- href: "#",
340
- "aria-label": "Voltar ao topo",
341
- onClick: e => {
342
- e.preventDefault();
343
- window.scrollTo({
344
- top: 0,
345
- behavior: "smooth"
346
- });
347
- },
348
- style: {
349
- display: "inline-flex"
350
- },
351
- children: /*#__PURE__*/jsxRuntime.jsx("img", {
352
- src: logo.src,
353
- alt: logo.alt || "",
354
- height: logo.height || 32,
355
- style: {
356
- objectFit: "contain"
357
- }
358
- })
359
- }), navLinks.length > 0 && /*#__PURE__*/jsxRuntime.jsx(core.Group, {
360
- gap: "xl",
361
- visibleFrom: "sm",
362
- component: "nav",
363
- role: "navigation",
364
- "aria-label": "Menu principal",
365
- children: navLinks.map(link => /*#__PURE__*/jsxRuntime.jsx(core.Text, {
366
- size: "sm",
367
- fw: 900,
368
- tt: "uppercase",
369
- ls: "1px",
370
- c: "dark",
371
- role: "link",
372
- tabIndex: 0,
373
- style: {
374
- cursor: "pointer"
375
- },
376
- onClick: () => handleNavClick(link.target),
377
- onKeyDown: e => handleNavKeyDown(e, link.target),
378
- children: link.label
379
- }, link.label))
380
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
381
- gap: "sm",
382
- children: [loginCta && /*#__PURE__*/jsxRuntime.jsx(core.Button, {
383
- variant: "subtle",
384
- component: loginCta.href ? "a" : "button",
385
- href: loginCta.href,
386
- onClick: loginCta.onClick,
387
- c: "gray.7",
388
- size: "sm",
389
- radius: "0",
390
- visibleFrom: "xs",
391
- fw: 900,
392
- children: loginCta.label
393
- }), signupCta && /*#__PURE__*/jsxRuntime.jsxs(core.Button, {
394
- component: signupCta.href ? "a" : "button",
395
- href: signupCta.href,
396
- onClick: signupCta.onClick,
397
- size: "sm",
398
- radius: "0",
399
- color: "dark",
400
- variant: "filled",
401
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
402
- span: true,
403
- visibleFrom: "sm",
404
- c: "white",
405
- fw: 900,
406
- size: "sm",
407
- children: signupCta.label
408
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
409
- span: true,
410
- hiddenFrom: "sm",
411
- c: "white",
412
- fw: 900,
413
- size: "xs",
414
- children: signupCta.labelMobile || signupCta.label
415
- })]
416
- })]
417
- })]
418
- })
419
- })
420
- })
421
- });
422
- }
423
-
424
- /** @deprecated Use Header instead */
425
- const Navbar = Header;
426
-
427
- function Hero({
428
- subtitle,
429
- title,
430
- description,
431
- cta,
432
- video,
433
- image
434
- }) {
435
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
436
- py: {
437
- base: 80,
438
- sm: 100,
439
- md: 140
440
- },
441
- id: "hero",
442
- bg: "white",
443
- children: /*#__PURE__*/jsxRuntime.jsx(core.Container, {
444
- size: "lg",
445
- children: /*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
446
- cols: {
447
- base: 1,
448
- md: 2
449
- },
450
- spacing: {
451
- base: 60,
452
- md: 100
453
- },
454
- verticalSpacing: 60,
455
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
456
- align: {
457
- base: "center",
458
- md: "flex-start"
459
- },
460
- justify: "center",
461
- gap: {
462
- base: 32,
463
- md: 48
464
- },
465
- ta: {
466
- base: "center",
467
- md: "left"
468
- },
469
- children: [/*#__PURE__*/jsxRuntime.jsx(SectionHeader, {
470
- subtitle: subtitle,
471
- title: title,
472
- titleOrder: 1,
473
- titleFz: "var(--fz-hero)",
474
- ta: "inherit"
475
- }), description && /*#__PURE__*/jsxRuntime.jsx(core.Center, {
476
- children: /*#__PURE__*/jsxRuntime.jsx(core.Text, {
477
- size: "xl",
478
- c: "gray.6",
479
- lh: 1.6,
480
- maw: 600,
481
- children: description
482
- })
483
- }), cta && /*#__PURE__*/jsxRuntime.jsx(core.Center, {
484
- children: /*#__PURE__*/jsxRuntime.jsx(core.Group, {
485
- gap: "md",
486
- justify: {
487
- base: "center",
488
- md: "flex-start"
489
- },
490
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
491
- label: cta.label,
492
- href: cta.href,
493
- icon: cta.icon,
494
- size: cta.size || "xl",
495
- px: cta.px || 48,
496
- variant: cta.variant,
497
- color: cta.color
498
- })
499
- })
500
- })]
501
- }), /*#__PURE__*/jsxRuntime.jsx(MediaBlock, {
502
- video: video,
503
- image: image,
504
- alt: "Demonstra\xE7\xE3o do produto"
505
- })]
506
- })
507
- })
508
- });
509
- }
510
-
511
- function LogoItem({
512
- logo,
513
- index
514
- }) {
515
- const imageProps = {
516
- src: logo.src,
517
- alt: logo.alt || `Logo ${index}`,
518
- h: logo.height || 50,
519
- w: "auto",
520
- style: {
521
- filter: "grayscale(1) opacity(0.4)",
522
- transition: "filter 0.3s ease, opacity 0.3s ease",
523
- ...logo.style
524
- },
525
- onMouseEnter: e => {
526
- e.currentTarget.style.filter = "grayscale(0) opacity(0.8)";
527
- },
528
- onMouseLeave: e => {
529
- e.currentTarget.style.filter = "grayscale(1) opacity(0.4)";
530
- }
531
- };
532
- if (logo.url) {
533
- return /*#__PURE__*/jsxRuntime.jsx(core.Center, {
534
- children: /*#__PURE__*/jsxRuntime.jsx("a", {
535
- href: logo.url,
536
- target: "_blank",
537
- rel: "noopener noreferrer",
538
- children: /*#__PURE__*/jsxRuntime.jsx(core.Image, {
539
- ...imageProps
540
- })
541
- })
542
- });
543
- }
544
- return /*#__PURE__*/jsxRuntime.jsx(core.Center, {
545
- children: /*#__PURE__*/jsxRuntime.jsx(core.Image, {
546
- ...imageProps
547
- })
548
- });
549
- }
550
-
551
- /**
552
- * SocialProof - Logo bar showing partner/client logos.
553
- *
554
- * @param {string} id - Section ID for scroll navigation
555
- * @param {string} title - Optional heading text
556
- * @param {array} logos - [{ src, alt, height, url?, style? }]
557
- */
558
- function SocialProof({
559
- id,
560
- title,
561
- logos
562
- }) {
563
- if (!logos || logos.length === 0) return null;
564
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
565
- component: "section",
566
- id: id,
567
- py: {
568
- base: 40,
569
- md: 60
570
- },
571
- bg: "white",
572
- bd: {
573
- bottom: "1px solid var(--mantine-color-gray-1)"
574
- },
575
- children: /*#__PURE__*/jsxRuntime.jsx(core.Container, {
576
- size: "lg",
577
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
578
- align: "center",
579
- ta: "center",
580
- gap: "xl",
581
- children: [title && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
582
- fw: 500,
583
- c: "gray.5",
584
- size: "sm",
585
- tt: "uppercase",
586
- ls: "0.1em",
587
- children: title
588
- }), /*#__PURE__*/jsxRuntime.jsx(core.Group, {
589
- justify: "space-between",
590
- gap: {
591
- base: 40,
592
- md: 80
593
- },
594
- style: {
595
- rowGap: 40
596
- },
597
- w: "100%",
598
- children: logos.map((logo, i) => /*#__PURE__*/jsxRuntime.jsx(LogoItem, {
599
- logo: logo,
600
- index: i
601
- }, i))
602
- })]
603
- })
604
- })
605
- });
606
- }
607
-
608
- function FeatureSplit({
609
- id,
610
- subtitle,
611
- title,
612
- description,
613
- featuresList,
614
- cta,
615
- video,
616
- image,
617
- reverse = false,
618
- bg
619
- }) {
620
- const listComponent = featuresList && featuresList.length > 0 && /*#__PURE__*/jsxRuntime.jsx(core.List, {
621
- spacing: "md",
622
- size: "md",
623
- center: true,
624
- icon: /*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
625
- color: "gray.2",
626
- size: 24,
627
- radius: "0",
628
- children: /*#__PURE__*/jsxRuntime.jsx(iconsReact.IconCheck, {
629
- size: 14,
630
- color: "var(--mantine-color-gray-9)"
631
- })
632
- }),
633
- children: featuresList.map((item, index) => /*#__PURE__*/jsxRuntime.jsx(core.List.Item, {
634
- children: item
635
- }, index))
636
- });
637
- const contentCol = /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
638
- justify: "center",
639
- gap: "lg",
640
- children: [description && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
641
- c: "gray.6",
642
- size: "xl",
643
- lh: 1.6,
644
- children: description
645
- }), listComponent, cta && /*#__PURE__*/jsxRuntime.jsx(core.Group, {
646
- mt: "md",
647
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
648
- label: cta.label,
649
- href: cta.href,
650
- icon: cta.icon,
651
- size: cta.size || "lg",
652
- variant: cta.variant,
653
- color: cta.color
654
- })
655
- })]
656
- });
657
- const mediaCol = (video || image) && /*#__PURE__*/jsxRuntime.jsx(MediaBlock, {
658
- video: video,
659
- image: image,
660
- width: "80%"
661
- });
662
- return /*#__PURE__*/jsxRuntime.jsx(Layout, {
663
- id: id,
664
- subtitle: subtitle,
665
- title: title,
666
- bg: bg,
667
- children: /*#__PURE__*/jsxRuntime.jsx(core.SimpleGrid, {
668
- cols: {
669
- base: 1,
670
- md: 2
671
- },
672
- spacing: {
673
- base: 40,
674
- md: 80
675
- },
676
- verticalSpacing: {
677
- base: 40,
678
- md: 50
679
- },
680
- children: reverse ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
681
- children: [mediaCol, contentCol]
682
- }) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
683
- children: [contentCol, mediaCol]
684
- })
685
- })
686
- });
687
- }
688
-
689
- function FeaturesGrid({
690
- id,
691
- subtitle,
692
- title,
693
- bg = "gray.0",
694
- items = []
695
- }) {
696
- return /*#__PURE__*/jsxRuntime.jsx(Layout, {
697
- id: id,
698
- subtitle: subtitle,
699
- title: title,
700
- bg: bg,
701
- children: /*#__PURE__*/jsxRuntime.jsx(core.Grid, {
702
- gutter: "lg",
703
- children: items.map((item, idx) => /*#__PURE__*/jsxRuntime.jsx(FeatureCard, {
704
- ...item
705
- }, idx))
706
- })
707
- });
708
- }
709
- function FeatureCard({
710
- icon: Icon,
711
- iconVariant,
712
- iconColor,
713
- label,
714
- title,
715
- titleSize,
716
- description,
717
- descriptionSize,
718
- descriptionMaw,
719
- span = {
720
- base: 12,
721
- md: 6
722
- },
723
- bg = "white",
724
- dark = false,
725
- visual,
726
- secondaryVisual,
727
- layout = "stacked",
728
- badges,
729
- codeBlock,
730
- decorativeContent,
731
- style: extraStyle,
732
- ...props
733
- }) {
734
- const textColor = dark ? "white" : undefined;
735
- const descColor = dark ? "gray.4" : "gray.6";
736
- const labelColor = "gray.5";
737
- const resolvedIconVariant = iconVariant || (dark ? "filled" : "light");
738
- const resolvedIconColor = iconColor || (dark ? "gray.7" : "gray");
739
- const resolvedTitleSize = titleSize || (layout === "compact" ? "h4" : "h3");
740
- const resolvedDescSize = descriptionSize || (layout === "compact" ? "sm" : "lg");
741
- const headerContent = /*#__PURE__*/jsxRuntime.jsxs(core.Box, {
742
- children: [Icon && /*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
743
- size: 48,
744
- radius: "0",
745
- variant: resolvedIconVariant,
746
- color: resolvedIconColor,
747
- mb: "lg",
748
- style: dark ? {
749
- color: "white"
750
- } : undefined,
751
- children: /*#__PURE__*/jsxRuntime.jsx(Icon, {
752
- size: 24,
753
- stroke: 1.5
754
- })
755
- }), label && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
756
- size: "sm",
757
- fw: 800,
758
- tt: "uppercase",
759
- ls: "1.5px",
760
- c: labelColor,
761
- mb: "xs",
762
- children: label
763
- }), title && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
764
- fz: resolvedTitleSize,
765
- fw: 900,
766
- lh: 1.2,
767
- mb: "sm",
768
- c: textColor,
769
- children: title
770
- }), description && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
771
- c: descColor,
772
- size: resolvedDescSize,
773
- maw: descriptionMaw,
774
- mb: badges ? "xl" : layout === "compact" ? "lg" : undefined,
775
- children: description
776
- }), badges && badges.length > 0 && /*#__PURE__*/jsxRuntime.jsx(core.Group, {
777
- children: badges.map((badge, i) => /*#__PURE__*/jsxRuntime.jsx(core.Badge, {
778
- variant: "dot",
779
- color: "gray",
780
- radius: "0",
781
- children: badge
782
- }, i))
783
- })]
784
- });
785
- const visualContent = visual ? renderVisual(visual, dark) : null;
786
- const secondaryVisualContent = secondaryVisual ? renderVisual(secondaryVisual, dark) : null;
787
-
788
- // Split layout: text left, visual/code right (via inner Grid)
789
- if (layout === "split") {
790
- return /*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
791
- span: span,
792
- children: /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
793
- h: "100%",
794
- p: {
795
- base: "xl",
796
- md: 40
797
- },
798
- radius: "0",
799
- bg: bg,
800
- bd: "1px solid var(--mantine-color-gray-2)",
801
- style: extraStyle,
802
- ...props,
803
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Grid, {
804
- align: "center",
805
- gutter: "xl",
806
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
807
- span: {
808
- base: 12,
809
- sm: 6
810
- },
811
- children: headerContent
812
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Grid.Col, {
813
- span: {
814
- base: 12,
815
- sm: 6
816
- },
817
- children: [visualContent, codeBlock && /*#__PURE__*/jsxRuntime.jsx(core.Code, {
818
- block: true,
819
- color: "gray.0",
820
- c: "gray.7",
821
- style: {
822
- fontSize: 12,
823
- lineHeight: 1.4,
824
- borderRadius: 0
825
- },
826
- children: codeBlock
827
- })]
828
- })]
829
- })
830
- })
831
- });
832
- }
833
-
834
- // Compact layout: simpler card
835
- if (layout === "compact") {
836
- return /*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
837
- span: span,
838
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Paper, {
839
- h: "100%",
840
- p: {
841
- base: "xl",
842
- md: 40
843
- },
844
- radius: "0",
845
- bg: bg,
846
- bd: "1px solid var(--mantine-color-gray-2)",
847
- style: extraStyle,
848
- ...props,
849
- children: [headerContent, visualContent]
850
- })
851
- });
852
- }
853
-
854
- // Stacked layout with decorative content on the side (e.g. device icons)
855
- if (decorativeContent) {
856
- return /*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
857
- span: span,
858
- children: /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
859
- h: "100%",
860
- p: {
861
- base: "xl",
862
- md: 40
863
- },
864
- radius: "0",
865
- bg: bg,
866
- bd: "1px solid var(--mantine-color-gray-2)",
867
- pos: "relative",
868
- style: extraStyle,
869
- ...props,
870
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Grid, {
871
- gutter: 0,
872
- pos: "relative",
873
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
874
- span: {
875
- base: 12,
876
- sm: 7
877
- },
878
- style: {
879
- zIndex: 1
880
- },
881
- children: headerContent
882
- }), /*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
883
- span: 5,
884
- visibleFrom: "sm",
885
- children: decorativeContent
886
- })]
887
- })
888
- })
889
- });
890
- }
891
-
892
- // Default stacked layout
893
- return /*#__PURE__*/jsxRuntime.jsx(core.Grid.Col, {
894
- span: span,
895
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Paper, {
896
- h: "100%",
897
- p: {
898
- base: "xl",
899
- md: 40
900
- },
901
- radius: "0",
902
- bg: bg,
903
- bd: "1px solid var(--mantine-color-gray-2)",
904
- display: "flex",
905
- style: {
906
- flexDirection: "column",
907
- justifyContent: "space-between",
908
- ...extraStyle
909
- },
910
- ...props,
911
- children: [headerContent, visualContent && secondaryVisualContent ? /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
912
- gap: 40,
913
- align: "center",
914
- children: [visualContent, secondaryVisualContent]
915
- }) : visualContent]
916
- })
917
- });
918
- }
919
- function renderVisual(visual, dark) {
920
- if (!visual) return null;
921
- switch (visual.type) {
922
- case "ring":
923
- return /*#__PURE__*/jsxRuntime.jsx(core.RingProgress, {
924
- size: visual.size || 140,
925
- thickness: visual.thickness || 12,
926
- sections: [{
927
- value: visual.value || 100,
928
- color: "gray.9"
929
- }],
930
- label: /*#__PURE__*/jsxRuntime.jsx(core.Center, {
931
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
932
- gap: 0,
933
- align: "center",
934
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
935
- fw: 900,
936
- size: "xl",
937
- lh: 1,
938
- children: visual.label
939
- }), visual.sublabel && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
940
- size: "xs",
941
- c: "gray.5",
942
- fw: 700,
943
- children: visual.sublabel
944
- })]
945
- })
946
- })
947
- });
948
- case "metric":
949
- return /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
950
- gap: 0,
951
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
952
- fw: 900,
953
- fz: 32,
954
- c: "gray.9",
955
- lh: 1,
956
- children: visual.value
957
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
958
- size: "sm",
959
- c: "gray.5",
960
- mt: 4,
961
- children: visual.label
962
- }), visual.badge && /*#__PURE__*/jsxRuntime.jsx(core.Badge, {
963
- mt: "md",
964
- color: "gray",
965
- variant: "dot",
966
- radius: "0",
967
- children: visual.badge
968
- })]
969
- });
970
- case "bars":
971
- return /*#__PURE__*/jsxRuntime.jsx(core.Group, {
972
- align: "flex-end",
973
- gap: 8,
974
- h: visual.height || 100,
975
- preventGrowOverflow: false,
976
- children: (visual.data || []).map((h, i) => /*#__PURE__*/jsxRuntime.jsx(core.Box, {
977
- w: 20,
978
- h: `${h}%`,
979
- bg: i === visual.highlight ? "gray.9" : "gray.2",
980
- radius: "0"
981
- }, i))
982
- });
983
- case "typography":
984
- return /*#__PURE__*/jsxRuntime.jsx(core.Center, {
985
- h: visual.height || 160,
986
- bg: dark ? "gray.8" : "gray.1",
987
- radius: "0",
988
- children: /*#__PURE__*/jsxRuntime.jsx(core.Text, {
989
- fz: visual.fontSize || 100,
990
- fw: 900,
991
- c: dark ? "gray.6" : "gray.3",
992
- style: {
993
- letterSpacing: -6
994
- },
995
- children: visual.text || "Aa"
996
- })
997
- });
998
- case "icon-large":
999
- {
1000
- const LargeIcon = visual.icon;
1001
- if (!LargeIcon) return null;
1002
- return /*#__PURE__*/jsxRuntime.jsx(LargeIcon, {
1003
- size: visual.size || 64,
1004
- stroke: visual.stroke || 1,
1005
- color: visual.color || "var(--mantine-color-gray-2)"
1006
- });
1007
- }
1008
- default:
1009
- return null;
1010
- }
1011
- }
1012
-
1013
- function Comparison({
1014
- id,
1015
- subtitle,
1016
- title,
1017
- traditionalCol,
1018
- newCol
1019
- }) {
1020
- return /*#__PURE__*/jsxRuntime.jsx(Layout, {
1021
- id: id,
1022
- subtitle: subtitle,
1023
- title: title,
1024
- bg: "white",
1025
- children: /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
1026
- radius: "0",
1027
- bd: "1px solid var(--mantine-color-gray-2)",
1028
- style: {
1029
- overflow: "hidden"
1030
- },
1031
- children: /*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
1032
- cols: {
1033
- base: 1,
1034
- md: 2
1035
- },
1036
- spacing: 0,
1037
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Box, {
1038
- bg: "gray.0",
1039
- p: {
1040
- base: 30,
1041
- md: 60
1042
- },
1043
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1044
- gap: "xl",
1045
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Box, {
1046
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1047
- fw: 900,
1048
- fz: "h2",
1049
- c: "gray.9",
1050
- mb: 4,
1051
- children: traditionalCol.title
1052
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1053
- size: "sm",
1054
- fw: 800,
1055
- tt: "uppercase",
1056
- ls: "1.5px",
1057
- c: "gray.5",
1058
- children: traditionalCol.subtitle
1059
- })]
1060
- }), /*#__PURE__*/jsxRuntime.jsx(core.Stack, {
1061
- gap: "md",
1062
- mb: 40,
1063
- children: traditionalCol.items.map((item, index) => /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
1064
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1065
- justify: "space-between",
1066
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1067
- size: "sm",
1068
- c: "gray.6",
1069
- children: item.label
1070
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1071
- fw: 700,
1072
- c: "gray.9",
1073
- children: item.value
1074
- })]
1075
- }), index < traditionalCol.items.length - 1 && /*#__PURE__*/jsxRuntime.jsx(core.Divider, {
1076
- color: "var(--mantine-color-gray-2)"
1077
- })]
1078
- }, index))
1079
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Box, {
1080
- bg: "white",
1081
- p: "lg",
1082
- radius: "0",
1083
- bd: "1px solid var(--mantine-color-gray-2)",
1084
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1085
- justify: "space-between",
1086
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1087
- fw: 900,
1088
- c: "gray.7",
1089
- children: traditionalCol.totalLabel || "Total Estimado"
1090
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1091
- fw: 900,
1092
- fz: 32,
1093
- c: "gray.9",
1094
- children: traditionalCol.totalValue
1095
- })]
1096
- }), traditionalCol.footerText && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1097
- size: "xs",
1098
- c: "red.6",
1099
- ta: "right",
1100
- mt: 4,
1101
- children: traditionalCol.footerText
1102
- })]
1103
- })]
1104
- })
1105
- }), /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1106
- bg: "white",
1107
- p: {
1108
- base: 30,
1109
- md: 60
1110
- },
1111
- pos: "relative",
1112
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1113
- gap: "xl",
1114
- h: "100%",
1115
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Box, {
1116
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1117
- gap: "xs",
1118
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1119
- fw: 900,
1120
- fz: "h2",
1121
- c: "gray.9",
1122
- mb: 4,
1123
- children: newCol.title
1124
- }), newCol.badge && /*#__PURE__*/jsxRuntime.jsx(core.Badge, {
1125
- color: "gray.9",
1126
- variant: "filled",
1127
- radius: "0",
1128
- children: newCol.badge
1129
- })]
1130
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1131
- size: "sm",
1132
- c: "gray.6",
1133
- children: newCol.description
1134
- })]
1135
- }), /*#__PURE__*/jsxRuntime.jsx(core.List, {
1136
- spacing: "md",
1137
- size: "md",
1138
- c: "gray.6",
1139
- icon: /*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
1140
- color: "gray.0",
1141
- size: 20,
1142
- radius: "0",
1143
- bd: "1px solid var(--mantine-color-gray-2)",
1144
- children: /*#__PURE__*/jsxRuntime.jsx(iconsReact.IconCheck, {
1145
- size: 12,
1146
- color: "var(--mantine-color-gray-9)"
1147
- })
1148
- }),
1149
- children: newCol.items.map((item, index) => /*#__PURE__*/jsxRuntime.jsx(core.List.Item, {
1150
- children: item
1151
- }, index))
1152
- }), newCol.pricingBox && /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1153
- bg: "gray.0",
1154
- p: "lg",
1155
- radius: "0",
1156
- bd: "1px solid var(--mantine-color-gray-2)",
1157
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1158
- gap: 4,
1159
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1160
- size: "sm",
1161
- fw: 800,
1162
- tt: "uppercase",
1163
- ls: "1.5px",
1164
- c: "gray.5",
1165
- children: newCol.pricingBox.label
1166
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1167
- fw: 900,
1168
- fz: 48,
1169
- c: "gray.9",
1170
- lh: 1,
1171
- children: newCol.pricingBox.price
1172
- }), newCol.pricingBox.subtext && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1173
- size: "xs",
1174
- c: "gray.5",
1175
- mt: "sm",
1176
- children: newCol.pricingBox.subtext
1177
- })]
1178
- })
1179
- }), newCol.cta && /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1180
- mt: "xl",
1181
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
1182
- label: newCol.cta.label,
1183
- href: newCol.cta.href,
1184
- icon: newCol.cta.icon,
1185
- size: newCol.cta.size || "lg",
1186
- color: newCol.cta.color || "gray.9",
1187
- fullWidth: true
1188
- })
1189
- })]
1190
- })
1191
- })]
1192
- })
1193
- })
1194
- });
1195
- }
1196
-
1197
- function Pricing({
1198
- id,
1199
- subtitle,
1200
- title,
1201
- billingOptions = [{
1202
- label: "Mensal",
1203
- value: "monthly"
1204
- }, {
1205
- label: "Anual",
1206
- value: "annual"
1207
- }],
1208
- billing,
1209
- setBilling,
1210
- promoBadge,
1211
- plans
1212
- }) {
1213
- return /*#__PURE__*/jsxRuntime.jsxs(Layout, {
1214
- id: id,
1215
- subtitle: subtitle,
1216
- title: title,
1217
- ta: "center",
1218
- children: [billingOptions && billingOptions.length > 0 && /*#__PURE__*/jsxRuntime.jsx(core.Stack, {
1219
- align: "center",
1220
- gap: "xl",
1221
- mb: 80,
1222
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1223
- gap: "xs",
1224
- children: [/*#__PURE__*/jsxRuntime.jsx(core.SegmentedControl, {
1225
- value: billing,
1226
- onChange: setBilling,
1227
- radius: "0",
1228
- size: "md",
1229
- data: billingOptions,
1230
- color: "gray.9",
1231
- bg: "white",
1232
- style: {
1233
- border: "1px solid var(--mantine-color-gray-2)"
1234
- }
1235
- }), billing === "annual" && promoBadge && /*#__PURE__*/jsxRuntime.jsx(core.Badge, {
1236
- variant: "filled",
1237
- color: "gray.9",
1238
- radius: "0",
1239
- size: "lg",
1240
- children: promoBadge
1241
- })]
1242
- })
1243
- }), /*#__PURE__*/jsxRuntime.jsx(core.SimpleGrid, {
1244
- cols: {
1245
- base: 1,
1246
- md: plans.length <= 3 ? plans.length : 3
1247
- },
1248
- spacing: "xl",
1249
- verticalSpacing: "xl",
1250
- children: plans.map(plan => /*#__PURE__*/jsxRuntime.jsxs(core.Paper, {
1251
- p: "xl",
1252
- radius: "0",
1253
- withBorder: true,
1254
- bd: plan.highlight ? "2px solid var(--mantine-color-gray-9)" : "1px solid var(--mantine-color-gray-2)",
1255
- display: "flex",
1256
- h: "100%",
1257
- style: {
1258
- flexDirection: "column"
1259
- },
1260
- bg: "white",
1261
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1262
- gap: "md",
1263
- mb: "xl",
1264
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1265
- justify: "space-between",
1266
- align: "center",
1267
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1268
- size: "xs",
1269
- fw: 800,
1270
- tt: "uppercase",
1271
- ls: "1.5px",
1272
- c: "gray.4",
1273
- children: plan.name
1274
- }), plan.highlight && /*#__PURE__*/jsxRuntime.jsx(core.Badge, {
1275
- variant: "dot",
1276
- color: "gray.9",
1277
- children: plan.highlightBadge || "RECOMENDADO"
1278
- })]
1279
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1280
- size: "sm",
1281
- c: "gray.6",
1282
- fw: 500,
1283
- lh: 1.5,
1284
- h: {
1285
- md: 42
1286
- },
1287
- children: plan.description
1288
- })]
1289
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Box, {
1290
- mb: "xl",
1291
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1292
- size: "xs",
1293
- c: "gray.4",
1294
- fw: 800,
1295
- tt: "uppercase",
1296
- ls: "1px",
1297
- mb: 4,
1298
- children: plan.pricePrefix || "A partir de"
1299
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1300
- gap: 8,
1301
- align: "flex-start",
1302
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1303
- size: "xl",
1304
- fw: 900,
1305
- c: "gray.9",
1306
- style: {
1307
- marginTop: 8
1308
- },
1309
- children: plan.priceDisplay?.currency
1310
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1311
- gap: 4,
1312
- align: "flex-end",
1313
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1314
- fz: "var(--fz-big-metric)",
1315
- fw: 900,
1316
- ls: "-0.04em",
1317
- lh: 0.8,
1318
- c: "gray.9",
1319
- children: plan.priceDisplay?.whole
1320
- }), plan.priceDisplay?.fraction && /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1321
- gap: 0,
1322
- mb: 6,
1323
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Text, {
1324
- size: "xl",
1325
- fw: 900,
1326
- lh: 1,
1327
- c: "gray.9",
1328
- children: [",", plan.priceDisplay.fraction]
1329
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1330
- size: "xs",
1331
- c: "gray.5",
1332
- fw: 800,
1333
- tt: "uppercase",
1334
- ls: "0.5px",
1335
- children: plan.period || plan.priceSuffix || "/mês"
1336
- })]
1337
- })]
1338
- })]
1339
- })]
1340
- }), /*#__PURE__*/jsxRuntime.jsx(core.Divider, {
1341
- mb: "xl",
1342
- color: "gray.1"
1343
- }), /*#__PURE__*/jsxRuntime.jsx(core.Stack, {
1344
- gap: "sm",
1345
- mb: 40,
1346
- style: {
1347
- flex: 1
1348
- },
1349
- children: plan.features.map((feature, i) => /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1350
- gap: "sm",
1351
- wrap: "nowrap",
1352
- align: "flex-start",
1353
- children: [/*#__PURE__*/jsxRuntime.jsx(iconsReact.IconCheck, {
1354
- size: 16,
1355
- color: "var(--mantine-color-gray-9)",
1356
- style: {
1357
- marginTop: 2,
1358
- flexShrink: 0
1359
- }
1360
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1361
- size: "sm",
1362
- fw: 500,
1363
- c: "gray.6",
1364
- lh: 1.4,
1365
- children: feature
1366
- })]
1367
- }, i))
1368
- }), /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1369
- mt: "auto",
1370
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
1371
- label: plan.cta.label,
1372
- href: plan.cta.href,
1373
- size: plan.cta.size || "xl",
1374
- variant: plan.cta.variant,
1375
- color: plan.cta.color || "gray.9",
1376
- fullWidth: true
1377
- })
1378
- })]
1379
- }, plan.name))
1380
- })]
1381
- });
1382
- }
1383
-
1384
- function FAQ({
1385
- id,
1386
- subtitle,
1387
- title,
1388
- questions = [],
1389
- contactCard
1390
- }) {
1391
- const accordionStyles = {
1392
- item: {
1393
- backgroundColor: "white",
1394
- border: "1px solid var(--mantine-color-gray-2)"
1395
- },
1396
- control: {
1397
- padding: "1.25rem"
1398
- },
1399
- content: {
1400
- padding: "0 1.25rem 1.25rem 1.25rem"
1401
- },
1402
- label: {
1403
- fontWeight: 900,
1404
- color: "var(--mantine-color-gray-9)"
1405
- },
1406
- chevron: {
1407
- color: "var(--mantine-color-gray-5)"
1408
- }
1409
- };
1410
- return /*#__PURE__*/jsxRuntime.jsxs(Layout, {
1411
- id: id,
1412
- subtitle: subtitle,
1413
- title: title,
1414
- bg: "white",
1415
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
1416
- cols: {
1417
- base: 1,
1418
- md: 2
1419
- },
1420
- spacing: "xl",
1421
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Accordion, {
1422
- variant: "separated",
1423
- radius: "0",
1424
- chevronPosition: "right",
1425
- styles: accordionStyles,
1426
- children: questions.slice(0, Math.ceil(questions.length / 2)).map((item, i) => /*#__PURE__*/jsxRuntime.jsxs(core.Accordion.Item, {
1427
- value: item.value || String(i),
1428
- mb: "md",
1429
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Accordion.Control, {
1430
- icon: /*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
1431
- variant: "light",
1432
- color: "gray",
1433
- radius: "0",
1434
- children: /*#__PURE__*/jsxRuntime.jsx(iconsReact.IconBolt, {
1435
- size: 16
1436
- })
1437
- }),
1438
- children: item.question
1439
- }), /*#__PURE__*/jsxRuntime.jsx(core.Accordion.Panel, {
1440
- c: "gray.6",
1441
- children: item.answer
1442
- })]
1443
- }, item.value || i))
1444
- }), /*#__PURE__*/jsxRuntime.jsx(core.Accordion, {
1445
- variant: "separated",
1446
- radius: "0",
1447
- chevronPosition: "right",
1448
- styles: accordionStyles,
1449
- children: questions.slice(Math.ceil(questions.length / 2)).map((item, i) => /*#__PURE__*/jsxRuntime.jsxs(core.Accordion.Item, {
1450
- value: item.value || String(i),
1451
- mb: "md",
1452
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Accordion.Control, {
1453
- icon: /*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
1454
- variant: "light",
1455
- color: "gray",
1456
- radius: "0",
1457
- children: /*#__PURE__*/jsxRuntime.jsx(iconsReact.IconBolt, {
1458
- size: 16
1459
- })
1460
- }),
1461
- children: item.question
1462
- }), /*#__PURE__*/jsxRuntime.jsx(core.Accordion.Panel, {
1463
- c: "gray.6",
1464
- children: item.answer
1465
- })]
1466
- }, item.value || i))
1467
- })]
1468
- }), contactCard && /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
1469
- mt: {
1470
- base: 40,
1471
- md: 80
1472
- },
1473
- radius: "0",
1474
- p: {
1475
- base: "xl",
1476
- md: 60
1477
- },
1478
- bg: "gray.0",
1479
- bd: "1px solid var(--mantine-color-gray-1)",
1480
- pos: "relative",
1481
- style: {
1482
- overflow: "hidden"
1483
- },
1484
- children: /*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
1485
- cols: {
1486
- base: 1,
1487
- md: 2
1488
- },
1489
- spacing: "xl",
1490
- style: {
1491
- position: "relative",
1492
- zIndex: 1,
1493
- alignItems: "center"
1494
- },
1495
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1496
- gap: "sm",
1497
- ta: {
1498
- base: "center",
1499
- md: "left"
1500
- },
1501
- align: {
1502
- base: "center",
1503
- md: "flex-start"
1504
- },
1505
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1506
- fz: "h2",
1507
- fw: 900,
1508
- c: "gray.9",
1509
- lh: 1.2,
1510
- children: contactCard.title
1511
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1512
- c: "gray.6",
1513
- maw: 500,
1514
- size: "lg",
1515
- children: contactCard.description
1516
- })]
1517
- }), /*#__PURE__*/jsxRuntime.jsx(core.Stack, {
1518
- align: {
1519
- base: "center",
1520
- md: "flex-end"
1521
- },
1522
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
1523
- label: contactCard.cta.label,
1524
- href: contactCard.cta.href,
1525
- target: contactCard.cta.target,
1526
- leftSection: contactCard.cta.icon,
1527
- size: contactCard.cta.size || "xl",
1528
- color: contactCard.cta.color || "dark"
1529
- })
1530
- })]
1531
- })
1532
- })]
1533
- });
1534
- }
1535
-
1536
- function Testimonials({
1537
- id,
1538
- bg = "gray.0",
1539
- title,
1540
- subtitle,
1541
- items = []
1542
- }) {
1543
- return /*#__PURE__*/jsxRuntime.jsx(Layout, {
1544
- id: id,
1545
- bg: bg,
1546
- title: title,
1547
- subtitle: subtitle,
1548
- children: /*#__PURE__*/jsxRuntime.jsx(core.SimpleGrid, {
1549
- cols: {
1550
- base: 1,
1551
- md: items.length > 3 ? 4 : items.length || 3
1552
- },
1553
- spacing: "xl",
1554
- children: items.map((item, index) => /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
1555
- p: "xl",
1556
- radius: "0",
1557
- bd: "1px solid var(--mantine-color-gray-2)",
1558
- bg: "white",
1559
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1560
- gap: "md",
1561
- align: "flex-start",
1562
- h: "100%",
1563
- children: [/*#__PURE__*/jsxRuntime.jsx(iconsReact.IconQuote, {
1564
- size: 32,
1565
- color: "var(--mantine-color-gray-3)"
1566
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Text, {
1567
- size: "lg",
1568
- c: "gray.7",
1569
- lh: 1.6,
1570
- fs: "italic",
1571
- flex: 1,
1572
- children: ["\"", item.content, "\""]
1573
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1574
- gap: "sm",
1575
- mt: "xl",
1576
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Avatar, {
1577
- size: "md",
1578
- radius: "0",
1579
- color: "gray",
1580
- src: item.avatarSrc,
1581
- children: item.initials
1582
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1583
- gap: 0,
1584
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1585
- size: "sm",
1586
- fw: 900,
1587
- children: item.name
1588
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1589
- size: "xs",
1590
- fw: 800,
1591
- tt: "uppercase",
1592
- ls: "1px",
1593
- c: "gray.5",
1594
- children: item.role
1595
- })]
1596
- })]
1597
- })]
1598
- })
1599
- }, index))
1600
- })
1601
- });
1602
- }
1603
-
1604
- function CTABanner({
1605
- id,
1606
- title,
1607
- description,
1608
- cta,
1609
- bg = "gray.0"
1610
- }) {
1611
- return /*#__PURE__*/jsxRuntime.jsx(Layout, {
1612
- id: id,
1613
- bg: bg,
1614
- ta: "center",
1615
- children: /*#__PURE__*/jsxRuntime.jsx(core.Paper, {
1616
- p: {
1617
- base: "xl",
1618
- sm: 80
1619
- },
1620
- bg: "white",
1621
- radius: "0",
1622
- bd: "1px solid var(--mantine-color-gray-2)",
1623
- style: {
1624
- borderTop: "4px solid var(--mantine-color-gray-9)"
1625
- },
1626
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1627
- align: "center",
1628
- ta: "center",
1629
- gap: "xl",
1630
- children: [title && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1631
- fz: "var(--fz-section-title)",
1632
- fw: 900,
1633
- lh: 1.2,
1634
- ls: "-0.04em",
1635
- maw: 700,
1636
- children: title
1637
- }), description && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1638
- c: "gray.7",
1639
- size: "xl",
1640
- maw: 550,
1641
- children: description
1642
- }), cta && /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1643
- mt: "md",
1644
- children: /*#__PURE__*/jsxRuntime.jsx(CTAButton, {
1645
- label: cta.label,
1646
- href: cta.href,
1647
- size: cta.size || "xl",
1648
- px: cta.px || {
1649
- base: 32,
1650
- md: 60
1651
- },
1652
- variant: cta.variant,
1653
- color: cta.color
1654
- })
1655
- })]
1656
- })
1657
- })
1658
- });
1659
- }
1660
-
1661
- /** @deprecated Use CTABanner instead */
1662
- const SecondaryCTA = CTABanner;
1663
-
1664
- function TrustBadge({
1665
- text = "Selo Exclusivo RiLiGar",
1666
- color = "green.6"
1667
- }) {
1668
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1669
- p: "xs",
1670
- bg: "gray.1",
1671
- style: {
1672
- borderRadius: "8px",
1673
- border: "1px solid var(--mantine-color-gray-2)",
1674
- display: "inline-block"
1675
- },
1676
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1677
- gap: "xs",
1678
- children: [/*#__PURE__*/jsxRuntime.jsx(core.ThemeIcon, {
1679
- color: color,
1680
- variant: "light",
1681
- size: "sm",
1682
- radius: "xl",
1683
- children: /*#__PURE__*/jsxRuntime.jsx(iconsReact.IconCircleCheck, {
1684
- size: 14,
1685
- "aria-hidden": "true"
1686
- })
1687
- }), /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1688
- size: "xs",
1689
- fw: 700,
1690
- c: "gray.7",
1691
- tt: "uppercase",
1692
- lts: 0.5,
1693
- children: text
1694
- })]
1695
- })
1696
- });
1697
- }
1698
-
1699
- /** @deprecated Use TrustBadge instead */
1700
- const SeloExclusivo = TrustBadge;
1701
-
1702
- function Footer({
1703
- logo,
1704
- description,
1705
- sections = [],
1706
- socialLinks = [],
1707
- copyrightText,
1708
- madeByText,
1709
- bg = "gray.0"
1710
- }) {
1711
- return /*#__PURE__*/jsxRuntime.jsx(core.Box, {
1712
- component: "footer",
1713
- py: "xl",
1714
- bg: bg,
1715
- bd: {
1716
- top: "1px solid var(--mantine-color-gray-2)"
1717
- },
1718
- children: /*#__PURE__*/jsxRuntime.jsxs(core.Container, {
1719
- size: "xl",
1720
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
1721
- cols: {
1722
- base: 1,
1723
- sm: 2
1724
- },
1725
- spacing: "xl",
1726
- children: [/*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1727
- gap: "lg",
1728
- children: [logo && /*#__PURE__*/jsxRuntime.jsx("img", {
1729
- src: logo.src,
1730
- alt: logo.alt || "",
1731
- height: logo.height || 32,
1732
- style: {
1733
- objectFit: "contain",
1734
- objectPosition: "left"
1735
- }
1736
- }), description && /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1737
- size: "md",
1738
- c: "gray.6",
1739
- lh: 1.6,
1740
- maw: 400,
1741
- children: description
1742
- })]
1743
- }), /*#__PURE__*/jsxRuntime.jsxs(core.SimpleGrid, {
1744
- cols: {
1745
- base: 2,
1746
- sm: sections.length || 4
1747
- },
1748
- spacing: "xl",
1749
- children: [sections.map((section, idx) => /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1750
- gap: "md",
1751
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1752
- fw: 900,
1753
- size: "xs",
1754
- tt: "uppercase",
1755
- ls: "1.5px",
1756
- children: section.title
1757
- }), /*#__PURE__*/jsxRuntime.jsx(core.Stack, {
1758
- gap: "xs",
1759
- children: section.links.map((link, linkIdx) => /*#__PURE__*/jsxRuntime.jsx(core.Anchor, {
1760
- c: "gray.6",
1761
- size: "sm",
1762
- component: link.href ? "a" : "button",
1763
- href: link.href,
1764
- onClick: link.onClick,
1765
- fw: 500,
1766
- children: link.label
1767
- }, linkIdx))
1768
- })]
1769
- }, idx)), socialLinks && socialLinks.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(core.Stack, {
1770
- gap: "md",
1771
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1772
- fw: 900,
1773
- size: "xs",
1774
- tt: "uppercase",
1775
- ls: "1.5px",
1776
- children: "Social"
1777
- }), /*#__PURE__*/jsxRuntime.jsx(core.Group, {
1778
- gap: "xs",
1779
- children: socialLinks.map((social, socialIdx) => /*#__PURE__*/jsxRuntime.jsx(core.ActionIcon, {
1780
- size: "md",
1781
- variant: "subtle",
1782
- color: "gray",
1783
- component: "a",
1784
- href: social.href,
1785
- target: "_blank",
1786
- radius: "0",
1787
- "aria-label": social.label || `Social link ${socialIdx + 1}`,
1788
- children: social.icon
1789
- }, socialIdx))
1790
- })]
1791
- })]
1792
- })]
1793
- }), /*#__PURE__*/jsxRuntime.jsx(core.Divider, {
1794
- my: "xl",
1795
- color: "gray.2"
1796
- }), /*#__PURE__*/jsxRuntime.jsxs(core.Group, {
1797
- justify: "space-between",
1798
- mt: 30,
1799
- wrap: "wrap",
1800
- gap: "sm",
1801
- children: [/*#__PURE__*/jsxRuntime.jsx(core.Text, {
1802
- size: "xs",
1803
- fw: 800,
1804
- tt: "uppercase",
1805
- ls: "1px",
1806
- c: "gray.5",
1807
- children: copyrightText
1808
- }), madeByText && /*#__PURE__*/jsxRuntime.jsx(core.Group, {
1809
- gap: "sm",
1810
- children: /*#__PURE__*/jsxRuntime.jsx(core.Text, {
1811
- size: "xs",
1812
- fw: 800,
1813
- tt: "uppercase",
1814
- ls: "1px",
1815
- c: "gray.5",
1816
- children: madeByText
1817
- })
1818
- })]
1819
- })]
1820
- })
1821
- });
1822
- }
1823
-
1824
- exports.CTABanner = CTABanner;
1825
- exports.CTAButton = CTAButton;
1826
- exports.Comparison = Comparison;
1827
- exports.FAQ = FAQ;
1828
- exports.FeatureSplit = FeatureSplit;
1829
- exports.FeaturesGrid = FeaturesGrid;
1830
- exports.Footer = Footer;
1831
- exports.Header = Header;
1832
- exports.Hero = Hero;
1833
- exports.Layout = Layout;
1834
- exports.MediaBlock = MediaBlock;
1835
- exports.Navbar = Navbar;
1836
- exports.Pricing = Pricing;
1837
- exports.SecondaryCTA = SecondaryCTA;
1838
- exports.SectionHeader = SectionHeader;
1839
- exports.SeloExclusivo = SeloExclusivo;
1840
- exports.SocialProof = SocialProof;
1841
- exports.Testimonials = Testimonials;
1842
- exports.TrustBadge = TrustBadge;
1843
- exports.theme = theme;
1844
- //# sourceMappingURL=index.js.map
1
+ (function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("@mantine/core"),require("react/jsx-runtime"),require("@mantine/hooks"),require("@tabler/icons-react"),require("react")):typeof define=="function"&&define.amd?define(["exports","@mantine/core","react/jsx-runtime","@mantine/hooks","@tabler/icons-react","react"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.RiligarComponentsKit={},c.MantineCore,c.jsxRuntime,c.MantineHooks,c.TablerIcons,c.React))})(this,(function(c,e,r,H,x,L){"use strict";const N=e.createTheme({fontFamily:'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',headings:{fontFamily:'Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',fontWeight:"900"},colors:{gray:["#FFFFFF","#F9FAFB","#F3F4F6","#E5E7EB","#9CA3AF","#6B7280","#4B5563","#374151","#1F2937","#11181C"]},primaryColor:"gray",primaryShade:9,autoContrast:!0,defaultRadius:"0",components:{Container:{defaultProps:{size:"xl",px:"md"}},Paper:{defaultProps:{withBorder:!0,shadow:"none",radius:"0",bg:"white"}},Card:{defaultProps:{withBorder:!1,shadow:"none",radius:"0",padding:"xl",bg:"transparent"}},Button:{defaultProps:{size:"md",fw:800,radius:"0",variant:"filled",color:"gray.9"},styles:{root:{textTransform:"uppercase",letterSpacing:"1px"}}},TextInput:{defaultProps:{size:"lg",radius:"0",variant:"unstyled"},styles:{input:{borderBottom:"1px solid var(--mantine-color-gray-2)",paddingLeft:0,paddingRight:0}}},Title:{defaultProps:{lh:1.1,c:"gray.9",ls:"-0.04em"}},Text:{defaultProps:{lh:1.6,c:"gray.9",size:"md"}},Badge:{defaultProps:{variant:"dot",color:"gray",radius:"0",size:"sm"},styles:{root:{textTransform:"uppercase",letterSpacing:"1.5px",fontWeight:800}}},ThemeIcon:{defaultProps:{variant:"light",color:"gray",radius:"0",size:"lg"}},Divider:{defaultProps:{color:"gray.2"}}}});function I({subtitle:l,title:n,titleOrder:i=2,titleFz:a="var(--fz-section-title)",ta:s="left",maw:o}){return!n&&!l?null:r.jsxs(e.Stack,{gap:"xs",align:s==="center"?"center":"flex-start",ta:s,children:[l&&r.jsx(e.Text,{c:"gray.4",size:"xs",fw:800,tt:"uppercase",ls:"1.5px",children:l}),n&&r.jsx(e.Title,{order:i,fz:a,maw:o,children:n})]})}function F({video:l,image:n,width:i="100%",alt:a}){return l?r.jsx(e.Center,{children:r.jsx(e.Box,{component:"video",src:l.src,autoPlay:!0,loop:!0,muted:!0,playsInline:!0,"aria-label":a||"Demonstração em vídeo",w:l.width||i,h:"auto",style:{filter:l.filter||"none"}})}):n?r.jsx(e.Center,{children:r.jsx(e.Box,{component:"img",src:n,alt:a||"",w:i,h:"auto"})}):null}function b({label:l,href:n,onClick:i,icon:a,size:s="lg",variant:o="filled",color:h,target:t,px:p,fullWidth:d,leftSection:g,...f}){return r.jsx(e.Button,{size:s,component:n?"a":"button",href:n,onClick:i,target:t,rightSection:a,leftSection:g,variant:o,color:h,px:p,fullWidth:d,...f,children:l})}const P={white:"white",gray:"gray.0"},z=l=>P[l]||P.white;function y({children:l,title:n,subtitle:i,id:a,background:s="white",py:o={base:80,md:120},maw:h=800,ta:t="left",stackGap:p="xl"}){const d=z(s);return r.jsx(e.Box,{component:"section",id:a,bg:d,py:o,style:{overflow:"hidden"},children:r.jsx(e.Container,{size:"lg",children:r.jsxs(e.Stack,{gap:p,children:[r.jsx(I,{subtitle:i,title:n,ta:t,maw:h}),r.jsx(e.Box,{children:l})]})})})}function C({logo:l,navLinks:n=[],loginCta:i,signupCta:a,background:s="white"}){const o=z(s),[h]=H.useWindowScroll(),t=h.y>10,p=g=>{g==="top"?window.scrollTo({top:0,behavior:"smooth"}):document.getElementById(g)?.scrollIntoView({behavior:"smooth"})},d=(g,f)=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),p(f))};return r.jsx(e.Box,{component:"header",pos:"sticky",top:0,w:"100%",style:{zIndex:100,pointerEvents:"none"},children:r.jsx(e.Container,{size:"xl",py:"md",children:r.jsx(e.Paper,{shadow:t?"sm":"none",radius:"0",p:"xs",bg:o,bd:t?"1px solid var(--mantine-color-gray-2)":"1px solid transparent",style:{pointerEvents:"auto",transition:"all 0.2s ease"},children:r.jsxs(e.Group,{justify:"space-between",align:"center",px:{base:"xs",sm:"md"},children:[l&&r.jsx("a",{href:"#","aria-label":"Voltar ao topo",onClick:g=>{g.preventDefault(),window.scrollTo({top:0,behavior:"smooth"})},style:{display:"inline-flex"},children:r.jsx("img",{src:l.src,alt:l.alt||"",height:l.height||32,style:{objectFit:"contain"}})}),n.length>0&&r.jsx(e.Group,{gap:"xl",visibleFrom:"sm",component:"nav",role:"navigation","aria-label":"Menu principal",children:n.map(g=>r.jsx(e.Text,{size:"sm",fw:900,tt:"uppercase",ls:"1px",c:"dark",role:"link",tabIndex:0,style:{cursor:"pointer"},onClick:()=>p(g.target),onKeyDown:f=>d(f,g.target),children:g.label},g.label))}),r.jsxs(e.Group,{gap:"sm",children:[i&&r.jsx(e.Button,{variant:"subtle",component:i.href?"a":"button",href:i.href,onClick:i.onClick,c:"gray.7",size:"sm",radius:"0",visibleFrom:"xs",fw:900,children:i.label}),a&&r.jsxs(e.Button,{component:a.href?"a":"button",href:a.href,onClick:a.onClick,size:"sm",radius:"0",color:"dark",variant:"filled",children:[r.jsx(e.Text,{span:!0,visibleFrom:"sm",c:"white",fw:900,size:"sm",children:a.label}),r.jsx(e.Text,{span:!0,hiddenFrom:"sm",c:"white",fw:900,size:"xs",children:a.labelMobile||a.label})]})]})]})})})})}const O=C;function W({subtitle:l,title:n,description:i,cta:a,video:s,image:o,background:h="white"}){const t=z(h);return r.jsx(e.Box,{py:{base:80,sm:100,md:140},id:"hero",bg:t,children:r.jsx(e.Container,{size:"lg",children:r.jsxs(e.SimpleGrid,{cols:{base:1,md:2},spacing:{base:60,md:100},verticalSpacing:60,children:[r.jsxs(e.Stack,{align:{base:"center",md:"flex-start"},justify:"center",gap:{base:32,md:48},ta:{base:"center",md:"left"},children:[r.jsx(I,{subtitle:l,title:n,titleOrder:1,titleFz:"var(--fz-hero)",ta:"inherit"}),i&&r.jsx(e.Center,{children:r.jsx(e.Text,{size:"xl",c:"gray.6",lh:1.6,maw:600,children:i})}),a&&r.jsx(e.Center,{children:r.jsx(e.Group,{gap:"md",justify:{base:"center",md:"flex-start"},children:r.jsx(b,{label:a.label,href:a.href,icon:a.icon,size:a.size||"xl",px:a.px||48,variant:a.variant,color:a.color})})})]}),r.jsx(F,{video:s,image:o,alt:"Demonstração do produto"})]})})})}function K({logo:l,index:n}){const i={src:l.src,alt:l.alt||`Logo ${n}`,h:l.height||50,w:"auto",style:{filter:"grayscale(1) opacity(0.4)",transition:"filter 0.3s ease, opacity 0.3s ease",...l.style},onMouseEnter:a=>{a.currentTarget.style.filter="grayscale(0) opacity(0.8)"},onMouseLeave:a=>{a.currentTarget.style.filter="grayscale(1) opacity(0.4)"}};return l.url?r.jsx(e.Center,{children:r.jsx("a",{href:l.url,target:"_blank",rel:"noopener noreferrer",children:r.jsx(e.Image,{...i})})}):r.jsx(e.Center,{children:r.jsx(e.Image,{...i})})}function V({id:l,title:n,logos:i,background:a="gray"}){const s=z(a);return!i||i.length===0?null:r.jsx(e.Box,{component:"section",id:l,py:{base:40,md:60},bg:s,bd:{bottom:"1px solid var(--mantine-color-gray-1)"},children:r.jsx(e.Container,{size:"lg",children:r.jsxs(e.Stack,{align:"center",ta:"center",gap:"xl",children:[n&&r.jsx(e.Text,{fw:500,c:"gray.5",size:"sm",tt:"uppercase",ls:"0.1em",children:n}),r.jsx(e.Group,{justify:"space-between",gap:{base:40,md:80},style:{rowGap:40},w:"100%",children:i.map((o,h)=>r.jsx(K,{logo:o,index:h},h))})]})})})}function q({id:l,subtitle:n,title:i,description:a,featuresList:s,cta:o,video:h,image:t,reverse:p=!1,background:d="white"}){const g=s&&s.length>0&&r.jsx(e.List,{spacing:"md",size:"md",center:!0,icon:r.jsx(e.ThemeIcon,{color:"gray.2",size:24,radius:"0",children:r.jsx(x.IconCheck,{size:14,color:"var(--mantine-color-gray-9)"})}),children:s.map((S,v)=>r.jsx(e.List.Item,{children:S},v))}),f=r.jsxs(e.Stack,{justify:"center",gap:"lg",children:[a&&r.jsx(e.Text,{c:"gray.6",size:"xl",lh:1.6,children:a}),g,o&&r.jsx(e.Group,{mt:"md",children:r.jsx(b,{label:o.label,href:o.href,icon:o.icon,size:o.size||"lg",variant:o.variant,color:o.color})})]}),w=(h||t)&&r.jsx(F,{video:h,image:t,width:"80%"});return r.jsx(y,{id:l,subtitle:n,title:i,background:d,children:r.jsx(e.SimpleGrid,{cols:{base:1,md:2},spacing:{base:40,md:80},verticalSpacing:{base:40,md:50},children:p?r.jsxs(r.Fragment,{children:[w,f]}):r.jsxs(r.Fragment,{children:[f,w]})})})}function U({id:l,subtitle:n,title:i,background:a="gray.0",items:s=[]}){return r.jsx(y,{id:l,subtitle:n,title:i,background:a,children:r.jsx(e.Grid,{gutter:"lg",children:s.map((o,h)=>r.jsx(Q,{...o},h))})})}function Q({icon:l,iconVariant:n,iconColor:i,label:a,title:s,titleSize:o,description:h,descriptionSize:t,descriptionMaw:p,span:d={base:12,md:6},bg:g="white",dark:f=!1,visual:w,secondaryVisual:S,layout:v="stacked",badges:B,codeBlock:M,decorativeContent:E,style:k,...m}){const R=f?"white":void 0,rr=f?"gray.4":"gray.6",er="gray.5",lr=n||(f?"filled":"light"),ar=i||(f?"gray.7":"gray"),sr=o||(v==="compact"?"h4":"h3"),ir=t||(v==="compact"?"sm":"lg"),G=r.jsxs(e.Box,{children:[l&&r.jsx(e.ThemeIcon,{size:48,radius:"0",variant:lr,color:ar,mb:"lg",style:f?{color:"white"}:void 0,children:r.jsx(l,{size:24,stroke:1.5})}),a&&r.jsx(e.Text,{size:"sm",fw:800,tt:"uppercase",ls:"1.5px",c:er,mb:"xs",children:a}),s&&r.jsx(e.Text,{fz:sr,fw:900,lh:1.2,mb:"sm",c:R,children:s}),h&&r.jsx(e.Text,{c:rr,size:ir,maw:p,mb:B?"xl":v==="compact"?"lg":void 0,children:h}),B&&B.length>0&&r.jsx(e.Group,{children:B.map((nr,tr)=>r.jsx(e.Badge,{variant:"dot",color:"gray",radius:"0",children:nr},tr))})]}),T=w?A(w,f):null,j=S?A(S,f):null;return v==="split"?r.jsx(e.Grid.Col,{span:d,children:r.jsx(e.Paper,{h:"100%",p:{base:"xl",md:40},radius:"0",bg:g,bd:"1px solid var(--mantine-color-gray-2)",style:k,...m,children:r.jsxs(e.Grid,{align:"center",gutter:"xl",children:[r.jsx(e.Grid.Col,{span:{base:12,sm:6},children:G}),r.jsxs(e.Grid.Col,{span:{base:12,sm:6},children:[T,M&&r.jsx(e.Code,{block:!0,color:"gray.0",c:"gray.7",style:{fontSize:12,lineHeight:1.4,borderRadius:0},children:M})]})]})})}):v==="compact"?r.jsx(e.Grid.Col,{span:d,children:r.jsxs(e.Paper,{h:"100%",p:{base:"xl",md:40},radius:"0",bg:g,bd:"1px solid var(--mantine-color-gray-2)",style:k,...m,children:[G,T]})}):E?r.jsx(e.Grid.Col,{span:d,children:r.jsx(e.Paper,{h:"100%",p:{base:"xl",md:40},radius:"0",bg:g,bd:"1px solid var(--mantine-color-gray-2)",pos:"relative",style:k,...m,children:r.jsxs(e.Grid,{gutter:0,pos:"relative",children:[r.jsx(e.Grid.Col,{span:{base:12,sm:7},style:{zIndex:1},children:G}),r.jsx(e.Grid.Col,{span:5,visibleFrom:"sm",children:E})]})})}):r.jsx(e.Grid.Col,{span:d,children:r.jsxs(e.Paper,{h:"100%",p:{base:"xl",md:40},radius:"0",bg:g,bd:"1px solid var(--mantine-color-gray-2)",display:"flex",style:{flexDirection:"column",justifyContent:"space-between",...k},...m,children:[G,T&&j?r.jsxs(e.Group,{gap:40,align:"center",children:[T,j]}):T]})})}function A(l,n){if(!l)return null;switch(l.type){case"ring":return r.jsx(e.RingProgress,{size:l.size||140,thickness:l.thickness||12,sections:[{value:l.value||100,color:"gray.9"}],label:r.jsx(e.Center,{children:r.jsxs(e.Stack,{gap:0,align:"center",children:[r.jsx(e.Text,{fw:900,size:"xl",lh:1,children:l.label}),l.sublabel&&r.jsx(e.Text,{size:"xs",c:"gray.5",fw:700,children:l.sublabel})]})})});case"metric":return r.jsxs(e.Stack,{gap:0,children:[r.jsx(e.Text,{fw:900,fz:32,c:"gray.9",lh:1,children:l.value}),r.jsx(e.Text,{size:"sm",c:"gray.5",mt:4,children:l.label}),l.badge&&r.jsx(e.Badge,{mt:"md",color:"gray",variant:"dot",radius:"0",children:l.badge})]});case"bars":return r.jsx(e.Group,{align:"flex-end",gap:8,h:l.height||100,preventGrowOverflow:!1,children:(l.data||[]).map((i,a)=>r.jsx(e.Box,{w:20,h:`${i}%`,bg:a===l.highlight?"gray.9":"gray.2",radius:"0"},a))});case"typography":return r.jsx(e.Center,{h:l.height||160,bg:n?"gray.8":"gray.1",radius:"0",children:r.jsx(e.Text,{fz:l.fontSize||100,fw:900,c:n?"gray.6":"gray.3",style:{letterSpacing:-6},children:l.text||"Aa"})});case"icon-large":{const i=l.icon;return i?r.jsx(i,{size:l.size||64,stroke:l.stroke||1,color:l.color||"var(--mantine-color-gray-2)"}):null}default:return null}}function _({id:l,subtitle:n,title:i,traditionalCol:a,newCol:s,background:o="white"}){return r.jsx(y,{id:l,subtitle:n,title:i,background:o,children:r.jsx(e.Paper,{radius:"0",bd:"1px solid var(--mantine-color-gray-2)",style:{overflow:"hidden"},children:r.jsxs(e.SimpleGrid,{cols:{base:1,md:2},spacing:0,children:[r.jsx(e.Box,{bg:"gray.0",p:{base:30,md:60},children:r.jsxs(e.Stack,{gap:"xl",children:[r.jsxs(e.Box,{children:[r.jsx(e.Text,{fw:900,fz:"h2",c:"gray.9",mb:4,children:a.title}),r.jsx(e.Text,{size:"sm",fw:800,tt:"uppercase",ls:"1.5px",c:"gray.5",children:a.subtitle})]}),r.jsx(e.Stack,{gap:"md",mb:40,children:a.items.map((h,t)=>r.jsxs(L.Fragment,{children:[r.jsxs(e.Group,{justify:"space-between",children:[r.jsx(e.Text,{size:"sm",c:"gray.6",children:h.label}),r.jsx(e.Text,{fw:700,c:"gray.9",children:h.value})]}),t<a.items.length-1&&r.jsx(e.Divider,{color:"var(--mantine-color-gray-2)"})]},t))}),r.jsxs(e.Box,{bg:"white",p:"lg",radius:"0",bd:"1px solid var(--mantine-color-gray-2)",children:[r.jsxs(e.Group,{justify:"space-between",children:[r.jsx(e.Text,{fw:900,c:"gray.7",children:a.totalLabel||"Total Estimado"}),r.jsx(e.Text,{fw:900,fz:32,c:"gray.9",children:a.totalValue})]}),a.footerText&&r.jsx(e.Text,{size:"xs",c:"red.6",ta:"right",mt:4,children:a.footerText})]})]})}),r.jsx(e.Box,{bg:"white",p:{base:30,md:60},pos:"relative",children:r.jsxs(e.Stack,{gap:"xl",h:"100%",children:[r.jsxs(e.Box,{children:[r.jsxs(e.Group,{gap:"xs",children:[r.jsx(e.Text,{fw:900,fz:"h2",c:"gray.9",mb:4,children:s.title}),s.badge&&r.jsx(e.Badge,{color:"gray.9",variant:"filled",radius:"0",children:s.badge})]}),r.jsx(e.Text,{size:"sm",c:"gray.6",children:s.description})]}),r.jsx(e.List,{spacing:"md",size:"md",c:"gray.6",icon:r.jsx(e.ThemeIcon,{color:"gray.0",size:20,radius:"0",bd:"1px solid var(--mantine-color-gray-2)",children:r.jsx(x.IconCheck,{size:12,color:"var(--mantine-color-gray-9)"})}),children:s.items.map((h,t)=>r.jsx(e.List.Item,{children:h},t))}),s.pricingBox&&r.jsx(e.Box,{bg:"gray.0",p:"lg",radius:"0",bd:"1px solid var(--mantine-color-gray-2)",children:r.jsxs(e.Stack,{gap:4,children:[r.jsx(e.Text,{size:"sm",fw:800,tt:"uppercase",ls:"1.5px",c:"gray.5",children:s.pricingBox.label}),r.jsx(e.Text,{fw:900,fz:48,c:"gray.9",lh:1,children:s.pricingBox.price}),s.pricingBox.subtext&&r.jsx(e.Text,{size:"xs",c:"gray.5",mt:"sm",children:s.pricingBox.subtext})]})}),s.cta&&r.jsx(e.Box,{mt:"xl",children:r.jsx(b,{label:s.cta.label,href:s.cta.href,icon:s.cta.icon,size:s.cta.size||"lg",color:s.cta.color||"gray.9",fullWidth:!0})})]})})]})})})}function $({id:l,subtitle:n,title:i,billingOptions:a=[{label:"Mensal",value:"monthly"},{label:"Anual",value:"annual"}],billing:s,setBilling:o,promoBadge:h,plans:t,background:p="white"}){return r.jsxs(y,{id:l,subtitle:n,title:i,ta:"center",background:p,children:[a&&a.length>0&&r.jsx(e.Stack,{align:"center",gap:"xl",mb:80,children:r.jsxs(e.Group,{gap:"xs",children:[r.jsx(e.SegmentedControl,{value:s,onChange:o,radius:"0",size:"md",data:a,color:"gray.9",bg:"white",style:{border:"1px solid var(--mantine-color-gray-2)"}}),s==="annual"&&h&&r.jsx(e.Badge,{variant:"filled",color:"gray.9",radius:"0",size:"lg",children:h})]})}),r.jsx(e.SimpleGrid,{cols:{base:1,md:t.length<=3?t.length:3},spacing:"xl",verticalSpacing:"xl",children:t.map(d=>r.jsxs(e.Paper,{p:"xl",radius:"0",withBorder:!0,bd:d.highlight?"2px solid var(--mantine-color-gray-9)":"1px solid var(--mantine-color-gray-2)",display:"flex",h:"100%",style:{flexDirection:"column"},bg:"white",children:[r.jsxs(e.Stack,{gap:"md",mb:"xl",children:[r.jsxs(e.Group,{justify:"space-between",align:"center",children:[r.jsx(e.Text,{size:"xs",fw:800,tt:"uppercase",ls:"1.5px",c:"gray.4",children:d.name}),d.highlight&&r.jsx(e.Badge,{variant:"dot",color:"gray.9",children:d.highlightBadge||"RECOMENDADO"})]}),r.jsx(e.Text,{size:"sm",c:"gray.6",fw:500,lh:1.5,h:{md:42},children:d.description})]}),r.jsxs(e.Box,{mb:"xl",children:[r.jsx(e.Text,{size:"xs",c:"gray.4",fw:800,tt:"uppercase",ls:"1px",mb:4,children:d.pricePrefix||"A partir de"}),r.jsxs(e.Group,{gap:8,align:"flex-start",children:[r.jsx(e.Text,{size:"xl",fw:900,c:"gray.9",style:{marginTop:8},children:d.priceDisplay?.currency}),r.jsxs(e.Group,{gap:4,align:"flex-end",children:[r.jsx(e.Text,{fz:"var(--fz-big-metric)",fw:900,ls:"-0.04em",lh:.8,c:"gray.9",children:d.priceDisplay?.whole}),d.priceDisplay?.fraction&&r.jsxs(e.Stack,{gap:0,mb:6,children:[r.jsxs(e.Text,{size:"xl",fw:900,lh:1,c:"gray.9",children:[",",d.priceDisplay.fraction]}),r.jsx(e.Text,{size:"xs",c:"gray.5",fw:800,tt:"uppercase",ls:"0.5px",children:d.period||d.priceSuffix||"/mês"})]})]})]})]}),r.jsx(e.Divider,{mb:"xl",color:"gray.1"}),r.jsx(e.Stack,{gap:"sm",mb:40,style:{flex:1},children:d.features.map((g,f)=>r.jsxs(e.Group,{gap:"sm",wrap:"nowrap",align:"flex-start",children:[r.jsx(x.IconCheck,{size:16,color:"var(--mantine-color-gray-9)",style:{marginTop:2,flexShrink:0}}),r.jsx(e.Text,{size:"sm",fw:500,c:"gray.6",lh:1.4,children:g})]},f))}),r.jsx(e.Box,{mt:"auto",children:r.jsx(b,{label:d.cta.label,href:d.cta.href,size:d.cta.size||"xl",variant:d.cta.variant,color:d.cta.color||"gray.9",fullWidth:!0})})]},d.name))})]})}function J({id:l,subtitle:n,title:i,questions:a=[],contactCard:s,background:o="white"}){const h={item:{backgroundColor:"white",border:"1px solid var(--mantine-color-gray-2)"},control:{padding:"1.25rem"},content:{padding:"0 1.25rem 1.25rem 1.25rem"},label:{fontWeight:900,color:"var(--mantine-color-gray-9)"},chevron:{color:"var(--mantine-color-gray-5)"}};return r.jsxs(y,{id:l,subtitle:n,title:i,background:o,children:[r.jsxs(e.SimpleGrid,{cols:{base:1,md:2},spacing:"xl",children:[r.jsx(e.Accordion,{variant:"separated",radius:"0",chevronPosition:"right",styles:h,children:a.slice(0,Math.ceil(a.length/2)).map((t,p)=>r.jsxs(e.Accordion.Item,{value:t.value||String(p),mb:"md",children:[r.jsx(e.Accordion.Control,{icon:r.jsx(e.ThemeIcon,{variant:"light",color:"gray",radius:"0",children:r.jsx(x.IconBolt,{size:16})}),children:t.question}),r.jsx(e.Accordion.Panel,{c:"gray.6",children:t.answer})]},t.value||p))}),r.jsx(e.Accordion,{variant:"separated",radius:"0",chevronPosition:"right",styles:h,children:a.slice(Math.ceil(a.length/2)).map((t,p)=>r.jsxs(e.Accordion.Item,{value:t.value||String(p),mb:"md",children:[r.jsx(e.Accordion.Control,{icon:r.jsx(e.ThemeIcon,{variant:"light",color:"gray",radius:"0",children:r.jsx(x.IconBolt,{size:16})}),children:t.question}),r.jsx(e.Accordion.Panel,{c:"gray.6",children:t.answer})]},t.value||p))})]}),s&&r.jsx(e.Paper,{mt:{base:40,md:80},radius:"0",p:{base:"xl",md:60},bg:"gray.0",bd:"1px solid var(--mantine-color-gray-1)",pos:"relative",style:{overflow:"hidden"},children:r.jsxs(e.SimpleGrid,{cols:{base:1,md:2},spacing:"xl",style:{position:"relative",zIndex:1,alignItems:"center"},children:[r.jsxs(e.Stack,{gap:"sm",ta:{base:"center",md:"left"},align:{base:"center",md:"flex-start"},children:[r.jsx(e.Text,{fz:"h2",fw:900,c:"gray.9",lh:1.2,children:s.title}),r.jsx(e.Text,{c:"gray.6",maw:500,size:"lg",children:s.description})]}),r.jsx(e.Stack,{align:{base:"center",md:"flex-end"},children:r.jsx(b,{label:s.cta.label,href:s.cta.href,target:s.cta.target,leftSection:s.cta.icon,size:s.cta.size||"xl",color:s.cta.color||"dark"})})]})})]})}function X({id:l,subtitle:n,items:i=[],background:a="gray"}){return r.jsx(y,{id:l,background:a,title,subtitle:n,children:r.jsx(e.SimpleGrid,{cols:{base:1,md:i.length>3?4:i.length||3},spacing:"xl",children:i.map((s,o)=>r.jsx(e.Paper,{p:"xl",radius:"0",bd:"1px solid var(--mantine-color-gray-2)",bg:"white",children:r.jsxs(e.Stack,{gap:"md",align:"flex-start",h:"100%",children:[r.jsx(x.IconQuote,{size:32,color:"var(--mantine-color-gray-3)"}),r.jsxs(e.Text,{size:"lg",c:"gray.7",lh:1.6,fs:"italic",flex:1,children:['"',s.content,'"']}),r.jsxs(e.Group,{gap:"sm",mt:"xl",children:[r.jsx(e.Avatar,{size:"md",radius:"0",color:"gray",src:s.avatarSrc,children:s.initials}),r.jsxs(e.Stack,{gap:0,children:[r.jsx(e.Text,{size:"sm",fw:900,children:s.name}),r.jsx(e.Text,{size:"xs",fw:800,tt:"uppercase",ls:"1px",c:"gray.5",children:s.role})]})]})]})},o))})})}function D({id:l,title:n,description:i,cta:a,background:s="gray.0"}){return r.jsx(y,{id:l,background:s,ta:"center",children:r.jsx(e.Paper,{p:{base:"xl",sm:80},bg:"white",radius:"0",bd:"1px solid var(--mantine-color-gray-2)",style:{borderTop:"4px solid var(--mantine-color-gray-9)"},children:r.jsxs(e.Stack,{align:"center",ta:"center",gap:"xl",children:[n&&r.jsx(e.Text,{fz:"var(--fz-section-title)",fw:900,lh:1.2,ls:"-0.04em",maw:700,children:n}),i&&r.jsx(e.Text,{c:"gray.7",size:"xl",maw:550,children:i}),a&&r.jsx(e.Box,{mt:"md",children:r.jsx(b,{label:a.label,href:a.href,size:a.size||"xl",px:a.px||{base:32,md:60},variant:a.variant,color:a.color})})]})})})}const Y=D;function u({text:l="Selo Exclusivo RiLiGar",color:n="green.6",background:i="gray"}){const a=z(i);return r.jsx(e.Box,{p:"xs",bg:a,style:{borderRadius:"8px",border:"1px solid var(--mantine-color-gray-2)",display:"inline-block"},children:r.jsxs(e.Group,{gap:"xs",children:[r.jsx(e.ThemeIcon,{color:n,variant:"light",size:"sm",radius:"xl",children:r.jsx(x.IconCircleCheck,{size:14,"aria-hidden":"true"})}),r.jsx(e.Text,{size:"xs",fw:700,c:"gray.7",tt:"uppercase",lts:.5,children:l})]})})}const Z=u;c.CTABanner=D,c.CTAButton=b,c.Comparison=_,c.FAQ=J,c.FeatureSplit=q,c.FeaturesGrid=U,c.Header=C,c.Hero=W,c.Layout=y,c.MediaBlock=F,c.Navbar=O,c.Pricing=$,c.SECTION_BACKGROUNDS=P,c.SecondaryCTA=Y,c.SectionHeader=I,c.SeloExclusivo=Z,c.SocialProof=V,c.Testimonials=X,c.TrustBadge=u,c.resolveBackground=z,c.theme=N,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})}));