# ElvixLanguages

> Single-frame wizard for spoken languages and CEFR proficiency, capped at 8 with tap-to-edit and delete-confirm.

<!-- app/account/languages/page.tsx -->
```tsx
"use client";

import { ElvixLanguages } from "@elvix.is/sdk/react";

export default function LanguagesPane() {
  return (
    <ElvixLanguages
      onChange={(languages) => {
        // Optional: mirror to local state for sibling panes. The SDK already persisted.
        console.log("languages now:", languages.length);
      }}
      onResult={(r) => {
        if (!r.ok) return console.warn(r.error, r.message);
        // r.count is the new total (0 to 8).
      }}
    />
  );
}
```

## Props

| Prop | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `height` | `number` | optional | `min(540px, 66dvh)` | Fixed pixel height for the `<ElvixCard>` frame. |
| `minHeight` | `number` | optional | `340` | Minimum pixel height when `height` is unset. |
| `maxHeight` | `number` | optional | `700` | Maximum pixel height when `height` is unset. |
| `width` | `number \| string` | optional | `"100%"` | Frame width. Numbers are pixels; strings pass through as CSS. |
| `onChange` | `(languages: LanguageRecord[]) => void` | optional | `—` | Fires whenever the underlying record set changes (add, edit level, delete). Receives the full list. |
| `onResult` | `(r: ElvixLanguagesResult) => void` | optional | `—` | Terminal save callback. Success payload is minimal (`{ ok: true, count }`); failure is `{ ok: false, error, message? }`. |

> **Note:** The picker hides itself the moment the user hits 8 entries. If you see the add affordance disappear in QA, that is the cap doing its job, not a bug. To free a slot, the user taps an existing row and uses the in-frame delete-confirm.

> **Note:** `onResult.count` is intentionally the only success field, so the host never receives the full language list as a side-channel. Subscribe to `onChange` if you need the records for sibling panes.


## Related

- [ElvixRegion](/docs/components/elvix-region.md): Single-frame wizard for the user's regional preferences singleton: country cascade plus tap-to-edit on every derived field.
- [ElvixIdentityForm](/docs/components/elvix-identity-form.md): Hosted profile editor: name, locale, timezone, pronouns, contact. Plugs straight into the elvix User record. In-frame edit → confirm → done lifecycle.