spine-framework 0.3.144 → 0.4.0

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

@@ -1,3 +1,14 @@
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:module_header:module_header" type="module_header" identity="module_header" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Import the dependencies and utilities used by the avatar component module"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provide React, Radix UI Avatar, and the cn utility to the Avatar subcomponents"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="none" outputs="React, AvatarPrimitive, and cn bindings available to the module" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Import third-party and local dependencies required by the avatar components" notable_decisions="Uses the @/lib/utils alias to import the cn class-name utility"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.9" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
+
+
 
 
 
@@ -6,40 +17,27 @@
 
 
 
-// CIL[BEGIN chunk_id="avatar_module_header_1783883196" type="module_header" identity="module_header" parent="none"]
-// CIL[DOC-MACRO purpose="Import React and Radix UI Avatar dependencies"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide external dependencies for Avatar component system"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="React, AvatarPrimitive, cn" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Imports React, Radix UI Avatar primitives, and utility function" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-AUDIENCE audience="developer"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/components/ui/table-primitives.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
-// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
 import * as React from "react"
 import { Avatar as AvatarPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-// CIL[END chunk_id="avatar_module_header_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatar_1783883196" type="function" identity="Avatar" parent="none"]
-// CIL[DOC-MACRO purpose="Main Avatar container with size variants and styling"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render avatar root with responsive sizing and visual effects"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\".framework/functions/_shared/principal.ts\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX AvatarPrimitive.Root" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates avatar root with size variants, overlay effects, and responsive styling" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/pages/admin/RolesPage.tsx, .framework/functions/_shared/principal.ts, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Import the dependencies and utilities used by the avatar component module'; 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/avatar.tsx:module_header:module_header"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:Avatar:component" type="component" identity="Avatar" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Render an avatar root element with configurable size and Tailwind styling"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provide a styled AvatarPrimitive.Root wrapper that supports default, sm, and lg sizes"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, size: default|sm|lg, and standard AvatarPrimitive.Root props" outputs="JSX element styled as a rounded avatar root with data attributes" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Wrap AvatarPrimitive.Root and apply size-aware Tailwind classes via cn, including a subtle border overlay" notable_decisions="Uses data-size attributes and dark mode mix-blend utilities for the border"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function Avatar({
   className,
   size = "default",
@@ -59,21 +57,23 @@ function Avatar({
     />
   )
 }
-// CIL[END chunk_id="avatar_avatar_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatarimage_1783883196" type="function" identity="AvatarImage" parent="none"]
-// CIL[DOC-MACRO purpose="Avatar image component with proper aspect ratio and sizing"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render avatar image with circular cropping and cover fit"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/migrations/015_simplify_apps_table.sql\",\".framework/src/components/ui/table-primitives.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX AvatarPrimitive.Image" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates circular image with aspect-square, full size, rounded corners, object-cover" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, .framework/src/pages/admin/IntegrationsPage.tsx, .framework/src/components/ui/dialog.tsx, .framework/migrations/015_simplify_apps_table.sql, .framework/src/components/ui/table-primitives.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render an avatar root element with configurable size and Tailwind styling'; 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/avatar.tsx:Avatar:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:AvatarImage:component" type="component" identity="AvatarImage" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Render the image content of an avatar"]
+// CIL[DOC-RESPONSIBILITY responsibility="Display an image inside an Avatar, cropped to a circle and covering the container"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, props: spread of standard AvatarPrimitive.Image props" outputs="JSX image element with rounded cover styling" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Wrap AvatarPrimitive.Image and apply aspect-square, size-full, rounded-full, and object-cover classes" notable_decisions="Merges additional className with the cover classes"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function AvatarImage({
   className,
   ...props
@@ -89,21 +89,23 @@ function AvatarImage({
     />
   )
 }
-// CIL[END chunk_id="avatar_avatarimage_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatarfallback_1783883196" type="function" identity="AvatarFallback" parent="none"]
-// CIL[DOC-MACRO purpose="Avatar fallback component for when image fails to load"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render styled fallback content with responsive text sizing"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\".framework/src/components/ui/dialog.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX AvatarPrimitive.Fallback" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates circular fallback with centered content, muted styling, size-responsive text" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, .framework/src/components/ui/table-primitives.tsx, .framework/src/components/ui/dialog.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render the image content of an avatar'; 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/avatar.tsx:AvatarImage:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:AvatarFallback:component" type="component" identity="AvatarFallback" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Render placeholder content when an avatar image cannot be displayed"]
+// CIL[DOC-RESPONSIBILITY responsibility="Show initials or an icon inside an Avatar when no image is loaded"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, props: spread of standard AvatarPrimitive.Fallback props" outputs="JSX fallback element with muted background and centered content" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Wrap AvatarPrimitive.Fallback and apply a centered, rounded, muted background with size-aware text" notable_decisions="Reduces text size for sm avatars via the group-data selector"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function AvatarFallback({
   className,
   ...props
@@ -119,21 +121,23 @@ function AvatarFallback({
     />
   )
 }
-// CIL[END chunk_id="avatar_avatarfallback_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatarbadge_1783883196" type="function" identity="AvatarBadge" parent="none"]
-// CIL[DOC-MACRO purpose="Avatar badge component for status indicators or overlays"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render positioned badge with size-responsive styling"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[\".framework/src/pages/admin/RolesPage.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\".framework/src/pages/admin/TypeDetailPage.tsx\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX span element" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates positioned badge with size variants, ring styling, icon handling" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: .framework/src/pages/admin/RolesPage.tsx, custom/apps/portal/pages/ContentPage.tsx, .framework/src/components/ui/table-primitives.tsx, .framework/src/pages/admin/TypeDetailPage.tsx."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render placeholder content when an avatar image cannot be displayed'; 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/avatar.tsx:AvatarFallback:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:AvatarBadge:component" type="component" identity="AvatarBadge" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Render a small status badge overlaid on an avatar"]
+// CIL[DOC-RESPONSIBILITY responsibility="Display a positioned badge at the bottom-right of an Avatar, adapting to avatar size"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, props: spread of standard span props" outputs="JSX span element positioned absolutely over the avatar" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Render an absolute positioned span with primary background and size-aware dimensions" notable_decisions="Uses group-data selectors for sm/default/lg sizing and hides nested svg on sm"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function AvatarBadge({ className, ...props }: React.ComponentProps<"span">) {
   return (
     <span
@@ -149,21 +153,23 @@ function AvatarBadge({ className, ...props }: React.ComponentProps<"span">) {
     />
   )
 }
-// CIL[END chunk_id="avatar_avatarbadge_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatargroup_1783883196" type="function" identity="AvatarGroup" parent="none"]
-// CIL[DOC-MACRO purpose="Avatar group container for stacking multiple avatars"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render container with overlapping avatar layout"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX div element" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates flex container with negative space-x for overlapping avatars with ring styling" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: none."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render a small status badge overlaid on an avatar'; 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/avatar.tsx:AvatarBadge:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:AvatarGroup:component" type="component" identity="AvatarGroup" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Group multiple avatars into a compact, overlapping stack"]
+// CIL[DOC-RESPONSIBILITY responsibility="Layout a horizontal row of Avatars with negative horizontal spacing"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, props: spread of standard div props" outputs="JSX div element containing the overlapped avatar children" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Render a flex container that overlaps child avatars and adds a ring around each" notable_decisions="Uses Tailwind space-negative utilities and attribute selectors for child styling"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function AvatarGroup({ className, ...props }: React.ComponentProps<"div">) {
   return (
     <div
@@ -176,21 +182,23 @@ function AvatarGroup({ className, ...props }: React.ComponentProps<"div">) {
     />
   )
 }
-// CIL[END chunk_id="avatar_avatargroup_1783883196"]
-// CIL[BEGIN chunk_id="avatar_avatargroupcount_1783883196" type="function" identity="AvatarGroupCount" parent="none"]
-// CIL[DOC-MACRO purpose="Avatar group count indicator for showing remaining items"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render count badge with responsive sizing and group awareness"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX div element" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates count indicator with size responsiveness, group styling, icon handling" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: none."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Group multiple avatars into a compact, overlapping stack'; 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/avatar.tsx:AvatarGroup:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:AvatarGroupCount:component" type="component" identity="AvatarGroupCount" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Render a circular counter for additional avatars in a group"]
+// CIL[DOC-RESPONSIBILITY responsibility="Show the number of hidden or extra avatars beyond those visible in an AvatarGroup"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, props: spread of standard div props" outputs="JSX div element styled as a count badge with size-aware scaling" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Render a centered count element with muted background and group-based size scaling" notable_decisions="Scales size and svg icon dimensions based on the parent AvatarGroup size"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.85" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function AvatarGroupCount({
   className,
   ...props
@@ -206,21 +214,22 @@ function AvatarGroupCount({
     />
   )
 }
-// CIL[END chunk_id="avatar_avatargroupcount_1783883196"]
-// CIL[BEGIN chunk_id="avatar_exports_1783883196" type="exports" identity="exports" parent="none"]
-// CIL[DOC-MACRO purpose="Export all Avatar components for external use"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide public API for Avatar component library"]
-// CIL[DOC-CONTEXT module="avatar" layer="ui" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="exported components" errors="none" side_effects="module exports"]
-// CIL[DOC-MICRO logic_summary="Exports Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarBadge" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: none."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render a circular counter for additional avatars in a group'; 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/avatar.tsx:AvatarGroupCount:component"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/avatar.tsx:exports:variable" type="variable" identity="exports" parent="~/.framework/src/components/ui/avatar.tsx"]
+// CIL[DOC-MACRO purpose="Re-export the Avatar subcomponents and the Avatar root"]
+// CIL[DOC-RESPONSIBILITY responsibility="Expose the public API of the avatar module for consumers"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/avatar.tsx" layer="ui" related_files=".framework/src/components/ui/avatar.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Avatar, AvatarImage, AvatarFallback, AvatarGroup, AvatarGroupCount, and AvatarBadge named exports" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Named export list for the Avatar components" notable_decisions="Exports all subcomponents so consumers can compose them explicitly"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.9" flags="[]"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 export {
   Avatar,
   AvatarImage,
@@ -229,4 +238,10 @@ export {
   AvatarGroupCount,
   AvatarBadge,
 }
-// CIL[END chunk_id="avatar_exports_1783883196"]
+// CIL[DOC-VECTOR type="context" content="purpose='Re-export the Avatar subcomponents and the Avatar root'; 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/avatar.tsx:exports:variable"]

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

@@ -1,42 +1,38 @@
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/badge.tsx:module_header:module_header" type="module_header" identity="module_header" parent="~/.framework/src/components/ui/badge.tsx"]
+// CIL[DOC-MACRO purpose="Import the dependencies and utilities used by the badge component module"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provide React, cva, radix Slot, and the cn utility to the Badge and badgeVariants definitions"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/badge.tsx" layer="ui" related_files=".framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="none" outputs="React, cva, Slot, and cn bindings available to the module" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Import third-party and local dependencies required by badge variants and the Badge component" notable_decisions="Uses the @/lib/utils alias to import the cn class-name utility"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
+
 
 
 
 
-// CIL[BEGIN chunk_id="badge_module_header_1783883196" type="module_header" identity="module_header" parent="none"]
-// CIL[DOC-MACRO purpose="Import React, styling, and composition dependencies for Badge"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide external dependencies for Badge UI component"]
-// CIL[DOC-CONTEXT module="badge" layer="ui" related_files="[\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/functions/_shared/principal.ts\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="React, cva, VariantProps, Slot, cn" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Imports React, class-variance-authority, Radix Slot for composition, utility function" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-AUDIENCE audience="developer"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/pages/admin/RolesPage.tsx, custom/apps/portal/pages/ContentPage.tsx, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/functions/_shared/principal.ts, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
-// CIL[DOC-VECTOR type="implementation_pattern" content="" status="pending_human_input"]
-// CIL[DOC-VECTOR type="user_journey" content="" status="pending_human_input"]
 import * as React from "react"
 import { cva, type VariantProps } from "class-variance-authority"
 import { Slot } from "radix-ui"
 
 import { cn } from "@/lib/utils"
-// CIL[END chunk_id="badge_module_header_1783883196"]
-// CIL[BEGIN chunk_id="badge_badgevariants_1783883196" type="constant" identity="badgeVariants" parent="none"]
-// CIL[DOC-MACRO purpose="Define comprehensive styling variants for Badge component"]
-// CIL[DOC-RESPONSIBILITY responsibility="Manage Badge visual appearance with multiple variant options"]
-// CIL[DOC-CONTEXT module="badge" layer="ui" related_files="[\".framework/src/pages/admin/RolesPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="badgeVariants function" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Creates CVA config with default, secondary, destructive, outline, ghost, link variants" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 1. Direct calls: 0. Related files: .framework/src/pages/admin/RolesPage.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/components/ui/table-primitives.tsx, custom/apps/portal/pages/ContentPage.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 1. Total affected: 3."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Import the dependencies and utilities used by the badge component module'; 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/badge.tsx:module_header:module_header"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/badge.tsx:badgeVariants:constant" type="constant" identity="badgeVariants" parent="~/.framework/src/components/ui/badge.tsx"]
+// CIL[DOC-MACRO purpose="Define the class-variance-authority configuration for badge styling"]
+// CIL[DOC-RESPONSIBILITY responsibility="Provide a cva-based styling contract with named variants for the Badge component"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/badge.tsx" layer="ui" related_files=".framework/src/components/ui/badge.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="variant name string (default, secondary, destructive, outline, ghost, link)" outputs="string of Tailwind CSS classes for the selected badge variant" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Build a cva style function with base classes and variant-driven class mappings" notable_decisions="Keeps all Tailwind classes inline; supports aria-invalid and has-data icon selectors"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 const badgeVariants = cva(
   "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-[0.625rem] font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-2.5!",
   {
@@ -59,21 +55,23 @@ const badgeVariants = cva(
     },
   }
 )
-// CIL[END chunk_id="badge_badgevariants_1783883196"]
-// CIL[BEGIN chunk_id="badge_badge_1783883196" type="function" identity="Badge" parent="none"]
-// CIL[DOC-MACRO purpose="Main Badge component with composition support and variants"]
-// CIL[DOC-RESPONSIBILITY responsibility="Render styled badge with optional element composition via asChild"]
-// CIL[DOC-CONTEXT module="badge" layer="ui" related_files="[\".framework/src/pages/admin/RolesPage.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="JSX element" errors="none" side_effects="renders DOM"]
-// CIL[DOC-MICRO logic_summary="Creates badge with Radix Slot composition, applies variants, spreads props" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 2. Direct calls: 0. Related files: .framework/src/pages/admin/RolesPage.tsx, custom/apps/portal/pages/ContentPage.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/components/ui/table-primitives.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 2. Total affected: 2."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Define the class-variance-authority configuration for badge styling'; 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/badge.tsx:badgeVariants:constant"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/badge.tsx:Badge:component" type="component" identity="Badge" parent="~/.framework/src/components/ui/badge.tsx"]
+// CIL[DOC-MACRO purpose="Render a small status badge element with variant-based Tailwind styling"]
+// CIL[DOC-RESPONSIBILITY responsibility="Render a span or polymorphic child element styled by the badgeVariants contract"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/badge.tsx" layer="ui" related_files=".framework/src/components/ui/badge.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="className: string, variant: cva variant name, asChild: boolean, VariantProps type from cva, plus standard span props" outputs="JSX element styled with the computed badge classes" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Select Slot.Root or span based on asChild, then render with merged classes and data attributes" notable_decisions="Defaults variant to default; merges additional className with the variant classes"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 function Badge({
   className,
   variant = "default",
@@ -92,20 +90,27 @@ function Badge({
     />
   )
 }
-// CIL[END chunk_id="badge_badge_1783883196"]
-// CIL[BEGIN chunk_id="badge_exports_1783883196" type="exports" identity="exports" parent="none"]
-// CIL[DOC-MACRO purpose="Export Badge component and variants for external use"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide public API for Badge component library"]
-// CIL[DOC-CONTEXT module="badge" layer="ui" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="exported Badge, badgeVariants" errors="none" side_effects="module exports"]
-// CIL[DOC-MICRO logic_summary="Exports Badge component and badgeVariants styling function" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: ui. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, .framework/src/pages/admin/RolesPage.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/components/ui/table-primitives.tsx, \."]
-// CIL[DOC-VECTOR type="blast_radius" content="Direct callers: 0. Total affected: 0."]
-// CIL[DOC-VECTOR type="configuration" content="No configuration dependencies."]
-// CIL[DOC-VECTOR type="constraint" content="No test paths identified."]
+// CIL[DOC-VECTOR type="context" content="purpose='Render a small status badge element with variant-based Tailwind styling'; 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/badge.tsx:Badge:component"]
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/badge.tsx:exports:variable" type="variable" identity="exports" parent="~/.framework/src/components/ui/badge.tsx"]
+// CIL[DOC-MACRO purpose="Re-export the Badge component and badgeVariants style utility"]
+// CIL[DOC-RESPONSIBILITY responsibility="Expose the public API of the badge module for consumers"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui/badge.tsx" layer="ui" related_files=".framework/src/components/ui/badge.tsx,.framework/src/lib/utils.ts"]
+// CIL[DOC-CONTRACT inputs="none" outputs="Badge and badgeVariants named exports" errors="none" side_effects="none"]
+// CIL[DOC-MICRO logic_summary="Named export list for the Badge component and badgeVariants constant" notable_decisions="Exports both component and styling contract so consumers can compose or extend variants"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stable]
+// CIL[DOC-AUDIENCE audience="developers"]
 export { Badge, badgeVariants }
-// CIL[END chunk_id="badge_exports_1783883196"]
+// CIL[DOC-VECTOR type="context" content="purpose='Re-export the Badge component and badgeVariants style utility'; 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/badge.tsx:exports:variable"]