@elvix.is/sdk 0.2.0 → 0.3.0

package/dist/react.d.ts

@@ -1,5 +1,24 @@
 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
@@ -101,4 +120,116 @@ declare function ElvixSignIn({ onResult, redirectAfterSignIn, className, }: {
     className?: string;
 }): react.JSX.Element;
 
-export { type ElvixBootstrapEnvelope, type ElvixBrand, ElvixProvider, ElvixSignIn, type ElvixSignInMethod, type ElvixSignInResult, type ElvixSignInResultErr, type ElvixSignInResultOk, type ElvixTheme, useElvixApp, useElvixContext };
+/**
+ * `<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

@@ -1,3 +1,54 @@
+// 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,
@@ -237,9 +288,607 @@ function ElvixSignIn({
     }
   ), /* @__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.2.0",
+  "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",