@jgengine/shell 0.10.0 → 0.11.0

package/dist/terrain/grassGeometry.d.ts

@@ -22,6 +22,9 @@ export interface ResolvedGrassBladeGeometryOptions {
     bend: readonly [min: number, max: number];
     heightAt: TerrainHeightSampler;
 }
+/** @internal */
 export declare function resolveGrassRange(value: GrassRange | undefined, fallback: readonly [number, number]): readonly [number, number];
+/** @internal */
 export declare function resolveGrassBladeGeometryOptions(options?: GrassBladeGeometryOptions): ResolvedGrassBladeGeometryOptions;
+/** @internal */
 export declare function createGrassBladeGeometry(options?: GrassBladeGeometryOptions): THREE.InstancedBufferGeometry;

package/dist/terrain/grassGeometry.js

@@ -1,11 +1,13 @@
 import * as THREE from "three";
 import { createSeededRandom } from "./random.js";
 import { resolveTerrainSize } from "./terrainMath.js";
+/** @internal */
 export function resolveGrassRange(value, fallback) {
     if (value === undefined)
         return fallback;
     return typeof value === "number" ? [value, value] : value;
 }
+/** @internal */
 export function resolveGrassBladeGeometryOptions(options = {}) {
     return {
         count: Math.max(0, Math.floor(options.count ?? 1500)),
@@ -21,6 +23,7 @@ export function resolveGrassBladeGeometryOptions(options = {}) {
 function randomRange(random, range) {
     return THREE.MathUtils.lerp(range[0], range[1], random());
 }
+/** @internal */
 export function createGrassBladeGeometry(options = {}) {
     const resolved = resolveGrassBladeGeometryOptions(options);
     const size = resolveTerrainSize(resolved.area);

package/dist/terrain/grassMaterial.d.ts

@@ -29,5 +29,7 @@ export interface GrassMaterialHandle {
     uniforms: GrassShaderUniforms;
 }
 export declare const DEFAULT_GRASS_WIND: Required<GrassWindOptions>;
+/** @internal */
 export declare function resolveGrassWind(wind: GrassWindOptions | false | undefined): Required<GrassWindOptions>;
+/** @internal */
 export declare function createGrassMaterial(options?: GrassMaterialOptions): GrassMaterialHandle;

package/dist/terrain/grassMaterial.js

@@ -10,6 +10,7 @@ function normalizeWindDirection(direction) {
     const vector = new THREE.Vector2(direction[0], direction[1]);
     return vector.lengthSq() === 0 ? new THREE.Vector2(1, 0) : vector.normalize();
 }
+/** @internal */
 export function resolveGrassWind(wind) {
     if (wind === false)
         return { ...DEFAULT_GRASS_WIND, strength: 0, flutter: 0 };
@@ -21,6 +22,7 @@ export function resolveGrassWind(wind) {
         flutter: wind?.flutter ?? DEFAULT_GRASS_WIND.flutter,
     };
 }
+/** @internal */
 export function createGrassMaterial(options = {}) {
     const wind = resolveGrassWind(options.wind);
     const uniforms = {

package/dist/terrain/random.d.ts

@@ -1,4 +1,7 @@
 export type TerrainSeed = number | string;
+/** @internal */
 export declare function seedToUint32(seed?: TerrainSeed): number;
+/** @internal */
 export declare function createSeededRandom(seed?: TerrainSeed): () => number;
+/** @internal */
 export declare function hashNoise2(x: number, z: number, seed?: TerrainSeed): number;

package/dist/terrain/random.js

@@ -1,3 +1,4 @@
+/** @internal */
 export function seedToUint32(seed = 1) {
     if (typeof seed === "number")
         return seed >>> 0;
@@ -8,6 +9,7 @@ export function seedToUint32(seed = 1) {
     }
     return hash >>> 0;
 }
+/** @internal */
 export function createSeededRandom(seed = 1) {
     let state = seedToUint32(seed);
     return () => {
@@ -18,6 +20,7 @@ export function createSeededRandom(seed = 1) {
         return ((value ^ (value >>> 14)) >>> 0) / 4294967296;
     };
 }
+/** @internal */
 export function hashNoise2(x, z, seed = 1) {
     let hash = seedToUint32(seed);
     hash ^= Math.imul(x | 0, 374761393);

package/dist/terrain/soilPatchMaterial.d.ts

@@ -0,0 +1,10 @@
+import * as THREE from "three";
+import type { SoilRules } from "@jgengine/core/world/soilKind";
+/**
+ * A `MeshStandardMaterial` for one authored `soil` volume: a base dirt tint with a Worley crack-line
+ * network and an FBM moss-patch overlay injected via `onBeforeCompile`, seeded from `rules.seed`. Full
+ * PBR — lit, shadowed, fogged — like the terrain detail material it borrows its noise machinery from.
+ * A game never calls this directly — author a soil patch via the editor's `soil` studio kind.
+ * @internal
+ */
+export declare function createSoilPatchMaterial(rules: SoilRules): THREE.MeshStandardMaterial;

package/dist/terrain/soilPatchMaterial.js

@@ -0,0 +1,109 @@
+import * as THREE from "three";
+/**
+ * Worley (F1/F2 cellular) crack mask + FBM moss mask — the same noise-driven-shader technique as
+ * `terrainDetailMaterial.ts`'s rock/sand/snow blend, injected here via `onBeforeCompile` into a
+ * dedicated soil-patch material instead of the whole-ground detail material. `F2 - F1` (the gap
+ * between nearest and second-nearest Worley feature distances) goes to zero right at a cell boundary,
+ * which reads as a network of cracked-earth veins once thresholded — the standard "cracked ground"
+ * shader trick.
+ */
+const SOIL_NOISE_GLSL = /* glsl */ `
+uint jgSoilHashUint(uvec2 v){
+  uint x = v.x * 1664525u + v.y * 1013904223u;
+  x = (x ^ (x >> 16u)) * 2246822519u;
+  x = (x ^ (x >> 13u)) * 3266489917u;
+  x = x ^ (x >> 16u);
+  return x;
+}
+float jgSoilHash1(vec2 p){
+  return float(jgSoilHashUint(uvec2(floor(p)))) * (1.0 / 4294967296.0);
+}
+vec2 jgSoilHash2(vec2 p){
+  uvec2 base = uvec2(floor(p));
+  float a = float(jgSoilHashUint(base)) * (1.0 / 4294967296.0);
+  float b = float(jgSoilHashUint(base + uvec2(19u, 47u))) * (1.0 / 4294967296.0);
+  return vec2(a, b);
+}
+float jgSoilVNoise(vec2 p){
+  vec2 i = floor(p); vec2 f = fract(p);
+  vec2 u = f * f * (3.0 - 2.0 * f);
+  float a = jgSoilHash1(i);
+  float b = jgSoilHash1(i + vec2(1.0, 0.0));
+  float c = jgSoilHash1(i + vec2(0.0, 1.0));
+  float d = jgSoilHash1(i + vec2(1.0, 1.0));
+  return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);
+}
+float jgSoilFbm(vec2 p){
+  float v = 0.0; float amp = 0.5;
+  for (int i = 0; i < 4; i++){ v += amp * jgSoilVNoise(p); p *= 2.0; amp *= 0.5; }
+  return v;
+}
+vec2 jgSoilWorleyF1F2(vec2 p){
+  vec2 ip = floor(p);
+  vec2 fp = fract(p);
+  float f1 = 8.0; float f2 = 8.0;
+  for (int y = -1; y <= 1; y++){
+    for (int x = -1; x <= 1; x++){
+      vec2 neighbor = vec2(float(x), float(y));
+      vec2 point = jgSoilHash2(ip + neighbor);
+      float dist = length(neighbor + point - fp);
+      if (dist < f1) { f2 = f1; f1 = dist; }
+      else if (dist < f2) { f2 = dist; }
+    }
+  }
+  return vec2(f1, f2);
+}
+`;
+function hashSeed(text) {
+    let h = 2166136261 >>> 0;
+    for (let i = 0; i < text.length; i += 1) {
+        h ^= text.charCodeAt(i);
+        h = Math.imul(h, 16777619);
+    }
+    return (h >>> 0) % 100000;
+}
+/**
+ * A `MeshStandardMaterial` for one authored `soil` volume: a base dirt tint with a Worley crack-line
+ * network and an FBM moss-patch overlay injected via `onBeforeCompile`, seeded from `rules.seed`. Full
+ * PBR — lit, shadowed, fogged — like the terrain detail material it borrows its noise machinery from.
+ * A game never calls this directly — author a soil patch via the editor's `soil` studio kind.
+ * @internal
+ */
+export function createSoilPatchMaterial(rules) {
+    const seedOffset = hashSeed(rules.seed);
+    const material = new THREE.MeshStandardMaterial({
+        color: rules.baseColor,
+        roughness: 0.92,
+        metalness: 0,
+    });
+    material.onBeforeCompile = (shader) => {
+        shader.uniforms.uSoilCrackColor = { value: new THREE.Color(rules.crackColor) };
+        shader.uniforms.uSoilCrackScale = { value: Math.max(0.1, rules.crackScale) };
+        shader.uniforms.uSoilCrackIntensity = { value: rules.crackIntensity };
+        shader.uniforms.uSoilMossColor = { value: new THREE.Color(rules.mossColor) };
+        shader.uniforms.uSoilMossCoverage = { value: rules.mossCoverage };
+        shader.uniforms.uSoilSeed = { value: seedOffset };
+        shader.vertexShader = shader.vertexShader.replace("#include <common>", `#include <common>
+varying vec3 vJgSoilWorldPos;`).replace("#include <begin_vertex>", `#include <begin_vertex>
+vJgSoilWorldPos = (modelMatrix * vec4(transformed, 1.0)).xyz;`);
+        shader.fragmentShader = shader.fragmentShader.replace("#include <common>", `#include <common>
+varying vec3 vJgSoilWorldPos;
+uniform vec3 uSoilCrackColor;
+uniform float uSoilCrackScale;
+uniform float uSoilCrackIntensity;
+uniform vec3 uSoilMossColor;
+uniform float uSoilMossCoverage;
+uniform float uSoilSeed;
+${SOIL_NOISE_GLSL}`).replace("#include <color_fragment>", `#include <color_fragment>
+vec2 jgSoilP = vJgSoilWorldPos.xz + vec2(uSoilSeed * 0.37, uSoilSeed * 0.71);
+vec2 jgSoilF1F2 = jgSoilWorleyF1F2(jgSoilP / uSoilCrackScale);
+float jgSoilCrack = 1.0 - smoothstep(0.0, 0.1, jgSoilF1F2.y - jgSoilF1F2.x);
+vec3 jgSoilCol = mix(diffuseColor.rgb, uSoilCrackColor, jgSoilCrack * uSoilCrackIntensity);
+float jgSoilMossN = jgSoilFbm(jgSoilP / 2.4);
+float jgSoilMossMask = smoothstep(1.0 - uSoilMossCoverage, 1.0 - uSoilMossCoverage + 0.18, jgSoilMossN);
+jgSoilCol = mix(jgSoilCol, uSoilMossColor, jgSoilMossMask);
+diffuseColor.rgb = jgSoilCol;`);
+    };
+    material.customProgramCacheKey = () => `jgengine-soil-${rules.crackScale}-${rules.crackIntensity}-${rules.mossCoverage}-${seedOffset}`;
+    return material;
+}

package/dist/terrain/terrainDetailMaterial.d.ts

@@ -4,11 +4,28 @@ import type { ResolvedTerrainDetail } from "@jgengine/core/world/terrain";
 export interface TerrainDetailMaterialHandle {
     material: THREE.MeshStandardMaterial;
 }
+/**
+ * Loaded PBR textures matching a resolved `ResolvedTerrainDetailMaterial.maps`' roles. The caller
+ * (a React component, via `useTexture`/`useLoader`) owns loading and disposal; `core` never touches
+ * `THREE.Texture` and this shell function never fetches a URL itself.
+ */
+export interface TerrainDetailMaterialTextures {
+    color: THREE.Texture;
+    normal: THREE.Texture;
+    roughness: THREE.Texture;
+    ao: THREE.Texture;
+}
 /**
  * A `MeshStandardMaterial` whose fragment shader keeps the biome-tinted vertex
  * colour as the base ground and blends procedural, noise-broken rock (by slope),
  * sand (by waterline), and snow (by height) over it — textured-reading terrain
  * with no image assets. Full PBR: lit, shadowed, and fogged like any standard
  * material, so it composes with the post-processing chain.
- */
-export declare function createTerrainDetailMaterial(detail: ResolvedTerrainDetail): TerrainDetailMaterialHandle;
+ *
+ * When `detail.material` is set, pass the matching loaded `textures` (color/normal/roughness/ao):
+ * they tile by world position at `detail.material.repeat` world units per tile and blend over the
+ * procedural result at `detail.material.strength` — the real-texture seam layers onto the existing
+ * look instead of replacing it.
+  * @internal
+  */
+export declare function createTerrainDetailMaterial(detail: ResolvedTerrainDetail, textures?: TerrainDetailMaterialTextures): TerrainDetailMaterialHandle;

package/dist/terrain/terrainDetailMaterial.js

@@ -1,6 +1,16 @@
 import * as THREE from "three";
 const NOISE_GLSL = /* glsl */ `
-float jgHash(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
+uint jgHashUint(uvec2 v){
+  uint x = v.x * 1664525u + v.y * 1013904223u;
+  x = (x ^ (x >> 16u)) * 2246822519u;
+  x = (x ^ (x >> 13u)) * 3266489917u;
+  x = x ^ (x >> 16u);
+  return x;
+}
+float jgHash(vec2 p){
+  ivec2 i = ivec2(floor(p));
+  return float(jgHashUint(uvec2(i))) * (1.0 / 4294967296.0);
+}
 float jgVNoise(vec2 p){
   vec2 i = floor(p); vec2 f = fract(p);
   vec2 u = f * f * (3.0 - 2.0 * f);
@@ -22,8 +32,17 @@ float jgFbm(vec2 p){
  * sand (by waterline), and snow (by height) over it — textured-reading terrain
  * with no image assets. Full PBR: lit, shadowed, and fogged like any standard
  * material, so it composes with the post-processing chain.
- */
-export function createTerrainDetailMaterial(detail) {
+ *
+ * When `detail.material` is set, pass the matching loaded `textures` (color/normal/roughness/ao):
+ * they tile by world position at `detail.material.repeat` world units per tile and blend over the
+ * procedural result at `detail.material.strength` — the real-texture seam layers onto the existing
+ * look instead of replacing it.
+  * @internal
+  */
+export function createTerrainDetailMaterial(detail, textures) {
+    const hasTexture = textures !== undefined && detail.material !== undefined;
+    const repeat = detail.material?.repeat ?? 4;
+    const strength = detail.material?.strength ?? 1;
     const uniforms = {
         uRockColor: { value: new THREE.Color(detail.rockColor) },
         uSandColor: { value: new THREE.Color(detail.sandColor) },
@@ -34,6 +53,16 @@ export function createTerrainDetailMaterial(detail) {
         uDetailScale: { value: Math.max(0.5, detail.detailScale) },
         uMacroScale: { value: Math.max(0.5, detail.macroScale) },
         uStrength: { value: detail.strength },
+        ...(hasTexture
+            ? {
+                uMatColor: { value: textures.color },
+                uMatNormal: { value: textures.normal },
+                uMatRoughness: { value: textures.roughness },
+                uMatAo: { value: textures.ao },
+                uMatRepeat: { value: Math.max(0.01, repeat) },
+                uMatStrength: { value: strength },
+            }
+            : {}),
     };
     const material = new THREE.MeshStandardMaterial({
         color: "#ffffff",
@@ -51,6 +80,36 @@ varying vec3 vJgWorldNormal;`)
 vJgWorldNormal = normalize(mat3(modelMatrix) * objectNormal);`)
             .replace("#include <begin_vertex>", `#include <begin_vertex>
 vJgWorldPos = (modelMatrix * vec4(transformed, 1.0)).xyz;`);
+        const materialUniformsGlsl = hasTexture
+            ? `
+uniform sampler2D uMatColor;
+uniform sampler2D uMatNormal;
+uniform sampler2D uMatRoughness;
+uniform sampler2D uMatAo;
+uniform float uMatRepeat;
+uniform float uMatStrength;`
+            : "";
+        const materialColorGlsl = hasTexture
+            ? `
+vec2 jgMatUv = jgWp / uMatRepeat;
+vec3 jgMatColor = texture2D(uMatColor, jgMatUv).rgb;
+jgCol = mix(jgCol, jgMatColor, uMatStrength);`
+            : "";
+        const materialRoughnessGlsl = hasTexture
+            ? `
+float jgMatRough = texture2D(uMatRoughness, jgMatUv).g;
+roughnessFactor = mix(roughnessFactor, jgMatRough, uMatStrength);`
+            : "";
+        const materialNormalGlsl = hasTexture
+            ? `
+vec2 jgMatNormalXy = texture2D(uMatNormal, jgMatUv).rg * 2.0 - 1.0;
+normal = normalize(normal + vec3(jgMatNormalXy.x, 0.0, jgMatNormalXy.y) * uMatStrength * 0.6);`
+            : "";
+        const materialAoGlsl = hasTexture
+            ? `
+float jgMatAo = texture2D(uMatAo, jgMatUv).r;
+reflectedLight.indirectDiffuse *= mix(1.0, jgMatAo, uMatStrength);`
+            : "";
         shader.fragmentShader = shader.fragmentShader
             .replace("#include <common>", `#include <common>
 varying vec3 vJgWorldPos;
@@ -64,6 +123,7 @@ uniform float uWaterLevel;
 uniform float uDetailScale;
 uniform float uMacroScale;
 uniform float uStrength;
+${materialUniformsGlsl}
 ${NOISE_GLSL}`)
             .replace("#include <color_fragment>", `#include <color_fragment>
 vec2 jgWp = vJgWorldPos.xz;
@@ -83,8 +143,15 @@ jgCol = mix(jgCol, jgSand, jgSandW);
 vec3 jgSnow = uSnowColor * mix(0.94, 1.04, jgFine);
 float jgSnowW = smoothstep(uSnowHeight, uSnowHeight + 8.0, jgH) * (1.0 - jgRockW * 0.6) * uStrength;
 jgCol = mix(jgCol, jgSnow, jgSnowW);
-diffuseColor.rgb = jgCol;`);
+${materialColorGlsl}
+diffuseColor.rgb = jgCol;`)
+            .replace("#include <roughnessmap_fragment>", `#include <roughnessmap_fragment>
+${materialRoughnessGlsl}`)
+            .replace("#include <normal_fragment_maps>", `#include <normal_fragment_maps>
+${materialNormalGlsl}`)
+            .replace("#include <aomap_fragment>", `#include <aomap_fragment>
+${materialAoGlsl}`);
     };
-    material.customProgramCacheKey = () => `jgengine-terrain-detail-${detail.rockSlopeStart}-${detail.snowHeight}`;
+    material.customProgramCacheKey = () => `jgengine-terrain-detail-${detail.rockSlopeStart}-${detail.snowHeight}-${hasTexture ? "tex" : "flat"}`;
     return { material };
 }

package/dist/terrain/terrainMath.d.ts

@@ -27,10 +27,15 @@ export interface TerrainVertexColorOptions {
     waterline?: THREE.ColorRepresentation;
     waterlineHeight?: number;
 }
+/** @internal */
 export declare function normalizeHeightBlend(height: number, minHeight: number, maxHeight: number): number;
+/** @internal */
 export declare function resolveTerrainSize(size?: TerrainArea): ResolvedTerrainSize;
+/** @internal */
 export declare function resolveTerrainSegments(segments?: ProceduralTerrainConfig["segments"]): ResolvedTerrainSegments;
+/** @internal */
 export declare function toNoiseFieldConfig(config?: ProceduralTerrainConfig): NoiseFieldConfig;
+/** @internal */
 export declare function createProceduralTerrainSampler(config?: ProceduralTerrainConfig): TerrainHeightSampler;
 /** Per-position palette override for multi-biome ground coloring — `createTerrainPaletteSampler` from `@jgengine/core/world/terrain` returns exactly this shape. */
 export type TerrainPaletteSampler = (x: number, z: number) => {
@@ -51,6 +56,8 @@ export interface FieldGroundOptions {
  * Mesh any `TerrainField` — including a `CarvableField` with craters/mounds written into it — into a
  * vertex-coloured ground geometry. `sampleHeight` drives the vertices, so runtime carves show up as
  * real depressions the moment the field is re-sampled (bump the caller's rebuild key after a carve).
- */
+  * @internal
+  */
 export declare function createFieldGroundGeometry(field: TerrainField, options?: FieldGroundOptions): THREE.BufferGeometry;
+/** @internal */
 export declare function createProceduralGroundGeometry(config?: ProceduralTerrainConfig, colors?: TerrainVertexColorOptions): THREE.BufferGeometry;

package/dist/terrain/terrainMath.js

@@ -1,21 +1,25 @@
 import { noiseField } from "@jgengine/core/world/terrain";
 import * as THREE from "three";
 import {} from "./random.js";
+/** @internal */
 export function normalizeHeightBlend(height, minHeight, maxHeight) {
     const range = maxHeight - minHeight;
     if (range <= 1e-6)
         return 0.5;
     return THREE.MathUtils.clamp((height - minHeight) / range, 0, 1);
 }
+/** @internal */
 export function resolveTerrainSize(size = 40) {
     return typeof size === "number" ? { width: size, depth: size } : { width: size[0], depth: size[1] };
 }
+/** @internal */
 export function resolveTerrainSegments(segments = 96) {
     if (typeof segments !== "number")
         return { x: Math.max(1, Math.floor(segments[0])), z: Math.max(1, Math.floor(segments[1])) };
     const resolved = Math.max(1, Math.floor(segments));
     return { x: resolved, z: resolved };
 }
+/** @internal */
 export function toNoiseFieldConfig(config = {}) {
     return {
         seed: config.seed,
@@ -26,6 +30,7 @@ export function toNoiseFieldConfig(config = {}) {
         baseHeight: config.baseOffset ?? 0,
     };
 }
+/** @internal */
 export function createProceduralTerrainSampler(config = {}) {
     return noiseField(toNoiseFieldConfig(config)).sampleHeight;
 }
@@ -33,7 +38,8 @@ export function createProceduralTerrainSampler(config = {}) {
  * Mesh any `TerrainField` — including a `CarvableField` with craters/mounds written into it — into a
  * vertex-coloured ground geometry. `sampleHeight` drives the vertices, so runtime carves show up as
  * real depressions the moment the field is re-sampled (bump the caller's rebuild key after a carve).
- */
+  * @internal
+  */
 export function createFieldGroundGeometry(field, options = {}) {
     const size = resolveTerrainSize(options.size);
     const segments = resolveTerrainSegments(options.segments);
@@ -118,6 +124,7 @@ function buildGroundGeometry(size, segments, sampler, opts) {
     geometry.computeBoundingSphere();
     return geometry;
 }
+/** @internal */
 export function createProceduralGroundGeometry(config = {}, colors = {}) {
     const size = resolveTerrainSize(config.size);
     const segments = resolveTerrainSegments(config.segments);

package/dist/touch/TouchControlsOverlay.d.ts

@@ -1,5 +1,5 @@
 import { type MutableRefObject } from "react";
-import { type TouchScheme } from "@jgengine/core/input/touchScheme";
+import { type TouchScheme, type TouchStyle } from "@jgengine/core/input/touchScheme";
 export interface TouchCodeSink {
     onCodeDown(code: string): void;
     onCodeUp(code: string): void;
@@ -14,9 +14,11 @@ export declare function primaryButtonOffsets(count: number, scale?: number): {
     bottom: number;
 }[] | null;
 /**
- * Vertical space (px, excluding device safe areas) the dock occupies above
- * the bottom edge. The shell publishes it as `--jg-hud-dock-clearance` so
- * `HudCanvas` regions never collide with touch controls.
+ * Vertical space (px, excluding device safe areas) that *bottom-docked* clusters
+ * occupy above the bottom edge. The shell publishes it as
+ * `--jg-hud-dock-clearance` so `HudCanvas` regions never collide with touch
+ * controls. Side rails and top clusters reserve their own rectangles through the
+ * layout registry instead of this scalar.
  */
 export declare function touchDockClearance(scheme: TouchScheme | null, scale?: number): number;
 export declare function TouchPlaySurface({ scheme, sink, yawRef, pitchRef, maxPitch, onPrimaryTap, }: {
@@ -27,8 +29,10 @@ export declare function TouchPlaySurface({ scheme, sink, yawRef, pitchRef, maxPi
     maxPitch: number;
     onPrimaryTap: () => void;
 }): import("react").JSX.Element;
-export declare function TouchControlsDock({ scheme, sink, scale }: {
+export declare function TouchControlsDock({ scheme, sink, style, scale, }: {
     scheme: TouchScheme;
     sink: TouchCodeSink;
+    /** Player-selected skin; falls back to the scheme's game default. */
+    style?: TouchStyle;
     scale?: number;
 }): import("react").JSX.Element;