@object-ui/app-shell 3.3.0 → 3.3.1

package/dist/console/auth/RegisterPage.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Register Page for ObjectStack Console
+ */
+import { useNavigate, Link } from 'react-router-dom';
+import { RegisterForm } from '@object-ui/auth';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { AuthPageLayout } from './AuthPageLayout';
+const RouterLink = ({ href, className, children }) => (_jsx(Link, { to: href, className: className, children: children }));
+export function RegisterPage() {
+    const navigate = useNavigate();
+    const { t } = useObjectTranslation();
+    return (_jsx(AuthPageLayout, { children: _jsx(RegisterForm, { onSuccess: () => navigate('/'), loginUrl: "/login", title: t('auth.register.title'), description: t('auth.register.description'), linkComponent: RouterLink, labels: {
+                nameLabel: t('auth.register.nameLabel'),
+                namePlaceholder: t('auth.register.namePlaceholder'),
+                emailLabel: t('auth.register.emailLabel'),
+                emailPlaceholder: t('auth.register.emailPlaceholder'),
+                passwordLabel: t('auth.register.passwordLabel'),
+                passwordPlaceholder: t('auth.register.passwordPlaceholder'),
+                confirmPasswordLabel: t('auth.register.confirmPasswordLabel'),
+                confirmPasswordPlaceholder: t('auth.register.confirmPasswordPlaceholder'),
+                passwordMismatchError: t('auth.register.passwordMismatchError'),
+                passwordTooShortError: t('auth.register.passwordTooShortError'),
+                submitButton: t('auth.register.submitButton'),
+                submittingButton: t('auth.register.submittingButton'),
+                hasAccountText: t('auth.register.hasAccountText'),
+                signInText: t('auth.register.signInText'),
+            } }) }));
+}

package/dist/console/auth/index.d.ts

@@ -0,0 +1,4 @@
+export { LoginPage } from './LoginPage';
+export { RegisterPage } from './RegisterPage';
+export { ForgotPasswordPage } from './ForgotPasswordPage';
+export { AuthPageLayout } from './AuthPageLayout';

package/dist/console/auth/index.js

@@ -0,0 +1,4 @@
+export { LoginPage } from './LoginPage';
+export { RegisterPage } from './RegisterPage';
+export { ForgotPasswordPage } from './ForgotPasswordPage';
+export { AuthPageLayout } from './AuthPageLayout';

package/dist/console/home/AppCard.d.ts

@@ -0,0 +1,14 @@
+/**
+ * AppCard
+ *
+ * Display card for an application with icon, name, description, and favorite toggle.
+ *
+ * @module
+ */
+interface AppCardProps {
+    app: any;
+    onClick: () => void;
+    isFavorite: boolean;
+}
+export declare function AppCard({ app, onClick, isFavorite }: AppCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/console/home/AppCard.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * AppCard
+ *
+ * Display card for an application with icon, name, description, and favorite toggle.
+ *
+ * @module
+ */
+import { Star, StarOff } from 'lucide-react';
+import { Card, CardContent, Button, Badge } from '@object-ui/components';
+import { useObjectTranslation, useObjectLabel } from '@object-ui/i18n';
+import { resolveI18nLabel } from '../../utils';
+import { useFavorites } from '../../hooks/useFavorites';
+import { getIcon } from '../../utils/getIcon';
+import { cn } from '@object-ui/components';
+export function AppCard({ app, onClick, isFavorite }) {
+    const { t } = useObjectTranslation();
+    const { appLabel, appDescription } = useObjectLabel();
+    const { toggleFavorite } = useFavorites();
+    const Icon = getIcon(app.icon);
+    const label = appLabel({ name: app.name, label: resolveI18nLabel(app.label, t) });
+    const description = appDescription({ name: app.name, description: resolveI18nLabel(app.description, t) });
+    const primaryColor = app.branding?.primaryColor;
+    const handleToggleFavorite = (e) => {
+        e.stopPropagation();
+        toggleFavorite({
+            id: `app:${app.name}`,
+            label,
+            href: `/apps/${app.name}`,
+            type: 'object',
+        });
+    };
+    return (_jsx(Card, { className: "cursor-pointer hover:shadow-lg transition-all group relative", onClick: onClick, "data-testid": `app-card-${app.name}`, children: _jsxs(CardContent, { className: "p-6", children: [_jsx(Button, { variant: "ghost", size: "sm", className: "absolute top-2 right-2 opacity-0 group-hover:opacity-100 focus-visible:opacity-100 transition-opacity", onClick: handleToggleFavorite, "aria-label": isFavorite
+                        ? t('common.removeFromFavorites', { defaultValue: 'Remove from favorites' }) + ` — ${label}`
+                        : t('common.addToFavorites', { defaultValue: 'Add to favorites' }) + ` — ${label}`, "aria-pressed": isFavorite, "data-testid": `favorite-btn-${app.name}`, children: isFavorite ? (_jsx(Star, { className: "h-4 w-4 fill-yellow-400 text-yellow-400" })) : (_jsx(StarOff, { className: "h-4 w-4" })) }), _jsx("div", { className: cn('inline-flex p-3 rounded-lg mb-4', primaryColor ? '' : 'bg-primary/10'), style: primaryColor ? { backgroundColor: `${primaryColor}20` } : {}, children: _jsx(Icon, { className: "h-8 w-8", style: primaryColor ? { color: primaryColor } : {} }) }), _jsxs("div", { children: [_jsx("h3", { className: "font-semibold text-lg mb-1", children: label }), description && (_jsx("p", { className: "text-sm text-muted-foreground line-clamp-2", children: description })), !description && (_jsx("p", { className: "text-sm text-muted-foreground", children: t('home.appCard.noDescription', { defaultValue: 'No description' }) }))] }), app.isDefault && (_jsx("div", { className: "mt-3", children: _jsx(Badge, { variant: "secondary", children: t('home.appCard.default', { defaultValue: 'Default' }) }) }))] }) }));
+}

package/dist/console/home/HomeLayout.d.ts

@@ -0,0 +1,15 @@
+/**
+ * HomeLayout
+ *
+ * Home (workspace) landing layout. Uses the unified `AppHeader` top bar in
+ * `home` variant so that `/home` shares chrome with the rest of the console;
+ * deliberately omits the sidebar.
+ *
+ * @module
+ */
+import React from 'react';
+interface HomeLayoutProps {
+    children: React.ReactNode;
+}
+export declare function HomeLayout({ children }: HomeLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/console/home/HomeLayout.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * HomeLayout
+ *
+ * Home (workspace) landing layout. Uses the unified `AppHeader` top bar in
+ * `home` variant so that `/home` shares chrome with the rest of the console;
+ * deliberately omits the sidebar.
+ *
+ * @module
+ */
+import { useEffect } from 'react';
+import { useNavigationContext } from '../../context/NavigationContext';
+import { AppHeader } from '../../layout/AppHeader';
+export function HomeLayout({ children }) {
+    const { setContext } = useNavigationContext();
+    useEffect(() => {
+        setContext('home');
+    }, [setContext]);
+    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "home-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "home" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto", children: children })] }));
+}

package/dist/console/home/HomePage.d.ts

@@ -0,0 +1,18 @@
+/**
+ * HomePage
+ *
+ * Unified Home Dashboard (Workspace) that displays all available applications,
+ * quick actions, recent items, and favorites. Inspired by Airtable/Notion home pages.
+ *
+ * Features:
+ * - Display all active applications as cards
+ * - Quick actions for creating apps, importing data, etc.
+ * - Recent apps section (from useRecentItems)
+ * - Starred/Favorite apps section (from useFavorites)
+ * - Empty state guidance for new users
+ * - Responsive grid layout
+ * - i18n support
+ *
+ * @module
+ */
+export declare function HomePage(): import("react/jsx-runtime").JSX.Element;

package/dist/console/home/HomePage.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * HomePage
+ *
+ * Unified Home Dashboard (Workspace) that displays all available applications,
+ * quick actions, recent items, and favorites. Inspired by Airtable/Notion home pages.
+ *
+ * Features:
+ * - Display all active applications as cards
+ * - Quick actions for creating apps, importing data, etc.
+ * - Recent apps section (from useRecentItems)
+ * - Starred/Favorite apps section (from useFavorites)
+ * - Empty state guidance for new users
+ * - Responsive grid layout
+ * - i18n support
+ *
+ * @module
+ */
+import { useNavigate } from 'react-router-dom';
+import { useMetadata } from '../../providers/MetadataProvider';
+import { useRecentItems } from '../../hooks/useRecentItems';
+import { useFavorites } from '../../hooks/useFavorites';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { QuickActions } from './QuickActions';
+import { AppCard } from './AppCard';
+import { RecentApps } from './RecentApps';
+import { StarredApps } from './StarredApps';
+import { Empty, EmptyTitle, EmptyDescription, Button } from '@object-ui/components';
+import { Plus, Settings } from 'lucide-react';
+export function HomePage() {
+    const navigate = useNavigate();
+    const { t } = useObjectTranslation();
+    const { apps, loading } = useMetadata();
+    const { recentItems } = useRecentItems();
+    const { favorites } = useFavorites();
+    // Filter active apps
+    const activeApps = apps.filter((a) => a.active !== false);
+    // Get recent apps (only apps, not objects/dashboards)
+    const recentApps = recentItems
+        .filter(item => item.type === 'object' || item.type === 'dashboard' || item.type === 'page')
+        .slice(0, 6);
+    // Get starred apps
+    const starredApps = favorites
+        .filter(item => item.type === 'object' || item.type === 'dashboard' || item.type === 'page')
+        .slice(0, 8);
+    if (loading) {
+        return (_jsx("div", { className: "flex flex-1 items-center justify-center py-20", children: _jsx("div", { className: "text-muted-foreground", children: "Loading workspace..." }) }));
+    }
+    // Empty state - no apps configured
+    if (activeApps.length === 0) {
+        return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsxs(Empty, { children: [_jsx(EmptyTitle, { children: "Welcome to ObjectUI" }), _jsx(EmptyDescription, { children: "Get started by creating your first application or configure your system settings." }), _jsxs("div", { className: "mt-6 flex flex-col sm:flex-row items-center gap-3", children: [_jsxs(Button, { onClick: () => navigate('/create-app'), "data-testid": "create-first-app-btn", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Create Your First App"] }), _jsxs(Button, { variant: "outline", onClick: () => navigate('/apps/setup'), "data-testid": "go-to-settings-btn", children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), "System Settings"] })] })] }) }));
+    }
+    return (_jsxs("div", { className: "bg-background", children: [_jsxs("div", { className: "px-4 sm:px-6 pt-6 pb-4", children: [_jsx("h1", { className: "text-2xl sm:text-3xl font-bold tracking-tight", children: t('home.title', { defaultValue: 'Home' }) }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: t('home.subtitle', { defaultValue: 'Your workspace dashboard' }) })] }), _jsxs("div", { className: "px-4 sm:px-6 py-4 space-y-8", children: [_jsx(QuickActions, {}), starredApps.length > 0 && (_jsx(StarredApps, { items: starredApps })), recentApps.length > 0 && (_jsx(RecentApps, { items: recentApps })), _jsxs("section", { children: [_jsx("h2", { className: "text-2xl font-semibold tracking-tight mb-4", children: t('home.allApps', { defaultValue: 'All Applications' }) }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: activeApps.map((app) => (_jsx(AppCard, { app: app, onClick: () => navigate(`/apps/${app.name}`), isFavorite: favorites.some(f => f.id === `app:${app.name}`) }, app.name))) })] })] })] }));
+}

package/dist/console/home/QuickActions.d.ts

@@ -0,0 +1,9 @@
+/**
+ * QuickActions
+ *
+ * Quick action cards for common tasks like creating apps, importing data,
+ * accessing system settings, etc.
+ *
+ * @module
+ */
+export declare function QuickActions(): import("react/jsx-runtime").JSX.Element;

package/dist/console/home/QuickActions.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * QuickActions
+ *
+ * Quick action cards for common tasks like creating apps, importing data,
+ * accessing system settings, etc.
+ *
+ * @module
+ */
+import { useNavigate } from 'react-router-dom';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { Card, CardContent } from '@object-ui/components';
+import { Plus, Settings, Database } from 'lucide-react';
+import { cn } from '@object-ui/components';
+export function QuickActions() {
+    const navigate = useNavigate();
+    const { t } = useObjectTranslation();
+    const actions = [
+        {
+            id: 'create-app',
+            label: t('home.quickActions.createApp', { defaultValue: 'Create App' }),
+            description: t('home.quickActions.createAppDesc', { defaultValue: 'Start with a new application' }),
+            icon: Plus,
+            href: '/create-app',
+            color: 'text-blue-600 dark:text-blue-400',
+        },
+        {
+            id: 'manage-objects',
+            label: t('home.quickActions.manageObjects', { defaultValue: 'Manage Objects' }),
+            description: t('home.quickActions.manageObjectsDesc', { defaultValue: 'Configure data models' }),
+            icon: Database,
+            href: '/apps/setup/system/metadata/object',
+            color: 'text-purple-600 dark:text-purple-400',
+        },
+        {
+            id: 'system-settings',
+            label: t('home.quickActions.systemSettings', { defaultValue: 'System Settings' }),
+            description: t('home.quickActions.systemSettingsDesc', { defaultValue: 'Configure your workspace' }),
+            icon: Settings,
+            href: '/apps/setup',
+            color: 'text-gray-600 dark:text-gray-400',
+        },
+    ];
+    return (_jsxs("section", { children: [_jsx("h2", { className: "text-2xl font-semibold tracking-tight mb-4", children: t('home.quickActions.title', { defaultValue: 'Quick Actions' }) }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: actions.map((action) => {
+                    const Icon = action.icon;
+                    return (_jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", onClick: () => navigate(action.href), "data-testid": `quick-action-${action.id}`, role: "link", tabIndex: 0, onKeyDown: (e) => {
+                            if (e.key === 'Enter' || e.key === ' ') {
+                                e.preventDefault();
+                                navigate(action.href);
+                            }
+                        }, "aria-label": action.label, children: _jsx(CardContent, { className: "p-6", children: _jsxs("div", { className: "flex items-start gap-4", children: [_jsx("div", { className: cn('p-3 rounded-lg bg-muted', action.color), children: _jsx(Icon, { className: "h-6 w-6" }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("h3", { className: "font-semibold text-base mb-1", children: action.label }), _jsx("p", { className: "text-sm text-muted-foreground", children: action.description })] })] }) }) }, action.id));
+                }) })] }));
+}

package/dist/console/home/RecentApps.d.ts

@@ -0,0 +1,13 @@
+/**
+ * RecentApps
+ *
+ * Display section for recently accessed items (objects, dashboards, pages).
+ *
+ * @module
+ */
+import type { RecentItem } from '../../hooks/useRecentItems';
+interface RecentAppsProps {
+    items: RecentItem[];
+}
+export declare function RecentApps({ items }: RecentAppsProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/console/home/RecentApps.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * RecentApps
+ *
+ * Display section for recently accessed items (objects, dashboards, pages).
+ *
+ * @module
+ */
+import { useNavigate } from 'react-router-dom';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { Card, CardContent } from '@object-ui/components';
+import { Clock } from 'lucide-react';
+import { getIcon } from '../../utils/getIcon';
+import { capitalizeFirst } from '../../utils';
+export function RecentApps({ items }) {
+    const navigate = useNavigate();
+    const { t } = useObjectTranslation();
+    if (items.length === 0)
+        return null;
+    return (_jsxs("section", { children: [_jsxs("div", { className: "flex items-center gap-2 mb-4", children: [_jsx(Clock, { className: "h-5 w-5 text-muted-foreground" }), _jsx("h2", { className: "text-2xl font-semibold tracking-tight", children: t('home.recentApps.title', { defaultValue: 'Recently Accessed' }) })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: items.map((item) => {
+                    const Icon = getIcon(item.type);
+                    const typeLabel = t(`home.recentApps.itemType.${item.type}`, {
+                        defaultValue: capitalizeFirst(item.type),
+                    });
+                    return (_jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", onClick: () => navigate(item.href), "data-testid": `recent-item-${item.id}`, role: "link", tabIndex: 0, onKeyDown: (e) => {
+                            if (e.key === 'Enter' || e.key === ' ') {
+                                e.preventDefault();
+                                navigate(item.href);
+                            }
+                        }, children: _jsx(CardContent, { className: "p-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "p-2 rounded-lg bg-muted shrink-0", children: _jsx(Icon, { className: "h-5 w-5" }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("h3", { className: "font-medium text-sm truncate", children: item.label }), _jsx("p", { className: "text-xs text-muted-foreground", children: typeLabel })] })] }) }) }, item.id));
+                }) })] }));
+}

package/dist/console/home/StarredApps.d.ts

@@ -0,0 +1,13 @@
+/**
+ * StarredApps
+ *
+ * Display section for starred/favorite items (objects, dashboards, pages).
+ *
+ * @module
+ */
+import type { FavoriteItem } from '../../hooks/useFavorites';
+interface StarredAppsProps {
+    items: FavoriteItem[];
+}
+export declare function StarredApps({ items }: StarredAppsProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/console/home/StarredApps.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * StarredApps
+ *
+ * Display section for starred/favorite items (objects, dashboards, pages).
+ *
+ * @module
+ */
+import { useNavigate } from 'react-router-dom';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { Card, CardContent } from '@object-ui/components';
+import { Star } from 'lucide-react';
+import { getIcon } from '../../utils/getIcon';
+import { capitalizeFirst } from '../../utils';
+export function StarredApps({ items }) {
+    const navigate = useNavigate();
+    const { t } = useObjectTranslation();
+    if (items.length === 0)
+        return null;
+    return (_jsxs("section", { children: [_jsxs("div", { className: "flex items-center gap-2 mb-4", children: [_jsx(Star, { className: "h-5 w-5 text-yellow-500 fill-yellow-500" }), _jsx("h2", { className: "text-2xl font-semibold tracking-tight", children: t('home.starredApps.title', { defaultValue: 'Starred' }) })] }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: items.map((item) => {
+                    const Icon = getIcon(item.type);
+                    return (_jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", onClick: () => navigate(item.href), "data-testid": `starred-item-${item.id}`, role: "link", tabIndex: 0, onKeyDown: (e) => {
+                            if (e.key === 'Enter' || e.key === ' ') {
+                                e.preventDefault();
+                                navigate(item.href);
+                            }
+                        }, children: _jsx(CardContent, { className: "p-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "p-2 rounded-lg bg-muted shrink-0", children: _jsx(Icon, { className: "h-5 w-5" }) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("h3", { className: "font-medium text-sm truncate", children: item.label }), _jsx("p", { className: "text-xs text-muted-foreground", children: capitalizeFirst(item.type) })] })] }) }) }, item.id));
+                }) })] }));
+}

package/dist/console/home/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Home Page Components
+ *
+ * Exports for the unified home dashboard components
+ */
+export { HomePage } from './HomePage';
+export { HomeLayout } from './HomeLayout';
+export { QuickActions } from './QuickActions';
+export { AppCard } from './AppCard';
+export { RecentApps } from './RecentApps';
+export { StarredApps } from './StarredApps';

package/dist/console/home/index.js

@@ -0,0 +1,11 @@
+/**
+ * Home Page Components
+ *
+ * Exports for the unified home dashboard components
+ */
+export { HomePage } from './HomePage';
+export { HomeLayout } from './HomeLayout';
+export { QuickActions } from './QuickActions';
+export { AppCard } from './AppCard';
+export { RecentApps } from './RecentApps';
+export { StarredApps } from './StarredApps';

package/dist/console/organizations/CreateWorkspaceDialog.d.ts

@@ -0,0 +1,16 @@
+/**
+ * CreateWorkspaceDialog
+ *
+ * Dialog for creating a new workspace (organization).
+ * Auto-generates a slug from the name.
+ *
+ * @module
+ */
+import type { AuthOrganization } from '@object-ui/auth';
+interface CreateWorkspaceDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    onCreated?: (org: AuthOrganization) => void;
+}
+export declare function CreateWorkspaceDialog({ open, onOpenChange, onCreated, }: CreateWorkspaceDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/console/organizations/CreateWorkspaceDialog.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * CreateWorkspaceDialog
+ *
+ * Dialog for creating a new workspace (organization).
+ * Auto-generates a slug from the name.
+ *
+ * @module
+ */
+import { useState, useCallback, useEffect } from 'react';
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Button, Input, Label, } from '@object-ui/components';
+import { useAuth } from '@object-ui/auth';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { Loader2 } from 'lucide-react';
+/** Convert a display name to a URL-friendly slug */
+function nameToSlug(name) {
+    return name
+        .toLowerCase()
+        .replace(/[^a-z0-9\s_-]/g, '')
+        .replace(/[\s_]+/g, '-')
+        .replace(/-+/g, '-')
+        .replace(/^-|-$/g, '')
+        .slice(0, 48);
+}
+export function CreateWorkspaceDialog({ open, onOpenChange, onCreated, }) {
+    const { t } = useObjectTranslation();
+    const { createOrganization } = useAuth();
+    const [name, setName] = useState('');
+    const [slug, setSlug] = useState('');
+    const [slugManuallyEdited, setSlugManuallyEdited] = useState(false);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [error, setError] = useState(null);
+    // Auto-generate slug from name (unless manually edited)
+    useEffect(() => {
+        if (!slugManuallyEdited) {
+            setSlug(nameToSlug(name));
+        }
+    }, [name, slugManuallyEdited]);
+    // Reset form when dialog opens
+    useEffect(() => {
+        if (open) {
+            setName('');
+            setSlug('');
+            setSlugManuallyEdited(false);
+            setError(null);
+        }
+    }, [open]);
+    const handleSubmit = useCallback(async (e) => {
+        e.preventDefault();
+        if (!name.trim() || !slug.trim())
+            return;
+        setIsSubmitting(true);
+        setError(null);
+        try {
+            const org = await createOrganization({ name: name.trim(), slug: slug.trim() });
+            onCreated?.(org);
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to create workspace');
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }, [name, slug, createOrganization, onCreated]);
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsx(DialogContent, { className: "sm:max-w-[425px]", "data-testid": "create-workspace-dialog", children: _jsxs("form", { onSubmit: handleSubmit, children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: t('workspace.createTitle', { defaultValue: 'Create a workspace' }) }), _jsx(DialogDescription, { children: t('workspace.createDescription', {
+                                    defaultValue: 'A workspace is a shared space for your team to collaborate.',
+                                }) })] }), _jsxs("div", { className: "grid gap-4 py-4", children: [_jsxs("div", { className: "grid gap-2", children: [_jsx(Label, { htmlFor: "workspace-name", children: t('workspace.nameLabel', { defaultValue: 'Workspace name' }) }), _jsx(Input, { id: "workspace-name", placeholder: t('workspace.namePlaceholder', { defaultValue: 'e.g., Acme Inc' }), value: name, onChange: (e) => setName(e.target.value), autoFocus: true, "data-testid": "workspace-name-input" })] }), _jsxs("div", { className: "grid gap-2", children: [_jsx(Label, { htmlFor: "workspace-slug", children: t('workspace.slugLabel', { defaultValue: 'URL slug' }) }), _jsx(Input, { id: "workspace-slug", placeholder: "acme-inc", value: slug, onChange: (e) => {
+                                            setSlug(e.target.value);
+                                            setSlugManuallyEdited(true);
+                                        }, "data-testid": "workspace-slug-input" }), _jsx("p", { className: "text-xs text-muted-foreground", children: t('workspace.slugHint', { defaultValue: 'Used in URLs. Only lowercase letters, numbers, and hyphens.' }) })] }), error && (_jsx("p", { className: "text-sm text-destructive", "data-testid": "workspace-create-error", children: error }))] }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), disabled: isSubmitting, children: t('common.cancel', { defaultValue: 'Cancel' }) }), _jsxs(Button, { type: "submit", disabled: isSubmitting || !name.trim() || !slug.trim(), "data-testid": "workspace-create-submit", children: [isSubmitting && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), t('workspace.createButton', { defaultValue: 'Create workspace' })] })] })] }) }) }));
+}

package/dist/console/organizations/OrganizationsLayout.d.ts

@@ -0,0 +1,15 @@
+/**
+ * OrganizationsLayout
+ *
+ * Landing layout for `/organizations`. Uses the unified `AppHeader` in `orgs`
+ * variant and has no sidebar. Shown when the user has not selected an
+ * organization or explicitly navigates to browse/create organizations.
+ *
+ * @module
+ */
+import React from 'react';
+interface OrganizationsLayoutProps {
+    children: React.ReactNode;
+}
+export declare function OrganizationsLayout({ children }: OrganizationsLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/console/organizations/OrganizationsLayout.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * OrganizationsLayout
+ *
+ * Landing layout for `/organizations`. Uses the unified `AppHeader` in `orgs`
+ * variant and has no sidebar. Shown when the user has not selected an
+ * organization or explicitly navigates to browse/create organizations.
+ *
+ * @module
+ */
+import { useEffect } from 'react';
+import { useNavigationContext } from '../../context/NavigationContext';
+import { AppHeader } from '../../layout/AppHeader';
+export function OrganizationsLayout({ children }) {
+    const { setContext } = useNavigationContext();
+    useEffect(() => {
+        setContext('home');
+    }, [setContext]);
+    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "organizations-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "orgs" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto", children: children })] }));
+}

package/dist/console/organizations/OrganizationsPage.d.ts

@@ -0,0 +1,9 @@
+/**
+ * OrganizationsPage
+ *
+ * Supabase-style landing page that lists the organizations the current user
+ * belongs to. Users can search, select (which switches the active
+ * organization and navigates to `/home`), or create a new organization.
+ * @module
+ */
+export declare function OrganizationsPage(): import("react/jsx-runtime").JSX.Element;

package/dist/console/organizations/OrganizationsPage.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * OrganizationsPage
+ *
+ * Supabase-style landing page that lists the organizations the current user
+ * belongs to. Users can search, select (which switches the active
+ * organization and navigates to `/home`), or create a new organization.
+ * @module
+ */
+import { useMemo, useState } from 'react';
+import { Avatar, AvatarImage, AvatarFallback, Button, Input, Empty, EmptyTitle, EmptyDescription, } from '@object-ui/components';
+import { Plus, Search, Loader2 } from 'lucide-react';
+import { useAuth } from '@object-ui/auth';
+import { useObjectTranslation } from '@object-ui/i18n';
+import { useNavigate } from 'react-router-dom';
+import { CreateWorkspaceDialog } from './CreateWorkspaceDialog';
+function getOrgInitials(name) {
+    return name
+        .split(/[\s_-]+/)
+        .map((w) => w[0])
+        .join('')
+        .toUpperCase()
+        .slice(0, 2);
+}
+export function OrganizationsPage() {
+    const { t } = useObjectTranslation();
+    const navigate = useNavigate();
+    const { organizations, activeOrganization, isOrganizationsLoading, switchOrganization, } = useAuth();
+    const [query, setQuery] = useState('');
+    const [isCreateOpen, setIsCreateOpen] = useState(false);
+    const [switchingId, setSwitchingId] = useState(null);
+    const orgList = organizations ?? [];
+    const filtered = useMemo(() => {
+        const q = query.trim().toLowerCase();
+        if (!q)
+            return orgList;
+        return orgList.filter((o) => o.name.toLowerCase().includes(q) || o.slug?.toLowerCase().includes(q));
+    }, [orgList, query]);
+    const handleSelect = async (org) => {
+        setSwitchingId(org.id);
+        try {
+            if (org.id !== activeOrganization?.id) {
+                await switchOrganization(org.id);
+            }
+            const base = import.meta.env.BASE_URL || '/';
+            const normalizedBase = base.endsWith('/') ? base : `${base}/`;
+            window.location.href = `${window.location.origin}${normalizedBase}home`;
+        }
+        catch (err) {
+            console.error('[OrganizationsPage] Failed to switch:', err);
+            setSwitchingId(null);
+        }
+    };
+    const handleCreated = (org) => {
+        setIsCreateOpen(false);
+        handleSelect(org);
+    };
+    if (isOrganizationsLoading) {
+        return (_jsx("div", { className: "flex flex-1 items-center justify-center py-20", children: _jsx(Loader2, { className: "h-5 w-5 animate-spin text-muted-foreground" }) }));
+    }
+    return (_jsxs("div", { className: "mx-auto w-full max-w-5xl px-4 sm:px-6 py-8 sm:py-12", children: [_jsxs("div", { className: "mb-8", children: [_jsx("h1", { className: "text-2xl sm:text-3xl font-bold tracking-tight", children: t('organizations.heading', { defaultValue: 'Your Organizations' }) }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: t('organizations.subtitle', {
+                            defaultValue: 'Select an organization to continue, or create a new one.',
+                        }) })] }), _jsxs("div", { className: "mb-6 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "relative w-full sm:max-w-sm", children: [_jsx(Search, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { value: query, onChange: (e) => setQuery(e.target.value), placeholder: t('organizations.searchPlaceholder', {
+                                    defaultValue: 'Search for an organization',
+                                }), className: "pl-9", "data-testid": "organizations-search" })] }), _jsxs(Button, { onClick: () => setIsCreateOpen(true), "data-testid": "organizations-new", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), t('organizations.new', { defaultValue: 'New organization' })] })] }), orgList.length === 0 ? (_jsxs(Empty, { children: [_jsx(EmptyTitle, { children: t('organizations.emptyTitle', { defaultValue: 'No organizations yet' }) }), _jsx(EmptyDescription, { children: t('organizations.emptyDescription', {
+                            defaultValue: 'Create your first organization to get started.',
+                        }) }), _jsxs(Button, { className: "mt-6", onClick: () => setIsCreateOpen(true), children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), t('organizations.new', { defaultValue: 'New organization' })] })] })) : filtered.length === 0 ? (_jsx("div", { className: "rounded-lg border border-dashed p-8 text-center text-sm text-muted-foreground", children: t('organizations.noMatches', {
+                    defaultValue: 'No organizations match your search.',
+                }) })) : (_jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: filtered.map((org) => {
+                    const isActive = org.id === activeOrganization?.id;
+                    const isSwitching = switchingId === org.id;
+                    return (_jsxs("button", { onClick: () => handleSelect(org), disabled: isSwitching, className: "group flex items-center gap-3 rounded-lg border bg-card p-4 text-left transition-colors hover:border-primary/50 hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-60", "data-testid": `organization-card-${org.slug}`, children: [_jsxs(Avatar, { className: "h-10 w-10 rounded-md shrink-0", children: [org.logo && _jsx(AvatarImage, { src: org.logo, alt: org.name }), _jsx(AvatarFallback, { className: "rounded-md bg-primary/10 text-primary text-sm font-medium", children: getOrgInitials(org.name) })] }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate font-medium", children: org.name }), _jsx("div", { className: "truncate text-xs text-muted-foreground", children: isActive
+                                            ? t('organizations.current', { defaultValue: 'Current organization' })
+                                            : org.slug })] }), _jsx("span", { className: "text-xs text-primary underline-offset-4 hover:underline shrink-0", onClick: (e) => { e.stopPropagation(); navigate(`/organizations/${org.slug}/members`); }, children: t('organizations.manage', { defaultValue: 'Manage' }) }), isSwitching && _jsx(Loader2, { className: "h-4 w-4 animate-spin text-muted-foreground" })] }, org.id));
+                }) })), _jsx(CreateWorkspaceDialog, { open: isCreateOpen, onOpenChange: setIsCreateOpen, onCreated: handleCreated })] }));
+}

package/dist/console/organizations/index.d.ts

@@ -0,0 +1,8 @@
+export { OrganizationsLayout } from './OrganizationsLayout';
+export { OrganizationsPage } from './OrganizationsPage';
+export { CreateWorkspaceDialog } from './CreateWorkspaceDialog';
+export { OrganizationLayout } from './manage/OrganizationLayout';
+export { MembersPage } from './manage/MembersPage';
+export { InvitationsPage } from './manage/InvitationsPage';
+export { SettingsPage } from './manage/SettingsPage';
+export { AcceptInvitationPage } from './manage/AcceptInvitationPage';

package/dist/console/organizations/index.js

@@ -0,0 +1,8 @@
+export { OrganizationsLayout } from './OrganizationsLayout';
+export { OrganizationsPage } from './OrganizationsPage';
+export { CreateWorkspaceDialog } from './CreateWorkspaceDialog';
+export { OrganizationLayout } from './manage/OrganizationLayout';
+export { MembersPage } from './manage/MembersPage';
+export { InvitationsPage } from './manage/InvitationsPage';
+export { SettingsPage } from './manage/SettingsPage';
+export { AcceptInvitationPage } from './manage/AcceptInvitationPage';