partforge 0.103.0 → 0.105.0

package/docs/AUTHORING-PARTS.md

@@ -2057,8 +2057,17 @@ see "Wiring a part into a runnable app", above, for its full signature):
 **The `allow` list, and what bypasses it.** All three controls take the same
 `allow` list already documented for `"font"` in the control-types table above
 (`"https"` — the default; `"gstatic"`, font-only, `https://fonts.gstatic.com`
-exactly; `"asset"`, a `pfc-asset://` token the host has stored for this part),
-gating what a **param-supplied** value may be. It never restricts a source an
+exactly; `"asset"`, a `pfc-asset://` token the host has stored for this part;
+`"tree"`, vector-only, a `pfc-tree://` token naming artwork that lives as a
+**file inside the part itself** rather than in host storage), gating what a
+**param-supplied** value may be.
+
+`"tree"` is vector-only by construction, not by omission: a part's files are
+text, so a `partforge-vector` JSON document can live in one and a PNG or a
+font cannot. Its payoff is that the artwork is versioned *with* the part —
+a host that stores parts as a file tree keeps the document in the same
+snapshot as the code that reads it, so publishing, history and undo carry the
+two together instead of leaving a param pointing at storage that moved on. It never restricts a source an
 author writes into `images`/`fonts`/`vectors` themselves — that's code, not
 user input.
 
@@ -2338,14 +2347,17 @@ yourself (e.g. to download from a different origin) instead of partforge's own D
   where `ImageAsset` is `{ id, label, url, width, height, thumbUrl }`. With no
   provider a `type: "image"` control degrades to a URL field.
 
-- `onAssetUpload(blob, { kind, filename }) → Promise<string>` — the drop target
-  shared by `"image"`/`"vector"`/`"font"` controls (see "Getting files into a
-  part", below) calls this with the converted artifact after a drop, paste, or
-  file-picker choice, and writes whatever it resolves to into the param.
-  `blob` is the CONVERTED artifact — a PNG, a partforge-vector JSON blob, or the
-  original file for a font — never the user's raw drop; `kind` is `"image"`,
-  `"vector"`, or `"font"`. Must resolve to a non-empty source string (an
-  `https:` URL or a host-defined `pfc-asset:` token); anything else is treated
+- `onAssetUpload(blob, { kind, key, filename }) → Promise<string>` — the drop
+  target shared by `"image"`/`"vector"`/`"font"` controls (see "Getting files
+  into a part", below) calls this with the converted artifact after a drop,
+  paste, or file-picker choice, and writes whatever it resolves to into the
+  param. `blob` is the CONVERTED artifact — a PNG, a partforge-vector JSON blob,
+  or the original file for a font — never the user's raw drop; `kind` is
+  `"image"`, `"vector"`, or `"font"`; `key` is the param the drop landed on,
+  which is what lets a host give each control a stable destination of its own
+  rather than reconciling uploads against the part afterwards. Must resolve to
+  a non-empty source string (an `https:` URL, or a host-defined `pfc-asset:` or
+  `pfc-tree:` token); anything else is treated
   as a contract violation and reported through the control's own error line,
   not written into the param. Omit it and the converted bytes land straight in
   the param instead — the path a host that cannot fetch URLs (the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "partforge",
-  "version": "0.103.0",
+  "version": "0.105.0",
   "description": "Turn a declarative part definition into a parametric-CAD web app (three.js + Manifold/Replicad). Requires a Vite-based consumer.",
   "type": "module",
   "license": "MIT",

package/src/framework/animation-controls.js

@@ -237,7 +237,16 @@ export function attachAnimationControls(viewer, part, {
   const nextAnimBtn = btn("pf-anim-page", "›", "Next animation");
   bar.append(prevAnimBtn, pick, title);
   const infoSlot = el("span", "pf-anim-info");
-  const playBtn = btn("pf-anim-play", "▶", "Play animation");
+  // Inline SVGs, not the ▶/⏸ characters: U+23F8 takes its EMOJI presentation
+  // on iOS, so the pause glyph rendered as a color sticker in an otherwise
+  // monochrome bar. Both glyphs are PERSISTENT children toggled by the
+  // data-playing attribute (app.css) — the WebKit click-loss rule below
+  // forbids replacing the button's children while a press may be down, and an
+  // attribute write never eats a click.
+  const playBtn = btn("pf-anim-play", null, "Play animation");
+  playBtn.innerHTML =
+    '<svg class="pf-anim-glyph-play" viewBox="0 0 24 24" width="14" height="14" fill="currentColor" aria-hidden="true"><path d="M7 4.5v15l13-7.5z"/></svg>'
+    + '<svg class="pf-anim-glyph-pause" viewBox="0 0 24 24" width="14" height="14" fill="currentColor" aria-hidden="true"><path d="M7 4.5h3.4v15H7zM13.6 4.5H17v15h-3.6z"/></svg>';
   const scrubWrap = el("span", "pf-anim-scrub-wrap");
   const scrub = document.createElement("input");
   scrub.type = "range";
@@ -404,10 +413,12 @@ export function attachAnimationControls(viewer, part, {
   // syncUi() runs on every playback frame. Two rules keep that from eating the
   // user's clicks, and they are independent:
   //
-  // 1. Text goes through textSetter (see above), so the button's text node is
-  //    mutated and never replaced. This is the one that matters, because it
-  //    holds even when the glyph legitimately changes under a held finger —
-  //    playback ending mid-press.
+  // 1. The play button's glyph flip is an ATTRIBUTE toggle over two persistent
+  //    SVG children (app.css keys which one shows on [data-playing]) — its
+  //    children are never touched after construction. This is the one that
+  //    matters, because it holds even when the glyph legitimately changes
+  //    under a held finger — playback ending mid-press. (The bubble's text
+  //    still goes through textSetter, the text-node form of the same rule.)
   // 2. Each element has its own renderer that leaves early when its own value
   //    is unchanged, so a playing transport touches only what actually moved:
   //    the scrubber's value, and aria-valuetext when it crosses a reporting
@@ -420,13 +431,12 @@ export function attachAnimationControls(viewer, part, {
   // for. Measured in WebKit, any press held >= 40ms lost it (a real click is
   // ~100ms; a synthetic 0ms one survives, which is why automated clicking never
   // saw it). Reset was never affected: nothing rewrites that button per frame.
-  const setPlayGlyph = textSetter(playBtn);
   let shownActive = null;
 
   function renderPlayButton(active) {
     if (active === shownActive) return;
     shownActive = active;
-    setPlayGlyph(active ? "⏸" : "▶");
+    playBtn.toggleAttribute("data-playing", active);
     const label = active ? "Pause animation" : "Play animation";
     playBtn.setAttribute("aria-label", label);
     playBtn.title = label;

package/src/framework/app.css

@@ -737,6 +737,14 @@ button.action:focus-visible, .adv-toggle:focus-visible, .sec-title:focus-visible
   cursor: pointer; font-size: 13px; padding: 2px 4px;
 }
 .pf-anim-bar button:hover { color: var(--pf-text-2); }
+/* Play/pause is two PERSISTENT inline SVGs toggled by [data-playing] — never
+   the ▶/⏸ characters (U+23F8 renders as a color emoji on iOS) and never a
+   child swap (WebKit drops a click whose press started on a replaced node —
+   see animation-controls.js). */
+.pf-anim-play { display: inline-flex; align-items: center; justify-content: center; }
+.pf-anim-play .pf-anim-glyph-pause { display: none; }
+.pf-anim-play[data-playing] .pf-anim-glyph-play { display: none; }
+.pf-anim-play[data-playing] .pf-anim-glyph-pause { display: block; }
 .pf-anim-title, .pf-anim-pick {
   font-family: var(--pf-mono); font-size: 11px; color: var(--pf-text-2);
 }
@@ -845,6 +853,20 @@ button.action:focus-visible, .adv-toggle:focus-visible, .sec-title:focus-visible
   .pf-anim-scrub { min-height: 44px; }
 }
 
+/* On a phone the full transport is a two-row player squatting on a small
+   stage. Collapse it to the decisions that matter — which animation, and
+   play/pause: the timeline, reset and ⓘ stand down below the narrow
+   breakpoint. WIDTH-keyed, deliberately not the coarse-pointer condition the
+   target-size block above shares: a coarse-pointer iPad has the room and
+   keeps the full transport; only the small screen loses the player bar.
+   Playback itself still visits every chapter; scrubbing wants a real
+   screen. */
+@media (max-width: 719px) {
+  .pf-anim-bar .pf-anim-scrub-wrap,
+  .pf-anim-bar .pf-anim-reset,
+  .pf-anim-bar .pf-anim-info { display: none; }
+}
+
 /* Legacy id-only markup only: classed markup's viewbar lives inside .pf-stage
    (bottom-right, see chrome.css's .pf-float-viewbar) so it never meets the
    top-left floating #panel card. Legacy markup still floats #viewbar top-right

package/src/framework/panel/widgets/file-drop.js

@@ -96,7 +96,7 @@ function el(tag, className, text) {
 // The click path is dropped rather than hidden, deliberately: an invisible
 // overlay that still swallowed clicks would eat the button underneath it, which
 // is the one affordance ambient mode exists to protect.
-export function makeFileDrop({ kind, onSource, onError, onAssetUpload, ambient = false }) {
+export function makeFileDrop({ kind, key, onSource, onError, onAssetUpload, ambient = false }) {
   const row = rowFor(kind);
   const wrap = el("div", ambient ? "file-drop file-drop-ambient" : "file-drop");
   if (!ambient) {
@@ -219,7 +219,14 @@ export function makeFileDrop({ kind, onSource, onError, onAssetUpload, ambient =
 
     if (onAssetUpload) {
       try {
-        const source = await onAssetUpload(artifact.blob, { kind, filename: file.name });
+        // `key` is the PARAM the drop landed on. A host needs it to give a
+        // control a stable destination of its own — partforge-cloud derives
+        // one file path per key, so re-dropping replaces that control's
+        // artwork in place instead of accumulating files it must later
+        // reconcile against the part. Purely informational to partforge:
+        // the hook still answers with a source string and nothing here
+        // reads the key back.
+        const source = await onAssetUpload(artifact.blob, { kind, key, filename: file.name });
         if (stale()) return;
         // A host hook that resolves to anything but a non-empty string —
         // `undefined`, an object, `""` — is a contract violation, not a
@@ -329,6 +336,7 @@ export function mountDrop(kind, { params, node, onAssetUpload, onChange, onCommi
 
   const drop = makeFileDrop({
     kind,
+    key: node.key,
     ambient,
     onAssetUpload,
     onSource: (source) => {

package/src/framework/vector-source.js

@@ -52,6 +52,14 @@ import { unwrapModule } from "./asset-resolve.js";
 export const VECTOR_ALLOW_DEFAULT = ["https"];
 
 const ASSET_SCHEME = "pfc-asset:";
+// Artwork that lives as a FILE IN THE PART ITSELF, addressed by its path
+// rather than by a host-side storage id. Vector-only, and the asymmetry is
+// structural rather than an omission: a part's files are text, so a JSON
+// document can live in one and a PNG cannot. A host that stores parts as a
+// file tree (partforge-cloud is the motivating case) resolves this scheme
+// against that tree; partforge itself only decides whether a param may carry
+// it, exactly as it does for `pfc-asset:`.
+const TREE_SCHEME = "pfc-tree:";
 
 // The "unset" vector source. An empty value declares NO artwork for that
 // name — mirrors isNoFontSource/isNoImageSource exactly. Never a source to
@@ -94,6 +102,7 @@ export function vectorSourceAllowed(source, allow = VECTOR_ALLOW_DEFAULT) {
     // "pfc-asset://" must not pass, and neither must a lookalike host.
     if (kind === "https" && u.protocol === "https:") return true;
     if (kind === "asset" && u.protocol === ASSET_SCHEME) return true;
+    if (kind === "tree" && u.protocol === TREE_SCHEME) return true;
   }
   return false;
 }