@hubstr/kit 0.1.5 → 0.1.6

package/ui/es/awesome/Hero/style.mjs

@@ -0,0 +1,71 @@
+import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
+import { createStaticStyles, responsive } from "antd-style";
+//#region src/awesome/Hero/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	actions: css`
+    margin-block-start: 24px;
+
+    button {
+      padding-inline: 32px !important;
+      font-weight: 500;
+    }
+
+    ${responsive.sm} {
+      flex-direction: column;
+      gap: 16px;
+      width: 100%;
+      margin-block-start: 24px;
+
+      button {
+        width: 100%;
+      }
+    }
+  `,
+	container: css`
+    position: relative;
+    box-sizing: border-box;
+    text-align: center;
+  `,
+	desc: css`
+    margin-block-start: 0;
+    font-size: ${cssVar.fontSizeHeading3};
+    color: ${cssVar.colorTextSecondary};
+    text-align: center;
+
+    ${responsive.sm} {
+      margin-block: 24px;
+      margin-inline: 16px;
+      font-size: ${cssVar.fontSizeHeading5};
+    }
+  `,
+	title: css`
+    z-index: 10;
+
+    margin: 0;
+
+    font-size: min(100px, 10vw);
+    line-height: 1.2;
+    text-align: center;
+
+    b {
+      ${staticStylish.gradientAnimation}
+      position: relative;
+      z-index: 5;
+      background-clip: text;
+
+      -webkit-text-fill-color: transparent;
+
+      &::selection {
+        -webkit-text-fill-color: #000 !important;
+      }
+    }
+
+    ${responsive.sm} {
+      font-size: 64px;
+    }
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/ui/es/awesome/Hero/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":["hubstrStaticStylish"],"sources":["../../../src/awesome/Hero/style.ts"],"sourcesContent":["import { createStaticStyles, responsive } from 'antd-style';\r\n\r\nimport { hubstrStaticStylish } from '../../styles';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  actions: css`\r\n    margin-block-start: 24px;\r\n\r\n    button {\r\n      padding-inline: 32px !important;\r\n      font-weight: 500;\r\n    }\r\n\r\n    ${responsive.sm} {\r\n      flex-direction: column;\r\n      gap: 16px;\r\n      width: 100%;\r\n      margin-block-start: 24px;\r\n\r\n      button {\r\n        width: 100%;\r\n      }\r\n    }\r\n  `,\r\n\r\n  container: css`\r\n    position: relative;\r\n    box-sizing: border-box;\r\n    text-align: center;\r\n  `,\r\n\r\n  desc: css`\r\n    margin-block-start: 0;\r\n    font-size: ${cssVar.fontSizeHeading3};\r\n    color: ${cssVar.colorTextSecondary};\r\n    text-align: center;\r\n\r\n    ${responsive.sm} {\r\n      margin-block: 24px;\r\n      margin-inline: 16px;\r\n      font-size: ${cssVar.fontSizeHeading5};\r\n    }\r\n  `,\r\n  title: css`\r\n    z-index: 10;\r\n\r\n    margin: 0;\r\n\r\n    font-size: min(100px, 10vw);\r\n    line-height: 1.2;\r\n    text-align: center;\r\n\r\n    b {\r\n      ${hubstrStaticStylish.gradientAnimation}\r\n      position: relative;\r\n      z-index: 5;\r\n      background-clip: text;\r\n\r\n      -webkit-text-fill-color: transparent;\r\n\r\n      &::selection {\r\n        -webkit-text-fill-color: #000 !important;\r\n      }\r\n    }\r\n\r\n    ${responsive.sm} {\r\n      font-size: 64px;\r\n    }\r\n  `,\r\n}));\r\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,SAAS,GAAG;;;;;;;;MAQR,WAAW,GAAG;;;;;;;;;;;CAYlB,WAAW,GAAG;;;;;CAMd,MAAM,GAAG;;iBAEM,OAAO,iBAAiB;aAC5B,OAAO,mBAAmB;;;MAGjC,WAAW,GAAG;;;mBAGD,OAAO,iBAAiB;;;CAGzC,OAAO,GAAG;;;;;;;;;;QAUJA,cAAoB,kBAAkB;;;;;;;;;;;;MAYxC,WAAW,GAAG;;;;CAInB,EAAE"}

package/ui/es/awesome/Hero/type.d.mts

@@ -0,0 +1,22 @@
+import { ComponentType, ReactNode } from "react";
+
+//#region src/awesome/Hero/type.d.ts
+interface HeroAction {
+  github?: boolean;
+  link: string;
+  openExternal?: boolean;
+  text: string;
+  type?: 'primary' | 'default';
+}
+interface HeroProps {
+  actions?: HeroAction[];
+  description?: string;
+  Link?: ComponentType<{
+    children?: ReactNode;
+    to?: string;
+  }>;
+  title?: string;
+}
+//#endregion
+export { HeroAction, HeroProps };
+//# sourceMappingURL=type.d.mts.map

package/ui/es/awesome/Spline/ParentSize.mjs

@@ -0,0 +1,71 @@
+import { memo, useEffect, useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { debounce } from "es-toolkit/compat";
+import { mergeRefs } from "react-merge-refs";
+//#region src/awesome/Spline/ParentSize.tsx
+const defaultIgnoreDimensions = [];
+const defaultParentSizeStyles = {
+	height: "100%",
+	width: "100%"
+};
+const ParentSize = memo(({ ref, className, children, debounceTime = 300, ignoreDimensions = defaultIgnoreDimensions, parentSizeStyles, enableDebounceLeadingCall = true, resizeObserverPolyfill, ...restProps }) => {
+	const target = useRef(null);
+	const animationFrameID = useRef(0);
+	const [state, setState] = useState({
+		height: 0,
+		left: 0,
+		top: 0,
+		width: 0
+	});
+	const resize = useMemo(() => {
+		const normalized = Array.isArray(ignoreDimensions) ? ignoreDimensions : [ignoreDimensions];
+		return debounce((incoming) => {
+			setState((existing) => {
+				return Object.keys(existing).filter((key) => existing[key] !== incoming[key]).every((key) => normalized.includes(key)) ? existing : incoming;
+			});
+		}, debounceTime, { leading: enableDebounceLeadingCall });
+	}, [
+		debounceTime,
+		enableDebounceLeadingCall,
+		ignoreDimensions
+	]);
+	useEffect(() => {
+		const observer = new (resizeObserverPolyfill || window.ResizeObserver)((entries) => {
+			for (const entry of entries) {
+				const { left, top, width, height } = entry?.contentRect ?? {};
+				animationFrameID.current = window.requestAnimationFrame(() => {
+					resize({
+						height,
+						left,
+						top,
+						width
+					});
+				});
+			}
+		});
+		if (target.current) observer.observe(target.current);
+		return () => {
+			window.cancelAnimationFrame(animationFrameID.current);
+			observer.disconnect();
+			resize.cancel();
+		};
+	}, [resize, resizeObserverPolyfill]);
+	return /* @__PURE__ */ jsx("div", {
+		className,
+		ref: mergeRefs([ref, target]),
+		style: {
+			...defaultParentSizeStyles,
+			...parentSizeStyles
+		},
+		...restProps,
+		children: children({
+			...state,
+			ref: target.current,
+			resize
+		})
+	});
+});
+//#endregion
+export { ParentSize as default };
+
+//# sourceMappingURL=ParentSize.mjs.map

package/ui/es/awesome/Spline/ParentSize.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParentSize.mjs","names":[],"sources":["../../../src/awesome/Spline/ParentSize.tsx"],"sourcesContent":["import { debounce } from 'es-toolkit/compat';\r\nimport {\r\n  type CSSProperties,\r\n  memo,\r\n  type ReactNode,\r\n  type Ref,\r\n  useEffect,\r\n  useMemo,\r\n  useRef,\r\n  useState,\r\n} from 'react';\r\nimport { mergeRefs } from 'react-merge-refs';\r\n\r\ninterface ResizeObserverCallback {\r\n  (entries: ResizeObserverEntry[], observer: ResizeObserver): void;\r\n}\r\n\r\ninterface ResizeObserverPolyfill {\r\n  new (callback: ResizeObserverCallback): ResizeObserver;\r\n}\r\n\r\n// @TODO remove when upgraded to TS 4 which has its own declaration\r\ninterface PrivateWindow {\r\n  ResizeObserver: ResizeObserverPolyfill;\r\n}\r\n\r\nexport interface ParentSizeProps {\r\n  /** Child render function `({ width, height, top, left, ref, resize }) => ReactNode`. */\r\n  children: (\r\n    args: {\r\n      ref: HTMLDivElement | null;\r\n      resize: (state: ParentSizeState) => void;\r\n    } & ParentSizeState,\r\n  ) => ReactNode;\r\n  /** Optional `className` to add to the parent `div` wrapper used for size measurement. */\r\n  className?: string;\r\n  /** Child render updates upon resize are delayed until `debounceTime` milliseconds _after_ the last resize event is observed. */\r\n  debounceTime?: number;\r\n  /** Optional flag to toggle leading debounce calls. When set to true this will ensure that the component always renders immediately. (defaults to true) */\r\n  enableDebounceLeadingCall?: boolean;\r\n  /** Optional dimensions provided won't trigger a state change when changed. */\r\n  ignoreDimensions?: keyof ParentSizeState | (keyof ParentSizeState)[];\r\n  /** Optional `style` object to apply to the parent `div` wrapper used for size measurement. */\r\n  parentSizeStyles?: CSSProperties;\r\n  ref?: Ref<HTMLDivElement>;\r\n  /** Optionally inject a ResizeObserver polyfill, else this *must* be globally available. */\r\n  resizeObserverPolyfill?: ResizeObserverPolyfill;\r\n}\r\n\r\ntype ParentSizeState = {\r\n  height: number;\r\n  left: number;\r\n  top: number;\r\n  width: number;\r\n};\r\n\r\nexport type ParentSizeProvidedProps = ParentSizeState;\r\n\r\nconst defaultIgnoreDimensions: ParentSizeProps['ignoreDimensions'] = [];\r\nconst defaultParentSizeStyles = { height: '100%', width: '100%' };\r\n\r\nconst ParentSize = memo<ParentSizeProps>(\r\n  ({\r\n    ref,\r\n    className,\r\n    children,\r\n    debounceTime = 300,\r\n    ignoreDimensions = defaultIgnoreDimensions,\r\n    parentSizeStyles,\r\n    enableDebounceLeadingCall = true,\r\n    resizeObserverPolyfill,\r\n    ...restProps\r\n  }) => {\r\n    const target = useRef<HTMLDivElement | null>(null);\r\n    const animationFrameID = useRef(0);\r\n\r\n    const [state, setState] = useState<ParentSizeState>({\r\n      height: 0,\r\n      left: 0,\r\n      top: 0,\r\n      width: 0,\r\n    });\r\n\r\n    const resize = useMemo(() => {\r\n      const normalized = Array.isArray(ignoreDimensions) ? ignoreDimensions : [ignoreDimensions];\r\n\r\n      return debounce(\r\n        (incoming: ParentSizeState) => {\r\n          setState((existing) => {\r\n            const stateKeys = Object.keys(existing) as (keyof ParentSizeState)[];\r\n            const keysWithChanges = stateKeys.filter((key) => existing[key] !== incoming[key]);\r\n            const shouldBail = keysWithChanges.every((key) => normalized.includes(key));\r\n\r\n            return shouldBail ? existing : incoming;\r\n          });\r\n        },\r\n        debounceTime,\r\n        { leading: enableDebounceLeadingCall },\r\n      );\r\n    }, [debounceTime, enableDebounceLeadingCall, ignoreDimensions]);\r\n\r\n    useEffect(() => {\r\n      const LocalResizeObserver =\r\n        resizeObserverPolyfill || (window as unknown as PrivateWindow).ResizeObserver;\r\n\r\n      const observer = new LocalResizeObserver((entries) => {\r\n        for (const entry of entries) {\r\n          const { left, top, width, height } = entry?.contentRect ?? {};\r\n          animationFrameID.current = window.requestAnimationFrame(() => {\r\n            resize({ height, left, top, width });\r\n          });\r\n        }\r\n      });\r\n      if (target.current) observer.observe(target.current);\r\n\r\n      return () => {\r\n        window.cancelAnimationFrame(animationFrameID.current);\r\n        observer.disconnect();\r\n        resize.cancel();\r\n      };\r\n    }, [resize, resizeObserverPolyfill]);\r\n\r\n    return (\r\n      <div\r\n        className={className}\r\n        ref={mergeRefs<HTMLDivElement>([ref, target])}\r\n        style={{ ...defaultParentSizeStyles, ...parentSizeStyles }}\r\n        {...restProps}\r\n      >\r\n        {children({\r\n          ...state,\r\n          ref: target.current,\r\n          resize,\r\n        })}\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nexport default ParentSize;\r\n"],"mappings":";;;;;AA0DA,MAAM,0BAA+D,EAAE;AACvE,MAAM,0BAA0B;CAAE,QAAQ;CAAQ,OAAO;CAAQ;AAEjE,MAAM,aAAa,MAChB,EACC,KACA,WACA,UACA,eAAe,KACf,mBAAmB,yBACnB,kBACA,4BAA4B,MAC5B,wBACA,GAAG,gBACC;CACJ,MAAM,SAAS,OAA8B,KAAK;CAClD,MAAM,mBAAmB,OAAO,EAAE;CAElC,MAAM,CAAC,OAAO,YAAY,SAA0B;EAClD,QAAQ;EACR,MAAM;EACN,KAAK;EACL,OAAO;EACR,CAAC;CAEF,MAAM,SAAS,cAAc;EAC3B,MAAM,aAAa,MAAM,QAAQ,iBAAiB,GAAG,mBAAmB,CAAC,iBAAiB;AAE1F,SAAO,UACJ,aAA8B;AAC7B,aAAU,aAAa;AAKrB,WAJkB,OAAO,KAAK,SACG,CAAC,QAAQ,QAAQ,SAAS,SAAS,SAAS,KAC3C,CAAC,OAAO,QAAQ,WAAW,SAAS,IAAI,CAEzD,GAAG,WAAW;KAC/B;KAEJ,cACA,EAAE,SAAS,2BAA2B,CACvC;IACA;EAAC;EAAc;EAA2B;EAAiB,CAAC;AAE/D,iBAAgB;EAId,MAAM,WAAW,KAFf,0BAA2B,OAAoC,iBAEvB,YAAY;AACpD,QAAK,MAAM,SAAS,SAAS;IAC3B,MAAM,EAAE,MAAM,KAAK,OAAO,WAAW,OAAO,eAAe,EAAE;AAC7D,qBAAiB,UAAU,OAAO,4BAA4B;AAC5D,YAAO;MAAE;MAAQ;MAAM;MAAK;MAAO,CAAC;MACpC;;IAEJ;AACF,MAAI,OAAO,QAAS,UAAS,QAAQ,OAAO,QAAQ;AAEpD,eAAa;AACX,UAAO,qBAAqB,iBAAiB,QAAQ;AACrD,YAAS,YAAY;AACrB,UAAO,QAAQ;;IAEhB,CAAC,QAAQ,uBAAuB,CAAC;AAEpC,QACE,oBAAC,OAAD;EACa;EACX,KAAK,UAA0B,CAAC,KAAK,OAAO,CAAC;EAC7C,OAAO;GAAE,GAAG;GAAyB,GAAG;GAAkB;EAC1D,GAAI;YAEH,SAAS;GACR,GAAG;GACH,KAAK,OAAO;GACZ;GACD,CAAC;EACE,CAAA;EAGX"}

package/ui/es/awesome/Spline/Spine.d.mts

@@ -0,0 +1,7 @@
+import { SplineProps } from "./type.mjs";
+import * as _$react from "react";
+//#region src/awesome/Spline/Spine.d.ts
+declare const Spline: _$react.NamedExoticComponent<SplineProps>;
+//#endregion
+export { Spline };
+//# sourceMappingURL=Spine.d.mts.map

package/ui/es/awesome/Spline/Spine.mjs

@@ -0,0 +1,83 @@
+"use client";
+import ParentSize from "./ParentSize.mjs";
+import { memo, useEffect, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { Application } from "@splinetool/runtime";
+//#region src/awesome/Spline/Spine.tsx
+const Spline = memo(({ ref, scene, style, onMouseDown, onMouseUp, onMouseHover, onKeyDown, onKeyUp, onStart, onLookAt, onFollow, onWheel, onLoad, renderOnDemand = true, ...props }) => {
+	const canvasRef = useRef(null);
+	const [isLoading, setIsLoading] = useState(true);
+	const init = async (speApp, events) => {
+		await speApp.load(scene);
+		for (const event of events) if (event.cb) speApp.addEventListener(event.name, event.cb);
+		setIsLoading(false);
+		onLoad?.(speApp);
+	};
+	useEffect(() => {
+		setIsLoading(true);
+		let speApp;
+		const events = [
+			{
+				cb: onMouseDown,
+				name: "mouseDown"
+			},
+			{
+				cb: onMouseUp,
+				name: "mouseUp"
+			},
+			{
+				cb: onMouseHover,
+				name: "mouseHover"
+			},
+			{
+				cb: onKeyDown,
+				name: "keyDown"
+			},
+			{
+				cb: onKeyUp,
+				name: "keyUp"
+			},
+			{
+				cb: onStart,
+				name: "start"
+			},
+			{
+				cb: onLookAt,
+				name: "lookAt"
+			},
+			{
+				cb: onFollow,
+				name: "follow"
+			},
+			{
+				cb: onWheel,
+				name: "scroll"
+			}
+		];
+		if (canvasRef.current) {
+			speApp = new Application(canvasRef.current, { renderOnDemand });
+			init(speApp, events);
+		}
+		return () => {
+			for (const event of events) if (event.cb) speApp.removeEventListener(event.name, event.cb);
+			speApp.dispose();
+		};
+	}, [scene]);
+	return /* @__PURE__ */ jsx(ParentSize, {
+		debounceTime: 50,
+		parentSizeStyles: style,
+		ref,
+		...props,
+		children: () => {
+			return /* @__PURE__ */ jsx("canvas", {
+				ref: canvasRef,
+				style: { display: isLoading ? "none" : "block" }
+			});
+		}
+	});
+});
+Spline.displayName = "Spline";
+//#endregion
+export { Spline as default };
+
+//# sourceMappingURL=Spine.mjs.map

package/ui/es/awesome/Spline/Spine.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spine.mjs","names":[],"sources":["../../../src/awesome/Spline/Spine.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { type SplineEvent, type SplineEventName } from '@splinetool/runtime';\r\nimport { Application } from '@splinetool/runtime';\r\nimport { memo, useEffect, useRef, useState } from 'react';\r\n\r\nimport ParentSize from './ParentSize';\r\nimport { type SplineProps } from './type';\r\n\r\nconst Spline = memo<SplineProps>(\r\n  ({\r\n    ref,\r\n    scene,\r\n    style,\r\n    onMouseDown,\r\n    onMouseUp,\r\n    onMouseHover,\r\n    onKeyDown,\r\n    onKeyUp,\r\n    onStart,\r\n    onLookAt,\r\n    onFollow,\r\n    onWheel,\r\n    onLoad,\r\n    renderOnDemand = true,\r\n    ...props\r\n  }) => {\r\n    const canvasRef = useRef<HTMLCanvasElement>(null);\r\n    const [isLoading, setIsLoading] = useState(true);\r\n\r\n    const init = async (\r\n      speApp: Application,\r\n      events: {\r\n        cb?: (e: SplineEvent) => void;\r\n        name: SplineEventName;\r\n      }[],\r\n    ) => {\r\n      await speApp.load(scene);\r\n\r\n      for (const event of events) {\r\n        if (event.cb) {\r\n          speApp.addEventListener(event.name, event.cb);\r\n        }\r\n      }\r\n\r\n      setIsLoading(false);\r\n      onLoad?.(speApp);\r\n    };\r\n\r\n    // Initialize runtime when component is mounted\r\n    useEffect(() => {\r\n      setIsLoading(true);\r\n\r\n      let speApp: Application;\r\n      const events: {\r\n        cb?: (e: SplineEvent) => void;\r\n        name: SplineEventName;\r\n      }[] = [\r\n        {\r\n          cb: onMouseDown,\r\n          name: 'mouseDown',\r\n        },\r\n        {\r\n          cb: onMouseUp,\r\n          name: 'mouseUp',\r\n        },\r\n        {\r\n          cb: onMouseHover,\r\n          name: 'mouseHover',\r\n        },\r\n        {\r\n          cb: onKeyDown,\r\n          name: 'keyDown',\r\n        },\r\n        {\r\n          cb: onKeyUp,\r\n          name: 'keyUp',\r\n        },\r\n        {\r\n          cb: onStart,\r\n          name: 'start',\r\n        },\r\n        {\r\n          cb: onLookAt,\r\n          name: 'lookAt',\r\n        },\r\n        {\r\n          cb: onFollow,\r\n          name: 'follow',\r\n        },\r\n        {\r\n          cb: onWheel,\r\n          name: 'scroll',\r\n        },\r\n      ];\r\n\r\n      if (canvasRef.current) {\r\n        speApp = new Application(canvasRef.current, { renderOnDemand });\r\n        init(speApp, events);\r\n      }\r\n\r\n      return () => {\r\n        for (const event of events) {\r\n          if (event.cb) {\r\n            speApp.removeEventListener(event.name, event.cb);\r\n          }\r\n        }\r\n        speApp.dispose();\r\n      };\r\n      // eslint-disable-next-line react-hooks/exhaustive-deps\r\n    }, [scene]);\r\n\r\n    return (\r\n      <ParentSize debounceTime={50} parentSizeStyles={style} ref={ref} {...props}>\r\n        {() => {\r\n          return (\r\n            <canvas\r\n              ref={canvasRef}\r\n              style={{\r\n                display: isLoading ? 'none' : 'block',\r\n              }}\r\n            />\r\n          );\r\n        }}\r\n      </ParentSize>\r\n    );\r\n  },\r\n);\r\n\r\nSpline.displayName = 'Spline';\r\n\r\nexport default Spline;\r\n\r\nexport { type SPEObject, type SplineEvent, type SplineEventName } from '@splinetool/runtime';\r\n"],"mappings":";;;;;;AASA,MAAM,SAAS,MACZ,EACC,KACA,OACA,OACA,aACA,WACA,cACA,WACA,SACA,SACA,UACA,UACA,SACA,QACA,iBAAiB,MACjB,GAAG,YACC;CACJ,MAAM,YAAY,OAA0B,KAAK;CACjD,MAAM,CAAC,WAAW,gBAAgB,SAAS,KAAK;CAEhD,MAAM,OAAO,OACX,QACA,WAIG;AACH,QAAM,OAAO,KAAK,MAAM;AAExB,OAAK,MAAM,SAAS,OAClB,KAAI,MAAM,GACR,QAAO,iBAAiB,MAAM,MAAM,MAAM,GAAG;AAIjD,eAAa,MAAM;AACnB,WAAS,OAAO;;AAIlB,iBAAgB;AACd,eAAa,KAAK;EAElB,IAAI;EACJ,MAAM,SAGA;GACJ;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACD;IACE,IAAI;IACJ,MAAM;IACP;GACF;AAED,MAAI,UAAU,SAAS;AACrB,YAAS,IAAI,YAAY,UAAU,SAAS,EAAE,gBAAgB,CAAC;AAC/D,QAAK,QAAQ,OAAO;;AAGtB,eAAa;AACX,QAAK,MAAM,SAAS,OAClB,KAAI,MAAM,GACR,QAAO,oBAAoB,MAAM,MAAM,MAAM,GAAG;AAGpD,UAAO,SAAS;;IAGjB,CAAC,MAAM,CAAC;AAEX,QACE,oBAAC,YAAD;EAAY,cAAc;EAAI,kBAAkB;EAAY;EAAK,GAAI;kBAC5D;AACL,UACE,oBAAC,UAAD;IACE,KAAK;IACL,OAAO,EACL,SAAS,YAAY,SAAS,SAC/B;IACD,CAAA;;EAGK,CAAA;EAGlB;AAED,OAAO,cAAc"}

package/ui/es/awesome/Spline/index.d.mts

@@ -0,0 +1,2 @@
+import { SplineProps } from "./type.mjs";
+import { Spline } from "./Spine.mjs";

package/ui/es/awesome/Spline/type.d.mts

@@ -0,0 +1,22 @@
+import { HTMLAttributes, Ref } from "react";
+import { Application, SplineEvent } from "@splinetool/runtime";
+
+//#region src/awesome/Spline/type.d.ts
+interface SplineProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onLoad' | 'onMouseDown' | 'onMouseUp' | 'onMouseHover' | 'onKeyDown' | 'onKeyUp' | 'onWheel'> {
+  onFollow?: (e: SplineEvent) => void;
+  onKeyDown?: (e: SplineEvent) => void;
+  onKeyUp?: (e: SplineEvent) => void;
+  onLoad?: (e: Application) => void;
+  onLookAt?: (e: SplineEvent) => void;
+  onMouseDown?: (e: SplineEvent) => void;
+  onMouseHover?: (e: SplineEvent) => void;
+  onMouseUp?: (e: SplineEvent) => void;
+  onStart?: (e: SplineEvent) => void;
+  onWheel?: (e: SplineEvent) => void;
+  ref?: Ref<HTMLDivElement>;
+  renderOnDemand?: boolean;
+  scene: string;
+}
+//#endregion
+export { SplineProps };
+//# sourceMappingURL=type.d.mts.map

package/ui/es/awesome/Spotlight/Spotlight.d.mts

@@ -0,0 +1,8 @@
+import { SpotlightProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/awesome/Spotlight/Spotlight.d.ts
+declare const Spotlight: _$react.NamedExoticComponent<SpotlightProps>;
+//#endregion
+export { Spotlight };
+//# sourceMappingURL=Spotlight.d.mts.map

package/ui/es/awesome/Spotlight/Spotlight.mjs

@@ -0,0 +1,32 @@
+"use client";
+import { styles } from "./style.mjs";
+import { useMouseOffset } from "./useMouseOffset.mjs";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/awesome/Spotlight/Spotlight.tsx
+const Spotlight = memo(({ className, size = 64, ...properties }) => {
+	const [offset, outside, reference] = useMouseOffset();
+	const { isDarkMode } = useThemeMode();
+	const cssVariables = useMemo(() => ({
+		"--spotlight-opacity": outside ? "0" : "0.1",
+		"--spotlight-size": `${size}px`,
+		"--spotlight-x": `${offset?.x ?? 0}px`,
+		"--spotlight-y": `${offset?.y ?? 0}px`
+	}), [
+		offset,
+		size,
+		outside
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(isDarkMode ? outside ? styles.spotlightDarkOutside : styles.spotlightDark : outside ? styles.spotlightLightOutside : styles.spotlightLight, className),
+		ref: reference,
+		style: cssVariables,
+		...properties
+	});
+});
+Spotlight.displayName = "Spotlight";
+//#endregion
+export { Spotlight as default };
+
+//# sourceMappingURL=Spotlight.mjs.map

package/ui/es/awesome/Spotlight/Spotlight.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spotlight.mjs","names":[],"sources":["../../../src/awesome/Spotlight/Spotlight.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport { memo, useMemo } from 'react';\r\n\r\nimport { styles } from './style';\r\nimport type { SpotlightProps } from './type';\r\nimport { useMouseOffset } from './useMouseOffset';\r\n\r\nconst Spotlight = memo<SpotlightProps>(({ className, size = 64, ...properties }) => {\r\n  const [offset, outside, reference] = useMouseOffset();\r\n  const { isDarkMode } = useThemeMode();\r\n\r\n  const cssVariables = useMemo<Record<string, string>>(\r\n    () => ({\r\n      '--spotlight-opacity': outside ? '0' : '0.1',\r\n      '--spotlight-size': `${size}px`,\r\n      '--spotlight-x': `${offset?.x ?? 0}px`,\r\n      '--spotlight-y': `${offset?.y ?? 0}px`,\r\n    }),\r\n    [offset, size, outside],\r\n  );\r\n\r\n  const spotlightStyle = isDarkMode\r\n    ? outside\r\n      ? styles.spotlightDarkOutside\r\n      : styles.spotlightDark\r\n    : outside\r\n      ? styles.spotlightLightOutside\r\n      : styles.spotlightLight;\r\n\r\n  return (\r\n    <div\r\n      className={cx(spotlightStyle, className)}\r\n      ref={reference}\r\n      style={cssVariables}\r\n      {...properties}\r\n    />\r\n  );\r\n});\r\n\r\nSpotlight.displayName = 'Spotlight';\r\n\r\nexport default Spotlight;\r\n"],"mappings":";;;;;;;AASA,MAAM,YAAY,MAAsB,EAAE,WAAW,OAAO,IAAI,GAAG,iBAAiB;CAClF,MAAM,CAAC,QAAQ,SAAS,aAAa,gBAAgB;CACrD,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,eAAe,eACZ;EACL,uBAAuB,UAAU,MAAM;EACvC,oBAAoB,GAAG,KAAK;EAC5B,iBAAiB,GAAG,QAAQ,KAAK,EAAE;EACnC,iBAAiB,GAAG,QAAQ,KAAK,EAAE;EACpC,GACD;EAAC;EAAQ;EAAM;EAAQ,CACxB;AAUD,QACE,oBAAC,OAAD;EACE,WAAW,GAVQ,aACnB,UACE,OAAO,uBACP,OAAO,gBACT,UACE,OAAO,wBACP,OAAO,gBAIqB,UAAU;EACxC,KAAK;EACL,OAAO;EACP,GAAI;EACJ,CAAA;EAEJ;AAEF,UAAU,cAAc"}

package/ui/es/awesome/Spotlight/index.d.mts

@@ -0,0 +1,2 @@
+import { SpotlightProps } from "./type.mjs";
+import { Spotlight } from "./Spotlight.mjs";

package/ui/es/awesome/Spotlight/style.mjs

@@ -0,0 +1,80 @@
+import { createStaticStyles } from "antd-style";
+//#region src/awesome/Spotlight/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	spotlightDark: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 1;
+    inset: 0;
+
+    border-radius: inherit;
+
+    opacity: var(--spotlight-opacity, 0.1);
+    background: radial-gradient(
+      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
+      ${cssVar.colorText},
+      transparent
+    );
+
+    transition: all 0.2s;
+  `,
+	spotlightDarkOutside: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 1;
+    inset: 0;
+
+    border-radius: inherit;
+
+    opacity: 0;
+    background: radial-gradient(
+      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
+      ${cssVar.colorText},
+      transparent
+    );
+
+    transition: all 0.2s;
+  `,
+	spotlightLight: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 1;
+    inset: 0;
+
+    border-radius: inherit;
+
+    opacity: var(--spotlight-opacity, 0.1);
+    background: radial-gradient(
+      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
+      #fff,
+      ${cssVar.colorTextQuaternary}
+    );
+
+    transition: all 0.2s;
+  `,
+	spotlightLightOutside: css`
+    pointer-events: none;
+
+    position: absolute;
+    z-index: 1;
+    inset: 0;
+
+    border-radius: inherit;
+
+    opacity: 0;
+    background: radial-gradient(
+      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
+      #fff,
+      ${cssVar.colorTextQuaternary}
+    );
+
+    transition: all 0.2s;
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/ui/es/awesome/Spotlight/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/Spotlight/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\r\n  spotlightDark: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    z-index: 1;\r\n    inset: 0;\r\n\r\n    border-radius: inherit;\r\n\r\n    opacity: var(--spotlight-opacity, 0.1);\r\n    background: radial-gradient(\r\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\r\n      ${cssVar.colorText},\r\n      transparent\r\n    );\r\n\r\n    transition: all 0.2s;\r\n  `,\r\n\r\n  spotlightDarkOutside: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    z-index: 1;\r\n    inset: 0;\r\n\r\n    border-radius: inherit;\r\n\r\n    opacity: 0;\r\n    background: radial-gradient(\r\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\r\n      ${cssVar.colorText},\r\n      transparent\r\n    );\r\n\r\n    transition: all 0.2s;\r\n  `,\r\n\r\n  spotlightLight: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    z-index: 1;\r\n    inset: 0;\r\n\r\n    border-radius: inherit;\r\n\r\n    opacity: var(--spotlight-opacity, 0.1);\r\n    background: radial-gradient(\r\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\r\n      #fff,\r\n      ${cssVar.colorTextQuaternary}\r\n    );\r\n\r\n    transition: all 0.2s;\r\n  `,\r\n\r\n  spotlightLightOutside: css`\r\n    pointer-events: none;\r\n\r\n    position: absolute;\r\n    z-index: 1;\r\n    inset: 0;\r\n\r\n    border-radius: inherit;\r\n\r\n    opacity: 0;\r\n    background: radial-gradient(\r\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\r\n      #fff,\r\n      ${cssVar.colorTextQuaternary}\r\n    );\r\n\r\n    transition: all 0.2s;\r\n  `,\r\n}));\r\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,eAAe,GAAG;;;;;;;;;;;;QAYZ,OAAO,UAAU;;;;;;CAOvB,sBAAsB,GAAG;;;;;;;;;;;;QAYnB,OAAO,UAAU;;;;;;CAOvB,gBAAgB,GAAG;;;;;;;;;;;;;QAab,OAAO,oBAAoB;;;;;CAMjC,uBAAuB,GAAG;;;;;;;;;;;;;QAapB,OAAO,oBAAoB;;;;;CAKlC,EAAE"}

package/ui/es/awesome/Spotlight/type.d.mts

@@ -0,0 +1,9 @@
+import { DivProps } from "../../types/index.mjs";
+
+//#region src/awesome/Spotlight/type.d.ts
+interface SpotlightProps extends DivProps {
+  size?: number;
+}
+//#endregion
+export { SpotlightProps };
+//# sourceMappingURL=type.d.mts.map

package/ui/es/awesome/Spotlight/useMouseOffset.mjs

@@ -0,0 +1,38 @@
+import { useEffect, useRef, useState } from "react";
+//#region src/awesome/Spotlight/useMouseOffset.ts
+const useMouseOffset = () => {
+	const [offset, setOffset] = useState();
+	const [outside, setOutside] = useState(true);
+	const reference = useRef(null);
+	useEffect(() => {
+		if (reference.current && reference.current.parentElement) {
+			const element = reference.current.parentElement;
+			const onMouseMove = (e) => {
+				const bound = element.getBoundingClientRect();
+				setOffset({
+					x: e.clientX - bound.x,
+					y: e.clientY - bound.y
+				});
+				setOutside(false);
+			};
+			const onMouseLeave = () => {
+				setOutside(true);
+			};
+			element.addEventListener("mousemove", onMouseMove);
+			element.addEventListener("mouseleave", onMouseLeave);
+			return () => {
+				element.removeEventListener("mousemove", onMouseMove);
+				element.removeEventListener("mouseleave", onMouseLeave);
+			};
+		}
+	}, []);
+	return [
+		offset,
+		outside,
+		reference
+	];
+};
+//#endregion
+export { useMouseOffset };
+
+//# sourceMappingURL=useMouseOffset.mjs.map

package/ui/es/awesome/Spotlight/useMouseOffset.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMouseOffset.mjs","names":[],"sources":["../../../src/awesome/Spotlight/useMouseOffset.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\r\n\r\nexport const useMouseOffset = (): any => {\r\n  const [offset, setOffset] = useState<{ x: number; y: number }>();\r\n  const [outside, setOutside] = useState(true);\r\n  const reference = useRef<HTMLDivElement>(null);\r\n\r\n  useEffect(() => {\r\n    if (reference.current && reference.current.parentElement) {\r\n      const element = reference.current.parentElement;\r\n\r\n      // debounce?\r\n      const onMouseMove = (e: MouseEvent) => {\r\n        const bound = element.getBoundingClientRect();\r\n        setOffset({ x: e.clientX - bound.x, y: e.clientY - bound.y });\r\n        setOutside(false);\r\n      };\r\n\r\n      const onMouseLeave = () => {\r\n        setOutside(true);\r\n      };\r\n      element.addEventListener('mousemove', onMouseMove);\r\n      element.addEventListener('mouseleave', onMouseLeave);\r\n      return () => {\r\n        element.removeEventListener('mousemove', onMouseMove);\r\n        element.removeEventListener('mouseleave', onMouseLeave);\r\n      };\r\n    }\r\n  }, []);\r\n\r\n  return [offset, outside, reference] as const;\r\n};\r\n"],"mappings":";;AAEA,MAAa,uBAA4B;CACvC,MAAM,CAAC,QAAQ,aAAa,UAAoC;CAChE,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAC5C,MAAM,YAAY,OAAuB,KAAK;AAE9C,iBAAgB;AACd,MAAI,UAAU,WAAW,UAAU,QAAQ,eAAe;GACxD,MAAM,UAAU,UAAU,QAAQ;GAGlC,MAAM,eAAe,MAAkB;IACrC,MAAM,QAAQ,QAAQ,uBAAuB;AAC7C,cAAU;KAAE,GAAG,EAAE,UAAU,MAAM;KAAG,GAAG,EAAE,UAAU,MAAM;KAAG,CAAC;AAC7D,eAAW,MAAM;;GAGnB,MAAM,qBAAqB;AACzB,eAAW,KAAK;;AAElB,WAAQ,iBAAiB,aAAa,YAAY;AAClD,WAAQ,iBAAiB,cAAc,aAAa;AACpD,gBAAa;AACX,YAAQ,oBAAoB,aAAa,YAAY;AACrD,YAAQ,oBAAoB,cAAc,aAAa;;;IAG1D,EAAE,CAAC;AAEN,QAAO;EAAC;EAAQ;EAAS;EAAU"}

package/ui/es/awesome/SpotlightCard/SpotlightCard.d.mts

@@ -0,0 +1,8 @@
+import { SpotlightCardProps } from "./type.mjs";
+import * as _$react from "react";
+
+//#region src/awesome/SpotlightCard/SpotlightCard.d.ts
+declare const SpotlightCard: _$react.NamedExoticComponent<SpotlightCardProps<any>>;
+//#endregion
+export { SpotlightCard };
+//# sourceMappingURL=SpotlightCard.d.mts.map

package/ui/es/awesome/SpotlightCard/SpotlightCard.mjs

@@ -0,0 +1,55 @@
+"use client";
+import Grid from "../../Grid/Grid.mjs";
+import { CHILDREN_CLASSNAME, styles } from "./style.mjs";
+import SpotlightCardItem from "./SpotlightCardItem.mjs";
+import { memo, useEffect, useMemo, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/awesome/SpotlightCard/SpotlightCard.tsx
+const SpotlightCard = memo(({ items, renderItem: Content, maxItemWidth, className, columns = 3, gap = "1em", style, size = 800, borderRadius = 12, spotlight = true, ...rest }) => {
+	const cssVariables = useMemo(() => ({
+		"--spotlight-card-border-radius": `${borderRadius}px`,
+		"--spotlight-card-size": `${size}px`
+	}), [borderRadius, size]);
+	const ref = useRef(null);
+	useEffect(() => {
+		if (!ref.current) return;
+		if (!spotlight) return;
+		const fn = (e) => {
+			for (const card of document.querySelectorAll(`.${CHILDREN_CLASSNAME}`)) {
+				const rect = card.getBoundingClientRect(), x = e.clientX - rect.left, y = e.clientY - rect.top;
+				card.style.setProperty("--mouse-x", `${x}px`);
+				card.style.setProperty("--mouse-y", `${y}px`);
+			}
+		};
+		ref.current.addEventListener("mousemove", fn);
+		return () => {
+			ref.current?.removeEventListener("mousemove", fn);
+		};
+	}, []);
+	return /* @__PURE__ */ jsx(Grid, {
+		className: cx(styles.container, styles.grid, className),
+		gap,
+		maxItemWidth,
+		ref,
+		rows: columns,
+		style: {
+			...cssVariables,
+			...style
+		},
+		...rest,
+		children: items.map((item, index) => {
+			return /* @__PURE__ */ jsx(SpotlightCardItem, {
+				borderRadius,
+				className: CHILDREN_CLASSNAME,
+				size,
+				children: /* @__PURE__ */ jsx(Content, { ...item })
+			}, index);
+		})
+	});
+});
+SpotlightCard.displayName = "SpotlightCard";
+//#endregion
+export { SpotlightCard as default };
+
+//# sourceMappingURL=SpotlightCard.mjs.map

package/ui/es/awesome/SpotlightCard/SpotlightCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpotlightCard.mjs","names":[],"sources":["../../../src/awesome/SpotlightCard/SpotlightCard.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx } from 'antd-style';\r\nimport { memo, useEffect, useMemo, useRef } from 'react';\r\n\r\nimport Grid from '../../Grid';\r\n\r\nimport SpotlightCardItem from './SpotlightCardItem';\r\nimport { CHILDREN_CLASSNAME, styles } from './style';\r\nimport type { SpotlightCardProps } from './type';\r\n\r\nconst SpotlightCard = memo<SpotlightCardProps>(\r\n  ({\r\n    items,\r\n    renderItem: Content,\r\n    maxItemWidth,\r\n    className,\r\n    columns = 3,\r\n    gap = '1em',\r\n    style,\r\n    size = 800,\r\n    borderRadius = 12,\r\n    spotlight = true,\r\n    ...rest\r\n  }) => {\r\n    const cssVariables = useMemo<Record<string, string>>(\r\n      () => ({\r\n        '--spotlight-card-border-radius': `${borderRadius}px`,\r\n        '--spotlight-card-size': `${size}px`,\r\n      }),\r\n      [borderRadius, size],\r\n    );\r\n    const ref = useRef<HTMLDivElement>(null);\r\n\r\n    useEffect(() => {\r\n      if (!ref.current) return;\r\n      if (!spotlight) return;\r\n      const fn = (e: MouseEvent) => {\r\n        for (const card of document.querySelectorAll(`.${CHILDREN_CLASSNAME}`)) {\r\n          const rect = card.getBoundingClientRect(),\r\n            x = e.clientX - rect.left,\r\n            y = e.clientY - rect.top;\r\n\r\n          (card as HTMLDivElement).style.setProperty('--mouse-x', `${x}px`);\r\n          (card as HTMLDivElement).style.setProperty('--mouse-y', `${y}px`);\r\n        }\r\n      };\r\n      ref.current.addEventListener('mousemove', fn);\r\n\r\n      return () => {\r\n        ref.current?.removeEventListener('mousemove', fn);\r\n      };\r\n    }, []);\r\n\r\n    return (\r\n      <Grid\r\n        className={cx(styles.container, styles.grid, className)}\r\n        gap={gap}\r\n        maxItemWidth={maxItemWidth}\r\n        ref={ref}\r\n        rows={columns}\r\n        style={{\r\n          ...cssVariables,\r\n          ...style,\r\n        }}\r\n        {...rest}\r\n      >\r\n        {items.map((item, index) => {\r\n          return (\r\n            <SpotlightCardItem\r\n              borderRadius={borderRadius}\r\n              className={CHILDREN_CLASSNAME}\r\n              key={index}\r\n              size={size}\r\n            >\r\n              <Content {...item} />\r\n            </SpotlightCardItem>\r\n          );\r\n        })}\r\n      </Grid>\r\n    );\r\n  },\r\n);\r\n\r\nSpotlightCard.displayName = 'SpotlightCard';\r\n\r\nexport default SpotlightCard;\r\n"],"mappings":";;;;;;;;AAWA,MAAM,gBAAgB,MACnB,EACC,OACA,YAAY,SACZ,cACA,WACA,UAAU,GACV,MAAM,OACN,OACA,OAAO,KACP,eAAe,IACf,YAAY,MACZ,GAAG,WACC;CACJ,MAAM,eAAe,eACZ;EACL,kCAAkC,GAAG,aAAa;EAClD,yBAAyB,GAAG,KAAK;EAClC,GACD,CAAC,cAAc,KAAK,CACrB;CACD,MAAM,MAAM,OAAuB,KAAK;AAExC,iBAAgB;AACd,MAAI,CAAC,IAAI,QAAS;AAClB,MAAI,CAAC,UAAW;EAChB,MAAM,MAAM,MAAkB;AAC5B,QAAK,MAAM,QAAQ,SAAS,iBAAiB,IAAI,qBAAqB,EAAE;IACtE,MAAM,OAAO,KAAK,uBAAuB,EACvC,IAAI,EAAE,UAAU,KAAK,MACrB,IAAI,EAAE,UAAU,KAAK;AAEtB,SAAwB,MAAM,YAAY,aAAa,GAAG,EAAE,IAAI;AAChE,SAAwB,MAAM,YAAY,aAAa,GAAG,EAAE,IAAI;;;AAGrE,MAAI,QAAQ,iBAAiB,aAAa,GAAG;AAE7C,eAAa;AACX,OAAI,SAAS,oBAAoB,aAAa,GAAG;;IAElD,EAAE,CAAC;AAEN,QACE,oBAAC,MAAD;EACE,WAAW,GAAG,OAAO,WAAW,OAAO,MAAM,UAAU;EAClD;EACS;EACT;EACL,MAAM;EACN,OAAO;GACL,GAAG;GACH,GAAG;GACJ;EACD,GAAI;YAEH,MAAM,KAAK,MAAM,UAAU;AAC1B,UACE,oBAAC,mBAAD;IACgB;IACd,WAAW;IAEL;cAEN,oBAAC,SAAD,EAAS,GAAI,MAAQ,CAAA;IACH,EAJb,MAIa;IAEtB;EACG,CAAA;EAGZ;AAED,cAAc,cAAc"}

package/ui/es/awesome/SpotlightCard/SpotlightCardItem.mjs

@@ -0,0 +1,32 @@
+"use client";
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import { styles } from "./style.mjs";
+import { memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/awesome/SpotlightCard/SpotlightCardItem.tsx
+const SpotlightCardItem = memo(({ children, className, style, borderRadius, size, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const cssVariables = useMemo(() => ({
+		"--spotlight-card-border-radius": `${borderRadius}px`,
+		"--spotlight-card-size": `${size}px`
+	}), [borderRadius, size]);
+	return /* @__PURE__ */ jsx(FlexBasic_default, {
+		className: cx(isDarkMode ? styles.itemContainerDark : styles.itemContainerLight, className),
+		style: {
+			...cssVariables,
+			borderRadius,
+			...style
+		},
+		...rest,
+		children: /* @__PURE__ */ jsx(FlexBasic_default, {
+			className: styles.content,
+			children
+		})
+	});
+});
+SpotlightCardItem.displayName = "SpotlightCardItem";
+//#endregion
+export { SpotlightCardItem as default };
+
+//# sourceMappingURL=SpotlightCardItem.mjs.map

package/ui/es/awesome/SpotlightCard/SpotlightCardItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpotlightCardItem.mjs","names":["Flexbox"],"sources":["../../../src/awesome/SpotlightCard/SpotlightCardItem.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport { memo, useMemo } from 'react';\r\n\r\nimport { Flexbox } from '../../Flex';\r\n\r\nimport { styles } from './style';\r\nimport type { SpotlightCardItemProps } from './type';\r\n\r\nconst SpotlightCardItem = memo<SpotlightCardItemProps>(\r\n  ({ children, className, style, borderRadius, size, ...rest }) => {\r\n    const { isDarkMode } = useThemeMode();\r\n\r\n    const cssVariables = useMemo<Record<string, string>>(\r\n      () => ({\r\n        '--spotlight-card-border-radius': `${borderRadius}px`,\r\n        '--spotlight-card-size': `${size}px`,\r\n      }),\r\n      [borderRadius, size],\r\n    );\r\n\r\n    return (\r\n      <Flexbox\r\n        className={cx(isDarkMode ? styles.itemContainerDark : styles.itemContainerLight, className)}\r\n        style={{\r\n          ...cssVariables,\r\n          borderRadius,\r\n          ...style,\r\n        }}\r\n        {...rest}\r\n      >\r\n        <Flexbox className={styles.content}>{children}</Flexbox>\r\n      </Flexbox>\r\n    );\r\n  },\r\n);\r\n\r\nSpotlightCardItem.displayName = 'SpotlightCardItem';\r\n\r\nexport default SpotlightCardItem;\r\n"],"mappings":";;;;;;;AAUA,MAAM,oBAAoB,MACvB,EAAE,UAAU,WAAW,OAAO,cAAc,MAAM,GAAG,WAAW;CAC/D,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,eAAe,eACZ;EACL,kCAAkC,GAAG,aAAa;EAClD,yBAAyB,GAAG,KAAK;EAClC,GACD,CAAC,cAAc,KAAK,CACrB;AAED,QACE,oBAACA,mBAAD;EACE,WAAW,GAAG,aAAa,OAAO,oBAAoB,OAAO,oBAAoB,UAAU;EAC3F,OAAO;GACL,GAAG;GACH;GACA,GAAG;GACJ;EACD,GAAI;YAEJ,oBAACA,mBAAD;GAAS,WAAW,OAAO;GAAU;GAAmB,CAAA;EAChD,CAAA;EAGf;AAED,kBAAkB,cAAc"}

package/ui/es/awesome/SpotlightCard/index.d.mts

@@ -0,0 +1,2 @@
+import { SpotlightCardProps } from "./type.mjs";
+import { SpotlightCard } from "./SpotlightCard.mjs";