@lucasvu/scope-ui 0.0.8 → 0.1.1

package/dist/core/index.d.ts

@@ -0,0 +1,963 @@
+type UiAiComponentProp = {
+    name: string;
+    type: string;
+    required?: boolean;
+    description: string;
+};
+type UiAiComponentDescriptor = {
+    name: string;
+    importName: string;
+    purpose: string;
+    useWhen: string[];
+    avoidWhen?: string[];
+    props: UiAiComponentProp[];
+    example: string;
+    related?: string[];
+};
+declare const uiAiManifest: {
+    readonly packageName: "@lucasvu/scope-ui";
+    readonly styleImport: "@lucasvu/scope-ui/styles.css";
+    readonly rules: readonly ["Import the stylesheet once at the app entry before rendering any component.", "If the project declares an approved theme preset in AGENTS.md or ui-theme.css, stay inside that preset and do not invent a second palette.", "Collect the shell + screen brief first: layout preset, workspace label, route url, sidebar items, active sidebar item, page title, tabs/actions, and the page-specific content schema.", "If the project ships a generated layout preset file, keep the shell aligned with it instead of inventing a new page frame.", "Prefer the canonical component for each intent instead of mixing legacy MainFe components.", "Use Input/Textarea/Select label props directly for simple fields; use Field only to wrap custom controls or grouped content.", "Use Select for small fixed option lists, SearchableSelect for larger local lists, Combobox for type-and-pick flows, and AsyncCombobox for remote search.", "Always provide a stable rowKey to DataTable and use sortMode=\"server\" when sorting happens on the backend.", "Prefer Card as the outer layout section and keep alerts, stats, and tables inside CardContent when building dashboards or forms.", "Do not import MainFe components unless the target explicitly asks for legacy main-fe styling."];
+    readonly components: ({
+        name: string;
+        importName: string;
+        purpose: string;
+        useWhen: string[];
+        avoidWhen: string[];
+        props: {
+            name: string;
+            type: string;
+            description: string;
+        }[];
+        example: string;
+        related: string[];
+    } | {
+        name: string;
+        importName: string;
+        purpose: string;
+        useWhen: string[];
+        props: ({
+            name: string;
+            type: string;
+            required: true;
+            description: string;
+        } | {
+            name: string;
+            type: string;
+            description: string;
+            required?: undefined;
+        })[];
+        example: string;
+        related: string[];
+        avoidWhen?: undefined;
+    })[];
+};
+
+type UiScreenKind = 'list' | 'form' | 'detail' | 'dashboard';
+type UiScreenBriefField = {
+    id: string;
+    label: string;
+    description: string;
+    required: boolean;
+    appliesTo: UiScreenKind[] | ['all'];
+    example: string;
+};
+declare const uiScreenBriefFields: readonly [{
+    readonly id: "layoutPreset";
+    readonly label: "Layout preset";
+    readonly description: "Shared shell preset id that locks the sidebar/topbar/page-card structure.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "workspace-admin-v1";
+}, {
+    readonly id: "workspaceLabel";
+    readonly label: "Workspace label";
+    readonly description: "Short label shown in the sidebar or workspace topbar.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "Workspace";
+}, {
+    readonly id: "timezoneLabel";
+    readonly label: "Timezone/meta label";
+    readonly description: "Short meta label shown in the top-right shell area, such as a timezone or environment.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "UTC+07:00";
+}, {
+    readonly id: "pageKind";
+    readonly label: "Page kind";
+    readonly description: "Choose the base recipe for the screen.";
+    readonly required: true;
+    readonly appliesTo: ["all"];
+    readonly example: "list";
+}, {
+    readonly id: "routeUrl";
+    readonly label: "Route URL";
+    readonly description: "Final route for the screen or feature entry.";
+    readonly required: true;
+    readonly appliesTo: ["all"];
+    readonly example: "/admin/users";
+}, {
+    readonly id: "sidebarItems";
+    readonly label: "Sidebar items";
+    readonly description: "Sidebar entries with at least id, title, and href so the shell stays consistent.";
+    readonly required: true;
+    readonly appliesTo: ["all"];
+    readonly example: "[{ id: \"users\", title: \"Users\", href: \"/admin/users\" }]";
+}, {
+    readonly id: "activeSidebarItemId";
+    readonly label: "Active sidebar item id";
+    readonly description: "The sidebar item that should appear active on this screen.";
+    readonly required: true;
+    readonly appliesTo: ["all"];
+    readonly example: "users";
+}, {
+    readonly id: "breadcrumbs";
+    readonly label: "Breadcrumbs";
+    readonly description: "Ordered breadcrumb items for the page header.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "[{ label: \"Admin\", href: \"/admin\" }, { label: \"Users\", current: true }]";
+}, {
+    readonly id: "pageTitle";
+    readonly label: "Page title";
+    readonly description: "Main page heading shown in the content header.";
+    readonly required: true;
+    readonly appliesTo: ["all"];
+    readonly example: "Users";
+}, {
+    readonly id: "pageSubtitle";
+    readonly label: "Page subtitle";
+    readonly description: "Short supporting text under the title.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "Manage internal user accounts and permissions.";
+}, {
+    readonly id: "pageTabs";
+    readonly label: "Page tabs";
+    readonly description: "Optional segmented tabs rendered under the intro card.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "[{ value: \"overview\", label: \"Overview\" }, { value: \"coupons\", label: \"Coupons\" }]";
+}, {
+    readonly id: "activePageTab";
+    readonly label: "Active page tab";
+    readonly description: "The selected segmented tab value when tabs are present.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "coupons";
+}, {
+    readonly id: "primaryAction";
+    readonly label: "Primary action";
+    readonly description: "The highest-emphasis action shown in the page header.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "{ label: \"Create user\", href: \"/admin/users/create\" }";
+}, {
+    readonly id: "secondaryActions";
+    readonly label: "Secondary actions";
+    readonly description: "Additional header actions such as export, refresh, or cancel.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "[{ label: \"Export\" }, { label: \"Refresh\" }]";
+}, {
+    readonly id: "summaryStats";
+    readonly label: "Summary stats";
+    readonly description: "Top-line numbers for dashboard or overview screens.";
+    readonly required: false;
+    readonly appliesTo: ["dashboard", "detail"];
+    readonly example: "[{ label: \"Active users\", value: \"1,204\", trend: \"up\", delta: \"+12%\" }]";
+}, {
+    readonly id: "filters";
+    readonly label: "Filters";
+    readonly description: "Filter bar controls shown above list or dashboard content.";
+    readonly required: false;
+    readonly appliesTo: ["list", "dashboard"];
+    readonly example: "[{ type: \"search\", label: \"Search user\" }, { type: \"select\", label: \"Role\" }]";
+}, {
+    readonly id: "searchPlaceholder";
+    readonly label: "Search placeholder";
+    readonly description: "Placeholder text for the main toolbar search input when the shell includes one.";
+    readonly required: false;
+    readonly appliesTo: ["list", "dashboard"];
+    readonly example: "Search by coupon code";
+}, {
+    readonly id: "tableColumns";
+    readonly label: "Table columns";
+    readonly description: "Columns for a list table, including label and render intent.";
+    readonly required: false;
+    readonly appliesTo: ["list", "detail", "dashboard"];
+    readonly example: "[{ key: \"name\", title: \"Name\" }, { key: \"role\", title: \"Role\" }]";
+}, {
+    readonly id: "rowActions";
+    readonly label: "Row actions";
+    readonly description: "Per-row actions for table screens.";
+    readonly required: false;
+    readonly appliesTo: ["list", "detail"];
+    readonly example: "[{ label: \"Edit\" }, { label: \"Reset password\" }]";
+}, {
+    readonly id: "formSections";
+    readonly label: "Form sections";
+    readonly description: "Grouped form sections and the fields inside each section.";
+    readonly required: false;
+    readonly appliesTo: ["form"];
+    readonly example: "[{ title: \"Basic info\", fields: [\"name\", \"email\", \"role\"] }]";
+}, {
+    readonly id: "fields";
+    readonly label: "Fields";
+    readonly description: "Detailed field list with type, label, required state, and helper text.";
+    readonly required: false;
+    readonly appliesTo: ["form", "detail"];
+    readonly example: "[{ name: \"email\", type: \"input\", label: \"Email\", required: true }]";
+}, {
+    readonly id: "detailSections";
+    readonly label: "Detail sections";
+    readonly description: "Cards or sections for detail pages such as profile, activity, permissions, or related records.";
+    readonly required: false;
+    readonly appliesTo: ["detail"];
+    readonly example: "[{ title: \"Profile\" }, { title: \"Recent activity\" }]";
+}, {
+    readonly id: "emptyState";
+    readonly label: "Empty state";
+    readonly description: "Fallback title, description, and action when there is no data.";
+    readonly required: false;
+    readonly appliesTo: ["list", "dashboard", "detail"];
+    readonly example: "{ title: \"No users yet\", description: \"Create the first user to get started.\" }";
+}, {
+    readonly id: "permissions";
+    readonly label: "Permissions";
+    readonly description: "Permission keys that affect sidebar visibility or action availability.";
+    readonly required: false;
+    readonly appliesTo: ["all"];
+    readonly example: "[\"user.read\", \"user.write\"]";
+}];
+declare const uiScreenBlueprint: {
+    readonly pageKinds: readonly [{
+        readonly id: "list";
+        readonly label: "List page";
+        readonly frame: readonly ["Sidebar shell", "Workspace topbar", "Page intro card with Breadcrumb and PageTitle", "Optional segmented tabs", "Toolbar card", "Optional stats", "DataTable card"];
+    }, {
+        readonly id: "form";
+        readonly label: "Form page";
+        readonly frame: readonly ["Sidebar shell", "Workspace topbar", "Page intro card with Breadcrumb and PageTitle", "Optional segmented tabs", "Header actions", "Sectioned form cards", "Bottom action row"];
+    }, {
+        readonly id: "detail";
+        readonly label: "Detail page";
+        readonly frame: readonly ["Sidebar shell", "Workspace topbar", "Page intro card with Breadcrumb and PageTitle", "Optional segmented tabs", "PageTitle with status/actions", "Summary stats or metadata card", "Detail cards and related tables"];
+    }, {
+        readonly id: "dashboard";
+        readonly label: "Dashboard page";
+        readonly frame: readonly ["Sidebar shell", "Workspace topbar", "Page intro card with Breadcrumb and PageTitle", "Optional segmented tabs", "Toolbar card with actions", "Stat cards row", "Main insight cards and tables"];
+    }];
+    readonly workflow: readonly ["Collect the shell + screen brief before coding. Do not invent layout presets, workspace labels, sidebar items, route urls, tabs, filters, fields, or table columns if the brief is missing.", "Use Sidebar plus the workspace topbar and intro card to lock the shell before building the page body.", "Choose only canonical root exports from @lucasvu/scope-ui.", "Use Card and ui-grid utilities to create the frame first, then place controls and data components inside.", "Keep all palette, radius, surface, and shadow decisions in the shared ui-theme.css preset file.", "End with a consistency check against the selected preset and the screen brief."];
+    readonly briefFields: readonly [{
+        readonly id: "layoutPreset";
+        readonly label: "Layout preset";
+        readonly description: "Shared shell preset id that locks the sidebar/topbar/page-card structure.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "workspace-admin-v1";
+    }, {
+        readonly id: "workspaceLabel";
+        readonly label: "Workspace label";
+        readonly description: "Short label shown in the sidebar or workspace topbar.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "Workspace";
+    }, {
+        readonly id: "timezoneLabel";
+        readonly label: "Timezone/meta label";
+        readonly description: "Short meta label shown in the top-right shell area, such as a timezone or environment.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "UTC+07:00";
+    }, {
+        readonly id: "pageKind";
+        readonly label: "Page kind";
+        readonly description: "Choose the base recipe for the screen.";
+        readonly required: true;
+        readonly appliesTo: ["all"];
+        readonly example: "list";
+    }, {
+        readonly id: "routeUrl";
+        readonly label: "Route URL";
+        readonly description: "Final route for the screen or feature entry.";
+        readonly required: true;
+        readonly appliesTo: ["all"];
+        readonly example: "/admin/users";
+    }, {
+        readonly id: "sidebarItems";
+        readonly label: "Sidebar items";
+        readonly description: "Sidebar entries with at least id, title, and href so the shell stays consistent.";
+        readonly required: true;
+        readonly appliesTo: ["all"];
+        readonly example: "[{ id: \"users\", title: \"Users\", href: \"/admin/users\" }]";
+    }, {
+        readonly id: "activeSidebarItemId";
+        readonly label: "Active sidebar item id";
+        readonly description: "The sidebar item that should appear active on this screen.";
+        readonly required: true;
+        readonly appliesTo: ["all"];
+        readonly example: "users";
+    }, {
+        readonly id: "breadcrumbs";
+        readonly label: "Breadcrumbs";
+        readonly description: "Ordered breadcrumb items for the page header.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "[{ label: \"Admin\", href: \"/admin\" }, { label: \"Users\", current: true }]";
+    }, {
+        readonly id: "pageTitle";
+        readonly label: "Page title";
+        readonly description: "Main page heading shown in the content header.";
+        readonly required: true;
+        readonly appliesTo: ["all"];
+        readonly example: "Users";
+    }, {
+        readonly id: "pageSubtitle";
+        readonly label: "Page subtitle";
+        readonly description: "Short supporting text under the title.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "Manage internal user accounts and permissions.";
+    }, {
+        readonly id: "pageTabs";
+        readonly label: "Page tabs";
+        readonly description: "Optional segmented tabs rendered under the intro card.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "[{ value: \"overview\", label: \"Overview\" }, { value: \"coupons\", label: \"Coupons\" }]";
+    }, {
+        readonly id: "activePageTab";
+        readonly label: "Active page tab";
+        readonly description: "The selected segmented tab value when tabs are present.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "coupons";
+    }, {
+        readonly id: "primaryAction";
+        readonly label: "Primary action";
+        readonly description: "The highest-emphasis action shown in the page header.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "{ label: \"Create user\", href: \"/admin/users/create\" }";
+    }, {
+        readonly id: "secondaryActions";
+        readonly label: "Secondary actions";
+        readonly description: "Additional header actions such as export, refresh, or cancel.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "[{ label: \"Export\" }, { label: \"Refresh\" }]";
+    }, {
+        readonly id: "summaryStats";
+        readonly label: "Summary stats";
+        readonly description: "Top-line numbers for dashboard or overview screens.";
+        readonly required: false;
+        readonly appliesTo: ["dashboard", "detail"];
+        readonly example: "[{ label: \"Active users\", value: \"1,204\", trend: \"up\", delta: \"+12%\" }]";
+    }, {
+        readonly id: "filters";
+        readonly label: "Filters";
+        readonly description: "Filter bar controls shown above list or dashboard content.";
+        readonly required: false;
+        readonly appliesTo: ["list", "dashboard"];
+        readonly example: "[{ type: \"search\", label: \"Search user\" }, { type: \"select\", label: \"Role\" }]";
+    }, {
+        readonly id: "searchPlaceholder";
+        readonly label: "Search placeholder";
+        readonly description: "Placeholder text for the main toolbar search input when the shell includes one.";
+        readonly required: false;
+        readonly appliesTo: ["list", "dashboard"];
+        readonly example: "Search by coupon code";
+    }, {
+        readonly id: "tableColumns";
+        readonly label: "Table columns";
+        readonly description: "Columns for a list table, including label and render intent.";
+        readonly required: false;
+        readonly appliesTo: ["list", "detail", "dashboard"];
+        readonly example: "[{ key: \"name\", title: \"Name\" }, { key: \"role\", title: \"Role\" }]";
+    }, {
+        readonly id: "rowActions";
+        readonly label: "Row actions";
+        readonly description: "Per-row actions for table screens.";
+        readonly required: false;
+        readonly appliesTo: ["list", "detail"];
+        readonly example: "[{ label: \"Edit\" }, { label: \"Reset password\" }]";
+    }, {
+        readonly id: "formSections";
+        readonly label: "Form sections";
+        readonly description: "Grouped form sections and the fields inside each section.";
+        readonly required: false;
+        readonly appliesTo: ["form"];
+        readonly example: "[{ title: \"Basic info\", fields: [\"name\", \"email\", \"role\"] }]";
+    }, {
+        readonly id: "fields";
+        readonly label: "Fields";
+        readonly description: "Detailed field list with type, label, required state, and helper text.";
+        readonly required: false;
+        readonly appliesTo: ["form", "detail"];
+        readonly example: "[{ name: \"email\", type: \"input\", label: \"Email\", required: true }]";
+    }, {
+        readonly id: "detailSections";
+        readonly label: "Detail sections";
+        readonly description: "Cards or sections for detail pages such as profile, activity, permissions, or related records.";
+        readonly required: false;
+        readonly appliesTo: ["detail"];
+        readonly example: "[{ title: \"Profile\" }, { title: \"Recent activity\" }]";
+    }, {
+        readonly id: "emptyState";
+        readonly label: "Empty state";
+        readonly description: "Fallback title, description, and action when there is no data.";
+        readonly required: false;
+        readonly appliesTo: ["list", "dashboard", "detail"];
+        readonly example: "{ title: \"No users yet\", description: \"Create the first user to get started.\" }";
+    }, {
+        readonly id: "permissions";
+        readonly label: "Permissions";
+        readonly description: "Permission keys that affect sidebar visibility or action availability.";
+        readonly required: false;
+        readonly appliesTo: ["all"];
+        readonly example: "[\"user.read\", \"user.write\"]";
+    }];
+};
+
+type UiThemeToken = {
+    name: string;
+    description: string;
+    defaultLight: string;
+    defaultDark: string;
+    usedBy: string[];
+};
+type UiThemePreset = {
+    id: string;
+    label: string;
+    description: string;
+    recommendedFor: string[];
+    tokens: {
+        light: Record<string, string>;
+        dark: Record<string, string>;
+    };
+};
+declare const uiThemePresets: readonly [{
+    readonly id: "ocean";
+    readonly label: "Ocean Glass";
+    readonly description: "Blue-cyan preset with clean glass surfaces. Matches the current default visual language.";
+    readonly recommendedFor: ["Admin dashboards", "SaaS CRUD screens", "Projects that want the existing package look"];
+    readonly tokens: {
+        readonly light: {
+            readonly '--tw-background': "0 0% 100%";
+            readonly '--tw-foreground': "222.2 47.4% 11.2%";
+            readonly '--tw-primary': "221.2 83.2% 53.3%";
+            readonly '--tw-accent': "199 89% 48%";
+            readonly '--tw-success': "142.1 76.2% 36.3%";
+            readonly '--tw-destructive': "0 84.2% 60.2%";
+            readonly '--tw-border': "214.3 31.8% 91.4%";
+            readonly '--radius': "0.75rem";
+            readonly '--surface': "rgba(255, 255, 255, 0.92)";
+            readonly '--surface-strong': "rgba(241, 245, 249, 0.96)";
+            readonly '--grey': "rgba(248, 250, 252, 0.96)";
+            readonly '--grey-strong': "rgba(241, 245, 249, 0.98)";
+            readonly '--shadow-sm': "0 10px 28px -18px rgba(15, 23, 42, 0.22)";
+            readonly '--shadow': "0 24px 60px -28px rgba(15, 23, 42, 0.3)";
+            readonly '--primary-grad-from': "199 89% 48%";
+            readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+        };
+        readonly dark: {
+            readonly '--tw-background': "222.2 84% 4.9%";
+            readonly '--tw-foreground': "210 40% 98%";
+            readonly '--tw-primary': "217.2 91.2% 59.8%";
+            readonly '--tw-accent': "199 89% 48%";
+            readonly '--tw-success': "142.1 70.6% 45.3%";
+            readonly '--tw-destructive': "0 62.8% 30.6%";
+            readonly '--tw-border': "217.2 32.6% 17.5%";
+            readonly '--radius': "0.75rem";
+            readonly '--surface': "rgba(15, 23, 42, 0.78)";
+            readonly '--surface-strong': "rgba(30, 41, 59, 0.92)";
+            readonly '--grey': "rgba(30, 41, 59, 0.88)";
+            readonly '--grey-strong': "rgba(51, 65, 85, 0.92)";
+            readonly '--shadow-sm': "0 16px 32px -18px rgba(2, 6, 23, 0.48)";
+            readonly '--shadow': "0 28px 80px -32px rgba(2, 6, 23, 0.7)";
+            readonly '--primary-grad-from': "198.6 88.7% 48.4%";
+            readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+        };
+    };
+}, {
+    readonly id: "sunset";
+    readonly label: "Sunset Ember";
+    readonly description: "Warm orange-coral preset with softer cream surfaces for branded landing or growth products.";
+    readonly recommendedFor: ["Growth products", "Commerce backoffices", "Projects that want a warmer visual tone"];
+    readonly tokens: {
+        readonly light: {
+            readonly '--tw-background': "30 100% 98%";
+            readonly '--tw-foreground': "20 24% 14%";
+            readonly '--tw-primary': "14 90% 56%";
+            readonly '--tw-accent': "29 100% 58%";
+            readonly '--tw-success': "145 63% 38%";
+            readonly '--tw-destructive': "0 78% 58%";
+            readonly '--tw-border': "24 45% 89%";
+            readonly '--radius': "0.85rem";
+            readonly '--surface': "rgba(255, 247, 240, 0.92)";
+            readonly '--surface-strong': "rgba(255, 237, 223, 0.96)";
+            readonly '--grey': "rgba(255, 243, 231, 0.96)";
+            readonly '--grey-strong': "rgba(255, 232, 214, 0.98)";
+            readonly '--shadow-sm': "0 12px 30px -18px rgba(194, 65, 12, 0.18)";
+            readonly '--shadow': "0 28px 64px -30px rgba(154, 52, 18, 0.24)";
+            readonly '--primary-grad-from': "29 100% 58%";
+            readonly '--primary-grad-to': "14 90% 56%";
+        };
+        readonly dark: {
+            readonly '--tw-background': "20 24% 8%";
+            readonly '--tw-foreground': "40 33% 96%";
+            readonly '--tw-primary': "18 100% 62%";
+            readonly '--tw-accent': "35 100% 58%";
+            readonly '--tw-success': "145 60% 47%";
+            readonly '--tw-destructive': "0 73% 52%";
+            readonly '--tw-border': "18 24% 22%";
+            readonly '--radius': "0.85rem";
+            readonly '--surface': "rgba(41, 24, 18, 0.84)";
+            readonly '--surface-strong': "rgba(59, 34, 24, 0.9)";
+            readonly '--grey': "rgba(70, 42, 29, 0.88)";
+            readonly '--grey-strong': "rgba(92, 54, 38, 0.9)";
+            readonly '--shadow-sm': "0 18px 36px -20px rgba(67, 20, 7, 0.48)";
+            readonly '--shadow': "0 30px 84px -34px rgba(67, 20, 7, 0.62)";
+            readonly '--primary-grad-from': "35 100% 58%";
+            readonly '--primary-grad-to': "18 100% 62%";
+        };
+    };
+}, {
+    readonly id: "forest";
+    readonly label: "Forest Mist";
+    readonly description: "Emerald-teal preset with soft botanical surfaces for calmer productivity products.";
+    readonly recommendedFor: ["Operations tools", "Internal platforms", "Products that want a calmer green tone"];
+    readonly tokens: {
+        readonly light: {
+            readonly '--tw-background': "138 40% 98%";
+            readonly '--tw-foreground': "160 25% 14%";
+            readonly '--tw-primary': "158 64% 40%";
+            readonly '--tw-accent': "173 58% 44%";
+            readonly '--tw-success': "145 63% 36%";
+            readonly '--tw-destructive': "0 78% 58%";
+            readonly '--tw-border': "143 21% 88%";
+            readonly '--radius': "0.8rem";
+            readonly '--surface': "rgba(245, 252, 249, 0.92)";
+            readonly '--surface-strong': "rgba(232, 245, 239, 0.96)";
+            readonly '--grey': "rgba(240, 248, 244, 0.96)";
+            readonly '--grey-strong': "rgba(225, 240, 232, 0.98)";
+            readonly '--shadow-sm': "0 12px 28px -18px rgba(5, 86, 66, 0.18)";
+            readonly '--shadow': "0 26px 62px -30px rgba(6, 78, 59, 0.24)";
+            readonly '--primary-grad-from': "173 58% 44%";
+            readonly '--primary-grad-to': "158 64% 40%";
+        };
+        readonly dark: {
+            readonly '--tw-background': "164 35% 8%";
+            readonly '--tw-foreground': "144 35% 96%";
+            readonly '--tw-primary': "160 70% 46%";
+            readonly '--tw-accent': "174 72% 45%";
+            readonly '--tw-success': "145 68% 46%";
+            readonly '--tw-destructive': "0 70% 52%";
+            readonly '--tw-border': "160 20% 20%";
+            readonly '--radius': "0.8rem";
+            readonly '--surface': "rgba(16, 36, 31, 0.84)";
+            readonly '--surface-strong': "rgba(21, 51, 44, 0.9)";
+            readonly '--grey': "rgba(24, 61, 52, 0.88)";
+            readonly '--grey-strong': "rgba(31, 77, 65, 0.9)";
+            readonly '--shadow-sm': "0 18px 34px -20px rgba(1, 44, 34, 0.48)";
+            readonly '--shadow': "0 30px 82px -34px rgba(1, 44, 34, 0.6)";
+            readonly '--primary-grad-from': "174 72% 45%";
+            readonly '--primary-grad-to': "160 70% 46%";
+        };
+    };
+}, {
+    readonly id: "graphite";
+    readonly label: "Graphite Pulse";
+    readonly description: "Neutral slate preset with restrained blue accents for products that need a steadier enterprise tone.";
+    readonly recommendedFor: ["Enterprise admin panels", "B2B internal tools", "Projects that want a more neutral interface"];
+    readonly tokens: {
+        readonly light: {
+            readonly '--tw-background': "220 18% 97%";
+            readonly '--tw-foreground': "222 24% 14%";
+            readonly '--tw-primary': "221 24% 32%";
+            readonly '--tw-accent': "198 83% 44%";
+            readonly '--tw-success': "160 56% 38%";
+            readonly '--tw-destructive': "0 72% 54%";
+            readonly '--tw-border': "218 17% 86%";
+            readonly '--radius': "0.7rem";
+            readonly '--surface': "rgba(248, 250, 252, 0.94)";
+            readonly '--surface-strong': "rgba(226, 232, 240, 0.96)";
+            readonly '--grey': "rgba(241, 245, 249, 0.98)";
+            readonly '--grey-strong': "rgba(226, 232, 240, 0.99)";
+            readonly '--shadow-sm': "0 12px 30px -20px rgba(15, 23, 42, 0.18)";
+            readonly '--shadow': "0 28px 66px -30px rgba(15, 23, 42, 0.24)";
+            readonly '--primary-grad-from': "198 83% 44%";
+            readonly '--primary-grad-to': "221 24% 32%";
+        };
+        readonly dark: {
+            readonly '--tw-background': "222 32% 8%";
+            readonly '--tw-foreground': "210 25% 96%";
+            readonly '--tw-primary': "210 24% 82%";
+            readonly '--tw-accent': "192 92% 52%";
+            readonly '--tw-success': "158 64% 45%";
+            readonly '--tw-destructive': "0 72% 56%";
+            readonly '--tw-border': "217 19% 24%";
+            readonly '--radius': "0.7rem";
+            readonly '--surface': "rgba(15, 23, 42, 0.82)";
+            readonly '--surface-strong': "rgba(30, 41, 59, 0.92)";
+            readonly '--grey': "rgba(30, 41, 59, 0.9)";
+            readonly '--grey-strong': "rgba(51, 65, 85, 0.92)";
+            readonly '--shadow-sm': "0 18px 38px -22px rgba(2, 6, 23, 0.48)";
+            readonly '--shadow': "0 32px 88px -34px rgba(2, 6, 23, 0.68)";
+            readonly '--primary-grad-from': "192 92% 52%";
+            readonly '--primary-grad-to': "210 24% 82%";
+        };
+    };
+}];
+declare const uiDefaultThemePreset: {
+    readonly id: "ocean";
+    readonly label: "Ocean Glass";
+    readonly description: "Blue-cyan preset with clean glass surfaces. Matches the current default visual language.";
+    readonly recommendedFor: ["Admin dashboards", "SaaS CRUD screens", "Projects that want the existing package look"];
+    readonly tokens: {
+        readonly light: {
+            readonly '--tw-background': "0 0% 100%";
+            readonly '--tw-foreground': "222.2 47.4% 11.2%";
+            readonly '--tw-primary': "221.2 83.2% 53.3%";
+            readonly '--tw-accent': "199 89% 48%";
+            readonly '--tw-success': "142.1 76.2% 36.3%";
+            readonly '--tw-destructive': "0 84.2% 60.2%";
+            readonly '--tw-border': "214.3 31.8% 91.4%";
+            readonly '--radius': "0.75rem";
+            readonly '--surface': "rgba(255, 255, 255, 0.92)";
+            readonly '--surface-strong': "rgba(241, 245, 249, 0.96)";
+            readonly '--grey': "rgba(248, 250, 252, 0.96)";
+            readonly '--grey-strong': "rgba(241, 245, 249, 0.98)";
+            readonly '--shadow-sm': "0 10px 28px -18px rgba(15, 23, 42, 0.22)";
+            readonly '--shadow': "0 24px 60px -28px rgba(15, 23, 42, 0.3)";
+            readonly '--primary-grad-from': "199 89% 48%";
+            readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+        };
+        readonly dark: {
+            readonly '--tw-background': "222.2 84% 4.9%";
+            readonly '--tw-foreground': "210 40% 98%";
+            readonly '--tw-primary': "217.2 91.2% 59.8%";
+            readonly '--tw-accent': "199 89% 48%";
+            readonly '--tw-success': "142.1 70.6% 45.3%";
+            readonly '--tw-destructive': "0 62.8% 30.6%";
+            readonly '--tw-border': "217.2 32.6% 17.5%";
+            readonly '--radius': "0.75rem";
+            readonly '--surface': "rgba(15, 23, 42, 0.78)";
+            readonly '--surface-strong': "rgba(30, 41, 59, 0.92)";
+            readonly '--grey': "rgba(30, 41, 59, 0.88)";
+            readonly '--grey-strong': "rgba(51, 65, 85, 0.92)";
+            readonly '--shadow-sm': "0 16px 32px -18px rgba(2, 6, 23, 0.48)";
+            readonly '--shadow': "0 28px 80px -32px rgba(2, 6, 23, 0.7)";
+            readonly '--primary-grad-from': "198.6 88.7% 48.4%";
+            readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+        };
+    };
+};
+declare const uiThemeContract: {
+    readonly packageName: "@lucasvu/scope-ui";
+    readonly importOrder: readonly ["import '@lucasvu/scope-ui/styles.css'", "import './styles/ui-theme.css'"];
+    readonly selectors: {
+        readonly light: readonly [":root", "[data-ui-theme='light']"];
+        readonly dark: readonly [".dark", "[data-ui-theme='dark']"];
+    };
+    readonly overrideFile: "src/styles/ui-theme.css";
+    readonly defaultPreset: "ocean";
+    readonly presets: readonly [{
+        readonly id: "ocean";
+        readonly label: "Ocean Glass";
+        readonly description: "Blue-cyan preset with clean glass surfaces. Matches the current default visual language.";
+        readonly recommendedFor: ["Admin dashboards", "SaaS CRUD screens", "Projects that want the existing package look"];
+        readonly tokens: {
+            readonly light: {
+                readonly '--tw-background': "0 0% 100%";
+                readonly '--tw-foreground': "222.2 47.4% 11.2%";
+                readonly '--tw-primary': "221.2 83.2% 53.3%";
+                readonly '--tw-accent': "199 89% 48%";
+                readonly '--tw-success': "142.1 76.2% 36.3%";
+                readonly '--tw-destructive': "0 84.2% 60.2%";
+                readonly '--tw-border': "214.3 31.8% 91.4%";
+                readonly '--radius': "0.75rem";
+                readonly '--surface': "rgba(255, 255, 255, 0.92)";
+                readonly '--surface-strong': "rgba(241, 245, 249, 0.96)";
+                readonly '--grey': "rgba(248, 250, 252, 0.96)";
+                readonly '--grey-strong': "rgba(241, 245, 249, 0.98)";
+                readonly '--shadow-sm': "0 10px 28px -18px rgba(15, 23, 42, 0.22)";
+                readonly '--shadow': "0 24px 60px -28px rgba(15, 23, 42, 0.3)";
+                readonly '--primary-grad-from': "199 89% 48%";
+                readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+            };
+            readonly dark: {
+                readonly '--tw-background': "222.2 84% 4.9%";
+                readonly '--tw-foreground': "210 40% 98%";
+                readonly '--tw-primary': "217.2 91.2% 59.8%";
+                readonly '--tw-accent': "199 89% 48%";
+                readonly '--tw-success': "142.1 70.6% 45.3%";
+                readonly '--tw-destructive': "0 62.8% 30.6%";
+                readonly '--tw-border': "217.2 32.6% 17.5%";
+                readonly '--radius': "0.75rem";
+                readonly '--surface': "rgba(15, 23, 42, 0.78)";
+                readonly '--surface-strong': "rgba(30, 41, 59, 0.92)";
+                readonly '--grey': "rgba(30, 41, 59, 0.88)";
+                readonly '--grey-strong': "rgba(51, 65, 85, 0.92)";
+                readonly '--shadow-sm': "0 16px 32px -18px rgba(2, 6, 23, 0.48)";
+                readonly '--shadow': "0 28px 80px -32px rgba(2, 6, 23, 0.7)";
+                readonly '--primary-grad-from': "198.6 88.7% 48.4%";
+                readonly '--primary-grad-to': "221.2 83.2% 53.3%";
+            };
+        };
+    }, {
+        readonly id: "sunset";
+        readonly label: "Sunset Ember";
+        readonly description: "Warm orange-coral preset with softer cream surfaces for branded landing or growth products.";
+        readonly recommendedFor: ["Growth products", "Commerce backoffices", "Projects that want a warmer visual tone"];
+        readonly tokens: {
+            readonly light: {
+                readonly '--tw-background': "30 100% 98%";
+                readonly '--tw-foreground': "20 24% 14%";
+                readonly '--tw-primary': "14 90% 56%";
+                readonly '--tw-accent': "29 100% 58%";
+                readonly '--tw-success': "145 63% 38%";
+                readonly '--tw-destructive': "0 78% 58%";
+                readonly '--tw-border': "24 45% 89%";
+                readonly '--radius': "0.85rem";
+                readonly '--surface': "rgba(255, 247, 240, 0.92)";
+                readonly '--surface-strong': "rgba(255, 237, 223, 0.96)";
+                readonly '--grey': "rgba(255, 243, 231, 0.96)";
+                readonly '--grey-strong': "rgba(255, 232, 214, 0.98)";
+                readonly '--shadow-sm': "0 12px 30px -18px rgba(194, 65, 12, 0.18)";
+                readonly '--shadow': "0 28px 64px -30px rgba(154, 52, 18, 0.24)";
+                readonly '--primary-grad-from': "29 100% 58%";
+                readonly '--primary-grad-to': "14 90% 56%";
+            };
+            readonly dark: {
+                readonly '--tw-background': "20 24% 8%";
+                readonly '--tw-foreground': "40 33% 96%";
+                readonly '--tw-primary': "18 100% 62%";
+                readonly '--tw-accent': "35 100% 58%";
+                readonly '--tw-success': "145 60% 47%";
+                readonly '--tw-destructive': "0 73% 52%";
+                readonly '--tw-border': "18 24% 22%";
+                readonly '--radius': "0.85rem";
+                readonly '--surface': "rgba(41, 24, 18, 0.84)";
+                readonly '--surface-strong': "rgba(59, 34, 24, 0.9)";
+                readonly '--grey': "rgba(70, 42, 29, 0.88)";
+                readonly '--grey-strong': "rgba(92, 54, 38, 0.9)";
+                readonly '--shadow-sm': "0 18px 36px -20px rgba(67, 20, 7, 0.48)";
+                readonly '--shadow': "0 30px 84px -34px rgba(67, 20, 7, 0.62)";
+                readonly '--primary-grad-from': "35 100% 58%";
+                readonly '--primary-grad-to': "18 100% 62%";
+            };
+        };
+    }, {
+        readonly id: "forest";
+        readonly label: "Forest Mist";
+        readonly description: "Emerald-teal preset with soft botanical surfaces for calmer productivity products.";
+        readonly recommendedFor: ["Operations tools", "Internal platforms", "Products that want a calmer green tone"];
+        readonly tokens: {
+            readonly light: {
+                readonly '--tw-background': "138 40% 98%";
+                readonly '--tw-foreground': "160 25% 14%";
+                readonly '--tw-primary': "158 64% 40%";
+                readonly '--tw-accent': "173 58% 44%";
+                readonly '--tw-success': "145 63% 36%";
+                readonly '--tw-destructive': "0 78% 58%";
+                readonly '--tw-border': "143 21% 88%";
+                readonly '--radius': "0.8rem";
+                readonly '--surface': "rgba(245, 252, 249, 0.92)";
+                readonly '--surface-strong': "rgba(232, 245, 239, 0.96)";
+                readonly '--grey': "rgba(240, 248, 244, 0.96)";
+                readonly '--grey-strong': "rgba(225, 240, 232, 0.98)";
+                readonly '--shadow-sm': "0 12px 28px -18px rgba(5, 86, 66, 0.18)";
+                readonly '--shadow': "0 26px 62px -30px rgba(6, 78, 59, 0.24)";
+                readonly '--primary-grad-from': "173 58% 44%";
+                readonly '--primary-grad-to': "158 64% 40%";
+            };
+            readonly dark: {
+                readonly '--tw-background': "164 35% 8%";
+                readonly '--tw-foreground': "144 35% 96%";
+                readonly '--tw-primary': "160 70% 46%";
+                readonly '--tw-accent': "174 72% 45%";
+                readonly '--tw-success': "145 68% 46%";
+                readonly '--tw-destructive': "0 70% 52%";
+                readonly '--tw-border': "160 20% 20%";
+                readonly '--radius': "0.8rem";
+                readonly '--surface': "rgba(16, 36, 31, 0.84)";
+                readonly '--surface-strong': "rgba(21, 51, 44, 0.9)";
+                readonly '--grey': "rgba(24, 61, 52, 0.88)";
+                readonly '--grey-strong': "rgba(31, 77, 65, 0.9)";
+                readonly '--shadow-sm': "0 18px 34px -20px rgba(1, 44, 34, 0.48)";
+                readonly '--shadow': "0 30px 82px -34px rgba(1, 44, 34, 0.6)";
+                readonly '--primary-grad-from': "174 72% 45%";
+                readonly '--primary-grad-to': "160 70% 46%";
+            };
+        };
+    }, {
+        readonly id: "graphite";
+        readonly label: "Graphite Pulse";
+        readonly description: "Neutral slate preset with restrained blue accents for products that need a steadier enterprise tone.";
+        readonly recommendedFor: ["Enterprise admin panels", "B2B internal tools", "Projects that want a more neutral interface"];
+        readonly tokens: {
+            readonly light: {
+                readonly '--tw-background': "220 18% 97%";
+                readonly '--tw-foreground': "222 24% 14%";
+                readonly '--tw-primary': "221 24% 32%";
+                readonly '--tw-accent': "198 83% 44%";
+                readonly '--tw-success': "160 56% 38%";
+                readonly '--tw-destructive': "0 72% 54%";
+                readonly '--tw-border': "218 17% 86%";
+                readonly '--radius': "0.7rem";
+                readonly '--surface': "rgba(248, 250, 252, 0.94)";
+                readonly '--surface-strong': "rgba(226, 232, 240, 0.96)";
+                readonly '--grey': "rgba(241, 245, 249, 0.98)";
+                readonly '--grey-strong': "rgba(226, 232, 240, 0.99)";
+                readonly '--shadow-sm': "0 12px 30px -20px rgba(15, 23, 42, 0.18)";
+                readonly '--shadow': "0 28px 66px -30px rgba(15, 23, 42, 0.24)";
+                readonly '--primary-grad-from': "198 83% 44%";
+                readonly '--primary-grad-to': "221 24% 32%";
+            };
+            readonly dark: {
+                readonly '--tw-background': "222 32% 8%";
+                readonly '--tw-foreground': "210 25% 96%";
+                readonly '--tw-primary': "210 24% 82%";
+                readonly '--tw-accent': "192 92% 52%";
+                readonly '--tw-success': "158 64% 45%";
+                readonly '--tw-destructive': "0 72% 56%";
+                readonly '--tw-border': "217 19% 24%";
+                readonly '--radius': "0.7rem";
+                readonly '--surface': "rgba(15, 23, 42, 0.82)";
+                readonly '--surface-strong': "rgba(30, 41, 59, 0.92)";
+                readonly '--grey': "rgba(30, 41, 59, 0.9)";
+                readonly '--grey-strong': "rgba(51, 65, 85, 0.92)";
+                readonly '--shadow-sm': "0 18px 38px -22px rgba(2, 6, 23, 0.48)";
+                readonly '--shadow': "0 32px 88px -34px rgba(2, 6, 23, 0.68)";
+                readonly '--primary-grad-from': "192 92% 52%";
+                readonly '--primary-grad-to': "210 24% 82%";
+            };
+        };
+    }];
+    readonly rules: readonly ["Import the package stylesheet before your project theme override stylesheet.", "Choose one approved preset and keep the entire project on that preset instead of mixing palettes page by page.", "Override tokens in one shared theme file instead of scattering colors across components.", "Use :root for the default light theme and .dark or [data-ui-theme='dark'] for dark theme.", "Only override tokens declared here. Do not patch component internals unless you are extending the library.", "For AI-generated screens, choose one theme source of truth and keep component code token-driven."];
+    readonly tokens: {
+        name: string;
+        description: string;
+        defaultLight: string;
+        defaultDark: string;
+        usedBy: string[];
+    }[];
+    readonly exampleCss: string;
+};
+declare const uiProjectAiRules: readonly ["Use @lucasvu/scope-ui as the default UI library for React projects, or @lucasvu/scope-ui/core for framework-agnostic theme/runtime usage.", "Import @lucasvu/scope-ui/styles.css once at the app entry.", "Import the project override theme file after the package stylesheet or bundled theme layer.", "Stay inside the approved theme preset declared by the project and do not invent a second palette.", "Read uiAiManifest to choose the correct component by intent before coding.", "Read uiThemeContract and uiThemeLayerAssets before changing colors, shadows, radius, or theme behavior.", "Prefer root exports and avoid MainFe unless the task explicitly targets a legacy screen."];
+
+type UiThemeLayerAsset = {
+    id: string;
+    label: string;
+    importPath: string;
+    activation: 'global' | 'data-client-theme';
+    clientThemeAttributeValue?: string;
+    description: string;
+    recommendedFor: string[];
+};
+declare const uiThemeLayerAssets: readonly [{
+    readonly id: "default";
+    readonly label: "Theme Default";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-default.css";
+    readonly activation: "global";
+    readonly description: "Global default token layer close to the legacy shared theme baseline.";
+    readonly recommendedFor: ["Projects that want a direct global theme layer without extra setup", "Legacy migrations"];
+}, {
+    readonly id: "new-main-fe";
+    readonly label: "New Main FE";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-new-main-fe.css";
+    readonly activation: "global";
+    readonly description: "Global Argon-inspired shell layer that works immediately after import.";
+    readonly recommendedFor: ["Admin shells", "Projects that want the current shared main-fe tone"];
+}, {
+    readonly id: "citrus-ink";
+    readonly label: "Citrus Ink";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-citrus-ink.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "citrus-ink";
+    readonly description: "High-contrast graphite theme with mint and citrus accents.";
+    readonly recommendedFor: ["Brand-heavy dashboards"];
+}, {
+    readonly id: "facebook-blue";
+    readonly label: "Facebook Blue";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-facebook-blue.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "facebook-blue";
+    readonly description: "Blue-first neutral theme tuned around a familiar social palette.";
+    readonly recommendedFor: ["Blue-branded products"];
+}, {
+    readonly id: "neo-slate";
+    readonly label: "Neo Slate";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-neo-slate.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "neo-slate";
+    readonly description: "Modern slate-indigo workspace theme with richer shell tokens.";
+    readonly recommendedFor: ["Contemporary SaaS dashboards", "Modern admin shells"];
+}, {
+    readonly id: "siraya-brand";
+    readonly label: "Siraya Brand Sunset";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-new-main-fe-sunset.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "siraya-brand";
+    readonly description: "Warm branded shell with typography and page-slot overrides.";
+    readonly recommendedFor: ["Brand-led marketing or hybrid product shells"];
+}, {
+    readonly id: "pure-white";
+    readonly label: "Pure White";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-pure-white.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "pure-white";
+    readonly description: "Clean white workspace theme with cobalt accents.";
+    readonly recommendedFor: ["Minimalist backoffices"];
+}, {
+    readonly id: "siraya-vii-light";
+    readonly label: "Siraya VII Light";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-siraya-vii-light.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "siraya-vii-light";
+    readonly description: "Light brand system based on the Siraya VII palette.";
+    readonly recommendedFor: ["Brand refresh experiments"];
+}, {
+    readonly id: "solstice-pop";
+    readonly label: "Solstice Pop";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-solstice-pop.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "solstice-pop";
+    readonly description: "Editorial warm-stone theme with stronger typography direction.";
+    readonly recommendedFor: ["Content-heavy dashboards"];
+}, {
+    readonly id: "uat-aurora";
+    readonly label: "UAT Aurora";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-uat-aurora.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "uat-aurora";
+    readonly description: "Soft slate-blue experimental theme using the same token structure as sunset.";
+    readonly recommendedFor: ["UAT or staging environments", "Blue-toned shells"];
+}, {
+    readonly id: "custom-crisp";
+    readonly label: "Custom Crisp";
+    readonly importPath: "@lucasvu/scope-ui/themes/theme-ui-custom-crisp.css";
+    readonly activation: "data-client-theme";
+    readonly clientThemeAttributeValue: "*";
+    readonly description: "Cross-theme typography and control crispness overrides for client-theme-driven shells.";
+    readonly recommendedFor: ["Attribute-scoped client themes that need sharper controls"];
+}];
+
+declare const ROOT_COLOR_MODE_ATTRIBUTE = "data-ui-color-mode";
+declare const ROOT_CLIENT_THEME_ATTRIBUTE = "data-client-theme";
+type ColorMode = 'light' | 'dark';
+declare const isColorMode: (value: unknown) => value is ColorMode;
+declare const getSystemColorMode: () => ColorMode;
+declare const applyDocumentColorMode: (colorMode: ColorMode) => void;
+declare const initializeDocumentColorMode: (colorMode?: ColorMode) => ColorMode;
+declare const subscribeToSystemColorMode: (listener: (colorMode: ColorMode) => void) => () => void;
+declare const syncDocumentColorModeToSystem: () => () => void;
+declare const applyDocumentClientTheme: (themeId: string | null | undefined) => void;
+
+type ClassValue = string | false | null | undefined;
+declare function cn(...values: ClassValue[]): string;
+
+export { type ColorMode, ROOT_CLIENT_THEME_ATTRIBUTE, ROOT_COLOR_MODE_ATTRIBUTE, type UiAiComponentDescriptor, type UiAiComponentProp, type UiScreenBriefField, type UiScreenKind, type UiThemeLayerAsset, type UiThemePreset, type UiThemeToken, applyDocumentClientTheme, applyDocumentColorMode, cn, getSystemColorMode, initializeDocumentColorMode, isColorMode, subscribeToSystemColorMode, syncDocumentColorModeToSystem, uiAiManifest, uiDefaultThemePreset, uiProjectAiRules, uiScreenBlueprint, uiScreenBriefFields, uiThemeContract, uiThemeLayerAssets, uiThemePresets };