@blueshift-gg/ui-components 0.1.0

package/dist/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Slider.tsx"],"names":["useState","useRef","useCallback","useEffect","jsxs","classNames","jsx","Icon","motion","anticipate","CrosshairCorners","Fragment"],"mappings":"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","file":"Slider.js","sourcesContent":["import { anticipate, motion } from \"motion/react\";\nimport { useState, useCallback, useRef, useEffect } from \"react\";\nimport { Icon, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { CrosshairCorners } from \"./CrossHair\";\n\n// Helper function to abbreviate numbers\nconst abbreviateNumber = (num: number): string => {\n  const absNum = Math.abs(num);\n\n  if (absNum >= 1e9) {\n    return Math.round(num / 1e9) + \"B\";\n  }\n  if (absNum >= 1e6) {\n    return Math.round(num / 1e6) + \"M\";\n  }\n  if (absNum >= 1e3) {\n    return Math.round(num / 1e3) + \"K\";\n  }\n\n  return num.toString();\n};\n\nexport type SliderProps = {\n  type?: \"range\";\n  min?: number;\n  max?: number;\n  step?: number;\n  prefix?: string;\n  value?: {\n    min: number;\n    max: number;\n  };\n  header?: {\n    title: string;\n    icon?: IconProps;\n  };\n  onChange?: (value: { min: number; max: number }) => void;\n  className?: string;\n  abbreviateValues?: boolean;\n};\n\nexport const Slider = ({\n  type = \"range\",\n  min = 0,\n  max = 100,\n  step = 1,\n  value = { min: 0, max: 100 },\n  header,\n  prefix,\n  onChange,\n  className,\n  abbreviateValues = true,\n}: SliderProps) => {\n  const [currentValues, setCurrentValues] = useState({\n    min: value.min,\n    max: value.max,\n  });\n  const [isDragging, setIsDragging] = useState(false);\n  const [activeThumb, setActiveThumb] = useState<\n    \"min\" | \"max\" | \"center\" | null\n  >(null);\n  const [wasCenterDragging, setWasCenterDragging] = useState(false);\n  const sliderRef = useRef<HTMLDivElement>(null);\n  const [trackWidth, setTrackWidth] = useState(0);\n  const thumbSize = 27; // Size of the draggable thumb\n\n  // Calculate the percentage position of the current values\n  const minPercentage = ((currentValues.min - min) / (max - min)) * 100;\n  const maxPercentage = ((currentValues.max - min) / (max - min)) * 100;\n  const minThumbPosition =\n    (minPercentage / 100) * Math.max(0, trackWidth - thumbSize);\n  const maxThumbPosition =\n    (maxPercentage / 100) * Math.max(0, trackWidth - thumbSize);\n\n  const handleValueChange = useCallback(\n    (newMin: number, newMax: number) => {\n      const clampedMin = Math.max(min, Math.min(max, newMin));\n      const clampedMax = Math.max(min, Math.min(max, newMax));\n      const steppedMin = Math.round(clampedMin / step) * step;\n      const steppedMax = Math.round(clampedMax / step) * step;\n\n      // Ensure min doesn't exceed max and vice versa\n      const finalMin = Math.min(steppedMin, steppedMax);\n      const finalMax = Math.max(steppedMin, steppedMax);\n\n      setCurrentValues({ min: finalMin, max: finalMax });\n      onChange?.({ min: finalMin, max: finalMax });\n    },\n    [min, max, step, onChange]\n  );\n\n  const handlePointerMove = useCallback(\n    (clientX: number, thumb: \"min\" | \"max\" | \"center\") => {\n      if (!sliderRef.current) return;\n      const rect = sliderRef.current.getBoundingClientRect();\n      // Map pointer position to the left position of the thumb (top-left),\n      // centering the thumb under the pointer for a natural feel\n      const xWithinTrack = clientX - rect.left;\n      const clampedX = Math.max(\n        0,\n        Math.min(rect.width - thumbSize, xWithinTrack - thumbSize / 2)\n      );\n      const percentage =\n        rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;\n      const newValue = min + percentage * (max - min);\n\n      if (thumb === \"min\") {\n        handleValueChange(newValue, currentValues.max);\n      } else if (thumb === \"max\") {\n        handleValueChange(currentValues.min, newValue);\n      } else if (thumb === \"center\") {\n        // Calculate the current range width\n        const rangeWidth = currentValues.max - currentValues.min;\n        const halfRange = rangeWidth / 2;\n\n        // Calculate new min and max values centered around the new position\n        const newMin = Math.max(\n          min,\n          Math.min(max - rangeWidth, newValue - halfRange)\n        );\n        const newMax = Math.min(\n          max,\n          Math.max(min + rangeWidth, newValue + halfRange)\n        );\n\n        handleValueChange(newMin, newMax);\n      }\n    },\n    [min, max, currentValues, handleValueChange]\n  );\n\n  const handlePointerDown = useCallback((thumb: \"min\" | \"max\" | \"center\") => {\n    setIsDragging(true);\n    setActiveThumb(thumb);\n    if (thumb === \"center\") {\n      setWasCenterDragging(true);\n    }\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    setIsDragging(false);\n    setActiveThumb(null);\n    // Reset the center dragging flag after a short delay to prevent track click\n    setTimeout(() => setWasCenterDragging(false), 100);\n  }, []);\n\n  // Handle track clicks\n  const handleTrackClick = useCallback(\n    (event: React.MouseEvent) => {\n      // Prevent track click if we just finished center dragging\n      if (wasCenterDragging) {\n        return;\n      }\n\n      if (sliderRef.current) {\n        const rect = sliderRef.current.getBoundingClientRect();\n        const x = event.clientX - rect.left;\n        const clampedX = Math.max(\n          0,\n          Math.min(rect.width - thumbSize, x - thumbSize / 2)\n        );\n        const percentage =\n          rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;\n        const newValue = min + percentage * (max - min);\n\n        // Check if the click is within the active track area\n        const isWithinActiveTrack =\n          x >= minThumbPosition && x <= maxThumbPosition + thumbSize;\n\n        // Determine which thumb is closer and update that one\n        const distanceToMin = Math.abs(newValue - currentValues.min);\n        const distanceToMax = Math.abs(newValue - currentValues.max);\n\n        if (distanceToMin < distanceToMax) {\n          handleValueChange(newValue, currentValues.max);\n        } else {\n          handleValueChange(currentValues.min, newValue);\n        }\n      }\n    },\n    [\n      min,\n      max,\n      currentValues,\n      handleValueChange,\n      wasCenterDragging,\n      minThumbPosition,\n      maxThumbPosition,\n      thumbSize,\n    ]\n  );\n\n  // Handle active track clicks (center dragging)\n  const handleActiveTrackClick = useCallback(\n    (event: React.PointerEvent) => {\n      event.stopPropagation(); // Prevent track click from firing\n      handlePointerDown(\"center\");\n    },\n    [handlePointerDown]\n  );\n\n  // Update current values when prop changes\n  useEffect(() => {\n    setCurrentValues({ min: value.min, max: value.max });\n  }, [value.min, value.max]);\n\n  // Measure track width responsively\n  useEffect(() => {\n    const measure = () => {\n      if (sliderRef.current) {\n        setTrackWidth(sliderRef.current.clientWidth);\n      }\n    };\n    measure();\n    window.addEventListener(\"resize\", measure);\n    return () => window.removeEventListener(\"resize\", measure);\n  }, []);\n\n  // Global pointer listeners during drag\n  useEffect(() => {\n    if (!isDragging || !activeThumb) return;\n    const handleMove = (e: PointerEvent) => {\n      handlePointerMove(e.clientX, activeThumb);\n    };\n    const handleUp = () => {\n      handlePointerUp();\n      window.removeEventListener(\"pointermove\", handleMove);\n      window.removeEventListener(\"pointerup\", handleUp);\n    };\n    window.addEventListener(\"pointermove\", handleMove);\n    window.addEventListener(\"pointerup\", handleUp, { once: true });\n    return () => {\n      window.removeEventListener(\"pointermove\", handleMove);\n      window.removeEventListener(\"pointerup\", handleUp);\n    };\n  }, [isDragging, activeThumb, handlePointerMove, handlePointerUp]);\n\n  const abbreviatedMin = abbreviateValues\n    ? abbreviateNumber(currentValues.min)\n    : currentValues.min.toString();\n  const abbreviatedMax = abbreviateValues\n    ? abbreviateNumber(currentValues.max)\n    : currentValues.max.toString();\n\n  return (\n    <div\n      className={classNames(\n        \"relative w-full flex flex-col gap-y-2.5 select-none\",\n        className\n      )}\n    >\n      {header && (\n        <div className=\"flex items-center justify-between px-1\">\n          <span className=\"text-base font-medium text-shade-primary leading-none\">\n            {header.title}\n          </span>\n          <div className=\"flex items-center gap-x-1 text-shade-tertiary\">\n            {header.icon && (\n              <Icon name={header.icon.name} size={header.icon.size} />\n            )}\n            {prefix ? (\n              <span className=\"leading-none font-mono text-sm\">\n                {prefix}\n                {abbreviatedMin} - {prefix}\n                {abbreviatedMax}\n              </span>\n            ) : (\n              <span className=\"leading-none font-mono text-sm\">\n                {abbreviatedMin} - {abbreviatedMax}\n              </span>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div\n        ref={sliderRef}\n        className=\"relative cursor-pointer w-full h-[24px]\"\n        onClick={handleTrackClick}\n        role=\"group\"\n        aria-label={`Range slider: ${currentValues.min} to ${currentValues.max}`}\n      >\n        {/* Track background */}\n        <div className=\"absolute inset-0 border border-border-light shadow-[inset_0px_0px_12px_rgba(173,185,210,0.15)] [background:linear-gradient(0deg,rgba(173,185,210,0.02),rgba(173,185,210,0.02)),#0B0E14]\" />\n\n        {/* Active track */}\n        <motion.div\n          initial={{ opacity: 0 }}\n          animate={{ opacity: [0, 1, 0.2, 1, 0.4, 1, 0.6, 1, 0.8, 1] }}\n          transition={{ duration: 1, delay: 0.5, ease: anticipate }}\n          className={classNames(\n            \"h-[24px] top-1/2 -translate-y-1/2 absolute inset-y-0 shadow-[inset_0px_0px_12px_rgba(0,255,255,0.25)] [background:linear-gradient(130deg,rgba(0,255,255,0)_0%,rgba(0,255,255,0.3)_40%,rgba(0,255,255,0.6)_50%,rgba(0,255,255,0.3)_60%,rgba(0,255,255,0.0)_100%)] cursor-grab active:cursor-grabbing\"\n          )}\n          style={{\n            left: `${minThumbPosition}px`,\n            width: `${maxThumbPosition - minThumbPosition + thumbSize}px`,\n            backgroundSize: `300%`,\n            backgroundPosition: \"center\",\n          }}\n          onPointerDown={handleActiveTrackClick}\n        />\n\n        {/* Min thumb */}\n        <motion.div\n          className={classNames(\n            `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,\n            activeThumb === \"min\" ? \"z-20\" : \"z-10\"\n          )}\n          style={{\n            left: minThumbPosition,\n          }}\n          onPointerDown={() => handlePointerDown(\"min\")}\n          role=\"slider\"\n          aria-label=\"Minimum value\"\n          aria-orientation=\"horizontal\"\n          aria-valuemin={min}\n          aria-valuemax={currentValues.max}\n          aria-valuenow={currentValues.min}\n          tabIndex={0}\n          whileTap={{ scale: 0.95 }}\n        >\n          <CrosshairCorners\n            animationDelay={0}\n            animationDuration={1}\n            size={6}\n            variant=\"bordered\"\n            borders={[\"left\"]}\n            className=\"text-brand-primary\"\n          />\n        </motion.div>\n\n        {/* Max thumb */}\n        <motion.div\n          className={classNames(\n            `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,\n            activeThumb === \"max\" ? \"z-20\" : \"z-10\"\n          )}\n          style={{\n            left: maxThumbPosition,\n          }}\n          onPointerDown={() => handlePointerDown(\"max\")}\n          role=\"slider\"\n          aria-label=\"Maximum value\"\n          aria-orientation=\"horizontal\"\n          aria-valuemin={currentValues.min}\n          aria-valuemax={max}\n          aria-valuenow={currentValues.max}\n          tabIndex={0}\n          whileTap={{ scale: 0.95 }}\n        >\n          {\" \"}\n          <CrosshairCorners\n            animationDelay={0}\n            animationDuration={1}\n            size={6}\n            variant=\"bordered\"\n            borders={[\"right\"]}\n            className=\"text-brand-primary\"\n          />\n        </motion.div>\n      </div>\n\n      {/* Tick marks */}\n      <div className=\"relative flex items-center justify-between\">\n        {/* Calculate tick positions */}\n        {(() => {\n          const tickValues = [\n            min,\n            min + (max - min) * 0.25,\n            min + (max - min) * 0.5,\n            min + (max - min) * 0.75,\n            max,\n          ];\n\n          return tickValues.map((tickValue, index) => {\n            const position = (tickValue - min) / (max - min);\n            const leftPosition =\n              position * (trackWidth - thumbSize) + thumbSize / 2;\n\n            return (\n              <>\n                <span\n                  key={index}\n                  style={{ left: leftPosition }}\n                  className=\"font-mono text-xs text-shade-tertiary leading-none whitespace-nowrap\"\n                >\n                  {abbreviateValues\n                    ? abbreviateNumber(tickValue)\n                    : tickValue.toString()}\n                </span>\n                <div\n                  key={`divider-${index}`}\n                  className=\"w-0.5 h-0.5 bg-shade-tertiary/25 last:hidden\"\n                  style={{ left: leftPosition }}\n                />\n              </>\n            );\n          });\n        })()}\n      </div>\n    </div>\n  );\n};\n"]}

package/dist/Slider.mjs

@@ -0,0 +1,338 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { motion, anticipate } from 'motion/react';
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { Icon } from './Icon';
+import classNames from 'classnames';
+import { CrosshairCorners } from './CrossHair';
+
+const abbreviateNumber = (num) => {
+  const absNum = Math.abs(num);
+  if (absNum >= 1e9) {
+    return Math.round(num / 1e9) + "B";
+  }
+  if (absNum >= 1e6) {
+    return Math.round(num / 1e6) + "M";
+  }
+  if (absNum >= 1e3) {
+    return Math.round(num / 1e3) + "K";
+  }
+  return num.toString();
+};
+const Slider = ({
+  type = "range",
+  min = 0,
+  max = 100,
+  step = 1,
+  value = { min: 0, max: 100 },
+  header,
+  prefix,
+  onChange,
+  className,
+  abbreviateValues = true
+}) => {
+  const [currentValues, setCurrentValues] = useState({
+    min: value.min,
+    max: value.max
+  });
+  const [isDragging, setIsDragging] = useState(false);
+  const [activeThumb, setActiveThumb] = useState(null);
+  const [wasCenterDragging, setWasCenterDragging] = useState(false);
+  const sliderRef = useRef(null);
+  const [trackWidth, setTrackWidth] = useState(0);
+  const thumbSize = 27;
+  const minPercentage = (currentValues.min - min) / (max - min) * 100;
+  const maxPercentage = (currentValues.max - min) / (max - min) * 100;
+  const minThumbPosition = minPercentage / 100 * Math.max(0, trackWidth - thumbSize);
+  const maxThumbPosition = maxPercentage / 100 * Math.max(0, trackWidth - thumbSize);
+  const handleValueChange = useCallback(
+    (newMin, newMax) => {
+      const clampedMin = Math.max(min, Math.min(max, newMin));
+      const clampedMax = Math.max(min, Math.min(max, newMax));
+      const steppedMin = Math.round(clampedMin / step) * step;
+      const steppedMax = Math.round(clampedMax / step) * step;
+      const finalMin = Math.min(steppedMin, steppedMax);
+      const finalMax = Math.max(steppedMin, steppedMax);
+      setCurrentValues({ min: finalMin, max: finalMax });
+      onChange?.({ min: finalMin, max: finalMax });
+    },
+    [min, max, step, onChange]
+  );
+  const handlePointerMove = useCallback(
+    (clientX, thumb) => {
+      if (!sliderRef.current) return;
+      const rect = sliderRef.current.getBoundingClientRect();
+      const xWithinTrack = clientX - rect.left;
+      const clampedX = Math.max(
+        0,
+        Math.min(rect.width - thumbSize, xWithinTrack - thumbSize / 2)
+      );
+      const percentage = rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;
+      const newValue = min + percentage * (max - min);
+      if (thumb === "min") {
+        handleValueChange(newValue, currentValues.max);
+      } else if (thumb === "max") {
+        handleValueChange(currentValues.min, newValue);
+      } else if (thumb === "center") {
+        const rangeWidth = currentValues.max - currentValues.min;
+        const halfRange = rangeWidth / 2;
+        const newMin = Math.max(
+          min,
+          Math.min(max - rangeWidth, newValue - halfRange)
+        );
+        const newMax = Math.min(
+          max,
+          Math.max(min + rangeWidth, newValue + halfRange)
+        );
+        handleValueChange(newMin, newMax);
+      }
+    },
+    [min, max, currentValues, handleValueChange]
+  );
+  const handlePointerDown = useCallback((thumb) => {
+    setIsDragging(true);
+    setActiveThumb(thumb);
+    if (thumb === "center") {
+      setWasCenterDragging(true);
+    }
+  }, []);
+  const handlePointerUp = useCallback(() => {
+    setIsDragging(false);
+    setActiveThumb(null);
+    setTimeout(() => setWasCenterDragging(false), 100);
+  }, []);
+  const handleTrackClick = useCallback(
+    (event) => {
+      if (wasCenterDragging) {
+        return;
+      }
+      if (sliderRef.current) {
+        const rect = sliderRef.current.getBoundingClientRect();
+        const x = event.clientX - rect.left;
+        const clampedX = Math.max(
+          0,
+          Math.min(rect.width - thumbSize, x - thumbSize / 2)
+        );
+        const percentage = rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;
+        const newValue = min + percentage * (max - min);
+        const distanceToMin = Math.abs(newValue - currentValues.min);
+        const distanceToMax = Math.abs(newValue - currentValues.max);
+        if (distanceToMin < distanceToMax) {
+          handleValueChange(newValue, currentValues.max);
+        } else {
+          handleValueChange(currentValues.min, newValue);
+        }
+      }
+    },
+    [
+      min,
+      max,
+      currentValues,
+      handleValueChange,
+      wasCenterDragging,
+      minThumbPosition,
+      maxThumbPosition,
+      thumbSize
+    ]
+  );
+  const handleActiveTrackClick = useCallback(
+    (event) => {
+      event.stopPropagation();
+      handlePointerDown("center");
+    },
+    [handlePointerDown]
+  );
+  useEffect(() => {
+    setCurrentValues({ min: value.min, max: value.max });
+  }, [value.min, value.max]);
+  useEffect(() => {
+    const measure = () => {
+      if (sliderRef.current) {
+        setTrackWidth(sliderRef.current.clientWidth);
+      }
+    };
+    measure();
+    window.addEventListener("resize", measure);
+    return () => window.removeEventListener("resize", measure);
+  }, []);
+  useEffect(() => {
+    if (!isDragging || !activeThumb) return;
+    const handleMove = (e) => {
+      handlePointerMove(e.clientX, activeThumb);
+    };
+    const handleUp = () => {
+      handlePointerUp();
+      window.removeEventListener("pointermove", handleMove);
+      window.removeEventListener("pointerup", handleUp);
+    };
+    window.addEventListener("pointermove", handleMove);
+    window.addEventListener("pointerup", handleUp, { once: true });
+    return () => {
+      window.removeEventListener("pointermove", handleMove);
+      window.removeEventListener("pointerup", handleUp);
+    };
+  }, [isDragging, activeThumb, handlePointerMove, handlePointerUp]);
+  const abbreviatedMin = abbreviateValues ? abbreviateNumber(currentValues.min) : currentValues.min.toString();
+  const abbreviatedMax = abbreviateValues ? abbreviateNumber(currentValues.max) : currentValues.max.toString();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: classNames(
+        "relative w-full flex flex-col gap-y-2.5 select-none",
+        className
+      ),
+      children: [
+        header && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-1", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-base font-medium text-shade-primary leading-none", children: header.title }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1 text-shade-tertiary", children: [
+            header.icon && /* @__PURE__ */ jsx(Icon, { name: header.icon.name, size: header.icon.size }),
+            prefix ? /* @__PURE__ */ jsxs("span", { className: "leading-none font-mono text-sm", children: [
+              prefix,
+              abbreviatedMin,
+              " - ",
+              prefix,
+              abbreviatedMax
+            ] }) : /* @__PURE__ */ jsxs("span", { className: "leading-none font-mono text-sm", children: [
+              abbreviatedMin,
+              " - ",
+              abbreviatedMax
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ref: sliderRef,
+            className: "relative cursor-pointer w-full h-[24px]",
+            onClick: handleTrackClick,
+            role: "group",
+            "aria-label": `Range slider: ${currentValues.min} to ${currentValues.max}`,
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "absolute inset-0 border border-border-light shadow-[inset_0px_0px_12px_rgba(173,185,210,0.15)] [background:linear-gradient(0deg,rgba(173,185,210,0.02),rgba(173,185,210,0.02)),#0B0E14]" }),
+              /* @__PURE__ */ jsx(
+                motion.div,
+                {
+                  initial: { opacity: 0 },
+                  animate: { opacity: [0, 1, 0.2, 1, 0.4, 1, 0.6, 1, 0.8, 1] },
+                  transition: { duration: 1, delay: 0.5, ease: anticipate },
+                  className: classNames(
+                    "h-[24px] top-1/2 -translate-y-1/2 absolute inset-y-0 shadow-[inset_0px_0px_12px_rgba(0,255,255,0.25)] [background:linear-gradient(130deg,rgba(0,255,255,0)_0%,rgba(0,255,255,0.3)_40%,rgba(0,255,255,0.6)_50%,rgba(0,255,255,0.3)_60%,rgba(0,255,255,0.0)_100%)] cursor-grab active:cursor-grabbing"
+                  ),
+                  style: {
+                    left: `${minThumbPosition}px`,
+                    width: `${maxThumbPosition - minThumbPosition + thumbSize}px`,
+                    backgroundSize: `300%`,
+                    backgroundPosition: "center"
+                  },
+                  onPointerDown: handleActiveTrackClick
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                motion.div,
+                {
+                  className: classNames(
+                    `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,
+                    activeThumb === "min" ? "z-20" : "z-10"
+                  ),
+                  style: {
+                    left: minThumbPosition
+                  },
+                  onPointerDown: () => handlePointerDown("min"),
+                  role: "slider",
+                  "aria-label": "Minimum value",
+                  "aria-orientation": "horizontal",
+                  "aria-valuemin": min,
+                  "aria-valuemax": currentValues.max,
+                  "aria-valuenow": currentValues.min,
+                  tabIndex: 0,
+                  whileTap: { scale: 0.95 },
+                  children: /* @__PURE__ */ jsx(
+                    CrosshairCorners,
+                    {
+                      animationDelay: 0,
+                      animationDuration: 1,
+                      size: 6,
+                      variant: "bordered",
+                      borders: ["left"],
+                      className: "text-brand-primary"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                motion.div,
+                {
+                  className: classNames(
+                    `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,
+                    activeThumb === "max" ? "z-20" : "z-10"
+                  ),
+                  style: {
+                    left: maxThumbPosition
+                  },
+                  onPointerDown: () => handlePointerDown("max"),
+                  role: "slider",
+                  "aria-label": "Maximum value",
+                  "aria-orientation": "horizontal",
+                  "aria-valuemin": currentValues.min,
+                  "aria-valuemax": max,
+                  "aria-valuenow": currentValues.max,
+                  tabIndex: 0,
+                  whileTap: { scale: 0.95 },
+                  children: [
+                    " ",
+                    /* @__PURE__ */ jsx(
+                      CrosshairCorners,
+                      {
+                        animationDelay: 0,
+                        animationDuration: 1,
+                        size: 6,
+                        variant: "bordered",
+                        borders: ["right"],
+                        className: "text-brand-primary"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "relative flex items-center justify-between", children: (() => {
+          const tickValues = [
+            min,
+            min + (max - min) * 0.25,
+            min + (max - min) * 0.5,
+            min + (max - min) * 0.75,
+            max
+          ];
+          return tickValues.map((tickValue, index) => {
+            const position = (tickValue - min) / (max - min);
+            const leftPosition = position * (trackWidth - thumbSize) + thumbSize / 2;
+            return /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  style: { left: leftPosition },
+                  className: "font-mono text-xs text-shade-tertiary leading-none whitespace-nowrap",
+                  children: abbreviateValues ? abbreviateNumber(tickValue) : tickValue.toString()
+                },
+                index
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "w-0.5 h-0.5 bg-shade-tertiary/25 last:hidden",
+                  style: { left: leftPosition }
+                },
+                `divider-${index}`
+              )
+            ] });
+          });
+        })() })
+      ]
+    }
+  );
+};
+
+export { Slider };
+//# sourceMappingURL=Slider.mjs.map
+//# sourceMappingURL=Slider.mjs.map

package/dist/Slider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Slider.tsx"],"names":[],"mappings":"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","file":"Slider.mjs","sourcesContent":["import { anticipate, motion } from \"motion/react\";\nimport { useState, useCallback, useRef, useEffect } from \"react\";\nimport { Icon, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { CrosshairCorners } from \"./CrossHair\";\n\n// Helper function to abbreviate numbers\nconst abbreviateNumber = (num: number): string => {\n  const absNum = Math.abs(num);\n\n  if (absNum >= 1e9) {\n    return Math.round(num / 1e9) + \"B\";\n  }\n  if (absNum >= 1e6) {\n    return Math.round(num / 1e6) + \"M\";\n  }\n  if (absNum >= 1e3) {\n    return Math.round(num / 1e3) + \"K\";\n  }\n\n  return num.toString();\n};\n\nexport type SliderProps = {\n  type?: \"range\";\n  min?: number;\n  max?: number;\n  step?: number;\n  prefix?: string;\n  value?: {\n    min: number;\n    max: number;\n  };\n  header?: {\n    title: string;\n    icon?: IconProps;\n  };\n  onChange?: (value: { min: number; max: number }) => void;\n  className?: string;\n  abbreviateValues?: boolean;\n};\n\nexport const Slider = ({\n  type = \"range\",\n  min = 0,\n  max = 100,\n  step = 1,\n  value = { min: 0, max: 100 },\n  header,\n  prefix,\n  onChange,\n  className,\n  abbreviateValues = true,\n}: SliderProps) => {\n  const [currentValues, setCurrentValues] = useState({\n    min: value.min,\n    max: value.max,\n  });\n  const [isDragging, setIsDragging] = useState(false);\n  const [activeThumb, setActiveThumb] = useState<\n    \"min\" | \"max\" | \"center\" | null\n  >(null);\n  const [wasCenterDragging, setWasCenterDragging] = useState(false);\n  const sliderRef = useRef<HTMLDivElement>(null);\n  const [trackWidth, setTrackWidth] = useState(0);\n  const thumbSize = 27; // Size of the draggable thumb\n\n  // Calculate the percentage position of the current values\n  const minPercentage = ((currentValues.min - min) / (max - min)) * 100;\n  const maxPercentage = ((currentValues.max - min) / (max - min)) * 100;\n  const minThumbPosition =\n    (minPercentage / 100) * Math.max(0, trackWidth - thumbSize);\n  const maxThumbPosition =\n    (maxPercentage / 100) * Math.max(0, trackWidth - thumbSize);\n\n  const handleValueChange = useCallback(\n    (newMin: number, newMax: number) => {\n      const clampedMin = Math.max(min, Math.min(max, newMin));\n      const clampedMax = Math.max(min, Math.min(max, newMax));\n      const steppedMin = Math.round(clampedMin / step) * step;\n      const steppedMax = Math.round(clampedMax / step) * step;\n\n      // Ensure min doesn't exceed max and vice versa\n      const finalMin = Math.min(steppedMin, steppedMax);\n      const finalMax = Math.max(steppedMin, steppedMax);\n\n      setCurrentValues({ min: finalMin, max: finalMax });\n      onChange?.({ min: finalMin, max: finalMax });\n    },\n    [min, max, step, onChange]\n  );\n\n  const handlePointerMove = useCallback(\n    (clientX: number, thumb: \"min\" | \"max\" | \"center\") => {\n      if (!sliderRef.current) return;\n      const rect = sliderRef.current.getBoundingClientRect();\n      // Map pointer position to the left position of the thumb (top-left),\n      // centering the thumb under the pointer for a natural feel\n      const xWithinTrack = clientX - rect.left;\n      const clampedX = Math.max(\n        0,\n        Math.min(rect.width - thumbSize, xWithinTrack - thumbSize / 2)\n      );\n      const percentage =\n        rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;\n      const newValue = min + percentage * (max - min);\n\n      if (thumb === \"min\") {\n        handleValueChange(newValue, currentValues.max);\n      } else if (thumb === \"max\") {\n        handleValueChange(currentValues.min, newValue);\n      } else if (thumb === \"center\") {\n        // Calculate the current range width\n        const rangeWidth = currentValues.max - currentValues.min;\n        const halfRange = rangeWidth / 2;\n\n        // Calculate new min and max values centered around the new position\n        const newMin = Math.max(\n          min,\n          Math.min(max - rangeWidth, newValue - halfRange)\n        );\n        const newMax = Math.min(\n          max,\n          Math.max(min + rangeWidth, newValue + halfRange)\n        );\n\n        handleValueChange(newMin, newMax);\n      }\n    },\n    [min, max, currentValues, handleValueChange]\n  );\n\n  const handlePointerDown = useCallback((thumb: \"min\" | \"max\" | \"center\") => {\n    setIsDragging(true);\n    setActiveThumb(thumb);\n    if (thumb === \"center\") {\n      setWasCenterDragging(true);\n    }\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    setIsDragging(false);\n    setActiveThumb(null);\n    // Reset the center dragging flag after a short delay to prevent track click\n    setTimeout(() => setWasCenterDragging(false), 100);\n  }, []);\n\n  // Handle track clicks\n  const handleTrackClick = useCallback(\n    (event: React.MouseEvent) => {\n      // Prevent track click if we just finished center dragging\n      if (wasCenterDragging) {\n        return;\n      }\n\n      if (sliderRef.current) {\n        const rect = sliderRef.current.getBoundingClientRect();\n        const x = event.clientX - rect.left;\n        const clampedX = Math.max(\n          0,\n          Math.min(rect.width - thumbSize, x - thumbSize / 2)\n        );\n        const percentage =\n          rect.width - thumbSize > 0 ? clampedX / (rect.width - thumbSize) : 0;\n        const newValue = min + percentage * (max - min);\n\n        // Check if the click is within the active track area\n        const isWithinActiveTrack =\n          x >= minThumbPosition && x <= maxThumbPosition + thumbSize;\n\n        // Determine which thumb is closer and update that one\n        const distanceToMin = Math.abs(newValue - currentValues.min);\n        const distanceToMax = Math.abs(newValue - currentValues.max);\n\n        if (distanceToMin < distanceToMax) {\n          handleValueChange(newValue, currentValues.max);\n        } else {\n          handleValueChange(currentValues.min, newValue);\n        }\n      }\n    },\n    [\n      min,\n      max,\n      currentValues,\n      handleValueChange,\n      wasCenterDragging,\n      minThumbPosition,\n      maxThumbPosition,\n      thumbSize,\n    ]\n  );\n\n  // Handle active track clicks (center dragging)\n  const handleActiveTrackClick = useCallback(\n    (event: React.PointerEvent) => {\n      event.stopPropagation(); // Prevent track click from firing\n      handlePointerDown(\"center\");\n    },\n    [handlePointerDown]\n  );\n\n  // Update current values when prop changes\n  useEffect(() => {\n    setCurrentValues({ min: value.min, max: value.max });\n  }, [value.min, value.max]);\n\n  // Measure track width responsively\n  useEffect(() => {\n    const measure = () => {\n      if (sliderRef.current) {\n        setTrackWidth(sliderRef.current.clientWidth);\n      }\n    };\n    measure();\n    window.addEventListener(\"resize\", measure);\n    return () => window.removeEventListener(\"resize\", measure);\n  }, []);\n\n  // Global pointer listeners during drag\n  useEffect(() => {\n    if (!isDragging || !activeThumb) return;\n    const handleMove = (e: PointerEvent) => {\n      handlePointerMove(e.clientX, activeThumb);\n    };\n    const handleUp = () => {\n      handlePointerUp();\n      window.removeEventListener(\"pointermove\", handleMove);\n      window.removeEventListener(\"pointerup\", handleUp);\n    };\n    window.addEventListener(\"pointermove\", handleMove);\n    window.addEventListener(\"pointerup\", handleUp, { once: true });\n    return () => {\n      window.removeEventListener(\"pointermove\", handleMove);\n      window.removeEventListener(\"pointerup\", handleUp);\n    };\n  }, [isDragging, activeThumb, handlePointerMove, handlePointerUp]);\n\n  const abbreviatedMin = abbreviateValues\n    ? abbreviateNumber(currentValues.min)\n    : currentValues.min.toString();\n  const abbreviatedMax = abbreviateValues\n    ? abbreviateNumber(currentValues.max)\n    : currentValues.max.toString();\n\n  return (\n    <div\n      className={classNames(\n        \"relative w-full flex flex-col gap-y-2.5 select-none\",\n        className\n      )}\n    >\n      {header && (\n        <div className=\"flex items-center justify-between px-1\">\n          <span className=\"text-base font-medium text-shade-primary leading-none\">\n            {header.title}\n          </span>\n          <div className=\"flex items-center gap-x-1 text-shade-tertiary\">\n            {header.icon && (\n              <Icon name={header.icon.name} size={header.icon.size} />\n            )}\n            {prefix ? (\n              <span className=\"leading-none font-mono text-sm\">\n                {prefix}\n                {abbreviatedMin} - {prefix}\n                {abbreviatedMax}\n              </span>\n            ) : (\n              <span className=\"leading-none font-mono text-sm\">\n                {abbreviatedMin} - {abbreviatedMax}\n              </span>\n            )}\n          </div>\n        </div>\n      )}\n\n      <div\n        ref={sliderRef}\n        className=\"relative cursor-pointer w-full h-[24px]\"\n        onClick={handleTrackClick}\n        role=\"group\"\n        aria-label={`Range slider: ${currentValues.min} to ${currentValues.max}`}\n      >\n        {/* Track background */}\n        <div className=\"absolute inset-0 border border-border-light shadow-[inset_0px_0px_12px_rgba(173,185,210,0.15)] [background:linear-gradient(0deg,rgba(173,185,210,0.02),rgba(173,185,210,0.02)),#0B0E14]\" />\n\n        {/* Active track */}\n        <motion.div\n          initial={{ opacity: 0 }}\n          animate={{ opacity: [0, 1, 0.2, 1, 0.4, 1, 0.6, 1, 0.8, 1] }}\n          transition={{ duration: 1, delay: 0.5, ease: anticipate }}\n          className={classNames(\n            \"h-[24px] top-1/2 -translate-y-1/2 absolute inset-y-0 shadow-[inset_0px_0px_12px_rgba(0,255,255,0.25)] [background:linear-gradient(130deg,rgba(0,255,255,0)_0%,rgba(0,255,255,0.3)_40%,rgba(0,255,255,0.6)_50%,rgba(0,255,255,0.3)_60%,rgba(0,255,255,0.0)_100%)] cursor-grab active:cursor-grabbing\"\n          )}\n          style={{\n            left: `${minThumbPosition}px`,\n            width: `${maxThumbPosition - minThumbPosition + thumbSize}px`,\n            backgroundSize: `300%`,\n            backgroundPosition: \"center\",\n          }}\n          onPointerDown={handleActiveTrackClick}\n        />\n\n        {/* Min thumb */}\n        <motion.div\n          className={classNames(\n            `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,\n            activeThumb === \"min\" ? \"z-20\" : \"z-10\"\n          )}\n          style={{\n            left: minThumbPosition,\n          }}\n          onPointerDown={() => handlePointerDown(\"min\")}\n          role=\"slider\"\n          aria-label=\"Minimum value\"\n          aria-orientation=\"horizontal\"\n          aria-valuemin={min}\n          aria-valuemax={currentValues.max}\n          aria-valuenow={currentValues.min}\n          tabIndex={0}\n          whileTap={{ scale: 0.95 }}\n        >\n          <CrosshairCorners\n            animationDelay={0}\n            animationDuration={1}\n            size={6}\n            variant=\"bordered\"\n            borders={[\"left\"]}\n            className=\"text-brand-primary\"\n          />\n        </motion.div>\n\n        {/* Max thumb */}\n        <motion.div\n          className={classNames(\n            `-translate-y-1/2 top-1/2 h-[27px] w-[27px] absolute cursor-grab active:cursor-grabbing focus:outline-none`,\n            activeThumb === \"max\" ? \"z-20\" : \"z-10\"\n          )}\n          style={{\n            left: maxThumbPosition,\n          }}\n          onPointerDown={() => handlePointerDown(\"max\")}\n          role=\"slider\"\n          aria-label=\"Maximum value\"\n          aria-orientation=\"horizontal\"\n          aria-valuemin={currentValues.min}\n          aria-valuemax={max}\n          aria-valuenow={currentValues.max}\n          tabIndex={0}\n          whileTap={{ scale: 0.95 }}\n        >\n          {\" \"}\n          <CrosshairCorners\n            animationDelay={0}\n            animationDuration={1}\n            size={6}\n            variant=\"bordered\"\n            borders={[\"right\"]}\n            className=\"text-brand-primary\"\n          />\n        </motion.div>\n      </div>\n\n      {/* Tick marks */}\n      <div className=\"relative flex items-center justify-between\">\n        {/* Calculate tick positions */}\n        {(() => {\n          const tickValues = [\n            min,\n            min + (max - min) * 0.25,\n            min + (max - min) * 0.5,\n            min + (max - min) * 0.75,\n            max,\n          ];\n\n          return tickValues.map((tickValue, index) => {\n            const position = (tickValue - min) / (max - min);\n            const leftPosition =\n              position * (trackWidth - thumbSize) + thumbSize / 2;\n\n            return (\n              <>\n                <span\n                  key={index}\n                  style={{ left: leftPosition }}\n                  className=\"font-mono text-xs text-shade-tertiary leading-none whitespace-nowrap\"\n                >\n                  {abbreviateValues\n                    ? abbreviateNumber(tickValue)\n                    : tickValue.toString()}\n                </span>\n                <div\n                  key={`divider-${index}`}\n                  className=\"w-0.5 h-0.5 bg-shade-tertiary/25 last:hidden\"\n                  style={{ left: leftPosition }}\n                />\n              </>\n            );\n          });\n        })()}\n      </div>\n    </div>\n  );\n};\n"]}

package/dist/Tabs.d.mts

@@ -0,0 +1,23 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MotionProps } from 'motion/react';
+import { a as IconProps } from './index-DWGhkMUQ.mjs';
+import './utils/colours.mjs';
+
+type TabsProps = {
+    className?: string;
+    variant: "tab" | "segmented";
+    items: {
+        label?: string;
+        value: string;
+        icon?: IconProps;
+        disabled?: boolean;
+        selected?: boolean;
+        onClick?: () => void;
+    }[];
+    theme: "primary" | "secondary";
+    animation?: MotionProps;
+    stretch?: boolean;
+};
+declare const Tabs: ({ className, variant, items, theme, animation, stretch, }: TabsProps) => react_jsx_runtime.JSX.Element;
+
+export { Tabs, type TabsProps };

package/dist/Tabs.d.ts

@@ -0,0 +1,23 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { MotionProps } from 'motion/react';
+import { a as IconProps } from './index-ekBNDG0H.js';
+import './utils/colours.js';
+
+type TabsProps = {
+    className?: string;
+    variant: "tab" | "segmented";
+    items: {
+        label?: string;
+        value: string;
+        icon?: IconProps;
+        disabled?: boolean;
+        selected?: boolean;
+        onClick?: () => void;
+    }[];
+    theme: "primary" | "secondary";
+    animation?: MotionProps;
+    stretch?: boolean;
+};
+declare const Tabs: ({ className, variant, items, theme, animation, stretch, }: TabsProps) => react_jsx_runtime.JSX.Element;
+
+export { Tabs, type TabsProps };

package/dist/Tabs.js

@@ -0,0 +1,101 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+var react = require('motion/react');
+var Icon = require('./Icon');
+var easings = require('./utils/easings');
+var CrossHair = require('./CrossHair');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+
+const Tabs = ({
+  className,
+  variant,
+  items,
+  theme,
+  animation,
+  stretch
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    react.motion.div,
+    {
+      className: classNames__default.default(
+        "flex items-center gap-x-1 w-full",
+        variant === "segmented" && "border border-border p-1",
+        !stretch && "!w-max",
+        className
+      ),
+      ...animation,
+      children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
+        react.motion.button,
+        {
+          className: classNames__default.default(
+            "group hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-center w-full py-3 px-6 text-shade-tertiary",
+            !item.label && "w-max !px-3",
+            item.selected && theme === "secondary" && "!text-shade-primary",
+            item.selected && theme === "primary" && "!text-brand-primary"
+          ),
+          onClick: item.onClick,
+          children: [
+            item.selected && variant === "segmented" && /* @__PURE__ */ jsxRuntime.jsx(
+              react.motion.div,
+              {
+                layoutId: "segmented-tab-selected",
+                transition: { duration: 0.1, ease: easings.breeze },
+                className: classNames__default.default(
+                  "absolute inset-0",
+                  theme === "primary" && "bg-brand-tertiary/8",
+                  theme === "secondary" && "bg-card-foreground"
+                )
+              }
+            ),
+            item.selected && variant === "tab" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                react.motion.div,
+                {
+                  initial: { opacity: 0 },
+                  animate: { opacity: [0, 0.15, 0, 0.1, 0, 0.06] },
+                  transition: { duration: 0.5, ease: react.anticipate },
+                  className: classNames__default.default(
+                    "absolute inset-0 group-hover:opacity-15",
+                    theme === "primary" && "bg-brand-primary text-brand-primary",
+                    theme === "secondary" && "bg-shade-tertiary text-shade-primary"
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                CrossHair.CrosshairCorners,
+                {
+                  animationDelay: 0,
+                  animationDuration: 0.5,
+                  size: 4,
+                  corners: ["bottom-right"]
+                }
+              )
+            ] }),
+            item.icon && /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { ...item.icon, className: "flex-shrink-0 relative" }),
+            item.label && /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                className: classNames__default.default(
+                  "font-mono leading-[100%] relative",
+                  variant === "segmented" && "text-sm",
+                  variant === "tab" && "text-[15px]"
+                ),
+                children: item.label
+              }
+            )
+          ]
+        },
+        item.value
+      ))
+    }
+  );
+};
+
+exports.Tabs = Tabs;
+//# sourceMappingURL=Tabs.js.map
+//# sourceMappingURL=Tabs.js.map

package/dist/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Tabs.tsx"],"names":["jsx","motion","classNames","jsxs","breeze","Fragment","anticipate","CrosshairCorners","Icon"],"mappings":"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","file":"Tabs.js","sourcesContent":["import classNames from \"classnames\";\nimport { anticipate, motion, MotionProps } from \"motion/react\";\nimport { Icon, IconProps } from \"./Icon\";\nimport { breeze, crisp, glide, swift } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\n\nexport type TabsProps = {\n  className?: string;\n  variant: \"tab\" | \"segmented\";\n  items: {\n    label?: string;\n    value: string;\n    icon?: IconProps;\n    disabled?: boolean;\n    selected?: boolean;\n    onClick?: () => void;\n  }[];\n  theme: \"primary\" | \"secondary\";\n  animation?: MotionProps;\n  stretch?: boolean;\n};\n\nexport const Tabs = ({\n  className,\n  variant,\n  items,\n  theme,\n  animation,\n  stretch,\n}: TabsProps) => {\n  return (\n    <motion.div\n      className={classNames(\n        \"flex items-center gap-x-1 w-full\",\n        variant === \"segmented\" && \"border border-border p-1\",\n        !stretch && \"!w-max\",\n        className\n      )}\n      {...animation}\n    >\n      {items.map((item) => (\n        <motion.button\n          className={classNames(\n            \"group hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-center w-full py-3 px-6 text-shade-tertiary\",\n            !item.label && \"w-max !px-3\",\n            item.selected && theme === \"secondary\" && \"!text-shade-primary\",\n            item.selected && theme === \"primary\" && \"!text-brand-primary\"\n          )}\n          key={item.value}\n          onClick={item.onClick}\n        >\n          {item.selected && variant === \"segmented\" && (\n            <motion.div\n              layoutId=\"segmented-tab-selected\"\n              transition={{ duration: 0.1, ease: breeze }}\n              className={classNames(\n                \"absolute inset-0\",\n                theme === \"primary\" && \"bg-brand-tertiary/8\",\n                theme === \"secondary\" && \"bg-card-foreground\"\n              )}\n            ></motion.div>\n          )}\n\n          {item.selected && variant === \"tab\" && (\n            <>\n              <motion.div\n                initial={{ opacity: 0 }}\n                animate={{ opacity: [0, 0.15, 0, 0.1, 0, 0.06] }}\n                transition={{ duration: 0.5, ease: anticipate }}\n                className={classNames(\n                  \"absolute inset-0 group-hover:opacity-15\",\n                  theme === \"primary\" && \"bg-brand-primary text-brand-primary\",\n                  theme === \"secondary\" &&\n                    \"bg-shade-tertiary text-shade-primary\"\n                )}\n              />\n              <CrosshairCorners\n                animationDelay={0}\n                animationDuration={0.5}\n                size={4}\n                corners={[\"bottom-right\"]}\n              />\n            </>\n          )}\n\n          {item.icon && (\n            <Icon {...item.icon} className=\"flex-shrink-0 relative\" />\n          )}\n          {item.label && (\n            <span\n              className={classNames(\n                \"font-mono leading-[100%] relative\",\n                variant === \"segmented\" && \"text-sm\",\n                variant === \"tab\" && \"text-[15px]\"\n              )}\n            >\n              {item.label}\n            </span>\n          )}\n        </motion.button>\n      ))}\n    </motion.div>\n  );\n};\n"]}