spine-framework 0.4.4 → 0.5.0-rc.5

package/.framework/src/components/ui/sheet.tsx

@@ -26,15 +26,14 @@ import { Dialog as SheetPrimitive } from "radix-ui"
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
 import { XIcon } from "lucide-react"
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:module_header:module_header"]
 // CIL[DOC-VECTOR type="context" content="purpose='shadcn/ui Sheet component module built on Radix UI Dialog primitives'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:module_header:module_header"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:Sheet:component" type="component" identity="Sheet" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders a styled Radix Sheet root wrapper"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the sheet root wrapper that controls the dialog open state"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -42,18 +41,18 @@ import { XIcon } from "lucide-react"
 // CIL[DOC-MICRO logic_summary="Spreads props onto SheetPrimitive.Root with a data-slot attribute for styling hooks" notable_decisions="Uses React.ComponentProps to inherit the Radix Dialog root prop types"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:Sheet:component" type="component" identity="Sheet" parent="~/.framework/src/components/ui/sheet.tsx"]
 function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
   return <SheetPrimitive.Root data-slot="sheet" {...props} />
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:Sheet:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders a styled Radix Sheet root wrapper'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:Sheet:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTrigger:component" type="component" identity="SheetTrigger" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the trigger that opens the sheet"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the trigger element that opens the sheet"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -61,20 +60,20 @@ function Sheet({ ...props }: React.ComponentProps<typeof SheetPrimitive.Root>) {
 // CIL[DOC-MICRO logic_summary="Spreads props onto SheetPrimitive.Trigger with a data-slot attribute for styling hooks" notable_decisions="[]"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTrigger:component" type="component" identity="SheetTrigger" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetTrigger({
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Trigger>) {
   return <SheetPrimitive.Trigger data-slot="sheet-trigger" {...props} />
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTrigger:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the trigger that opens the sheet'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTrigger:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetClose:component" type="component" identity="SheetClose" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the close button that dismisses the sheet"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the close button that dismisses the sheet"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -82,20 +81,20 @@ function SheetTrigger({
 // CIL[DOC-MICRO logic_summary="Spreads props onto SheetPrimitive.Close with a data-slot attribute for styling hooks" notable_decisions="[]"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetClose:component" type="component" identity="SheetClose" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetClose({
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Close>) {
   return <SheetPrimitive.Close data-slot="sheet-close" {...props} />
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetClose:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the close button that dismisses the sheet'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetClose:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetPortal:component" type="component" identity="SheetPortal" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the portal that mounts sheet content in the document body"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the portal that mounts sheet content in the document body"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -103,20 +102,20 @@ function SheetClose({
 // CIL[DOC-MICRO logic_summary="Spreads props onto SheetPrimitive.Portal with a data-slot attribute for styling hooks" notable_decisions="[]"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetPortal:component" type="component" identity="SheetPortal" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetPortal({
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Portal>) {
   return <SheetPrimitive.Portal data-slot="sheet-portal" {...props} />
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetPortal:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the portal that mounts sheet content in the document body'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetPortal:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetOverlay:component" type="component" identity="SheetOverlay" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the backdrop overlay behind the sheet"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the backdrop overlay behind the sheet"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -124,6 +123,7 @@ function SheetPortal({
 // CIL[DOC-MICRO logic_summary="Wraps SheetPrimitive.Overlay and applies a fixed black/80 backdrop with optional blur and open/close animations" notable_decisions="Uses cn to merge the provided className with Tailwind backdrop and animation utilities"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetOverlay:component" type="component" identity="SheetOverlay" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetOverlay({
   className,
   ...props
@@ -132,22 +132,21 @@ function SheetOverlay({
     <SheetPrimitive.Overlay
       data-slot="sheet-overlay"
       className={cn(
-        "fixed inset-0 z-50 bg-black/80 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
+        "fixed inset-0 z-50 bg-black/80 duration-[250ms] supports-backdrop-filter:backdrop-blur-xs data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0",
         className
       )}
       {...props}
     />
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetOverlay:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the backdrop overlay behind the sheet'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetOverlay:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetContent:component" type="component" identity="SheetContent" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the main sheet panel with side positioning and an optional close button"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the main sheet panel with side positioning and an optional close button"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -155,6 +154,7 @@ function SheetOverlay({
 // CIL[DOC-MICRO logic_summary="Composes SheetPortal and SheetOverlay then renders SheetPrimitive.Content with side-aware Tailwind classes and an internal close button" notable_decisions="Defaults side to right and showCloseButton to true; uses data-side and data-open/data-closed attributes for animation hooks"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetContent:component" type="component" identity="SheetContent" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetContent({
   className,
   children,
@@ -172,7 +172,7 @@ function SheetContent({
         data-slot="sheet-content"
         data-side={side}
         className={cn(
-          "fixed z-50 flex flex-col bg-popover bg-clip-padding text-xs/relaxed text-popover-foreground shadow-lg transition duration-200 ease-in-out data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-[side=bottom]:data-open:slide-in-from-bottom-10 data-[side=left]:data-open:slide-in-from-left-10 data-[side=right]:data-open:slide-in-from-right-10 data-[side=top]:data-open:slide-in-from-top-10 data-closed:animate-out data-closed:fade-out-0 data-[side=bottom]:data-closed:slide-out-to-bottom-10 data-[side=left]:data-closed:slide-out-to-left-10 data-[side=right]:data-closed:slide-out-to-right-10 data-[side=top]:data-closed:slide-out-to-top-10",
+          "fixed z-50 flex flex-col bg-popover bg-clip-padding text-xs/relaxed text-popover-foreground shadow-lg transition duration-[250ms] ease-in-out data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[side=bottom]:data-[state=open]:slide-in-from-bottom-10 data-[side=left]:data-[state=open]:slide-in-from-left-10 data-[side=right]:data-[state=open]:slide-in-from-right-10 data-[side=top]:data-[state=open]:slide-in-from-top-10 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[side=bottom]:data-[state=closed]:slide-out-to-bottom-10 data-[side=left]:data-[state=closed]:slide-out-to-left-10 data-[side=right]:data-[state=closed]:slide-out-to-right-10 data-[side=top]:data-[state=closed]:slide-out-to-top-10",
           className
         )}
         {...props}
@@ -195,15 +195,14 @@ function SheetContent({
     </SheetPortal>
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetContent:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the main sheet panel with side positioning and an optional close button'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetContent:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetHeader:component" type="component" identity="SheetHeader" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the header area of a sheet panel"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the header area of a sheet panel"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -211,6 +210,7 @@ function SheetContent({
 // CIL[DOC-MICRO logic_summary="Renders a div with the sheet-header data slot and vertical flex gap padding" notable_decisions="Merges an optional className with base layout classes via cn"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetHeader:component" type="component" identity="SheetHeader" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
@@ -220,15 +220,14 @@ function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
     />
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetHeader:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the header area of a sheet panel'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetHeader:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetFooter:component" type="component" identity="SheetFooter" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the footer area of a sheet panel"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the footer area of a sheet panel"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -236,6 +235,7 @@ function SheetHeader({ className, ...props }: React.ComponentProps<"div">) {
 // CIL[DOC-MICRO logic_summary="Renders a div with the sheet-footer data slot and bottom auto-margin padding" notable_decisions="Merges an optional className with base layout classes via cn"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetFooter:component" type="component" identity="SheetFooter" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
@@ -245,15 +245,14 @@ function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
     />
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetFooter:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the footer area of a sheet panel'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetFooter:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTitle:component" type="component" identity="SheetTitle" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the accessible title inside a sheet"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the accessible title inside a sheet"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -261,6 +260,7 @@ function SheetFooter({ className, ...props }: React.ComponentProps<"div">) {
 // CIL[DOC-MICRO logic_summary="Wraps SheetPrimitive.Title with a heading font and data-slot attribute" notable_decisions="Merges an optional className with base typography classes"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTitle:component" type="component" identity="SheetTitle" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetTitle({
   className,
   ...props
@@ -276,15 +276,14 @@ function SheetTitle({
     />
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTitle:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the accessible title inside a sheet'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetTitle:component"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetDescription:component" type="component" identity="SheetDescription" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Renders the accessible description inside a sheet"]
 // CIL[DOC-RESPONSIBILITY responsibility="Renders the accessible description inside a sheet"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -292,6 +291,7 @@ function SheetTitle({
 // CIL[DOC-MICRO logic_summary="Wraps SheetPrimitive.Description with muted-foreground text styling" notable_decisions="Merges an optional className with base text classes"]
 // CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:SheetDescription:component" type="component" identity="SheetDescription" parent="~/.framework/src/components/ui/sheet.tsx"]
 function SheetDescription({
   className,
   ...props
@@ -304,14 +304,13 @@ function SheetDescription({
     />
   )
 }
+// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetDescription:component"]
 // CIL[DOC-VECTOR type="context" content="purpose='Renders the accessible description inside a sheet'; No verified external callers; imports: .framework/src/lib/utils.ts,.framework/src/components/ui/button.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
 // CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:SheetDescription:component"]
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/sheet.tsx:exports:variable" type="variable" identity="exports" parent="~/.framework/src/components/ui/sheet.tsx"]
 // CIL[DOC-MACRO purpose="Re-exports the Sheet subcomponents as the public API of the module"]
 // CIL[DOC-RESPONSIBILITY responsibility="Re-exports the Sheet subcomponents as the public API of the module"]
 // CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/button.tsx,.framework/src/components/ui/sheet.tsx,.framework/src/lib/utils.ts"]
@@ -334,5 +333,4 @@ export {
 // CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
 // CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
 // CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/sheet.tsx:exports:variable"]
+// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]

package/.framework/src/components/ui/textarea.tsx

@@ -1,34 +1,58 @@
 // CIL[BEGIN stable_id="~/.framework/src/components/ui/textarea.tsx:module_header:module_header" type="module_header" identity="module_header" parent="~/.framework/src/components/ui/textarea.tsx"]
-// CIL[DOC-MACRO purpose="Provides the Textarea UI component for the design system"]
-// CIL[DOC-RESPONSIBILITY responsibility="Import React and the className utility and expose the Textarea component for use across the app"]
-// CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/lib/utils.ts"]
-// CIL[DOC-CONTRACT inputs="none" outputs="none" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Imports React and the cn class-merging utility for the Textarea component" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-AUDIENCE audience="developers"]
+/**
+ * @module   textarea
+ * @audience both
+ * @layer    shared-core
+ * @stability stable
+ *
+ * This module provides a React component for a customizable textarea, allowing for flexible user input within forms. It integrates utility functions for class name management to ensure consistent styling. INVARIANT: The component must always receive valid props to function correctly.
+ *
+ * @seeAlso utils.ts (provides utility functions for class name management).
+ *
+ * @cil-generated
+ */
+
+
+
+
+
+
+
+
+
 import * as React from "react"
 
 import { cn } from "@/lib/utils"
-// CIL[DOC-VECTOR type="context" content="purpose='Provides the Textarea UI component for the design system'; No verified external callers; imports: .framework/src/lib/utils.ts"]
-// CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
-// CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
-// CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
-// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
 // CIL[END stable_id="~/.framework/src/components/ui/textarea.tsx:module_header:module_header"]
 
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/textarea.tsx:textarea:function" type="function" identity="textarea" parent="~/.framework/src/components/ui/textarea.tsx:module_header:module_header"]
-// CIL[DOC-MACRO purpose="Renders a styled HTML textarea element for forms"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render a multi-line text input with Tailwind styling and forwarded props"]
-// CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/textarea.tsx,.framework/src/lib/utils.ts"]
-// CIL[DOC-CONTRACT inputs="className?: string, ...props: React.ComponentProps<'textarea'>" outputs="JSX.Element" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Wraps an HTML textarea with data-slot and applies utility classes including sizing, border, focus ring, and disabled/invalid states" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
-  return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/textarea.tsx:Textarea:constant" type="constant" identity="Textarea" parent="~/.framework/src/components/ui/textarea.tsx"]
+/**
+ * Textarea is a React component that renders a styled HTML textarea element, providing a flexible and customizable input area for user text input within a form.
+ *
+ * @sideEffects none
+ * @stability   internal
+ * @calls       cn
+ * @cil-generated
+ */
+const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<"textarea">>(
+  ({ className, ...props }, ref) => (
     <textarea
+      ref={ref}
       data-slot="textarea"
       className={cn(
         "flex field-sizing-content min-h-16 w-full resize-none rounded-md border border-input bg-input/20 px-2 py-2 text-sm transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 md:text-xs/relaxed dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
@@ -37,28 +61,30 @@ function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
       {...props}
     />
   )
-}
-// CIL[DOC-VECTOR type="context" content="purpose='Renders a styled HTML textarea element for forms'; No verified external callers; imports: .framework/src/lib/utils.ts"]
-// CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
-// CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
-// CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
-// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/textarea.tsx:textarea:function"]
-
-// CIL[BEGIN stable_id="~/.framework/src/components/ui/textarea.tsx:export:export" type="export" identity="export" parent="~/.framework/src/components/ui/textarea.tsx:module_header:module_header"]
-// CIL[DOC-MACRO purpose="Re-exports the Textarea component for module consumers"]
-// CIL[DOC-RESPONSIBILITY responsibility="Make the Textarea component available to other modules"]
-// CIL[DOC-CONTEXT module="components/ui" layer="ui" related_files=".framework/src/components/ui/textarea.tsx,.framework/src/lib/utils.ts"]
-// CIL[DOC-CONTRACT inputs="none" outputs="Textarea named export" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Named export of the Textarea component" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
+// CIL[END stable_id="~/.framework/src/components/ui/textarea.tsx:Textarea:constant"]
+)
+Textarea.displayName = "Textarea"
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 export { Textarea }
-// CIL[DOC-VECTOR type="context" content="purpose='Re-exports the Textarea component for module consumers'; No verified external callers; imports: .framework/src/lib/utils.ts"]
-// CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
-// CIL[DOC-VECTOR type="configuration" content="No environment or build configuration dependencies identified"]
-// CIL[DOC-VECTOR type="constraint" content="Standard runtime; no special invariants documented"]
-// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
-// CIL[END stable_id="~/.framework/src/components/ui/textarea.tsx:export:export"]
+
+
+
+
+
+
+

package/.framework/src/contexts/AppContext.tsx

@@ -11,6 +11,7 @@
 import React, { createContext, useContext, useState, useEffect, useRef, useCallback } from 'react'
 import { AppRecord } from '../hooks/useApps'
 import { apiFetch } from '../lib/api'
+import { resolveAppMount } from '../lib/app-mount'
 import { useAuth } from './AuthContext'
 // CIL[DOC-VECTOR type="context" content="purpose='Defines React contexts and hooks for the current app and app registry'; No verified external callers; imports: .framework/src/hooks/useApps.ts,.framework/src/lib/api.ts,.framework/src/contexts/AuthContext.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
@@ -248,7 +249,9 @@ export function AppsRegistryProvider({ children }: AppsRegistryProviderProps) {
       if (data.error) throw new Error(data.error)
 
       const allApps: AppRecord[] = data.data || data || []
-      setApps(allApps)
+      // Resolve the host-keyed mount up front so every consumer sees the
+      // effective route_prefix ('/' on the app's own prod/preview domain).
+      setApps(allApps.map(app => ({ ...app, route_prefix: resolveAppMount(app).route_prefix })))
       loadedForUserRef.current = user.id
     } catch (err) {
       if (err instanceof DOMException && err.name === 'AbortError') return
@@ -272,18 +275,8 @@ export function AppsRegistryProvider({ children }: AppsRegistryProviderProps) {
 
   const effectiveLoading = loading || (!!user && loadedForUserRef.current !== user.id)
 
-  const environment = (import.meta.env.VITE_ENVIRONMENT as string) || 'prod'
-  const currentHost = typeof window !== 'undefined' ? window.location.hostname : ''
-
-  const appMatchesDomain = (app: AppRecord): boolean => {
-    const domain = environment === 'preview' ? app.preview_domain : app.prod_domain
-    if (!domain) return true
-    const hostname = domain.includes('://') ? new URL(domain).hostname : domain.split(':')[0]
-    return currentHost === hostname
-  }
-
   const routableApps = apps.filter(
-    app => app.route_prefix != null && app.renderer !== 'none' && appMatchesDomain(app)
+    app => app.route_prefix != null && app.renderer !== 'none' && resolveAppMount(app).routable
   )
 
   const refetch = useCallback(() => {

package/.framework/src/contexts/AuthContext.tsx

@@ -348,6 +348,7 @@ async function fetchUserContext(maxRetries = 2): Promise<User | null> {
 // CIL[DOC-CONTEXT module="AuthContext" layer="context" related_files=".framework/src/contexts/AuthContext.tsx,.framework/src/lib/api.ts,.framework/src/lib/supabase.ts,.framework/src/types/auth.ts"]
 // CIL[DOC-CONTRACT inputs="children: React.ReactNode" outputs="AuthContext.Provider with value { user, isLoading, login, logout, refreshUser }" errors="login may propagate Supabase error; useAuth throws outside provider" side_effects="updates localStorage, Supabase auth session, account id, and window storage listener"]
 // CIL[DOC-MICRO logic_summary="Initializes from cache, fetches/refresh session on mount, exposes callbacks, and listens to auth/storage events." notable_decisions="[]"]
+// CIL[DOC-NOTE type="caution" content="onAuthStateChange callbacks must not await Supabase calls — auth-js awaits listener callbacks inside initializePromise, so fetchUserContext→apiFetch→getAuthHeaders→getSession deadlocks on expired sessions until SESSION_TIMEOUT_MS (15s spinner before login mounts). Work is deferred via setTimeout."]
 // CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="none"]
 // CIL[DOC-STABILITY stability="stable"]
 export function AuthProvider({ children }: AuthProviderProps) {
@@ -501,7 +502,7 @@ export function AuthProvider({ children }: AuthProviderProps) {
     checkAuth()
 
     const { data: { subscription } } = supabase.auth.onAuthStateChange(
-      async (event, session) => {
+      (event, session) => {
         if (cancelled) return
 
         if (isLoggingInRef.current) return
@@ -510,14 +511,21 @@ export function AuthProvider({ children }: AuthProviderProps) {
           if (!session?.user) return
           if (userRef.current) return
 
-          const userContext = await fetchUserContext()
-          if (cancelled) return
-
-          if (userContext) {
-            applyUserContext(userContext)
-          } else {
-            clearUser()
-          }
+          // auth-js awaits listener callbacks inside initializePromise —
+          // awaiting fetchUserContext here deadlocks it via
+          // apiFetch → getAuthHeaders → getSession → initializePromise.
+          setTimeout(async () => {
+            if (cancelled) return
+
+            const userContext = await fetchUserContext()
+            if (cancelled) return
+
+            if (userContext) {
+              applyUserContext(userContext)
+            } else {
+              clearUser()
+            }
+          }, 0)
         } else if (event === 'SIGNED_OUT') {
           clearUser()
         }

package/.framework/src/hooks/useApps.ts

@@ -13,6 +13,7 @@
 
 import { useState, useEffect } from 'react'
 import { apiFetch } from '../lib/api'
+import { resolveAppMount } from '../lib/app-mount'
 import { useAuth } from '../contexts/AuthContext'
 // CIL[DOC-VECTOR type="context" content="purpose='Module setup and imports for useApps.ts'; No verified external callers; imports: .framework/src/lib/api.ts,.framework/src/contexts/AuthContext.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
@@ -51,6 +52,8 @@ export interface AppRecord {
   renderer: 'generic' | 'custom' | 'none'
   preview_domain?: string | null
   prod_domain?: string | null
+  preview_route_prefix?: string | null
+  prod_route_prefix?: string | null
 }
 // CIL[DOC-VECTOR type="context" content="purpose='Define the AppRecord shape'; No verified external callers; imports: .framework/src/lib/api.ts,.framework/src/contexts/AuthContext.tsx"]
 // CIL[DOC-VECTOR type="blast_radius" content="No direct caller data from CIL graph; local impact only"]
@@ -122,30 +125,23 @@ export function useApps(): UseAppsResult {
 
       const allApps: AppRecord[] = data.data || data || []
 
-      const environment = (import.meta.env.VITE_ENVIRONMENT as string) || 'prod'
-      const currentHost = typeof window !== 'undefined' ? window.location.hostname : ''
+      const accessible = allApps
+        .map(app => ({ app, mount: resolveAppMount(app) }))
+        .filter(({ app, mount }) => {
+          if (!app.is_active) return false
+          if (!mount.routable) return false
 
-      const appMatchesDomain = (app: AppRecord): boolean => {
-        const domain = environment === 'preview' ? app.preview_domain : app.prod_domain
-        if (!domain) return true
-        const hostname = domain.includes('://') ? new URL(domain).hostname : domain.split(':')[0]
-        return currentHost === hostname
-      }
+          const requiredRoles = app.required_roles || (app.min_role ? [app.min_role] : [])
+
+          if (requiredRoles.length === 0) return true
+
+          if (!user.roles || user.roles.length === 0) return false
+
+          if (user.roles.includes('system_admin')) return true
 
-      const accessible = allApps.filter(app => {
-        if (!app.is_active) return false
-        if (!appMatchesDomain(app)) return false
-        
-        const requiredRoles = app.required_roles || (app.min_role ? [app.min_role] : [])
-        
-        if (requiredRoles.length === 0) return true
-        
-        if (!user.roles || user.roles.length === 0) return false
-        
-        if (user.roles.includes('system_admin')) return true
-        
-        return requiredRoles.some(role => user.roles!.includes(role))
-      })
+          return requiredRoles.some(role => user.roles!.includes(role))
+        })
+        .map(({ app, mount }) => ({ ...app, route_prefix: mount.route_prefix }))
 
       setApps(accessible)
     } catch (err) {