> ## Documentation Index
> Fetch the complete documentation index at: https://docs.sidenet.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Get Started

> Initialize and use the SDK in minutes.

# Minimal Template

```typescript theme={null}
import { initSidenet, toggleSidenet} from 'sidenetai-sdk';

// Initialize
await initSidenet({
  orgId: string,              // Organization ID
  userId: string,             // Your Unique End-user User identifier
  copilotId: string,          // Copilot identifier
  apiKey: string,             // API key for backend requests
  contentElement: '#app', // CSS selector for your main content, element will receive `margin-right` (or `margin-left` for left position) matching the sidebar width.
  defaultOpen: true,
  keyboardShortcut: 'k', // Cmd+k / Ctrl+k - to toggle with keyboard
});

// Toggle with a button
document.getElementById('chat-btn').onclick = toggleSidenet;
```

## Push

Automatically push your page content when the sidebar opens:

```typescript theme={null}
initSidenet({
  orgId: 'org-123',
  position: 'right',
  contentElement: '#app', // CSS selector for your main content
});
```

The element will receive `margin-right` (or `margin-left` for left position) matching the sidebar width.

# All Config Options:

All options for `initSidenet()`:

```typescript theme={null}
await initSidenet({
  // Identity (required)
  orgId: string,              // Organization ID
  userId: string,             // Your Unique End-user User identifier
  copilotId: string,          // Copilot identifier
  apiKey: string,             // API key for backend requests

  // Layout
  position: 'left' | 'right', // Sidebar position (default: 'right')
  width: string,              // Panel width, e.g. '400px', '45vw' (default: '45vw')
  height: string,             // Panel height (modal default: '600px', sidebar: auto)
  layout: 'sidebar' | 'modal' | 'drawer', // Layout mode (default: 'sidebar'). drawer = overlay panel that closes on outside-click/Escape
  offset: {                   // Positioning offsets
    top?: string,
    bottom?: string,
    left?: string,
    right?: string,
  },
  zIndex: string | number,    // Stacking order of the container (default: unset)

  // Behavior
  defaultOpen: boolean,       // Start open or closed (default: false)
  keyboardShortcut: string,   // Key for Cmd/Ctrl shortcut, e.g. 'b'
  contentElement: string,     // CSS selector for content to push aside, e.g. '#app'
  debug: boolean,             // Enable verbose console logs (default: false)

  // Agent & Threading
  agentVersionId: string,     // Use specific agent (skips agent selection)
  showAgentDropdown: boolean, // Force-show/hide agent dropdown
  //   undefined (default) → auto: show if multiple
  //   subagents AND no agentVersionId provided
  groupName: string,          // Group name for chat requests
  lastThread: boolean,        // Auto-select most recent thread on init
  threadId: string,           // Pin to specific thread
  read_only: boolean,         // Hide composer (requires threadId)
  use_routing: boolean,       // Enable backend message routing (default: true)

  // Context & Messages
  context: string[],          // Context strings sent with requests
  firstMessage: string,       // Auto-send on first open

  // Runtime Auth
  runtimeAuth: [{
    providerName: string,
    credentials: Record<string, any>,
  }],

  // Theming
  theme: 'light' | 'dark',    // Color scheme (default: 'light')
  customCSS: string,          // Raw CSS injected into Shadow DOM
  customStyles: Record<string, Record<string, string>>, // Structured CSS rules

  // UI chrome
  showClose: boolean,         // Show a close/collapse button in the header (default: false)
  closeOnOutsideClick: 'auto' | 'always' | 'never', // Outside-click / Escape dismissal (default: 'auto')

  // Greeting / placeholder / suggestions / theme tokens (overrides backend sdk_ui)
  // Layers on top of the DB config — only the fields you pass are overridden.
  sdkUi: Partial<SidebarSDKConfig>,

  // Callbacks
  onOpen: (detail) => void,
  onClose: (detail) => void,
  onResize: (detail) => void,
  onReady: (detail) => void,
});
```

## `closeOnOutsideClick`

Controls whether clicking outside the panel (or pressing **Escape**) dismisses the SDK. It's a three-way string so the layout-aware default stays explicit and resettable at runtime:

| Value               | Behavior                                                                                                                  |
| ------------------- | ------------------------------------------------------------------------------------------------------------------------- |
| `'auto'`*(default)* | On for the `drawer` layout only; `sidebar` and `modal` are not dismissed by outside clicks.                               |
| `'always'`          | Every layout closes on outside-click / Escape (e.g. make a `modal` dismissable).                                          |
| `'never'`           | No layout closes on outside-click / Escape, including the `drawer` (close via the button, shortcut, or `closeSidenet()`). |

Settable at init and via `updateSidenetConfig({ closeOnOutsideClick })` — pass `'auto'` to return to the default behavior at runtime.