@wix/himalaya-cli 0.1020.0 → 0.1021.0

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/_types/core/ts/src/preview-surfaces.d.ts

@@ -208,6 +208,13 @@ export interface PreviewSurface {
      * phone and tablet are always offered.
      */
     readonly platformKey: string | null;
+    /**
+     * RFC 0059 / #2927 — the native builds that draw this surface, which is what a null
+     * `platformKey` leaves implicit. The web host offers each one's idiom as a preview
+     * (`IDIOM_CONTEXTS`: `ios` wears `ios`, `android` wears `material`), and side by side.
+     * Absent ⇒ none: the surface previews in its own look only.
+     */
+    readonly idiomPlatforms?: readonly ("ios" | "android")[];
     readonly gate: SurfaceGate;
 }
 /**

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/core.mjs

@@ -9232,7 +9232,8 @@ var PREVIEW_SURFACES = [
     // iPhone 14/15 logical points
     orientations: ["portrait"],
     platformKey: null,
-    // iOS/Android are implicit
+    // iOS/Android are implicit — named explicitly in idiomPlatforms
+    idiomPlatforms: ["ios", "android"],
     gate: { kind: "none" }
   },
   {
@@ -9247,6 +9248,7 @@ var PREVIEW_SURFACES = [
     // iPad Pro 11" logical points
     orientations: ["portrait", "landscape"],
     platformKey: null,
+    idiomPlatforms: ["ios", "android"],
     gate: { kind: "none" }
   },
   {

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/sdui.mjs

@@ -7661,7 +7661,8 @@ var PREVIEW_SURFACES = [
     // iPhone 14/15 logical points
     orientations: ["portrait"],
     platformKey: null,
-    // iOS/Android are implicit
+    // iOS/Android are implicit — named explicitly in idiomPlatforms
+    idiomPlatforms: ["ios", "android"],
     gate: { kind: "none" }
   },
   {
@@ -7676,6 +7677,7 @@ var PREVIEW_SURFACES = [
     // iPad Pro 11" logical points
     orientations: ["portrait", "landscape"],
     platformKey: null,
+    idiomPlatforms: ["ios", "android"],
     gate: { kind: "none" }
   },
   {

package/dist/cli.mjs

@@ -2127,7 +2127,8 @@ var init_preview_surfaces = __esm({
         // iPhone 14/15 logical points
         orientations: ["portrait"],
         platformKey: null,
-        // iOS/Android are implicit
+        // iOS/Android are implicit — named explicitly in idiomPlatforms
+        idiomPlatforms: ["ios", "android"],
         gate: { kind: "none" }
       },
       {
@@ -2142,6 +2143,7 @@ var init_preview_surfaces = __esm({
         // iPad Pro 11" logical points
         orientations: ["portrait", "landscape"],
         platformKey: null,
+        idiomPlatforms: ["ios", "android"],
         gate: { kind: "none" }
       },
       {
@@ -12687,23 +12689,130 @@ function resolveIdiom(tokens, ctx = {}) {
   const { idiomPolicy: _applied, ...final } = merged;
   return final;
 }
-var UNSAFE_KEYS;
+var IDIOM_CONTEXTS, UNSAFE_KEYS;
 var init_idiom = __esm({
   "../../core/ts/src/idiom.ts"() {
     "use strict";
+    IDIOM_CONTEXTS = {
+      ios: { native: ["ios"] },
+      android: { native: ["material"] },
+      mac: { native: ["desktop", "ios"], surface: "mac" }
+    };
     UNSAFE_KEYS = /* @__PURE__ */ new Set(["__proto__", "constructor", "prototype"]);
   }
 });
 
+// ../../core/web-renderer/src/idiom-controls.ts
+function pickRole(colors, role) {
+  if (typeof role === "string") return role;
+  return role.find((name) => colors?.[name] != null) ?? role[role.length - 1];
+}
+function controlIdiomFor(context) {
+  for (const name of context?.native ?? []) {
+    if (name !== "base" && Object.hasOwn(IDIOM_CONTROLS, name)) return name;
+  }
+  return "base";
+}
+function idiomControls(idiom) {
+  return idiom != null && Object.hasOwn(IDIOM_CONTROLS, idiom) ? IDIOM_CONTROLS[idiom] : IDIOM_CONTROLS.base;
+}
+var STOCK_ROLES, FILLED_SEGMENT_ROLES, IDIOM_CONTROLS;
+var init_idiom_controls = __esm({
+  "../../core/web-renderer/src/idiom-controls.ts"() {
+    STOCK_ROLES = { onThumb: null, offTrack: "surfaceTertiary", offThumb: null, outline: null };
+    FILLED_SEGMENT_ROLES = { outline: "border", inactive: "surfaceTertiary" };
+    IDIOM_CONTROLS = {
+      // The web's own look — today's values, unchanged.
+      base: {
+        font: { defaultStack: '"Wix Madefor Text", system-ui', system: null, bundled: null, faithfulOn: "any" },
+        switch: { width: 51, height: 31, thumbOn: 27, thumbOff: 27, outline: 0, roles: STOCK_ROLES, thumbShadow: true },
+        segmented: { height: 50, trackPadding: 3, trackRadius: null, segmentRadius: null, outlined: false, selectedCheck: false, roles: FILLED_SEGMENT_ROLES },
+        sheet: { cornerRadius: 16, grabberWidth: 36, grabberHeight: 5 },
+        navBar: { rootTitle: "inline", pushedTitle: "inline", back: "chevron", inlineTitleSize: 15, largeTitleSize: 15, hideWithStickyChrome: false },
+        press: { button: "none", tappable: "none", highlightOpacity: 1, stateLayerOpacity: 0 }
+      },
+      // iOS: the stock UIKit / SwiftUI controls. The switch is MEASURED against
+      // HimalayaDemoAppSnapshotTests' gallery_inputs golden (51×31, 27pt thumb, 2pt inset).
+      ios: {
+        // SF Pro reaches a page only as the Apple system font (`-apple-system`); it is not
+        // redistributable as a webfont, so elsewhere this frame falls back and says so.
+        font: { defaultStack: '-apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif', system: '-apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif', bundled: null, faithfulOn: "apple" },
+        switch: { width: 51, height: 31, thumbOn: 27, thumbOff: 27, outline: 0, roles: STOCK_ROLES, thumbShadow: true },
+        // UISegmentedControl: 32pt tall, a 2pt-inset selected segment inside a filled track.
+        segmented: { height: 32, trackPadding: 2, trackRadius: 9, segmentRadius: 7, outlined: false, selectedCheck: false, roles: FILLED_SEGMENT_ROLES },
+        // UISheetPresentationController: a 36×5 grabber and 10pt top corners (iOS 15–18).
+        sheet: { cornerRadius: 10, grabberWidth: 36, grabberHeight: 5 },
+        // NavigationStack: a large title on the root screen, inline once pushed, and NO bar when the
+        // screen pins sticky chrome (HimalayaScreenHost.swift `RootTitleDisplayMode`,
+        // `HideNavigationBarWhen(hasStickyChrome)`). UINavigationBar: 17pt semibold inline, 34pt
+        // bold large.
+        navBar: { rootTitle: "large", pushedTitle: "inline", back: "chevron", inlineTitleSize: 17, largeTitleSize: 34, hideWithStickyChrome: true },
+        // A Button is `.buttonStyle(.borderless)`, which dims its content while pressed; any other
+        // tappable is `.onTapGesture` (SDUIRenderer.swift `TapGestureIfPresent`), which shows
+        // nothing. The dim is approximate — no golden captures a pressed state.
+        press: { button: "highlight", tappable: "none", highlightOpacity: 0.3, stateLayerOpacity: 0 }
+      },
+      // Android: the stock Material 3 controls. The switch's ON state is MEASURED against the
+      // Paparazzi gallery_inputs golden (52×32 track, 24dp thumb, 4dp inset); its OFF state —
+      // 16dp thumb, 2dp outline — is Compose Material 3's SwitchTokens (no golden shows one).
+      material: {
+        // Roboto is the font catalog's variable face (100–900); the web host bundles that exact file
+        // (index.html @font-face), so the frame is faithful on any OS, offline included.
+        font: {
+          defaultStack: "Roboto, sans-serif",
+          system: "Roboto, sans-serif",
+          bundled: { family: "Roboto", file: "fonts/Roboto-Variable.ttf", sha256: "d7598e12c5dbef095ff8272cfc55da0250bd07fbdecbac8a530b9b277872a134" },
+          faithfulOn: "any"
+        },
+        switch: {
+          width: 52,
+          height: 32,
+          thumbOn: 24,
+          thumbOff: 16,
+          outline: 2,
+          thumbShadow: false,
+          roles: {
+            onThumb: "textOnAccent",
+            offTrack: ["surfaceElevated", "surfaceSecondary", "surfacePrimary"],
+            offThumb: ["border", "surfaceTertiary", "surfaceSecondary", "surfacePrimary"],
+            outline: ["border", "surfaceTertiary", "surfaceSecondary", "surfacePrimary"]
+          }
+        },
+        // SegmentedButton (SDUIComponents.kt `SingleChoiceSegmentedButtonRow`): 40dp, pill-ended
+        // adjoining outlined buttons, no inset track.
+        segmented: {
+          height: 40,
+          trackPadding: 0,
+          trackRadius: "pill",
+          segmentRadius: "pill",
+          outlined: true,
+          selectedCheck: true,
+          roles: { outline: ["border", "surfaceTertiary", "surfaceSecondary", "surfacePrimary"], inactive: ["surfaceTertiary", "surfaceSecondary", "surfacePrimary"] }
+        },
+        // ModalBottomSheet + BottomSheetDefaults.DragHandle: a 32×4 handle, 28dp top corners.
+        sheet: { cornerRadius: 28, grabberWidth: 32, grabberHeight: 4 },
+        // HimalayaAppShell draws NO title bar — a floating ArrowBack IconButton, the title unused.
+        // The floating control reserves a top band in the content's flow unless the screen is
+        // immersive (ScreenView.kt `reservesBand`), so nothing slides under it.
+        navBar: { rootTitle: "none", pushedTitle: "none", back: "arrow", inlineTitleSize: 0, largeTitleSize: 0, hideWithStickyChrome: false },
+        // M3 Buttons and `Modifier.clickable` (every `onTap`, SDUIRenderer.kt) ripple. The web draws
+        // the M3 pressed state layer (10% of the content colour), not the expanding circle.
+        press: { button: "ripple", tappable: "ripple", highlightOpacity: 1, stateLayerOpacity: 0.1 }
+      }
+    };
+  }
+});
+
 // ../../core/web-renderer/src/tokens.ts
 function isSerifFamily(family) {
   return !!family && SERIF_FAMILY_RE.test(family);
 }
-function fontStack(family) {
-  if (!family) return DEFAULT_FONT_STACK;
-  if (family === SYSTEM_FONT_FAMILY) return SYSTEM_FONT_STACK;
+function fontStack(family, idiom) {
+  const fallback = idiom ? idiomControls(idiom).font.defaultStack : DEFAULT_FONT_STACK;
+  if (!family) return fallback;
+  if (family === SYSTEM_FONT_FAMILY) return (idiom ? idiomControls(idiom).font.system : null) ?? SYSTEM_FONT_STACK;
   if (isSerifFamily(family)) return `"${family}", serif`;
-  return `"${family}", ${DEFAULT_FONT_STACK}`;
+  return `"${family}", ${fallback}`;
 }
 function clamp(n, lo = 0, hi = 1) {
   return Math.max(lo, Math.min(hi, n));
@@ -13054,6 +13163,7 @@ var REM_ROOT_PX, pxToRem, DEFAULT_FONT_STACK, SYSTEM_FONT_STACK, SERIF_FAMILY_RE
 var init_tokens2 = __esm({
   "../../core/web-renderer/src/tokens.ts"() {
     init_idiom();
+    init_idiom_controls();
     init_tokens();
     REM_ROOT_PX = 16;
     pxToRem = (px) => `${px / REM_ROOT_PX}rem`;
@@ -17195,7 +17305,17 @@ async function wixVisitorCall(method, path2, body, token, fetchImpl = fetch, for
   });
   return { status: res.status, body: await res.text() };
 }
-function normalizeWixForwardedHeaders(input) {
+function isChatWebTarget(path2) {
+  if (!path2 || !/^https:\/\//i.test(path2)) return false;
+  try {
+    const url = new URL(path2);
+    return url.host === "manage.wix.com" && url.pathname.startsWith("/_api/chat-web/");
+  } catch {
+    return false;
+  }
+}
+function normalizeWixForwardedHeaders(input, path2) {
+  const chatWeb = isChatWebTarget(path2);
   let value = input;
   if (typeof value === "string") {
     try {
@@ -17205,10 +17325,12 @@ function normalizeWixForwardedHeaders(input) {
     }
   }
   if (!value || typeof value !== "object" || Array.isArray(value)) return {};
-  const blocked = /* @__PURE__ */ new Set(["authorization", "cookie", "host", "content-length", "content-type", "connection"]);
   const out = {};
   for (const [name, headerValue] of Object.entries(value)) {
-    if (!/^[a-z0-9-]+$/i.test(name) || blocked.has(name.toLowerCase()) || typeof headerValue !== "string") continue;
+    const lower = name.toLowerCase();
+    const allowed2 = WIX_FORWARDABLE_HEADERS.has(lower) || chatWeb && lower === "chattoken";
+    if (!/^[a-z0-9-]+$/i.test(name) || !allowed2 || typeof headerValue !== "string") continue;
+    if (/[\r\n\0]/.test(headerValue)) continue;
     out[name] = headerValue;
   }
   return out;
@@ -17247,7 +17369,7 @@ function wixClientIdOf(appConfigJson) {
   if (typeof clientId !== "string" || !clientId) return { error: "no_client_id" };
   return { clientId };
 }
-var WIX_API, ONE_APP_SESSION, OWNER_SCOPED_WIX_HOST, VisitorTokenCache, OWNER_REFRESH_MARGIN_MS, OWNER_RENEW_MIN_AGE_MS, OWNER_MINT_TIMEOUT_MS, OwnerInstanceCache, OWNER_SITES_QUERY_PATH, OWNER_SITES_COUNT_PATH, OwnerSitesCache;
+var WIX_API, ONE_APP_SESSION, OWNER_SCOPED_WIX_HOST, VisitorTokenCache, WIX_FORWARDABLE_HEADERS, OWNER_REFRESH_MARGIN_MS, OWNER_RENEW_MIN_AGE_MS, OWNER_MINT_TIMEOUT_MS, OwnerInstanceCache, OWNER_SITES_QUERY_PATH, OWNER_SITES_COUNT_PATH, OwnerSitesCache;
 var init_wix_bridge = __esm({
   "../../core/serve-runtime/src/wix-bridge.ts"() {
     init_sha256();
@@ -17284,6 +17406,22 @@ var init_wix_bridge = __esm({
         this.cache.delete(clientId);
       }
     };
+    WIX_FORWARDABLE_HEADERS = /* @__PURE__ */ new Set([
+      "x-wix-language",
+      "x-wix-linguist",
+      "wixlanguage",
+      "accept-language",
+      "x-wix-currency",
+      "x-wix-consistent",
+      "x-wix-client-api-revision",
+      "x-wix-site-revision",
+      "x-wix-bi-gateway",
+      "x-wix-brand",
+      "consent-policy",
+      "commonconfig",
+      "x-wix-client-artifact-id",
+      "wix-site-id"
+    ]);
     OWNER_REFRESH_MARGIN_MS = 6e4;
     OWNER_RENEW_MIN_AGE_MS = 5e3;
     OWNER_MINT_TIMEOUT_MS = 8e3;
@@ -22426,6 +22564,7 @@ var init_controls = __esm({
     "use strict";
     init_helpers();
     init_tokens2();
+    init_idiom_controls();
     init_bindings2();
     init_icons();
     init_formBag();
@@ -22434,7 +22573,7 @@ var init_controls = __esm({
       const r = useResolvedScalar(typeof v === "string" ? v : void 0, ctx);
       return r != null ? String(r) : void 0;
     };
-    FONT = (ctx) => fontStack(ctx.font("body").family);
+    FONT = (ctx) => fontStack(ctx.font("body").family, ctx.idiom);
     rowShareFloor = (style, rowStretch, floor) => rowStretch ? { ...style, minWidth: floor } : style;
     A11ySwitch = ({ props, ctx, wrap }) => {
       const C = ctx.color;
@@ -22463,11 +22602,18 @@ var init_controls = __esm({
         bag.register(fieldId, props.validation);
         return () => bag.unregister(fieldId);
       }, [fieldId, bag, ruleKey]);
-      const w = typeof props.width === "number" ? props.width : 51;
-      const h = typeof props.height === "number" ? props.height : 31;
-      const tSize = Math.max(0, h - 4);
-      const trackColor = on3 ? C(props.trackOn ?? "accentPrimary", "#116DFF") : C(props.trackOff ?? "surfaceTertiary", "#ddd");
-      const thumbColor = props.thumb ? C(props.thumb, "#fff") : "#fff";
+      const hasAppearance = props.trackOn != null || props.trackOff != null || props.thumb != null || props.width != null || props.height != null;
+      const shape = idiomControls(hasAppearance ? void 0 : ctx.idiom).switch;
+      const w = typeof props.width === "number" ? props.width : shape.width;
+      const h = typeof props.height === "number" ? props.height : shape.height;
+      const tSize = hasAppearance ? Math.max(0, h - 4) : Math.max(0, on3 ? shape.thumbOn : shape.thumbOff);
+      const roles = shape.roles;
+      const role = (r) => pickRole(ctx.tokens.colors, r);
+      const trackColor = on3 ? C(props.trackOn ?? "accentPrimary", "#116DFF") : C(props.trackOff ?? role(roles.offTrack), "#ddd");
+      const thumbRole = on3 ? roles.onThumb : roles.offThumb;
+      const thumbColor = props.thumb ? C(props.thumb, "#fff") : thumbRole ? C(role(thumbRole), "#fff") : "#fff";
+      const outlineWidth = !on3 && roles.outline ? shape.outline : 0;
+      const thumbInset = (h - tSize) / 2 - outlineWidth;
       const act = props.onChange ?? props.action;
       const canFire = !props.disabled && Boolean(ctx.onAction) && (inForm || Boolean(act));
       const fire = canFire ? () => {
@@ -22492,8 +22638,8 @@ var init_controls = __esm({
             "aria-label": props.label != null ? asText2(props.label) : void 0,
             disabled: props.disabled === true,
             onClick: fire,
-            style: { all: "unset", boxSizing: "border-box", width: w, height: h, borderRadius: 999, background: trackColor, position: "relative", flex: "none", cursor: fire ? "pointer" : "default", display: "inline-block", outlineOffset: 2 },
-            children: /* @__PURE__ */ jsx4("span", { "aria-hidden": true, style: { position: "absolute", top: 2, [on3 ? "right" : "left"]: 2, width: tSize, height: tSize, borderRadius: "50%", background: thumbColor, boxShadow: "0 1px 3px rgba(0,0,0,.3)" } })
+            style: { all: "unset", boxSizing: "border-box", width: w, height: h, borderRadius: 999, background: trackColor, ...outlineWidth > 0 ? { border: `${outlineWidth}px solid ${C(role(roles.outline), "#79747e")}` } : {}, position: "relative", flex: "none", cursor: fire ? "pointer" : "default", display: "inline-block", outlineOffset: 2 },
+            children: /* @__PURE__ */ jsx4("span", { "aria-hidden": true, style: { position: "absolute", top: thumbInset, [on3 ? "right" : "left"]: thumbInset, width: tSize, height: tSize, borderRadius: "50%", background: thumbColor, boxShadow: shape.thumbShadow ? "0 1px 3px rgba(0,0,0,.3)" : "none" } })
           }
         )
       ] });
@@ -22656,6 +22802,8 @@ var init_controls = __esm({
     };
     A11ySegmented = ({ props, ctx, wrap }) => {
       const C = ctx.color;
+      const seg = idiomControls(ctx.idiom).segmented;
+      const radius = (r, token, fallback) => r === null ? ctx.radius(token, fallback) : r === "pill" ? 999 : r;
       const optionsPath = props.optionsPath ?? props.options_path;
       const boundOpts = useBoundValue(ctx, typeof optionsPath === "string" && isBinding(optionsPath) ? optionsPath : "");
       const resolvedSel = useResolvedId(props.selectedId, ctx);
@@ -22675,9 +22823,15 @@ var init_controls = __esm({
         e.preventDefault();
         if (ni !== selIdx) select(ni);
       };
-      return /* @__PURE__ */ jsx4("div", { role: "radiogroup", onKeyDown, style: { display: "flex", background: C("surfaceTertiary", "#eee"), borderRadius: ctx.radius("md", 8), padding: 3, width: "100%", boxSizing: "border-box", ...wrap }, children: opts.map((o, i) => {
+      return /* @__PURE__ */ jsx4("div", { role: "radiogroup", onKeyDown, style: { display: "flex", background: seg.outlined ? "transparent" : C("surfaceTertiary", "#eee"), borderRadius: radius(seg.trackRadius, "md", 8), padding: seg.trackPadding, width: "100%", boxSizing: "border-box", ...wrap }, children: opts.map((o, i) => {
         const on3 = o.id === selId;
-        return /* @__PURE__ */ jsx4(
+        const outerR = radius(seg.segmentRadius, "sm", 6);
+        const outlinedShape = seg.outlined ? {
+          border: `1px solid ${C(pickRole(ctx.tokens.colors, seg.roles.outline), "#d8dee4")}`,
+          marginLeft: i > 0 ? -1 : 0,
+          borderRadius: `${i === 0 ? outerR : 0}px ${i === opts.length - 1 ? outerR : 0}px ${i === opts.length - 1 ? outerR : 0}px ${i === 0 ? outerR : 0}px`
+        } : {};
+        return /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
@@ -22685,8 +22839,11 @@ var init_controls = __esm({
             "aria-checked": on3,
             tabIndex: on3 || selId == null && i === 0 ? 0 : -1,
             onClick: () => select(i),
-            style: { all: "unset", flex: 1, minWidth: 44, minHeight: 44, textAlign: "center", padding: "7px 4px", borderRadius: ctx.radius("sm", 6), fontFamily: FONT(ctx), fontWeight: 600, fontSize: 13, cursor: "pointer", boxSizing: "border-box", background: on3 ? C("surfacePrimary", "#fff") : "transparent", color: on3 ? C("textPrimary", "#111") : C("textSecondary", "#777"), boxShadow: on3 ? "0 1px 3px rgba(0,0,0,.12)" : "none" },
-            children: asText2(o.label ?? o.title ?? o.id) || `Option ${i + 1}`
+            style: { all: "unset", flex: 1, minWidth: 44, minHeight: seg.height - 2 * seg.trackPadding, textAlign: "center", padding: "7px 4px", borderRadius: outerR, fontFamily: FONT(ctx), fontWeight: 600, fontSize: 13, cursor: "pointer", boxSizing: "border-box", background: on3 ? C("surfacePrimary", "#fff") : seg.outlined ? C(pickRole(ctx.tokens.colors, seg.roles.inactive), "#eee") : "transparent", color: on3 ? C("textPrimary", "#111") : C("textSecondary", "#777"), boxShadow: on3 && !seg.outlined ? "0 1px 3px rgba(0,0,0,.12)" : "none", ...outlinedShape },
+            children: [
+              on3 && seg.selectedCheck ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", children: "\u2713 " }) : null,
+              asText2(o.label ?? o.title ?? o.id) || `Option ${i + 1}`
+            ]
           },
           o.id ?? i
         );
@@ -23346,7 +23503,7 @@ function seededWidth(measured, seed2) {
   return measured || (typeof seed2 === "number" && seed2 > 0 ? seed2 : 0);
 }
 function makeCtx(tokens, scheme = "light", opts = {}) {
-  const tk = makeTokenResolvers(tokens, scheme);
+  const tk = makeTokenResolvers(tokens, scheme, opts.idiomContext);
   const provider = opts.provider ?? null;
   return {
     ...tk,
@@ -23369,7 +23526,9 @@ function makeCtx(tokens, scheme = "light", opts = {}) {
     emitTelemetry: opts.emitTelemetry,
     assetBaseUrl: opts.assetBaseUrl,
     runtimeDegraded: opts.runtimeDegraded,
-    previewSurface: opts.previewSurface
+    previewSurface: opts.previewSurface,
+    idiomContext: opts.idiomContext,
+    idiom: controlIdiomFor(opts.idiomContext)
   };
 }
 function resolveAssetUrl(url, base) {
@@ -23393,7 +23552,7 @@ function withTheme(ctx, theme) {
     radius: { ...base.radius ?? {}, ...theme.radius ?? {} },
     spacing: { ...base.spacing ?? {}, ...theme.spacing ?? {} }
   };
-  const themed = makeCtx(merged, ctx.scheme, { provider: ctx.provider, onAction: ctx.onAction, intents: ctx.intents, empty: ctx.empty, screenId: ctx.screenId, emitTelemetry: ctx.emitTelemetry, previewSurface: ctx.previewSurface });
+  const themed = makeCtx(merged, ctx.scheme, { provider: ctx.provider, onAction: ctx.onAction, intents: ctx.intents, empty: ctx.empty, screenId: ctx.screenId, emitTelemetry: ctx.emitTelemetry, previewSurface: ctx.previewSurface, idiomContext: ctx.idiomContext });
   themed.itemScope = ctx.itemScope;
   return themed;
 }
@@ -23410,9 +23569,29 @@ function ensurePressStyles() {
   const el = document.createElement("style");
   el.textContent = // WS-N3 — the duration/easing read from per-node CSS vars (set when a
   // `pressMotion` token is present) with the original 160ms/standard-ease default.
-  '[data-himalaya-press]{transition:transform var(--hm-press-dur,160ms) var(--hm-press-ease,cubic-bezier(0.2,0,0,1)),filter var(--hm-press-dur,160ms) var(--hm-press-ease,cubic-bezier(0.2,0,0,1))}[data-himalaya-press="scale"]:active,[data-himalaya-press="auto"]:active,[data-himalaya-press="scaleHighlight"]:active{transform:scale(0.96)}[data-himalaya-press="scaleHighlight"]:active,[data-himalaya-press="highlight"]:active{filter:brightness(1.08)}[data-himalaya-press="lift"]:active{transform:translateY(-4px) scale(1.02)}@media (hover:hover){[data-himalaya-tap]{transition:filter 120ms ease}[data-himalaya-tap]:hover{filter:brightness(0.97)}[data-himalaya-press="scale"]:hover,[data-himalaya-press="auto"]:hover,[data-himalaya-press="scaleHighlight"]:hover{transform:scale(0.985)}[data-himalaya-press="lift"]:hover{transform:translateY(-2px) scale(1.01)}}';
+  '[data-himalaya-press]{transition:transform var(--hm-press-dur,160ms) var(--hm-press-ease,cubic-bezier(0.2,0,0,1)),filter var(--hm-press-dur,160ms) var(--hm-press-ease,cubic-bezier(0.2,0,0,1))}[data-himalaya-press="scale"]:active,[data-himalaya-press="auto"]:active,[data-himalaya-press="scaleHighlight"]:active{transform:scale(0.96)}[data-himalaya-press="scaleHighlight"]:active,[data-himalaya-press="highlight"]:active{filter:brightness(1.08)}[data-himalaya-press="lift"]:active{transform:translateY(-4px) scale(1.02)}' + idiomPressRules() + // RFC 0051 track D — desktop hover analogs. Guarded by `(hover: hover)` so a
+  // touch device never sees a sticky-hover state; pointer-only affordance for
+  // the real web app. Tap-bearing nodes get a subtle dim (the hover analog of
+  // pressFeedback's dim family); press-styled nodes preview their :active
+  // recipe at reduced amplitude.
+  '@media (hover:hover){[data-himalaya-tap]{transition:filter 120ms ease}[data-himalaya-tap]:hover{filter:brightness(0.97)}[data-himalaya-press="scale"]:hover,[data-himalaya-press="auto"]:hover,[data-himalaya-press="scaleHighlight"]:hover{transform:scale(0.985)}[data-himalaya-press="lift"]:hover{transform:translateY(-2px) scale(1.01)}}';
   document.head.appendChild(el);
 }
+function idiomPressRules() {
+  let css = "";
+  for (const [name, row] of Object.entries(IDIOM_CONTROLS)) {
+    const layer = `color-mix(in srgb,currentColor ${Math.round(row.press.stateLayerOpacity * 100)}%,transparent)`;
+    css += `[data-himalaya-idiom-press="${name}-highlight"]:active{opacity:${row.press.highlightOpacity}!important}`;
+    css += `[data-himalaya-idiom-press="${name}-ripple"]:active{background-image:linear-gradient(${layer},${layer})!important}`;
+  }
+  return css;
+}
+function idiomPress(ctx, part) {
+  const kind = idiomControls(ctx.idiom).press[part];
+  if (kind === "none") return void 0;
+  ensurePressStyles();
+  return `${ctx.idiom}-${kind}`;
+}
 function ensureFocusStyles() {
   if (focusStylesInjected || typeof document === "undefined") return;
   focusStylesInjected = true;
@@ -24683,6 +24862,8 @@ function renderNodeInner(node, ctx) {
     }
     ensurePressStyles();
     extra["data-himalaya-tap"] = "1";
+    const idiomPressed = idiomPress(ctx, "tappable");
+    if (idiomPressed) extra["data-himalaya-idiom-press"] = idiomPressed;
   }
   const dtap = node?.modifiers?.onDoubleTap ?? node?.modifiers?.on_double_tap;
   if (dtap && ctx.onAction) {
@@ -25064,7 +25245,7 @@ function renderInner(node, ctx) {
       return /* @__PURE__ */ jsx6("div", { style: { fontFamily: bodyFont(ctx), lineHeight: 1.5, overflowWrap: "break-word", color: C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e"), ...wrap }, children: runs.map((r, i) => {
         const marks = Array.isArray(r.marks) ? r.marks : [];
         const f = ctx.font(r.style);
-        return /* @__PURE__ */ jsx6("span", { style: { fontSize: f.remSize, fontWeight: marks.includes("bold") ? 700 : f.weight, fontStyle: marks.includes("italic") ? "italic" : void 0, textDecoration: marks.includes("underline") ? "underline" : void 0, ...f.family ? { fontFamily: fontStack(f.family) } : {}, ...r.color ? { color: C(r.color) } : {}, ...marks.includes("code") ? { fontFamily: "ui-monospace, monospace", background: C("surfaceTertiary", "#eee"), padding: "1px 5px", borderRadius: 4 } : {} }, children: txt(r.text, ctx) }, i);
+        return /* @__PURE__ */ jsx6("span", { style: { fontSize: f.remSize, fontWeight: marks.includes("bold") ? 700 : f.weight, fontStyle: marks.includes("italic") ? "italic" : void 0, textDecoration: marks.includes("underline") ? "underline" : void 0, ...f.family ? { fontFamily: fontStack(f.family, ctx.idiom) } : {}, ...r.color ? { color: C(r.color) } : {}, ...marks.includes("code") ? { fontFamily: "ui-monospace, monospace", background: C("surfaceTertiary", "#eee"), padding: "1px 5px", borderRadius: 4 } : {} }, children: txt(r.text, ctx) }, i);
       }) });
     }
     case "Image":
@@ -25105,8 +25286,8 @@ function renderInner(node, ctx) {
         props.leading && /* @__PURE__ */ jsx6("div", { style: { flex: "none", display: "flex" }, children: renderNode(props.leading, ctx) }),
         /* @__PURE__ */ jsxs3("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: 2 }, children: [
           props.overline != null && /* @__PURE__ */ jsx6("span", { style: { fontFamily: bodyFont(ctx), fontSize: 11, fontWeight: 600, letterSpacing: 0.4, textTransform: "uppercase", color: C(props.overlineColor ?? "textSecondary", "#888"), ...ell }, children: txt(props.overline, ctx) }),
-          /* @__PURE__ */ jsx6("span", { style: { fontFamily: fontStack(titleF.family), fontSize: titleF.remSize, fontWeight: titleF.weight, color: C(props.titleColor ?? "textPrimary", "#13171e"), ...ell }, children: txt(props.title, ctx) ?? (ctx.empty ? "" : "") }),
-          props.subtitle != null && /* @__PURE__ */ jsx6("span", { style: { fontFamily: fontStack(subF.family), fontSize: subF.remSize, color: C(props.subtitleColor ?? "textSecondary", "#888"), ...ell }, children: txt(props.subtitle, ctx) })
+          /* @__PURE__ */ jsx6("span", { style: { fontFamily: fontStack(titleF.family, ctx.idiom), fontSize: titleF.remSize, fontWeight: titleF.weight, color: C(props.titleColor ?? "textPrimary", "#13171e"), ...ell }, children: txt(props.title, ctx) ?? (ctx.empty ? "" : "") }),
+          props.subtitle != null && /* @__PURE__ */ jsx6("span", { style: { fontFamily: fontStack(subF.family, ctx.idiom), fontSize: subF.remSize, color: C(props.subtitleColor ?? "textSecondary", "#888"), ...ell }, children: txt(props.subtitle, ctx) })
         ] }),
         props.trailing ? (
           // #1010 — the row's `onTap` lives on the outer flex div, and the trailing
@@ -25172,7 +25353,7 @@ function renderInner(node, ctx) {
     case "Label": {
       const f = ctx.font(props.style ?? "body");
       const col = C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e");
-      return /* @__PURE__ */ jsxs3("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, fontFamily: fontStack(f.family), fontSize: f.remSize, fontWeight: f.weight, color: col, ...wrap }, children: [
+      return /* @__PURE__ */ jsxs3("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, fontFamily: fontStack(f.family, ctx.idiom), fontSize: f.remSize, fontWeight: f.weight, color: col, ...wrap }, children: [
         props.icon && /* @__PURE__ */ jsx6("span", { style: { display: "inline-grid", placeItems: "center", width: f.size, height: f.size }, children: iconSvg(props.icon, { size: f.size, color: col }) }),
         txt(props.text, ctx)
       ] });
@@ -25201,7 +25382,7 @@ function renderInner(node, ctx) {
       ensureMarqueeKeyframes();
       const f = ctx.font(props.style ?? "body");
       const dur = props.durationMs ?? 8e3;
-      return /* @__PURE__ */ jsx6("div", { style: { width: "100%", overflow: "hidden", whiteSpace: "nowrap", ...wrap }, children: /* @__PURE__ */ jsx6("span", { style: { display: "inline-block", paddingLeft: "100%", fontFamily: fontStack(f.family), fontSize: f.remSize, color: C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e"), animation: ctx.empty ? void 0 : `himalaya-marquee ${dur}ms linear infinite` }, children: txt(props.text, ctx) }) });
+      return /* @__PURE__ */ jsx6("div", { style: { width: "100%", overflow: "hidden", whiteSpace: "nowrap", ...wrap }, children: /* @__PURE__ */ jsx6("span", { style: { display: "inline-block", paddingLeft: "100%", fontFamily: fontStack(f.family, ctx.idiom), fontSize: f.remSize, color: C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e"), animation: ctx.empty ? void 0 : `himalaya-marquee ${dur}ms linear infinite` }, children: txt(props.text, ctx) }) });
     }
     case "Timeline":
       return /* @__PURE__ */ jsx6(TimelineNode, { props, ctx, wrap });
@@ -25440,6 +25621,7 @@ var init_renderNode = __esm({
   "../../core/web-renderer/src/renderNode.tsx"() {
     "use strict";
     init_tokens2();
+    init_idiom_controls();
     init_modifiers();
     init_helpers();
     init_bindings2();
@@ -25570,7 +25752,7 @@ var init_renderNode = __esm({
           return "center";
       }
     };
-    bodyFont = (ctx) => fontStack(ctx.font("body").family);
+    bodyFont = (ctx) => fontStack(ctx.font("body").family, ctx.idiom);
     kids = (arr, ctx) => Array.isArray(arr) ? arr.map((n, i) => /* @__PURE__ */ jsx6(React5.Fragment, { children: renderNode(n, ctx) }, n?.id ?? i)) : null;
     rowKids = (arr, ctx) => Array.isArray(arr) ? arr.map((n, i) => /* @__PURE__ */ jsx6(React5.Fragment, { children: renderNode(n, wantsRowStretch(n) ? { ...ctx, rowStretch: true } : ctx) }, n?.id ?? i)) : null;
     staggeredKids = (arr, ctx, staggerMs) => Array.isArray(arr) ? arr.map((n, i) => {
@@ -27058,7 +27240,7 @@ var init_renderNode = __esm({
       const tAlign = props.textAlign === "center" ? "center" : props.textAlign === "trailing" ? "right" : props.textAlign === "justify" ? "justify" : props.textAlign === "leading" ? "left" : void 0;
       const tDecor = props.decoration === "strikethrough" ? "line-through" : props.decoration === "underline" ? "underline" : void 0;
       const ln = typeof props.lineSpacing === "number" ? pxToRem((f.line ?? 1.4) * f.size + props.lineSpacing) : f.line;
-      return /* @__PURE__ */ jsx6("div", { ...countAttrs, style: { fontFamily: fontStack(f.family), fontSize: f.remSize, fontWeight: f.weight, lineHeight: ln, letterSpacing: f.letterSpacing, color: C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e"), whiteSpace: "pre-wrap", overflowWrap: "anywhere", wordBreak: "break-word", minWidth: 0, ...tAlign ? { textAlign: tAlign } : {}, ...tDecor ? { textDecoration: tDecor } : {}, ...props.maxLines ? { display: "-webkit-box", WebkitLineClamp: props.maxLines, WebkitBoxOrient: "vertical", overflow: "hidden" } : {}, ...wrap }, children: content == null || content === "" ? collapse ? null : "\xA0" : content });
+      return /* @__PURE__ */ jsx6("div", { ...countAttrs, style: { fontFamily: fontStack(f.family, ctx.idiom), fontSize: f.remSize, fontWeight: f.weight, lineHeight: ln, letterSpacing: f.letterSpacing, color: C(resolveScalarStatic(props.color, ctx) ?? "textPrimary", "#13171e"), whiteSpace: "pre-wrap", overflowWrap: "anywhere", wordBreak: "break-word", minWidth: 0, ...tAlign ? { textAlign: tAlign } : {}, ...tDecor ? { textDecoration: tDecor } : {}, ...props.maxLines ? { display: "-webkit-box", WebkitLineClamp: props.maxLines, WebkitBoxOrient: "vertical", overflow: "hidden" } : {}, ...wrap }, children: content == null || content === "" ? collapse ? null : "\xA0" : content });
     });
     ImageNode = withExtras("ImageNode", ({ props, ctx, wrap }) => {
       const C = ctx.color;
@@ -27162,6 +27344,7 @@ var init_renderNode = __esm({
           disabled,
           "aria-label": accessibleLabel,
           "aria-busy": props.loading === true ? true : void 0,
+          "data-himalaya-idiom-press": idiomPress(ctx, "button"),
           onClick,
           style: rowShareFloor({
             // reset first, so every token-driven value below still wins
@@ -27204,7 +27387,7 @@ var init_renderNode = __esm({
             gap: 8,
             padding: pad2,
             borderRadius: props.iconOnly ? "50%" : pillRadius,
-            fontFamily: fontStack(f.family),
+            fontFamily: fontStack(f.family, ctx.idiom),
             fontWeight: f.weight,
             fontSize: f.remSize,
             background: primary ? accent : "transparent",
@@ -27271,8 +27454,9 @@ var init_renderNode = __esm({
       const presented = props.presentedPath != null ? bound : props.presented;
       if (gated && presented !== true && presented !== "true") return null;
       const grabber = props.showGrabber !== false;
-      return /* @__PURE__ */ jsx6("div", { style: { position: "absolute", inset: 0, background: "rgba(0,0,0,.35)", zIndex: 50, display: "flex", flexDirection: "column", justifyContent: "flex-end", ...wrap }, children: /* @__PURE__ */ jsxs3("div", { role: "dialog", "aria-modal": "true", "aria-label": props.title != null ? sheetTitle : "Sheet", style: { width: "100%", background: C("surfacePrimary", "#fff"), borderRadius: "16px 16px 0 0", boxShadow: "0 -4px 24px rgba(0,0,0,.12)", overflow: "hidden" }, children: [
-        grabber && /* @__PURE__ */ jsx6("div", { style: { display: "flex", justifyContent: "center", padding: "8px 0 4px" }, children: /* @__PURE__ */ jsx6("div", { style: { width: 36, height: 5, borderRadius: 999, background: C("surfaceTertiary", "#d8dce2") } }) }),
+      const sheet = idiomControls(ctx.idiom).sheet;
+      return /* @__PURE__ */ jsx6("div", { style: { position: "absolute", inset: 0, background: "rgba(0,0,0,.35)", zIndex: 50, display: "flex", flexDirection: "column", justifyContent: "flex-end", ...wrap }, children: /* @__PURE__ */ jsxs3("div", { role: "dialog", "aria-modal": "true", "aria-label": props.title != null ? sheetTitle : "Sheet", style: { width: "100%", background: C("surfacePrimary", "#fff"), borderRadius: `${sheet.cornerRadius}px ${sheet.cornerRadius}px 0 0`, boxShadow: "0 -4px 24px rgba(0,0,0,.12)", overflow: "hidden" }, children: [
+        grabber && /* @__PURE__ */ jsx6("div", { style: { display: "flex", justifyContent: "center", padding: "8px 0 4px" }, children: /* @__PURE__ */ jsx6("div", { style: { width: sheet.grabberWidth, height: sheet.grabberHeight, borderRadius: 999, background: C("surfaceTertiary", "#d8dce2") } }) }),
         /* @__PURE__ */ jsx6("div", { style: { padding: "8px 16px 16px" }, children: props.content ? renderNode(props.content, ctx) : null })
       ] }) });
     });
@@ -27356,7 +27540,7 @@ var init_renderNode = __esm({
       const capF = ctx.font("caption");
       return /* @__PURE__ */ jsx6("div", { style: { display: "inline-flex", flexDirection: "column", alignItems: "center", gap: 4, ...wrap }, children: /* @__PURE__ */ jsxs3("div", { style: { position: "relative", width: 72, height: 72 }, children: [
         /* @__PURE__ */ jsx6("div", { style: { width: 72, height: 72, borderRadius: "50%", background: `conic-gradient(${tint} ${pct * 360}deg, ${track} 0deg)`, WebkitMask: ringMask, mask: ringMask, ...gaugeAnim } }),
-        /* @__PURE__ */ jsx6("div", { style: { position: "absolute", inset: 0, display: "grid", placeItems: "center", fontFamily: fontStack(capF.family), fontSize: capF.remSize, fontWeight: capF.weight, color: C("textPrimary", "#13171e") }, children: txt(props.label, ctx) || `${Math.round(pct * 100)}%` })
+        /* @__PURE__ */ jsx6("div", { style: { position: "absolute", inset: 0, display: "grid", placeItems: "center", fontFamily: fontStack(capF.family, ctx.idiom), fontSize: capF.remSize, fontWeight: capF.weight, color: C("textPrimary", "#13171e") }, children: txt(props.label, ctx) || `${Math.round(pct * 100)}%` })
       ] }) });
     });
     RATING_METRICS = {
@@ -28216,7 +28400,7 @@ var init_renderNode = __esm({
         /* @__PURE__ */ jsxs3("div", { style: { position: "relative", height: Math.min(props.expandedHeight ?? 120, 160), borderRadius: ctx.radius("md", 10), overflow: "hidden", background: imageUrl ? void 0 : `linear-gradient(135deg, ${C("accentPrimary", "#116DFF")}, ${C("accentSecondary", "#0E5FE3")})` }, children: [
           imageUrl && /* @__PURE__ */ jsx6("img", { src: imageUrl, alt: "", style: { width: "100%", height: "100%", objectFit: "cover" } }),
           /* @__PURE__ */ jsxs3("div", { style: { position: "absolute", left: 14, bottom: 12, color: "#fff", textShadow: "0 1px 4px rgba(0,0,0,.5)" }, children: [
-            /* @__PURE__ */ jsx6("div", { style: { fontFamily: ctx.font("title1").family ? fontStack(ctx.font("title1").family) : '"Wix Madefor Display", system-ui', fontWeight: 700, fontSize: 20 }, children: txt(props.title, ctx) }),
+            /* @__PURE__ */ jsx6("div", { style: { fontFamily: ctx.font("title1").family || ctx.idiom && ctx.idiom !== "base" ? fontStack(ctx.font("title1").family, ctx.idiom) : '"Wix Madefor Display", system-ui', fontWeight: 700, fontSize: 20 }, children: txt(props.title, ctx) }),
             props.subtitle && /* @__PURE__ */ jsx6("div", { style: { fontSize: 13, opacity: 0.9 }, children: txt(props.subtitle, ctx) })
           ] })
         ] }),
@@ -28834,7 +29018,8 @@ function renderDescriptorToHtml(payload, tokens, scheme = "light", provider = nu
   const ctx = makeCtx(tokens, scheme, {
     provider,
     ...typeof width === "number" && Number.isFinite(width) && width > 0 ? { sizeClass: sizeClassFromWidth(width), containerWidth: width } : {},
-    ...rtl ? { isRTL: true } : {}
+    ...rtl ? { isRTL: true } : {},
+    ...opts?.idiomContext ? { idiomContext: opts.idiomContext } : {}
   });
   const FOCUS_STYLE_MARKUP = `<style data-himalaya-focus-ring>${FOCUS_RING_CSS}</style>`;
   const withFocusRing = (markup) => markup ? FOCUS_STYLE_MARKUP + markup : markup;
@@ -28925,16 +29110,19 @@ __export(src_exports, {
   Bound: () => Bound,
   BoundList: () => BoundList,
   FakeServiceProvider: () => FakeServiceProvider,
+  IDIOM_CONTROLS: () => IDIOM_CONTROLS,
   WebAppRegistry: () => WebAppRegistry,
   WebRenderer: () => WebRenderer,
   WebScreenRegistry: () => WebScreenRegistry,
   asText: () => asText2,
   avatarCircle: () => avatarCircle,
+  controlIdiomFor: () => controlIdiomFor,
   controlText: () => controlText,
   fontStack: () => fontStack,
   hasIcon: () => hasIcon,
   iconGlyph: () => iconGlyph,
   iconSvg: () => iconSvg,
+  idiomControls: () => idiomControls,
   isBinding: () => isBinding,
   isNodeLike: () => isNodeLike,
   isSerifFamily: () => isSerifFamily,
@@ -28952,6 +29140,7 @@ var init_src3 = __esm({
     init_renderNode();
     init_renderToHtml();
     init_tokens2();
+    init_idiom_controls();
     init_modifiers();
     init_bindings2();
     init_FakeServiceProvider();
@@ -29158,7 +29347,7 @@ function composeStickyTree(payload, header, footer) {
   if (footer) children.push(footer);
   return { id: "screen", type: "ScreenChrome", children };
 }
-async function renderDescriptorWeb(descriptor, tokens, scheme, wantPng, services = null, width, isRTL) {
+async function renderDescriptorWeb(descriptor, tokens, scheme, wantPng, services = null, width, isRTL, idiomContext) {
   const desc = descriptor;
   const payload = desc.payload;
   if (!payload || typeof payload !== "object" || !payload.body) {
@@ -29193,7 +29382,7 @@ async function renderDescriptorWeb(descriptor, tokens, scheme, wantPng, services
       provider,
       width,
       stickyHeader || stickyFooter ? { stickyHeader, stickyFooter } : void 0,
-      isRTL ? { isRTL: true } : void 0
+      isRTL || idiomContext ? { ...isRTL ? { isRTL: true } : {}, ...idiomContext ? { idiomContext } : {} } : void 0
     );
   } catch (err) {
     return {
@@ -29207,7 +29396,7 @@ async function renderDescriptorWeb(descriptor, tokens, scheme, wantPng, services
   const nativeOnly = collectNativeOnly(renderTree);
   if (nativeOnly.length) result.nativeOnly = nativeOnly;
   if (wantPng) {
-    const png = await renderPng(html, scheme, width, isRTL, tokens);
+    const png = await renderPng(html, scheme, width, isRTL, tokens, idiomContext);
     if (png) result.pngBase64 = png;
     else result.pngUnavailable = true;
   }
@@ -29224,8 +29413,8 @@ async function withRetry2(op, attempts = 2) {
   }
   throw lastErr;
 }
-async function renderPng(html, scheme, width, isRTL, tokens) {
-  const out = await renderPngBatch([{ html, scheme, width, isRTL, tokens }]);
+async function renderPng(html, scheme, width, isRTL, tokens, idiomContext) {
+  const out = await renderPngBatch([{ html, scheme, width, isRTL, tokens, idiomContext }]);
   return out?.[0] ?? null;
 }
 function setPngFontCss(source) {
@@ -29236,7 +29425,7 @@ function setPngFontCss(source) {
 async function pngPageHtml(item) {
   let faces = "";
   try {
-    faces = await pngFontCss?.(item.tokens ?? null) ?? "";
+    faces = await pngFontCss?.(item.tokens ?? null, item.idiomContext) ?? "";
   } catch {
     faces = "";
   }
@@ -29434,6 +29623,17 @@ async function pngFontFaceCss(tokens, opts = {}) {
   });
   return rules.join("");
 }
+async function idiomFontFaceCss(idiomContext) {
+  const { controlIdiomFor: controlIdiomFor2, idiomControls: idiomControls2 } = await Promise.resolve().then(() => (init_src3(), src_exports));
+  const bundled = idiomControls2(controlIdiomFor2(idiomContext)).font.bundled;
+  if (!bundled) return "";
+  try {
+    const bytes2 = readFileSync34(new URL(`../../web-host/public/${bundled.file}`, import.meta.url));
+    return `@font-face { font-family: "${bundled.family}"; font-weight: 100 900; font-style: normal; src: url(data:font/ttf;base64,${bytes2.toString("base64")}) format("truetype"); }`;
+  } catch {
+    return "";
+  }
+}
 var encoded, cssString, FORMATS;
 var init_render_fonts = __esm({
   "../../core/dev-server/src/render-fonts.ts"() {
@@ -32838,7 +33038,7 @@ async function handleWebWix(req, res, state) {
     const method = String(b.method ?? "GET").toUpperCase();
     const requestedPath = String(b.path ?? "/");
     const body = b.body === void 0 ? void 0 : typeof b.body === "string" ? b.body : JSON.stringify(b.body);
-    const forwardedHeaders = normalizeWixForwardedHeaders(b.headers);
+    const forwardedHeaders = normalizeWixForwardedHeaders(b.headers, requestedPath);
     const target = new URL(requestedPath, "https://www.wixapis.com");
     const query = Object.fromEntries(target.searchParams.entries());
     const started = Date.now();
@@ -32978,15 +33178,25 @@ async function handleDev(req, res, state) {
     }
     const screenId = descriptor.screenId ?? body.screenId ?? "render";
     const diagnostics = await runScreenDiagnostics(state, screenId, descriptor);
-    const appTokens = readAppTokens(state);
+    let idiomContext;
+    if (body.platform !== void 0) {
+      if (body.platform !== "ios" && body.platform !== "android") {
+        return sendJson(res, 400, { error: "invalid_platform", allowed: ["ios", "android"] });
+      }
+      idiomContext = { ...IDIOM_CONTEXTS[body.platform], surface: "phone" };
+    }
+    const baseTokens = readAppTokens(state);
+    const policy = state.app?.module.config && "idiom" in state.app.module.config ? state.app.module.config.idiom : void 0;
+    const stamped = idiomContext && baseTokens && policy !== void 0 ? { ...baseTokens, idiomPolicy: policy } : baseTokens;
     const render = await renderDescriptorWeb(
       descriptor,
-      appTokens && state.app ? withServedFontFaces(appTokens, state.app.dir) : appTokens,
+      stamped && state.app ? withServedFontFaces(stamped, state.app.dir) : stamped,
       scheme,
       body.png === true,
       body.services ?? null,
       width,
-      body.rtl === true
+      body.rtl === true,
+      idiomContext
     );
     const legacy = { screenId, scheme, ...render, diagnostics };
     const report2 = foldLegacyReport(legacy, {
@@ -34444,6 +34654,7 @@ var init_src6 = __esm({
     init_inject();
     init_face_source();
     init_himi_report();
+    init_idiom();
     init_store2();
     init_derive_transport_capability();
     init_wix_gateway();
@@ -34476,7 +34687,7 @@ var init_src6 = __esm({
     init_kits();
     init_widgets();
     ROOT6 = resolve30(fileURLToPath18(new URL("../../..", import.meta.url)));
-    setPngFontCss((tokens) => pngFontFaceCss(tokens));
+    setPngFontCss(async (tokens, idiomContext) => await pngFontFaceCss(tokens) + (idiomContext ? await idiomFontFaceCss(idiomContext) : ""));
     TIER3_ROOT = resolve30(ROOT6, "core/dev-server/web");
     TIER4_ROOT = resolve30(ROOT6, "core/dev-server/tier4-bundles");
     tier4Verifier = new TierFourVerifier(TIER4_ROOT);
@@ -48367,19 +48578,21 @@ var init_preview_assets_generated = __esm({
   "../../packages/serve/src/preview-assets.generated.ts"() {
     init_preview_assets_format();
     PREVIEW_ASSET_MANIFEST = [
-      { key: "assets/index-DkRimsxm.js", contentType: "application/javascript; charset=utf-8", offset: 8, length: 1020087, sha256: "4cb472d9d6d952d85166c025544c8bae669215c1a5eafbb800cec32d199bad14" },
-      { key: "fonts/WixMadeforDisplay-Bold.ttf", contentType: "font/ttf", offset: 1020095, length: 90924, sha256: "ec4c7d63772d980d6e147b2df6215fd2737e4b04cebe0cf7e11dc695fb63cdcf" },
-      { key: "fonts/WixMadeforDisplay-ExtraBold.ttf", contentType: "font/ttf", offset: 1111019, length: 90984, sha256: "bf4c16a2774edd38a921edf3099469866cd74c094fd596f3fa4e81f54a04dfaa" },
-      { key: "fonts/WixMadeforDisplay-Medium.ttf", contentType: "font/ttf", offset: 1202003, length: 90980, sha256: "368faca44fb9f7207e4af784e94750b1ee59c1098b8689e0f4a918926f244fb5" },
-      { key: "fonts/WixMadeforDisplay-Regular.ttf", contentType: "font/ttf", offset: 1292983, length: 90872, sha256: "97ed8f1a6772abe26e3d8af5cecfc4b02faa94497d585b0398b5053b739a70c1" },
-      { key: "fonts/WixMadeforDisplay-SemiBold.ttf", contentType: "font/ttf", offset: 1383855, length: 90980, sha256: "642feab8a48ddf6c7a89d7c2a7c0edfa0e6e773f671287e460e222703563191e" },
-      { key: "fonts/WixMadeforText-Bold.ttf", contentType: "font/ttf", offset: 1474835, length: 108636, sha256: "37c179b4fefb63ea9637322b84583a2df53aa226c150294eea1675c14b1b8e29" },
-      { key: "fonts/WixMadeforText-ExtraBold.ttf", contentType: "font/ttf", offset: 1583471, length: 109084, sha256: "62e2fe4718129f36ecdb0ae4de385bd6b81ecc876146447167c6c140fad699a9" },
-      { key: "fonts/WixMadeforText-Medium.ttf", contentType: "font/ttf", offset: 1692555, length: 109048, sha256: "4ecf270136af928612c76fe4ebade91d8156975e5ea4c0cf9225501dd1788e02" },
-      { key: "fonts/WixMadeforText-Regular.ttf", contentType: "font/ttf", offset: 1801603, length: 107700, sha256: "dee56f09fd3efc127c1ea95557edc74110c1460a46287da36e0af25efd341ef5" },
-      { key: "fonts/WixMadeforText-SemiBold.ttf", contentType: "font/ttf", offset: 1909303, length: 88108, sha256: "dced97a77624bc5f8b1ae65850360908297f4588e09feb6f22792d29dc7e765b" },
-      { key: "index.html", contentType: "text/html; charset=utf-8", offset: 1997411, length: 4448, sha256: "22fbd62116f9571c6b01c1960990e392cce62198610eea2f661cb4d97bc05787" },
-      { key: "t5-frame.html", contentType: "text/html; charset=utf-8", offset: 2001859, length: 17209, sha256: "dffc9718e2faa63ae2cc919e0a842f585ed565aaaa7c53778e90379442c731b6" }
+      { key: "assets/index-DcmBzFl6.js", contentType: "application/javascript; charset=utf-8", offset: 8, length: 1030965, sha256: "e587f0db5f5d239871c73ee0976d387d6372768a239d04597e263f3c5bb0f395" },
+      { key: "fonts/Roboto-LICENSE.txt", contentType: "application/octet-stream", offset: 1030973, length: 4610, sha256: "994062dd7af4186a739de55dd9e151c63b6301f8e2cbafc608d35c2e87da0cd2" },
+      { key: "fonts/Roboto-Variable.ttf", contentType: "font/ttf", offset: 1035583, length: 488584, sha256: "d7598e12c5dbef095ff8272cfc55da0250bd07fbdecbac8a530b9b277872a134" },
+      { key: "fonts/WixMadeforDisplay-Bold.ttf", contentType: "font/ttf", offset: 1524167, length: 90924, sha256: "ec4c7d63772d980d6e147b2df6215fd2737e4b04cebe0cf7e11dc695fb63cdcf" },
+      { key: "fonts/WixMadeforDisplay-ExtraBold.ttf", contentType: "font/ttf", offset: 1615091, length: 90984, sha256: "bf4c16a2774edd38a921edf3099469866cd74c094fd596f3fa4e81f54a04dfaa" },
+      { key: "fonts/WixMadeforDisplay-Medium.ttf", contentType: "font/ttf", offset: 1706075, length: 90980, sha256: "368faca44fb9f7207e4af784e94750b1ee59c1098b8689e0f4a918926f244fb5" },
+      { key: "fonts/WixMadeforDisplay-Regular.ttf", contentType: "font/ttf", offset: 1797055, length: 90872, sha256: "97ed8f1a6772abe26e3d8af5cecfc4b02faa94497d585b0398b5053b739a70c1" },
+      { key: "fonts/WixMadeforDisplay-SemiBold.ttf", contentType: "font/ttf", offset: 1887927, length: 90980, sha256: "642feab8a48ddf6c7a89d7c2a7c0edfa0e6e773f671287e460e222703563191e" },
+      { key: "fonts/WixMadeforText-Bold.ttf", contentType: "font/ttf", offset: 1978907, length: 108636, sha256: "37c179b4fefb63ea9637322b84583a2df53aa226c150294eea1675c14b1b8e29" },
+      { key: "fonts/WixMadeforText-ExtraBold.ttf", contentType: "font/ttf", offset: 2087543, length: 109084, sha256: "62e2fe4718129f36ecdb0ae4de385bd6b81ecc876146447167c6c140fad699a9" },
+      { key: "fonts/WixMadeforText-Medium.ttf", contentType: "font/ttf", offset: 2196627, length: 109048, sha256: "4ecf270136af928612c76fe4ebade91d8156975e5ea4c0cf9225501dd1788e02" },
+      { key: "fonts/WixMadeforText-Regular.ttf", contentType: "font/ttf", offset: 2305675, length: 107700, sha256: "dee56f09fd3efc127c1ea95557edc74110c1460a46287da36e0af25efd341ef5" },
+      { key: "fonts/WixMadeforText-SemiBold.ttf", contentType: "font/ttf", offset: 2413375, length: 88108, sha256: "dced97a77624bc5f8b1ae65850360908297f4588e09feb6f22792d29dc7e765b" },
+      { key: "index.html", contentType: "text/html; charset=utf-8", offset: 2501483, length: 4947, sha256: "551ec6b86f9e791e00d12beddd0480448ef4ff37fa33d4c6529b21e91406a753" },
+      { key: "t5-frame.html", contentType: "text/html; charset=utf-8", offset: 2506430, length: 17209, sha256: "dffc9718e2faa63ae2cc919e0a842f585ed565aaaa7c53778e90379442c731b6" }
     ];
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/himalaya-cli",
-  "version": "0.1020.0",
+  "version": "0.1021.0",
   "type": "module",
   "description": "himi — the Himalaya authoring CLI. Build a Tier-5 content package on your own machine, push it to the production serve as a draft, preview it on web + Himi Player, and read worker logs back — the remote dev loop. Wraps @himalaya/serve-cli for transport.",
   "keywords": [
@@ -65,5 +65,5 @@
       "artifactId": "himalaya-cli"
     }
   },
-  "falconPackageHash": "74688239abb5b83cdc592a78513066472b921f1273d54470d9796cab"
+  "falconPackageHash": "d1be6f315217ca51d1f3bc16c0ce5d9d9e20bbc364b3a3a171c15ace"
 }