@nano133/nanoterra 0.9.0 → 0.9.3

package/dist/shop/panel/words.d.ts

@@ -0,0 +1,89 @@
+import type { Hat } from "../../looks/look.js";
+export type ShopWords = {
+    /** The sheet's title, the Looks key's word and the sheet's name for a screen reader. The option `title` wins over it. */
+    title: string;
+    /** The close key's name for a screen reader. */
+    close: string;
+    /** The tabs' name for a screen reader. */
+    kinds: string;
+    /** The outfits' tab. */
+    outfits: string;
+    /** The tab of a wear slot of the game's own ("shovel"). The option `slots` wins over it. */
+    slotTab: (slot: string) => string;
+    /** The plain choice of a wear slot ("No shovel"). The option `slots` wins over it. */
+    slotPlain: (slot: string) => string;
+    /** The line under an outfit: what it changes (its hat, or the colour only). */
+    outfitLine: (hat: Hat | null) => string;
+    /** The line under an item of a wear slot. */
+    itemLine: (slot: string) => string;
+    /** Added to the line of a free look, and the plain choice's line. */
+    free: string;
+    /** Added to the line of a look the player owns. */
+    yours: string;
+    wear: string;
+    wearing: string;
+    /** The Buy key, with the look's price ("$0.25"). */
+    buy: (price: string) => string;
+    /** Under the list. */
+    looksNote: string;
+    /** Under the list and at Buy, while nobody is signed in. */
+    signInFirst: string;
+    /** The title of Buy and of the pay sheet. */
+    buyTitle: (look: string) => string;
+    making: string;
+    /** An order that did not start, with no words from the server. */
+    orderFailed: string;
+    /** The words of a refusal: the server's own (`text`, in English) and its HTTP status (0: no answer). Default: the server's words. */
+    refusal: (text: string, status: number) => string;
+    /** The key back to the looks. */
+    back: string;
+    /** The key that signs in again after "Sign in first." (401). */
+    signIn: string;
+    /** The line under the title. */
+    lookLine: (look: string) => string;
+    /** The amount in XNO, large ("0.25 XNO"). */
+    amount: (xno: string) => string;
+    /** The amount in dollars, beside it ("= $0.25"). */
+    usd: (usd: string) => string;
+    /** Above the amount, live only: the player must send this exact amount. */
+    sendExactly: string;
+    /** Under the stamp in test mode: nothing can be paid here. */
+    testNote: string;
+    /** The wallet key in test mode, off, with its reason. */
+    walletOff: string;
+    /** The wallet key (live). */
+    wallet: string;
+    /** The QR code's name for a screen reader. */
+    qrLabel: (xno: string) => string;
+    /** The fold with the amount and the address to type by hand. */
+    byHand: string;
+    amountLabel: string;
+    /** The address's label in the fold. */
+    toLabel: string;
+    /** In the fold: another amount does not match the order. */
+    byHandNote: string;
+    copy: string;
+    copied: string;
+    copyFailed: string;
+    /** The time left (live only): the order ends then. */
+    endsIn: (time: string) => string;
+    waiting: string;
+    noConnection: string;
+    stillWaiting: string;
+    checkAgain: string;
+    paid: string;
+    paidLine: (look: string) => string;
+    /** A payment after the order ended: it gives no look, and the creator sends it back. */
+    paidLate: string;
+    /** The order ended: a payment sent in time still counts. */
+    expired: string;
+    /** The price's sources ("CoinGecko", "Kraken", "KuCoin"). "Powered by CoinGecko" is added when CoinGecko is one and the words leave it out. */
+    prices: (sources: readonly string[]) => string;
+};
+/** CoinGecko's words: its API terms ask for them wherever its price shows. */
+export declare const COINGECKO_CREDIT = "Powered by CoinGecko";
+export declare const SHOP_WORDS: ShopWords;
+/** The game's words over the defaults. A key the game leaves out, or gives as undefined, keeps its default. */
+export declare function shopWords(over?: Partial<ShopWords>): ShopWords;
+/** The price's line: the game's words, with "Powered by CoinGecko" added when CoinGecko is a source and the words leave it out. */
+export declare function priceLine(words: ShopWords, sources: readonly string[]): string;

package/dist/shop/panel/words.js

@@ -0,0 +1,79 @@
+// Every word that the shop's sheets show: the looks sheet, Buy and the pay sheet. A game gives `words` to `mountShop` (or to `looksView` and `payPanel`)
+// with the keys it wants to change, in its own words or language; the rest stay these. A text with a value in it is a function of that value.
+//
+// Two things a game cannot change, because a player's money depends on them: the stamp "TEST MODE: DO NOT PAY" (it is not a key), and the words
+// "Powered by CoinGecko" while CoinGecko is one of the price feeds (CoinGecko's API terms ask for them: `priceLine` adds them when `prices` leaves
+// them out).
+//
+// The defaults are short on purpose (Wes, 2026-11-01: fewer words): the pay sheet shows at most 30 words, and no sentence has more than 10.
+const HATS = { cap: "with a cap", beanie: "with a beanie", crown: "with a crown", tophat: "with a top hat" };
+const spaced = (slot) => slot.replace(/-/g, " ");
+/** CoinGecko's words: its API terms ask for them wherever its price shows. */
+export const COINGECKO_CREDIT = "Powered by CoinGecko";
+export const SHOP_WORDS = {
+    title: "Looks",
+    close: "Close",
+    kinds: "Kinds of looks",
+    outfits: "Outfits",
+    slotTab: (slot) => spaced(slot.charAt(0).toUpperCase() + slot.slice(1)),
+    slotPlain: (slot) => `No ${spaced(slot)}`,
+    outfitLine: (hat) => (hat ? HATS[hat] : "colour only"),
+    itemLine: (slot) => spaced(slot),
+    free: "free",
+    yours: "yours",
+    wear: "Wear",
+    wearing: "Wearing",
+    buy: (price) => `Buy ${price}`,
+    looksNote: "Looks never change play. Pay in Nano, straight to the creator.",
+    signInFirst: "Sign in first to buy a look.",
+    buyTitle: (look) => `Buy ${look}`,
+    making: "Making your order…",
+    orderFailed: "The order did not start. Try again.",
+    refusal: (text) => text,
+    back: "Back",
+    signIn: "Sign in",
+    lookLine: () => "It never changes play.",
+    amount: (xno) => `${xno} XNO`,
+    usd: (usd) => `= ${usd}`,
+    sendExactly: "Send exactly",
+    testNote: "Nothing can be paid here.",
+    walletOff: "Wallet off: test mode",
+    wallet: "Open wallet",
+    qrLabel: (xno) => `QR code to pay ${xno} XNO`,
+    byHand: "Enter by hand",
+    amountLabel: "Amount",
+    toLabel: "To",
+    byHandNote: "Another amount does not match.",
+    copy: "Copy",
+    copied: "Copied",
+    copyFailed: "Copy failed",
+    endsIn: (time) => `Ends in ${time}.`,
+    waiting: "Waiting for payment…",
+    noConnection: "No connection. Trying again…",
+    stillWaiting: "Still waiting. Already paid? Press Check again.",
+    checkAgain: "Check again",
+    paid: "Paid. Thank you!",
+    paidLine: (look) => `${look} is yours.`,
+    paidLate: "Paid after the order ended, so no look. The creator sends it back.",
+    expired: "This order ended. Paid in time? Wait here: it still counts.",
+    prices: (sources) => {
+        const others = sources.filter((s) => s !== "CoinGecko");
+        const credit = sources.includes("CoinGecko") ? ` ${COINGECKO_CREDIT}.` : "";
+        return others.length ? `Price: ${others.join(", ")}.${credit}` : credit.trim();
+    },
+};
+/** The game's words over the defaults. A key the game leaves out, or gives as undefined, keeps its default. */
+export function shopWords(over) {
+    const out = { ...SHOP_WORDS };
+    for (const [k, v] of Object.entries(over ?? {}))
+        if (v !== undefined && k in SHOP_WORDS)
+            out[k] = v;
+    return out;
+}
+/** The price's line: the game's words, with "Powered by CoinGecko" added when CoinGecko is a source and the words leave it out. */
+export function priceLine(words, sources) {
+    const line = words.prices(sources).trim();
+    if (!sources.includes("CoinGecko") || line.includes(COINGECKO_CREDIT))
+        return line;
+    return `${line}${line ? " " : ""}${COINGECKO_CREDIT}.`;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nano133/nanoterra",
-  "version": "0.9.0",
+  "version": "0.9.3",
   "description": "Nanoterra for a creator's game, in one package: the player's sign-in ticket, the player's character (a toon body on the island's skeleton), the looks ladder, the admin, the friends list, an options menu, emotes, the player's sign-in (a passkey or a wallet app) and a shop that sells looks for Nano with no key on the server.",
   "type": "module",
   "main": "dist/index.js",

package/src/player-signin/panel/index.ts

@@ -1,12 +1,13 @@
 // "@nano133/nanoterra/player-signin/panel": the player's sign-in sheet in the browser. `mountPlayerSignin` is the sheet (call `open()`);
-// `signInView` is its content, for a game that has a sheet of its own. Add "@nano133/nanoterra/player-signin/style.css" to the page.
+// `signInView` is its content, for a game that has a sheet of its own. Add "@nano133/nanoterra/player-signin/style.css" to the page. Every word of
+// the sheet can be the game's own: `words` (PlayerSigninWords; PLAYER_SIGNIN_WORDS are the defaults).
 
 export { mountPlayerSignin } from "./mount.js";
 export type { MountedPlayerSignin, PlayerSigninMountOptions } from "./mount.js";
 export { hostFits, passkeyName, signInView } from "./view.js";
 export { PASSKEY_PREVIEW_NOTE, previewHost } from "../host.js";
 export type { PlayerSigninView, PlayerSigninViewOptions, SignedIn } from "./view.js";
-export { faultWords } from "./words.js";
-export type { FaultWords } from "./words.js";
+export { PLAYER_SIGNIN_WORDS, faultWords, playerSigninWords } from "./words.js";
+export type { FaultText, FaultWords, PlayerSigninWords, PlayerSigninWordsOption } from "./words.js";
 export { readMemo } from "./memo.js";
 export type { SigninMemo } from "./memo.js";

package/src/player-signin/panel/mount.ts

@@ -1,14 +1,15 @@
 // The sign-in sheet of a game: `mountPlayerSignin(element, options)`. It draws no key of its own: the game's account key, the shop's "sign in
 // first" and anything else call `open()`, which resolves with the player once they are signed in, or null when the sheet closes. Plain DOM; a
 // modal sheet with a scrim: from the bottom on a phone held upright, in the middle on a wide or sideways screen. Escape, the close key and a press
-// on the scrim close it. Every key is 44 px or more.
+// on the scrim close it. Phone first: text 16 px, every key 48 px or more each way.
 
 import { h, releaseFocus } from "../../admin/panel/dom.js";
 import { icon } from "../../admin/panel/icons.js";
 import { signInView, type PlayerSigninViewOptions, type SignedIn } from "./view.js";
+import { playerSigninWords } from "./words.js";
 
 export type PlayerSigninMountOptions = PlayerSigninViewOptions & {
-  /** The sheet's title. Default "Sign in". */
+  /** The sheet's title. Default: `words.title` ("Sign in"). */
   title?: string;
   /** How long "Signed in as …" shows before the sheet closes, in ms. Default 900. */
   closeAfterMs?: number;
@@ -36,6 +37,7 @@ export function mountPlayerSignin(root: HTMLElement, options: PlayerSigninMountO
   let pending: { promise: Promise<SignedIn | null>; resolve: (p: SignedIn | null) => void } | null = null;
   let before: Element | null = null;
   let closing: ReturnType<typeof setTimeout> | undefined;
+  const words = playerSigninWords(options.words);
 
   const settle = (p: SignedIn | null) => {
     const was = pending;
@@ -52,8 +54,8 @@ export function mountPlayerSignin(root: HTMLElement, options: PlayerSigninMountO
     },
   });
 
-  const titleEl = h("h2", { class: "n133s-title", id: `n133s-title-${n}` }, options.title ?? "Sign in");
-  const closeKey = h("button", { class: "n133s-close", type: "button", "aria-label": "Close" }, icon("close", 20));
+  const titleEl = h("h2", { class: "n133s-title", id: `n133s-title-${n}` }, options.title ?? words.title);
+  const closeKey = h("button", { class: "n133s-close", type: "button", "aria-label": words.close }, icon("close", 20));
   const scrim = h("div", { class: "n133s-scrim" });
   const panel = h("section", { class: "n133s-panel", role: "dialog", "aria-modal": "true", "aria-labelledby": `n133s-title-${n}` }, h("header", { class: "n133s-head" }, titleEl, closeKey), h("div", { class: "n133s-body" }, view.node));
   const wrap = h("div", { class: "n133-signin n133s-sheet", "data-open": "false" }, scrim, panel);

package/src/player-signin/panel/style.css

@@ -1,6 +1,6 @@
 /* The player's sign-in sheet (mountPlayerSignin in ./mount.ts) and its content (signInView in ./view.ts). Every rule is under .n133-signin, so nothing
    leaks into the game's page.
-   Phone first: every key is 44 px or more and its words 16 px. On a phone held upright the sheet comes from the bottom; on a wide or sideways screen it
+   Phone first: text is 16 px, and every key, tile, link, close key and back key is 48 px or more each way. On a phone held upright the sheet comes from the bottom; on a wide or sideways screen it
    is a card in the middle. A scrim covers the game while it is open.
    Light and dark: the sheet follows data-n133-theme="light" | "dark" on the page's <html> when the page sets it, else the device's prefers-color-scheme.
    To theme it, set the --n133-* custom properties on the element that holds the sheet (or a parent): --n133-ink, --n133-ink-soft, --n133-paper,
@@ -129,8 +129,8 @@
 .n133-signin .n133s-close {
   display: inline-grid;
   place-items: center;
-  width: 44px;
-  height: 44px;
+  width: 48px;
+  height: 48px;
   border: 0;
   border-radius: 50%;
   background: transparent;
@@ -170,12 +170,12 @@
 
 .n133-signin .n133s-fine {
   margin: 0;
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .n133-signin .n133s-or {
   margin: 6px 0 -4px;
-  font: 650 14px/1.3 var(--font);
+  font: 650 16px/1.3 var(--font);
 }
 
 .n133-signin .n133s-step {
@@ -251,7 +251,7 @@
 }
 
 .n133-signin .n133s-pk-words small {
-  font-size: 14px;
+  font-size: 16px;
   opacity: 0.92;
 }
 
@@ -292,26 +292,26 @@
   border-radius: 12px;
   background: var(--ground);
   color: var(--ink);
-  font: 800 15px/1 var(--font);
+  font: 800 16px/1 var(--font);
 }
 
 .n133-signin .n133s-name {
-  font: 650 15px/1.2 var(--font);
+  font: 650 16px/1.2 var(--font);
   text-align: center;
 }
 
 .n133-signin .n133s-last {
-  position: absolute;
-  top: 6px;
-  right: 8px;
-  padding: 1px 7px;
+  padding: 0 8px;
   border-radius: 999px;
   background: var(--ground);
   color: var(--ink-soft);
-  font: 700 11px/18px var(--font);
+  font: 700 16px/24px var(--font);
+  white-space: nowrap;
 }
 
+/* "Last used": in the flow, so it never covers a word at 16 px: under the name in a tile, at the right end of the passkey's row. */
 .n133-signin .n133s-pk .n133s-last {
+  margin-left: auto;
   background: rgb(255 255 255 / 0.22);
   color: inherit;
 }
@@ -376,14 +376,15 @@
   align-self: flex-start;
   align-items: center;
   gap: 6px;
-  min-height: 44px;
+  min-width: 48px;
+  min-height: 48px;
   margin: 0 0 -4px -10px;
-  padding: 0 10px;
+  padding: 0 12px 0 10px;
   border: 0;
   border-radius: 10px;
   background: transparent;
   color: var(--ink-soft);
-  font: 650 15px/1 var(--font);
+  font: 650 16px/1 var(--font);
   cursor: pointer;
 }
 
@@ -393,6 +394,10 @@
 }
 
 .n133-signin a:not(.n133s-btn) {
+  display: inline-flex;
+  align-items: center;
+  min-width: 48px;
+  min-height: 48px;
   color: var(--gem-dark);
   font-weight: 650;
   text-underline-offset: 2px;
@@ -443,7 +448,7 @@
   min-height: 1.4em;
   margin: 12px 0 0;
   color: var(--ink-soft);
-  font-size: 15px;
+  font-size: 16px;
 }
 
 .n133-signin .n133s-status:empty {