@lessly/ui 0.22.0 → 0.24.0

package/dist/index.d.ts

@@ -1473,6 +1473,98 @@ declare const NotificationToaster: React$1.ForwardRefExoticComponent<Notificatio
  */
 declare const COUNTRY_OPTIONS: SelectOption[];
 
+interface BetaGateScreenProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'title' | 'onSubmit'> {
+    /** Fires with the trimmed code. The screen never checks it — the caller does. */
+    onSubmit: (code: string) => void;
+    defaultCode?: string;
+    /** Fires with the raw field value on every keystroke — the seam a caller uses to clear
+     *  its own `error` as the user starts correcting the code. */
+    onCodeChange?: (code: string) => void;
+    /** Focuses the access-code field on mount. On by default: the screen is one field, so
+     *  that is where the caret belongs. Pass `false` to leave the focus alone. */
+    autoFocus?: boolean;
+    /** Disables the submit button and swaps its label while the caller's check is in flight. */
+    submitting?: boolean;
+    /** Rendered as an alert above the field — typically a rejected code. */
+    error?: string | null;
+    /** Social sign-in buttons, rendered above an "or" divider. Without it there is no divider. */
+    socialAuth?: React$1.ReactNode;
+    /** Target of the waitlist link in the default description. */
+    waitlistHref?: string;
+    /** Renders "Already have an account? Sign in" as a link. */
+    signInHref?: string;
+    /** Renders the same affordance as a button. Ignored when `signInHref` is given. */
+    onSignIn?: () => void;
+    submitLabel?: React$1.ReactNode;
+    /** Brand mark above the headline. */
+    logo?: React$1.ReactNode;
+    /** Rendered top-right. Defaults to the kit's own `ThemeToggle`; pass your own node to
+     *  replace it, or `null` to drop it. */
+    themeToggle?: React$1.ReactNode;
+    /** Pass `null` to render no page heading — same meaning as on `SignupScreen`. */
+    title?: React$1.ReactNode;
+    description?: React$1.ReactNode;
+    /** Muted footer signature. Absent by default; pass a node to render one. */
+    footer?: React$1.ReactNode;
+}
+/**
+ * The gate in front of registration while the product is in closed beta: a single access
+ * code, optionally preceded by social sign-in. Presentational and self-contained — it never
+ * validates the code, never calls an API and never navigates; the caller handles the
+ * outcome of `onSubmit`.
+ */
+declare function BetaGateScreen({ onSubmit, defaultCode, onCodeChange, autoFocus, submitting, error, socialAuth, waitlistHref, signInHref, onSignIn, submitLabel, logo, themeToggle, title, description, footer, ...props }: BetaGateScreenProps): React$1.JSX.Element;
+
+/** The submit payload — what a registration endpoint takes, minus anything the caller owns
+ *  (the beta code, the invite, the return URL). */
+interface SignupScreenSubmit {
+    name: string;
+    email: string;
+    password: string;
+}
+interface SignupScreenProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'title' | 'onSubmit'> {
+    onSubmit: (payload: SignupScreenSubmit) => void;
+    defaultValues?: Partial<SignupScreenSubmit>;
+    /** Disables the submit button and swaps its label while the caller's request is in flight. */
+    submitting?: boolean;
+    serverError?: string | null;
+    /** Field-level messages returned alongside a server error. */
+    violations?: string[];
+    /** Social sign-in buttons, rendered above an "or continue with email" divider. Not shown
+     *  when `children` take over the body. */
+    socialAuth?: React$1.ReactNode;
+    /** Renders "Use a different code" under the form — the way back to the beta gate. */
+    onEditCode?: () => void;
+    /** Renders "Already have an account? Sign in" as a link. */
+    signInHref?: string;
+    /** Renders the same affordance as a button. Ignored when `signInHref` is given. */
+    onSignIn?: () => void;
+    submitLabel?: React$1.ReactNode;
+    /**
+     * Replaces the whole body — social auth, divider, register form and all. This is the seam
+     * the consumer uses to host steps the kit deliberately does not know about (MFA challenge,
+     * TOTP enrolment) inside the same window.
+     */
+    children?: React$1.ReactNode;
+    /** Brand mark above the headline. */
+    logo?: React$1.ReactNode;
+    /** Rendered top-right. Defaults to the kit's own `ThemeToggle`; pass your own node to
+     *  replace it, or `null` to drop it. */
+    themeToggle?: React$1.ReactNode;
+    /** Pass `null` to render no page heading — for a body (MFA steps) that brings its own. */
+    title?: React$1.ReactNode;
+    description?: React$1.ReactNode;
+    /** Muted footer signature. Absent by default; pass a node to render one. */
+    footer?: React$1.ReactNode;
+}
+/**
+ * The registration window: social sign-in, then name / email / password. Presentational and
+ * self-contained — it never calls an API and never navigates; the caller handles the outcome
+ * of `onSubmit`. Password rules are checked here because they are the same rules the
+ * registration endpoint enforces, and failing them client-side saves a round trip.
+ */
+declare function SignupScreen({ onSubmit, defaultValues, submitting, serverError, violations, socialAuth, onEditCode, signInHref, onSignIn, submitLabel, children, logo, themeToggle, title, description, footer, ...props }: SignupScreenProps): React$1.JSX.Element;
+
 /** One beneficial owner, in the shape the organization API takes it. */
 interface BeneficialOwnerPayload {
     name: string;
@@ -1622,4 +1714,4 @@ interface ProductCreateScreenProps extends Omit<React$1.HTMLAttributes<HTMLDivEl
  */
 declare function ProductCreateScreen({ organizationName: _organizationName, organizations, selectedOrganizationId, onOrganizationChange, productsLoading, onSubmit, defaultName, submitting, serverError, existingProducts, onOpenProduct, existingProductsLabel, submitLabel, onCancel, logo, themeToggle, title, description, footer, ...props }: ProductCreateScreenProps): React$1.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, type AppShellProps, AppSidebar, type AppSidebarProps, AspectRatio, AuthenticatedLayout, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BeneficialOwnerPayload, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, COUNTRY_OPTIONS, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, type CarouselContextProps, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Code, CodeBlock, type CodeBlockProps, type CodeLang, type CodeProps, Col, type ColProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ConfirmDialog, type ConfirmDialogProps, type ConnectionAuth, ConnectionCard, type ConnectionCardProps, type ConnectionScope, type ConnectionStatus, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, type CopyButtonProps, type CreateProductSubmit, CreateProductWindow, type CreateProductWindowOrganization, type CreateProductWindowProduct, type CreateProductWindowProps, DatePicker, type DatePickerProps, type DeltaDirection, type DeltaTone, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DocsLink, type DocsLinkProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, ExtensionIcon, type ExtensionIconProps, ExtensionLink, type ExtensionLinkProps, type ExtensionLinkUiMode, FeedbackButton, type FeedbackButtonLabels, type FeedbackButtonProps, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, GridOverlay, type GridOverlayProps, type GridProps, HoverCard, HoverCardContent, HoverCardTrigger, InlineError, type InlineErrorProps, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MenuDivider, MenuPopup, type MenuPopupProps, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, type NavItem, type NavLinkComponent, NavRow, type NavRowProps, type NavRowVariant, NavSectionLabel, type NavSectionLabelProps, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, type NotifClass, type NotificationAction, NotificationBell, type NotificationBellProps, NotificationCenter, type NotificationCenterProps, type NotificationClass, type NotificationDeepLink, type NotificationItem, type NotificationMute, type NotificationPreferences, type NotificationProduct, NotificationSettings, type NotificationSettingsProps, type NotificationSeverity, type NotificationSubscription, type NotificationThreshold, NotificationToast, type NotificationToastDwell, type NotificationToastProps, NotificationToaster, type NotificationToasterPosition, type NotificationToasterProps, OrgProductSwitcher, type OrgProductSwitcherAction, type OrgProductSwitcherItem, type OrgProductSwitcherProps, OrganizationCreateScreen, type OrganizationCreateScreenProps, type OrganizationOnboardingDefaults, OrganizationOnboardingForm, type OrganizationOnboardingFormProps, type OrganizationOnboardingPayload, PageHeader, type PageHeaderProps, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, type PaginationLinkProps, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProductCreateScreen, type ProductCreateScreenOrganization, type ProductCreateScreenProduct, type ProductCreateScreenProps, type ProductCreateScreenSubmit, Progress, RadioGroup, RadioGroupItem, RequestRow, type RequestRowProps, type RequestState, type RequestSurface, type ResolvedTheme, type Responsive, ScrollArea, ScrollBar, SectionIntro, type SectionIntroProps, SegmentChip, type SegmentChipProps, Select, type SelectOption, type SelectProps, Separator, type Severity, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarBackHeader, type SidebarBackHeaderProps, SidebarNav, SidebarNavLink, type SidebarNavLinkProps, type SidebarNavProps, SidebarProductHeader, type SidebarProductHeaderProps, Skeleton, Slider, StatCard, type StatCardProps, StatusDot, type StatusDotProps, Switch, type SwitchProps, TOAST_DWELL, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeToggle, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UseSidebarOptions, type UseSidebarResult, UserMenu, type UserMenuItem, type UserMenuProps, type UserMenuUser, alertVariants, badgeVariants, buttonVariants, cn, formatRelativeAge, isKnownExtensionIcon, isNotificationSettled, navigationMenuTriggerStyle, segmentChipVariants, severityBadgeVariant, severityLabels, statusDotVariants, toggleVariants, useCarousel, useFormField, useIsMobile, useSidebar, useTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, type AppShellProps, AppSidebar, type AppSidebarProps, AspectRatio, AuthenticatedLayout, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, type BeneficialOwnerPayload, BetaGateScreen, type BetaGateScreenProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, type ButtonProps, COUNTRY_OPTIONS, Calendar, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, type CarouselContextProps, CarouselItem, CarouselNext, type CarouselOptions, type CarouselPlugin, CarouselPrevious, type CarouselProps, Checkbox, Code, CodeBlock, type CodeBlockProps, type CodeLang, type CodeProps, Col, type ColProps, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ConfirmDialog, type ConfirmDialogProps, type ConnectionAuth, ConnectionCard, type ConnectionCardProps, type ConnectionScope, type ConnectionStatus, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, type CopyButtonProps, type CreateProductSubmit, CreateProductWindow, type CreateProductWindowOrganization, type CreateProductWindowProduct, type CreateProductWindowProps, DatePicker, type DatePickerProps, type DeltaDirection, type DeltaTone, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DocsLink, type DocsLinkProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, ExtensionIcon, type ExtensionIconProps, ExtensionLink, type ExtensionLinkProps, type ExtensionLinkUiMode, FeedbackButton, type FeedbackButtonLabels, type FeedbackButtonProps, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, GridOverlay, type GridOverlayProps, type GridProps, HoverCard, HoverCardContent, HoverCardTrigger, InlineError, type InlineErrorProps, Input, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, type InputProps, Label, MenuDivider, MenuPopup, type MenuPopupProps, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, type NavItem, type NavLinkComponent, NavRow, type NavRowProps, type NavRowVariant, NavSectionLabel, type NavSectionLabelProps, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, type NotifClass, type NotificationAction, NotificationBell, type NotificationBellProps, NotificationCenter, type NotificationCenterProps, type NotificationClass, type NotificationDeepLink, type NotificationItem, type NotificationMute, type NotificationPreferences, type NotificationProduct, NotificationSettings, type NotificationSettingsProps, type NotificationSeverity, type NotificationSubscription, type NotificationThreshold, NotificationToast, type NotificationToastDwell, type NotificationToastProps, NotificationToaster, type NotificationToasterPosition, type NotificationToasterProps, OrgProductSwitcher, type OrgProductSwitcherAction, type OrgProductSwitcherItem, type OrgProductSwitcherProps, OrganizationCreateScreen, type OrganizationCreateScreenProps, type OrganizationOnboardingDefaults, OrganizationOnboardingForm, type OrganizationOnboardingFormProps, type OrganizationOnboardingPayload, PageHeader, type PageHeaderProps, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, type PaginationLinkProps, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, ProductCreateScreen, type ProductCreateScreenOrganization, type ProductCreateScreenProduct, type ProductCreateScreenProps, type ProductCreateScreenSubmit, Progress, RadioGroup, RadioGroupItem, RequestRow, type RequestRowProps, type RequestState, type RequestSurface, type ResolvedTheme, type Responsive, ScrollArea, ScrollBar, SectionIntro, type SectionIntroProps, SegmentChip, type SegmentChipProps, Select, type SelectOption, type SelectProps, Separator, type Severity, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SidebarBackHeader, type SidebarBackHeaderProps, SidebarNav, SidebarNavLink, type SidebarNavLinkProps, type SidebarNavProps, SidebarProductHeader, type SidebarProductHeaderProps, SignupScreen, type SignupScreenProps, type SignupScreenSubmit, Skeleton, Slider, StatCard, type StatCardProps, StatusDot, type StatusDotProps, Switch, type SwitchProps, TOAST_DWELL, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeToggle, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type UseSidebarOptions, type UseSidebarResult, UserMenu, type UserMenuItem, type UserMenuProps, type UserMenuUser, alertVariants, badgeVariants, buttonVariants, cn, formatRelativeAge, isKnownExtensionIcon, isNotificationSettled, navigationMenuTriggerStyle, segmentChipVariants, severityBadgeVariant, severityLabels, statusDotVariants, toggleVariants, useCarousel, useFormField, useIsMobile, useSidebar, useTheme };

package/dist/index.js

@@ -5207,17 +5207,354 @@ var COUNTRY_OPTIONS = [
   { value: "ZW", label: "Zimbabwe" }
 ];
 
-// src/components/organization-onboarding-form.tsx
+// src/components/beta-gate-screen.tsx
 import * as React65 from "react";
 
+// src/components/auth-divider.tsx
+import { jsx as jsx79, jsxs as jsxs45 } from "react/jsx-runtime";
+function AuthDivider({ label }) {
+  return /* @__PURE__ */ jsxs45("div", { className: "relative my-5", children: [
+    /* @__PURE__ */ jsx79("div", { className: "absolute inset-0 flex items-center", children: /* @__PURE__ */ jsx79("div", { className: "w-full border-t border-border-subtle" }) }),
+    /* @__PURE__ */ jsx79("div", { className: "relative flex justify-center text-xs", children: /* @__PURE__ */ jsx79("span", { className: "bg-bg-surface px-2 text-text-tertiary", children: label }) })
+  ] });
+}
+
 // src/lib/auth-surface.ts
 var AUTH_GLOW_BG = "radial-gradient(560px 320px at 28% 16%, var(--auth-glow-a), transparent 68%),radial-gradient(520px 340px at 78% 90%, var(--auth-glow-b), transparent 66%),var(--bg-sunken)";
 var AUTH_FILLED_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-transparent bg-text-primary px-[14px] text-[14.5px] font-semibold tracking-[-0.005em] text-bg-sunken transition-opacity hover:opacity-[0.92] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand active:translate-y-px disabled:cursor-not-allowed disabled:opacity-[0.55]";
 var AUTH_QUIET_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-border-default bg-transparent px-[14px] text-[14.5px] font-medium tracking-[-0.005em] text-text-secondary transition-colors hover:bg-bg-secondary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand";
 var AUTH_BUTTON_SHADOW = "var(--auth-btn-shadow)";
 
+// src/components/onboarding-screen-shell.tsx
+import { jsx as jsx80, jsxs as jsxs46 } from "react/jsx-runtime";
+var CARD_WIDTH = {
+  md: "max-w-[440px]",
+  lg: "max-w-[560px]"
+};
+function OnboardingScreenShell({
+  logo,
+  themeToggle = /* @__PURE__ */ jsx80(ThemeToggle, {}),
+  title,
+  description,
+  footer,
+  width = "md",
+  children,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs46(
+    "div",
+    {
+      className: cn(
+        "relative flex min-h-screen w-full flex-col items-center justify-center overflow-hidden px-6 py-12 text-text-primary",
+        className
+      ),
+      style: { background: AUTH_GLOW_BG },
+      ...props,
+      children: [
+        themeToggle && /* @__PURE__ */ jsx80("div", { className: "absolute right-6 top-6", children: themeToggle }),
+        /* @__PURE__ */ jsxs46(
+          "div",
+          {
+            className: cn(
+              "relative w-full rounded-2xl bg-bg-surface px-[34px] pb-[30px] pt-[38px] text-center",
+              CARD_WIDTH[width]
+            ),
+            style: {
+              border: "1px solid var(--auth-card-border)",
+              boxShadow: "var(--auth-card-shadow)"
+            },
+            children: [
+              logo && /* @__PURE__ */ jsx80("div", { className: "mb-[22px] flex items-center justify-center text-[24px] font-bold leading-none tracking-[-0.02em] text-text-primary", children: logo }),
+              title != null && /* @__PURE__ */ jsx80(
+                "h1",
+                {
+                  className: cn(
+                    "text-[20px] font-semibold leading-[1.25] tracking-[-0.015em] text-text-primary",
+                    // Without a description the headline itself carries the gap to the form.
+                    description ? "mb-[8px]" : "mb-[24px]"
+                  ),
+                  children: title
+                }
+              ),
+              description && /* @__PURE__ */ jsx80("p", { className: "mx-auto mb-[24px] max-w-[320px] text-[13.5px] leading-[1.5] text-text-secondary", children: description }),
+              /* @__PURE__ */ jsx80("div", { className: "text-left", children }),
+              footer != null && /* @__PURE__ */ jsx80("div", { className: "mt-[24px] text-[11px] tracking-[0.005em] text-text-tertiary", children: footer })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/beta-gate-screen.tsx
+import { Fragment as Fragment9, jsx as jsx81, jsxs as jsxs47 } from "react/jsx-runtime";
+var DEFAULT_WAITLIST_HREF = "https://lessly.com/#waitlist";
+var LINK = "font-medium text-text-link hover:text-text-link-hover";
+function BetaGateScreen({
+  onSubmit,
+  defaultCode = "",
+  onCodeChange,
+  autoFocus = true,
+  submitting,
+  error,
+  socialAuth,
+  waitlistHref = DEFAULT_WAITLIST_HREF,
+  signInHref,
+  onSignIn,
+  submitLabel = "Continue",
+  logo,
+  themeToggle,
+  title = "We're in closed beta",
+  description,
+  footer,
+  ...props
+}) {
+  const [code, setCode] = React65.useState(defaultCode);
+  const submittingRef = React65.useRef(false);
+  const trimmed = code.trim();
+  const canSubmit = trimmed !== "" && !submitting;
+  React65.useEffect(() => {
+    submittingRef.current = false;
+  }, [code, submitting, error]);
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    if (!canSubmit || submittingRef.current) return;
+    submittingRef.current = true;
+    onSubmit(trimmed);
+  };
+  const defaultDescription = /* @__PURE__ */ jsxs47(Fragment9, { children: [
+    "A beta access code is required to join. or",
+    " ",
+    /* @__PURE__ */ jsx81("a", { href: waitlistHref, className: LINK, children: "join the waitlist" }),
+    " ",
+    "to request one."
+  ] });
+  return /* @__PURE__ */ jsxs47(
+    OnboardingScreenShell,
+    {
+      logo,
+      themeToggle,
+      title,
+      description: description ?? defaultDescription,
+      footer,
+      ...props,
+      children: [
+        socialAuth && /* @__PURE__ */ jsxs47(Fragment9, { children: [
+          /* @__PURE__ */ jsx81("div", { "data-testid": "beta-gate-social-auth", children: socialAuth }),
+          /* @__PURE__ */ jsx81(AuthDivider, { label: "or" })
+        ] }),
+        error && /* @__PURE__ */ jsx81(InlineError, { "data-testid": "beta-gate-error", className: "mb-4 text-center", children: error }),
+        /* @__PURE__ */ jsxs47("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
+          /* @__PURE__ */ jsxs47("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx81(Label2, { htmlFor: "beta-code", className: "sr-only", children: "Lessly beta access code" }),
+            /* @__PURE__ */ jsx81(
+              Input,
+              {
+                id: "beta-code",
+                "data-testid": "beta-code-input",
+                value: code,
+                autoComplete: "off",
+                autoFocus,
+                placeholder: "Lessly beta access code",
+                onChange: (event) => {
+                  setCode(event.target.value);
+                  onCodeChange?.(event.target.value);
+                }
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx81("div", { className: "pt-1", children: /* @__PURE__ */ jsx81(
+            "button",
+            {
+              type: "submit",
+              "data-testid": "submit-beta-code",
+              disabled: !canSubmit,
+              className: AUTH_FILLED_BUTTON,
+              style: { boxShadow: AUTH_BUTTON_SHADOW },
+              children: submitting ? "Checking\u2026" : submitLabel
+            }
+          ) })
+        ] }),
+        (signInHref || onSignIn) && /* @__PURE__ */ jsxs47("p", { className: "mt-5 text-center text-sm text-text-secondary", children: [
+          "Already have an account?",
+          " ",
+          signInHref ? /* @__PURE__ */ jsx81("a", { "data-testid": "beta-gate-signin", href: signInHref, className: LINK, children: "Sign in" }) : /* @__PURE__ */ jsx81(
+            "button",
+            {
+              type: "button",
+              "data-testid": "beta-gate-signin",
+              onClick: onSignIn,
+              className: LINK,
+              children: "Sign in"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/signup-screen.tsx
+import * as React66 from "react";
+import { Fragment as Fragment10, jsx as jsx82, jsxs as jsxs48 } from "react/jsx-runtime";
+var LINK2 = "font-medium text-text-link hover:text-text-link-hover";
+function SignupScreen({
+  onSubmit,
+  defaultValues,
+  submitting,
+  serverError,
+  violations,
+  socialAuth,
+  onEditCode,
+  signInHref,
+  onSignIn,
+  submitLabel = "Create account",
+  children,
+  logo,
+  themeToggle,
+  title = "Create your account",
+  description,
+  footer,
+  ...props
+}) {
+  const [name, setName] = React66.useState(defaultValues?.name ?? "");
+  const [email, setEmail] = React66.useState(defaultValues?.email ?? "");
+  const [password, setPassword] = React66.useState(defaultValues?.password ?? "");
+  const [passwordError, setPasswordError] = React66.useState(null);
+  const submittingRef = React66.useRef(false);
+  const trimmedName = name.trim();
+  const trimmedEmail = email.trim();
+  const canSubmit = trimmedName !== "" && trimmedEmail !== "" && password !== "" && !submitting;
+  React66.useEffect(() => {
+    submittingRef.current = false;
+  }, [name, email, password, submitting, serverError]);
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    if (!canSubmit || submittingRef.current) return;
+    const failure = validatePassword(password);
+    if (failure) {
+      setPasswordError(failure);
+      return;
+    }
+    setPasswordError(null);
+    submittingRef.current = true;
+    onSubmit({ name: trimmedName, email: trimmedEmail, password });
+  };
+  const body = children ?? /* @__PURE__ */ jsxs48(Fragment10, { children: [
+    socialAuth && /* @__PURE__ */ jsxs48(Fragment10, { children: [
+      /* @__PURE__ */ jsx82("div", { "data-testid": "signup-social-auth", children: socialAuth }),
+      /* @__PURE__ */ jsx82(AuthDivider, { label: "or continue with email" })
+    ] }),
+    /* @__PURE__ */ jsxs48("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
+      /* @__PURE__ */ jsxs48("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx82(Label2, { htmlFor: "signup-name", children: "Full name" }),
+        /* @__PURE__ */ jsx82(
+          Input,
+          {
+            id: "signup-name",
+            "data-testid": "signup-name",
+            value: name,
+            disabled: submitting,
+            placeholder: "Jane Smith",
+            onChange: (event) => setName(event.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs48("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx82(Label2, { htmlFor: "signup-email", children: "Email" }),
+        /* @__PURE__ */ jsx82(
+          Input,
+          {
+            id: "signup-email",
+            "data-testid": "signup-email",
+            type: "email",
+            value: email,
+            disabled: submitting,
+            autoComplete: "email",
+            placeholder: "you@example.com",
+            onChange: (event) => setEmail(event.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs48("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx82(Label2, { htmlFor: "signup-password", children: "Password" }),
+        /* @__PURE__ */ jsx82(
+          Input,
+          {
+            id: "signup-password",
+            "data-testid": "signup-password",
+            type: "password",
+            value: password,
+            disabled: submitting,
+            autoComplete: "new-password",
+            placeholder: "Min 8 chars, 1 uppercase, 1 number",
+            onChange: (event) => {
+              setPassword(event.target.value);
+              if (passwordError) setPasswordError(null);
+            }
+          }
+        )
+      ] }),
+      passwordError && /* @__PURE__ */ jsx82(InlineError, { "data-testid": "signup-password-error", children: passwordError }),
+      (serverError || violations && violations.length > 0) && /* @__PURE__ */ jsxs48(InlineError, { "data-testid": "signup-error", children: [
+        serverError,
+        violations && violations.length > 0 && /* @__PURE__ */ jsx82("ul", { "data-testid": "signup-violations", className: "mt-1 list-disc pl-4", children: violations.map((violation) => /* @__PURE__ */ jsx82("li", { children: violation }, violation)) })
+      ] }),
+      /* @__PURE__ */ jsx82("div", { className: "pt-1", children: /* @__PURE__ */ jsx82(
+        "button",
+        {
+          type: "submit",
+          "data-testid": "submit-signup",
+          disabled: !canSubmit,
+          className: AUTH_FILLED_BUTTON,
+          style: { boxShadow: AUTH_BUTTON_SHADOW },
+          children: submitting ? "Creating account\u2026" : submitLabel
+        }
+      ) })
+    ] }),
+    onEditCode && /* @__PURE__ */ jsx82("p", { className: "mt-4 text-center text-sm text-text-secondary", children: /* @__PURE__ */ jsx82(
+      "button",
+      {
+        type: "button",
+        "data-testid": "signup-edit-code",
+        onClick: onEditCode,
+        className: LINK2,
+        children: "Use a different code"
+      }
+    ) })
+  ] });
+  return /* @__PURE__ */ jsxs48(
+    OnboardingScreenShell,
+    {
+      logo,
+      themeToggle,
+      title,
+      description,
+      footer,
+      ...props,
+      children: [
+        body,
+        (signInHref || onSignIn) && /* @__PURE__ */ jsxs48("p", { className: "mt-5 text-center text-sm text-text-secondary", children: [
+          "Already have an account?",
+          " ",
+          signInHref ? /* @__PURE__ */ jsx82("a", { "data-testid": "signup-signin", href: signInHref, className: LINK2, children: "Sign in" }) : /* @__PURE__ */ jsx82("button", { type: "button", "data-testid": "signup-signin", onClick: onSignIn, className: LINK2, children: "Sign in" })
+        ] })
+      ]
+    }
+  );
+}
+function validatePassword(password) {
+  if (password.length < 8) return "Password must be at least 8 characters.";
+  if (!/[A-Z]/.test(password)) return "Password must contain at least 1 uppercase letter.";
+  if (!/[0-9]/.test(password)) return "Password must contain at least 1 number.";
+  return null;
+}
+
 // src/components/organization-onboarding-form.tsx
-import { jsx as jsx79, jsxs as jsxs45 } from "react/jsx-runtime";
+import * as React67 from "react";
+import { jsx as jsx83, jsxs as jsxs49 } from "react/jsx-runtime";
 var CONTROLLER_SHARE_PCT = 50;
 var MAX_BENEFICIAL_OWNERS = 50;
 function parseShare(raw) {
@@ -5248,21 +5585,21 @@ function OrganizationOnboardingForm({
   onCancel,
   className
 }) {
-  const [name, setName] = React65.useState(defaultValues?.name ?? "");
-  const [legalName, setLegalName] = React65.useState(defaultValues?.legal_name ?? "");
-  const [ownerName, setOwnerName] = React65.useState(defaultValues?.owner_name ?? "");
-  const [countryOfIncorporation, setCountryOfIncorporation] = React65.useState(
+  const [name, setName] = React67.useState(defaultValues?.name ?? "");
+  const [legalName, setLegalName] = React67.useState(defaultValues?.legal_name ?? "");
+  const [ownerName, setOwnerName] = React67.useState(defaultValues?.owner_name ?? "");
+  const [countryOfIncorporation, setCountryOfIncorporation] = React67.useState(
     defaultValues?.country_of_incorporation ?? ""
   );
-  const [residencyCountry, setResidencyCountry] = React65.useState(
+  const [residencyCountry, setResidencyCountry] = React67.useState(
     defaultValues?.residency_country ?? ""
   );
-  const [owners, setOwners] = React65.useState(
+  const [owners, setOwners] = React67.useState(
     () => initialRows(defaultValues?.beneficial_owners)
   );
-  const [ownershipConfirmed, setOwnershipConfirmed] = React65.useState(false);
-  const nextKeyRef = React65.useRef(owners.length);
-  const submittingRef = React65.useRef(false);
+  const [ownershipConfirmed, setOwnershipConfirmed] = React67.useState(false);
+  const nextKeyRef = React67.useRef(owners.length);
+  const submittingRef = React67.useRef(false);
   const trimmed = name.trim();
   const filledOwners = owners.filter((row) => !isRowBlank(row));
   const ownerShares = filledOwners.map((row) => parseShare(row.share));
@@ -5307,7 +5644,7 @@ function OrganizationOnboardingForm({
       ...needsOwnershipConfirmation ? { ownership_confirmed: ownershipConfirmed } : {}
     });
   };
-  React65.useEffect(() => {
+  React67.useEffect(() => {
     submittingRef.current = false;
   }, [
     name,
@@ -5320,12 +5657,12 @@ function OrganizationOnboardingForm({
     submitting,
     serverError
   ]);
-  const countryField = (params) => /* @__PURE__ */ jsxs45("div", { className: "space-y-1.5", children: [
-    /* @__PURE__ */ jsxs45(Label2, { htmlFor: params.id, children: [
+  const countryField = (params) => /* @__PURE__ */ jsxs49("div", { className: "space-y-1.5", children: [
+    /* @__PURE__ */ jsxs49(Label2, { htmlFor: params.id, children: [
       params.label,
-      params.required && /* @__PURE__ */ jsx79("span", { className: "text-text-danger", children: " *" })
+      params.required && /* @__PURE__ */ jsx83("span", { className: "text-text-danger", children: " *" })
     ] }),
-    /* @__PURE__ */ jsx79(
+    /* @__PURE__ */ jsx83(
       Select,
       {
         id: params.id,
@@ -5338,10 +5675,10 @@ function OrganizationOnboardingForm({
       }
     )
   ] });
-  return /* @__PURE__ */ jsxs45("form", { onSubmit: handleSubmit, className: cn("space-y-4", className), children: [
-    /* @__PURE__ */ jsxs45("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ jsx79(Label2, { htmlFor: "create-org-name", children: "Organization name" }),
-      /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsxs49("form", { onSubmit: handleSubmit, className: cn("space-y-4", className), children: [
+    /* @__PURE__ */ jsxs49("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsx83(Label2, { htmlFor: "create-org-name", children: "Organization name" }),
+      /* @__PURE__ */ jsx83(
         Input,
         {
           id: "create-org-name",
@@ -5352,9 +5689,9 @@ function OrganizationOnboardingForm({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs45("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ jsx79(Label2, { htmlFor: "create-org-legal-name", children: "Legal name" }),
-      /* @__PURE__ */ jsx79(
+    /* @__PURE__ */ jsxs49("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsx83(Label2, { htmlFor: "create-org-legal-name", children: "Legal name" }),
+      /* @__PURE__ */ jsx83(
         Input,
         {
           id: "create-org-legal-name",
@@ -5365,9 +5702,9 @@ function OrganizationOnboardingForm({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs45("div", { className: "space-y-1.5", children: [
-      /* @__PURE__ */ jsx79(Label2, { htmlFor: "create-org-owner-name", children: "Owner name" }),
-      /* @__PURE__ */ jsx79(
+    /* @__PURE__ */ jsxs49("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsx83(Label2, { htmlFor: "create-org-owner-name", children: "Owner name" }),
+      /* @__PURE__ */ jsx83(
         Input,
         {
           id: "create-org-owner-name",
@@ -5392,10 +5729,10 @@ function OrganizationOnboardingForm({
       onChange: setResidencyCountry,
       required: false
     }),
-    /* @__PURE__ */ jsxs45("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsxs45("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx79(Label2, { children: "Beneficial owners" }),
-        /* @__PURE__ */ jsx79(
+    /* @__PURE__ */ jsxs49("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxs49("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsx83(Label2, { children: "Beneficial owners" }),
+        /* @__PURE__ */ jsx83(
           Button,
           {
             type: "button",
@@ -5408,16 +5745,16 @@ function OrganizationOnboardingForm({
           }
         )
       ] }),
-      owners.length === 0 && /* @__PURE__ */ jsx79("p", { className: "text-xs text-text-tertiary", children: "List the natural persons who ultimately own or control the organization." }),
-      owners.map((row) => /* @__PURE__ */ jsxs45(
+      owners.length === 0 && /* @__PURE__ */ jsx83("p", { className: "text-xs text-text-tertiary", children: "List the natural persons who ultimately own or control the organization." }),
+      owners.map((row) => /* @__PURE__ */ jsxs49(
         "div",
         {
           "data-testid": `beneficial-owner-row-${row.key}`,
           className: "flex items-end gap-2",
           children: [
-            /* @__PURE__ */ jsxs45("div", { className: "flex-1 space-y-1", children: [
-              /* @__PURE__ */ jsx79(Label2, { htmlFor: `bo-name-${row.key}`, className: "text-xs", children: "Name" }),
-              /* @__PURE__ */ jsx79(
+            /* @__PURE__ */ jsxs49("div", { className: "flex-1 space-y-1", children: [
+              /* @__PURE__ */ jsx83(Label2, { htmlFor: `bo-name-${row.key}`, className: "text-xs", children: "Name" }),
+              /* @__PURE__ */ jsx83(
                 Input,
                 {
                   id: `bo-name-${row.key}`,
@@ -5427,9 +5764,9 @@ function OrganizationOnboardingForm({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs45("div", { className: "w-40 space-y-1", children: [
-              /* @__PURE__ */ jsx79(Label2, { htmlFor: `bo-country-${row.key}`, className: "text-xs", children: "Country" }),
-              /* @__PURE__ */ jsx79(
+            /* @__PURE__ */ jsxs49("div", { className: "w-40 space-y-1", children: [
+              /* @__PURE__ */ jsx83(Label2, { htmlFor: `bo-country-${row.key}`, className: "text-xs", children: "Country" }),
+              /* @__PURE__ */ jsx83(
                 Select,
                 {
                   id: `bo-country-${row.key}`,
@@ -5442,9 +5779,9 @@ function OrganizationOnboardingForm({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs45("div", { className: "w-24 space-y-1", children: [
-              /* @__PURE__ */ jsx79(Label2, { htmlFor: `bo-share-${row.key}`, className: "text-xs", children: "Share %" }),
-              /* @__PURE__ */ jsx79(
+            /* @__PURE__ */ jsxs49("div", { className: "w-24 space-y-1", children: [
+              /* @__PURE__ */ jsx83(Label2, { htmlFor: `bo-share-${row.key}`, className: "text-xs", children: "Share %" }),
+              /* @__PURE__ */ jsx83(
                 Input,
                 {
                   id: `bo-share-${row.key}`,
@@ -5455,7 +5792,7 @@ function OrganizationOnboardingForm({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx79(
+            /* @__PURE__ */ jsx83(
               Button,
               {
                 type: "button",
@@ -5470,15 +5807,15 @@ function OrganizationOnboardingForm({
         },
         row.key
       )),
-      !ownersValid && /* @__PURE__ */ jsx79("p", { "data-testid": "beneficial-owners-error", className: "text-xs text-text-danger", children: "Every owner needs a name, a country and a share between 0 and 100." }),
-      shareSum > 100 && /* @__PURE__ */ jsxs45("p", { "data-testid": "beneficial-owners-sum-warning", className: "text-xs text-text-warning", children: [
+      !ownersValid && /* @__PURE__ */ jsx83("p", { "data-testid": "beneficial-owners-error", className: "text-xs text-text-danger", children: "Every owner needs a name, a country and a share between 0 and 100." }),
+      shareSum > 100 && /* @__PURE__ */ jsxs49("p", { "data-testid": "beneficial-owners-sum-warning", className: "text-xs text-text-warning", children: [
         "The listed shares add up to ",
         shareSum,
         "%, which is more than 100%."
       ] })
     ] }),
-    needsOwnershipConfirmation && /* @__PURE__ */ jsxs45("div", { className: "flex items-start gap-2", children: [
-      /* @__PURE__ */ jsx79(
+    needsOwnershipConfirmation && /* @__PURE__ */ jsxs49("div", { className: "flex items-start gap-2", children: [
+      /* @__PURE__ */ jsx83(
         Checkbox,
         {
           id: "create-org-ownership-confirmed",
@@ -5487,24 +5824,24 @@ function OrganizationOnboardingForm({
           onCheckedChange: (value) => setOwnershipConfirmed(value === true)
         }
       ),
-      /* @__PURE__ */ jsxs45(
+      /* @__PURE__ */ jsxs49(
         Label2,
         {
           htmlFor: "create-org-ownership-confirmed",
           className: "text-xs font-normal leading-snug",
           children: [
             "I confirm the ownership structure above is complete and correct",
-            requireSanctionsFields && /* @__PURE__ */ jsx79("span", { className: "text-text-danger", children: " *" })
+            requireSanctionsFields && /* @__PURE__ */ jsx83("span", { className: "text-text-danger", children: " *" })
           ]
         }
       )
     ] }),
-    (serverError || violations && violations.length > 0) && /* @__PURE__ */ jsxs45(InlineError, { children: [
+    (serverError || violations && violations.length > 0) && /* @__PURE__ */ jsxs49(InlineError, { children: [
       serverError,
-      violations && violations.length > 0 && /* @__PURE__ */ jsx79("ul", { "data-testid": "create-org-violations", className: "mt-1 list-disc pl-4", children: violations.map((violation) => /* @__PURE__ */ jsx79("li", { children: violation }, violation)) })
+      violations && violations.length > 0 && /* @__PURE__ */ jsx83("ul", { "data-testid": "create-org-violations", className: "mt-1 list-disc pl-4", children: violations.map((violation) => /* @__PURE__ */ jsx83("li", { children: violation }, violation)) })
     ] }),
-    /* @__PURE__ */ jsxs45("div", { className: "space-y-2 pt-1", children: [
-      /* @__PURE__ */ jsx79(
+    /* @__PURE__ */ jsxs49("div", { className: "space-y-2 pt-1", children: [
+      /* @__PURE__ */ jsx83(
         "button",
         {
           type: "submit",
@@ -5515,76 +5852,13 @@ function OrganizationOnboardingForm({
           children: submitting ? "Creating\u2026" : submitLabel
         }
       ),
-      onCancel && /* @__PURE__ */ jsx79("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
+      onCancel && /* @__PURE__ */ jsx83("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
     ] })
   ] });
 }
 
-// src/components/onboarding-screen-shell.tsx
-import { jsx as jsx80, jsxs as jsxs46 } from "react/jsx-runtime";
-var CARD_WIDTH = {
-  md: "max-w-[440px]",
-  lg: "max-w-[560px]"
-};
-function OnboardingScreenShell({
-  logo,
-  themeToggle = /* @__PURE__ */ jsx80(ThemeToggle, {}),
-  title,
-  description,
-  footer,
-  width = "md",
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs46(
-    "div",
-    {
-      className: cn(
-        "relative flex min-h-screen w-full flex-col items-center justify-center overflow-hidden px-6 py-12 text-text-primary",
-        className
-      ),
-      style: { background: AUTH_GLOW_BG },
-      ...props,
-      children: [
-        themeToggle && /* @__PURE__ */ jsx80("div", { className: "absolute right-6 top-6", children: themeToggle }),
-        /* @__PURE__ */ jsxs46(
-          "div",
-          {
-            className: cn(
-              "relative w-full rounded-2xl bg-bg-surface px-[34px] pb-[30px] pt-[38px] text-center",
-              CARD_WIDTH[width]
-            ),
-            style: {
-              border: "1px solid var(--auth-card-border)",
-              boxShadow: "var(--auth-card-shadow)"
-            },
-            children: [
-              logo && /* @__PURE__ */ jsx80("div", { className: "mb-[22px] flex items-center justify-center text-[24px] font-bold leading-none tracking-[-0.02em] text-text-primary", children: logo }),
-              /* @__PURE__ */ jsx80(
-                "h1",
-                {
-                  className: cn(
-                    "text-[20px] font-semibold leading-[1.25] tracking-[-0.015em] text-text-primary",
-                    // Without a description the headline itself carries the gap to the form.
-                    description ? "mb-[8px]" : "mb-[24px]"
-                  ),
-                  children: title
-                }
-              ),
-              description && /* @__PURE__ */ jsx80("p", { className: "mx-auto mb-[24px] max-w-[320px] text-[13.5px] leading-[1.5] text-text-secondary", children: description }),
-              /* @__PURE__ */ jsx80("div", { className: "text-left", children }),
-              footer != null && /* @__PURE__ */ jsx80("div", { className: "mt-[24px] text-[11px] tracking-[0.005em] text-text-tertiary", children: footer })
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-
 // src/components/organization-create-screen.tsx
-import { jsx as jsx81 } from "react/jsx-runtime";
+import { jsx as jsx84 } from "react/jsx-runtime";
 function OrganizationCreateScreen({
   requireSanctionsFields,
   onSubmit,
@@ -5602,7 +5876,7 @@ function OrganizationCreateScreen({
   footer,
   ...props
 }) {
-  return /* @__PURE__ */ jsx81(
+  return /* @__PURE__ */ jsx84(
     OnboardingScreenShell,
     {
       logo,
@@ -5612,7 +5886,7 @@ function OrganizationCreateScreen({
       footer,
       width: "lg",
       ...props,
-      children: /* @__PURE__ */ jsx81(
+      children: /* @__PURE__ */ jsx84(
         OrganizationOnboardingForm,
         {
           requireSanctionsFields,
@@ -5631,8 +5905,8 @@ function OrganizationCreateScreen({
 }
 
 // src/components/product-create-screen.tsx
-import * as React66 from "react";
-import { jsx as jsx82, jsxs as jsxs47 } from "react/jsx-runtime";
+import * as React68 from "react";
+import { jsx as jsx85, jsxs as jsxs50 } from "react/jsx-runtime";
 var productRow = "flex w-full items-center justify-between rounded-md border border-border-default bg-bg-primary px-3 py-2 text-left text-sm text-text-primary";
 function ProductCreateScreen({
   // Destructured only to keep it out of `...props`, which is spread onto a <div>.
@@ -5658,11 +5932,11 @@ function ProductCreateScreen({
   footer,
   ...props
 }) {
-  const [name, setName] = React66.useState(defaultName);
-  const submittingRef = React66.useRef(false);
+  const [name, setName] = React68.useState(defaultName);
+  const submittingRef = React68.useRef(false);
   const trimmed = name.trim();
   const canSubmit = trimmed !== "" && !submitting;
-  React66.useEffect(() => {
+  React68.useEffect(() => {
     submittingRef.current = false;
   }, [name, submitting, serverError]);
   const handleSubmit = (event) => {
@@ -5674,7 +5948,7 @@ function ProductCreateScreen({
   const products = existingProducts ?? [];
   const orgs = organizations ?? [];
   const pickerLayout = orgs.length > 0;
-  const productList = /* @__PURE__ */ jsx82("ul", { className: "flex flex-col gap-1", children: products.map((product) => /* @__PURE__ */ jsx82("li", { children: onOpenProduct ? /* @__PURE__ */ jsxs47(
+  const productList = /* @__PURE__ */ jsx85("ul", { className: "flex flex-col gap-1", children: products.map((product) => /* @__PURE__ */ jsx85("li", { children: onOpenProduct ? /* @__PURE__ */ jsxs50(
     "button",
     {
       type: "button",
@@ -5685,15 +5959,15 @@ function ProductCreateScreen({
         "hover:bg-bg-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus"
       ),
       children: [
-        /* @__PURE__ */ jsx82("span", { className: "truncate", children: product.name }),
-        product.slug && /* @__PURE__ */ jsx82("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
+        /* @__PURE__ */ jsx85("span", { className: "truncate", children: product.name }),
+        product.slug && /* @__PURE__ */ jsx85("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
       ]
     }
-  ) : /* @__PURE__ */ jsxs47("div", { className: productRow, children: [
-    /* @__PURE__ */ jsx82("span", { className: "truncate", children: product.name }),
-    product.slug && /* @__PURE__ */ jsx82("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
+  ) : /* @__PURE__ */ jsxs50("div", { className: productRow, children: [
+    /* @__PURE__ */ jsx85("span", { className: "truncate", children: product.name }),
+    product.slug && /* @__PURE__ */ jsx85("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
   ] }) }, product.id)) });
-  return /* @__PURE__ */ jsxs47(
+  return /* @__PURE__ */ jsxs50(
     OnboardingScreenShell,
     {
       logo,
@@ -5703,10 +5977,10 @@ function ProductCreateScreen({
       footer,
       ...props,
       children: [
-        pickerLayout && /* @__PURE__ */ jsxs47("div", { className: "mb-4 space-y-4", children: [
-          /* @__PURE__ */ jsxs47("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ jsx82(Label2, { htmlFor: "create-product-org-select", children: "Organization" }),
-            /* @__PURE__ */ jsx82(
+        pickerLayout && /* @__PURE__ */ jsxs50("div", { className: "mb-4 space-y-4", children: [
+          /* @__PURE__ */ jsxs50("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx85(Label2, { htmlFor: "create-product-org-select", children: "Organization" }),
+            /* @__PURE__ */ jsx85(
               Select,
               {
                 id: "create-product-org-select",
@@ -5720,15 +5994,15 @@ function ProductCreateScreen({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs47("div", { "data-testid": "existing-products", className: "space-y-1.5", children: [
-            /* @__PURE__ */ jsx82(Label2, { children: existingProductsLabel }),
-            productsLoading ? /* @__PURE__ */ jsx82("p", { className: "text-sm text-text-tertiary", children: "Loading products\u2026" }) : products.length === 0 ? /* @__PURE__ */ jsx82("p", { className: "text-sm text-text-tertiary", children: "No products yet." }) : productList
+          /* @__PURE__ */ jsxs50("div", { "data-testid": "existing-products", className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx85(Label2, { children: existingProductsLabel }),
+            productsLoading ? /* @__PURE__ */ jsx85("p", { className: "text-sm text-text-tertiary", children: "Loading products\u2026" }) : products.length === 0 ? /* @__PURE__ */ jsx85("p", { className: "text-sm text-text-tertiary", children: "No products yet." }) : productList
           ] })
         ] }),
-        /* @__PURE__ */ jsxs47("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
-          /* @__PURE__ */ jsxs47("div", { className: "space-y-1.5", children: [
-            /* @__PURE__ */ jsx82(Label2, { htmlFor: "create-product-name", children: "Product name" }),
-            /* @__PURE__ */ jsx82(
+        /* @__PURE__ */ jsxs50("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
+          /* @__PURE__ */ jsxs50("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx85(Label2, { htmlFor: "create-product-name", children: "Product name" }),
+            /* @__PURE__ */ jsx85(
               Input,
               {
                 id: "create-product-name",
@@ -5739,9 +6013,9 @@ function ProductCreateScreen({
               }
             )
           ] }),
-          serverError && /* @__PURE__ */ jsx82(InlineError, { children: serverError }),
-          /* @__PURE__ */ jsxs47("div", { className: "space-y-2 pt-1", children: [
-            /* @__PURE__ */ jsx82(
+          serverError && /* @__PURE__ */ jsx85(InlineError, { children: serverError }),
+          /* @__PURE__ */ jsxs50("div", { className: "space-y-2 pt-1", children: [
+            /* @__PURE__ */ jsx85(
               "button",
               {
                 type: "submit",
@@ -5752,16 +6026,16 @@ function ProductCreateScreen({
                 children: submitting ? "Creating\u2026" : submitLabel
               }
             ),
-            onCancel && /* @__PURE__ */ jsx82("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
+            onCancel && /* @__PURE__ */ jsx85("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
           ] })
         ] }),
-        !pickerLayout && products.length > 0 && /* @__PURE__ */ jsxs47(
+        !pickerLayout && products.length > 0 && /* @__PURE__ */ jsxs50(
           "div",
           {
             "data-testid": "existing-products",
             className: "mt-6 space-y-2 border-t border-border-default pt-5",
             children: [
-              /* @__PURE__ */ jsx82(Label2, { children: existingProductsLabel }),
+              /* @__PURE__ */ jsx85(Label2, { children: existingProductsLabel }),
               productList
             ]
           }
@@ -5797,6 +6071,7 @@ export {
   AvatarFallback,
   AvatarImage,
   Badge,
+  BetaGateScreen,
   Breadcrumb,
   BreadcrumbEllipsis,
   BreadcrumbItem,
@@ -5986,6 +6261,7 @@ export {
   SidebarNav,
   SidebarNavLink,
   SidebarProductHeader,
+  SignupScreen,
   Skeleton,
   Slider,
   StatCard,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lessly/ui",
-  "version": "0.22.0",
+  "version": "0.24.0",
   "description": "Lessly design system — shared UI primitives, tokens, and theme",
   "type": "module",
   "packageManager": "pnpm@10.30.3",