@kitlangton/knobs 0.4.0-next.13 → 0.4.0-next.14

package/dist/review-react.js

@@ -5046,7 +5046,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -5929,7 +5930,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {
@@ -7643,7 +7645,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();

package/dist/review-solid.js

@@ -5045,7 +5045,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -5928,7 +5929,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {
@@ -7642,7 +7644,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();

package/dist/review.js

@@ -3769,7 +3769,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();
@@ -10203,7 +10203,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -11086,7 +11087,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {

package/dist/types/core/remote.d.ts

@@ -140,6 +140,8 @@ export interface RemoteControlsOptions {
     readonly scopedPresets?: Readonly<Record<string, Readonly<Record<string, State>>>>;
     /** Groups pinned above the tab strip, outside the presets (see `ControlsOptions.pinned`). */
     readonly pinned?: readonly string[];
+    /** Groups presets leave alone, in place (see `ControlsOptions.inPresets`). */
+    readonly inPresets?: Readonly<Record<string, boolean>>;
     /** Numbered presets per group, e.g. the phone's preset sets (see `ControlsOptions.groupPresets`). */
     readonly groupPresets?: Readonly<Record<string, readonly GroupPreset[]>>;
     /** Display labels by group id, section id and preset id (see `ControlsOptions.groupLabels`). */
@@ -147,7 +149,7 @@ export interface RemoteControlsOptions {
     readonly sectionLabels?: Readonly<Record<string, string>>;
     readonly presetLabels?: Readonly<Record<string, string>>;
     /** Shorthand for `presetLabels.default`, e.g. "Native". */
-    readonly defaultLabel?: string;
+    readonly defaultLabel?: string | Readonly<Record<string, string>>;
     /** How a page card shows its group presets (see `ControlsOptions.groupPresetDisplay`). */
     readonly groupPresetDisplay?: GroupPresetDisplay;
     /** One muted line under a group's card title or a section's heading on a page, by id. */

package/dist/types/core/schema.d.ts

@@ -56,6 +56,11 @@ export interface FieldMeta {
      * Panel presets and saved variants leave pinned fields alone. See `ControlsOptions.pinned`.
      */
     readonly pinned?: boolean;
+    /**
+     * `false`: presets, scoped presets and variants leave the field alone, as they leave a pinned
+     * one, but its row stays where it is. See `ControlsOptions.inPresets` for a whole group.
+     */
+    readonly inPresets?: false;
     /**
      * A collapsible sub-heading inside the field's group: a flat heading with a hairline, never a
      * card inside the card. Consecutive fields that share it sit under one heading.
@@ -63,7 +68,7 @@ export interface FieldMeta {
     readonly subsection?: string;
 }
 /** Meta keys copied from a field's options or a descriptor onto the field. */
-export declare const META_KEYS: readonly ["label", "group", "groupLabel", "section", "sectionLabel", "groupDescription", "sectionDescription", "shortcut", "random", "disabled", "readOnly", "folded", "sectionFolded", "tab", "pinned", "subsection"];
+export declare const META_KEYS: readonly ["label", "group", "groupLabel", "section", "sectionLabel", "groupDescription", "sectionDescription", "shortcut", "random", "disabled", "readOnly", "folded", "sectionFolded", "tab", "pinned", "inPresets", "subsection"];
 /** The meta `source` gives, without undefined keys. */
 export declare function pickMeta(source: FieldMeta | undefined, skip?: readonly string[]): FieldMeta;
 /** Marks a knob as half of a flat spring: two number keys drawn as one spring card. */
@@ -365,6 +370,11 @@ export declare function variantsOf(schema: Schema, isPinned?: (key: string) => b
  * or whose first field that gives `pinned` says `true`, and ungrouped fields that say so themselves.
  */
 export declare function pinnedKeys(schema: Schema, groups?: readonly string[]): ReadonlySet<string>;
+/**
+ * The keys presets leave alone: the pinned ones, fields that say `inPresets: false`, and every key
+ * of a group `groups` gives `false`.
+ */
+export declare function presetFreeKeys(schema: Schema, pinned: ReadonlySet<string>, groups?: Readonly<Record<string, boolean>>): ReadonlySet<string>;
 export type FieldValue<F extends Field> = F extends Knob ? number : F extends Choice<infer T> ? T : F extends Toggle ? boolean : F extends SpringField ? SpringValue : F extends ColorField ? string : F extends PointField ? Point : F extends EasingField ? Bezier : F extends VecField<3> ? Vec3 : F extends VecField<2> ? Point : F extends RangeField ? readonly [number, number] : F extends AngleField | SeedField ? number : F extends KeybindField | TextField ? string : F extends GradientField ? readonly GradientStop[] : F extends CurveField ? readonly CurvePoint[] : never;
 /** The keys of a schema's readouts (what `controls.watch` takes). */
 export type ReadoutKeys<S extends Schema> = {
@@ -494,6 +504,7 @@ export declare function range(value: readonly [number, number], options: FieldMe
     sectionFolded?: boolean;
     tab?: string;
     pinned?: boolean;
+    inPresets?: false;
     subsection?: string;
 };
 /** Degrees on a dial (0–360 and wrapping by default): `angle(45)`, `angle(30, { min: -90, max: 90 })`. */

package/dist/types/core/store.d.ts

@@ -89,8 +89,11 @@ export interface LabelOptions {
     readonly sectionLabels?: Readonly<Record<string, string>>;
     /** By preset id: what the preset strip shows, e.g. `{ default: "Native" }`. */
     readonly presetLabels?: Readonly<Record<string, string>>;
-    /** Shorthand for `presetLabels.default`. */
-    readonly defaultLabel?: string;
+    /**
+     * Shorthand for `presetLabels.default`; by scope, `{ "": "Empty", Motion: "Shipped" }` names each
+     * strip's default chip on its own (`""` is the panel's, a tab or group's id one of `scopedPresets`).
+     */
+    readonly defaultLabel?: string | Readonly<Record<string, string>>;
     /** How a page card shows its group presets (see `GroupPresetDisplay`). */
     readonly groupPresetDisplay?: GroupPresetDisplay;
     /** By group id: one muted line under its card's title on a page, over fields' `groupDescription`. */
@@ -157,9 +160,14 @@ export interface MountPanelOptions extends LabelOptions {
      * and knobs/ui piece on the page (and the host's `data-hint` elements), so pressed here or
      * anywhere outside a text field it jumps across all of them; with nothing else on the page it's
      * this panel's alone, as always. `"panel"`: `s` here labels only this panel's controls, and they
-     * don't join the page's. `keys: { hint: false }` turns hint mode off here either way.
+     * don't join the page's. `keys: { hint: false }` turns hint mode off here either way. As an
+     * object, `reach` is that choice and `digits: "always"` keeps the preset strips' digits on their
+     * chips all the time, quietly, rather than only while you use keys.
      */
-    readonly hints?: "page" | "panel";
+    readonly hints?: "page" | "panel" | {
+        readonly reach?: "page" | "panel";
+        readonly digits?: "keys" | "always";
+    };
     /**
      * The key that shows and hides every panel and chip on the page that listens for it, outside
      * text fields and without modifiers; remembered per store. The store's `toggleKey` by default
@@ -383,6 +391,13 @@ export interface ControlsOptions<S extends Schema> extends LabelOptions {
      * one keeps their values, saving one keeps them out, and they're modified against their defaults.
      */
     pinned?: readonly string[];
+    /**
+     * Groups presets leave alone, where they are: `{ Motion: false }`. As with pinned groups,
+     * applying a preset or variant keeps their values, saving one leaves them out, and a preset's chip
+     * doesn't drift when they change; but their rows stay in place. A field says it alone with
+     * `inPresets: false`.
+     */
+    inPresets?: Readonly<Record<string, boolean>>;
     /**
      * Numbered presets per group, shown as 1, 2, 3… on the group's card in a page. A group's
      * presets cover every key any of them names; keys a preset leaves out are at their defaults,
@@ -432,7 +447,10 @@ export interface Controls<S extends Schema = Schema> {
     readonly variants: Variants<Values<S>>;
     /** The tabs and groups with presets of their own, by id (see `ControlsOptions.scopedPresets`). */
     readonly scopes: Readonly<Record<string, PresetScope<Values<S>>>>;
-    /** The scope `key`'s presets come from: a tab or group's id, `""` for `presets`, or undefined when pinned. */
+    /**
+     * The scope `key`'s presets come from: a tab or group's id, `""` for `presets`, or undefined
+     * when presets leave it alone (pinned, `inPresets: false`).
+     */
     scopeOf(key: string): string | undefined;
     readonly actions: readonly ControlAction<Values<S>>[];
     /** Its panels' theme, as given (see `ControlsOptions.theme`). */
@@ -467,6 +485,8 @@ export interface Controls<S extends Schema = Schema> {
     presetLabel(id: string, scope?: string): string;
     /** Whether `key` is pinned (its group is, see `ControlsOptions.pinned`), outside the presets. */
     isPinned(key: string): boolean;
+    /** Whether presets move `key`: false when it's pinned or says `inPresets: false` (or its group does). */
+    inPresets(key: string): boolean;
     readonly error: string | null;
     get(): Values<S>;
     getServerSnapshot(): Values<S>;

package/dist/types/panel/gpu/renderer.d.ts

@@ -434,6 +434,8 @@ export interface GpuPanelBinding {
     /** Each locked-capable row's lock icon, by its label element; `data-on` says it's locked. */
     readonly locks?: ReadonlyMap<HTMLElement, HTMLElement>;
     readonly presetStrip: PresetStrip;
+    /** Groups' own preset strips, each at the top of its card (see `scopedPresets`). */
+    readonly groupStrips?: () => Iterable<PresetStrip>;
     /** The tab strip under the header (hidden while the panel has no tabs). */
     readonly tabs?: TabStrip;
     readonly groups: readonly GpuGroupBinding[];
@@ -606,6 +608,12 @@ declare class GpuOverlayManager {
     private initWebGpu;
     private setAllPanelsActive;
     private pushPrim;
+    /**
+     * A preset strip: its tray (`tray`: the panel's strip has one, a group card's sits on the card),
+     * the selected chip's pill on its springs, the chips' names and drift marks, and the save chip.
+     * True while anything in it moves.
+     */
+    private drawPresetStrip;
     /** --k-rim-width in CSS px, on whole device pixels (at least one), so hairlines stay crisp. */
     private hairline;
     /**

package/dist/types/panel/presets.d.ts

@@ -62,6 +62,8 @@ export interface PresetStrip {
     select(index: number): void;
     /** Lays the presets out as chips or a list (see `PresetDisplay`). */
     display(mode: PresetDisplay): void;
+    /** Keeps each of the first nine chips' digit on it, quietly, before its name. */
+    digits(on: boolean): void;
     selectById(id: string): void;
     /** Saves the current values as "Variant N" and opens its name to typing; returns a status message. */
     save(): string;

package/dist/types/ui/index.d.ts

@@ -4,7 +4,7 @@ export { confirm, type ConfirmOptions } from "./confirm.js";
 export { overlayLook, type Anchor } from "./layer.js";
 export { assignPageCodes, hints, pageHints, type HintPainter, type HintSourceOptions, type PageHints, type PageHintTarget, } from "../panel/page-hints.js";
 export { fuzzy, inTriangle, marks, matchItem, place, safeTriangle, stepItem, rank, type Box, type FuzzyMatch, type Placed, type Placement, type Ranked, type Side, } from "./overlay-model.js";
-export { commandPalette, type Command, type CommandPalette, type CommandPaletteOptions, } from "./palette.js";
+export { commandPalette, type Command, type CommandPalette, type CommandPaletteOptions, type PalettePresence, } from "./palette.js";
 export { contextMenu, menu, type ContextMenu, type ContextMenuOptions, type Menu, type MenuCloseReason, type MenuEntry, type MenuItem, type MenuOptions, } from "./menu.js";
 export { popover, type Popover, type PopoverCloseReason, type PopoverOptions } from "./popover.js";
 export { readout, type Readout } from "./readouts.js";

package/dist/types/ui/palette.d.ts

@@ -1,4 +1,5 @@
 import type { UiLook } from "./look.js";
+import { type PresenceOptions } from "./layer.js";
 export interface Command {
     /** Stable across sessions (recents remember it); the label by default. */
     readonly id?: string;
@@ -25,9 +26,23 @@ export interface CommandPaletteOptions {
     readonly placeholder?: string;
     /** Recent commands are remembered under this key in localStorage; `false` remembers nothing. */
     readonly recents?: string | false;
+    /**
+     * How it comes and goes: `"fade"` (opacity over about 80 ms, the default), `"none"` or `false`
+     * (at once), or a spring of your own. Fields you leave out are the full entrance: grows from
+     * .96, sharpens from 8 px, drops 8 px, over .34 s; it leaves in .2 s at most.
+     */
+    readonly presence?: PalettePresence;
     readonly look?: UiLook;
     readonly doc?: Document;
 }
+export type PalettePresence = "fade" | "none" | false | {
+    readonly duration?: number;
+    readonly scale?: number;
+    readonly blur?: number;
+    readonly dy?: number;
+};
+/** The layer motion for a `presence` option; null for none. */
+export declare function palettePresence(p?: PalettePresence): PresenceOptions | null;
 export interface CommandPalette {
     open(query?: string): void;
     close(): void;

package/dist/types/ui/tree-model.d.ts

@@ -50,8 +50,11 @@ export interface NavResult {
         readonly expanded: boolean;
     };
 }
-/** Roving focus: ↑↓ move, ← closes or goes to the parent, → opens or goes to the first child. */
-export declare function navigate<T>(rows: readonly FlatRow<T>[], active: string | null, key: NavKey | "PageUp" | "PageDown", page?: number): NavResult;
+/**
+ * Roving focus: ↑↓ move, ← closes or goes to the parent, → opens or goes to the first child.
+ * Right to left, ← and → swap.
+ */
+export declare function navigate<T>(rows: readonly FlatRow<T>[], active: string | null, pressed: NavKey | "PageUp" | "PageDown", page?: number, dir?: "ltr" | "rtl"): NavResult;
 /**
  * Type-ahead: the next row whose label starts with what's been typed, after the active one (or
  * from it, once the word is longer than a letter, so typing on refines in place).

package/dist/ui-react.js

@@ -5046,7 +5046,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -5929,7 +5930,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {
@@ -7643,7 +7645,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();

package/dist/ui-solid.js

@@ -5045,7 +5045,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -5928,7 +5929,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {
@@ -7642,7 +7644,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();

package/dist/ui.js

@@ -3244,7 +3244,7 @@ function presence(el, o = {}) {
   });
   const tune = (seconds, zeta) => {
     const reduced = reducedMotion(win);
-    spring.omega = 2 * Math.PI / (reduced ? FADE.duration : seconds);
+    spring.omega = 2 * Math.PI / (reduced ? Math.min(FADE.duration, seconds) : seconds);
     spring.zeta = reduced ? 1 : zeta;
   };
   render();
@@ -4708,7 +4708,8 @@ function ancestors(index, id) {
     out.push(p);
   return out;
 }
-function navigate(rows, active, key, page = 10) {
+function navigate(rows, active, pressed, page = 10, dir = "ltr") {
+  const key = dir === "rtl" && (pressed === "ArrowLeft" || pressed === "ArrowRight") ? pressed === "ArrowLeft" ? "ArrowRight" : "ArrowLeft" : pressed;
   if (rows.length === 0)
     return { active: null };
   const i = active === null ? -1 : rows.findIndex((r) => r.id === active);
@@ -10649,7 +10650,8 @@ function tree(container, options) {
         options.onMove(move);
     } else if (nav.includes(e.key) && !e.metaKey && !e.ctrlKey) {
       const page = Math.max(1, Math.floor(viewport() / h) - 1);
-      const r = navigate(rows, active, e.key, page);
+      const dir = win.getComputedStyle(root).direction === "rtl" ? "rtl" : "ltr";
+      const r = navigate(rows, active, e.key, page, dir);
       if (r.toggle)
         toggle(r.toggle.id, r.toggle.expanded);
       else if (r.active) {
@@ -13426,6 +13428,22 @@ function toast(message, options = {}) {
 }
 
 // src/ui/palette.ts
+var FADE_SECONDS = 0.08;
+function palettePresence(p = "fade") {
+  if (p === false || p === "none")
+    return null;
+  if (p === "fade")
+    return { scale: 1, blur: 0, dy: 0, duration: FADE_SECONDS, exit: FADE_SECONDS, bounce: 0 };
+  const duration = p.duration ?? 0.34;
+  return {
+    scale: p.scale ?? 0.96,
+    blur: p.blur ?? 8,
+    dy: p.dy ?? -8,
+    duration,
+    exit: Math.min(0.2, duration),
+    bounce: 0
+  };
+}
 var idOf = (c) => c.id ?? c.label;
 var MAX_RECENT = 5;
 var MAX_SHOWN = 200;
@@ -13433,6 +13451,7 @@ function commandPalette(options) {
   const doc = options.doc ?? document;
   const win = doc.defaultView;
   const hotkey = options.hotkey === undefined ? "Mod+K" : options.hotkey;
+  const motionOptions = palettePresence(options.presence);
   const storeKey = options.recents === false ? null : `knobs-palette:${options.recents ?? "recent"}`;
   const readRecents = () => {
     if (!storeKey)
@@ -13662,7 +13681,7 @@ function commandPalette(options) {
     const layer = el;
     const giveBack = focusReturn(doc, layer);
     const commands = typeof options.commands === "function" ? options.commands() : options.commands;
-    const motion = presence(layer, { scale: 0.96, blur: 8, dy: -8, duration: 0.34 });
+    const motion = motionOptions ? presence(layer, motionOptions) : null;
     state = {
       input,
       list,
@@ -13700,7 +13719,7 @@ function commandPalette(options) {
           runAt(state.active);
       }
     });
-    motion.show();
+    motion?.show();
     input.focus({ preventScroll: true });
     input.select();
   };
@@ -13713,7 +13732,10 @@ function commandPalette(options) {
     el = null;
     s.unstack();
     s.giveBack();
-    s.motion.hide().then(() => layer.remove());
+    if (s.motion)
+      s.motion.hide().then(() => layer.remove());
+    else
+      layer.remove();
   };
   const onKey = (e) => {
     if (!hotkey || !matchesCombo(hotkey, e))

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kitlangton/knobs",
-  "version": "0.4.0-next.13",
+  "version": "0.4.0-next.14",
   "description": "Per-component tuning controls. Explore in development, ship constants.",
   "type": "module",
   "license": "MIT",