@tremolo-ui/functions 0.4.0 → 0.6.0

package/dist/index.js

@@ -6,35 +6,73 @@ function clamp(value, min, max) {
 	return Math.max(min, Math.min(value, max));
 }
 /**
-* Normalize the value from 0 to 1
+* Normalize the value from 0 to 1, spreading the range evenly.
+*
+* This is the linear mapping and takes no curve of its own; a `Scale` builds
+* whatever curve it needs on top of it.
 */
-function normalizeValue(rawValue, min, max, skew = 1) {
+function normalizeValue(value, min, max) {
 	if (min >= max) throw new RangeError("requirements: min < max");
-	const v = clamp((rawValue - min) / (max - min), 0, 1);
-	return Math.pow(v, skew);
+	return clamp((value - min) / (max - min), 0, 1);
 }
 /**
-* Convert normalized values back to raw values.
+* Convert normalized values back to raw values, spreading the range evenly.
+*
+* The inverse of {@link normalizeValue}.
 */
-function rawValue(normalizedValue, min, max, skew = 1) {
+function rawValue(normalizedValue, min, max) {
 	if (min >= max) throw new RangeError("requirements: min < max");
-	return min + (skew == 1 ? clamp(normalizedValue, 0, 1) : Math.exp(Math.log(clamp(normalizedValue, 0, 1)) / skew)) * (max - min);
-}
-function skewWithCenterValue(centerValue, min, max) {
-	if (!(min <= centerValue && centerValue <= max)) throw new RangeError("requirements: min <= centerValue <= max");
-	return Math.log(.5) / Math.log((centerValue - min) / (max - min));
+	return min + clamp(normalizedValue, 0, 1) * (max - min);
 }
+/**
+* Put a value on the grid the caller asked for, rounding a half step upwards.
+*
+* The rounding is done on the quotient rather than by comparing the distance
+* to the two neighbours, because both of those carry error of their own. The
+* quotient is cleared of its artefact first: `0.15 / 0.1` is 1.4999999999999998,
+* and a value sitting exactly on a half step would otherwise fall to whichever
+* side the last bit happened to land on — 0.25 rounded up while 0.15 and 0.35
+* rounded down.
+*/
 function stepValue(value, step) {
 	if (step <= 0) throw new RangeError("requirements: step > 0");
-	const quotient = Math.floor(value / step);
-	const decimalDigits = decimalPart(step)?.length;
-	const v = toFixed(quotient * step, decimalDigits);
-	const next = toFixed((quotient + 1) * step, decimalDigits);
-	return Math.abs(value - v) < Math.abs(value - next) ? v : next;
+	const stepped = toPrecision(Math.round(toPrecision(value / step)) * step);
+	return stepped === 0 ? 0 : stepped;
 }
 function toFixed(x, fractionDigits) {
 	return Number(x.toFixed(fractionDigits));
 }
+/**
+* The significant decimal digits a double actually carries. A double holds a
+* little under 16, so anything past this is the binary representation showing
+* through rather than information.
+*/
+const SIGNIFICANT_DIGITS = 15;
+/**
+* Drop the binary artefact from a computed value.
+*
+* Arithmetic on doubles leaves debris in the last couple of digits, and it
+* accumulates: adding 0.1 to 5 twelve times gives 5.699999999999998 rather
+* than 5.7, and the display of a control shows exactly that. Rounding to the
+* digits a double can carry removes it, and adds nothing back — the value was
+* already the result of a calculation whose own error is that size or larger.
+*
+* This is not the same as rounding to a `step`. {@link stepValue} puts a value
+* on a grid the caller asked for and is a decision about the value; this only
+* removes what was never in the value to begin with.
+*
+* @param significantDigits how many digits to keep. The default is the only
+* one that is purely artefact removal; a smaller number starts discarding real
+* precision.
+*
+* @example
+* toPrecision(5.1 + 0.1) // 5.2, rather than 5.199999999999999
+*/
+function toPrecision(x, significantDigits = 15) {
+	if (x === 0 || !Number.isFinite(x)) return x;
+	const rounded = Number(x.toPrecision(significantDigits));
+	return Number.isFinite(rounded) ? rounded : x;
+}
 function integerPart(x) {
 	if (Number.isNaN(x)) return;
 	return String(x).split(".")[0];
@@ -58,25 +96,288 @@ function gainToDb(gain) {
 	return 20 * (Math.log(gain) / Math.LN10);
 }
 //#endregion
-//#region src/util.ts
-function styleHelper(value, op, influencer) {
-	if (op && influencer) if (typeof value == "number") {
-		if (op == "+") return `${value + influencer}px`;
-		if (op == "-") return `${value - influencer}px`;
-		if (op == "*") return `${value * influencer}px`;
-		if (op == "/") return `${value / influencer}px`;
-	} else return `calc(${value}px ${op} ${influencer})`;
-	else if (typeof value == "number") return `${value}px`;
-	else return value;
-}
-function isEmpty(obj) {
-	return Object.keys(obj).length == 0;
+//#region src/modifiers.ts
+/**
+* Checked in this order, and the first one that is both held and configured
+* wins. Fixing an order is what keeps two modifiers held at once from
+* behaving differently between browsers.
+*/
+const MODIFIER_ORDER = [
+	"meta",
+	"ctrl",
+	"alt",
+	"shift"
+];
+const MODIFIER_FLAG = {
+	meta: "metaKey",
+	ctrl: "ctrlKey",
+	alt: "altKey",
+	shift: "shiftKey"
+};
+/**
+* A map is the only form with a `default` key, which is what tells it apart
+* from a bare setting. Tuples are arrays, so they never match.
+*/
+function isModifierMap(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value) && "default" in value;
+}
+/**
+* Pick the setting that applies, given the modifier keys being held.
+*
+* @example
+* selectModifier({ default: 1, shift: 0.1 }, event)
+*/
+function selectModifier(options, modifiers) {
+	if (!isModifierMap(options)) return {
+		value: options,
+		modifier: null
+	};
+	if (modifiers) for (const modifier of MODIFIER_ORDER) {
+		const value = options[modifier];
+		if (value !== void 0 && modifiers[MODIFIER_FLAG[modifier]]) return {
+			value,
+			modifier
+		};
+	}
+	return {
+		value: options.default,
+		modifier: null
+	};
+}
+/**
+* Turn every entry of a setting into another kind of setting, keeping which
+* modifier each belongs to.
+*
+* A drag sensitivity is a number and a keyboard amount is a tuple, but the two
+* describe the same thing from the caller's side. This carries one over to the
+* other so that a component can hand a sensitivity to {@link applyDelta}
+* without unpicking the modifier map itself — which matters, since naming a
+* modifier is also what takes `step` out of the pipeline.
+*
+* @example
+* mapModifier({ default: 1, shift: 0.1 }, (f) => ['raw', step * f])
+* // { default: ['raw', 1], shift: ['raw', 0.1] }
+*/
+function mapModifier(options, fn) {
+	if (!isModifierMap(options)) return fn(options);
+	const mapped = { default: fn(options.default) };
+	for (const modifier of MODIFIER_ORDER) {
+		const value = options[modifier];
+		if (value !== void 0) mapped[modifier] = fn(value);
+	}
+	return mapped;
 }
+/**
+* Pick the amount that applies, given the modifier keys being held.
+*
+* @example
+* selectInputEvent({ default: ['raw', 1], shift: ['raw', 0.1] }, event)
+*/
+function selectInputEvent(options, modifiers) {
+	const { value, modifier } = selectModifier(options, modifiers);
+	return {
+		option: value,
+		modifier
+	};
+}
+//#endregion
+//#region src/scales.ts
+function assertRange(min, max) {
+	if (min >= max) throw new RangeError("requirements: min < max");
+}
+function assertPositiveFinite(value, name) {
+	if (!Number.isFinite(value) || value <= 0) throw new RangeError(`${name}: requirements: finite and greater than 0`);
+}
+/**
+* Equal travel gives an equal change in value.
+*
+* The right default for anything already linear in perception: dB values,
+* pan, percentages, MIDI note numbers, semitones.
+*/
+const linearScale = {
+	normalize: (value, min, max) => normalizeValue(value, min, max),
+	denormalize: (position, min, max) => rawValue(position, min, max)
+};
+/**
+* The power law of JUCE's `NormalisableRange::skew`, applied to `value - min`.
+*
+* Use it when the value has to agree with a JUCE or iPlug2 parameter — a
+* plugin UI in a WebView, say, where the knob must sit exactly where the
+* host's automation curve puts it. {@link skewWithCenterValue} gives the
+* factor that places a chosen value at the middle of the travel.
+*
+* `skew < 1` gives the lower end more travel, `skew > 1` the upper end.
+*
+* For new designs prefer {@link exponentialScale} or {@link curveScale}: the
+* slope of this curve is either zero or infinite at `min`, so the bottom of
+* the range is a dead zone or jumps.
+*
+* @param skew the JUCE skew factor
+*/
+function skewScale(skew) {
+	assertPositiveFinite(skew, "skewScale");
+	return {
+		normalize: (value, min, max) => Math.pow(normalizeValue(value, min, max), skew),
+		denormalize: (position, min, max) => rawValue(skew === 1 ? position : Math.exp(Math.log(clamp(position, 0, 1)) / skew), min, max)
+	};
+}
+/**
+* The skew factor for {@link skewScale} that puts `centerValue` at the middle
+* of the travel — JUCE's `NormalisableRange::setSkewForCentre`.
+*/
+function skewWithCenterValue(centerValue, min, max) {
+	assertRange(min, max);
+	if (!(min < centerValue && centerValue < max)) throw new RangeError("requirements: min < centerValue < max");
+	return Math.log(.5) / Math.log((centerValue - min) / (max - min));
+}
+/**
+* Equal travel gives an equal *ratio*, so an octave — or a percentage — takes
+* the same distance wherever it falls.
+*
+* The scale for frequency (a filter cutoff over 20-20000 Hz), free running
+* rates, and delay times.
+*
+* Requires `min` and `max` to be non-zero and of the same sign, since no
+* ratio reaches zero or crosses it. Use {@link curveScale} for a range that
+* starts at 0.
+*/
+const exponentialScale = {
+	normalize: (value, min, max) => {
+		assertExponentialRange(min, max);
+		const start = Math.log(Math.abs(min));
+		const end = Math.log(Math.abs(max));
+		return clamp((Math.log(Math.abs(clamp(value, min, max))) - start) / (end - start), 0, 1);
+	},
+	denormalize: (position, min, max) => {
+		assertExponentialRange(min, max);
+		const start = Math.log(Math.abs(min));
+		const magnitude = Math.exp(start + (Math.log(Math.abs(max)) - start) * clamp(position, 0, 1));
+		return Math.sign(min) * magnitude;
+	}
+};
+function assertExponentialRange(min, max) {
+	assertRange(min, max);
+	if (min === 0 || max === 0 || Math.sign(min) !== Math.sign(max)) throw new RangeError("exponentialScale: requirements: min and max are non-zero and have the same sign");
+}
+/**
+* An exponential bend that still passes exactly through `min` and `max`, so
+* unlike {@link exponentialScale} it works on a range that starts at 0 or
+* crosses it, and unlike {@link skewScale} its slope is neither zero nor
+* infinite at either end.
+*
+* The general purpose taper, and the same family as the curve of an envelope
+* segment (SuperCollider's `CurveWarp`).
+*
+* - `curve > 0` gives the lower end more travel — envelope times from 0 ms,
+*   delay times, anything that wants fine control near the bottom
+* - `curve < 0` gives the upper end more travel — a volume fader over
+*   -60..+6 dB that should be precise around 0 dB
+* - near 0 it is indistinguishable from {@link linearScale}, and is treated
+*   as linear to avoid dividing by zero
+*
+* {@link curveWithCenterValue} gives the curve that places a chosen value at
+* the middle of the travel.
+*
+* @param curve how hard the curve bends, and in which direction
+*/
+function curveScale(curve) {
+	if (!Number.isFinite(curve) || Math.abs(curve) > 32) throw new RangeError("curveScale: requirements: finite curve from -32 to 32");
+	if (Math.abs(curve) < .001) return linearScale;
+	return {
+		normalize: (value, min, max) => {
+			assertRange(min, max);
+			const proportion = clamp((value - min) / (max - min), 0, 1);
+			if (proportion === 0 || proportion === 1) return proportion;
+			if (curve > 0) return 1 + Math.log(proportion + (1 - proportion) * Math.exp(-curve)) / curve;
+			return Math.log1p(proportion * Math.expm1(curve)) / curve;
+		},
+		denormalize: (position, min, max) => {
+			assertRange(min, max);
+			const p = clamp(position, 0, 1);
+			if (p === 0) return min;
+			if (p === 1) return max;
+			const proportion = curve > 0 ? Math.exp(curve * (p - 1)) * (1 - Math.exp(-curve * p)) / (1 - Math.exp(-curve)) : Math.expm1(curve * p) / Math.expm1(curve);
+			return min + (max - min) * proportion;
+		}
+	};
+}
+/**
+* {@link skewScale} mirrored about the middle of the range, so both halves
+* bend the same way — JUCE's `symmetricSkew`.
+*
+* For a bipolar control whose centre matters: detune over -100..+100 cents,
+* or a bipolar filter envelope amount, where the fine adjustment is around 0
+* rather than at either end.
+*
+* `skew < 1` gives the middle more travel, `skew > 1` the two ends.
+*
+* @param skew the JUCE skew factor
+*/
+function symmetricSkewScale(skew) {
+	assertPositiveFinite(skew, "symmetricSkewScale");
+	return {
+		normalize: (value, min, max) => {
+			assertRange(min, max);
+			const proportion = clamp((value - min) / (max - min), 0, 1);
+			if (skew === 1) return proportion;
+			const distanceFromMiddle = 2 * proportion - 1;
+			return (1 + Math.pow(Math.abs(distanceFromMiddle), skew) * Math.sign(distanceFromMiddle)) / 2;
+		},
+		denormalize: (position, min, max) => {
+			assertRange(min, max);
+			let distanceFromMiddle = 2 * clamp(position, 0, 1) - 1;
+			if (skew !== 1 && distanceFromMiddle !== 0) distanceFromMiddle = Math.pow(Math.abs(distanceFromMiddle), 1 / skew) * Math.sign(distanceFromMiddle);
+			return min + (max - min) / 2 * (1 + distanceFromMiddle);
+		}
+	};
+}
+/**
+* The curve for {@link curveScale} that puts `centerValue` at the middle of
+* the travel — the counterpart of {@link skewWithCenterValue}.
+*/
+function curveWithCenterValue(centerValue, min, max) {
+	assertRange(min, max);
+	if (!(min < centerValue && centerValue < max)) throw new RangeError("requirements: min < centerValue < max");
+	const proportion = (centerValue - min) / (max - min);
+	return 2 * Math.log(1 / proportion - 1);
+}
+/**
+* Move a value by an amount of input, as reported by a wheel or an arrow key.
+*
+* The pipeline matches `createDragValue` of `@tremolo-ui/dom`: scale, then
+* step, then clamp. Which key or which sign of `deltaY` counts as which
+* direction is left to the caller, since it differs per component.
+*
+* @param direction which way, and how many times, to apply the option. The
+* size of one step is `option[1]`, so this is normally `1` or `-1`.
+*
+* @param modifiers the event, for `options` that name a modifier key. See
+* {@link selectInputEvent}.
+*
+* @example
+* // ArrowDown on a slider whose keyboard option is ['raw', 1]
+* applyDelta(value, -1, keyboard, { min, max, step, scale })
+*
+* @example
+* // Shift+ArrowDown, where `keyboard` is { default: …, shift: ['raw', 0.1] }
+* applyDelta(value, -1, keyboard, range, event)
+*/
+function applyDelta(value, direction, options, { min, max, step, scale = linearScale }, modifiers) {
+	assertRange(min, max);
+	if (step !== void 0) assertPositiveFinite(step, "applyDelta step");
+	const { option: [mode, amount], modifier } = selectInputEvent(options, modifiers);
+	const x = direction * amount;
+	const next = mode === "normalized" ? scale.denormalize(scale.normalize(value, min, max) + x, min, max) : value + x;
+	const quantum = modifier === null ? step : void 0;
+	return clamp(toPrecision(quantum !== void 0 ? stepValue(next, quantum) : next), min, max);
+}
+//#endregion
+//#region src/util.ts
 function mod(n, m) {
 	return (n % m + m) % m;
 }
 function xor(a = false, b = false) {
-	return (a || b) && a != b;
+	return (a || b) && a !== b;
 }
 //#endregion
 //#region src/midi.ts
@@ -103,14 +404,19 @@ const noteKeys = [
 	"A#",
 	"B"
 ];
+function assertSafeInteger(value, name) {
+	if (!Number.isSafeInteger(value)) throw new RangeError(`${name}: requirements: a safe integer`);
+}
 function parseNoteName(noteName) {
 	const m = noteName.match(/^([a-g])(#{0,2}|b{0,2})(-?\d+)$/i);
 	if (!m) throw new Error("Invalid note name");
 	const [, letter, accidental, octave] = m;
+	const parsedOctave = Number(octave);
+	assertSafeInteger(parsedOctave, "octave");
 	return {
 		letter: letter.toLocaleUpperCase(),
 		accidental,
-		octave: Number(octave)
+		octave: parsedOctave
 	};
 }
 /**
@@ -119,8 +425,10 @@ function parseNoteName(noteName) {
 function noteNumber(noteName) {
 	const { letter, accidental, octave } = parseNoteName(noteName);
 	const noteIndex = noteKeys.indexOf(letter.toLocaleUpperCase());
-	const accidentalValue = (accidental[0] == "b" ? -1 : 1) * accidental.length;
-	return noteIndex + 12 * (Number(octave) + 1) + accidentalValue;
+	const accidentalValue = (accidental[0] === "b" ? -1 : 1) * accidental.length;
+	const result = noteIndex + 12 * (octave + 1) + accidentalValue;
+	assertSafeInteger(result, "note number");
+	return result;
 }
 /**
 * Convert noteNumber to noteName
@@ -129,6 +437,7 @@ function noteNumber(noteName) {
 * @param noteNumber noteNumber
 */
 function noteName(noteNumber) {
+	assertSafeInteger(noteNumber, "note number");
 	const noteIndex = mod(noteNumber, 12);
 	const octave = Math.floor(noteNumber / 12) - 1;
 	return `${noteKeys[noteIndex]}${octave}`;
@@ -137,14 +446,16 @@ function noteName(noteNumber) {
 * Convert noteNumber to noteKey
 */
 function noteKey(noteNumber) {
+	assertSafeInteger(noteNumber, "note number");
 	return noteKeys[mod(noteNumber, 12)];
 }
 /**
 * @param note noteNumber: 0 ~ 127 or noteName e.g. 'C3'
 */
 function isWhiteKey(note) {
-	const n = typeof note == "string" ? noteNumber(note) : note;
-	return mod(n, 12) == 0 || mod(n, 12) == 2 || mod(n, 12) == 4 || mod(n, 12) == 5 || mod(n, 12) == 7 || mod(n, 12) == 9 || mod(n, 12) == 11;
+	const n = typeof note === "string" ? noteNumber(note) : note;
+	assertSafeInteger(n, "note number");
+	return mod(n, 12) === 0 || mod(n, 12) === 2 || mod(n, 12) === 4 || mod(n, 12) === 5 || mod(n, 12) === 7 || mod(n, 12) === 9 || mod(n, 12) === 11;
 }
 /**
 * @param note noteNumber: 0 ~ 127 or noteName e.g. 'C3'
@@ -159,10 +470,428 @@ function isBlackKey(note) {
 * @returns frequency [Hz]
 */
 function noteToFrequency(note, detune = 0, a4 = 440) {
-	const n = typeof note == "string" ? noteNumber(note) : note;
+	const n = typeof note === "string" ? noteNumber(note) : note;
+	assertSafeInteger(n, "note number");
 	return a4 / 32 * 2 ** ((n - 9 + detune / 100) / 12);
 }
+/**
+* Semitones above the root, for each supported scale.
+*
+* Every entry starts at 0 and stays inside one octave, so a scale is a set of
+* pitch classes rather than a set of notes: {@link inScale} compares against
+* it with the octave taken out.
+*
+* `ionian` and `aeolian` are the same sets as `major` and `naturalMinor`; both
+* spellings are here because both are what someone reaches for depending on
+* whether they are thinking in keys or in modes.
+*/
+const scaleIntervals = {
+	major: [
+		0,
+		2,
+		4,
+		5,
+		7,
+		9,
+		11
+	],
+	naturalMinor: [
+		0,
+		2,
+		3,
+		5,
+		7,
+		8,
+		10
+	],
+	harmonicMinor: [
+		0,
+		2,
+		3,
+		5,
+		7,
+		8,
+		11
+	],
+	melodicMinor: [
+		0,
+		2,
+		3,
+		5,
+		7,
+		9,
+		11
+	],
+	ionian: [
+		0,
+		2,
+		4,
+		5,
+		7,
+		9,
+		11
+	],
+	dorian: [
+		0,
+		2,
+		3,
+		5,
+		7,
+		9,
+		10
+	],
+	phrygian: [
+		0,
+		1,
+		3,
+		5,
+		7,
+		8,
+		10
+	],
+	lydian: [
+		0,
+		2,
+		4,
+		6,
+		7,
+		9,
+		11
+	],
+	mixolydian: [
+		0,
+		2,
+		4,
+		5,
+		7,
+		9,
+		10
+	],
+	aeolian: [
+		0,
+		2,
+		3,
+		5,
+		7,
+		8,
+		10
+	],
+	locrian: [
+		0,
+		1,
+		3,
+		5,
+		6,
+		8,
+		10
+	],
+	majorPentatonic: [
+		0,
+		2,
+		4,
+		7,
+		9
+	],
+	minorPentatonic: [
+		0,
+		3,
+		5,
+		7,
+		10
+	],
+	blues: [
+		0,
+		3,
+		5,
+		6,
+		7,
+		10
+	],
+	wholeTone: [
+		0,
+		2,
+		4,
+		6,
+		8,
+		10
+	],
+	chromatic: [
+		0,
+		1,
+		2,
+		3,
+		4,
+		5,
+		6,
+		7,
+		8,
+		9,
+		10,
+		11
+	]
+};
+/**
+* Whether a note belongs to a scale, regardless of the octave either sits in.
+*
+* @param note noteNumber: 0 ~ 127 or noteName e.g. 'C3'
+* @param root the note the scale is built on, in the same two forms
+*
+* @example
+* ```ts
+* inScale('F#4', 'D3', 'major') // true
+* ```
+*/
+function inScale(note, root, name) {
+	const n = typeof note === "string" ? noteNumber(note) : note;
+	const r = typeof root === "string" ? noteNumber(root) : root;
+	assertSafeInteger(n, "note number");
+	assertSafeInteger(r, "root note number");
+	return scaleIntervals[name].includes(mod(n - r, 12));
+}
+/**
+* The notes of a scale, ascending from `root`.
+*
+* The octave above the root is not included: ask for more `octaves` instead, so
+* that concatenating the result of two calls does not repeat a note.
+*
+* @param root noteNumber: 0 ~ 127 or noteName e.g. 'C3'
+* @param octaves how many octaves to cover
+*
+* @example
+* ```ts
+* scaleNotes('C3', 'majorPentatonic') // [48, 50, 52, 55, 57]
+* ```
+*/
+function scaleNotes(root, name, octaves = 1) {
+	const r = typeof root === "string" ? noteNumber(root) : root;
+	assertSafeInteger(r, "root note number");
+	if (!Number.isSafeInteger(octaves) || octaves < 0) throw new RangeError("octaves: requirements: a non-negative safe integer");
+	const intervals = scaleIntervals[name];
+	return Array.from({ length: octaves }, (_, octave) => intervals.map((interval) => r + octave * 12 + interval)).flat();
+}
+//#endregion
+//#region src/piano.ts
+/**
+* `[noteRange.first, noteRange.first + 1, ..., noteRange.last]`
+*/
+function getNoteRangeArray(noteRange) {
+	return Array.from({ length: noteRange.last - noteRange.first + 1 }, (_, i) => i + noteRange.first);
+}
+const DEFAULT_KEY_GAP = 1;
+const DEFAULT_BLACK_KEY_WIDTH_RATIO = .65;
+const DEFAULT_BLACK_KEY_HEIGHT_RATIO = .6;
+/**
+* How many white keys sit at or before each pitch class, counting from C.
+*
+* A black key shares the number of the white key to its left plus one, which
+* puts it on the boundary between the two; {@link notePosition} then shifts it
+* back by half its width to centre it there.
+*/
+const whiteKeysBefore = {
+	C: 0,
+	"C#": 1,
+	D: 1,
+	"D#": 2,
+	E: 2,
+	F: 3,
+	"F#": 4,
+	G: 4,
+	"G#": 5,
+	A: 5,
+	"A#": 6,
+	B: 6
+};
+/** Width of a black key in pixels. */
+function blackKeyWidth(layout) {
+	return layout.whiteKeyWidth * (layout.blackKeyWidthRatio ?? DEFAULT_BLACK_KEY_WIDTH_RATIO);
+}
+function rawNotePosition(note, layout) {
+	const slot = layout.whiteKeyWidth + (layout.keyGap ?? DEFAULT_KEY_GAP);
+	const target = noteKey(note);
+	const first = noteKey(layout.noteRange.first);
+	const octave = Math.floor((note - layout.noteRange.first) / 12);
+	const octaveOffset = noteKeys.indexOf(first) > noteKeys.indexOf(target) ? 1 : 0;
+	const whiteKeysIn = whiteKeysBefore[target] - whiteKeysBefore[first] + (octave + octaveOffset) * 7;
+	return isBlackKey(note) ? whiteKeysIn * slot - blackKeyWidth(layout) / 2 : whiteKeysIn * slot;
+}
+function pianoBounds(layout) {
+	const notes = getNoteRangeArray(layout.noteRange);
+	if (notes.length === 0) return {
+		left: 0,
+		right: 0
+	};
+	let left = Infinity;
+	let right = -Infinity;
+	const whiteWidth = layout.whiteKeyWidth + (layout.keyGap ?? DEFAULT_KEY_GAP);
+	for (const note of notes) {
+		const noteLeft = rawNotePosition(note, layout);
+		const width = isBlackKey(note) ? blackKeyWidth(layout) : whiteWidth;
+		left = Math.min(left, noteLeft);
+		right = Math.max(right, noteLeft + width);
+	}
+	return {
+		left,
+		right
+	};
+}
+/** Width of the whole keyboard in pixels. */
+function pianoWidth(layout) {
+	const { left, right } = pianoBounds(layout);
+	return right - left;
+}
+/**
+* Offset of the left edge of a key from the left edge of the keyboard, in
+* pixels.
+*
+* Notes outside `noteRange` are placed too, so the value is negative below
+* `noteRange.first`.
+*/
+function notePosition(note, layout) {
+	return rawNotePosition(note, layout) - pianoBounds(layout).left;
+}
+/**
+* The note drawn at a point, or null where there is none.
+*
+* Black keys are tested first, so they win where they overlap a white one. A
+* white key covers its gap as well as its width, so the whole width of the
+* keyboard belongs to some key and a click cannot fall between two.
+*
+* @param x offset from the left edge of the keyboard, in pixels
+* @param y offset from its top edge, in pixels
+* @param height height of the keyboard, in pixels
+*/
+function noteAt(x, y, height, layout) {
+	if (x < 0 || x >= pianoWidth(layout) || y < 0 || y >= height) return null;
+	const notes = getNoteRangeArray(layout.noteRange);
+	if (y < height * (layout.blackKeyHeightRatio ?? DEFAULT_BLACK_KEY_HEIGHT_RATIO)) for (const note of notes) {
+		if (isWhiteKey(note)) continue;
+		const left = notePosition(note, layout);
+		if (left <= x && x < left + blackKeyWidth(layout)) return note;
+	}
+	const slot = layout.whiteKeyWidth + (layout.keyGap ?? DEFAULT_KEY_GAP);
+	for (const note of notes) {
+		if (isBlackKey(note)) continue;
+		const left = notePosition(note, layout);
+		if (left <= x && x < left + slot) return note;
+	}
+	return null;
+}
+//#endregion
+//#region src/unit.ts
+/** Ordered small to large. The empty symbol is the base unit. */
+const PREFIXES = [
+	["p", 1e-12],
+	["n", 1e-9],
+	["µ", 1e-6],
+	["m", .001],
+	["", 1],
+	["k", 1e3],
+	["M", 1e6],
+	["G", 1e9]
+];
+const PREFIX_SCALE = new Map(PREFIXES);
+/**
+* Micro is written three ways. `µ` (U+00B5 MICRO SIGN) is what `format`
+* writes and what d3-format uses, `μ` (U+03BC GREEK SMALL LETTER MU) looks
+* identical and is what a Greek keyboard produces, and `u` is what everyone
+* actually types. All three read back the same.
+*/
+const MICRO_ALIASES = {
+	μ: "µ",
+	u: "µ"
+};
+/**
+* Divide by a prefix scale without showing the result of doing so in binary.
+*
+* `0.0005 / 1e-6` is 500.00000000000006, and with no `digits` to round it that
+* lands in the input as written.
+*/
+function scaleBy(value, scale) {
+	return toPrecision(value / scale);
+}
+/** A number, then whatever followed it. */
+const NUMBER_THEN_REST = /^([+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:[eE][+-]?\d+)?)\s*(.*)$/;
+/**
+* Build the `format` and `parse` of a unit, as one pair.
+*
+* They are returned together because they have to agree: a `format` that
+* writes `1.23kHz` is only useful next to a `parse` that reads it back as
+* 1230. Spread the result into the input.
+*
+* @example
+* unitFormat('Hz')                                 // 1234 -> '1.23kHz'
+* unitFormat('s', { base: 'm' })                   // value in ms. 1500 -> '1.5s'
+* unitFormat('s', { base: 'm', digits: 2 })        // 1500 -> '1.50s'
+* unitFormat('dB', { prefixes: false, digits: 1 }) // -6.25 -> '-6.3dB'
+*
+* @example
+* <NumberInput.Root {...unitFormat('Hz', { digits: 2 })} value={v} onChange={setV}>
+*/
+function unitFormat(unit, options = {}) {
+	const { base = "", prefixes = true, digits, separator = "" } = options;
+	if (unit === "" && base !== "") throw new RangeError("unitFormat: base requires a non-empty unit");
+	const baseScale = PREFIX_SCALE.get(base) ?? 1;
+	/**
+	* `toFixed` renders anything that rounds to zero from below as `-0`, which
+	* is never what a control should show.
+	*/
+	const fixed = (value) => {
+		const text = digits !== void 0 ? value.toFixed(digits) : String(value);
+		return Number(text) === 0 ? text.replace("-", "") : text;
+	};
+	if (!prefixes) {
+		const symbol = base + unit;
+		return {
+			format: (value) => Number.isFinite(value) ? fixed(value) + separator + symbol : String(value),
+			parse: (text) => {
+				const match = text.trim().match(NUMBER_THEN_REST);
+				if (!match) return NaN;
+				const value = Number(match[1]);
+				return Number.isFinite(value) ? value : NaN;
+			}
+		};
+	}
+	return {
+		format: (value) => {
+			if (!Number.isFinite(value)) return String(value);
+			const si = value * baseScale;
+			let index = PREFIXES.findIndex(([, scale]) => scale === 1);
+			if (si !== 0) {
+				const magnitude = Math.abs(si);
+				index = 0;
+				for (let i = PREFIXES.length - 1; i >= 0; i--) if (magnitude >= PREFIXES[i][1]) {
+					index = i;
+					break;
+				}
+			}
+			let text = fixed(scaleBy(si, PREFIXES[index][1]));
+			if (Math.abs(Number(text)) >= 1e3 && index < PREFIXES.length - 1) {
+				index += 1;
+				text = fixed(scaleBy(si, PREFIXES[index][1]));
+			}
+			return text + separator + PREFIXES[index][0] + unit;
+		},
+		parse: (text) => {
+			const match = text.trim().match(NUMBER_THEN_REST);
+			if (!match) return NaN;
+			const number = Number(match[1]);
+			if (!Number.isFinite(number)) return NaN;
+			let suffix = match[2].trim();
+			const separatorText = separator.trim();
+			if (separatorText !== "" && suffix.startsWith(separatorText)) suffix = suffix.slice(separatorText.length).trim();
+			if (suffix === "") return number;
+			let prefix = null;
+			if (unit !== "" && suffix.endsWith(unit)) prefix = suffix.slice(0, suffix.length - unit.length);
+			else if (suffix.length <= 1) prefix = suffix;
+			if (prefix === null) return number;
+			const normalized = MICRO_ALIASES[prefix] ?? prefix;
+			const scale = PREFIX_SCALE.get(normalized);
+			if (scale === void 0) return number;
+			return number * scale / baseScale;
+		}
+	};
+}
 //#endregion
-export { clamp, dbToGain, decimalPart, degree, gainToDb, integerPart, isBlackKey, isEmpty, isWhiteKey, mapValue, mod, normalizeValue, noteKey, noteKeys, noteName, noteNumber, noteToFrequency, parseNoteName, radian, rawValue, skewWithCenterValue, stepValue, styleHelper, toFixed, whiteKeys, xor };
+export { SIGNIFICANT_DIGITS, applyDelta, blackKeyWidth, clamp, curveScale, curveWithCenterValue, dbToGain, decimalPart, degree, exponentialScale, gainToDb, getNoteRangeArray, inScale, integerPart, isBlackKey, isWhiteKey, linearScale, mapModifier, mapValue, mod, normalizeValue, noteAt, noteKey, noteKeys, noteName, noteNumber, notePosition, noteToFrequency, parseNoteName, pianoWidth, radian, rawValue, scaleIntervals, scaleNotes, selectInputEvent, selectModifier, skewScale, skewWithCenterValue, stepValue, symmetricSkewScale, toFixed, toPrecision, unitFormat, whiteKeys, xor };
 
 //# sourceMappingURL=index.js.map