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

package/dist/dev/{chunk-pdf3zy95.js → chunk-bejz4qcg.js}

@@ -10,7 +10,7 @@ import {
   DEFAULT_LINEAR,
   motionCss,
   storageKey
-} from "./chunk-7kns3qe6.js";
+} from "./chunk-v2g91mrm.js";
 
 // src/core/theme.ts
 var property = (k) => k.startsWith("--") ? k : `--k-${k}`;
@@ -2600,9 +2600,16 @@ ${GRAD_PROPS}
 /* The active preset's modified mark: the values have drifted off it (a row's dot, in its corner). */
 .knobs-panel .knobs-preset-chip::after{content:"";position:absolute;top:4px;right:4px;width:4px;height:4px;border-radius:50%;background:var(--_k-modified);opacity:0;transform:scale(.4);pointer-events:none;transition:opacity .16s ease-out,transform .28s cubic-bezier(.34,1.5,.64,1)}
 .knobs-panel .knobs-preset-chip[data-drifted]::after{opacity:.95;transform:none}
+/* Digits that stay on the chips (hints: { digits: "always" }): quiet, in a column of their own. */
+.knobs-panel .knobs-preset-key{display:inline-block;margin-right:6px;color:var(--_k-fg-3);font-size:var(--_k-text-meta);font-weight:var(--_k-weight-label);font-variant-numeric:tabular-nums}
+/* A group's own presets at the top of its card: the chips sit on the card, with no tray. */
+.knobs-panel .knobs-card>.knobs-presets{margin:0;padding:max(4px,calc((var(--_k-row) - var(--k-button-h,var(--_k-control-h))) / 2)) var(--_k-inset);background:transparent;border-radius:0}
+.knobs-panel .knobs-card>.knobs-presets[data-display="list"]{padding-inline:0}
+.knobs-card>.knobs-presets:hover{background:transparent}
 /* Naming a saved preset: a field over its chip that opens out from the middle to the chip's width;
    the chip's own name hides beneath it. Leaving, it fades. */
 .knobs-panel .knobs-preset-chip[data-naming]{color:transparent!important}
+.knobs-panel .knobs-preset-chip[data-naming] .knobs-preset-key{color:transparent}
 .knobs-panel .knobs-preset-name{position:absolute;z-index:2;box-sizing:border-box;min-width:0;margin:0;padding:0 6px;border:1px solid color-mix(in srgb,var(--_k-accent) 55%,transparent);border-radius:var(--k-button-radius,var(--_k-radius-md));outline:none;background:color-mix(in srgb,var(--_k-accent) 10%,transparent);color:var(--_k-fg);caret-color:var(--_k-accent);
   font-family:inherit;font-size:var(--k-button-font-size,var(--_k-text-control));font-weight:var(--_k-weight-title);letter-spacing:inherit;text-align:center;animation:knobs-name-in .25s cubic-bezier(.2,.8,.2,1);transition:opacity .11s cubic-bezier(.4,0,1,1)}
 .knobs-preset-name::selection{background:color-mix(in srgb,var(--_k-accent) 24%,transparent);color:var(--_k-fg)}
@@ -3213,7 +3220,7 @@ ${POINTER_ROW} .knobs-slider.knobs-modified:not(:hover,.knobs-active) .knobs-val
 .knobs-panel[data-gpu-active="true"] :where(header strong,header button,.knobs-tile,.knobs-section-head,.knobs-group-label,.knobs-peek,.knobs-card>*,.knobs-presets,.knobs-preset-chip,.knobs-group-head,.knobs-group-head button,.knobs-card,.knobs-row,.knobs-row>span:first-child,.knobs-slider,.knobs-track,.knobs-label,.knobs-value,.knobs-digits,.knobs-digits *,.knobs-unit,.knobs-seg,.knobs-seg button,.knobs-custom-actions button,.knobs-action,.knobs-select,.knobs-select-value,
   .knobs-sub,.knobs-x-head,.knobs-x-label,.knobs-x-read,.knobs-strip-label,.knobs-strip-read,.knobs-pad,.knobs-ease,.knobs-spring-curve,.knobs-ease-chips,.knobs-ease-chip,.knobs-graph,.knobs-graph-read,
   .knobs-tabs,.knobs-tab,.knobs-subhead,.knobs-subhead-label,.knobs-match,.knobs-cell,.knobs-cell-axis,.knobs-cell-read,.knobs-link,.knobs-range-read,.knobs-angle,.knobs-angle-read,.knobs-dial,
-  .knobs-seed,.knobs-seed-read,.knobs-seed-digits,.knobs-seed-digits *,.knobs-seed-roll,.knobs-keys,.knobs-keys-text,.knobs-tool,.knobs-tool-label,.knobs-tool-key,
+  .knobs-seed,.knobs-seed-read,.knobs-seed-digits,.knobs-seed-digits *,.knobs-seed-roll,.knobs-keys,.knobs-keys-text,.knobs-tool,.knobs-tool-label,.knobs-tool-key,.knobs-preset-key,
   .knobs-section-name,.knobs-section-summary,.knobs-section-desc,.knobs-group-desc,.knobs-group-summary,.knobs-tab-count):not(.knobs-live,.knobs-live *){
   background:transparent!important;color:transparent!important;border-color:transparent!important;box-shadow:none!important;
 }

package/dist/dev/{chunk-7kns3qe6.js → chunk-v2g91mrm.js}

@@ -496,6 +496,7 @@ var META_KEYS = [
   "sectionFolded",
   "tab",
   "pinned",
+  "inPresets",
   "subsection"
 ];
 function pickMeta(source, skip = []) {
@@ -529,6 +530,13 @@ function pinnedKeys(schema, groups = []) {
       out.add(key);
   return out;
 }
+function presetFreeKeys(schema, pinned, groups = {}) {
+  let out = new Set(pinned);
+  for (let [key, f] of Object.entries(schema))
+    if (f.inPresets === !1 || f.group !== void 0 && groups[f.group] === !1)
+      out.add(key);
+  return out;
+}
 var SPRING2 = {
   duration: { min: 0.05, max: 2, step: 0.01 },
   bounce: { min: -0.5, max: 1, step: 0.01 }
@@ -1177,4 +1185,4 @@ function urlFlag2(name) {
 }
 var storageKey = (id, part) => `knobs:${encodeURIComponent(id)}:${part}:v1`;
 
-export { maxChroma, oklchToRgb, parseColor2, fitColor, formatColor, colorHex2, EASINGS2, EASING_Y, easingName, bezierPoint2, bezierCss2, normalizeCombo2, letterOf2, comboFromEvent2, heldMods, matchesCombo2, comboParts2, comboLabel2, isTypingTarget, GRADIENT_SAMPLES, sampleGradient2, gradientSamples, gradientCss2, stopColorAt, sampleCurve2, curveSamples, CURVE_SHAPES2, inRange, sameRamp, randomStops, mutateStops, randomPoints, mutatePoints, pickMeta, isReadout2, hasValue2, variantsOf, pinnedKeys, SPRING2, valueKeys, knob2, choice2, action2, flatSpring2, toggle2, spring2, color2, point2, easing2, vec22, vec32, range2, angle2, seed2, keybind2, text2, gradient2, curve2, toolbarShortcut2, actionShortcut2, toolbar2, watch2, sparkline2, graph2, meter2, table2, log2, wrapAngle2, normalizeField, normalize, isRecord, same, equal, Spring, springMotion2, springResponse, springEasing, springCss2, SPRINGS2, FADE, MOTION, reducedMotion, reducedSpring2, springLinear, DEFAULT_LINEAR, motionCss, RESHAPE, RESET_KEYS, REFRESHES, readoutState, pushReadout, READOUT, memoryStorage2, browserStorage, urlFlag2, storageKey };
+export { maxChroma, oklchToRgb, parseColor2, fitColor, formatColor, colorHex2, EASINGS2, EASING_Y, easingName, bezierPoint2, bezierCss2, normalizeCombo2, letterOf2, comboFromEvent2, heldMods, matchesCombo2, comboParts2, comboLabel2, isTypingTarget, GRADIENT_SAMPLES, sampleGradient2, gradientSamples, gradientCss2, stopColorAt, sampleCurve2, curveSamples, CURVE_SHAPES2, inRange, sameRamp, randomStops, mutateStops, randomPoints, mutatePoints, pickMeta, isReadout2, hasValue2, variantsOf, pinnedKeys, presetFreeKeys, SPRING2, valueKeys, knob2, choice2, action2, flatSpring2, toggle2, spring2, color2, point2, easing2, vec22, vec32, range2, angle2, seed2, keybind2, text2, gradient2, curve2, toolbarShortcut2, actionShortcut2, toolbar2, watch2, sparkline2, graph2, meter2, table2, log2, wrapAngle2, normalizeField, normalize, isRecord, same, equal, Spring, springMotion2, springResponse, springEasing, springCss2, SPRINGS2, FADE, MOTION, reducedMotion, reducedSpring2, springLinear, DEFAULT_LINEAR, motionCss, RESHAPE, RESET_KEYS, REFRESHES, readoutState, pushReadout, READOUT, memoryStorage2, browserStorage, urlFlag2, storageKey };

package/dist/dev/index.js

@@ -27,6 +27,7 @@ import {
   hasValue2,
   variantsOf,
   pinnedKeys,
+  presetFreeKeys,
   SPRING2,
   valueKeys,
   knob2,
@@ -76,7 +77,7 @@ import {
   browserStorage,
   urlFlag2,
   storageKey
-} from "./chunk-7kns3qe6.js";
+} from "./chunk-v2g91mrm.js";
 // src/core/random.ts
 var lattice = (min, max, step, r) => min + Math.floor(r * (Math.floor((max - min) / step + 0.000000001) + 1)) * step, between = (min, max, r) => min + (max - min) * r;
 function pick(field, random) {
@@ -575,7 +576,7 @@ function createVariants(schema, id, key, storage, get, set, notify, enabled, see
 }
 
 // src/core/store.ts
-var devBuild = () => !0;
+var devBuild = () => !0, defaultLabelOf = (label, scope) => typeof label === "object" ? label[scope] : label;
 function sameField(a, b) {
   if (a === b)
     return !0;
@@ -605,7 +606,11 @@ function defineControls(id, input, options = {}) {
     if (pinnedOf?.schema !== schema)
       pinnedOf = { schema, keys: pinnedKeys(schema, options.pinned) };
     return pinnedOf.keys;
-  }, variantsChoice = () => variantsOf(schema, (key) => pinned().has(key)), scopingOf, scoping = () => {
+  }, freeOf, presetFree = () => {
+    if (freeOf?.schema !== schema)
+      freeOf = { schema, keys: presetFreeKeys(schema, pinned(), options.inPresets) };
+    return freeOf.keys;
+  }, variantsChoice = () => variantsOf(schema, (key) => presetFree().has(key)), scopingOf, scoping = () => {
     if (scopingOf?.schema === schema)
       return scopingOf;
     let fields = schema, groupTab = /* @__PURE__ */ new Map;
@@ -620,9 +625,13 @@ function defineControls(id, input, options = {}) {
       named.add(variants);
     let of = /* @__PURE__ */ new Map;
     for (let k of valueKeys(schema)) {
-      if (pinned().has(k))
+      let f = fields[k];
+      if (presetFree().has(k)) {
+        if (f.inPresets !== !1 && f.group !== void 0 && named.has(f.group))
+          of.set(k, f.group);
         continue;
-      let f = fields[k], tab = tabOf(f);
+      }
+      let tab = tabOf(f);
       of.set(k, tab !== void 0 && named.has(tab) ? tab : f.group !== void 0 && named.has(f.group) ? f.group : "");
     }
     return scopingOf = { schema, of, named: [...named], variants }, scopingOf;
@@ -1200,9 +1209,10 @@ function defineControls(id, input, options = {}) {
     sectionFolded: options.sectionFolded,
     presetLabel: (presetId, scope = "") => {
       let v = scoping().variants === scope ? variantsChoice() : void 0, 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);
+      return options.presetLabels?.[presetId] ?? (presetId === "default" ? defaultLabelOf(options.defaultLabel, scope) : void 0) ?? (v && option !== void 0 && v.field.options.includes(option) ? v.field.labels?.[option] ?? option : presetId);
     },
     isPinned: (key) => pinned().has(key),
+    inPresets: (key) => !presetFree().has(key),
     get,
     set,
     sync,
@@ -1516,11 +1526,11 @@ function defineControls(id, input, options = {}) {
     code: (format, values) => formatCode(values ?? get(), format),
     variants,
     attach(element, chip) {
-      let load = options.ship ? () => options.ship().then((m) => m.attach) : () => import("./chunk-44r02asc.js").then((m) => m.attach);
+      let load = options.ship ? () => options.ship().then((m) => m.attach) : () => import("./chunk-902v1jgd.js").then((m) => m.attach);
       return live(load, (attach) => attach(controls, element, chip), (detach) => detach());
     },
     mount(container, mountOptions) {
-      let load = options.ship ? () => options.ship().then((m) => m.mountPanel) : () => import("./chunk-mbhy4jg5.js").then((m) => m.mountPanel);
+      let load = options.ship ? () => options.ship().then((m) => m.mountPanel) : () => import("./chunk-49hkdggk.js").then((m) => m.mountPanel);
       return live(load, (mountPanel) => {
         let panel = mountPanel(controls, container, mountOptions);
         return mountOptions?.onReady?.(panel), panel;
@@ -1821,6 +1831,7 @@ function createRemoteControls(id, descriptors, options = {}) {
     presets: options.presets,
     scopedPresets: options.scopedPresets,
     pinned: options.pinned,
+    inPresets: options.inPresets,
     groupPresets: options.groupPresets,
     onPreset: options.onPreset,
     actions: options.actions,

package/dist/index.js

@@ -461,6 +461,7 @@ var META_KEYS = [
   "sectionFolded",
   "tab",
   "pinned",
+  "inPresets",
   "subsection"
 ];
 function pickMeta(source, skip = []) {
@@ -494,6 +495,13 @@ function pinnedKeys(schema, groups = []) {
       out.add(key);
   return out;
 }
+function presetFreeKeys(schema, pinned, groups = {}) {
+  let out = new Set(pinned);
+  for (let [key, f] of Object.entries(schema))
+    if (f.inPresets === !1 || f.group !== void 0 && groups[f.group] === !1)
+      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 }
@@ -1631,7 +1639,7 @@ function createVariants(schema, id, key, storage, get, set, notify, enabled, see
 }
 
 // src/core/store.ts
-var devBuild = () => !1;
+var devBuild = () => !1, defaultLabelOf = (label, scope) => typeof label === "object" ? label[scope] : label;
 function sameField(a, b) {
   if (a === b)
     return !0;
@@ -1661,7 +1669,11 @@ function defineControls(id, input, options = {}) {
     if (pinnedOf?.schema !== schema)
       pinnedOf = { schema, keys: pinnedKeys(schema, options.pinned) };
     return pinnedOf.keys;
-  }, variantsChoice = () => variantsOf(schema, (key) => pinned().has(key)), scopingOf, scoping = () => {
+  }, freeOf, presetFree = () => {
+    if (freeOf?.schema !== schema)
+      freeOf = { schema, keys: presetFreeKeys(schema, pinned(), options.inPresets) };
+    return freeOf.keys;
+  }, variantsChoice = () => variantsOf(schema, (key) => presetFree().has(key)), scopingOf, scoping = () => {
     if (scopingOf?.schema === schema)
       return scopingOf;
     let fields = schema, groupTab = /* @__PURE__ */ new Map;
@@ -1676,9 +1688,13 @@ function defineControls(id, input, options = {}) {
       named.add(variants);
     let of = /* @__PURE__ */ new Map;
     for (let k of valueKeys(schema)) {
-      if (pinned().has(k))
+      let f = fields[k];
+      if (presetFree().has(k)) {
+        if (f.inPresets !== !1 && f.group !== void 0 && named.has(f.group))
+          of.set(k, f.group);
         continue;
-      let f = fields[k], tab = tabOf(f);
+      }
+      let tab = tabOf(f);
       of.set(k, tab !== void 0 && named.has(tab) ? tab : f.group !== void 0 && named.has(f.group) ? f.group : "");
     }
     return scopingOf = { schema, of, named: [...named], variants }, scopingOf;
@@ -2256,9 +2272,10 @@ function defineControls(id, input, options = {}) {
     sectionFolded: options.sectionFolded,
     presetLabel: (presetId, scope = "") => {
       let v = scoping().variants === scope ? variantsChoice() : void 0, 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);
+      return options.presetLabels?.[presetId] ?? (presetId === "default" ? defaultLabelOf(options.defaultLabel, scope) : void 0) ?? (v && option !== void 0 && v.field.options.includes(option) ? v.field.labels?.[option] ?? option : presetId);
     },
     isPinned: (key) => pinned().has(key),
+    inPresets: (key) => !presetFree().has(key),
     get,
     set,
     sync,
@@ -2877,6 +2894,7 @@ function createRemoteControls(id, descriptors, options = {}) {
     presets: options.presets,
     scopedPresets: options.scopedPresets,
     pinned: options.pinned,
+    inPresets: options.inPresets,
     groupPresets: options.groupPresets,
     onPreset: options.onPreset,
     actions: options.actions,