@blueshift-gg/ui-components 0.1.35 → 0.1.37

package/dist/Alert.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import './utils/colours.mjs';
 
 type AlertProps = {

package/dist/Alert.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import './utils/colours.js';
 
 type AlertProps = {

package/dist/Avatar.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import { CrosshairCornersProps } from './CrossHair.mjs';
 import { MotionProps } from 'motion/react';
 import { BrandColour } from './utils/colours.mjs';

package/dist/Avatar.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import { CrosshairCornersProps } from './CrossHair.js';
 import { MotionProps } from 'motion/react';
 import { BrandColour } from './utils/colours.js';

package/dist/Badge.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { BrandColour } from './utils/colours.mjs';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import { CrosshairCornersProps } from './CrossHair.mjs';
 import { MotionProps } from 'motion/react';
 

package/dist/Badge.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { BrandColour } from './utils/colours.js';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import { CrosshairCornersProps } from './CrossHair.js';
 import { MotionProps } from 'motion/react';
 

package/dist/Banner.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import { TooltipProps } from './Tooltip.mjs';
 import { BrandColour } from './utils/colours.mjs';
 

package/dist/Banner.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import { TooltipProps } from './Tooltip.js';
 import { BrandColour } from './utils/colours.js';
 

package/dist/Button.d.mts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
 import { CrosshairCornersProps } from './CrossHair.mjs';
 import { courseDifficulty } from './utils/colours.mjs';
-import { c as IconName } from './Icon-DzMptwwZ.mjs';
+import { c as IconName } from './Icon-XzWqpiml.mjs';
 
 type ButtonProps = {
     className?: string;
@@ -22,7 +22,7 @@ type ButtonProps = {
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;
     size?: "xs" | "sm" | "md" | "lg";
-    variant?: "primary" | "secondary" | "outline";
+    variant?: "primary" | "secondary" | "outline" | "link";
     crosshairProps?: CrosshairCornersProps;
     useHoverEffect?: boolean;
     animation?: MotionProps;

package/dist/Button.d.ts

@@ -2,7 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
 import { CrosshairCornersProps } from './CrossHair.js';
 import { courseDifficulty } from './utils/colours.js';
-import { c as IconName } from './Icon-D0rUp4ce.js';
+import { c as IconName } from './Icon-DgBefUSx.js';
 
 type ButtonProps = {
     className?: string;
@@ -22,7 +22,7 @@ type ButtonProps = {
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;
     size?: "xs" | "sm" | "md" | "lg";
-    variant?: "primary" | "secondary" | "outline";
+    variant?: "primary" | "secondary" | "outline" | "link";
     crosshairProps?: CrosshairCornersProps;
     useHoverEffect?: boolean;
     animation?: MotionProps;

package/dist/Button.js

@@ -57,6 +57,7 @@ const Button = ({
         variant === "primary" && "bg-primary-button text-background gradient-border before:bg-primary-button-border",
         variant === "secondary" && "bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border",
         variant === "outline" && "bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary",
+        variant === "link" && "text-shade-secondary hover:text-shade-primary",
         // Sizes
         size === "lg" && "py-4 pl-6 pr-6 text-base",
         size === "md" && "py-3 pl-4 pr-4 text-sm",
@@ -76,7 +77,7 @@ const Button = ({
       ),
       ...animation,
       children: [
-        crosshairProps && variant !== "outline" && /* @__PURE__ */ jsxRuntime.jsx(
+        crosshairProps && variant !== "outline" && variant !== "link" && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             className: classNames__default.default(

package/dist/Button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Button.tsx"],"names":["useState","jsxs","motion","classNames","jsx","CrosshairCorners","Icon","DecryptedText"],"mappings":"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","file":"Button.js","sourcesContent":["\"use client\";\n\nimport { motion, MotionProps } from \"motion/react\";\nimport classNames from \"classnames\";\nimport { Icon } from \"./Icon\";\nimport { CrosshairCorners, type CrosshairCornersProps } from \"./CrossHair\";\nimport DecryptedText from \"./DecryptText\";\nimport { useState } from \"react\";\nimport { courseDifficulty } from \"./utils/colours\";\nimport { IconName } from \"./icons\";\n\nexport type ButtonProps = {\n  className?: string;\n  disabled?: boolean;\n  children?: React.ReactNode;\n  icon?: {\n    name: IconName;\n    className?: string;\n    size?: number;\n    difficulties?: Array<keyof typeof courseDifficulty>;\n  };\n  iconPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  label?: string;\n  loading?: boolean;\n  onClick?: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  size?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n  variant?: \"primary\" | \"secondary\" | \"outline\";\n  crosshairProps?: CrosshairCornersProps;\n  useHoverEffect?: boolean;\n  animation?: MotionProps;\n  useDecryptAnimation?: boolean;\n};\n\nexport const Button = ({\n  label,\n  variant = \"primary\",\n  size = \"lg\",\n  className = \"\",\n  onClick,\n  disabled = false,\n  icon,\n  iconPosition = \"left\",\n  loading = false,\n  crosshairProps = {\n    variant: \"corners\",\n  },\n  hideLabel,\n  animation,\n  useHoverEffect = true,\n  onMouseEnter,\n  onMouseLeave,\n  children,\n  useDecryptAnimation = true,\n}: ButtonProps) => {\n  const [isHovering, setIsHovering] = useState(false);\n  return (\n    <motion.button\n      disabled={disabled}\n      onClick={onClick}\n      onMouseEnter={() => {\n        setIsHovering(true);\n        onMouseEnter?.();\n      }}\n      onMouseLeave={() => {\n        setIsHovering(false);\n        onMouseLeave?.();\n      }}\n      className={classNames(\n        // Animation\n        \"relative enabled:cursor-pointer group enabled:active:scale-[0.97] transition-all duration-100 ease-glide font-mono\",\n        // Base Styles\n        \"disabled:opacity-40 flex items-center justify-center gap-x-2 leading-[18px]\",\n        // Themes\n        variant === \"primary\" &&\n          \"bg-primary-button text-background gradient-border before:bg-primary-button-border\",\n        variant === \"secondary\" &&\n          \"bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border\",\n        variant === \"outline\" &&\n          \"bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary\",\n        // Sizes\n        size === \"lg\" && \"py-4 pl-6 pr-6 text-base\",\n        size === \"md\" && \"py-3 pl-4 pr-4 text-sm\",\n        size === \"sm\" && \"py-2 pl-3 pr-3 text-sm leading-[20px]\",\n        size === \"xs\" && \"text-[10px] px-3 py-1.5\",\n        size === \"lg\" &&\n          hideLabel &&\n          \"h-[50px] w-[50px] justify-center !pr-0 !pl-0\",\n        size === \"md\" &&\n          hideLabel &&\n          \"h-[42px] w-[42px] justify-center !pr-0 !pl-0\",\n        size === \"sm\" &&\n          hideLabel &&\n          \"h-[36px] w-[36px] justify-center !pr-0 !pl-0\",\n        // Icon offsets\n        size === \"lg\" && icon && iconPosition === \"right\" && \"pl-6 pr-[22px]\",\n        size === \"lg\" && icon && iconPosition === \"left\" && \"pl-[22px] pr-6\",\n        size === \"md\" && icon && iconPosition === \"right\" && \"pl-4 pr-[18px]\",\n        size === \"md\" && icon && iconPosition === \"left\" && \"pl-[18px] pr-4\",\n        size === \"sm\" && icon && iconPosition === \"right\" && \"pl-3 pr-[14px]\",\n        size === \"sm\" && icon && iconPosition === \"left\" && \"pl-[14px] pr-3\",\n        className,\n      )}\n      {...animation}\n    >\n      {crosshairProps && variant !== \"outline\" && (\n        <div\n          className={classNames(\n            \"will-change-transform absolute transition-all duration-50 ease-glide inset-0\",\n            variant === \"secondary\" && \"text-shade-mute\",\n            variant === \"primary\" && \"text-background\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"lg\" &&\n              \"group-enabled:group-hover:inset-[-4px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"md\" &&\n              \"group-enabled:group-hover:inset-[-3px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size !== \"lg\" &&\n              size !== \"md\" &&\n              \"group-enabled:group-hover:inset-[-2px]\",\n            crosshairProps.variant === \"cross\" &&\n              useHoverEffect &&\n              \"-inset-1 text-shade-primary\",\n            crosshairProps.variant === \"bordered\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:inset-[-4px] group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n          )}\n        >\n          <CrosshairCorners\n            size={size === \"xs\" ? 3 : size === \"sm\" ? 4 : 6}\n            animationDelay={0}\n            variant={crosshairProps.variant}\n            animationDuration={1.5}\n            {...crosshairProps}\n          />\n        </div>\n      )}\n      {icon && iconPosition === \"left\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n      {children && children}\n      {!hideLabel && label && (\n        <DecryptedText\n          speed={label.length / 0.6}\n          isHovering={isHovering && !disabled && useDecryptAnimation}\n          text={label}\n        />\n      )}\n      {icon && iconPosition === \"right\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n    </motion.button>\n  );\n};\n"]}
+{"version":3,"sources":["../src/Button.tsx"],"names":["useState","jsxs","motion","classNames","jsx","CrosshairCorners","Icon","DecryptedText"],"mappings":"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","file":"Button.js","sourcesContent":["\"use client\";\n\nimport { motion, MotionProps } from \"motion/react\";\nimport classNames from \"classnames\";\nimport { Icon } from \"./Icon\";\nimport { CrosshairCorners, type CrosshairCornersProps } from \"./CrossHair\";\nimport DecryptedText from \"./DecryptText\";\nimport { useState } from \"react\";\nimport { courseDifficulty } from \"./utils/colours\";\nimport { IconName } from \"./icons\";\n\nexport type ButtonProps = {\n  className?: string;\n  disabled?: boolean;\n  children?: React.ReactNode;\n  icon?: {\n    name: IconName;\n    className?: string;\n    size?: number;\n    difficulties?: Array<keyof typeof courseDifficulty>;\n  };\n  iconPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  label?: string;\n  loading?: boolean;\n  onClick?: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  size?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n  variant?: \"primary\" | \"secondary\" | \"outline\" | \"link\";\n  crosshairProps?: CrosshairCornersProps;\n  useHoverEffect?: boolean;\n  animation?: MotionProps;\n  useDecryptAnimation?: boolean;\n};\n\nexport const Button = ({\n  label,\n  variant = \"primary\",\n  size = \"lg\",\n  className = \"\",\n  onClick,\n  disabled = false,\n  icon,\n  iconPosition = \"left\",\n  loading = false,\n  crosshairProps = {\n    variant: \"corners\",\n  },\n  hideLabel,\n  animation,\n  useHoverEffect = true,\n  onMouseEnter,\n  onMouseLeave,\n  children,\n  useDecryptAnimation = true,\n}: ButtonProps) => {\n  const [isHovering, setIsHovering] = useState(false);\n  return (\n    <motion.button\n      disabled={disabled}\n      onClick={onClick}\n      onMouseEnter={() => {\n        setIsHovering(true);\n        onMouseEnter?.();\n      }}\n      onMouseLeave={() => {\n        setIsHovering(false);\n        onMouseLeave?.();\n      }}\n      className={classNames(\n        // Animation\n        \"relative enabled:cursor-pointer group enabled:active:scale-[0.97] transition-all duration-100 ease-glide font-mono\",\n        // Base Styles\n        \"disabled:opacity-40 flex items-center justify-center gap-x-2 leading-[18px]\",\n        // Themes\n        variant === \"primary\" &&\n          \"bg-primary-button text-background gradient-border before:bg-primary-button-border\",\n        variant === \"secondary\" &&\n          \"bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border\",\n        variant === \"outline\" &&\n          \"bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary\",\n        variant === \"link\" && \"text-shade-secondary hover:text-shade-primary\",\n        // Sizes\n        size === \"lg\" && \"py-4 pl-6 pr-6 text-base\",\n        size === \"md\" && \"py-3 pl-4 pr-4 text-sm\",\n        size === \"sm\" && \"py-2 pl-3 pr-3 text-sm leading-[20px]\",\n        size === \"xs\" && \"text-[10px] px-3 py-1.5\",\n        size === \"lg\" &&\n          hideLabel &&\n          \"h-[50px] w-[50px] justify-center !pr-0 !pl-0\",\n        size === \"md\" &&\n          hideLabel &&\n          \"h-[42px] w-[42px] justify-center !pr-0 !pl-0\",\n        size === \"sm\" &&\n          hideLabel &&\n          \"h-[36px] w-[36px] justify-center !pr-0 !pl-0\",\n        // Icon offsets\n        size === \"lg\" && icon && iconPosition === \"right\" && \"pl-6 pr-[22px]\",\n        size === \"lg\" && icon && iconPosition === \"left\" && \"pl-[22px] pr-6\",\n        size === \"md\" && icon && iconPosition === \"right\" && \"pl-4 pr-[18px]\",\n        size === \"md\" && icon && iconPosition === \"left\" && \"pl-[18px] pr-4\",\n        size === \"sm\" && icon && iconPosition === \"right\" && \"pl-3 pr-[14px]\",\n        size === \"sm\" && icon && iconPosition === \"left\" && \"pl-[14px] pr-3\",\n        className,\n      )}\n      {...animation}\n    >\n      {crosshairProps && variant !== \"outline\" && variant !== \"link\" && (\n        <div\n          className={classNames(\n            \"will-change-transform absolute transition-all duration-50 ease-glide inset-0\",\n            variant === \"secondary\" && \"text-shade-mute\",\n            variant === \"primary\" && \"text-background\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"lg\" &&\n              \"group-enabled:group-hover:inset-[-4px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"md\" &&\n              \"group-enabled:group-hover:inset-[-3px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size !== \"lg\" &&\n              size !== \"md\" &&\n              \"group-enabled:group-hover:inset-[-2px]\",\n            crosshairProps.variant === \"cross\" &&\n              useHoverEffect &&\n              \"-inset-1 text-shade-primary\",\n            crosshairProps.variant === \"bordered\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:inset-[-4px] group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n          )}\n        >\n          <CrosshairCorners\n            size={size === \"xs\" ? 3 : size === \"sm\" ? 4 : 6}\n            animationDelay={0}\n            variant={crosshairProps.variant}\n            animationDuration={1.5}\n            {...crosshairProps}\n          />\n        </div>\n      )}\n      {icon && iconPosition === \"left\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n      {children && children}\n      {!hideLabel && label && (\n        <DecryptedText\n          speed={label.length / 0.6}\n          isHovering={isHovering && !disabled && useDecryptAnimation}\n          text={label}\n        />\n      )}\n      {icon && iconPosition === \"right\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n    </motion.button>\n  );\n};\n"]}

package/dist/Button.mjs

@@ -50,6 +50,7 @@ const Button = ({
         variant === "primary" && "bg-primary-button text-background gradient-border before:bg-primary-button-border",
         variant === "secondary" && "bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border",
         variant === "outline" && "bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary",
+        variant === "link" && "text-shade-secondary hover:text-shade-primary",
         // Sizes
         size === "lg" && "py-4 pl-6 pr-6 text-base",
         size === "md" && "py-3 pl-4 pr-4 text-sm",
@@ -69,7 +70,7 @@ const Button = ({
       ),
       ...animation,
       children: [
-        crosshairProps && variant !== "outline" && /* @__PURE__ */ jsx(
+        crosshairProps && variant !== "outline" && variant !== "link" && /* @__PURE__ */ jsx(
           "div",
           {
             className: classNames(

package/dist/Button.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Button.tsx"],"names":[],"mappings":"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","file":"Button.mjs","sourcesContent":["\"use client\";\n\nimport { motion, MotionProps } from \"motion/react\";\nimport classNames from \"classnames\";\nimport { Icon } from \"./Icon\";\nimport { CrosshairCorners, type CrosshairCornersProps } from \"./CrossHair\";\nimport DecryptedText from \"./DecryptText\";\nimport { useState } from \"react\";\nimport { courseDifficulty } from \"./utils/colours\";\nimport { IconName } from \"./icons\";\n\nexport type ButtonProps = {\n  className?: string;\n  disabled?: boolean;\n  children?: React.ReactNode;\n  icon?: {\n    name: IconName;\n    className?: string;\n    size?: number;\n    difficulties?: Array<keyof typeof courseDifficulty>;\n  };\n  iconPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  label?: string;\n  loading?: boolean;\n  onClick?: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  size?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n  variant?: \"primary\" | \"secondary\" | \"outline\";\n  crosshairProps?: CrosshairCornersProps;\n  useHoverEffect?: boolean;\n  animation?: MotionProps;\n  useDecryptAnimation?: boolean;\n};\n\nexport const Button = ({\n  label,\n  variant = \"primary\",\n  size = \"lg\",\n  className = \"\",\n  onClick,\n  disabled = false,\n  icon,\n  iconPosition = \"left\",\n  loading = false,\n  crosshairProps = {\n    variant: \"corners\",\n  },\n  hideLabel,\n  animation,\n  useHoverEffect = true,\n  onMouseEnter,\n  onMouseLeave,\n  children,\n  useDecryptAnimation = true,\n}: ButtonProps) => {\n  const [isHovering, setIsHovering] = useState(false);\n  return (\n    <motion.button\n      disabled={disabled}\n      onClick={onClick}\n      onMouseEnter={() => {\n        setIsHovering(true);\n        onMouseEnter?.();\n      }}\n      onMouseLeave={() => {\n        setIsHovering(false);\n        onMouseLeave?.();\n      }}\n      className={classNames(\n        // Animation\n        \"relative enabled:cursor-pointer group enabled:active:scale-[0.97] transition-all duration-100 ease-glide font-mono\",\n        // Base Styles\n        \"disabled:opacity-40 flex items-center justify-center gap-x-2 leading-[18px]\",\n        // Themes\n        variant === \"primary\" &&\n          \"bg-primary-button text-background gradient-border before:bg-primary-button-border\",\n        variant === \"secondary\" &&\n          \"bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border\",\n        variant === \"outline\" &&\n          \"bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary\",\n        // Sizes\n        size === \"lg\" && \"py-4 pl-6 pr-6 text-base\",\n        size === \"md\" && \"py-3 pl-4 pr-4 text-sm\",\n        size === \"sm\" && \"py-2 pl-3 pr-3 text-sm leading-[20px]\",\n        size === \"xs\" && \"text-[10px] px-3 py-1.5\",\n        size === \"lg\" &&\n          hideLabel &&\n          \"h-[50px] w-[50px] justify-center !pr-0 !pl-0\",\n        size === \"md\" &&\n          hideLabel &&\n          \"h-[42px] w-[42px] justify-center !pr-0 !pl-0\",\n        size === \"sm\" &&\n          hideLabel &&\n          \"h-[36px] w-[36px] justify-center !pr-0 !pl-0\",\n        // Icon offsets\n        size === \"lg\" && icon && iconPosition === \"right\" && \"pl-6 pr-[22px]\",\n        size === \"lg\" && icon && iconPosition === \"left\" && \"pl-[22px] pr-6\",\n        size === \"md\" && icon && iconPosition === \"right\" && \"pl-4 pr-[18px]\",\n        size === \"md\" && icon && iconPosition === \"left\" && \"pl-[18px] pr-4\",\n        size === \"sm\" && icon && iconPosition === \"right\" && \"pl-3 pr-[14px]\",\n        size === \"sm\" && icon && iconPosition === \"left\" && \"pl-[14px] pr-3\",\n        className,\n      )}\n      {...animation}\n    >\n      {crosshairProps && variant !== \"outline\" && (\n        <div\n          className={classNames(\n            \"will-change-transform absolute transition-all duration-50 ease-glide inset-0\",\n            variant === \"secondary\" && \"text-shade-mute\",\n            variant === \"primary\" && \"text-background\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"lg\" &&\n              \"group-enabled:group-hover:inset-[-4px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"md\" &&\n              \"group-enabled:group-hover:inset-[-3px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size !== \"lg\" &&\n              size !== \"md\" &&\n              \"group-enabled:group-hover:inset-[-2px]\",\n            crosshairProps.variant === \"cross\" &&\n              useHoverEffect &&\n              \"-inset-1 text-shade-primary\",\n            crosshairProps.variant === \"bordered\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:inset-[-4px] group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n          )}\n        >\n          <CrosshairCorners\n            size={size === \"xs\" ? 3 : size === \"sm\" ? 4 : 6}\n            animationDelay={0}\n            variant={crosshairProps.variant}\n            animationDuration={1.5}\n            {...crosshairProps}\n          />\n        </div>\n      )}\n      {icon && iconPosition === \"left\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n      {children && children}\n      {!hideLabel && label && (\n        <DecryptedText\n          speed={label.length / 0.6}\n          isHovering={isHovering && !disabled && useDecryptAnimation}\n          text={label}\n        />\n      )}\n      {icon && iconPosition === \"right\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n    </motion.button>\n  );\n};\n"]}
+{"version":3,"sources":["../src/Button.tsx"],"names":[],"mappings":"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","file":"Button.mjs","sourcesContent":["\"use client\";\n\nimport { motion, MotionProps } from \"motion/react\";\nimport classNames from \"classnames\";\nimport { Icon } from \"./Icon\";\nimport { CrosshairCorners, type CrosshairCornersProps } from \"./CrossHair\";\nimport DecryptedText from \"./DecryptText\";\nimport { useState } from \"react\";\nimport { courseDifficulty } from \"./utils/colours\";\nimport { IconName } from \"./icons\";\n\nexport type ButtonProps = {\n  className?: string;\n  disabled?: boolean;\n  children?: React.ReactNode;\n  icon?: {\n    name: IconName;\n    className?: string;\n    size?: number;\n    difficulties?: Array<keyof typeof courseDifficulty>;\n  };\n  iconPosition?: \"left\" | \"right\";\n  hideLabel?: boolean;\n  label?: string;\n  loading?: boolean;\n  onClick?: () => void;\n  onMouseEnter?: () => void;\n  onMouseLeave?: () => void;\n  size?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n  variant?: \"primary\" | \"secondary\" | \"outline\" | \"link\";\n  crosshairProps?: CrosshairCornersProps;\n  useHoverEffect?: boolean;\n  animation?: MotionProps;\n  useDecryptAnimation?: boolean;\n};\n\nexport const Button = ({\n  label,\n  variant = \"primary\",\n  size = \"lg\",\n  className = \"\",\n  onClick,\n  disabled = false,\n  icon,\n  iconPosition = \"left\",\n  loading = false,\n  crosshairProps = {\n    variant: \"corners\",\n  },\n  hideLabel,\n  animation,\n  useHoverEffect = true,\n  onMouseEnter,\n  onMouseLeave,\n  children,\n  useDecryptAnimation = true,\n}: ButtonProps) => {\n  const [isHovering, setIsHovering] = useState(false);\n  return (\n    <motion.button\n      disabled={disabled}\n      onClick={onClick}\n      onMouseEnter={() => {\n        setIsHovering(true);\n        onMouseEnter?.();\n      }}\n      onMouseLeave={() => {\n        setIsHovering(false);\n        onMouseLeave?.();\n      }}\n      className={classNames(\n        // Animation\n        \"relative enabled:cursor-pointer group enabled:active:scale-[0.97] transition-all duration-100 ease-glide font-mono\",\n        // Base Styles\n        \"disabled:opacity-40 flex items-center justify-center gap-x-2 leading-[18px]\",\n        // Themes\n        variant === \"primary\" &&\n          \"bg-primary-button text-background gradient-border before:bg-primary-button-border\",\n        variant === \"secondary\" &&\n          \"bg-card-foreground text-shade-secondary gradient-border before:bg-secondary-button-border\",\n        variant === \"outline\" &&\n          \"bg-transparent text-shade-secondary gradient-border before:bg-border hover:before:bg-border-light hover:text-shade-primary\",\n        variant === \"link\" && \"text-shade-secondary hover:text-shade-primary\",\n        // Sizes\n        size === \"lg\" && \"py-4 pl-6 pr-6 text-base\",\n        size === \"md\" && \"py-3 pl-4 pr-4 text-sm\",\n        size === \"sm\" && \"py-2 pl-3 pr-3 text-sm leading-[20px]\",\n        size === \"xs\" && \"text-[10px] px-3 py-1.5\",\n        size === \"lg\" &&\n          hideLabel &&\n          \"h-[50px] w-[50px] justify-center !pr-0 !pl-0\",\n        size === \"md\" &&\n          hideLabel &&\n          \"h-[42px] w-[42px] justify-center !pr-0 !pl-0\",\n        size === \"sm\" &&\n          hideLabel &&\n          \"h-[36px] w-[36px] justify-center !pr-0 !pl-0\",\n        // Icon offsets\n        size === \"lg\" && icon && iconPosition === \"right\" && \"pl-6 pr-[22px]\",\n        size === \"lg\" && icon && iconPosition === \"left\" && \"pl-[22px] pr-6\",\n        size === \"md\" && icon && iconPosition === \"right\" && \"pl-4 pr-[18px]\",\n        size === \"md\" && icon && iconPosition === \"left\" && \"pl-[18px] pr-4\",\n        size === \"sm\" && icon && iconPosition === \"right\" && \"pl-3 pr-[14px]\",\n        size === \"sm\" && icon && iconPosition === \"left\" && \"pl-[14px] pr-3\",\n        className,\n      )}\n      {...animation}\n    >\n      {crosshairProps && variant !== \"outline\" && variant !== \"link\" && (\n        <div\n          className={classNames(\n            \"will-change-transform absolute transition-all duration-50 ease-glide inset-0\",\n            variant === \"secondary\" && \"text-shade-mute\",\n            variant === \"primary\" && \"text-background\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"lg\" &&\n              \"group-enabled:group-hover:inset-[-4px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size === \"md\" &&\n              \"group-enabled:group-hover:inset-[-3px]\",\n            crosshairProps.variant === \"corners\" &&\n              useHoverEffect &&\n              size !== \"lg\" &&\n              size !== \"md\" &&\n              \"group-enabled:group-hover:inset-[-2px]\",\n            crosshairProps.variant === \"cross\" &&\n              useHoverEffect &&\n              \"-inset-1 text-shade-primary\",\n            crosshairProps.variant === \"bordered\" &&\n              useHoverEffect &&\n              \"inset-0.5 group-enabled:group-active:inset-1 group-enabled:group-hover:inset-[-4px] group-enabled:group-hover:text-shade-primary group-enabled:group-active:text-current\",\n          )}\n        >\n          <CrosshairCorners\n            size={size === \"xs\" ? 3 : size === \"sm\" ? 4 : 6}\n            animationDelay={0}\n            variant={crosshairProps.variant}\n            animationDuration={1.5}\n            {...crosshairProps}\n          />\n        </div>\n      )}\n      {icon && iconPosition === \"left\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n      {children && children}\n      {!hideLabel && label && (\n        <DecryptedText\n          speed={label.length / 0.6}\n          isHovering={isHovering && !disabled && useDecryptAnimation}\n          text={label}\n        />\n      )}\n      {icon && iconPosition === \"right\" && size !== \"xs\" && (\n        <Icon\n          size={icon.size}\n          name={loading ? \"Loading\" : icon.name}\n          className={classNames(icon.className, \"flex-shrink-0\")}\n          difficulties={icon.difficulties}\n        />\n      )}\n    </motion.button>\n  );\n};\n"]}

package/dist/Dropdown.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import './utils/colours.mjs';
 
 type DropdownOption = {

package/dist/Dropdown.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import './utils/colours.js';
 
 type DropdownOption = {

package/dist/{Icon-D0rUp4ce.d.ts → Icon-DgBefUSx.d.ts}

@@ -79,6 +79,9 @@ declare const IconComponents: {
     readonly Globe: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
     readonly Perks: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
     readonly Path: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Expand: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Minimize: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Refresh: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
 };
 declare const iconMetadata: Partial<Record<IconName, {
     category: "brand" | "state" | "ui" | "socials";

package/dist/{Icon-DzMptwwZ.d.mts → Icon-XzWqpiml.d.mts}

@@ -79,6 +79,9 @@ declare const IconComponents: {
     readonly Globe: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
     readonly Perks: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
     readonly Path: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Expand: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Minimize: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
+    readonly Refresh: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;
 };
 declare const iconMetadata: Partial<Record<IconName, {
     category: "brand" | "state" | "ui" | "socials";

package/dist/Icon.d.mts

@@ -1,3 +1,3 @@
 import 'react/jsx-runtime';
 import './utils/colours.mjs';
-export { I as Icon, b as IconComponents, c as IconName, a as IconProps, i as iconMetadata } from './Icon-DzMptwwZ.mjs';
+export { I as Icon, b as IconComponents, c as IconName, a as IconProps, i as iconMetadata } from './Icon-XzWqpiml.mjs';

package/dist/Icon.d.ts

@@ -1,3 +1,3 @@
 import 'react/jsx-runtime';
 import './utils/colours.js';
-export { I as Icon, b as IconComponents, c as IconName, a as IconProps, i as iconMetadata } from './Icon-D0rUp4ce.js';
+export { I as Icon, b as IconComponents, c as IconName, a as IconProps, i as iconMetadata } from './Icon-DgBefUSx.js';

package/dist/Input.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { c as IconName } from './Icon-DzMptwwZ.mjs';
+import { c as IconName } from './Icon-XzWqpiml.mjs';
 import { BadgeProps } from './Badge.mjs';
 import { TooltipProps } from './Tooltip.mjs';
 import './utils/colours.mjs';

package/dist/Input.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { c as IconName } from './Icon-D0rUp4ce.js';
+import { c as IconName } from './Icon-DgBefUSx.js';
 import { BadgeProps } from './Badge.js';
 import { TooltipProps } from './Tooltip.js';
 import './utils/colours.js';

package/dist/Slider.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import './utils/colours.mjs';
 
 type SliderProps = {

package/dist/Slider.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import './utils/colours.js';
 
 type SliderProps = {

package/dist/Tabs.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-DzMptwwZ.mjs';
+import { a as IconProps } from './Icon-XzWqpiml.mjs';
 import './utils/colours.mjs';
 
 type TabsProps = {

package/dist/Tabs.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { MotionProps } from 'motion/react';
-import { a as IconProps } from './Icon-D0rUp4ce.js';
+import { a as IconProps } from './Icon-DgBefUSx.js';
 import './utils/colours.js';
 
 type TabsProps = {

package/dist/Tabs.js

@@ -42,7 +42,7 @@ const Tabs = ({
             item.selected && theme === "secondary" && "!text-shade-primary",
             item.selected && theme === "primary" && "!text-brand-primary",
             size === "sm" && "py-2 px-4 text-sm",
-            size === "lg" && "py-2.5 px-6 text-base leading-none",
+            size === "lg" && "py-2.5 px-5 text-base leading-none",
             !item.children && "!justify-center",
             item.className
           ),

package/dist/Tabs.js.map

@@ -1 +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":["\"use client\";\n\nimport 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    children?: React.ReactNode;\n    className?: string;\n  }[];\n  theme: \"primary\" | \"secondary\";\n  animation?: MotionProps;\n  stretch?: boolean;\n  size?: \"sm\" | \"lg\";\n  title?: string;\n};\n\nexport const Tabs = ({\n  className,\n  variant,\n  items,\n  theme,\n  animation,\n  stretch,\n  size = \"lg\",\n  title,\n}: TabsProps) => {\n  return (\n    <motion.div\n      className={classNames(\n        \"flex items-center gap-x-1 w-full\",\n        variant === \"segmented\" && \"gradient-border before:bg-border\",\n        variant === \"segmented\" && size === \"sm\" && \"p-1\",\n        variant === \"segmented\" && size === \"lg\" && \"p-1\",\n        !stretch && \"!w-max\",\n        className,\n      )}\n      {...animation}\n    >\n      {items.map((item) => (\n        <motion.button\n          className={classNames(\n            \"group disabled:opacity-40 hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-between w-full 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            size === \"sm\" && \"py-2 px-4 text-sm\",\n            size === \"lg\" && \"py-2.5 px-6 text-base leading-none\",\n            !item.children && \"!justify-center\",\n            item.className,\n          )}\n          key={item.value}\n          onClick={item.onClick}\n          disabled={item.disabled}\n        >\n          {item.selected && variant === \"segmented\" && (\n            <motion.div\n              layoutId={`segmented-tab-selected-${title}`}\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          {item.children && item.children}\n        </motion.button>\n      ))}\n    </motion.div>\n  );\n};\n"]}
+{"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":["\"use client\";\n\nimport 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    children?: React.ReactNode;\n    className?: string;\n  }[];\n  theme: \"primary\" | \"secondary\";\n  animation?: MotionProps;\n  stretch?: boolean;\n  size?: \"sm\" | \"lg\";\n  title?: string;\n};\n\nexport const Tabs = ({\n  className,\n  variant,\n  items,\n  theme,\n  animation,\n  stretch,\n  size = \"lg\",\n  title,\n}: TabsProps) => {\n  return (\n    <motion.div\n      className={classNames(\n        \"flex items-center gap-x-1 w-full\",\n        variant === \"segmented\" && \"gradient-border before:bg-border\",\n        variant === \"segmented\" && size === \"sm\" && \"p-1\",\n        variant === \"segmented\" && size === \"lg\" && \"p-1\",\n        !stretch && \"!w-max\",\n        className,\n      )}\n      {...animation}\n    >\n      {items.map((item) => (\n        <motion.button\n          className={classNames(\n            \"group disabled:opacity-40 hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-between w-full 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            size === \"sm\" && \"py-2 px-4 text-sm\",\n            size === \"lg\" && \"py-2.5 px-5 text-base leading-none\",\n            !item.children && \"!justify-center\",\n            item.className,\n          )}\n          key={item.value}\n          onClick={item.onClick}\n          disabled={item.disabled}\n        >\n          {item.selected && variant === \"segmented\" && (\n            <motion.div\n              layoutId={`segmented-tab-selected-${title}`}\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          {item.children && item.children}\n        </motion.button>\n      ))}\n    </motion.div>\n  );\n};\n"]}

package/dist/Tabs.mjs

@@ -36,7 +36,7 @@ const Tabs = ({
             item.selected && theme === "secondary" && "!text-shade-primary",
             item.selected && theme === "primary" && "!text-brand-primary",
             size === "sm" && "py-2 px-4 text-sm",
-            size === "lg" && "py-2.5 px-6 text-base leading-none",
+            size === "lg" && "py-2.5 px-5 text-base leading-none",
             !item.children && "!justify-center",
             item.className
           ),

package/dist/Tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Tabs.tsx"],"names":[],"mappings":"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","file":"Tabs.mjs","sourcesContent":["\"use client\";\n\nimport 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    children?: React.ReactNode;\n    className?: string;\n  }[];\n  theme: \"primary\" | \"secondary\";\n  animation?: MotionProps;\n  stretch?: boolean;\n  size?: \"sm\" | \"lg\";\n  title?: string;\n};\n\nexport const Tabs = ({\n  className,\n  variant,\n  items,\n  theme,\n  animation,\n  stretch,\n  size = \"lg\",\n  title,\n}: TabsProps) => {\n  return (\n    <motion.div\n      className={classNames(\n        \"flex items-center gap-x-1 w-full\",\n        variant === \"segmented\" && \"gradient-border before:bg-border\",\n        variant === \"segmented\" && size === \"sm\" && \"p-1\",\n        variant === \"segmented\" && size === \"lg\" && \"p-1\",\n        !stretch && \"!w-max\",\n        className,\n      )}\n      {...animation}\n    >\n      {items.map((item) => (\n        <motion.button\n          className={classNames(\n            \"group disabled:opacity-40 hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-between w-full 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            size === \"sm\" && \"py-2 px-4 text-sm\",\n            size === \"lg\" && \"py-2.5 px-6 text-base leading-none\",\n            !item.children && \"!justify-center\",\n            item.className,\n          )}\n          key={item.value}\n          onClick={item.onClick}\n          disabled={item.disabled}\n        >\n          {item.selected && variant === \"segmented\" && (\n            <motion.div\n              layoutId={`segmented-tab-selected-${title}`}\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          {item.children && item.children}\n        </motion.button>\n      ))}\n    </motion.div>\n  );\n};\n"]}
+{"version":3,"sources":["../src/Tabs.tsx"],"names":[],"mappings":"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","file":"Tabs.mjs","sourcesContent":["\"use client\";\n\nimport 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    children?: React.ReactNode;\n    className?: string;\n  }[];\n  theme: \"primary\" | \"secondary\";\n  animation?: MotionProps;\n  stretch?: boolean;\n  size?: \"sm\" | \"lg\";\n  title?: string;\n};\n\nexport const Tabs = ({\n  className,\n  variant,\n  items,\n  theme,\n  animation,\n  stretch,\n  size = \"lg\",\n  title,\n}: TabsProps) => {\n  return (\n    <motion.div\n      className={classNames(\n        \"flex items-center gap-x-1 w-full\",\n        variant === \"segmented\" && \"gradient-border before:bg-border\",\n        variant === \"segmented\" && size === \"sm\" && \"p-1\",\n        variant === \"segmented\" && size === \"lg\" && \"p-1\",\n        !stretch && \"!w-max\",\n        className,\n      )}\n      {...animation}\n    >\n      {items.map((item) => (\n        <motion.button\n          className={classNames(\n            \"group disabled:opacity-40 hover:bg-card-solid/50 relative flex items-center gap-x-1.5 justify-between w-full 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            size === \"sm\" && \"py-2 px-4 text-sm\",\n            size === \"lg\" && \"py-2.5 px-5 text-base leading-none\",\n            !item.children && \"!justify-center\",\n            item.className,\n          )}\n          key={item.value}\n          onClick={item.onClick}\n          disabled={item.disabled}\n        >\n          {item.selected && variant === \"segmented\" && (\n            <motion.div\n              layoutId={`segmented-tab-selected-${title}`}\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          {item.children && item.children}\n        </motion.button>\n      ))}\n    </motion.div>\n  );\n};\n"]}

package/dist/Toast.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { c as IconName } from './Icon-DzMptwwZ.mjs';
+import { c as IconName } from './Icon-XzWqpiml.mjs';
 import './utils/colours.mjs';
 
 type ToastProps = {

package/dist/Toast.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { c as IconName } from './Icon-D0rUp4ce.js';
+import { c as IconName } from './Icon-DgBefUSx.js';
 import './utils/colours.js';
 
 type ToastProps = {

package/dist/icons/Anchor.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const AnchorIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Anchor.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const AnchorIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/ArrowLeft.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const ArrowLeftIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/ArrowLeft.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const ArrowLeftIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/ArrowRight.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const ArrowRightIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/ArrowRight.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const ArrowRightIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Assembly.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const AssemblyIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Assembly.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const AssemblyIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Backpack.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const BackpackIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Backpack.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const BackpackIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Brave.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const BraveIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Brave.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const BraveIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Challenge.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const ChallengeIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Challenge.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-D0rUp4ce.js';
+import { a as IconProps } from '../Icon-DgBefUSx.js';
 import '../utils/colours.js';
 
 declare const ChallengeIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;

package/dist/icons/Chevron.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { a as IconProps } from '../Icon-DzMptwwZ.mjs';
+import { a as IconProps } from '../Icon-XzWqpiml.mjs';
 import '../utils/colours.mjs';
 
 declare const ChevronIcon: ({ className, size }: IconProps) => react_jsx_runtime.JSX.Element;