jaml-ui 0.30.0 → 0.32.1

package/dist/r3f.js.map

@@ -1 +1 @@
-{"version":3,"file":"r3f.js","names":[],"sources":["../src/r3f/Card3D.tsx","../src/r3f/JimboBillboard.tsx","../src/r3f/JimboText3D.tsx"],"sourcesContent":["'use client'\r\n\r\nimport { useRef, useMemo, useState, memo } from 'react'\r\nimport { useFrame, useLoader, type ThreeEvent } from '@react-three/fiber'\r\nimport { useSpring, animated } from '@react-spring/three'\r\nimport * as THREE from 'three'\r\nimport type { MotelySpriteData } from '../decode/motelySprite.js'\r\n\r\n// eslint-disable-next-line react-refresh/only-export-components\r\nexport const CARD_DIMENSIONS = { WIDTH: 0.7, HEIGHT: 0.95, DEPTH: 0.02 } as const\r\n// eslint-disable-next-line react-refresh/only-export-components\r\nexport const CARD_MAGNET = {\r\n  MAX_TILT_X: 0.36,\r\n  MAX_TILT_Y: 0.42,\r\n  MAX_SHIFT: 0.038,\r\n  TWIST_Z: 0.11,\r\n  LERP_IN: 18,\r\n  LERP_OUT: 10,\r\n} as const\r\n\r\nfunction useSpriteTexture(sprite: MotelySpriteData) {\r\n  const texture = useLoader(THREE.TextureLoader, sprite.atlasPath);\r\n  \r\n  return useMemo(() => {\r\n    const t = texture.clone();\r\n    t.colorSpace = THREE.SRGBColorSpace;\r\n    t.magFilter = THREE.NearestFilter;\r\n    t.minFilter = THREE.NearestFilter;\r\n    t.repeat.set(1 / sprite.gridCols, 1 / sprite.gridRows);\r\n    t.offset.set(\r\n      sprite.gridCol / sprite.gridCols,\r\n      1 - ((sprite.gridRow + 1) / sprite.gridRows)\r\n    );\r\n    t.needsUpdate = true;\r\n    return t;\r\n  }, [texture, sprite.gridCol, sprite.gridRow, sprite.gridCols, sprite.gridRows]);\r\n}\r\n\r\nexport interface Card3DProps {\r\n  sprite: MotelySpriteData\r\n  position?: [number, number, number]\r\n  rotation?: [number, number, number]\r\n  selected?: boolean\r\n  highlighted?: boolean\r\n  onClick?: () => void\r\n  onPointerEnter?: () => void\r\n  onPointerLeave?: () => void\r\n}\r\n\r\nexport const Card3D = memo(function Card3D({\r\n  sprite,\r\n  position = [0, 0, 0],\r\n  rotation = [0, 0, 0],\r\n  selected = false,\r\n  highlighted = false,\r\n  onClick,\r\n  onPointerEnter,\r\n  onPointerLeave,\r\n}: Card3DProps) {\r\n  const tiltRef = useRef<THREE.Group>(null)\r\n  const target = useRef({ rx: 0, ry: 0, rz: 0, ox: 0, oy: 0 })\r\n  const [hovered, setHovered] = useState(false)\r\n\r\n  const texture = useSpriteTexture(sprite)\r\n\r\n  const { posY, scale } = useSpring({\r\n    posY: selected ? 0.3 : hovered ? 0.15 : 0,\r\n    scale: hovered ? 1.08 : selected ? 1.05 : 1,\r\n    config: { tension: 300, friction: 20 },\r\n  })\r\n\r\n  useFrame((_state, dt) => {\r\n    const g = tiltRef.current\r\n    if (!g) return\r\n    const t = target.current\r\n    const rate = hovered ? CARD_MAGNET.LERP_IN : CARD_MAGNET.LERP_OUT\r\n    const a = 1 - Math.exp(-rate * dt)\r\n    g.rotation.x = THREE.MathUtils.lerp(g.rotation.x, t.rx, a)\r\n    g.rotation.y = THREE.MathUtils.lerp(g.rotation.y, t.ry, a)\r\n    g.rotation.z = THREE.MathUtils.lerp(g.rotation.z, t.rz, a)\r\n    g.position.x = THREE.MathUtils.lerp(g.position.x, t.ox, a)\r\n    g.position.y = THREE.MathUtils.lerp(g.position.y, t.oy, a)\r\n  })\r\n\r\n  const glowColor = useMemo(() => highlighted ? '#e4b643' : '#ffffff', [highlighted])\r\n\r\n  const onMove = (e: ThreeEvent<PointerEvent>) => {\r\n    e.stopPropagation()\r\n    const uv = e.uv\r\n    if (!uv) return\r\n    const nx = THREE.MathUtils.clamp((uv.x - 0.5) * 2, -1, 1)\r\n    const ny = THREE.MathUtils.clamp((uv.y - 0.5) * 2, -1, 1)\r\n    target.current.ry = -nx * CARD_MAGNET.MAX_TILT_Y\r\n    target.current.rx =  ny * CARD_MAGNET.MAX_TILT_X\r\n    target.current.rz = -nx * ny * CARD_MAGNET.TWIST_Z\r\n    target.current.ox =  nx * CARD_MAGNET.MAX_SHIFT\r\n    target.current.oy = -ny * CARD_MAGNET.MAX_SHIFT * 0.65\r\n  }\r\n\r\n  const reset = () => { target.current = { rx: 0, ry: 0, rz: 0, ox: 0, oy: 0 } }\r\n\r\n  if (!texture) return null\r\n\r\n  return (\r\n    <animated.group\r\n      position-x={position[0]}\r\n      position-y={posY.to((y) => position[1] + y)}\r\n      position-z={position[2]}\r\n      rotation-x={rotation[0]}\r\n      rotation-y={rotation[1]}\r\n      rotation-z={rotation[2]}\r\n      scale={scale}\r\n    >\r\n      {/* Invisible hit mesh that does not shift or twist, preventing boop-cancel loops */}\r\n      <mesh\r\n        visible={false}\r\n        onClick={(e) => { e.stopPropagation(); onClick?.() }}\r\n        onPointerMove={onMove}\r\n        onPointerEnter={(e) => { e.stopPropagation(); setHovered(true); onPointerEnter?.(); document.body.style.cursor = 'pointer' }}\r\n        onPointerLeave={(e) => { e.stopPropagation(); setHovered(false); reset(); onPointerLeave?.(); document.body.style.cursor = 'auto' }}\r\n      >\r\n        <boxGeometry args={[CARD_DIMENSIONS.WIDTH, CARD_DIMENSIONS.HEIGHT, CARD_DIMENSIONS.DEPTH * 2]} />\r\n        <meshBasicMaterial />\r\n      </mesh>\r\n\r\n      <group ref={tiltRef}>\r\n        {highlighted && (\r\n          <pointLight color={glowColor} intensity={1.5} distance={1} position={[0, 0, 0.1]} />\r\n        )}\r\n        <mesh castShadow receiveShadow>\r\n          <boxGeometry args={[CARD_DIMENSIONS.WIDTH, CARD_DIMENSIONS.HEIGHT, CARD_DIMENSIONS.DEPTH]} />\r\n          <meshBasicMaterial attach=\"material-4\" map={texture} toneMapped={false} />\r\n          <meshStandardMaterial attach=\"material-5\" color=\"#1a1a2e\" metalness={0.2} roughness={0.8} />\r\n          <meshStandardMaterial attach=\"material-0\" color=\"#f5f5dc\" />\r\n          <meshStandardMaterial attach=\"material-1\" color=\"#f5f5dc\" />\r\n          <meshStandardMaterial attach=\"material-2\" color=\"#f5f5dc\" />\r\n          <meshStandardMaterial attach=\"material-3\" color=\"#f5f5dc\" />\r\n        </mesh>\r\n        {selected && (\r\n          <mesh position={[0, 0, -CARD_DIMENSIONS.DEPTH]}>\r\n            <ringGeometry args={[0.45, 0.5, 32]} />\r\n            <meshBasicMaterial color=\"#e4b643\" transparent opacity={0.8} />\r\n          </mesh>\r\n        )}\r\n      </group>\r\n    </animated.group>\r\n  )\r\n})\r\n","import React, { useMemo } from 'react'\r\nimport { Billboard } from '@react-three/drei'\r\nimport { useLoader } from '@react-three/fiber'\r\nimport * as THREE from 'three'\r\nimport type { MotelySpriteData } from '../decode/motelySprite.js'\r\n\r\nexport interface JimboBillboardProps {\r\n  sprite: MotelySpriteData | null\r\n  label?: string\r\n  width?: number\r\n  height?: number\r\n  yLockOnly?: boolean\r\n  position?: [number, number, number]\r\n}\r\n\r\nexport function JimboBillboard(props: JimboBillboardProps) {\r\n  if (!props.sprite) return null;\r\n  return <JimboBillboardInner {...props} sprite={props.sprite} />;\r\n}\r\n\r\nfunction JimboBillboardInner({\r\n  sprite,\r\n  width = 3.4,\r\n  height = 4.5,\r\n  yLockOnly = false,\r\n  position = [0, 0, 0]\r\n}: Omit<JimboBillboardProps, 'sprite'> & { sprite: MotelySpriteData }) {\r\n  // Memoize texture to avoid per-render allocation\r\n  const texture = useLoader(THREE.TextureLoader, sprite.atlasPath);\r\n\r\n  const clonedTexture = useMemo(() => {\r\n    const tex = texture.clone();\r\n    tex.magFilter = THREE.NearestFilter;\r\n    tex.minFilter = THREE.NearestFilter;\r\n    // Set up sprite cropping\r\n    tex.repeat.set(1 / sprite.gridCols, 1 / sprite.gridRows);\r\n    tex.offset.set(\r\n      sprite.gridCol / sprite.gridCols,\r\n      1 - ((sprite.gridRow + 1) / sprite.gridRows)\r\n    );\r\n    tex.needsUpdate = true;\r\n    return tex;\r\n  }, [texture, sprite.gridCol, sprite.gridRow, sprite.gridCols, sprite.gridRows]);\r\n\r\n  const material = useMemo(() => {\r\n    return new THREE.MeshBasicMaterial({\r\n      map: clonedTexture,\r\n      transparent: true,\r\n      alphaTest: 0.5\r\n    });\r\n  }, [clonedTexture]);\r\n\r\n  return (\r\n    <Billboard\r\n      lockY={yLockOnly}\r\n      lockX={false}\r\n      lockZ={false}\r\n      position={position}\r\n    >\r\n      <mesh material={material}>\r\n        <planeGeometry args={[width, height]} />\r\n      </mesh>\r\n    </Billboard>\r\n  )\r\n}\r\n","import React from 'react'\r\nimport { Text } from '@react-three/drei'\r\nimport { resolveJamlAssetUrl } from '../assets.js'\r\nimport { JimboColorOption } from '../ui/tokens.js'\r\n\r\nexport interface JimboText3DProps {\r\n  children: string\r\n  color?: string\r\n  outlineColor?: string\r\n  outlineWidth?: number\r\n  position?: [number, number, number]\r\n  fontSize?: number\r\n}\r\n\r\nexport function JimboText3D({\r\n  children,\r\n  color = JimboColorOption.WHITE,\r\n  outlineColor = JimboColorOption.BLACK,\r\n  outlineWidth = 0.05,\r\n  position = [0, 0, 0],\r\n  fontSize = 1\r\n}: JimboText3DProps) {\r\n  // We use the m6x11plus font from assets if possible, or fallback\r\n  return (\r\n    <Text\r\n      position={position}\r\n      fontSize={fontSize}\r\n      color={color}\r\n      outlineColor={outlineColor}\r\n      outlineWidth={outlineWidth}\r\n      font={resolveJamlAssetUrl('font')}\r\n      anchorX=\"center\"\r\n      anchorY=\"middle\"\r\n    >\r\n      {children}\r\n    </Text>\r\n  )\r\n}\r\n"],"mappings":"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"}
+{"version":3,"file":"r3f.js","names":[],"sources":["../src/r3f/Card3D.tsx","../src/r3f/JimboBillboard.tsx","../src/r3f/JimboText3D.tsx"],"sourcesContent":["'use client'\n\nimport { useRef, useMemo, useState, memo } from 'react'\nimport { useFrame, useLoader, type ThreeEvent } from '@react-three/fiber'\nimport { useSpring, animated } from '@react-spring/three'\nimport * as THREE from 'three'\nimport type { MotelySpriteData } from '../decode/motelySprite.js'\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport const CARD_DIMENSIONS = { WIDTH: 0.7, HEIGHT: 0.95, DEPTH: 0.02 } as const\n// eslint-disable-next-line react-refresh/only-export-components\nexport const CARD_MAGNET = {\n  MAX_TILT_X: 0.36,\n  MAX_TILT_Y: 0.42,\n  MAX_SHIFT: 0.038,\n  TWIST_Z: 0.11,\n  LERP_IN: 18,\n  LERP_OUT: 10,\n} as const\n\nfunction useSpriteTexture(sprite: MotelySpriteData) {\n  const texture = useLoader(THREE.TextureLoader, sprite.atlasPath);\n  \n  return useMemo(() => {\n    const t = texture.clone();\n    t.colorSpace = THREE.SRGBColorSpace;\n    t.magFilter = THREE.NearestFilter;\n    t.minFilter = THREE.NearestFilter;\n    t.repeat.set(1 / sprite.gridCols, 1 / sprite.gridRows);\n    t.offset.set(\n      sprite.gridCol / sprite.gridCols,\n      1 - ((sprite.gridRow + 1) / sprite.gridRows)\n    );\n    t.needsUpdate = true;\n    return t;\n  }, [texture, sprite.gridCol, sprite.gridRow, sprite.gridCols, sprite.gridRows]);\n}\n\nexport interface Card3DProps {\n  sprite: MotelySpriteData\n  position?: [number, number, number]\n  rotation?: [number, number, number]\n  selected?: boolean\n  highlighted?: boolean\n  onClick?: () => void\n  onPointerEnter?: () => void\n  onPointerLeave?: () => void\n}\n\nexport const Card3D = memo(function Card3D({\n  sprite,\n  position = [0, 0, 0],\n  rotation = [0, 0, 0],\n  selected = false,\n  highlighted = false,\n  onClick,\n  onPointerEnter,\n  onPointerLeave,\n}: Card3DProps) {\n  const tiltRef = useRef<THREE.Group>(null)\n  const target = useRef({ rx: 0, ry: 0, rz: 0, ox: 0, oy: 0 })\n  const [hovered, setHovered] = useState(false)\n\n  const texture = useSpriteTexture(sprite)\n\n  const { posY, scale } = useSpring({\n    posY: selected ? 0.3 : hovered ? 0.15 : 0,\n    scale: hovered ? 1.08 : selected ? 1.05 : 1,\n    config: { tension: 300, friction: 20 },\n  })\n\n  useFrame((_state, dt) => {\n    const g = tiltRef.current\n    if (!g) return\n    const t = target.current\n    const rate = hovered ? CARD_MAGNET.LERP_IN : CARD_MAGNET.LERP_OUT\n    const a = 1 - Math.exp(-rate * dt)\n    g.rotation.x = THREE.MathUtils.lerp(g.rotation.x, t.rx, a)\n    g.rotation.y = THREE.MathUtils.lerp(g.rotation.y, t.ry, a)\n    g.rotation.z = THREE.MathUtils.lerp(g.rotation.z, t.rz, a)\n    g.position.x = THREE.MathUtils.lerp(g.position.x, t.ox, a)\n    g.position.y = THREE.MathUtils.lerp(g.position.y, t.oy, a)\n  })\n\n  const glowColor = useMemo(() => highlighted ? '#e4b643' : '#ffffff', [highlighted])\n\n  const onMove = (e: ThreeEvent<PointerEvent>) => {\n    e.stopPropagation()\n    const uv = e.uv\n    if (!uv) return\n    const nx = THREE.MathUtils.clamp((uv.x - 0.5) * 2, -1, 1)\n    const ny = THREE.MathUtils.clamp((uv.y - 0.5) * 2, -1, 1)\n    target.current.ry = -nx * CARD_MAGNET.MAX_TILT_Y\n    target.current.rx =  ny * CARD_MAGNET.MAX_TILT_X\n    target.current.rz = -nx * ny * CARD_MAGNET.TWIST_Z\n    target.current.ox =  nx * CARD_MAGNET.MAX_SHIFT\n    target.current.oy = -ny * CARD_MAGNET.MAX_SHIFT * 0.65\n  }\n\n  const reset = () => { target.current = { rx: 0, ry: 0, rz: 0, ox: 0, oy: 0 } }\n\n  if (!texture) return null\n\n  return (\n    <animated.group\n      position-x={position[0]}\n      position-y={posY.to((y) => position[1] + y)}\n      position-z={position[2]}\n      rotation-x={rotation[0]}\n      rotation-y={rotation[1]}\n      rotation-z={rotation[2]}\n      scale={scale}\n    >\n      {/* Invisible hit mesh that does not shift or twist, preventing boop-cancel loops */}\n      <mesh\n        visible={false}\n        onClick={(e) => { e.stopPropagation(); onClick?.() }}\n        onPointerMove={onMove}\n        onPointerEnter={(e) => { e.stopPropagation(); setHovered(true); onPointerEnter?.(); document.body.style.cursor = 'pointer' }}\n        onPointerLeave={(e) => { e.stopPropagation(); setHovered(false); reset(); onPointerLeave?.(); document.body.style.cursor = 'auto' }}\n      >\n        <boxGeometry args={[CARD_DIMENSIONS.WIDTH, CARD_DIMENSIONS.HEIGHT, CARD_DIMENSIONS.DEPTH * 2]} />\n        <meshBasicMaterial />\n      </mesh>\n\n      <group ref={tiltRef}>\n        {highlighted && (\n          <pointLight color={glowColor} intensity={1.5} distance={1} position={[0, 0, 0.1]} />\n        )}\n        <mesh castShadow receiveShadow>\n          <boxGeometry args={[CARD_DIMENSIONS.WIDTH, CARD_DIMENSIONS.HEIGHT, CARD_DIMENSIONS.DEPTH]} />\n          <meshBasicMaterial attach=\"material-4\" map={texture} toneMapped={false} />\n          <meshStandardMaterial attach=\"material-5\" color=\"#1a1a2e\" metalness={0.2} roughness={0.8} />\n          <meshStandardMaterial attach=\"material-0\" color=\"#f5f5dc\" />\n          <meshStandardMaterial attach=\"material-1\" color=\"#f5f5dc\" />\n          <meshStandardMaterial attach=\"material-2\" color=\"#f5f5dc\" />\n          <meshStandardMaterial attach=\"material-3\" color=\"#f5f5dc\" />\n        </mesh>\n        {selected && (\n          <mesh position={[0, 0, -CARD_DIMENSIONS.DEPTH]}>\n            <ringGeometry args={[0.45, 0.5, 32]} />\n            <meshBasicMaterial color=\"#e4b643\" transparent opacity={0.8} />\n          </mesh>\n        )}\n      </group>\n    </animated.group>\n  )\n})\n","import React, { useMemo } from 'react'\nimport { Billboard } from '@react-three/drei'\nimport { useLoader } from '@react-three/fiber'\nimport * as THREE from 'three'\nimport type { MotelySpriteData } from '../decode/motelySprite.js'\n\nexport interface JimboBillboardProps {\n  sprite: MotelySpriteData | null\n  label?: string\n  width?: number\n  height?: number\n  yLockOnly?: boolean\n  position?: [number, number, number]\n}\n\nexport function JimboBillboard(props: JimboBillboardProps) {\n  if (!props.sprite) return null;\n  return <JimboBillboardInner {...props} sprite={props.sprite} />;\n}\n\nfunction JimboBillboardInner({\n  sprite,\n  width = 3.4,\n  height = 4.5,\n  yLockOnly = false,\n  position = [0, 0, 0]\n}: Omit<JimboBillboardProps, 'sprite'> & { sprite: MotelySpriteData }) {\n  // Memoize texture to avoid per-render allocation\n  const texture = useLoader(THREE.TextureLoader, sprite.atlasPath);\n\n  const clonedTexture = useMemo(() => {\n    const tex = texture.clone();\n    tex.magFilter = THREE.NearestFilter;\n    tex.minFilter = THREE.NearestFilter;\n    // Set up sprite cropping\n    tex.repeat.set(1 / sprite.gridCols, 1 / sprite.gridRows);\n    tex.offset.set(\n      sprite.gridCol / sprite.gridCols,\n      1 - ((sprite.gridRow + 1) / sprite.gridRows)\n    );\n    tex.needsUpdate = true;\n    return tex;\n  }, [texture, sprite.gridCol, sprite.gridRow, sprite.gridCols, sprite.gridRows]);\n\n  const material = useMemo(() => {\n    return new THREE.MeshBasicMaterial({\n      map: clonedTexture,\n      transparent: true,\n      alphaTest: 0.5\n    });\n  }, [clonedTexture]);\n\n  return (\n    <Billboard\n      lockY={yLockOnly}\n      lockX={false}\n      lockZ={false}\n      position={position}\n    >\n      <mesh material={material}>\n        <planeGeometry args={[width, height]} />\n      </mesh>\n    </Billboard>\n  )\n}\n","import React from 'react'\nimport { Text } from '@react-three/drei'\nimport { resolveJamlAssetUrl } from '../assets.js'\nimport { JimboColorOption } from '../ui/tokens.js'\n\nexport interface JimboText3DProps {\n  children: string\n  color?: string\n  outlineColor?: string\n  outlineWidth?: number\n  position?: [number, number, number]\n  fontSize?: number\n}\n\nexport function JimboText3D({\n  children,\n  color = JimboColorOption.WHITE,\n  outlineColor = JimboColorOption.BLACK,\n  outlineWidth = 0.05,\n  position = [0, 0, 0],\n  fontSize = 1\n}: JimboText3DProps) {\n  // We use the m6x11plus font from assets if possible, or fallback\n  return (\n    <Text\n      position={position}\n      fontSize={fontSize}\n      color={color}\n      outlineColor={outlineColor}\n      outlineWidth={outlineWidth}\n      font={resolveJamlAssetUrl('font')}\n      anchorX=\"center\"\n      anchorY=\"middle\"\n    >\n      {children}\n    </Text>\n  )\n}\n"],"mappings":"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"}

package/dist/ui/JimboBadge.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-export type JimboBadgeTone = 'dark' | 'blue' | 'red' | 'green' | 'gold' | 'grey' | 'orange' | 'purple';
+export type JimboBadgeTone = 'dark' | 'blue' | 'red' | 'green' | 'grey' | 'orange' | 'purple';
 export interface JimboBadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
     size?: 'sm' | 'md';
     tone?: JimboBadgeTone;

package/dist/ui/{footer.d.ts → JimboBalatroFooter.d.ts}

@@ -8,7 +8,9 @@ export interface JimboBalatroFooterProps {
     children?: React.ReactNode;
 }
 /**
- * Attribution footer with animated suit cycle.
- * Always rendered — required attribution for using Balatro art.
+ * Fan-site attribution footer with Balatro link. The "Balatro" in the name is
+ * load-bearing — this footer is the public disclosure that the project is a
+ * non-profit, rule-following, PlayStack-aware fan site. Always rendered;
+ * required attribution for using Balatro art.
  */
 export declare function JimboBalatroFooter({ hidden, className, children }: JimboBalatroFooterProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/ui/JimboButton.d.ts

@@ -0,0 +1,62 @@
+export type JimboTone = 'orange' | 'red' | 'blue' | 'green' | 'tarot' | 'planet' | 'spectral' | 'grey';
+declare const SIZE_TO_DIMS: {
+    readonly xs: {
+        readonly w: 1.4;
+        readonly h: 0.42;
+        readonly depth: 0.12;
+        readonly fontSize: 0.22;
+    };
+    readonly sm: {
+        readonly w: 1.8;
+        readonly h: 0.52;
+        readonly depth: 0.14;
+        readonly fontSize: 0.26;
+    };
+    readonly md: {
+        readonly w: 2.4;
+        readonly h: 0.66;
+        readonly depth: 0.16;
+        readonly fontSize: 0.3;
+    };
+    readonly lg: {
+        readonly w: 3;
+        readonly h: 0.82;
+        readonly depth: 0.18;
+        readonly fontSize: 0.36;
+    };
+};
+export type JimboButtonSize = keyof typeof SIZE_TO_DIMS;
+export interface JimboButtonProps {
+    tone?: JimboTone;
+    size?: JimboButtonSize;
+    disabled?: boolean;
+    fullWidth?: boolean;
+    onClick?: () => void;
+    /** Button label. Non-string children are coerced via `String()`. For
+     *  buttons that need icons + multi-line text, use a different primitive
+     *  (e.g. JimboInfoCard with an onClick), not JimboButton. */
+    children: React.ReactNode;
+    /** Outer wrapper width in pixels. Default sized to the button. */
+    canvasWidth?: number;
+    /** Outer wrapper height in pixels. Default sized to the button. */
+    canvasHeight?: number;
+    /** Inline style applied to the outer wrapper div (not the 3D mesh). */
+    style?: React.CSSProperties;
+    className?: string;
+}
+/**
+ * The Jimbo button. R3F-native: each button is its own Canvas with
+ * @react-spring/three driving hover lift + click press, magnetic tilt on
+ * pointer move, and sub-pixel idle sway at rest. There is no DOM fallback —
+ * R3F is the only implementation.
+ */
+export declare const JimboButton: import('react').NamedExoticComponent<JimboButtonProps>;
+/**
+ * Canonical "back" button. Orange, full-width, label "Back". Used by
+ * `JimboPanel` and `JimboModal` when `onBack` / `showBack` is set.
+ */
+export declare function JimboBackButton({ onClick, size }: {
+    onClick?: () => void;
+    size?: JimboButtonSize;
+}): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/ui/JimboCopyButton.d.ts

@@ -0,0 +1,27 @@
+import { JimboTone } from './panel.js';
+export interface JimboCopyButtonProps {
+    /** Value placed on the clipboard when the button is clicked. */
+    value: string;
+    /** Label while idle. Default "Copy". */
+    label?: string;
+    /** Label briefly shown after a successful copy. Default "Copied". */
+    copiedLabel?: string;
+    /** Button tone. Default blue for standalone copy actions; seed rows use
+     *  JimboSeedCopyChip (WeeJoker harvest) instead. */
+    tone?: JimboTone;
+    /** Button size. Default "sm". */
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    /** How long to display the copied label, in ms. Default 1500. */
+    copiedDurationMs?: number;
+    /** Fired after the clipboard write resolves. */
+    onCopy?: () => void;
+    className?: string;
+}
+/**
+ * The canonical copy-to-clipboard button. Single tone (red by default —
+ * stays red through the click; only the label briefly swaps to "Copied").
+ * Reusable everywhere a copy action lives: seed copy rows, code blocks,
+ * filter sharing, etc. — instead of every consumer rolling its own
+ * `<JimboButton onClick={...}>Copy</JimboButton>` + setTimeout dance.
+ */
+export declare function JimboCopyButton({ value, label, copiedLabel, tone, size, copiedDurationMs, onCopy, className, }: JimboCopyButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboDeckAndStakeSelectorModal.d.ts

@@ -0,0 +1,30 @@
+import { default as React } from 'react';
+export interface JimboDeckAndStakeSelectorModalProps {
+    /** Whether the modal is open. */
+    open: boolean;
+    /** Called when the user dismisses via the back button. */
+    onClose: () => void;
+    /** All decks the user can cycle through, in spinner order. */
+    decks: string[];
+    /** All stakes the user can cycle through, in spinner order. */
+    stakes: string[];
+    /** Currently selected deck name (must appear in `decks`). */
+    deck: string;
+    /** Currently selected stake name (must appear in `stakes`). */
+    stake: string;
+    onDeckChange: (next: string) => void;
+    onStakeChange: (next: string) => void;
+    /** Modal title text. Default: "Search seeds for". */
+    title?: string;
+    /** Description rendered under each deck / stake title. */
+    deckDescription?: (deck: string) => React.ReactNode;
+    stakeDescription?: (stake: string) => React.ReactNode;
+}
+/**
+ * Modal that lets a seed hunter pick the deck + stake combination they want
+ * to search seeds against. Pure JimboUI composition — `JimboModal`, two
+ * `JimboPanelSpinner`s, deck + stake sprites. No motely-wasm dependency; the
+ * caller passes deck/stake names as strings (convert from `MotelyDeck` /
+ * `MotelyStake` enums at the boundary).
+ */
+export declare function JimboDeckAndStakeSelectorModal({ open, onClose, decks, stakes, deck, stake, onDeckChange, onStakeChange, title, deckDescription, stakeDescription, }: JimboDeckAndStakeSelectorModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboDualChip.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+export type JimboDualChipTone = 'blue' | 'red' | 'green' | 'gold' | 'dark';
+export interface JimboDualChipHalf {
+    value: React.ReactNode;
+    tone: JimboDualChipTone;
+    label?: string;
+}
+export interface JimboDualChipProps {
+    left: JimboDualChipHalf;
+    right: JimboDualChipHalf;
+    className?: string;
+}
+/**
+ * Two stat halves joined into one pill. Used for the `0 × 0` Hands × Discards
+ * chip on Balatro's run-info side panel.
+ */
+export declare function JimboDualChip({ left, right, className }: JimboDualChipProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboIconButton.d.ts

@@ -1,10 +1,15 @@
 import { default as React } from 'react';
+export type JimboIconButtonTone = "default" | "destructive";
 export interface JimboIconButtonProps {
     "aria-label"?: string;
     children: React.ReactNode;
     disabled?: boolean;
-    onClick?: () => void;
-    size?: "sm" | "md";
+    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    /** Pass-through for drag-start guards (e.g. stopPropagation inside draggable rows). */
+    onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    onTouchStart?: (e: React.TouchEvent<HTMLButtonElement>) => void;
+    size?: "xs" | "sm" | "md";
+    tone?: JimboIconButtonTone;
     title?: string;
 }
-export declare function JimboIconButton({ onClick, title, "aria-label": ariaLabel, disabled, size, children, }: JimboIconButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function JimboIconButton({ onClick, onMouseDown, onTouchStart, title, "aria-label": ariaLabel, disabled, size, tone, children, }: JimboIconButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboInlineEdit.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export type JimboInlineEditSize = 'xs' | 'sm' | 'md' | 'lg';
+export type JimboInlineEditTone = 'white' | 'gold' | 'grey';
+export interface JimboInlineEditProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Visual size — echoes JimboText size scale. */
+    size?: JimboInlineEditSize;
+    tone?: JimboInlineEditTone;
+    /** Render at reduced opacity (e.g. description-style sub-text). */
+    dim?: boolean;
+}
+/**
+ * Borderless transparent input that reads as inline text until focused —
+ * for editable titles, bylines, or descriptions inside cards/panels.
+ * Focus chrome only shows on keyboard navigation so mouse use stays clean.
+ */
+export declare const JimboInlineEdit: React.ForwardRefExoticComponent<JimboInlineEditProps & React.RefAttributes<HTMLInputElement>>;

package/dist/ui/JimboListItem.d.ts

@@ -0,0 +1,11 @@
+import { default as React } from 'react';
+export interface JimboListItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Visual + a11y active state. Renders the selected/hover palette. */
+    active?: boolean;
+}
+/**
+ * Clickable list row. Use anywhere a vertical stack of selectable rows is
+ * needed — filter browsers, seed lists, saved-search picker, etc. Composes
+ * `.j-list-item` from jimbo.css; pass extra layout inside via children.
+ */
+export declare const JimboListItem: React.ForwardRefExoticComponent<JimboListItemProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/ui/JimboPanelSplitter.d.ts

@@ -0,0 +1,8 @@
+export interface JimboPanelSplitterProps {
+    "aria-label"?: string;
+    className?: string;
+    onDrag: (delta: number) => void;
+    onKeyAdjust?: (delta: number) => void;
+    orientation?: "vertical" | "horizontal";
+}
+export declare function JimboPanelSplitter({ orientation, onDrag, onKeyAdjust, className, "aria-label": ariaLabel, }: JimboPanelSplitterProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboSeedCopyChip.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export interface JimboSeedCopyChipProps {
+    value: string;
+    placeholder?: string;
+    disabled?: boolean;
+    copiedLabel?: string;
+    copiedDurationMs?: number;
+    onCopy?: (value: string) => void;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Harvested from WeeJoker SeedCard — tap-to-copy seed row with icon + value.
+ * Idle: copy icon + seed. Copied: green check + brief confirmation label.
+ */
+export declare function JimboSeedCopyChip({ value, placeholder, disabled, copiedLabel, copiedDurationMs, onCopy, className, style, }: JimboSeedCopyChipProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboSelect.d.ts

@@ -5,14 +5,26 @@ export interface JimboSelectOption {
     value: string;
 }
 export interface JimboSelectProps {
-    "aria-label"?: string;
+    'aria-label'?: string;
     disabled?: boolean;
     fullWidth?: boolean;
     onChange: (value: string) => void;
     options: JimboSelectOption[] | string[];
     placeholder?: string;
-    size?: "sm" | "md";
+    size?: 'sm' | 'md';
     style?: React.CSSProperties;
     value: string;
+    label?: string;
 }
-export declare function JimboSelect({ value, options, onChange, placeholder, disabled, fullWidth, size, style, "aria-label": ariaLabel, }: JimboSelectProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Select one of N values. There is no native `<select>` in the Balatro UI
+ * language — options are cycled with arrows, not via an OS dropdown. So
+ * JimboSelect is a `< value >` JimboSpinner that cycles through the options
+ * list. If `value` isn't in `options`, we land on the first option.
+ *
+ * Was previously a raw `<select>` element with hand-painted gold-arrow CSS
+ * gradients. That was off-brand on every axis (native control, gold control
+ * affordance, no JimboButton). Rewritten to compose JimboSpinner so it
+ * behaves like every other selector in the design system.
+ */
+export declare function JimboSelect({ value, options, onChange, disabled, label, 'aria-label': ariaLabel, style, }: JimboSelectProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/ui/JimboSlider.d.ts

@@ -0,0 +1,11 @@
+export interface JimboSliderProps {
+    value: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    label?: string;
+    onChange?: (value: number) => void;
+    className?: string;
+    id?: string;
+}
+export declare function JimboSlider({ value, min, max, step, label, onChange, className, id, }: JimboSliderProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboSpinner.d.ts

@@ -0,0 +1,18 @@
+export interface JimboSpinnerProps {
+    value: string | number;
+    label?: string;
+    onPrev?: () => void;
+    onNext?: () => void;
+    canPrev?: boolean;
+    canNext?: boolean;
+    className?: string;
+}
+/**
+ * Two-state-or-more value spinner: red `<` button + value chip + red `>` button.
+ * This is the canonical Balatro on/off control (IMG_3678: `Shadows < OFF >`)
+ * AND the canonical option-cycler (deck/stake/aesthetic picker).
+ *
+ * Note: previously named JimboStepper — that was a misnomer. A stepper is a
+ * page-dot indicator (see JimboStepper). This is a spinner.
+ */
+export declare function JimboSpinner({ value, label, onPrev, onNext, canPrev, canNext, className, }: JimboSpinnerProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboStepper.d.ts

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+export interface JimboStepperProps {
+    /** Total number of pages/steps. */
+    count: number;
+    /** Current page index (0-based). */
+    index: number;
+    /** Optional click handler to jump to a specific page. */
+    onIndexChange?: (i: number) => void;
+    /** Label for screen readers describing what the dots track. */
+    ariaLabel?: string;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Page-dot indicator. A row of small circles: the active page is a filled
+ * white dot; the others are dim grey dots. Matches Balatro's carousel page
+ * indicator pattern (deck picker, blind preview, etc.).
+ *
+ * For the value spinner pattern (`< OFF >`) see JimboSpinner — different
+ * component, despite the previous misnomer.
+ */
+export declare function JimboStepper({ count, index, onIndexChange, ariaLabel, className, style, }: JimboStepperProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/ui/JimboToggleList.d.ts

@@ -7,5 +7,6 @@ export interface JimboToggleListProps {
     items: ToggleItem[];
     onToggle: (id: string) => void;
     title?: string;
+    variant?: 'row' | 'stacked';
 }
-export declare function JimboToggleList({ items, onToggle, title }: JimboToggleListProps): import("react/jsx-runtime").JSX.Element;
+export declare function JimboToggleList({ items, onToggle, title, variant }: JimboToggleListProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/JimboValueBadge.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+export interface JimboValueBadgeProps {
+    value: number;
+    onChange?: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    unit?: string;
+    /** Disables click-to-edit; renders as a read-only display badge. */
+    readOnly?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Red pill displaying a numeric value. Click to edit inline; Enter or blur
+ * commits (clamped to [min, max] and snapped to `step`); Escape cancels.
+ * Used as the thumb on JimboSlider and as a standalone numeric chip in panels.
+ */
+export declare function JimboValueBadge({ value, onChange, min, max, step, unit, readOnly, className, style, }: JimboValueBadgeProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/codeBlock.d.ts

@@ -4,4 +4,8 @@ export interface JimboCodeBlockProps {
     filename?: string;
     className?: string;
 }
+/**
+ * Code block with filename + language chip + JimboCopyButton. Pure Jimbo
+ * primitives end to end; the copy logic lives in JimboCopyButton.
+ */
 export declare function JimboCodeBlock({ code, language, filename, className }: JimboCodeBlockProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/hooks.d.ts

@@ -12,11 +12,36 @@ export declare function useDelayedVisibility(open: boolean, delay: number): {
     visible: boolean;
     opacity: number;
 };
+export type JimboBackgroundColor = string | [number, number, number];
+export interface JimboBackgroundConfig {
+    /** Three palette colors. Each can be `#RRGGBB` / `#RGB` or `[r,g,b]` in 0..1. */
+    primary?: JimboBackgroundColor;
+    secondary?: JimboBackgroundColor;
+    dark?: JimboBackgroundColor;
+    /** Animation speed multiplier on top of the base SPIN_SPEED. Default 1. */
+    speed?: number;
+    /** Twirl rotation seed (default -2). */
+    spinRotation?: number;
+    /** How much the twirl warps the field, 0..1ish (default 0.35). */
+    spinAmount?: number;
+    /** Pixelation. Higher = finer pixels (default ~244 = 740*0.33). */
+    pixelFilter?: number;
+    /** Contrast multiplier (default 4.5). */
+    contrast?: number;
+    /** Bright lighting amount (default 0.5). */
+    lighting?: number;
+    /** Color transition duration in ms when palette changes. Default 800. */
+    transitionMs?: number;
+}
 /**
  * Hook for the Balatro hypnotic swirl background.
  * Manages WebGL context, shader compilation, and animation loop.
+ *
+ * All shader constants are exposed as uniforms so they can be tuned at
+ * runtime. Palette and scalar uniforms (pixelFilter, contrast, spin, etc.)
+ * interpolate over `transitionMs` so control changes fade smoothly.
  */
-export declare function useBalatroBackground(): React.RefObject<HTMLCanvasElement | null>;
+export declare function useBalatroBackground(config?: JimboBackgroundConfig): React.RefObject<HTMLCanvasElement | null>;
 export type JimboTooltipMode = 'snap' | 'mouse';
 export type JimboTooltipPlacement = 'top' | 'bottom' | 'auto';
 /**
@@ -87,8 +112,10 @@ export declare function useJamlIdeDrag(filter: JamlVisualFilter, onChange: (filt
     onDragStart: (e: React.MouseEvent | React.TouchEvent, clause: JamlVisualClause, fromZone: JamlZone) => void;
 };
 /**
- * Provides a magnetic 3D tilt effect for DOM elements, replicating the 'juice' of Balatro cards.
- * Ensures the hit-detection area remains stable by separating container events from the transformed style.
+ * Provides a magnetic 3D tilt effect for DOM elements, replicating the hover-follow
+ * of Balatro cards. Continuous (tracks the cursor). For 3D/spring-physics button
+ * juice prefer `JimboButton3D` from `jaml-ui/r3f`, which uses the canonical
+ * pmndrs stack (@react-three/fiber + @react-spring/three).
  */
 export declare function useDOMMagneticTilt(enabled?: boolean): {
     handlers: {