@rinzai/zen 0.6.1 → 0.7.1

package/dist/utils/theme-wave.js

@@ -0,0 +1,239 @@
+"use client";
+import { applyGraphicsMode as e } from "./graphics.js";
+import { oklchToLinearRgb as t } from "./theme.js";
+//#region packages/utils/theme-wave.ts
+var n = 1330, r = [
+	.25,
+	.55,
+	.35,
+	1
+], i = 1050, a = [
+	.55,
+	0,
+	.85,
+	.35
+], o = .05, s = 36, c = [
+	[
+		3,
+		1.9,
+		.5
+	],
+	[
+		5,
+		-2.7,
+		.3
+	],
+	[
+		8,
+		4.1,
+		.2
+	]
+], l = 48, u = 72, d = 28, f = "zen-theme-waving", p = "zen-theme-closing", m = "zen-theme-water", h = "zen-theme-area", g = 0, _ = null;
+function v() {
+	_ && (_.style.viewTransitionName = _.name), _ = null;
+}
+function y(e, t, n) {
+	let r = Math.min(1, Math.max(0, (n - e) / (t - e)));
+	return r * r * (3 - 2 * r);
+}
+function b([e, t, n, r], i) {
+	let a = (e, t, n) => 3 * e * n * (1 - n) ** 2 + 3 * t * n ** 2 * (1 - n) + n ** 3, o = 0, s = 1;
+	for (let t = 0; t < 24; t++) {
+		let t = (o + s) / 2;
+		a(e, n, t) < i ? o = t : s = t;
+	}
+	return a(t, r, (o + s) / 2);
+}
+function x(e, t, n, r) {
+	return Math.min(s, o * t) * c.reduce((t, [i, a, o], s) => t + o * Math.sin(i * e + a * n + r * (s + 1)), 0);
+}
+var S = `
+precision highp float;
+uniform vec2 res;
+uniform float dpr;
+uniform vec2 from;
+uniform float time;
+uniform float seed;
+uniform float strength;
+// 1 while the edge spreads out, -1 while it closes in.
+uniform float dir;
+uniform float edge;
+uniform float prism;
+uniform vec3 aurora[3];
+uniform float light;
+
+float wobble(float a, float r) {
+    float size = min(${s.toFixed(1)}, ${o.toFixed(3)} * r);
+    return size * (${c.map(([e, t, n], r) => `${n.toFixed(2)} * sin(${e.toFixed(1)} * a + ${t.toFixed(2)} * time + seed * ${(r + 1).toFixed(1)})`).join(" + ")});
+}
+
+// A train of ripples whose front is x px away (ahead of it when positive, as it moves):
+// a steep front, crests fading out behind it, and running outwards through
+// the train faster than it spreads, as on water. Its slope (height per px of x): the
+// ripples are a fixed size, as real ones are, however big the water.
+float rippleSlope(float x) {
+    float k = 6.2832 / ${d.toFixed(1)};
+    float reach = x < 0.0 ? ${(2.5 * d).toFixed(1)} : ${(.35 * d).toFixed(1)};
+    float phase = k * x - 7.0 * time;
+    return exp(-x * x / (2.0 * reach * reach)) * (-x / (reach * reach) * cos(phase) / k - sin(phase));
+}
+
+// Light from the top left. A glint off a surface of this slope, bent a little
+// more or less for each colour, so glints split into a rainbow at their edges.
+const vec3 LIGHT = vec3(-0.45, -0.55, 0.7);
+float glint(vec2 slope, float bend) {
+    vec3 n = normalize(vec3(-slope * bend, 1.0));
+    vec3 mid = normalize(normalize(LIGHT) + vec3(0.0, 0.0, 1.0));
+    return max(0.0, pow(max(dot(n, mid), 0.0), 40.0) - pow(mid.z, 40.0));
+}
+
+void main() {
+    vec2 p = vec2(gl_FragCoord.x, res.y - gl_FragCoord.y) / dpr;
+    vec2 v = p - from;
+    float a = atan(v.y, v.x);
+    // How far from the edge (outside it when positive).
+    float e = length(v) - edge - wobble(a, edge);
+    // The ripples' slope: across their rings, outwards.
+    vec2 slope = 0.9 * strength * dir * rippleSlope(dir * e) * v / max(length(v), 0.001);
+
+    // Aurora: the glow colours, drifting round the circle.
+    float hue = fract(a / 6.2832 + 0.15 * time + length(v) * 0.0008) * 3.0;
+    vec3 tint = hue < 1.0 ? mix(aurora[0], aurora[1], hue)
+        : hue < 2.0 ? mix(aurora[1], aurora[2], hue - 1.0)
+        : mix(aurora[2], aurora[0], hue - 2.0);
+
+    // Iridescence, as on a soap film: the colour turns with the film's thickness,
+    // which swells and thins round the ring and over time, slowly, and in soft
+    // colours: nothing flickers, or flashes saturated colour (photosensitivity).
+    float film = 0.02 * e + 0.35 * sin(2.0 * a + 0.6 * time + seed) + 0.25 * sin(5.0 * a - 0.9 * time) + 0.25 * time;
+    vec3 sheen = mix(mix(tint, 0.5 + 0.5 * cos(6.2832 * (film + vec3(0.0, 0.33, 0.67))), 0.5), vec3(1.0), 0.2);
+
+    vec3 spark = vec3(glint(slope, 0.8), glint(slope, 1.0), glint(slope, 1.2));
+    // Slopes facing the light are lit, the others shaded.
+    float facing = dot(normalize(vec3(-slope, 1.0)), normalize(LIGHT)) - normalize(LIGHT).z;
+    vec3 color = 1.6 * spark * mix(vec3(1.0), mix(tint, sheen, 0.6), mix(0.4, 0.85, light)) + 0.6 * max(facing, 0.0) * tint;
+    float shade = mix(0.7, 0.45, light) * max(-facing, 0.0);
+
+    // The edge: a band of sheen with a bright core, and the aurora trailing behind.
+    color += prism * (0.9 * sheen * exp(-e * e / 160.0) + 0.5 * exp(-e * e / 6.0));
+    color += prism * 0.45 * tint * exp(-(e + 28.0 * dir) * (e + 28.0 * dir) / 1800.0);
+
+    color = clamp(color, 0.0, 1.0);
+    float cover = max(color.r, max(color.g, color.b));
+    gl_FragColor = vec4(color, cover + shade * (1.0 - cover));
+}`, C = "attribute vec2 at; void main() { gl_Position = vec4(at, 0.0, 1.0); }", w;
+function T() {
+	if (w !== void 0) return w;
+	w = null;
+	let e = document.createElement("canvas");
+	e.setAttribute("aria-hidden", "true"), e.style.cssText = `position:fixed;pointer-events:none;z-index:2147483647;view-transition-name:${m}`;
+	let t = e.getContext("webgl", {
+		premultipliedAlpha: !0,
+		antialias: !1
+	}), n = t?.createProgram();
+	if (!t || !n) return null;
+	for (let [e, r] of [[t.VERTEX_SHADER, C], [t.FRAGMENT_SHADER, S]]) {
+		let i = t.createShader(e);
+		if (!i) return null;
+		t.shaderSource(i, r), t.compileShader(i), t.attachShader(n, i);
+	}
+	if (t.bindAttribLocation(n, 0, "at"), t.linkProgram(n), !t.getProgramParameter(n, t.LINK_STATUS)) return null;
+	t.useProgram(n), t.bindBuffer(t.ARRAY_BUFFER, t.createBuffer()), t.bufferData(t.ARRAY_BUFFER, new Float32Array([
+		-1,
+		-1,
+		3,
+		-1,
+		-1,
+		3
+	]), t.STATIC_DRAW), t.enableVertexAttribArray(0), t.vertexAttribPointer(0, 2, t.FLOAT, !1, 0, 0);
+	let r = /* @__PURE__ */ new Map();
+	return w = {
+		canvas: e,
+		gl: t,
+		uniform: (e) => (r.has(e) || r.set(e, t.getUniformLocation(n, e)), r.get(e))
+	}, w;
+}
+function E(e) {
+	e.gl.clear(e.gl.COLOR_BUFFER_BIT), e.canvas.remove();
+}
+function D(e) {
+	return t(e).map((e) => e <= .0031308 ? 12.92 * e : 1.055 * e ** (1 / 2.4) - .055);
+}
+function O() {
+	return !(window.matchMedia?.("(prefers-reduced-motion: reduce)").matches || document.documentElement.classList.contains("reduce-motion")) && !!document.startViewTransition && e() !== "lite";
+}
+function k() {
+	if (w !== void 0 || !O()) return;
+	let e = T();
+	e?.gl.drawArrays(e.gl.TRIANGLES, 0, 3);
+}
+function A(e, t, o) {
+	let c = document.documentElement, d = !!o && o !== c, m = window.innerWidth, S = window.innerHeight, C = d ? o.getBoundingClientRect() : new DOMRect(0, 0, m, S), w = Math.max(0, C.left), k = Math.max(0, C.top), A = Math.min(m, C.right), j = Math.min(S, C.bottom), M = O() && A > w && j > k ? T() : null;
+	if (!M) {
+		e();
+		return;
+	}
+	let N = (w + A) / 2, P = (k + j) / 2;
+	if (t instanceof Element) {
+		let e = t.getBoundingClientRect();
+		N = e.left + e.width / 2, P = e.top + e.height / 2;
+	} else t && ({x: N, y: P} = t);
+	let F = Math.hypot(Math.max(N - C.left, C.right - N), Math.max(P - C.top, C.bottom - P)), I = Math.random() * 2 * Math.PI, L = F + s + 2, R = ++g;
+	E(M), v(), c.classList.add(f);
+	let z = d ? h : "root";
+	if (d) {
+		let { style: e } = o;
+		_ = {
+			style: e,
+			name: e.viewTransitionName
+		}, e.viewTransitionName = h;
+	}
+	Object.assign(M.canvas.style, {
+		left: `${w}px`,
+		top: `${k}px`,
+		width: `${A - w}px`,
+		height: `${j - k}px`,
+		clipPath: d ? `inset(${C.top - k}px ${A - C.right}px ${j - C.bottom}px ${C.left - w}px round ${getComputedStyle(o).borderRadius})` : ""
+	});
+	let B = [], V = !1, H = document.startViewTransition(() => {
+		e();
+		let t = getComputedStyle(d ? o : c);
+		V = Number(t.getPropertyValue("--background").trim().split(" ")[0]) <= .5, c.classList.toggle(p, V);
+		let n = t.getPropertyValue("--glow").trim(), [r, i, a] = n.split(" ").map(Number);
+		B = [
+			n,
+			t.getPropertyValue("--glow-2").trim(),
+			`${r} ${i} ${(a + 240) % 360}`
+		].flatMap(D), document.body.append(M.canvas);
+	});
+	H.ready.then(() => {
+		let e = V ? i : n, t = (e) => (V ? 1 - b(a, e) : b(r, e)) * L, o = `::view-transition-${V ? "old" : "new"}(${z})`, s = (n) => {
+			let r = t(n), i = n * e / 1e3;
+			return `polygon(${Array.from({ length: u }, (e, t) => {
+				let n = t / u * 2 * Math.PI, a = Math.max(0, r + x(n, r, i, I));
+				return `${(N - C.left + a * Math.cos(n)).toFixed(1)}px ${(P - C.top + a * Math.sin(n)).toFixed(1)}px`;
+			}).join(",")})`;
+		}, d = Array.from({ length: 49 }, (e, t) => ({
+			clipPath: s(t / l),
+			offset: t / l
+		})), f = c.animate(d, {
+			duration: e,
+			pseudoElement: o,
+			fill: "forwards"
+		});
+		H.finished.finally(() => f.cancel());
+		let { canvas: p, gl: m, uniform: h } = M, _ = Math.min(window.devicePixelRatio || 1, 2);
+		p.width = Math.round((A - w) * _), p.height = Math.round((j - k) * _), m.viewport(0, 0, p.width, p.height), m.uniform2f(h("res"), p.width, p.height), m.uniform1f(h("dpr"), _), m.uniform2f(h("from"), N - w, P - k), m.uniform1f(h("seed"), I), m.uniform3fv(h("aurora[0]"), B), m.uniform1f(h("light"), +!V);
+		let v = (e) => 1.6 * y(.05, .45, e) * (1 - e) ** 1.5, S = () => {
+			if (R !== g) return;
+			if (f.playState === "finished") return E(M);
+			let n = Math.min(1, Number(f.currentTime ?? 0) / e), r = t(n), i = Math.min(1, (1 - n) / .12), a, o;
+			V ? (a = 1.6 * n * Math.sqrt(1 - n) * i, o = Math.min(1, n * 4) * Math.min(1, r / 24) * i) : (a = v(n) * i, o = Math.min(1, r / 40) * (1 - n ** 3) * i), m.uniform1f(h("time"), n * e / 1e3), m.uniform1f(h("edge"), r), m.uniform1f(h("dir"), V ? -1 : 1), m.uniform1f(h("strength"), a), m.uniform1f(h("prism"), o), m.drawArrays(m.TRIANGLES, 0, 3), requestAnimationFrame(S);
+		};
+		S();
+	}).catch(() => {}), H.finished.finally(() => {
+		R === g && (v(), c.classList.remove(f, p), E(M));
+	});
+}
+//#endregion
+export { k as prepareThemeWave, A as themeWave };

package/dist/utils/typeahead.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Type to jump, as in a native list: keys typed quickly in a row search
+ * together. Returns what's been typed so far (lower case) when the key is a
+ * letter or digit, else null; match it against the start of each item's label.
+ */
+export declare function useTypeahead(): (e: {
+    key: string;
+    ctrlKey: boolean;
+    metaKey: boolean;
+    altKey: boolean;
+}) => string | null;
+//# sourceMappingURL=typeahead.d.ts.map

package/dist/utils/typeahead.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typeahead.d.ts","sourceRoot":"","sources":["../../packages/utils/typeahead.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wBAAgB,YAAY,IAAI,CAAC,CAAC,EAAE;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;CACnB,KAAK,MAAM,GAAG,IAAI,CASlB"}

package/dist/utils/typeahead.js

@@ -0,0 +1,19 @@
+"use client";
+import { useRef as e } from "react";
+//#region packages/utils/typeahead.ts
+function t() {
+	let t = e({
+		text: "",
+		at: 0
+	});
+	return (e) => {
+		if (e.key.length !== 1 || e.ctrlKey || e.metaKey || e.altKey) return null;
+		let n = Date.now(), r = (n - t.current.at < 700 ? t.current.text : "") + e.key.toLowerCase();
+		return t.current = {
+			text: r,
+			at: n
+		}, r;
+	};
+}
+//#endregion
+export { t as useTypeahead };