vintage-frames 0.12.1 → 0.12.3

package/dist/components/vf-desktop.d.ts

@@ -65,7 +65,10 @@ declare const VfDesktop_base: (new (...args: any[]) => import("../position.js").
  * icon reaches it without an import, the menu-handshake idiom: on a drag's
  * first step it dispatches `vf-drag-surface-request` (bubbles, non-composed,
  * `detail.surface` null), and the nearest desktop on its light-DOM path
- * fills the detail with the layer. Not the top layer: stable Safari cannot
+ * fills the detail with the layer. A window asks the same way and draws
+ * there with the same pen: its zoom rects when it opens from a rect
+ * (`vf-window.show({ from })`), its outline under an `outline-drag`. Not the
+ * top layer: stable Safari cannot
  * blend an element there against the page (src/cursor.ts), and a second
  * kit entry in the top layer would need a re-promotion handshake.
  *
@@ -307,10 +310,11 @@ export declare class VfDesktop extends VfDesktop_base {
      */
     private _onGestureEnd;
     /**
-     * A dragged icon asking for the screen's drag surface (see the class
-     * doc). Non-composed, so it reaches here only through the light-DOM path
-     * the icon is slotted on — a window body included. The nearest desktop
-     * answers; an outer one leaves a filled detail alone.
+     * A dragged icon, or a window opening from a rect, asking for the screen's
+     * drag surface (see the class doc). Non-composed, so it reaches here only
+     * through the light-DOM path the asker is slotted on — a window body
+     * included. The nearest desktop answers; an outer one leaves a filled
+     * detail alone.
      */
     private _onDragSurfaceRequest;
     /**

package/dist/components/vf-icon-field.js

@@ -7,13 +7,13 @@ import { vfBase as o } from "../styles/recipes/host.js";
 import { DocumentListenersController as s } from "../document-listeners.js";
 import { VfSized as c } from "../size.js";
 import "../motion.js";
-import { paintSelectionRect as l, penPhase as u } from "../open-art.js";
-import { LitElement as d, css as f, html as p } from "lit";
-import { property as m } from "lit/decorators.js";
+import { paintSelectionRect as l, penPhase as u, xorPenCanvas as d } from "../open-art.js";
+import { LitElement as f, css as p, html as m } from "lit";
+import { property as h } from "lit/decorators.js";
 //#region src/components/vf-icon-field.ts
-var h = (e, t, n) => Math.min(Math.max(e, t), n), g = class extends c(a(d)) {
+var g = (e, t, n) => Math.min(Math.max(e, t), n), _ = class extends c(a(f)) {
 	static {
-		this.styles = [o, f`
+		this.styles = [o, p`
       :host {
         /* A block that shrink-wraps: the field is exactly as big as what it
            holds in flow — nothing, for a field of placed icons — so it can
@@ -137,8 +137,8 @@ var h = (e, t, n) => Math.min(Math.max(e, t), n), g = class extends c(a(d)) {
 	}
 	#h(e, t, n, r) {
 		return {
-			x: h(Math.round((e.clientX - t.left) / n), r.minX, r.maxX),
-			y: h(Math.round((e.clientY - t.top) / n), r.minY, r.maxY)
+			x: g(Math.round((e.clientX - t.left) / n), r.minX, r.maxX),
+			y: g(Math.round((e.clientY - t.top) / n), r.minY, r.maxY)
 		};
 	}
 	#g(e, t) {
@@ -172,10 +172,8 @@ var h = (e, t, n) => Math.min(Math.max(e, t), n), g = class extends c(a(d)) {
 		};
 	}
 	#v() {
-		let e = document.createElement("canvas");
-		e.className = "selection-rect";
-		let t = e.style;
-		return t.position = "fixed", t.display = "block", t.pointerEvents = "none", t.filter = "invert(1)", t.mixBlendMode = "difference", t.imageRendering = "pixelated", e;
+		let e = d("selection-rect");
+		return e.style.position = "fixed", e;
 	}
 	#y(e, t) {
 		let { rect: n, canvas: r } = e;
@@ -238,9 +236,9 @@ var h = (e, t, n) => Math.min(Math.max(e, t), n), g = class extends c(a(d)) {
 		e.finished || (e.finished = !0, this.#r === e && (this.#r = null, this.#i.detach()), e.settle());
 	}
 	render() {
-		return p`<slot @slotchange=${this.#s}></slot>`;
+		return m`<slot @slotchange=${this.#s}></slot>`;
 	}
 };
-i([m()], g.prototype, "label", void 0), i([m({ reflect: !0 })], g.prototype, "size", void 0), g = i([t("vf-icon-field")], g);
+i([h()], _.prototype, "label", void 0), i([h({ reflect: !0 })], _.prototype, "size", void 0), _ = i([t("vf-icon-field")], _);
 //#endregion
-export { g as VfIconField };
+export { _ as VfIconField };

package/dist/components/vf-icon.d.ts

@@ -220,8 +220,9 @@ declare const VfIcon_base: (new (...args: any[]) => import("../position.js").VfP
  * The kit ships no filing semantics — folders are the page's own catalog —
  * so a drag is a stream of events and a cancelable commit, on the icon:
  *
- * - `vf-drag-start` `{ left, top }` on the first lattice step away from the
- *   press (a plain click never starts one, and never fires a drop);
+ * - `vf-drag-start` `{ left, top }` on the first lattice step past the drag
+ *   slop (a click or a tap never starts one, and never fires a drop — see
+ *   "Mouse, finger and pen" below);
  * - `vf-drag` `{ clientX, clientY, left, top, x, y }` on every step that
  *   changed the snapped proposal;
  * - `vf-drop`, the same shape at the release, **cancelable**: its default
@@ -304,6 +305,38 @@ declare const VfIcon_base: (new (...args: any[]) => import("../position.js").VfP
  * Finder's Return renamed, never opened, so on an editable icon it starts the
  * edit and on a non-editable one it does nothing at all.
  *
+ * ### Mouse, finger and pen
+ *
+ * The instrument never changes what the icon means: a tap is a click, two
+ * taps are a double-click, a drag is a drag. Two things are measured per
+ * instrument so that holds, both added by the kit — System 7 had the mouse
+ * alone.
+ *
+ * **The open gesture.** The mouse opens on the platform's `dblclick`, which
+ * follows the user's own double-click setting. A finger or a pen opens on a
+ * *tap pair* the icon classifies from its own pointer events: two taps on
+ * the icon, the second pressed within `TAP_PAIR_MS` (500) of the first and
+ * no further than `TAP_PAIR_SLOP_PX` (24 CSS px) from it, `vf-open` firing
+ * on the second release. A platform reserves the double-tap for its zoom
+ * and may deliver no `dblclick` for one, and a movable icon's press is
+ * `preventDefault()`ed for the drag, which can suppress it too; the pair
+ * depends on neither. A tap is a press released where it landed — one that
+ * became a drag, or that the platform cancelled, is not half of a pair —
+ * and a pair does not chain: a third tap starts the next one. Each press
+ * takes exactly one of the two routes, so a platform that does deliver a
+ * `dblclick` for a double-tap opens the icon once. The frame sets
+ * `touch-action: manipulation`, which takes the double-tap zoom off the
+ * icon and leaves panning and pinching to the page.
+ *
+ * **The drag slop.** A drag begins once the pointer has travelled from its
+ * press by `DRAG_SLOP_PX` (4 CSS px) for the mouse or `DRAG_SLOP_COARSE_PX`
+ * (10) for a finger or pen, which never lands still. Inside it the press is
+ * a click or a tap: the icon stays on its spot, a rename the press armed
+ * stays armed, and no drag event fires. The delta is measured from the
+ * press all the same, so the outline begins under the pointer. The numbers
+ * are CSS px rather than system px because they measure the hand, not the
+ * art (src/motion.ts).
+ *
  * ### The name and the art are one target, and the second click decides
  *
  * A double-click opens the icon *wherever it lands* — the name is as much the
@@ -313,8 +346,8 @@ declare const VfIcon_base: (new (...args: any[]) => import("../position.js").VfP
  *
  * So the rename waits for it. A press on the plate of an already-selected icon
  * arms the field rather than opening it, and the next press inside
- * {@link RENAME_DELAY_MS} calls it off — leaving the double-click to open, with
- * no rename box flashing up behind it. Nothing needs to *undo* an edit that
+ * {@link RENAME_DELAY_MS} calls it off — leaving the double-click, or a
+ * finger's tap pair, to open, with no rename box flashing up behind it. Nothing needs to *undo* an edit that
  * began: the press that starts one and the press that opens are the same
  * press, so the only thing that can be got right is not committing early.
  *
@@ -417,9 +450,9 @@ declare const VfIcon_base: (new (...args: any[]) => import("../position.js").VfP
  * @fires vf-select - Selection changed by user interaction. `detail: { selected: boolean }`.
  * @fires vf-change - The name was committed. `detail: { label: string, previous: string }`.
  * @fires vf-open - The icon was opened — double-clicked anywhere on it, its
- *   name included, or ⌘O / ⌘↓ from the keyboard (Ctrl off the Mac), the
- *   System 7 shortcuts. Return renames instead, as the Finder's did.
- *   `detail: {}`.
+ *   name included; tapped twice with a finger or pen; or ⌘O / ⌘↓ from the
+ *   keyboard (Ctrl off the Mac), the System 7 shortcuts. Return renames
+ *   instead, as the Finder's did. `detail: {}`.
  * @fires vf-name-too-long - A rename was typed or pasted past `maxlength`, and
  *   the field refused the excess. `detail: { attempted, accepted, limit }` —
  *   enough to raise the alert System 7 raised rather than drop the characters
@@ -429,9 +462,10 @@ declare const VfIcon_base: (new (...args: any[]) => import("../position.js").VfP
  *   edit was dropped and the old name put back.
  *   `detail: { attempted, kept, reason: 'empty' }`. A `vf-change` is *not*
  *   fired alongside it — nothing changed.
- * @fires vf-drag-start - A drag began: the first lattice step away from the
- *   press. `detail: { left, top, icons }` — the origin, whole system px in
- *   the icon's container, and every icon the drag carries (this one first).
+ * @fires vf-drag-start - A drag began: the first lattice step past the drag
+ *   slop, 4 CSS px from the press for the mouse and 10 for a finger or pen.
+ *   `detail: { left, top, icons }` — the origin, whole system px in the
+ *   icon's container, and every icon the drag carries (this one first).
  * @fires vf-drag - A step that changed the proposal. `detail: { clientX,
  *   clientY, left, top, x, y, icons }` — the pointer in viewport CSS px, the
  *   proposed origin in the container (whole system px on the lattice), the
@@ -592,6 +626,17 @@ export declare class VfIcon extends VfIcon_base {
         right: number;
         bottom: number;
     }): boolean;
+    /**
+     * The reserved art cell's box in the viewport, CSS px: 32×32 system px, or
+     * 16×16 under `size="small"`, centered at the top of the frame — the same
+     * box whatever the art, the name, `width`, `open` or `selected`. The
+     * slotted art is no stand-in for it: `open` hides the slot, so the art
+     * measures nothing. The box to hand anything that opens from the icon or
+     * closes to it. Null while the icon is not rendered — out of the
+     * document, or under `display: none`, inside a hidden window say. Before
+     * the first render, the host's box.
+     */
+    cellRect(): DOMRect | null;
     /**
      * Place the icon as a drop would: the stated pair — the origin point
      * under an `origin`, the corner without one — clamped whole in the