diff --git a/packages/contact-center/cc-components/ai-docs/AGENTS.md b/packages/contact-center/cc-components/ai-docs/AGENTS.md
new file mode 100644
index 000000000..39f5c8bee
--- /dev/null
+++ b/packages/contact-center/cc-components/ai-docs/AGENTS.md
@@ -0,0 +1,370 @@
+# CC Components Library
+
+## Overview
+
+The CC Components library is a shared React component library that provides presentational components for building contact center widgets. It contains all the UI components used by widgets like StationLogin, UserState, TaskList, CallControl, and more. These components are built using Momentum UI and follow a consistent design system.
+
+**Package:** `@webex/cc-components`
+
+**Version:** See [package.json](../package.json)
+
+---
+
+## Why and What is This Library Used For?
+
+### Purpose
+
+The CC Components library serves as the presentation layer for contact center widgets. It:
+- **Provides reusable UI components** for all contact center widgets
+- **Maintains consistent design** using Momentum UI components
+- **Separates presentation from business logic** following best practices
+- **Integrates metrics tracking** via the ui-logging package
+- **Exports type definitions** for TypeScript support
+
+### Key Capabilities
+
+- **Component Library**: Pre-built, tested UI components for common contact center scenarios
+- **Momentum UI Integration**: Built on top of @momentum-ui/react-collaboration
+- **Type Safety**: Full TypeScript support with exported interfaces
+- **Metrics Ready**: Components can be wrapped with metrics HOC
+- **Store Integration**: Components consume data from @webex/cc-store
+- **Dual Exports**: Both React components and Web Component-ready builds
+
+---
+
+## Examples and Use Cases
+
+### Getting Started
+
+#### Basic Component Import (React)
+
+```typescript
+import { StationLoginComponent } from '@webex/cc-components';
+import React from 'react';
+
+function MyCustomLogin() {
+  const props = {
+    teams: ['Team A', 'Team B'],
+    loginOptions: ['BROWSER', 'EXTENSION'],
+    deviceType: 'BROWSER',
+    login: () => console.log('Login called'),
+    // ... other required props
+  };
+
+  return <StationLoginComponent {...props} />;
+}
+```
+
+#### Using UserStateComponent
+
+```typescript
+import { UserStateComponent } from '@webex/cc-components';
+import { observer } from 'mobx-react-lite';
+import store from '@webex/cc-store';
+
+const UserStateWrapper = observer(() => {
+  const props = {
+    idleCodes: store.idleCodes,
+    currentState: store.currentState,
+    setAgentStatus: (code) => console.log('Status changed:', code),
+    elapsedTime: 120,
+    // ... other props
+  };
+
+  return <UserStateComponent {...props} />;
+});
+```
+
+### Common Use Cases
+
+#### 1. Building Custom Widgets
+
+```typescript
+import { TaskListComponent } from '@webex/cc-components';
+import store from '@webex/cc-store';
+import { observer } from 'mobx-react-lite';
+
+const CustomTaskList = observer(() => {
+  const handleTaskSelect = (taskId: string) => {
+    console.log('Task selected:', taskId);
+    // Custom handling logic
+  };
+
+  return (
+    <TaskListComponent
+      tasks={store.tasks}
+      selectedTaskId={store.selectedTaskId}
+      onTaskSelected={handleTaskSelect}
+      logger={store.logger}
+    />
+  );
+});
+```
+
+#### 2. Extending Components with Custom Logic
+
+```typescript
+import { CallControlComponent } from '@webex/cc-components';
+import { useCallback } from 'react';
+
+function EnhancedCallControl({ taskId }) {
+  const handleHold = useCallback(() => {
+    // Add analytics tracking
+    trackEvent('call_hold_clicked', { taskId });
+    
+    // Call original handler
+    return store.holdCall(taskId);
+  }, [taskId]);
+
+  return (
+    <CallControlComponent
+      task={store.getTask(taskId)}
+      onHoldResume={handleHold}
+      // ... other props
+    />
+  );
+}
+```
+
+#### 3. Using Type Definitions
+
+```typescript
+import type { 
+  StationLoginComponentProps, 
+  IUserState,
+  UserStateComponentsProps 
+} from '@webex/cc-components';
+
+// Type-safe prop interfaces
+const loginProps: StationLoginComponentProps = {
+  teams: ['Team A'],
+  loginOptions: ['BROWSER'],
+  deviceType: 'BROWSER',
+  login: () => {},
+  // TypeScript ensures all required props are present
+};
+```
+
+#### 4. Integration with Metrics HOC
+
+```typescript
+import { StationLoginComponent } from '@webex/cc-components';
+import { withMetrics } from '@webex/cc-ui-logging';
+
+// Wrap component with metrics tracking
+const StationLoginWithMetrics = withMetrics(
+  StationLoginComponent, 
+  'StationLoginComponent'
+);
+
+// Use the wrapped component
+function App() {
+  return <StationLoginWithMetrics {...props} />;
+}
+```
+
+### Integration Patterns
+
+#### With Custom Styling
+
+```typescript
+import { UserStateComponent } from '@webex/cc-components';
+import './custom-user-state.scss'; // Your custom styles
+
+// Components use BEM naming, easy to override
+function StyledUserState(props) {
+  return (
+    <div className="my-custom-wrapper">
+      <UserStateComponent {...props} />
+    </div>
+  );
+}
+```
+
+#### With Error Boundaries
+
+```typescript
+import { IncomingTaskComponent } from '@webex/cc-components';
+import { ErrorBoundary } from 'react-error-boundary';
+
+function SafeIncomingTask(props) {
+  return (
+    <ErrorBoundary fallback={<div>Error loading task</div>}>
+      <IncomingTaskComponent {...props} />
+    </ErrorBoundary>
+  );
+}
+```
+
+#### Creating Composite Components
+
+```typescript
+import { 
+  CallControlComponent,
+  TaskListComponent 
+} from '@webex/cc-components';
+import { observer } from 'mobx-react-lite';
+import store from '@webex/cc-store';
+
+// Combine multiple components
+const TaskPanel = observer(() => {
+  const selectedTask = store.selectedTask;
+
+  return (
+    <div className="task-panel">
+      <TaskListComponent 
+        tasks={store.tasks}
+        onTaskSelected={(id) => store.setSelectedTask(id)}
+      />
+      {selectedTask && (
+        <CallControlComponent 
+          task={selectedTask}
+          onEnd={() => store.endTask(selectedTask.id)}
+        />
+      )}
+    </div>
+  );
+});
+```
+
+---
+
+## Dependencies
+
+**Note:** For exact versions, see [package.json](../package.json)
+
+### Runtime Dependencies
+
+| Package | Purpose |
+|---------|---------|
+| `@momentum-ui/illustrations` | Momentum UI illustration assets |
+| `@r2wc/react-to-web-component` | React to Web Component conversion (for wc.ts export) |
+| `@webex/cc-store` | MobX singleton store for state management |
+| `@webex/cc-ui-logging` | Metrics tracking utilities |
+
+### Peer Dependencies
+
+| Package | Purpose |
+|---------|---------|
+| `@momentum-ui/react-collaboration` | Momentum UI React components |
+| `react` | React framework |
+| `react-dom` | React DOM rendering |
+
+### Development Dependencies
+
+Key development tools (see [package.json](../package.json) for versions):
+- TypeScript
+- Jest (testing)
+- Webpack (bundling)
+- ESLint (linting)
+- React Testing Library
+
+---
+
+## Exported Components
+
+### Main Components
+
+| Component | Purpose | Key Props |
+|-----------|---------|-----------|
+| `StationLoginComponent` | Agent station login UI | `teams`, `loginOptions`, `deviceType`, `login`, `logout` |
+| `UserStateComponent` | Agent state management UI | `idleCodes`, `currentState`, `setAgentStatus`, `elapsedTime` |
+| `CallControlComponent` | Call control buttons | `task`, `onHoldResume`, `onEnd`, `onWrapUp` |
+| `CallControlCADComponent` | CAD-enabled call control | `task`, `onHoldResume`, `onEnd`, `cadVariables` |
+| `IncomingTaskComponent` | Incoming task notifications | `incomingTask`, `onAccepted`, `onRejected` |
+| `TaskListComponent` | Active tasks list | `tasks`, `selectedTaskId`, `onTaskSelected` |
+| `OutdialCallComponent` | Outbound dialing UI | `entryPoints`, `addressBook`, `onDial` |
+
+### Type Exports
+
+```typescript
+export * from './components/StationLogin/constants';
+export * from './components/StationLogin/station-login.types';
+export * from './components/UserState/user-state.types';
+export * from './components/task/task.types';
+```
+
+### Dual Export Paths
+
+```typescript
+// React components (default export)
+import { StationLoginComponent } from '@webex/cc-components';
+
+// Web Component wrappers (for wc.ts export)
+import { StationLoginComponent } from '@webex/cc-components/wc';
+```
+
+---
+
+## Installation
+
+```bash
+# Install as part of contact center widgets development
+yarn add @webex/cc-components
+
+# Peer dependencies (required)
+yarn add @momentum-ui/react-collaboration react react-dom
+```
+
+---
+
+## Usage in Widget Development
+
+### Creating a New Widget
+
+```typescript
+// 1. Create widget wrapper
+import { StationLoginComponent } from '@webex/cc-components';
+import { observer } from 'mobx-react-lite';
+import store from '@webex/cc-store';
+
+const MyWidget = observer((props) => {
+  // 2. Add business logic/hooks
+  const handleLogin = () => {
+    // Business logic
+  };
+
+  // 3. Map store data to component props
+  const componentProps = {
+    teams: store.teams,
+    loginOptions: store.loginOptions,
+    deviceType: store.deviceType,
+    login: handleLogin,
+    ...props
+  };
+
+  // 4. Render component
+  return <StationLoginComponent {...componentProps} />;
+});
+```
+
+### Testing Components
+
+```typescript
+import { render } from '@testing-library/react';
+import { StationLoginComponent } from '@webex/cc-components';
+
+test('renders station login', () => {
+  const props = {
+    teams: ['Team A'],
+    loginOptions: ['BROWSER'],
+    deviceType: 'BROWSER',
+    login: jest.fn(),
+    // ... minimal required props
+  };
+
+  const { getByText } = render(<StationLoginComponent {...props} />);
+  expect(getByText('Login')).toBeInTheDocument();
+});
+```
+
+---
+
+## Additional Resources
+
+For detailed component architecture, integration patterns, and troubleshooting, see [architecture.md](./architecture.md).
+
+---
+
+_Last Updated: 2025-11-26_
+
diff --git a/packages/contact-center/cc-components/ai-docs/ARCHITECTURE.md b/packages/contact-center/cc-components/ai-docs/ARCHITECTURE.md
new file mode 100644
index 000000000..4e79d556b
--- /dev/null
+++ b/packages/contact-center/cc-components/ai-docs/ARCHITECTURE.md
@@ -0,0 +1,516 @@
+# CC Components Library - Architecture
+
+## Component Overview
+
+The CC Components library is a presentation-layer package that provides reusable React components for contact center widgets. It follows a component library pattern where each component is a pure presentational component that receives all data and callbacks via props.
+
+### Component Table
+
+| Component | File | Props Interface | Styling | Tests | Dependencies |
+|-----------|------|-----------------|---------|-------|--------------|
+| **StationLoginComponent** | `src/components/StationLogin/station-login.tsx` | `StationLoginComponentProps` | SCSS | `tests/components/StationLogin/` | Momentum UI, ui-logging |
+| **UserStateComponent** | `src/components/UserState/user-state.tsx` | `UserStateComponentsProps` | SCSS | `tests/components/UserState/` | Momentum UI, ui-logging |
+| **CallControlComponent** | `src/components/task/CallControl/call-control.tsx` | Task-based props | SCSS | `tests/components/task/CallControl/` | Momentum UI |
+| **CallControlCADComponent** | `src/components/task/CallControlCAD/call-control-cad.tsx` | Task-based props | SCSS | `tests/components/task/CallControlCAD/` | Momentum UI |
+| **IncomingTaskComponent** | `src/components/task/IncomingTask/incoming-task.tsx` | Task-based props | N/A | `tests/components/task/IncomingTask/` | Momentum UI |
+| **TaskListComponent** | `src/components/task/TaskList/task-list.tsx` | Task-based props | SCSS | `tests/components/task/TaskList/` | Momentum UI |
+| **OutdialCallComponent** | `src/components/task/OutdialCall/outdial-call.tsx` | OutdialCall props | SCSS | `tests/components/task/OutdialCall/` | Momentum UI |
+
+### Shared Utilities
+
+| Utility | File | Purpose |
+|---------|------|---------|
+| Station Login Utils | `src/components/StationLogin/station-login.utils.tsx` | Login form handlers, validation |
+| User State Utils | `src/components/UserState/user-state.utils.ts` | State transformation logic |
+| Call Control Utils | `src/components/task/CallControl/call-control.utils.ts` | Call control button logic |
+| Task Utils | `src/components/task/Task/task.utils.ts` | Task data transformation |
+| Task List Utils | `src/components/task/TaskList/task-list.utils.ts` | List rendering logic |
+
+---
+
+## File Structure
+
+```
+cc-components/
+├── src/
+│   ├── components/
+│   │   ├── StationLogin/
+│   │   │   ├── constants.ts              # Login constants
+│   │   │   ├── station-login.style.scss  # Component styles
+│   │   │   ├── station-login.tsx         # Main component
+│   │   │   ├── station-login.types.ts    # TypeScript interfaces
+│   │   │   └── station-login.utils.tsx   # Helper functions
+│   │   ├── UserState/
+│   │   │   ├── constant.ts
+│   │   │   ├── user-state.scss
+│   │   │   ├── user-state.tsx
+│   │   │   ├── user-state.types.ts
+│   │   │   └── user-state.utils.ts
+│   │   └── task/
+│   │       ├── constants.ts              # Task constants
+│   │       ├── task.types.ts             # Shared task types
+│   │       ├── AutoWrapupTimer/
+│   │       ├── CallControl/
+│   │       │   ├── call-control.styles.scss
+│   │       │   ├── call-control.tsx
+│   │       │   ├── call-control.utils.ts
+│   │       │   └── CallControlCustom/    # Consult/Transfer UI
+│   │       ├── CallControlCAD/
+│   │       ├── IncomingTask/
+│   │       ├── OutdialCall/
+│   │       ├── Task/
+│   │       ├── TaskList/
+│   │       └── TaskTimer/
+│   ├── utils/                            # Shared utilities
+│   ├── index.ts                          # Main exports
+│   └── wc.ts                             # Web Component exports
+├── tests/                                # Mirror src structure
+│   └── components/                       # Component tests
+├── dist/                                 # Build output
+├── package.json
+├── tsconfig.json
+└── webpack.config.js
+```
+
+---
+
+## Integration Architecture
+
+The library follows a clear separation of concerns where components are pure presentational:
+
+```mermaid
+graph TB
+    subgraph "Widget Layer"
+        Widget[Widget Component<br/>e.g., StationLogin]
+        Hook[Custom Hook<br/>e.g., useStationLogin]
+    end
+    
+    subgraph "CC Components Library"
+        Component[Presentational Component<br/>e.g., StationLoginComponent]
+        Utils[Component Utils<br/>Helper functions]
+        Types[TypeScript Types<br/>Interfaces]
+    end
+    
+    subgraph "External Dependencies"
+        Store[CC Store<br/>MobX Singleton]
+        Momentum[Momentum UI<br/>Design System]
+        Logging[UI Logging<br/>Metrics]
+    end
+    
+    Widget -->|Props + Callbacks| Component
+    Hook -->|Business Logic| Widget
+    Store -->|Data| Hook
+    Component -->|Uses| Momentum
+    Component -->|Can wrap with| Logging
+    Component -->|Uses| Utils
+    Component -->|Exports| Types
+    
+    style Component fill:#e1f5ff
+    style Widget fill:#fff4e1
+    style Store fill:#f0e1ff
+```
+
+---
+
+## Component Patterns
+
+### 1. Presentational Component Pattern
+
+All components in this library are **presentational** (also called "dumb" or "stateless" in older terminology):
+
+```typescript
+// Components receive all data via props
+const StationLoginComponent: React.FC<StationLoginComponentProps> = (props) => {
+  const {
+    teams,
+    loginOptions,
+    deviceType,
+    login,  // Callback from parent
+    // ... all data from props
+  } = props;
+
+  // No direct store access
+  // No business logic
+  // Only UI rendering and event handling
+
+  return <div>...</div>;
+};
+```
+
+**Benefits:**
+- Easy to test (no store dependencies)
+- Reusable across different contexts
+- Clear data flow
+- Can be used in Storybook/isolated environments
+
+### 2. Momentum UI Integration
+
+All components use Momentum UI React components:
+
+```typescript
+import { Button, Icon, Select, Option, Input } from '@momentum-design/components';
+
+// Components compose Momentum UI primitives
+function LoginButton({ onClick, disabled }) {
+  return (
+    <Button 
+      variant="primary"
+      disabled={disabled}
+      onClick={onClick}
+    >
+      Login
+    </Button>
+  );
+}
+```
+
+### 3. Utility Function Pattern
+
+Complex logic is extracted to utility files:
+
+```typescript
+// station-login.utils.tsx
+export const handleLoginOptionChanged = (
+  value: string,
+  setDeviceType: Function,
+  setDialNumberValue: Function
+) => {
+  setDeviceType(value);
+  if (value === 'BROWSER') {
+    setDialNumberValue('');
+  }
+};
+
+// Used in component
+handleLoginOptionChanged(newValue, setDeviceType, setDialNumberValue);
+```
+
+### 4. Type Export Pattern
+
+```typescript
+// Component exports its types for consumers
+export type StationLoginComponentProps = {
+  teams: string[];
+  loginOptions: string[];
+  deviceType: string;
+  login: () => void;
+  // ... more props
+};
+
+// Consumers can import and use
+import type { StationLoginComponentProps } from '@webex/cc-components';
+```
+
+### 5. Metrics HOC Integration
+
+Components can be wrapped with metrics:
+
+```typescript
+import { withMetrics } from '@webex/cc-ui-logging';
+
+// Wrap component
+const StationLoginWithMetrics = withMetrics(
+  StationLoginComponent,
+  'StationLoginComponent'
+);
+
+// Metrics automatically track:
+// - WIDGET_MOUNTED
+// - WIDGET_UNMOUNTED  
+// - PROPS_UPDATED (if enabled)
+```
+
+---
+
+## Usage Patterns
+
+### Widget Integration
+
+How widgets consume components from this library:
+
+```mermaid
+sequenceDiagram
+    participant Widget as Widget Component
+    participant Hook as Custom Hook
+    participant Store as CC Store
+    participant Component as CC Component
+    participant MomentumUI as Momentum UI
+
+    Widget->>Hook: Call hook (useStationLogin)
+    Hook->>Store: Read observable data
+    Store-->>Hook: Return data
+    Hook-->>Widget: Return {state, handlers}
+    Widget->>Widget: Compose component props
+    Widget->>Component: Render with props
+    Component->>MomentumUI: Render UI elements
+    MomentumUI-->>Component: Rendered elements
+    Component-->>Widget: Rendered UI
+    
+    Note over Widget,Component: User interacts with UI
+    Component->>Widget: Call callback (e.g., onClick)
+    Widget->>Hook: Execute handler
+    Hook->>Store: Update state
+```
+
+### Testing Pattern
+
+Components are tested in isolation:
+
+```typescript
+import { render, fireEvent } from '@testing-library/react';
+import { StationLoginComponent } from '@webex/cc-components';
+
+test('calls login callback when button clicked', () => {
+  const mockLogin = jest.fn();
+  const props = {
+    teams: ['Team A'],
+    loginOptions: ['BROWSER'],
+    deviceType: 'BROWSER',
+    login: mockLogin,
+    // ... other required props
+  };
+
+  const { getByRole } = render(<StationLoginComponent {...props} />);
+  
+  fireEvent.click(getByRole('button', { name: /login/i }));
+  
+  expect(mockLogin).toHaveBeenCalled();
+});
+```
+
+### Styling Pattern
+
+Components use SCSS with BEM naming:
+
+```scss
+// station-login.style.scss
+.station-login {
+  &__container {
+    padding: 1rem;
+  }
+
+  &__dropdown {
+    margin-bottom: 1rem;
+  }
+
+  &__button {
+    width: 100%;
+  }
+}
+```
+
+---
+
+## Web Component Export
+
+The library provides a `wc.ts` export for Web Component wrappers:
+
+```typescript
+// wc.ts - Not fully implemented in this package
+// Web Component wrapping happens in @webex/cc-widgets
+import StationLoginComponent from './components/StationLogin/station-login';
+import UserStateComponent from './components/UserState/user-state';
+
+// Exports components in format ready for r2wc wrapping
+export {
+  StationLoginComponent,
+  UserStateComponent,
+  // ... other components
+};
+```
+
+**Note:** The actual Web Component registration happens in `@webex/cc-widgets` package.
+
+---
+
+## Troubleshooting Guide
+
+### Common Issues
+
+#### 1. Component Not Rendering
+
+**Symptoms:**
+- Component shows blank
+- No errors in console
+
+**Possible Causes:**
+- Missing required props
+- Undefined prop values
+- Momentum UI styles not loaded
+
+**Solutions:**
+
+```typescript
+// Check all required props are provided
+const requiredProps = {
+  teams: ['Team A'],              // Must not be undefined
+  loginOptions: ['BROWSER'],      // Must have at least one option
+  deviceType: 'BROWSER',          // Must be valid option
+  login: () => {},                // Must be a function
+};
+
+// Ensure Momentum UI CSS is imported
+import '@momentum-ui/core/css/momentum-ui.min.css';
+```
+
+#### 2. TypeScript Errors with Props
+
+**Symptoms:**
+- Type errors when passing props
+- Props not recognized
+
+**Possible Causes:**
+- Using wrong type import
+- Missing peer dependencies
+
+**Solutions:**
+
+```typescript
+// Import the correct type
+import type { StationLoginComponentProps } from '@webex/cc-components';
+
+// Use type assertion if needed
+const props: StationLoginComponentProps = {
+  // ... props
+};
+
+// Check peer dependencies installed
+// @momentum-ui/react-collaboration
+// react
+// react-dom
+```
+
+#### 3. Styles Not Applied
+
+**Symptoms:**
+- Components render but look unstyled
+- Buttons/inputs have no styling
+
+**Possible Causes:**
+- Momentum UI CSS not imported
+- Webpack not configured to handle SCSS
+- CSS modules conflict
+
+**Solutions:**
+
+```typescript
+// In your app entry point
+import '@momentum-ui/core/css/momentum-ui.min.css';
+
+// If using SCSS, configure webpack
+// webpack.config.js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.scss$/,
+        use: ['style-loader', 'css-loader', 'sass-loader']
+      }
+    ]
+  }
+};
+```
+
+#### 4. Callback Not Firing
+
+**Symptoms:**
+- Button clicks don't trigger callbacks
+- Events not propagating
+
+**Possible Causes:**
+- Callback not passed as prop
+- Callback is undefined
+- Event propagation stopped
+
+**Solutions:**
+
+```typescript
+// Ensure callback is defined
+const handleLogin = () => {
+  console.log('Login clicked');
+};
+
+// Pass as prop
+<StationLoginComponent 
+  login={handleLogin}  // Not undefined
+  // ... other props
+/>
+
+// Check event handler is not preventing default
+// without calling callback
+```
+
+#### 5. Component Performance Issues
+
+**Symptoms:**
+- Slow rendering
+- UI freezes on interaction
+
+**Possible Causes:**
+- Passing new object/array references on every render
+- Not memoizing callbacks
+- Large lists without virtualization
+
+**Solutions:**
+
+```typescript
+import { useMemo, useCallback } from 'react';
+
+// Memoize arrays/objects
+const teams = useMemo(() => ['Team A', 'Team B'], []);
+
+// Memoize callbacks
+const handleLogin = useCallback(() => {
+  // Login logic
+}, [dependencies]);
+
+// Use memoized values as props
+<StationLoginComponent 
+  teams={teams}
+  login={handleLogin}
+/>
+```
+
+#### 6. Test Failures
+
+**Symptoms:**
+- Components fail to render in tests
+- Snapshots don't match
+
+**Possible Causes:**
+- Missing test dependencies
+- Async state updates
+- Missing providers/context
+
+**Solutions:**
+
+```typescript
+import { render, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+
+test('component renders', async () => {
+  const { getByText } = render(
+    <StationLoginComponent {...props} />
+  );
+
+  // Wait for async updates
+  await waitFor(() => {
+    expect(getByText('Login')).toBeInTheDocument();
+  });
+});
+```
+
+---
+
+## Related Documentation
+
+- [Agent Documentation](./agent.md) - Usage examples and exports
+- [React Patterns](../../../../ai-docs/patterns/react-patterns.md) - Component patterns
+- [Testing Patterns](../../../../ai-docs/patterns/testing-patterns.md) - Testing guidelines
+- [UI Logging Documentation](../../ui-logging/ai-docs/agent.md) - Metrics HOC usage
+- [CC Widgets Documentation](../../cc-widgets/ai-docs/agent.md) - Web Component integration
+
+---
+
+_Last Updated: 2025-11-26_
+