@elvix.is/sdk 0.1.2 → 0.3.0

package/dist/react.d.ts

@@ -1 +1,235 @@
-export { ElvixActionResult, ElvixUser, ElvixVerifyErr, ElvixVerifyOk, ElvixVerifyResult } from './index.js';
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { ElvixActionResult } from './index.js';
+export { ElvixUser, ElvixVerifyResult } from './index.js';
+
+/**
+ * `<ElvixCard>` — the chrome every nested `<Elvix*>` mutation surface
+ * lives in. Brand-tinted border, secured-by-elvix footer, scrollable
+ * body + pinned footer pattern. Pure presentation; no state.
+ *
+ * Customers don't usually need to wrap manually — most `<Elvix*>`
+ * components render their own ElvixCard internally. Exported for
+ * cases where a host wants to compose multiple components inside one
+ * card (e.g. an account page row).
+ */
+declare function ElvixCard({ title, footer, className, children, }: {
+    title?: ReactNode;
+    footer?: ReactNode;
+    className?: string;
+    children: ReactNode;
+}): react.JSX.Element;
+
+/**
+ * Public types for the React surface. Mirrors the elvix.is bootstrap
+ * envelope so customers can type their host code without importing
+ * private elvix internals.
+ */
+type ElvixBrand = {
+    light: {
+        primary: string;
+        on: string;
+    };
+    dark: {
+        primary: string;
+        on: string;
+    };
+};
+type ElvixSignInMethod = "google" | "email_otp" | "passkey" | "username";
+type ElvixBootstrapEnvelope = {
+    applicationId: string;
+    clientId: string;
+    urlSlug: string;
+    appName: string;
+    logoUrl: string | null;
+    logoUrlDark: string | null;
+    iconUrl: string | null;
+    iconUrlDark: string | null;
+    brand: ElvixBrand;
+    methods: {
+        google: boolean;
+        emailOtp: boolean;
+        passkey: boolean;
+        username: boolean;
+    };
+    legal: {
+        privacyPolicyUrl: string;
+        termsOfServiceUrl: string;
+        supportEmail: string;
+        supportUrl: string | null;
+    };
+    signInVerb: "signin" | "login";
+    signinGate: "public" | "private_beta" | "closed";
+};
+type ElvixSignInResultOk = {
+    ok: true;
+    /** Where the host should send the user (if anywhere). */
+    redirect?: string;
+    /** Sign-in factor that succeeded. */
+    method: ElvixSignInMethod;
+};
+type ElvixSignInResultErr = {
+    ok: false;
+    error: string;
+    message?: string;
+};
+type ElvixSignInResult = ElvixSignInResultOk | ElvixSignInResultErr;
+/** Theme override. Omit to inherit the Console-configured pair. */
+type ElvixTheme = "light" | "dark" | "system";
+
+type ElvixContextValue = {
+    clientId: string | undefined;
+    baseUrl: string;
+    app: ElvixBootstrapEnvelope | null;
+    appError: string | null;
+    resolvedTheme: "light" | "dark";
+};
+declare function useElvixApp(): ElvixBootstrapEnvelope | null;
+declare function useElvixContext(): ElvixContextValue;
+declare function ElvixProvider({ clientId, theme, brand, baseUrl, children, className, }: {
+    clientId?: string;
+    theme?: ElvixTheme;
+    brand?: ElvixBrand;
+    /** Override the elvix origin (testing, proxy setups). */
+    baseUrl?: string;
+    children: ReactNode;
+    className?: string;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixSignIn>` — drop-in sign-in surface.
+ *
+ * Reads enabled methods from the Console-configured bootstrap envelope
+ * (`<ElvixProvider clientId>` must be in scope). Renders the methods
+ * the customer turned on; never invents UI the Console denied.
+ *
+ * MVP supports:
+ *   - Email OTP (the most common path)
+ *   - Google redirect ("Continue with Google")
+ *
+ * Passkey + username-OTP follow in 0.2.x point releases.
+ *
+ * `onResult({ ok, ... })` is the only post-success hook the SDK
+ * exposes. Hosts navigate from the callback; this component never
+ * calls `router.push` itself.
+ */
+declare function ElvixSignIn({ onResult, redirectAfterSignIn, className, }: {
+    onResult?: (r: ElvixSignInResult) => void;
+    /** Default redirect target on success when the server doesn't echo one. */
+    redirectAfterSignIn?: string;
+    className?: string;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixUsername>` — claim or change the end-user's username for the
+ * current Application. PATCH /api/account/apps/<appId>/username.
+ * Render a single in-frame card with two panes: edit + done.
+ */
+declare function ElvixUsername({ onResult, }: {
+    onResult?: (r: ElvixActionResult<{
+        username: string;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixAvatar>` — upload / replace the end-user's avatar for this
+ * Application. Reads file → base64 → PATCH /api/account/apps/<appId>/avatar.
+ */
+declare function ElvixAvatar({ onResult, }: {
+    onResult?: (r: ElvixActionResult<{
+        avatarUrl: string;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixBanner>` — upload / replace the end-user's profile banner
+ * (16:9 cover image) for this Application.
+ */
+declare function ElvixBanner({ onResult, }: {
+    onResult?: (r: ElvixActionResult<{
+        bannerUrl: string;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixIdentityForm>` — edit the end-user's display name + bio for
+ * the current Application. Lightweight per-app profile fields.
+ */
+declare function ElvixIdentityForm({ initialName, initialBio, onResult, }: {
+    initialName?: string;
+    initialBio?: string;
+    onResult?: (r: ElvixActionResult<{
+        name: string;
+        bio: string;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixRegion>` — set the end-user's region (ISO 3166-1 alpha-2
+ * country code + timezone). Used by elvix for data-residency hints
+ * and locale defaults.
+ */
+declare function ElvixRegion({ initialCountry, initialTimezone, onResult, }: {
+    initialCountry?: string;
+    initialTimezone?: string;
+    onResult?: (r: ElvixActionResult<{
+        country: string;
+        timezone: string;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixLanguages>` — set the end-user's preferred languages (BCP-47
+ * tag list, ordered by preference). The first entry drives UI locale.
+ */
+declare function ElvixLanguages({ initial, onResult, }: {
+    initial?: string[];
+    onResult?: (r: ElvixActionResult<{
+        languages: string[];
+    }>) => void;
+}): react.JSX.Element;
+
+declare function ElvixSessions({ onResult, }: {
+    onResult?: (r: ElvixActionResult<{
+        revoked: number;
+    }>) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixExport>` — GDPR Art. 15 data-export request. Triggers an
+ * async server-side zip + emails a single-use download link to the
+ * end-user's bound email address.
+ */
+declare function ElvixExport({ onResult, }: {
+    onResult?: (r: ElvixActionResult<{
+        requestId: string;
+    }>) => void;
+}): react.JSX.Element;
+
+declare function ElvixDeactivate({ onResult, }: {
+    onResult?: (r: ElvixActionResult) => void;
+}): react.JSX.Element;
+
+declare function ElvixLeave({ onResult, }: {
+    onResult?: (r: ElvixActionResult) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixAddressBook>` — list / add / remove the end-user's addresses
+ * on this Application. Read uses GET /api/account/apps/<appId>/addresses;
+ * mutations POST + DELETE on the same path.
+ */
+declare function ElvixAddressBook({ onResult, }: {
+    onResult?: (r: ElvixActionResult) => void;
+}): react.JSX.Element;
+
+/**
+ * `<ElvixLegalEntities>` — list / add / remove the end-user's legal
+ * entities (company names + tax IDs) on this Application. Useful for
+ * B2B apps that bill at the entity level.
+ */
+declare function ElvixLegalEntities({ onResult, }: {
+    onResult?: (r: ElvixActionResult) => void;
+}): react.JSX.Element;
+
+export { ElvixActionResult, ElvixAddressBook, ElvixAvatar, ElvixBanner, type ElvixBootstrapEnvelope, type ElvixBrand, ElvixCard, ElvixDeactivate, ElvixExport, ElvixIdentityForm, ElvixLanguages, ElvixLeave, ElvixLegalEntities, ElvixProvider, ElvixRegion, ElvixSessions, ElvixSignIn, type ElvixSignInMethod, type ElvixSignInResult, type ElvixSignInResultErr, type ElvixSignInResultOk, type ElvixTheme, ElvixUsername, useElvixApp, useElvixContext };

package/dist/react.js

@@ -0,0 +1,894 @@
+// src/react/elvix-card.tsx
+function ElvixCard({
+  title,
+  footer,
+  className = "",
+  children
+}) {
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: `elvix-card ${className}`.trim(),
+      style: {
+        border: "1px solid var(--elvix-primary-12, rgba(93,77,255,0.12))",
+        borderRadius: "14px",
+        background: "white",
+        overflow: "hidden",
+        display: "flex",
+        flexDirection: "column",
+        maxWidth: "440px",
+        width: "100%"
+      }
+    },
+    title && /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        style: {
+          padding: "20px 24px 0",
+          fontSize: "16px",
+          fontWeight: 600,
+          color: "var(--elvix-primary-strong, #5d4dff)"
+        }
+      },
+      title
+    ),
+    /* @__PURE__ */ React.createElement("div", { style: { padding: "16px 24px", flex: 1 } }, children),
+    footer && /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        style: {
+          padding: "12px 24px",
+          borderTop: "1px solid var(--elvix-primary-12, rgba(93,77,255,0.12))",
+          background: "rgba(0,0,0,0.02)",
+          fontSize: "12px",
+          color: "rgba(0,0,0,0.55)"
+        }
+      },
+      footer
+    )
+  );
+}
+
+// src/react/elvix-provider.tsx
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useMemo,
+  useState
+} from "react";
+var ELVIX_DEFAULT_BRAND = {
+  light: { primary: "#5d4dff", on: "#ffffff" },
+  dark: { primary: "#8e7dff", on: "#0a0a0b" }
+};
+var DEFAULT_BASE_URL = "https://elvix.is";
+var BOOTSTRAP_URL = (baseUrl, clientId) => `${baseUrl}/api/v1/bootstrap/${encodeURIComponent(clientId)}`;
+var ElvixContext = createContext(null);
+function useElvixApp() {
+  const ctx = useContext(ElvixContext);
+  return ctx?.app ?? null;
+}
+function useElvixContext() {
+  const ctx = useContext(ElvixContext);
+  if (!ctx) {
+    throw new Error("Elvix components must be wrapped in <ElvixProvider>.");
+  }
+  return ctx;
+}
+function ElvixProvider({
+  clientId,
+  theme,
+  brand,
+  baseUrl,
+  children,
+  className = ""
+}) {
+  const resolvedBaseUrl = baseUrl ?? DEFAULT_BASE_URL;
+  const [app, setApp] = useState(null);
+  const [appError, setAppError] = useState(null);
+  const [systemDark, setSystemDark] = useState(false);
+  useEffect(() => {
+    if (!clientId) {
+      setApp(null);
+      setAppError(null);
+      return;
+    }
+    const ctrl = new AbortController();
+    fetch(BOOTSTRAP_URL(resolvedBaseUrl, clientId), { signal: ctrl.signal }).then((r) => r.json()).then((body) => {
+      if (body?.success && body?.data) {
+        setApp(body.data);
+        setAppError(null);
+      } else {
+        setAppError(body?.errorMessage ?? "bootstrap_failed");
+      }
+    }).catch((e) => {
+      if (e?.name === "AbortError") return;
+      setAppError(e instanceof Error ? e.message : "bootstrap_failed");
+    });
+    return () => ctrl.abort();
+  }, [clientId, resolvedBaseUrl]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const mq = window.matchMedia("(prefers-color-scheme: dark)");
+    setSystemDark(mq.matches);
+    const sync = (e) => setSystemDark(e.matches);
+    mq.addEventListener("change", sync);
+    return () => mq.removeEventListener("change", sync);
+  }, []);
+  const effectiveTheme = useMemo(() => {
+    if (theme === "light") return "light";
+    if (theme === "dark") return "dark";
+    return systemDark ? "dark" : "light";
+  }, [theme, systemDark]);
+  const effectiveBrand = brand ?? appBrand(app) ?? ELVIX_DEFAULT_BRAND;
+  const pair = effectiveBrand[effectiveTheme];
+  const cssVars = useMemo(
+    () => ({
+      "--elvix-primary": pair.primary,
+      "--elvix-on-primary": pair.on,
+      "--elvix-primary-12": withAlpha(pair.primary, 0.12),
+      "--elvix-primary-35": withAlpha(pair.primary, 0.35),
+      "--elvix-primary-55": withAlpha(pair.primary, 0.55),
+      "--elvix-primary-strong": pair.primary
+    }),
+    [pair.primary, pair.on]
+  );
+  const value = {
+    clientId,
+    baseUrl: resolvedBaseUrl,
+    app,
+    appError,
+    resolvedTheme: effectiveTheme
+  };
+  return /* @__PURE__ */ React.createElement(ElvixContext.Provider, { value }, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      "data-elvix-theme": effectiveTheme,
+      style: cssVars,
+      className: (effectiveTheme === "dark" ? "dark " : "") + "elvix-sdk-root " + className
+    },
+    children
+  ));
+}
+function appBrand(app) {
+  if (!app?.brand) return null;
+  return app.brand;
+}
+function withAlpha(hex, a) {
+  const m = /^#?([0-9a-f]{6})$/i.exec(hex.trim());
+  if (!m) return hex;
+  const n = Number.parseInt(m[1], 16);
+  const r = n >> 16 & 255;
+  const g = n >> 8 & 255;
+  const b = n & 255;
+  return `rgba(${r}, ${g}, ${b}, ${a})`;
+}
+
+// src/react/elvix-sign-in.tsx
+import { useState as useState2 } from "react";
+function ElvixSignIn({
+  onResult,
+  redirectAfterSignIn,
+  className = ""
+}) {
+  const ctx = useElvixContext();
+  const app = useElvixApp();
+  const [step, setStep] = useState2("identify");
+  const [email, setEmail] = useState2("");
+  const [code, setCode] = useState2("");
+  const [challengeId, setChallengeId] = useState2(null);
+  const [busy, setBusy] = useState2(false);
+  const [error, setError] = useState2(null);
+  const verb = app?.signInVerb === "login" ? "Log in" : "Sign in";
+  function fail(error2, message) {
+    setError(message ?? error2);
+    onResult?.({ ok: false, error: error2, message });
+  }
+  async function startGoogle() {
+    if (!ctx.clientId) return fail("missing_client_id", "ElvixProvider needs a clientId.");
+    window.location.assign(
+      `${ctx.baseUrl}/api/auth/google/start?intent=app&clientId=${encodeURIComponent(ctx.clientId)}`
+    );
+  }
+  async function startOtp(e) {
+    e.preventDefault();
+    if (!email.trim()) return fail("invalid_input", "Enter an email.");
+    setBusy(true);
+    setError(null);
+    try {
+      const res = await fetch(`${ctx.baseUrl}/api/auth/otp/start`, {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          email: email.trim(),
+          intent: "app",
+          clientId: ctx.clientId
+        })
+      });
+      const body = await res.json();
+      if (!res.ok || !body.success || !body.data?.challengeId) {
+        return fail(body.errorMessage ?? "otp_start_failed");
+      }
+      setChallengeId(body.data.challengeId);
+      setStep("code");
+    } catch (e2) {
+      fail("network", e2 instanceof Error ? e2.message : void 0);
+    } finally {
+      setBusy(false);
+    }
+  }
+  async function verifyOtp(e) {
+    e.preventDefault();
+    if (!challengeId) return;
+    if (code.trim().length !== 6) return fail("invalid_input", "Enter the 6-digit code.");
+    setBusy(true);
+    setError(null);
+    try {
+      const res = await fetch(`${ctx.baseUrl}/api/auth/otp/verify`, {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ challengeId, code: code.trim() })
+      });
+      const body = await res.json();
+      if (!res.ok || !body.success) {
+        return fail(body.errorMessage ?? "otp_verify_failed");
+      }
+      setStep("done");
+      onResult?.({
+        ok: true,
+        method: "email_otp",
+        redirect: body.data?.redirect ?? redirectAfterSignIn
+      });
+    } catch (e2) {
+      fail("network", e2 instanceof Error ? e2.message : void 0);
+    } finally {
+      setBusy(false);
+    }
+  }
+  const card = `elvix-card ${className}`.trim();
+  if (step === "done") {
+    return /* @__PURE__ */ React.createElement("div", { className: card, "data-elvix-pane": "done" }, /* @__PURE__ */ React.createElement("p", null, "Signed in."));
+  }
+  return /* @__PURE__ */ React.createElement("div", { className: card, "data-elvix-pane": step }, /* @__PURE__ */ React.createElement("h2", { className: "elvix-h" }, app?.appName ? `${verb} to ${app.appName}` : verb), step === "identify" && /* @__PURE__ */ React.createElement(React.Fragment, null, app?.methods.google && /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: startGoogle,
+      disabled: busy,
+      className: "elvix-btn elvix-btn-google",
+      "data-elvix-method": "google"
+    },
+    "Continue with Google"
+  ), app?.methods.emailOtp && /* @__PURE__ */ React.createElement("form", { onSubmit: startOtp, "data-elvix-method": "email_otp", className: "elvix-otp-form" }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "email",
+      value: email,
+      onChange: (ev) => setEmail(ev.target.value),
+      placeholder: "you@example.com",
+      required: true,
+      disabled: busy,
+      className: "elvix-input"
+    }
+  ), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Sending\u2026" : "Send code"))), step === "code" && /* @__PURE__ */ React.createElement("form", { onSubmit: verifyOtp, className: "elvix-otp-form" }, /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "We sent a 6-digit code to ", /* @__PURE__ */ React.createElement("strong", null, email), "."), /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      inputMode: "numeric",
+      pattern: "[0-9]*",
+      maxLength: 6,
+      value: code,
+      onChange: (ev) => setCode(ev.target.value.replace(/\D/g, "")),
+      placeholder: "123456",
+      required: true,
+      disabled: busy,
+      className: "elvix-input"
+    }
+  ), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Verifying\u2026" : verb)), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-username.tsx
+import { useState as useState3 } from "react";
+
+// src/react/lib.ts
+async function appPost(opts, path, body) {
+  try {
+    const res = await fetch(`${opts.baseUrl}/api/account/apps/${opts.applicationId}${path}`, {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      credentials: "include",
+      body: JSON.stringify(body)
+    });
+    const json = await res.json();
+    if (!res.ok || !json.success) {
+      return { ok: false, error: json.errorMessage ?? "request_failed" };
+    }
+    return { ok: true, data: json.data };
+  } catch (e) {
+    return { ok: false, error: "network", message: e instanceof Error ? e.message : void 0 };
+  }
+}
+async function appPatch(opts, path, body) {
+  try {
+    const res = await fetch(`${opts.baseUrl}/api/account/apps/${opts.applicationId}${path}`, {
+      method: "PATCH",
+      headers: { "content-type": "application/json" },
+      credentials: "include",
+      body: JSON.stringify(body)
+    });
+    const json = await res.json();
+    if (!res.ok || !json.success) {
+      return { ok: false, error: json.errorMessage ?? "request_failed" };
+    }
+    return { ok: true, data: json.data };
+  } catch (e) {
+    return { ok: false, error: "network", message: e instanceof Error ? e.message : void 0 };
+  }
+}
+async function appDelete(opts, path) {
+  try {
+    const res = await fetch(`${opts.baseUrl}/api/account/apps/${opts.applicationId}${path}`, {
+      method: "DELETE",
+      credentials: "include"
+    });
+    const json = await res.json().catch(() => ({}));
+    if (!res.ok || json.success !== void 0 && !json.success) {
+      return { ok: false, error: json.errorMessage ?? "request_failed" };
+    }
+    return { ok: true, data: json.data };
+  } catch (e) {
+    return { ok: false, error: "network", message: e instanceof Error ? e.message : void 0 };
+  }
+}
+
+// src/react/elvix-username.tsx
+function ElvixUsername({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [value, setValue] = useState3("");
+  const [busy, setBusy] = useState3(false);
+  const [error, setError] = useState3(null);
+  const [done, setDone] = useState3(null);
+  async function submit(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/username",
+      { username: value.trim().toLowerCase() }
+    );
+    setBusy(false);
+    if (!result.ok) {
+      setError(result.error);
+    } else {
+      setDone(result.data?.username ?? value.trim().toLowerCase());
+    }
+    onResult?.(result);
+  }
+  if (done) {
+    return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Username saved" }, /* @__PURE__ */ React.createElement("p", null, "You are now ", /* @__PURE__ */ React.createElement("strong", null, "@", done), "."));
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Choose a username" }, /* @__PURE__ */ React.createElement("form", { onSubmit: submit, className: "elvix-form" }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      value,
+      onChange: (e) => setValue(e.target.value.toLowerCase()),
+      placeholder: "alice",
+      pattern: "[a-z][a-z0-9._]{2,28}[a-z0-9]",
+      required: true,
+      disabled: busy,
+      className: "elvix-input"
+    }
+  ), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy || value.length < 4, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Claim"), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error)));
+}
+
+// src/react/elvix-avatar.tsx
+import { useState as useState4 } from "react";
+function ElvixAvatar({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [busy, setBusy] = useState4(false);
+  const [error, setError] = useState4(null);
+  const [preview, setPreview] = useState4(null);
+  async function onFile(e) {
+    const file = e.target.files?.[0];
+    if (!file || !ctx.app) return;
+    if (file.size > 4 * 1024 * 1024) {
+      setError("file_too_large");
+      return;
+    }
+    setBusy(true);
+    setError(null);
+    const buf = await file.arrayBuffer();
+    const b64 = btoa(String.fromCharCode(...new Uint8Array(buf)));
+    const dataUrl = `data:${file.type};base64,${b64}`;
+    setPreview(dataUrl);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/avatar",
+      { avatarDataUrl: dataUrl }
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Avatar" }, preview && /* @__PURE__ */ React.createElement(
+    "img",
+    {
+      src: preview,
+      alt: "avatar preview",
+      style: { width: 96, height: 96, borderRadius: "50%", objectFit: "cover", marginBottom: 12 }
+    }
+  ), /* @__PURE__ */ React.createElement("input", { type: "file", accept: "image/png,image/jpeg,image/webp", onChange: onFile, disabled: busy }), busy && /* @__PURE__ */ React.createElement("p", null, "Uploading\u2026"), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-banner.tsx
+import { useState as useState5 } from "react";
+function ElvixBanner({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [busy, setBusy] = useState5(false);
+  const [error, setError] = useState5(null);
+  const [preview, setPreview] = useState5(null);
+  async function onFile(e) {
+    const file = e.target.files?.[0];
+    if (!file || !ctx.app) return;
+    if (file.size > 8 * 1024 * 1024) {
+      setError("file_too_large");
+      return;
+    }
+    setBusy(true);
+    setError(null);
+    const buf = await file.arrayBuffer();
+    const b64 = btoa(String.fromCharCode(...new Uint8Array(buf)));
+    const dataUrl = `data:${file.type};base64,${b64}`;
+    setPreview(dataUrl);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/banner",
+      { bannerDataUrl: dataUrl }
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Banner" }, preview && /* @__PURE__ */ React.createElement(
+    "img",
+    {
+      src: preview,
+      alt: "banner preview",
+      style: { width: "100%", aspectRatio: "16/9", objectFit: "cover", borderRadius: 10, marginBottom: 12 }
+    }
+  ), /* @__PURE__ */ React.createElement("input", { type: "file", accept: "image/png,image/jpeg,image/webp", onChange: onFile, disabled: busy }), busy && /* @__PURE__ */ React.createElement("p", null, "Uploading\u2026"), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-identity-form.tsx
+import { useState as useState6 } from "react";
+function ElvixIdentityForm({
+  initialName = "",
+  initialBio = "",
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [name, setName] = useState6(initialName);
+  const [bio, setBio] = useState6(initialBio);
+  const [busy, setBusy] = useState6(false);
+  const [error, setError] = useState6(null);
+  const [saved, setSaved] = useState6(false);
+  async function submit(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/identity",
+      { name: name.trim(), bio: bio.trim() }
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    else setSaved(true);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Identity" }, /* @__PURE__ */ React.createElement("form", { onSubmit: submit, className: "elvix-form" }, /* @__PURE__ */ React.createElement("label", null, "Name", /* @__PURE__ */ React.createElement("input", { value: name, onChange: (e) => setName(e.target.value), maxLength: 80, disabled: busy, className: "elvix-input" })), /* @__PURE__ */ React.createElement("label", null, "Bio", /* @__PURE__ */ React.createElement("textarea", { value: bio, onChange: (e) => setBio(e.target.value), maxLength: 500, rows: 3, disabled: busy, className: "elvix-input" })), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Save"), saved && /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "Saved."), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error)));
+}
+
+// src/react/elvix-region.tsx
+import { useState as useState7 } from "react";
+function ElvixRegion({
+  initialCountry = "",
+  initialTimezone = "",
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [country, setCountry] = useState7(initialCountry);
+  const [timezone, setTimezone] = useState7(initialTimezone);
+  const [busy, setBusy] = useState7(false);
+  const [error, setError] = useState7(null);
+  const [saved, setSaved] = useState7(false);
+  async function submit(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/region",
+      { country: country.toUpperCase().slice(0, 2), timezone: timezone.trim() }
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    else setSaved(true);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Region" }, /* @__PURE__ */ React.createElement("form", { onSubmit: submit, className: "elvix-form" }, /* @__PURE__ */ React.createElement("label", null, "Country (ISO-2)", /* @__PURE__ */ React.createElement("input", { value: country, onChange: (e) => setCountry(e.target.value.toUpperCase()), maxLength: 2, pattern: "[A-Z]{2}", disabled: busy, className: "elvix-input" })), /* @__PURE__ */ React.createElement("label", null, "Timezone", /* @__PURE__ */ React.createElement("input", { value: timezone, onChange: (e) => setTimezone(e.target.value), placeholder: "Europe/Berlin", disabled: busy, className: "elvix-input" })), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Save"), saved && /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "Saved."), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error)));
+}
+
+// src/react/elvix-languages.tsx
+import { useState as useState8 } from "react";
+function ElvixLanguages({
+  initial = [],
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [raw, setRaw] = useState8(initial.join(", "));
+  const [busy, setBusy] = useState8(false);
+  const [error, setError] = useState8(null);
+  const [saved, setSaved] = useState8(false);
+  async function submit(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const languages = raw.split(",").map((s) => s.trim()).filter(Boolean);
+    const result = await appPatch(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/languages",
+      { languages }
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    else setSaved(true);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Languages" }, /* @__PURE__ */ React.createElement("form", { onSubmit: submit, className: "elvix-form" }, /* @__PURE__ */ React.createElement("label", null, "Preferred languages (comma-separated BCP-47 tags)", /* @__PURE__ */ React.createElement("input", { value: raw, onChange: (e) => setRaw(e.target.value), placeholder: "en-GB, de-DE", disabled: busy, className: "elvix-input" })), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Save"), saved && /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "Saved."), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error)));
+}
+
+// src/react/elvix-sessions.tsx
+import { useEffect as useEffect2, useState as useState9 } from "react";
+function ElvixSessions({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [rows, setRows] = useState9(null);
+  const [error, setError] = useState9(null);
+  const [busy, setBusy] = useState9(false);
+  useEffect2(() => {
+    if (!ctx.app) return;
+    fetch(`${ctx.baseUrl}/api/account/apps/${ctx.app.applicationId}/sessions`, {
+      credentials: "include"
+    }).then((r) => r.json()).then((j) => {
+      if (j.success && j.data) setRows(j.data.sessions);
+      else setError("load_failed");
+    }).catch(() => setError("network"));
+  }, [ctx.app, ctx.baseUrl]);
+  async function revoke(id) {
+    if (!ctx.app) return;
+    setBusy(true);
+    const result = await appDelete(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      `/sessions/${id}`
+    );
+    setBusy(false);
+    if (result.ok) setRows((prev) => prev?.filter((s) => s.id !== id) ?? null);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Active sessions" }, error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error), !rows && !error && /* @__PURE__ */ React.createElement("p", null, "Loading\u2026"), rows && /* @__PURE__ */ React.createElement("ul", { style: { listStyle: "none", padding: 0, margin: 0 } }, rows.map((s) => /* @__PURE__ */ React.createElement("li", { key: s.id, style: { padding: "10px 0", borderBottom: "1px solid rgba(0,0,0,0.06)" } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "space-between", gap: 12 } }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { style: { fontSize: 13, fontWeight: 500 } }, s.device, s.current && /* @__PURE__ */ React.createElement("span", { style: { marginLeft: 8, color: "var(--elvix-primary-strong)", fontSize: 11 } }, "\xB7 this device")), /* @__PURE__ */ React.createElement("div", { style: { fontSize: 11, color: "rgba(0,0,0,0.55)" } }, s.country ?? "\u2014", " \xB7 since ", new Date(s.createdAt).toLocaleDateString())), !s.current && /* @__PURE__ */ React.createElement("button", { type: "button", disabled: busy, onClick: () => revoke(s.id), className: "elvix-btn elvix-btn-ghost" }, "Revoke"))))));
+}
+
+// src/react/elvix-export.tsx
+import { useState as useState10 } from "react";
+function ElvixExport({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [busy, setBusy] = useState10(false);
+  const [done, setDone] = useState10(false);
+  const [error, setError] = useState10(null);
+  async function start() {
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/export",
+      {}
+    );
+    setBusy(false);
+    if (!result.ok) setError(result.error);
+    else setDone(true);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Export my data" }, /* @__PURE__ */ React.createElement("p", { style: { fontSize: 13, color: "rgba(0,0,0,0.6)" } }, "Request a zip of every record we hold for you in this app. Delivery by email; single-use download link valid for 24h."), done ? /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "Request queued. Check your email.") : /* @__PURE__ */ React.createElement("button", { type: "button", onClick: start, disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Queuing\u2026" : "Request export"), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-deactivate.tsx
+import { useState as useState11 } from "react";
+function ElvixDeactivate({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [pane, setPane] = useState11("warn");
+  const [challengeId, setChallengeId] = useState11(null);
+  const [code, setCode] = useState11("");
+  const [busy, setBusy] = useState11(false);
+  const [error, setError] = useState11(null);
+  async function startChallenge() {
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/membership/challenge",
+      { action: "deactivate" }
+    );
+    setBusy(false);
+    if (!result.ok || !result.data?.challengeId) {
+      setError(result.ok ? "no_challenge" : result.error);
+      return;
+    }
+    setChallengeId(result.data.challengeId);
+    setPane("otp");
+  }
+  async function confirm(e) {
+    e.preventDefault();
+    if (!ctx.app || !challengeId) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/membership/deactivate",
+      { challengeId, code: code.trim() }
+    );
+    setBusy(false);
+    if (!result.ok) {
+      setError(result.error);
+      onResult?.(result);
+      return;
+    }
+    setPane("done");
+    onResult?.(result);
+  }
+  if (pane === "done") {
+    return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Deactivated" }, /* @__PURE__ */ React.createElement("p", null, "Your access has been paused. Sign in again to restore it."));
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Deactivate account" }, pane === "warn" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", { style: { fontSize: 13, color: "rgba(0,0,0,0.6)" } }, "Pause your membership. You can restore it any time by signing in again. No data is deleted."), /* @__PURE__ */ React.createElement("button", { type: "button", onClick: startChallenge, disabled: busy, className: "elvix-btn elvix-btn-danger" }, busy ? "Sending\u2026" : "Send code")), pane === "otp" && /* @__PURE__ */ React.createElement("form", { onSubmit: confirm, className: "elvix-form" }, /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "We sent a 6-digit code to your email."), /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      inputMode: "numeric",
+      pattern: "[0-9]*",
+      maxLength: 6,
+      value: code,
+      onChange: (e) => setCode(e.target.value.replace(/\D/g, "")),
+      required: true,
+      disabled: busy,
+      className: "elvix-input"
+    }
+  ), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy || code.length !== 6, className: "elvix-btn elvix-btn-danger" }, busy ? "Deactivating\u2026" : "Confirm")), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-leave.tsx
+import { useState as useState12 } from "react";
+function ElvixLeave({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [pane, setPane] = useState12("warn");
+  const [challengeId, setChallengeId] = useState12(null);
+  const [code, setCode] = useState12("");
+  const [busy, setBusy] = useState12(false);
+  const [error, setError] = useState12(null);
+  async function startChallenge() {
+    if (!ctx.app) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/membership/challenge",
+      { action: "leave" }
+    );
+    setBusy(false);
+    if (!result.ok || !result.data?.challengeId) {
+      setError(result.ok ? "no_challenge" : result.error);
+      return;
+    }
+    setChallengeId(result.data.challengeId);
+    setPane("otp");
+  }
+  async function confirm(e) {
+    e.preventDefault();
+    if (!ctx.app || !challengeId) return;
+    setBusy(true);
+    setError(null);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/membership/leave",
+      { challengeId, code: code.trim() }
+    );
+    setBusy(false);
+    if (!result.ok) {
+      setError(result.error);
+      onResult?.(result);
+      return;
+    }
+    setPane("done");
+    onResult?.(result);
+  }
+  if (pane === "done") {
+    return /* @__PURE__ */ React.createElement(ElvixCard, { title: "You've left" }, /* @__PURE__ */ React.createElement("p", null, "You've left this app. Your data is archived; sign in again to rejoin."));
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Leave this app" }, pane === "warn" && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("p", { style: { fontSize: 13, color: "rgba(0,0,0,0.6)" } }, "Remove yourself from this app. Audit trail is preserved; you can sign back in any time to rejoin."), /* @__PURE__ */ React.createElement("button", { type: "button", onClick: startChallenge, disabled: busy, className: "elvix-btn elvix-btn-danger" }, busy ? "Sending\u2026" : "Send code")), pane === "otp" && /* @__PURE__ */ React.createElement("form", { onSubmit: confirm, className: "elvix-form" }, /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "We sent a 6-digit code to your email."), /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      inputMode: "numeric",
+      pattern: "[0-9]*",
+      maxLength: 6,
+      value: code,
+      onChange: (e) => setCode(e.target.value.replace(/\D/g, "")),
+      required: true,
+      disabled: busy,
+      className: "elvix-input"
+    }
+  ), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy || code.length !== 6, className: "elvix-btn elvix-btn-danger" }, busy ? "Leaving\u2026" : "Confirm leave")), error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error));
+}
+
+// src/react/elvix-address-book.tsx
+import { useEffect as useEffect3, useState as useState13 } from "react";
+function ElvixAddressBook({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [rows, setRows] = useState13(null);
+  const [error, setError] = useState13(null);
+  const [busy, setBusy] = useState13(false);
+  const [adding, setAdding] = useState13(false);
+  const [form, setForm] = useState13({
+    label: "Home",
+    line1: "",
+    postalCode: "",
+    city: "",
+    country: ""
+  });
+  function reload() {
+    if (!ctx.app) return;
+    fetch(`${ctx.baseUrl}/api/account/apps/${ctx.app.applicationId}/addresses`, {
+      credentials: "include"
+    }).then((r) => r.json()).then((j) => {
+      if (j.success && j.data) setRows(j.data.addresses);
+      else setError("load_failed");
+    }).catch(() => setError("network"));
+  }
+  useEffect3(() => {
+    reload();
+  }, [ctx.app, ctx.baseUrl]);
+  async function add(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/addresses",
+      form
+    );
+    setBusy(false);
+    if (result.ok) {
+      setAdding(false);
+      setForm({ label: "Home", line1: "", postalCode: "", city: "", country: "" });
+      reload();
+    } else {
+      setError(result.error);
+    }
+    onResult?.(result);
+  }
+  async function remove(id) {
+    if (!ctx.app) return;
+    setBusy(true);
+    const result = await appDelete(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      `/addresses/${id}`
+    );
+    setBusy(false);
+    if (result.ok) setRows((prev) => prev?.filter((a) => a.id !== id) ?? null);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Addresses" }, error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error), !rows && !error && /* @__PURE__ */ React.createElement("p", null, "Loading\u2026"), rows && rows.length === 0 && /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "No addresses yet."), rows?.map((a) => /* @__PURE__ */ React.createElement("div", { key: a.id, style: { padding: "8px 0", borderBottom: "1px solid rgba(0,0,0,0.06)", display: "flex", justifyContent: "space-between", gap: 12 } }, /* @__PURE__ */ React.createElement("div", { style: { fontSize: 13 } }, /* @__PURE__ */ React.createElement("div", { style: { fontWeight: 500 } }, a.label), /* @__PURE__ */ React.createElement("div", { style: { color: "rgba(0,0,0,0.55)" } }, a.line1, a.line2 ? `, ${a.line2}` : "", ", ", a.postalCode, " ", a.city, ", ", a.country)), /* @__PURE__ */ React.createElement("button", { type: "button", disabled: busy, onClick: () => remove(a.id), className: "elvix-btn elvix-btn-ghost" }, "Remove"))), !adding && /* @__PURE__ */ React.createElement("button", { type: "button", onClick: () => setAdding(true), className: "elvix-btn elvix-btn-primary", style: { marginTop: 12 } }, "Add address"), adding && /* @__PURE__ */ React.createElement("form", { onSubmit: add, className: "elvix-form", style: { marginTop: 12 } }, /* @__PURE__ */ React.createElement("input", { value: form.label, onChange: (e) => setForm({ ...form, label: e.target.value }), placeholder: "Label", className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.line1, onChange: (e) => setForm({ ...form, line1: e.target.value }), placeholder: "Street", required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.postalCode, onChange: (e) => setForm({ ...form, postalCode: e.target.value }), placeholder: "Postal code", required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.city, onChange: (e) => setForm({ ...form, city: e.target.value }), placeholder: "City", required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.country, onChange: (e) => setForm({ ...form, country: e.target.value.toUpperCase() }), placeholder: "Country (ISO-2)", maxLength: 2, required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Save")));
+}
+
+// src/react/elvix-legal-entities.tsx
+import { useEffect as useEffect4, useState as useState14 } from "react";
+function ElvixLegalEntities({
+  onResult
+}) {
+  const ctx = useElvixContext();
+  const [rows, setRows] = useState14(null);
+  const [error, setError] = useState14(null);
+  const [busy, setBusy] = useState14(false);
+  const [adding, setAdding] = useState14(false);
+  const [form, setForm] = useState14({
+    legalName: "",
+    taxId: "",
+    country: ""
+  });
+  function reload() {
+    if (!ctx.app) return;
+    fetch(`${ctx.baseUrl}/api/account/apps/${ctx.app.applicationId}/legal-entities`, {
+      credentials: "include"
+    }).then((r) => r.json()).then((j) => {
+      if (j.success && j.data) setRows(j.data.entities);
+      else setError("load_failed");
+    }).catch(() => setError("network"));
+  }
+  useEffect4(() => {
+    reload();
+  }, [ctx.app, ctx.baseUrl]);
+  async function add(e) {
+    e.preventDefault();
+    if (!ctx.app) return;
+    setBusy(true);
+    const result = await appPost(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      "/legal-entities",
+      form
+    );
+    setBusy(false);
+    if (result.ok) {
+      setAdding(false);
+      setForm({ legalName: "", taxId: "", country: "" });
+      reload();
+    } else {
+      setError(result.error);
+    }
+    onResult?.(result);
+  }
+  async function remove(id) {
+    if (!ctx.app) return;
+    setBusy(true);
+    const result = await appDelete(
+      { baseUrl: ctx.baseUrl, applicationId: ctx.app.applicationId },
+      `/legal-entities/${id}`
+    );
+    setBusy(false);
+    if (result.ok) setRows((prev) => prev?.filter((a) => a.id !== id) ?? null);
+    onResult?.(result);
+  }
+  return /* @__PURE__ */ React.createElement(ElvixCard, { title: "Legal entities" }, error && /* @__PURE__ */ React.createElement("p", { role: "alert", className: "elvix-error" }, error), !rows && !error && /* @__PURE__ */ React.createElement("p", null, "Loading\u2026"), rows && rows.length === 0 && /* @__PURE__ */ React.createElement("p", { className: "elvix-muted" }, "No legal entities yet."), rows?.map((e) => /* @__PURE__ */ React.createElement("div", { key: e.id, style: { padding: "8px 0", borderBottom: "1px solid rgba(0,0,0,0.06)", display: "flex", justifyContent: "space-between", gap: 12 } }, /* @__PURE__ */ React.createElement("div", { style: { fontSize: 13 } }, /* @__PURE__ */ React.createElement("div", { style: { fontWeight: 500 } }, e.legalName), /* @__PURE__ */ React.createElement("div", { style: { color: "rgba(0,0,0,0.55)" } }, e.taxId, " \xB7 ", e.country)), /* @__PURE__ */ React.createElement("button", { type: "button", disabled: busy, onClick: () => remove(e.id), className: "elvix-btn elvix-btn-ghost" }, "Remove"))), !adding && /* @__PURE__ */ React.createElement("button", { type: "button", onClick: () => setAdding(true), className: "elvix-btn elvix-btn-primary", style: { marginTop: 12 } }, "Add entity"), adding && /* @__PURE__ */ React.createElement("form", { onSubmit: add, className: "elvix-form", style: { marginTop: 12 } }, /* @__PURE__ */ React.createElement("input", { value: form.legalName, onChange: (e) => setForm({ ...form, legalName: e.target.value }), placeholder: "Legal name", required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.taxId, onChange: (e) => setForm({ ...form, taxId: e.target.value }), placeholder: "Tax / VAT ID", required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("input", { value: form.country, onChange: (e) => setForm({ ...form, country: e.target.value.toUpperCase() }), placeholder: "Country (ISO-2)", maxLength: 2, required: true, className: "elvix-input" }), /* @__PURE__ */ React.createElement("button", { type: "submit", disabled: busy, className: "elvix-btn elvix-btn-primary" }, busy ? "Saving\u2026" : "Save")));
+}
+export {
+  ElvixAddressBook,
+  ElvixAvatar,
+  ElvixBanner,
+  ElvixCard,
+  ElvixDeactivate,
+  ElvixExport,
+  ElvixIdentityForm,
+  ElvixLanguages,
+  ElvixLeave,
+  ElvixLegalEntities,
+  ElvixProvider,
+  ElvixRegion,
+  ElvixSessions,
+  ElvixSignIn,
+  ElvixUsername,
+  useElvixApp,
+  useElvixContext
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elvix.is/sdk",
-  "version": "0.1.2",
+  "version": "0.3.0",
   "description": "Official elvix SDK. Drop-in React components, server helpers, and an MCP server so AI coding agents integrate elvix on the first try.",
   "license": "MIT",
   "homepage": "https://elvix.is",
@@ -56,13 +56,16 @@
     "next": ">=15"
   },
   "peerDependenciesMeta": {
-    "next": { "optional": true }
+    "next": {
+      "optional": true
+    }
   },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.0.4"
   },
   "devDependencies": {
     "@types/node": "^22.7.5",
+    "@types/react": "^19.2.15",
     "tsup": "^8.3.0",
     "typescript": "^5.6.3",
     "vitest": "^2.1.2"