@omnibase/shadcn 0.1.2 → 0.3.0

package/dist/index.js

@@ -166,101 +166,261 @@ function Label({
   );
 }
 
+// src/components/ui/messages.tsx
+import * as React6 from "react";
+
+// src/components/ui/alert.tsx
+import * as React5 from "react";
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var alertVariants = cva2(
+  "relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground",
+        destructive: "border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",
+        warning: "border-yellow-500/50 text-yellow-700 bg-yellow-50 dark:border-yellow-500 dark:text-yellow-200 dark:bg-yellow-950/20 [&>svg]:text-yellow-600 dark:[&>svg]:text-yellow-200",
+        success: "border-green-500/50 text-green-700 bg-green-50 dark:border-green-500 dark:text-green-200 dark:bg-green-950/20 [&>svg]:text-green-600 dark:[&>svg]:text-green-200",
+        info: "border-blue-500/50 text-blue-700 bg-blue-50 dark:border-blue-500 dark:text-blue-200 dark:bg-blue-950/20 [&>svg]:text-blue-600 dark:[&>svg]:text-blue-200"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+var Alert = React5.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "div",
+  {
+    ref,
+    role: "alert",
+    className: cn(alertVariants({ variant }), className),
+    ...props
+  }
+));
+Alert.displayName = "Alert";
+var AlertTitle = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "h5",
+  {
+    ref,
+    className: cn("mb-1 font-medium leading-none tracking-tight", className),
+    ...props
+  }
+));
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx5(
+  "div",
+  {
+    ref,
+    className: cn("text-sm [&_p]:leading-relaxed", className),
+    ...props
+  }
+));
+AlertDescription.displayName = "AlertDescription";
+
+// src/components/ui/messages.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var getMessageVariant = (type) => {
+  switch (type) {
+    case "error":
+      return "destructive";
+    case "success":
+      return "success";
+    case "info":
+      return "info";
+    case "11184809":
+      return "warning";
+    default:
+      return "default";
+  }
+};
+var Messages = React6.forwardRef(
+  ({ flow, className, ...props }, ref) => {
+    if (!flow?.ui) return null;
+    const allMessages = [];
+    if (flow.ui.messages) {
+      allMessages.push(...flow.ui.messages);
+    }
+    if (flow.ui.nodes) {
+      flow.ui.nodes.forEach((node) => {
+        if (node.messages) {
+          allMessages.push(...node.messages);
+        }
+      });
+    }
+    if (allMessages.length === 0) return null;
+    return /* @__PURE__ */ jsx6(
+      "div",
+      {
+        ref,
+        className: cn("w-full max-w-md mx-auto space-y-2 mb-4", className),
+        ...props,
+        children: allMessages.map((message) => /* @__PURE__ */ jsx6(Alert, { variant: getMessageVariant(message.type), children: /* @__PURE__ */ jsx6(AlertDescription, { children: message.text }) }, message.id))
+      }
+    );
+  }
+);
+Messages.displayName = "Messages";
+
 // src/form/index.tsx
-import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs } from "react/jsx-runtime";
 function isUiNodeInputAttributes(attributes) {
   return attributes && typeof attributes === "object" && "name" in attributes && "type" in attributes;
 }
 function CustomFlowForm({ flow, Header }) {
+  const nodesByGroup = flow.ui.nodes.reduce((groups, node) => {
+    const group = node.group || "default";
+    if (!groups[group]) {
+      groups[group] = [];
+    }
+    groups[group].push(node);
+    return groups;
+  }, {});
+  const oidcNodes = nodesByGroup.oidc || [];
+  const regularNodes = Object.entries(nodesByGroup).filter(([group]) => group !== "oidc").flatMap(([, nodes]) => nodes);
+  const csrfToken = regularNodes.find(
+    (node) => isUiNodeInputAttributes(node.attributes) && node.attributes.name === "csrf_token"
+  );
   const hasSubmitButton = flow.ui.nodes.some(
     (node) => isUiNodeInputAttributes(node.attributes) && node.attributes.type === "submit"
   );
-  return /* @__PURE__ */ jsx5("div", { children: /* @__PURE__ */ jsx5(Card, { className: "w-full max-w-md mx-auto", children: /* @__PURE__ */ jsxs("form", { action: flow.ui.action, method: flow.ui.method, children: [
-    Header && /* @__PURE__ */ jsx5(CardHeader, { children: /* @__PURE__ */ jsx5(CardTitle, { className: "text-center pb-4", children: Header }) }),
-    /* @__PURE__ */ jsxs(CardContent, { className: "space-y-4", children: [
-      flow.ui.nodes.map((node) => {
-        if (isUiNodeInputAttributes(node.attributes)) {
-          const isSubmitButton = node.attributes.type === "submit";
-          const isHiddenField = node.attributes.type === "hidden";
-          const isVisibleField = !isHiddenField && !isSubmitButton;
-          if (isHiddenField) {
-            return /* @__PURE__ */ jsx5(
-              "input",
-              {
-                name: node.attributes.name,
-                type: "hidden",
-                value: node.attributes.value || "",
-                readOnly: true
-              },
-              node.attributes.name
-            );
-          }
-          if (isSubmitButton) {
-            return /* @__PURE__ */ jsx5(
-              Button,
-              {
-                type: "submit",
-                name: node.attributes.name,
-                value: node.attributes.value || "",
-                className: "w-full mt-2",
-                children: node.meta.label?.text || node.attributes.value || "Submit"
-              },
-              node.attributes.name
-            );
-          }
-          if (isVisibleField && [
-            "default",
-            "password",
-            "code",
-            "webauthn",
-            "passkey",
-            "totp",
-            "lookup_secret"
-          ].includes(node.group)) {
-            return /* @__PURE__ */ jsxs(
-              "div",
-              {
-                className: "space-y-2",
-                children: [
-                  /* @__PURE__ */ jsxs(Label, { htmlFor: node.attributes.name, children: [
-                    node.meta.label?.text,
-                    node.attributes.required && /* @__PURE__ */ jsx5("span", { className: "text-destructive ml-1", children: "*" })
-                  ] }),
-                  /* @__PURE__ */ jsx5(
-                    Input,
-                    {
-                      id: node.attributes.name,
-                      name: node.attributes.name,
-                      type: node.attributes.type,
-                      defaultValue: node.attributes.value || "",
-                      required: node.attributes.required,
-                      placeholder: `Enter your ${node.meta.label?.text?.toLowerCase() || node.attributes.name}`
-                    }
-                  )
-                ]
-              },
-              node.meta.label?.id || node.attributes.name
-            );
-          }
-        }
-        return null;
-      }),
-      !hasSubmitButton && /* @__PURE__ */ jsx5(Button, { type: "submit", className: "w-full", children: "Submit" })
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx7(Messages, { flow }),
+    /* @__PURE__ */ jsxs(Card, { className: "w-full max-w-md mx-auto", children: [
+      Header && /* @__PURE__ */ jsx7(CardHeader, { children: /* @__PURE__ */ jsx7(CardTitle, { className: "text-center pb-1", children: Header }) }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "space-y-6", children: [
+        oidcNodes.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          oidcNodes.map((node, index) => {
+            if (isUiNodeInputAttributes(node.attributes) && node.attributes.type === "submit") {
+              return /* @__PURE__ */ jsxs(
+                "form",
+                {
+                  action: flow.ui.action,
+                  method: flow.ui.method,
+                  className: "w-full",
+                  children: [
+                    csrfToken && isUiNodeInputAttributes(csrfToken.attributes) && /* @__PURE__ */ jsx7(
+                      "input",
+                      {
+                        name: csrfToken.attributes.name,
+                        type: "hidden",
+                        value: csrfToken.attributes.value || "",
+                        readOnly: true
+                      }
+                    ),
+                    /* @__PURE__ */ jsx7(
+                      Button,
+                      {
+                        type: "submit",
+                        name: node.attributes.name,
+                        value: node.attributes.value || "",
+                        variant: "outline",
+                        className: "w-full",
+                        children: node.meta.label?.text || node.attributes.value || "Sign in"
+                      }
+                    )
+                  ]
+                },
+                `oidc-${index}`
+              );
+            }
+            return null;
+          }),
+          regularNodes.some(
+            (node) => isUiNodeInputAttributes(node.attributes) && !["hidden", "submit"].includes(node.attributes.type)
+          ) && /* @__PURE__ */ jsxs("div", { className: "relative my-6", children: [
+            /* @__PURE__ */ jsx7("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx7("span", { className: "w-full border-t border-border" }) }),
+            /* @__PURE__ */ jsx7("div", { className: "relative flex justify-center text-xs uppercase", children: /* @__PURE__ */ jsx7("span", { className: "bg-background px-3 text-muted-foreground font-medium", children: "Or continue with email" }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("form", { action: flow.ui.action, method: flow.ui.method, children: [
+          regularNodes.map((node) => {
+            if (isUiNodeInputAttributes(node.attributes)) {
+              const isSubmitButton = node.attributes.type === "submit";
+              const isHiddenField = node.attributes.type === "hidden";
+              const isVisibleField = !isHiddenField && !isSubmitButton;
+              if (isHiddenField) {
+                return /* @__PURE__ */ jsx7(
+                  "input",
+                  {
+                    name: node.attributes.name,
+                    type: "hidden",
+                    value: node.attributes.value || "",
+                    readOnly: true
+                  },
+                  node.attributes.name
+                );
+              }
+              if (isSubmitButton) {
+                return /* @__PURE__ */ jsx7(
+                  Button,
+                  {
+                    type: "submit",
+                    name: node.attributes.name,
+                    value: node.attributes.value || "",
+                    className: "w-full mt-2",
+                    children: node.meta.label?.text || node.attributes.value || "Submit"
+                  },
+                  node.attributes.name
+                );
+              }
+              if (isVisibleField && [
+                "default",
+                "password",
+                "code",
+                "webauthn",
+                "passkey",
+                "totp",
+                "lookup_secret",
+                "profile"
+              ].includes(node.group)) {
+                return /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "space-y-2 mb-4",
+                    children: [
+                      /* @__PURE__ */ jsxs(Label, { htmlFor: node.attributes.name, children: [
+                        node.meta.label?.text,
+                        node.attributes.required && /* @__PURE__ */ jsx7("span", { className: "text-destructive ml-1", children: "*" })
+                      ] }),
+                      /* @__PURE__ */ jsx7(
+                        Input,
+                        {
+                          id: node.attributes.name,
+                          name: node.attributes.name,
+                          type: node.attributes.type,
+                          defaultValue: node.attributes.value || "",
+                          required: node.attributes.required,
+                          placeholder: `Enter your ${node.meta.label?.text?.toLowerCase() || node.attributes.name}`
+                        }
+                      )
+                    ]
+                  },
+                  node.meta.label?.id || node.attributes.name
+                );
+              }
+            }
+            return null;
+          }),
+          !hasSubmitButton && !oidcNodes.length && /* @__PURE__ */ jsx7(Button, { type: "submit", className: "w-full", children: "Submit" })
+        ] })
+      ] })
     ] })
-  ] }) }) });
+  ] });
 }
 
 // src/tenant-switcher/index.tsx
-import * as React6 from "react";
+import * as React8 from "react";
 
 // src/components/ui/select.tsx
-import * as React5 from "react";
+import * as React7 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { Check, ChevronDown, ChevronUp } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs2 } from "react/jsx-runtime";
 var Select = SelectPrimitive.Root;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React5.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(
+var SelectTrigger = React7.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -271,12 +431,12 @@ var SelectTrigger = React5.forwardRef(({ className, children, ...props }, ref) =
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx6(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx6(ChevronDown, { className: "h-4 w-4 opacity-50" }) })
+      /* @__PURE__ */ jsx8(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx8(ChevronDown, { className: "h-4 w-4 opacity-50" }) })
     ]
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+var SelectScrollUpButton = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -285,11 +445,11 @@ var SelectScrollUpButton = React5.forwardRef(({ className, ...props }, ref) => /
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx6(ChevronUp, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx8(ChevronUp, { className: "h-4 w-4" })
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+var SelectScrollDownButton = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -298,11 +458,11 @@ var SelectScrollDownButton = React5.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx6(ChevronDown, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx8(ChevronDown, { className: "h-4 w-4" })
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React5.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx6(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
+var SelectContent = React7.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx8(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs2(
   SelectPrimitive.Content,
   {
     ref,
@@ -314,8 +474,8 @@ var SelectContent = React5.forwardRef(({ className, children, position = "popper
     position,
     ...props,
     children: [
-      /* @__PURE__ */ jsx6(SelectScrollUpButton, {}),
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx8(SelectScrollUpButton, {}),
+      /* @__PURE__ */ jsx8(
         SelectPrimitive.Viewport,
         {
           className: cn(
@@ -325,12 +485,12 @@ var SelectContent = React5.forwardRef(({ className, children, position = "popper
           children
         }
       ),
-      /* @__PURE__ */ jsx6(SelectScrollDownButton, {})
+      /* @__PURE__ */ jsx8(SelectScrollDownButton, {})
     ]
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+var SelectLabel = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   SelectPrimitive.Label,
   {
     ref,
@@ -339,7 +499,7 @@ var SelectLabel = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React5.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(
+var SelectItem = React7.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs2(
   SelectPrimitive.Item,
   {
     ref,
@@ -349,13 +509,13 @@ var SelectItem = React5.forwardRef(({ className, children, ...props }, ref) => /
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx6("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx6(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx6(Check, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ jsx6(SelectPrimitive.ItemText, { children })
+      /* @__PURE__ */ jsx8("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx8(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx8(Check, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx8(SelectPrimitive.ItemText, { children })
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx6(
+var SelectSeparator = React7.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(
   SelectPrimitive.Separator,
   {
     ref,
@@ -366,7 +526,7 @@ var SelectSeparator = React5.forwardRef(({ className, ...props }, ref) => /* @__
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 // src/tenant-switcher/index.tsx
-import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
 function SwitchActiveTenant({
   tenants,
   currentTenantId,
@@ -375,7 +535,7 @@ function SwitchActiveTenant({
   className,
   onTenantChange
 }) {
-  const [isLoading, setIsLoading] = React6.useState(false);
+  const [isLoading, setIsLoading] = React8.useState(false);
   const handleTenantChange = async (tenantId) => {
     if (tenantId === currentTenantId) return;
     setIsLoading(true);
@@ -400,17 +560,17 @@ function SwitchActiveTenant({
       onValueChange: handleTenantChange,
       disabled: isLoading,
       children: [
-        /* @__PURE__ */ jsx7(SelectTrigger, { className: cn("max-w-64", className), children: /* @__PURE__ */ jsx7(SelectValue, { placeholder, children: currentTenant ? currentTenant.name : placeholder }) }),
-        /* @__PURE__ */ jsx7(SelectContent, { children: tenants.map((tenant) => /* @__PURE__ */ jsx7(SelectItem, { value: tenant.id, children: tenant.name }, tenant.id)) })
+        /* @__PURE__ */ jsx9(SelectTrigger, { className: cn("max-w-64", className), children: /* @__PURE__ */ jsx9(SelectValue, { placeholder, children: currentTenant ? currentTenant.name : placeholder }) }),
+        /* @__PURE__ */ jsx9(SelectContent, { children: tenants.map((tenant) => /* @__PURE__ */ jsx9(SelectItem, { value: tenant.id, children: tenant.name }, tenant.id)) })
       ]
     }
   );
 }
 
 // src/pricing-table/index.tsx
-import * as React7 from "react";
+import * as React9 from "react";
 import { Check as Check2, Star, ChevronLeft, ChevronRight } from "lucide-react";
-import { Fragment, jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
 var getCurrencySymbol = (currency) => {
   const symbols = {
     USD: "$",
@@ -459,8 +619,8 @@ function PricingCard({
         isHighlighted ? "relative" : ""
       ),
       children: [
-        /* @__PURE__ */ jsx8("div", { className: "h-4 flex-shrink-0 relative", children: ui.badge && /* @__PURE__ */ jsx8("div", { className: "absolute top-0 left-1/2 transform -translate-x-1/2 z-10", children: /* @__PURE__ */ jsxs4("div", { className: "bg-primary text-primary-foreground px-3 py-1 rounded-full text-sm font-medium flex items-center gap-1 whitespace-nowrap shadow-md", children: [
-          ui.badge === "Most Popular" && /* @__PURE__ */ jsx8(Star, { className: "w-3 h-3" }),
+        /* @__PURE__ */ jsx10("div", { className: "h-4 flex-shrink-0 relative", children: ui.badge && /* @__PURE__ */ jsx10("div", { className: "absolute top-0 left-1/2 transform -translate-x-1/2 z-10", children: /* @__PURE__ */ jsxs4("div", { className: "bg-primary text-primary-foreground px-3 py-1 rounded-full text-sm font-medium flex items-center gap-1 whitespace-nowrap shadow-md", children: [
+          ui.badge === "Most Popular" && /* @__PURE__ */ jsx10(Star, { className: "w-3 h-3" }),
           ui.badge
         ] }) }) }),
         /* @__PURE__ */ jsxs4(
@@ -473,35 +633,35 @@ function PricingCard({
             ),
             children: [
               /* @__PURE__ */ jsxs4(CardHeader, { className: "text-center", children: [
-                /* @__PURE__ */ jsx8(CardTitle, { className: "text-xl font-bold", children: ui.display_name || product.name }),
-                ui.tagline && /* @__PURE__ */ jsx8(CardDescription, { className: "text-base", children: ui.tagline })
+                /* @__PURE__ */ jsx10(CardTitle, { className: "text-xl font-bold", children: ui.display_name || product.name }),
+                ui.tagline && /* @__PURE__ */ jsx10(CardDescription, { className: "text-base", children: ui.tagline })
               ] }),
               /* @__PURE__ */ jsxs4(CardContent, { className: "flex-1 space-y-6", children: [
                 /* @__PURE__ */ jsxs4("div", { className: "text-center", children: [
-                  /* @__PURE__ */ jsx8("div", { className: "text-3xl font-bold", children: formatPrice(displayedPrice) }),
-                  /* @__PURE__ */ jsx8("div", { className: "text-sm text-muted-foreground", children: formatBillingPeriod(displayedPrice) })
+                  /* @__PURE__ */ jsx10("div", { className: "text-3xl font-bold", children: formatPrice(displayedPrice) }),
+                  /* @__PURE__ */ jsx10("div", { className: "text-sm text-muted-foreground", children: formatBillingPeriod(displayedPrice) })
                 ] }),
                 (ui.features && ui.features.length > 0 || displayedPrice.ui?.features?.length > 0 || displayedPrice.ui?.limits?.length > 0) && /* @__PURE__ */ jsxs4("div", { className: "space-y-4", children: [
                   ui.features && ui.features.length > 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-2", children: [
-                    /* @__PURE__ */ jsx8("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "Features" }),
-                    /* @__PURE__ */ jsx8("ul", { className: "space-y-2", children: ui.features.map((feature, index) => /* @__PURE__ */ jsxs4("li", { className: "flex items-start gap-2", children: [
-                      /* @__PURE__ */ jsx8(Check2, { className: "w-4 h-4 text-green-500 mt-0.5 flex-shrink-0" }),
-                      /* @__PURE__ */ jsx8("span", { className: "text-sm", children: feature })
+                    /* @__PURE__ */ jsx10("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "Features" }),
+                    /* @__PURE__ */ jsx10("ul", { className: "space-y-2", children: ui.features.map((feature, index) => /* @__PURE__ */ jsxs4("li", { className: "flex items-start gap-2", children: [
+                      /* @__PURE__ */ jsx10(Check2, { className: "w-4 h-4 text-green-500 mt-0.5 flex-shrink-0" }),
+                      /* @__PURE__ */ jsx10("span", { className: "text-sm", children: feature })
                     ] }, index)) })
                   ] }),
                   displayedPrice.ui?.features && displayedPrice.ui.features.length > 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-2", children: [
-                    /* @__PURE__ */ jsx8("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "This Plan" }),
-                    /* @__PURE__ */ jsx8("ul", { className: "space-y-2", children: displayedPrice.ui.features.map(
+                    /* @__PURE__ */ jsx10("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "This Plan" }),
+                    /* @__PURE__ */ jsx10("ul", { className: "space-y-2", children: displayedPrice.ui.features.map(
                       (feature, index) => /* @__PURE__ */ jsxs4("li", { className: "flex items-start gap-2", children: [
-                        /* @__PURE__ */ jsx8(Check2, { className: "w-4 h-4 text-blue-500 mt-0.5 flex-shrink-0" }),
-                        /* @__PURE__ */ jsx8("span", { className: "text-sm", children: feature })
+                        /* @__PURE__ */ jsx10(Check2, { className: "w-4 h-4 text-blue-500 mt-0.5 flex-shrink-0" }),
+                        /* @__PURE__ */ jsx10("span", { className: "text-sm", children: feature })
                       ] }, index)
                     ) })
                   ] }),
                   displayedPrice.ui?.limits && displayedPrice.ui.limits.length > 0 && /* @__PURE__ */ jsxs4("div", { className: "space-y-2", children: [
-                    /* @__PURE__ */ jsx8("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "Usage Limits" }),
-                    /* @__PURE__ */ jsx8("ul", { className: "space-y-1", children: displayedPrice.ui.limits.map(
-                      (limit, index) => /* @__PURE__ */ jsx8(
+                    /* @__PURE__ */ jsx10("h4", { className: "font-medium text-sm text-muted-foreground uppercase tracking-wide", children: "Usage Limits" }),
+                    /* @__PURE__ */ jsx10("ul", { className: "space-y-1", children: displayedPrice.ui.limits.map(
+                      (limit, index) => /* @__PURE__ */ jsx10(
                         "li",
                         {
                           className: "text-sm text-muted-foreground",
@@ -513,7 +673,7 @@ function PricingCard({
                   ] })
                 ] })
               ] }),
-              /* @__PURE__ */ jsx8(CardFooter, { children: /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx10(CardFooter, { children: /* @__PURE__ */ jsx10(
                 Button,
                 {
                   className: "w-full",
@@ -540,15 +700,15 @@ function PricingTable({
   showPricingToggle = false,
   defaultInterval = "month"
 }) {
-  const [selectedInterval, setSelectedInterval] = React7.useState(defaultInterval);
-  const [carouselIndex, setCarouselIndex] = React7.useState(0);
-  const sortedProducts = React7.useMemo(
+  const [selectedInterval, setSelectedInterval] = React9.useState(defaultInterval);
+  const [carouselIndex, setCarouselIndex] = React9.useState(0);
+  const sortedProducts = React9.useMemo(
     () => [...products].sort(
       (a, b) => (a.ui?.sort_order ?? 999) - (b.ui?.sort_order ?? 999)
     ),
     [products]
   );
-  const hasMultipleIntervals = React7.useMemo(
+  const hasMultipleIntervals = React9.useMemo(
     () => products.some(
       (p) => new Set(p.prices.map((price) => price.interval)).size > 1
     ),
@@ -557,7 +717,7 @@ function PricingTable({
   const getDisplayedPrice = (product) => product.prices.find((p) => p.interval === selectedInterval) || product.prices[0];
   const renderCard = (product) => {
     const displayedPrice = getDisplayedPrice(product);
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx10(
       PricingCard,
       {
         product,
@@ -568,7 +728,7 @@ function PricingTable({
     );
   };
   const desktopCarousel = /* @__PURE__ */ jsxs4("div", { className: "relative max-w-7xl mx-auto", children: [
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx10(
       Button,
       {
         variant: "ghost",
@@ -576,15 +736,15 @@ function PricingTable({
         className: "absolute left-0 top-1/2 transform -translate-y-1/2 -translate-x-4 z-10 bg-white shadow-lg border hover:bg-gray-50 disabled:opacity-50",
         onClick: () => setCarouselIndex(Math.max(0, carouselIndex - 1)),
         disabled: carouselIndex === 0,
-        children: /* @__PURE__ */ jsx8(ChevronLeft, { className: "w-4 h-4" })
+        children: /* @__PURE__ */ jsx10(ChevronLeft, { className: "w-4 h-4" })
       }
     ),
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx10(
       "div",
       {
         className: "overflow-hidden mx-auto",
         style: { width: `${3 * CARD_WIDTH + 2 * GAP}px` },
-        children: /* @__PURE__ */ jsx8(
+        children: /* @__PURE__ */ jsx10(
           "div",
           {
             className: "flex items-stretch transition-transform duration-300 ease-in-out",
@@ -592,7 +752,7 @@ function PricingTable({
               transform: `translateX(-${carouselIndex * (CARD_WIDTH + GAP)}px)`,
               gap: `${GAP}px`
             },
-            children: sortedProducts.map((p) => /* @__PURE__ */ jsx8(
+            children: sortedProducts.map((p) => /* @__PURE__ */ jsx10(
               "div",
               {
                 style: { width: `${CARD_WIDTH}px` },
@@ -605,7 +765,7 @@ function PricingTable({
         )
       }
     ),
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx10(
       Button,
       {
         variant: "ghost",
@@ -615,12 +775,12 @@ function PricingTable({
           Math.min(sortedProducts.length - 3, carouselIndex + 1)
         ),
         disabled: carouselIndex >= sortedProducts.length - 3,
-        children: /* @__PURE__ */ jsx8(ChevronRight, { className: "w-4 h-4" })
+        children: /* @__PURE__ */ jsx10(ChevronRight, { className: "w-4 h-4" })
       }
     ),
-    /* @__PURE__ */ jsx8("div", { className: "flex justify-center mt-6 space-x-2", children: Array.from(
+    /* @__PURE__ */ jsx10("div", { className: "flex justify-center mt-6 space-x-2", children: Array.from(
       { length: Math.max(1, sortedProducts.length - 2) },
-      (_, i) => /* @__PURE__ */ jsx8(
+      (_, i) => /* @__PURE__ */ jsx10(
         "button",
         {
           onClick: () => setCarouselIndex(i),
@@ -634,12 +794,12 @@ function PricingTable({
       )
     ) })
   ] });
-  const staticLayout = /* @__PURE__ */ jsx8(
+  const staticLayout = /* @__PURE__ */ jsx10(
     "div",
     {
       className: "flex flex-row items-stretch justify-center",
       style: { gap: `${GAP}px` },
-      children: sortedProducts.map((p) => /* @__PURE__ */ jsx8(
+      children: sortedProducts.map((p) => /* @__PURE__ */ jsx10(
         "div",
         {
           style: { width: `${CARD_WIDTH}px` },
@@ -651,8 +811,8 @@ function PricingTable({
     }
   );
   return /* @__PURE__ */ jsxs4("div", { className: cn("w-full", className), children: [
-    showPricingToggle && hasMultipleIntervals && /* @__PURE__ */ jsx8("div", { className: "flex justify-center mb-4", children: /* @__PURE__ */ jsxs4("div", { className: "flex bg-gray-100 p-1 rounded-lg", children: [
-      /* @__PURE__ */ jsx8(
+    showPricingToggle && hasMultipleIntervals && /* @__PURE__ */ jsx10("div", { className: "flex justify-center mb-4", children: /* @__PURE__ */ jsxs4("div", { className: "flex bg-gray-100 p-1 rounded-lg", children: [
+      /* @__PURE__ */ jsx10(
         Button,
         {
           variant: selectedInterval === "month" ? "default" : "ghost",
@@ -662,7 +822,7 @@ function PricingTable({
           children: "Monthly"
         }
       ),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx10(
         Button,
         {
           variant: selectedInterval === "year" ? "default" : "ghost",
@@ -674,19 +834,19 @@ function PricingTable({
       )
     ] }) }),
     /* @__PURE__ */ jsxs4("div", { className: "lg:hidden relative", children: [
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx10(
         "div",
         {
           className: "overflow-hidden mx-auto",
           style: { width: `${CARD_WIDTH}px` },
-          children: /* @__PURE__ */ jsx8(
+          children: /* @__PURE__ */ jsx10(
             "div",
             {
               className: "flex transition-transform duration-300 ease-in-out items-stretch",
               style: {
                 transform: `translateX(-${carouselIndex * CARD_WIDTH}px)`
               },
-              children: sortedProducts.map((product) => /* @__PURE__ */ jsx8(
+              children: sortedProducts.map((product) => /* @__PURE__ */ jsx10(
                 "div",
                 {
                   className: "flex-shrink-0",
@@ -700,7 +860,7 @@ function PricingTable({
         }
       ),
       sortedProducts.length > 1 && /* @__PURE__ */ jsxs4(Fragment, { children: [
-        /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx10(
           Button,
           {
             variant: "ghost",
@@ -708,10 +868,10 @@ function PricingTable({
             className: "absolute left-0 top-1/2 -translate-y-1/2 -translate-x-2 z-10 bg-white shadow-lg border hover:bg-gray-50 disabled:opacity-50",
             onClick: () => setCarouselIndex((prev) => Math.max(0, prev - 1)),
             disabled: carouselIndex === 0,
-            children: /* @__PURE__ */ jsx8(ChevronLeft, { className: "w-5 h-5" })
+            children: /* @__PURE__ */ jsx10(ChevronLeft, { className: "w-5 h-5" })
           }
         ),
-        /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx10(
           Button,
           {
             variant: "ghost",
@@ -721,10 +881,10 @@ function PricingTable({
               (prev) => Math.min(sortedProducts.length - 1, prev + 1)
             ),
             disabled: carouselIndex >= sortedProducts.length - 1,
-            children: /* @__PURE__ */ jsx8(ChevronRight, { className: "w-5 h-5" })
+            children: /* @__PURE__ */ jsx10(ChevronRight, { className: "w-5 h-5" })
           }
         ),
-        /* @__PURE__ */ jsx8("div", { className: "flex justify-center mt-6 space-x-2", children: Array.from({ length: sortedProducts.length }, (_, i) => /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx10("div", { className: "flex justify-center mt-6 space-x-2", children: Array.from({ length: sortedProducts.length }, (_, i) => /* @__PURE__ */ jsx10(
           "button",
           {
             onClick: () => setCarouselIndex(i),
@@ -738,7 +898,7 @@ function PricingTable({
         )) })
       ] })
     ] }),
-    /* @__PURE__ */ jsx8("div", { className: "hidden lg:block", children: sortedProducts.length <= 3 ? staticLayout : desktopCarousel })
+    /* @__PURE__ */ jsx10("div", { className: "hidden lg:block", children: sortedProducts.length <= 3 ? staticLayout : desktopCarousel })
   ] });
 }
 export {