@kitlangton/knobs 0.4.0-next.10 → 0.4.0-next.12

package/dist/index.js

@@ -460,6 +460,7 @@ var META_KEYS = [
   "folded",
   "sectionFolded",
   "tab",
+  "pinned",
   "subsection"
 ];
 function pickMeta(source, skip = []) {
@@ -471,7 +472,29 @@ function pickMeta(source, skip = []) {
   }
   return out;
 }
-var READOUT_KINDS = /* @__PURE__ */ new Set(["watch", "sparkline", "graph", "meter", "table", "log"]), isReadout = (field) => READOUT_KINDS.has(field.kind), hasValue = (field) => field.kind !== "action" && field.kind !== "toolbar" && !READOUT_KINDS.has(field.kind), SPRING = {
+var READOUT_KINDS = /* @__PURE__ */ new Set(["watch", "sparkline", "graph", "meter", "table", "log"]), isReadout = (field) => READOUT_KINDS.has(field.kind), hasValue = (field) => field.kind !== "action" && field.kind !== "toolbar" && !READOUT_KINDS.has(field.kind);
+function variantsOf(schema, isPinned = () => !1) {
+  let found;
+  for (let [key, field] of Object.entries(schema))
+    if (field.kind === "choice" && field.variants && !isPinned(key)) {
+      if (found)
+        throw Error(`Only one choice can hold the variants (${found.key}, ${key}).`);
+      found = { key, field };
+    }
+  return found;
+}
+function pinnedKeys(schema, groups = []) {
+  let byGroup = new Map(groups.map((g) => [g, !0]));
+  for (let f of Object.values(schema))
+    if (f.group !== void 0 && f.pinned !== void 0 && !byGroup.has(f.group))
+      byGroup.set(f.group, f.pinned);
+  let out = /* @__PURE__ */ new Set;
+  for (let [key, f] of Object.entries(schema))
+    if (f.group === void 0 ? f.pinned === !0 : byGroup.get(f.group) === !0)
+      out.add(key);
+  return out;
+}
+var SPRING = {
   duration: { min: 0.05, max: 2, step: 0.01 },
   bounce: { min: -0.5, max: 1, step: 0.01 }
 };
@@ -502,8 +525,9 @@ function choice(value, options, meta) {
     value,
     options: Object.freeze([...options]),
     ...labels && Object.keys(labels).length ? { labels } : {},
-    ...meta?.display ? { display: meta.display } : {}
-  }, meta);
+    ...meta?.display ? { display: meta.display } : {},
+    ...meta?.variants ? { variants: !0 } : {}
+  }, meta?.variants ? { ...meta, random: meta.random ?? !1 } : meta);
 }
 function action(label, meta) {
   let { shortcut, global, rebind, run, ...rest } = meta ?? {}, key = shortcutOf({ ...shortcut ? { shortcut } : {}, ...global ? { global } : {} }), combo = key ? normalizeCombo(key.key) : "";
@@ -648,6 +672,17 @@ function keybind(value = "", meta) {
   let field = { kind: "keybind", value: normalizeCombo(value) };
   return withMeta(field, { random: !1, ...meta });
 }
+function text(value = "", options) {
+  let { multiline, placeholder, ...meta } = options ?? {}, field = {
+    kind: "text",
+    value: "",
+    ...multiline ? { multiline: !0 } : {},
+    ...placeholder ? { placeholder } : {}
+  };
+  return withMeta({ ...field, value: normalizeText(field, value) }, { random: !1, ...meta });
+}
+var normalizeText = (field, input) => field.multiline ? input.replace(/\r\n?/g, `
+`) : input.replace(/\r\n?|\n/g, " ");
 function gradient(stops, options = {}) {
   let value = normalizeStops(stops);
   if (!value)
@@ -702,7 +737,8 @@ function toolbar(items, meta) {
     throw Error("A toolbar needs at least one item.");
   return withMeta({
     kind: "toolbar",
-    items: Object.freeze(items.map((item) => Object.freeze({ ...item })))
+    items: Object.freeze(items.map((item) => Object.freeze({ ...item }))),
+    ...meta?.labels !== void 0 ? { labels: meta.labels } : {}
   }, meta);
 }
 var readoutMeta = (o) => {
@@ -846,6 +882,8 @@ function normalizeField(field, input) {
       return typeof input === "number" && Number.isFinite(input) ? Math.round(Math.min(field.max, Math.max(field.min, input))) : field.value;
     case "keybind":
       return typeof input === "string" ? normalizeCombo(input) : field.value;
+    case "text":
+      return typeof input === "string" ? normalizeText(field, input) : field.value;
     case "gradient":
       return normalizeStops(input) ?? field.value;
     case "curve":
@@ -996,6 +1034,7 @@ function pick(field, random) {
     case "seed":
       return lattice(field.min, field.max, 1, r());
     case "keybind":
+    case "text":
       return field.value;
     case "gradient":
       return randomStops(field.value.length, r);
@@ -1081,6 +1120,7 @@ function around(field, base, random) {
       ]);
     case "seed":
     case "keybind":
+    case "text":
       return pick(field, random);
   }
 }
@@ -1180,6 +1220,7 @@ function shift(field, value, random) {
     case "seed":
       return nudge(value, field.min, field.max, 1, random);
     case "keybind":
+    case "text":
       return value;
     case "gradient":
       return mutateStops(value, random, MUTATE.hue, MUTATE.lightness);
@@ -1612,14 +1653,42 @@ function defineControls(id, input, options = {}) {
   let schema = Object.freeze({ ...input }), locked = normalize(schema, {}), actions = Object.freeze([...options.actions ?? []]), { theme, appearance } = options, density = options.density ?? "default", renderer = options.renderer ?? "auto", enabled = () => (Boolean(options.ship) || isUnlocked()) && (typeof options.enabled === "function" ? options.enabled() : options.enabled ?? (Boolean(options.ship) || isUnlocked() || typeof location < "u" && ["localhost", "127.0.0.1", "[::1]"].includes(location.hostname))), storage = () => options.storage === void 0 ? browserStorage() : options.storage, persistMode = options.persist ?? "all", valueStorage = () => persistMode === "all" ? storage() : null, variantStorage = () => persistMode === "none" ? null : storage(), draw = options.random ?? Math.random, hostHistory = options.history, unsubscribeHistory, unsubscribeUnlock, listeners = /* @__PURE__ */ new Set, refreshes = 0, notify = () => {
     for (let cb of [...listeners])
       cb();
-  }, mixed = /* @__PURE__ */ new Set, current = locked, read = !1, error = null, locks = /* @__PURE__ */ new Set, bindings = /* @__PURE__ */ new Map, comparing = null, landing = !1, echo = Math.max(0, options.echo ?? 0), grabbed = /* @__PURE__ */ new Set, changedAt = /* @__PURE__ */ new Map, sent = /* @__PURE__ */ new Map, pending = /* @__PURE__ */ new Map, echoTimer, now = () => typeof performance < "u" ? performance.now() : Date.now(), isHeld = (key) => grabbed.has(key) || echo > 0 && now() - (changedAt.get(key) ?? -1 / 0) < echo, NO_BASE = Object.freeze({ preset: null, groups: Object.freeze({}) }), base = NO_BASE, past = [], future = [], HISTORY = 100, stateKey = storageKey(id, "state"), buildPresets = () => Object.freeze(Object.fromEntries([
-    ["default", locked],
-    ...Object.entries(options.presets ?? {}).map(([id, patch]) => {
-      if (id === "default" || id === "custom")
-        throw Error(`Reserved preset id: ${id}`);
-      return [id, normalize(schema, { ...locked, ...patch })];
-    })
-  ])), presets = buildPresets(), buildGroupPresets = () => Object.freeze(Object.fromEntries(Object.entries(options.groupPresets ?? {}).map(([group, list]) => {
+  }, mixed = /* @__PURE__ */ new Set, current = locked, read = !1, error = null, locks = /* @__PURE__ */ new Set, bindings = /* @__PURE__ */ new Map, comparing = null, landing = !1, echo = Math.max(0, options.echo ?? 0), grabbed = /* @__PURE__ */ new Set, changedAt = /* @__PURE__ */ new Map, sent = /* @__PURE__ */ new Map, pending = /* @__PURE__ */ new Map, echoTimer, now = () => typeof performance < "u" ? performance.now() : Date.now(), isHeld = (key) => grabbed.has(key) || echo > 0 && now() - (changedAt.get(key) ?? -1 / 0) < echo, NO_BASE = Object.freeze({ preset: null, groups: Object.freeze({}) }), base = NO_BASE, past = [], future = [], HISTORY = 100, stateKey = storageKey(id, "state"), pinnedOf, pinned = () => {
+    if (pinnedOf?.schema !== schema)
+      pinnedOf = { schema, keys: pinnedKeys(schema, options.pinned) };
+    return pinnedOf.keys;
+  }, variantsChoice = () => variantsOf(schema, (key) => pinned().has(key)), unpinned = (values) => {
+    let keys = pinned();
+    if (keys.size === 0)
+      return values;
+    let out = { ...values };
+    for (let k of keys)
+      if (Object.hasOwn(locked, k))
+        out[k] = locked[k];
+    return Object.freeze(out);
+  }, presetPatch = (values) => {
+    let keys = pinned();
+    if (keys.size === 0)
+      return values;
+    return Object.fromEntries(Object.entries(values).filter(([k]) => !keys.has(k)));
+  }, buildPresets = () => {
+    let own = options.presets ?? {}, v = variantsChoice();
+    if (v && Object.hasOwn(own, v.field.value))
+      throw Error(`The default variant (${v.field.value}) is the schema's defaults; set its values there.`);
+    let ids = [
+      ...v ? v.field.options.filter((o) => o !== v.field.value) : [],
+      ...Object.keys(own).filter((id) => !v?.field.options.includes(id))
+    ];
+    return Object.freeze(Object.fromEntries([
+      ["default", locked],
+      ...ids.map((id) => {
+        if (id === "default" || id === "custom")
+          throw Error(`Reserved preset id: ${id}`);
+        let variant = v?.field.options.includes(id) ? { [v.key]: id } : {};
+        return [id, unpinned(normalize(schema, { ...locked, ...variant, ...own[id] }))];
+      })
+    ]));
+  }, presets = buildPresets(), buildGroupPresets = () => Object.freeze(Object.fromEntries(Object.entries(options.groupPresets ?? {}).map(([group, list]) => {
     let named = list.flatMap((p) => Object.keys(p.values).filter((k) => Object.hasOwn(schema, k))), covered = new Set((named.length ? named : Object.keys(schema).filter((k) => schema[k].group === group)).filter((k) => hasValue(schema[k])));
     return [
       group,
@@ -1718,7 +1787,7 @@ function defineControls(id, input, options = {}) {
     else if (ref?.kind === "variant") {
       let found = list?.find((v) => v.id === ref.id);
       if (found)
-        out = normalize(schema, found.values);
+        out = unpinned(normalize(schema, found.values));
     }
     let groups = Object.entries(b.groups);
     if (groups.length) {
@@ -1730,11 +1799,10 @@ function defineControls(id, input, options = {}) {
     return baseCache = { base: b, schema, presets, groupPresets, variants: list, values }, values;
   }
   let covered = (key) => {
-    let b = activeBase();
-    if (b.preset)
+    let b = activeBase(), group = schema[key]?.group;
+    if (group !== void 0 && Object.hasOwn(b.groups, group))
       return !0;
-    let group = schema[key]?.group;
-    return group !== void 0 && Object.hasOwn(b.groups, group);
+    return b.preset !== null && !pinned().has(key);
   };
   function declaredShortcut(id) {
     let slash = id.indexOf("/"), key = slash < 0 ? id : id.slice(0, slash), field = Object.hasOwn(schema, key) ? schema[key] : void 0;
@@ -2004,7 +2072,7 @@ function defineControls(id, input, options = {}) {
     listen(cb) {
       return readoutListeners.add(cb), () => readoutListeners.delete(cb);
     }
-  }, variants = createVariants(() => schema, id, storageKey(id, "variants"), variantStorage, get, (v, variant, coalesce) => write(v, { source: "variant", coalesce }, makeBase(Object.freeze({ kind: "variant", id: variant }), {})), notify, enabled), resettable = (keys) => (keys ?? fieldKeys()).filter((k) => valueField(k) && !blocked(k));
+  }, variants = createVariants(() => schema, id, storageKey(id, "variants"), variantStorage, () => unpinned(get()), (v, variant, coalesce) => write(presetPatch(v), { source: "variant", coalesce }, makeBase(Object.freeze({ kind: "variant", id: variant }), {})), notify, enabled), resettable = (keys) => (keys ?? fieldKeys()).filter((k) => valueField(k) && !blocked(k));
   function offBase(keys) {
     if (!hasBase())
       return !1;
@@ -2088,7 +2156,11 @@ function defineControls(id, input, options = {}) {
     sectionDescription: (section) => options.sectionDescriptions?.[section] ?? fieldLabels().sectionText.get(section),
     groupFolded: options.groupFolded,
     sectionFolded: options.sectionFolded,
-    presetLabel: (presetId) => options.presetLabels?.[presetId] ?? (presetId === "default" ? options.defaultLabel : void 0) ?? presetId,
+    presetLabel: (presetId) => {
+      let v = variantsChoice(), option = presetId === "default" ? v?.field.value : presetId;
+      return options.presetLabels?.[presetId] ?? (presetId === "default" ? options.defaultLabel : void 0) ?? (v && option !== void 0 && v.field.options.includes(option) ? v.field.labels?.[option] ?? option : presetId);
+    },
+    isPinned: (key) => pinned().has(key),
     get,
     set,
     sync,
@@ -2363,9 +2435,12 @@ function defineControls(id, input, options = {}) {
     preset(id, presetOptions) {
       if (!Object.hasOwn(presets, id))
         throw Error(`Unknown preset: ${id}`);
-      write(presets[id], { source: "preset", coalesce: presetOptions?.coalesce }, id === "default" ? NO_BASE : makeBase(Object.freeze({ kind: "preset", id }), {}));
+      write(presetPatch(presets[id]), { source: "preset", coalesce: presetOptions?.coalesce }, id === "default" ? NO_BASE : makeBase(Object.freeze({ kind: "preset", id }), {}));
+    },
+    matchingPreset: () => {
+      let cur = unpinned(get());
+      return Object.keys(presets).find((id) => equal(cur, presets[id])) ?? "custom";
     },
-    matchingPreset: () => Object.keys(presets).find((id) => equal(get(), presets[id])) ?? "custom",
     get groupPresets() {
       return groupPresets;
     },
@@ -2437,7 +2512,7 @@ function descriptorToField(d) {
   if (readoutDescriptor(d))
     return readoutField(d);
   if (d.kind === "toolbar")
-    return toolbar(d.items.map(({ key, ...item }) => ({ ...item, id: key })), meta);
+    return toolbar(d.items.map(({ key, ...item }) => ({ ...item, id: key })), d.labels !== void 0 ? { ...meta, labels: d.labels } : meta);
   if (d.bind)
     return flatSpring({}, { ...meta, id: d.key }).duration;
   if (d.kind === "knob" || d.kind === "number") {
@@ -2512,6 +2587,12 @@ function descriptorToField(d) {
     });
   if (d.kind === "keybind")
     return keybind(typeof d.default === "string" ? d.default : "", meta);
+  if (d.kind === "text")
+    return text(typeof d.default === "string" ? d.default : "", {
+      ...d.multiline ? { multiline: !0 } : {},
+      ...d.placeholder ? { placeholder: d.placeholder } : {},
+      ...meta
+    });
   if (d.kind === "gradient") {
     let fallback = [
       { at: 0, color: "#000000" },
@@ -2590,7 +2671,7 @@ var decimal = (n) => String(Math.round(n * 1e4) / 1e4), swiftLiteral = (d, v) =>
     let [a, b] = v;
     return `${decimal(a)}...${decimal(b)}`;
   }
-  if (d.kind === "keybind")
+  if (d.kind === "keybind" || d.kind === "text")
     return JSON.stringify(v);
   if (d.kind === "gradient")
     return `Gradient(stops: [${(Array.isArray(v) ? v : []).map((s) => {
@@ -2619,6 +2700,7 @@ var decimal = (n) => String(Math.round(n * 1e4) / 1e4), swiftLiteral = (d, v) =>
   range: "ClosedRange<Double>",
   seed: "Int",
   keybind: "String",
+  text: "String",
   gradient: "Gradient",
   curve: "[CGPoint]"
 };
@@ -2692,6 +2774,7 @@ function createRemoteControls(id, descriptors, options = {}) {
     tunable: options.tunable,
     history: options.history,
     presets: options.presets,
+    pinned: options.pinned,
     groupPresets: options.groupPresets,
     onPreset: options.onPreset,
     actions: options.actions,
@@ -2827,6 +2910,7 @@ export {
   springCss,
   springMotion,
   table,
+  text,
   toggle,
   toolbar,
   toolbarShortcut,