convex-cms 0.0.9-alpha.7 → 0.0.9-alpha.8

package/admin/src/embed/components/EmbedLayout.tsx

@@ -3,6 +3,7 @@
  *
  * A router-agnostic layout for the embedded admin that uses
  * EmbedSidebar instead of the router-dependent Sidebar.
+ * Uses CSS Grid for proper container-relative positioning.
  */
 
 import type { ReactNode } from "react";
@@ -18,9 +19,12 @@ export function EmbedLayout({ children }: EmbedLayoutProps) {
   const { layout } = useAdminConfig();
 
   return (
-    <div className="flex min-h-screen bg-background">
+    <div
+      className="grid h-full bg-background"
+      style={{ gridTemplateColumns: `${layout.sidebarWidth}px 1fr` }}
+    >
       <EmbedSidebar />
-      <div className="flex flex-1 flex-col" style={{ marginLeft: layout.sidebarWidth }}>
+      <div className="flex flex-col overflow-hidden">
         <EmbedHeader />
         <main className="flex-1 overflow-auto p-6">{children}</main>
       </div>

package/admin/src/embed/components/EmbedSidebar.tsx

@@ -36,7 +36,9 @@ function pathToRoute(path: string): EmbedRoute {
 export function EmbedSidebar() {
   const { currentPath, navigate, navigateToContentType } = useEmbedNavigation();
   const config = useAdminConfig();
-  const { navItems, branding, layout } = config;
+  const { navItems, branding,
+    // layout
+  } = config;
   const api = useApi();
 
   const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
@@ -152,14 +154,9 @@ export function EmbedSidebar() {
     </Collapsible>
   );
 
-  const sidebarWidth = layout.sidebarWidth;
-
   return (
     <>
-      <aside
-        className="fixed inset-y-0 left-0 z-50 flex flex-col border-r border-sidebar-border bg-sidebar"
-        style={{ width: sidebarWidth }}
-      >
+      <aside className="sticky top-0 z-40 flex h-full flex-col overflow-hidden border-r border-sidebar-border bg-sidebar">
         <div className="flex h-14 items-center gap-2 border-b border-sidebar-border px-4">
           <button
             type="button"

package/admin/src/embed/index.tsx

@@ -46,6 +46,7 @@ import {
 import { ThemeProvider } from "../contexts/ThemeContext";
 import { RouteGuard } from "../components/RouteGuard";
 import { resolveAdminConfig } from "../lib/admin-config";
+import { cn } from "../lib/cn";
 import type { CmsAdminProps, CmsAdminAuthConfig } from "./types";
 import { ApiProvider } from "./contexts/ApiContext";
 import {
@@ -127,6 +128,7 @@ export function CmsAdmin({
   auth,
   basePath = "/admin",
   className,
+  themeMode = "isolated",
   initialRoute = "dashboard",
   onNavigate,
 }: CmsAdminProps & {
@@ -143,7 +145,10 @@ export function CmsAdmin({
 
   if (!convex) {
     return (
-      <div className="flex min-h-full items-center justify-center bg-background p-6">
+      <div
+        className={cn("flex h-full items-center justify-center bg-background p-6", className)}
+        data-cms-admin={themeMode}
+      >
         <div className="diff-modified max-w-lg space-y-4 rounded-lg border p-6 text-center">
           <h2 className="text-xl font-semibold text-diff-modified">
             ConvexProvider Required
@@ -158,7 +163,7 @@ export function CmsAdmin({
   }
 
   return (
-    <div className={className}>
+    <div className={cn("h-full", className)} data-cms-admin={themeMode}>
       <ApiProvider api={api}>
         <ThemeProvider>
           <SettingsConfigProvider baseConfig={adminConfig} api={settingsApi}>
@@ -173,9 +178,7 @@ export function CmsAdmin({
                 onNavigate={onNavigate}
               >
                 <RouteGuard>
-                  <div className="min-h-screen">
-                    <EmbedRouter />
-                  </div>
+                  <EmbedRouter />
                 </RouteGuard>
               </EmbedNavigationProvider>
             </AuthProvider>

package/admin/src/embed/types.ts

@@ -20,4 +20,10 @@ export interface CmsAdminProps {
   auth: CmsAdminAuthConfig;
   basePath?: string;
   className?: string;
+  /**
+   * Theme mode for CSS variable scoping:
+   * - 'isolated' (default): Admin uses its own theme, ignores parent app styles
+   * - 'inherit': Admin inherits parent app's CSS variables (for shadcn apps)
+   */
+  themeMode?: "isolated" | "inherit";
 }

package/admin/src/styles/globals.css

@@ -12,12 +12,21 @@
     @apply border-border;
   }
 
+  /* Standalone mode - admin owns the document */
   body {
     @apply bg-background text-foreground;
     font-feature-settings: 'rlig' 1, 'calt' 1;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
   }
+
+  /* Embedded mode - scope styles to container */
+  [data-cms-admin] {
+    @apply bg-background text-foreground;
+    font-feature-settings: 'rlig' 1, 'calt' 1;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
 }
 
 @layer utilities {

package/admin/src/styles/theme.css

@@ -2,10 +2,13 @@
    CMS Admin Theme - CSS Custom Properties
    Professional & Clean (Linear/Notion aesthetic)
 
-   Consumers can import this file and override
-   any variable in their own :root {} block.
+   Theme modes:
+   - Standalone: Uses :root for the entire document
+   - Isolated (embedded): Admin uses its own theme via [data-cms-admin="isolated"]
+   - Inherit (embedded): Admin inherits parent's colors via [data-cms-admin="inherit"]
    ============================================ */
 
+/* Standalone mode - admin owns the document */
 :root {
   /* Main colors */
   --background: hsl(0 0% 98%);
@@ -64,7 +67,106 @@
   --info-foreground: hsl(217 91% 30%);
 }
 
-.dark {
+/* Isolated mode - forces admin's own theme, ignores parent styles */
+[data-cms-admin="isolated"] {
+  /* Main colors */
+  --background: hsl(0 0% 98%);
+  --foreground: hsl(240 10% 3.9%);
+  --card: hsl(0 0% 100%);
+  --card-foreground: hsl(240 10% 3.9%);
+  --popover: hsl(0 0% 100%);
+  --popover-foreground: hsl(240 10% 3.9%);
+  --primary: hsl(240 5.9% 10%);
+  --primary-foreground: hsl(0 0% 98%);
+  --secondary: hsl(240 4.8% 95.9%);
+  --secondary-foreground: hsl(240 5.9% 10%);
+  --muted: hsl(240 4.8% 95.9%);
+  --muted-foreground: hsl(240 3.8% 46.1%);
+  --accent: hsl(240 4.8% 95.9%);
+  --accent-foreground: hsl(240 5.9% 10%);
+  --destructive: hsl(0 84.2% 60.2%);
+  --destructive-foreground: hsl(0 0% 98%);
+  --border: hsl(240 5.9% 90%);
+  --input: hsl(240 5.9% 90%);
+  --ring: hsl(240 5.9% 10%);
+
+  /* Sidebar */
+  --sidebar: hsl(0 0% 98%);
+  --sidebar-foreground: hsl(240 5.3% 26.1%);
+  --sidebar-primary: hsl(240 5.9% 10%);
+  --sidebar-primary-foreground: hsl(0 0% 98%);
+  --sidebar-accent: hsl(240 4.8% 95.9%);
+  --sidebar-accent-foreground: hsl(240 5.9% 10%);
+  --sidebar-border: hsl(220 13% 91%);
+  --sidebar-ring: hsl(217.2 91.2% 59.8%);
+
+  /* Semantic: Diff/Change indicators */
+  --diff-added: hsl(142 76% 36%);
+  --diff-added-bg: hsl(142 76% 95%);
+  --diff-added-border: hsl(142 76% 85%);
+  --diff-added-foreground: hsl(142 76% 25%);
+
+  --diff-removed: hsl(0 84% 60%);
+  --diff-removed-bg: hsl(0 86% 97%);
+  --diff-removed-border: hsl(0 93% 85%);
+  --diff-removed-foreground: hsl(0 72% 30%);
+
+  --diff-modified: hsl(38 92% 50%);
+  --diff-modified-bg: hsl(48 96% 97%);
+  --diff-modified-border: hsl(48 96% 82%);
+  --diff-modified-foreground: hsl(38 92% 25%);
+
+  /* Semantic: Success/Warning/Info states */
+  --success: hsl(142 76% 36%);
+  --success-foreground: hsl(0 0% 100%);
+  --warning: hsl(38 92% 50%);
+  --warning-foreground: hsl(0 0% 100%);
+  --info: hsl(217 91% 60%);
+  --info-bg: hsl(214 95% 97%);
+  --info-foreground: hsl(217 91% 30%);
+}
+
+/* Inherit mode - uses parent's colors with fallbacks for layout */
+[data-cms-admin="inherit"] {
+  /* Sidebar variables with fallbacks (prevents broken layout) */
+  --sidebar: var(--sidebar, hsl(0 0% 98%));
+  --sidebar-foreground: var(--sidebar-foreground, hsl(240 5.3% 26.1%));
+  --sidebar-primary: var(--sidebar-primary, hsl(240 5.9% 10%));
+  --sidebar-primary-foreground: var(--sidebar-primary-foreground, hsl(0 0% 98%));
+  --sidebar-accent: var(--sidebar-accent, hsl(240 4.8% 95.9%));
+  --sidebar-accent-foreground: var(--sidebar-accent-foreground, hsl(240 5.9% 10%));
+  --sidebar-border: var(--sidebar-border, hsl(220 13% 91%));
+  --sidebar-ring: var(--sidebar-ring, hsl(217.2 91.2% 59.8%));
+
+  /* Semantic variables with fallbacks */
+  --diff-added: var(--diff-added, hsl(142 76% 36%));
+  --diff-added-bg: var(--diff-added-bg, hsl(142 76% 95%));
+  --diff-added-border: var(--diff-added-border, hsl(142 76% 85%));
+  --diff-added-foreground: var(--diff-added-foreground, hsl(142 76% 25%));
+
+  --diff-removed: var(--diff-removed, hsl(0 84% 60%));
+  --diff-removed-bg: var(--diff-removed-bg, hsl(0 86% 97%));
+  --diff-removed-border: var(--diff-removed-border, hsl(0 93% 85%));
+  --diff-removed-foreground: var(--diff-removed-foreground, hsl(0 72% 30%));
+
+  --diff-modified: var(--diff-modified, hsl(38 92% 50%));
+  --diff-modified-bg: var(--diff-modified-bg, hsl(48 96% 97%));
+  --diff-modified-border: var(--diff-modified-border, hsl(48 96% 82%));
+  --diff-modified-foreground: var(--diff-modified-foreground, hsl(38 92% 25%));
+
+  --success: var(--success, hsl(142 76% 36%));
+  --success-foreground: var(--success-foreground, hsl(0 0% 100%));
+  --warning: var(--warning, hsl(38 92% 50%));
+  --warning-foreground: var(--warning-foreground, hsl(0 0% 100%));
+  --info: var(--info, hsl(217 91% 60%));
+  --info-bg: var(--info-bg, hsl(214 95% 97%));
+  --info-foreground: var(--info-foreground, hsl(217 91% 30%));
+}
+
+/* Dark mode - standalone and isolated modes */
+.dark,
+[data-cms-admin="isolated"].dark,
+[data-cms-admin="isolated"] .dark {
   /* Main colors */
   --background: hsl(240 10% 3.9%);
   --foreground: hsl(0 0% 98%);
@@ -121,3 +223,39 @@
   --info-bg: hsl(217 50% 15%);
   --info-foreground: hsl(217 80% 80%);
 }
+
+/* Dark mode sidebar fallbacks for inherit mode */
+[data-cms-admin="inherit"].dark,
+[data-cms-admin="inherit"] .dark {
+  --sidebar: var(--sidebar, hsl(240 5.9% 10%));
+  --sidebar-foreground: var(--sidebar-foreground, hsl(240 4.8% 95.9%));
+  --sidebar-primary: var(--sidebar-primary, hsl(224.3 76.3% 48%));
+  --sidebar-primary-foreground: var(--sidebar-primary-foreground, hsl(0 0% 100%));
+  --sidebar-accent: var(--sidebar-accent, hsl(240 3.7% 15.9%));
+  --sidebar-accent-foreground: var(--sidebar-accent-foreground, hsl(240 4.8% 95.9%));
+  --sidebar-border: var(--sidebar-border, hsl(240 3.7% 15.9%));
+  --sidebar-ring: var(--sidebar-ring, hsl(217.2 91.2% 59.8%));
+
+  --diff-added: var(--diff-added, hsl(142 70% 50%));
+  --diff-added-bg: var(--diff-added-bg, hsl(142 50% 15%));
+  --diff-added-border: var(--diff-added-border, hsl(142 50% 25%));
+  --diff-added-foreground: var(--diff-added-foreground, hsl(142 70% 80%));
+
+  --diff-removed: var(--diff-removed, hsl(0 70% 55%));
+  --diff-removed-bg: var(--diff-removed-bg, hsl(0 50% 15%));
+  --diff-removed-border: var(--diff-removed-border, hsl(0 50% 25%));
+  --diff-removed-foreground: var(--diff-removed-foreground, hsl(0 70% 80%));
+
+  --diff-modified: var(--diff-modified, hsl(38 80% 55%));
+  --diff-modified-bg: var(--diff-modified-bg, hsl(38 50% 15%));
+  --diff-modified-border: var(--diff-modified-border, hsl(38 50% 25%));
+  --diff-modified-foreground: var(--diff-modified-foreground, hsl(38 80% 80%));
+
+  --success: var(--success, hsl(142 70% 50%));
+  --success-foreground: var(--success-foreground, hsl(0 0% 100%));
+  --warning: var(--warning, hsl(38 80% 55%));
+  --warning-foreground: var(--warning-foreground, hsl(0 0% 100%));
+  --info: var(--info, hsl(217 80% 60%));
+  --info-bg: var(--info-bg, hsl(217 50% 15%));
+  --info-foreground: var(--info-foreground, hsl(217 80% 80%));
+}

package/admin-dist/nitro.json

@@ -1,5 +1,5 @@
 {
-  "date": "2026-01-28T13:35:47.975Z",
+  "date": "2026-01-28T14:07:30.300Z",
   "preset": "node-server",
   "framework": {
     "name": "nitro",

package/admin-dist/public/assets/{CmsEmptyState-gxhf-b6F.js → CmsEmptyState-DTlpzjOI.js}

@@ -1 +1 @@
-import{j as e,C as n,h as x}from"./main-DWSY6jZL.js";function d({icon:s,title:m,description:r,action:t,className:l,...a}){return e.jsxs("div",{className:x("flex flex-col items-center justify-center py-12 text-center",l),...a,children:[s&&e.jsx("div",{className:"mb-4 flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground",children:s}),e.jsx("h3",{className:"text-base font-semibold text-foreground",children:m}),r&&e.jsx("p",{className:"mt-1 max-w-sm text-sm text-muted-foreground",children:r}),t&&e.jsx(n,{variant:t.variant??"primary",onClick:t.onClick,className:"mt-4",children:t.label})]})}export{d as C};
+import{j as e,C as n,h as x}from"./main-CA-4LyFT.js";function d({icon:s,title:m,description:r,action:t,className:l,...a}){return e.jsxs("div",{className:x("flex flex-col items-center justify-center py-12 text-center",l),...a,children:[s&&e.jsx("div",{className:"mb-4 flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground",children:s}),e.jsx("h3",{className:"text-base font-semibold text-foreground",children:m}),r&&e.jsx("p",{className:"mt-1 max-w-sm text-sm text-muted-foreground",children:r}),t&&e.jsx(n,{variant:t.variant??"primary",onClick:t.onClick,className:"mt-4",children:t.label})]})}export{d as C};

package/admin-dist/public/assets/{CmsPageHeader-equV7Sd9.js → CmsPageHeader-0REGRH4X.js}

@@ -1 +1 @@
-import{j as e,h as m}from"./main-DWSY6jZL.js";function c({title:i,description:s,actions:t,breadcrumbs:a,className:l,...r}){return e.jsxs("div",{className:m("mb-6",l),...r,children:[a&&e.jsx("div",{className:"mb-2",children:a}),e.jsxs("div",{className:"flex items-start justify-between gap-4",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsx("h1",{className:"text-2xl font-semibold tracking-tight text-foreground",children:i}),s&&e.jsx("p",{className:"text-sm text-muted-foreground",children:s})]}),t&&e.jsx("div",{className:"flex items-center gap-2",children:t})]})]})}export{c as C};
+import{j as e,h as m}from"./main-CA-4LyFT.js";function c({title:i,description:s,actions:t,breadcrumbs:a,className:l,...r}){return e.jsxs("div",{className:m("mb-6",l),...r,children:[a&&e.jsx("div",{className:"mb-2",children:a}),e.jsxs("div",{className:"flex items-start justify-between gap-4",children:[e.jsxs("div",{className:"space-y-1",children:[e.jsx("h1",{className:"text-2xl font-semibold tracking-tight text-foreground",children:i}),s&&e.jsx("p",{className:"text-sm text-muted-foreground",children:s})]}),t&&e.jsx("div",{className:"flex items-center gap-2",children:t})]})]})}export{c as C};

package/admin-dist/public/assets/{CmsStatusBadge-DQAslyW4.js → CmsStatusBadge-D_n8u8xa.js}

@@ -1 +1 @@
-import{j as e,h as t}from"./main-DWSY6jZL.js";import{B as a}from"./badge-DiaAY1It.js";const c={draft:{label:"Draft",className:"status-draft",icon:e.jsx("svg",{className:"size-3",fill:"currentColor",viewBox:"0 0 8 8",children:e.jsx("circle",{cx:"4",cy:"4",r:"3"})})},published:{label:"Published",className:"status-published",icon:e.jsx("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 13l4 4L19 7"})})},scheduled:{label:"Scheduled",className:"status-scheduled",icon:e.jsxs("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("path",{strokeLinecap:"round",d:"M12 6v6l4 2"})]})},archived:{label:"Archived",className:"status-archived",icon:e.jsx("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4"})})}},n={gray:"bg-muted text-muted-foreground",yellow:"bg-diff-modified-bg text-diff-modified-foreground",blue:"bg-info-bg text-info-foreground",green:"bg-diff-added-bg text-diff-added-foreground",red:"bg-diff-removed-bg text-diff-removed-foreground",purple:"bg-purple-100 text-purple-800 dark:bg-purple-900/30 dark:text-purple-400",orange:"bg-diff-modified-bg text-diff-modified-foreground"};function l(){return e.jsx("svg",{className:"size-3",fill:"currentColor",viewBox:"0 0 8 8",children:e.jsx("circle",{cx:"4",cy:"4",r:"3"})})}function x({status:d,customConfig:s,className:o,...i}){if(s)return e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",n[s.color],o),...i,children:[l(),s.displayName]});const r=c[d];return r?e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",r.className,o),...i,children:[r.icon,r.label]}):e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",n.gray,o),...i,children:[l(),d]})}export{x as C};
+import{j as e,h as t}from"./main-CA-4LyFT.js";import{B as a}from"./badge-C6qt24oj.js";const c={draft:{label:"Draft",className:"status-draft",icon:e.jsx("svg",{className:"size-3",fill:"currentColor",viewBox:"0 0 8 8",children:e.jsx("circle",{cx:"4",cy:"4",r:"3"})})},published:{label:"Published",className:"status-published",icon:e.jsx("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 13l4 4L19 7"})})},scheduled:{label:"Scheduled",className:"status-scheduled",icon:e.jsxs("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("path",{strokeLinecap:"round",d:"M12 6v6l4 2"})]})},archived:{label:"Archived",className:"status-archived",icon:e.jsx("svg",{className:"size-3",fill:"none",stroke:"currentColor",strokeWidth:"2",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 8h14M5 8a2 2 0 110-4h14a2 2 0 110 4M5 8v10a2 2 0 002 2h10a2 2 0 002-2V8m-9 4h4"})})}},n={gray:"bg-muted text-muted-foreground",yellow:"bg-diff-modified-bg text-diff-modified-foreground",blue:"bg-info-bg text-info-foreground",green:"bg-diff-added-bg text-diff-added-foreground",red:"bg-diff-removed-bg text-diff-removed-foreground",purple:"bg-purple-100 text-purple-800 dark:bg-purple-900/30 dark:text-purple-400",orange:"bg-diff-modified-bg text-diff-modified-foreground"};function l(){return e.jsx("svg",{className:"size-3",fill:"currentColor",viewBox:"0 0 8 8",children:e.jsx("circle",{cx:"4",cy:"4",r:"3"})})}function x({status:d,customConfig:s,className:o,...i}){if(s)return e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",n[s.color],o),...i,children:[l(),s.displayName]});const r=c[d];return r?e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",r.className,o),...i,children:[r.icon,r.label]}):e.jsxs(a,{variant:"secondary",className:t("gap-1.5 px-2 py-0.5 text-xs font-medium",n.gray,o),...i,children:[l(),d]})}export{x as C};

package/admin-dist/public/assets/{CmsSurface-DdC_aGB5.js → CmsSurface-BHmvNai4.js}

@@ -1 +1 @@
-import{j as r,h as t}from"./main-DWSY6jZL.js";const l={base:"surface-base",elevated:"surface-elevated",floating:"surface-floating"},m={none:"",sm:"p-3",md:"p-4",lg:"p-6"},u={none:"rounded-none",sm:"rounded-sm",md:"rounded-md",lg:"rounded-lg"};function f({elevation:e="base",padding:s="md",rounded:n="lg",className:a,children:d,...o}){return r.jsx("div",{className:t(l[e],m[s],u[n],a),...o,children:d})}export{f as C};
+import{j as r,h as t}from"./main-CA-4LyFT.js";const l={base:"surface-base",elevated:"surface-elevated",floating:"surface-floating"},m={none:"",sm:"p-3",md:"p-4",lg:"p-6"},u={none:"rounded-none",sm:"rounded-sm",md:"rounded-md",lg:"rounded-lg"};function f({elevation:e="base",padding:s="md",rounded:n="lg",className:a,children:d,...o}){return r.jsx("div",{className:t(l[e],m[s],u[n],a),...o,children:d})}export{f as C};

package/admin-dist/public/assets/{CmsToolbar-Crleacii.js → CmsToolbar-CY6GV2L8.js}

@@ -1 +1 @@
-import{j as e,I as i,h as o}from"./main-DWSY6jZL.js";import{S as p}from"./search-BT8HTHxb.js";function u({left:t,right:s,search:a,filters:r,actions:l,className:n,children:x,...m}){return e.jsxs("div",{className:o("flex flex-wrap items-center justify-between gap-3 pb-4",n),...m,children:[e.jsxs("div",{className:"flex flex-1 flex-wrap items-center gap-2",children:[a&&e.jsxs("div",{className:"relative w-full max-w-xs",children:[e.jsx(p,{className:"absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"}),e.jsx(i,{type:"search",placeholder:a.placeholder??"Search...",value:a.value,onChange:c=>a.onChange(c.target.value),className:"pl-9"})]}),r,t,x]}),(s||l)&&e.jsx("div",{className:"flex items-center gap-2",children:s??l})]})}export{u as C};
+import{j as e,I as i,h as o}from"./main-CA-4LyFT.js";import{S as p}from"./search-WXp6KxDJ.js";function u({left:t,right:s,search:a,filters:r,actions:l,className:n,children:x,...m}){return e.jsxs("div",{className:o("flex flex-wrap items-center justify-between gap-3 pb-4",n),...m,children:[e.jsxs("div",{className:"flex flex-1 flex-wrap items-center gap-2",children:[a&&e.jsxs("div",{className:"relative w-full max-w-xs",children:[e.jsx(p,{className:"absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"}),e.jsx(i,{type:"search",placeholder:a.placeholder??"Search...",value:a.value,onChange:c=>a.onChange(c.target.value),className:"pl-9"})]}),r,t,x]}),(s||l)&&e.jsx("div",{className:"flex items-center gap-2",children:s??l})]})}export{u as C};