@lobehub/ui 5.6.3 → 5.6.4

package/es/awesome/GridBackground/components/Grid.mjs

@@ -1,25 +1,24 @@
 import { memo, useCallback } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { isUndefined } from "es-toolkit/compat";
-
 //#region src/awesome/GridBackground/components/Grid.tsx
-var Line = /* @__PURE__ */ function(Line$1) {
-	Line$1[Line$1["l7"] = 0] = "l7";
-	Line$1[Line$1["l6"] = 1] = "l6";
-	Line$1[Line$1["l5"] = 2] = "l5";
-	Line$1[Line$1["l4"] = 3] = "l4";
-	Line$1[Line$1["l3"] = 4] = "l3";
-	Line$1[Line$1["l2"] = 5] = "l2";
-	Line$1[Line$1["l1"] = 6] = "l1";
-	Line$1[Line$1["center"] = 7] = "center";
-	Line$1[Line$1["r1"] = 8] = "r1";
-	Line$1[Line$1["r2"] = 9] = "r2";
-	Line$1[Line$1["r3"] = 10] = "r3";
-	Line$1[Line$1["r4"] = 11] = "r4";
-	Line$1[Line$1["r5"] = 12] = "r5";
-	Line$1[Line$1["r6"] = 13] = "r6";
-	Line$1[Line$1["r7"] = 14] = "r7";
-	return Line$1;
+var Line = /* @__PURE__ */ function(Line) {
+	Line[Line["l7"] = 0] = "l7";
+	Line[Line["l6"] = 1] = "l6";
+	Line[Line["l5"] = 2] = "l5";
+	Line[Line["l4"] = 3] = "l4";
+	Line[Line["l3"] = 4] = "l3";
+	Line[Line["l2"] = 5] = "l2";
+	Line[Line["l1"] = 6] = "l1";
+	Line[Line["center"] = 7] = "center";
+	Line[Line["r1"] = 8] = "r1";
+	Line[Line["r2"] = 9] = "r2";
+	Line[Line["r3"] = 10] = "r3";
+	Line[Line["r4"] = 11] = "r4";
+	Line[Line["r5"] = 12] = "r5";
+	Line[Line["r6"] = 13] = "r6";
+	Line[Line["r7"] = 14] = "r7";
+	return Line;
 }(Line || {});
 const Grid = memo(({ color = "#fff", strokeWidth = 3, linePick, ...rest }) => {
 	const isUnpick = isUndefined(linePick);
@@ -61,8 +60,7 @@ const Grid = memo(({ color = "#fff", strokeWidth = 3, linePick, ...rest }) => {
 	});
 });
 Grid.displayName = "Grid";
-var Grid_default = Grid;
-
 //#endregion
-export { Grid_default as default };
+export { Grid as default };
+
 //# sourceMappingURL=Grid.mjs.map

package/es/awesome/GridBackground/components/Grid.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.mjs","names":[],"sources":["../../../../src/awesome/GridBackground/components/Grid.tsx"],"sourcesContent":["import { isUndefined } from 'es-toolkit/compat';\nimport { memo, useCallback } from 'react';\n\nimport type { SvgProps } from '@/types';\n\nenum Line {\n  l7,\n  l6,\n  l5,\n  l4,\n  l3,\n  l2,\n  l1,\n  center,\n  r1,\n  r2,\n  r3,\n  r4,\n  r5,\n  r6,\n  r7,\n}\n\nexport interface GridProps extends SvgProps {\n  color?: string;\n  linePick?: Line;\n  strokeWidth?: number;\n}\n\nconst Grid = memo<GridProps>(({ color = '#fff', strokeWidth = 3, linePick, ...rest }) => {\n  const isUnpick = isUndefined(linePick);\n\n  const showLine = useCallback((l: Line) => isUnpick || linePick === l, [linePick]);\n\n  const vLine = (\n    <>\n      {showLine(Line.l7) && <path d=\"M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0\" />}\n      {showLine(Line.l6) && (\n        <path d=\"M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0\" />\n      )}\n      {showLine(Line.l5) && <path d=\"M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0\" />}\n      {showLine(Line.l4) && <path d=\"M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0\" />}\n      {showLine(Line.l3) && <path d=\"M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0\" />}\n      {showLine(Line.l2) && <path d=\"M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0\" />}\n      {showLine(Line.l1) && <path d=\"M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0\" />}\n      {showLine(Line.center) && <path d=\"M1864 420V0h0\" />}\n      {showLine(Line.r1) && <path d=\"M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0\" />}\n      {showLine(Line.r2) && <path d=\"M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0\" />}\n      {showLine(Line.r3) && <path d=\"M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0\" />}\n      {showLine(Line.r4) && <path d=\"M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0\" />}\n      {showLine(Line.r5) && <path d=\"M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0\" />}\n      {showLine(Line.r6) && (\n        <path d=\"M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0\" />\n      )}\n      {showLine(Line.r7) && (\n        <path d=\"M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0\" />\n      )}\n    </>\n  );\n\n  const hLine = isUnpick && (\n    <>\n      <path d=\"M2835 42H892\" />\n      <path d=\"M595 136h2538\" />\n      <path d=\"M237 249h3254\" />\n    </>\n  );\n\n  return (\n    <svg\n      style={{ width: '100%' }}\n      viewBox=\"0 0 3728 422\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      {...rest}\n    >\n      <g fill=\"none\" fillRule=\"evenodd\" stroke={color} strokeWidth={strokeWidth}>\n        {vLine}\n        {hLine}\n      </g>\n    </svg>\n  );\n});\n\nGrid.displayName = 'Grid';\n\nexport default Grid;\n"],"mappings":";;;;;AAKA,IAAK,wCAAL;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;EAfG;AAwBL,MAAM,OAAO,MAAiB,EAAE,QAAQ,QAAQ,cAAc,GAAG,UAAU,GAAG,WAAW;CACvF,MAAM,WAAW,YAAY,SAAS;CAEtC,MAAM,WAAW,aAAa,MAAY,YAAY,aAAa,GAAG,CAAC,SAAS,CAAC;CAEjF,MAAM,QACJ;EACG,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,8DAA8D;EAC3F,SAAS,KAAK,GAAG,IAChB,oBAAC,UAAK,GAAE,mEAAmE;EAE5E,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,sDAAsD;EACnF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,qDAAqD;EAClF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,uDAAuD;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,uDAAuD;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,sDAAsD;EACnF,SAAS,KAAK,OAAO,IAAI,oBAAC,UAAK,GAAE,kBAAkB;EACnD,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,uDAAuD;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,wDAAwD;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,wDAAwD;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,uDAAuD;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,UAAK,GAAE,wDAAwD;EACrF,SAAS,KAAK,GAAG,IAChB,oBAAC,UAAK,GAAE,oEAAoE;EAE7E,SAAS,KAAK,GAAG,IAChB,oBAAC,UAAK,GAAE,iEAAiE;KAE1E;CAGL,MAAM,QAAQ,YACZ;EACE,oBAAC,UAAK,GAAE,iBAAiB;EACzB,oBAAC,UAAK,GAAE,kBAAkB;EAC1B,oBAAC,UAAK,GAAE,kBAAkB;KACzB;AAGL,QACE,oBAAC;EACC,OAAO,EAAE,OAAO,QAAQ;EACxB,SAAQ;EACR,OAAM;EACN,GAAI;YAEJ,qBAAC;GAAE,MAAK;GAAO,UAAS;GAAU,QAAQ;GAAoB;cAC3D,OACA;IACC;GACA;EAER;AAEF,KAAK,cAAc;AAEnB,mBAAe"}
+{"version":3,"file":"Grid.mjs","names":[],"sources":["../../../../src/awesome/GridBackground/components/Grid.tsx"],"sourcesContent":["import { isUndefined } from 'es-toolkit/compat';\nimport { memo, useCallback } from 'react';\n\nimport type { SvgProps } from '@/types';\n\nenum Line {\n  l7,\n  l6,\n  l5,\n  l4,\n  l3,\n  l2,\n  l1,\n  center,\n  r1,\n  r2,\n  r3,\n  r4,\n  r5,\n  r6,\n  r7,\n}\n\nexport interface GridProps extends SvgProps {\n  color?: string;\n  linePick?: Line;\n  strokeWidth?: number;\n}\n\nconst Grid = memo<GridProps>(({ color = '#fff', strokeWidth = 3, linePick, ...rest }) => {\n  const isUnpick = isUndefined(linePick);\n\n  const showLine = useCallback((l: Line) => isUnpick || linePick === l, [linePick]);\n\n  const vLine = (\n    <>\n      {showLine(Line.l7) && <path d=\"M2 420v-60.343c0-21.82 14.15-41.12 34.959-47.684L1026 0h0\" />}\n      {showLine(Line.l6) && (\n        <path d=\"M268 420v-62.077c0-20.977 13.094-39.724 32.789-46.944L1149 0h0\" />\n      )}\n      {showLine(Line.l5) && <path d=\"M534 420v-64.358a50 50 0 0129.884-45.775L1269 0h0\" />}\n      {showLine(Line.l4) && <path d=\"M800 420v-67.395a50 50 0 0125.958-43.84L1389 0h0\" />}\n      {showLine(Line.l3) && <path d=\"M1066 420v-71.645a50 50 0 0120.456-40.337L1507 0h0\" />}\n      {showLine(Line.l2) && <path d=\"M1332 420v-77.506a50 50 0 0113.194-33.843L1629 0h0\" />}\n      {showLine(Line.l1) && <path d=\"M1598 420v-86.225a50 50 0 014.438-20.594L1744 0h0\" />}\n      {showLine(Line.center) && <path d=\"M1864 420V0h0\" />}\n      {showLine(Line.r1) && <path d=\"M2130 420v-86.225a50 50 0 00-4.438-20.594L1984 0h0\" />}\n      {showLine(Line.r2) && <path d=\"M2396 420v-77.506a50 50 0 00-13.194-33.843L2099 0h0\" />}\n      {showLine(Line.r3) && <path d=\"M2662 420v-71.645a50 50 0 00-20.456-40.337L2221 0h0\" />}\n      {showLine(Line.r4) && <path d=\"M2928 420v-67.395a50 50 0 00-25.958-43.84L2339 0h0\" />}\n      {showLine(Line.r5) && <path d=\"M3194 420v-64.358a50 50 0 00-29.884-45.775L2459 0h0\" />}\n      {showLine(Line.r6) && (\n        <path d=\"M3460 420v-62.077c0-20.977-13.094-39.724-32.789-46.944L2579 0h0\" />\n      )}\n      {showLine(Line.r7) && (\n        <path d=\"M3726 420v-60.343c0-21.82-14.15-41.12-34.959-47.684L2702 0h0\" />\n      )}\n    </>\n  );\n\n  const hLine = isUnpick && (\n    <>\n      <path d=\"M2835 42H892\" />\n      <path d=\"M595 136h2538\" />\n      <path d=\"M237 249h3254\" />\n    </>\n  );\n\n  return (\n    <svg\n      style={{ width: '100%' }}\n      viewBox=\"0 0 3728 422\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      {...rest}\n    >\n      <g fill=\"none\" fillRule=\"evenodd\" stroke={color} strokeWidth={strokeWidth}>\n        {vLine}\n        {hLine}\n      </g>\n    </svg>\n  );\n});\n\nGrid.displayName = 'Grid';\n\nexport default Grid;\n"],"mappings":";;;;AAKA,IAAK,OAAL,yBAAA,MAAA;AACE,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,YAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,KAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;AACA,MAAA,KAAA,QAAA,MAAA;;EAfG,QAAA,EAAA,CAgBJ;AAQD,MAAM,OAAO,MAAiB,EAAE,QAAQ,QAAQ,cAAc,GAAG,UAAU,GAAG,WAAW;CACvF,MAAM,WAAW,YAAY,SAAS;CAEtC,MAAM,WAAW,aAAa,MAAY,YAAY,aAAa,GAAG,CAAC,SAAS,CAAC;CAEjF,MAAM,QACJ,qBAAA,YAAA,EAAA,UAAA;EACG,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,6DAA8D,CAAA;EAC3F,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,kEAAmE,CAAA;EAE5E,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,oDAAqD,CAAA;EAClF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,qDAAsD,CAAA;EACnF,SAAS,KAAK,OAAO,IAAI,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACnD,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,sDAAuD,CAAA;EACpF,SAAS,KAAK,GAAG,IAAI,oBAAC,QAAD,EAAM,GAAE,uDAAwD,CAAA;EACrF,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,mEAAoE,CAAA;EAE7E,SAAS,KAAK,GAAG,IAChB,oBAAC,QAAD,EAAM,GAAE,gEAAiE,CAAA;EAE1E,EAAA,CAAA;CAGL,MAAM,QAAQ,YACZ,qBAAA,YAAA,EAAA,UAAA;EACE,oBAAC,QAAD,EAAM,GAAE,gBAAiB,CAAA;EACzB,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EAC1B,oBAAC,QAAD,EAAM,GAAE,iBAAkB,CAAA;EACzB,EAAA,CAAA;AAGL,QACE,oBAAC,OAAD;EACE,OAAO,EAAE,OAAO,QAAQ;EACxB,SAAQ;EACR,OAAM;EACN,GAAI;YAEJ,qBAAC,KAAD;GAAG,MAAK;GAAO,UAAS;GAAU,QAAQ;GAAoB;aAA9D,CACG,OACA,MACC;;EACA,CAAA;EAER;AAEF,KAAK,cAAc"}

package/es/awesome/GridBackground/style.mjs

@@ -1,5 +1,4 @@
 import { createStaticStyles, keyframes } from "antd-style";
-
 //#region src/awesome/GridBackground/style.ts
 const highlightAnimation = keyframes`
   0% {
@@ -17,11 +16,11 @@ const highlightAnimationReverse = keyframes`
     mask-position: 100% 0%;
   }
 `;
-const styles = createStaticStyles(({ css: css$1 }) => {
+const styles = createStaticStyles(({ css }) => {
 	const width = 24;
 	const height = 36;
 	return {
-		background: css$1`
+		background: css`
       position: absolute;
       inset-block-start: ${60 - height / 2}%;
       inset-inline-start: ${50 - width / 2}%;
@@ -39,7 +38,7 @@ const styles = createStaticStyles(({ css: css$1 }) => {
         0 0 6em 10em var(--grid-background-color-3, transparent),
         0 0 8em 16em var(--grid-background-color-4, transparent);
     `,
-		backgroundContainer: css$1`
+		backgroundContainer: css`
       position: absolute;
       z-index: -1;
       inset: 0;
@@ -49,13 +48,13 @@ const styles = createStaticStyles(({ css: css$1 }) => {
 
       perspective: 200px;
     `,
-		container: css$1`
+		container: css`
       position: relative;
 
       mask-image: linear-gradient(to bottom, transparent, #fff 30%, #fff 70%, transparent);
       mask-size: cover;
     `,
-		highlight: css$1`
+		highlight: css`
       --duration: 6s;
       --delay: 0s;
 
@@ -69,7 +68,7 @@ const styles = createStaticStyles(({ css: css$1 }) => {
       mask-image: linear-gradient(to bottom, transparent 40%, #fff 60%, transparent);
       mask-size: 100% 200%;
     `,
-		highlightReverse: css$1`
+		highlightReverse: css`
       --duration: 6s;
       --delay: 0s;
 
@@ -86,7 +85,7 @@ const styles = createStaticStyles(({ css: css$1 }) => {
     `
 	};
 });
-
 //#endregion
 export { styles };
+
 //# sourceMappingURL=style.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/GridBackground/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\n\nconst highlightAnimation = keyframes`\n  0% {\n    mask-position: 100% 0%;\n  }\n  16%,100% {\n    mask-position: 100% 200%;\n  }\n`;\n\nconst highlightAnimationReverse = keyframes`\n  0% {\n    mask-position: 100% 200%;\n  }\n  16%,100% {\n    mask-position: 100% 0%;\n  }\n`;\n\nexport const styles = createStaticStyles(({ css }) => {\n  const width = 24;\n  const height = 36;\n\n  return {\n    background: css`\n      position: absolute;\n      inset-block-start: ${60 - height / 2}%;\n      inset-inline-start: ${50 - width / 2}%;\n      transform: rotateX(60deg);\n\n      width: ${width}%;\n      height: ${height}%;\n      border-radius: 50%;\n\n      background: var(--grid-background-color-1, transparent);\n      filter: blur(2em) saturate(400%);\n      box-shadow:\n        0 0 1em 2em var(--grid-background-color-1, transparent),\n        0 0 3em 6em var(--grid-background-color-2, transparent),\n        0 0 6em 10em var(--grid-background-color-3, transparent),\n        0 0 8em 16em var(--grid-background-color-4, transparent);\n    `,\n    backgroundContainer: css`\n      position: absolute;\n      z-index: -1;\n      inset: 0;\n\n      width: 100%;\n      height: 100%;\n\n      perspective: 200px;\n    `,\n    container: css`\n      position: relative;\n\n      mask-image: linear-gradient(to bottom, transparent, #fff 30%, #fff 70%, transparent);\n      mask-size: cover;\n    `,\n    highlight: css`\n      --duration: 6s;\n      --delay: 0s;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      animation: ${highlightAnimation} var(--duration) cubic-bezier(0.62, 0.62, 0.28, 0.67) infinite;\n      animation-delay: var(--delay);\n\n      mask-image: linear-gradient(to bottom, transparent 40%, #fff 60%, transparent);\n      mask-size: 100% 200%;\n    `,\n    highlightReverse: css`\n      --duration: 6s;\n      --delay: 0s;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      animation: ${highlightAnimationReverse} var(--duration) cubic-bezier(0.62, 0.62, 0.28, 0.67)\n        infinite;\n      animation-delay: var(--delay);\n\n      mask-image: linear-gradient(to bottom, transparent 40%, #fff 60%, transparent);\n      mask-size: 100% 200%;\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAM,qBAAqB,SAAS;;;;;;;;AASpC,MAAM,4BAA4B,SAAS;;;;;;;;AAS3C,MAAa,SAAS,oBAAoB,EAAE,iBAAU;CACpD,MAAM,QAAQ;CACd,MAAM,SAAS;AAEf,QAAO;EACL,YAAY,KAAG;;2BAEQ,KAAK,SAAS,EAAE;4BACf,KAAK,QAAQ,EAAE;;;eAG5B,MAAM;gBACL,OAAO;;;;;;;;;;;EAWnB,qBAAqB,KAAG;;;;;;;;;;EAUxB,WAAW,KAAG;;;;;;EAMd,WAAW,KAAG;;;;;;;;mBAQC,mBAAmB;;;;;;EAMlC,kBAAkB,KAAG;;;;;;;;mBAQN,0BAA0B;;;;;;;EAO1C;EACD"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/GridBackground/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\n\nconst highlightAnimation = keyframes`\n  0% {\n    mask-position: 100% 0%;\n  }\n  16%,100% {\n    mask-position: 100% 200%;\n  }\n`;\n\nconst highlightAnimationReverse = keyframes`\n  0% {\n    mask-position: 100% 200%;\n  }\n  16%,100% {\n    mask-position: 100% 0%;\n  }\n`;\n\nexport const styles = createStaticStyles(({ css }) => {\n  const width = 24;\n  const height = 36;\n\n  return {\n    background: css`\n      position: absolute;\n      inset-block-start: ${60 - height / 2}%;\n      inset-inline-start: ${50 - width / 2}%;\n      transform: rotateX(60deg);\n\n      width: ${width}%;\n      height: ${height}%;\n      border-radius: 50%;\n\n      background: var(--grid-background-color-1, transparent);\n      filter: blur(2em) saturate(400%);\n      box-shadow:\n        0 0 1em 2em var(--grid-background-color-1, transparent),\n        0 0 3em 6em var(--grid-background-color-2, transparent),\n        0 0 6em 10em var(--grid-background-color-3, transparent),\n        0 0 8em 16em var(--grid-background-color-4, transparent);\n    `,\n    backgroundContainer: css`\n      position: absolute;\n      z-index: -1;\n      inset: 0;\n\n      width: 100%;\n      height: 100%;\n\n      perspective: 200px;\n    `,\n    container: css`\n      position: relative;\n\n      mask-image: linear-gradient(to bottom, transparent, #fff 30%, #fff 70%, transparent);\n      mask-size: cover;\n    `,\n    highlight: css`\n      --duration: 6s;\n      --delay: 0s;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      animation: ${highlightAnimation} var(--duration) cubic-bezier(0.62, 0.62, 0.28, 0.67) infinite;\n      animation-delay: var(--delay);\n\n      mask-image: linear-gradient(to bottom, transparent 40%, #fff 60%, transparent);\n      mask-size: 100% 200%;\n    `,\n    highlightReverse: css`\n      --duration: 6s;\n      --delay: 0s;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      animation: ${highlightAnimationReverse} var(--duration) cubic-bezier(0.62, 0.62, 0.28, 0.67)\n        infinite;\n      animation-delay: var(--delay);\n\n      mask-image: linear-gradient(to bottom, transparent 40%, #fff 60%, transparent);\n      mask-size: 100% 200%;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAM,qBAAqB,SAAS;;;;;;;;AASpC,MAAM,4BAA4B,SAAS;;;;;;;;AAS3C,MAAa,SAAS,oBAAoB,EAAE,UAAU;CACpD,MAAM,QAAQ;CACd,MAAM,SAAS;AAEf,QAAO;EACL,YAAY,GAAG;;2BAEQ,KAAK,SAAS,EAAE;4BACf,KAAK,QAAQ,EAAE;;;eAG5B,MAAM;gBACL,OAAO;;;;;;;;;;;EAWnB,qBAAqB,GAAG;;;;;;;;;;EAUxB,WAAW,GAAG;;;;;;EAMd,WAAW,GAAG;;;;;;;;mBAQC,mBAAmB;;;;;;EAMlC,kBAAkB,GAAG;;;;;;;;mBAQN,0BAA0B;;;;;;;EAO1C;EACD"}

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

@@ -1,5 +1,4 @@
 import { FlexboxProps } from "../../Flex/type.mjs";
-import "../../Flex/index.mjs";
 import { DivProps } from "../../types/index.mjs";
 
 //#region src/awesome/GridBackground/type.d.ts

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

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

package/es/awesome/Hero/Hero.mjs

@@ -1,41 +1,39 @@
-'use client';
-
-import A_default from "../../A/index.mjs";
+"use client";
+import A from "../../A/index.mjs";
 import FlexBasic_default from "../../Flex/FlexBasic.mjs";
-import Center_default from "../../Flex/Center.mjs";
-import Button_default from "../../Button/Button.mjs";
-import AuroraBackground_default from "../AuroraBackground/AuroraBackground.mjs";
-import GradientButton_default from "../GradientButton/GradientButton.mjs";
+import Center from "../../Flex/Center.mjs";
+import Button$1 from "../../Button/Button.mjs";
+import AuroraBackground from "../AuroraBackground/AuroraBackground.mjs";
+import GradientButton from "../GradientButton/GradientButton.mjs";
+import GithubIcon from "../../icons/lucideExtra/GithubIcon.mjs";
 import { styles } from "./style.mjs";
 import { memo, useCallback } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { ConfigProvider } from "antd";
 import { useResponsive } from "antd-style";
-import { Github } from "lucide-react";
-
 //#region src/awesome/Hero/Hero.tsx
 const Hero = memo(({ title, description, actions, Link }) => {
 	const { mobile } = useResponsive();
-	const LinkRender = Link || A_default;
+	const LinkRender = Link || A;
 	const ButtonGroups = useCallback(() => Boolean(actions?.length) && /* @__PURE__ */ jsx(FlexBasic_default, {
 		horizontal: true,
 		className: styles.actions,
 		gap: 16,
 		justify: "center",
 		children: actions.map(({ text, link, openExternal, github, type }, index) => {
-			const content = type === "primary" ? /* @__PURE__ */ jsx(GradientButton_default, {
+			const content = type === "primary" ? /* @__PURE__ */ jsx(GradientButton, {
 				block: mobile,
-				icon: github ? Github : void 0,
+				icon: github ? GithubIcon : void 0,
 				size: "large",
 				children: text
-			}, index) : /* @__PURE__ */ jsx(Button_default, {
+			}, index) : /* @__PURE__ */ jsx(Button$1, {
 				block: mobile,
-				icon: github ? Github : void 0,
+				icon: github ? GithubIcon : void 0,
 				size: "large",
 				type: "primary",
 				children: text
 			}, index);
-			return openExternal ? /* @__PURE__ */ jsx(A_default, {
+			return openExternal ? /* @__PURE__ */ jsx(A, {
 				href: link,
 				target: openExternal ? "_blank" : void 0,
 				children: content
@@ -45,7 +43,7 @@ const Hero = memo(({ title, description, actions, Link }) => {
 			}, text);
 		})
 	}), [actions]);
-	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AuroraBackground_default, {}), /* @__PURE__ */ jsx(ConfigProvider, {
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(AuroraBackground, {}), /* @__PURE__ */ jsx(ConfigProvider, {
 		theme: { token: { fontSize: 16 } },
 		children: /* @__PURE__ */ jsx(FlexBasic_default, {
 			align: "center",
@@ -54,8 +52,8 @@ const Hero = memo(({ title, description, actions, Link }) => {
 				horizontal: true,
 				className: styles.container,
 				distribution: "center",
-				children: /* @__PURE__ */ jsxs(Center_default, { children: [
-					title && /* @__PURE__ */ jsx(Center_default, {
+				children: /* @__PURE__ */ jsxs(Center, { children: [
+					title && /* @__PURE__ */ jsx(Center, {
 						horizontal: true,
 						as: "h1",
 						className: styles.title,
@@ -74,8 +72,7 @@ const Hero = memo(({ title, description, actions, Link }) => {
 	})] });
 });
 Hero.displayName = "Hero";
-var Hero_default = Hero;
-
 //#endregion
-export { Hero_default as default };
+export { Hero as default };
+
 //# sourceMappingURL=Hero.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Hero.mjs","names":["A","Flexbox","GradientButton","Button","AuroraBackground","Center"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\n\nimport { ConfigProvider } from 'antd';\nimport { useResponsive } from 'antd-style';\nimport { Github } from 'lucide-react';\nimport { memo, useCallback } from 'react';\n\nimport A from '@/A';\nimport AuroraBackground from '@/awesome/AuroraBackground';\nimport GradientButton from '@/awesome/GradientButton';\nimport Button from '@/Button';\nimport { Center, Flexbox } from '@/Flex';\n\nimport { styles } from './style';\nimport { type HeroProps } from './type';\n\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\n  const { mobile } = useResponsive();\n\n  const LinkRender = Link || A;\n\n  const ButtonGroups = useCallback(\n    () =>\n      Boolean(actions?.length) && (\n        <Flexbox horizontal className={styles.actions} gap={16} justify={'center'}>\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\n            const content =\n              type === 'primary' ? (\n                <GradientButton\n                  block={mobile}\n                  icon={github ? Github : undefined}\n                  key={index}\n                  size=\"large\"\n                >\n                  {text}\n                </GradientButton>\n              ) : (\n                <Button\n                  block={mobile}\n                  icon={github ? Github : undefined}\n                  key={index}\n                  size=\"large\"\n                  type=\"primary\"\n                >\n                  {text}\n                </Button>\n              );\n\n            return openExternal ? (\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\n                {content}\n              </A>\n            ) : (\n              <LinkRender key={text} to={link}>\n                {content}\n              </LinkRender>\n            );\n          })}\n        </Flexbox>\n      ),\n    [actions],\n  );\n\n  return (\n    <>\n      <AuroraBackground />\n      <ConfigProvider theme={{ token: { fontSize: 16 } }}>\n        <Flexbox align={'center'} style={{ zIndex: 1 }}>\n          <Flexbox horizontal className={styles.container} distribution={'center'}>\n            <Center>\n              {title && (\n                <Center\n                  horizontal\n                  as={'h1'}\n                  className={styles.title}\n                  dangerouslySetInnerHTML={{ __html: title }}\n                  gap={'0.25em'}\n                  wrap={'wrap'}\n                />\n              )}\n              {description && (\n                <p className={styles.desc} dangerouslySetInnerHTML={{ __html: description }} />\n              )}\n              <ButtonGroups />\n            </Center>\n          </Flexbox>\n        </Flexbox>\n      </ConfigProvider>\n    </>\n  );\n});\n\nHero.displayName = 'Hero';\n\nexport default Hero;\n"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAAE,OAAO,aAAa,SAAS,WAAW;CACtE,MAAM,EAAE,WAAW,eAAe;CAElC,MAAM,aAAa,QAAQA;CAE3B,MAAM,eAAe,kBAEjB,QAAQ,SAAS,OAAO,IACtB,oBAACC;EAAQ;EAAW,WAAW,OAAO;EAAS,KAAK;EAAI,SAAS;YAC9D,QAAS,KAAK,EAAE,MAAM,MAAM,cAAc,QAAQ,QAAQ,UAAU;GACnE,MAAM,UACJ,SAAS,YACP,oBAACC;IACC,OAAO;IACP,MAAM,SAAS,SAAS;IAExB,MAAK;cAEJ;MAHI,MAIU,GAEjB,oBAACC;IACC,OAAO;IACP,MAAM,SAAS,SAAS;IAExB,MAAK;IACL,MAAK;cAEJ;MAJI,MAKE;AAGb,UAAO,eACL,oBAACH;IAAE,MAAM;IAAiB,QAAQ,eAAe,WAAW;cACzD;MADiB,KAEhB,GAEJ,oBAAC;IAAsB,IAAI;cACxB;MADc,KAEJ;IAEf;GACM,EAEd,CAAC,QAAQ,CACV;AAED,QACE,8CACE,oBAACI,6BAAmB,EACpB,oBAAC;EAAe,OAAO,EAAE,OAAO,EAAE,UAAU,IAAI,EAAE;YAChD,oBAACH;GAAQ,OAAO;GAAU,OAAO,EAAE,QAAQ,GAAG;aAC5C,oBAACA;IAAQ;IAAW,WAAW,OAAO;IAAW,cAAc;cAC7D,qBAACI;KACE,SACC,oBAACA;MACC;MACA,IAAI;MACJ,WAAW,OAAO;MAClB,yBAAyB,EAAE,QAAQ,OAAO;MAC1C,KAAK;MACL,MAAM;OACN;KAEH,eACC,oBAAC;MAAE,WAAW,OAAO;MAAM,yBAAyB,EAAE,QAAQ,aAAa;OAAI;KAEjF,oBAAC,iBAAe;QACT;KACD;IACF;GACK,IAChB;EAEL;AAEF,KAAK,cAAc;AAEnB,mBAAe"}
+{"version":3,"file":"Hero.mjs","names":["Flexbox","Button"],"sources":["../../../src/awesome/Hero/Hero.tsx"],"sourcesContent":["'use client';\n\nimport { GithubIcon } from '@lobehub/ui/icons';\nimport { ConfigProvider } from 'antd';\nimport { useResponsive } from 'antd-style';\nimport { memo, useCallback } from 'react';\n\nimport A from '@/A';\nimport AuroraBackground from '@/awesome/AuroraBackground';\nimport GradientButton from '@/awesome/GradientButton';\nimport Button from '@/Button';\nimport { Center, Flexbox } from '@/Flex';\n\nimport { styles } from './style';\nimport { type HeroProps } from './type';\n\nconst Hero = memo<HeroProps>(({ title, description, actions, Link }) => {\n  const { mobile } = useResponsive();\n\n  const LinkRender = Link || A;\n\n  const ButtonGroups = useCallback(\n    () =>\n      Boolean(actions?.length) && (\n        <Flexbox horizontal className={styles.actions} gap={16} justify={'center'}>\n          {actions!.map(({ text, link, openExternal, github, type }, index) => {\n            const content =\n              type === 'primary' ? (\n                <GradientButton\n                  block={mobile}\n                  icon={github ? GithubIcon : undefined}\n                  key={index}\n                  size=\"large\"\n                >\n                  {text}\n                </GradientButton>\n              ) : (\n                <Button\n                  block={mobile}\n                  icon={github ? GithubIcon : undefined}\n                  key={index}\n                  size=\"large\"\n                  type=\"primary\"\n                >\n                  {text}\n                </Button>\n              );\n\n            return openExternal ? (\n              <A href={link} key={text} target={openExternal ? '_blank' : undefined}>\n                {content}\n              </A>\n            ) : (\n              <LinkRender key={text} to={link}>\n                {content}\n              </LinkRender>\n            );\n          })}\n        </Flexbox>\n      ),\n    [actions],\n  );\n\n  return (\n    <>\n      <AuroraBackground />\n      <ConfigProvider theme={{ token: { fontSize: 16 } }}>\n        <Flexbox align={'center'} style={{ zIndex: 1 }}>\n          <Flexbox horizontal className={styles.container} distribution={'center'}>\n            <Center>\n              {title && (\n                <Center\n                  horizontal\n                  as={'h1'}\n                  className={styles.title}\n                  dangerouslySetInnerHTML={{ __html: title }}\n                  gap={'0.25em'}\n                  wrap={'wrap'}\n                />\n              )}\n              {description && (\n                <p className={styles.desc} dangerouslySetInnerHTML={{ __html: description }} />\n              )}\n              <ButtonGroups />\n            </Center>\n          </Flexbox>\n        </Flexbox>\n      </ConfigProvider>\n    </>\n  );\n});\n\nHero.displayName = 'Hero';\n\nexport default Hero;\n"],"mappings":";;;;;;;;;;;;;;AAgBA,MAAM,OAAO,MAAiB,EAAE,OAAO,aAAa,SAAS,WAAW;CACtE,MAAM,EAAE,WAAW,eAAe;CAElC,MAAM,aAAa,QAAQ;CAE3B,MAAM,eAAe,kBAEjB,QAAQ,SAAS,OAAO,IACtB,oBAACA,mBAAD;EAAS,YAAA;EAAW,WAAW,OAAO;EAAS,KAAK;EAAI,SAAS;YAC9D,QAAS,KAAK,EAAE,MAAM,MAAM,cAAc,QAAQ,QAAQ,UAAU;GACnE,MAAM,UACJ,SAAS,YACP,oBAAC,gBAAD;IACE,OAAO;IACP,MAAM,SAAS,aAAa,KAAA;IAE5B,MAAK;cAEJ;IACc,EAJV,MAIU,GAEjB,oBAACC,UAAD;IACE,OAAO;IACP,MAAM,SAAS,aAAa,KAAA;IAE5B,MAAK;IACL,MAAK;cAEJ;IACM,EALF,MAKE;AAGb,UAAO,eACL,oBAAC,GAAD;IAAG,MAAM;IAAiB,QAAQ,eAAe,WAAW,KAAA;cACzD;IACC,EAFgB,KAEhB,GAEJ,oBAAC,YAAD;IAAuB,IAAI;cACxB;IACU,EAFI,KAEJ;IAEf;EACM,CAAA,EAEd,CAAC,QAAQ,CACV;AAED,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,kBAAD,EAAoB,CAAA,EACpB,oBAAC,gBAAD;EAAgB,OAAO,EAAE,OAAO,EAAE,UAAU,IAAI,EAAE;YAChD,oBAACD,mBAAD;GAAS,OAAO;GAAU,OAAO,EAAE,QAAQ,GAAG;aAC5C,oBAACA,mBAAD;IAAS,YAAA;IAAW,WAAW,OAAO;IAAW,cAAc;cAC7D,qBAAC,QAAD,EAAA,UAAA;KACG,SACC,oBAAC,QAAD;MACE,YAAA;MACA,IAAI;MACJ,WAAW,OAAO;MAClB,yBAAyB,EAAE,QAAQ,OAAO;MAC1C,KAAK;MACL,MAAM;MACN,CAAA;KAEH,eACC,oBAAC,KAAD;MAAG,WAAW,OAAO;MAAM,yBAAyB,EAAE,QAAQ,aAAa;MAAI,CAAA;KAEjF,oBAAC,cAAD,EAAgB,CAAA;KACT,EAAA,CAAA;IACD,CAAA;GACF,CAAA;EACK,CAAA,CAChB,EAAA,CAAA;EAEL;AAEF,KAAK,cAAc"}

package/es/awesome/Hero/style.mjs

@@ -1,9 +1,8 @@
 import { staticStylish } from "../../styles/theme/customStylishStatic.mjs";
 import { createStaticStyles, responsive } from "antd-style";
-
 //#region src/awesome/Hero/style.ts
-const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
-	actions: css$1`
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	actions: css`
     margin-block-start: 24px;
 
     button {
@@ -22,24 +21,24 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
       }
     }
   `,
-	container: css$1`
+	container: css`
     position: relative;
     box-sizing: border-box;
     text-align: center;
   `,
-	desc: css$1`
+	desc: css`
     margin-block-start: 0;
-    font-size: ${cssVar$1.fontSizeHeading3};
-    color: ${cssVar$1.colorTextSecondary};
+    font-size: ${cssVar.fontSizeHeading3};
+    color: ${cssVar.colorTextSecondary};
     text-align: center;
 
     ${responsive.sm} {
       margin-block: 24px;
       margin-inline: 16px;
-      font-size: ${cssVar$1.fontSizeHeading5};
+      font-size: ${cssVar.fontSizeHeading5};
     }
   `,
-	title: css$1`
+	title: css`
     z-index: 10;
 
     margin: 0;
@@ -66,7 +65,7 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
     }
   `
 }));
-
 //#endregion
 export { styles };
+
 //# sourceMappingURL=style.mjs.map

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

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

package/es/awesome/Spline/ParentSize.mjs

@@ -2,7 +2,6 @@ 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 = {
@@ -66,8 +65,7 @@ const ParentSize = memo(({ ref, className, children, debounceTime = 300, ignoreD
 		})
 	});
 });
-var ParentSize_default = ParentSize;
-
 //#endregion
-export { ParentSize_default as default };
+export { ParentSize as default };
+
 //# sourceMappingURL=ParentSize.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ParentSize.mjs","names":["defaultIgnoreDimensions: ParentSizeProps['ignoreDimensions']"],"sources":["../../../src/awesome/Spline/ParentSize.tsx"],"sourcesContent":["import { debounce } from 'es-toolkit/compat';\nimport {\n  type CSSProperties,\n  memo,\n  type ReactNode,\n  type Ref,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { mergeRefs } from 'react-merge-refs';\n\ninterface ResizeObserverCallback {\n  (entries: ResizeObserverEntry[], observer: ResizeObserver): void;\n}\n\ninterface ResizeObserverPolyfill {\n  new (callback: ResizeObserverCallback): ResizeObserver;\n}\n\n// @TODO remove when upgraded to TS 4 which has its own declaration\ninterface PrivateWindow {\n  ResizeObserver: ResizeObserverPolyfill;\n}\n\nexport interface ParentSizeProps {\n  /** Child render function `({ width, height, top, left, ref, resize }) => ReactNode`. */\n  children: (\n    args: {\n      ref: HTMLDivElement | null;\n      resize: (state: ParentSizeState) => void;\n    } & ParentSizeState,\n  ) => ReactNode;\n  /** Optional `className` to add to the parent `div` wrapper used for size measurement. */\n  className?: string;\n  /** Child render updates upon resize are delayed until `debounceTime` milliseconds _after_ the last resize event is observed. */\n  debounceTime?: number;\n  /** Optional flag to toggle leading debounce calls. When set to true this will ensure that the component always renders immediately. (defaults to true) */\n  enableDebounceLeadingCall?: boolean;\n  /** Optional dimensions provided won't trigger a state change when changed. */\n  ignoreDimensions?: keyof ParentSizeState | (keyof ParentSizeState)[];\n  /** Optional `style` object to apply to the parent `div` wrapper used for size measurement. */\n  parentSizeStyles?: CSSProperties;\n  ref?: Ref<HTMLDivElement>;\n  /** Optionally inject a ResizeObserver polyfill, else this *must* be globally available. */\n  resizeObserverPolyfill?: ResizeObserverPolyfill;\n}\n\ntype ParentSizeState = {\n  height: number;\n  left: number;\n  top: number;\n  width: number;\n};\n\nexport type ParentSizeProvidedProps = ParentSizeState;\n\nconst defaultIgnoreDimensions: ParentSizeProps['ignoreDimensions'] = [];\nconst defaultParentSizeStyles = { height: '100%', width: '100%' };\n\nconst ParentSize = memo<ParentSizeProps>(\n  ({\n    ref,\n    className,\n    children,\n    debounceTime = 300,\n    ignoreDimensions = defaultIgnoreDimensions,\n    parentSizeStyles,\n    enableDebounceLeadingCall = true,\n    resizeObserverPolyfill,\n    ...restProps\n  }) => {\n    const target = useRef<HTMLDivElement | null>(null);\n    const animationFrameID = useRef(0);\n\n    const [state, setState] = useState<ParentSizeState>({\n      height: 0,\n      left: 0,\n      top: 0,\n      width: 0,\n    });\n\n    const resize = useMemo(() => {\n      const normalized = Array.isArray(ignoreDimensions) ? ignoreDimensions : [ignoreDimensions];\n\n      return debounce(\n        (incoming: ParentSizeState) => {\n          setState((existing) => {\n            const stateKeys = Object.keys(existing) as (keyof ParentSizeState)[];\n            const keysWithChanges = stateKeys.filter((key) => existing[key] !== incoming[key]);\n            const shouldBail = keysWithChanges.every((key) => normalized.includes(key));\n\n            return shouldBail ? existing : incoming;\n          });\n        },\n        debounceTime,\n        { leading: enableDebounceLeadingCall },\n      );\n    }, [debounceTime, enableDebounceLeadingCall, ignoreDimensions]);\n\n    useEffect(() => {\n      const LocalResizeObserver =\n        resizeObserverPolyfill || (window as unknown as PrivateWindow).ResizeObserver;\n\n      const observer = new LocalResizeObserver((entries) => {\n        for (const entry of entries) {\n          const { left, top, width, height } = entry?.contentRect ?? {};\n          animationFrameID.current = window.requestAnimationFrame(() => {\n            resize({ height, left, top, width });\n          });\n        }\n      });\n      if (target.current) observer.observe(target.current);\n\n      return () => {\n        window.cancelAnimationFrame(animationFrameID.current);\n        observer.disconnect();\n        resize.cancel();\n      };\n    }, [resize, resizeObserverPolyfill]);\n\n    return (\n      <div\n        className={className}\n        ref={mergeRefs<HTMLDivElement>([ref, target])}\n        style={{ ...defaultParentSizeStyles, ...parentSizeStyles }}\n        {...restProps}\n      >\n        {children({\n          ...state,\n          ref: target.current,\n          resize,\n        })}\n      </div>\n    );\n  },\n);\n\nexport default ParentSize;\n"],"mappings":";;;;;;AA0DA,MAAMA,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,SAAS,CACL,QAAQ,QAAQ,SAAS,SAAS,SAAS,KAAK,CAC/C,OAAO,QAAQ,WAAW,SAAS,IAAI,CAAC,GAEvD,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;EACY;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;GACE;EAGX;AAED,yBAAe"}
+{"version":3,"file":"ParentSize.mjs","names":[],"sources":["../../../src/awesome/Spline/ParentSize.tsx"],"sourcesContent":["import { debounce } from 'es-toolkit/compat';\nimport {\n  type CSSProperties,\n  memo,\n  type ReactNode,\n  type Ref,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { mergeRefs } from 'react-merge-refs';\n\ninterface ResizeObserverCallback {\n  (entries: ResizeObserverEntry[], observer: ResizeObserver): void;\n}\n\ninterface ResizeObserverPolyfill {\n  new (callback: ResizeObserverCallback): ResizeObserver;\n}\n\n// @TODO remove when upgraded to TS 4 which has its own declaration\ninterface PrivateWindow {\n  ResizeObserver: ResizeObserverPolyfill;\n}\n\nexport interface ParentSizeProps {\n  /** Child render function `({ width, height, top, left, ref, resize }) => ReactNode`. */\n  children: (\n    args: {\n      ref: HTMLDivElement | null;\n      resize: (state: ParentSizeState) => void;\n    } & ParentSizeState,\n  ) => ReactNode;\n  /** Optional `className` to add to the parent `div` wrapper used for size measurement. */\n  className?: string;\n  /** Child render updates upon resize are delayed until `debounceTime` milliseconds _after_ the last resize event is observed. */\n  debounceTime?: number;\n  /** Optional flag to toggle leading debounce calls. When set to true this will ensure that the component always renders immediately. (defaults to true) */\n  enableDebounceLeadingCall?: boolean;\n  /** Optional dimensions provided won't trigger a state change when changed. */\n  ignoreDimensions?: keyof ParentSizeState | (keyof ParentSizeState)[];\n  /** Optional `style` object to apply to the parent `div` wrapper used for size measurement. */\n  parentSizeStyles?: CSSProperties;\n  ref?: Ref<HTMLDivElement>;\n  /** Optionally inject a ResizeObserver polyfill, else this *must* be globally available. */\n  resizeObserverPolyfill?: ResizeObserverPolyfill;\n}\n\ntype ParentSizeState = {\n  height: number;\n  left: number;\n  top: number;\n  width: number;\n};\n\nexport type ParentSizeProvidedProps = ParentSizeState;\n\nconst defaultIgnoreDimensions: ParentSizeProps['ignoreDimensions'] = [];\nconst defaultParentSizeStyles = { height: '100%', width: '100%' };\n\nconst ParentSize = memo<ParentSizeProps>(\n  ({\n    ref,\n    className,\n    children,\n    debounceTime = 300,\n    ignoreDimensions = defaultIgnoreDimensions,\n    parentSizeStyles,\n    enableDebounceLeadingCall = true,\n    resizeObserverPolyfill,\n    ...restProps\n  }) => {\n    const target = useRef<HTMLDivElement | null>(null);\n    const animationFrameID = useRef(0);\n\n    const [state, setState] = useState<ParentSizeState>({\n      height: 0,\n      left: 0,\n      top: 0,\n      width: 0,\n    });\n\n    const resize = useMemo(() => {\n      const normalized = Array.isArray(ignoreDimensions) ? ignoreDimensions : [ignoreDimensions];\n\n      return debounce(\n        (incoming: ParentSizeState) => {\n          setState((existing) => {\n            const stateKeys = Object.keys(existing) as (keyof ParentSizeState)[];\n            const keysWithChanges = stateKeys.filter((key) => existing[key] !== incoming[key]);\n            const shouldBail = keysWithChanges.every((key) => normalized.includes(key));\n\n            return shouldBail ? existing : incoming;\n          });\n        },\n        debounceTime,\n        { leading: enableDebounceLeadingCall },\n      );\n    }, [debounceTime, enableDebounceLeadingCall, ignoreDimensions]);\n\n    useEffect(() => {\n      const LocalResizeObserver =\n        resizeObserverPolyfill || (window as unknown as PrivateWindow).ResizeObserver;\n\n      const observer = new LocalResizeObserver((entries) => {\n        for (const entry of entries) {\n          const { left, top, width, height } = entry?.contentRect ?? {};\n          animationFrameID.current = window.requestAnimationFrame(() => {\n            resize({ height, left, top, width });\n          });\n        }\n      });\n      if (target.current) observer.observe(target.current);\n\n      return () => {\n        window.cancelAnimationFrame(animationFrameID.current);\n        observer.disconnect();\n        resize.cancel();\n      };\n    }, [resize, resizeObserverPolyfill]);\n\n    return (\n      <div\n        className={className}\n        ref={mergeRefs<HTMLDivElement>([ref, target])}\n        style={{ ...defaultParentSizeStyles, ...parentSizeStyles }}\n        {...restProps}\n      >\n        {children({\n          ...state,\n          ref: target.current,\n          resize,\n        })}\n      </div>\n    );\n  },\n);\n\nexport default ParentSize;\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,SAAS,CACL,QAAQ,QAAQ,SAAS,SAAS,SAAS,KAAK,CAC/C,OAAO,QAAQ,WAAW,SAAS,IAAI,CAAC,GAEvD,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/es/awesome/Spline/Spine.d.mts

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

package/es/awesome/Spline/Spine.mjs

@@ -1,10 +1,8 @@
-'use client';
-
-import ParentSize_default from "./ParentSize.mjs";
+"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);
@@ -65,7 +63,7 @@ const Spline = memo(({ ref, scene, style, onMouseDown, onMouseUp, onMouseHover,
 			speApp.dispose();
 		};
 	}, [scene]);
-	return /* @__PURE__ */ jsx(ParentSize_default, {
+	return /* @__PURE__ */ jsx(ParentSize, {
 		debounceTime: 50,
 		parentSizeStyles: style,
 		ref,
@@ -79,8 +77,7 @@ const Spline = memo(({ ref, scene, style, onMouseDown, onMouseUp, onMouseHover,
 	});
 });
 Spline.displayName = "Spline";
-var Spine_default = Spline;
-
 //#endregion
-export { Spine_default as default };
+export { Spline as default };
+
 //# sourceMappingURL=Spine.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Spine.mjs","names":["speApp: Application","events: {\n        cb?: (e: SplineEvent) => void;\n        name: SplineEventName;\n      }[]","ParentSize"],"sources":["../../../src/awesome/Spline/Spine.tsx"],"sourcesContent":["'use client';\n\nimport { type SplineEvent, type SplineEventName } from '@splinetool/runtime';\nimport { Application } from '@splinetool/runtime';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport ParentSize from './ParentSize';\nimport { type SplineProps } from './type';\n\nconst Spline = memo<SplineProps>(\n  ({\n    ref,\n    scene,\n    style,\n    onMouseDown,\n    onMouseUp,\n    onMouseHover,\n    onKeyDown,\n    onKeyUp,\n    onStart,\n    onLookAt,\n    onFollow,\n    onWheel,\n    onLoad,\n    renderOnDemand = true,\n    ...props\n  }) => {\n    const canvasRef = useRef<HTMLCanvasElement>(null);\n    const [isLoading, setIsLoading] = useState(true);\n\n    const init = async (\n      speApp: Application,\n      events: {\n        cb?: (e: SplineEvent) => void;\n        name: SplineEventName;\n      }[],\n    ) => {\n      await speApp.load(scene);\n\n      for (const event of events) {\n        if (event.cb) {\n          speApp.addEventListener(event.name, event.cb);\n        }\n      }\n\n      setIsLoading(false);\n      onLoad?.(speApp);\n    };\n\n    // Initialize runtime when component is mounted\n    useEffect(() => {\n      setIsLoading(true);\n\n      let speApp: Application;\n      const events: {\n        cb?: (e: SplineEvent) => void;\n        name: SplineEventName;\n      }[] = [\n        {\n          cb: onMouseDown,\n          name: 'mouseDown',\n        },\n        {\n          cb: onMouseUp,\n          name: 'mouseUp',\n        },\n        {\n          cb: onMouseHover,\n          name: 'mouseHover',\n        },\n        {\n          cb: onKeyDown,\n          name: 'keyDown',\n        },\n        {\n          cb: onKeyUp,\n          name: 'keyUp',\n        },\n        {\n          cb: onStart,\n          name: 'start',\n        },\n        {\n          cb: onLookAt,\n          name: 'lookAt',\n        },\n        {\n          cb: onFollow,\n          name: 'follow',\n        },\n        {\n          cb: onWheel,\n          name: 'scroll',\n        },\n      ];\n\n      if (canvasRef.current) {\n        speApp = new Application(canvasRef.current, { renderOnDemand });\n        init(speApp, events);\n      }\n\n      return () => {\n        for (const event of events) {\n          if (event.cb) {\n            speApp.removeEventListener(event.name, event.cb);\n          }\n        }\n        speApp.dispose();\n      };\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [scene]);\n\n    return (\n      <ParentSize debounceTime={50} parentSizeStyles={style} ref={ref} {...props}>\n        {() => {\n          return (\n            <canvas\n              ref={canvasRef}\n              style={{\n                display: isLoading ? 'none' : 'block',\n              }}\n            />\n          );\n        }}\n      </ParentSize>\n    );\n  },\n);\n\nSpline.displayName = 'Spline';\n\nexport default Spline;\n\nexport { type SPEObject, type SplineEvent, type SplineEventName } from '@splinetool/runtime';\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,IAAIA;EACJ,MAAMC,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,oBAACC;EAAW,cAAc;EAAI,kBAAkB;EAAY;EAAK,GAAI;kBAC5D;AACL,UACE,oBAAC;IACC,KAAK;IACL,OAAO,EACL,SAAS,YAAY,SAAS,SAC/B;KACD;;GAGK;EAGlB;AAED,OAAO,cAAc;AAErB,oBAAe"}
+{"version":3,"file":"Spine.mjs","names":[],"sources":["../../../src/awesome/Spline/Spine.tsx"],"sourcesContent":["'use client';\n\nimport { type SplineEvent, type SplineEventName } from '@splinetool/runtime';\nimport { Application } from '@splinetool/runtime';\nimport { memo, useEffect, useRef, useState } from 'react';\n\nimport ParentSize from './ParentSize';\nimport { type SplineProps } from './type';\n\nconst Spline = memo<SplineProps>(\n  ({\n    ref,\n    scene,\n    style,\n    onMouseDown,\n    onMouseUp,\n    onMouseHover,\n    onKeyDown,\n    onKeyUp,\n    onStart,\n    onLookAt,\n    onFollow,\n    onWheel,\n    onLoad,\n    renderOnDemand = true,\n    ...props\n  }) => {\n    const canvasRef = useRef<HTMLCanvasElement>(null);\n    const [isLoading, setIsLoading] = useState(true);\n\n    const init = async (\n      speApp: Application,\n      events: {\n        cb?: (e: SplineEvent) => void;\n        name: SplineEventName;\n      }[],\n    ) => {\n      await speApp.load(scene);\n\n      for (const event of events) {\n        if (event.cb) {\n          speApp.addEventListener(event.name, event.cb);\n        }\n      }\n\n      setIsLoading(false);\n      onLoad?.(speApp);\n    };\n\n    // Initialize runtime when component is mounted\n    useEffect(() => {\n      setIsLoading(true);\n\n      let speApp: Application;\n      const events: {\n        cb?: (e: SplineEvent) => void;\n        name: SplineEventName;\n      }[] = [\n        {\n          cb: onMouseDown,\n          name: 'mouseDown',\n        },\n        {\n          cb: onMouseUp,\n          name: 'mouseUp',\n        },\n        {\n          cb: onMouseHover,\n          name: 'mouseHover',\n        },\n        {\n          cb: onKeyDown,\n          name: 'keyDown',\n        },\n        {\n          cb: onKeyUp,\n          name: 'keyUp',\n        },\n        {\n          cb: onStart,\n          name: 'start',\n        },\n        {\n          cb: onLookAt,\n          name: 'lookAt',\n        },\n        {\n          cb: onFollow,\n          name: 'follow',\n        },\n        {\n          cb: onWheel,\n          name: 'scroll',\n        },\n      ];\n\n      if (canvasRef.current) {\n        speApp = new Application(canvasRef.current, { renderOnDemand });\n        init(speApp, events);\n      }\n\n      return () => {\n        for (const event of events) {\n          if (event.cb) {\n            speApp.removeEventListener(event.name, event.cb);\n          }\n        }\n        speApp.dispose();\n      };\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [scene]);\n\n    return (\n      <ParentSize debounceTime={50} parentSizeStyles={style} ref={ref} {...props}>\n        {() => {\n          return (\n            <canvas\n              ref={canvasRef}\n              style={{\n                display: isLoading ? 'none' : 'block',\n              }}\n            />\n          );\n        }}\n      </ParentSize>\n    );\n  },\n);\n\nSpline.displayName = 'Spline';\n\nexport default Spline;\n\nexport { type SPEObject, type SplineEvent, type SplineEventName } from '@splinetool/runtime';\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/es/awesome/Spotlight/Spotlight.d.mts

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

package/es/awesome/Spotlight/Spotlight.mjs

@@ -1,11 +1,9 @@
-'use client';
-
+"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();
@@ -28,8 +26,7 @@ const Spotlight = memo(({ className, size = 64, ...properties }) => {
 	});
 });
 Spotlight.displayName = "Spotlight";
-var Spotlight_default = Spotlight;
-
 //#endregion
-export { Spotlight_default as default };
+export { Spotlight as default };
+
 //# sourceMappingURL=Spotlight.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Spotlight.mjs","names":[],"sources":["../../../src/awesome/Spotlight/Spotlight.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useThemeMode } from 'antd-style';\nimport { memo, useMemo } from 'react';\n\nimport { styles } from './style';\nimport type { SpotlightProps } from './type';\nimport { useMouseOffset } from './useMouseOffset';\n\nconst Spotlight = memo<SpotlightProps>(({ className, size = 64, ...properties }) => {\n  const [offset, outside, reference] = useMouseOffset();\n  const { isDarkMode } = useThemeMode();\n\n  const cssVariables = useMemo<Record<string, string>>(\n    () => ({\n      '--spotlight-opacity': outside ? '0' : '0.1',\n      '--spotlight-size': `${size}px`,\n      '--spotlight-x': `${offset?.x ?? 0}px`,\n      '--spotlight-y': `${offset?.y ?? 0}px`,\n    }),\n    [offset, size, outside],\n  );\n\n  const spotlightStyle = isDarkMode\n    ? outside\n      ? styles.spotlightDarkOutside\n      : styles.spotlightDark\n    : outside\n      ? styles.spotlightLightOutside\n      : styles.spotlightLight;\n\n  return (\n    <div\n      className={cx(spotlightStyle, className)}\n      ref={reference}\n      style={cssVariables}\n      {...properties}\n    />\n  );\n});\n\nSpotlight.displayName = 'Spotlight';\n\nexport default Spotlight;\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;EACC,WAAW,GAVQ,aACnB,UACE,OAAO,uBACP,OAAO,gBACT,UACE,OAAO,wBACP,OAAO,gBAIqB,UAAU;EACxC,KAAK;EACL,OAAO;EACP,GAAI;GACJ;EAEJ;AAEF,UAAU,cAAc;AAExB,wBAAe"}
+{"version":3,"file":"Spotlight.mjs","names":[],"sources":["../../../src/awesome/Spotlight/Spotlight.tsx"],"sourcesContent":["'use client';\n\nimport { cx, useThemeMode } from 'antd-style';\nimport { memo, useMemo } from 'react';\n\nimport { styles } from './style';\nimport type { SpotlightProps } from './type';\nimport { useMouseOffset } from './useMouseOffset';\n\nconst Spotlight = memo<SpotlightProps>(({ className, size = 64, ...properties }) => {\n  const [offset, outside, reference] = useMouseOffset();\n  const { isDarkMode } = useThemeMode();\n\n  const cssVariables = useMemo<Record<string, string>>(\n    () => ({\n      '--spotlight-opacity': outside ? '0' : '0.1',\n      '--spotlight-size': `${size}px`,\n      '--spotlight-x': `${offset?.x ?? 0}px`,\n      '--spotlight-y': `${offset?.y ?? 0}px`,\n    }),\n    [offset, size, outside],\n  );\n\n  const spotlightStyle = isDarkMode\n    ? outside\n      ? styles.spotlightDarkOutside\n      : styles.spotlightDark\n    : outside\n      ? styles.spotlightLightOutside\n      : styles.spotlightLight;\n\n  return (\n    <div\n      className={cx(spotlightStyle, className)}\n      ref={reference}\n      style={cssVariables}\n      {...properties}\n    />\n  );\n});\n\nSpotlight.displayName = 'Spotlight';\n\nexport default Spotlight;\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/es/awesome/Spotlight/style.mjs

@@ -1,8 +1,7 @@
 import { createStaticStyles } from "antd-style";
-
 //#region src/awesome/Spotlight/style.ts
-const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
-	spotlightDark: css$1`
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	spotlightDark: css`
     pointer-events: none;
 
     position: absolute;
@@ -14,13 +13,13 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
     opacity: var(--spotlight-opacity, 0.1);
     background: radial-gradient(
       var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
-      ${cssVar$1.colorText},
+      ${cssVar.colorText},
       transparent
     );
 
     transition: all 0.2s;
   `,
-	spotlightDarkOutside: css$1`
+	spotlightDarkOutside: css`
     pointer-events: none;
 
     position: absolute;
@@ -32,13 +31,13 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
     opacity: 0;
     background: radial-gradient(
       var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
-      ${cssVar$1.colorText},
+      ${cssVar.colorText},
       transparent
     );
 
     transition: all 0.2s;
   `,
-	spotlightLight: css$1`
+	spotlightLight: css`
     pointer-events: none;
 
     position: absolute;
@@ -51,12 +50,12 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
     background: radial-gradient(
       var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
       #fff,
-      ${cssVar$1.colorTextQuaternary}
+      ${cssVar.colorTextQuaternary}
     );
 
     transition: all 0.2s;
   `,
-	spotlightLightOutside: css$1`
+	spotlightLightOutside: css`
     pointer-events: none;
 
     position: absolute;
@@ -69,13 +68,13 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => ({
     background: radial-gradient(
       var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),
       #fff,
-      ${cssVar$1.colorTextQuaternary}
+      ${cssVar.colorTextQuaternary}
     );
 
     transition: all 0.2s;
   `
 }));
-
 //#endregion
 export { styles };
+
 //# sourceMappingURL=style.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["cssVar"],"sources":["../../../src/awesome/Spotlight/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  spotlightDark: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: var(--spotlight-opacity, 0.1);\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      ${cssVar.colorText},\n      transparent\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightDarkOutside: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: 0;\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      ${cssVar.colorText},\n      transparent\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightLight: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: var(--spotlight-opacity, 0.1);\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      #fff,\n      ${cssVar.colorTextQuaternary}\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightLightOutside: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: 0;\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      #fff,\n      ${cssVar.colorTextQuaternary}\n    );\n\n    transition: all 0.2s;\n  `,\n}));\n"],"mappings":";;;AAEA,MAAa,SAAS,oBAAoB,EAAE,YAAK,wBAAc;CAC7D,eAAe,KAAG;;;;;;;;;;;;QAYZA,SAAO,UAAU;;;;;;CAOvB,sBAAsB,KAAG;;;;;;;;;;;;QAYnBA,SAAO,UAAU;;;;;;CAOvB,gBAAgB,KAAG;;;;;;;;;;;;;QAabA,SAAO,oBAAoB;;;;;CAMjC,uBAAuB,KAAG;;;;;;;;;;;;;QAapBA,SAAO,oBAAoB;;;;;CAKlC,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/awesome/Spotlight/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  spotlightDark: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: var(--spotlight-opacity, 0.1);\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      ${cssVar.colorText},\n      transparent\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightDarkOutside: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: 0;\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      ${cssVar.colorText},\n      transparent\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightLight: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: var(--spotlight-opacity, 0.1);\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      #fff,\n      ${cssVar.colorTextQuaternary}\n    );\n\n    transition: all 0.2s;\n  `,\n\n  spotlightLightOutside: css`\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n\n    border-radius: inherit;\n\n    opacity: 0;\n    background: radial-gradient(\n      var(--spotlight-size, 64px) circle at var(--spotlight-x, 0) var(--spotlight-y, 0),\n      #fff,\n      ${cssVar.colorTextQuaternary}\n    );\n\n    transition: all 0.2s;\n  `,\n}));\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/es/awesome/Spotlight/useMouseOffset.mjs

@@ -1,5 +1,4 @@
 import { useEffect, useRef, useState } from "react";
-
 //#region src/awesome/Spotlight/useMouseOffset.ts
 const useMouseOffset = () => {
 	const [offset, setOffset] = useState();
@@ -33,7 +32,7 @@ const useMouseOffset = () => {
 		reference
 	];
 };
-
 //#endregion
 export { useMouseOffset };
+
 //# sourceMappingURL=useMouseOffset.mjs.map