@energy8platform/shell 0.3.0 → 0.4.1

package/dist/html.d.ts

@@ -471,7 +471,7 @@ declare class ShellController extends EventEmitter<ShellEvents> implements Shell
     tokens: ShellTokens;
     layout: ShellLayoutMode;
     soundOn: boolean;
-    readonly engineVersion = "0.3.0";
+    readonly engineVersion = "0.4.1";
     readonly actions: ShellActions;
     private renderer;
     private i18n;
@@ -537,7 +537,7 @@ interface I18n {
 declare function createI18n(opts: I18nOptions): I18n;
 
 /** The @energy8platform/shell package version, stamped into the game-info footer. */
-declare const PACKAGE_VERSION = "0.3.0";
+declare const PACKAGE_VERSION = "0.4.1";
 
 /** A shell: the renderer-agnostic controller plus the surface facade (safeArea/barHeight/setVisible)
  *  an embedding host reads. `createShell`, `createGameShell` and `createPixiShell` all return this. */

package/dist/html.esm.js

@@ -1165,8 +1165,31 @@ const DISCLAIMER_LOCALES = {
         [D.L5]: '奖金根据从 Remote Game Server 收到的金额结算，而非依据网页浏览器内的事件。',
     },
 };
-/** Merge the base UI catalog with the separately-authored disclaimer lines, per language. */
-const LOCALES = Object.fromEntries(Object.keys(BASE_LOCALES).map((l) => [l, { ...BASE_LOCALES[l], ...DISCLAIMER_LOCALES[l] }]));
+// ── Replay summary labels ──────────────────────────────────────────────────────────────────────
+// The replay modal (html + pixi) renders these row labels via host.t(); grouped here (merged into
+// LOCALES below) so the whole replay screen localizes. Terminology matches the base Bet/Win keys.
+const REPLAY_LOCALES = {
+    da: { Mode: 'Tilstand', 'Base bet': 'Grundindsats', 'Cost multiplier': 'Omkostningsmultiplikator', 'Total cost': 'Samlede omkostninger', 'Win multiplier': 'Gevinstmultiplikator' },
+    de: { Mode: 'Modus', 'Base bet': 'Grundeinsatz', 'Cost multiplier': 'Kostenmultiplikator', 'Total cost': 'Gesamtkosten', 'Win multiplier': 'Gewinnmultiplikator' },
+    es: { Mode: 'Modo', 'Base bet': 'Apuesta base', 'Cost multiplier': 'Multiplicador de coste', 'Total cost': 'Coste total', 'Win multiplier': 'Multiplicador de premio' },
+    fi: { Mode: 'Tila', 'Base bet': 'Peruspanos', 'Cost multiplier': 'Kustannuskerroin', 'Total cost': 'Kokonaiskustannus', 'Win multiplier': 'Voittokerroin' },
+    fr: { Mode: 'Mode', 'Base bet': 'Mise de base', 'Cost multiplier': 'Multiplicateur de coût', 'Total cost': 'Coût total', 'Win multiplier': 'Multiplicateur de gain' },
+    hi: { Mode: 'मोड', 'Base bet': 'आधार दांव', 'Cost multiplier': 'लागत गुणक', 'Total cost': 'कुल लागत', 'Win multiplier': 'जीत गुणक' },
+    id: { Mode: 'Mode', 'Base bet': 'Taruhan dasar', 'Cost multiplier': 'Pengganda biaya', 'Total cost': 'Total biaya', 'Win multiplier': 'Pengganda kemenangan' },
+    ja: { Mode: 'モード', 'Base bet': '基本ベット', 'Cost multiplier': 'コスト倍率', 'Total cost': '合計コスト', 'Win multiplier': '当選倍率' },
+    ko: { Mode: '모드', 'Base bet': '기본 베팅', 'Cost multiplier': '비용 배수', 'Total cost': '총 비용', 'Win multiplier': '당첨 배수' },
+    pl: { Mode: 'Tryb', 'Base bet': 'Zakład podstawowy', 'Cost multiplier': 'Mnożnik kosztu', 'Total cost': 'Całkowity koszt', 'Win multiplier': 'Mnożnik wygranej' },
+    pt: { Mode: 'Modo', 'Base bet': 'Aposta base', 'Cost multiplier': 'Multiplicador de custo', 'Total cost': 'Custo total', 'Win multiplier': 'Multiplicador de ganho' },
+    ru: { Mode: 'Режим', 'Base bet': 'Базовая ставка', 'Cost multiplier': 'Множитель стоимости', 'Total cost': 'Общая стоимость', 'Win multiplier': 'Множитель выигрыша' },
+    tr: { Mode: 'Mod', 'Base bet': 'Temel bahis', 'Cost multiplier': 'Maliyet çarpanı', 'Total cost': 'Toplam maliyet', 'Win multiplier': 'Kazanç çarpanı' },
+    vi: { Mode: 'Chế độ', 'Base bet': 'Cược cơ bản', 'Cost multiplier': 'Hệ số chi phí', 'Total cost': 'Tổng chi phí', 'Win multiplier': 'Hệ số thắng' },
+    zh: { Mode: '模式', 'Base bet': '基础投注', 'Cost multiplier': '成本倍数', 'Total cost': '总成本', 'Win multiplier': '奖金倍数' },
+};
+/** Merge the base UI catalog with the separately-authored disclaimer + replay lines, per language. */
+const LOCALES = Object.fromEntries(Object.keys(BASE_LOCALES).map((l) => [
+    l,
+    { ...BASE_LOCALES[l], ...DISCLAIMER_LOCALES[l], ...REPLAY_LOCALES[l] },
+]));
 
 // Social-casino language. English is the source (and, for now, the only) language; `socialize`
 // rewrites the restricted gambling vocabulary into social-safe phrasing while preserving case.
@@ -1413,7 +1436,7 @@ class KeyboardController {
 
 // AUTO-GENERATED by scripts/gen-version.mjs — do not edit. Mirrors package.json "version".
 /** The @energy8platform/shell package version, stamped into the game-info footer. */
-const PACKAGE_VERSION = '0.3.0';
+const PACKAGE_VERSION = '0.4.1';
 
 /** Apply defaults to the raw config (the mount target lives on the renderer, not here). */
 function resolveConfig(config) {
@@ -1887,7 +1910,12 @@ const SHELL_CSS = SHELL_FONT_CSS + SHELL_DIGIT_FONT_CSS + `
 #${SHELL_ROOT_ID} .ge-gi-hk-block { display:flex; flex-direction:column; }
 #${SHELL_ROOT_ID} .ge-gi-hk { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; }
 #${SHELL_ROOT_ID} .ge-gi-hk + .ge-gi-hk { border-top:1px solid var(--shell-plaque-line); }
-#${SHELL_ROOT_ID} .ge-gi-hk-chips { display:flex; align-items:center; flex-wrap:wrap; gap:4px; flex:0 0 auto; }
+/* Let the keycaps SHRINK instead of hogging the row: flex:0 1 auto lets the chips block give up
+   width down to its widest single combo, and flex-wrap reflows the extra combos onto another line.
+   On narrow/mobile widths the many-chip rows (Raise/Lower bet) otherwise squeeze the label off the
+   right edge and clip it. (No min-width:0 here — the min-content floor is what keeps a combo intact
+   and wrapping rather than overflowing.) */
+#${SHELL_ROOT_ID} .ge-gi-hk-chips { display:flex; align-items:center; flex-wrap:wrap; gap:4px; flex:0 1 auto; }
 #${SHELL_ROOT_ID} .ge-gi-hk-combo { display:inline-flex; align-items:center; gap:4px; }
 #${SHELL_ROOT_ID} .ge-gi-hk-chip { display:inline-flex; align-items:center; justify-content:center;
   padding:2px 7px; border-radius:6px; border:1px solid var(--shell-plaque-line);
@@ -1896,7 +1924,10 @@ const SHELL_CSS = SHELL_FONT_CSS + SHELL_DIGIT_FONT_CSS + `
   font-weight:600; line-height:1.5; white-space:nowrap; min-width:1.6em; text-align:center; }
 #${SHELL_ROOT_ID} .ge-gi-hk-sep { color:var(--shell-plaque-label); font-size:11px; padding:0 1px; }
 #${SHELL_ROOT_ID} .ge-gi-hk-sep2 { color:var(--shell-plaque-label); font-size:11px; padding:0 4px; }
-#${SHELL_ROOT_ID} .ge-gi-hk-tx { color:rgba(255,255,255,.88); font-size:14px; font-weight:600; text-align:right; flex:1; }
+/* flex:1 1 auto (content-based basis, NOT flex:1's 0 basis) so the label keeps demanding its word
+   width and shrinks in PROPORTION to the chips — both give ground and wrap, instead of the label
+   collapsing to nothing. No min-width:0: the min-content floor stops a word being clipped. */
+#${SHELL_ROOT_ID} .ge-gi-hk-tx { color:rgba(255,255,255,.88); font-size:14px; font-weight:600; text-align:right; flex:1 1 auto; }
 
 /* controls — two blocks (gameplay / menu & info), icon/name/description per control */
 #${SHELL_ROOT_ID} .ge-gi-ctl-block + .ge-gi-ctl-block { margin-top:16px; padding-top:4px; border-top:1px solid var(--shell-plaque-line); }
@@ -1910,7 +1941,7 @@ const SHELL_CSS = SHELL_FONT_CSS + SHELL_DIGIT_FONT_CSS + `
 #${SHELL_ROOT_ID} .ge-gi-ctl-ic--bet { flex-direction:column; font-size:18px; gap:0; }
 /* buy bonus draws the real control-bar badge, scaled down & non-interactive */
 #${SHELL_ROOT_ID} .ge-gi-ctl-ic .ge-shell-buybonus { width:46px; height:46px; font-size:8px; border-width:2px; pointer-events:none; }
-#${SHELL_ROOT_ID} .ge-gi-ctl-tx { display:flex; flex-direction:column; gap:2px; }
+#${SHELL_ROOT_ID} .ge-gi-ctl-tx { display:flex; flex-direction:column; gap:2px; min-width:0; }
 #${SHELL_ROOT_ID} .ge-gi-ctl-tx b { color:#fff; font-size:15px; font-weight:700; }
 #${SHELL_ROOT_ID} .ge-gi-ctl-tx span { color:rgba(255,255,255,.7); font-size:13px; line-height:1.4; }
 
@@ -2197,6 +2228,14 @@ const SHELL_CSS = SHELL_FONT_CSS + SHELL_DIGIT_FONT_CSS + `
 #${SHELL_ROOT_ID}.ge-mobile .ge-sheet-grid { grid-template-columns:repeat(var(--cols-m,var(--cols,3)),1fr); }
 /* the bet picker packs 6 chips/row → give its card room (autoplay & co. stay at the 28em default) */
 #${SHELL_ROOT_ID} .ge-sheet[data-ge="bet-modal"] .ge-modal-card { max-width:44em; }
+/* Bet chips carry variable-width currency (a wide currency makes labels grow). Reflow the columns
+   to the widest label (--chip-min, computed in JS) so no chip is ever clipped, and cap the grid
+   height so a long bet ladder scrolls instead of overflowing the card's clipped edge. */
+#${SHELL_ROOT_ID} .ge-sheet[data-ge="bet-modal"] .ge-sheet-grid,
+#${SHELL_ROOT_ID}.ge-mobile .ge-sheet[data-ge="bet-modal"] .ge-sheet-grid {
+  grid-template-columns:repeat(auto-fill, minmax(min(100%, var(--chip-min, 6em)), 1fr));
+  max-height:min(50vh, 28em); overflow-y:auto; overflow-x:hidden; }
+#${SHELL_ROOT_ID} .ge-sheet[data-ge="bet-modal"] .ge-chip { min-width:0; }
 #${SHELL_ROOT_ID} .ge-chip { pointer-events:auto; cursor:pointer; border:1px solid var(--shell-plaque-line);
   border-radius:.8em; background:rgba(255,255,255,.04); color:#fff; font-size:1em; font-weight:700;
   font-variant-numeric:tabular-nums; padding:.8em .55em; transition:background .12s ease, border-color .12s ease; }
@@ -3447,6 +3486,15 @@ function buildSheet(opts) {
     const cols = typeof opts.columns === 'number' ? { wide: opts.columns, mobile: opts.columns } : opts.columns;
     grid.style.setProperty('--cols', String(cols.wide));
     grid.style.setProperty('--cols-m', String(cols.mobile));
+    if (opts.autoFit) {
+        // Widest label in ch (tabular digits ≈ 1ch each; symbols/separators are narrower, so this
+        // slightly over-estimates → safe) + chip padding/border. Floored so normal-width currencies
+        // keep the compact ~6-per-row look and only wide currencies drop to fewer columns.
+        const maxLen = opts.choices.reduce((m, c) => Math.max(m, c.label.length), 0);
+        // Floor at 6em ≈ the natural width of a chip in the 6-wide layout (44em card): short labels
+        // clamp here so a normal currency keeps 6 columns; wider labels raise it and drop to fewer.
+        grid.style.setProperty('--chip-min', `max(6em, calc(${maxLen}ch + 1.4em))`);
+    }
     let selected = opts.selected;
     let focusIndex = opts.choices.findIndex((c) => c.id === selected);
     if (focusIndex < 0)
@@ -3518,7 +3566,7 @@ function buildSheet(opts) {
 /** Bet picker — all available bets as chips (6 per row, 3 on mobile), accent Confirm applies it. */
 function openBetModal(host) {
     return buildSheet({
-        ge: 'bet-modal', title: host.t('Bet'), columns: { wide: 6, mobile: 3 }, confirmLabel: host.t('Confirm'),
+        ge: 'bet-modal', title: host.t('Bet'), columns: { wide: 6, mobile: 3 }, autoFit: true, confirmLabel: host.t('Confirm'),
         choices: host.state.availableBets.map((b) => ({ id: String(b), label: host.formatCurrency(b) })),
         selected: String(host.state.bet),
         onClose: () => host.actions.closeOverlay(),