@opensite/ui 1.2.4 → 1.2.5
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/feature-accordion-image.cjs +101 -27
- package/dist/feature-accordion-image.js +101 -27
- package/dist/feature-animated-carousel.cjs +801 -293
- package/dist/feature-animated-carousel.d.cts +25 -1
- package/dist/feature-animated-carousel.d.ts +25 -1
- package/dist/feature-animated-carousel.js +799 -291
- package/dist/feature-card-grid-linked.cjs +1 -1
- package/dist/feature-card-grid-linked.js +1 -1
- package/dist/feature-carousel-progress.cjs +23 -10
- package/dist/feature-carousel-progress.js +23 -10
- package/dist/feature-checklist-image.cjs +1 -1
- package/dist/feature-checklist-image.js +1 -1
- package/dist/feature-icon-grid-muted.cjs +521 -15
- package/dist/feature-icon-grid-muted.d.cts +5 -1
- package/dist/feature-icon-grid-muted.d.ts +5 -1
- package/dist/feature-icon-grid-muted.js +521 -15
- package/dist/feature-image-cards-three-column.cjs +146 -75
- package/dist/feature-image-cards-three-column.d.cts +5 -1
- package/dist/feature-image-cards-three-column.d.ts +5 -1
- package/dist/feature-image-cards-three-column.js +146 -75
- package/dist/feature-numbered-cards.cjs +1 -1
- package/dist/feature-numbered-cards.js +1 -1
- package/dist/feature-stats-highlight.cjs +25 -39
- package/dist/feature-stats-highlight.js +25 -39
- package/dist/registry.cjs +756 -413
- package/dist/registry.js +756 -413
- package/package.json +1 -1
|
@@ -606,7 +606,7 @@ function FeatureAccordionImage({
|
|
|
606
606
|
itemsSlot,
|
|
607
607
|
defaultValue,
|
|
608
608
|
className,
|
|
609
|
-
containerClassName,
|
|
609
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
610
610
|
headerClassName,
|
|
611
611
|
titleClassName,
|
|
612
612
|
descriptionClassName,
|
|
@@ -627,10 +627,36 @@ function FeatureAccordionImage({
|
|
|
627
627
|
const accordionItemsContent = React.useMemo(() => {
|
|
628
628
|
if (itemsSlot) return itemsSlot;
|
|
629
629
|
if (!items || items.length === 0) return null;
|
|
630
|
-
return items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
630
|
+
return items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
631
|
+
AccordionItem,
|
|
632
|
+
{
|
|
633
|
+
value: `item-${index}`,
|
|
634
|
+
className: item.className,
|
|
635
|
+
children: [
|
|
636
|
+
item.title && /* @__PURE__ */ jsxRuntime.jsx(
|
|
637
|
+
AccordionTrigger,
|
|
638
|
+
{
|
|
639
|
+
className: cn(
|
|
640
|
+
"text-left text-lg font-medium",
|
|
641
|
+
item.triggerClassName
|
|
642
|
+
),
|
|
643
|
+
children: item.title
|
|
644
|
+
}
|
|
645
|
+
),
|
|
646
|
+
item.content && /* @__PURE__ */ jsxRuntime.jsx(
|
|
647
|
+
AccordionContent,
|
|
648
|
+
{
|
|
649
|
+
className: cn(
|
|
650
|
+
getTextColor(background, "muted"),
|
|
651
|
+
item.contentClassName
|
|
652
|
+
),
|
|
653
|
+
children: item.content
|
|
654
|
+
}
|
|
655
|
+
)
|
|
656
|
+
]
|
|
657
|
+
},
|
|
658
|
+
index
|
|
659
|
+
));
|
|
634
660
|
}, [itemsSlot, items]);
|
|
635
661
|
const imageContent = React.useMemo(() => {
|
|
636
662
|
if (currentImage?.imageSlot) return currentImage.imageSlot;
|
|
@@ -640,13 +666,16 @@ function FeatureAccordionImage({
|
|
|
640
666
|
{
|
|
641
667
|
src: currentImage.imageSrc,
|
|
642
668
|
alt: currentImage.imageAlt || "",
|
|
643
|
-
className: cn(
|
|
669
|
+
className: cn(
|
|
670
|
+
"h-full w-full object-cover transition-opacity duration-300",
|
|
671
|
+
imageClassName
|
|
672
|
+
),
|
|
644
673
|
loading: "lazy",
|
|
645
674
|
optixFlowConfig
|
|
646
675
|
}
|
|
647
676
|
);
|
|
648
677
|
}, [currentImage, imageClassName, optixFlowConfig]);
|
|
649
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
678
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
650
679
|
Section,
|
|
651
680
|
{
|
|
652
681
|
background,
|
|
@@ -656,26 +685,71 @@ function FeatureAccordionImage({
|
|
|
656
685
|
patternClassName,
|
|
657
686
|
className,
|
|
658
687
|
containerClassName,
|
|
659
|
-
children: [
|
|
660
|
-
(title || description) && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
688
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
|
|
689
|
+
(title || description) && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
690
|
+
"div",
|
|
691
|
+
{
|
|
692
|
+
className: cn(
|
|
693
|
+
"text-center max-w-full md:max-w-md text-balance",
|
|
694
|
+
headerClassName
|
|
695
|
+
),
|
|
696
|
+
children: [
|
|
697
|
+
title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
698
|
+
"h2",
|
|
699
|
+
{
|
|
700
|
+
className: cn(
|
|
701
|
+
"text-xl font-semibold md:text-2xl lg:text-3xl",
|
|
702
|
+
titleClassName
|
|
703
|
+
),
|
|
704
|
+
children: title
|
|
705
|
+
}
|
|
706
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
707
|
+
"div",
|
|
708
|
+
{
|
|
709
|
+
className: cn(
|
|
710
|
+
"text-xl font-semibold md:text-2xl lg:text-3xl",
|
|
711
|
+
titleClassName
|
|
712
|
+
),
|
|
713
|
+
children: title
|
|
714
|
+
}
|
|
715
|
+
)),
|
|
716
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }))
|
|
717
|
+
]
|
|
718
|
+
}
|
|
719
|
+
),
|
|
720
|
+
(itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
721
|
+
"div",
|
|
722
|
+
{
|
|
723
|
+
className: cn(
|
|
724
|
+
"grid gap-10 lg:grid-cols-2 lg:gap-16",
|
|
725
|
+
gridClassName
|
|
726
|
+
),
|
|
727
|
+
children: [
|
|
728
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
729
|
+
Accordion,
|
|
730
|
+
{
|
|
731
|
+
type: "single",
|
|
732
|
+
collapsible: true,
|
|
733
|
+
value: activeItem,
|
|
734
|
+
onValueChange: setActiveItem,
|
|
735
|
+
className: cn("w-full", accordionClassName),
|
|
736
|
+
children: accordionItemsContent
|
|
737
|
+
}
|
|
738
|
+
),
|
|
739
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
740
|
+
"div",
|
|
741
|
+
{
|
|
742
|
+
className: cn(
|
|
743
|
+
"relative aspect-video overflow-hidden rounded-xl shadow-xl lg:aspect-square",
|
|
744
|
+
imageWrapperClassName
|
|
745
|
+
),
|
|
746
|
+
children: imageContent
|
|
747
|
+
}
|
|
748
|
+
)
|
|
749
|
+
]
|
|
750
|
+
}
|
|
751
|
+
)
|
|
752
|
+
] })
|
|
679
753
|
}
|
|
680
754
|
);
|
|
681
755
|
}
|
|
@@ -584,7 +584,7 @@ function FeatureAccordionImage({
|
|
|
584
584
|
itemsSlot,
|
|
585
585
|
defaultValue,
|
|
586
586
|
className,
|
|
587
|
-
containerClassName,
|
|
587
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
588
588
|
headerClassName,
|
|
589
589
|
titleClassName,
|
|
590
590
|
descriptionClassName,
|
|
@@ -605,10 +605,36 @@ function FeatureAccordionImage({
|
|
|
605
605
|
const accordionItemsContent = useMemo(() => {
|
|
606
606
|
if (itemsSlot) return itemsSlot;
|
|
607
607
|
if (!items || items.length === 0) return null;
|
|
608
|
-
return items.map((item, index) => /* @__PURE__ */ jsxs(
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
608
|
+
return items.map((item, index) => /* @__PURE__ */ jsxs(
|
|
609
|
+
AccordionItem,
|
|
610
|
+
{
|
|
611
|
+
value: `item-${index}`,
|
|
612
|
+
className: item.className,
|
|
613
|
+
children: [
|
|
614
|
+
item.title && /* @__PURE__ */ jsx(
|
|
615
|
+
AccordionTrigger,
|
|
616
|
+
{
|
|
617
|
+
className: cn(
|
|
618
|
+
"text-left text-lg font-medium",
|
|
619
|
+
item.triggerClassName
|
|
620
|
+
),
|
|
621
|
+
children: item.title
|
|
622
|
+
}
|
|
623
|
+
),
|
|
624
|
+
item.content && /* @__PURE__ */ jsx(
|
|
625
|
+
AccordionContent,
|
|
626
|
+
{
|
|
627
|
+
className: cn(
|
|
628
|
+
getTextColor(background, "muted"),
|
|
629
|
+
item.contentClassName
|
|
630
|
+
),
|
|
631
|
+
children: item.content
|
|
632
|
+
}
|
|
633
|
+
)
|
|
634
|
+
]
|
|
635
|
+
},
|
|
636
|
+
index
|
|
637
|
+
));
|
|
612
638
|
}, [itemsSlot, items]);
|
|
613
639
|
const imageContent = useMemo(() => {
|
|
614
640
|
if (currentImage?.imageSlot) return currentImage.imageSlot;
|
|
@@ -618,13 +644,16 @@ function FeatureAccordionImage({
|
|
|
618
644
|
{
|
|
619
645
|
src: currentImage.imageSrc,
|
|
620
646
|
alt: currentImage.imageAlt || "",
|
|
621
|
-
className: cn(
|
|
647
|
+
className: cn(
|
|
648
|
+
"h-full w-full object-cover transition-opacity duration-300",
|
|
649
|
+
imageClassName
|
|
650
|
+
),
|
|
622
651
|
loading: "lazy",
|
|
623
652
|
optixFlowConfig
|
|
624
653
|
}
|
|
625
654
|
);
|
|
626
655
|
}, [currentImage, imageClassName, optixFlowConfig]);
|
|
627
|
-
return /* @__PURE__ */
|
|
656
|
+
return /* @__PURE__ */ jsx(
|
|
628
657
|
Section,
|
|
629
658
|
{
|
|
630
659
|
background,
|
|
@@ -634,26 +663,71 @@ function FeatureAccordionImage({
|
|
|
634
663
|
patternClassName,
|
|
635
664
|
className,
|
|
636
665
|
containerClassName,
|
|
637
|
-
children: [
|
|
638
|
-
(title || description) && /* @__PURE__ */ jsxs(
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
666
|
+
children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col space-y-6 md:space-y-16", children: [
|
|
667
|
+
(title || description) && /* @__PURE__ */ jsxs(
|
|
668
|
+
"div",
|
|
669
|
+
{
|
|
670
|
+
className: cn(
|
|
671
|
+
"text-center max-w-full md:max-w-md text-balance",
|
|
672
|
+
headerClassName
|
|
673
|
+
),
|
|
674
|
+
children: [
|
|
675
|
+
title && (typeof title === "string" ? /* @__PURE__ */ jsx(
|
|
676
|
+
"h2",
|
|
677
|
+
{
|
|
678
|
+
className: cn(
|
|
679
|
+
"text-xl font-semibold md:text-2xl lg:text-3xl",
|
|
680
|
+
titleClassName
|
|
681
|
+
),
|
|
682
|
+
children: title
|
|
683
|
+
}
|
|
684
|
+
) : /* @__PURE__ */ jsx(
|
|
685
|
+
"div",
|
|
686
|
+
{
|
|
687
|
+
className: cn(
|
|
688
|
+
"text-xl font-semibold md:text-2xl lg:text-3xl",
|
|
689
|
+
titleClassName
|
|
690
|
+
),
|
|
691
|
+
children: title
|
|
692
|
+
}
|
|
693
|
+
)),
|
|
694
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4 lg:text-lg", descriptionClassName), children: description }))
|
|
695
|
+
]
|
|
696
|
+
}
|
|
697
|
+
),
|
|
698
|
+
(itemsSlot || items && items.length > 0) && /* @__PURE__ */ jsxs(
|
|
699
|
+
"div",
|
|
700
|
+
{
|
|
701
|
+
className: cn(
|
|
702
|
+
"grid gap-10 lg:grid-cols-2 lg:gap-16",
|
|
703
|
+
gridClassName
|
|
704
|
+
),
|
|
705
|
+
children: [
|
|
706
|
+
/* @__PURE__ */ jsx(
|
|
707
|
+
Accordion,
|
|
708
|
+
{
|
|
709
|
+
type: "single",
|
|
710
|
+
collapsible: true,
|
|
711
|
+
value: activeItem,
|
|
712
|
+
onValueChange: setActiveItem,
|
|
713
|
+
className: cn("w-full", accordionClassName),
|
|
714
|
+
children: accordionItemsContent
|
|
715
|
+
}
|
|
716
|
+
),
|
|
717
|
+
/* @__PURE__ */ jsx(
|
|
718
|
+
"div",
|
|
719
|
+
{
|
|
720
|
+
className: cn(
|
|
721
|
+
"relative aspect-video overflow-hidden rounded-xl shadow-xl lg:aspect-square",
|
|
722
|
+
imageWrapperClassName
|
|
723
|
+
),
|
|
724
|
+
children: imageContent
|
|
725
|
+
}
|
|
726
|
+
)
|
|
727
|
+
]
|
|
728
|
+
}
|
|
729
|
+
)
|
|
730
|
+
] })
|
|
657
731
|
}
|
|
658
732
|
);
|
|
659
733
|
}
|