@countermeasure-platform/web-components 0.2.0

package/dist/form/color-picker/index.js

@@ -0,0 +1,547 @@
+import { t as e } from "../../a11y-B5pN4M_a.js";
+import { n as t, t as n } from "../../utils-Cn_W3h3f.js";
+//#region src/form/color-picker/index.ts
+var r = [
+	{
+		r: 255,
+		g: 0,
+		b: 0,
+		name: "Red"
+	},
+	{
+		r: 0,
+		g: 255,
+		b: 0,
+		name: "Lime"
+	},
+	{
+		r: 0,
+		g: 0,
+		b: 255,
+		name: "Blue"
+	},
+	{
+		r: 255,
+		g: 255,
+		b: 0,
+		name: "Yellow"
+	},
+	{
+		r: 0,
+		g: 255,
+		b: 255,
+		name: "Cyan"
+	},
+	{
+		r: 255,
+		g: 0,
+		b: 255,
+		name: "Magenta"
+	},
+	{
+		r: 255,
+		g: 255,
+		b: 255,
+		name: "White"
+	},
+	{
+		r: 0,
+		g: 0,
+		b: 0,
+		name: "Black"
+	},
+	{
+		r: 128,
+		g: 128,
+		b: 128,
+		name: "Gray"
+	},
+	{
+		r: 255,
+		g: 165,
+		b: 0,
+		name: "Orange"
+	},
+	{
+		r: 128,
+		g: 0,
+		b: 128,
+		name: "Purple"
+	},
+	{
+		r: 165,
+		g: 42,
+		b: 42,
+		name: "Brown"
+	},
+	{
+		r: 255,
+		g: 192,
+		b: 203,
+		name: "Pink"
+	},
+	{
+		r: 0,
+		g: 128,
+		b: 0,
+		name: "Green"
+	},
+	{
+		r: 0,
+		g: 0,
+		b: 128,
+		name: "Navy"
+	},
+	{
+		r: 64,
+		g: 224,
+		b: 208,
+		name: "Turquoise"
+	}
+];
+function i(e, t, n) {
+	let i = "Custom color", a = Infinity;
+	for (let o of r) {
+		let r = Math.sqrt((e - o.r) ** 2 + (t - o.g) ** 2 + (n - o.b) ** 2);
+		r < a && (a = r, i = o.name);
+	}
+	return a > 80 ? "Custom color" : i;
+}
+function a(e, t, n) {
+	return Math.max(t, Math.min(n, e));
+}
+function o(e) {
+	let t = e.replace(/^#/, "");
+	(t.length === 3 || t.length === 4) && (t = t.split("").map((e) => e + e).join(""));
+	let n = parseInt(t.slice(0, 2), 16), r = parseInt(t.slice(2, 4), 16), i = parseInt(t.slice(4, 6), 16), a = t.length === 8 ? parseInt(t.slice(6, 8), 16) / 255 : 1;
+	return {
+		r: isNaN(n) ? 0 : n,
+		g: isNaN(r) ? 0 : r,
+		b: isNaN(i) ? 0 : i,
+		a: isNaN(a) ? 1 : a
+	};
+}
+function s(e, t) {
+	let n = a(Math.round(e.r), 0, 255).toString(16).padStart(2, "0"), r = a(Math.round(e.g), 0, 255).toString(16).padStart(2, "0"), i = a(Math.round(e.b), 0, 255).toString(16).padStart(2, "0");
+	return t && e.a < 1 ? `#${n}${r}${i}${a(Math.round(e.a * 255), 0, 255).toString(16).padStart(2, "0")}` : `#${n}${r}${i}`;
+}
+function c(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = Math.min(t, n, r), o = (i + a) / 2, s = 0, c = 0;
+	if (i !== a) {
+		let e = i - a;
+		c = o > .5 ? e / (2 - i - a) : e / (i + a), s = i === t ? ((n - r) / e + (n < r ? 6 : 0)) / 6 : i === n ? ((r - t) / e + 2) / 6 : ((t - n) / e + 4) / 6;
+	}
+	return {
+		h: s * 360,
+		s: c * 100,
+		l: o * 100,
+		a: e.a
+	};
+}
+function l(e, t, n, r) {
+	let i = Math.floor(e / 60) % 6, a = e / 60 - Math.floor(e / 60), o = n * (1 - t), s = n * (1 - a * t), c = n * (1 - (1 - a) * t), l, u, d;
+	switch (i) {
+		case 0:
+			l = n, u = c, d = o;
+			break;
+		case 1:
+			l = s, u = n, d = o;
+			break;
+		case 2:
+			l = o, u = n, d = c;
+			break;
+		case 3:
+			l = o, u = s, d = n;
+			break;
+		case 4:
+			l = c, u = o, d = n;
+			break;
+		default:
+			l = n, u = o, d = s;
+			break;
+	}
+	return {
+		r: Math.round(l * 255),
+		g: Math.round(u * 255),
+		b: Math.round(d * 255),
+		a: r
+	};
+}
+function u(e) {
+	let t = e.r / 255, n = e.g / 255, r = e.b / 255, i = Math.max(t, n, r), a = i - Math.min(t, n, r), o = 0;
+	a !== 0 && (o = i === t ? ((n - r) / a + (n < r ? 6 : 0)) * 60 : i === n ? ((r - t) / a + 2) * 60 : ((t - n) / a + 4) * 60);
+	let s = i === 0 ? 0 : a / i;
+	return {
+		h: o,
+		s,
+		v: i
+	};
+}
+function d(e) {
+	return e.a < 1 ? `rgba(${String(Math.round(e.r))}, ${String(Math.round(e.g))}, ${String(Math.round(e.b))}, ${String(Math.round(e.a * 100) / 100)})` : `rgb(${String(Math.round(e.r))}, ${String(Math.round(e.g))}, ${String(Math.round(e.b))})`;
+}
+function f(e) {
+	let t = Math.round(e.h), n = Math.round(e.s), r = Math.round(e.l);
+	return e.a < 1 ? `hsla(${String(t)}, ${String(n)}%, ${String(r)}%, ${String(Math.round(e.a * 100) / 100)})` : `hsl(${String(t)}, ${String(n)}%, ${String(r)}%)`;
+}
+var p = class {
+	container;
+	config;
+	id;
+	rgba = {
+		r: 0,
+		g: 0,
+		b: 0,
+		a: 1
+	};
+	hue = 0;
+	saturation = 0;
+	brightness = 0;
+	swatchEl = null;
+	panelEl = null;
+	satCanvas = null;
+	hueCanvas = null;
+	alphaCanvas = null;
+	hexInput = null;
+	rInput = null;
+	gInput = null;
+	bInput = null;
+	isOpen = !1;
+	boundOnDocClick;
+	activeDrag = null;
+	constructor(e) {
+		this.container = n(e.container), this.config = e, this.id = t("cmm-color-picker"), this.rgba = o(e.value ?? "#000000");
+		let r = u(this.rgba);
+		this.hue = r.h, this.saturation = r.s, this.brightness = r.v, this.boundOnDocClick = this.onDocumentClick.bind(this), this.render();
+	}
+	getValue() {
+		return this.formatOutput();
+	}
+	setValue(e) {
+		this.rgba = o(e);
+		let t = u(this.rgba);
+		this.hue = t.h, this.saturation = t.s, this.brightness = t.v, this.updateAllUI();
+	}
+	destroy() {
+		document.removeEventListener("click", this.boundOnDocClick), document.removeEventListener("mousemove", this.onMouseMove), document.removeEventListener("mouseup", this.onMouseUp), document.removeEventListener("touchmove", this.onTouchMove), document.removeEventListener("touchend", this.onTouchEnd), this.container.innerHTML = "", this.panelEl = null, this.satCanvas = null, this.hueCanvas = null, this.alphaCanvas = null;
+	}
+	formatOutput() {
+		switch (this.config.format ?? "hex") {
+			case "rgb": return d(this.rgba);
+			case "hsl": return f(c(this.rgba));
+			default: return s(this.rgba, this.config.showAlpha === !0);
+		}
+	}
+	render() {
+		this.container.innerHTML = "";
+		let e = document.createElement("div");
+		e.className = "cmm-color-picker", this.config.className && e.classList.add(this.config.className), e.id = this.id;
+		let t = document.createElement("button");
+		t.className = "cmm-color-picker__swatch", t.type = "button", t.setAttribute("aria-label", "Open color picker"), t.setAttribute("aria-expanded", "false"), t.style.backgroundColor = s(this.rgba, !0), t.addEventListener("click", (e) => {
+			e.stopPropagation(), this.togglePanel();
+		}), this.swatchEl = t, e.appendChild(t);
+		let n = document.createElement("div");
+		n.className = "cmm-color-picker__panel", n.style.display = "none", n.addEventListener("click", (e) => {
+			e.stopPropagation();
+		}), this.panelEl = n;
+		let r = document.createElement("div");
+		r.className = "cmm-color-picker__saturation-wrap";
+		let i = document.createElement("canvas");
+		i.className = "cmm-color-picker__saturation", i.width = 256, i.height = 160, i.tabIndex = 0, i.setAttribute("role", "slider"), i.setAttribute("aria-label", "Saturation and brightness"), i.setAttribute("aria-valuemin", "0"), i.setAttribute("aria-valuemax", "100"), i.addEventListener("mousedown", this.onSatMouseDown), i.addEventListener("touchstart", this.onSatTouchStart, { passive: !1 }), i.addEventListener("keydown", this.onSatKeyDown), this.satCanvas = i, r.appendChild(i), n.appendChild(r);
+		let a = document.createElement("div");
+		a.className = "cmm-color-picker__sliders";
+		let c = document.createElement("div");
+		c.className = "cmm-color-picker__hue-wrap";
+		let l = document.createElement("canvas");
+		if (l.className = "cmm-color-picker__hue", l.width = 256, l.height = 14, l.tabIndex = 0, l.setAttribute("role", "slider"), l.setAttribute("aria-label", "Hue"), l.setAttribute("aria-valuemin", "0"), l.setAttribute("aria-valuemax", "360"), l.addEventListener("mousedown", this.onHueMouseDown), l.addEventListener("touchstart", this.onHueTouchStart, { passive: !1 }), l.addEventListener("keydown", this.onHueKeyDown), this.hueCanvas = l, c.appendChild(l), a.appendChild(c), this.config.showAlpha === !0) {
+			let e = document.createElement("div");
+			e.className = "cmm-color-picker__alpha-wrap";
+			let t = document.createElement("canvas");
+			t.className = "cmm-color-picker__alpha", t.width = 256, t.height = 14, t.tabIndex = 0, t.setAttribute("role", "slider"), t.setAttribute("aria-label", "Opacity"), t.setAttribute("aria-valuemin", "0"), t.setAttribute("aria-valuemax", "100"), t.addEventListener("mousedown", this.onAlphaMouseDown), t.addEventListener("touchstart", this.onAlphaTouchStart, { passive: !1 }), t.addEventListener("keydown", this.onAlphaKeyDown), this.alphaCanvas = t, e.appendChild(t), a.appendChild(e);
+		}
+		n.appendChild(a);
+		let d = document.createElement("div");
+		d.className = "cmm-color-picker__inputs";
+		let f = document.createElement("div");
+		f.className = "cmm-color-picker__input-group";
+		let p = document.createElement("label");
+		p.className = "cmm-color-picker__input-label", p.textContent = "Hex";
+		let m = document.createElement("input");
+		m.className = "cmm-color-picker__input cmm-color-picker__input--hex", m.type = "text", m.maxLength = 9, m.value = s(this.rgba, this.config.showAlpha === !0), m.addEventListener("change", () => {
+			let e = m.value.trim(), t = e.startsWith("#") ? e : `#${e}`;
+			if (/^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(t)) {
+				this.rgba = o(t);
+				let e = u(this.rgba);
+				this.hue = e.h, this.saturation = e.s, this.brightness = e.v, this.updateAllUI(), this.emitChange();
+			}
+		}), this.hexInput = m, f.appendChild(p), f.appendChild(m), d.appendChild(f);
+		let h = this.buildNumberInput("R", 0, 255, this.rgba.r, (e) => {
+			this.rgba.r = e, this.syncFromRgba();
+		});
+		this.rInput = h.querySelector("input"), d.appendChild(h);
+		let g = this.buildNumberInput("G", 0, 255, this.rgba.g, (e) => {
+			this.rgba.g = e, this.syncFromRgba();
+		});
+		this.gInput = g.querySelector("input"), d.appendChild(g);
+		let _ = this.buildNumberInput("B", 0, 255, this.rgba.b, (e) => {
+			this.rgba.b = e, this.syncFromRgba();
+		});
+		this.bInput = _.querySelector("input"), d.appendChild(_), n.appendChild(d);
+		let v = document.createElement("div");
+		v.className = "cmm-color-picker__actions";
+		let y = document.createElement("button");
+		y.className = "cmm-color-picker__copy", y.type = "button", y.textContent = "Copy", y.setAttribute("aria-label", "Copy color value"), y.addEventListener("click", () => {
+			let e = this.formatOutput();
+			navigator.clipboard.writeText(e).then(() => {
+				y.textContent = "Copied!", setTimeout(() => {
+					y.textContent = "Copy";
+				}, 1500);
+			});
+		}), v.appendChild(y), n.appendChild(v);
+		let b = this.config.presets;
+		if (b !== void 0 && b.length > 0) {
+			let e = document.createElement("div");
+			e.className = "cmm-color-picker__presets";
+			for (let t of b) {
+				let n = document.createElement("button");
+				n.className = "cmm-color-picker__preset", n.type = "button", n.style.backgroundColor = t, n.setAttribute("aria-label", `Select color ${t}`), n.addEventListener("click", () => {
+					this.setValue(t), this.emitChange();
+				}), e.appendChild(n);
+			}
+			n.appendChild(e);
+		}
+		e.appendChild(n), this.container.appendChild(e), this.drawSaturation(), this.drawHue(), this.config.showAlpha === !0 && this.drawAlpha(), document.addEventListener("click", this.boundOnDocClick);
+	}
+	buildNumberInput(e, t, n, r, i) {
+		let o = document.createElement("div");
+		o.className = "cmm-color-picker__input-group";
+		let s = document.createElement("label");
+		s.className = "cmm-color-picker__input-label", s.textContent = e;
+		let c = document.createElement("input");
+		return c.className = "cmm-color-picker__input cmm-color-picker__input--num", c.type = "number", c.min = String(t), c.max = String(n), c.value = String(Math.round(r)), c.addEventListener("change", () => {
+			let e = parseInt(c.value, 10), r = a(isNaN(e) ? 0 : e, t, n);
+			c.value = String(r), i(r);
+		}), o.appendChild(s), o.appendChild(c), o;
+	}
+	syncFromRgba() {
+		let e = u(this.rgba);
+		this.hue = e.h, this.saturation = e.s, this.brightness = e.v, this.updateAllUI(), this.emitChange();
+	}
+	togglePanel() {
+		this.isOpen ? this.closePanel() : this.openPanel();
+	}
+	openPanel() {
+		this.panelEl !== null && (this.panelEl.style.display = "block", this.swatchEl?.setAttribute("aria-expanded", "true"), this.isOpen = !0, this.drawSaturation(), this.drawHue(), this.config.showAlpha === !0 && this.drawAlpha());
+	}
+	closePanel() {
+		this.panelEl !== null && (this.panelEl.style.display = "none", this.swatchEl?.setAttribute("aria-expanded", "false"), this.isOpen = !1);
+	}
+	onDocumentClick() {
+		this.isOpen && this.closePanel();
+	}
+	drawSaturation() {
+		let e = this.satCanvas;
+		if (e === null) return;
+		let t = e.getContext("2d");
+		if (t === null) return;
+		let n = e.width, r = e.height;
+		t.fillStyle = s(l(this.hue, 1, 1, 1), !1), t.fillRect(0, 0, n, r);
+		let i = t.createLinearGradient(0, 0, n, 0);
+		i.addColorStop(0, "rgba(255, 255, 255, 1)"), i.addColorStop(1, "rgba(255, 255, 255, 0)"), t.fillStyle = i, t.fillRect(0, 0, n, r);
+		let a = t.createLinearGradient(0, 0, 0, r);
+		a.addColorStop(0, "rgba(0, 0, 0, 0)"), a.addColorStop(1, "rgba(0, 0, 0, 1)"), t.fillStyle = a, t.fillRect(0, 0, n, r);
+		let o = this.saturation * n, c = (1 - this.brightness) * r;
+		t.beginPath(), t.arc(o, c, 6, 0, Math.PI * 2), t.strokeStyle = "#ffffff", t.lineWidth = 2, t.stroke(), t.beginPath(), t.arc(o, c, 7, 0, Math.PI * 2), t.strokeStyle = "#000000", t.lineWidth = 1, t.stroke();
+	}
+	drawHue() {
+		let e = this.hueCanvas;
+		if (e === null) return;
+		let t = e.getContext("2d");
+		if (t === null) return;
+		let n = e.width, r = e.height, i = t.createLinearGradient(0, 0, n, 0);
+		for (let e = 0; e <= 7; e++) {
+			let t = e / 7, n = l(t * 360, 1, 1, 1);
+			i.addColorStop(t, s(n, !1));
+		}
+		t.fillStyle = i, t.fillRect(0, 0, n, r);
+		let a = this.hue / 360 * n;
+		t.beginPath(), t.rect(a - 3, 0, 6, r), t.strokeStyle = "#ffffff", t.lineWidth = 2, t.stroke(), t.strokeStyle = "#000000", t.lineWidth = 1, t.stroke();
+	}
+	drawAlpha() {
+		let e = this.alphaCanvas;
+		if (e === null) return;
+		let t = e.getContext("2d");
+		if (t === null) return;
+		let n = e.width, r = e.height;
+		for (let e = 0; e < r; e += 4) for (let r = 0; r < n; r += 4) t.fillStyle = (r / 4 + e / 4) % 2 == 0 ? "#cccccc" : "#ffffff", t.fillRect(r, e, 4, 4);
+		let i = s({
+			...this.rgba,
+			a: 1
+		}, !1), a = t.createLinearGradient(0, 0, n, 0);
+		a.addColorStop(0, "rgba(0, 0, 0, 0)"), a.addColorStop(1, i), t.fillStyle = a, t.fillRect(0, 0, n, r);
+		let o = this.rgba.a * n;
+		t.beginPath(), t.rect(o - 3, 0, 6, r), t.strokeStyle = "#ffffff", t.lineWidth = 2, t.stroke(), t.strokeStyle = "#000000", t.lineWidth = 1, t.stroke();
+	}
+	updateAllUI() {
+		this.swatchEl !== null && (this.swatchEl.style.backgroundColor = s(this.rgba, !0)), this.drawSaturation(), this.drawHue(), this.config.showAlpha === !0 && this.drawAlpha(), this.hexInput !== null && (this.hexInput.value = s(this.rgba, this.config.showAlpha === !0)), this.rInput !== null && (this.rInput.value = String(Math.round(this.rgba.r))), this.gInput !== null && (this.gInput.value = String(Math.round(this.rgba.g))), this.bInput !== null && (this.bInput.value = String(Math.round(this.rgba.b)));
+	}
+	emitChange() {
+		this.config.onChange?.(this.formatOutput());
+	}
+	announceColor() {
+		e(`${i(Math.round(this.rgba.r), Math.round(this.rgba.g), Math.round(this.rgba.b))}, ${s(this.rgba, !1)}`, "polite");
+	}
+	onSatMouseDown = (e) => {
+		e.preventDefault(), this.activeDrag = "saturation", this.updateSatFromPos(e.offsetX, e.offsetY), document.addEventListener("mousemove", this.onMouseMove), document.addEventListener("mouseup", this.onMouseUp);
+	};
+	onSatTouchStart = (e) => {
+		e.preventDefault(), this.activeDrag = "saturation";
+		let t = e.touches[0];
+		t !== void 0 && this.updateSatFromClient(t.clientX, t.clientY), document.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), document.addEventListener("touchend", this.onTouchEnd);
+	};
+	updateSatFromPos(e, t) {
+		let n = this.satCanvas;
+		n !== null && (this.saturation = a(e / n.width, 0, 1), this.brightness = a(1 - t / n.height, 0, 1), this.rgba = l(this.hue, this.saturation, this.brightness, this.rgba.a), this.updateAllUI(), this.emitChange());
+	}
+	updateSatFromClient(e, t) {
+		let n = this.satCanvas;
+		if (n === null) return;
+		let r = n.getBoundingClientRect(), i = e - r.left, a = t - r.top;
+		this.updateSatFromPos(i, a);
+	}
+	onHueMouseDown = (e) => {
+		e.preventDefault(), this.activeDrag = "hue", this.updateHueFromPos(e.offsetX), document.addEventListener("mousemove", this.onMouseMove), document.addEventListener("mouseup", this.onMouseUp);
+	};
+	onHueTouchStart = (e) => {
+		e.preventDefault(), this.activeDrag = "hue";
+		let t = e.touches[0];
+		t !== void 0 && this.updateHueFromClient(t.clientX), document.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), document.addEventListener("touchend", this.onTouchEnd);
+	};
+	updateHueFromPos(e) {
+		let t = this.hueCanvas;
+		t !== null && (this.hue = a(e / t.width, 0, 1) * 360, this.rgba = l(this.hue, this.saturation, this.brightness, this.rgba.a), this.updateAllUI(), this.emitChange());
+	}
+	updateHueFromClient(e) {
+		let t = this.hueCanvas;
+		if (t === null) return;
+		let n = t.getBoundingClientRect();
+		this.updateHueFromPos(e - n.left);
+	}
+	onAlphaMouseDown = (e) => {
+		e.preventDefault(), this.activeDrag = "alpha", this.updateAlphaFromPos(e.offsetX), document.addEventListener("mousemove", this.onMouseMove), document.addEventListener("mouseup", this.onMouseUp);
+	};
+	onAlphaTouchStart = (e) => {
+		e.preventDefault(), this.activeDrag = "alpha";
+		let t = e.touches[0];
+		t !== void 0 && this.updateAlphaFromClient(t.clientX), document.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), document.addEventListener("touchend", this.onTouchEnd);
+	};
+	updateAlphaFromPos(e) {
+		let t = this.alphaCanvas;
+		t !== null && (this.rgba.a = a(e / t.width, 0, 1), this.updateAllUI(), this.emitChange());
+	}
+	updateAlphaFromClient(e) {
+		let t = this.alphaCanvas;
+		if (t === null) return;
+		let n = t.getBoundingClientRect();
+		this.updateAlphaFromPos(e - n.left);
+	}
+	onMouseMove = (e) => {
+		switch (e.preventDefault(), this.activeDrag) {
+			case "saturation":
+				this.updateSatFromClient(e.clientX, e.clientY);
+				break;
+			case "hue":
+				this.updateHueFromClient(e.clientX);
+				break;
+			case "alpha":
+				this.updateAlphaFromClient(e.clientX);
+				break;
+		}
+	};
+	onMouseUp = () => {
+		this.activeDrag = null, document.removeEventListener("mousemove", this.onMouseMove), document.removeEventListener("mouseup", this.onMouseUp);
+	};
+	onTouchMove = (e) => {
+		e.preventDefault();
+		let t = e.touches[0];
+		if (t !== void 0) switch (this.activeDrag) {
+			case "saturation":
+				this.updateSatFromClient(t.clientX, t.clientY);
+				break;
+			case "hue":
+				this.updateHueFromClient(t.clientX);
+				break;
+			case "alpha":
+				this.updateAlphaFromClient(t.clientX);
+				break;
+		}
+	};
+	onTouchEnd = () => {
+		this.activeDrag = null, document.removeEventListener("touchmove", this.onTouchMove), document.removeEventListener("touchend", this.onTouchEnd);
+	};
+	onSatKeyDown = (e) => {
+		let t = e.shiftKey ? .1 : .02, n = !0;
+		switch (e.key) {
+			case "ArrowRight":
+				this.saturation = a(this.saturation + t, 0, 1);
+				break;
+			case "ArrowLeft":
+				this.saturation = a(this.saturation - t, 0, 1);
+				break;
+			case "ArrowUp":
+				this.brightness = a(this.brightness + t, 0, 1);
+				break;
+			case "ArrowDown":
+				this.brightness = a(this.brightness - t, 0, 1);
+				break;
+			default: n = !1;
+		}
+		n && (e.preventDefault(), this.rgba = l(this.hue, this.saturation, this.brightness, this.rgba.a), this.updateAllUI(), this.emitChange(), this.announceColor());
+	};
+	onHueKeyDown = (e) => {
+		let t = e.shiftKey ? 30 : 5, n = !0;
+		switch (e.key) {
+			case "ArrowRight":
+			case "ArrowUp":
+				this.hue = (this.hue + t) % 360;
+				break;
+			case "ArrowLeft":
+			case "ArrowDown":
+				this.hue = (this.hue - t + 360) % 360;
+				break;
+			case "Home":
+				this.hue = 0;
+				break;
+			case "End":
+				this.hue = 359;
+				break;
+			default: n = !1;
+		}
+		n && (e.preventDefault(), this.rgba = l(this.hue, this.saturation, this.brightness, this.rgba.a), this.updateAllUI(), this.emitChange(), this.announceColor());
+	};
+	onAlphaKeyDown = (t) => {
+		let n = t.shiftKey ? .1 : .05, r = !0;
+		switch (t.key) {
+			case "ArrowRight":
+			case "ArrowUp":
+				this.rgba.a = a(this.rgba.a + n, 0, 1);
+				break;
+			case "ArrowLeft":
+			case "ArrowDown":
+				this.rgba.a = a(this.rgba.a - n, 0, 1);
+				break;
+			case "Home":
+				this.rgba.a = 0;
+				break;
+			case "End":
+				this.rgba.a = 1;
+				break;
+			default: r = !1;
+		}
+		r && (t.preventDefault(), this.updateAllUI(), this.emitChange(), e(`Opacity ${String(Math.round(this.rgba.a * 100))} percent`, "polite"));
+	};
+};
+//#endregion
+export { p as ColorPicker };
+
+//# sourceMappingURL=index.js.map

package/dist/form/color-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/form/color-picker/index.ts"],"sourcesContent":["/**\n * ColorPicker - Color selection component with canvas-based pickers\n * @countermeasure/web-components/form/color-picker\n */\n\nimport { type ColorPickerConfig } from './types'\nimport { resolveContainer, uniqueId } from '../../primitives/utils'\nimport { announce } from '../../utils/a11y'\n\nexport type { ColorPickerConfig } from './types'\n\n/** CSS color name lookup for accessibility announcements */\nconst COLOR_NAMES: { r: number; g: number; b: number; name: string }[] = [\n  { r: 255, g: 0, b: 0, name: 'Red' },\n  { r: 0, g: 255, b: 0, name: 'Lime' },\n  { r: 0, g: 0, b: 255, name: 'Blue' },\n  { r: 255, g: 255, b: 0, name: 'Yellow' },\n  { r: 0, g: 255, b: 255, name: 'Cyan' },\n  { r: 255, g: 0, b: 255, name: 'Magenta' },\n  { r: 255, g: 255, b: 255, name: 'White' },\n  { r: 0, g: 0, b: 0, name: 'Black' },\n  { r: 128, g: 128, b: 128, name: 'Gray' },\n  { r: 255, g: 165, b: 0, name: 'Orange' },\n  { r: 128, g: 0, b: 128, name: 'Purple' },\n  { r: 165, g: 42, b: 42, name: 'Brown' },\n  { r: 255, g: 192, b: 203, name: 'Pink' },\n  { r: 0, g: 128, b: 0, name: 'Green' },\n  { r: 0, g: 0, b: 128, name: 'Navy' },\n  { r: 64, g: 224, b: 208, name: 'Turquoise' },\n]\n\n/** Find the closest named color */\nfunction getClosestColorName(r: number, g: number, b: number): string {\n  let closest = 'Custom color'\n  let minDist = Infinity\n\n  for (const color of COLOR_NAMES) {\n    const dist = Math.sqrt(\n      Math.pow(r - color.r, 2) + Math.pow(g - color.g, 2) + Math.pow(b - color.b, 2)\n    )\n    if (dist < minDist) {\n      minDist = dist\n      closest = color.name\n    }\n  }\n\n  // If distance is too far, call it a custom color\n  if (minDist > 80) {\n    return 'Custom color'\n  }\n\n  return closest\n}\n\n/** Clamp a number to the range [min, max] */\nfunction clamp(value: number, min: number, max: number): number {\n  return Math.max(min, Math.min(max, value))\n}\n\n/** Internal RGBA representation */\ninterface RGBA {\n  r: number\n  g: number\n  b: number\n  a: number\n}\n\n/** Internal HSLA representation */\ninterface HSLA {\n  h: number\n  s: number\n  l: number\n  a: number\n}\n\n/** Convert hex string to RGBA */\nfunction hexToRgba(hex: string): RGBA {\n  let h = hex.replace(/^#/, '')\n  if (h.length === 3 || h.length === 4) {\n    h = h\n      .split('')\n      .map(c => c + c)\n      .join('')\n  }\n  const r = parseInt(h.slice(0, 2), 16)\n  const g = parseInt(h.slice(2, 4), 16)\n  const b = parseInt(h.slice(4, 6), 16)\n  const a = h.length === 8 ? parseInt(h.slice(6, 8), 16) / 255 : 1\n  return {\n    r: isNaN(r) ? 0 : r,\n    g: isNaN(g) ? 0 : g,\n    b: isNaN(b) ? 0 : b,\n    a: isNaN(a) ? 1 : a,\n  }\n}\n\n/** Convert RGBA to hex string */\nfunction rgbaToHex(rgba: RGBA, includeAlpha: boolean): string {\n  const r = clamp(Math.round(rgba.r), 0, 255).toString(16).padStart(2, '0')\n  const g = clamp(Math.round(rgba.g), 0, 255).toString(16).padStart(2, '0')\n  const b = clamp(Math.round(rgba.b), 0, 255).toString(16).padStart(2, '0')\n  if (includeAlpha && rgba.a < 1) {\n    const a = clamp(Math.round(rgba.a * 255), 0, 255)\n      .toString(16)\n      .padStart(2, '0')\n    return `#${r}${g}${b}${a}`\n  }\n  return `#${r}${g}${b}`\n}\n\n/** Convert RGBA to HSLA */\nfunction rgbaToHsla(rgba: RGBA): HSLA {\n  const r = rgba.r / 255\n  const g = rgba.g / 255\n  const b = rgba.b / 255\n\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  const l = (max + min) / 2\n  let h = 0\n  let s = 0\n\n  if (max !== min) {\n    const d = max - min\n    s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n    if (max === r) {\n      h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n    } else if (max === g) {\n      h = ((b - r) / d + 2) / 6\n    } else {\n      h = ((r - g) / d + 4) / 6\n    }\n  }\n\n  return { h: h * 360, s: s * 100, l: l * 100, a: rgba.a }\n}\n\n/** Convert HSV (h 0-360, s 0-1, v 0-1) to RGBA */\nfunction hsvToRgba(h: number, s: number, v: number, a: number): RGBA {\n  const i = Math.floor(h / 60) % 6\n  const f = h / 60 - Math.floor(h / 60)\n  const p = v * (1 - s)\n  const q = v * (1 - f * s)\n  const t = v * (1 - (1 - f) * s)\n\n  let r: number\n  let g: number\n  let b: number\n\n  switch (i) {\n    case 0:\n      r = v\n      g = t\n      b = p\n      break\n    case 1:\n      r = q\n      g = v\n      b = p\n      break\n    case 2:\n      r = p\n      g = v\n      b = t\n      break\n    case 3:\n      r = p\n      g = q\n      b = v\n      break\n    case 4:\n      r = t\n      g = p\n      b = v\n      break\n    default:\n      r = v\n      g = p\n      b = q\n      break\n  }\n\n  return {\n    r: Math.round(r * 255),\n    g: Math.round(g * 255),\n    b: Math.round(b * 255),\n    a,\n  }\n}\n\n/** Convert RGBA to HSV (returns h 0-360, s 0-1, v 0-1) */\nfunction rgbaToHsv(rgba: RGBA): { h: number; s: number; v: number } {\n  const r = rgba.r / 255\n  const g = rgba.g / 255\n  const b = rgba.b / 255\n  const max = Math.max(r, g, b)\n  const min = Math.min(r, g, b)\n  const d = max - min\n  let h = 0\n\n  if (d !== 0) {\n    if (max === r) {\n      h = ((g - b) / d + (g < b ? 6 : 0)) * 60\n    } else if (max === g) {\n      h = ((b - r) / d + 2) * 60\n    } else {\n      h = ((r - g) / d + 4) * 60\n    }\n  }\n\n  const s = max === 0 ? 0 : d / max\n  return { h, s, v: max }\n}\n\n/** Format an RGBA value as an rgb/rgba string */\nfunction formatRgbString(rgba: RGBA): string {\n  if (rgba.a < 1) {\n    return `rgba(${String(Math.round(rgba.r))}, ${String(Math.round(rgba.g))}, ${String(Math.round(rgba.b))}, ${String(Math.round(rgba.a * 100) / 100)})`\n  }\n  return `rgb(${String(Math.round(rgba.r))}, ${String(Math.round(rgba.g))}, ${String(Math.round(rgba.b))})`\n}\n\n/** Format an HSLA value as an hsl/hsla string */\nfunction formatHslString(hsla: HSLA): string {\n  const h = Math.round(hsla.h)\n  const s = Math.round(hsla.s)\n  const l = Math.round(hsla.l)\n  if (hsla.a < 1) {\n    return `hsla(${String(h)}, ${String(s)}%, ${String(l)}%, ${String(Math.round(hsla.a * 100) / 100)})`\n  }\n  return `hsl(${String(h)}, ${String(s)}%, ${String(l)}%)`\n}\n\nexport class ColorPicker {\n  private readonly container: HTMLElement\n  private readonly config: ColorPickerConfig\n  private readonly id: string\n\n  private rgba: RGBA = { r: 0, g: 0, b: 0, a: 1 }\n  private hue = 0\n  private saturation = 0\n  private brightness = 0\n\n  private swatchEl: HTMLElement | null = null\n  private panelEl: HTMLElement | null = null\n  private satCanvas: HTMLCanvasElement | null = null\n  private hueCanvas: HTMLCanvasElement | null = null\n  private alphaCanvas: HTMLCanvasElement | null = null\n  private hexInput: HTMLInputElement | null = null\n  private rInput: HTMLInputElement | null = null\n  private gInput: HTMLInputElement | null = null\n  private bInput: HTMLInputElement | null = null\n  private isOpen = false\n\n  private readonly boundOnDocClick: (e: MouseEvent) => void\n  private activeDrag: 'saturation' | 'hue' | 'alpha' | null = null\n\n  constructor(config: ColorPickerConfig) {\n    this.container = resolveContainer(config.container)\n    this.config = config\n    this.id = uniqueId('cmm-color-picker')\n\n    const initial = config.value ?? '#000000'\n    this.rgba = hexToRgba(initial)\n    const hsv = rgbaToHsv(this.rgba)\n    this.hue = hsv.h\n    this.saturation = hsv.s\n    this.brightness = hsv.v\n\n    this.boundOnDocClick = this.onDocumentClick.bind(this)\n\n    this.render()\n  }\n\n  /** Get the current color value in the configured format */\n  getValue(): string {\n    return this.formatOutput()\n  }\n\n  /** Set the color value (accepts hex, updates all internal state) */\n  setValue(color: string): void {\n    this.rgba = hexToRgba(color)\n    const hsv = rgbaToHsv(this.rgba)\n    this.hue = hsv.h\n    this.saturation = hsv.s\n    this.brightness = hsv.v\n    this.updateAllUI()\n  }\n\n  /** Clean up DOM and event listeners */\n  destroy(): void {\n    document.removeEventListener('click', this.boundOnDocClick)\n    document.removeEventListener('mousemove', this.onMouseMove)\n    document.removeEventListener('mouseup', this.onMouseUp)\n    document.removeEventListener('touchmove', this.onTouchMove)\n    document.removeEventListener('touchend', this.onTouchEnd)\n    this.container.innerHTML = ''\n    this.panelEl = null\n    this.satCanvas = null\n    this.hueCanvas = null\n    this.alphaCanvas = null\n  }\n\n  /** Format the output color value based on the configured format */\n  private formatOutput(): string {\n    const format = this.config.format ?? 'hex'\n    switch (format) {\n      case 'rgb':\n        return formatRgbString(this.rgba)\n      case 'hsl':\n        return formatHslString(rgbaToHsla(this.rgba))\n      case 'hex':\n      default:\n        return rgbaToHex(this.rgba, this.config.showAlpha === true)\n    }\n  }\n\n  /** Build the full DOM structure */\n  private render(): void {\n    this.container.innerHTML = ''\n\n    const root = document.createElement('div')\n    root.className = 'cmm-color-picker'\n    if (this.config.className) {\n      root.classList.add(this.config.className)\n    }\n    root.id = this.id\n\n    // Preview swatch button\n    const swatch = document.createElement('button')\n    swatch.className = 'cmm-color-picker__swatch'\n    swatch.type = 'button'\n    swatch.setAttribute('aria-label', 'Open color picker')\n    swatch.setAttribute('aria-expanded', 'false')\n    swatch.style.backgroundColor = rgbaToHex(this.rgba, true)\n    swatch.addEventListener('click', e => {\n      e.stopPropagation()\n      this.togglePanel()\n    })\n    this.swatchEl = swatch\n    root.appendChild(swatch)\n\n    // Popover panel\n    const panel = document.createElement('div')\n    panel.className = 'cmm-color-picker__panel'\n    panel.style.display = 'none'\n    panel.addEventListener('click', e => {\n      e.stopPropagation()\n    })\n    this.panelEl = panel\n\n    // Saturation/brightness canvas\n    const satWrap = document.createElement('div')\n    satWrap.className = 'cmm-color-picker__saturation-wrap'\n    const satCanvas = document.createElement('canvas')\n    satCanvas.className = 'cmm-color-picker__saturation'\n    satCanvas.width = 256\n    satCanvas.height = 160\n    satCanvas.tabIndex = 0\n    satCanvas.setAttribute('role', 'slider')\n    satCanvas.setAttribute('aria-label', 'Saturation and brightness')\n    satCanvas.setAttribute('aria-valuemin', '0')\n    satCanvas.setAttribute('aria-valuemax', '100')\n    satCanvas.addEventListener('mousedown', this.onSatMouseDown)\n    satCanvas.addEventListener('touchstart', this.onSatTouchStart, { passive: false })\n    satCanvas.addEventListener('keydown', this.onSatKeyDown)\n    this.satCanvas = satCanvas\n    satWrap.appendChild(satCanvas)\n    panel.appendChild(satWrap)\n\n    // Sliders row\n    const slidersRow = document.createElement('div')\n    slidersRow.className = 'cmm-color-picker__sliders'\n\n    // Hue slider\n    const hueWrap = document.createElement('div')\n    hueWrap.className = 'cmm-color-picker__hue-wrap'\n    const hueCanvas = document.createElement('canvas')\n    hueCanvas.className = 'cmm-color-picker__hue'\n    hueCanvas.width = 256\n    hueCanvas.height = 14\n    hueCanvas.tabIndex = 0\n    hueCanvas.setAttribute('role', 'slider')\n    hueCanvas.setAttribute('aria-label', 'Hue')\n    hueCanvas.setAttribute('aria-valuemin', '0')\n    hueCanvas.setAttribute('aria-valuemax', '360')\n    hueCanvas.addEventListener('mousedown', this.onHueMouseDown)\n    hueCanvas.addEventListener('touchstart', this.onHueTouchStart, { passive: false })\n    hueCanvas.addEventListener('keydown', this.onHueKeyDown)\n    this.hueCanvas = hueCanvas\n    hueWrap.appendChild(hueCanvas)\n    slidersRow.appendChild(hueWrap)\n\n    // Alpha slider (optional)\n    if (this.config.showAlpha === true) {\n      const alphaWrap = document.createElement('div')\n      alphaWrap.className = 'cmm-color-picker__alpha-wrap'\n      const alphaCanvas = document.createElement('canvas')\n      alphaCanvas.className = 'cmm-color-picker__alpha'\n      alphaCanvas.width = 256\n      alphaCanvas.height = 14\n      alphaCanvas.tabIndex = 0\n      alphaCanvas.setAttribute('role', 'slider')\n      alphaCanvas.setAttribute('aria-label', 'Opacity')\n      alphaCanvas.setAttribute('aria-valuemin', '0')\n      alphaCanvas.setAttribute('aria-valuemax', '100')\n      alphaCanvas.addEventListener('mousedown', this.onAlphaMouseDown)\n      alphaCanvas.addEventListener('touchstart', this.onAlphaTouchStart, { passive: false })\n      alphaCanvas.addEventListener('keydown', this.onAlphaKeyDown)\n      this.alphaCanvas = alphaCanvas\n      alphaWrap.appendChild(alphaCanvas)\n      slidersRow.appendChild(alphaWrap)\n    }\n\n    panel.appendChild(slidersRow)\n\n    // Input fields row\n    const inputRow = document.createElement('div')\n    inputRow.className = 'cmm-color-picker__inputs'\n\n    // Hex input\n    const hexGroup = document.createElement('div')\n    hexGroup.className = 'cmm-color-picker__input-group'\n    const hexLabel = document.createElement('label')\n    hexLabel.className = 'cmm-color-picker__input-label'\n    hexLabel.textContent = 'Hex'\n    const hexInput = document.createElement('input')\n    hexInput.className = 'cmm-color-picker__input cmm-color-picker__input--hex'\n    hexInput.type = 'text'\n    hexInput.maxLength = 9\n    hexInput.value = rgbaToHex(this.rgba, this.config.showAlpha === true)\n    hexInput.addEventListener('change', () => {\n      const val = hexInput.value.trim()\n      const normalized = val.startsWith('#') ? val : `#${val}`\n      if (/^#([0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(normalized)) {\n        this.rgba = hexToRgba(normalized)\n        const hsv = rgbaToHsv(this.rgba)\n        this.hue = hsv.h\n        this.saturation = hsv.s\n        this.brightness = hsv.v\n        this.updateAllUI()\n        this.emitChange()\n      }\n    })\n    this.hexInput = hexInput\n    hexGroup.appendChild(hexLabel)\n    hexGroup.appendChild(hexInput)\n    inputRow.appendChild(hexGroup)\n\n    // R input\n    const rGroup = this.buildNumberInput('R', 0, 255, this.rgba.r, v => {\n      this.rgba.r = v\n      this.syncFromRgba()\n    })\n    this.rInput = rGroup.querySelector('input')\n    inputRow.appendChild(rGroup)\n\n    // G input\n    const gGroup = this.buildNumberInput('G', 0, 255, this.rgba.g, v => {\n      this.rgba.g = v\n      this.syncFromRgba()\n    })\n    this.gInput = gGroup.querySelector('input')\n    inputRow.appendChild(gGroup)\n\n    // B input\n    const bGroup = this.buildNumberInput('B', 0, 255, this.rgba.b, v => {\n      this.rgba.b = v\n      this.syncFromRgba()\n    })\n    this.bInput = bGroup.querySelector('input')\n    inputRow.appendChild(bGroup)\n\n    panel.appendChild(inputRow)\n\n    // Copy button\n    const copyRow = document.createElement('div')\n    copyRow.className = 'cmm-color-picker__actions'\n    const copyBtn = document.createElement('button')\n    copyBtn.className = 'cmm-color-picker__copy'\n    copyBtn.type = 'button'\n    copyBtn.textContent = 'Copy'\n    copyBtn.setAttribute('aria-label', 'Copy color value')\n    copyBtn.addEventListener('click', () => {\n      const value = this.formatOutput()\n      void navigator.clipboard.writeText(value).then(() => {\n        copyBtn.textContent = 'Copied!'\n        setTimeout(() => {\n          copyBtn.textContent = 'Copy'\n        }, 1500)\n      })\n    })\n    copyRow.appendChild(copyBtn)\n    panel.appendChild(copyRow)\n\n    // Preset swatches\n    const presets = this.config.presets\n    if (presets !== undefined && presets.length > 0) {\n      const presetGrid = document.createElement('div')\n      presetGrid.className = 'cmm-color-picker__presets'\n      for (const preset of presets) {\n        const presetBtn = document.createElement('button')\n        presetBtn.className = 'cmm-color-picker__preset'\n        presetBtn.type = 'button'\n        presetBtn.style.backgroundColor = preset\n        presetBtn.setAttribute('aria-label', `Select color ${preset}`)\n        presetBtn.addEventListener('click', () => {\n          this.setValue(preset)\n          this.emitChange()\n        })\n        presetGrid.appendChild(presetBtn)\n      }\n      panel.appendChild(presetGrid)\n    }\n\n    root.appendChild(panel)\n    this.container.appendChild(root)\n\n    // Draw initial canvases\n    this.drawSaturation()\n    this.drawHue()\n    if (this.config.showAlpha === true) {\n      this.drawAlpha()\n    }\n\n    document.addEventListener('click', this.boundOnDocClick)\n  }\n\n  /** Build a small number input group */\n  private buildNumberInput(\n    label: string,\n    min: number,\n    max: number,\n    value: number,\n    onInput: (v: number) => void\n  ): HTMLElement {\n    const group = document.createElement('div')\n    group.className = 'cmm-color-picker__input-group'\n    const labelEl = document.createElement('label')\n    labelEl.className = 'cmm-color-picker__input-label'\n    labelEl.textContent = label\n    const input = document.createElement('input')\n    input.className = 'cmm-color-picker__input cmm-color-picker__input--num'\n    input.type = 'number'\n    input.min = String(min)\n    input.max = String(max)\n    input.value = String(Math.round(value))\n    input.addEventListener('change', () => {\n      const parsed = parseInt(input.value, 10)\n      const v = clamp(isNaN(parsed) ? 0 : parsed, min, max)\n      input.value = String(v)\n      onInput(v)\n    })\n    group.appendChild(labelEl)\n    group.appendChild(input)\n    return group\n  }\n\n  /** Sync HSV values from the current RGBA and update UI */\n  private syncFromRgba(): void {\n    const hsv = rgbaToHsv(this.rgba)\n    this.hue = hsv.h\n    this.saturation = hsv.s\n    this.brightness = hsv.v\n    this.updateAllUI()\n    this.emitChange()\n  }\n\n  /** Toggle the picker panel open/closed */\n  private togglePanel(): void {\n    if (this.isOpen) {\n      this.closePanel()\n    } else {\n      this.openPanel()\n    }\n  }\n\n  /** Open the picker panel */\n  private openPanel(): void {\n    if (this.panelEl === null) return\n    this.panelEl.style.display = 'block'\n    this.swatchEl?.setAttribute('aria-expanded', 'true')\n    this.isOpen = true\n    this.drawSaturation()\n    this.drawHue()\n    if (this.config.showAlpha === true) {\n      this.drawAlpha()\n    }\n  }\n\n  /** Close the picker panel */\n  private closePanel(): void {\n    if (this.panelEl === null) return\n    this.panelEl.style.display = 'none'\n    this.swatchEl?.setAttribute('aria-expanded', 'false')\n    this.isOpen = false\n  }\n\n  /** Handle document click to close panel */\n  private onDocumentClick(): void {\n    if (this.isOpen) {\n      this.closePanel()\n    }\n  }\n\n  /** Draw the saturation/brightness 2D gradient */\n  private drawSaturation(): void {\n    const canvas = this.satCanvas\n    if (canvas === null) return\n    const ctx = canvas.getContext('2d')\n    if (ctx === null) return\n    const w = canvas.width\n    const h = canvas.height\n\n    // Base hue color\n    const baseRgba = hsvToRgba(this.hue, 1, 1, 1)\n    const baseHex = rgbaToHex(baseRgba, false)\n\n    // Fill with hue\n    ctx.fillStyle = baseHex\n    ctx.fillRect(0, 0, w, h)\n\n    // White gradient (left to right)\n    const whiteGrad = ctx.createLinearGradient(0, 0, w, 0)\n    whiteGrad.addColorStop(0, 'rgba(255, 255, 255, 1)')\n    whiteGrad.addColorStop(1, 'rgba(255, 255, 255, 0)')\n    ctx.fillStyle = whiteGrad\n    ctx.fillRect(0, 0, w, h)\n\n    // Black gradient (top to bottom)\n    const blackGrad = ctx.createLinearGradient(0, 0, 0, h)\n    blackGrad.addColorStop(0, 'rgba(0, 0, 0, 0)')\n    blackGrad.addColorStop(1, 'rgba(0, 0, 0, 1)')\n    ctx.fillStyle = blackGrad\n    ctx.fillRect(0, 0, w, h)\n\n    // Draw cursor\n    const cx = this.saturation * w\n    const cy = (1 - this.brightness) * h\n    ctx.beginPath()\n    ctx.arc(cx, cy, 6, 0, Math.PI * 2)\n    ctx.strokeStyle = '#ffffff'\n    ctx.lineWidth = 2\n    ctx.stroke()\n    ctx.beginPath()\n    ctx.arc(cx, cy, 7, 0, Math.PI * 2)\n    ctx.strokeStyle = '#000000'\n    ctx.lineWidth = 1\n    ctx.stroke()\n  }\n\n  /** Draw the hue rainbow slider */\n  private drawHue(): void {\n    const canvas = this.hueCanvas\n    if (canvas === null) return\n    const ctx = canvas.getContext('2d')\n    if (ctx === null) return\n    const w = canvas.width\n    const h = canvas.height\n\n    const grad = ctx.createLinearGradient(0, 0, w, 0)\n    const stops = 7\n    for (let i = 0; i <= stops; i++) {\n      const ratio = i / stops\n      const hueColor = hsvToRgba(ratio * 360, 1, 1, 1)\n      grad.addColorStop(ratio, rgbaToHex(hueColor, false))\n    }\n    ctx.fillStyle = grad\n    ctx.fillRect(0, 0, w, h)\n\n    // Draw indicator\n    const ix = (this.hue / 360) * w\n    ctx.beginPath()\n    ctx.rect(ix - 3, 0, 6, h)\n    ctx.strokeStyle = '#ffffff'\n    ctx.lineWidth = 2\n    ctx.stroke()\n    ctx.strokeStyle = '#000000'\n    ctx.lineWidth = 1\n    ctx.stroke()\n  }\n\n  /** Draw the alpha slider with checkerboard background */\n  private drawAlpha(): void {\n    const canvas = this.alphaCanvas\n    if (canvas === null) return\n    const ctx = canvas.getContext('2d')\n    if (ctx === null) return\n    const w = canvas.width\n    const h = canvas.height\n\n    // Checkerboard\n    const checkSize = 4\n    for (let y = 0; y < h; y += checkSize) {\n      for (let x = 0; x < w; x += checkSize) {\n        const isLight = (x / checkSize + y / checkSize) % 2 === 0\n        ctx.fillStyle = isLight ? '#cccccc' : '#ffffff'\n        ctx.fillRect(x, y, checkSize, checkSize)\n      }\n    }\n\n    // Color gradient from transparent to opaque\n    const opaqueHex = rgbaToHex({ ...this.rgba, a: 1 }, false)\n    const grad = ctx.createLinearGradient(0, 0, w, 0)\n    grad.addColorStop(0, 'rgba(0, 0, 0, 0)')\n    grad.addColorStop(1, opaqueHex)\n    ctx.fillStyle = grad\n    ctx.fillRect(0, 0, w, h)\n\n    // Draw indicator\n    const ix = this.rgba.a * w\n    ctx.beginPath()\n    ctx.rect(ix - 3, 0, 6, h)\n    ctx.strokeStyle = '#ffffff'\n    ctx.lineWidth = 2\n    ctx.stroke()\n    ctx.strokeStyle = '#000000'\n    ctx.lineWidth = 1\n    ctx.stroke()\n  }\n\n  /** Update all UI elements to reflect current state */\n  private updateAllUI(): void {\n    // Swatch\n    if (this.swatchEl !== null) {\n      this.swatchEl.style.backgroundColor = rgbaToHex(this.rgba, true)\n    }\n\n    // Canvas\n    this.drawSaturation()\n    this.drawHue()\n    if (this.config.showAlpha === true) {\n      this.drawAlpha()\n    }\n\n    // Hex input\n    if (this.hexInput !== null) {\n      this.hexInput.value = rgbaToHex(this.rgba, this.config.showAlpha === true)\n    }\n\n    // RGB inputs\n    if (this.rInput !== null) this.rInput.value = String(Math.round(this.rgba.r))\n    if (this.gInput !== null) this.gInput.value = String(Math.round(this.rgba.g))\n    if (this.bInput !== null) this.bInput.value = String(Math.round(this.rgba.b))\n  }\n\n  /** Emit the onChange callback */\n  private emitChange(): void {\n    this.config.onChange?.(this.formatOutput())\n  }\n\n  /** Announce color change to screen readers */\n  private announceColor(): void {\n    const colorName = getClosestColorName(\n      Math.round(this.rgba.r),\n      Math.round(this.rgba.g),\n      Math.round(this.rgba.b)\n    )\n    const hex = rgbaToHex(this.rgba, false)\n    announce(`${colorName}, ${hex}`, 'polite')\n  }\n\n  // ---- Saturation drag handlers ----\n\n  private readonly onSatMouseDown = (e: MouseEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'saturation'\n    this.updateSatFromPos(e.offsetX, e.offsetY)\n    document.addEventListener('mousemove', this.onMouseMove)\n    document.addEventListener('mouseup', this.onMouseUp)\n  }\n\n  private readonly onSatTouchStart = (e: TouchEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'saturation'\n    const touch = e.touches[0]\n    if (touch !== undefined) {\n      this.updateSatFromClient(touch.clientX, touch.clientY)\n    }\n    document.addEventListener('touchmove', this.onTouchMove, { passive: false })\n    document.addEventListener('touchend', this.onTouchEnd)\n  }\n\n  private updateSatFromPos(x: number, y: number): void {\n    const canvas = this.satCanvas\n    if (canvas === null) return\n    this.saturation = clamp(x / canvas.width, 0, 1)\n    this.brightness = clamp(1 - y / canvas.height, 0, 1)\n    this.rgba = hsvToRgba(this.hue, this.saturation, this.brightness, this.rgba.a)\n    this.updateAllUI()\n    this.emitChange()\n  }\n\n  private updateSatFromClient(clientX: number, clientY: number): void {\n    const canvas = this.satCanvas\n    if (canvas === null) return\n    const rect = canvas.getBoundingClientRect()\n    const x = clientX - rect.left\n    const y = clientY - rect.top\n    this.updateSatFromPos(x, y)\n  }\n\n  // ---- Hue drag handlers ----\n\n  private readonly onHueMouseDown = (e: MouseEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'hue'\n    this.updateHueFromPos(e.offsetX)\n    document.addEventListener('mousemove', this.onMouseMove)\n    document.addEventListener('mouseup', this.onMouseUp)\n  }\n\n  private readonly onHueTouchStart = (e: TouchEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'hue'\n    const touch = e.touches[0]\n    if (touch !== undefined) {\n      this.updateHueFromClient(touch.clientX)\n    }\n    document.addEventListener('touchmove', this.onTouchMove, { passive: false })\n    document.addEventListener('touchend', this.onTouchEnd)\n  }\n\n  private updateHueFromPos(x: number): void {\n    const canvas = this.hueCanvas\n    if (canvas === null) return\n    this.hue = clamp(x / canvas.width, 0, 1) * 360\n    this.rgba = hsvToRgba(this.hue, this.saturation, this.brightness, this.rgba.a)\n    this.updateAllUI()\n    this.emitChange()\n  }\n\n  private updateHueFromClient(clientX: number): void {\n    const canvas = this.hueCanvas\n    if (canvas === null) return\n    const rect = canvas.getBoundingClientRect()\n    this.updateHueFromPos(clientX - rect.left)\n  }\n\n  // ---- Alpha drag handlers ----\n\n  private readonly onAlphaMouseDown = (e: MouseEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'alpha'\n    this.updateAlphaFromPos(e.offsetX)\n    document.addEventListener('mousemove', this.onMouseMove)\n    document.addEventListener('mouseup', this.onMouseUp)\n  }\n\n  private readonly onAlphaTouchStart = (e: TouchEvent): void => {\n    e.preventDefault()\n    this.activeDrag = 'alpha'\n    const touch = e.touches[0]\n    if (touch !== undefined) {\n      this.updateAlphaFromClient(touch.clientX)\n    }\n    document.addEventListener('touchmove', this.onTouchMove, { passive: false })\n    document.addEventListener('touchend', this.onTouchEnd)\n  }\n\n  private updateAlphaFromPos(x: number): void {\n    const canvas = this.alphaCanvas\n    if (canvas === null) return\n    this.rgba.a = clamp(x / canvas.width, 0, 1)\n    this.updateAllUI()\n    this.emitChange()\n  }\n\n  private updateAlphaFromClient(clientX: number): void {\n    const canvas = this.alphaCanvas\n    if (canvas === null) return\n    const rect = canvas.getBoundingClientRect()\n    this.updateAlphaFromPos(clientX - rect.left)\n  }\n\n  // ---- Shared move/end handlers ----\n\n  private readonly onMouseMove = (e: MouseEvent): void => {\n    e.preventDefault()\n    switch (this.activeDrag) {\n      case 'saturation':\n        this.updateSatFromClient(e.clientX, e.clientY)\n        break\n      case 'hue':\n        this.updateHueFromClient(e.clientX)\n        break\n      case 'alpha':\n        this.updateAlphaFromClient(e.clientX)\n        break\n    }\n  }\n\n  private readonly onMouseUp = (): void => {\n    this.activeDrag = null\n    document.removeEventListener('mousemove', this.onMouseMove)\n    document.removeEventListener('mouseup', this.onMouseUp)\n  }\n\n  private readonly onTouchMove = (e: TouchEvent): void => {\n    e.preventDefault()\n    const touch = e.touches[0]\n    if (touch === undefined) return\n    switch (this.activeDrag) {\n      case 'saturation':\n        this.updateSatFromClient(touch.clientX, touch.clientY)\n        break\n      case 'hue':\n        this.updateHueFromClient(touch.clientX)\n        break\n      case 'alpha':\n        this.updateAlphaFromClient(touch.clientX)\n        break\n    }\n  }\n\n  private readonly onTouchEnd = (): void => {\n    this.activeDrag = null\n    document.removeEventListener('touchmove', this.onTouchMove)\n    document.removeEventListener('touchend', this.onTouchEnd)\n  }\n\n  // ---- Keyboard handlers for accessibility ----\n\n  private readonly onSatKeyDown = (e: KeyboardEvent): void => {\n    const step = e.shiftKey ? 0.1 : 0.02\n    let handled = true\n\n    switch (e.key) {\n      case 'ArrowRight':\n        this.saturation = clamp(this.saturation + step, 0, 1)\n        break\n      case 'ArrowLeft':\n        this.saturation = clamp(this.saturation - step, 0, 1)\n        break\n      case 'ArrowUp':\n        this.brightness = clamp(this.brightness + step, 0, 1)\n        break\n      case 'ArrowDown':\n        this.brightness = clamp(this.brightness - step, 0, 1)\n        break\n      default:\n        handled = false\n    }\n\n    if (handled) {\n      e.preventDefault()\n      this.rgba = hsvToRgba(this.hue, this.saturation, this.brightness, this.rgba.a)\n      this.updateAllUI()\n      this.emitChange()\n      this.announceColor()\n    }\n  }\n\n  private readonly onHueKeyDown = (e: KeyboardEvent): void => {\n    const step = e.shiftKey ? 30 : 5\n    let handled = true\n\n    switch (e.key) {\n      case 'ArrowRight':\n      case 'ArrowUp':\n        this.hue = (this.hue + step) % 360\n        break\n      case 'ArrowLeft':\n      case 'ArrowDown':\n        this.hue = (this.hue - step + 360) % 360\n        break\n      case 'Home':\n        this.hue = 0\n        break\n      case 'End':\n        this.hue = 359\n        break\n      default:\n        handled = false\n    }\n\n    if (handled) {\n      e.preventDefault()\n      this.rgba = hsvToRgba(this.hue, this.saturation, this.brightness, this.rgba.a)\n      this.updateAllUI()\n      this.emitChange()\n      this.announceColor()\n    }\n  }\n\n  private readonly onAlphaKeyDown = (e: KeyboardEvent): void => {\n    const step = e.shiftKey ? 0.1 : 0.05\n    let handled = true\n\n    switch (e.key) {\n      case 'ArrowRight':\n      case 'ArrowUp':\n        this.rgba.a = clamp(this.rgba.a + step, 0, 1)\n        break\n      case 'ArrowLeft':\n      case 'ArrowDown':\n        this.rgba.a = clamp(this.rgba.a - step, 0, 1)\n        break\n      case 'Home':\n        this.rgba.a = 0\n        break\n      case 'End':\n        this.rgba.a = 1\n        break\n      default:\n        handled = false\n    }\n\n    if (handled) {\n      e.preventDefault()\n      this.updateAllUI()\n      this.emitChange()\n      announce(`Opacity ${String(Math.round(this.rgba.a * 100))} percent`, 'polite')\n    }\n  }\n}\n"],"mappings":"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"}