@opensite/ui 2.6.9 → 2.7.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.
Files changed (11) hide show
  1. package/dist/carousel-scrolling-feature-showcase.cjs +14 -47
  2. package/dist/carousel-scrolling-feature-showcase.d.cts +5 -1
  3. package/dist/carousel-scrolling-feature-showcase.d.ts +5 -1
  4. package/dist/carousel-scrolling-feature-showcase.js +14 -47
  5. package/dist/faq-centered-accordion.cjs +8 -43
  6. package/dist/faq-centered-accordion.d.cts +1 -1
  7. package/dist/faq-centered-accordion.d.ts +1 -1
  8. package/dist/faq-centered-accordion.js +8 -43
  9. package/dist/registry.cjs +22 -38
  10. package/dist/registry.js +22 -38
  11. package/package.json +1 -1
package/dist/carousel-scrolling-feature-showcase.cjs CHANGED
@@ -32,32 +32,6 @@ var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
32
32
  function cn(...inputs) {
33
33
  return tailwindMerge.twMerge(clsx.clsx(inputs));
34
34
  }
35
- function getNestedCardBg(parentBg, variant = "muted", options) {
36
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
37
- if (isDark) {
38
- switch (variant) {
39
- case "muted":
40
- return "bg-background";
41
- case "card":
42
- return "bg-card";
43
- case "accent":
44
- return "bg-accent";
45
- case "subtle":
46
- return "bg-background/50";
47
- }
48
- } else {
49
- switch (variant) {
50
- case "muted":
51
- return "bg-muted";
52
- case "card":
53
- return "bg-card";
54
- case "accent":
55
- return "bg-accent";
56
- case "subtle":
57
- return "bg-muted/50";
58
- }
59
- }
60
- }
61
35
  var maxWidthStyles = {
62
36
  sm: "max-w-screen-sm",
63
37
  md: "max-w-screen-md",
@@ -440,7 +414,6 @@ function CarouselScrollingFeatureShowcase({
440
414
  features,
441
415
  featuresSlot,
442
416
  className,
443
- containerClassName,
444
417
  headerClassName,
445
418
  headingClassName,
446
419
  subheadingClassName,
@@ -450,9 +423,11 @@ function CarouselScrollingFeatureShowcase({
450
423
  numberBadgeClassName,
451
424
  optixFlowConfig,
452
425
  background,
453
- spacing = "md",
426
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
427
+ spacing = "lg",
454
428
  pattern,
455
- patternOpacity
429
+ patternOpacity,
430
+ patternClassName
456
431
  }) {
457
432
  const [activeFeature, setActiveFeature] = React3__namespace.useState(
458
433
  features?.[0]?.id ?? ""
@@ -495,10 +470,12 @@ function CarouselScrollingFeatureShowcase({
495
470
  {
496
471
  background,
497
472
  spacing,
498
- className: cn(className),
473
+ className: cn(pattern && "overflow-visible", className),
499
474
  pattern,
500
475
  patternOpacity,
501
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container mx-auto px-4", containerClassName), children: [
476
+ patternClassName,
477
+ containerClassName,
478
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
502
479
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
503
480
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
504
481
  "h2",
@@ -509,17 +486,8 @@ function CarouselScrollingFeatureShowcase({
509
486
  ),
510
487
  children: heading
511
488
  }
512
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
513
- subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
514
- "p",
515
- {
516
- className: cn(
517
- "mt-4 text-lg text-muted-foreground",
518
- subheadingClassName
519
- ),
520
- children: subheading
521
- }
522
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", subheadingClassName), children: subheading }))
489
+ ) : heading),
490
+ subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", subheadingClassName), children: subheading }) : subheading)
523
491
  ] }),
524
492
  /* @__PURE__ */ jsxRuntime.jsxs(
525
493
  "div",
@@ -533,8 +501,7 @@ function CarouselScrollingFeatureShowcase({
533
501
  "div",
534
502
  {
535
503
  className: cn(
536
- "aspect-video overflow-hidden rounded-xl",
537
- getNestedCardBg(background),
504
+ "aspect-square overflow-hidden rounded-xl",
538
505
  imageClassName
539
506
  ),
540
507
  children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: activeFeatureData && /* @__PURE__ */ jsxRuntime.jsx(
@@ -562,7 +529,7 @@ function CarouselScrollingFeatureShowcase({
562
529
  ) })
563
530
  }
564
531
  ) }) }),
565
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-24 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs(
532
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-12 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs(
566
533
  "div",
567
534
  {
568
535
  ref: setFeatureRef(feature.id),
@@ -597,8 +564,8 @@ function CarouselScrollingFeatureShowcase({
597
564
  }
598
565
  ),
599
566
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
600
- feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-semibold", children: feature.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: feature.title })),
601
- feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-lg text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: feature.description }))
567
+ feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl md:text-2xl font-semibold", children: feature.title }) : feature.title),
568
+ feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-lg", children: feature.description }) : feature.description)
602
569
  ] })
603
570
  ] })
604
571
  ]
package/dist/carousel-scrolling-feature-showcase.d.cts CHANGED
@@ -120,7 +120,11 @@ interface CarouselScrollingFeatureShowcaseProps {
120
120
  * Pattern overlay opacity (0-1)
121
121
  */
122
122
  patternOpacity?: number;
123
+ /**
124
+ * Additional CSS classes for the pattern overlay
125
+ */
126
+ patternClassName?: string;
123
127
  }
124
- declare function CarouselScrollingFeatureShowcase({ heading, subheading, features, featuresSlot, className, containerClassName, headerClassName, headingClassName, subheadingClassName, contentClassName, imageClassName, featuresClassName, numberBadgeClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: CarouselScrollingFeatureShowcaseProps): React.JSX.Element;
128
+ declare function CarouselScrollingFeatureShowcase({ heading, subheading, features, featuresSlot, className, headerClassName, headingClassName, subheadingClassName, contentClassName, imageClassName, featuresClassName, numberBadgeClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: CarouselScrollingFeatureShowcaseProps): React.JSX.Element;
125
129
 
126
130
  export { CarouselScrollingFeatureShowcase, type CarouselScrollingFeatureShowcaseProps, type FeatureItem };
package/dist/carousel-scrolling-feature-showcase.d.ts CHANGED
@@ -120,7 +120,11 @@ interface CarouselScrollingFeatureShowcaseProps {
120
120
  * Pattern overlay opacity (0-1)
121
121
  */
122
122
  patternOpacity?: number;
123
+ /**
124
+ * Additional CSS classes for the pattern overlay
125
+ */
126
+ patternClassName?: string;
123
127
  }
124
- declare function CarouselScrollingFeatureShowcase({ heading, subheading, features, featuresSlot, className, containerClassName, headerClassName, headingClassName, subheadingClassName, contentClassName, imageClassName, featuresClassName, numberBadgeClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: CarouselScrollingFeatureShowcaseProps): React.JSX.Element;
128
+ declare function CarouselScrollingFeatureShowcase({ heading, subheading, features, featuresSlot, className, headerClassName, headingClassName, subheadingClassName, contentClassName, imageClassName, featuresClassName, numberBadgeClassName, optixFlowConfig, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, }: CarouselScrollingFeatureShowcaseProps): React.JSX.Element;
125
129
 
126
130
  export { CarouselScrollingFeatureShowcase, type CarouselScrollingFeatureShowcaseProps, type FeatureItem };
package/dist/carousel-scrolling-feature-showcase.js CHANGED
@@ -11,32 +11,6 @@ import { jsx, jsxs } from 'react/jsx-runtime';
11
11
  function cn(...inputs) {
12
12
  return twMerge(clsx(inputs));
13
13
  }
14
- function getNestedCardBg(parentBg, variant = "muted", options) {
15
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
16
- if (isDark) {
17
- switch (variant) {
18
- case "muted":
19
- return "bg-background";
20
- case "card":
21
- return "bg-card";
22
- case "accent":
23
- return "bg-accent";
24
- case "subtle":
25
- return "bg-background/50";
26
- }
27
- } else {
28
- switch (variant) {
29
- case "muted":
30
- return "bg-muted";
31
- case "card":
32
- return "bg-card";
33
- case "accent":
34
- return "bg-accent";
35
- case "subtle":
36
- return "bg-muted/50";
37
- }
38
- }
39
- }
40
14
  var maxWidthStyles = {
41
15
  sm: "max-w-screen-sm",
42
16
  md: "max-w-screen-md",
@@ -419,7 +393,6 @@ function CarouselScrollingFeatureShowcase({
419
393
  features,
420
394
  featuresSlot,
421
395
  className,
422
- containerClassName,
423
396
  headerClassName,
424
397
  headingClassName,
425
398
  subheadingClassName,
@@ -429,9 +402,11 @@ function CarouselScrollingFeatureShowcase({
429
402
  numberBadgeClassName,
430
403
  optixFlowConfig,
431
404
  background,
432
- spacing = "md",
405
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
406
+ spacing = "lg",
433
407
  pattern,
434
- patternOpacity
408
+ patternOpacity,
409
+ patternClassName
435
410
  }) {
436
411
  const [activeFeature, setActiveFeature] = React3.useState(
437
412
  features?.[0]?.id ?? ""
@@ -474,10 +449,12 @@ function CarouselScrollingFeatureShowcase({
474
449
  {
475
450
  background,
476
451
  spacing,
477
- className: cn(className),
452
+ className: cn(pattern && "overflow-visible", className),
478
453
  pattern,
479
454
  patternOpacity,
480
- children: /* @__PURE__ */ jsxs("div", { className: cn("container mx-auto px-4", containerClassName), children: [
455
+ patternClassName,
456
+ containerClassName,
457
+ children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
481
458
  /* @__PURE__ */ jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
482
459
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
483
460
  "h2",
@@ -488,17 +465,8 @@ function CarouselScrollingFeatureShowcase({
488
465
  ),
489
466
  children: heading
490
467
  }
491
- ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
492
- subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx(
493
- "p",
494
- {
495
- className: cn(
496
- "mt-4 text-lg text-muted-foreground",
497
- subheadingClassName
498
- ),
499
- children: subheading
500
- }
501
- ) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", subheadingClassName), children: subheading }))
468
+ ) : heading),
469
+ subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", subheadingClassName), children: subheading }) : subheading)
502
470
  ] }),
503
471
  /* @__PURE__ */ jsxs(
504
472
  "div",
@@ -512,8 +480,7 @@ function CarouselScrollingFeatureShowcase({
512
480
  "div",
513
481
  {
514
482
  className: cn(
515
- "aspect-video overflow-hidden rounded-xl",
516
- getNestedCardBg(background),
483
+ "aspect-square overflow-hidden rounded-xl",
517
484
  imageClassName
518
485
  ),
519
486
  children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: activeFeatureData && /* @__PURE__ */ jsx(
@@ -541,7 +508,7 @@ function CarouselScrollingFeatureShowcase({
541
508
  ) })
542
509
  }
543
510
  ) }) }),
544
- /* @__PURE__ */ jsx("div", { className: cn("space-y-24 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxs(
511
+ /* @__PURE__ */ jsx("div", { className: cn("space-y-12 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxs(
545
512
  "div",
546
513
  {
547
514
  ref: setFeatureRef(feature.id),
@@ -576,8 +543,8 @@ function CarouselScrollingFeatureShowcase({
576
543
  }
577
544
  ),
578
545
  /* @__PURE__ */ jsxs("div", { children: [
579
- feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-2xl font-semibold", children: feature.title }) : /* @__PURE__ */ jsx("div", { children: feature.title })),
580
- feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-4 text-lg text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsx("div", { className: "mt-4", children: feature.description }))
546
+ feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-xl md:text-2xl font-semibold", children: feature.title }) : feature.title),
547
+ feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-4 text-lg", children: feature.description }) : feature.description)
581
548
  ] })
582
549
  ] })
583
550
  ]
package/dist/faq-centered-accordion.cjs CHANGED
@@ -35,32 +35,6 @@ var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrim
35
35
  function cn(...inputs) {
36
36
  return tailwindMerge.twMerge(clsx.clsx(inputs));
37
37
  }
38
- function getTextColor(parentBg, variant = "default", options) {
39
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
40
- if (isDark) {
41
- switch (variant) {
42
- case "default":
43
- return "text-foreground";
44
- case "muted":
45
- return "text-foreground/80";
46
- case "subtle":
47
- return "text-foreground/60";
48
- case "accent":
49
- return "text-accent-foreground";
50
- }
51
- } else {
52
- switch (variant) {
53
- case "default":
54
- return "text-foreground";
55
- case "muted":
56
- return "text-muted-foreground";
57
- case "subtle":
58
- return "text-muted-foreground/70";
59
- case "accent":
60
- return "text-primary";
61
- }
62
- }
63
- }
64
38
  var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
65
39
  function DynamicIcon({ apiKey, ...props }) {
66
40
  return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
@@ -507,12 +481,12 @@ function FaqCenteredAccordion({
507
481
  items,
508
482
  itemsSlot,
509
483
  background,
510
- spacing = "py-6 md:py-32",
484
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
485
+ spacing = "lg",
511
486
  pattern,
512
487
  patternOpacity,
513
488
  patternClassName,
514
489
  className,
515
- containerClassName,
516
490
  headerClassName,
517
491
  headingClassName,
518
492
  descriptionClassName,
@@ -543,14 +517,14 @@ function FaqCenteredAccordion({
543
517
  "transition-opacity duration-200 hover:no-underline hover:opacity-60",
544
518
  accordionTriggerClassName
545
519
  ),
546
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium sm:py-1 lg:py-2 lg:text-lg", children: item.question })
520
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium py-1 md:py-2 text-lg", children: item.question })
547
521
  }
548
522
  ),
549
523
  /* @__PURE__ */ jsxRuntime.jsx(
550
524
  AccordionContent,
551
525
  {
552
526
  className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
553
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
527
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg", children: item.answer })
554
528
  }
555
529
  )
556
530
  ]
@@ -577,7 +551,8 @@ function FaqCenteredAccordion({
577
551
  patternOpacity,
578
552
  patternClassName,
579
553
  className,
580
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-8 md:space-y-16", containerClassName), children: [
554
+ containerClassName,
555
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-8 md:space-y-16", children: [
581
556
  /* @__PURE__ */ jsxRuntime.jsxs(
582
557
  "div",
583
558
  {
@@ -595,18 +570,8 @@ function FaqCenteredAccordion({
595
570
  ),
596
571
  children: heading
597
572
  }
598
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
599
- description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
600
- "p",
601
- {
602
- className: cn(
603
- getTextColor(background, "muted"),
604
- "lg:text-lg",
605
- descriptionClassName
606
- ),
607
- children: description
608
- }
609
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
573
+ ) : heading),
574
+ description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", descriptionClassName), children: description }) : description)
610
575
  ]
611
576
  }
612
577
  ),
package/dist/faq-centered-accordion.d.cts CHANGED
@@ -86,6 +86,6 @@ interface FaqCenteredAccordionProps {
86
86
  */
87
87
  accordionContentClassName?: string;
88
88
  }
89
- declare function FaqCenteredAccordion({ heading, description, items, itemsSlot, background, spacing, pattern, patternOpacity, patternClassName, className, containerClassName, headerClassName, headingClassName, descriptionClassName, accordionClassName, accordionItemClassName, accordionTriggerClassName, accordionContentClassName, }: FaqCenteredAccordionProps): react_jsx_runtime.JSX.Element;
89
+ declare function FaqCenteredAccordion({ heading, description, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, headerClassName, headingClassName, descriptionClassName, accordionClassName, accordionItemClassName, accordionTriggerClassName, accordionContentClassName, }: FaqCenteredAccordionProps): react_jsx_runtime.JSX.Element;
90
90
 
91
91
  export { FaqCenteredAccordion, type FaqCenteredAccordionProps, type FaqItem };
package/dist/faq-centered-accordion.d.ts CHANGED
@@ -86,6 +86,6 @@ interface FaqCenteredAccordionProps {
86
86
  */
87
87
  accordionContentClassName?: string;
88
88
  }
89
- declare function FaqCenteredAccordion({ heading, description, items, itemsSlot, background, spacing, pattern, patternOpacity, patternClassName, className, containerClassName, headerClassName, headingClassName, descriptionClassName, accordionClassName, accordionItemClassName, accordionTriggerClassName, accordionContentClassName, }: FaqCenteredAccordionProps): react_jsx_runtime.JSX.Element;
89
+ declare function FaqCenteredAccordion({ heading, description, items, itemsSlot, background, containerClassName, spacing, pattern, patternOpacity, patternClassName, className, headerClassName, headingClassName, descriptionClassName, accordionClassName, accordionItemClassName, accordionTriggerClassName, accordionContentClassName, }: FaqCenteredAccordionProps): react_jsx_runtime.JSX.Element;
90
90
 
91
91
  export { FaqCenteredAccordion, type FaqCenteredAccordionProps, type FaqItem };
package/dist/faq-centered-accordion.js CHANGED
@@ -10,32 +10,6 @@ import { jsx, jsxs } from 'react/jsx-runtime';
10
10
  function cn(...inputs) {
11
11
  return twMerge(clsx(inputs));
12
12
  }
13
- function getTextColor(parentBg, variant = "default", options) {
14
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
15
- if (isDark) {
16
- switch (variant) {
17
- case "default":
18
- return "text-foreground";
19
- case "muted":
20
- return "text-foreground/80";
21
- case "subtle":
22
- return "text-foreground/60";
23
- case "accent":
24
- return "text-accent-foreground";
25
- }
26
- } else {
27
- switch (variant) {
28
- case "default":
29
- return "text-foreground";
30
- case "muted":
31
- return "text-muted-foreground";
32
- case "subtle":
33
- return "text-muted-foreground/70";
34
- case "accent":
35
- return "text-primary";
36
- }
37
- }
38
- }
39
13
  var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
40
14
  function DynamicIcon({ apiKey, ...props }) {
41
15
  return /* @__PURE__ */ jsx(Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
@@ -482,12 +456,12 @@ function FaqCenteredAccordion({
482
456
  items,
483
457
  itemsSlot,
484
458
  background,
485
- spacing = "py-6 md:py-32",
459
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
460
+ spacing = "lg",
486
461
  pattern,
487
462
  patternOpacity,
488
463
  patternClassName,
489
464
  className,
490
- containerClassName,
491
465
  headerClassName,
492
466
  headingClassName,
493
467
  descriptionClassName,
@@ -518,14 +492,14 @@ function FaqCenteredAccordion({
518
492
  "transition-opacity duration-200 hover:no-underline hover:opacity-60",
519
493
  accordionTriggerClassName
520
494
  ),
521
- children: /* @__PURE__ */ jsx("div", { className: "font-medium sm:py-1 lg:py-2 lg:text-lg", children: item.question })
495
+ children: /* @__PURE__ */ jsx("div", { className: "font-medium py-1 md:py-2 text-lg", children: item.question })
522
496
  }
523
497
  ),
524
498
  /* @__PURE__ */ jsx(
525
499
  AccordionContent,
526
500
  {
527
501
  className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
528
- children: /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
502
+ children: /* @__PURE__ */ jsx("div", { className: "text-lg", children: item.answer })
529
503
  }
530
504
  )
531
505
  ]
@@ -552,7 +526,8 @@ function FaqCenteredAccordion({
552
526
  patternOpacity,
553
527
  patternClassName,
554
528
  className,
555
- children: /* @__PURE__ */ jsxs("div", { className: cn("space-y-8 md:space-y-16", containerClassName), children: [
529
+ containerClassName,
530
+ children: /* @__PURE__ */ jsxs("div", { className: "space-y-8 md:space-y-16", children: [
556
531
  /* @__PURE__ */ jsxs(
557
532
  "div",
558
533
  {
@@ -570,18 +545,8 @@ function FaqCenteredAccordion({
570
545
  ),
571
546
  children: heading
572
547
  }
573
- ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
574
- description && (typeof description === "string" ? /* @__PURE__ */ jsx(
575
- "p",
576
- {
577
- className: cn(
578
- getTextColor(background, "muted"),
579
- "lg:text-lg",
580
- descriptionClassName
581
- ),
582
- children: description
583
- }
584
- ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
548
+ ) : heading),
549
+ description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg", descriptionClassName), children: description }) : description)
585
550
  ]
586
551
  }
587
552
  ),
package/dist/registry.cjs CHANGED
@@ -21795,7 +21795,6 @@ function CarouselScrollingFeatureShowcase({
21795
21795
  features,
21796
21796
  featuresSlot,
21797
21797
  className,
21798
- containerClassName,
21799
21798
  headerClassName,
21800
21799
  headingClassName,
21801
21800
  subheadingClassName,
@@ -21805,9 +21804,11 @@ function CarouselScrollingFeatureShowcase({
21805
21804
  numberBadgeClassName,
21806
21805
  optixFlowConfig,
21807
21806
  background,
21808
- spacing = "md",
21807
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
21808
+ spacing = "lg",
21809
21809
  pattern,
21810
- patternOpacity
21810
+ patternOpacity,
21811
+ patternClassName
21811
21812
  }) {
21812
21813
  const [activeFeature, setActiveFeature] = React30__namespace.useState(
21813
21814
  features?.[0]?.id ?? ""
@@ -21850,10 +21851,12 @@ function CarouselScrollingFeatureShowcase({
21850
21851
  {
21851
21852
  background,
21852
21853
  spacing,
21853
- className: cn(className),
21854
+ className: cn(pattern && "overflow-visible", className),
21854
21855
  pattern,
21855
21856
  patternOpacity,
21856
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container mx-auto px-4", containerClassName), children: [
21857
+ patternClassName,
21858
+ containerClassName,
21859
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
21857
21860
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
21858
21861
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
21859
21862
  "h2",
@@ -21864,17 +21867,8 @@ function CarouselScrollingFeatureShowcase({
21864
21867
  ),
21865
21868
  children: heading
21866
21869
  }
21867
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
21868
- subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
21869
- "p",
21870
- {
21871
- className: cn(
21872
- "mt-4 text-lg text-muted-foreground",
21873
- subheadingClassName
21874
- ),
21875
- children: subheading
21876
- }
21877
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", subheadingClassName), children: subheading }))
21870
+ ) : heading),
21871
+ subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", subheadingClassName), children: subheading }) : subheading)
21878
21872
  ] }),
21879
21873
  /* @__PURE__ */ jsxRuntime.jsxs(
21880
21874
  "div",
@@ -21888,8 +21882,7 @@ function CarouselScrollingFeatureShowcase({
21888
21882
  "div",
21889
21883
  {
21890
21884
  className: cn(
21891
- "aspect-video overflow-hidden rounded-xl",
21892
- getNestedCardBg(background),
21885
+ "aspect-square overflow-hidden rounded-xl",
21893
21886
  imageClassName
21894
21887
  ),
21895
21888
  children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", children: activeFeatureData && /* @__PURE__ */ jsxRuntime.jsx(
@@ -21917,7 +21910,7 @@ function CarouselScrollingFeatureShowcase({
21917
21910
  ) })
21918
21911
  }
21919
21912
  ) }) }),
21920
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-24 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs(
21913
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-12 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs(
21921
21914
  "div",
21922
21915
  {
21923
21916
  ref: setFeatureRef(feature.id),
@@ -21952,8 +21945,8 @@ function CarouselScrollingFeatureShowcase({
21952
21945
  }
21953
21946
  ),
21954
21947
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
21955
- feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-2xl font-semibold", children: feature.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: feature.title })),
21956
- feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-lg text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: feature.description }))
21948
+ feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl md:text-2xl font-semibold", children: feature.title }) : feature.title),
21949
+ feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-lg", children: feature.description }) : feature.description)
21957
21950
  ] })
21958
21951
  ] })
21959
21952
  ]
@@ -39210,12 +39203,12 @@ function FaqCenteredAccordion({
39210
39203
  items,
39211
39204
  itemsSlot,
39212
39205
  background,
39213
- spacing = "py-6 md:py-32",
39206
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
39207
+ spacing = "lg",
39214
39208
  pattern,
39215
39209
  patternOpacity,
39216
39210
  patternClassName,
39217
39211
  className,
39218
- containerClassName,
39219
39212
  headerClassName,
39220
39213
  headingClassName,
39221
39214
  descriptionClassName,
@@ -39246,14 +39239,14 @@ function FaqCenteredAccordion({
39246
39239
  "transition-opacity duration-200 hover:no-underline hover:opacity-60",
39247
39240
  accordionTriggerClassName
39248
39241
  ),
39249
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium sm:py-1 lg:py-2 lg:text-lg", children: item.question })
39242
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium py-1 md:py-2 text-lg", children: item.question })
39250
39243
  }
39251
39244
  ),
39252
39245
  /* @__PURE__ */ jsxRuntime.jsx(
39253
39246
  AccordionContent,
39254
39247
  {
39255
39248
  className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
39256
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
39249
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg", children: item.answer })
39257
39250
  }
39258
39251
  )
39259
39252
  ]
@@ -39280,7 +39273,8 @@ function FaqCenteredAccordion({
39280
39273
  patternOpacity,
39281
39274
  patternClassName,
39282
39275
  className,
39283
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-8 md:space-y-16", containerClassName), children: [
39276
+ containerClassName,
39277
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-8 md:space-y-16", children: [
39284
39278
  /* @__PURE__ */ jsxRuntime.jsxs(
39285
39279
  "div",
39286
39280
  {
@@ -39298,18 +39292,8 @@ function FaqCenteredAccordion({
39298
39292
  ),
39299
39293
  children: heading
39300
39294
  }
39301
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
39302
- description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
39303
- "p",
39304
- {
39305
- className: cn(
39306
- getTextColor(background, "muted"),
39307
- "lg:text-lg",
39308
- descriptionClassName
39309
- ),
39310
- children: description
39311
- }
39312
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
39295
+ ) : heading),
39296
+ description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", descriptionClassName), children: description }) : description)
39313
39297
  ]
39314
39298
  }
39315
39299
  ),
package/dist/registry.js CHANGED
@@ -21755,7 +21755,6 @@ function CarouselScrollingFeatureShowcase({
21755
21755
  features,
21756
21756
  featuresSlot,
21757
21757
  className,
21758
- containerClassName,
21759
21758
  headerClassName,
21760
21759
  headingClassName,
21761
21760
  subheadingClassName,
@@ -21765,9 +21764,11 @@ function CarouselScrollingFeatureShowcase({
21765
21764
  numberBadgeClassName,
21766
21765
  optixFlowConfig,
21767
21766
  background,
21768
- spacing = "md",
21767
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
21768
+ spacing = "lg",
21769
21769
  pattern,
21770
- patternOpacity
21770
+ patternOpacity,
21771
+ patternClassName
21771
21772
  }) {
21772
21773
  const [activeFeature, setActiveFeature] = React30.useState(
21773
21774
  features?.[0]?.id ?? ""
@@ -21810,10 +21811,12 @@ function CarouselScrollingFeatureShowcase({
21810
21811
  {
21811
21812
  background,
21812
21813
  spacing,
21813
- className: cn(className),
21814
+ className: cn(pattern && "overflow-visible", className),
21814
21815
  pattern,
21815
21816
  patternOpacity,
21816
- children: /* @__PURE__ */ jsxs("div", { className: cn("container mx-auto px-4", containerClassName), children: [
21817
+ patternClassName,
21818
+ containerClassName,
21819
+ children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
21817
21820
  /* @__PURE__ */ jsxs("div", { className: cn("mb-12 text-center", headerClassName), children: [
21818
21821
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
21819
21822
  "h2",
@@ -21824,17 +21827,8 @@ function CarouselScrollingFeatureShowcase({
21824
21827
  ),
21825
21828
  children: heading
21826
21829
  }
21827
- ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
21828
- subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx(
21829
- "p",
21830
- {
21831
- className: cn(
21832
- "mt-4 text-lg text-muted-foreground",
21833
- subheadingClassName
21834
- ),
21835
- children: subheading
21836
- }
21837
- ) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", subheadingClassName), children: subheading }))
21830
+ ) : heading),
21831
+ subheading && (typeof subheading === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", subheadingClassName), children: subheading }) : subheading)
21838
21832
  ] }),
21839
21833
  /* @__PURE__ */ jsxs(
21840
21834
  "div",
@@ -21848,8 +21842,7 @@ function CarouselScrollingFeatureShowcase({
21848
21842
  "div",
21849
21843
  {
21850
21844
  className: cn(
21851
- "aspect-video overflow-hidden rounded-xl",
21852
- getNestedCardBg(background),
21845
+ "aspect-square overflow-hidden rounded-xl",
21853
21846
  imageClassName
21854
21847
  ),
21855
21848
  children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: activeFeatureData && /* @__PURE__ */ jsx(
@@ -21877,7 +21870,7 @@ function CarouselScrollingFeatureShowcase({
21877
21870
  ) })
21878
21871
  }
21879
21872
  ) }) }),
21880
- /* @__PURE__ */ jsx("div", { className: cn("space-y-24 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxs(
21873
+ /* @__PURE__ */ jsx("div", { className: cn("space-y-12 lg:space-y-32", featuresClassName), children: featuresSlot ? featuresSlot : features?.map((feature, index) => /* @__PURE__ */ jsxs(
21881
21874
  "div",
21882
21875
  {
21883
21876
  ref: setFeatureRef(feature.id),
@@ -21912,8 +21905,8 @@ function CarouselScrollingFeatureShowcase({
21912
21905
  }
21913
21906
  ),
21914
21907
  /* @__PURE__ */ jsxs("div", { children: [
21915
- feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-2xl font-semibold", children: feature.title }) : /* @__PURE__ */ jsx("div", { children: feature.title })),
21916
- feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-4 text-lg text-muted-foreground", children: feature.description }) : /* @__PURE__ */ jsx("div", { className: "mt-4", children: feature.description }))
21908
+ feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-xl md:text-2xl font-semibold", children: feature.title }) : feature.title),
21909
+ feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-4 text-lg", children: feature.description }) : feature.description)
21917
21910
  ] })
21918
21911
  ] })
21919
21912
  ]
@@ -39170,12 +39163,12 @@ function FaqCenteredAccordion({
39170
39163
  items,
39171
39164
  itemsSlot,
39172
39165
  background,
39173
- spacing = "py-6 md:py-32",
39166
+ containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
39167
+ spacing = "lg",
39174
39168
  pattern,
39175
39169
  patternOpacity,
39176
39170
  patternClassName,
39177
39171
  className,
39178
- containerClassName,
39179
39172
  headerClassName,
39180
39173
  headingClassName,
39181
39174
  descriptionClassName,
@@ -39206,14 +39199,14 @@ function FaqCenteredAccordion({
39206
39199
  "transition-opacity duration-200 hover:no-underline hover:opacity-60",
39207
39200
  accordionTriggerClassName
39208
39201
  ),
39209
- children: /* @__PURE__ */ jsx("div", { className: "font-medium sm:py-1 lg:py-2 lg:text-lg", children: item.question })
39202
+ children: /* @__PURE__ */ jsx("div", { className: "font-medium py-1 md:py-2 text-lg", children: item.question })
39210
39203
  }
39211
39204
  ),
39212
39205
  /* @__PURE__ */ jsx(
39213
39206
  AccordionContent,
39214
39207
  {
39215
39208
  className: cn("sm:mb-1 lg:mb-2", accordionContentClassName),
39216
- children: /* @__PURE__ */ jsx("div", { className: cn(getTextColor(background, "muted"), "lg:text-lg"), children: item.answer })
39209
+ children: /* @__PURE__ */ jsx("div", { className: "text-lg", children: item.answer })
39217
39210
  }
39218
39211
  )
39219
39212
  ]
@@ -39240,7 +39233,8 @@ function FaqCenteredAccordion({
39240
39233
  patternOpacity,
39241
39234
  patternClassName,
39242
39235
  className,
39243
- children: /* @__PURE__ */ jsxs("div", { className: cn("space-y-8 md:space-y-16", containerClassName), children: [
39236
+ containerClassName,
39237
+ children: /* @__PURE__ */ jsxs("div", { className: "space-y-8 md:space-y-16", children: [
39244
39238
  /* @__PURE__ */ jsxs(
39245
39239
  "div",
39246
39240
  {
@@ -39258,18 +39252,8 @@ function FaqCenteredAccordion({
39258
39252
  ),
39259
39253
  children: heading
39260
39254
  }
39261
- ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
39262
- description && (typeof description === "string" ? /* @__PURE__ */ jsx(
39263
- "p",
39264
- {
39265
- className: cn(
39266
- getTextColor(background, "muted"),
39267
- "lg:text-lg",
39268
- descriptionClassName
39269
- ),
39270
- children: description
39271
- }
39272
- ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
39255
+ ) : heading),
39256
+ description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg", descriptionClassName), children: description }) : description)
39273
39257
  ]
39274
39258
  }
39275
39259
  ),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opensite/ui",
3
- "version": "2.6.9",
3
+ "version": "2.7.1",
4
4
  "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
5
5
  "keywords": [
6
6
  "react",