spine-framework 0.3.145 → 0.4.1

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

@@ -1,3 +1,13 @@
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:module_header:module_header" type="module_header" identity="module_header" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Provides reusable form, field, section, row and column UI primitives"]
+// CIL[DOC-RESPONSIBILITY responsibility="Aggregate form-building components and their prop types for the shared UI library"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Imports React, local types, FieldRenderer, Button and utility classes; exports five related components" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
+// CIL[DOC-AUDIENCE audience="UI component consumers and form authors"]
+
 
 
 
@@ -21,41 +31,27 @@
 
 
 
-// CIL[BEGIN chunk_id="Form_moduleheader_1783907801" type="module_header" identity="imports" parent="none"]
-// CIL[DOC-MACRO purpose="Import React and form dependencies"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide all external dependencies for form components"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/src/components/ui/dialog.tsx\",\".framework/src/pages/admin/RolesPage.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="React, FieldDefinition, FieldRenderer, Button, cn" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Imports React, types, field renderer, button component, 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: frontend-component. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.tsx, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/src/components/ui/dialog.tsx, .framework/src/pages/admin/RolesPage.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 React from 'react'
 import { FieldDefinition } from '../../types/types'
 import { FieldRenderer } from '../shared/FieldRenderer'
 import { Button } from './button'
 import { cn } from '../../lib/utils'
-// CIL[END chunk_id="Form_moduleheader_1783907801"]
-// CIL[BEGIN chunk_id="Form_formprops_1783907801" type="interface" identity="FormProps" parent="none"]
-// CIL[DOC-MACRO purpose="Define main form component props interface"]
-// CIL[DOC-RESPONSIBILITY responsibility="Specify all props needed for Form component configuration"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[\".framework/src/components/ui/dialog.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\".framework/functions/_shared/schema-utils.ts\",\"custom/apps/portal/pages/ContentPage.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FormProps interface" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Comprehensive props for fields, data, validation, and form actions" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/src/components/ui/dialog.tsx, .framework/src/components/ui/table-primitives.tsx, .framework/functions/_shared/schema-utils.ts, custom/apps/portal/pages/ContentPage.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='Provides reusable form, field, section, row and column UI primitives'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:module_header:module_header"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormProps:interface" type="interface" identity="FormProps" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Defines the prop contract for the Form component"]
+// CIL[DOC-RESPONSIBILITY responsibility="Declare configurable form state, handlers and action labels"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Fields, data, errors, touched, onChange, onBlur, onSubmit, isSubmitting, submit/cancel controls, disabled and className" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 interface FormProps {
   fields: FieldDefinition[]
   data: Record<string, any>
@@ -72,21 +68,22 @@ interface FormProps {
   disabled?: boolean
   className?: string
 }
-// CIL[END chunk_id="Form_formprops_1783907801"]
-// CIL[BEGIN chunk_id="Form_form_1783907801" type="function" identity="Form" parent="none"]
-// CIL[DOC-MACRO purpose="Render schema-driven form with validation and actions"]
-// CIL[DOC-RESPONSIBILITY responsibility="Handle form submission, field rendering, and error display"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[\"custom/apps/portal/pages/ContentPage.tsx\",\".framework/functions/_shared/schema-utils.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\"custom/apps/cortex/pages/operations/OperationsDashboard.tsx\",\".framework/src/components/ui/table-primitives.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="Form element" errors="none" side_effects="Calls onSubmit, onChange, onBlur callbacks"]
-// CIL[DOC-MICRO logic_summary="Maps fields to FieldRenderer, shows errors only for touched fields" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: custom/apps/portal/pages/ContentPage.tsx, .framework/functions/_shared/schema-utils.ts, .framework/src/pages/admin/TypeDetailPage.tsx, custom/apps/cortex/pages/operations/OperationsDashboard.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='Defines the prop contract for the Form component'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormProps:interface"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:Form:component" type="component" identity="Form" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Renders a dynamic form from FieldDefinition objects with validation and action buttons"]
+// CIL[DOC-RESPONSIBILITY responsibility="Map fields to FieldRenderer, manage submit and cancel actions, and apply layout classes"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="fields, data, errors, touched, onChange, onBlur, onSubmit, isSubmitting, submitText, cancelText, onCancel, showCancel, disabled, className" outputs="JSX form element" errors="None" side_effects="Calls onChange, onBlur, onSubmit and onCancel callbacks"]
+// CIL[DOC-MICRO logic_summary="Filters unnamed fields, delegates per-field rendering to FieldRenderer, and renders submit/cancel buttons in a flex action row" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 export function Form({
   fields,
   data,
@@ -157,21 +154,22 @@ export function Form({
     </form>
   )
 }
-// CIL[END chunk_id="Form_form_1783907801"]
-// CIL[BEGIN chunk_id="Form_formfieldprops_1783907801" type="interface" identity="FormFieldProps" parent="none"]
-// CIL[DOC-MACRO purpose="Define props for single form field wrapper"]
-// CIL[DOC-RESPONSIBILITY responsibility="Specify props needed for individual field rendering"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[\".framework/functions/_shared/schema-utils.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/functions/_shared/principal.ts\",\".framework/src/pages/admin/IntegrationsPage.tsx\",\"custom/apps/portal/pages/ContentPage.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FormFieldProps interface" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Props for field definition, value, error state, and callbacks" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/functions/_shared/schema-utils.ts, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/functions/_shared/principal.ts, .framework/src/pages/admin/IntegrationsPage.tsx, custom/apps/portal/pages/ContentPage.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='Renders a dynamic form from FieldDefinition objects with validation and action buttons'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:Form:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormFieldProps:interface" type="interface" identity="FormFieldProps" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Defines the per-field prop contract for the FormField wrapper"]
+// CIL[DOC-RESPONSIBILITY responsibility="Describe the inputs consumed by a single FormField instance"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Single field definition, value, optional error, touched flag, onChange, onBlur and readonly flag" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 interface FormFieldProps {
   field: FieldDefinition
   value: any
@@ -181,21 +179,22 @@ interface FormFieldProps {
   onBlur?: () => void
   readonly?: boolean
 }
-// CIL[END chunk_id="Form_formfieldprops_1783907801"]
-// CIL[BEGIN chunk_id="Form_formfield_1783907801" type="function" identity="FormField" parent="none"]
-// CIL[DOC-MACRO purpose="Render single form field with touched-gated error display"]
-// CIL[DOC-RESPONSIBILITY responsibility="Wrap FieldRenderer with conditional error visibility"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[\".framework/functions/_shared/schema-utils.ts\",\".framework/src/pages/admin/TypeDetailPage.tsx\",\".framework/functions/_shared/db.ts\",\"custom/apps/portal/pages/ContentPage.tsx\",\"\\\"]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FieldRenderer component" errors="none" side_effects="Delegates to onChange/onBlur"]
-// CIL[DOC-MICRO logic_summary="Passes error to FieldRenderer only when field has been touched" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. Direct callers: 0. Direct calls: 0. Related files: .framework/functions/_shared/schema-utils.ts, .framework/src/pages/admin/TypeDetailPage.tsx, .framework/functions/_shared/db.ts, custom/apps/portal/pages/ContentPage.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='Defines the per-field prop contract for the FormField wrapper'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormFieldProps:interface"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormField:component" type="component" identity="FormField" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Wraps FieldRenderer for a single form field value"]
+// CIL[DOC-RESPONSIBILITY responsibility="Forward field props to FieldRenderer with touched-gated error display"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="field, value, error, touched, onChange, onBlur, readonly" outputs="JSX field rendering" errors="None" side_effects="None"]
+// CIL[DOC-MICRO logic_summary="Renders a FieldRenderer and suppresses the error text until the field is touched" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 export function FormField({
   field,
   value,
@@ -216,42 +215,44 @@ export function FormField({
     />
   )
 }
-// CIL[END chunk_id="Form_formfield_1783907801"]
-// CIL[BEGIN chunk_id="Form_formsectionprops_1783907801" type="interface" identity="FormSectionProps" parent="none"]
-// CIL[DOC-MACRO purpose="Define props for form section container"]
-// CIL[DOC-RESPONSIBILITY responsibility="Specify props for grouping form fields with title/description"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FormSectionProps interface" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Props for optional title, description, children, and 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: frontend-component. 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='Wraps FieldRenderer for a single form field value'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormField:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormSectionProps:interface" type="interface" identity="FormSectionProps" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Defines props for a titled form section wrapper"]
+// CIL[DOC-RESPONSIBILITY responsibility="Declare title, description, children and optional className"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Optional section title, optional description, child content and layout className" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 interface FormSectionProps {
   title?: string
   description?: string
   children: React.ReactNode
   className?: string
 }
-// CIL[END chunk_id="Form_formsectionprops_1783907801"]
-// CIL[BEGIN chunk_id="Form_formsection_1783907801" type="function" identity="FormSection" parent="none"]
-// CIL[DOC-MACRO purpose="Render titled group container for form fields"]
-// CIL[DOC-RESPONSIBILITY responsibility="Display optional title/description with children content"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="Styled div container" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Conditionally renders header section when title or description provided" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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='Defines props for a titled form section wrapper'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormSectionProps:interface"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormSection:component" type="component" identity="FormSection" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Renders a container with an optional title and description"]
+// CIL[DOC-RESPONSIBILITY responsibility="Group child fields under a heading with consistent vertical spacing"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="title, description, children, className" outputs="JSX section div" errors="None" side_effects="None"]
+// CIL[DOC-MICRO logic_summary="Conditionally renders a heading and paragraph, then children inside a spaced div" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 export function FormSection({ title, description, children, className }: FormSectionProps) {
   return (
     <div className={cn('space-y-4', className)}>
@@ -269,40 +270,42 @@ export function FormSection({ title, description, children, className }: FormSec
     </div>
   )
 }
-// CIL[END chunk_id="Form_formsection_1783907801"]
-// CIL[BEGIN chunk_id="Form_formrowprops_1783907801" type="interface" identity="FormRowProps" parent="none"]
-// CIL[DOC-MACRO purpose="Define props for responsive form row container"]
-// CIL[DOC-RESPONSIBILITY responsibility="Specify props for two-column grid layout row"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FormRowProps interface" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Props for children content and optional styling classes" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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='Renders a container with an optional title and description'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormSection:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormRowProps:interface" type="interface" identity="FormRowProps" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Defines props for a responsive form row layout"]
+// CIL[DOC-RESPONSIBILITY responsibility="Declare children and optional className for a grid row"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Children to render and an optional className override" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 interface FormRowProps {
   children: React.ReactNode
   className?: string
 }
-// CIL[END chunk_id="Form_formrowprops_1783907801"]
-// CIL[BEGIN chunk_id="Form_formrow_1783907801" type="function" identity="FormRow" parent="none"]
-// CIL[DOC-MACRO purpose="Render two-column responsive grid for form fields"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide responsive grid layout container"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="Grid div container" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Uses Tailwind grid classes for responsive two-column layout" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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='Defines props for a responsive form row layout'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormRowProps:interface"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormRow:component" type="component" identity="FormRow" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Provides a responsive grid row for laying out form columns"]
+// CIL[DOC-RESPONSIBILITY responsibility="Render children in a one or two column grid with a gap"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="children, className" outputs="JSX grid div" errors="None" side_effects="None"]
+// CIL[DOC-MICRO logic_summary="Uses a single column on small screens and two columns on the sm breakpoint" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 export function FormRow({ children, className }: FormRowProps) {
   return (
     <div className={cn('grid grid-cols-1 sm:grid-cols-2 gap-4', className)}>
@@ -310,41 +313,43 @@ export function FormRow({ children, className }: FormRowProps) {
     </div>
   )
 }
-// CIL[END chunk_id="Form_formrow_1783907801"]
-// CIL[BEGIN chunk_id="Form_formcolumnprops_1783907801" type="interface" identity="FormColumnProps" parent="none"]
-// CIL[DOC-MACRO purpose="Define props for form column within grid row"]
-// CIL[DOC-RESPONSIBILITY responsibility="Specify props for column span and content"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="FormColumnProps interface" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Props for children, column span (1 or 2), and 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: frontend-component. 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='Provides a responsive grid row for laying out form columns'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormRow:component"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormColumnProps:interface" type="interface" identity="FormColumnProps" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Defines props for a grid column with span control"]
+// CIL[DOC-RESPONSIBILITY responsibility="Declare children, span and optional className for a column"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="N/A" outputs="N/A" errors="N/A" side_effects="N/A"]
+// CIL[DOC-MICRO logic_summary="Children, optional span value of 1 or 2, and layout className" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 interface FormColumnProps {
   children: React.ReactNode
   span?: 1 | 2
   className?: string
 }
-// CIL[END chunk_id="Form_formcolumnprops_1783907801"]
-// CIL[BEGIN chunk_id="Form_formcolumn_1783907801" type="function" identity="FormColumn" parent="none"]
-// CIL[DOC-MACRO purpose="Render column within FormRow grid with span control"]
-// CIL[DOC-RESPONSIBILITY responsibility="Provide column container with configurable span"]
-// CIL[DOC-CONTEXT module="Form" layer="frontend-component" related_files="[]"]
-// CIL[DOC-CONTRACT inputs="none" outputs="Column div with span classes" errors="none" side_effects="none"]
-// CIL[DOC-MICRO logic_summary="Maps span values to Tailwind col-span classes for grid layout" notable_decisions="[]"]
-// CIL[DOC-CONFIDENCE pass="second" score="0.95" flags="none"]
-// CIL[DOC-STABILITY stability="stable"]
-// CIL[DOC-VECTOR type="context" content="Layer: frontend-component. 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='Defines props for a grid column with span control'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormColumnProps:interface"]
+
+// CIL[BEGIN stable_id="~/.framework/src/components/ui/Form.tsx:FormColumn:component" type="component" identity="FormColumn" parent="~/.framework/src/components/ui/Form.tsx"]
+// CIL[DOC-MACRO purpose="Renders a grid column with a configurable col-span"]
+// CIL[DOC-RESPONSIBILITY responsibility="Apply the requested tailwind column span class to children"]
+// CIL[DOC-CONTEXT module=".framework/src/components/ui" layer="ui" related_files=".framework/src/components/shared/FieldRenderer.tsx,.framework/src/components/ui/Form.tsx,.framework/src/components/ui/button.tsx,.framework/src/lib/utils.ts,.framework/src/types/types.ts"]
+// CIL[DOC-CONTRACT inputs="children, span, className" outputs="JSX column div" errors="None" side_effects="None"]
+// CIL[DOC-MICRO logic_summary="Maps span to a tailwind col-span class via a lookup and merges an optional className" notable_decisions="[]"]
+// CIL[DOC-CONFIDENCE pass="second" score="0.90" flags="none"]
+// CIL[DOC-STABILITY stability="stable"]
 export function FormColumn({ children, span = 1, className }: FormColumnProps) {
   const spanClasses = {
     1: 'col-span-1',
@@ -357,4 +362,10 @@ export function FormColumn({ children, span = 1, className }: FormColumnProps) {
     </div>
   )
 }
-// CIL[END chunk_id="Form_formcolumn_1783907801"]
+// CIL[DOC-VECTOR type="context" content="purpose='Renders a grid column with a configurable col-span'; No verified external callers; imports: .framework/src/types/types.ts,.framework/src/components/shared/FieldRenderer.tsx,.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/Form.tsx:FormColumn:component"]