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

> ## Agent Instructions
> For new direct REST integrations, use the v2026-04 surfaces. The @fluid-app FairShare SDK continues to use its own published public-v2025-06 contract.
> Authenticate with the header Authorization: Bearer <token>; public storefront read endpoints require no auth.
> Lists use cursor pagination via the page[cursor] and page[limit] query params; follow meta.pagination.next_cursor until it is null.
> When the same operation exists on more than one surface, use the newest: dated API versions are newer than unversioned ones, and later dates win (v2026-04 > v2025-06 > unversioned v0/v1.1). Fall back to a legacy or unversioned operation only when no newer versioned equivalent exists — the company-v0 notes below list the known superseded operations. /api/company/v1 and /api/v1/... paths are documented in no spec here and must never be used (/api/v1.1/... is distinct and documented in company-v0). Use page/per_page offset pagination only where a spec documents it — in practice the unversioned company-v0 admin surface; every versioned surface uses cursor pagination.
> Navigation menu management is documented in themes/navigation-menus. These unversioned admin endpoints (/api/menus and nested menu_items) are verified against the implementation but are not yet in the synced OpenAPI specs. Use that reference for menu payloads and its flat page/per_page pagination; missing spec coverage does not make these endpoints unavailable.
> The OpenAPI specs under api-reference/ are the authoritative contracts; prefer them over prose when in doubt. api-reference/storefront-v2026-04.yaml covers the v2026-04 storefront surface (/api/v202604/... paths); api-reference/auth-v0.yaml covers the unversioned auth surface (/api/... paths — authentication, MFA, social auth, and token exchange); api-reference/checkout-v2026-04.yaml covers the v2026-04 checkout surface (/api/checkout/v2026-04/... paths — carts, cart auth, discounts, items, subscriptions, orders, enrollments, and store config); api-reference/public-v2025-06.yaml covers the Public SDK surface used by the @fluid-app FairShare SDK, including its parallel cart lifecycle, browser integrations, versioned payment callbacks, unversioned public utilities, and the cart price-override operation; api-reference/payment-v2026-04.yaml covers the v2026-04 payment gateway admin surface (/api/payment/v2026-04/... paths, bearer-authenticated — gateway CRUD, gateway purchase/authorize/$0-verify, transaction list/show and capture/void/credit, and merchant payment configuration); api-reference/payments-v2026-04.yaml covers the v2026-04 cart payment surface (/api/payments/v2026-04/carts/{cart_token}/... paths, authenticated by the cart token in the path with no bearer — payment-method selection, VGS card tokenization, 3D Secure verification, and PayPal/Braintree/Klarna/Apple Pay flows); api-reference/commerce-v2026-04.yaml covers the v2026-04 commerce order-editing surface (/api/v202604/orders/{order_id}/edits paths, bearer-authenticated — post-checkout order edits that atomically insert items and add adjustments/discounts, with an optional dry-run preview); api-reference/webhooks-v0.yaml covers the unversioned webhooks surface (/api/... paths — webhook registration, delivery payloads, callback registrations, company events, and webhook/callback schemas); api-reference/company-v0.yaml covers the legacy unversioned company admin surface (/api/... paths, bearer-authenticated — company settings and management, customers, users, roles, subscription plans, subscription bundles, subscriptions, media, pages, catch-ups, inventory levels, domains, agreements, and admin order actions). company-v0 caveats: it is the legacy v0 admin contract and its lists use flat page/per_page offset pagination, which is expected there despite the general cursor-pagination rule; where an operation exists in both company-v0 and a versioned spec, prefer the versioned spec — the subscriptions lifecycle (list/create/show/update, cancel, pause, reactivate, resume, retry, skip, failed-cycle-waiver, discounts) and subscription bundles are superseded by checkout-v2026-04, and company pages/media CRUD plus the public pages, categories, products, and media list endpoints are superseded by storefront-v2026-04. Subscription plan management (/api/subscription_plans, resource-wrapped {"subscription_plan": {...}} bodies) exists only in company-v0. api-reference/members-v2025-06.yaml covers the v2025-06 unified Member identity surface (/api/v2025-06/members/... paths, bearer-authenticated — member list/create/show/update, lookup by email/username/external_id/legacy_customer_id, member-type assignment, and the sponsor genealogy read). Prefer it over the customers and reps surfaces when the member type matters: /customers does not serialize member_type. api-reference/analytics-v2026-04.yaml covers the v2026-04 Home dashboard analytics surface (/api/v202604/analytics/dashboard/... paths, bearer-authenticated — read-only endpoints for the Home > Overview, Home > Live, and Home > Field tabs, each accepting an optional country ISO alpha-2 query param that scopes aggregations to a single country).
> api-reference/analytics-v0.yaml covers the unversioned analytics surface that backs the fluid-admin Traffic tab (/api/analytics/... and /api/analytics/traffic/... paths, bearer-authenticated — the legacy shares/views/visitors summary plus traffic overview, ranked campaigns, sources, geographies, flows, and per-rep breakdown, all sharing one reporting-period contract).
> Successful responses wrap the resource payload alongside a top-level integer status and a meta object.
> Portal Definition authoring edits and synchronizes the portal JSON resource graph. Widget Package authoring builds either a company-owned or Droplet-owned Remote DOM package. These are separate contracts; do not imply that one defines the other.
> For Widget Package worker code, use only @fluid-app/portal-sdk/widgets/worker. Use only the Portal Definition and Widget Package workflows and public entry points documented here; do not infer support for undocumented surfaces.
> Every portal function and declarative capability used by a widget must appear in that widget's uses array. Use the same typed function value in uses; do not invent capability-name strings.
> Widget styling must use the portal's semantic theme variables for colors, typography, spacing, radii, borders, focus, and charts whenever a token represents the visual decision. Do not create a separate light or dark palette or duplicate theme controls as widget properties.
> Prefer worker-safe Fluid UI components exported by @fluid-app/portal-sdk/widgets/worker when they fit the interaction. When no exported component fits, use semantic HTML, accessible behavior, and the portal theme variables.
> A Portal Definition push updates the remote working definition. A portal version is an immutable snapshot, and activation is a separate live release operation.

# Add account navigation

> Give members a sign-in link and an account menu in a cached theme header.

Account navigation gives one cached header two states. Guests see a **Sign in** link. Signed-in members see an avatar that opens a small account menu.

Place the tag in your header or navigation:

```liquid theme={null}
{% member_account %}
```

That is the whole theme change. The tag renders an empty element carrying only data, and the runtime builds the markup inside it:

```html theme={null}
<fluid-member-account
  data-fluid-member-storefront
  data-account-url="https://northwind.account.fluid.app/"
  data-sign-in-url="/auth/sign_in"
  data-sign-out-url="/auth/sign_out"
  data-sign-in-label="Sign in"
  data-account-label="Account"
  data-sign-out-label="Sign out"
></fluid-member-account>
```

With the member storefront disabled, the tag renders nothing at all.

## What each visitor sees

| Visitor | Result                                                            |
| ------- | ----------------------------------------------------------------- |
| Guest   | A **Sign in** link to the current host's sign-in flow             |
| Member  | An avatar of their initials, opening **Account** and **Sign out** |

The avatar shows initials taken from the member's display name — "Alex Kim" reads AK, and "Alex" reads A. The name arrives with the session the runtime already fetches, so the avatar costs no extra request.

**Account** opens your company's account home. **Sign out** ends the session.

The cached HTML always starts in the guest state. A member sees the menu once the runtime confirms the session. If the session has expired, or the request fails, **Sign in** stays visible.

## Behaviour

The menu uses a native disclosure element, so it works with the keyboard out of the box:

* **Escape** closes the menu and returns focus to the avatar
* A click outside closes it
* Choosing a link closes it

The panel is sized by its own content and clamped to a maximum width. A narrow or stretched navigation container will not stretch it.

## Styling

The tag passes your theme's own settings to the menu, using the same values a member system screen reads — primary colour, surface colour, border colour, and body font among them. The menu matches your system screens without a second palette to maintain.

A storefront with no such settings falls back to neutral defaults that inherit the surrounding header's text colour, so the avatar stays legible on a light or a dark header.

To go further, style these classes with ordinary CSS:

| Selector                        | Part                            |
| ------------------------------- | ------------------------------- |
| `fluid-member-account`          | The element as a whole          |
| `.fluid-member-account-avatar`  | The initials circle             |
| `.fluid-member-account-trigger` | The element that opens the menu |
| `.fluid-member-account-links`   | The dropdown panel              |

You can also override two custom properties:

```css theme={null}
fluid-member-account {
  --fluid-member-account-radius: 0.5rem;
  --fluid-member-account-shadow: 0 8px 24px rgb(0 0 0 / 0.2);
}
```

The panel respects `prefers-reduced-motion`.

## Labels and translation

Labels render on the server, so they follow your storefront's language rather than being fixed in the browser.

## Link safety

Only `https:`, `http:`, and root-relative URLs are used. Anything else falls back to a safe default, so a mistyped or hostile value cannot turn a menu item into a script.
