docs: describe AI-assisted development, add Sidebar example, other improvements

docs/docs/api/appkit-ui/ui/Sidebar.mdx

@@ -3,6 +3,13 @@
 Collapsible navigation sidebar with mobile support
 
 
+## Example
+
+import { DocExample } from "@site/src/components/DocExample";
+
+<DocExample name="sidebar" />
+
+
 ## Sidebar
 
 Collapsible navigation sidebar with mobile support
@@ -15,9 +22,9 @@ Collapsible navigation sidebar with mobile support
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `side` | `enum` |  | `left` | - |
-| `variant` | `enum` |  | `sidebar` | - |
-| `collapsible` | `enum` |  | `offcanvas` | - |
+| `side` | `enum` |  | `left` | Which side of the viewport the sidebar appears on |
+| `variant` | `enum` |  | `sidebar` | Visual style: `"sidebar"` (standard with border), `"floating"` (rounded with shadow), or `"inset"` (content area gets rounded margin) |
+| `collapsible` | `enum` |  | `offcanvas` | Collapse behavior: `"offcanvas"` (slides off-screen), `"icon"` (collapses to icon width), or `"none"` (always expanded) |
 
 
 
@@ -111,7 +118,7 @@ Action button displayed next to a sidebar group label
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `asChild` | `boolean` |  | `false` | - |
+| `asChild` | `boolean` |  | `false` | Render as child element instead of default tag |
 
 
 
@@ -159,7 +166,7 @@ Label heading for a sidebar group
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `asChild` | `boolean` |  | `false` | - |
+| `asChild` | `boolean` |  | `false` | Render as child element instead of default tag |
 
 
 
@@ -276,8 +283,8 @@ Action button displayed alongside a menu item
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `asChild` | `boolean` |  | `false` | - |
-| `showOnHover` | `boolean` |  | `false` | - |
+| `asChild` | `boolean` |  | `false` | Render as child element instead of default tag |
+| `showOnHover` | `boolean` |  | `false` | Only show when parent menu item is hovered |
 
 
 
@@ -323,9 +330,9 @@ import { SidebarMenuBadge } from '@databricks/appkit-ui';
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `asChild` | `boolean` |  | `false` | - |
-| `isActive` | `boolean` |  | `false` | - |
-| `tooltip` | `string \| (TooltipContentProps & RefAttributes<HTMLDivElement>)` |  | - | - |
+| `asChild` | `boolean` |  | `false` | Render as child element instead of default tag |
+| `isActive` | `boolean` |  | `false` | Whether this item is currently active/selected |
+| `tooltip` | `string \| (TooltipContentProps & RefAttributes<HTMLDivElement>)` |  | - | Tooltip shown when sidebar is collapsed to icon mode |
 | `variant` | `"default" \| "outline" \| null` |  | `default` | - |
 | `size` | `"default" \| "sm" \| "lg" \| null` |  | `default` | - |
 
@@ -375,7 +382,7 @@ Loading skeleton placeholder for menu items
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `showIcon` | `boolean` |  | `false` | - |
+| `showIcon` | `boolean` |  | `false` | Show a circular icon placeholder alongside the text skeleton |
 
 
 
@@ -423,9 +430,9 @@ Button for submenu items
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `asChild` | `boolean` |  | `false` | - |
-| `size` | `enum` |  | `md` | - |
-| `isActive` | `boolean` |  | `false` | - |
+| `asChild` | `boolean` |  | `false` | Render as child element instead of default tag |
+| `size` | `enum` |  | `md` | Text size of the submenu button |
+| `isActive` | `boolean` |  | `false` | Whether this submenu item is currently active/selected |
 
 
 
@@ -471,9 +478,9 @@ import { SidebarMenuSubItem } from '@databricks/appkit-ui';
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `defaultOpen` | `boolean` |  | `true` | - |
-| `open` | `boolean` |  | - | - |
-| `onOpenChange` | `((open: boolean) => void)` |  | - | - |
+| `defaultOpen` | `boolean` |  | `true` | Initial open state for uncontrolled usage |
+| `open` | `boolean` |  | - | Controlled open state |
+| `onOpenChange` | `((open: boolean) => void)` |  | - | Callback when open state changes |
 
 
 
@@ -573,7 +580,7 @@ Hook to access sidebar state and controls
 
 ### Props
 
-This component extends standard HTML element attributes.
+This hook takes no parameters.
 
 
 
@@ -582,6 +589,8 @@ This component extends standard HTML element attributes.
 ```tsx
 import { useSidebar } from '@databricks/appkit-ui';
 
-<useSidebar /* props */ />
+function MyComponent() {
+  const sidebar = useSidebar();
+}
 ```
 

docs/docs/api/appkit/Class.Plugin.md

@@ -315,10 +315,31 @@ Returns the public exports for this plugin.
 Override this to define a custom public API.
 By default, returns an empty object.
 
+The returned object becomes the plugin's public API on the AppKit instance
+(e.g. `appkit.myPlugin.method()`). AppKit automatically binds method context
+and adds `asUser(req)` for user-scoped execution.
+
 #### Returns
 
 `unknown`
 
+#### Example
+
+```ts
+class MyPlugin extends Plugin {
+  name = "myPlugin";
+  private getData() { return []; }
+
+  exports() {
+    return { getData: this.getData };
+  }
+}
+
+// After registration:
+const appkit = await createApp({ plugins: [myPlugin()] });
+appkit.myPlugin.getData();
+```
+
 #### Implementation of
 
 ```ts

docs/docs/api/appkit/Function.createApp.md

@@ -11,6 +11,11 @@ function createApp<T>(config: {
 
 Bootstraps AppKit with the provided configuration.
 
+Initializes telemetry, cache, and service context, then registers plugins
+in phase order (core, normal, deferred) and awaits their setup.
+The returned object maps each plugin name to its `exports()` API,
+with an `asUser(req)` method for user-scoped execution.
+
 ## Type Parameters
 
 | Type Parameter |
@@ -30,3 +35,28 @@ Bootstraps AppKit with the provided configuration.
 ## Returns
 
 `Promise`\<`PluginMap`\<`T`\>\>
+
+A `PluginMap` keyed by plugin name with typed exports
+
+## Examples
+
+```ts
+import { createApp, server } from "@databricks/appkit";
+
+await createApp({
+  plugins: [server()],
+});
+```
+
+```ts
+import { createApp, server, analytics } from "@databricks/appkit";
+
+const appkit = await createApp({
+  plugins: [server({ autoStart: false }), analytics({})],
+});
+
+appkit.server.extend((app) => {
+  app.get("/custom", (_req, res) => res.json({ ok: true }));
+});
+await appkit.server.start();
+```

docs/docs/app-management.mdx

@@ -12,7 +12,7 @@ Manage your AppKit application throughout its lifecycle using the Databricks CLI
 
 ## Create app
 
-See the [Quick start](./index.md#quick-start) section to create a new Databricks app with AppKit installed.
+See the [Quick start](./index.md#quick-start-options) section to create a new Databricks app with AppKit installed.
 
 ## Configuration
 

docs/docs/development/_prerequisites_app.mdx

@@ -2,4 +2,4 @@
 
 - [Node.js](https://nodejs.org) v22+ environment with `npm`
 - Databricks CLI (v0.287.0 or higher): install and configure it according to the [official tutorial](https://docs.databricks.com/aws/en/dev-tools/cli/tutorial).
-- A new Databricks app with AppKit installed. See the [Quick start](../index.md#quick-start) for more details.
+- A new Databricks app with AppKit installed. See [Bootstrap a new Databricks app](../index.md#quick-start-options) for more details.

docs/docs/development/ai-assisted-development.mdx

@@ -8,9 +8,46 @@ import Prerequisites from './_prerequisites_app.mdx';
 
 <Prerequisites />
 
-AppKit-specific agent skills for AI coding assistants are coming soon. This documentation will be updated with instructions when available.
+AppKit integrates with AI coding assistants through the Agent Skills.
 
-In the meantime, refer to the LLM resources section below for guidance on working with AppKit in AI-assisted development environments.
+## Installing Agent Skills
+
+To install the Databricks Agent Skills for your preferred AI assistant, run:
+
+```bash
+databricks experimental aitools skills install
+```
+
+## Skills capabilities
+
+The Agent Skills expose the following capabilities for AI assistants:
+
+- **Data exploration**: Query catalogs, schemas, tables, and execute SQL
+- **CLI command execution**: Deploy and manage apps, and run other workspace operations
+- **Workspace resource discovery**: Inspect and navigate workspace resources
+
+## Example prompts
+
+Here are some basic examples you can use to explore your app and workspace:
+
+1. Creating a new basic app
+  ```
+  Create a new Databricks app that displays a dashboard of the users table in main.default.
+  ```
+1. Introspecting a table schema
+  ```
+  Show me the schema of the users table in main.default.
+  ```
+1. Creating a new query
+  ```
+  Create a new query to find users created in the last 7 days.
+  ```
+1. Deploying an app
+  ```
+  Deploy the app to Databricks with the name "my-app".
+  ```
+
+Possibilities are virtually endless. Ask your AI assistant to help you with your app and workspace.
 
 ## LLM resources
 
@@ -23,6 +60,9 @@ There are two ways to access the documentation:
 
   ```bash
   npx @databricks/appkit docs # returns the llms.txt file content with all available documentation pages
-  npx @databricks/appkit docs <path> # for specific documentation file
+  npx @databricks/appkit docs <query> # for specific documentation file or section
   ```
 
+## See more 
+
+To learn more about Agent Skills, see the [Agent Skills repository](https://github.com/databricks/databricks-agent-skills).

docs/docs/development/index.mdx

@@ -6,7 +6,7 @@ import Prerequisites from './_prerequisites_app.mdx';
 
 # Development
 
-AppKit provides multiple development workflows to suit different needs: local development with hot reload, AI-assisted development with MCP, and remote tunneling to deployed backends.
+AppKit provides multiple development workflows to suit different needs: local development with hot reload, AI-assisted development with Agent Skills, and remote tunneling to deployed backends.
 
 <Prerequisites />
 
@@ -15,7 +15,7 @@ AppKit provides multiple development workflows to suit different needs: local de
 There are multiple supported development flows available with AppKit:
 
 1. **[Local development](./local-development.mdx)**: Run the development server with hot reload for both UI and backend code. This is the default development flow and is suitable for most use cases.
-2. **[AI-assisted development](./ai-assisted-development.mdx)**: Use an AI coding assistant to explore data, run CLI commands, and scaffold your app interactively.
+2. **[AI-assisted development](./ai-assisted-development.mdx)**: Use an AI coding assistant with Agent Skills to explore data, run CLI commands, and scaffold your app interactively.
 3. **[Remote Bridge](./remote-bridge.mdx)**: Create a remote bridge to a deployed backend while keeping your queries and UI local. This is useful for testing against production data or debugging deployed backend code without redeploying your app.
 
 ## See also

docs/docs/development/llm-guide.md

@@ -70,7 +70,7 @@ Examples of known paths:
 
 - `package.json` has `"type": "module"`
 - `tsx` is in devDependencies for dev server
-- `dev` script uses `NODE_ENV=development tsx watch server/index.ts`
+- `dev` script uses `NODE_ENV=development tsx watch server/server.ts`
 - `client/index.html` exists with `<div id="root"></div>` and script pointing to `client/src/main.tsx`
 
 ### Backend

docs/docs/development/local-development.mdx

@@ -8,7 +8,7 @@ import Prerequisites from './_prerequisites_app.mdx';
 
 <Prerequisites />
 
-Once your app is bootstrapped according to the [Quick start](../index.md#quick-start) guide, you can start the development server with hot reload for both UI and backend code.
+Once your app is bootstrapped according to the [Manual quick start](../index.md#manual-quick-start) guide, you can start the development server with hot reload for both UI and backend code.
 
 In the application root directory, run the following command to start the development server:
 

docs/docs/development/project-setup.md

@@ -13,7 +13,7 @@ Recommended structure (client/server split):
 ```
 my-app/
 ├── server/
-│   ├── index.ts              # backend entry point (AppKit)
+│   ├── server.ts              # backend entry point (AppKit)
 │   └── .env                  # optional local dev env vars (do not commit)
 ├── client/
 │   ├── index.html
@@ -46,9 +46,9 @@ The AppKit `server()` plugin automatically serves:
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "NODE_ENV=development tsx watch server/index.ts",
+    "dev": "NODE_ENV=development tsx watch server/server.ts",
     "build": "npm run build:server && npm run build:client",
-    "build:server": "tsdown --out-dir build server/index.ts",
+    "build:server": "tsdown --out-dir build server/server.ts",
     "build:client": "tsc -b && vite build --config client/vite.config.ts",
     "start": "node build/index.mjs"
   },
@@ -145,7 +145,7 @@ export default defineConfig({
 }
 ```
 
-### `server/index.ts`
+### `server/server.ts`
 
 ```ts
 import { createApp, server } from "@databricks/appkit";
@@ -185,7 +185,7 @@ If you don't already have a `client/` folder, create one and move your Vite app
 - Move `vite.config.ts` → `client/vite.config.ts`
 - Move `src/` → `client/src/`
 
-### 2. Create `server/index.ts` (New File)
+### 2. Create `server/server.ts` (New File)
 
 ```ts
 import { createApp, server } from "@databricks/appkit";
@@ -200,9 +200,9 @@ await createApp({
 ```json
 {
   "scripts": {
-    "dev": "NODE_ENV=development tsx watch server/index.ts",
+    "dev": "NODE_ENV=development tsx watch server/server.ts",
     "build": "npm run build:server && npm run build:client",
-    "build:server": "tsdown --out-dir build server/index.ts",
+    "build:server": "tsdown --out-dir build server/server.ts",
     "build:client": "tsc -b && vite build --config client/vite.config.ts",
     "start": "node build/index.mjs"
   }
@@ -218,7 +218,7 @@ AppKit's server plugin will automatically serve your Vite app in dev mode and `c
 To add SQL query execution capabilities:
 
 ```ts
-// server/index.ts
+// server/server.ts
 import { createApp, server, analytics } from "@databricks/appkit";
 
 await createApp({

docs/docs/development/type-generation.md

@@ -104,5 +104,5 @@ data?.forEach(row => {
 
 ## See also
 
-- [Plugins](../plugins/index.md) - Analytics plugin configuration
+- [Plugins](../plugins/analytics.md) - Analytics plugin configuration
 - [API Reference](/docs/api/appkit-ui) - Complete UI components API documentation