@omnibase/shadcn 0.3.0 → 0.4.1

package/dist/index.cjs

@@ -32,7 +32,8 @@ var index_exports = {};
 __export(index_exports, {
   CustomFlowForm: () => CustomFlowForm,
   PricingTable: () => PricingTable,
-  SwitchActiveTenant: () => SwitchActiveTenant
+  SwitchActiveTenant: () => SwitchActiveTenant,
+  TenantCreator: () => TenantCreator
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -939,9 +940,169 @@ function PricingTable({
     /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "hidden lg:block", children: sortedProducts.length <= 3 ? staticLayout : desktopCarousel })
   ] });
 }
+
+// src/tenant-creator/index.tsx
+var import_react = require("react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function TenantCreator({
+  config = {},
+  formActions = {},
+  className
+}) {
+  const [mode, setMode] = (0, import_react.useState)(
+    config.defaultMode || "create"
+  );
+  const [isLoading, setIsLoading] = (0, import_react.useState)(false);
+  const [organizationName, setOrganizationName] = (0, import_react.useState)(
+    config.createForm?.organizationName?.defaultValue || ""
+  );
+  const [billingEmail, setBillingEmail] = (0, import_react.useState)(
+    config.createForm?.billingEmail?.defaultValue || ""
+  );
+  const [token, setToken] = (0, import_react.useState)(
+    config.joinForm?.token?.defaultValue || ""
+  );
+  const handleCreateSubmit = async (e) => {
+    e.preventDefault();
+    if (!formActions.onCreateOrganization) return;
+    setIsLoading(true);
+    try {
+      await formActions.onCreateOrganization({
+        organizationName,
+        billingEmail
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const handleJoinSubmit = async (e) => {
+    e.preventDefault();
+    if (!formActions.onJoinOrganization) return;
+    setIsLoading(true);
+    try {
+      await formActions.onJoinOrganization({
+        token
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Card, { className: cn("w-full max-w-md mx-auto", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(CardHeader, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CardTitle, { children: "Organization Setup" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CardDescription, { children: "Choose how you want to get started with your organization." })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(CardContent, { className: "space-y-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "grid grid-cols-2 rounded-lg bg-muted p-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+          "label",
+          {
+            className: cn(
+              "flex cursor-pointer items-center justify-center rounded-md px-3 py-2 text-sm font-medium transition-all",
+              mode === "create" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground",
+              isLoading && "pointer-events-none opacity-50"
+            ),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                "input",
+                {
+                  type: "radio",
+                  name: "mode",
+                  value: "create",
+                  checked: mode === "create",
+                  onChange: () => setMode("create"),
+                  className: "sr-only",
+                  disabled: isLoading
+                }
+              ),
+              config.createOrganizationText || "Create Organization"
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+          "label",
+          {
+            className: cn(
+              "flex cursor-pointer items-center justify-center rounded-md px-3 py-2 text-sm font-medium transition-all",
+              mode === "join" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground",
+              isLoading && "pointer-events-none opacity-50"
+            ),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                "input",
+                {
+                  type: "radio",
+                  name: "mode",
+                  value: "join",
+                  checked: mode === "join",
+                  onChange: () => setMode("join"),
+                  className: "sr-only",
+                  disabled: isLoading
+                }
+              ),
+              config.joinOrganizationText || "Join Organization"
+            ]
+          }
+        )
+      ] }),
+      mode === "create" && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("form", { onSubmit: handleCreateSubmit, className: "space-y-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Label, { htmlFor: "organizationName", children: config.createForm?.organizationName?.label || "Organization Name" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            Input,
+            {
+              id: "organizationName",
+              type: "text",
+              placeholder: config.createForm?.organizationName?.placeholder || "Enter organization name",
+              value: organizationName,
+              onChange: (e) => setOrganizationName(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Label, { htmlFor: "billingEmail", children: config.createForm?.billingEmail?.label || "Billing Email" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            Input,
+            {
+              id: "billingEmail",
+              type: "email",
+              placeholder: config.createForm?.billingEmail?.placeholder || "Enter billing email",
+              value: billingEmail,
+              onChange: (e) => setBillingEmail(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Creating..." : "Create Organization" })
+      ] }),
+      mode === "join" && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("form", { onSubmit: handleJoinSubmit, className: "space-y-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Label, { htmlFor: "token", children: config.joinForm?.token?.label || "Invitation Token" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            Input,
+            {
+              id: "token",
+              type: "text",
+              placeholder: config.joinForm?.token?.placeholder || "Enter invitation token",
+              value: token,
+              onChange: (e) => setToken(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Joining..." : "Join Organization" })
+      ] })
+    ] })
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CustomFlowForm,
   PricingTable,
-  SwitchActiveTenant
+  SwitchActiveTenant,
+  TenantCreator
 });

package/dist/index.d.cts

@@ -49,4 +49,44 @@ interface PricingTableProps {
 }
 declare function PricingTable({ products, selectedPriceId, onPriceSelect, className, showPricingToggle, defaultInterval, }: PricingTableProps): react_jsx_runtime.JSX.Element;
 
-export { CustomFlowForm, type CustomFormProps, type FlowType, PricingTable, type PricingTableProps, SwitchActiveTenant, type SwitchActiveTenantProps };
+interface TenantCreatorConfig {
+    createOrganizationText?: string;
+    joinOrganizationText?: string;
+    defaultMode?: "create" | "join";
+    createForm?: {
+        organizationName?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+        billingEmail?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+    };
+    joinForm?: {
+        token?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+    };
+}
+interface TenantCreatorFormActions {
+    onCreateOrganization?: (data: {
+        organizationName: string;
+        billingEmail: string;
+    }) => void | Promise<void>;
+    onJoinOrganization?: (data: {
+        token: string;
+    }) => void | Promise<void>;
+}
+interface TenantCreatorProps {
+    config?: TenantCreatorConfig;
+    formActions?: TenantCreatorFormActions;
+    className?: string;
+}
+declare function TenantCreator({ config, formActions, className, }: TenantCreatorProps): react_jsx_runtime.JSX.Element;
+
+export { CustomFlowForm, type CustomFormProps, type FlowType, PricingTable, type PricingTableProps, SwitchActiveTenant, type SwitchActiveTenantProps, TenantCreator, type TenantCreatorConfig, type TenantCreatorFormActions, type TenantCreatorProps };

package/dist/index.d.ts

@@ -49,4 +49,44 @@ interface PricingTableProps {
 }
 declare function PricingTable({ products, selectedPriceId, onPriceSelect, className, showPricingToggle, defaultInterval, }: PricingTableProps): react_jsx_runtime.JSX.Element;
 
-export { CustomFlowForm, type CustomFormProps, type FlowType, PricingTable, type PricingTableProps, SwitchActiveTenant, type SwitchActiveTenantProps };
+interface TenantCreatorConfig {
+    createOrganizationText?: string;
+    joinOrganizationText?: string;
+    defaultMode?: "create" | "join";
+    createForm?: {
+        organizationName?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+        billingEmail?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+    };
+    joinForm?: {
+        token?: {
+            label?: string;
+            placeholder?: string;
+            defaultValue?: string;
+        };
+    };
+}
+interface TenantCreatorFormActions {
+    onCreateOrganization?: (data: {
+        organizationName: string;
+        billingEmail: string;
+    }) => void | Promise<void>;
+    onJoinOrganization?: (data: {
+        token: string;
+    }) => void | Promise<void>;
+}
+interface TenantCreatorProps {
+    config?: TenantCreatorConfig;
+    formActions?: TenantCreatorFormActions;
+    className?: string;
+}
+declare function TenantCreator({ config, formActions, className, }: TenantCreatorProps): react_jsx_runtime.JSX.Element;
+
+export { CustomFlowForm, type CustomFormProps, type FlowType, PricingTable, type PricingTableProps, SwitchActiveTenant, type SwitchActiveTenantProps, TenantCreator, type TenantCreatorConfig, type TenantCreatorFormActions, type TenantCreatorProps };

package/dist/index.js

@@ -901,8 +901,168 @@ function PricingTable({
     /* @__PURE__ */ jsx10("div", { className: "hidden lg:block", children: sortedProducts.length <= 3 ? staticLayout : desktopCarousel })
   ] });
 }
+
+// src/tenant-creator/index.tsx
+import { useState as useState3 } from "react";
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+function TenantCreator({
+  config = {},
+  formActions = {},
+  className
+}) {
+  const [mode, setMode] = useState3(
+    config.defaultMode || "create"
+  );
+  const [isLoading, setIsLoading] = useState3(false);
+  const [organizationName, setOrganizationName] = useState3(
+    config.createForm?.organizationName?.defaultValue || ""
+  );
+  const [billingEmail, setBillingEmail] = useState3(
+    config.createForm?.billingEmail?.defaultValue || ""
+  );
+  const [token, setToken] = useState3(
+    config.joinForm?.token?.defaultValue || ""
+  );
+  const handleCreateSubmit = async (e) => {
+    e.preventDefault();
+    if (!formActions.onCreateOrganization) return;
+    setIsLoading(true);
+    try {
+      await formActions.onCreateOrganization({
+        organizationName,
+        billingEmail
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const handleJoinSubmit = async (e) => {
+    e.preventDefault();
+    if (!formActions.onJoinOrganization) return;
+    setIsLoading(true);
+    try {
+      await formActions.onJoinOrganization({
+        token
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs5(Card, { className: cn("w-full max-w-md mx-auto", className), children: [
+    /* @__PURE__ */ jsxs5(CardHeader, { children: [
+      /* @__PURE__ */ jsx11(CardTitle, { children: "Organization Setup" }),
+      /* @__PURE__ */ jsx11(CardDescription, { children: "Choose how you want to get started with your organization." })
+    ] }),
+    /* @__PURE__ */ jsxs5(CardContent, { className: "space-y-6", children: [
+      /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-2 rounded-lg bg-muted p-1", children: [
+        /* @__PURE__ */ jsxs5(
+          "label",
+          {
+            className: cn(
+              "flex cursor-pointer items-center justify-center rounded-md px-3 py-2 text-sm font-medium transition-all",
+              mode === "create" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground",
+              isLoading && "pointer-events-none opacity-50"
+            ),
+            children: [
+              /* @__PURE__ */ jsx11(
+                "input",
+                {
+                  type: "radio",
+                  name: "mode",
+                  value: "create",
+                  checked: mode === "create",
+                  onChange: () => setMode("create"),
+                  className: "sr-only",
+                  disabled: isLoading
+                }
+              ),
+              config.createOrganizationText || "Create Organization"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs5(
+          "label",
+          {
+            className: cn(
+              "flex cursor-pointer items-center justify-center rounded-md px-3 py-2 text-sm font-medium transition-all",
+              mode === "join" ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground",
+              isLoading && "pointer-events-none opacity-50"
+            ),
+            children: [
+              /* @__PURE__ */ jsx11(
+                "input",
+                {
+                  type: "radio",
+                  name: "mode",
+                  value: "join",
+                  checked: mode === "join",
+                  onChange: () => setMode("join"),
+                  className: "sr-only",
+                  disabled: isLoading
+                }
+              ),
+              config.joinOrganizationText || "Join Organization"
+            ]
+          }
+        )
+      ] }),
+      mode === "create" && /* @__PURE__ */ jsxs5("form", { onSubmit: handleCreateSubmit, className: "space-y-4", children: [
+        /* @__PURE__ */ jsxs5("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx11(Label, { htmlFor: "organizationName", children: config.createForm?.organizationName?.label || "Organization Name" }),
+          /* @__PURE__ */ jsx11(
+            Input,
+            {
+              id: "organizationName",
+              type: "text",
+              placeholder: config.createForm?.organizationName?.placeholder || "Enter organization name",
+              value: organizationName,
+              onChange: (e) => setOrganizationName(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs5("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx11(Label, { htmlFor: "billingEmail", children: config.createForm?.billingEmail?.label || "Billing Email" }),
+          /* @__PURE__ */ jsx11(
+            Input,
+            {
+              id: "billingEmail",
+              type: "email",
+              placeholder: config.createForm?.billingEmail?.placeholder || "Enter billing email",
+              value: billingEmail,
+              onChange: (e) => setBillingEmail(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx11(Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Creating..." : "Create Organization" })
+      ] }),
+      mode === "join" && /* @__PURE__ */ jsxs5("form", { onSubmit: handleJoinSubmit, className: "space-y-4", children: [
+        /* @__PURE__ */ jsxs5("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx11(Label, { htmlFor: "token", children: config.joinForm?.token?.label || "Invitation Token" }),
+          /* @__PURE__ */ jsx11(
+            Input,
+            {
+              id: "token",
+              type: "text",
+              placeholder: config.joinForm?.token?.placeholder || "Enter invitation token",
+              value: token,
+              onChange: (e) => setToken(e.target.value),
+              required: true,
+              disabled: isLoading
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx11(Button, { type: "submit", className: "w-full", disabled: isLoading, children: isLoading ? "Joining..." : "Join Organization" })
+      ] })
+    ] })
+  ] });
+}
 export {
   CustomFlowForm,
   PricingTable,
-  SwitchActiveTenant
+  SwitchActiveTenant,
+  TenantCreator
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omnibase/shadcn",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "description": "OmniBase ShadCN UI Package",
   "type": "module",
   "exports": {