@burdenoff/website-sdk 2026.516.2 → 2026.516.4
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/components/pricing.d.mts +31 -0
- package/dist/components/pricing.d.ts +31 -0
- package/dist/components/pricing.js +166 -59
- package/dist/components/pricing.js.map +1 -1
- package/dist/components/pricing.mjs +166 -59
- package/dist/components/pricing.mjs.map +1 -1
- package/dist/index.js +166 -59
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +166 -59
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -95,6 +95,37 @@ interface PricingProps {
|
|
|
95
95
|
professional?: string[];
|
|
96
96
|
enterprise?: string[];
|
|
97
97
|
};
|
|
98
|
+
/**
|
|
99
|
+
* Enable audience tabs (Individual / Enterprise).
|
|
100
|
+
* When enabled, shows a two-level tab system.
|
|
101
|
+
* @default false
|
|
102
|
+
*/
|
|
103
|
+
showAudienceTabs?: boolean;
|
|
104
|
+
/**
|
|
105
|
+
* Enterprise plans to show when Enterprise tab is selected.
|
|
106
|
+
* Each entry defines a static plan card (not fetched from API).
|
|
107
|
+
*/
|
|
108
|
+
enterprisePlans?: Array<{
|
|
109
|
+
name: string;
|
|
110
|
+
subtitle: string;
|
|
111
|
+
price: string;
|
|
112
|
+
period: string;
|
|
113
|
+
note?: string;
|
|
114
|
+
button: string;
|
|
115
|
+
buttonLink: string;
|
|
116
|
+
popular: boolean;
|
|
117
|
+
badge?: string;
|
|
118
|
+
features: string[];
|
|
119
|
+
}>;
|
|
120
|
+
/**
|
|
121
|
+
* Enterprise section heading
|
|
122
|
+
* @default 'Enterprise Solutions'
|
|
123
|
+
*/
|
|
124
|
+
enterpriseHeading?: string;
|
|
125
|
+
/**
|
|
126
|
+
* Enterprise section subtitle
|
|
127
|
+
*/
|
|
128
|
+
enterpriseSubtitle?: string;
|
|
98
129
|
/**
|
|
99
130
|
* Hero section heading (for PricingPage)
|
|
100
131
|
* @default 'Simple, Transparent Pricing'
|
|
@@ -95,6 +95,37 @@ interface PricingProps {
|
|
|
95
95
|
professional?: string[];
|
|
96
96
|
enterprise?: string[];
|
|
97
97
|
};
|
|
98
|
+
/**
|
|
99
|
+
* Enable audience tabs (Individual / Enterprise).
|
|
100
|
+
* When enabled, shows a two-level tab system.
|
|
101
|
+
* @default false
|
|
102
|
+
*/
|
|
103
|
+
showAudienceTabs?: boolean;
|
|
104
|
+
/**
|
|
105
|
+
* Enterprise plans to show when Enterprise tab is selected.
|
|
106
|
+
* Each entry defines a static plan card (not fetched from API).
|
|
107
|
+
*/
|
|
108
|
+
enterprisePlans?: Array<{
|
|
109
|
+
name: string;
|
|
110
|
+
subtitle: string;
|
|
111
|
+
price: string;
|
|
112
|
+
period: string;
|
|
113
|
+
note?: string;
|
|
114
|
+
button: string;
|
|
115
|
+
buttonLink: string;
|
|
116
|
+
popular: boolean;
|
|
117
|
+
badge?: string;
|
|
118
|
+
features: string[];
|
|
119
|
+
}>;
|
|
120
|
+
/**
|
|
121
|
+
* Enterprise section heading
|
|
122
|
+
* @default 'Enterprise Solutions'
|
|
123
|
+
*/
|
|
124
|
+
enterpriseHeading?: string;
|
|
125
|
+
/**
|
|
126
|
+
* Enterprise section subtitle
|
|
127
|
+
*/
|
|
128
|
+
enterpriseSubtitle?: string;
|
|
98
129
|
/**
|
|
99
130
|
* Hero section heading (for PricingPage)
|
|
100
131
|
* @default 'Simple, Transparent Pricing'
|
|
@@ -464,6 +464,9 @@ function PricingSection(props) {
|
|
|
464
464
|
const [billingCycle, setBillingCycle] = React.useState(
|
|
465
465
|
"monthly"
|
|
466
466
|
);
|
|
467
|
+
const [audience, setAudience] = React.useState(
|
|
468
|
+
"individual"
|
|
469
|
+
);
|
|
467
470
|
React.useEffect(() => {
|
|
468
471
|
let cancelled = false;
|
|
469
472
|
async function loadPlans() {
|
|
@@ -550,81 +553,185 @@ function PricingSection(props) {
|
|
|
550
553
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-8 sm:mb-12", children: [
|
|
551
554
|
/* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl sm:text-3xl md:text-4xl font-bold mb-3 sm:mb-4", children: sectionHeading }),
|
|
552
555
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-sm sm:text-base md:text-lg mb-6", children: sectionSubtitle }),
|
|
553
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center
|
|
556
|
+
props.showAudienceTabs && props.enterprisePlans && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center bg-muted p-1.5 rounded-xl mb-4", children: [
|
|
557
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
558
|
+
"button",
|
|
559
|
+
{
|
|
560
|
+
type: "button",
|
|
561
|
+
onClick: () => setAudience("individual"),
|
|
562
|
+
className: `px-6 sm:px-8 py-2.5 rounded-lg text-sm font-semibold transition-all ${audience === "individual" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
|
|
563
|
+
children: "Individual"
|
|
564
|
+
}
|
|
565
|
+
),
|
|
554
566
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
555
567
|
"button",
|
|
556
568
|
{
|
|
569
|
+
type: "button",
|
|
570
|
+
onClick: () => setAudience("enterprise"),
|
|
571
|
+
className: `px-6 sm:px-8 py-2.5 rounded-lg text-sm font-semibold transition-all ${audience === "enterprise" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
|
|
572
|
+
children: "Enterprise"
|
|
573
|
+
}
|
|
574
|
+
)
|
|
575
|
+
] }),
|
|
576
|
+
(audience === "individual" || !props.showAudienceTabs) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center bg-muted/60 p-1.5 rounded-xl", children: [
|
|
577
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
578
|
+
"button",
|
|
579
|
+
{
|
|
580
|
+
type: "button",
|
|
557
581
|
onClick: () => setBillingCycle("monthly"),
|
|
558
|
-
className: `px-6 py-2 rounded-
|
|
582
|
+
className: `px-5 sm:px-6 py-2 rounded-lg text-sm font-medium transition-all ${billingCycle === "monthly" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
|
|
559
583
|
children: "Monthly"
|
|
560
584
|
}
|
|
561
585
|
),
|
|
562
586
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
563
587
|
"button",
|
|
564
588
|
{
|
|
589
|
+
type: "button",
|
|
565
590
|
onClick: () => setBillingCycle("yearly"),
|
|
566
|
-
className: `px-6 py-2 rounded-
|
|
591
|
+
className: `px-5 sm:px-6 py-2 rounded-lg text-sm font-medium transition-all ${billingCycle === "yearly" ? "bg-background shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"}`,
|
|
567
592
|
children: "Yearly"
|
|
568
593
|
}
|
|
569
594
|
)
|
|
570
595
|
] })
|
|
571
596
|
] }),
|
|
572
|
-
/* @__PURE__ */ jsxRuntime.
|
|
573
|
-
"
|
|
574
|
-
{
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
/* @__PURE__ */ jsxRuntime.
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
/* @__PURE__ */ jsxRuntime.
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
className: "
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
"
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
}
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
597
|
+
props.showAudienceTabs && audience === "enterprise" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl text-center mb-8", children: [
|
|
598
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl sm:text-2xl font-bold text-foreground", children: props.enterpriseHeading || "Enterprise Solutions" }),
|
|
599
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-muted-foreground", children: props.enterpriseSubtitle || "Built for teams, agencies, and organizations that need advanced collaboration, security, support, and scale." })
|
|
600
|
+
] }),
|
|
601
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid md:grid-cols-3 gap-6 sm:gap-8 max-w-6xl mx-auto items-stretch", children: props.showAudienceTabs && audience === "enterprise" && props.enterprisePlans ? (
|
|
602
|
+
/* Enterprise static cards */
|
|
603
|
+
props.enterprisePlans.map((ep) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
604
|
+
"div",
|
|
605
|
+
{
|
|
606
|
+
className: `bg-card rounded-xl p-6 sm:p-8 transition-all duration-300 flex flex-col ${ep.popular ? "border-2 border-primary shadow-xl ring-1 ring-primary/20" : "border hover:shadow-lg hover:border-primary/50"}`,
|
|
607
|
+
children: [
|
|
608
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-6", children: [
|
|
609
|
+
ep.popular && ep.badge && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block bg-primary text-primary-foreground px-4 py-1 rounded-full text-xs font-semibold mb-3", children: ep.badge }),
|
|
610
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl sm:text-2xl font-bold mb-2", children: ep.name }),
|
|
611
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-sm", children: ep.subtitle })
|
|
612
|
+
] }),
|
|
613
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-2", children: [
|
|
614
|
+
ep.price === "Custom" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-3xl sm:text-4xl font-bold", children: "Custom" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-center gap-1", children: [
|
|
615
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl sm:text-5xl font-extrabold", children: ep.price }),
|
|
616
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-lg", children: ep.period })
|
|
617
|
+
] }),
|
|
618
|
+
ep.note && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm font-medium text-primary", children: ep.note })
|
|
619
|
+
] }),
|
|
620
|
+
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-3 mb-8 mt-6 flex-1", children: ep.features.map((feature) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
621
|
+
"li",
|
|
622
|
+
{
|
|
623
|
+
className: "text-sm flex items-start gap-2",
|
|
624
|
+
children: [
|
|
625
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary mt-0.5 flex-shrink-0", children: "\u2713" }),
|
|
626
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: feature })
|
|
627
|
+
]
|
|
628
|
+
},
|
|
629
|
+
feature
|
|
630
|
+
)) }),
|
|
631
|
+
ep.buttonLink.startsWith("/") ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
632
|
+
Button,
|
|
633
|
+
{
|
|
634
|
+
className: "w-full h-11",
|
|
635
|
+
variant: ep.popular ? "default" : "outline",
|
|
636
|
+
size: "lg",
|
|
637
|
+
asChild: true,
|
|
638
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
639
|
+
"a",
|
|
640
|
+
{
|
|
641
|
+
href: ep.buttonLink,
|
|
642
|
+
onClick: () => window.scrollTo({ top: 0, behavior: "smooth" }),
|
|
643
|
+
children: ep.button
|
|
644
|
+
}
|
|
645
|
+
)
|
|
646
|
+
}
|
|
647
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
648
|
+
Button,
|
|
649
|
+
{
|
|
650
|
+
className: "w-full h-11",
|
|
651
|
+
variant: ep.popular ? "default" : "outline",
|
|
652
|
+
size: "lg",
|
|
653
|
+
asChild: true,
|
|
654
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
655
|
+
"a",
|
|
656
|
+
{
|
|
657
|
+
href: ep.buttonLink,
|
|
658
|
+
target: "_blank",
|
|
659
|
+
rel: "noopener noreferrer",
|
|
660
|
+
children: ep.button
|
|
661
|
+
}
|
|
662
|
+
)
|
|
663
|
+
}
|
|
664
|
+
)
|
|
665
|
+
]
|
|
666
|
+
},
|
|
667
|
+
ep.name
|
|
668
|
+
))
|
|
669
|
+
) : (
|
|
670
|
+
/* Individual API-fetched cards */
|
|
671
|
+
plans.map((plan) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
672
|
+
"div",
|
|
673
|
+
{
|
|
674
|
+
className: `bg-card rounded-xl p-6 sm:p-8 transition-all duration-300 flex flex-col ${plan.popular ? "border-2 border-primary shadow-xl ring-1 ring-primary/20" : "border hover:shadow-lg hover:border-primary/50"}`,
|
|
675
|
+
children: [
|
|
676
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center mb-6", children: [
|
|
677
|
+
plan.popular && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block bg-primary text-primary-foreground px-4 py-1 rounded-full text-xs font-semibold mb-3", children: "Most Popular" }),
|
|
678
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl sm:text-2xl font-bold mb-2", children: plan.name }),
|
|
679
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-sm", children: plan.description })
|
|
680
|
+
] }),
|
|
681
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center mb-8", children: plan.price === "Custom" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-3xl sm:text-4xl font-bold", children: "Custom" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-center gap-1", children: [
|
|
682
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl sm:text-5xl font-bold", children: plan.price }),
|
|
683
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-lg", children: plan.interval })
|
|
684
|
+
] }) }),
|
|
685
|
+
/* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-3 mb-8 flex-1", children: plan.features.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
686
|
+
"li",
|
|
687
|
+
{
|
|
688
|
+
className: "text-sm flex items-start gap-2",
|
|
689
|
+
children: [
|
|
690
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary mt-0.5 flex-shrink-0", children: "\u2713" }),
|
|
691
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: feature })
|
|
692
|
+
]
|
|
693
|
+
},
|
|
694
|
+
index
|
|
695
|
+
)) }),
|
|
696
|
+
plan.ctaLink.startsWith("/") ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
697
|
+
Button,
|
|
698
|
+
{
|
|
699
|
+
className: "w-full h-11",
|
|
700
|
+
variant: plan.popular ? "default" : "outline",
|
|
701
|
+
size: "lg",
|
|
702
|
+
asChild: true,
|
|
703
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
704
|
+
"a",
|
|
705
|
+
{
|
|
706
|
+
href: plan.ctaLink,
|
|
707
|
+
onClick: () => window.scrollTo({ top: 0, behavior: "smooth" }),
|
|
708
|
+
children: plan.ctaText
|
|
709
|
+
}
|
|
710
|
+
)
|
|
711
|
+
}
|
|
712
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
713
|
+
Button,
|
|
714
|
+
{
|
|
715
|
+
className: "w-full h-11",
|
|
716
|
+
variant: plan.popular ? "default" : "outline",
|
|
717
|
+
size: "lg",
|
|
718
|
+
asChild: true,
|
|
719
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
720
|
+
"a",
|
|
721
|
+
{
|
|
722
|
+
href: plan.ctaLink,
|
|
723
|
+
target: "_blank",
|
|
724
|
+
rel: "noopener noreferrer",
|
|
725
|
+
children: plan.ctaText
|
|
726
|
+
}
|
|
727
|
+
)
|
|
728
|
+
}
|
|
729
|
+
)
|
|
730
|
+
]
|
|
731
|
+
},
|
|
732
|
+
plan.id
|
|
733
|
+
))
|
|
734
|
+
) })
|
|
628
735
|
] }) });
|
|
629
736
|
}
|
|
630
737
|
function PricingPage(props) {
|