@olwiba/ui 0.2.1 → 0.2.3

package/dist/index.d.ts

@@ -672,10 +672,14 @@ interface PricingSectionProps {
     footnote?: string;
     mode?: 'subscription' | 'one-time';
     foundingDeadline?: string;
+    /** Symbol prepended to the computed price. Ignored by plans with `priceDisplay`. */
+    currency?: string;
+    /** Badge label for `highlighted` plans with no active `foundingDeadline` countdown. Pass '' to show no badge. */
+    highlightedBadgeLabel?: string;
     /** Rendered below each plan's CTA button (e.g. a "Get notified" link). */
     renderPlanFooter?: (plan: PricingPlan) => React.ReactNode;
 }
-declare function PricingSection({ title, description, badge, plans, saveBadge, isAuthenticated, renderLink, footnote, mode, foundingDeadline, renderPlanFooter, }: PricingSectionProps): react_jsx_runtime.JSX.Element;
+declare function PricingSection({ title, description, badge, plans, saveBadge, isAuthenticated, renderLink, footnote, mode, foundingDeadline, currency, highlightedBadgeLabel, renderPlanFooter, }: PricingSectionProps): react_jsx_runtime.JSX.Element;
 
 interface TestimonialsSectionProps {
     title?: string;

package/dist/index.js

@@ -268,7 +268,7 @@ function NavUser({ user }) {
       SidebarMenuButton,
       {
         size: "lg",
-        className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
+        className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!min-w-8 group-data-[collapsible=icon]:!max-w-8 group-data-[collapsible=icon]:!p-0",
         children: [
           /* @__PURE__ */ jsxs(Avatar, { mode: avatarMode, size: "sm", className: "grayscale", children: [
             user.avatar && /* @__PURE__ */ jsx(AvatarImage, { src: user.avatar, alt: user.name }),
@@ -337,13 +337,26 @@ function ShellSidebar({
 }) {
   const fallbackLogo = typeof brand.name === "string" ? brand.name.slice(0, 1).toUpperCase() : null;
   return /* @__PURE__ */ jsxs(Sidebar, { side, collapsible, sidebarPosition, children: [
-    /* @__PURE__ */ jsx(SidebarHeader, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsx(SidebarMenuButton, { asChild: true, tooltip: typeof brand.name === "string" ? brand.name : void 0, className: "data-[slot=sidebar-menu-button]:!p-1.5", children: renderLink({
-      href: brand.href ?? "#",
-      children: /* @__PURE__ */ jsxs(Fragment, { children: [
-        brand.logo ? /* @__PURE__ */ jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-primary text-primary-foreground", children: brand.logo }) : /* @__PURE__ */ jsx("span", { className: "flex size-4 shrink-0 items-center justify-center text-sm font-semibold", children: fallbackLogo }),
-        /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-base font-semibold group-data-[collapsible=icon]:hidden", children: brand.name })
-      ] })
-    }) }) }) }) }),
+    /* @__PURE__ */ jsx(SidebarHeader, { className: "py-3", children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsx(
+      SidebarMenuButton,
+      {
+        asChild: true,
+        size: "lg",
+        tooltip: typeof brand.name === "string" ? brand.name : void 0,
+        className: "group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!min-w-8 group-data-[collapsible=icon]:!max-w-8 group-data-[collapsible=icon]:!p-0",
+        children: renderLink({
+          href: brand.href ?? "#",
+          children: /* @__PURE__ */ jsxs(Fragment, { children: [
+            brand.logo ? (
+              // Neutral slot: the consumer's logo owns its own chrome
+              // (background, radius). Sized to fill the collapsed icon rail.
+              /* @__PURE__ */ jsx("span", { className: "flex size-8 shrink-0 items-center justify-center [&>svg]:size-5", children: brand.logo })
+            ) : /* @__PURE__ */ jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-primary text-sm font-semibold text-primary-foreground", children: fallbackLogo }),
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-base font-semibold group-data-[collapsible=icon]:hidden", children: brand.name })
+          ] })
+        })
+      }
+    ) }) }) }),
     /* @__PURE__ */ jsx(SidebarContent, { children: /* @__PURE__ */ jsx(SidebarGroup, { children: /* @__PURE__ */ jsxs(SidebarGroupContent, { className: "flex flex-col gap-2", children: [
       action && /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: action.href ? /* @__PURE__ */ jsx(
         SidebarMenuButton,
@@ -2121,6 +2134,8 @@ function PricingSection({
   footnote,
   mode = "subscription",
   foundingDeadline,
+  currency = "$",
+  highlightedBadgeLabel = "Founding member",
   renderPlanFooter
 }) {
   const [annual, setAnnual] = React32.useState(false);
@@ -2171,9 +2186,9 @@ function PricingSection({
     ] }),
     /* @__PURE__ */ jsx(StaggerChildren, { className: "mt-10 grid gap-4 lg:grid-cols-3", children: plans.map((plan) => {
       const rawPrice = isOneTime ? plan.monthly : annual ? plan.annual : plan.monthly;
-      const price = plan.priceDisplay ?? `$${rawPrice}`;
+      const price = plan.priceDisplay ?? `${currency}${rawPrice}`;
       const period = plan.periodDisplay ?? (isOneTime ? "one-time" : rawPrice > 0 ? "/mo" : "");
-      const badge2 = plan.highlighted && foundingDeadline ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full border bg-secondary px-2.5 py-0.5 text-xs font-semibold text-secondary-foreground", children: /* @__PURE__ */ jsx(CountdownTimer, { deadline: foundingDeadline, compact: true }) }) : plan.highlighted ? "Founding member" : void 0;
+      const badge2 = plan.highlighted && foundingDeadline ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full border bg-secondary px-2.5 py-0.5 text-xs font-semibold text-secondary-foreground", children: /* @__PURE__ */ jsx(CountdownTimer, { deadline: foundingDeadline, compact: true }) }) : plan.highlighted && highlightedBadgeLabel ? highlightedBadgeLabel : void 0;
       return /* @__PURE__ */ jsx(
         PricingCard,
         {