@jinmi/ui 0.0.0-stage → 6.0.1

package/es/awesome/Features/style.mjs

@@ -0,0 +1,158 @@
+import { createStaticStyles } from "antd-style";
+//#region src/awesome/Features/style.ts
+const prefixCls = "ant";
+const styles = createStaticStyles(({ css, cssVar }) => {
+	const prefix = `${prefixCls}-features`;
+	const coverCls = `${prefix}-cover`;
+	const descCls = `${prefix}-description`;
+	const titleCls = `${prefix}-title`;
+	const imgCls = `${prefix}-img`;
+	const scaleUnit = 20;
+	const genSize = (size) => css`
+    width: ${size}px;
+    height: ${size}px;
+    font-size: ${size * (22 / 24)}px;
+  `;
+	const withTransition = css`
+    transition: all ${cssVar.motionDurationSlow} ${cssVar.motionEaseInOutCirc};
+  `;
+	return {
+		cell: css`
+      overflow: hidden;
+    `,
+		container: css`
+      ${withTransition}
+      position: relative;
+      z-index: 1;
+
+      overflow: hidden;
+
+      height: 228px;
+      max-height: 228px;
+      padding: 24px;
+
+      p {
+        font-size: 16px;
+        line-height: 1.2;
+        text-align: start;
+        word-break: break-word;
+      }
+
+      &:hover {
+        .${coverCls} {
+          width: 100%;
+          height: calc(var(--features-row-num, 7) * ${scaleUnit}px);
+          padding: 0;
+          background: ${cssVar.colorFillContent};
+        }
+
+        .${imgCls} {
+          ${genSize(100)};
+        }
+
+        .${descCls} {
+          position: absolute;
+          visibility: hidden;
+          opacity: 0;
+        }
+
+        .${titleCls} {
+          font-size: var(--features-title-hover-size, 20px);
+        }
+      }
+    `,
+		containerHasLink: css`
+      ${withTransition}
+      position: relative;
+      z-index: 1;
+
+      overflow: hidden;
+
+      height: 228px;
+      max-height: 228px;
+      padding: 24px;
+
+      p {
+        font-size: 16px;
+        line-height: 1.2;
+        text-align: start;
+        word-break: break-word;
+      }
+
+      &:hover {
+        .${coverCls} {
+          width: 100%;
+          height: calc(var(--features-row-num, 7) * ${scaleUnit}px);
+          padding: 0;
+          background: ${cssVar.colorFillContent};
+        }
+
+        .${imgCls} {
+          ${genSize(100)};
+        }
+
+        .${descCls} {
+          position: absolute;
+          visibility: hidden;
+          opacity: 0;
+        }
+
+        .${titleCls} {
+          font-size: 14px;
+        }
+      }
+    `,
+		desc: css`
+      ${descCls}
+      ${withTransition}
+      pointer-events: none;
+      color: ${cssVar.colorTextSecondary};
+
+      quotient {
+        position: relative;
+
+        display: block;
+
+        margin-block: 12px;
+        margin-inline: 0;
+        padding-inline-start: 12px;
+
+        color: ${cssVar.colorTextDescription};
+      }
+    `,
+		img: css`
+      ${imgCls}
+      ${withTransition}
+      ${genSize(20)};
+      color: ${cssVar.colorText};
+    `,
+		imgContainer: css`
+      ${coverCls}
+      ${withTransition}
+      ${genSize(24)};
+      padding: 4px;
+      opacity: 0.8;
+      border-radius: ${cssVar.borderRadius};
+    `,
+		link: css`
+      ${withTransition};
+      margin-block-start: 24px;
+    `,
+		title: css`
+      ${titleCls}
+      ${withTransition}
+      pointer-events: none;
+
+      margin-block: 16px;
+      margin-inline: 0;
+
+      font-size: 20px;
+      line-height: ${cssVar.lineHeightHeading3};
+      color: ${cssVar.colorText};
+    `
+	};
+});
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/awesome/Features/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/Features/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nconst prefixCls = 'ant';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => {\r\n  const prefix = `${prefixCls}-features`;\r\n  const coverCls = `${prefix}-cover`;\r\n  const descCls = `${prefix}-description`;\r\n  const titleCls = `${prefix}-title`;\r\n  const imgCls = `${prefix}-img`;\r\n\r\n  const scaleUnit = 20;\r\n\r\n  const genSize = (size: number) => css`\r\n    width: ${size}px;\r\n    height: ${size}px;\r\n    font-size: ${size * (22 / 24)}px;\r\n  `;\r\n\r\n  const withTransition = css`\r\n    transition: all ${cssVar.motionDurationSlow} ${cssVar.motionEaseInOutCirc};\r\n  `;\r\n\r\n  return {\r\n    cell: css`\r\n      overflow: hidden;\r\n    `,\r\n\r\n    container: css`\r\n      ${withTransition}\r\n      position: relative;\r\n      z-index: 1;\r\n\r\n      overflow: hidden;\r\n\r\n      height: 228px;\r\n      max-height: 228px;\r\n      padding: 24px;\r\n\r\n      p {\r\n        font-size: 16px;\r\n        line-height: 1.2;\r\n        text-align: start;\r\n        word-break: break-word;\r\n      }\r\n\r\n      &:hover {\r\n        .${coverCls} {\r\n          width: 100%;\r\n          height: calc(var(--features-row-num, 7) * ${scaleUnit}px);\r\n          padding: 0;\r\n          background: ${cssVar.colorFillContent};\r\n        }\r\n\r\n        .${imgCls} {\r\n          ${genSize(100)};\r\n        }\r\n\r\n        .${descCls} {\r\n          position: absolute;\r\n          visibility: hidden;\r\n          opacity: 0;\r\n        }\r\n\r\n        .${titleCls} {\r\n          font-size: var(--features-title-hover-size, 20px);\r\n        }\r\n      }\r\n    `,\r\n\r\n    containerHasLink: css`\r\n      ${withTransition}\r\n      position: relative;\r\n      z-index: 1;\r\n\r\n      overflow: hidden;\r\n\r\n      height: 228px;\r\n      max-height: 228px;\r\n      padding: 24px;\r\n\r\n      p {\r\n        font-size: 16px;\r\n        line-height: 1.2;\r\n        text-align: start;\r\n        word-break: break-word;\r\n      }\r\n\r\n      &:hover {\r\n        .${coverCls} {\r\n          width: 100%;\r\n          height: calc(var(--features-row-num, 7) * ${scaleUnit}px);\r\n          padding: 0;\r\n          background: ${cssVar.colorFillContent};\r\n        }\r\n\r\n        .${imgCls} {\r\n          ${genSize(100)};\r\n        }\r\n\r\n        .${descCls} {\r\n          position: absolute;\r\n          visibility: hidden;\r\n          opacity: 0;\r\n        }\r\n\r\n        .${titleCls} {\r\n          font-size: 14px;\r\n        }\r\n      }\r\n    `,\r\n    desc: css`\r\n      ${descCls}\r\n      ${withTransition}\r\n      pointer-events: none;\r\n      color: ${cssVar.colorTextSecondary};\r\n\r\n      quotient {\r\n        position: relative;\r\n\r\n        display: block;\r\n\r\n        margin-block: 12px;\r\n        margin-inline: 0;\r\n        padding-inline-start: 12px;\r\n\r\n        color: ${cssVar.colorTextDescription};\r\n      }\r\n    `,\r\n    img: css`\r\n      ${imgCls}\r\n      ${withTransition}\r\n      ${genSize(20)};\r\n      color: ${cssVar.colorText};\r\n    `,\r\n\r\n    imgContainer: css`\r\n      ${coverCls}\r\n      ${withTransition}\r\n      ${genSize(24)};\r\n      padding: 4px;\r\n      opacity: 0.8;\r\n      border-radius: ${cssVar.borderRadius};\r\n    `,\r\n\r\n    link: css`\r\n      ${withTransition};\r\n      margin-block-start: 24px;\r\n    `,\r\n\r\n    title: css`\r\n      ${titleCls}\r\n      ${withTransition}\r\n      pointer-events: none;\r\n\r\n      margin-block: 16px;\r\n      margin-inline: 0;\r\n\r\n      font-size: 20px;\r\n      line-height: ${cssVar.lineHeightHeading3};\r\n      color: ${cssVar.colorText};\r\n    `,\r\n  };\r\n});\r\n"],"mappings":";;AAEA,MAAM,YAAY;AAElB,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,MAAM,SAAS,GAAG,UAAU;CAC5B,MAAM,WAAW,GAAG,OAAO;CAC3B,MAAM,UAAU,GAAG,OAAO;CAC1B,MAAM,WAAW,GAAG,OAAO;CAC3B,MAAM,SAAS,GAAG,OAAO;CAEzB,MAAM,YAAY;CAElB,MAAM,WAAW,SAAiB,GAAG;aAC1B,KAAK;cACJ,KAAK;iBACF,QAAQ,KAAK,IAAI;;CAGhC,MAAM,iBAAiB,GAAG;sBACN,OAAO,mBAAmB,GAAG,OAAO,oBAAoB;;CAG5E,OAAO;EACL,MAAM,GAAG;;;EAIT,WAAW,GAAG;QACV,eAAe;;;;;;;;;;;;;;;;;;WAkBZ,SAAS;;sDAEkC,UAAU;;wBAExC,OAAO,iBAAiB;;;WAGrC,OAAO;YACN,QAAQ,GAAG,EAAE;;;WAGd,QAAQ;;;;;;WAMR,SAAS;;;;;EAMhB,kBAAkB,GAAG;QACjB,eAAe;;;;;;;;;;;;;;;;;;WAkBZ,SAAS;;sDAEkC,UAAU;;wBAExC,OAAO,iBAAiB;;;WAGrC,OAAO;YACN,QAAQ,GAAG,EAAE;;;WAGd,QAAQ;;;;;;WAMR,SAAS;;;;;EAKhB,MAAM,GAAG;QACL,QAAQ;QACR,eAAe;;eAER,OAAO,mBAAmB;;;;;;;;;;;iBAWxB,OAAO,qBAAqB;;;EAGzC,KAAK,GAAG;QACJ,OAAO;QACP,eAAe;QACf,QAAQ,EAAE,EAAE;eACL,OAAO,UAAU;;EAG5B,cAAc,GAAG;QACb,SAAS;QACT,eAAe;QACf,QAAQ,EAAE,EAAE;;;uBAGG,OAAO,aAAa;;EAGvC,MAAM,GAAG;QACL,eAAe;;;EAInB,OAAO,GAAG;QACN,SAAS;QACT,eAAe;;;;;;;qBAOF,OAAO,mBAAmB;eAChC,OAAO,UAAU;;CAE9B;AACF,CAAC"}

package/es/awesome/Features/type.d.mts

@@ -0,0 +1,31 @@
+import { DivProps } from "../../types/index.mjs";
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { SpotlightCardProps } from "../SpotlightCard/type.mjs";
+import "../SpotlightCard/index.mjs";
+import { CSSProperties } from "react";
+//#region src/awesome/Features/type.d.ts
+interface FeatureItemType {
+  column?: number;
+  description?: string;
+  hero?: boolean;
+  icon?: IconProps['icon'];
+  image?: string;
+  imageStyle?: CSSProperties;
+  imageType?: 'light' | 'primary' | 'soon';
+  link?: string;
+  openExternal?: boolean;
+  row?: number;
+  title: string;
+}
+interface FeaturesProps extends DivProps {
+  columns?: SpotlightCardProps['columns'];
+  gap?: SpotlightCardProps['gap'];
+  itemClassName?: string;
+  items: FeatureItemType[];
+  itemStyle?: CSSProperties;
+  maxWidth?: number;
+}
+//#endregion
+export { FeatureItemType, FeaturesProps };
+//# sourceMappingURL=type.d.mts.map

package/es/awesome/FluidGradient/FluidGradient.d.mts

@@ -0,0 +1,6 @@
+import { FluidGradientProps } from "./type.mjs";
+//#region src/awesome/FluidGradient/FluidGradient.d.ts
+declare const FluidGradient: import("react").NamedExoticComponent<FluidGradientProps>;
+//#endregion
+export { FluidGradient as default };
+//# sourceMappingURL=FluidGradient.d.mts.map

package/es/awesome/FluidGradient/FluidGradient.mjs

@@ -0,0 +1,293 @@
+"use client";
+import { LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT } from "../landingTokens.mjs";
+import { styles } from "./style.mjs";
+import { memo, useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/awesome/FluidGradient/FluidGradient.tsx
+const VERTEX_SHADER = `#version 300 es
+in vec2 aPos;
+void main() {
+  gl_Position = vec4(aPos, 0.0, 1.0);
+}`;
+const FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+
+uniform vec2 uRes;
+uniform float uTime;
+uniform vec3 uStopA;
+uniform vec3 uStopB;
+uniform vec3 uStopC;
+uniform float uIntensity;
+
+out vec4 fragColor;
+
+float hash(vec2 p) {
+  p = fract(p * vec2(234.34, 435.345));
+  p += dot(p, p + 34.23);
+  return fract(p.x * p.y);
+}
+
+float noise(vec2 p) {
+  vec2 i = floor(p);
+  vec2 f = fract(p);
+  vec2 u = f * f * (3.0 - 2.0 * f);
+  float a = hash(i);
+  float b = hash(i + vec2(1.0, 0.0));
+  float c = hash(i + vec2(0.0, 1.0));
+  float d = hash(i + vec2(1.0, 1.0));
+  return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);
+}
+
+float fbm(vec2 p) {
+  float value = 0.0;
+  float amplitude = 0.5;
+  for (int i = 0; i < 4; i++) {
+    value += amplitude * noise(p);
+    p = mat2(0.8, 0.6, -0.6, 0.8) * p * 2.0 + vec2(3.7, 1.3);
+    amplitude *= 0.5;
+  }
+  return value;
+}
+
+void main() {
+  vec2 uv = gl_FragCoord.xy / uRes;
+  vec2 p = vec2(uv.x * uRes.x / uRes.y, uv.y);
+
+  float t = uTime * 0.05;
+
+  vec2 q = vec2(fbm(p * 1.4 + t * 0.35), fbm(p * 1.4 - t * 0.28 + 5.2));
+  vec2 r = vec2(
+    fbm(p * 1.4 + 2.6 * q + vec2(1.7, 9.2) + t * 0.18),
+    fbm(p * 1.4 + 2.6 * q + vec2(8.3, 2.8) - t * 0.12)
+  );
+  float field = fbm(p * 1.4 + 2.6 * r);
+
+  vec3 color = mix(uStopA, uStopB, clamp(field * field * 2.4, 0.0, 1.0));
+  color = mix(color, uStopC, clamp(dot(q, vec2(0.7)) - 0.25, 0.0, 1.0));
+
+  float fade = smoothstep(0.02, 0.85, uv.y);
+  float alpha = fade * fade * uIntensity * smoothstep(0.14, 0.66, field);
+
+  fragColor = vec4(color * alpha, alpha);
+}`;
+const hexToRgb = (hex) => {
+	const value = hex.replace("#", "");
+	const full = value.length === 3 ? value.split("").map((char) => char + char).join("") : value.slice(0, 6);
+	const channel = (offset) => Number.parseInt(full.slice(offset, offset + 2), 16) / 255;
+	return [
+		channel(0),
+		channel(2),
+		channel(4)
+	];
+};
+const FluidGradient = memo(({ className, colors, intensity = .45, speed = 1, style, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const canvasRef = useRef(null);
+	const [ready, setReady] = useState(false);
+	const [canvasEpoch, setCanvasEpoch] = useState(0);
+	const palette = colors ?? (isDarkMode ? LANDING_PALETTE_DARK : LANDING_PALETTE_LIGHT);
+	const paletteRef = useRef({
+		colors: palette,
+		intensity
+	});
+	const speedRef = useRef(speed);
+	const repaintRef = useRef(void 0);
+	useEffect(() => {
+		paletteRef.current = {
+			colors: palette,
+			intensity
+		};
+		speedRef.current = speed;
+		repaintRef.current?.();
+	}, [
+		palette[0],
+		palette[1],
+		palette[2],
+		intensity,
+		speed
+	]);
+	useEffect(() => {
+		const canvas = canvasRef.current;
+		if (!canvas) return void 0;
+		const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)");
+		let frameId = 0;
+		let inView = true;
+		let readySent = false;
+		let drawFrame = null;
+		let refreshPalette = null;
+		let sizeAndDraw = null;
+		let destroyResources = null;
+		const buildResources = () => {
+			const gl = canvas.getContext("webgl2", {
+				alpha: true,
+				antialias: false,
+				depth: false,
+				stencil: false,
+				powerPreference: "low-power"
+			});
+			if (!gl) return false;
+			const compileShader = (type, source) => {
+				const shader = gl.createShader(type);
+				if (!shader) return null;
+				gl.shaderSource(shader, source);
+				gl.compileShader(shader);
+				if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+					gl.deleteShader(shader);
+					return null;
+				}
+				return shader;
+			};
+			const vertexShader = compileShader(gl.VERTEX_SHADER, VERTEX_SHADER);
+			const fragmentShader = compileShader(gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
+			if (!vertexShader || !fragmentShader) return false;
+			const program = gl.createProgram();
+			if (!program) return false;
+			gl.attachShader(program, vertexShader);
+			gl.attachShader(program, fragmentShader);
+			gl.linkProgram(program);
+			gl.deleteShader(vertexShader);
+			gl.deleteShader(fragmentShader);
+			if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+				gl.deleteProgram(program);
+				return false;
+			}
+			gl.useProgram(program);
+			const buffer = gl.createBuffer();
+			gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+			gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
+				-1,
+				-1,
+				3,
+				-1,
+				-1,
+				3
+			]), gl.STATIC_DRAW);
+			const position = gl.getAttribLocation(program, "aPos");
+			gl.enableVertexAttribArray(position);
+			gl.vertexAttribPointer(position, 2, gl.FLOAT, false, 0, 0);
+			const timeLocation = gl.getUniformLocation(program, "uTime");
+			const stopLocations = [
+				"uStopA",
+				"uStopB",
+				"uStopC"
+			].map((name) => gl.getUniformLocation(program, name));
+			const intensityLocation = gl.getUniformLocation(program, "uIntensity");
+			refreshPalette = () => {
+				const { colors: stops, intensity: peak } = paletteRef.current;
+				stops.map(hexToRgb).forEach((stop, index) => {
+					const location = stopLocations[index];
+					if (location) gl.uniform3f(location, stop[0], stop[1], stop[2]);
+				});
+				gl.uniform1f(intensityLocation, peak);
+			};
+			refreshPalette();
+			drawFrame = (seconds) => {
+				gl.uniform1f(timeLocation, seconds * speedRef.current);
+				gl.drawArrays(gl.TRIANGLES, 0, 3);
+				if (!readySent) {
+					readySent = true;
+					setReady(true);
+				}
+			};
+			sizeAndDraw = () => {
+				const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
+				const width = Math.max(1, Math.round(canvas.clientWidth * dpr));
+				const height = Math.max(1, Math.round(canvas.clientHeight * dpr));
+				if (canvas.width !== width || canvas.height !== height) {
+					canvas.width = width;
+					canvas.height = height;
+					gl.viewport(0, 0, width, height);
+				}
+				return canvas.clientWidth > 0 && drawFrame !== null;
+			};
+			destroyResources = (lose) => {
+				gl.deleteBuffer(buffer);
+				gl.deleteProgram(program);
+				drawFrame = null;
+				refreshPalette = null;
+				sizeAndDraw = null;
+				destroyResources = null;
+				if (lose) gl.getExtension("WEBGL_lose_context")?.loseContext();
+			};
+			return true;
+		};
+		if (!buildResources()) return void 0;
+		const renderOnce = () => {
+			if (!sizeAndDraw?.()) return;
+			drawFrame?.(performance.now() / 1e3);
+		};
+		const syncLoop = (milliseconds) => {
+			frameId = requestAnimationFrame(syncLoop);
+			if (sizeAndDraw?.()) drawFrame?.(milliseconds / 1e3);
+		};
+		const updateLoop = () => {
+			if (inView && !document.hidden && !reducedMotion.matches && drawFrame !== null) {
+				if (frameId === 0) frameId = requestAnimationFrame(syncLoop);
+				return;
+			}
+			if (frameId !== 0) {
+				cancelAnimationFrame(frameId);
+				frameId = 0;
+			}
+			if (!document.hidden) renderOnce();
+		};
+		const resizeObserver = new ResizeObserver(() => {
+			if (frameId === 0) renderOnce();
+		});
+		resizeObserver.observe(canvas);
+		const intersectionObserver = new IntersectionObserver(([entry]) => {
+			inView = entry.isIntersecting;
+			updateLoop();
+		});
+		intersectionObserver.observe(canvas);
+		const handleVisibilityChange = () => updateLoop();
+		document.addEventListener("visibilitychange", handleVisibilityChange);
+		const handleMotionPreferenceChange = () => updateLoop();
+		reducedMotion.addEventListener("change", handleMotionPreferenceChange);
+		repaintRef.current = () => {
+			refreshPalette?.();
+			if (frameId === 0) renderOnce();
+		};
+		const handleContextLost = (event) => {
+			event.preventDefault();
+			if (frameId !== 0) {
+				cancelAnimationFrame(frameId);
+				frameId = 0;
+			}
+			setCanvasEpoch((value) => value + 1);
+		};
+		canvas.addEventListener("webglcontextlost", handleContextLost);
+		updateLoop();
+		return () => {
+			if (frameId !== 0) cancelAnimationFrame(frameId);
+			frameId = 0;
+			resizeObserver.disconnect();
+			intersectionObserver.disconnect();
+			repaintRef.current = void 0;
+			document.removeEventListener("visibilitychange", handleVisibilityChange);
+			reducedMotion.removeEventListener("change", handleMotionPreferenceChange);
+			canvas.removeEventListener("webglcontextlost", handleContextLost);
+			if (!canvas.isConnected) destroyResources?.(true);
+			else destroyResources?.(false);
+		};
+	}, [canvasEpoch]);
+	return /* @__PURE__ */ jsx("div", {
+		"aria-hidden": true,
+		className: cx(styles.root, className),
+		"data-ready": ready ? "" : void 0,
+		style: {
+			"--fluid-stop-a": palette[0],
+			"--fluid-stop-b": palette[1],
+			"--fluid-stop-c": palette[2],
+			...style
+		},
+		...rest,
+		children: /* @__PURE__ */ jsx("canvas", { ref: canvasRef }, canvasEpoch)
+	});
+});
+FluidGradient.displayName = "FluidGradient";
+//#endregion
+export { FluidGradient as default };
+
+//# sourceMappingURL=FluidGradient.mjs.map

package/es/awesome/FluidGradient/FluidGradient.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluidGradient.mjs","names":[],"sources":["../../../src/awesome/FluidGradient/FluidGradient.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport { type CSSProperties, memo, useEffect, useRef, useState } from 'react';\r\n\r\nimport { LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT } from '@/awesome/landingTokens';\r\n\r\nimport { styles } from './style';\r\nimport type { FluidGradientProps } from './type';\r\n\r\nconst VERTEX_SHADER = `#version 300 es\r\nin vec2 aPos;\r\nvoid main() {\r\n  gl_Position = vec4(aPos, 0.0, 1.0);\r\n}`;\r\n\r\nconst FRAGMENT_SHADER = `#version 300 es\r\nprecision highp float;\r\n\r\nuniform vec2 uRes;\r\nuniform float uTime;\r\nuniform vec3 uStopA;\r\nuniform vec3 uStopB;\r\nuniform vec3 uStopC;\r\nuniform float uIntensity;\r\n\r\nout vec4 fragColor;\r\n\r\nfloat hash(vec2 p) {\r\n  p = fract(p * vec2(234.34, 435.345));\r\n  p += dot(p, p + 34.23);\r\n  return fract(p.x * p.y);\r\n}\r\n\r\nfloat noise(vec2 p) {\r\n  vec2 i = floor(p);\r\n  vec2 f = fract(p);\r\n  vec2 u = f * f * (3.0 - 2.0 * f);\r\n  float a = hash(i);\r\n  float b = hash(i + vec2(1.0, 0.0));\r\n  float c = hash(i + vec2(0.0, 1.0));\r\n  float d = hash(i + vec2(1.0, 1.0));\r\n  return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);\r\n}\r\n\r\nfloat fbm(vec2 p) {\r\n  float value = 0.0;\r\n  float amplitude = 0.5;\r\n  for (int i = 0; i < 4; i++) {\r\n    value += amplitude * noise(p);\r\n    p = mat2(0.8, 0.6, -0.6, 0.8) * p * 2.0 + vec2(3.7, 1.3);\r\n    amplitude *= 0.5;\r\n  }\r\n  return value;\r\n}\r\n\r\nvoid main() {\r\n  vec2 uv = gl_FragCoord.xy / uRes;\r\n  vec2 p = vec2(uv.x * uRes.x / uRes.y, uv.y);\r\n\r\n  float t = uTime * 0.05;\r\n\r\n  vec2 q = vec2(fbm(p * 1.4 + t * 0.35), fbm(p * 1.4 - t * 0.28 + 5.2));\r\n  vec2 r = vec2(\r\n    fbm(p * 1.4 + 2.6 * q + vec2(1.7, 9.2) + t * 0.18),\r\n    fbm(p * 1.4 + 2.6 * q + vec2(8.3, 2.8) - t * 0.12)\r\n  );\r\n  float field = fbm(p * 1.4 + 2.6 * r);\r\n\r\n  vec3 color = mix(uStopA, uStopB, clamp(field * field * 2.4, 0.0, 1.0));\r\n  color = mix(color, uStopC, clamp(dot(q, vec2(0.7)) - 0.25, 0.0, 1.0));\r\n\r\n  float fade = smoothstep(0.02, 0.85, uv.y);\r\n  float alpha = fade * fade * uIntensity * smoothstep(0.14, 0.66, field);\r\n\r\n  fragColor = vec4(color * alpha, alpha);\r\n}`;\r\n\r\nconst hexToRgb = (hex: string): [number, number, number] => {\r\n  const value = hex.replace('#', '');\r\n  const full =\r\n    value.length === 3\r\n      ? value\r\n          .split('')\r\n          .map((char) => char + char)\r\n          .join('')\r\n      : value.slice(0, 6);\r\n  const channel = (offset: number) => Number.parseInt(full.slice(offset, offset + 2), 16) / 255;\r\n  return [channel(0), channel(2), channel(4)];\r\n};\r\n\r\nconst FluidGradient = memo<FluidGradientProps>(\r\n  ({ className, colors, intensity = 0.45, speed = 1, style, ...rest }) => {\r\n    const { isDarkMode } = useThemeMode();\r\n    const canvasRef = useRef<HTMLCanvasElement>(null);\r\n    const [ready, setReady] = useState(false);\r\n    const [canvasEpoch, setCanvasEpoch] = useState(0);\r\n    const palette = colors ?? (isDarkMode ? LANDING_PALETTE_DARK : LANDING_PALETTE_LIGHT);\r\n    const paletteRef = useRef({ colors: palette, intensity });\r\n    const speedRef = useRef(speed);\r\n    const repaintRef = useRef<(() => void) | undefined>(undefined);\r\n\r\n    useEffect(() => {\r\n      paletteRef.current = { colors: palette, intensity };\r\n      speedRef.current = speed;\r\n      repaintRef.current?.();\r\n    }, [palette[0], palette[1], palette[2], intensity, speed]);\r\n\r\n    useEffect(() => {\r\n      const canvas = canvasRef.current;\r\n      if (!canvas) return undefined;\r\n\r\n      const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n\r\n      let frameId = 0;\r\n      let inView = true;\r\n      let readySent = false;\r\n      let drawFrame: ((seconds: number) => void) | null = null;\r\n      let refreshPalette: (() => void) | null = null;\r\n      let sizeAndDraw: (() => boolean) | null = null;\r\n      let destroyResources: ((lose: boolean) => void) | null = null;\r\n\r\n      const buildResources = () => {\r\n        const gl = canvas.getContext('webgl2', {\r\n          alpha: true,\r\n          antialias: false,\r\n          depth: false,\r\n          stencil: false,\r\n          powerPreference: 'low-power',\r\n        });\r\n        if (!gl) return false;\r\n\r\n        const compileShader = (type: number, source: string) => {\r\n          const shader = gl.createShader(type);\r\n          if (!shader) return null;\r\n          gl.shaderSource(shader, source);\r\n          gl.compileShader(shader);\r\n          if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\r\n            gl.deleteShader(shader);\r\n            return null;\r\n          }\r\n          return shader;\r\n        };\r\n\r\n        const vertexShader = compileShader(gl.VERTEX_SHADER, VERTEX_SHADER);\r\n        const fragmentShader = compileShader(gl.FRAGMENT_SHADER, FRAGMENT_SHADER);\r\n        if (!vertexShader || !fragmentShader) return false;\r\n\r\n        const program = gl.createProgram();\r\n        if (!program) return false;\r\n        gl.attachShader(program, vertexShader);\r\n        gl.attachShader(program, fragmentShader);\r\n        gl.linkProgram(program);\r\n        gl.deleteShader(vertexShader);\r\n        gl.deleteShader(fragmentShader);\r\n        if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {\r\n          gl.deleteProgram(program);\r\n          return false;\r\n        }\r\n        gl.useProgram(program);\r\n\r\n        const buffer = gl.createBuffer();\r\n        gl.bindBuffer(gl.ARRAY_BUFFER, buffer);\r\n        gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 3, -1, -1, 3]), gl.STATIC_DRAW);\r\n        const position = gl.getAttribLocation(program, 'aPos');\r\n        gl.enableVertexAttribArray(position);\r\n        gl.vertexAttribPointer(position, 2, gl.FLOAT, false, 0, 0);\r\n\r\n        const timeLocation = gl.getUniformLocation(program, 'uTime');\r\n        const stopLocations = ['uStopA', 'uStopB', 'uStopC'].map((name) =>\r\n          gl.getUniformLocation(program, name),\r\n        );\r\n\r\n        const intensityLocation = gl.getUniformLocation(program, 'uIntensity');\r\n\r\n        refreshPalette = () => {\r\n          const { colors: stops, intensity: peak } = paletteRef.current;\r\n          stops.map(hexToRgb).forEach((stop, index) => {\r\n            const location = stopLocations[index];\r\n            if (location) gl.uniform3f(location, stop[0], stop[1], stop[2]);\r\n          });\r\n          gl.uniform1f(intensityLocation, peak);\r\n        };\r\n        refreshPalette();\r\n\r\n        drawFrame = (seconds: number) => {\r\n          gl.uniform1f(timeLocation, seconds * speedRef.current);\r\n          gl.drawArrays(gl.TRIANGLES, 0, 3);\r\n          if (!readySent) {\r\n            readySent = true;\r\n            setReady(true);\r\n          }\r\n        };\r\n\r\n        sizeAndDraw = () => {\r\n          const dpr = Math.min(window.devicePixelRatio || 1, 1.5);\r\n          const width = Math.max(1, Math.round(canvas.clientWidth * dpr));\r\n          const height = Math.max(1, Math.round(canvas.clientHeight * dpr));\r\n          if (canvas.width !== width || canvas.height !== height) {\r\n            canvas.width = width;\r\n            canvas.height = height;\r\n            gl.viewport(0, 0, width, height);\r\n          }\r\n          return canvas.clientWidth > 0 && drawFrame !== null;\r\n        };\r\n\r\n        destroyResources = (lose: boolean) => {\r\n          gl.deleteBuffer(buffer);\r\n          gl.deleteProgram(program);\r\n          drawFrame = null;\r\n          refreshPalette = null;\r\n          sizeAndDraw = null;\r\n          destroyResources = null;\r\n          if (lose) gl.getExtension('WEBGL_lose_context')?.loseContext();\r\n        };\r\n\r\n        return true;\r\n      };\r\n\r\n      if (!buildResources()) return undefined;\r\n\r\n      const renderOnce = () => {\r\n        if (!sizeAndDraw?.()) return;\r\n        drawFrame?.(performance.now() / 1000);\r\n      };\r\n\r\n      const syncLoop = (milliseconds: number) => {\r\n        frameId = requestAnimationFrame(syncLoop);\r\n        if (sizeAndDraw?.()) drawFrame?.(milliseconds / 1000);\r\n      };\r\n\r\n      const updateLoop = () => {\r\n        const shouldAnimate =\r\n          inView && !document.hidden && !reducedMotion.matches && drawFrame !== null;\r\n\r\n        if (shouldAnimate) {\r\n          if (frameId === 0) frameId = requestAnimationFrame(syncLoop);\r\n          return;\r\n        }\r\n\r\n        if (frameId !== 0) {\r\n          cancelAnimationFrame(frameId);\r\n          frameId = 0;\r\n        }\r\n\r\n        if (!document.hidden) renderOnce();\r\n      };\r\n\r\n      const resizeObserver = new ResizeObserver(() => {\r\n        if (frameId === 0) renderOnce();\r\n      });\r\n      resizeObserver.observe(canvas);\r\n\r\n      const intersectionObserver = new IntersectionObserver(([entry]) => {\r\n        inView = entry.isIntersecting;\r\n        updateLoop();\r\n      });\r\n      intersectionObserver.observe(canvas);\r\n\r\n      const handleVisibilityChange = () => updateLoop();\r\n      document.addEventListener('visibilitychange', handleVisibilityChange);\r\n\r\n      const handleMotionPreferenceChange = () => updateLoop();\r\n      reducedMotion.addEventListener('change', handleMotionPreferenceChange);\r\n\r\n      repaintRef.current = () => {\r\n        refreshPalette?.();\r\n        if (frameId === 0) renderOnce();\r\n      };\r\n\r\n      const handleContextLost = (event: Event) => {\r\n        event.preventDefault();\r\n        if (frameId !== 0) {\r\n          cancelAnimationFrame(frameId);\r\n          frameId = 0;\r\n        }\r\n        setCanvasEpoch((value) => value + 1);\r\n      };\r\n      canvas.addEventListener('webglcontextlost', handleContextLost);\r\n\r\n      updateLoop();\r\n\r\n      return () => {\r\n        if (frameId !== 0) cancelAnimationFrame(frameId);\r\n        frameId = 0;\r\n        resizeObserver.disconnect();\r\n        intersectionObserver.disconnect();\r\n        repaintRef.current = undefined;\r\n        document.removeEventListener('visibilitychange', handleVisibilityChange);\r\n        reducedMotion.removeEventListener('change', handleMotionPreferenceChange);\r\n        canvas.removeEventListener('webglcontextlost', handleContextLost);\r\n        if (!canvas.isConnected) destroyResources?.(true);\r\n        else destroyResources?.(false);\r\n      };\r\n    }, [canvasEpoch]);\r\n\r\n    return (\r\n      <div\r\n        aria-hidden\r\n        className={cx(styles.root, className)}\r\n        data-ready={ready ? '' : undefined}\r\n        style={\r\n          {\r\n            '--fluid-stop-a': palette[0],\r\n            '--fluid-stop-b': palette[1],\r\n            '--fluid-stop-c': palette[2],\r\n            ...style,\r\n          } as CSSProperties\r\n        }\r\n        {...rest}\r\n      >\r\n        <canvas key={canvasEpoch} ref={canvasRef} />\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nFluidGradient.displayName = 'FluidGradient';\r\n\r\nexport default FluidGradient;\r\n"],"mappings":"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"}

package/es/awesome/FluidGradient/index.d.mts

@@ -0,0 +1,3 @@
+import { FluidGradientProps } from "./type.mjs";
+import FluidGradient from "./FluidGradient.mjs";
+export { type FluidGradientProps, FluidGradient as default };

package/es/awesome/FluidGradient/style.mjs

@@ -0,0 +1,52 @@
+import { createStaticStyles } from "antd-style";
+//#region src/awesome/FluidGradient/style.ts
+const styles = createStaticStyles(({ css }) => ({ root: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 0;
+    inset: 0;
+
+    /* Soft CSS fallback so the hero never flashes empty white while WebGL boots. */
+    background:
+      radial-gradient(
+        ellipse 80% 55% at 50% 0%,
+        color-mix(in srgb, var(--fluid-stop-a, #7c5cff) 28%, transparent),
+        transparent 70%
+      ),
+      radial-gradient(
+        ellipse 60% 45% at 85% 20%,
+        color-mix(in srgb, var(--fluid-stop-b, #d6549e) 22%, transparent),
+        transparent 65%
+      ),
+      radial-gradient(
+        ellipse 55% 40% at 15% 30%,
+        color-mix(in srgb, var(--fluid-stop-c, #f0885f) 18%, transparent),
+        transparent 60%
+      );
+
+    canvas {
+      display: block;
+
+      inline-size: 100%;
+      block-size: 100%;
+
+      opacity: 0;
+
+      transition: opacity 700ms ease;
+    }
+
+    &[data-ready] canvas {
+      opacity: 1;
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      canvas {
+        transition-duration: 0.01ms;
+      }
+    }
+  ` }));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/awesome/FluidGradient/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/FluidGradient/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nexport const styles = createStaticStyles(({ css }) => ({\r\n  root: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    z-index: 0;\r\n    inset: 0;\r\n\r\n    /* Soft CSS fallback so the hero never flashes empty white while WebGL boots. */\r\n    background:\r\n      radial-gradient(\r\n        ellipse 80% 55% at 50% 0%,\r\n        color-mix(in srgb, var(--fluid-stop-a, #7c5cff) 28%, transparent),\r\n        transparent 70%\r\n      ),\r\n      radial-gradient(\r\n        ellipse 60% 45% at 85% 20%,\r\n        color-mix(in srgb, var(--fluid-stop-b, #d6549e) 22%, transparent),\r\n        transparent 65%\r\n      ),\r\n      radial-gradient(\r\n        ellipse 55% 40% at 15% 30%,\r\n        color-mix(in srgb, var(--fluid-stop-c, #f0885f) 18%, transparent),\r\n        transparent 60%\r\n      );\r\n\r\n    canvas {\r\n      display: block;\r\n\r\n      inline-size: 100%;\r\n      block-size: 100%;\r\n\r\n      opacity: 0;\r\n\r\n      transition: opacity 700ms ease;\r\n    }\r\n\r\n    &[data-ready] canvas {\r\n      opacity: 1;\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      canvas {\r\n        transition-duration: 0.01ms;\r\n      }\r\n    }\r\n  `,\r\n}));\r\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,WAAW,EACrD,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA8CX,EAAE"}

package/es/awesome/FluidGradient/type.d.mts

@@ -0,0 +1,22 @@
+import { DivProps } from "../../types/index.mjs";
+import { LandingPalette } from "../landingTokens.mjs";
+//#region src/awesome/FluidGradient/type.d.ts
+interface FluidGradientProps extends DivProps {
+  /**
+   * Three color stops blended by the shader. Defaults to the landing palette for the current theme.
+   */
+  colors?: LandingPalette;
+  /**
+   * Peak opacity of the texture, from 0 to 1.
+   * @default 0.45
+   */
+  intensity?: number;
+  /**
+   * Animation speed multiplier. The texture renders a still frame when reduced motion is preferred.
+   * @default 1
+   */
+  speed?: number;
+}
+//#endregion
+export { FluidGradientProps };
+//# sourceMappingURL=type.d.mts.map

package/es/awesome/Giscus/Giscus.d.mts

@@ -0,0 +1,6 @@
+import { GiscusProps } from "./type.mjs";
+//#region src/awesome/Giscus/Giscus.d.ts
+declare const Giscus: import("react").NamedExoticComponent<GiscusProps>;
+//#endregion
+export { Giscus as default };
+//# sourceMappingURL=Giscus.d.mts.map

package/es/awesome/Giscus/Giscus.mjs

@@ -0,0 +1,29 @@
+"use client";
+import { formatLang, useStyles } from "./style.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+import GiscusComponent from "@giscus/react";
+//#region src/awesome/Giscus/Giscus.tsx
+const Giscus = memo(({ style, className, reactionsEnabled = "1", mapping = "title", lang = "en_US", inputPosition = "top", id = "giscus", loading = "lazy", emitMetadata = "0", ...rest }) => {
+	const theme = useStyles();
+	return /* @__PURE__ */ jsx("div", {
+		className,
+		style,
+		children: /* @__PURE__ */ jsx(GiscusComponent, {
+			emitMetadata,
+			id,
+			inputPosition,
+			lang: formatLang(lang),
+			loading,
+			mapping,
+			reactionsEnabled,
+			theme,
+			...rest
+		})
+	});
+});
+Giscus.displayName = "Giscus";
+//#endregion
+export { Giscus as default };
+
+//# sourceMappingURL=Giscus.mjs.map

package/es/awesome/Giscus/Giscus.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Giscus.mjs","names":[],"sources":["../../../src/awesome/Giscus/Giscus.tsx"],"sourcesContent":["'use client';\r\n\r\nimport GiscusComponent from '@giscus/react';\r\nimport { memo } from 'react';\r\n\r\nimport { formatLang, useStyles } from './style';\r\nimport type { GiscusProps } from './type';\r\n\r\nconst Giscus = memo<GiscusProps>(\r\n  ({\r\n    style,\r\n    className,\r\n    reactionsEnabled = '1',\r\n    mapping = 'title',\r\n    lang = 'en_US',\r\n    inputPosition = 'top',\r\n    id = 'giscus',\r\n    loading = 'lazy',\r\n    emitMetadata = '0',\r\n    ...rest\r\n  }) => {\r\n    const theme = useStyles();\r\n\r\n    return (\r\n      <div className={className} style={style}>\r\n        <GiscusComponent\r\n          emitMetadata={emitMetadata}\r\n          id={id}\r\n          inputPosition={inputPosition}\r\n          lang={formatLang(lang)}\r\n          loading={loading}\r\n          mapping={mapping}\r\n          reactionsEnabled={reactionsEnabled}\r\n          theme={theme}\r\n          {...rest}\r\n        />\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nGiscus.displayName = 'Giscus';\r\n\r\nexport default Giscus;\r\n"],"mappings":";;;;;;AAQA,MAAM,SAAS,MACZ,EACC,OACA,WACA,mBAAmB,KACnB,UAAU,SACV,OAAO,SACP,gBAAgB,OAChB,KAAK,UACL,UAAU,QACV,eAAe,KACf,GAAG,WACC;CACJ,MAAM,QAAQ,UAAU;CAExB,OACE,oBAAC,OAAD;EAAgB;EAAkB;EAChC,UAAA,oBAAC,iBAAD;GACgB;GACV;GACW;GACf,MAAM,WAAW,IAAI;GACZ;GACA;GACS;GACX;GACP,GAAI;EACL,CAAA;CACE,CAAA;AAET,CACF;AAEA,OAAO,cAAc"}

package/es/awesome/Giscus/index.d.mts

@@ -0,0 +1,3 @@
+import { GiscusProps } from "./type.mjs";
+import Giscus from "./Giscus.mjs";
+export { type GiscusProps, Giscus as default };