@xsynaptic/sonic-ui 0.4.0 → 0.5.0

package/dist/default/lib/value-mapping.js

@@ -0,0 +1,115 @@
+import { clamp, decimalPlaces, roundTo, trimFloat } from "./math.js";
+import { nearestPosition } from "./number-list.js";
+import { linearTaper, listTaper, logTaper, skewTaper } from "./taper.js";
+
+//#region src/lib/value-mapping.ts
+const resetKeys = /* @__PURE__ */ new Set(["Backspace", "Delete"]);
+const keySteps = /* @__PURE__ */ new Map([
+	["ArrowDown", -1],
+	["ArrowLeft", -1],
+	["ArrowRight", 1],
+	["ArrowUp", 1],
+	["PageDown", -10],
+	["PageUp", 10]
+]);
+function curveOf(spec, max) {
+	const { min, positions } = spec;
+	if (positions) return listTaper(positions);
+	if (spec.isNotched || spec.isWrapping) return void 0;
+	return (spec.taper === "log" ? logTaper(min, max) : void 0) ?? skewTaper(min, max, spec.midpoint ?? NaN);
+}
+function countPositions(spec, count) {
+	if (!spec.isNotched || !Number.isFinite(count) || count < 2) return;
+	return count;
+}
+function countSteps(spec, range) {
+	if (spec.step <= 0) return NaN;
+	const fit = trimFloat(range / spec.step);
+	return spec.isWrapping ? Math.max(1, Math.ceil(fit)) : Math.floor(fit) + 1;
+}
+function valueMapping(spec) {
+	const { min, positions, step } = spec;
+	const max = Math.max(min, spec.max);
+	const range = max - min;
+	const count = countSteps(spec, range);
+	const isStepped = step > 0 && !positions;
+	const curve = curveOf(spec, max);
+	const taper = curve ?? linearTaper(min, max);
+	function round(value) {
+		if (step <= 0) return trimFloat(value);
+		return roundTo(value, Math.max(decimalPlaces(step), decimalPlaces(min)));
+	}
+	const top = round((count - 1) * step);
+	function limits() {
+		if (positions) return [positions[0] ?? min, positions.at(-1) ?? max];
+		return [min, isStepped && !spec.isWrapping ? round(min + top) : max];
+	}
+	const bounds = limits();
+	function wrap(value, span) {
+		const offset = round(((value - min) % span + span) % span);
+		return offset >= span ? 0 : offset;
+	}
+	function bound(value) {
+		if (!spec.isWrapping) return clamp(value, ...bounds);
+		if (range <= 0) return min;
+		return round(min + wrap(value, range));
+	}
+	function ring(value, span) {
+		if (range <= 0) return min;
+		const offset = wrap(value, span);
+		if (offset > top) return span - offset <= offset - top ? min : round(min + top);
+		return round(min + Math.round(offset / step) * step);
+	}
+	function snap(value) {
+		if (positions) return nearestPosition(positions, value);
+		if (step <= 0) return bound(round(value));
+		if (spec.isWrapping) return ring(value, range);
+		return bound(round(min + Math.round((value - min) / step) * step));
+	}
+	function stepBy(from, steps, size) {
+		if (positions) {
+			const index = clamp(positions.indexOf(from) + steps, 0, positions.length - 1);
+			return positions[index] ?? from;
+		}
+		if (!curve) return from + steps * size;
+		const next = snap(curve.valueAt(curve.proportionOf(from) + steps / 100));
+		return next === from ? from + Math.sign(steps) * size : next;
+	}
+	function stopAtDetent(from, next) {
+		if (spec.detent === void 0) return next;
+		const detent = snap(spec.detent);
+		const toward = Math.sign(next - from) * (detent - from);
+		const ahead = spec.isWrapping ? wrap(min + toward, isStepped ? count * step : range) : toward;
+		return ahead > 0 && ahead < Math.abs(next - from) ? detent : next;
+	}
+	function keyStride(keyStep) {
+		if (positions || !(keyStep > 0)) return void 0;
+		return step > 0 ? Math.max(1, Math.round(trimFloat(keyStep / step))) * step : keyStep;
+	}
+	function end(size) {
+		if (!spec.isWrapping) return bounds[1];
+		return min + (isStepped ? top : (Math.ceil(range / size) - 1) * size);
+	}
+	function target(key, from, keyStep) {
+		if (key === "Home") return bounds[0];
+		const size = step > 0 ? step : range / 100;
+		if (key === "End") return snap(end(size));
+		const steps = keySteps.get(key);
+		if (steps === void 0) return void 0;
+		const stride = keyStride(keyStep);
+		const next = stopAtDetent(from, stride === void 0 ? stepBy(from, steps, size) : from + steps * stride);
+		return isStepped && spec.isWrapping ? ring(next, count * step) : snap(next);
+	}
+	return {
+		bounds,
+		isWrapping: spec.isWrapping,
+		keyTarget: (key, from, keyStep = 0) => target(key, from, keyStep),
+		positionCount: countPositions(spec, positions?.length ?? count),
+		proportionOf: (value) => taper.proportionOf(bound(value)),
+		snap,
+		valueAt: (proportion) => taper.valueAt(proportion)
+	};
+}
+
+//#endregion
+export { resetKeys, valueMapping };

package/dist/default/lib/waveform-buckets.js

@@ -0,0 +1,41 @@
+//#region src/lib/waveform-buckets.ts
+function foldPairs(peaks, fromPair, toPair) {
+	const { samples } = peaks;
+	const channels = Math.max(1, peaks.channels ?? 1);
+	const stride = channels * 2;
+	const pairsTotal = Math.floor(samples.length / stride);
+	let low = 0;
+	let high = 0;
+	for (let pair = Math.max(0, fromPair); pair < Math.min(pairsTotal, toPair); pair += 1) for (let channel = 0; channel < channels; channel += 1) {
+		const at = pair * stride + channel * 2;
+		low = Math.min(low, samples[at] ?? 0);
+		high = Math.max(high, samples[at + 1] ?? 0);
+	}
+	return [low / peaks.fullScale, high / peaks.fullScale];
+}
+function waveformBuckets(peaks, view) {
+	const { pairsPerSecond } = peaks;
+	if (pairsPerSecond <= 0 || view.pixelsPerSecond <= 0) return [];
+	const pxPerPair = view.pixelsPerSecond / pairsPerSecond;
+	const pairs = Math.max(1, Math.round(1 / pxPerPair));
+	const openingPair = view.startSeconds * pairsPerSecond;
+	const first = Math.floor(openingPair / pairs) - 1;
+	const count = Math.ceil(view.width / (pairs * pxPerPair)) + 3;
+	const buckets = [];
+	for (let index = 0; index < count; index += 1) {
+		const fromPair = (first + index) * pairs;
+		const toPair = fromPair + pairs;
+		const [low, high] = foldPairs(peaks, fromPair, toPair);
+		buckets.push({
+			fromPair,
+			high,
+			low,
+			toPair,
+			x: (fromPair - openingPair) * pxPerPair
+		});
+	}
+	return buckets;
+}
+
+//#endregion
+export { waveformBuckets };

package/dist/dev/dat.d.ts

@@ -0,0 +1,19 @@
+import { WaveformPeaks } from "./lib/waveform-buckets.js";
+//#region src/dat.d.ts
+export interface DatHeader {
+  bits: 8 | 16;
+  channels: number;
+  dataOffset: number;
+  pairs: number;
+  pairsPerSecond: number;
+  sampleRate: number;
+  samplesPerPixel: number;
+  version: 1 | 2;
+}
+export declare function readDatHeader(buffer: ArrayBuffer): DatHeader;
+export declare function datByteRange(header: DatHeader, fromPair: number, toPair: number): [number, number] | undefined;
+export declare function readDatSamples(header: DatHeader, body: ArrayBuffer): Int8Array | Int16Array;
+export declare function readDatPeaks(header: DatHeader, body: ArrayBuffer): WaveformPeaks;
+//#endregion
+export type { WaveformPeaks };
+//# sourceMappingURL=dat.d.ts.map

package/dist/dev/dat.js

@@ -0,0 +1,51 @@
+import { clamp } from "./lib/math.js";
+
+//#region src/dat.ts
+function readVersion(view) {
+	const version = view.getInt32(0, true);
+	if (version === 1 || version === 2) return version;
+	throw new Error(`A .dat file of version ${String(version)} is not one this reads`);
+}
+function readDatHeader(buffer) {
+	if (buffer.byteLength < 20) throw new Error("A .dat header takes at least 20 bytes");
+	const view = new DataView(buffer);
+	const version = readVersion(view);
+	const dataOffset = version === 1 ? 20 : 24;
+	if (buffer.byteLength < dataOffset) throw new Error(`A version ${String(version)} .dat header takes ${String(dataOffset)} bytes`);
+	const channels = version === 1 ? 1 : view.getInt32(20, true);
+	if (channels < 1) throw new Error("A .dat header names no channels");
+	const sampleRate = view.getInt32(8, true);
+	const samplesPerPixel = view.getInt32(12, true);
+	return {
+		bits: (view.getUint32(4, true) & 1) === 1 ? 8 : 16,
+		channels,
+		dataOffset,
+		pairs: view.getUint32(16, true),
+		pairsPerSecond: sampleRate / samplesPerPixel,
+		sampleRate,
+		samplesPerPixel,
+		version
+	};
+}
+function datByteRange(header, fromPair, toPair) {
+	const from = clamp(Math.floor(fromPair), 0, header.pairs);
+	const to = clamp(Math.ceil(toPair), from, header.pairs);
+	if (!(to > from)) return void 0;
+	const pairBytes = header.channels * 2 * header.bits / 8;
+	return [header.dataOffset + from * pairBytes, header.dataOffset + to * pairBytes - 1];
+}
+function readDatSamples(header, body) {
+	return header.bits === 8 ? new Int8Array(body) : new Int16Array(body, 0, Math.floor(body.byteLength / 2));
+}
+function readDatPeaks(header, body) {
+	return {
+		channels: header.channels,
+		fullScale: header.bits === 8 ? 128 : 32768,
+		pairsPerSecond: header.pairsPerSecond,
+		samples: readDatSamples(header, body)
+	};
+}
+
+//#endregion
+export { datByteRange, readDatHeader, readDatPeaks, readDatSamples };
+//# sourceMappingURL=dat.js.map

package/dist/dev/dat.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dat.js","names":[],"sources":["../../src/dat.ts"],"sourcesContent":["import type { WaveformPeaks } from '#lib/waveform-buckets.ts';\n\nimport { clamp } from '#lib/math.ts';\n\nexport type { WaveformPeaks } from '#lib/waveform-buckets.ts';\n\nexport interface DatHeader {\n\tbits: 8 | 16;\n\tchannels: number;\n\tdataOffset: number;\n\tpairs: number;\n\tpairsPerSecond: number;\n\tsampleRate: number;\n\tsamplesPerPixel: number;\n\tversion: 1 | 2;\n}\n\nfunction readVersion(view: DataView): 1 | 2 {\n\tconst version = view.getInt32(0, true);\n\tif (version === 1 || version === 2) return version;\n\n\tthrow new Error(`A .dat file of version ${String(version)} is not one this reads`);\n}\n\nexport function readDatHeader(buffer: ArrayBuffer): DatHeader {\n\tif (buffer.byteLength < 20) throw new Error('A .dat header takes at least 20 bytes');\n\n\tconst view = new DataView(buffer);\n\tconst version = readVersion(view);\n\tconst dataOffset = version === 1 ? 20 : 24;\n\tif (buffer.byteLength < dataOffset) {\n\t\tthrow new Error(`A version ${String(version)} .dat header takes ${String(dataOffset)} bytes`);\n\t}\n\n\tconst channels = version === 1 ? 1 : view.getInt32(20, true);\n\tif (channels < 1) throw new Error('A .dat header names no channels');\n\n\tconst sampleRate = view.getInt32(8, true);\n\tconst samplesPerPixel = view.getInt32(12, true);\n\n\treturn {\n\t\tbits: (view.getUint32(4, true) & 1) === 1 ? 8 : 16,\n\t\tchannels,\n\t\tdataOffset,\n\t\tpairs: view.getUint32(16, true),\n\t\tpairsPerSecond: sampleRate / samplesPerPixel,\n\t\tsampleRate,\n\t\tsamplesPerPixel,\n\t\tversion,\n\t};\n}\n\nexport function datByteRange(\n\theader: DatHeader,\n\tfromPair: number,\n\ttoPair: number,\n): [number, number] | undefined {\n\tconst from = clamp(Math.floor(fromPair), 0, header.pairs);\n\tconst to = clamp(Math.ceil(toPair), from, header.pairs);\n\t// A server ignores an inverted `Range` and sends the whole file\n\tif (!(to > from)) return undefined;\n\n\tconst pairBytes = (header.channels * 2 * header.bits) / 8;\n\n\treturn [header.dataOffset + from * pairBytes, header.dataOffset + to * pairBytes - 1];\n}\n\n// Typed arrays read the platform's byte order; every browser platform is little-endian, as the format is\n// A range response can end mid-sample; the odd byte is dropped\nexport function readDatSamples(header: DatHeader, body: ArrayBuffer): Int8Array | Int16Array {\n\treturn header.bits === 8\n\t\t? new Int8Array(body)\n\t\t: new Int16Array(body, 0, Math.floor(body.byteLength / 2));\n}\n\nexport function readDatPeaks(header: DatHeader, body: ArrayBuffer): WaveformPeaks {\n\treturn {\n\t\tchannels: header.channels,\n\t\tfullScale: header.bits === 8 ? 128 : 32_768,\n\t\tpairsPerSecond: header.pairsPerSecond,\n\t\tsamples: readDatSamples(header, body),\n\t};\n}\n"],"mappings":";;;AAiBA,SAAS,YAAY,MAAuB;CAC3C,MAAM,UAAU,KAAK,SAAS,GAAG,IAAI;CACrC,IAAI,YAAY,KAAK,YAAY,GAAG,OAAO;CAE3C,MAAM,IAAI,MAAM,0BAA0B,OAAO,OAAO,EAAE,uBAAuB;AAClF;AAEA,SAAgB,cAAc,QAAgC;CAC7D,IAAI,OAAO,aAAa,IAAI,MAAM,IAAI,MAAM,uCAAuC;CAEnF,MAAM,OAAO,IAAI,SAAS,MAAM;CAChC,MAAM,UAAU,YAAY,IAAI;CAChC,MAAM,aAAa,YAAY,IAAI,KAAK;CACxC,IAAI,OAAO,aAAa,YACvB,MAAM,IAAI,MAAM,aAAa,OAAO,OAAO,EAAE,qBAAqB,OAAO,UAAU,EAAE,OAAO;CAG7F,MAAM,WAAW,YAAY,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI;CAC3D,IAAI,WAAW,GAAG,MAAM,IAAI,MAAM,iCAAiC;CAEnE,MAAM,aAAa,KAAK,SAAS,GAAG,IAAI;CACxC,MAAM,kBAAkB,KAAK,SAAS,IAAI,IAAI;CAE9C,OAAO;EACN,OAAO,KAAK,UAAU,GAAG,IAAI,IAAI,OAAO,IAAI,IAAI;EAChD;EACA;EACA,OAAO,KAAK,UAAU,IAAI,IAAI;EAC9B,gBAAgB,aAAa;EAC7B;EACA;EACA;CACD;AACD;AAEA,SAAgB,aACf,QACA,UACA,QAC+B;CAC/B,MAAM,OAAO,MAAM,KAAK,MAAM,QAAQ,GAAG,GAAG,OAAO,KAAK;CACxD,MAAM,KAAK,MAAM,KAAK,KAAK,MAAM,GAAG,MAAM,OAAO,KAAK;CAEtD,IAAI,EAAE,KAAK,OAAO,OAAO;CAEzB,MAAM,YAAa,OAAO,WAAW,IAAI,OAAO,OAAQ;CAExD,OAAO,CAAC,OAAO,aAAa,OAAO,WAAW,OAAO,aAAa,KAAK,YAAY,CAAC;AACrF;AAIA,SAAgB,eAAe,QAAmB,MAA2C;CAC5F,OAAO,OAAO,SAAS,IACpB,IAAI,UAAU,IAAI,IAClB,IAAI,WAAW,MAAM,GAAG,KAAK,MAAM,KAAK,aAAa,CAAC,CAAC;AAC3D;AAEA,SAAgB,aAAa,QAAmB,MAAkC;CACjF,OAAO;EACN,UAAU,OAAO;EACjB,WAAW,OAAO,SAAS,IAAI,MAAM;EACrC,gBAAgB,OAAO;EACvB,SAAS,eAAe,QAAQ,IAAI;CACrC;AACD"}

package/dist/dev/define/button.d.ts

@@ -0,0 +1,2 @@
+import { SonicButton } from "../elements/button.js";
+export type { SonicButton };

package/dist/dev/define/button.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicButton } from "../elements/button.js";
+
+//#region src/define/button.ts
+defineOnce("sonic-button", SonicButton);
+
+//#endregion
+//# sourceMappingURL=button.js.map

package/dist/dev/define/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","names":[],"sources":["../../../src/define/button.ts"],"sourcesContent":["import { SonicButton } from '#elements/button.ts';\nimport { defineOnce } from '#elements/define-once.ts';\n\ndefineOnce('sonic-button', SonicButton);\n\nexport type { SonicButton } from '#elements/button.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}

package/dist/dev/define/dial.js.map

@@ -1 +1 @@
-{"version":3,"file":"dial.js","names":[],"sources":["../../../src/define/dial.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicDial } from '#elements/dial.ts';\n\ndefineOnce('sonic-dial', SonicDial);\n\n// Type-only, so the tag map augmentation ships without a runtime export\n/** @public */\nexport type { SonicDial } from '#elements/dial.ts';\n"],"mappings":";;;;AAGA,WAAW,cAAc,SAAS"}
+{"version":3,"file":"dial.js","names":[],"sources":["../../../src/define/dial.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicDial } from '#elements/dial.ts';\n\ndefineOnce('sonic-dial', SonicDial);\n\nexport type { SonicDial } from '#elements/dial.ts';\n"],"mappings":";;;;AAGA,WAAW,cAAc,SAAS"}

package/dist/dev/define/envelope.d.ts

@@ -0,0 +1,2 @@
+import { SonicEnvelope } from "../elements/envelope.js";
+export type { SonicEnvelope };

package/dist/dev/define/envelope.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicEnvelope } from "../elements/envelope.js";
+
+//#region src/define/envelope.ts
+defineOnce("sonic-envelope", SonicEnvelope);
+
+//#endregion
+//# sourceMappingURL=envelope.js.map

package/dist/dev/define/envelope.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"envelope.js","names":[],"sources":["../../../src/define/envelope.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicEnvelope } from '#elements/envelope.ts';\n\ndefineOnce('sonic-envelope', SonicEnvelope);\n\nexport type { SonicEnvelope } from '#elements/envelope.ts';\n"],"mappings":";;;;AAGA,WAAW,kBAAkB,aAAa"}

package/dist/dev/define/meter.js.map

@@ -1 +1 @@
-{"version":3,"file":"meter.js","names":[],"sources":["../../../src/define/meter.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicMeter } from '#elements/meter.ts';\n\ndefineOnce('sonic-meter', SonicMeter);\n\n// Type-only, so the tag map augmentation ships without a runtime export\n/** @public */\nexport type { SonicMeter } from '#elements/meter.ts';\n"],"mappings":";;;;AAGA,WAAW,eAAe,UAAU"}
+{"version":3,"file":"meter.js","names":[],"sources":["../../../src/define/meter.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicMeter } from '#elements/meter.ts';\n\ndefineOnce('sonic-meter', SonicMeter);\n\nexport type { SonicMeter } from '#elements/meter.ts';\n"],"mappings":";;;;AAGA,WAAW,eAAe,UAAU"}

package/dist/dev/define/number.js.map

@@ -1 +1 @@
-{"version":3,"file":"number.js","names":[],"sources":["../../../src/define/number.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicNumber } from '#elements/number.ts';\n\ndefineOnce('sonic-number', SonicNumber);\n\n// Type-only, so the tag map augmentation ships without a runtime export\n/** @public */\nexport type { SonicNumber } from '#elements/number.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}
+{"version":3,"file":"number.js","names":[],"sources":["../../../src/define/number.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicNumber } from '#elements/number.ts';\n\ndefineOnce('sonic-number', SonicNumber);\n\nexport type { SonicNumber } from '#elements/number.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}

package/dist/dev/define/segmented.js.map

@@ -1 +1 @@
-{"version":3,"file":"segmented.js","names":[],"sources":["../../../src/define/segmented.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSegmented } from '#elements/segmented.ts';\n\ndefineOnce('sonic-segmented', SonicSegmented);\n\n// Type-only, so the tag map augmentation ships without a runtime export\n/** @public */\nexport type { SonicSegmented } from '#elements/segmented.ts';\n"],"mappings":";;;;AAGA,WAAW,mBAAmB,cAAc"}
+{"version":3,"file":"segmented.js","names":[],"sources":["../../../src/define/segmented.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSegmented } from '#elements/segmented.ts';\n\ndefineOnce('sonic-segmented', SonicSegmented);\n\nexport type { SonicSegmented } from '#elements/segmented.ts';\n"],"mappings":";;;;AAGA,WAAW,mBAAmB,cAAc"}

package/dist/dev/define/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":[],"sources":["../../../src/define/slider.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSlider } from '#elements/slider.ts';\n\ndefineOnce('sonic-slider', SonicSlider);\n\n// Type-only, so the tag map augmentation ships without a runtime export\n/** @public */\nexport type { SonicSlider } from '#elements/slider.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}
+{"version":3,"file":"slider.js","names":[],"sources":["../../../src/define/slider.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSlider } from '#elements/slider.ts';\n\ndefineOnce('sonic-slider', SonicSlider);\n\nexport type { SonicSlider } from '#elements/slider.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}

package/dist/dev/define/split.d.ts

@@ -0,0 +1,2 @@
+import { SonicSplit } from "../elements/split.js";
+export type { SonicSplit };

package/dist/dev/define/split.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicSplit } from "../elements/split.js";
+
+//#region src/define/split.ts
+defineOnce("sonic-split", SonicSplit);
+
+//#endregion
+//# sourceMappingURL=split.js.map

package/dist/dev/define/split.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"split.js","names":[],"sources":["../../../src/define/split.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSplit } from '#elements/split.ts';\n\ndefineOnce('sonic-split', SonicSplit);\n\nexport type { SonicSplit } from '#elements/split.ts';\n"],"mappings":";;;;AAGA,WAAW,eAAe,UAAU"}

package/dist/dev/define/switch.d.ts

@@ -0,0 +1,2 @@
+import { SonicSwitch } from "../elements/switch.js";
+export type { SonicSwitch };

package/dist/dev/define/switch.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicSwitch } from "../elements/switch.js";
+
+//#region src/define/switch.ts
+defineOnce("sonic-switch", SonicSwitch);
+
+//#endregion
+//# sourceMappingURL=switch.js.map

package/dist/dev/define/switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.js","names":[],"sources":["../../../src/define/switch.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicSwitch } from '#elements/switch.ts';\n\ndefineOnce('sonic-switch', SonicSwitch);\n\nexport type { SonicSwitch } from '#elements/switch.ts';\n"],"mappings":";;;;AAGA,WAAW,gBAAgB,WAAW"}

package/dist/dev/define/waveform.d.ts

@@ -0,0 +1,2 @@
+import { SonicWaveform } from "../elements/waveform.js";
+export type { SonicWaveform };

package/dist/dev/define/waveform.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicWaveform } from "../elements/waveform.js";
+
+//#region src/define/waveform.ts
+defineOnce("sonic-waveform", SonicWaveform);
+
+//#endregion
+//# sourceMappingURL=waveform.js.map

package/dist/dev/define/waveform.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"waveform.js","names":[],"sources":["../../../src/define/waveform.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicWaveform } from '#elements/waveform.ts';\n\ndefineOnce('sonic-waveform', SonicWaveform);\n\nexport type { SonicWaveform } from '#elements/waveform.ts';\n"],"mappings":";;;;AAGA,WAAW,kBAAkB,aAAa"}

package/dist/dev/define/wavestrip.d.ts

@@ -0,0 +1,2 @@
+import { SonicWavestrip } from "../elements/wavestrip.js";
+export type { SonicWavestrip };

package/dist/dev/define/wavestrip.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicWavestrip } from "../elements/wavestrip.js";
+
+//#region src/define/wavestrip.ts
+defineOnce("sonic-wavestrip", SonicWavestrip);
+
+//#endregion
+//# sourceMappingURL=wavestrip.js.map

package/dist/dev/define/wavestrip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wavestrip.js","names":[],"sources":["../../../src/define/wavestrip.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicWavestrip } from '#elements/wavestrip.ts';\n\ndefineOnce('sonic-wavestrip', SonicWavestrip);\n\nexport type { SonicWavestrip } from '#elements/wavestrip.ts';\n"],"mappings":";;;;AAGA,WAAW,mBAAmB,cAAc"}

package/dist/dev/define/xy.d.ts

@@ -0,0 +1,2 @@
+import { SonicXy } from "../elements/xy.js";
+export type { SonicXy };

package/dist/dev/define/xy.js

@@ -0,0 +1,8 @@
+import { defineOnce } from "../elements/define-once.js";
+import { SonicXy } from "../elements/xy.js";
+
+//#region src/define/xy.ts
+defineOnce("sonic-xy", SonicXy);
+
+//#endregion
+//# sourceMappingURL=xy.js.map

package/dist/dev/define/xy.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xy.js","names":[],"sources":["../../../src/define/xy.ts"],"sourcesContent":["import { defineOnce } from '#elements/define-once.ts';\nimport { SonicXy } from '#elements/xy.ts';\n\ndefineOnce('sonic-xy', SonicXy);\n\nexport type { SonicXy } from '#elements/xy.ts';\n"],"mappings":";;;;AAGA,WAAW,YAAY,OAAO"}

package/dist/dev/define.d.ts

@@ -1,7 +1,11 @@
 import { SonicDial } from "./elements/dial.js";
 import "./define/dial.js";
-import { SonicKey } from "./elements/key.js";
-import "./define/key.js";
+import { SonicEnvelope } from "./elements/envelope.js";
+import "./define/envelope.js";
+import { SonicButton } from "./elements/button.js";
+import "./define/button.js";
+import { SonicSwitch } from "./elements/switch.js";
+import "./define/switch.js";
 import { SonicMeter } from "./elements/meter.js";
 import "./define/meter.js";
 import { SonicNumber } from "./elements/number.js";
@@ -10,4 +14,12 @@ import { SonicSegmented } from "./elements/segmented.js";
 import "./define/segmented.js";
 import { SonicSlider } from "./elements/slider.js";
 import "./define/slider.js";
-export type { SonicDial, SonicKey, SonicMeter, SonicNumber, SonicSegmented, SonicSlider };
+import { SonicSplit } from "./elements/split.js";
+import "./define/split.js";
+import { SonicWaveform } from "./elements/waveform.js";
+import "./define/waveform.js";
+import { SonicWavestrip } from "./elements/wavestrip.js";
+import "./define/wavestrip.js";
+import { SonicXy } from "./elements/xy.js";
+import "./define/xy.js";
+export type { SonicButton, SonicDial, SonicEnvelope, SonicMeter, SonicNumber, SonicSegmented, SonicSlider, SonicSplit, SonicSwitch, SonicWaveform, SonicWavestrip, SonicXy };

package/dist/dev/define.js

@@ -1,6 +1,12 @@
 import "./define/dial.js";
-import "./define/key.js";
+import "./define/envelope.js";
+import "./define/button.js";
+import "./define/switch.js";
 import "./define/meter.js";
 import "./define/number.js";
 import "./define/segmented.js";
 import "./define/slider.js";
+import "./define/split.js";
+import "./define/waveform.js";
+import "./define/wavestrip.js";
+import "./define/xy.js";

package/dist/dev/elements/{key.d.ts → button.d.ts}

@@ -1,25 +1,27 @@
 import { SonicFormElement } from "./form-element.js";
-//#region src/elements/key.d.ts
+//#region src/elements/button.d.ts
 declare global {
   interface HTMLElementTagNameMap {
-    'sonic-key': SonicKey;
+    'sonic-button': SonicButton;
   }
 }
-export declare class SonicKey extends SonicFormElement {
+export declare class SonicButton extends SonicFormElement {
   #private;
   static readonly observedAttributes: string[];
+  get armed(): boolean;
+  set armed(isArmed: boolean);
   get busy(): boolean;
   set busy(isBusy: boolean);
   get defaultPressed(): boolean;
   set defaultPressed(isPressed: boolean);
+  get latching(): boolean;
+  set latching(isLatching: boolean);
   get momentary(): boolean;
   set momentary(isMomentary: boolean);
   get pressed(): boolean;
   set pressed(isPressed: boolean | undefined);
   get softDisabled(): boolean;
   set softDisabled(isSoftDisabled: boolean);
-  get toggle(): boolean;
-  set toggle(isToggle: boolean);
   get value(): string;
   set value(value: string | undefined);
   attributeChangedCallback(name: string): void;
@@ -31,4 +33,4 @@ export declare class SonicKey extends SonicFormElement {
   protected restoreState(state: string): void;
 }
 //#endregion
-//# sourceMappingURL=key.d.ts.map
+//# sourceMappingURL=button.d.ts.map

package/dist/dev/elements/button.js

@@ -0,0 +1,166 @@
+import { placeChildren, requireChild, template } from "../lib/render.js";
+import { writeAttribute } from "../lib/write-attribute.js";
+import { SonicFormElement } from "./form-element.js";
+import { copyNode } from "../lib/copy-node.js";
+import { bindHold } from "../lib/hold.js";
+
+//#region src/elements/button.ts
+const renderButton = template(`
+		<button class="sonic-button" type="button"><span class="sonic-button-cap"></span></button>
+	`, HTMLButtonElement);
+const holdKeys = /* @__PURE__ */ new Set([" ", "Enter"]);
+var SonicButton = class extends SonicFormElement {
+	static observedAttributes = [
+		...SonicFormElement.observedAttributes,
+		"busy",
+		"momentary",
+		"pressed",
+		"soft-disabled",
+		"latching",
+		"value"
+	];
+	get armed() {
+		return this.hasAttribute("armed");
+	}
+	set armed(isArmed) {
+		this.reflect("armed", isArmed);
+	}
+	get busy() {
+		return this.hasAttribute("busy");
+	}
+	set busy(isBusy) {
+		this.reflect("busy", isBusy);
+	}
+	get defaultPressed() {
+		return this.hasAttribute("pressed");
+	}
+	set defaultPressed(isPressed) {
+		this.reflect("pressed", isPressed);
+	}
+	get latching() {
+		return this.hasAttribute("latching");
+	}
+	set latching(isLatching) {
+		this.reflect("latching", isLatching);
+	}
+	get momentary() {
+		return this.hasAttribute("momentary");
+	}
+	set momentary(isMomentary) {
+		this.reflect("momentary", isMomentary);
+	}
+	get pressed() {
+		return this.#isDirty ? this.#pressed : this.defaultPressed;
+	}
+	set pressed(isPressed) {
+		this.#isDirty = true;
+		this.#pressed = isPressed === true;
+		this.render();
+	}
+	get softDisabled() {
+		return this.hasAttribute("soft-disabled");
+	}
+	set softDisabled(isSoftDisabled) {
+		this.reflect("soft-disabled", isSoftDisabled);
+	}
+	get value() {
+		return this.getAttribute("value") ?? "on";
+	}
+	set value(value) {
+		this.reflect("value", value);
+	}
+	#button = renderButton();
+	#holding;
+	#isDirty = false;
+	#pressed = false;
+	attributeChangedCallback(name) {
+		if (name === "pressed") this.#isDirty = false;
+		if (this.isDisabled() || this.#isSoftDisabled()) this.#holding?.release();
+		this.render();
+	}
+	formResetCallback() {
+		this.attributeChangedCallback("pressed");
+	}
+	activate() {
+		this.#button.click();
+	}
+	connect(signal) {
+		const button = this.#button;
+		const cap = requireChild(button, ".sonic-button-cap", HTMLSpanElement);
+		this.upgradeProperties("armed", "busy", "defaultPressed", "momentary", "softDisabled", "latching", "pressed", "value");
+		this.mirrorChildren({
+			control: button,
+			copy: copyNode,
+			place: (copies) => {
+				placeChildren(cap, copies);
+			}
+		}, signal);
+		this.render();
+		this.checkStyles(button, "button.css");
+		button.addEventListener("click", (event) => {
+			if (this.#isSoftDisabled()) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			if (!this.latching) return;
+			this.pressed = !this.pressed;
+			this.dispatchEvent(new Event("change", { bubbles: true }));
+		}, { signal });
+		this.#bindMomentary(button, signal);
+	}
+	focusTarget() {
+		return this.#button;
+	}
+	render() {
+		const button = this.#button;
+		button.disabled = this.isDisabled();
+		writeAttribute(button, "aria-disabled", this.#isSoftDisabled() ? "true" : void 0);
+		writeAttribute(button, "aria-busy", this.busy ? "true" : void 0);
+		button.removeAttribute("aria-pressed");
+		if (this.latching) button.setAttribute("aria-pressed", String(this.pressed));
+		this.toggleState("pressed", this.pressed);
+		this.forwardNaming(button, true);
+		const submitted = this.latching && this.pressed ? this.value : null;
+		this.writeFormValue(submitted, String(this.pressed));
+	}
+	restoreState(state) {
+		if (this.latching) this.pressed = state === "true";
+	}
+	#bindMomentary(button, signal) {
+		const holding = bindHold(button, {
+			canHold: () => !this.isDisabled() && !this.#isSoftDisabled(),
+			leave: "blur",
+			onHold: () => {
+				this.#press(true);
+			},
+			onRelease: () => {
+				this.#press(false);
+			}
+		}, signal);
+		this.#holding = holding;
+		button.addEventListener("pointerdown", (event) => {
+			if (event.button !== 0 || !this.#isMomentary()) return;
+			button.setPointerCapture(event.pointerId);
+			holding.hold(event.pointerId);
+		}, { signal });
+		button.addEventListener("keydown", (event) => {
+			if (event.repeat || !holdKeys.has(event.key) || !this.#isMomentary()) return;
+			holding.hold(event.key);
+		}, { signal });
+	}
+	#isMomentary() {
+		return this.momentary && !this.latching;
+	}
+	#isSoftDisabled() {
+		return this.softDisabled && !this.isDisabled();
+	}
+	#press(isPressed) {
+		this.pressed = isPressed;
+		this.dispatchEvent(new Event("change", { bubbles: true }));
+	}
+};
+
+//#endregion
+export { SonicButton };
+//# sourceMappingURL=button.js.map