@jannchie/icons 0.0.0-stage → 0.2.0

package/dist/src/svg.js

@@ -0,0 +1,485 @@
+import { clip, samples, segments } from "./clip.js";
+import "./scene.js";
+//#region src/svg.js
+var round = (n) => Math.round(n * 100) / 100;
+var num = (n) => String(round(n)).replace(/^(-?)0\./, "$1.");
+var glue = (s, n) => s + (/[\d.]$/.test(s) && !n.startsWith("-") && !(n.startsWith(".") && /\.\d*$/.test(s)) ? " " : "") + n;
+var join = (nums) => nums.map(num).reduce(glue, "");
+var ARITY = {
+	M: 2,
+	L: 2,
+	H: 1,
+	V: 1,
+	C: 6,
+	Q: 4,
+	A: 7,
+	Z: 0
+};
+function parse(d, precise = false) {
+	const tokens = d.match(/[a-z]|-?(?:\d+\.?\d*|\.\d+)(?:e-?\d+)?/gi) ?? [];
+	const segs = [];
+	let [cx, cy, sx, sy] = [
+		0,
+		0,
+		0,
+		0
+	];
+	let i = 0;
+	let cmd = "";
+	while (i < tokens.length) {
+		if (/[a-z]/i.test(tokens[i])) cmd = tokens[i++];
+		const C = cmd.toUpperCase();
+		const rel = cmd !== C;
+		const args = tokens.slice(i, i + ARITY[C]).map(Number);
+		i += ARITY[C];
+		const ox = rel ? cx : 0;
+		const oy = rel ? cy : 0;
+		let abs;
+		switch (C) {
+			case "M":
+			case "L":
+				abs = [args[0] + ox, args[1] + oy];
+				break;
+			case "H":
+				abs = [args[0] + ox, cy];
+				break;
+			case "V":
+				abs = [cx, args[0] + oy];
+				break;
+			case "C":
+				abs = args.map((v, j) => v + (j % 2 ? oy : ox));
+				break;
+			case "Q":
+				abs = args.map((v, j) => v + (j % 2 ? oy : ox));
+				break;
+			case "A":
+				abs = [
+					...args.slice(0, 5),
+					args[5] + ox,
+					args[6] + oy
+				];
+				break;
+			default: abs = [];
+		}
+		if (!precise) abs = abs.map(round);
+		const type = C === "H" || C === "V" ? "L" : C;
+		segs.push([type, abs]);
+		if (C === "Z") [cx, cy] = [sx, sy];
+		else [cx, cy] = abs.slice(-2);
+		if (C === "M") {
+			[sx, sy] = [cx, cy];
+			if (cmd === "M" || cmd === "m") cmd = rel ? "l" : "L";
+		}
+	}
+	return segs;
+}
+function axisLines(d) {
+	const lines = [];
+	let pos = [0, 0];
+	let start = [0, 0];
+	for (const [t, a] of parse(d, true)) {
+		const to = t === "Z" ? start : a.slice(-2);
+		if (t === "M") start = to;
+		else if (t === "L" || t === "Z") {
+			const [dx, dy] = [Math.abs(to[0] - pos[0]), Math.abs(to[1] - pos[1])];
+			if (dx < 1e-6 && dy > 1e-6) lines.push([
+				"x",
+				to[0],
+				dy
+			]);
+			else if (dy < 1e-6 && dx > 1e-6) lines.push([
+				"y",
+				to[1],
+				dx
+			]);
+		}
+		pos = to;
+	}
+	return lines;
+}
+function minify(d, { packArcs = false } = {}) {
+	let out = "";
+	let last = "";
+	let [cx, cy, sx, sy] = [
+		0,
+		0,
+		0,
+		0
+	];
+	for (const [type, a] of parse(d)) {
+		const candidates = [];
+		if (type === "M") candidates.push(["M", a], ["m", [a[0] - cx, a[1] - cy]]);
+		else if (type === "L") {
+			if (a[1] === cy) candidates.push(["H", [a[0]]], ["h", [a[0] - cx]]);
+			else if (a[0] === cx) candidates.push(["V", [a[1]]], ["v", [a[1] - cy]]);
+			else candidates.push(["L", a], ["l", [a[0] - cx, a[1] - cy]]);
+		} else if (type === "C" || type === "Q") candidates.push([type, a], [type.toLowerCase(), a.map((v, j) => v - (j % 2 ? cy : cx))]);
+		else if (type === "A") candidates.push(["A", a], ["a", [
+			...a.slice(0, 5),
+			a[5] - cx,
+			a[6] - cy
+		]]);
+		else candidates.push(["z", []]);
+		const write = (c, n) => packArcs && /a/i.test(c) ? `${glue(join(n.slice(0, 3)), `${n[3]}${n[4]}`)}${join(n.slice(5))}` : join(n);
+		const [cmd, body] = candidates.map(([c, n]) => [c, write(c, n)]).reduce((best, c) => c[1].length < best[1].length ? c : best);
+		out = cmd === last && !/m/i.test(cmd) && cmd !== "z" ? glue(out, body) : out + cmd + body;
+		last = cmd;
+		if (type === "Z") [cx, cy] = [sx, sy];
+		else [cx, cy] = a.slice(-2);
+		if (type === "M") [sx, sy] = [cx, cy];
+	}
+	return out;
+}
+var DETAIL_STROKE = 1.5;
+var THIN = .7;
+var widthOf = (item, stroke) => Math.min(item.thin ? stroke * THIN : item.detail ? Math.min(stroke, DETAIL_STROKE) : stroke, item.relief ?? Infinity);
+var dotSize = (item) => item.dot ?? (/^(?:M[^MLHVCSQTAZ]+h0)+$/i.test(item.d.replace(/\s+/g, "")) ? 2 : 0);
+var DOT_STROKE = 1.5;
+var dotWidth = (item, stroke) => dotSize(item) * stroke / DOT_STROKE;
+function nearestOn(p, pts) {
+	let best = {
+		d2: Infinity,
+		q: null
+	};
+	for (let i = 1; i < pts.length; i++) {
+		const [a, b] = [pts[i - 1], pts[i]];
+		const [dx, dy] = [b[0] - a[0], b[1] - a[1]];
+		const len2 = dx * dx + dy * dy;
+		const t = len2 ? Math.max(0, Math.min(1, ((p[0] - a[0]) * dx + (p[1] - a[1]) * dy) / len2)) : 0;
+		const [qx, qy] = [a[0] + dx * t, a[1] + dy * t];
+		const d2 = (p[0] - qx) ** 2 + (p[1] - qy) ** 2;
+		if (d2 < best.d2) best = {
+			d2,
+			q: [qx, qy]
+		};
+	}
+	return best;
+}
+var inBox = ([x, y], b, g) => x >= b[0] - g && x <= b[2] + g && y >= b[1] - g && y <= b[3] + g;
+function snapEnds(items, stroke) {
+	const shapes = items.map((it) => {
+		if (dotSize(it)) return null;
+		const subs = segments(it.d).map((sub) => {
+			const pts = sub.segs.flatMap((s) => samples(s, 48));
+			return {
+				pts,
+				b: pts.reduce((b, [x, y]) => [
+					Math.min(b[0], x),
+					Math.min(b[1], y),
+					Math.max(b[2], x),
+					Math.max(b[3], y)
+				], [
+					Infinity,
+					Infinity,
+					-Infinity,
+					-Infinity
+				])
+			};
+		});
+		return {
+			w: widthOf(it, stroke),
+			subs
+		};
+	});
+	return items.map((it, i) => {
+		if (!shapes[i]) return it;
+		const cmds = parse(it.d, true);
+		const starts = cmds.flatMap(([t], k) => t === "M" ? [k] : []);
+		let moved = false;
+		starts.forEach((m, k) => {
+			const last = (starts[k + 1] ?? cmds.length) - 1;
+			if (last <= m || cmds[last][0] === "Z") return;
+			const end = cmds[last][1].slice(-2);
+			const start = cmds[m][1];
+			if (Math.hypot(end[0] - start[0], end[1] - start[1]) < .01) return;
+			const snap = (p) => {
+				let best = {
+					d2: Infinity,
+					q: null,
+					w: 0
+				};
+				shapes.forEach((sh, j) => sh?.subs.forEach(({ pts, b }, n) => {
+					if (j === i && n === k || !inBox(p, b, (shapes[i].w + sh.w) / 2)) return;
+					const r = nearestOn(p, pts);
+					if (r.d2 < best.d2) best = {
+						d2: r.d2,
+						q: r.q,
+						w: sh.w
+					};
+				}));
+				const d = Math.sqrt(best.d2);
+				if (!(d > .01 && d < (shapes[i].w + best.w) / 2 - .02)) return null;
+				return nearestOn(best.q, shapes[i].subs[k].pts).d2 < .0025 ? null : best.q;
+			};
+			const q0 = snap(start);
+			if (q0) {
+				const [dx, dy] = [q0[0] - start[0], q0[1] - start[1]];
+				cmds[m][1] = q0;
+				const next = cmds[m + 1];
+				if (next[0] === "C" || next[0] === "Q") next[1] = next[1].map((v, n) => n < 2 ? v + (n ? dy : dx) : v);
+				moved = true;
+			}
+			const q1 = snap(end);
+			if (q1) {
+				const [dx, dy] = [q1[0] - end[0], q1[1] - end[1]];
+				const [t, a] = cmds[last];
+				const ctrl = t === "C" ? [2, 3] : t === "Q" ? [0, 1] : [];
+				cmds[last][1] = a.map((v, n) => n >= a.length - 2 ? n === a.length - 2 ? q1[0] : q1[1] : ctrl.includes(n) ? v + (n % 2 ? dy : dx) : v);
+				moved = true;
+			}
+		});
+		return moved ? {
+			...it,
+			d: cmds.map(([t, a]) => t + a.join(" ")).join("")
+		} : it;
+	});
+}
+var TIP_MAX_TURN = Math.PI * 5 / 6;
+function cornersOf(d) {
+	const out = [];
+	for (const sub of segments(d)) {
+		const segs = sub.segs.filter((s) => samples(s, 1).length > 1);
+		const dir = (s, t) => {
+			const [a, b] = t ? [s.at(Math.max(0, t - .01)), s.at(t)] : [s.at(0), s.at(.01)];
+			const l = Math.hypot(b[0] - a[0], b[1] - a[1]) || 1;
+			return [(b[0] - a[0]) / l, (b[1] - a[1]) / l];
+		};
+		const n = segs.length;
+		const seg = (j) => sub.closed ? segs[j % n] : segs[j];
+		for (let i = 0; i < (sub.closed ? n : n - 1); i++) {
+			let [a, c, k] = [
+				seg(i),
+				seg(i + 1),
+				i + 1
+			];
+			if (!c) continue;
+			if (c.kind === "curve" && seg(i + 2)?.kind === "line") {
+				const [p, q] = [c.at(0), c.at(1)];
+				if (Math.hypot(q[0] - p[0], q[1] - p[1]) < 1.5) [c, k] = [seg(i + 2), i + 2];
+			}
+			if (a.kind !== "line" || c.kind !== "line") continue;
+			const [u, v] = [dir(a, 1), dir(c, 0)];
+			const turn = Math.acos(Math.max(-1, Math.min(1, u[0] * v[0] + u[1] * v[1])));
+			if (turn < Math.PI / 3 || turn > TIP_MAX_TURN + .2) continue;
+			const [p, q] = [a.at(1), c.at(0)];
+			const den = u[0] * v[1] - u[1] * v[0];
+			const s = ((q[0] - p[0]) * v[1] - (q[1] - p[1]) * v[0]) / den;
+			const vtx = [p[0] + u[0] * s, p[1] + u[1] * s];
+			const b = [v[0] - u[0], v[1] - u[1]];
+			const bl = Math.hypot(b[0], b[1]);
+			out.push({
+				vtx,
+				bisector: [b[0] / bl, b[1] / bl],
+				half: (Math.PI - turn) / 2
+			});
+			i = k - 1;
+		}
+	}
+	return out;
+}
+function tuckTips(items, stroke) {
+	const corners = items.flatMap((it, owner) => dotSize(it) || it.fill ? [] : cornersOf(it.d).map((c) => ({
+		...c,
+		owner,
+		w: widthOf(it, stroke)
+	})));
+	if (!corners.length) return items;
+	return items.map((it, i) => {
+		if (dotSize(it) || it.fill) return it;
+		let changed = false;
+		const joins = /* @__PURE__ */ new Set();
+		const subs = segments(it.d).map((sub) => {
+			const segs = [...sub.segs];
+			let start = sub.start;
+			if (sub.closed || !segs.length) return {
+				start,
+				segs: segs.map((s) => s.sub(0, 1)),
+				closed: sub.closed
+			};
+			const out = segs.map((s) => s.sub(0, 1));
+			for (const end of [0, 1]) {
+				const seg = end ? segs.at(-1) : segs[0];
+				const p = seg.at(end);
+				const corner = corners.find((c) => {
+					if (Math.hypot(c.vtx[0] - p[0], c.vtx[1] - p[1]) > .75) return false;
+					const q = seg.at(end ? .9 : .1);
+					const back = [q[0] - p[0], q[1] - p[1]];
+					const bl = Math.hypot(back[0], back[1]) || 1;
+					return (back[0] * c.bisector[0] + back[1] * c.bisector[1]) / bl > Math.cos(c.half);
+				});
+				if (!corner) continue;
+				const L = corner.w / 2 / Math.sin(corner.half);
+				const dist = (t) => Math.hypot(seg.at(t)[0] - corner.vtx[0], seg.at(t)[1] - corner.vtx[1]);
+				if (dist(end ? 0 : 1) <= L) continue;
+				let [lo, hi] = [0, 1];
+				for (let n = 0; n < 30; n++) {
+					const m = (lo + hi) / 2;
+					if (end ? dist(m) > L : dist(m) < L) lo = m;
+					else hi = m;
+				}
+				const t = end ? lo : hi;
+				if (end) out[out.length - 1] = seg.sub(0, t);
+				else {
+					start = seg.at(t);
+					out[0] = seg.sub(t, 1);
+				}
+				changed = true;
+				joins.add(corner.owner);
+			}
+			return {
+				start,
+				segs: out,
+				closed: false
+			};
+		});
+		if (!changed) return it;
+		const fmt = (n) => Math.round(n * 1e3) / 1e3;
+		const d = subs.map((s) => `M${fmt(s.start[0])} ${fmt(s.start[1])}${s.segs.join("")}${s.closed ? "Z" : ""}`).join("");
+		return {
+			...it,
+			d,
+			joins: [...it.joins ?? [], ...joins]
+		};
+	});
+}
+var CROWD_STROKE = 2;
+var MIN_GAP = .75;
+var RELIEF_MIN = 1.5;
+function segDist2(p, a, b) {
+	const [dx, dy] = [b[0] - a[0], b[1] - a[1]];
+	const len2 = dx * dx + dy * dy;
+	const t = len2 ? Math.max(0, Math.min(1, ((p[0] - a[0]) * dx + (p[1] - a[1]) * dy) / len2)) : 0;
+	return (p[0] - a[0] - dx * t) ** 2 + (p[1] - a[1] - dy * t) ** 2;
+}
+var cross = (o, a, b) => (a[0] - o[0]) * (b[1] - o[1]) - (a[1] - o[1]) * (b[0] - o[0]);
+var intersects = (a, b, c, d) => cross(a, b, c) * cross(a, b, d) < 0 && cross(c, d, a) * cross(c, d, b) < 0;
+function polyDist(p, q) {
+	let best = Infinity;
+	for (let i = 0; i < p.length; i++) for (let j = 0; j < q.length; j++) {
+		best = Math.min(best, segDist2(p[i], q[j], q[j + 1] ?? q[j]), segDist2(q[j], p[i], p[i + 1] ?? p[i]));
+		if (p[i + 1] && q[j + 1] && intersects(p[i], p[i + 1], q[j], q[j + 1])) return 0;
+		if (best < .0025) return Math.sqrt(best);
+	}
+	return Math.sqrt(best);
+}
+function relieve(items, stroke) {
+	if (stroke < CROWD_STROKE) return items;
+	const parts = items.flatMap((it, owner) => {
+		const dot = dotSize(it);
+		if (dot || it.fill) return [{
+			it,
+			owner,
+			d: it.d,
+			fixed: true,
+			w: dot ? dotWidth(it, stroke) : widthOf(it, stroke),
+			pts: segments(it.d).flatMap((s) => s.segs.flatMap((g) => samples(g, dot ? 1 : 16)))
+		}];
+		const cmds = parse(it.d, true);
+		const starts = cmds.flatMap(([t], k) => t === "M" ? [k] : []);
+		const subs = segments(it.d);
+		return starts.map((m, k) => {
+			const pts = subs[k].segs.flatMap((g) => samples(g, 16));
+			const len = pts.reduce((n, p, i) => n + (i ? Math.hypot(p[0] - pts[i - 1][0], p[1] - pts[i - 1][1]) : 0), 0);
+			return {
+				it,
+				owner,
+				d: cmds.slice(m, starts[k + 1] ?? cmds.length).map(([t, a]) => t + a.join(" ")).join(""),
+				w: widthOf(it, stroke),
+				pts,
+				len
+			};
+		});
+	});
+	const boxes = parts.map((p) => p.pts.reduce((b, [x, y]) => [
+		Math.min(b[0], x),
+		Math.min(b[1], y),
+		Math.max(b[2], x),
+		Math.max(b[3], y)
+	], [
+		Infinity,
+		Infinity,
+		-Infinity,
+		-Infinity
+	]));
+	const caps = /* @__PURE__ */ new Map();
+	const limit = (i, w) => caps.set(i, Math.min(caps.get(i) ?? Infinity, Math.max(RELIEF_MIN, Math.floor(w * 4) / 4)));
+	for (let i = 0; i < parts.length; i++) for (let j = i + 1; j < parts.length; j++) {
+		const [a, b] = [parts[i], parts[j]];
+		if (a.fixed && b.fixed) continue;
+		const reach = (a.w + b.w) / 2 + MIN_GAP;
+		const [p, q] = [boxes[i], boxes[j]];
+		if (p[0] - reach > q[2] || q[0] - reach > p[2] || p[1] - reach > q[3] || q[1] - reach > p[3]) continue;
+		if (a.it.joins?.includes(b.owner) || b.it.joins?.includes(a.owner)) continue;
+		const d = polyDist(a.pts, b.pts);
+		if (d < .05 || d >= reach) continue;
+		const [short, long] = a.fixed ? [j, i] : b.fixed ? [i, j] : a.len <= b.len ? [i, j] : [j, i];
+		if (!parts[long].fixed && parts[short].len >= parts[long].len * .8) {
+			limit(short, d - MIN_GAP);
+			limit(long, d - MIN_GAP);
+		} else limit(short, 2 * (d - MIN_GAP) - parts[long].w);
+	}
+	if (![...caps.values()].some((w) => w < stroke)) return items;
+	return parts.map((p, i) => caps.get(i) < p.w ? {
+		...p.it,
+		d: p.d,
+		relief: caps.get(i)
+	} : {
+		...p.it,
+		d: p.d
+	});
+}
+var toneOf = (item) => item.tone ?? "primary";
+var absolute = (d) => parse(d).map(([t, a]) => t + join(a)).join("");
+function finalize(paths, stroke, { animated = false } = {}) {
+	const items = paths.map((p) => typeof p === "string" ? { d: p } : p);
+	const cuts = /* @__PURE__ */ new Map();
+	for (const p of items.filter((p) => p.cut)) {
+		const g = p.gap ?? 1;
+		const group = cuts.get(g) ?? {
+			ds: [],
+			occluders: []
+		};
+		group.ds.push(p.d);
+		if (p.occlude) group.occluders.push(p.d);
+		cuts.set(g, group);
+	}
+	const cutAll = (d) => [...cuts].reduce((acc, [g, { ds, occluders }]) => acc ? clip(acc, ds, g + stroke, occluders) : acc, d);
+	const clipped = items.map((p) => cuts.size && !p.cut ? {
+		...p,
+		d: cutAll(p.d)
+	} : p).filter((p) => p.d && !p.hidden);
+	const groups = /* @__PURE__ */ new Map();
+	const snapped = tuckTips(snapEnds(clipped, stroke), stroke);
+	for (const item of animated ? snapped : relieve(snapped, stroke)) {
+		const dot = dotSize(item);
+		const tone = toneOf(item);
+		const key = [
+			Boolean(item.detail),
+			Boolean(item.fill),
+			dot,
+			Boolean(item.thin),
+			item.relief ?? 0,
+			tone
+		].join();
+		const g = groups.get(key);
+		if (g) g.d += item.d;
+		else {
+			const w = widthOf(item, stroke);
+			groups.set(key, {
+				d: item.d,
+				detail: !!item.detail,
+				fill: !!item.fill,
+				dot,
+				thin: !!item.thin,
+				tone,
+				width: dot ? dotWidth(item, stroke) : w !== stroke ? w : void 0
+			});
+		}
+	}
+	return [...groups.values()].map((g) => ({
+		...g,
+		d: animated ? absolute(g.d) : minify(g.d)
+	}));
+}
+//#endregion
+export { DETAIL_STROKE, DOT_STROKE, THIN, axisLines, finalize, minify, parse };