@notis_ai/cli 0.2.0-beta.16.1 → 0.2.0-beta.161.1

package/template/components/ui/card.tsx

@@ -2,20 +2,33 @@ import * as React from 'react';
 
 import { cn } from '@/lib/utils';
 
+// Surfaces are flat: a tinted panel on the page, and a plain background panel
+// when nested inside another Card. No borders, no dividers, no shadows.
+const CardDepthContext = React.createContext(0);
+
 const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
-  ({ className, ...props }, ref) => (
-    <div
-      ref={ref}
-      className={cn('rounded-2xl border bg-card text-card-foreground shadow-sm', className)}
-      {...props}
-    />
-  ),
+  ({ className, ...props }, ref) => {
+    const depth = React.useContext(CardDepthContext);
+    return (
+      <CardDepthContext.Provider value={depth + 1}>
+        <div
+          ref={ref}
+          className={cn(
+            'min-w-0 rounded-2xl text-card-foreground',
+            depth === 0 ? 'bg-muted' : 'bg-background',
+            className,
+          )}
+          {...props}
+        />
+      </CardDepthContext.Provider>
+    );
+  },
 );
 Card.displayName = 'Card';
 
 const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
   ({ className, ...props }, ref) => (
-    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
+    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-5', className)} {...props} />
   ),
 );
 CardHeader.displayName = 'CardHeader';
@@ -24,7 +37,7 @@ const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HT
   ({ className, ...props }, ref) => (
     <h3
       ref={ref}
-      className={cn('text-xl font-semibold leading-none tracking-tight', className)}
+      className={cn('text-base font-semibold leading-none tracking-tight', className)}
       {...props}
     />
   ),
@@ -41,14 +54,14 @@ CardDescription.displayName = 'CardDescription';
 
 const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
   ({ className, ...props }, ref) => (
-    <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+    <div ref={ref} className={cn('p-5 pt-0', className)} {...props} />
   ),
 );
 CardContent.displayName = 'CardContent';
 
 const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
   ({ className, ...props }, ref) => (
-    <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />
+    <div ref={ref} className={cn('flex items-center p-5 pt-0', className)} {...props} />
   ),
 );
 CardFooter.displayName = 'CardFooter';

package/template/components/ui/native-select.tsx

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { CaretDown } from '@phosphor-icons/react';
+
+import { cn } from '@/lib/utils';
+
+// Borderless native select: a tinted pill with a caret. Keeps the platform
+// dropdown (no portal needed inside the app surface) and the portal focus ring.
+const NativeSelect = React.forwardRef<HTMLSelectElement, React.SelectHTMLAttributes<HTMLSelectElement>>(
+  ({ className, children, ...props }, ref) => (
+    <span className={cn('relative inline-flex', className)}>
+      <select
+        ref={ref}
+        className="h-9 w-full appearance-none rounded-md bg-muted pl-3 pr-8 text-sm text-foreground outline-hidden transition-colors hover:bg-muted/70 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+        {...props}
+      >
+        {children}
+      </select>
+      <CaretDown className="pointer-events-none absolute right-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" />
+    </span>
+  ),
+);
+NativeSelect.displayName = 'NativeSelect';
+
+export { NativeSelect };

package/template/notis.config.ts

@@ -1,18 +1,36 @@
 import { defineNotisApp } from '@notis/sdk/config';
 
 export default defineNotisApp({
-  name: 'My Notis App',
-  description: 'A new Notis app',
-  icon: 'lucide:layout-dashboard',
+  name: 'my-notis-app',
+  title: 'My Notis App',
+  description: 'A focused Notis app with one route and one database-backed workflow.',
+  icon: 'phosphor:squares-four',
+  author: { name: 'Notis User' },
+  categories: ['Productivity'],
+  tagline: 'A clean starting point for a focused workflow.',
 
   databases: ['items'],
 
   routes: [
-    { path: '/', name: 'Home', icon: 'lucide:home', default: true },
+    { path: '/', slug: 'home', name: 'Home', icon: 'phosphor:house', default: true },
+    // Example collection tree route:
+    // {
+    //   path: '/notes',
+    //   slug: 'notes',
+    //   name: 'Notes',
+    //   collection: {
+    //     database: 'notes',
+    //     titleProperty: 'Name',
+    //     parentProperty: 'Parent',
+    //     sidebar: {
+    //       mode: 'tree',
+    //       allowCreate: true,
+    //     },
+    //   },
+    // },
   ],
 
   tools: [
-    'notis_query_database',
-    'notis_upsert_document',
+    'LOCAL_NOTIS_DATABASE_QUERY',
   ],
 });