@lobehub/ui 5.59.0 → 5.60.0

package/es/ActionIcon/style.mjs

@@ -10,11 +10,17 @@ const styles = createStaticStyles(({ css, cssVar }) => {
 		dangerFilled: staticStylish.variantFilledDanger,
 		dangerOutlined: staticStylish.variantOutlinedDanger,
 		dangerRoot: css`
-      &:hover {
+      /* Mirrors the neutral ladder (colorTextTertiary -> colorTextSecondary -> colorText):
+         a softened red at rest, full colorError on hover, colorErrorActive when pressed. */
+      && {
+        color: color-mix(in srgb, ${cssVar.colorError} 66%, transparent);
+      }
+
+      &&:hover {
         color: ${cssVar.colorError};
       }
 
-      &:active {
+      &&:active {
         color: ${cssVar.colorErrorActive};
       }
     `,

package/es/ActionIcon/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/ActionIcon/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: lobeStaticStylish.active,\n    borderless: lobeStaticStylish.variantBorderless,\n    dangerBorderless: lobeStaticStylish.variantBorderlessDanger,\n    dangerFilled: lobeStaticStylish.variantFilledDanger,\n    dangerOutlined: lobeStaticStylish.variantOutlinedDanger,\n    dangerRoot: css`\n      &:hover {\n        color: ${cssVar.colorError};\n      }\n\n      &:active {\n        color: ${cssVar.colorErrorActive};\n      }\n    `,\n    disabled: lobeStaticStylish.disabled,\n    filled: lobeStaticStylish.variantFilled,\n    glass: lobeStaticStylish.blur,\n    outlined: lobeStaticStylish.variantOutlined,\n    root: css`\n      cursor: pointer;\n\n      position: relative;\n\n      overflow: hidden;\n\n      color: ${cssVar.colorTextTertiary};\n\n      transition:\n        color 400ms ${cssVar.motionEaseOut},\n        background 100ms ${cssVar.motionEaseOut};\n\n      &:hover {\n        color: ${cssVar.colorTextSecondary};\n      }\n\n      &:active {\n        color: ${cssVar.colorText};\n      }\n    `,\n    shadow: lobeStaticStylish.shadow,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  compoundVariants: [\n    {\n      className: styles.dangerFilled,\n      danger: true,\n      variant: 'filled',\n    },\n    {\n      className: styles.dangerBorderless,\n      danger: true,\n      variant: 'borderless',\n    },\n    {\n      className: styles.dangerOutlined,\n      danger: true,\n      variant: 'outlined',\n    },\n  ],\n  defaultVariants: {\n    active: false,\n    danger: false,\n    disabled: false,\n    glass: false,\n    shadow: false,\n    variant: 'borderless',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n    glass: {\n      false: null,\n      true: styles.glass,\n    },\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n    active: {\n      false: null,\n      true: styles.active,\n    },\n    danger: {\n      false: null,\n      true: styles.dangerRoot,\n    },\n    disabled: {\n      false: null,\n      true: styles.disabled,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQA,cAAkB;EAC1B,YAAYA,cAAkB;EAC9B,kBAAkBA,cAAkB;EACpC,cAAcA,cAAkB;EAChC,gBAAgBA,cAAkB;EAClC,YAAY,GAAG;;iBAEF,OAAO,WAAW;;;;iBAIlB,OAAO,iBAAiB;;;EAGrC,UAAUA,cAAkB;EAC5B,QAAQA,cAAkB;EAC1B,OAAOA,cAAkB;EACzB,UAAUA,cAAkB;EAC5B,MAAM,GAAG;;;;;;;eAOE,OAAO,kBAAkB;;;sBAGlB,OAAO,cAAc;2BAChB,OAAO,cAAc;;;iBAG/B,OAAO,mBAAmB;;;;iBAI1B,OAAO,UAAU;;;EAG9B,QAAQA,cAAkB;CAC5B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,kBAAkB;EAChB;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;EACA;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;EACA;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;CACF;CACA,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;CACX;CAEA,UAAU;EACR,SAAS;GACP,QAAQ,OAAO;GACf,UAAU,OAAO;GACjB,YAAY,OAAO;EACrB;EACA,OAAO;GACL,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,UAAU;GACR,OAAO;GACP,MAAM,OAAO;EACf;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/ActionIcon/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: lobeStaticStylish.active,\n    borderless: lobeStaticStylish.variantBorderless,\n    dangerBorderless: lobeStaticStylish.variantBorderlessDanger,\n    dangerFilled: lobeStaticStylish.variantFilledDanger,\n    dangerOutlined: lobeStaticStylish.variantOutlinedDanger,\n    // && outranks `root`, whose plain color is inserted after this rule.\n    dangerRoot: css`\n      /* Mirrors the neutral ladder (colorTextTertiary -> colorTextSecondary -> colorText):\n         a softened red at rest, full colorError on hover, colorErrorActive when pressed. */\n      && {\n        color: color-mix(in srgb, ${cssVar.colorError} 66%, transparent);\n      }\n\n      &&:hover {\n        color: ${cssVar.colorError};\n      }\n\n      &&:active {\n        color: ${cssVar.colorErrorActive};\n      }\n    `,\n    disabled: lobeStaticStylish.disabled,\n    filled: lobeStaticStylish.variantFilled,\n    glass: lobeStaticStylish.blur,\n    outlined: lobeStaticStylish.variantOutlined,\n    root: css`\n      cursor: pointer;\n\n      position: relative;\n\n      overflow: hidden;\n\n      color: ${cssVar.colorTextTertiary};\n\n      transition:\n        color 400ms ${cssVar.motionEaseOut},\n        background 100ms ${cssVar.motionEaseOut};\n\n      &:hover {\n        color: ${cssVar.colorTextSecondary};\n      }\n\n      &:active {\n        color: ${cssVar.colorText};\n      }\n    `,\n    shadow: lobeStaticStylish.shadow,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  compoundVariants: [\n    {\n      className: styles.dangerFilled,\n      danger: true,\n      variant: 'filled',\n    },\n    {\n      className: styles.dangerBorderless,\n      danger: true,\n      variant: 'borderless',\n    },\n    {\n      className: styles.dangerOutlined,\n      danger: true,\n      variant: 'outlined',\n    },\n  ],\n  defaultVariants: {\n    active: false,\n    danger: false,\n    disabled: false,\n    glass: false,\n    shadow: false,\n    variant: 'borderless',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n    glass: {\n      false: null,\n      true: styles.glass,\n    },\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n    active: {\n      false: null,\n      true: styles.active,\n    },\n    danger: {\n      false: null,\n      true: styles.dangerRoot,\n    },\n    disabled: {\n      false: null,\n      true: styles.disabled,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQA,cAAkB;EAC1B,YAAYA,cAAkB;EAC9B,kBAAkBA,cAAkB;EACpC,cAAcA,cAAkB;EAChC,gBAAgBA,cAAkB;EAElC,YAAY,GAAG;;;;oCAIiB,OAAO,WAAW;;;;iBAIrC,OAAO,WAAW;;;;iBAIlB,OAAO,iBAAiB;;;EAGrC,UAAUA,cAAkB;EAC5B,QAAQA,cAAkB;EAC1B,OAAOA,cAAkB;EACzB,UAAUA,cAAkB;EAC5B,MAAM,GAAG;;;;;;;eAOE,OAAO,kBAAkB;;;sBAGlB,OAAO,cAAc;2BAChB,OAAO,cAAc;;;iBAG/B,OAAO,mBAAmB;;;;iBAI1B,OAAO,UAAU;;;EAG9B,QAAQA,cAAkB;CAC5B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,kBAAkB;EAChB;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;EACA;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;EACA;GACE,WAAW,OAAO;GAClB,QAAQ;GACR,SAAS;EACX;CACF;CACA,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;CACX;CAEA,UAAU;EACR,SAAS;GACP,QAAQ,OAAO;GACf,UAAU,OAAO;GACjB,YAAY,OAAO;EACrB;EACA,OAAO;GACL,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,UAAU;GACR,OAAO;GACP,MAAM,OAAO;EACf;CACF;AACF,CAAC"}

package/es/awesome/Grainient/Grainient.d.mts

@@ -0,0 +1,11 @@
+import { GrainientProps } from "./type.mjs";
+//#region src/awesome/Grainient/Grainient.d.ts
+/**
+ * Animated grainy gradient (WebGL2, no extra dependency). Fills its nearest positioned ancestor,
+ * pauses when off-screen or the tab is hidden, and draws one still frame when reduced motion is
+ * preferred. Without WebGL2 it renders nothing, so give the parent a fallback background.
+ */
+declare const Grainient: import("react").NamedExoticComponent<GrainientProps>;
+//#endregion
+export { Grainient as default };
+//# sourceMappingURL=Grainient.d.mts.map

package/es/awesome/Grainient/Grainient.mjs

@@ -0,0 +1,311 @@
+"use client";
+import { styles } from "./style.mjs";
+import { memo, useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/awesome/Grainient/Grainient.tsx
+const VERTEX_SHADER = `#version 300 es
+in vec2 position;
+void main() {
+  gl_Position = vec4(position, 0.0, 1.0);
+}
+`;
+const FRAGMENT_SHADER = `#version 300 es
+precision highp float;
+uniform vec2 iResolution;
+uniform float iTime;
+uniform float uTimeSpeed;
+uniform float uColorBalance;
+uniform float uWarpStrength;
+uniform float uWarpFrequency;
+uniform float uWarpSpeed;
+uniform float uWarpAmplitude;
+uniform float uBlendAngle;
+uniform float uBlendSoftness;
+uniform float uRotationAmount;
+uniform float uNoiseScale;
+uniform float uGrainAmount;
+uniform float uGrainScale;
+uniform float uGrainAnimated;
+uniform float uContrast;
+uniform float uGamma;
+uniform float uSaturation;
+uniform vec2 uCenterOffset;
+uniform float uZoom;
+uniform vec3 uColor1;
+uniform vec3 uColor2;
+uniform vec3 uColor3;
+uniform float uLightMode;
+out vec4 fragColor;
+#define S(a,b,t) smoothstep(a,b,t)
+mat2 Rot(float a){float s=sin(a),c=cos(a);return mat2(c,-s,s,c);}
+vec2 hash(vec2 p){p=vec2(dot(p,vec2(2127.1,81.17)),dot(p,vec2(1269.5,283.37)));return fract(sin(p)*43758.5453);}
+float noise(vec2 p){vec2 i=floor(p),f=fract(p),u=f*f*(3.0-2.0*f);float n=mix(mix(dot(-1.0+2.0*hash(i+vec2(0.0,0.0)),f-vec2(0.0,0.0)),dot(-1.0+2.0*hash(i+vec2(1.0,0.0)),f-vec2(1.0,0.0)),u.x),mix(dot(-1.0+2.0*hash(i+vec2(0.0,1.0)),f-vec2(0.0,1.0)),dot(-1.0+2.0*hash(i+vec2(1.0,1.0)),f-vec2(1.0,1.0)),u.x),u.y);return 0.5+0.5*n;}
+void mainImage(out vec4 o, vec2 C){
+  float t=iTime*uTimeSpeed;
+  vec2 uv=C/iResolution.xy;
+  float ratio=iResolution.x/iResolution.y;
+  vec2 tuv=uv-0.5+uCenterOffset;
+  tuv/=max(uZoom,0.001);
+
+  float degree=noise(vec2(t*0.1,tuv.x*tuv.y)*uNoiseScale);
+  tuv.y*=1.0/ratio;
+  tuv*=Rot(radians((degree-0.5)*uRotationAmount+180.0));
+  tuv.y*=ratio;
+
+  float frequency=uWarpFrequency;
+  float ws=max(uWarpStrength,0.001);
+  float amplitude=uWarpAmplitude/ws;
+  float warpTime=t*uWarpSpeed;
+  tuv.x+=sin(tuv.y*frequency+warpTime)/amplitude;
+  tuv.y+=sin(tuv.x*(frequency*1.5)+warpTime)/(amplitude*0.5);
+
+  vec3 colLav=uColor1;
+  vec3 colOrg=uColor2;
+  vec3 colDark=uColor3;
+  float b=uColorBalance;
+  float s=max(uBlendSoftness,0.0);
+  mat2 blendRot=Rot(radians(uBlendAngle));
+  float blendX=(tuv*blendRot).x;
+  float edge0=-0.3-b-s;
+  float edge1=0.2-b+s;
+  float v0=0.5-b+s;
+  float v1=-0.3-b-s;
+  vec3 layer1=mix(colDark,colOrg,S(edge0,edge1,blendX));
+  vec3 layer2=mix(colOrg,colLav,S(edge0,edge1,blendX));
+  vec3 col=mix(layer1,layer2,S(v0,v1,tuv.y));
+
+  vec2 grainUv=uv*max(uGrainScale,0.001);
+  if(uGrainAnimated>0.5){grainUv+=vec2(iTime*0.05);}
+  float grain=fract(sin(dot(grainUv,vec2(12.9898,78.233)))*43758.5453);
+  col+=(grain-0.5)*uGrainAmount;
+
+  col=(col-0.5)*uContrast+0.5;
+  float luma=dot(col,vec3(0.2126,0.7152,0.0722));
+  col=mix(vec3(luma),col,uSaturation);
+  col=pow(max(col,0.0),vec3(1.0/max(uGamma,0.001)));
+  col=clamp(col,0.0,1.0);
+  if(uLightMode>0.5){
+    float energy=max(max(col.r,col.g),col.b);
+    vec3 hue=col/max(energy,0.001);
+    float chroma=length(col-vec3(dot(col,vec3(0.333333))));
+    float coverage=clamp(0.12+chroma*1.15+energy*0.18,0.0,0.88);
+    col=mix(vec3(1.0),clamp(hue*0.58+col*0.18,0.0,1.0),coverage);
+  }
+
+  o=vec4(col,1.0);
+}
+void main(){
+  vec4 o=vec4(0.0);
+  mainImage(o,gl_FragCoord.xy);
+  fragColor=o;
+}
+`;
+const hexToRgb = (hex) => {
+	let value = hex.trim().replace("#", "");
+	if (value.length === 3) value = [...value].map((c) => c + c).join("");
+	const result = /^([\da-f]{2})([\da-f]{2})([\da-f]{2})$/i.exec(value);
+	if (!result) return [
+		1,
+		1,
+		1
+	];
+	return [
+		Number.parseInt(result[1], 16) / 255,
+		Number.parseInt(result[2], 16) / 255,
+		Number.parseInt(result[3], 16) / 255
+	];
+};
+const compile = (gl, 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;
+};
+/**
+* Animated grainy gradient (WebGL2, no extra dependency). Fills its nearest positioned ancestor,
+* pauses when off-screen or the tab is hidden, and draws one still frame when reduced motion is
+* preferred. Without WebGL2 it renders nothing, so give the parent a fallback background.
+*/
+const Grainient = memo(({ timeSpeed = .25, colorBalance = 0, warpStrength = 1, warpFrequency = 5, warpSpeed = 2, warpAmplitude = 50, blendAngle = 0, blendSoftness = .05, rotationAmount = 500, noiseScale = 2, grainAmount = .1, grainScale = 2, contrast = 1.5, gamma = 1, saturation = 1, zoom = .9, centerX = 0, centerY = 0, color1 = "#FF9FFC", color2 = "#5227FF", color3 = "#B497CF", grainAnimated = false, lightMode = false, className, ...rest }) => {
+	const containerRef = useRef(null);
+	const drawRef = useRef(null);
+	const uniformsRef = useRef(null);
+	const { isDarkMode } = useThemeMode();
+	const light = lightMode === "auto" ? !isDarkMode : lightMode;
+	useEffect(() => {
+		const container = containerRef.current;
+		if (!container) return;
+		const canvas = document.createElement("canvas");
+		const gl = canvas.getContext("webgl2", {
+			alpha: true,
+			antialias: false
+		});
+		if (!gl) return;
+		container.append(canvas);
+		const vs = compile(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
+		const fs = compile(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
+		const program = gl.createProgram();
+		if (!vs || !fs || !program) {
+			canvas.remove();
+			return;
+		}
+		gl.attachShader(program, vs);
+		gl.attachShader(program, fs);
+		gl.linkProgram(program);
+		if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+			canvas.remove();
+			return;
+		}
+		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, "position");
+		gl.enableVertexAttribArray(position);
+		gl.vertexAttribPointer(position, 2, gl.FLOAT, false, 0, 0);
+		const loc = (name) => gl.getUniformLocation(program, name);
+		const uTime = loc("iTime");
+		const uRes = loc("iResolution");
+		const started = performance.now();
+		const draw = () => {
+			gl.uniform1f(uTime, (performance.now() - started) * .001);
+			gl.drawArrays(gl.TRIANGLES, 0, 3);
+		};
+		drawRef.current = draw;
+		uniformsRef.current?.();
+		const setSize = () => {
+			const rect = container.getBoundingClientRect();
+			const dpr = Math.min(window.devicePixelRatio || 1, 2);
+			canvas.width = Math.max(1, Math.floor(rect.width * dpr));
+			canvas.height = Math.max(1, Math.floor(rect.height * dpr));
+			gl.viewport(0, 0, canvas.width, canvas.height);
+			gl.uniform2f(uRes, canvas.width, canvas.height);
+			draw();
+		};
+		const reducedMotion = window.matchMedia?.("(prefers-reduced-motion: reduce)");
+		let raf = 0;
+		let inView = true;
+		const loop = () => {
+			draw();
+			raf = requestAnimationFrame(loop);
+		};
+		const stop = () => {
+			if (raf) cancelAnimationFrame(raf);
+			raf = 0;
+		};
+		const sync = () => {
+			const run = inView && !document.hidden && !reducedMotion?.matches;
+			if (run && !raf) raf = requestAnimationFrame(loop);
+			if (!run) {
+				stop();
+				draw();
+			}
+		};
+		const resizeObserver = new ResizeObserver(setSize);
+		resizeObserver.observe(container);
+		const intersectionObserver = new IntersectionObserver(([entry]) => {
+			inView = entry.isIntersecting;
+			sync();
+		});
+		intersectionObserver.observe(container);
+		document.addEventListener("visibilitychange", sync);
+		reducedMotion?.addEventListener("change", sync);
+		setSize();
+		sync();
+		return () => {
+			stop();
+			resizeObserver.disconnect();
+			intersectionObserver.disconnect();
+			document.removeEventListener("visibilitychange", sync);
+			reducedMotion?.removeEventListener("change", sync);
+			drawRef.current = null;
+			gl.deleteBuffer(buffer);
+			gl.deleteProgram(program);
+			gl.deleteShader(vs);
+			gl.deleteShader(fs);
+			canvas.remove();
+		};
+	}, []);
+	useEffect(() => {
+		const apply = () => {
+			const gl = (containerRef.current?.querySelector("canvas"))?.getContext("webgl2");
+			if (!gl) return;
+			const program = gl.getParameter(gl.CURRENT_PROGRAM);
+			if (!program) return;
+			const loc = (name) => gl.getUniformLocation(program, name);
+			gl.uniform1f(loc("uTimeSpeed"), timeSpeed);
+			gl.uniform1f(loc("uColorBalance"), colorBalance);
+			gl.uniform1f(loc("uWarpStrength"), warpStrength);
+			gl.uniform1f(loc("uWarpFrequency"), warpFrequency);
+			gl.uniform1f(loc("uWarpSpeed"), warpSpeed);
+			gl.uniform1f(loc("uWarpAmplitude"), warpAmplitude);
+			gl.uniform1f(loc("uBlendAngle"), blendAngle);
+			gl.uniform1f(loc("uBlendSoftness"), blendSoftness);
+			gl.uniform1f(loc("uRotationAmount"), rotationAmount);
+			gl.uniform1f(loc("uNoiseScale"), noiseScale);
+			gl.uniform1f(loc("uGrainAmount"), grainAmount);
+			gl.uniform1f(loc("uGrainScale"), grainScale);
+			gl.uniform1f(loc("uContrast"), contrast);
+			gl.uniform1f(loc("uGamma"), gamma);
+			gl.uniform1f(loc("uSaturation"), saturation);
+			gl.uniform1f(loc("uZoom"), zoom);
+			gl.uniform1f(loc("uGrainAnimated"), grainAnimated ? 1 : 0);
+			gl.uniform1f(loc("uLightMode"), light ? 1 : 0);
+			gl.uniform2f(loc("uCenterOffset"), centerX, centerY);
+			gl.uniform3f(loc("uColor1"), ...hexToRgb(color1));
+			gl.uniform3f(loc("uColor2"), ...hexToRgb(color2));
+			gl.uniform3f(loc("uColor3"), ...hexToRgb(color3));
+			drawRef.current?.();
+		};
+		uniformsRef.current = apply;
+		apply();
+	}, [
+		timeSpeed,
+		colorBalance,
+		warpStrength,
+		warpFrequency,
+		warpSpeed,
+		warpAmplitude,
+		blendAngle,
+		blendSoftness,
+		rotationAmount,
+		noiseScale,
+		grainAmount,
+		grainScale,
+		contrast,
+		gamma,
+		saturation,
+		zoom,
+		centerX,
+		centerY,
+		color1,
+		color2,
+		color3,
+		grainAnimated,
+		light
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		"aria-hidden": true,
+		className: cx(styles.root, className),
+		ref: containerRef,
+		...rest
+	});
+});
+Grainient.displayName = "Grainient";
+//#endregion
+export { Grainient as default, hexToRgb };
+
+//# sourceMappingURL=Grainient.mjs.map

package/es/awesome/Grainient/Grainient.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grainient.mjs","names":[],"sources":["../../../src/awesome/Grainient/Grainient.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useThemeMode } from 'antd-style';\nimport { memo, useEffect, useRef } from 'react';\n\nimport { styles } from './style';\nimport type { GrainientProps } from './type';\n\nconst VERTEX_SHADER = `#version 300 es\nin vec2 position;\nvoid main() {\n  gl_Position = vec4(position, 0.0, 1.0);\n}\n`;\n\nconst FRAGMENT_SHADER = `#version 300 es\nprecision highp float;\nuniform vec2 iResolution;\nuniform float iTime;\nuniform float uTimeSpeed;\nuniform float uColorBalance;\nuniform float uWarpStrength;\nuniform float uWarpFrequency;\nuniform float uWarpSpeed;\nuniform float uWarpAmplitude;\nuniform float uBlendAngle;\nuniform float uBlendSoftness;\nuniform float uRotationAmount;\nuniform float uNoiseScale;\nuniform float uGrainAmount;\nuniform float uGrainScale;\nuniform float uGrainAnimated;\nuniform float uContrast;\nuniform float uGamma;\nuniform float uSaturation;\nuniform vec2 uCenterOffset;\nuniform float uZoom;\nuniform vec3 uColor1;\nuniform vec3 uColor2;\nuniform vec3 uColor3;\nuniform float uLightMode;\nout vec4 fragColor;\n#define S(a,b,t) smoothstep(a,b,t)\nmat2 Rot(float a){float s=sin(a),c=cos(a);return mat2(c,-s,s,c);}\nvec2 hash(vec2 p){p=vec2(dot(p,vec2(2127.1,81.17)),dot(p,vec2(1269.5,283.37)));return fract(sin(p)*43758.5453);}\nfloat noise(vec2 p){vec2 i=floor(p),f=fract(p),u=f*f*(3.0-2.0*f);float n=mix(mix(dot(-1.0+2.0*hash(i+vec2(0.0,0.0)),f-vec2(0.0,0.0)),dot(-1.0+2.0*hash(i+vec2(1.0,0.0)),f-vec2(1.0,0.0)),u.x),mix(dot(-1.0+2.0*hash(i+vec2(0.0,1.0)),f-vec2(0.0,1.0)),dot(-1.0+2.0*hash(i+vec2(1.0,1.0)),f-vec2(1.0,1.0)),u.x),u.y);return 0.5+0.5*n;}\nvoid mainImage(out vec4 o, vec2 C){\n  float t=iTime*uTimeSpeed;\n  vec2 uv=C/iResolution.xy;\n  float ratio=iResolution.x/iResolution.y;\n  vec2 tuv=uv-0.5+uCenterOffset;\n  tuv/=max(uZoom,0.001);\n\n  float degree=noise(vec2(t*0.1,tuv.x*tuv.y)*uNoiseScale);\n  tuv.y*=1.0/ratio;\n  tuv*=Rot(radians((degree-0.5)*uRotationAmount+180.0));\n  tuv.y*=ratio;\n\n  float frequency=uWarpFrequency;\n  float ws=max(uWarpStrength,0.001);\n  float amplitude=uWarpAmplitude/ws;\n  float warpTime=t*uWarpSpeed;\n  tuv.x+=sin(tuv.y*frequency+warpTime)/amplitude;\n  tuv.y+=sin(tuv.x*(frequency*1.5)+warpTime)/(amplitude*0.5);\n\n  vec3 colLav=uColor1;\n  vec3 colOrg=uColor2;\n  vec3 colDark=uColor3;\n  float b=uColorBalance;\n  float s=max(uBlendSoftness,0.0);\n  mat2 blendRot=Rot(radians(uBlendAngle));\n  float blendX=(tuv*blendRot).x;\n  float edge0=-0.3-b-s;\n  float edge1=0.2-b+s;\n  float v0=0.5-b+s;\n  float v1=-0.3-b-s;\n  vec3 layer1=mix(colDark,colOrg,S(edge0,edge1,blendX));\n  vec3 layer2=mix(colOrg,colLav,S(edge0,edge1,blendX));\n  vec3 col=mix(layer1,layer2,S(v0,v1,tuv.y));\n\n  vec2 grainUv=uv*max(uGrainScale,0.001);\n  if(uGrainAnimated>0.5){grainUv+=vec2(iTime*0.05);}\n  float grain=fract(sin(dot(grainUv,vec2(12.9898,78.233)))*43758.5453);\n  col+=(grain-0.5)*uGrainAmount;\n\n  col=(col-0.5)*uContrast+0.5;\n  float luma=dot(col,vec3(0.2126,0.7152,0.0722));\n  col=mix(vec3(luma),col,uSaturation);\n  col=pow(max(col,0.0),vec3(1.0/max(uGamma,0.001)));\n  col=clamp(col,0.0,1.0);\n  if(uLightMode>0.5){\n    float energy=max(max(col.r,col.g),col.b);\n    vec3 hue=col/max(energy,0.001);\n    float chroma=length(col-vec3(dot(col,vec3(0.333333))));\n    float coverage=clamp(0.12+chroma*1.15+energy*0.18,0.0,0.88);\n    col=mix(vec3(1.0),clamp(hue*0.58+col*0.18,0.0,1.0),coverage);\n  }\n\n  o=vec4(col,1.0);\n}\nvoid main(){\n  vec4 o=vec4(0.0);\n  mainImage(o,gl_FragCoord.xy);\n  fragColor=o;\n}\n`;\n\nexport const hexToRgb = (hex: string): [number, number, number] => {\n  let value = hex.trim().replace('#', '');\n  if (value.length === 3) value = [...value].map((c) => c + c).join('');\n  const result = /^([\\da-f]{2})([\\da-f]{2})([\\da-f]{2})$/i.exec(value);\n  if (!result) return [1, 1, 1];\n  return [\n    Number.parseInt(result[1], 16) / 255,\n    Number.parseInt(result[2], 16) / 255,\n    Number.parseInt(result[3], 16) / 255,\n  ];\n};\n\nconst compile = (gl: WebGL2RenderingContext, type: number, source: string) => {\n  const shader = gl.createShader(type);\n  if (!shader) return null;\n  gl.shaderSource(shader, source);\n  gl.compileShader(shader);\n  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {\n    gl.deleteShader(shader);\n    return null;\n  }\n  return shader;\n};\n\n/**\n * Animated grainy gradient (WebGL2, no extra dependency). Fills its nearest positioned ancestor,\n * pauses when off-screen or the tab is hidden, and draws one still frame when reduced motion is\n * preferred. Without WebGL2 it renders nothing, so give the parent a fallback background.\n */\nconst Grainient = memo<GrainientProps>(\n  ({\n    timeSpeed = 0.25,\n    colorBalance = 0,\n    warpStrength = 1,\n    warpFrequency = 5,\n    warpSpeed = 2,\n    warpAmplitude = 50,\n    blendAngle = 0,\n    blendSoftness = 0.05,\n    rotationAmount = 500,\n    noiseScale = 2,\n    grainAmount = 0.1,\n    grainScale = 2,\n    contrast = 1.5,\n    gamma = 1,\n    saturation = 1,\n    zoom = 0.9,\n    centerX = 0,\n    centerY = 0,\n    color1 = '#FF9FFC',\n    color2 = '#5227FF',\n    color3 = '#B497CF',\n    grainAnimated = false,\n    lightMode = false,\n    className,\n    ...rest\n  }) => {\n    const containerRef = useRef<HTMLDivElement>(null);\n    const drawRef = useRef<(() => void) | null>(null);\n    const uniformsRef = useRef<(() => void) | null>(null);\n    const { isDarkMode } = useThemeMode();\n    const light = lightMode === 'auto' ? !isDarkMode : lightMode;\n\n    useEffect(() => {\n      const container = containerRef.current;\n      if (!container) return;\n\n      const canvas = document.createElement('canvas');\n      const gl = canvas.getContext('webgl2', { alpha: true, antialias: false });\n      if (!gl) return;\n      container.append(canvas);\n\n      const vs = compile(gl, gl.VERTEX_SHADER, VERTEX_SHADER);\n      const fs = compile(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);\n      const program = gl.createProgram();\n      if (!vs || !fs || !program) {\n        canvas.remove();\n        return;\n      }\n      gl.attachShader(program, vs);\n      gl.attachShader(program, fs);\n      gl.linkProgram(program);\n      if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {\n        canvas.remove();\n        return;\n      }\n      gl.useProgram(program);\n\n      // One triangle that covers the viewport.\n      const buffer = gl.createBuffer();\n      gl.bindBuffer(gl.ARRAY_BUFFER, buffer);\n      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 3, -1, -1, 3]), gl.STATIC_DRAW);\n      const position = gl.getAttribLocation(program, 'position');\n      gl.enableVertexAttribArray(position);\n      gl.vertexAttribPointer(position, 2, gl.FLOAT, false, 0, 0);\n\n      const loc = (name: string) => gl.getUniformLocation(program, name);\n      const uTime = loc('iTime');\n      const uRes = loc('iResolution');\n      const started = performance.now();\n\n      const draw = () => {\n        gl.uniform1f(uTime, (performance.now() - started) * 0.001);\n        gl.drawArrays(gl.TRIANGLES, 0, 3);\n      };\n      drawRef.current = draw;\n      uniformsRef.current?.();\n\n      const setSize = () => {\n        const rect = container.getBoundingClientRect();\n        const dpr = Math.min(window.devicePixelRatio || 1, 2);\n        canvas.width = Math.max(1, Math.floor(rect.width * dpr));\n        canvas.height = Math.max(1, Math.floor(rect.height * dpr));\n        gl.viewport(0, 0, canvas.width, canvas.height);\n        gl.uniform2f(uRes, canvas.width, canvas.height);\n        draw();\n      };\n\n      const reducedMotion = window.matchMedia?.('(prefers-reduced-motion: reduce)');\n      let raf = 0;\n      let inView = true;\n\n      const loop = () => {\n        draw();\n        raf = requestAnimationFrame(loop);\n      };\n      const stop = () => {\n        if (raf) cancelAnimationFrame(raf);\n        raf = 0;\n      };\n      const sync = () => {\n        const run = inView && !document.hidden && !reducedMotion?.matches;\n        if (run && !raf) raf = requestAnimationFrame(loop);\n        if (!run) {\n          stop();\n          draw();\n        }\n      };\n\n      const resizeObserver = new ResizeObserver(setSize);\n      resizeObserver.observe(container);\n      const intersectionObserver = new IntersectionObserver(([entry]) => {\n        inView = entry.isIntersecting;\n        sync();\n      });\n      intersectionObserver.observe(container);\n      document.addEventListener('visibilitychange', sync);\n      reducedMotion?.addEventListener('change', sync);\n      setSize();\n      sync();\n\n      return () => {\n        stop();\n        resizeObserver.disconnect();\n        intersectionObserver.disconnect();\n        document.removeEventListener('visibilitychange', sync);\n        reducedMotion?.removeEventListener('change', sync);\n        drawRef.current = null;\n        gl.deleteBuffer(buffer);\n        gl.deleteProgram(program);\n        gl.deleteShader(vs);\n        gl.deleteShader(fs);\n        canvas.remove();\n      };\n    }, []);\n\n    useEffect(() => {\n      const apply = () => {\n        const canvas = containerRef.current?.querySelector('canvas');\n        const gl = canvas?.getContext('webgl2');\n        if (!gl) return;\n        const program = gl.getParameter(gl.CURRENT_PROGRAM) as WebGLProgram | null;\n        if (!program) return;\n        const loc = (name: string) => gl.getUniformLocation(program, name);\n        gl.uniform1f(loc('uTimeSpeed'), timeSpeed);\n        gl.uniform1f(loc('uColorBalance'), colorBalance);\n        gl.uniform1f(loc('uWarpStrength'), warpStrength);\n        gl.uniform1f(loc('uWarpFrequency'), warpFrequency);\n        gl.uniform1f(loc('uWarpSpeed'), warpSpeed);\n        gl.uniform1f(loc('uWarpAmplitude'), warpAmplitude);\n        gl.uniform1f(loc('uBlendAngle'), blendAngle);\n        gl.uniform1f(loc('uBlendSoftness'), blendSoftness);\n        gl.uniform1f(loc('uRotationAmount'), rotationAmount);\n        gl.uniform1f(loc('uNoiseScale'), noiseScale);\n        gl.uniform1f(loc('uGrainAmount'), grainAmount);\n        gl.uniform1f(loc('uGrainScale'), grainScale);\n        gl.uniform1f(loc('uContrast'), contrast);\n        gl.uniform1f(loc('uGamma'), gamma);\n        gl.uniform1f(loc('uSaturation'), saturation);\n        gl.uniform1f(loc('uZoom'), zoom);\n        gl.uniform1f(loc('uGrainAnimated'), grainAnimated ? 1 : 0);\n        gl.uniform1f(loc('uLightMode'), light ? 1 : 0);\n        gl.uniform2f(loc('uCenterOffset'), centerX, centerY);\n        gl.uniform3f(loc('uColor1'), ...hexToRgb(color1));\n        gl.uniform3f(loc('uColor2'), ...hexToRgb(color2));\n        gl.uniform3f(loc('uColor3'), ...hexToRgb(color3));\n        drawRef.current?.();\n      };\n      uniformsRef.current = apply;\n      apply();\n    }, [\n      timeSpeed,\n      colorBalance,\n      warpStrength,\n      warpFrequency,\n      warpSpeed,\n      warpAmplitude,\n      blendAngle,\n      blendSoftness,\n      rotationAmount,\n      noiseScale,\n      grainAmount,\n      grainScale,\n      contrast,\n      gamma,\n      saturation,\n      zoom,\n      centerX,\n      centerY,\n      color1,\n      color2,\n      color3,\n      grainAnimated,\n      light,\n    ]);\n\n    return <div aria-hidden className={cx(styles.root, className)} ref={containerRef} {...rest} />;\n  },\n);\n\nGrainient.displayName = 'Grainient';\n\nexport default Grainient;\n"],"mappings":"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"}

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

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

package/es/awesome/Grainient/style.mjs

@@ -0,0 +1,25 @@
+import { createStaticStyles } from "antd-style";
+//#region src/awesome/Grainient/style.ts
+const styles = createStaticStyles(({ css }) => ({ root: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 0;
+    inset: 0;
+
+    overflow: hidden;
+
+    canvas {
+      position: absolute;
+      inset: 0;
+
+      display: block;
+
+      inline-size: 100%;
+      block-size: 100%;
+    }
+  ` }));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/Grainient/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css }) => ({\n  root: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 0;\n    inset: 0;\n\n    overflow: hidden;\n\n    canvas {\n      position: absolute;\n      inset: 0;\n\n      display: block;\n\n      inline-size: 100%;\n      block-size: 100%;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,WAAW,EACrD,MAAM,GAAG;;;;;;;;;;;;;;;;;;IAmBX,EAAE"}

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

@@ -0,0 +1,122 @@
+import { DivProps } from "../../types/index.mjs";
+//#region src/awesome/Grainient/type.d.ts
+interface GrainientProps extends DivProps {
+  /**
+   * Angle of the color blend, in degrees.
+   * @default 0
+   */
+  blendAngle?: number;
+  /**
+   * Softness of the color edges.
+   * @default 0.05
+   */
+  blendSoftness?: number;
+  /**
+   * Horizontal offset of the field center.
+   * @default 0
+   */
+  centerX?: number;
+  /**
+   * Vertical offset of the field center.
+   * @default 0
+   */
+  centerY?: number;
+  /**
+   * First color stop, as hex.
+   * @default '#FF9FFC'
+   */
+  color1?: string;
+  /**
+   * Second color stop, as hex.
+   * @default '#5227FF'
+   */
+  color2?: string;
+  /**
+   * Third color stop, as hex.
+   * @default '#B497CF'
+   */
+  color3?: string;
+  /**
+   * Shifts the blend toward color1 (negative) or color3 (positive).
+   * @default 0
+   */
+  colorBalance?: number;
+  /**
+   * Output contrast.
+   * @default 1.5
+   */
+  contrast?: number;
+  /**
+   * Output gamma.
+   * @default 1
+   */
+  gamma?: number;
+  /**
+   * Film grain strength. 0 turns it off.
+   * @default 0.1
+   */
+  grainAmount?: number;
+  /**
+   * Animate the grain with time.
+   * @default false
+   */
+  grainAnimated?: boolean;
+  /**
+   * Film grain scale.
+   * @default 2
+   */
+  grainScale?: number;
+  /**
+   * Wash the colors toward white for a light surface. `'auto'` follows the current theme.
+   * @default false
+   */
+  lightMode?: boolean | 'auto';
+  /**
+   * Scale of the rotation noise.
+   * @default 2
+   */
+  noiseScale?: number;
+  /**
+   * Noise-driven rotation, in degrees.
+   * @default 500
+   */
+  rotationAmount?: number;
+  /**
+   * Output saturation.
+   * @default 1
+   */
+  saturation?: number;
+  /**
+   * Animation speed. A still frame is drawn when reduced motion is preferred.
+   * @default 0.25
+   */
+  timeSpeed?: number;
+  /**
+   * Warp amplitude divisor; higher is calmer.
+   * @default 50
+   */
+  warpAmplitude?: number;
+  /**
+   * Frequency of the warp waves.
+   * @default 5
+   */
+  warpFrequency?: number;
+  /**
+   * Speed of the warp waves.
+   * @default 2
+   */
+  warpSpeed?: number;
+  /**
+   * How strongly the field is warped.
+   * @default 1
+   */
+  warpStrength?: number;
+  /**
+   * Zoom of the field.
+   * @default 0.9
+   */
+  zoom?: number;
+}
+//#endregion
+export { GrainientProps };
+//# sourceMappingURL=type.d.mts.map

package/es/awesome/index.d.mts

@@ -35,6 +35,9 @@ import "./Giscus/index.mjs";
 import { GradientButtonProps } from "./GradientButton/type.mjs";
 import GradientButton from "./GradientButton/GradientButton.mjs";
 import "./GradientButton/index.mjs";
+import { GrainientProps } from "./Grainient/type.mjs";
+import Grainient from "./Grainient/Grainient.mjs";
+import "./Grainient/index.mjs";
 import { GridBackgroundProps, GridShowcaseProps } from "./GridBackground/type.mjs";
 import GridBackground from "./GridBackground/GridBackground.mjs";
 import GridShowcase from "./GridBackground/GridShowcase.mjs";
@@ -64,4 +67,4 @@ import "./Spotlight/index.mjs";
 import { CursorStyle, SegmentMode, TypewriterEffectProps } from "./TypewriterEffect/type.mjs";
 import TypewriterEffect from "./TypewriterEffect/TypewriterEffect.mjs";
 import "./TypewriterEffect/index.mjs";
-export { AgentSkillCard, type AgentSkillCardAgent, type AgentSkillCardMode, type AgentSkillCardPanel, type AgentSkillCardProps, AuroraBackground, type AuroraBackgroundProps, BentoCard, type BentoCardProps, BentoGrid, type BentoGridProps, BottomGradientButton, type BottomGradientButtonProps, CodeShowcase, type CodeShowcaseItem, type CodeShowcaseProps, type CursorStyle, DEFAULT_SKILL_AGENTS, FeatureGrid, type FeatureGridItem, type FeatureGridProps, type FeatureItemType, Features, type FeaturesProps, FluidGradient, type FluidGradientProps, Giscus, type GiscusProps, GradientButton, type GradientButtonProps, GridBackground, type GridBackgroundProps, GridShowcase, type GridShowcaseProps, Hero, type HeroAction, type HeroProps, InstallBanner, type InstallBannerProps, LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, type LandingAction, LandingHero, type LandingHeroAction, type LandingHeroProps, type LandingLinkProps, type LandingLinkRender, type LandingNavigate, type LandingPalette, LandingSection, type LandingSectionProps, LogoMarquee, type LogoMarqueeItem, type LogoMarqueeProps, type SegmentMode, Spline, type SplineProps, Spotlight, SpotlightCard, type SpotlightCardProps, type SpotlightProps, TypewriterEffect, type TypewriterEffectProps, accentGradient as landingAccentGradient };
+export { AgentSkillCard, type AgentSkillCardAgent, type AgentSkillCardMode, type AgentSkillCardPanel, type AgentSkillCardProps, AuroraBackground, type AuroraBackgroundProps, BentoCard, type BentoCardProps, BentoGrid, type BentoGridProps, BottomGradientButton, type BottomGradientButtonProps, CodeShowcase, type CodeShowcaseItem, type CodeShowcaseProps, type CursorStyle, DEFAULT_SKILL_AGENTS, FeatureGrid, type FeatureGridItem, type FeatureGridProps, type FeatureItemType, Features, type FeaturesProps, FluidGradient, type FluidGradientProps, Giscus, type GiscusProps, GradientButton, type GradientButtonProps, Grainient, type GrainientProps, GridBackground, type GridBackgroundProps, GridShowcase, type GridShowcaseProps, Hero, type HeroAction, type HeroProps, InstallBanner, type InstallBannerProps, LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, type LandingAction, LandingHero, type LandingHeroAction, type LandingHeroProps, type LandingLinkProps, type LandingLinkRender, type LandingNavigate, type LandingPalette, LandingSection, type LandingSectionProps, LogoMarquee, type LogoMarqueeItem, type LogoMarqueeProps, type SegmentMode, Spline, type SplineProps, Spotlight, SpotlightCard, type SpotlightCardProps, type SpotlightProps, TypewriterEffect, type TypewriterEffectProps, accentGradient as landingAccentGradient };

package/es/awesome/index.mjs

@@ -13,6 +13,7 @@ import { LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, acce
 import FluidGradient from "./FluidGradient/FluidGradient.mjs";
 import Giscus from "./Giscus/Giscus.mjs";
 import GradientButton from "./GradientButton/GradientButton.mjs";
+import Grainient from "./Grainient/Grainient.mjs";
 import GridBackground from "./GridBackground/GridBackground.mjs";
 import GridShowcase from "./GridBackground/GridShowcase.mjs";
 import Hero from "./Hero/Hero.mjs";
@@ -22,4 +23,4 @@ import LandingSection from "./LandingSection/LandingSection.mjs";
 import LogoMarquee from "./LogoMarquee/LogoMarquee.mjs";
 import Spline from "./Spline/Spine.mjs";
 import TypewriterEffect from "./TypewriterEffect/TypewriterEffect.mjs";
-export { AgentSkillCard, AuroraBackground, BentoCard, BentoGrid, BottomGradientButton, CodeShowcase, DEFAULT_SKILL_AGENTS, FeatureGrid, Features, FluidGradient, Giscus, GradientButton, GridBackground, GridShowcase, Hero, InstallBanner, LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, LandingHero, LandingSection, LogoMarquee, Spline, Spotlight, SpotlightCard, TypewriterEffect, accentGradient as landingAccentGradient };
+export { AgentSkillCard, AuroraBackground, BentoCard, BentoGrid, BottomGradientButton, CodeShowcase, DEFAULT_SKILL_AGENTS, FeatureGrid, Features, FluidGradient, Giscus, GradientButton, Grainient, GridBackground, GridShowcase, Hero, InstallBanner, LANDING_GRADIENT_VAR, LANDING_PALETTE_DARK, LANDING_PALETTE_LIGHT, LandingHero, LandingSection, LogoMarquee, Spline, Spotlight, SpotlightCard, TypewriterEffect, accentGradient as landingAccentGradient };

package/es/base-ui/ActionIcon/style.mjs

@@ -6,11 +6,17 @@ const styles = createStaticStyles(({ css, cssVar }) => {
 	return {
 		active: staticStylish.active,
 		dangerRoot: css`
-      &&:hover {
+      /* Mirrors the neutral ladder (colorTextTertiary -> colorTextSecondary -> colorText):
+         a softened red at rest, full colorError on hover, colorErrorActive when pressed. */
+      &&& {
+        color: color-mix(in srgb, ${cssVar.colorError} 66%, transparent);
+      }
+
+      &&&:hover:not(:disabled, [aria-disabled='true']) {
         color: ${cssVar.colorError};
       }
 
-      &&:active {
+      &&&:active:not(:disabled, [aria-disabled='true']) {
         color: ${cssVar.colorErrorActive};
       }
     `,

package/es/base-ui/ActionIcon/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/ActionIcon/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: lobeStaticStylish.active,\n    // && outranks base-ui Button's variant classes regardless of style insertion order\n    dangerRoot: css`\n      &&:hover {\n        color: ${cssVar.colorError};\n      }\n\n      &&:active {\n        color: ${cssVar.colorErrorActive};\n      }\n    `,\n    glass: lobeStaticStylish.blur,\n    root: css`\n      && {\n        color: ${cssVar.colorTextTertiary};\n      }\n\n      &&:hover {\n        color: ${cssVar.colorTextSecondary};\n      }\n\n      &&:active {\n        color: ${cssVar.colorText};\n      }\n    `,\n    shadow: lobeStaticStylish.shadow,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    active: false,\n    danger: false,\n    glass: false,\n    shadow: false,\n  },\n\n  variants: {\n    active: {\n      false: null,\n      true: styles.active,\n    },\n    danger: {\n      false: null,\n      true: styles.dangerRoot,\n    },\n    glass: {\n      false: null,\n      true: styles.glass,\n    },\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQA,cAAkB;EAE1B,YAAY,GAAG;;iBAEF,OAAO,WAAW;;;;iBAIlB,OAAO,iBAAiB;;;EAGrC,OAAOA,cAAkB;EACzB,MAAM,GAAG;;iBAEI,OAAO,kBAAkB;;;;iBAIzB,OAAO,mBAAmB;;;;iBAI1B,OAAO,UAAU;;;EAG9B,QAAQA,cAAkB;CAC5B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;CACV;CAEA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,OAAO;GACL,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;CACF;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../../src/base-ui/ActionIcon/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    active: lobeStaticStylish.active,\n    // &&& outranks both base-ui Button's variant classes and this file's own `root` color\n    // (same `&&` weight, inserted later), so the icon itself turns red, not just the fill.\n    dangerRoot: css`\n      /* Mirrors the neutral ladder (colorTextTertiary -> colorTextSecondary -> colorText):\n         a softened red at rest, full colorError on hover, colorErrorActive when pressed. */\n      &&& {\n        color: color-mix(in srgb, ${cssVar.colorError} 66%, transparent);\n      }\n\n      &&&:hover:not(:disabled, [aria-disabled='true']) {\n        color: ${cssVar.colorError};\n      }\n\n      &&&:active:not(:disabled, [aria-disabled='true']) {\n        color: ${cssVar.colorErrorActive};\n      }\n    `,\n    glass: lobeStaticStylish.blur,\n    root: css`\n      && {\n        color: ${cssVar.colorTextTertiary};\n      }\n\n      &&:hover {\n        color: ${cssVar.colorTextSecondary};\n      }\n\n      &&:active {\n        color: ${cssVar.colorText};\n      }\n    `,\n    shadow: lobeStaticStylish.shadow,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    active: false,\n    danger: false,\n    glass: false,\n    shadow: false,\n  },\n\n  variants: {\n    active: {\n      false: null,\n      true: styles.active,\n    },\n    danger: {\n      false: null,\n      true: styles.dangerRoot,\n    },\n    glass: {\n      false: null,\n      true: styles.glass,\n    },\n    shadow: {\n      false: null,\n      true: styles.shadow,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,OAAO;EACL,QAAQA,cAAkB;EAG1B,YAAY,GAAG;;;;oCAIiB,OAAO,WAAW;;;;iBAIrC,OAAO,WAAW;;;;iBAIlB,OAAO,iBAAiB;;;EAGrC,OAAOA,cAAkB;EACzB,MAAM,GAAG;;iBAEI,OAAO,kBAAkB;;;;iBAIzB,OAAO,mBAAmB;;;;iBAI1B,OAAO,UAAU;;;EAG9B,QAAQA,cAAkB;CAC5B;AACF,CAAC;AAED,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;CACV;CAEA,UAAU;EACR,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;EACA,OAAO;GACL,OAAO;GACP,MAAM,OAAO;EACf;EACA,QAAQ;GACN,OAAO;GACP,MAAM,OAAO;EACf;CACF;AACF,CAAC"}

package/es/dashboard/AuthLayout/Aside.d.mts

@@ -0,0 +1,10 @@
+import { AuthLayoutAsideProps } from "./type.mjs";
+//#region src/dashboard/AuthLayout/Aside.d.ts
+/** Inset art panel for `AuthLayout`'s `aside` slot, with a scrim and copy at the bottom. */
+declare function AuthLayoutAside({ background, className, kicker, line, ...rest }: AuthLayoutAsideProps): import("react").JSX.Element;
+declare namespace AuthLayoutAside {
+  var displayName: string;
+}
+//#endregion
+export { AuthLayoutAside as default };
+//# sourceMappingURL=Aside.d.mts.map