@olwiba/ui 0.1.10 → 0.1.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olwiba/ui",
-  "version": "0.1.10",
+  "version": "0.1.11",
   "private": false,
   "type": "module",
   "sideEffects": false,

package/src/components/PricingCard.tsx

@@ -18,7 +18,11 @@ export interface PricingCardProps extends React.HTMLAttributes<HTMLDivElement> {
   cta: string;
   highlighted?: boolean;
   disabled?: boolean;
+  /** Disables only the CTA button, leaving the rest of the card interactive. */
+  ctaDisabled?: boolean;
   badge?: React.ReactNode;
+  /** Rendered directly below the CTA button (e.g. a "Get notified" link). */
+  footer?: React.ReactNode;
   onSelect?: () => void;
 }
 
@@ -31,7 +35,9 @@ export function PricingCard({
   cta,
   highlighted = false,
   disabled = false,
+  ctaDisabled = false,
   badge,
+  footer,
   onSelect,
   className,
   ...props
@@ -72,11 +78,13 @@ export function PricingCard({
         variant={highlighted ? 'default' : 'outline'}
         className="mt-6 w-full"
         onClick={onSelect}
-        disabled={disabled}
+        disabled={disabled || ctaDisabled}
       >
         {cta}
       </Button>
 
+      {footer && <div className="mt-3 text-center text-sm">{footer}</div>}
+
       <Separator className="my-6" />
 
       <ul className="space-y-3 text-sm">

package/src/marketing/PricingSection.tsx

@@ -15,6 +15,8 @@ export interface PricingPlan {
   cta: string;
   highlighted?: boolean;
   disabled?: boolean;
+  /** Disables only the CTA button, leaving the rest of the card interactive. */
+  ctaDisabled?: boolean;
   features: PricingFeature[];
   /** Overrides computed price display (e.g. "$?" for community/reach-out tiers). */
   priceDisplay?: string;
@@ -33,6 +35,8 @@ export interface PricingSectionProps {
   footnote?: string;
   mode?: 'subscription' | 'one-time';
   foundingDeadline?: string;
+  /** Rendered below each plan's CTA button (e.g. a "Get notified" link). */
+  renderPlanFooter?: (plan: PricingPlan) => React.ReactNode;
 }
 
 const defaultRenderLink: AppShellRenderLink = ({ href, children, className }) => (
@@ -50,6 +54,7 @@ export function PricingSection({
   footnote,
   mode = 'subscription',
   foundingDeadline,
+  renderPlanFooter,
 }: PricingSectionProps) {
   const [annual, setAnnual] = React.useState(false);
   const isOneTime = mode === 'one-time';
@@ -139,7 +144,9 @@ export function PricingSection({
                   cta={plan.cta}
                   highlighted={plan.highlighted}
                   disabled={plan.disabled}
+                  ctaDisabled={plan.ctaDisabled}
                   badge={badge}
+                  footer={renderPlanFooter?.(plan)}
                 />
               );
             })}