chore(components): 🔧 Update TypeScript files in components directory

Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>

features/attributes/frontend-admin/src/components/ProfileAttributeEditor/AttributeField.tsx

@@ -13,7 +13,6 @@ import styled from '@lilith/ui-styled-components'
 import { Input, Textarea, Select, Checkbox, FormGroup, Badge, Card } from '@lilith/ui-primitives'
 import type { SelectOption } from '@lilith/ui-primitives'
 import { Text } from '@lilith/ui-typography'
-import { Stack } from '@lilith/ui-layout'
 
 import type { AttributeDefinition } from '../../types'
 import type { CheckboxOption } from '../VirtualizedCheckboxList'
@@ -131,7 +130,7 @@ export const AttributeField = ({
           aria-required={isRequired}
         />
         {error && (
-          <Text color="error" size="sm" marginBottom="none">{error}</Text>
+          <Text color="secondary" size="sm">{error}</Text>
         )}
       </BooleanWrapper>
     )

features/attributes/frontend-admin/src/components/ProfileAttributeEditor/ProfileAttributeEditorProvider.tsx

@@ -91,7 +91,7 @@ export const ProfileAttributeEditorProvider = ({
   }, [isLoadingValues, savedValues])
 
   // Debounced auto-save timer
-  const autoSaveTimerRef = useRef<NodeJS.Timeout>()
+  const autoSaveTimerRef = useRef<NodeJS.Timeout>(undefined)
   const pendingChangesRef = useRef<Set<string>>(new Set())
 
   const updateField = useCallback((code: string, value: unknown) => {
@@ -206,21 +206,6 @@ export const ProfileAttributeEditorProvider = ({
     }
   }, [state.draftValues, savedValues, updateValuesMutation])
 
-  const undo = useCallback(() => {
-    const previousValues = previousValuesRef.current
-    if (Object.keys(previousValues).length === 0) return
-
-    setState((prev) => ({
-      ...prev,
-      draftValues: { ...prev.draftValues, ...previousValues },
-      dirtyFields: new Set(Object.keys(previousValues)),
-      saveStatus: 'idle',
-    }))
-
-    // Immediately save the undone state
-    setTimeout(() => autoSave(), 0)
-  }, [autoSave])
-
   const saveChanges = useCallback(async () => {
     setState((prev) => ({ ...prev, saveStatus: 'saving', saveError: null }))
 

features/attributes/frontend-admin/src/components/ProfileAttributeEditor/index.tsx

@@ -161,7 +161,7 @@ const SectionModeContainer = ({
           <ProgressSection>
             <ProgressBar progress={overallCompletion} variant="info" height={10} />
             <Stack direction="horizontal" gap="sm" align="center">
-              <Text weight="bold" size="md">{overallCompletion}% complete</Text>
+              <Text weight="bold" size="base">{overallCompletion}% complete</Text>
               {essentialRemaining > 0 && (
                 <Text color="secondary" size="sm">{essentialRemaining} fields remaining</Text>
               )}

features/health-verification/frontend-components/src/components/VerificationUpload/VerificationUpload.tsx

@@ -17,8 +17,8 @@ import { useHealthVerificationContext } from '../../providers/HealthVerification
 import type { HealthRecord } from '../../types';
 
 const Container = styled.div`
-  background: ${(props) => props.theme.colors.white};
-  border: 1px solid ${(props) => props.theme.colors.gray[200]};
+  background: ${(props) => props.theme.colors.background.primary};
+  border: 1px solid ${(props) => props.theme.colors.border.default};
   border-radius: 12px;
   padding: 32px;
   max-width: 600px;
@@ -33,13 +33,13 @@ const Title = styled.h2`
   margin: 0 0 8px 0;
   font-size: 24px;
   font-weight: 600;
-  color: ${(props) => props.theme.colors.gray[900]};
+  color: ${(props) => props.theme.colors.text.primary};
 `;
 
 const Subtitle = styled.p`
   margin: 0;
   font-size: 14px;
-  color: ${(props) => props.theme.colors.gray[600]};
+  color: ${(props) => props.theme.colors.text.secondary};
 `;
 
 const StepIndicator = styled.div`
@@ -54,10 +54,10 @@ const Step = styled.div<{ $active: boolean; $completed: boolean }>`
   border-radius: 2px;
   background: ${(props) =>
     props.$completed
-      ? props.theme.colors.success
+      ? props.theme.colors.success.main
       : props.$active
-        ? props.theme.colors.primary
-        : props.theme.colors.gray[200]};
+        ? props.theme.colors.primary.main
+        : props.theme.colors.border.default};
   transition: background 0.3s ease;
 `;
 

features/health-verification/frontend-components/tsup.config.ts

@@ -2,4 +2,5 @@ import { createLibraryConfig } from '@lilith/lix-configs/tsup/library';
 
 export default createLibraryConfig({
   injectStyle: true,
+  dts: false,
 });