@farzadbagheri/fb-components 0.1.0

package/dist/chunk-MKCSRMHF.cjs

@@ -0,0 +1,198 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/motion/GlowCursor.tsx
+function GlowCursor({
+  children,
+  color = "#825dff",
+  size = 110,
+  blur = 35,
+  opacity = 0.45,
+  followSpeed = 0.12,
+  className = ""
+}) {
+  const [
+    point,
+    setPoint
+  ] = react.useState({
+    x: 0,
+    y: 0
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: `fb-glow-cursor ${className}`,
+      onMouseMove: (event) => {
+        const rect = event.currentTarget.getBoundingClientRect();
+        setPoint({
+          x: event.clientX - rect.left,
+          y: event.clientY - rect.top
+        });
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "fb-glow-cursor__glow",
+            style: {
+              width: size,
+              height: size,
+              left: point.x,
+              top: point.y,
+              background: color,
+              filter: `blur(${blur}px)`,
+              opacity,
+              transitionDuration: `${followSpeed}s`
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fb-glow-cursor__content", children })
+      ]
+    }
+  );
+}
+function MagneticCursor({
+  children,
+  color = "#b99cff",
+  size = 18,
+  ringSize = 44,
+  followSpeed = 0.14,
+  magneticStrength = 0.25,
+  className = "",
+  style,
+  ...props
+}) {
+  const containerRef = react.useRef(
+    null
+  );
+  const [
+    point,
+    setPoint
+  ] = react.useState({
+    x: 0,
+    y: 0
+  });
+  const [
+    visible,
+    setVisible
+  ] = react.useState(false);
+  const [
+    hoveringTarget,
+    setHoveringTarget
+  ] = react.useState(false);
+  react.useEffect(() => {
+    const element = containerRef.current;
+    if (!element) {
+      return;
+    }
+    function handlePointerMove(event) {
+      const rect = element.getBoundingClientRect();
+      let x = event.clientX - rect.left;
+      let y = event.clientY - rect.top;
+      const target = event.target?.closest(
+        "[data-magnetic-target]"
+      );
+      if (target) {
+        const targetRect = target.getBoundingClientRect();
+        const centerX = targetRect.left + targetRect.width / 2;
+        const centerY = targetRect.top + targetRect.height / 2;
+        x += (centerX - event.clientX) * magneticStrength;
+        y += (centerY - event.clientY) * magneticStrength;
+        setHoveringTarget(
+          true
+        );
+      } else {
+        setHoveringTarget(
+          false
+        );
+      }
+      setPoint({
+        x,
+        y
+      });
+      setVisible(
+        true
+      );
+    }
+    function handlePointerLeave() {
+      setVisible(
+        false
+      );
+      setHoveringTarget(
+        false
+      );
+    }
+    element.addEventListener(
+      "pointermove",
+      handlePointerMove
+    );
+    element.addEventListener(
+      "pointerleave",
+      handlePointerLeave
+    );
+    return () => {
+      element.removeEventListener(
+        "pointermove",
+        handlePointerMove
+      );
+      element.removeEventListener(
+        "pointerleave",
+        handlePointerLeave
+      );
+    };
+  }, [
+    magneticStrength
+  ]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ...props,
+      ref: containerRef,
+      className: `fb-magnetic-cursor ${className}`,
+      style: {
+        ...style,
+        cursor: "none"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fb-magnetic-cursor__content", children }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: `fb-magnetic-cursor__ring ${visible ? "is-visible" : ""} ${hoveringTarget ? "is-targeting" : ""}`,
+            style: {
+              width: ringSize,
+              height: ringSize,
+              left: point.x,
+              top: point.y,
+              borderColor: color,
+              transitionDuration: `${followSpeed}s`
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: `fb-magnetic-cursor__dot ${visible ? "is-visible" : ""}`,
+            style: {
+              width: size,
+              height: size,
+              left: point.x,
+              top: point.y,
+              background: color,
+              boxShadow: `0 0 ${size}px ${color}`
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.GlowCursor = GlowCursor;
+exports.MagneticCursor = MagneticCursor;
+//# sourceMappingURL=chunk-MKCSRMHF.cjs.map
+//# sourceMappingURL=chunk-MKCSRMHF.cjs.map

package/dist/chunk-MKCSRMHF.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/motion/GlowCursor.tsx","../src/motion/MagneticCursor.tsx"],"names":["useState","jsxs","jsx","useRef","useEffect"],"mappings":"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","file":"chunk-MKCSRMHF.cjs","sourcesContent":["import {\r\n  useState,\r\n} from \"react\";\r\n\r\nimport \"./GlowCursor.css\";\r\n\r\nexport interface GlowCursorProps {\r\n  children?:\r\n    React.ReactNode;\r\n\r\n  color?:\r\n    string;\r\n\r\n  size?:\r\n    number;\r\n\r\n  blur?:\r\n    number;\r\n\r\n  opacity?:\r\n    number;\r\n\r\n  followSpeed?:\r\n    number;\r\n\r\n  className?:\r\n    string;\r\n}\r\n\r\nexport function GlowCursor({\r\n  children,\r\n\r\n  color =\r\n    \"#825dff\",\r\n\r\n  size =\r\n    110,\r\n\r\n  blur =\r\n    35,\r\n\r\n  opacity =\r\n    0.45,\r\n\r\n  followSpeed =\r\n    0.12,\r\n\r\n  className =\r\n    \"\",\r\n}: GlowCursorProps) {\r\n  const [\r\n    point,\r\n    setPoint,\r\n  ] =\r\n    useState({\r\n      x: 0,\r\n      y: 0,\r\n    });\r\n\r\n  return (\r\n    <div\r\n      className={`fb-glow-cursor ${className}`}\r\n      onMouseMove={(\r\n        event\r\n      ) => {\r\n        const rect =\r\n          event.currentTarget.getBoundingClientRect();\r\n\r\n        setPoint({\r\n          x:\r\n            event.clientX -\r\n            rect.left,\r\n\r\n          y:\r\n            event.clientY -\r\n            rect.top,\r\n        });\r\n      }}\r\n    >\r\n      <div\r\n        className=\"fb-glow-cursor__glow\"\r\n        style={{\r\n          width:\r\n            size,\r\n\r\n          height:\r\n            size,\r\n\r\n          left:\r\n            point.x,\r\n\r\n          top:\r\n            point.y,\r\n\r\n          background:\r\n            color,\r\n\r\n          filter:\r\n            `blur(${blur}px)`,\r\n\r\n          opacity,\r\n\r\n          transitionDuration:\r\n            `${followSpeed}s`,\r\n        }}\r\n      />\r\n\r\n      <div className=\"fb-glow-cursor__content\">\r\n        {children}\r\n      </div>\r\n    </div>\r\n  );\r\n}","import {\r\n  useEffect,\r\n  useRef,\r\n  useState,\r\n} from \"react\";\r\n\r\nimport type {\r\n  HTMLAttributes,\r\n  ReactNode,\r\n} from \"react\";\r\n\r\nimport \"./MagneticCursor.css\";\r\n\r\nexport interface MagneticCursorProps\r\n  extends HTMLAttributes<HTMLDivElement> {\r\n  children?: ReactNode;\r\n\r\n  color?: string;\r\n\r\n  size?: number;\r\n\r\n  ringSize?: number;\r\n\r\n  followSpeed?: number;\r\n\r\n  magneticStrength?: number;\r\n\r\n  className?: string;\r\n}\r\n\r\ninterface Point {\r\n  x: number;\r\n  y: number;\r\n}\r\n\r\nexport function MagneticCursor({\r\n  children,\r\n\r\n  color = \"#b99cff\",\r\n\r\n  size = 18,\r\n\r\n  ringSize = 44,\r\n\r\n  followSpeed = 0.14,\r\n\r\n  magneticStrength = 0.25,\r\n\r\n  className = \"\",\r\n\r\n  style,\r\n\r\n  ...props\r\n}: MagneticCursorProps) {\r\n  const containerRef =\r\n    useRef<HTMLDivElement>(\r\n      null\r\n    );\r\n\r\n  const [\r\n    point,\r\n    setPoint,\r\n  ] =\r\n    useState<Point>({\r\n      x: 0,\r\n      y: 0,\r\n    });\r\n\r\n  const [\r\n    visible,\r\n    setVisible,\r\n  ] =\r\n    useState(false);\r\n\r\n  const [\r\n    hoveringTarget,\r\n    setHoveringTarget,\r\n  ] =\r\n    useState(false);\r\n\r\n  useEffect(() => {\r\n    const element =\r\n      containerRef.current;\r\n\r\n    if (!element) {\r\n      return;\r\n    }\r\n\r\n    function handlePointerMove(\r\n      event: PointerEvent\r\n    ) {\r\n      const rect =\r\n        element!.getBoundingClientRect();\r\n\r\n      let x =\r\n        event.clientX -\r\n        rect.left;\r\n\r\n      let y =\r\n        event.clientY -\r\n        rect.top;\r\n\r\n      const target =\r\n        (\r\n          event.target as\r\n            HTMLElement | null\r\n        )?.closest(\r\n          \"[data-magnetic-target]\"\r\n        ) as\r\n          | HTMLElement\r\n          | null;\r\n\r\n      if (target) {\r\n        const targetRect =\r\n          target.getBoundingClientRect();\r\n\r\n        const centerX =\r\n          targetRect.left +\r\n          targetRect.width /\r\n            2;\r\n\r\n        const centerY =\r\n          targetRect.top +\r\n          targetRect.height /\r\n            2;\r\n\r\n        x +=\r\n          (\r\n            centerX -\r\n            event.clientX\r\n          ) *\r\n          magneticStrength;\r\n\r\n        y +=\r\n          (\r\n            centerY -\r\n            event.clientY\r\n          ) *\r\n          magneticStrength;\r\n\r\n        setHoveringTarget(\r\n          true\r\n        );\r\n      } else {\r\n        setHoveringTarget(\r\n          false\r\n        );\r\n      }\r\n\r\n      setPoint({\r\n        x,\r\n        y,\r\n      });\r\n\r\n      setVisible(\r\n        true\r\n      );\r\n    }\r\n\r\n    function handlePointerLeave() {\r\n      setVisible(\r\n        false\r\n      );\r\n\r\n      setHoveringTarget(\r\n        false\r\n      );\r\n    }\r\n\r\n    element.addEventListener(\r\n      \"pointermove\",\r\n      handlePointerMove\r\n    );\r\n\r\n    element.addEventListener(\r\n      \"pointerleave\",\r\n      handlePointerLeave\r\n    );\r\n\r\n    return () => {\r\n      element.removeEventListener(\r\n        \"pointermove\",\r\n        handlePointerMove\r\n      );\r\n\r\n      element.removeEventListener(\r\n        \"pointerleave\",\r\n        handlePointerLeave\r\n      );\r\n    };\r\n  }, [\r\n    magneticStrength,\r\n  ]);\r\n\r\n  return (\r\n    <div\r\n      {...props}\r\n      ref={\r\n        containerRef\r\n      }\r\n      className={`fb-magnetic-cursor ${className}`}\r\n      style={{\r\n        ...style,\r\n\r\n        cursor:\r\n          \"none\",\r\n      }}\r\n    >\r\n      <div className=\"fb-magnetic-cursor__content\">\r\n        {children}\r\n      </div>\r\n\r\n      <span\r\n        aria-hidden=\"true\"\r\n        className={`fb-magnetic-cursor__ring ${\r\n          visible\r\n            ? \"is-visible\"\r\n            : \"\"\r\n        } ${\r\n          hoveringTarget\r\n            ? \"is-targeting\"\r\n            : \"\"\r\n        }`}\r\n        style={{\r\n          width:\r\n            ringSize,\r\n\r\n          height:\r\n            ringSize,\r\n\r\n          left:\r\n            point.x,\r\n\r\n          top:\r\n            point.y,\r\n\r\n          borderColor:\r\n            color,\r\n\r\n          transitionDuration:\r\n            `${followSpeed}s`,\r\n        }}\r\n      />\r\n\r\n      <span\r\n        aria-hidden=\"true\"\r\n        className={`fb-magnetic-cursor__dot ${\r\n          visible\r\n            ? \"is-visible\"\r\n            : \"\"\r\n        }`}\r\n        style={{\r\n          width:\r\n            size,\r\n\r\n          height:\r\n            size,\r\n\r\n          left:\r\n            point.x,\r\n\r\n          top:\r\n            point.y,\r\n\r\n          background:\r\n            color,\r\n\r\n          boxShadow:\r\n            `0 0 ${size}px ${color}`,\r\n        }}\r\n      />\r\n    </div>\r\n  );\r\n}"]}

package/dist/chunk-R2F3FTBL.js

@@ -0,0 +1,119 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/landing/StartupLanding.tsx
+function StartupLanding({
+  accent = "#7d63ff",
+  background = "#08080c",
+  radius = 20,
+  showMetrics = true,
+  showFeatures = true,
+  className = "",
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      ...props,
+      className: `fb-startup-landing ${className}`,
+      style: {
+        ...style,
+        background,
+        ["--fb-startup-accent"]: accent,
+        ["--fb-startup-radius"]: `${radius}px`
+      },
+      children: [
+        /* @__PURE__ */ jsxs("nav", { className: "fb-startup-landing__nav", children: [
+          /* @__PURE__ */ jsx("strong", { children: "ACME." }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("a", { href: "#product", children: "Product" }),
+            /* @__PURE__ */ jsx("a", { href: "#features", children: "Features" }),
+            /* @__PURE__ */ jsx("a", { href: "#pricing", children: "Pricing" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              children: "Join waitlist"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "fb-startup-landing__hero", children: [
+          /* @__PURE__ */ jsx("span", { children: "LAUNCHING 2026" }),
+          /* @__PURE__ */ jsxs("h2", { children: [
+            "From idea",
+            /* @__PURE__ */ jsx("br", {}),
+            "to momentum."
+          ] }),
+          /* @__PURE__ */ jsx("p", { children: "A focused operating layer for ambitious startups that want to build, launch and learn faster." }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              children: "Get early access"
+            }
+          )
+        ] }),
+        showMetrics && /* @__PURE__ */ jsx("div", { className: "fb-startup-landing__metrics", children: [
+          [
+            "42K",
+            "Early users"
+          ],
+          [
+            "4.9",
+            "Average rating"
+          ],
+          [
+            "99.9%",
+            "Platform uptime"
+          ]
+        ].map(
+          ([
+            value,
+            label
+          ]) => /* @__PURE__ */ jsxs(
+            "article",
+            {
+              children: [
+                /* @__PURE__ */ jsx("strong", { children: value }),
+                /* @__PURE__ */ jsx("span", { children: label })
+              ]
+            },
+            label
+          )
+        ) }),
+        showFeatures && /* @__PURE__ */ jsx(
+          "div",
+          {
+            id: "features",
+            className: "fb-startup-landing__features",
+            children: [
+              "Ship",
+              "Measure",
+              "Scale"
+            ].map(
+              (feature, index) => /* @__PURE__ */ jsxs(
+                "article",
+                {
+                  children: [
+                    /* @__PURE__ */ jsxs("span", { children: [
+                      "0",
+                      index + 1
+                    ] }),
+                    /* @__PURE__ */ jsx("h3", { children: feature }),
+                    /* @__PURE__ */ jsx("p", { children: "Simple tools designed around the decisions that matter." })
+                  ]
+                },
+                feature
+              )
+            )
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { StartupLanding };
+//# sourceMappingURL=chunk-R2F3FTBL.js.map
+//# sourceMappingURL=chunk-R2F3FTBL.js.map

package/dist/chunk-R2F3FTBL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/landing/StartupLanding.tsx"],"names":[],"mappings":"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","file":"chunk-R2F3FTBL.js","sourcesContent":["import type {\r\n  HTMLAttributes,\r\n} from \"react\";\r\n\r\nimport \"./StartupLanding.css\";\r\n\r\nexport interface StartupLandingProps\r\n  extends HTMLAttributes<HTMLElement> {\r\n  accent?: string;\r\n  background?: string;\r\n  radius?: number;\r\n\r\n  showMetrics?: boolean;\r\n  showFeatures?: boolean;\r\n\r\n  className?: string;\r\n}\r\n\r\nexport function StartupLanding({\r\n  accent = \"#7d63ff\",\r\n  background = \"#08080c\",\r\n  radius = 20,\r\n\r\n  showMetrics = true,\r\n  showFeatures = true,\r\n\r\n  className = \"\",\r\n  style,\r\n\r\n  ...props\r\n}: StartupLandingProps) {\r\n  return (\r\n    <section\r\n      {...props}\r\n      className={`fb-startup-landing ${className}`}\r\n      style={{\r\n        ...style,\r\n\r\n        background,\r\n\r\n        [\"--fb-startup-accent\" as string]:\r\n          accent,\r\n\r\n        [\"--fb-startup-radius\" as string]:\r\n          `${radius}px`,\r\n      }}\r\n    >\r\n      <nav className=\"fb-startup-landing__nav\">\r\n        <strong>\r\n          ACME.\r\n        </strong>\r\n\r\n        <div>\r\n          <a href=\"#product\">\r\n            Product\r\n          </a>\r\n\r\n          <a href=\"#features\">\r\n            Features\r\n          </a>\r\n\r\n          <a href=\"#pricing\">\r\n            Pricing\r\n          </a>\r\n        </div>\r\n\r\n        <button\r\n          type=\"button\"\r\n        >\r\n          Join waitlist\r\n        </button>\r\n      </nav>\r\n\r\n      <div className=\"fb-startup-landing__hero\">\r\n        <span>\r\n          LAUNCHING 2026\r\n        </span>\r\n\r\n        <h2>\r\n          From idea\r\n          <br />\r\n          to momentum.\r\n        </h2>\r\n\r\n        <p>\r\n          A focused operating\r\n          layer for ambitious\r\n          startups that want to\r\n          build, launch and learn\r\n          faster.\r\n        </p>\r\n\r\n        <button\r\n          type=\"button\"\r\n        >\r\n          Get early access\r\n        </button>\r\n      </div>\r\n\r\n      {showMetrics && (\r\n        <div className=\"fb-startup-landing__metrics\">\r\n          {[\r\n            [\r\n              \"42K\",\r\n              \"Early users\",\r\n            ],\r\n            [\r\n              \"4.9\",\r\n              \"Average rating\",\r\n            ],\r\n            [\r\n              \"99.9%\",\r\n              \"Platform uptime\",\r\n            ],\r\n          ].map(\r\n            (\r\n              [\r\n                value,\r\n                label,\r\n              ]\r\n            ) => (\r\n              <article\r\n                key={\r\n                  label\r\n                }\r\n              >\r\n                <strong>\r\n                  {value}\r\n                </strong>\r\n\r\n                <span>\r\n                  {label}\r\n                </span>\r\n              </article>\r\n            )\r\n          )}\r\n        </div>\r\n      )}\r\n\r\n      {showFeatures && (\r\n        <div\r\n          id=\"features\"\r\n          className=\"fb-startup-landing__features\"\r\n        >\r\n          {[\r\n            \"Ship\",\r\n            \"Measure\",\r\n            \"Scale\",\r\n          ].map(\r\n            (\r\n              feature,\r\n              index\r\n            ) => (\r\n              <article\r\n                key={\r\n                  feature\r\n                }\r\n              >\r\n                <span>\r\n                  0{\r\n                    index +\r\n                    1\r\n                  }\r\n                </span>\r\n\r\n                <h3>\r\n                  {feature}\r\n                </h3>\r\n\r\n                <p>\r\n                  Simple tools\r\n                  designed around\r\n                  the decisions\r\n                  that matter.\r\n                </p>\r\n              </article>\r\n            )\r\n          )}\r\n        </div>\r\n      )}\r\n    </section>\r\n  );\r\n}"]}

package/dist/chunk-ROKPXWY2.cjs

@@ -0,0 +1,198 @@
+'use strict';
+
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/buttons/MagneticButton.tsx
+function MagneticButton({
+  children = "Explore",
+  background = "#ffffff",
+  textColor = "#000000",
+  fontSize = 14,
+  radius = 999,
+  paddingX = 22,
+  paddingY = 13,
+  strength = 0.3,
+  className = ""
+}) {
+  const [
+    offset,
+    setOffset
+  ] = react.useState({
+    x: 0,
+    y: 0
+  });
+  function handleMove(event) {
+    const rect = event.currentTarget.getBoundingClientRect();
+    const centerX = rect.width / 2;
+    const centerY = rect.height / 2;
+    const x = event.clientX - rect.left - centerX;
+    const y = event.clientY - rect.top - centerY;
+    setOffset({
+      x: x * strength,
+      y: y * strength
+    });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      className: `fb-magnetic-button ${className}`,
+      onMouseMove: handleMove,
+      onMouseLeave: () => setOffset({
+        x: 0,
+        y: 0
+      }),
+      style: {
+        background,
+        color: textColor,
+        fontSize,
+        borderRadius: radius,
+        padding: `${paddingY}px ${paddingX}px`,
+        transform: `translate3d(
+            ${offset.x}px,
+            ${offset.y}px,
+            0
+          )`
+      },
+      children
+    }
+  );
+}
+function GlowButton({
+  children = "Get started",
+  background = "#7b5cff",
+  textColor = "#ffffff",
+  glowColor = "#9b7cff",
+  glow = 32,
+  radius = 14,
+  fontSize = 14,
+  paddingX = 24,
+  className = "",
+  style,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      ...props,
+      type: props.type ?? "button",
+      className: `fb-glow-button ${className}`,
+      style: {
+        ...style,
+        background,
+        color: textColor,
+        borderRadius: radius,
+        fontSize,
+        padding: `13px ${paddingX}px`,
+        boxShadow: `0 0 ${glow}px ${glowColor}66`,
+        ["--fb-glow-button-color"]: glowColor
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "fb-glow-button__content", children }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "fb-glow-button__glow",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+}
+function hexToRgb(hex) {
+  const clean = hex.replace(
+    "#",
+    ""
+  );
+  if (clean.length !== 6) {
+    return {
+      r: 255,
+      g: 255,
+      b: 255
+    };
+  }
+  return {
+    r: parseInt(
+      clean.slice(
+        0,
+        2
+      ),
+      16
+    ),
+    g: parseInt(
+      clean.slice(
+        2,
+        4
+      ),
+      16
+    ),
+    b: parseInt(
+      clean.slice(
+        4,
+        6
+      ),
+      16
+    )
+  };
+}
+function GlassButton({
+  children = "Explore",
+  textColor = "#ffffff",
+  tint = "#ffffff",
+  opacity = 0.08,
+  blur = 16,
+  radius = 16,
+  borderOpacity = 0.18,
+  className = "",
+  style,
+  ...props
+}) {
+  const rgb = hexToRgb(
+    tint
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      ...props,
+      type: props.type ?? "button",
+      className: `fb-glass-button ${className}`,
+      style: {
+        ...style,
+        color: textColor,
+        background: `rgba(
+            ${rgb.r},
+            ${rgb.g},
+            ${rgb.b},
+            ${opacity}
+          )`,
+        backdropFilter: `blur(${blur}px)`,
+        WebkitBackdropFilter: `blur(${blur}px)`,
+        borderRadius: radius,
+        borderColor: `rgba(
+            255,
+            255,
+            255,
+            ${borderOpacity}
+          )`
+      },
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "fb-glass-button__shine",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.GlassButton = GlassButton;
+exports.GlowButton = GlowButton;
+exports.MagneticButton = MagneticButton;
+//# sourceMappingURL=chunk-ROKPXWY2.cjs.map
+//# sourceMappingURL=chunk-ROKPXWY2.cjs.map

package/dist/chunk-ROKPXWY2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/buttons/MagneticButton.tsx","../src/buttons/GlowButton.tsx","../src/buttons/GlassButton.tsx"],"names":["useState","jsx","jsxs"],"mappings":"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","file":"chunk-ROKPXWY2.cjs","sourcesContent":["import {\r\n  useState,\r\n} from \"react\";\r\n\r\nimport \"./MagneticButton.css\";\r\n\r\nexport interface MagneticButtonProps {\r\n  children?: React.ReactNode;\r\n\r\n  background?: string;\r\n  textColor?: string;\r\n  fontSize?: number;\r\n  radius?: number;\r\n  paddingX?: number;\r\n  paddingY?: number;\r\n  strength?: number;\r\n\r\n  className?: string;\r\n}\r\n\r\nexport function MagneticButton({\r\n  children = \"Explore\",\r\n\r\n  background =\r\n    \"#ffffff\",\r\n\r\n  textColor =\r\n    \"#000000\",\r\n\r\n  fontSize =\r\n    14,\r\n\r\n  radius =\r\n    999,\r\n\r\n  paddingX =\r\n    22,\r\n\r\n  paddingY =\r\n    13,\r\n\r\n  strength =\r\n    0.3,\r\n\r\n  className =\r\n    \"\",\r\n}: MagneticButtonProps) {\r\n  const [\r\n    offset,\r\n    setOffset,\r\n  ] =\r\n    useState({\r\n      x: 0,\r\n      y: 0,\r\n    });\r\n\r\n  function handleMove(\r\n    event:\r\n      React.MouseEvent<HTMLButtonElement>\r\n  ) {\r\n    const rect =\r\n      event.currentTarget.getBoundingClientRect();\r\n\r\n    const centerX =\r\n      rect.width /\r\n      2;\r\n\r\n    const centerY =\r\n      rect.height /\r\n      2;\r\n\r\n    const x =\r\n      event.clientX -\r\n      rect.left -\r\n      centerX;\r\n\r\n    const y =\r\n      event.clientY -\r\n      rect.top -\r\n      centerY;\r\n\r\n    setOffset({\r\n      x:\r\n        x *\r\n        strength,\r\n\r\n      y:\r\n        y *\r\n        strength,\r\n    });\r\n  }\r\n\r\n  return (\r\n    <button\r\n      type=\"button\"\r\n      className={`fb-magnetic-button ${className}`}\r\n      onMouseMove={\r\n        handleMove\r\n      }\r\n      onMouseLeave={() =>\r\n        setOffset({\r\n          x: 0,\r\n          y: 0,\r\n        })\r\n      }\r\n      style={{\r\n        background,\r\n        color:\r\n          textColor,\r\n\r\n        fontSize,\r\n\r\n        borderRadius:\r\n          radius,\r\n\r\n        padding:\r\n          `${paddingY}px ${paddingX}px`,\r\n\r\n        transform:\r\n          `translate3d(\r\n            ${offset.x}px,\r\n            ${offset.y}px,\r\n            0\r\n          )`,\r\n      }}\r\n    >\r\n      {children}\r\n    </button>\r\n  );\r\n}","import type {\r\n  ButtonHTMLAttributes,\r\n  ReactNode,\r\n} from \"react\";\r\n\r\nimport \"./GlowButton.css\";\r\n\r\nexport interface GlowButtonProps\r\n  extends Omit<\r\n    ButtonHTMLAttributes<HTMLButtonElement>,\r\n    \"color\"\r\n  > {\r\n  children?: ReactNode;\r\n\r\n  background?: string;\r\n\r\n  textColor?: string;\r\n\r\n  glowColor?: string;\r\n\r\n  glow?: number;\r\n\r\n  radius?: number;\r\n\r\n  fontSize?: number;\r\n\r\n  paddingX?: number;\r\n}\r\n\r\nexport function GlowButton({\r\n  children = \"Get started\",\r\n\r\n  background = \"#7b5cff\",\r\n\r\n  textColor = \"#ffffff\",\r\n\r\n  glowColor = \"#9b7cff\",\r\n\r\n  glow = 32,\r\n\r\n  radius = 14,\r\n\r\n  fontSize = 14,\r\n\r\n  paddingX = 24,\r\n\r\n  className = \"\",\r\n\r\n  style,\r\n\r\n  ...props\r\n}: GlowButtonProps) {\r\n  return (\r\n    <button\r\n      {...props}\r\n      type={\r\n        props.type ??\r\n        \"button\"\r\n      }\r\n      className={`fb-glow-button ${className}`}\r\n      style={{\r\n        ...style,\r\n\r\n        background,\r\n\r\n        color:\r\n          textColor,\r\n\r\n        borderRadius:\r\n          radius,\r\n\r\n        fontSize,\r\n\r\n        padding:\r\n          `13px ${paddingX}px`,\r\n\r\n        boxShadow:\r\n          `0 0 ${glow}px ${glowColor}66`,\r\n\r\n        [\"--fb-glow-button-color\" as string]:\r\n          glowColor,\r\n      }}\r\n    >\r\n      <span className=\"fb-glow-button__content\">\r\n        {\r\n          children\r\n        }\r\n      </span>\r\n\r\n      <span\r\n        className=\"fb-glow-button__glow\"\r\n        aria-hidden=\"true\"\r\n      />\r\n    </button>\r\n  );\r\n}","import type {\r\n  ButtonHTMLAttributes,\r\n  ReactNode,\r\n} from \"react\";\r\n\r\nimport \"./GlassButton.css\";\r\n\r\nexport interface GlassButtonProps\r\n  extends Omit<\r\n    ButtonHTMLAttributes<HTMLButtonElement>,\r\n    \"color\"\r\n  > {\r\n  children?: ReactNode;\r\n\r\n  textColor?: string;\r\n\r\n  tint?: string;\r\n\r\n  opacity?: number;\r\n\r\n  blur?: number;\r\n\r\n  radius?: number;\r\n\r\n  borderOpacity?: number;\r\n}\r\n\r\nfunction hexToRgb(\r\n  hex: string\r\n) {\r\n  const clean =\r\n    hex.replace(\r\n      \"#\",\r\n      \"\"\r\n    );\r\n\r\n  if (\r\n    clean.length !==\r\n    6\r\n  ) {\r\n    return {\r\n      r: 255,\r\n      g: 255,\r\n      b: 255,\r\n    };\r\n  }\r\n\r\n  return {\r\n    r:\r\n      parseInt(\r\n        clean.slice(\r\n          0,\r\n          2\r\n        ),\r\n        16\r\n      ),\r\n\r\n    g:\r\n      parseInt(\r\n        clean.slice(\r\n          2,\r\n          4\r\n        ),\r\n        16\r\n      ),\r\n\r\n    b:\r\n      parseInt(\r\n        clean.slice(\r\n          4,\r\n          6\r\n        ),\r\n        16\r\n      ),\r\n  };\r\n}\r\n\r\nexport function GlassButton({\r\n  children = \"Explore\",\r\n\r\n  textColor = \"#ffffff\",\r\n\r\n  tint = \"#ffffff\",\r\n\r\n  opacity = 0.08,\r\n\r\n  blur = 16,\r\n\r\n  radius = 16,\r\n\r\n  borderOpacity = 0.18,\r\n\r\n  className = \"\",\r\n\r\n  style,\r\n\r\n  ...props\r\n}: GlassButtonProps) {\r\n  const rgb =\r\n    hexToRgb(\r\n      tint\r\n    );\r\n\r\n  return (\r\n    <button\r\n      {...props}\r\n      type={\r\n        props.type ??\r\n        \"button\"\r\n      }\r\n      className={`fb-glass-button ${className}`}\r\n      style={{\r\n        ...style,\r\n\r\n        color:\r\n          textColor,\r\n\r\n        background:\r\n          `rgba(\r\n            ${rgb.r},\r\n            ${rgb.g},\r\n            ${rgb.b},\r\n            ${opacity}\r\n          )`,\r\n\r\n        backdropFilter:\r\n          `blur(${blur}px)`,\r\n\r\n        WebkitBackdropFilter:\r\n          `blur(${blur}px)`,\r\n\r\n        borderRadius:\r\n          radius,\r\n\r\n        borderColor:\r\n          `rgba(\r\n            255,\r\n            255,\r\n            255,\r\n            ${borderOpacity}\r\n          )`,\r\n      }}\r\n    >\r\n      {\r\n        children\r\n      }\r\n\r\n      <span\r\n        className=\"fb-glass-button__shine\"\r\n        aria-hidden=\"true\"\r\n      />\r\n    </button>\r\n  );\r\n}"]}