npm - @audius/harmony - Versions diffs - 0.4.2 → 0.4.3 - Mend

@audius/harmony 0.4.2 → 0.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (128) hide show

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

	@@ -1 +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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"}
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 { 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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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"}
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,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/FollowButton/FollowButton.js CHANGED Viewed

@@ -23,6 +23,7 @@ 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';

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

	@@ -1 +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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"}
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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"}

package/dist/components/button/SocialButton/SocialButton.js CHANGED Viewed

@@ -22,6 +22,7 @@ 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';

package/dist/components/button/SocialButton/SocialButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SocialButton.js","sources":["../../../../src/components/button/SocialButton/SocialButton.tsx"],"sourcesContent":["import type { CSSObject } from '@emotion/react'\n\nimport { IconInstagram, IconTikTok, IconX } from '~harmony/icons'\n\nimport { Button } from '../Button/Button'\nimport type { ButtonProps } from '../Button/types'\n\ntype SocialMedia = 'tiktok' \| 'instagram' \| 'x'\n\n// Omitting aria-label from original type purely for showing in Storybook\nexport type SocialButtonProps = ButtonProps & {\n /*\n Which social media.\n */\n socialType: SocialMedia\n}\n\nconst getSocialLogos = () => ({\n tiktok: IconTikTok,\n instagram: IconInstagram,\n x: IconX\n})\n\nexport const SocialButton = (props: SocialButtonProps) => {\n const { socialType, ...rest } = props\n\n const instagramBackgroundCss: CSSObject = {\n background: `radial-gradient(61.46% 59.09% at 36.25% 96.55%, #ffd600 0%, #ff6930 48.44%, #fe3b36 73.44%, rgba(254, 59, 54, 0) 100%),\n radial-gradient(202.83% 136.37% at 84.5% 113.5%, #ff1b90 24.39%, #f80261 43.67%, #ed00c0 68.85%, #c500e9 77.68%, #7017ff 89.32%)`\n }\n\n const SocialLogo = getSocialLogos()[socialType]\n\n return (\n <Button\n variant='secondary'\n {...rest}\n css={{\n border: 'transparent',\n ...(socialType === 'instagram' && instagramBackgroundCss),\n ...(socialType === 'tiktok' && {\n background: '#fe2c55',\n color: '#ffffff'\n })\n }}\n iconLeft={SocialLogo}\n />\n )\n}\n"],"names":["_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAiBA,IAAM,cAAc,GAAG,YAAM,EAAA,QAAC;AAC5B,IAAA,MAAM,EAAE,UAAU;AAClB,IAAA,SAAS,EAAE,aAAa;AACxB,IAAA,CAAC,EAAE,KAAK;CACT,EAAC,EAAA,CAAA;AAEK,IAAM,YAAY,GAAG,UAAC,KAAwB,EAAA;IAC3C,IAAA,UAAU,GAAc,KAAK,CAAnB,UAAA,EAAK,IAAI,GAAA,MAAA,CAAK,KAAK,EAA/B,CAAuB,YAAA,CAAA,CAAF,CAAU;AAErC,IAAA,IAAM,sBAAsB,GAAc;AACxC,QAAA,UAAU,EAAE,iQACuH;KACpI,CAAA;AAED,IAAA,IAAM,UAAU,GAAG,cAAc,EAAE,CAAC,UAAU,CAAC,CAAA;AAE/C,IAAA,QACEA,GAAA,CAAC,MAAM,EAAA,QAAA,CAAA,EACL,OAAO,EAAC,WAAW,EAAA,EACf,IAAI,EAAA,EACR,GAAG,EAAA,QAAA,CAAA,QAAA,CAAA,EACD,MAAM,EAAE,aAAa,EAAA,GACjB,UAAU,KAAK,WAAW,IAAI,sBAAsB,EAAC,GACrD,UAAU,KAAK,QAAQ,IAAI;AAC7B,YAAA,UAAU,EAAE,SAAS;AACrB,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA,IAEH,QAAQ,EAAE,UAAU,EAAA,CAAA,CACpB,EACH;AACH;;;;"}
1	+ {"version":3,"file":"SocialButton.js","sources":["../../../../src/components/button/SocialButton/SocialButton.tsx"],"sourcesContent":["import type { CSSObject } from '@emotion/react'\n\nimport { IconInstagram, IconTikTok, IconX } from '~harmony/icons'\n\nimport { Button } from '../Button/Button'\nimport type { ButtonProps } from '../Button/types'\n\ntype SocialMedia = 'tiktok' \| 'instagram' \| 'x'\n\n// Omitting aria-label from original type purely for showing in Storybook\nexport type SocialButtonProps = ButtonProps & {\n /*\n Which social media.\n */\n socialType: SocialMedia\n}\n\nconst getSocialLogos = () => ({\n tiktok: IconTikTok,\n instagram: IconInstagram,\n x: IconX\n})\n\nexport const SocialButton = (props: SocialButtonProps) => {\n const { socialType, ...rest } = props\n\n const instagramBackgroundCss: CSSObject = {\n background: `radial-gradient(61.46% 59.09% at 36.25% 96.55%, #ffd600 0%, #ff6930 48.44%, #fe3b36 73.44%, rgba(254, 59, 54, 0) 100%),\n radial-gradient(202.83% 136.37% at 84.5% 113.5%, #ff1b90 24.39%, #f80261 43.67%, #ed00c0 68.85%, #c500e9 77.68%, #7017ff 89.32%)`\n }\n\n const SocialLogo = getSocialLogos()[socialType]\n\n return (\n <Button\n variant='secondary'\n {...rest}\n css={{\n border: 'transparent',\n ...(socialType === 'instagram' && instagramBackgroundCss),\n ...(socialType === 'tiktok' && {\n background: '#fe2c55',\n color: '#ffffff'\n })\n }}\n iconLeft={SocialLogo}\n />\n )\n}\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAM,cAAc,GAAG,YAAM,EAAA,QAAC;AAC5B,IAAA,MAAM,EAAE,UAAU;AAClB,IAAA,SAAS,EAAE,aAAa;AACxB,IAAA,CAAC,EAAE,KAAK;CACT,EAAC,EAAA,CAAA;AAEK,IAAM,YAAY,GAAG,UAAC,KAAwB,EAAA;IAC3C,IAAA,UAAU,GAAc,KAAK,CAAnB,UAAA,EAAK,IAAI,GAAA,MAAA,CAAK,KAAK,EAA/B,CAAuB,YAAA,CAAA,CAAF,CAAU;AAErC,IAAA,IAAM,sBAAsB,GAAc;AACxC,QAAA,UAAU,EAAE,iQACuH;KACpI,CAAA;AAED,IAAA,IAAM,UAAU,GAAG,cAAc,EAAE,CAAC,UAAU,CAAC,CAAA;AAE/C,IAAA,QACEA,GAAA,CAAC,MAAM,EAAA,QAAA,CAAA,EACL,OAAO,EAAC,WAAW,EAAA,EACf,IAAI,EAAA,EACR,GAAG,EAAA,QAAA,CAAA,QAAA,CAAA,EACD,MAAM,EAAE,aAAa,EAAA,GACjB,UAAU,KAAK,WAAW,IAAI,sBAAsB,EAAC,GACrD,UAAU,KAAK,QAAQ,IAAI;AAC7B,YAAA,UAAU,EAAE,SAAS;AACrB,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA,IAEH,QAAQ,EAAE,UAAU,EAAA,CAAA,CACpB,EACH;AACH;;;;"}

package/dist/components/button/index.d.ts CHANGED Viewed

@@ -10,4 +10,5 @@ export { UnstyledButton } from './UnstyledButton';
 export { FilterButton } from './FilterButton/FilterButton';
 export { FilterButtonOption } from './FilterButton/FilterButtonOption';
 export type { FilterButtonProps } from './FilterButton/types';
+export { BaseButton } from './BaseButton/BaseButton';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/button/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACvD,cAAc,qBAAqB,CAAA;AACnC,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACvB,MAAM,6BAA6B,CAAA;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAC1D,cAAc,sBAAsB,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AACtE,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACvD,cAAc,qBAAqB,CAAA;AACnC,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACvB,MAAM,6BAA6B,CAAA;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAC1D,cAAc,sBAAsB,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAA;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAA;AACtE,YAAY,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/components/completion-check/CompletionCheck.js CHANGED Viewed

@@ -24,6 +24,7 @@ import '../button/IconButton/IconButton.js';
 import '../button/UnstyledButton.js';
 import '../button/FilterButton/FilterButton.js';
 import '../button/FilterButton/FilterButtonOption.js';
+import '../button/BaseButton/BaseButton.js';
 import styles from './CompletionCheck.module.css.js';
 import '../text-link/TextLink.js';
 import '../switch/Switch.js';

package/dist/components/completion-check/CompletionCheck.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompletionCheck.js","sources":["../../../src/components/completion-check/CompletionCheck.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nimport { useTransition, animated } from '@react-spring/web'\nimport cn from 'classnames'\n\nimport { IconValidationCheck, IconValidationX } from '~harmony/icons'\n\nimport { Flex } from '../layout'\n\nimport styles from './CompletionCheck.module.css'\nimport type { CompletionCheckProps } from './types'\n\nexport const CompletionDefault = () => (\n <div className={cn(styles.defaultCompletionIcon)} />\n)\nexport const CompletionEmpty = () => (\n <div className={cn(styles.completionIcon, styles.emptyCompletionIcon)} />\n)\n\ntype CompletionChangeIconProps = {\n iconStyles: CSSProperties\n}\n\nexport const CompletionError = (props: CompletionChangeIconProps) => (\n <animated.div\n style={props.iconStyles}\n className={cn(styles.completionIcon, styles.xIcon)}\n >\n {' '}\n <IconValidationX size='s' />{' '}\n </animated.div>\n)\nexport const CompletionSuccess = (props: CompletionChangeIconProps) => (\n <animated.div\n style={props.iconStyles}\n className={cn(styles.completionIcon, styles.checkIcon)}\n >\n {' '}\n <IconValidationCheck size='s' />\n </animated.div>\n)\n\nconst completionComponents = {\n complete: CompletionSuccess,\n error: CompletionError,\n incomplete: CompletionEmpty\n}\n\nexport const CompletionCheck = (props: CompletionCheckProps) => {\n const { value, className } = props\n const transitions = useTransition(value, {\n from: { x: 0 },\n enter: { x: 1 },\n leave: { x: 0 }\n })\n return (\n <Flex alignItems='center' className={cn(styles.container, className)}>\n <CompletionDefault />\n {transitions((style, value) => {\n if (completionComponents[value]) {\n const CompletionIcon = completionComponents[value]\n return (\n <CompletionIcon\n iconStyles={{\n opacity: style.x.to({\n output: [0.3, 1]\n }) as any,\n transform: style.x\n .to({\n range: [0, 0.75, 1],\n output: [0, 1.2, 1]\n })\n .to((x) => `scale3d(${x}, ${x}, ${x})`) as any\n }}\n />\n )\n }\n return null\n })}\n </Flex>\n )\n}\n"],"names":["_jsx","_jsxs"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"CompletionCheck.js","sources":["../../../src/components/completion-check/CompletionCheck.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nimport { useTransition, animated } from '@react-spring/web'\nimport cn from 'classnames'\n\nimport { IconValidationCheck, IconValidationX } from '~harmony/icons'\n\nimport { Flex } from '../layout'\n\nimport styles from './CompletionCheck.module.css'\nimport type { CompletionCheckProps } from './types'\n\nexport const CompletionDefault = () => (\n <div className={cn(styles.defaultCompletionIcon)} />\n)\nexport const CompletionEmpty = () => (\n <div className={cn(styles.completionIcon, styles.emptyCompletionIcon)} />\n)\n\ntype CompletionChangeIconProps = {\n iconStyles: CSSProperties\n}\n\nexport const CompletionError = (props: CompletionChangeIconProps) => (\n <animated.div\n style={props.iconStyles}\n className={cn(styles.completionIcon, styles.xIcon)}\n >\n {' '}\n <IconValidationX size='s' />{' '}\n </animated.div>\n)\nexport const CompletionSuccess = (props: CompletionChangeIconProps) => (\n <animated.div\n style={props.iconStyles}\n className={cn(styles.completionIcon, styles.checkIcon)}\n >\n {' '}\n <IconValidationCheck size='s' />\n </animated.div>\n)\n\nconst completionComponents = {\n complete: CompletionSuccess,\n error: CompletionError,\n incomplete: CompletionEmpty\n}\n\nexport const CompletionCheck = (props: CompletionCheckProps) => {\n const { value, className } = props\n const transitions = useTransition(value, {\n from: { x: 0 },\n enter: { x: 1 },\n leave: { x: 0 }\n })\n return (\n <Flex alignItems='center' className={cn(styles.container, className)}>\n <CompletionDefault />\n {transitions((style, value) => {\n if (completionComponents[value]) {\n const CompletionIcon = completionComponents[value]\n return (\n <CompletionIcon\n iconStyles={{\n opacity: style.x.to({\n output: [0.3, 1]\n }) as any,\n transform: style.x\n .to({\n range: [0, 0.75, 1],\n output: [0, 1.2, 1]\n })\n .to((x) => `scale3d(${x}, ${x}, ${x})`) as any\n }}\n />\n )\n }\n return null\n })}\n </Flex>\n )\n}\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/expandable-nav-item/ExpandableNavItem.js CHANGED Viewed

@@ -24,6 +24,7 @@ import '../button/IconButton/IconButton.js';
 import '../button/UnstyledButton.js';
 import '../button/FilterButton/FilterButton.js';
 import '../button/FilterButton/FilterButtonOption.js';
+import '../button/BaseButton/BaseButton.js';
 import '@react-spring/web';
 import 'classnames';
 import '../text-link/TextLink.js';

package/dist/components/expandable-nav-item/ExpandableNavItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandableNavItem.js","sources":["../../../src/components/expandable-nav-item/ExpandableNavItem.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\n\nimport { useTheme, CSSObject } from '@emotion/react'\nimport { ResizeObserver } from '@juggle/resize-observer'\nimport useMeasure from 'react-use-measure'\n\nimport { HarmonyTheme } from '../../foundations/theme'\nimport { IconCaretRight } from '../../icons'\nimport { Box } from '../layout/Box'\nimport { Flex } from '../layout/Flex'\nimport { Text } from '../text'\n\nimport type { ExpandableNavItemProps, VariantConfigs } from './types'\n\nconst ITEM_DEFAULT_WIDTH = '240px'\n\nconst variants: VariantConfigs = {\n default: {\n textVariant: 'title',\n textSize: 'l',\n textStrength: 'weak',\n iconSize: 'l',\n gap: 'm'\n },\n compact: {\n textVariant: 'body',\n textSize: 's',\n textStrength: undefined,\n iconSize: 's',\n gap: 'xs'\n }\n}\n\nconst getStyles = (theme: HarmonyTheme, disabled?: boolean): CSSObject => {\n const baseStyles: CSSObject = {\n transition: `background-color ${theme.motion.hover}`,\n opacity: disabled ? 0.5 : 1\n }\n\n return {\n ...baseStyles,\n '&:active': {\n opacity: disabled ? 0.4 : 0.8,\n transition: `opacity ${theme.motion.quick}`\n }\n }\n}\n\nexport const ExpandableNavItem = ({\n label,\n leftIcon: LeftIcon,\n rightIcon,\n defaultIsOpen = false,\n nestedItems,\n shouldPersistRightIcon = false,\n shouldPersistDownArrow = false,\n canUnfurl = true,\n variant = 'default',\n onClick,\n disabled,\n ...props\n}: ExpandableNavItemProps) => {\n const [isOpen, setIsOpen] = useState(defaultIsOpen)\n const [isHovered, setIsHovered] = useState(false)\n const [isMainActive, setIsMainActive] = useState(false)\n const theme = useTheme()\n\n const [ref, bounds] = useMeasure({\n polyfill: ResizeObserver\n })\n\n const handleMouseEnter = useCallback(() => setIsHovered(true), [])\n const handleMouseLeave = useCallback(() => {\n setIsHovered(false)\n setIsMainActive(false)\n }, [])\n\n const handleMainContainerMouseDown = useCallback(\n () => setIsMainActive(true),\n []\n )\n const handleMainContainerMouseUp = useCallback(\n () => setIsMainActive(false),\n []\n )\n\n const handleClick = useCallback(() => {\n if (canUnfurl) {\n setIsOpen(!isOpen)\n }\n onClick?.(!isOpen)\n }, [canUnfurl, isOpen, onClick])\n\n const styles = useMemo(\n () => ({\n ...getStyles(theme, disabled),\n opacity: isMainActive ? 0.8 : disabled ? 0.5 : 1,\n transition: `opacity ${theme.motion.quick}, background-color ${theme.motion.hover}`\n }),\n [theme, disabled, isMainActive]\n )\n\n const containerStyles = useMemo(\n () => ({\n width: '100%',\n cursor: 'pointer',\n transition: `background-color ${theme.motion.hover}`,\n padding: `0 ${theme.spacing.s}px`,\n '& > div:first-of-type': {\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing.s,\n padding: theme.spacing.s,\n backgroundColor:\n isHovered && !disabled ? theme.color.background.surface2 : undefined,\n boxShadow:\n isHovered && !disabled\n ? `inset 0 0 0 1px ${theme.color.border.default}`\n : undefined,\n borderRadius: theme.cornerRadius.m,\n width: '100%'\n }\n }),\n [theme, isHovered, disabled]\n )\n\n const getIcon = useMemo(() => {\n const isCaretVisibleWhenHovered = isHovered && canUnfurl\n const isDownArrowPersistent = shouldPersistDownArrow && isOpen\n const shouldShowCaret = isCaretVisibleWhenHovered \|\| isDownArrowPersistent\n return (\n <>\n {LeftIcon ? (\n <LeftIcon\n size={variants[variant].iconSize}\n color='default'\n css={{\n transition: `opacity ${theme.motion.quick}`,\n opacity: shouldShowCaret ? 0 : 1,\n position: 'absolute'\n }}\n />\n ) : null}\n <IconCaretRight\n size='s'\n color='default'\n css={{\n transition: `transform ${theme.motion.expressive}, opacity ${theme.motion.quick}`,\n transform: isOpen ? `rotate(90deg)` : undefined,\n opacity: shouldShowCaret ? 1 : 0\n }}\n />\n </>\n )\n }, [\n isHovered,\n canUnfurl,\n shouldPersistDownArrow,\n LeftIcon,\n variant,\n theme.motion.quick,\n theme.motion.expressive,\n isOpen\n ])\n\n const leftIcon = useMemo(() => {\n if (!getIcon && !LeftIcon) return null\n\n const dimensions = variant === 'compact' ? 'unit5' : 'unit6'\n\n return (\n <Flex\n alignItems='center'\n justifyContent='center'\n h={dimensions}\n w={dimensions}\n >\n {getIcon}\n </Flex>\n )\n }, [getIcon, LeftIcon, variant])\n\n const shouldShowRightIcon = isOpen \|\| shouldPersistRightIcon\n\n return (\n <Flex direction='column' role='navigation' w='100%' {...props}>\n <Flex\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n css={containerStyles}\n >\n <Flex w='100%'>\n <Flex\n alignItems='center'\n flex={1}\n gap='m'\n css={styles}\n onMouseDown={handleMainContainerMouseDown}\n onMouseUp={handleMainContainerMouseUp}\n onClick={handleClick}\n role='button'\n aria-expanded={isOpen}\n aria-controls={`${label}-content`}\n aria-label={`${label} navigation section`}\n >\n <Flex\n alignItems='center'\n gap={variants[variant].gap}\n flex={1}\n css={{\n maxWidth: ITEM_DEFAULT_WIDTH,\n transition: `opacity ${theme.motion.expressive}`\n }}\n >\n {leftIcon}\n <Text\n variant={variants[variant].textVariant}\n size={variants[variant].textSize}\n strength={variants[variant].textStrength}\n lineHeight='single'\n color='default'\n ellipses\n >\n {label}\n </Text>\n </Flex>\n </Flex>\n {shouldShowRightIcon ? (\n <Box\n onClick={(e) => e.stopPropagation()}\n css={{\n cursor: 'pointer',\n opacity: disabled ? 0.5 : 1,\n transition: `opacity ${theme.motion.quick}`\n }}\n >\n {rightIcon}\n </Box>\n ) : null}\n </Flex>\n </Flex>\n {nestedItems ? (\n <Flex\n direction='column'\n css={{\n transition: `height ${theme.motion.expressive}, opacity ${theme.motion.quick}`,\n overflow: 'hidden',\n opacity: isOpen ? 1 : 0\n }}\n style={{ height: isOpen ? bounds.height : 0 }}\n >\n <Flex\n direction='column'\n ref={ref}\n id={`${label}-content`}\n role='region'\n aria-label={`${label} content`}\n >\n {nestedItems}\n </Flex>\n </Flex>\n ) : null}\n </Flex>\n )\n}\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"ExpandableNavItem.js","sources":["../../../src/components/expandable-nav-item/ExpandableNavItem.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\n\nimport { useTheme, CSSObject } from '@emotion/react'\nimport { ResizeObserver } from '@juggle/resize-observer'\nimport useMeasure from 'react-use-measure'\n\nimport { HarmonyTheme } from '../../foundations/theme'\nimport { IconCaretRight } from '../../icons'\nimport { Box } from '../layout/Box'\nimport { Flex } from '../layout/Flex'\nimport { Text } from '../text'\n\nimport type { ExpandableNavItemProps, VariantConfigs } from './types'\n\nconst ITEM_DEFAULT_WIDTH = '240px'\n\nconst variants: VariantConfigs = {\n default: {\n textVariant: 'title',\n textSize: 'l',\n textStrength: 'weak',\n iconSize: 'l',\n gap: 'm'\n },\n compact: {\n textVariant: 'body',\n textSize: 's',\n textStrength: undefined,\n iconSize: 's',\n gap: 'xs'\n }\n}\n\nconst getStyles = (theme: HarmonyTheme, disabled?: boolean): CSSObject => {\n const baseStyles: CSSObject = {\n transition: `background-color ${theme.motion.hover}`,\n opacity: disabled ? 0.5 : 1\n }\n\n return {\n ...baseStyles,\n '&:active': {\n opacity: disabled ? 0.4 : 0.8,\n transition: `opacity ${theme.motion.quick}`\n }\n }\n}\n\nexport const ExpandableNavItem = ({\n label,\n leftIcon: LeftIcon,\n rightIcon,\n defaultIsOpen = false,\n nestedItems,\n shouldPersistRightIcon = false,\n shouldPersistDownArrow = false,\n canUnfurl = true,\n variant = 'default',\n onClick,\n disabled,\n ...props\n}: ExpandableNavItemProps) => {\n const [isOpen, setIsOpen] = useState(defaultIsOpen)\n const [isHovered, setIsHovered] = useState(false)\n const [isMainActive, setIsMainActive] = useState(false)\n const theme = useTheme()\n\n const [ref, bounds] = useMeasure({\n polyfill: ResizeObserver\n })\n\n const handleMouseEnter = useCallback(() => setIsHovered(true), [])\n const handleMouseLeave = useCallback(() => {\n setIsHovered(false)\n setIsMainActive(false)\n }, [])\n\n const handleMainContainerMouseDown = useCallback(\n () => setIsMainActive(true),\n []\n )\n const handleMainContainerMouseUp = useCallback(\n () => setIsMainActive(false),\n []\n )\n\n const handleClick = useCallback(() => {\n if (canUnfurl) {\n setIsOpen(!isOpen)\n }\n onClick?.(!isOpen)\n }, [canUnfurl, isOpen, onClick])\n\n const styles = useMemo(\n () => ({\n ...getStyles(theme, disabled),\n opacity: isMainActive ? 0.8 : disabled ? 0.5 : 1,\n transition: `opacity ${theme.motion.quick}, background-color ${theme.motion.hover}`\n }),\n [theme, disabled, isMainActive]\n )\n\n const containerStyles = useMemo(\n () => ({\n width: '100%',\n cursor: 'pointer',\n transition: `background-color ${theme.motion.hover}`,\n padding: `0 ${theme.spacing.s}px`,\n '& > div:first-of-type': {\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing.s,\n padding: theme.spacing.s,\n backgroundColor:\n isHovered && !disabled ? theme.color.background.surface2 : undefined,\n boxShadow:\n isHovered && !disabled\n ? `inset 0 0 0 1px ${theme.color.border.default}`\n : undefined,\n borderRadius: theme.cornerRadius.m,\n width: '100%'\n }\n }),\n [theme, isHovered, disabled]\n )\n\n const getIcon = useMemo(() => {\n const isCaretVisibleWhenHovered = isHovered && canUnfurl\n const isDownArrowPersistent = shouldPersistDownArrow && isOpen\n const shouldShowCaret = isCaretVisibleWhenHovered \|\| isDownArrowPersistent\n return (\n <>\n {LeftIcon ? (\n <LeftIcon\n size={variants[variant].iconSize}\n color='default'\n css={{\n transition: `opacity ${theme.motion.quick}`,\n opacity: shouldShowCaret ? 0 : 1,\n position: 'absolute'\n }}\n />\n ) : null}\n <IconCaretRight\n size='s'\n color='default'\n css={{\n transition: `transform ${theme.motion.expressive}, opacity ${theme.motion.quick}`,\n transform: isOpen ? `rotate(90deg)` : undefined,\n opacity: shouldShowCaret ? 1 : 0\n }}\n />\n </>\n )\n }, [\n isHovered,\n canUnfurl,\n shouldPersistDownArrow,\n LeftIcon,\n variant,\n theme.motion.quick,\n theme.motion.expressive,\n isOpen\n ])\n\n const leftIcon = useMemo(() => {\n if (!getIcon && !LeftIcon) return null\n\n const dimensions = variant === 'compact' ? 'unit5' : 'unit6'\n\n return (\n <Flex\n alignItems='center'\n justifyContent='center'\n h={dimensions}\n w={dimensions}\n >\n {getIcon}\n </Flex>\n )\n }, [getIcon, LeftIcon, variant])\n\n const shouldShowRightIcon = isOpen \|\| shouldPersistRightIcon\n\n return (\n <Flex direction='column' role='navigation' w='100%' {...props}>\n <Flex\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n css={containerStyles}\n >\n <Flex w='100%'>\n <Flex\n alignItems='center'\n flex={1}\n gap='m'\n css={styles}\n onMouseDown={handleMainContainerMouseDown}\n onMouseUp={handleMainContainerMouseUp}\n onClick={handleClick}\n role='button'\n aria-expanded={isOpen}\n aria-controls={`${label}-content`}\n aria-label={`${label} navigation section`}\n >\n <Flex\n alignItems='center'\n gap={variants[variant].gap}\n flex={1}\n css={{\n maxWidth: ITEM_DEFAULT_WIDTH,\n transition: `opacity ${theme.motion.expressive}`\n }}\n >\n {leftIcon}\n <Text\n variant={variants[variant].textVariant}\n size={variants[variant].textSize}\n strength={variants[variant].textStrength}\n lineHeight='single'\n color='default'\n ellipses\n >\n {label}\n </Text>\n </Flex>\n </Flex>\n {shouldShowRightIcon ? (\n <Box\n onClick={(e) => e.stopPropagation()}\n css={{\n cursor: 'pointer',\n opacity: disabled ? 0.5 : 1,\n transition: `opacity ${theme.motion.quick}`\n }}\n >\n {rightIcon}\n </Box>\n ) : null}\n </Flex>\n </Flex>\n {nestedItems ? (\n <Flex\n direction='column'\n css={{\n transition: `height ${theme.motion.expressive}, opacity ${theme.motion.quick}`,\n overflow: 'hidden',\n opacity: isOpen ? 1 : 0\n }}\n style={{ height: isOpen ? bounds.height : 0 }}\n >\n <Flex\n direction='column'\n ref={ref}\n id={`${label}-content`}\n role='region'\n aria-label={`${label} content`}\n >\n {nestedItems}\n </Flex>\n </Flex>\n ) : null}\n </Flex>\n )\n}\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/components/hint/Hint.d.ts CHANGED Viewed

@@ -3,6 +3,7 @@ import type { IconComponent } from "../icon";
 import { PaperProps } from "../layout/Paper";
 type HintProps = {
     icon?: IconComponent;
+    noIcon?: boolean;
     actions?: ReactNode;
 } & PaperProps;
 export declare const Hint: (props: HintProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/hint/Hint.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hint.d.ts","sourceRoot":"","sources":["../../../src/components/hint/Hint.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAgC;AAE7D,OAAO,EAAS,UAAU,EAAE,wBAAwC;AAIpE,KAAK,SAAS,GAAG;IACf,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,GAAG,UAAU,CAAA;AAKd,eAAO,MAAM,IAAI,UAAW,SAAS,~~qDA2BpC~~,CAAA"}
1	+ {"version":3,"file":"Hint.d.ts","sourceRoot":"","sources":["../../../src/components/hint/Hint.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAgC;AAE7D,OAAO,EAAS,UAAU,EAAE,wBAAwC;AAIpE,KAAK,SAAS,GAAG;IACf,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,GAAG,UAAU,CAAA;AAKd,eAAO,MAAM,IAAI,UAAW,SAAS,qDAiCpC,CAAA"}

package/dist/components/hint/Hint.js CHANGED Viewed

@@ -22,6 +22,7 @@ import '../button/IconButton/IconButton.js';
 import '../button/UnstyledButton.js';
 import '../button/FilterButton/FilterButton.js';
 import '../button/FilterButton/FilterButtonOption.js';
+import '../button/BaseButton/BaseButton.js';
 import '@react-spring/web';
 import 'classnames';
 import '../text-link/TextLink.js';
@@ -57,8 +58,8 @@ import '../internal/MenuItem.js';
  * A way of informing the user of important details in line in a prominent way.
  */
 var Hint = function (props) {
-    var _a = props.icon, Icon = _a === void 0 ? IconQuestionCircle : _a, children = props.children, actions = props.actions, other = __rest(props, ["icon", "children", "actions"]);
-    return (jsxs(Paper, __assign({ role: 'alert', backgroundColor: 'surface2', ph: 'l', pv: 'm', direction: 'column', gap: 'm', shadow: 'flat', border: 'strong' }, other, { children: [jsxs(Flex, __assign({ gap: 'l', alignItems: 'center' }, { children: [jsx(Icon, { size: 'l', color: 'default' }), jsx(Text, __assign({ variant: 'body', color: 'default' }, { children: children }))] })), actions ? (jsx(Flex, __assign({ pl: 'unit10', gap: 'l' }, { children: actions }))) : null] })));
+    var _a = props.icon, Icon = _a === void 0 ? IconQuestionCircle : _a, children = props.children, actions = props.actions, noIcon = props.noIcon, other = __rest(props, ["icon", "children", "actions", "noIcon"]);
+    return (jsxs(Paper, __assign({ role: 'alert', backgroundColor: 'surface2', ph: 'l', pv: 'm', direction: 'column', gap: 'm', shadow: 'flat', border: 'strong' }, other, { children: [jsxs(Flex, __assign({ gap: 'l', alignItems: 'center' }, { children: [noIcon ? null : jsx(Icon, { size: 'l', color: 'default' }), jsx(Text, __assign({ variant: 'body', color: 'default' }, { children: children }))] })), actions ? (jsx(Flex, __assign({ pl: 'unit10', gap: 'l' }, { children: actions }))) : null] })));
 };
 export { Hint };

package/dist/components/hint/Hint.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hint.js","sources":["../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { ReactNode } from 'react'\n\nimport type { IconComponent } from '~harmony/components/icon'\nimport { Flex } from '~harmony/components/layout'\nimport { Paper, PaperProps } from '~harmony/components/layout/Paper'\nimport { Text } from '~harmony/components/text'\nimport { IconQuestionCircle } from '~harmony/icons'\n\ntype HintProps = {\n icon?: IconComponent\n actions?: ReactNode\n} & PaperProps\n\n/\n A way of informing the user of important details in line in a prominent way.\n */\nexport const Hint = (props: HintProps) => {\n const { icon: Icon = IconQuestionCircle, children, actions, ...other } = props\n return (\n <Paper\n role='alert'\n backgroundColor='surface2'\n ph='l'\n pv='m'\n direction='column'\n gap='m'\n shadow='flat'\n border='strong'\n {...other}\n >\n <Flex gap='l' alignItems='center'>\n <Icon size='l' color='default' ~~/>\~~n <Text variant='body' color='default'>\n {children}\n </Text>\n </Flex>\n {actions ? (\n <Flex pl='unit10' gap='l'>\n {actions}\n </Flex>\n ) : null}\n </Paper>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA~~;;AAEG;AACI,IAAM,IAAI,GAAG,UAAC,KAAgB,EAAA;~~IAC3B~~,IAAA,~~EAAA~~,~~GAAiE~~,KAAK,~~CAAA~~,~~IAAvC~~,EAAzB,IAAI,~~mBAAG~~,kBAAkB,GAAA,EAAA,~~EAAE~~,QAAQ,~~GAAwB~~,KAAK,~~SAA7B~~,~~EAAE~~,OAAO,~~GAAe~~,KAAK,~~CAApB~~,OAAA,~~EAAK~~,KAAK,~~GAAA~~,MAAA,~~CAAK~~,KAAK,~~EAAxE~~,~~CAAgE~~,MAAA,EAAA,UAAA,EAAA,SAAA,~~CAAA~~,~~CAAF~~,~~CAAU~~;~~IAC9E~~,QACEA,~~KAAC~~,KAAK,~~EAAA~~,QAAA,CAAA,~~EACJ~~,IAAI,EAAC,OAAO,EACZ,eAAe,EAAC,UAAU,EAC1B,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAC,GAAG,EACP,MAAM,EAAC,MAAM,EACb,MAAM,EAAC,QAAQ,EACX,EAAA,~~KAAK~~,~~eAETA~~,IAAC,CAAA,IAAI,aAAC,GAAG,EAAC,GAAG,EAAC,UAAU,EAAC,QAAQ,~~EAC/B~~,EAAA,EAAA,QAAA,EAAA,~~CAAAC~~,~~GAAA~~,~~CAAC~~,IAAI,EAAC,EAAA,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,~~EAAG~~,~~CAAA~~,~~EACjCA~~,GAAC,CAAA,IAAI,~~aAAC~~,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAA,EAAA,EAAA,QAAA,EACjC,QAAQ,EAAA,CAAA,CACJ,~~CACF~~,~~EAAA,CAAA,CAAA,~~EACN,OAAO,IACNA,~~GAAA~~,~~CAAC,~~IAAI,~~EAAC~~,QAAA,CAAA,~~EAAA~~,EAAE,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,~~EAAA~~,EAAA,EAAA,QAAA,~~EACtB~~,OAAO,~~EAAA~~,CAAA,~~CACH~~,IACL,IAAI,CACF,EAAA,CAAA,CAAA,EACT;AACH;;;;"}
1	+ {"version":3,"file":"Hint.js","sources":["../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { ReactNode } from 'react'\n\nimport type { IconComponent } from '~harmony/components/icon'\nimport { Flex } from '~harmony/components/layout'\nimport { Paper, PaperProps } from '~harmony/components/layout/Paper'\nimport { Text } from '~harmony/components/text'\nimport { IconQuestionCircle } from '~harmony/icons'\n\ntype HintProps = {\n icon?: IconComponent\n noIcon?: boolean\n actions?: ReactNode\n} & PaperProps\n\n/\n A way of informing the user of important details in line in a prominent way.\n */\nexport const Hint = (props: HintProps) => {\n const {\n icon: Icon = IconQuestionCircle,\n children,\n actions,\n noIcon,\n ...other\n } = props\n return (\n <Paper\n role='alert'\n backgroundColor='surface2'\n ph='l'\n pv='m'\n direction='column'\n gap='m'\n shadow='flat'\n border='strong'\n {...other}\n >\n <Flex gap='l' alignItems='center'>\n {noIcon ? null : <Icon size='l' color='default' />}\n <Text variant='body' color='default'>\n {children}\n </Text>\n </Flex>\n {actions ? (\n <Flex pl='unit10' gap='l'>\n {actions}\n </Flex>\n ) : null}\n </Paper>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA;;AAEG;AACI,IAAM,IAAI,GAAG,UAAC,KAAgB,EAAA;AAEjC,IAAA,IAAA,EAKE,GAAA,KAAK,CALwB,IAAA,EAAzB,IAAI,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,kBAAkB,GAAA,EAAA,EAC/B,QAAQ,GAIN,KAAK,SAJC,EACR,OAAO,GAGL,KAAK,CAHA,OAAA,EACP,MAAM,GAEJ,KAAK,CAAA,MAFD,EACH,KAAK,GACN,MAAA,CAAA,KAAK,EANH,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,CAML,CADS,CACD;IACT,QACEA,IAAC,CAAA,KAAK,EACJ,QAAA,CAAA,EAAA,IAAI,EAAC,OAAO,EACZ,eAAe,EAAC,UAAU,EAC1B,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAC,GAAG,EACP,MAAM,EAAC,MAAM,EACb,MAAM,EAAC,QAAQ,EAAA,EACX,KAAK,EAAA,EAAA,QAAA,EAAA,CAETA,IAAC,CAAA,IAAI,aAAC,GAAG,EAAC,GAAG,EAAC,UAAU,EAAC,QAAQ,EAC9B,EAAA,EAAA,QAAA,EAAA,CAAA,MAAM,GAAG,IAAI,GAAGC,GAAC,CAAA,IAAI,EAAC,EAAA,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,EAAA,CAAG,EAClDA,GAAC,CAAA,IAAI,EAAC,QAAA,CAAA,EAAA,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAA,EAAA,EAAA,QAAA,EACjC,QAAQ,EAAA,CAAA,CACJ,KACF,EACN,OAAO,IACNA,IAAC,IAAI,EAAA,QAAA,CAAA,EAAC,EAAE,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EACtB,EAAA,EAAA,QAAA,EAAA,OAAO,EACH,CAAA,CAAA,IACL,IAAI,CACF,EAAA,CAAA,CAAA,EACT;AACH;;;;"}

package/dist/components/hover-card/HoverCard.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { HoverCardProps } from './types';
-export declare const HoverCard: import("react").MemoExoticComponent<({ children, className, content, onClose, onClick, anchorOrigin, transformOrigin, mouseEnterDelay, triggeredBy }: HoverCardProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+export declare const HoverCard: import("react").MemoExoticComponent<({ children, className, content, onClose, onClick, anchorOrigin, transformOrigin, mouseEnterDelay, triggeredBy, onHover }: HoverCardProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=HoverCard.d.ts.map

package/dist/components/hover-card/HoverCard.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/HoverCard.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;~~AAqGxC~~,eAAO,MAAM,SAAS,~~wJA1DnB~~,cAAc,~~sDA0DgC~~,CAAA"}
1	+ {"version":3,"file":"HoverCard.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/HoverCard.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AA6GxC,eAAO,MAAM,SAAS,iKAjEnB,cAAc,sDAiEgC,CAAA"}

package/dist/components/hover-card/HoverCard.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { __assign } from '../../_virtual/_tslib.js';
 import { jsxs, jsx } from '@emotion/react/jsx-runtime';
-import { memo, useRef, useCallback } from 'react';
+import { memo, useRef, useEffect, useCallback } from 'react';
 import '@emotion/react';
 import '../layout/Box/Box.js';
 import { Flex } from '../layout/Flex/Flex.js';
@@ -21,6 +21,7 @@ import '../button/IconButton/IconButton.js';
 import '../button/UnstyledButton.js';
 import '../button/FilterButton/FilterButton.js';
 import '../button/FilterButton/FilterButtonOption.js';
+import '../button/BaseButton/BaseButton.js';
 import '@react-spring/web';
 import 'classnames';
 import '../text-link/TextLink.js';
@@ -82,9 +83,13 @@ var DEFAULT_TRANSFORM_ORIGIN = {
  * ```
  */
 var HoverCardComponent = function (_a) {
-    var children = _a.children, className = _a.className, content = _a.content, onClose = _a.onClose, onClick = _a.onClick, _b = _a.anchorOrigin, anchorOrigin = _b === void 0 ? DEFAULT_ANCHOR_ORIGIN : _b, _c = _a.transformOrigin, transformOrigin = _c === void 0 ? DEFAULT_TRANSFORM_ORIGIN : _c, _d = _a.mouseEnterDelay, mouseEnterDelay = _d === void 0 ? 0.5 : _d, _e = _a.triggeredBy, triggeredBy = _e === void 0 ? 'hover' : _e;
+    var children = _a.children, className = _a.className, content = _a.content, onClose = _a.onClose, onClick = _a.onClick, _b = _a.anchorOrigin, anchorOrigin = _b === void 0 ? DEFAULT_ANCHOR_ORIGIN : _b, _c = _a.transformOrigin, transformOrigin = _c === void 0 ? DEFAULT_TRANSFORM_ORIGIN : _c, _d = _a.mouseEnterDelay, mouseEnterDelay = _d === void 0 ? 0.5 : _d, _e = _a.triggeredBy, triggeredBy = _e === void 0 ? 'hover' : _e, onHover = _a.onHover;
     var anchorRef = useRef(null);
     var _f = useHoverDelay(mouseEnterDelay, triggeredBy), isVisible = _f.isVisible, handleMouseEnter = _f.handleMouseEnter, handleMouseLeave = _f.handleMouseLeave, handleClick = _f.handleClick, clearTimer = _f.clearTimer, setIsHovered = _f.setIsHovered, setIsClicked = _f.setIsClicked;
+    // Call onHover callback when hover state changes
+    useEffect(function () {
+        onHover === null || onHover === void 0 ? void 0 : onHover(isVisible);
+    }, [isVisible, onHover]);
     var handleClose = useCallback(function () {
         clearTimer();
         setIsHovered(false);
@@ -93,9 +98,10 @@ var HoverCardComponent = function (_a) {
     }, [clearTimer, setIsHovered, setIsClicked, onClose]);
     var handleClickInternal = useCallback(function () {
         handleClick();
+        handleClose();
         onClick === null || onClick === void 0 ? void 0 : onClick();
-    }, [handleClick, onClick]);
-    return (jsxs(Flex, __assign({ ref: anchorRef, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: triggeredBy !== 'hover' ? handleClickInternal : undefined }, { children: [children, jsx(Popup, __assign({ shadow: 'near', anchorRef: anchorRef, isVisible: isVisible, onClose: handleClose, dismissOnMouseLeave: triggeredBy !== 'click', hideCloseButton: true, zIndex: 30000, anchorOrigin: anchorOrigin, transformOrigin: transformOrigin }, { children: jsx(Paper, __assign({ className: className, borderRadius: 'm', backgroundColor: 'white', direction: 'column', onClick: onClick }, { children: content })) }))] })));
+    }, [handleClick, handleClose, onClick]);
+    return (jsxs(Flex, __assign({ ref: anchorRef, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onClick: triggeredBy !== 'hover' ? handleClickInternal : undefined }, { children: [children, jsx(Popup, __assign({ shadow: 'far', anchorRef: anchorRef, isVisible: isVisible, onClose: handleClose, hideCloseButton: true, zIndex: 30000, anchorOrigin: anchorOrigin, transformOrigin: transformOrigin }, { children: jsx(Paper, __assign({ className: className, border: 'strong', borderRadius: 'm', backgroundColor: 'white', direction: 'column', onClick: onClick, shadow: 'far' }, { children: content })) }))] })));
 };
 var HoverCard = memo(HoverCardComponent);

package/dist/components/hover-card/HoverCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HoverCard.js","sources":["../../../src/components/hover-card/HoverCard.tsx"],"sourcesContent":["import { useRef, useCallback, memo } from 'react'\n\nimport { Flex, Paper, Popup } from '..'\nimport { useHoverDelay } from '../../hooks/useHoverDelay'\nimport { Origin } from '../popup/types'\n\nimport { HoverCardProps } from './types'\n\nconst DEFAULT_ANCHOR_ORIGIN: Origin = {\n horizontal: 'right',\n vertical: 'center'\n}\n\nconst DEFAULT_TRANSFORM_ORIGIN: Origin = {\n horizontal: 'left',\n vertical: 'center'\n}\n\n/*\n HoverCard is a component that displays content in a hover card/tooltip\n * with a Paper container when the user hovers over the component's children.\n \n The hover card appears to the right of the child element and disappears when\n * the user's mouse leaves either the trigger or the card.\n \n @example\n * ```tsx\n * <HoverCard\n * content={\n * <>\n * <SomeHeader />\n * <SomeBody />\n * </>\n * }\n * >\n * <Text>Hover over me</Text>\n * </HoverCard>\n * ```\n */\nconst HoverCardComponent = ({\n children,\n className,\n content,\n onClose,\n onClick,\n anchorOrigin = DEFAULT_ANCHOR_ORIGIN,\n transformOrigin = DEFAULT_TRANSFORM_ORIGIN,\n mouseEnterDelay = 0.5,\n triggeredBy = 'hover'\n}: HoverCardProps) => {\n const anchorRef = useRef<HTMLDivElement \| null>(null)\n const {\n isVisible,\n handleMouseEnter,\n handleMouseLeave,\n handleClick,\n clearTimer,\n setIsHovered,\n setIsClicked\n } = useHoverDelay(mouseEnterDelay, triggeredBy)\n\n const handleClose = useCallback(() => {\n clearTimer()\n setIsHovered(false)\n setIsClicked(false)\n onClose?.()\n }, [clearTimer, setIsHovered, setIsClicked, onClose])\n\n const handleClickInternal = useCallback(() => {\n handleClick()\n onClick?.()\n }, [handleClick, onClick])\n\n return (\n <Flex\n ref={anchorRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={triggeredBy !== 'hover' ? handleClickInternal : undefined}\n >\n {children}\n\n <Popup\n shadow='~~near~~'\n anchorRef={anchorRef}\n isVisible={isVisible}\n onClose={handleClose}\n ~~dismissOnMouseLeave={triggeredBy !== 'click'}\n~~ hideCloseButton\n zIndex={30000}\n anchorOrigin={anchorOrigin}\n transformOrigin={transformOrigin}\n >\n <Paper\n className={className}\n borderRadius='m'\n backgroundColor='white'\n direction='column'\n onClick={onClick}\n >\n {content}\n </Paper>\n </Popup>\n </Flex>\n )\n}\n\nexport const HoverCard = memo(HoverCardComponent)\n"],"names":["_jsxs","_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAQA,IAAM,qBAAqB,GAAW;AACpC,IAAA,UAAU,EAAE,OAAO;AACnB,IAAA,QAAQ,EAAE,QAAQ;CACnB,CAAA;AAED,IAAM,wBAAwB,GAAW;AACvC,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,QAAQ,EAAE,QAAQ;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;AAoBG;AACH,IAAM,kBAAkB,GAAG,UAAC,~~EAUX~~,EAAA;~~AATf~~,IAAA,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,OAAO,aAAA,EACP,OAAO,~~GAAA~~,~~EAAA~~,~~CAAA~~,~~OAAA~~,EACP,~~OAAO~~,GAAA,EAAA,CAAA,~~OAAA~~,~~EACP,oBAAoC,~~EAApC,YAAY,~~mBAAG,qBAAqB,~~GAAA,EAAA,~~EACpC~~,~~EAAA~~,GAAA,EAAA,~~CAAA~~,~~eAA0C~~,EAA1C,eAAe,GAAA,EAAA,~~KAAA~~,~~KAAA~~,~~CAAA,GAAG,wBAAwB,~~GAAA,EAAA,~~EAC1C~~,~~uBAAqB~~,EAArB,eAAe,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,GAAG,KAAA,EACrB,EAAA,GAAA,EAAA,CAAA,WAAqB,EAArB,WAAW,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,OAAO,GAAA,EAAA,CAAA;~~AAErB~~,IAAA,IAAM,SAAS,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;AAC/C,IAAA,IAAA,EAQF,GAAA,aAAa,CAAC,eAAe,EAAE,WAAW,CAAC,EAP7C,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,WAAW,GAAA,EAAA,CAAA,WAAA,EACX,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,YAAY,GAAA,EAAA,CAAA,YAAA,EACZ,YAAY,GAAA,EAAA,CAAA,YACiC,CAAA~~;IAE~~/C,IAAM,WAAW,GAAG,WAAW,CAAC,YAAA;AAC9B,QAAA,UAAU,EAAE,CAAA;QACZ,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,YAAY,CAAC,KAAK,CAAC,CAAA;AACnB,QAAA,OAAO,KAAP,IAAA,IAAA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,EAAI,CAAA;KACZ,EAAE,CAAC,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC,CAAA;IAErD,IAAM,mBAAmB,GAAG,WAAW,CAAC,YAAA;AACtC,QAAA,WAAW,EAAE,CAAA;AACb,QAAA,OAAO,KAAP,IAAA,IAAA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,EAAI,CAAA;~~AACb~~,~~KAAC,~~EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC,CAAA;~~IAE1B~~,QACEA,KAAC,IAAI,EAAA,QAAA,CAAA,EACH,GAAG,EAAE,SAAS,EACd,YAAY,EAAE,gBAAgB,EAC9B,YAAY,EAAE,gBAAgB,EAC9B,OAAO,EAAE,WAAW,KAAK,OAAO,GAAG,mBAAmB,GAAG,SAAS,~~iBAEjE~~,QAAQ,EAETC,~~GAAC~~,~~CAAA~~,KAAK,~~EACJ~~,QAAA,CAAA,~~EAAA~~,MAAM,EAAC,~~MAAM~~,~~EACb~~,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,EACpB,~~mBAAmB,EAAE,WAAW,KAAK,OAAO,EAC5C,~~eAAe,~~EACf~~,IAAA,~~EAAA~~,MAAM,EAAE,KAAK,EACb,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,eAAe,~~EAAA~~,EAAA,EAAA,QAAA,~~EAEhCA~~,~~GAAC~~,~~CAAA~~,KAAK,EACJ,QAAA,CAAA,EAAA,SAAS,EAAE,SAAS,EACpB,YAAY,EAAC,GAAG,EAChB,eAAe,EAAC,OAAO,EACvB,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA,EAAA,EAAA,QAAA,~~EAEf~~,OAAO,EACF,CAAA,CAAA,EAAA,CAAA,CACF,CACH,EAAA,CAAA,CAAA,EACR;AACH,CAAC,CAAA;IAEY,SAAS,GAAG,IAAI,CAAC,kBAAkB;;;;"}
1	+ {"version":3,"file":"HoverCard.js","sources":["../../../src/components/hover-card/HoverCard.tsx"],"sourcesContent":["import { useRef, useCallback, memo, useEffect } from 'react'\n\nimport { Flex, Paper, Popup } from '..'\nimport { useHoverDelay } from '../../hooks/useHoverDelay'\nimport { Origin } from '../popup/types'\n\nimport { HoverCardProps } from './types'\n\nconst DEFAULT_ANCHOR_ORIGIN: Origin = {\n horizontal: 'right',\n vertical: 'center'\n}\n\nconst DEFAULT_TRANSFORM_ORIGIN: Origin = {\n horizontal: 'left',\n vertical: 'center'\n}\n\n/*\n HoverCard is a component that displays content in a hover card/tooltip\n * with a Paper container when the user hovers over the component's children.\n \n The hover card appears to the right of the child element and disappears when\n * the user's mouse leaves either the trigger or the card.\n \n @example\n * ```tsx\n * <HoverCard\n * content={\n * <>\n * <SomeHeader />\n * <SomeBody />\n * </>\n * }\n * >\n * <Text>Hover over me</Text>\n * </HoverCard>\n * ```\n */\nconst HoverCardComponent = ({\n children,\n className,\n content,\n onClose,\n onClick,\n anchorOrigin = DEFAULT_ANCHOR_ORIGIN,\n transformOrigin = DEFAULT_TRANSFORM_ORIGIN,\n mouseEnterDelay = 0.5,\n triggeredBy = 'hover',\n onHover\n}: HoverCardProps) => {\n const anchorRef = useRef<HTMLDivElement \| null>(null)\n const {\n isVisible,\n handleMouseEnter,\n handleMouseLeave,\n handleClick,\n clearTimer,\n setIsHovered,\n setIsClicked\n } = useHoverDelay(mouseEnterDelay, triggeredBy)\n\n // Call onHover callback when hover state changes\n useEffect(() => {\n onHover?.(isVisible)\n }, [isVisible, onHover])\n\n const handleClose = useCallback(() => {\n clearTimer()\n setIsHovered(false)\n setIsClicked(false)\n onClose?.()\n }, [clearTimer, setIsHovered, setIsClicked, onClose])\n\n const handleClickInternal = useCallback(() => {\n handleClick()\n handleClose()\n onClick?.()\n }, [handleClick, handleClose, onClick])\n\n return (\n <Flex\n ref={anchorRef}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onClick={triggeredBy !== 'hover' ? handleClickInternal : undefined}\n >\n {children}\n\n <Popup\n shadow='far'\n anchorRef={anchorRef}\n isVisible={isVisible}\n onClose={handleClose}\n hideCloseButton\n zIndex={30000}\n anchorOrigin={anchorOrigin}\n transformOrigin={transformOrigin}\n >\n <Paper\n className={className}\n border='strong'\n borderRadius='m'\n backgroundColor='white'\n direction='column'\n onClick={onClick}\n shadow='far'\n >\n {content}\n </Paper>\n </Popup>\n </Flex>\n )\n}\n\nexport const HoverCard = memo(HoverCardComponent)\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/hover-card/HoverCardHeader.d.ts CHANGED Viewed

@@ -2,5 +2,5 @@ import { HoverCardHeaderProps } from './types';
 /**
  * A shared base component for hover card headers
  */
-export declare const HoverCardHeader: ({ iconLeft, title, onClose, iconRight }: HoverCardHeaderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const HoverCardHeader: ({ iconLeft, title, onClick, onClose, iconRight }: HoverCardHeaderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=HoverCardHeader.d.ts.map

package/dist/components/hover-card/HoverCardHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HoverCardHeader.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/HoverCardHeader.tsx"],"names":[],"mappings":"~~AAEA~~,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE9C;;GAEG;AACH,eAAO,MAAM,eAAe,~~4CAKzB~~,oBAAoB,~~qDA2CtB~~,CAAA"}
1	+ {"version":3,"file":"HoverCardHeader.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/HoverCardHeader.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE9C;;GAEG;AACH,eAAO,MAAM,eAAe,qDAMzB,oBAAoB,qDAoDtB,CAAA"}

package/dist/components/hover-card/HoverCardHeader.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { __assign } from '../../_virtual/_tslib.js';
 import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import { useCallback } from 'react';
 import '../../foundations/color/semantic.js';
 import '../../foundations/color/color.js';
-import 'react';
 import '@emotion/react';
 import '../../foundations/theme/theme.js';
 import '../layout/Box/Box.js';
@@ -24,6 +24,7 @@ import { IconButton } from '../button/IconButton/IconButton.js';
 import '../button/UnstyledButton.js';
 import '../button/FilterButton/FilterButton.js';
 import '../button/FilterButton/FilterButtonOption.js';
+import '../button/BaseButton/BaseButton.js';
 import '@react-spring/web';
 import 'classnames';
 import '../text-link/TextLink.js';
@@ -56,8 +57,13 @@ import '../../hooks/useHotKeys.js';
  * A shared base component for hover card headers
  */
 var HoverCardHeader = function (_a) {
-    var iconLeft = _a.iconLeft, title = _a.title, onClose = _a.onClose, iconRight = _a.iconRight;
-    return (jsxs(Flex, __assign({ w: '100%', alignSelf: 'stretch', backgroundColor: 'surface1', borderBottom: 'default', p: 'xs', pl: 'xs', pr: 's', alignItems: 'center', justifyContent: 'space-between' }, { children: [jsxs(Flex, __assign({ alignSelf: 'stretch', alignItems: 'center', gap: 'xs' }, { children: [iconLeft ? (jsx(IconButton, { icon: iconLeft, color: 'subdued', size: 'l', "aria-label": '', onClick: onClose })) : null, jsx(Text, __assign({ variant: 'label', size: 's', color: 'default', textTransform: 'uppercase' }, { children: title }))] })), iconRight ? (jsx(IconButton, { icon: iconRight, color: 'subdued', size: 's', "aria-label": 'Close', onClick: onClose })) : null] })));
+    var iconLeft = _a.iconLeft, title = _a.title, onClick = _a.onClick, onClose = _a.onClose, iconRight = _a.iconRight;
+    var handleClick = useCallback(function (e) {
+        e.stopPropagation();
+        onClose === null || onClose === void 0 ? void 0 : onClose();
+        onClick === null || onClick === void 0 ? void 0 : onClick();
+    }, [onClick, onClose]);
+    return (jsxs(Flex, __assign({ w: '100%', alignSelf: 'stretch', backgroundColor: 'surface1', borderBottom: 'default', p: 'xs', pl: 'xs', pr: 's', alignItems: 'center', justifyContent: 'space-between' }, { children: [jsxs(Flex, __assign({ alignSelf: 'stretch', alignItems: 'center', gap: 'xs' }, { children: [iconLeft ? (jsx(IconButton, { icon: iconLeft, color: 'subdued', size: 'l', "aria-label": '', onClick: handleClick })) : null, jsx(Text, __assign({ variant: 'label', size: 's', color: 'default', textTransform: 'uppercase' }, { children: title }))] })), iconRight ? (jsx(IconButton, { icon: iconRight, color: 'subdued', size: 's', "aria-label": 'Close', onClick: handleClick })) : null] })));
 };
 export { HoverCardHeader };

package/dist/components/hover-card/HoverCardHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HoverCardHeader.js","sources":["../../../src/components/hover-card/HoverCardHeader.tsx"],"sourcesContent":["import { Flex, Text, IconButton } from '~harmony/index'\n\nimport { HoverCardHeaderProps } from './types'\n\n/*\n A shared base component for hover card headers\n */\nexport const HoverCardHeader = ({\n iconLeft,\n title,\n onClose,\n iconRight\n}: HoverCardHeaderProps) => {\n return (\n <Flex\n w='100%'\n alignSelf='stretch'\n backgroundColor='surface1'\n borderBottom='default'\n p='xs'\n pl='xs'\n pr='s'\n alignItems='center'\n justifyContent='space-between'\n >\n <Flex alignSelf='stretch' alignItems='center' gap='xs'>\n {iconLeft ? (\n <IconButton\n icon={iconLeft}\n color='subdued'\n size='l'\n aria-label={''}\n onClick={~~onClose~~}\n />\n ) : null}\n <Text\n variant='label'\n size='s'\n color='default'\n textTransform='uppercase'\n >\n {title}\n </Text>\n </Flex>\n {iconRight ? (\n <IconButton\n icon={iconRight}\n color='subdued'\n size='s'\n aria-label='Close'\n onClick={~~onClose~~}\n />\n ) : null}\n </Flex>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA~~;;AAEG;AACI,IAAM,eAAe,GAAG,UAAC,~~EAKT~~,EAAA;~~QAJrB~~,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;AAET,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,QAAA,CAAA,EACH,CAAC,EAAC,MAAM,EACR,SAAS,EAAC,SAAS,EACnB,eAAe,EAAC,UAAU,EAC1B,YAAY,EAAC,SAAS,EACtB,CAAC,EAAC,IAAI,EACN,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,GAAG,EACN,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,eAAe,EAAA,EAAA,EAAA,QAAA,EAAA,CAE9BA,KAAC,IAAI,EAAA,QAAA,CAAA,EAAC,SAAS,EAAC,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EACnD,EAAA,EAAA,QAAA,EAAA,CAAA,QAAQ,IACPC,GAAA,CAAC,UAAU,EAAA,EACT,IAAI,EAAE,QAAQ,EACd,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,GAAG,EAAA,YAAA,EACI,EAAE,EACd,OAAO,EAAE,~~OAAO~~,~~EAChB~~,CAAA,IACA,IAAI,EACRA,GAAC,CAAA,IAAI,EACH,QAAA,CAAA,EAAA,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,GAAG,EACR,KAAK,EAAC,SAAS,EACf,aAAa,EAAC,WAAW,gBAExB,KAAK,EAAA,CAAA,CACD,CACF,EAAA,CAAA,CAAA,EACN,SAAS,IACRA,GAAC,CAAA,UAAU,EACT,EAAA,IAAI,EAAE,SAAS,EACf,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,GAAG,EAAA,YAAA,EACG,OAAO,EAClB,OAAO,EAAE,~~OAAO~~,~~EAChB~~,CAAA,IACA,IAAI,CAAA,EAAA,CAAA,CACH,EACR;AACH;;;;"}
1	+ {"version":3,"file":"HoverCardHeader.js","sources":["../../../src/components/hover-card/HoverCardHeader.tsx"],"sourcesContent":["import { useCallback } from 'react'\n\nimport { Flex, Text, IconButton } from '~harmony/index'\n\nimport { HoverCardHeaderProps } from './types'\n\n/*\n A shared base component for hover card headers\n */\nexport const HoverCardHeader = ({\n iconLeft,\n title,\n onClick,\n onClose,\n iconRight\n}: HoverCardHeaderProps) => {\n const handleClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation()\n onClose?.()\n onClick?.()\n },\n [onClick, onClose]\n )\n\n return (\n <Flex\n w='100%'\n alignSelf='stretch'\n backgroundColor='surface1'\n borderBottom='default'\n p='xs'\n pl='xs'\n pr='s'\n alignItems='center'\n justifyContent='space-between'\n >\n <Flex alignSelf='stretch' alignItems='center' gap='xs'>\n {iconLeft ? (\n <IconButton\n icon={iconLeft}\n color='subdued'\n size='l'\n aria-label={''}\n onClick={handleClick}\n />\n ) : null}\n <Text\n variant='label'\n size='s'\n color='default'\n textTransform='uppercase'\n >\n {title}\n </Text>\n </Flex>\n {iconRight ? (\n <IconButton\n icon={iconRight}\n color='subdued'\n size='s'\n aria-label='Close'\n onClick={handleClick}\n />\n ) : null}\n </Flex>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;AAEG;AACI,IAAM,eAAe,GAAG,UAAC,EAMT,EAAA;AALrB,IAAA,IAAA,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,KAAK,GAAA,EAAA,CAAA,KAAA,EACL,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;AAET,IAAA,IAAM,WAAW,GAAG,WAAW,CAC7B,UAAC,CAAmB,EAAA;QAClB,CAAC,CAAC,eAAe,EAAE,CAAA;AACnB,QAAA,OAAO,KAAP,IAAA,IAAA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,EAAI,CAAA;AACX,QAAA,OAAO,KAAP,IAAA,IAAA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,EAAI,CAAA;AACb,KAAC,EACD,CAAC,OAAO,EAAE,OAAO,CAAC,CACnB,CAAA;AAED,IAAA,QACEA,IAAA,CAAC,IAAI,EAAA,QAAA,CAAA,EACH,CAAC,EAAC,MAAM,EACR,SAAS,EAAC,SAAS,EACnB,eAAe,EAAC,UAAU,EAC1B,YAAY,EAAC,SAAS,EACtB,CAAC,EAAC,IAAI,EACN,EAAE,EAAC,IAAI,EACP,EAAE,EAAC,GAAG,EACN,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,eAAe,EAAA,EAAA,EAAA,QAAA,EAAA,CAE9BA,KAAC,IAAI,EAAA,QAAA,CAAA,EAAC,SAAS,EAAC,SAAS,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,EACnD,EAAA,EAAA,QAAA,EAAA,CAAA,QAAQ,IACPC,GAAA,CAAC,UAAU,EAAA,EACT,IAAI,EAAE,QAAQ,EACd,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,GAAG,EAAA,YAAA,EACI,EAAE,EACd,OAAO,EAAE,WAAW,EACpB,CAAA,IACA,IAAI,EACRA,GAAC,CAAA,IAAI,EACH,QAAA,CAAA,EAAA,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,GAAG,EACR,KAAK,EAAC,SAAS,EACf,aAAa,EAAC,WAAW,gBAExB,KAAK,EAAA,CAAA,CACD,CACF,EAAA,CAAA,CAAA,EACN,SAAS,IACRA,GAAC,CAAA,UAAU,EACT,EAAA,IAAI,EAAE,SAAS,EACf,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,GAAG,EAAA,YAAA,EACG,OAAO,EAClB,OAAO,EAAE,WAAW,EACpB,CAAA,IACA,IAAI,CAAA,EAAA,CAAA,CACH,EACR;AACH;;;;"}

package/dist/components/hover-card/types.d.ts CHANGED Viewed

@@ -43,6 +43,11 @@ export type HoverCardProps = {
      * @default 'hover'
      */
     triggeredBy?: TriggerType;
+    /**
+     * Callback fired when hover state changes
+     * @param isHovered Whether the component is currently being hovered
+     */
+    onHover?: (isHovered: boolean) => void;
 };
 export type HoverCardHeaderProps = {
     /**
@@ -57,6 +62,10 @@ export type HoverCardHeaderProps = {
      * The title to display in the header
      */
     title: string;
+    /**
+     * Optional callback for when either icon in the header is clicked.
+     */
+    onClick?: () => void;
     /**
      * Optional callback when the close button is clicked.
      * If not provided, the close button will be rendered as a non-interactive icon.

package/dist/components/hover-card/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAEvC,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAA;IAEnB;;OAEG;IACH,OAAO,EAAE,SAAS,CAAA;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IAExB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IAExB;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAA;~~CAC1B~~,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAA;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/hover-card/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAEvC,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAA;IAEnB;;OAEG;IACH,OAAO,EAAE,SAAS,CAAA;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAEpB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IAExB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;IAExB;;;OAGG;IACH,WAAW,CAAC,EAAE,WAAW,CAAA;IAEzB;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAA;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA"}

package/dist/components/input/PasswordInput/PasswordInput.js CHANGED Viewed

@@ -52,6 +52,7 @@ import '../../button/FollowButton/FollowButton.js';
 import '../../button/UnstyledButton.js';
 import '../../button/FilterButton/FilterButton.js';
 import '../../button/FilterButton/FilterButtonOption.js';
+import '../../button/BaseButton/BaseButton.js';
 var messages = {
     hidePasswordInput: 'Hide password input',

package/dist/components/input/PasswordInput/PasswordInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordInput.js","sources":["../../../../src/components/input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { useToggle } from 'react-use'\n\nimport { IconButton } from '~harmony/components/button'\nimport { IconVisibilityHidden, IconVisibilityPublic } from '~harmony/icons'\n\nimport { TextInput } from '../TextInput'\n\nimport type { PasswordInputProps } from './types'\n\nconst messages = {\n hidePasswordInput: 'Hide password input',\n showPasswordInput: 'Show password input'\n}\n\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n (props, ref) => {\n const { hideVisibilityToggle, ...restProps } = props\n const [isPasswordVisible, toggleIsPasswordVisible] = useToggle(false)\n const VisibilityIcon = isPasswordVisible\n ? IconVisibilityPublic\n : IconVisibilityHidden\n\n return (\n <TextInput\n ref={ref}\n type={isPasswordVisible ? 'text' : 'password'}\n endAdornment={\n hideVisibilityToggle ? null : (\n <IconButton\n icon={VisibilityIcon}\n color='subdued'\n onClick={toggleIsPasswordVisible}\n aria-label={\n isPasswordVisible\n ? messages.hidePasswordInput\n : messages.showPasswordInput\n }\n ripple\n />\n )\n }\n {...restProps}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAWA,IAAM,QAAQ,GAAG;AACf,IAAA,iBAAiB,EAAE,qBAAqB;AACxC,IAAA,iBAAiB,EAAE,qBAAqB;CACzC,CAAA;IAEY,aAAa,GAAG,UAAU,CACrC,UAAC,KAAK,EAAE,GAAG,EAAA;IACD,IAAA,oBAAoB,GAAmB,KAAK,CAAxB,oBAAA,EAAK,SAAS,GAAA,MAAA,CAAK,KAAK,EAA9C,CAAsC,sBAAA,CAAA,CAAF,CAAU;IAC9C,IAAA,EAAA,GAA+C,SAAS,CAAC,KAAK,CAAC,EAA9D,iBAAiB,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,uBAAuB,GAAA,EAAA,CAAA,CAAA,CAAoB,CAAA;IACrE,IAAM,cAAc,GAAG,iBAAiB;AACtC,UAAE,oBAAoB;UACpB,oBAAoB,CAAA;IAExB,QACEA,IAAC,SAAS,EAAA,QAAA,CAAA,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,iBAAiB,GAAG,MAAM,GAAG,UAAU,EAC7C,YAAY,EACV,oBAAoB,GAAG,IAAI,IACzBA,GAAA,CAAC,UAAU,EACT,EAAA,IAAI,EAAE,cAAc,EACpB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,uBAAuB,EAAA,YAAA,EAE9B,iBAAiB;kBACb,QAAQ,CAAC,iBAAiB;AAC5B,kBAAE,QAAQ,CAAC,iBAAiB,EAEhC,MAAM,EACN,IAAA,EAAA,CAAA,CACH,EAEC,EAAA,SAAS,CACb,CAAA,EACH;AACH,CAAC;;;;"}
1	+ {"version":3,"file":"PasswordInput.js","sources":["../../../../src/components/input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { useToggle } from 'react-use'\n\nimport { IconButton } from '~harmony/components/button'\nimport { IconVisibilityHidden, IconVisibilityPublic } from '~harmony/icons'\n\nimport { TextInput } from '../TextInput'\n\nimport type { PasswordInputProps } from './types'\n\nconst messages = {\n hidePasswordInput: 'Hide password input',\n showPasswordInput: 'Show password input'\n}\n\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n (props, ref) => {\n const { hideVisibilityToggle, ...restProps } = props\n const [isPasswordVisible, toggleIsPasswordVisible] = useToggle(false)\n const VisibilityIcon = isPasswordVisible\n ? IconVisibilityPublic\n : IconVisibilityHidden\n\n return (\n <TextInput\n ref={ref}\n type={isPasswordVisible ? 'text' : 'password'}\n endAdornment={\n hideVisibilityToggle ? null : (\n <IconButton\n icon={VisibilityIcon}\n color='subdued'\n onClick={toggleIsPasswordVisible}\n aria-label={\n isPasswordVisible\n ? messages.hidePasswordInput\n : messages.showPasswordInput\n }\n ripple\n />\n )\n }\n {...restProps}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAM,QAAQ,GAAG;AACf,IAAA,iBAAiB,EAAE,qBAAqB;AACxC,IAAA,iBAAiB,EAAE,qBAAqB;CACzC,CAAA;IAEY,aAAa,GAAG,UAAU,CACrC,UAAC,KAAK,EAAE,GAAG,EAAA;IACD,IAAA,oBAAoB,GAAmB,KAAK,CAAxB,oBAAA,EAAK,SAAS,GAAA,MAAA,CAAK,KAAK,EAA9C,CAAsC,sBAAA,CAAA,CAAF,CAAU;IAC9C,IAAA,EAAA,GAA+C,SAAS,CAAC,KAAK,CAAC,EAA9D,iBAAiB,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,uBAAuB,GAAA,EAAA,CAAA,CAAA,CAAoB,CAAA;IACrE,IAAM,cAAc,GAAG,iBAAiB;AACtC,UAAE,oBAAoB;UACpB,oBAAoB,CAAA;IAExB,QACEA,IAAC,SAAS,EAAA,QAAA,CAAA,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,iBAAiB,GAAG,MAAM,GAAG,UAAU,EAC7C,YAAY,EACV,oBAAoB,GAAG,IAAI,IACzBA,GAAA,CAAC,UAAU,EACT,EAAA,IAAI,EAAE,cAAc,EACpB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,uBAAuB,EAAA,YAAA,EAE9B,iBAAiB;kBACb,QAAQ,CAAC,iBAAiB;AAC5B,kBAAE,QAAQ,CAAC,iBAAiB,EAEhC,MAAM,EACN,IAAA,EAAA,CAAA,CACH,EAEC,EAAA,SAAS,CACb,CAAA,EACH;AACH,CAAC;;;;"}