@audius/harmony 0.4.0 → 0.4.3

package/dist/components/button/BaseButton/BaseButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/BaseButton/BaseButton.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAY,MAAM,gBAAgB,CAAA;AASpD;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;sJAsHtB,CAAA"}
+{"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/BaseButton/BaseButton.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAY,MAAM,gBAAgB,CAAA;AASpD;;;GAGG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;sJAuHtB,CAAA"}

package/dist/components/button/BaseButton/BaseButton.js

@@ -25,7 +25,7 @@ var BaseButton = forwardRef(function BaseButton(props, ref) {
         return undefined;
     };
     var ButtonComponent = asChild ? Slot : 'button';
-    var buttonComponentCss = __assign(__assign(__assign(__assign(__assign({ fontFamily: typography.font, alignItems: 'center', boxSizing: 'border-box', cursor: 'pointer', display: 'inline-flex', flexShrink: 0, justifyContent: 'center', overflow: 'hidden', position: 'relative', textAlign: 'center', userSelect: 'none', whiteSpace: 'nowrap', textOverflow: 'ellipsis', minWidth: minWidth && !isTextHidden ? "".concat(minWidth, "px") : 0, paddingInline: 0, transition: "\n        transform ".concat(motion.hover, ",\n        border-color ").concat(motion.hover, ",\n        background-color ").concat(motion.hover, ",\n        color ").concat(motion.hover, "\n      ") }, (fullWidth && {
+    var buttonComponentCss = __assign(__assign(__assign(__assign(__assign({ fontFamily: typography.font, alignItems: 'center', boxSizing: 'border-box', cursor: 'pointer', display: 'inline-flex', flexShrink: 0, justifyContent: 'center', overflow: 'hidden', position: 'relative', textAlign: 'center', userSelect: 'none', whiteSpace: 'nowrap', textOverflow: 'ellipsis', minWidth: minWidth && !isTextHidden ? "".concat(minWidth, "px") : 0, paddingInline: 0, transition: "\n        transform ".concat(motion.hover, ",\n        border-color ").concat(motion.hover, ",\n        background ").concat(motion.hover, ",\n        background-color ").concat(motion.hover, ",\n        color ").concat(motion.hover, "\n      ") }, (fullWidth && {
         width: '100%',
         flexShrink: 1
     })), { ':focus': {

package/dist/components/button/BaseButton/BaseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseButton.js","sources":["../../../../src/components/button/BaseButton/BaseButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport LoadingSpinner from '~harmony/components/loading-spinner/LoadingSpinner'\n\nimport { useMediaQueryListener } from '../../../hooks/useMediaQueryListener'\n\nimport type { BaseButtonProps } from './types'\n\n/**\n * Base component for Harmony buttons. Not intended to be used directly. Use\n * `Button` or `PlainButton`.\n */\nexport const BaseButton = forwardRef<HTMLButtonElement, BaseButtonProps>(\n  function BaseButton(props, ref) {\n    const {\n      iconLeft: LeftIconComponent,\n      iconRight: RightIconComponent,\n      isStaticIcon,\n      disabled,\n      isLoading,\n      widthToHideText,\n      minWidth,\n      fullWidth,\n      styles,\n      children,\n      slotted,\n      'aria-label': ariaLabelProp,\n      asChild,\n      _isHovered,\n      _isPressed,\n      ...other\n    } = props\n    const { motion, typography } = useTheme()\n    const { isMatch: isTextHidden } = useMediaQueryListener(\n      `(max-width: ${widthToHideText}px)`\n    )\n\n    const getAriaLabel = () => {\n      // always default to manual aria-label prop if provided\n      if (ariaLabelProp) return ariaLabelProp\n      // We use the children prop as the aria-label if the text becomes hidden\n      // and no aria-label was provided to keep the button accessible.\n      if (isTextHidden && typeof children === 'string') return children\n      return undefined\n    }\n\n    const ButtonComponent = asChild ? Slot : 'button'\n\n    const buttonComponentCss: CSSObject = {\n      fontFamily: typography.font,\n      alignItems: 'center',\n      boxSizing: 'border-box',\n      cursor: 'pointer',\n      display: 'inline-flex',\n      flexShrink: 0,\n      justifyContent: 'center',\n      overflow: 'hidden',\n      position: 'relative',\n      textAlign: 'center',\n      userSelect: 'none',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis',\n      minWidth: minWidth && !isTextHidden ? `${minWidth}px` : 0,\n      paddingInline: 0,\n      transition: `\n        transform ${motion.hover},\n        border-color ${motion.hover},\n        background-color ${motion.hover},\n        color ${motion.hover}\n      `,\n\n      ...(fullWidth && {\n        width: '100%',\n        flexShrink: 1\n      }),\n\n      ':focus': {\n        outline: 'none !important'\n      },\n      ':hover': {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(1.04)'\n      },\n      ':active': {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(0.98)'\n      },\n\n      ...((disabled || isLoading || _isHovered || _isPressed) && {\n        pointerEvents: 'none'\n      }),\n      ...(_isHovered && {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(1.04)'\n      }),\n      ...(_isPressed && {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(0.98)'\n      })\n    }\n\n    const iconCss = !isStaticIcon && {\n      '& path': {\n        fill: 'currentcolor'\n      }\n    }\n\n    return (\n      <ButtonComponent\n        css={[buttonComponentCss, styles?.button]}\n        disabled={disabled || isLoading}\n        ref={ref}\n        type={asChild ? undefined : 'button'}\n        aria-label={getAriaLabel()}\n        {...other}\n      >\n        {isLoading ? (\n          <LoadingSpinner css={styles?.icon} />\n        ) : LeftIconComponent ? (\n          <LeftIconComponent css={[iconCss, styles?.icon]} />\n        ) : null}\n        {!isTextHidden ? (\n          slotted ? (\n            children\n          ) : (\n            <Slottable>{children}</Slottable>\n          )\n        ) : null}\n        {RightIconComponent ? (\n          <RightIconComponent css={[iconCss, styles?.icon]} />\n        ) : null}\n      </ButtonComponent>\n    )\n  }\n)\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"BaseButton.js","sources":["../../../../src/components/button/BaseButton/BaseButton.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\nimport { Slot, Slottable } from '@radix-ui/react-slot'\n\nimport LoadingSpinner from '~harmony/components/loading-spinner/LoadingSpinner'\n\nimport { useMediaQueryListener } from '../../../hooks/useMediaQueryListener'\n\nimport type { BaseButtonProps } from './types'\n\n/**\n * Base component for Harmony buttons. Not intended to be used directly. Use\n * `Button` or `PlainButton`.\n */\nexport const BaseButton = forwardRef<HTMLButtonElement, BaseButtonProps>(\n  function BaseButton(props, ref) {\n    const {\n      iconLeft: LeftIconComponent,\n      iconRight: RightIconComponent,\n      isStaticIcon,\n      disabled,\n      isLoading,\n      widthToHideText,\n      minWidth,\n      fullWidth,\n      styles,\n      children,\n      slotted,\n      'aria-label': ariaLabelProp,\n      asChild,\n      _isHovered,\n      _isPressed,\n      ...other\n    } = props\n    const { motion, typography } = useTheme()\n    const { isMatch: isTextHidden } = useMediaQueryListener(\n      `(max-width: ${widthToHideText}px)`\n    )\n\n    const getAriaLabel = () => {\n      // always default to manual aria-label prop if provided\n      if (ariaLabelProp) return ariaLabelProp\n      // We use the children prop as the aria-label if the text becomes hidden\n      // and no aria-label was provided to keep the button accessible.\n      if (isTextHidden && typeof children === 'string') return children\n      return undefined\n    }\n\n    const ButtonComponent = asChild ? Slot : 'button'\n\n    const buttonComponentCss: CSSObject = {\n      fontFamily: typography.font,\n      alignItems: 'center',\n      boxSizing: 'border-box',\n      cursor: 'pointer',\n      display: 'inline-flex',\n      flexShrink: 0,\n      justifyContent: 'center',\n      overflow: 'hidden',\n      position: 'relative',\n      textAlign: 'center',\n      userSelect: 'none',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis',\n      minWidth: minWidth && !isTextHidden ? `${minWidth}px` : 0,\n      paddingInline: 0,\n      transition: `\n        transform ${motion.hover},\n        border-color ${motion.hover},\n        background ${motion.hover},\n        background-color ${motion.hover},\n        color ${motion.hover}\n      `,\n\n      ...(fullWidth && {\n        width: '100%',\n        flexShrink: 1\n      }),\n\n      ':focus': {\n        outline: 'none !important'\n      },\n      ':hover': {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(1.04)'\n      },\n      ':active': {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(0.98)'\n      },\n\n      ...((disabled || isLoading || _isHovered || _isPressed) && {\n        pointerEvents: 'none'\n      }),\n      ...(_isHovered && {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(1.04)'\n      }),\n      ...(_isPressed && {\n        transform: fullWidth ? 'scale(1.00)' : 'scale(0.98)'\n      })\n    }\n\n    const iconCss = !isStaticIcon && {\n      '& path': {\n        fill: 'currentcolor'\n      }\n    }\n\n    return (\n      <ButtonComponent\n        css={[buttonComponentCss, styles?.button]}\n        disabled={disabled || isLoading}\n        ref={ref}\n        type={asChild ? undefined : 'button'}\n        aria-label={getAriaLabel()}\n        {...other}\n      >\n        {isLoading ? (\n          <LoadingSpinner css={styles?.icon} />\n        ) : LeftIconComponent ? (\n          <LeftIconComponent css={[iconCss, styles?.icon]} />\n        ) : null}\n        {!isTextHidden ? (\n          slotted ? (\n            children\n          ) : (\n            <Slottable>{children}</Slottable>\n          )\n        ) : null}\n        {RightIconComponent ? (\n          <RightIconComponent css={[iconCss, styles?.icon]} />\n        ) : null}\n      </ButtonComponent>\n    )\n  }\n)\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/button/Button/Button.d.ts

@@ -6,8 +6,9 @@
  * a delete operation.
  */
 export declare const Button: (props: {
-    color?: "special" | "aiGreen" | "background" | "blue" | "darkRed" | "glassOverlay" | "gradientStop1" | "gradientStop2" | "gradient" | "green" | "lightGreen" | "orange" | "red" | "trendingBlue" | "white" | "default" | undefined;
+    color?: "special" | "aiGreen" | "background" | "blue" | "darkRed" | "glassOverlay" | "gradientStop1" | "gradientStop2" | "gradient" | "coinGradient" | "coinGradientColor1" | "coinGradientColor2" | "coinGradientColor3" | "green" | "lightGreen" | "orange" | "red" | "trendingBlue" | "white" | "default" | undefined;
     hexColor?: `#${string}` | undefined;
+    hoverColor?: "special" | "aiGreen" | "background" | "blue" | "darkRed" | "glassOverlay" | "gradientStop1" | "gradientStop2" | "gradient" | "coinGradient" | "coinGradientColor1" | "coinGradientColor2" | "coinGradientColor3" | "green" | "lightGreen" | "orange" | "red" | "trendingBlue" | "white" | "default" | undefined;
     variant?: import("./types").ButtonVariant | undefined;
     size?: import("./types").ButtonSize | undefined;
 } & Omit<import("../BaseButton/types").BaseButtonProps, "styles"> & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;

package/dist/components/button/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button/Button.tsx"],"names":[],"mappings":";AAaA;;;;;GAKG;AACH,eAAO,MAAM,MAAM;;;;;sNA8NlB,CAAA"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button/Button.tsx"],"names":[],"mappings":";AAYA;;;;;GAKG;AACH,eAAO,MAAM,MAAM;;;;;;sNAiOlB,CAAA"}

package/dist/components/button/Button/Button.js

@@ -2,7 +2,6 @@ import { __rest, __assign } from '../../../_virtual/_tslib.js';
 import { jsx } from '@emotion/react/jsx-runtime';
 import { forwardRef } from 'react';
 import { useTheme } from '@emotion/react';
-import { toCSSVariableName } from '../../../utils/styles.js';
 import { BaseButton } from '../BaseButton/BaseButton.js';
 
 /**
@@ -12,7 +11,7 @@ import { BaseButton } from '../BaseButton/BaseButton.js';
  * a delete operation.
  */
 var Button = forwardRef(function Button(props, ref) {
-    var color = props.color, hexColor = props.hexColor, _a = props.variant, variant = _a === void 0 ? 'primary' : _a, _b = props.size, size = _b === void 0 ? 'default' : _b, disabled = props.disabled, baseProps = __rest(props, ["color", "hexColor", "variant", "size", "disabled"]);
+    var color = props.color, hexColor = props.hexColor, hoverColor = props.hoverColor, _a = props.variant, variant = _a === void 0 ? 'primary' : _a, _b = props.size, size = _b === void 0 ? 'default' : _b, disabled = props.disabled, baseProps = __rest(props, ["color", "hexColor", "hoverColor", "variant", "size", "disabled"]);
     var _isHovered = baseProps._isHovered, _isPressed = baseProps._isPressed;
     var _c = useTheme(), type = _c.type, themeColors = _c.color, cornerRadius = _c.cornerRadius, shadows = _c.shadows, spacing = _c.spacing, typography = _c.typography;
     var isSmallOrXs = size === 'small' || size === 'xs';
@@ -62,44 +61,43 @@ var Button = forwardRef(function Button(props, ref) {
     };
     // Variant Styles
     var primaryStyles = __assign(__assign({ '&:hover': { color: themeColors.static.white } }, ((_isHovered || _isPressed) && { color: themeColors.static.white })), (disabled && {
-        backgroundColor: themeColors.neutral.n150,
+        background: themeColors.neutral.n150,
         boxShadow: 'none'
     }));
     var secondaryHoverStyles = {
-        backgroundColor: themeColors.primary.primary,
+        background: themeColors.primary.primary,
         color: themeColors.static.white
     };
-    var secondaryStyles = __assign({ backgroundColor: 'transparent', color: themeColors.text.default, boxShadow: "0 0 0 1px inset ".concat(themeColors.border.strong), '&:hover': secondaryHoverStyles, '&:active': secondaryHoverStyles }, ((_isHovered || _isPressed) && secondaryHoverStyles));
+    var secondaryStyles = __assign({ background: 'transparent', color: themeColors.text.default, boxShadow: "0 0 0 1px inset ".concat(themeColors.border.strong), '&:hover': secondaryHoverStyles, '&:active': secondaryHoverStyles }, ((_isHovered || _isPressed) && secondaryHoverStyles));
     var tertiaryHoverStyles = {
-        backgroundColor: themeColors.background.white,
+        background: themeColors.background.white,
         boxShadow: "0 0 0 1px inset ".concat(themeColors.border.strong, ", ").concat(shadows.mid),
         color: themeColors.text.default
     };
     var tertiaryActiveStyles = {
-        backgroundColor: themeColors.background.surface2,
+        background: themeColors.background.surface2,
         backdropFilter: 'none',
         color: themeColors.text.default,
         boxShadow: "0 0 0 1px inset ".concat(themeColors.border.strong)
     };
-    var tertiaryStyles = __assign(__assign({ backgroundColor: type === 'dark' ? 'rgba(50, 51, 77, 0.6)' : 'rgb(255, 255, 255, 0.85)', color: themeColors.text.default, backdropFilter: 'blur(6px)', boxShadow: "0 0 0 1px inset ".concat(themeColors.border.default, ", ").concat(shadows.near), '&:hover': tertiaryHoverStyles, '&:active': tertiaryActiveStyles }, (_isHovered && tertiaryHoverStyles)), (_isPressed && tertiaryActiveStyles));
+    var tertiaryStyles = __assign(__assign({ background: type === 'dark' ? 'rgba(50, 51, 77, 0.6)' : 'rgb(255, 255, 255, 0.85)', color: themeColors.text.default, backdropFilter: 'blur(6px)', boxShadow: "0 0 0 1px inset ".concat(themeColors.border.default, ", ").concat(shadows.near), '&:hover': tertiaryHoverStyles, '&:active': tertiaryActiveStyles }, (_isHovered && tertiaryHoverStyles)), (_isPressed && tertiaryActiveStyles));
     var destructiveHoverStyles = {
-        backgroundColor: themeColors.special.red,
+        background: themeColors.special.red,
         color: themeColors.static.white
     };
-    var destructiveStyles = __assign({ backgroundColor: 'transparent', color: themeColors.special.red, boxShadow: "0 0 0 1px inset ".concat(themeColors.special.red), '&:hover': destructiveHoverStyles, '&:active': destructiveHoverStyles }, ((_isHovered || _isPressed) && destructiveHoverStyles));
-    var hoverStyles = {
-        boxShadow: shadows.mid,
-        '&::before': {
-            backgroundColor: 'rgba(255, 255, 255, 0.2)'
-        }
-    };
+    var destructiveStyles = __assign({ background: 'transparent', color: themeColors.special.red, boxShadow: "0 0 0 1px inset ".concat(themeColors.special.red), '&:hover': destructiveHoverStyles, '&:active': destructiveHoverStyles }, ((_isHovered || _isPressed) && destructiveHoverStyles));
+    var hoverStyles = __assign({ boxShadow: shadows.mid, '&::before': {
+            background: 'rgba(255, 255, 255, 0.2)'
+        } }, (hoverColor && {
+        background: themeColors.special[hoverColor]
+    }));
     var activeStyles = {
         boxShadow: 'none',
         '&::before': {
-            backgroundColor: 'rgba(0, 0, 0, 0.2)'
+            background: 'rgba(0, 0, 0, 0.2)'
         }
     };
-    var buttonCss = __assign(__assign(__assign(__assign(__assign({ backgroundColor: themeColors.primary.primary, color: themeColors.static.white, boxSizing: 'border-box', border: 'none', borderRadius: cornerRadius.s, boxShadow: shadows.near }, (isSmallOrXs
+    var buttonCss = __assign(__assign(__assign(__assign(__assign({ background: themeColors.primary.primary, color: themeColors.static.white, boxSizing: 'border-box', border: 'none', borderRadius: cornerRadius.s, boxShadow: shadows.near }, (isSmallOrXs
         ? smallStyles
         : size === 'large'
             ? largeStyles
@@ -117,7 +115,7 @@ var Button = forwardRef(function Button(props, ref) {
             left: 0,
             right: 0,
             bottom: 0,
-            backgroundColor: 'rgba(0, 0, 0, 0)'
+            background: 'rgba(0, 0, 0, 0)'
         } }), (variant !== 'tertiary' && __assign(__assign({ ':hover': hoverStyles, ':active': activeStyles }, (_isHovered && hoverStyles)), (_isPressed && activeStyles)))), (disabled && {
         opacity: 0.45
     }));
@@ -128,8 +126,7 @@ var Button = forwardRef(function Button(props, ref) {
             : defaultIconStyles;
     var style = variant === 'primary' && !disabled
         ? {
-            backgroundColor: hexColor ||
-                (color ? "var(".concat(toCSSVariableName(color), ")") : undefined)
+            background: hexColor || (color ? themeColors.special[color] : undefined)
         }
         : {};
     return (jsx(BaseButton, __assign({ ref: ref, disabled: disabled, styles: {

package/dist/components/button/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button/Button.tsx"],"sourcesContent":["import { CSSProperties, forwardRef } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\n\nimport { toCSSVariableName } from '../../../utils/styles'\nimport { BaseButton } from '../BaseButton/BaseButton'\n\nimport { ButtonProps } from './types'\n\ntype CSSCustomProperties = CSSProperties & {\n  [index: `--${string}`]: any\n}\n\n/**\n * Buttons allow users to trigger an action or event with a single click.\n * For example, you can use a button for allowing the functionality of\n * submitting a form, opening a dialog, canceling an action, or performing\n * a delete operation.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(props, ref) {\n    const {\n      color,\n      hexColor,\n      variant = 'primary',\n      size = 'default',\n      disabled,\n      ...baseProps\n    } = props\n    const { _isHovered, _isPressed } = baseProps\n    const {\n      type,\n      color: themeColors,\n      cornerRadius,\n      shadows,\n      spacing,\n      typography\n    } = useTheme()\n\n    const isSmallOrXs = size === 'small' || size === 'xs'\n\n    // Size Styles\n    const smallStyles: CSSObject = {\n      gap: spacing.xs,\n      height: size === 'xs' ? spacing.unit7 : spacing.unit8,\n      paddingInline: spacing.m,\n      fontSize: typography.size.s,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.s,\n      textTransform: 'capitalize'\n    }\n\n    const smallIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit4,\n      height: spacing.unit4\n    }\n\n    const defaultStyles: CSSObject = {\n      gap: spacing.s,\n      height: spacing.unit12,\n      paddingInline: spacing.xl,\n      fontSize: typography.size.l,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.l,\n      textTransform: 'capitalize'\n    }\n    const defaultIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit5,\n      height: spacing.unit5\n    }\n\n    const largeStyles: CSSObject = {\n      gap: spacing.s,\n      height: spacing.unit16,\n      paddingInline: spacing.xl,\n      fontSize: typography.size.xl,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.m,\n      letterSpacing: '0.25px',\n      textTransform: 'uppercase'\n    }\n    const largeIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit6,\n      height: spacing.unit6\n    }\n\n    // Variant Styles\n    const primaryStyles: CSSObject = {\n      '&:hover': { color: themeColors.static.white },\n\n      ...((_isHovered || _isPressed) && { color: themeColors.static.white }),\n      ...(disabled && {\n        backgroundColor: themeColors.neutral.n150,\n        boxShadow: 'none'\n      })\n    }\n\n    const secondaryHoverStyles: CSSObject = {\n      backgroundColor: themeColors.primary.primary,\n      color: themeColors.static.white\n    }\n    const secondaryStyles: CSSObject = {\n      backgroundColor: 'transparent',\n      color: themeColors.text.default,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}`,\n\n      '&:hover': secondaryHoverStyles,\n      '&:active': secondaryHoverStyles,\n\n      ...((_isHovered || _isPressed) && secondaryHoverStyles)\n    }\n\n    const tertiaryHoverStyles: CSSObject = {\n      backgroundColor: themeColors.background.white,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}, ${shadows.mid}`,\n      color: themeColors.text.default\n    }\n    const tertiaryActiveStyles: CSSObject = {\n      backgroundColor: themeColors.background.surface2,\n      backdropFilter: 'none',\n      color: themeColors.text.default,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}`\n    }\n    const tertiaryStyles: CSSObject = {\n      backgroundColor:\n        type === 'dark' ? 'rgba(50, 51, 77, 0.6)' : 'rgb(255, 255, 255, 0.85)',\n      color: themeColors.text.default,\n      backdropFilter: 'blur(6px)',\n      boxShadow: `0 0 0 1px inset ${themeColors.border.default}, ${shadows.near}`,\n\n      '&:hover': tertiaryHoverStyles,\n      '&:active': tertiaryActiveStyles,\n\n      ...(_isHovered && tertiaryHoverStyles),\n      ...(_isPressed && tertiaryActiveStyles)\n    }\n\n    const destructiveHoverStyles: CSSObject = {\n      backgroundColor: themeColors.special.red,\n      color: themeColors.static.white\n    }\n    const destructiveStyles: CSSObject = {\n      backgroundColor: 'transparent',\n      color: themeColors.special.red,\n      boxShadow: `0 0 0 1px inset ${themeColors.special.red}`,\n\n      '&:hover': destructiveHoverStyles,\n      '&:active': destructiveHoverStyles,\n\n      ...((_isHovered || _isPressed) && destructiveHoverStyles)\n    }\n\n    const hoverStyles: CSSObject = {\n      boxShadow: shadows.mid,\n      '&::before': {\n        backgroundColor: 'rgba(255, 255, 255, 0.2)'\n      }\n    }\n    const activeStyles: CSSObject = {\n      boxShadow: 'none',\n      '&::before': {\n        backgroundColor: 'rgba(0, 0, 0, 0.2)'\n      }\n    }\n\n    const buttonCss: CSSObject = {\n      backgroundColor: themeColors.primary.primary,\n      color: themeColors.static.white,\n      boxSizing: 'border-box',\n      border: 'none',\n      borderRadius: cornerRadius.s,\n      boxShadow: shadows.near,\n\n      ...(isSmallOrXs\n        ? smallStyles\n        : size === 'large'\n          ? largeStyles\n          : defaultStyles),\n\n      ...(variant === 'secondary'\n        ? secondaryStyles\n        : variant === 'tertiary'\n          ? tertiaryStyles\n          : variant === 'destructive'\n            ? destructiveStyles\n            : primaryStyles),\n\n      '::before': {\n        zIndex: -1,\n        content: '\"\"',\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        backgroundColor: 'rgba(0, 0, 0, 0)'\n      },\n\n      ...(variant !== 'tertiary' && {\n        ':hover': hoverStyles,\n        ':active': activeStyles,\n        ...(_isHovered && hoverStyles),\n        ...(_isPressed && activeStyles)\n      }),\n\n      ...(disabled && {\n        opacity: 0.45\n      })\n    }\n\n    const iconCss = isSmallOrXs\n      ? smallIconStyles\n      : size === 'large'\n        ? largeIconStyles\n        : defaultIconStyles\n\n    const style: CSSCustomProperties =\n      variant === 'primary' && !disabled\n        ? {\n            backgroundColor:\n              hexColor ||\n              (color ? `var(${toCSSVariableName(color)})` : undefined)\n          }\n        : {}\n\n    return (\n      <BaseButton\n        ref={ref}\n        disabled={disabled}\n        styles={{\n          button: buttonCss,\n          icon: iconCss\n        }}\n        style={style}\n        {...baseProps}\n      />\n    )\n  }\n)\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button/Button.tsx"],"sourcesContent":["import { CSSProperties, forwardRef } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\n\nimport { BaseButton } from '../BaseButton/BaseButton'\n\nimport { ButtonProps } from './types'\n\ntype CSSCustomProperties = CSSProperties & {\n  [index: `--${string}`]: any\n}\n\n/**\n * Buttons allow users to trigger an action or event with a single click.\n * For example, you can use a button for allowing the functionality of\n * submitting a form, opening a dialog, canceling an action, or performing\n * a delete operation.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(props, ref) {\n    const {\n      color,\n      hexColor,\n      hoverColor,\n      variant = 'primary',\n      size = 'default',\n      disabled,\n      ...baseProps\n    } = props\n    const { _isHovered, _isPressed } = baseProps\n    const {\n      type,\n      color: themeColors,\n      cornerRadius,\n      shadows,\n      spacing,\n      typography\n    } = useTheme()\n\n    const isSmallOrXs = size === 'small' || size === 'xs'\n\n    // Size Styles\n    const smallStyles: CSSObject = {\n      gap: spacing.xs,\n      height: size === 'xs' ? spacing.unit7 : spacing.unit8,\n      paddingInline: spacing.m,\n      fontSize: typography.size.s,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.s,\n      textTransform: 'capitalize'\n    }\n\n    const smallIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit4,\n      height: spacing.unit4\n    }\n\n    const defaultStyles: CSSObject = {\n      gap: spacing.s,\n      height: spacing.unit12,\n      paddingInline: spacing.xl,\n      fontSize: typography.size.l,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.l,\n      textTransform: 'capitalize'\n    }\n    const defaultIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit5,\n      height: spacing.unit5\n    }\n\n    const largeStyles: CSSObject = {\n      gap: spacing.s,\n      height: spacing.unit16,\n      paddingInline: spacing.xl,\n      fontSize: typography.size.xl,\n      fontWeight: typography.weight.bold,\n      lineHeight: typography.lineHeight.m,\n      letterSpacing: '0.25px',\n      textTransform: 'uppercase'\n    }\n    const largeIconStyles: CSSObject = {\n      zIndex: 1,\n      width: spacing.unit6,\n      height: spacing.unit6\n    }\n\n    // Variant Styles\n    const primaryStyles: CSSObject = {\n      '&:hover': { color: themeColors.static.white },\n\n      ...((_isHovered || _isPressed) && { color: themeColors.static.white }),\n      ...(disabled && {\n        background: themeColors.neutral.n150,\n        boxShadow: 'none'\n      })\n    }\n\n    const secondaryHoverStyles: CSSObject = {\n      background: themeColors.primary.primary,\n      color: themeColors.static.white\n    }\n    const secondaryStyles: CSSObject = {\n      background: 'transparent',\n      color: themeColors.text.default,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}`,\n\n      '&:hover': secondaryHoverStyles,\n      '&:active': secondaryHoverStyles,\n\n      ...((_isHovered || _isPressed) && secondaryHoverStyles)\n    }\n\n    const tertiaryHoverStyles: CSSObject = {\n      background: themeColors.background.white,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}, ${shadows.mid}`,\n      color: themeColors.text.default\n    }\n    const tertiaryActiveStyles: CSSObject = {\n      background: themeColors.background.surface2,\n      backdropFilter: 'none',\n      color: themeColors.text.default,\n      boxShadow: `0 0 0 1px inset ${themeColors.border.strong}`\n    }\n    const tertiaryStyles: CSSObject = {\n      background:\n        type === 'dark' ? 'rgba(50, 51, 77, 0.6)' : 'rgb(255, 255, 255, 0.85)',\n      color: themeColors.text.default,\n      backdropFilter: 'blur(6px)',\n      boxShadow: `0 0 0 1px inset ${themeColors.border.default}, ${shadows.near}`,\n\n      '&:hover': tertiaryHoverStyles,\n      '&:active': tertiaryActiveStyles,\n\n      ...(_isHovered && tertiaryHoverStyles),\n      ...(_isPressed && tertiaryActiveStyles)\n    }\n\n    const destructiveHoverStyles: CSSObject = {\n      background: themeColors.special.red,\n      color: themeColors.static.white\n    }\n    const destructiveStyles: CSSObject = {\n      background: 'transparent',\n      color: themeColors.special.red,\n      boxShadow: `0 0 0 1px inset ${themeColors.special.red}`,\n\n      '&:hover': destructiveHoverStyles,\n      '&:active': destructiveHoverStyles,\n\n      ...((_isHovered || _isPressed) && destructiveHoverStyles)\n    }\n\n    const hoverStyles: CSSObject = {\n      boxShadow: shadows.mid,\n      '&::before': {\n        background: 'rgba(255, 255, 255, 0.2)'\n      },\n      ...(hoverColor && {\n        background: themeColors.special[hoverColor]\n      })\n    }\n    const activeStyles: CSSObject = {\n      boxShadow: 'none',\n      '&::before': {\n        background: 'rgba(0, 0, 0, 0.2)'\n      }\n    }\n\n    const buttonCss: CSSObject = {\n      background: themeColors.primary.primary,\n      color: themeColors.static.white,\n      boxSizing: 'border-box',\n      border: 'none',\n      borderRadius: cornerRadius.s,\n      boxShadow: shadows.near,\n\n      ...(isSmallOrXs\n        ? smallStyles\n        : size === 'large'\n          ? largeStyles\n          : defaultStyles),\n\n      ...(variant === 'secondary'\n        ? secondaryStyles\n        : variant === 'tertiary'\n          ? tertiaryStyles\n          : variant === 'destructive'\n            ? destructiveStyles\n            : primaryStyles),\n\n      '::before': {\n        zIndex: -1,\n        content: '\"\"',\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        background: 'rgba(0, 0, 0, 0)'\n      },\n\n      ...(variant !== 'tertiary' && {\n        ':hover': hoverStyles,\n        ':active': activeStyles,\n        ...(_isHovered && hoverStyles),\n        ...(_isPressed && activeStyles)\n      }),\n\n      ...(disabled && {\n        opacity: 0.45\n      })\n    }\n\n    const iconCss = isSmallOrXs\n      ? smallIconStyles\n      : size === 'large'\n        ? largeIconStyles\n        : defaultIconStyles\n\n    const style: CSSCustomProperties =\n      variant === 'primary' && !disabled\n        ? {\n            background:\n              hexColor || (color ? themeColors.special[color] : undefined)\n          }\n        : {}\n\n    return (\n      <BaseButton\n        ref={ref}\n        disabled={disabled}\n        styles={{\n          button: buttonCss,\n          icon: iconCss\n        }}\n        style={style}\n        {...baseProps}\n      />\n    )\n  }\n)\n"],"names":["_jsx"],"mappings":"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"}

package/dist/components/button/Button/types.d.ts

@@ -13,6 +13,10 @@ export type ButtonProps = {
      * Override the color of the button using any hex color, only valid for the `PRIMARY` variant
      */
     hexColor?: `#${string}`;
+    /**
+     * Override the hover color of the button, only valid for the `PRIMARY` variant
+     */
+    hoverColor?: SpecialColors;
     /**
      * The type of the button
      */

package/dist/components/button/Button/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAEhD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAErD,MAAM,MAAM,eAAe,GAAG,wBAAwB,CAAC,QAAQ,CAAC,CAAA;AAEhE,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,CAAA;AAEhF,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAA;AAE7D,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAA;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,MAAM,EAAE,CAAA;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IAEvB;;OAEG;IACH,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB,GAAG,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAEhD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAErD,MAAM,MAAM,eAAe,GAAG,wBAAwB,CAAC,QAAQ,CAAC,CAAA;AAEhE,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,CAAA;AAEhF,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAA;AAE7D,MAAM,MAAM,WAAW,GAAG;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAA;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,MAAM,EAAE,CAAA;IAEvB;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,CAAA;IAE1B;;OAEG;IACH,OAAO,CAAC,EAAE,aAAa,CAAA;IAEvB;;OAEG;IACH,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB,GAAG,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAA"}

package/dist/components/button/FilterButton/FilterButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilterButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/FilterButton/FilterButton.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAM3C,eAAO,MAAM,YAAY,6MA0RvB,CAAA"}
+{"version":3,"file":"FilterButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/FilterButton/FilterButton.tsx"],"names":[],"mappings":";AAuBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAM3C,eAAO,MAAM,YAAY,6MA6RvB,CAAA"}

package/dist/components/button/FilterButton/FilterButton.js

@@ -14,6 +14,46 @@ import { Text } from '../../text/Text.js';
 import { useControlled } from '../../../hooks/useControlled.js';
 import { IconCloseAlt, IconCaretDown, IconSearch } from '../../../icons/utilityIcons.js';
 import '@emotion/css';
+import '../../skeleton/Skeleton.js';
+import '../../common/HiddenInput.js';
+import '../../radio-group/RadioGroupContext.js';
+import '../../input/PasswordInput/PasswordInput.js';
+import '../../input/TokenAmountInput/TokenAmountInput.js';
+import '../Button/Button.js';
+import '../PlainButton/PlainButton.js';
+import '../FollowButton/FollowButton.js';
+import '../IconButton/IconButton.js';
+import '../UnstyledButton.js';
+import './FilterButtonOption.js';
+import '@react-spring/web';
+import 'classnames';
+import '../../text-link/TextLink.js';
+import '../../switch/Switch.js';
+import '@juggle/resize-observer';
+import 'react-use-measure';
+import '../../scrollbar/Scrollbar.js';
+import '../../popup/Popup.js';
+import '../../popup-menu/PopupMenu.js';
+import '../../modal/Modal.js';
+import '../../modal/ModalContext.js';
+import 'react-spring/renderprops.cjs';
+import '../../modal/ModalHeader.js';
+import '../../modal/ModalFooter.js';
+import '../../modal/types.js';
+import 'lodash';
+import 'numeral';
+import '../../../contexts/MediaContext.js';
+import 'color';
+import 'lottie-react';
+import '../../pill/Pill.js';
+import '../../select/Select/Select.js';
+import '../../checkbox/Checkbox.js';
+import '../../hover-card/HoverCard.js';
+import '../../../foundations/color/semantic.js';
+import '../../../foundations/color/color.js';
+import '../../../foundations/theme/theme.js';
+import '../../../hooks/useHotKeys.js';
+import '../../internal/MenuItem.js';
 import { VirtualizedOptionsList, OptionsList } from './FilterButtonOptionsList.js';
 
 var messages = {
@@ -88,8 +128,11 @@ var FilterButton = forwardRef(function FilterButton(props, ref) {
         }
         else {
             setIsOpen(function (isOpen) { return !isOpen; });
+            if (!isOpen) {
+                setFilterInputValue('');
+            }
         }
-    }, [onClick]);
+    }, [isOpen, onClick]);
     var hasOptions = options && options.length > 0;
     var Icon = useMemo(function () {
         return variant === 'fillContainer' && value !== null

package/dist/components/button/FilterButton/FilterButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterButton.js","sources":["../../../../src/components/button/FilterButton/FilterButton.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useRef,\n  useState,\n  useCallback,\n  useEffect,\n  useMemo,\n  Ref\n} from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\nimport { mergeRefs } from 'react-merge-refs'\n\nimport { BaseButton } from '~harmony/components/button/BaseButton/BaseButton'\nimport { IconComponent, IconProps } from '~harmony/components/icon'\nimport { TextInput, TextInputSize } from '~harmony/components/input/TextInput'\nimport { Menu, MenuContent } from '~harmony/components/internal/Menu'\nimport { Flex, Box } from '~harmony/components/layout'\nimport { Text } from '~harmony/components/text/Text'\nimport { useControlled } from '~harmony/hooks/useControlled'\nimport { IconCaretDown, IconCloseAlt, IconSearch } from '~harmony/icons'\n\nimport { OptionsList, VirtualizedOptionsList } from './FilterButtonOptionsList'\nimport { FilterButtonProps } from './types'\n\nconst messages = {\n  noMatches: 'No matches'\n}\n\nexport const FilterButton = forwardRef(function FilterButton<\n  Value extends string\n>(props: FilterButtonProps<Value>, ref: Ref<HTMLButtonElement>) {\n  const {\n    value: valueProp,\n    children,\n    label,\n    onChange,\n    onClick,\n    onOpen,\n    onReset,\n    disabled,\n    variant = 'fillContainer',\n    size = 'default',\n    iconRight,\n    leadingElement: leadingElementProp,\n    menuProps,\n    options,\n    showFilterInput,\n    filterInputProps,\n    optionsLabel,\n    renderLabel = (label) => label,\n    virtualized\n  } = props\n  const { color, cornerRadius, spacing, typography } = useTheme()\n  const [value, setValue] = useControlled({\n    controlledProp: valueProp,\n    defaultValue: null,\n    stateName: 'value',\n    componentName: 'FilterButton'\n  })\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [filterInputValue, setFilterInputValue] = useState('')\n  const selectedOption = options?.find((option) => option.value === value)\n  const selectedLabel = selectedOption?.label ?? selectedOption?.value\n  const leadingElement = leadingElementProp ?? selectedOption?.leadingElement\n  const anchorRef = useRef<HTMLButtonElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const optionRefs = useRef<HTMLButtonElement[]>([])\n  const scrollRef = useRef<HTMLDivElement>(null)\n\n  // Size Styles\n  const defaultStyles: CSSObject = {\n    paddingLeft: spacing.m,\n    paddingRight: spacing.m,\n    paddingTop: spacing.s,\n    paddingBottom: spacing.s\n  }\n  const defaultIconStyles: CSSObject = {\n    width: spacing.unit4,\n    height: spacing.unit4\n  }\n\n  const smallStyles: CSSObject = {\n    paddingLeft: spacing.m,\n    paddingRight: spacing.m,\n    paddingTop: spacing.xs,\n    paddingBottom: spacing.xs\n  }\n  const smallIconStyles: CSSObject = {\n    width: spacing.unit3,\n    height: spacing.unit3\n  }\n\n  const fillContainerStyles: CSSObject = {\n    background: color.secondary.s400,\n    border: `1px solid ${color.secondary.s400}`,\n    '&:hover': {\n      border: `1px solid ${color.secondary.s400}`\n    }\n  }\n\n  const hoverStyle = {\n    background: color.background.surface1\n  }\n\n  const activeStyle = {\n    background: color.background.surface2\n  }\n  const disabledTransform = {\n    transform: 'none'\n  }\n\n  // Button Styles\n  const buttonCss: CSSObject = {\n    background: color.background.white,\n    border: `1px solid ${color.border.strong}`,\n    borderRadius: cornerRadius.s,\n    color:\n      variant === 'fillContainer' && value !== null\n        ? color.static.white\n        : color.text.default,\n    gap: spacing.xs,\n    fontSize: typography.size.s,\n    fontWeight: typography.weight.demiBold,\n    lineHeight: typography.lineHeight.s,\n    opacity: disabled ? 0.6 : 1,\n\n    '&:hover': {\n      ...disabledTransform,\n      ...(value === null && !isOpen ? hoverStyle : {})\n    },\n    '&:focus': {\n      ...disabledTransform,\n      ...(value === null ? activeStyle : {})\n    },\n    '&:active': {\n      ...disabledTransform,\n      ...(value === null ? activeStyle : {})\n    },\n    ...(isOpen ? activeStyle : {}),\n\n    ...(size === 'small' ? smallStyles : defaultStyles),\n    ...(variant === 'fillContainer' && value !== null\n      ? fillContainerStyles\n      : {})\n  }\n\n  const iconCss = size === 'small' ? smallIconStyles : defaultIconStyles\n\n  const handleClick = useCallback(() => {\n    if (onClick) {\n      onClick()\n    } else {\n      setIsOpen((isOpen: boolean) => !isOpen)\n    }\n  }, [onClick])\n\n  const hasOptions = options && options.length > 0\n\n  const Icon = useMemo(() => {\n    return variant === 'fillContainer' && value !== null\n      ? (((props: IconProps) => (\n          <IconCloseAlt\n            aria-label='cancel'\n            onClick={(e: React.MouseEvent<SVGSVGElement>) => {\n              e.stopPropagation()\n              if (onClick) {\n                onClick()\n              } else {\n                // @ts-ignore\n                onChange?.(null)\n                onReset?.()\n              }\n            }}\n            {...props}\n          />\n        )) as IconComponent)\n      : (iconRight ?? (hasOptions ? IconCaretDown : null))\n  }, [variant, value, iconRight, hasOptions, onClick, onChange, onReset])\n\n  useEffect(() => {\n    if (isOpen) {\n      // Focus the input after the popup is open\n      setTimeout(() => {\n        inputRef.current?.focus({ preventScroll: true })\n      }, 0)\n      onOpen?.()\n    }\n  }, [isOpen, onOpen])\n\n  const handleChange = useCallback(\n    (value: Value) => {\n      setValue(value)\n      onChange?.(value)\n    },\n    [onChange, setValue]\n  )\n\n  const handleOptionSelected = useCallback(\n    (value: Value) => {\n      handleChange(value)\n      setIsOpen(false)\n    },\n    [handleChange]\n  )\n\n  const filteredOptions = useMemo(\n    () =>\n      options?.filter(\n        ({ label }) =>\n          !filterInputValue ||\n          label?.toLowerCase().includes(filterInputValue.toLowerCase())\n      ),\n    [options, filterInputValue]\n  )\n\n  const optionElements = filteredOptions ? (\n    virtualized ? (\n      <VirtualizedOptionsList\n        options={filteredOptions}\n        optionRefs={optionRefs}\n        onChange={handleOptionSelected}\n        height={menuProps?.maxHeight}\n        width={menuProps?.width}\n      />\n    ) : (\n      <OptionsList\n        options={filteredOptions}\n        isOpen={isOpen}\n        optionRefs={optionRefs}\n        scrollRef={scrollRef}\n        onChange={handleOptionSelected}\n      />\n    )\n  ) : null\n\n  return (\n    <BaseButton\n      ref={mergeRefs([ref, anchorRef])}\n      styles={{ button: buttonCss, icon: iconCss }}\n      onClick={handleClick}\n      iconRight={Icon}\n      disabled={disabled}\n      aria-haspopup='listbox'\n      aria-expanded={isOpen}\n    >\n      {leadingElement}\n      {selectedLabel ? renderLabel(selectedLabel) : label}\n\n      <Menu\n        anchorRef={anchorRef}\n        isVisible={isOpen}\n        onClose={() => setIsOpen(false)}\n        PaperProps={menuProps?.PaperProps}\n      >\n        {children ? (\n          <Flex onClick={(e) => e.stopPropagation()}>\n            {children({\n              onChange: handleChange,\n              options: optionElements,\n              setIsOpen\n            })}\n          </Flex>\n        ) : (\n          <MenuContent\n            maxHeight={menuProps?.maxHeight}\n            width={menuProps?.width}\n            scrollRef={scrollRef}\n            MenuListProps={menuProps?.MenuListProps}\n            aria-label={selectedLabel ?? label ?? props['aria-label']}\n            aria-activedescendant={selectedLabel}\n          >\n            {showFilterInput && filterInputProps ? (\n              <TextInput\n                ref={inputRef}\n                size={TextInputSize.SMALL}\n                startIcon={IconSearch}\n                onClick={(e) => {\n                  e.stopPropagation()\n                }}\n                onChange={(e) => {\n                  setFilterInputValue(e.target.value)\n                }}\n                autoComplete='off'\n                {...filterInputProps}\n              />\n            ) : null}\n            {optionsLabel ? (\n              <Box pt='s' ph='m'>\n                <Text variant='label' size='xs'>\n                  {optionsLabel}\n                </Text>\n              </Box>\n            ) : null}\n            {filteredOptions && filteredOptions.length === 0 ? (\n              <Flex justifyContent='center'>\n                <Text variant='body' color='subdued' size='s'>\n                  {messages.noMatches}\n                </Text>\n              </Flex>\n            ) : (\n              <Flex direction='column' w='100%'>\n                {optionElements}\n              </Flex>\n            )}\n          </MenuContent>\n        )}\n      </Menu>\n    </BaseButton>\n  )\n})\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"FilterButton.js","sources":["../../../../src/components/button/FilterButton/FilterButton.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useRef,\n  useState,\n  useCallback,\n  useEffect,\n  useMemo,\n  Ref\n} from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\nimport { mergeRefs } from 'react-merge-refs'\n\nimport { BaseButton } from '~harmony/components/button/BaseButton/BaseButton'\nimport { IconComponent, IconProps } from '~harmony/components/icon'\nimport { TextInput, TextInputSize } from '~harmony/components/input/TextInput'\nimport { Menu, MenuContent } from '~harmony/components/internal/Menu'\nimport { Flex, Box } from '~harmony/components/layout'\nimport { Text } from '~harmony/components/text/Text'\nimport { useControlled } from '~harmony/hooks/useControlled'\nimport { IconCaretDown, IconCloseAlt, IconSearch } from '~harmony/icons'\n\nimport { OptionsList, VirtualizedOptionsList } from './FilterButtonOptionsList'\nimport { FilterButtonProps } from './types'\n\nconst messages = {\n  noMatches: 'No matches'\n}\n\nexport const FilterButton = forwardRef(function FilterButton<\n  Value extends string\n>(props: FilterButtonProps<Value>, ref: Ref<HTMLButtonElement>) {\n  const {\n    value: valueProp,\n    children,\n    label,\n    onChange,\n    onClick,\n    onOpen,\n    onReset,\n    disabled,\n    variant = 'fillContainer',\n    size = 'default',\n    iconRight,\n    leadingElement: leadingElementProp,\n    menuProps,\n    options,\n    showFilterInput,\n    filterInputProps,\n    optionsLabel,\n    renderLabel = (label) => label,\n    virtualized\n  } = props\n  const { color, cornerRadius, spacing, typography } = useTheme()\n  const [value, setValue] = useControlled({\n    controlledProp: valueProp,\n    defaultValue: null,\n    stateName: 'value',\n    componentName: 'FilterButton'\n  })\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [filterInputValue, setFilterInputValue] = useState('')\n  const selectedOption = options?.find((option) => option.value === value)\n  const selectedLabel = selectedOption?.label ?? selectedOption?.value\n  const leadingElement = leadingElementProp ?? selectedOption?.leadingElement\n  const anchorRef = useRef<HTMLButtonElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const optionRefs = useRef<HTMLButtonElement[]>([])\n  const scrollRef = useRef<HTMLDivElement>(null)\n\n  // Size Styles\n  const defaultStyles: CSSObject = {\n    paddingLeft: spacing.m,\n    paddingRight: spacing.m,\n    paddingTop: spacing.s,\n    paddingBottom: spacing.s\n  }\n  const defaultIconStyles: CSSObject = {\n    width: spacing.unit4,\n    height: spacing.unit4\n  }\n\n  const smallStyles: CSSObject = {\n    paddingLeft: spacing.m,\n    paddingRight: spacing.m,\n    paddingTop: spacing.xs,\n    paddingBottom: spacing.xs\n  }\n  const smallIconStyles: CSSObject = {\n    width: spacing.unit3,\n    height: spacing.unit3\n  }\n\n  const fillContainerStyles: CSSObject = {\n    background: color.secondary.s400,\n    border: `1px solid ${color.secondary.s400}`,\n    '&:hover': {\n      border: `1px solid ${color.secondary.s400}`\n    }\n  }\n\n  const hoverStyle = {\n    background: color.background.surface1\n  }\n\n  const activeStyle = {\n    background: color.background.surface2\n  }\n  const disabledTransform = {\n    transform: 'none'\n  }\n\n  // Button Styles\n  const buttonCss: CSSObject = {\n    background: color.background.white,\n    border: `1px solid ${color.border.strong}`,\n    borderRadius: cornerRadius.s,\n    color:\n      variant === 'fillContainer' && value !== null\n        ? color.static.white\n        : color.text.default,\n    gap: spacing.xs,\n    fontSize: typography.size.s,\n    fontWeight: typography.weight.demiBold,\n    lineHeight: typography.lineHeight.s,\n    opacity: disabled ? 0.6 : 1,\n\n    '&:hover': {\n      ...disabledTransform,\n      ...(value === null && !isOpen ? hoverStyle : {})\n    },\n    '&:focus': {\n      ...disabledTransform,\n      ...(value === null ? activeStyle : {})\n    },\n    '&:active': {\n      ...disabledTransform,\n      ...(value === null ? activeStyle : {})\n    },\n    ...(isOpen ? activeStyle : {}),\n\n    ...(size === 'small' ? smallStyles : defaultStyles),\n    ...(variant === 'fillContainer' && value !== null\n      ? fillContainerStyles\n      : {})\n  }\n\n  const iconCss = size === 'small' ? smallIconStyles : defaultIconStyles\n\n  const handleClick = useCallback(() => {\n    if (onClick) {\n      onClick()\n    } else {\n      setIsOpen((isOpen: boolean) => !isOpen)\n      if (!isOpen) {\n        setFilterInputValue('')\n      }\n    }\n  }, [isOpen, onClick])\n\n  const hasOptions = options && options.length > 0\n\n  const Icon = useMemo(() => {\n    return variant === 'fillContainer' && value !== null\n      ? (((props: IconProps) => (\n          <IconCloseAlt\n            aria-label='cancel'\n            onClick={(e: React.MouseEvent<SVGSVGElement>) => {\n              e.stopPropagation()\n              if (onClick) {\n                onClick()\n              } else {\n                // @ts-ignore\n                onChange?.(null)\n                onReset?.()\n              }\n            }}\n            {...props}\n          />\n        )) as IconComponent)\n      : (iconRight ?? (hasOptions ? IconCaretDown : null))\n  }, [variant, value, iconRight, hasOptions, onClick, onChange, onReset])\n\n  useEffect(() => {\n    if (isOpen) {\n      // Focus the input after the popup is open\n      setTimeout(() => {\n        inputRef.current?.focus({ preventScroll: true })\n      }, 0)\n      onOpen?.()\n    }\n  }, [isOpen, onOpen])\n\n  const handleChange = useCallback(\n    (value: Value) => {\n      setValue(value)\n      onChange?.(value)\n    },\n    [onChange, setValue]\n  )\n\n  const handleOptionSelected = useCallback(\n    (value: Value) => {\n      handleChange(value)\n      setIsOpen(false)\n    },\n    [handleChange]\n  )\n\n  const filteredOptions = useMemo(\n    () =>\n      options?.filter(\n        ({ label }) =>\n          !filterInputValue ||\n          label?.toLowerCase().includes(filterInputValue.toLowerCase())\n      ),\n    [options, filterInputValue]\n  )\n\n  const optionElements = filteredOptions ? (\n    virtualized ? (\n      <VirtualizedOptionsList\n        options={filteredOptions}\n        optionRefs={optionRefs}\n        onChange={handleOptionSelected}\n        height={menuProps?.maxHeight}\n        width={menuProps?.width}\n      />\n    ) : (\n      <OptionsList\n        options={filteredOptions}\n        isOpen={isOpen}\n        optionRefs={optionRefs}\n        scrollRef={scrollRef}\n        onChange={handleOptionSelected}\n      />\n    )\n  ) : null\n\n  return (\n    <BaseButton\n      ref={mergeRefs([ref, anchorRef])}\n      styles={{ button: buttonCss, icon: iconCss }}\n      onClick={handleClick}\n      iconRight={Icon}\n      disabled={disabled}\n      aria-haspopup='listbox'\n      aria-expanded={isOpen}\n    >\n      {leadingElement}\n      {selectedLabel ? renderLabel(selectedLabel) : label}\n\n      <Menu\n        anchorRef={anchorRef}\n        isVisible={isOpen}\n        onClose={() => setIsOpen(false)}\n        PaperProps={menuProps?.PaperProps}\n      >\n        {children ? (\n          <Flex onClick={(e) => e.stopPropagation()}>\n            {children({\n              onChange: handleChange,\n              options: optionElements,\n              setIsOpen\n            })}\n          </Flex>\n        ) : (\n          <MenuContent\n            maxHeight={menuProps?.maxHeight}\n            width={menuProps?.width}\n            scrollRef={scrollRef}\n            MenuListProps={menuProps?.MenuListProps}\n            aria-label={selectedLabel ?? label ?? props['aria-label']}\n            aria-activedescendant={selectedLabel}\n          >\n            {showFilterInput && filterInputProps ? (\n              <TextInput\n                ref={inputRef}\n                size={TextInputSize.SMALL}\n                startIcon={IconSearch}\n                onClick={(e) => {\n                  e.stopPropagation()\n                }}\n                onChange={(e) => {\n                  setFilterInputValue(e.target.value)\n                }}\n                autoComplete='off'\n                {...filterInputProps}\n              />\n            ) : null}\n            {optionsLabel ? (\n              <Box pt='s' ph='m'>\n                <Text variant='label' size='xs'>\n                  {optionsLabel}\n                </Text>\n              </Box>\n            ) : null}\n            {filteredOptions && filteredOptions.length === 0 ? (\n              <Flex justifyContent='center'>\n                <Text variant='body' color='subdued' size='s'>\n                  {messages.noMatches}\n                </Text>\n              </Flex>\n            ) : (\n              <Flex direction='column' w='100%'>\n                {optionElements}\n              </Flex>\n            )}\n          </MenuContent>\n        )}\n      </Menu>\n    </BaseButton>\n  )\n})\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/button/FollowButton/FollowButton.js

@@ -8,6 +8,52 @@ import { Text } from '../../text/Text.js';
 import { useControlled } from '../../../hooks/useControlled.js';
 import { IconUserFollow, IconUserFollowing, IconUserUnfollow } from '../../../icons/utilityIcons.js';
 import '@emotion/css';
+import '../../layout/Box/Box.js';
+import '../../skeleton/Skeleton.js';
+import '../../common/HiddenInput.js';
+import '../../radio-group/RadioGroupContext.js';
+import '../../input/TextInput/TextInput.js';
+import '../../input/TextInput/types.js';
+import '../../input/PasswordInput/PasswordInput.js';
+import '../../input/TokenAmountInput/TokenAmountInput.js';
+import '../../layout/Paper/Paper.js';
+import '../Button/Button.js';
+import '../PlainButton/PlainButton.js';
+import '../IconButton/IconButton.js';
+import '../UnstyledButton.js';
+import '../FilterButton/FilterButton.js';
+import '../FilterButton/FilterButtonOption.js';
+import '../BaseButton/BaseButton.js';
+import '@react-spring/web';
+import 'classnames';
+import '../../text-link/TextLink.js';
+import '../../switch/Switch.js';
+import '@juggle/resize-observer';
+import 'react-merge-refs';
+import 'react-use-measure';
+import '../../scrollbar/Scrollbar.js';
+import '../../popup/Popup.js';
+import '../../popup-menu/PopupMenu.js';
+import '../../modal/Modal.js';
+import '../../modal/ModalContext.js';
+import 'react-spring/renderprops.cjs';
+import '../../modal/ModalHeader.js';
+import '../../modal/ModalFooter.js';
+import '../../modal/types.js';
+import 'lodash';
+import 'numeral';
+import '../../../contexts/MediaContext.js';
+import 'color';
+import 'lottie-react';
+import '../../pill/Pill.js';
+import '../../select/Select/Select.js';
+import '../../checkbox/Checkbox.js';
+import '../../hover-card/HoverCard.js';
+import '../../../foundations/color/semantic.js';
+import '../../../foundations/color/color.js';
+import '../../../foundations/theme/theme.js';
+import '../../../hooks/useHotKeys.js';
+import '../../internal/MenuItem.js';
 
 var defaultMessages = {
     follow: 'Follow',

package/dist/components/button/FollowButton/FollowButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FollowButton.js","sources":["../../../../src/components/button/FollowButton/FollowButton.tsx"],"sourcesContent":["import { useState, useCallback, useEffect, forwardRef, Ref } from 'react'\n\nimport { useTheme, type CSSObject } from '@emotion/react'\nimport styled from '@emotion/styled'\n\nimport type { IconComponent } from '~harmony/components/icon'\nimport { Flex } from '~harmony/components/layout/Flex'\nimport { Text } from '~harmony/components/text'\nimport { useControlled } from '~harmony/hooks/useControlled'\nimport {\n  IconUserFollowing,\n  IconUserFollow,\n  IconUserUnfollow\n} from '~harmony/icons'\n\nimport type { FollowButtonProps } from './types'\n\nconst defaultMessages = {\n  follow: 'Follow',\n  following: 'Following',\n  unfollow: 'Unfollow'\n}\n\nconst InputRoot = styled.input({\n  cursor: 'inherit',\n  position: 'absolute',\n  opacity: 0,\n  width: '100%',\n  height: '100%',\n  top: 0,\n  left: 0,\n  margin: 0,\n  padding: 0,\n  zIndex: 1\n})\n\n/**\n * Special button for following or unfollowing a user.\n */\nexport const FollowButton = forwardRef(\n  (props: FollowButtonProps, ref: Ref<HTMLButtonElement>) => {\n    const {\n      variant = 'default',\n      isFollowing = false,\n      onUnfollow,\n      onFollow,\n      size = 'default',\n      fullWidth = true,\n      messages: messagesProp,\n      ...other\n    } = props\n    const messages = { ...defaultMessages, ...messagesProp }\n    const { type } = other\n    const [value, setValueState] = useControlled({\n      componentName: 'FollowButton',\n      controlledProp: isFollowing,\n      defaultValue: undefined,\n      stateName: 'following'\n    })\n\n    // Track hover manually to swap text and icon\n    const [isHovering, setIsHovering] = useState(false)\n    const [isPressing, setIsPressing] = useState(false)\n\n    const handleMouseEnter = useCallback(() => {\n      setIsHovering(true)\n    }, [])\n\n    const handleMouseDown = useCallback(() => {\n      setIsPressing(true)\n    }, [])\n\n    const handleMouseLeave = useCallback(() => {\n      setIsHovering(false)\n    }, [])\n\n    const handleMouseUp = useCallback(() => {\n      setIsPressing(false)\n    }, [])\n\n    const handlePressIn = useCallback(() => {\n      setIsHovering(true)\n      setIsPressing(true)\n    }, [])\n\n    const handlePressOut = useCallback(() => {\n      setIsHovering(false)\n      setIsPressing(false)\n    }, [])\n\n    useEffect(() => {}, [value])\n\n    const handleClick = useCallback(() => {\n      if (value) {\n        onUnfollow?.()\n      } else {\n        onFollow?.()\n      }\n      setValueState(!value)\n    }, [value, setValueState, onUnfollow, onFollow])\n\n    const checkedValue = value\n    let Icon: IconComponent = IconUserFollow\n    let text = messages.follow\n    if (checkedValue && !isHovering) {\n      Icon = IconUserFollowing\n      text = messages.following\n    } else if (checkedValue && isHovering && !isPressing) {\n      Icon = IconUserUnfollow\n      text = messages.unfollow\n    }\n\n    const { color, cornerRadius, motion, shadows } = useTheme()\n\n    const textColor =\n      checkedValue || isHovering || isPressing ? 'white' : 'active'\n\n    const borderRadius =\n      variant === 'pill' ? cornerRadius['2xl'] : cornerRadius.s\n\n    const rootCss: CSSObject = {\n      cursor: 'pointer',\n      minWidth: size === 'small' ? 128 : 152,\n      width: fullWidth ? '100%' : undefined,\n      userSelect: 'none',\n      borderRadius,\n      backgroundColor: checkedValue\n        ? color.primary.primary\n        : color.special.white,\n      boxShadow: shadows.near,\n      border: `1px solid ${color.primary.primary}`,\n      transition: `\n        transform ${motion.hover},\n        border-color ${motion.hover},\n        background-color ${motion.hover},\n        color ${motion.hover}\n      `,\n      '&:hover': {\n        borderWidth: 0,\n        backgroundColor: color.primary.p300,\n        boxShadow: shadows.mid\n      },\n      '&:active': {\n        backgroundColor: color.primary.p500,\n        borderWidth: 0,\n        boxShadow: 'none'\n      }\n    }\n\n    // Handles case where user mouses down, moves cursor, and mouses up\n    useEffect(() => {\n      if (isPressing) {\n        document.addEventListener('mouseup', handleMouseUp)\n        return () => {\n          document.removeEventListener('mouseup', handleMouseUp)\n        }\n      }\n      return undefined\n    }, [isPressing, handleMouseUp])\n\n    const rootProps = {\n      onMouseEnter: handleMouseEnter,\n      onMouseLeave: handleMouseLeave,\n      onMouseDown: handleMouseDown,\n      onMouseUp: handleMouseUp,\n      onTouchStart: handlePressIn,\n      onTouchEnd: handlePressOut\n    }\n\n    const buttonProps = type === 'checkbox' ? undefined : other\n    const inputProps = type === 'checkbox' ? other : undefined\n\n    return (\n      <Flex\n        // @ts-ignore flex not smart enough\n        ref={ref}\n        as={type === 'checkbox' ? 'label' : 'button'}\n        h={size === 'small' ? 28 : 32}\n        direction='row'\n        alignItems='center'\n        justifyContent='center'\n        gap='xs'\n        pv='s'\n        css={rootCss}\n        // @ts-ignore flex not smart enough\n        onClick={handleClick}\n        {...buttonProps}\n        {...rootProps}\n      >\n        <Icon height={18} width={18} color={textColor} />\n        <Text\n          variant='label'\n          tag='span'\n          size={size === 'small' ? 's' : 'l'}\n          strength='default'\n          color={textColor}\n        >\n          {text}\n        </Text>\n        {type === 'checkbox' ? (\n          <InputRoot {...inputProps} checked={isFollowing} />\n        ) : null}\n      </Flex>\n    )\n  }\n)\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"FollowButton.js","sources":["../../../../src/components/button/FollowButton/FollowButton.tsx"],"sourcesContent":["import { useState, useCallback, useEffect, forwardRef, Ref } from 'react'\n\nimport { useTheme, type CSSObject } from '@emotion/react'\nimport styled from '@emotion/styled'\n\nimport type { IconComponent } from '~harmony/components/icon'\nimport { Flex } from '~harmony/components/layout/Flex'\nimport { Text } from '~harmony/components/text'\nimport { useControlled } from '~harmony/hooks/useControlled'\nimport {\n  IconUserFollowing,\n  IconUserFollow,\n  IconUserUnfollow\n} from '~harmony/icons'\n\nimport type { FollowButtonProps } from './types'\n\nconst defaultMessages = {\n  follow: 'Follow',\n  following: 'Following',\n  unfollow: 'Unfollow'\n}\n\nconst InputRoot = styled.input({\n  cursor: 'inherit',\n  position: 'absolute',\n  opacity: 0,\n  width: '100%',\n  height: '100%',\n  top: 0,\n  left: 0,\n  margin: 0,\n  padding: 0,\n  zIndex: 1\n})\n\n/**\n * Special button for following or unfollowing a user.\n */\nexport const FollowButton = forwardRef(\n  (props: FollowButtonProps, ref: Ref<HTMLButtonElement>) => {\n    const {\n      variant = 'default',\n      isFollowing = false,\n      onUnfollow,\n      onFollow,\n      size = 'default',\n      fullWidth = true,\n      messages: messagesProp,\n      ...other\n    } = props\n    const messages = { ...defaultMessages, ...messagesProp }\n    const { type } = other\n    const [value, setValueState] = useControlled({\n      componentName: 'FollowButton',\n      controlledProp: isFollowing,\n      defaultValue: undefined,\n      stateName: 'following'\n    })\n\n    // Track hover manually to swap text and icon\n    const [isHovering, setIsHovering] = useState(false)\n    const [isPressing, setIsPressing] = useState(false)\n\n    const handleMouseEnter = useCallback(() => {\n      setIsHovering(true)\n    }, [])\n\n    const handleMouseDown = useCallback(() => {\n      setIsPressing(true)\n    }, [])\n\n    const handleMouseLeave = useCallback(() => {\n      setIsHovering(false)\n    }, [])\n\n    const handleMouseUp = useCallback(() => {\n      setIsPressing(false)\n    }, [])\n\n    const handlePressIn = useCallback(() => {\n      setIsHovering(true)\n      setIsPressing(true)\n    }, [])\n\n    const handlePressOut = useCallback(() => {\n      setIsHovering(false)\n      setIsPressing(false)\n    }, [])\n\n    useEffect(() => {}, [value])\n\n    const handleClick = useCallback(() => {\n      if (value) {\n        onUnfollow?.()\n      } else {\n        onFollow?.()\n      }\n      setValueState(!value)\n    }, [value, setValueState, onUnfollow, onFollow])\n\n    const checkedValue = value\n    let Icon: IconComponent = IconUserFollow\n    let text = messages.follow\n    if (checkedValue && !isHovering) {\n      Icon = IconUserFollowing\n      text = messages.following\n    } else if (checkedValue && isHovering && !isPressing) {\n      Icon = IconUserUnfollow\n      text = messages.unfollow\n    }\n\n    const { color, cornerRadius, motion, shadows } = useTheme()\n\n    const textColor =\n      checkedValue || isHovering || isPressing ? 'white' : 'active'\n\n    const borderRadius =\n      variant === 'pill' ? cornerRadius['2xl'] : cornerRadius.s\n\n    const rootCss: CSSObject = {\n      cursor: 'pointer',\n      minWidth: size === 'small' ? 128 : 152,\n      width: fullWidth ? '100%' : undefined,\n      userSelect: 'none',\n      borderRadius,\n      backgroundColor: checkedValue\n        ? color.primary.primary\n        : color.special.white,\n      boxShadow: shadows.near,\n      border: `1px solid ${color.primary.primary}`,\n      transition: `\n        transform ${motion.hover},\n        border-color ${motion.hover},\n        background-color ${motion.hover},\n        color ${motion.hover}\n      `,\n      '&:hover': {\n        borderWidth: 0,\n        backgroundColor: color.primary.p300,\n        boxShadow: shadows.mid\n      },\n      '&:active': {\n        backgroundColor: color.primary.p500,\n        borderWidth: 0,\n        boxShadow: 'none'\n      }\n    }\n\n    // Handles case where user mouses down, moves cursor, and mouses up\n    useEffect(() => {\n      if (isPressing) {\n        document.addEventListener('mouseup', handleMouseUp)\n        return () => {\n          document.removeEventListener('mouseup', handleMouseUp)\n        }\n      }\n      return undefined\n    }, [isPressing, handleMouseUp])\n\n    const rootProps = {\n      onMouseEnter: handleMouseEnter,\n      onMouseLeave: handleMouseLeave,\n      onMouseDown: handleMouseDown,\n      onMouseUp: handleMouseUp,\n      onTouchStart: handlePressIn,\n      onTouchEnd: handlePressOut\n    }\n\n    const buttonProps = type === 'checkbox' ? undefined : other\n    const inputProps = type === 'checkbox' ? other : undefined\n\n    return (\n      <Flex\n        // @ts-ignore flex not smart enough\n        ref={ref}\n        as={type === 'checkbox' ? 'label' : 'button'}\n        h={size === 'small' ? 28 : 32}\n        direction='row'\n        alignItems='center'\n        justifyContent='center'\n        gap='xs'\n        pv='s'\n        css={rootCss}\n        // @ts-ignore flex not smart enough\n        onClick={handleClick}\n        {...buttonProps}\n        {...rootProps}\n      >\n        <Icon height={18} width={18} color={textColor} />\n        <Text\n          variant='label'\n          tag='span'\n          size={size === 'small' ? 's' : 'l'}\n          strength='default'\n          color={textColor}\n        >\n          {text}\n        </Text>\n        {type === 'checkbox' ? (\n          <InputRoot {...inputProps} checked={isFollowing} />\n        ) : null}\n      </Flex>\n    )\n  }\n)\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/button/SocialButton/SocialButton.d.ts

@@ -1,5 +1,5 @@
 import type { ButtonProps } from '../Button/types';
-type SocialMedia = 'tiktok' | 'instagram' | 'twitter';
+type SocialMedia = 'tiktok' | 'instagram' | 'x';
 export type SocialButtonProps = ButtonProps & {
     /**
      * Which social media.

package/dist/components/button/SocialButton/SocialButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SocialButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/SocialButton/SocialButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAElD,KAAK,WAAW,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,CAAA;AAGrD,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG;IAC5C;;OAEG;IACH,UAAU,EAAE,WAAW,CAAA;CACxB,CAAA;AAmBD,eAAO,MAAM,YAAY,UAAW,iBAAiB,qDAsBpD,CAAA"}
+{"version":3,"file":"SocialButton.d.ts","sourceRoot":"","sources":["../../../../src/components/button/SocialButton/SocialButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAElD,KAAK,WAAW,GAAG,QAAQ,GAAG,WAAW,GAAG,GAAG,CAAA;AAG/C,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG;IAC5C;;OAEG;IACH,UAAU,EAAE,WAAW,CAAA;CACxB,CAAA;AAQD,eAAO,MAAM,YAAY,UAAW,iBAAiB,qDAyBpD,CAAA"}