@xforge-dev/forge-kit 0.24.3 → 0.25.0

package/README.md

@@ -80,6 +80,8 @@ import { forgeThemeScript } from '@xforge-dev/forge-kit';
 
 The avatar opens a side panel with the account links, the page links on mobile, Appearance
 (dark mode, color theme, "Same theme in all xForge apps") and then the app's own sections.
+Below 640px a "Menu" button left of the avatar opens the same panel with the page links first.
+`panelNav={false}` (for an app with its own phone navigation) drops both the panel links and the button.
 Build those from `ForgePanelSection`, `ForgePanelItem` and `ForgeSwitchRow`.
 Under the username the panel shows the account's supporter badge and Discord name (from
 `ForgeAccount.supporterTier` / `discordUsername`, which `useForgeUser` reads from `profiles`), then
@@ -140,6 +142,67 @@ owned event blocks and the two equipped ones add a member's points of their rank
 presets (`SharedPoints`, stored under `points` in the shared row so an older board write leaves it alone) and the 5th
 Champion slot (`championSlotsOpen`).
 
+## Keeping apps on the latest kit
+
+After a publish, xforge's release workflow (`notify-apps`) sends a `forge-kit-published` repository dispatch, with
+the version, to bossforge, legionforge, familiarforge and cardforge. That needs an `APPS_DISPATCH_TOKEN` secret
+(a fine-grained PAT or GitHub App token with Contents: read and write on those four repos); without it the job logs a
+notice and does nothing. Each app repo then needs this `.github/workflows/kit-bump.yml`, which also runs on a
+schedule so it catches up when no dispatch arrives:
+
+```yaml
+name: Kit bump
+# Installs the newest @xforge-dev/forge-kit, checks the app and pushes the bump to main. xforge's release workflow
+# dispatches forge-kit-published right after a publish; the schedule catches up when that dispatch is missing.
+on:
+  repository_dispatch: { types: [forge-kit-published] }
+  schedule: [{ cron: '23 */6 * * *' }]
+  workflow_dispatch:
+permissions:
+  contents: write
+concurrency: { group: kit-bump, cancel-in-progress: false }
+jobs:
+  bump:
+    # Home lab runner: no Actions minutes. Its image has no npm, hence setup-node.
+    runs-on: [self-hosted, homelab]
+    steps:
+      - uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.4.0
+        with: { ref: main }
+      - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
+        with: { node-version: 24, cache: npm }
+      - id: bump
+        env:
+          WANT: ${{ github.event.client_payload.version }}
+        run: |
+          # A dispatch can beat the registry by a few seconds: wait for the announced version to resolve.
+          if [ -n "$WANT" ]; then
+            for i in $(seq 30); do npm view "@xforge-dev/forge-kit@$WANT" version >/dev/null 2>&1 && break; sleep 10; done
+          fi
+          current=$(node -p "require('./package-lock.json').packages['node_modules/@xforge-dev/forge-kit'].version")
+          latest=$(npm view @xforge-dev/forge-kit version)
+          if [ "$current" = "$latest" ]; then
+            echo "forge-kit is already $latest"; echo "bump=false" >> "$GITHUB_OUTPUT"; exit 0
+          fi
+          npm install "@xforge-dev/forge-kit@^$latest"
+          echo "bump=true" >> "$GITHUB_OUTPUT"
+          echo "from=$current" >> "$GITHUB_OUTPUT"
+          echo "to=$latest" >> "$GITHUB_OUTPUT"
+      # A GITHUB_TOKEN push starts no other workflow (CI included), so check here before pushing.
+      - if: steps.bump.outputs.bump == 'true'
+        run: npm run typecheck && npm test
+      - if: steps.bump.outputs.bump == 'true'
+        env:
+          FROM: ${{ steps.bump.outputs.from }}
+          TO: ${{ steps.bump.outputs.to }}
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          git commit -am "chore(deps): bump @xforge-dev/forge-kit from $FROM to $TO"
+          # Another push may have landed meanwhile; fast-forward only, never force.
+          git pull --rebase origin main
+          git push origin HEAD:main
+```
+
 ## Exports
 
 `isForgeAuthConfigured` is exported from the root and `/client` entry points.

package/dist/forge-header.d.ts

@@ -66,7 +66,7 @@ export declare function ForgeAvatar({ account, className }: {
     account: ForgeAccount | null;
     className?: string;
 }): import("react").JSX.Element;
-/** Discord's mark in `currentColor`; give it Discord's blurple (`text-[#5865F2]`) next to a Discord name. */
+/** Discord's mark in `currentColor`; give it the `text-discord-text` token next to a Discord name. */
 export declare function DiscordIcon({ className }: {
     className?: string;
 }): import("react").JSX.Element;

package/dist/forge-header.js

@@ -3,8 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import * as Dialog from '@radix-ui/react-dialog';
 import * as Menu from '@radix-ui/react-dropdown-menu';
 import Link from 'next/link.js';
-import { useState } from 'react';
-import { ChevronDown, ExternalLink, LogIn, LogOut, Moon, RefreshCw, Sun, UserRound, X } from 'lucide-react';
+import { useRef, useState } from 'react';
+import { ChevronDown, ExternalLink, LogIn, LogOut, Menu as MenuIcon, Moon, RefreshCw, Sun, UserRound, X } from 'lucide-react';
 import { accountUrl } from './account-url.js';
 import { AppSwitcher } from './app-switcher.js';
 import { FORGE_APPS } from './apps.js';
@@ -39,7 +39,20 @@ const navPill = (active) => active
  */
 export function ForgeHeader({ current, account, syncError, nav = [], panelNav = true, actions, accountDetails, guestDetails, accountActions, panel, onBeforeSignOut, containerClassName = 'max-w-6xl', currentUrl, }) {
     const [open, setOpen] = useState(false);
-    return (_jsx("header", { className: "sticky top-0 z-40 w-full border-b bg-background/95 backdrop-blur supports-backdrop-filter:bg-background/80", children: _jsxs("div", { className: `mx-auto flex h-14 w-full items-center gap-2 px-4 sm:gap-4 ${containerClassName}`, children: [_jsx(AppSwitcher, { current: current, account: account, showAccount: false, currentUrl: currentUrl }), _jsx("nav", { className: "hidden flex-1 items-center gap-1 sm:flex", children: nav.map((item) => isNavGroup(item) ? (_jsx(NavMenu, { group: item }, item.label)) : (_jsx(Link, { href: item.href, "aria-current": item.active ? 'page' : undefined, className: navPill(item.active), children: item.label }, item.href))) }), _jsx("div", { className: "flex-1 sm:hidden" }), actions && _jsx("div", { className: "flex items-center gap-2", children: actions }), _jsxs(Dialog.Root, { open: open, onOpenChange: setOpen, children: [_jsxs(Dialog.Trigger, { "aria-label": "Account and settings", className: "relative shrink-0 rounded-full focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: [_jsx(ForgeAvatar, { account: account, className: "h-8 w-8" }), syncError && (_jsx("span", { role: "img", "aria-label": "Not synced", title: "Not synced", className: "absolute -right-0.5 -top-0.5 h-2.5 w-2.5 rounded-full border-2 border-background bg-destructive" }))] }), _jsxs(Dialog.Portal, { children: [_jsx(Dialog.Overlay, { className: "fixed inset-0 z-50 bg-black/60" }), _jsx(Dialog.Content, { className: "fixed inset-y-0 right-0 z-50 flex w-[88vw] max-w-sm flex-col border-l bg-background text-foreground shadow-lg outline-hidden", children: _jsx(AccountPanel, { current: current, account: account, syncError: syncError, nav: panelNav ? nav : [], accountDetails: accountDetails, guestDetails: guestDetails, accountActions: accountActions, panel: panel, onBeforeSignOut: onBeforeSignOut, currentUrl: currentUrl }) })] })] })] }) }));
+    // Phones get a menu button for the page links (the avatar alone gave no hint of them). It opens the same panel
+    // with Navigate first, and takes focus back when the panel closes.
+    const showMenu = panelNav && nav.length > 0;
+    const [navFirst, setNavFirst] = useState(false);
+    const menuButton = useRef(null);
+    return (_jsx("header", { className: "sticky top-0 z-40 w-full border-b bg-background/95 backdrop-blur supports-backdrop-filter:bg-background/80", children: _jsxs("div", { className: `mx-auto flex h-14 w-full items-center gap-2 px-4 sm:gap-4 ${containerClassName}`, children: [_jsx(AppSwitcher, { current: current, account: account, showAccount: false, currentUrl: currentUrl }), _jsx("nav", { className: "hidden flex-1 items-center gap-1 sm:flex", children: nav.map((item) => isNavGroup(item) ? (_jsx(NavMenu, { group: item }, item.label)) : (_jsx(Link, { href: item.href, "aria-current": item.active ? 'page' : undefined, className: navPill(item.active), children: item.label }, item.href))) }), _jsx("div", { className: "flex-1 sm:hidden" }), actions && _jsx("div", { className: "flex items-center gap-2", children: actions }), showMenu && (_jsx("button", { ref: menuButton, type: "button", "aria-label": "Menu", "aria-haspopup": "dialog", "aria-expanded": open && navFirst, onClick: () => {
+                        setNavFirst(true);
+                        setOpen(true);
+                    }, className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring sm:hidden", children: _jsx(MenuIcon, { "aria-hidden": true, className: "h-5 w-5" }) })), _jsxs(Dialog.Root, { open: open, onOpenChange: setOpen, children: [_jsxs(Dialog.Trigger, { onClick: () => setNavFirst(false), "aria-label": "Account and settings", className: "relative shrink-0 rounded-full focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: [_jsx(ForgeAvatar, { account: account, className: "h-8 w-8" }), syncError && (_jsx("span", { role: "img", "aria-label": "Not synced", title: "Not synced", className: "absolute -right-0.5 -top-0.5 h-2.5 w-2.5 rounded-full border-2 border-background bg-destructive" }))] }), _jsxs(Dialog.Portal, { children: [_jsx(Dialog.Overlay, { className: "fixed inset-0 z-50 bg-black/60" }), _jsx(Dialog.Content, { onCloseAutoFocus: (e) => {
+                                        if (!navFirst || !menuButton.current)
+                                            return;
+                                        e.preventDefault();
+                                        menuButton.current.focus();
+                                    }, className: "fixed inset-y-0 right-0 z-50 flex w-[88vw] max-w-sm flex-col border-l bg-background text-foreground shadow-lg outline-hidden", children: _jsx(AccountPanel, { current: current, account: account, syncError: syncError, nav: panelNav ? nav : [], navFirst: navFirst, accountDetails: accountDetails, guestDetails: guestDetails, accountActions: accountActions, panel: panel, onBeforeSignOut: onBeforeSignOut, currentUrl: currentUrl }) })] })] })] }) }));
 }
 const menuItem = 'flex cursor-pointer select-none items-center gap-3 rounded-sm px-2 py-2 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground';
 /** The page on screen: the hover fill plus a 2px accent bar down its left edge. */
@@ -61,12 +74,14 @@ export function ForgeAvatar({ account, className = '' }) {
     }
     return (_jsx("span", { className: `${className} flex items-center justify-center rounded-full bg-muted text-muted-foreground`, children: _jsx(UserRound, { className: "h-1/2 w-1/2" }) }));
 }
-function AccountPanel({ current, account, syncError, nav = [], accountDetails, guestDetails, accountActions, panel, onBeforeSignOut, currentUrl, }) {
+function AccountPanel({ current, account, syncError, nav = [], navFirst = false, accountDetails, guestDetails, accountActions, panel, onBeforeSignOut, currentUrl, }) {
     const appUrl = FORGE_APPS.find((a) => a.id === current)?.url ?? accountUrl('/');
     const liveUrl = useCurrentUrl(appUrl);
     const next = currentUrl ?? liveUrl;
     const signOutHref = accountUrl('/logout', { next });
     const [signingOut, setSigningOut] = useState(false);
+    // Phone-only: desktop shows these links in the header.
+    const navigate = nav.length > 0 && (_jsx("div", { className: "sm:hidden", children: _jsx(ForgePanelSection, { title: "Navigate", children: nav.map((item) => isNavGroup(item) ? (_jsx(PanelNavGroup, { group: item }, item.label)) : (_jsx(ForgePanelItem, { icon: item.icon, label: item.label, href: item.href, active: item.active }, item.href))) }) }));
     async function signOut() {
         setSigningOut(true);
         try {
@@ -76,7 +91,7 @@ function AccountPanel({ current, account, syncError, nav = [], accountDetails, g
             window.location.assign(signOutHref);
         }
     }
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-start gap-3 border-b p-4", children: [_jsx(ForgeAvatar, { account: account, className: "h-12 w-12 shrink-0 text-sm" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(Dialog.Title, { className: "truncate font-semibold", children: account ? account.username : 'Guest' }), _jsx(Dialog.Description, { asChild: true, children: _jsx("div", { className: "text-sm text-muted-foreground", children: account ? (_jsxs(_Fragment, { children: [account.supporterTier && (_jsx("span", { className: "mt-1 block", children: _jsx(ForgeSupporterBadge, { tier: account.supporterTier }) })), account.discordUsername && (_jsxs("span", { className: "mt-1 flex items-center gap-1 text-xs text-[#5865F2]", children: [_jsx(DiscordIcon, { className: "h-3 w-3 shrink-0" }), account.discordUsername] })), accountDetails] })) : (guestDetails ?? 'Your data lives only in this browser.') }) }), account && syncError && (_jsxs("p", { className: "mt-1 flex items-center gap-1 text-xs text-destructive", children: [_jsx(RefreshCw, { className: "h-3 w-3" }), " Not synced to your account"] }))] }), _jsx(Dialog.Close, { "aria-label": "Close", className: "rounded-md p-1 text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring", children: _jsx(X, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "flex-1 space-y-6 overflow-y-auto p-4", children: [_jsx(ForgePanelSection, { title: "Account", children: account ? (_jsxs(_Fragment, { children: [_jsx(ForgePanelItem, { icon: UserRound, label: "xForge account", description: "Profile, password and linked apps", href: accountUrl('/'), external: true }), accountActions, onBeforeSignOut ? (_jsx(ForgePanelItem, { icon: LogOut, label: signingOut ? 'Signing out…' : 'Sign out', onClick: signOut, disabled: signingOut, tone: "destructive" })) : (_jsx(ForgePanelItem, { icon: LogOut, label: "Sign out", href: signOutHref, external: true, tone: "destructive" }))] })) : (_jsxs(_Fragment, { children: [_jsx(ForgePanelItem, { icon: LogIn, label: "Sign in / Create account", description: "Keep your data safe and use it on any device", href: accountUrl('/login', { next }), external: true }), accountActions] })) }), nav.length > 0 && (_jsx("div", { className: "sm:hidden", children: _jsx(ForgePanelSection, { title: "Navigate", children: nav.map((item) => isNavGroup(item) ? (_jsx(PanelNavGroup, { group: item }, item.label)) : (_jsx(ForgePanelItem, { icon: item.icon, label: item.label, href: item.href, active: item.active }, item.href))) }) })), _jsx(AppearanceSection, {}), panel] })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-start gap-3 border-b p-4", children: [_jsx(ForgeAvatar, { account: account, className: "h-12 w-12 shrink-0 text-sm" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(Dialog.Title, { className: "truncate font-semibold", children: account ? account.username : 'Guest' }), _jsx(Dialog.Description, { asChild: true, children: _jsx("div", { className: "text-sm text-muted-foreground", children: account ? (_jsxs(_Fragment, { children: [account.supporterTier && (_jsx("span", { className: "mt-1 block", children: _jsx(ForgeSupporterBadge, { tier: account.supporterTier }) })), account.discordUsername && (_jsxs("span", { className: "mt-1 flex items-center gap-1 text-xs text-discord-text", children: [_jsx(DiscordIcon, { className: "h-3 w-3 shrink-0" }), account.discordUsername] })), accountDetails] })) : (guestDetails ?? 'Your data lives only in this browser.') }) }), account && syncError && (_jsxs("p", { className: "mt-1 flex items-center gap-1 text-xs text-destructive", children: [_jsx(RefreshCw, { className: "h-3 w-3" }), " Not synced to your account"] }))] }), _jsx(Dialog.Close, { "aria-label": "Close", className: "rounded-md p-1 text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring", children: _jsx(X, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "flex-1 space-y-6 overflow-y-auto p-4", children: [navFirst && navigate, _jsx(ForgePanelSection, { title: "Account", children: account ? (_jsxs(_Fragment, { children: [_jsx(ForgePanelItem, { icon: UserRound, label: "xForge account", description: "Email, password and Discord sign-in", href: accountUrl('/'), external: true }), accountActions, onBeforeSignOut ? (_jsx(ForgePanelItem, { icon: LogOut, label: signingOut ? 'Signing out…' : 'Sign out', onClick: signOut, disabled: signingOut, tone: "destructive" })) : (_jsx(ForgePanelItem, { icon: LogOut, label: "Sign out", href: signOutHref, external: true, tone: "destructive" }))] })) : (_jsxs(_Fragment, { children: [_jsx(ForgePanelItem, { icon: LogIn, label: "Sign in / Create account", description: "Keep your data safe and use it on any device", href: accountUrl('/login', { next }), external: true }), accountActions] })) }), !navFirst && navigate, _jsx(AppearanceSection, {}), panel] })] }));
 }
 /** A nav group in the mobile panel: its name as a small heading, then its links, a section title before each run. */
 function PanelNavGroup({ group }) {
@@ -86,7 +101,7 @@ function PanelNavGroup({ group }) {
                     // media, so it lines up with their icons instead.
                     _jsx("div", { className: `px-2 pb-0.5 pt-1.5 text-xs text-muted-foreground ${typeof section.title === 'string' ? 'pl-9' : ''}`, children: section.title })), _jsx("div", { className: section.rail ? 'ml-4 mr-2 space-y-1 border-l-2 pl-1' : 'space-y-1', children: section.items.map(({ href, label, icon, media, active }) => (_jsx(ForgePanelItem, { icon: icon, media: media, label: label, href: href, active: active, className: section.rail ? `relative ${active ? railMark : ''}` : '' }, href))) })] }, section.key ?? i)))] }));
 }
-/** Discord's mark in `currentColor`; give it Discord's blurple (`text-[#5865F2]`) next to a Discord name. */
+/** Discord's mark in `currentColor`; give it the `text-discord-text` token next to a Discord name. */
 export function DiscordIcon({ className }) {
     return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 640", className: className, fill: "currentColor", "aria-hidden": "true", children: _jsx("path", { d: "M524.5 133.8C524.3 133.5 524.1 133.2 523.7 133.1C485.6 115.6 445.3 103.1 404 96C403.6 95.9 403.2 96 402.9 96.1C402.6 96.2 402.3 96.5 402.1 96.9C396.6 106.8 391.6 117.1 387.2 127.5C342.6 120.7 297.3 120.7 252.8 127.5C248.3 117 243.3 106.8 237.7 96.9C237.5 96.6 237.2 96.3 236.9 96.1C236.6 95.9 236.2 95.9 235.8 95.9C194.5 103 154.2 115.5 116.1 133C115.8 133.1 115.5 133.4 115.3 133.7C39.1 247.5 18.2 358.6 28.4 468.2C28.4 468.5 28.5 468.7 28.6 469C28.7 469.3 28.9 469.4 29.1 469.6C73.5 502.5 123.1 527.6 175.9 543.8C176.3 543.9 176.7 543.9 177 543.8C177.3 543.7 177.7 543.4 177.9 543.1C189.2 527.7 199.3 511.3 207.9 494.3C208 494.1 208.1 493.8 208.1 493.5C208.1 493.2 208.1 493 208 492.7C207.9 492.4 207.8 492.2 207.6 492.1C207.4 492 207.2 491.8 206.9 491.7C191.1 485.6 175.7 478.3 161 469.8C160.7 469.6 160.5 469.4 160.3 469.2C160.1 469 160 468.6 160 468.3C160 468 160 467.7 160.2 467.4C160.4 467.1 160.5 466.9 160.8 466.7C163.9 464.4 167 462 169.9 459.6C170.2 459.4 170.5 459.2 170.8 459.2C171.1 459.2 171.5 459.2 171.8 459.3C268 503.2 372.2 503.2 467.3 459.3C467.6 459.2 468 459.1 468.3 459.1C468.6 459.1 469 459.3 469.2 459.5C472.1 461.9 475.2 464.4 478.3 466.7C478.5 466.9 478.7 467.1 478.9 467.4C479.1 467.7 479.1 468 479.1 468.3C479.1 468.6 479 468.9 478.8 469.2C478.6 469.5 478.4 469.7 478.2 469.8C463.5 478.4 448.2 485.7 432.3 491.6C432.1 491.7 431.8 491.8 431.6 492C431.4 492.2 431.3 492.4 431.2 492.7C431.1 493 431.1 493.2 431.1 493.5C431.1 493.8 431.2 494 431.3 494.3C440.1 511.3 450.1 527.6 461.3 543.1C461.5 543.4 461.9 543.7 462.2 543.8C462.5 543.9 463 543.9 463.3 543.8C516.2 527.6 565.9 502.5 610.4 469.6C610.6 469.4 610.8 469.2 610.9 469C611 468.8 611.1 468.5 611.1 468.2C623.4 341.4 590.6 231.3 524.2 133.7zM222.5 401.5C193.5 401.5 169.7 374.9 169.7 342.3C169.7 309.7 193.1 283.1 222.5 283.1C252.2 283.1 275.8 309.9 275.3 342.3C275.3 375 251.9 401.5 222.5 401.5zM417.9 401.5C388.9 401.5 365.1 374.9 365.1 342.3C365.1 309.7 388.5 283.1 417.9 283.1C447.6 283.1 471.2 309.9 470.7 342.3C470.7 375 447.5 401.5 417.9 401.5z" }) }));
 }

package/dist/guest-banner.js

@@ -17,7 +17,7 @@ export function GuestBanner({ appId, appName, signedIn, currentUrl }) {
     }, [appId]);
     if (signedIn === undefined || signedIn || !visible)
         return null;
-    return (_jsxs("div", { className: "flex items-center gap-3 border-b bg-muted px-4 py-2 text-sm text-muted-foreground", children: [_jsxs("p", { className: "flex-1", children: [_jsx("span", { className: "sm:hidden", children: "Guest mode: your data lives only in this browser." }), _jsxs("span", { className: "hidden sm:inline", children: ["You're using ", appName, " in guest mode \u2014 your data lives only in this browser. Create a free xForge account to keep it safe and use it on any device."] })] }), _jsx("a", { href: accountUrl('/register', { next }), className: "shrink-0 whitespace-nowrap rounded-md bg-primary px-3 py-1 font-medium text-primary-foreground hover:bg-primary/90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: "Create account" }), _jsx("a", { href: accountUrl('/login', { next }), className: "shrink-0 whitespace-nowrap font-medium text-primary hover:underline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: "Sign in" }), _jsx("button", { type: "button", "aria-label": "Dismiss", onClick: () => {
+    return (_jsxs("div", { className: "flex items-center gap-3 border-b bg-muted px-4 py-2 text-sm text-muted-foreground", children: [_jsxs("p", { className: "flex-1", children: [_jsx("span", { className: "sm:hidden", children: "Guest mode: your data lives only in this browser." }), _jsxs("span", { className: "hidden sm:inline", children: ["You're using ", appName, " in guest mode \u2014 your data lives only in this browser. Create a free xForge account to keep it safe and use it on any device."] })] }), _jsx("a", { href: accountUrl('/register', { next }), className: "shrink-0 whitespace-nowrap rounded-md bg-primary px-3 py-1 font-medium text-primary-foreground hover:bg-primary/90 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: "Create account" }), _jsx("a", { href: accountUrl('/login', { next }), className: "shrink-0 whitespace-nowrap font-medium text-primary-text hover:underline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: "Sign in" }), _jsx("button", { type: "button", "aria-label": "Dismiss", onClick: () => {
                     dismissBanner(appId);
                     setVisible(false);
                 }, className: "rounded-md p-1 hover:bg-accent hover:text-accent-foreground focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring", children: _jsx(X, { className: "h-4 w-4" }) })] }));

package/dist/ign-input.js

@@ -45,5 +45,5 @@ export function ForgeIgnInput({ value, onValueChange, history = [], onPick, onFo
                                                 // ß and ÿ have no single-letter capital in names, so they stay as they are.
                                                 const shown = upper && letter !== 'ß' && letter !== 'ÿ' ? letter.toUpperCase() : letter;
                                                 return (_jsx("button", { type: "button", onClick: () => insert(shown), className: "h-8 rounded-md border text-base hover:bg-accent hover:text-accent-foreground focus-visible:outline-2 focus-visible:outline-ring", children: shown }, letter));
-                                            }) })] }) })] })] }), recent.length > 0 && (_jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Recent:" }), recent.map((name) => (_jsxs("span", { className: "inline-flex items-center rounded-full border text-xs", children: [_jsx("button", { type: "button", onClick: () => onPick?.(name), className: `py-1 pl-2.5 hover:text-primary focus-visible:outline-2 focus-visible:outline-ring ${onForget ? 'rounded-l-full pr-1.5' : 'rounded-full pr-2.5'}`, title: `Use ${name}`, children: name }), onForget && (_jsx("button", { type: "button", onClick: () => onForget(name), "aria-label": `Remove ${name} from recent names`, className: "rounded-r-full py-1 pl-0.5 pr-2 text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring", children: _jsx(X, { className: "h-3 w-3" }) }))] }, name)))] }))] }));
+                                            }) })] }) })] })] }), recent.length > 0 && (_jsxs("div", { className: "flex flex-wrap items-center gap-1.5", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Recent:" }), recent.map((name) => (_jsxs("span", { className: "inline-flex items-center rounded-full border text-xs", children: [_jsx("button", { type: "button", onClick: () => onPick?.(name), className: `py-1 pl-2.5 hover:text-primary-text focus-visible:outline-2 focus-visible:outline-ring ${onForget ? 'rounded-l-full pr-1.5' : 'rounded-full pr-2.5'}`, title: `Use ${name}`, children: name }), onForget && (_jsx("button", { type: "button", onClick: () => onForget(name), "aria-label": `Remove ${name} from recent names`, className: "rounded-r-full py-1 pl-0.5 pr-2 text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring", children: _jsx(X, { className: "h-3 w-3" }) }))] }, name)))] }))] }));
 }

package/dist/jobs-snapshot.js

@@ -1,6 +1,6 @@
 export const JOBS_SNAPSHOT = {
     "version": 1,
-    "updated": "2026-11-10T20:30:00Z",
+    "updated": "2026-11-11T03:00:00Z",
     "jobs": [
         {
             "name": "Hero",
@@ -2600,7 +2600,9 @@ export const JOBS_SNAPSHOT = {
         },
         {
             "name": "Sia Astelle",
-            "aliases": [],
+            "aliases": [
+                "Sia Astra"
+            ],
             "branches": [
                 "magician"
             ],
@@ -2650,7 +2652,9 @@ export const JOBS_SNAPSHOT = {
         },
         {
             "name": "Ren",
-            "aliases": [],
+            "aliases": [
+                "Len"
+            ],
             "branches": [
                 "warrior"
             ],

package/dist/support-button.d.ts

@@ -2,25 +2,26 @@ import type { ReactNode } from 'react';
 export declare const BUY_ME_A_COFFEE_URL = "https://www.buymeacoffee.com/xtherebellion";
 /** The apps' CSP `img-src` must allow https://cdn.buymeacoffee.com for this to load. */
 export declare const BUY_ME_A_COFFEE_BUTTON = "https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png";
-/** Supporter badge tiers, shared by every xForge app. `id` matches `profiles.supporter_tier`. */
+/** Supporter badge tiers, shared by every xForge app. `id` matches `profiles.supporter_tier`. Colours are the
+ * per-mode `--supporter-*` tokens in tokens.css (fixed, never the accent). */
 export declare const FORGE_SPONSOR_TIERS: readonly [{
     readonly id: "gold";
     readonly Icon: import("lucide-react").LucideIcon;
     readonly label: "Gold Sponsor";
     readonly threshold: "$10+";
-    readonly className: "border-yellow-500/50 bg-yellow-500/10 text-yellow-500";
+    readonly className: "border-supporter-gold/50 bg-supporter-gold/10 text-supporter-gold";
 }, {
     readonly id: "platinum";
     readonly Icon: import("lucide-react").LucideIcon;
     readonly label: "Platinum Sponsor";
     readonly threshold: "$100+";
-    readonly className: "border-slate-300/60 bg-slate-300/10 text-slate-300";
+    readonly className: "border-supporter-platinum/60 bg-supporter-platinum/10 text-supporter-platinum";
 }, {
     readonly id: "diamond";
     readonly Icon: import("lucide-react").LucideIcon;
     readonly label: "Diamond Sponsor";
     readonly threshold: "$250+";
-    readonly className: "border-cyan-400/50 bg-cyan-400/10 text-cyan-400";
+    readonly className: "border-supporter-diamond/50 bg-supporter-diamond/10 text-supporter-diamond";
 }];
 export type ForgeSupporterTier = (typeof FORGE_SPONSOR_TIERS)[number]['id'];
 /** A supporter tier as a small pill, e.g. under a username. */

package/dist/support-button.js

@@ -5,28 +5,29 @@ import { Award, Gem, Heart, Star, X } from 'lucide-react';
 export const BUY_ME_A_COFFEE_URL = 'https://www.buymeacoffee.com/xtherebellion';
 /** The apps' CSP `img-src` must allow https://cdn.buymeacoffee.com for this to load. */
 export const BUY_ME_A_COFFEE_BUTTON = 'https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png';
-/** Supporter badge tiers, shared by every xForge app. `id` matches `profiles.supporter_tier`. */
+/** Supporter badge tiers, shared by every xForge app. `id` matches `profiles.supporter_tier`. Colours are the
+ * per-mode `--supporter-*` tokens in tokens.css (fixed, never the accent). */
 export const FORGE_SPONSOR_TIERS = [
     {
         id: 'gold',
         Icon: Star,
         label: 'Gold Sponsor',
         threshold: '$10+',
-        className: 'border-yellow-500/50 bg-yellow-500/10 text-yellow-500',
+        className: 'border-supporter-gold/50 bg-supporter-gold/10 text-supporter-gold',
     },
     {
         id: 'platinum',
         Icon: Award,
         label: 'Platinum Sponsor',
         threshold: '$100+',
-        className: 'border-slate-300/60 bg-slate-300/10 text-slate-300',
+        className: 'border-supporter-platinum/60 bg-supporter-platinum/10 text-supporter-platinum',
     },
     {
         id: 'diamond',
         Icon: Gem,
         label: 'Diamond Sponsor',
         threshold: '$250+',
-        className: 'border-cyan-400/50 bg-cyan-400/10 text-cyan-400',
+        className: 'border-supporter-diamond/50 bg-supporter-diamond/10 text-supporter-diamond',
     },
 ];
 /** A supporter tier as a small pill, e.g. under a username. */

package/dist/tokens.css

@@ -56,6 +56,10 @@
   --color-divider: var(--divider);
   --color-chip: var(--chip);
   --color-track: var(--track);
+  --color-supporter-gold: var(--supporter-gold);
+  --color-supporter-platinum: var(--supporter-platinum);
+  --color-supporter-diamond: var(--supporter-diamond);
+  --color-discord-text: var(--discord-text);
 
   --radius-lg: var(--radius);
   --radius-md: calc(var(--radius) - 2px);
@@ -93,6 +97,12 @@
   --divider: hsl(0 0% 92%);
   --chip: hsl(0 0% 93%);
   --track: hsl(0 0% 89.8%);
+  /* Fixed colours that keep their meaning whatever the accent: supporter tiers (ForgeSupporterBadge) and the
+     Discord name. Text at 4.5:1 on --background and --card in each mode, also over the tier's own 10% fill. */
+  --supporter-gold: hsl(40 96% 27%);
+  --supporter-platinum: hsl(215 19% 35%);
+  --supporter-diamond: hsl(192 82% 29%);
+  --discord-text: hsl(235 75% 57%);
   --radius: 0.5rem;
   /* Explicit Tailwind v4 utility vars (ensures runtime overrides work) */
   --color-primary: hsl(38 100% 65%);
@@ -126,6 +136,10 @@
   --divider: hsl(0 0% 17%);
   --chip: hsl(0 0% 19%);
   --track: hsl(0 0% 18%);
+  --supporter-gold: hsl(45 93% 47%);
+  --supporter-platinum: hsl(213 27% 84%);
+  --supporter-diamond: hsl(188 86% 53%);
+  --discord-text: hsl(235 86% 75%);
   --color-primary: hsl(38 100% 65%);
   --color-primary-foreground: hsl(38 100% 10%);
   --color-ring: hsl(38 100% 65%);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xforge-dev/forge-kit",
-  "version": "0.24.3",
+  "version": "0.25.0",
   "description": "Shared auth, app registry and UI for xForge apps",
   "license": "MIT",
   "repository": {