@razorpay/blade 11.38.1 → 12.0.0

package/build/lib/web/development/components/Link/BaseLink/BaseLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseLink.js","sources":["../../../../../../../src/components/Link/BaseLink/BaseLink.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/prefer-ts-expect-error */\n/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport type { SyntheticEvent } from 'react';\nimport React from 'react';\nimport type { CSSObject } from 'styled-components';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledBaseLink from './StyledBaseLink';\nimport getIn from '~utils/lodashButBetter/get';\nimport useInteraction from '~utils/useInteraction';\nimport type { IconColors, IconComponent, IconProps } from '~components/Icons';\nimport type { Theme } from '~components/BladeProvider';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { BaseText } from '~components/Typography/BaseText';\nimport type {\n  DotNotationSpacingStringToken,\n  StringChildrenType,\n  TestID,\n  BladeElementRef,\n} from '~utils/types';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { DurationString, EasingString, FontSize, Typography } from '~tokens/global';\nimport type {\n  BaseTextProps,\n  BaseTextSizes,\n  TextColors,\n} from '~components/Typography/BaseText/types';\nimport { getStringFromReactText } from '~src/utils/getStringChildren';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { AccessibilityProps } from '~utils/makeAccessible';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport type { BladeCommonEvents } from '~components/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport type { ActionStates } from '~utils/useInteraction';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseLinkCommonProps = {\n  color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';\n  icon?: IconComponent;\n  iconPosition?: 'left' | 'right';\n  onClick?: (event: SyntheticEvent) => void;\n  onBlur?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  }>;\n  onMouseLeave?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  }>;\n  onKeyDown?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.KeyboardEvent<HTMLButtonElement>) => void;\n  }>;\n  accessibilityProps?: Partial<AccessibilityProps>;\n\n  /**\n   * Sets the size of the link\n   *\n   * @default medium\n   */\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n  /**\n   * Defines how far your touch can start away from the link. This is a react-native only prop and has no effect on web.\n   */\n  hitSlop?:\n    | {\n        top?: number;\n        right?: number;\n        bottom?: number;\n        left?: number;\n      }\n    | number;\n  /**\n   * The title of the link which is displayed as a tooltip. This is a web only prop and has no effect on react-native.\n   */\n  htmlTitle?: string;\n  opacity?: number;\n} & TestID &\n  StyledPropsBlade &\n  Omit<BladeCommonEvents, 'onBlur' | 'onMouseLeave'>;\n\n/*\n  Mandatory children prop when icon is not provided\n*/\ntype BaseLinkWithoutIconProps = BaseLinkCommonProps & {\n  icon?: undefined;\n  children: StringChildrenType;\n};\n\n/*\n  Optional children prop when icon is provided\n*/\ntype BaseLinkWithIconProps = BaseLinkCommonProps & {\n  icon: IconComponent;\n  children?: StringChildrenType;\n};\n\n/*\n  BaseLink Props with or without an icon\n*/\ntype BaseLinkPropsWithOrWithoutIcon = BaseLinkWithIconProps | BaseLinkWithoutIconProps;\n\n/*\n  BaseLink Props when variant is anchor\n*/\ntype BaseLinkAnchorVariantProps = BaseLinkPropsWithOrWithoutIcon & {\n  variant?: 'anchor';\n  href?: string;\n  target?: string;\n  rel?: string;\n  isDisabled?: undefined;\n};\n\n/*\n  BaseLink Props when variant is button\n*/\ntype BaseLinkButtonVariantProps = BaseLinkPropsWithOrWithoutIcon & {\n  variant?: 'button';\n  isDisabled?: boolean;\n  href?: undefined;\n  target?: undefined;\n  rel?: undefined;\n};\n\n/*\n  BaseLink Props when variant is anchor or button\n*/\nexport type BaseLinkProps = BaseLinkAnchorVariantProps | BaseLinkButtonVariantProps;\n\ntype BaseLinkStyleProps = {\n  as: 'a' | 'button';\n  textDecorationLine: 'underline' | 'none';\n  iconColor: IconProps['color'];\n  iconSize: IconProps['size'];\n  iconPadding: DotNotationSpacingStringToken;\n  textColor: BaseTextProps['color'];\n  focusRingColor: string;\n  motionDuration: DurationString;\n  motionEasing: EasingString;\n  cursor: CSSObject['cursor'];\n  disabled: boolean;\n  role: 'button' | 'link';\n  defaultRel: BaseLinkProps['rel'];\n  type?: 'button';\n  fontSize: BaseTextProps['fontSize'];\n  lineHeight: BaseTextProps['lineHeight'];\n};\n\ntype LinkActionStates = ActionStates;\nconst getColorToken = ({\n  variant,\n  color,\n  currentInteraction,\n  isDisabled,\n  element,\n}: {\n  variant: BaseLinkProps['variant'];\n  color: BaseLinkProps['color'];\n  element: 'icon' | 'text';\n  currentInteraction: LinkActionStates;\n  isDisabled: boolean;\n}): IconColors | TextColors => {\n  let state = currentInteraction;\n  const map = {\n    default: 'normal',\n    hover: 'subtle',\n    focus: 'normal',\n    disabled: 'disabled',\n  } as const;\n\n  if (isDisabled && variant == 'button') {\n    state = 'disabled';\n  }\n\n  if (color && color !== 'primary') {\n    if (color !== 'white') {\n      return `interactive.${element}.${color}.${map[state]}`;\n    }\n    return `interactive.${element}.staticWhite.${map[state]}`;\n  }\n  return `interactive.${element}.primary.${map[state]}`;\n};\n\nconst getProps = ({\n  theme,\n  variant,\n  currentInteraction,\n  children,\n  isDisabled,\n  color,\n  target,\n  size,\n}: {\n  theme: Theme;\n  variant: NonNullable<BaseLinkProps['variant']>;\n  currentInteraction: LinkActionStates;\n  children?: string;\n  isDisabled: boolean;\n  color: BaseLinkProps['color'];\n  target: BaseLinkProps['target'];\n  size: NonNullable<BaseLinkProps['size']>;\n}): BaseLinkStyleProps => {\n  const isButton = variant === 'button';\n  const textSizes: {\n    fontSize: Record<NonNullable<BaseLinkProps['size']>, keyof FontSize>;\n    lineHeight: Record<NonNullable<BaseLinkProps['size']>, keyof Typography['lineHeights']>;\n  } = {\n    fontSize: {\n      xsmall: 25,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n    lineHeight: {\n      xsmall: 25,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n  };\n\n  const props: BaseLinkStyleProps = {\n    as: isButton ? 'button' : 'a',\n    textDecorationLine: !isButton && currentInteraction !== 'default' ? 'underline' : 'none',\n    iconColor: getColorToken({\n      variant,\n      color,\n      element: 'icon',\n      currentInteraction,\n      isDisabled,\n    }) as IconProps['color'],\n    fontSize: textSizes.fontSize[size],\n    lineHeight: textSizes.lineHeight[size],\n    iconSize: size,\n    iconPadding: children?.trim() ? 'spacing.2' : 'spacing.0',\n    textColor: getColorToken({\n      variant,\n      color,\n      element: 'text',\n      currentInteraction,\n      isDisabled,\n    }) as BaseTextProps['color'],\n    focusRingColor: getIn(theme.colors, 'interactive.background.primary.faded'),\n    motionDuration: 'duration.2xquick',\n    motionEasing: 'easing.standard.effective',\n    cursor: isButton && isDisabled ? 'not-allowed' : 'pointer',\n    disabled: isButton && isDisabled,\n    role: isButton ? 'button' : 'link',\n    defaultRel: target && target === '_blank' ? 'noreferrer noopener' : undefined,\n    type: isButton ? 'button' : undefined,\n  };\n\n  return props;\n};\n\nconst _BaseLink: React.ForwardRefRenderFunction<BladeElementRef, BaseLinkProps> = (\n  {\n    children,\n    icon: Icon,\n    iconPosition = 'left',\n    isDisabled = false,\n    onClick,\n    onKeyDown,\n    variant = 'anchor',\n    href,\n    target,\n    rel,\n    color = 'primary',\n    opacity,\n    accessibilityProps,\n    // @ts-expect-error avoiding exposing to public\n    className,\n    // @ts-expect-error avoiding exposing to public\n    style,\n    size = 'medium',\n    testID,\n    hitSlop,\n    htmlTitle,\n    onBlur,\n    onFocus,\n    onMouseLeave,\n    onMouseMove,\n    onPointerDown,\n    onPointerEnter,\n    onTouchStart,\n    onTouchEnd,\n    onMouseDown,\n    onMouseUp,\n    ...rest\n  },\n  ref,\n) => {\n  const childrenString = getStringFromReactText(children);\n  const { currentInteraction, setCurrentInteraction, ...syntheticEvents } = useInteraction();\n  const { theme } = useTheme();\n  if (__DEV__) {\n    if (!Icon && !childrenString?.trim()) {\n      throwBladeError({\n        message: `At least one of icon or text is required to render a link.`,\n        moduleName: 'BaseLink',\n      });\n    }\n  }\n  const {\n    as,\n    textDecorationLine,\n    iconColor,\n    iconPadding,\n    iconSize,\n    fontSize,\n    textColor,\n    focusRingColor,\n    motionDuration,\n    motionEasing,\n    cursor,\n    disabled,\n    role,\n    defaultRel,\n    type,\n    lineHeight,\n  } = getProps({\n    theme,\n    variant,\n    currentInteraction,\n    children: childrenString,\n    isDisabled,\n    color,\n    target,\n    size,\n  });\n\n  const handleOnClick = (event: SyntheticEvent): void => {\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  const asProp = isReactNative() ? undefined : 'span';\n  return (\n    <StyledBaseLink\n      ref={ref as never}\n      {...metaAttribute({ name: MetaConstants.Link, testID })}\n      accessibilityProps={{\n        ...makeAccessible({\n          role,\n          disabled,\n          ...accessibilityProps,\n        }),\n      }}\n      variant={variant}\n      as={as}\n      href={href}\n      target={target}\n      rel={rel ?? defaultRel}\n      onClick={handleOnClick}\n      {...syntheticEvents}\n      onBlur={(event: any) => {\n        onBlur?.(event);\n        syntheticEvents.onBlur();\n      }}\n      onFocus={(event: any) => {\n        onFocus?.(event);\n        syntheticEvents.onFocus();\n      }}\n      onMouseLeave={(event: any) => {\n        if (onMouseLeave) {\n          onMouseLeave(event);\n        }\n        syntheticEvents.onMouseLeave();\n      }}\n      onMouseMove={onMouseMove}\n      onPointerDown={onPointerDown}\n      onPointerEnter={onPointerEnter}\n      onTouchStart={onTouchStart}\n      onTouchEnd={onTouchEnd}\n      onKeyDown={onKeyDown}\n      onMouseDown={onMouseDown}\n      onMouseUp={onMouseUp}\n      disabled={disabled}\n      type={type}\n      cursor={cursor}\n      focusRingColor={focusRingColor}\n      motionDuration={motionDuration}\n      motionEasing={motionEasing}\n      setCurrentInteraction={setCurrentInteraction}\n      {...getStyledProps(rest)}\n      {...makeAnalyticsAttribute(rest)}\n      // @ts-ignore Because we avoided exposing className to public\n      className={className}\n      style={style}\n      hitSlop={hitSlop}\n      title={htmlTitle}\n    >\n      <BaseBox\n        as={asProp}\n        display=\"flex\"\n        flexDirection=\"row\"\n        className=\"content-container\"\n        alignItems=\"center\"\n        opacity={opacity}\n      >\n        {Icon && iconPosition == 'left' ? (\n          <BaseBox as={asProp} paddingRight={iconPadding} display=\"flex\" alignItems=\"center\">\n            <Icon color={iconColor} size={iconSize} />\n          </BaseBox>\n        ) : null}\n        <BaseText\n          as={asProp}\n          textDecorationLine={textDecorationLine}\n          color={textColor}\n          fontSize={fontSize}\n          lineHeight={lineHeight}\n          textAlign=\"center\"\n          fontWeight=\"medium\"\n        >\n          {children}\n        </BaseText>\n        {Icon && iconPosition == 'right' ? (\n          <BaseBox as={asProp} paddingLeft={iconPadding} display=\"flex\" alignItems=\"center\">\n            <Icon color={iconColor} size={iconSize} />\n          </BaseBox>\n        ) : null}\n      </BaseBox>\n    </StyledBaseLink>\n  );\n};\n\nconst BaseLink = assignWithoutSideEffects(React.forwardRef(_BaseLink), {\n  displayName: 'BaseLink',\n  componentId: 'BaseLink',\n});\n\nexport default BaseLink;\n"],"names":["getColorToken","_ref","variant","color","currentInteraction","isDisabled","element","state","map","hover","focus","disabled","concat","getProps","_ref2","theme","children","target","size","isButton","textSizes","fontSize","xsmall","small","medium","large","lineHeight","props","as","textDecorationLine","iconColor","iconSize","iconPadding","trim","textColor","focusRingColor","getIn","colors","motionDuration","motionEasing","cursor","role","defaultRel","undefined","type","_BaseLink","_ref3","ref","Icon","icon","_ref3$iconPosition","iconPosition","_ref3$isDisabled","onClick","onKeyDown","_ref3$variant","href","rel","_ref3$color","opacity","accessibilityProps","className","style","_ref3$size","testID","hitSlop","htmlTitle","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","rest","_objectWithoutProperties","_excluded","childrenString","getStringFromReactText","_useInteraction","useInteraction","setCurrentInteraction","syntheticEvents","_excluded2","_useTheme","useTheme","throwBladeError","message","moduleName","_getProps","handleOnClick","event","asProp","isReactNative","_jsx","StyledBaseLink","_objectSpread","metaAttribute","name","MetaConstants","Link","makeAccessible","getStyledProps","makeAnalyticsAttribute","title","_jsxs","BaseBox","display","flexDirection","alignItems","paddingRight","BaseText","textAlign","fontWeight","paddingLeft","BaseLink","assignWithoutSideEffects","React","forwardRef","displayName","componentId"],"mappings":"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"}
+{"version":3,"file":"BaseLink.js","sources":["../../../../../../../src/components/Link/BaseLink/BaseLink.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/prefer-ts-expect-error */\n/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport type { SyntheticEvent } from 'react';\nimport React from 'react';\nimport type { CSSObject } from 'styled-components';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledBaseLink from './StyledBaseLink';\nimport getIn from '~utils/lodashButBetter/get';\nimport useInteraction from '~utils/useInteraction';\nimport type { IconColors, IconComponent, IconProps } from '~components/Icons';\nimport type { Theme } from '~components/BladeProvider';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { BaseText } from '~components/Typography/BaseText';\nimport type {\n  DotNotationSpacingStringToken,\n  StringChildrenType,\n  TestID,\n  BladeElementRef,\n} from '~utils/types';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { DurationString, EasingString, FontSize, Typography } from '~tokens/global';\nimport type {\n  BaseTextProps,\n  BaseTextSizes,\n  TextColors,\n} from '~components/Typography/BaseText/types';\nimport { getStringFromReactText } from '~src/utils/getStringChildren';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { AccessibilityProps } from '~utils/makeAccessible';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport type { BladeCommonEvents } from '~components/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\nimport type { ActionStates } from '~utils/useInteraction';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype BaseLinkCommonProps = {\n  color?: 'primary' | 'white' | 'positive' | 'negative' | 'notice' | 'information' | 'neutral';\n  icon?: IconComponent;\n  iconPosition?: 'left' | 'right';\n  onClick?: (event: SyntheticEvent) => void;\n  onBlur?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  }>;\n  onMouseLeave?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  }>;\n  onKeyDown?: Platform.Select<{\n    native: (event: GestureResponderEvent) => void;\n    web: (event: React.KeyboardEvent<HTMLButtonElement>) => void;\n  }>;\n  accessibilityProps?: Partial<AccessibilityProps>;\n\n  /**\n   * Sets the size of the link\n   *\n   * @default medium\n   */\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n  /**\n   * Defines how far your touch can start away from the link. This is a react-native only prop and has no effect on web.\n   */\n  hitSlop?:\n    | {\n        top?: number;\n        right?: number;\n        bottom?: number;\n        left?: number;\n      }\n    | number;\n  /**\n   * The title of the link which is displayed as a tooltip. This is a web only prop and has no effect on react-native.\n   */\n  htmlTitle?: string;\n  opacity?: number;\n} & TestID &\n  StyledPropsBlade &\n  Omit<BladeCommonEvents, 'onBlur' | 'onMouseLeave'>;\n\n/*\n  Mandatory children prop when icon is not provided\n*/\ntype BaseLinkWithoutIconProps = BaseLinkCommonProps & {\n  icon?: undefined;\n  children: StringChildrenType;\n};\n\n/*\n  Optional children prop when icon is provided\n*/\ntype BaseLinkWithIconProps = BaseLinkCommonProps & {\n  icon: IconComponent;\n  children?: StringChildrenType;\n};\n\n/*\n  BaseLink Props with or without an icon\n*/\ntype BaseLinkPropsWithOrWithoutIcon = BaseLinkWithIconProps | BaseLinkWithoutIconProps;\n\n/*\n  BaseLink Props when variant is anchor\n*/\ntype BaseLinkAnchorVariantProps = BaseLinkPropsWithOrWithoutIcon & {\n  variant?: 'anchor';\n  href?: string;\n  target?: string;\n  rel?: string;\n  isDisabled?: undefined;\n};\n\n/*\n  BaseLink Props when variant is button\n*/\ntype BaseLinkButtonVariantProps = BaseLinkPropsWithOrWithoutIcon & {\n  variant?: 'button';\n  isDisabled?: boolean;\n  href?: undefined;\n  target?: undefined;\n  rel?: undefined;\n};\n\n/*\n  BaseLink Props when variant is anchor or button\n*/\nexport type BaseLinkProps = BaseLinkAnchorVariantProps | BaseLinkButtonVariantProps;\n\ntype BaseLinkStyleProps = {\n  as: 'a' | 'button';\n  textDecorationLine: 'underline' | 'none';\n  iconColor: IconProps['color'];\n  iconSize: IconProps['size'];\n  iconPadding: DotNotationSpacingStringToken;\n  textColor: BaseTextProps['color'];\n  focusRingColor: string;\n  motionDuration: DurationString;\n  motionEasing: EasingString;\n  cursor: CSSObject['cursor'];\n  disabled: boolean;\n  role: 'button' | 'link';\n  defaultRel: BaseLinkProps['rel'];\n  type?: 'button';\n  fontSize: BaseTextProps['fontSize'];\n  lineHeight: BaseTextProps['lineHeight'];\n};\n\ntype LinkActionStates = ActionStates;\nconst getColorToken = ({\n  variant,\n  color,\n  currentInteraction,\n  isDisabled,\n  element,\n}: {\n  variant: BaseLinkProps['variant'];\n  color: BaseLinkProps['color'];\n  element: 'icon' | 'text';\n  currentInteraction: LinkActionStates;\n  isDisabled: boolean;\n}): IconColors | TextColors => {\n  let state = currentInteraction;\n  const map = {\n    default: 'normal',\n    hover: 'subtle',\n    focus: 'normal',\n    disabled: 'disabled',\n  } as const;\n\n  if (isDisabled && variant == 'button') {\n    state = 'disabled';\n  }\n\n  if (color && color !== 'primary') {\n    if (color !== 'white') {\n      return `interactive.${element}.${color}.${map[state]}`;\n    }\n    return `interactive.${element}.staticWhite.${map[state]}`;\n  }\n  return `interactive.${element}.primary.${map[state]}`;\n};\n\nconst getProps = ({\n  theme,\n  variant,\n  currentInteraction,\n  children,\n  isDisabled,\n  color,\n  target,\n  size,\n}: {\n  theme: Theme;\n  variant: NonNullable<BaseLinkProps['variant']>;\n  currentInteraction: LinkActionStates;\n  children?: string;\n  isDisabled: boolean;\n  color: BaseLinkProps['color'];\n  target: BaseLinkProps['target'];\n  size: NonNullable<BaseLinkProps['size']>;\n}): BaseLinkStyleProps => {\n  const isButton = variant === 'button';\n  const textSizes: {\n    fontSize: Record<NonNullable<BaseLinkProps['size']>, keyof FontSize>;\n    lineHeight: Record<NonNullable<BaseLinkProps['size']>, keyof Typography['lineHeights']>;\n  } = {\n    fontSize: {\n      xsmall: 25,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n    lineHeight: {\n      xsmall: 25,\n      small: 75,\n      medium: 100,\n      large: 200,\n    },\n  };\n\n  const props: BaseLinkStyleProps = {\n    as: isButton ? 'button' : 'a',\n    textDecorationLine: !isButton && currentInteraction !== 'default' ? 'underline' : 'none',\n    iconColor: getColorToken({\n      variant,\n      color,\n      element: 'icon',\n      currentInteraction,\n      isDisabled,\n    }) as IconProps['color'],\n    fontSize: textSizes.fontSize[size],\n    lineHeight: textSizes.lineHeight[size],\n    iconSize: size,\n    iconPadding: children?.trim() ? 'spacing.2' : 'spacing.0',\n    textColor: getColorToken({\n      variant,\n      color,\n      element: 'text',\n      currentInteraction,\n      isDisabled,\n    }) as BaseTextProps['color'],\n    focusRingColor: getIn(theme.colors, 'interactive.background.primary.faded'),\n    motionDuration: 'duration.2xquick',\n    motionEasing: 'easing.standard',\n    cursor: isButton && isDisabled ? 'not-allowed' : 'pointer',\n    disabled: isButton && isDisabled,\n    role: isButton ? 'button' : 'link',\n    defaultRel: target && target === '_blank' ? 'noreferrer noopener' : undefined,\n    type: isButton ? 'button' : undefined,\n  };\n\n  return props;\n};\n\nconst _BaseLink: React.ForwardRefRenderFunction<BladeElementRef, BaseLinkProps> = (\n  {\n    children,\n    icon: Icon,\n    iconPosition = 'left',\n    isDisabled = false,\n    onClick,\n    onKeyDown,\n    variant = 'anchor',\n    href,\n    target,\n    rel,\n    color = 'primary',\n    opacity,\n    accessibilityProps,\n    // @ts-expect-error avoiding exposing to public\n    className,\n    // @ts-expect-error avoiding exposing to public\n    style,\n    size = 'medium',\n    testID,\n    hitSlop,\n    htmlTitle,\n    onBlur,\n    onFocus,\n    onMouseLeave,\n    onMouseMove,\n    onPointerDown,\n    onPointerEnter,\n    onTouchStart,\n    onTouchEnd,\n    onMouseDown,\n    onMouseUp,\n    ...rest\n  },\n  ref,\n) => {\n  const childrenString = getStringFromReactText(children);\n  const { currentInteraction, setCurrentInteraction, ...syntheticEvents } = useInteraction();\n  const { theme } = useTheme();\n  if (__DEV__) {\n    if (!Icon && !childrenString?.trim()) {\n      throwBladeError({\n        message: `At least one of icon or text is required to render a link.`,\n        moduleName: 'BaseLink',\n      });\n    }\n  }\n  const {\n    as,\n    textDecorationLine,\n    iconColor,\n    iconPadding,\n    iconSize,\n    fontSize,\n    textColor,\n    focusRingColor,\n    motionDuration,\n    motionEasing,\n    cursor,\n    disabled,\n    role,\n    defaultRel,\n    type,\n    lineHeight,\n  } = getProps({\n    theme,\n    variant,\n    currentInteraction,\n    children: childrenString,\n    isDisabled,\n    color,\n    target,\n    size,\n  });\n\n  const handleOnClick = (event: SyntheticEvent): void => {\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  const asProp = isReactNative() ? undefined : 'span';\n  return (\n    <StyledBaseLink\n      ref={ref as never}\n      {...metaAttribute({ name: MetaConstants.Link, testID })}\n      accessibilityProps={{\n        ...makeAccessible({\n          role,\n          disabled,\n          ...accessibilityProps,\n        }),\n      }}\n      variant={variant}\n      as={as}\n      href={href}\n      target={target}\n      rel={rel ?? defaultRel}\n      onClick={handleOnClick}\n      {...syntheticEvents}\n      onBlur={(event: any) => {\n        onBlur?.(event);\n        syntheticEvents.onBlur();\n      }}\n      onFocus={(event: any) => {\n        onFocus?.(event);\n        syntheticEvents.onFocus();\n      }}\n      onMouseLeave={(event: any) => {\n        if (onMouseLeave) {\n          onMouseLeave(event);\n        }\n        syntheticEvents.onMouseLeave();\n      }}\n      onMouseMove={onMouseMove}\n      onPointerDown={onPointerDown}\n      onPointerEnter={onPointerEnter}\n      onTouchStart={onTouchStart}\n      onTouchEnd={onTouchEnd}\n      onKeyDown={onKeyDown}\n      onMouseDown={onMouseDown}\n      onMouseUp={onMouseUp}\n      disabled={disabled}\n      type={type}\n      cursor={cursor}\n      focusRingColor={focusRingColor}\n      motionDuration={motionDuration}\n      motionEasing={motionEasing}\n      setCurrentInteraction={setCurrentInteraction}\n      {...getStyledProps(rest)}\n      {...makeAnalyticsAttribute(rest)}\n      // @ts-ignore Because we avoided exposing className to public\n      className={className}\n      style={style}\n      hitSlop={hitSlop}\n      title={htmlTitle}\n    >\n      <BaseBox\n        as={asProp}\n        display=\"flex\"\n        flexDirection=\"row\"\n        className=\"content-container\"\n        alignItems=\"center\"\n        opacity={opacity}\n      >\n        {Icon && iconPosition == 'left' ? (\n          <BaseBox as={asProp} paddingRight={iconPadding} display=\"flex\" alignItems=\"center\">\n            <Icon color={iconColor} size={iconSize} />\n          </BaseBox>\n        ) : null}\n        <BaseText\n          as={asProp}\n          textDecorationLine={textDecorationLine}\n          color={textColor}\n          fontSize={fontSize}\n          lineHeight={lineHeight}\n          textAlign=\"center\"\n          fontWeight=\"medium\"\n        >\n          {children}\n        </BaseText>\n        {Icon && iconPosition == 'right' ? (\n          <BaseBox as={asProp} paddingLeft={iconPadding} display=\"flex\" alignItems=\"center\">\n            <Icon color={iconColor} size={iconSize} />\n          </BaseBox>\n        ) : null}\n      </BaseBox>\n    </StyledBaseLink>\n  );\n};\n\nconst BaseLink = assignWithoutSideEffects(React.forwardRef(_BaseLink), {\n  displayName: 'BaseLink',\n  componentId: 'BaseLink',\n});\n\nexport default BaseLink;\n"],"names":["getColorToken","_ref","variant","color","currentInteraction","isDisabled","element","state","map","hover","focus","disabled","concat","getProps","_ref2","theme","children","target","size","isButton","textSizes","fontSize","xsmall","small","medium","large","lineHeight","props","as","textDecorationLine","iconColor","iconSize","iconPadding","trim","textColor","focusRingColor","getIn","colors","motionDuration","motionEasing","cursor","role","defaultRel","undefined","type","_BaseLink","_ref3","ref","Icon","icon","_ref3$iconPosition","iconPosition","_ref3$isDisabled","onClick","onKeyDown","_ref3$variant","href","rel","_ref3$color","opacity","accessibilityProps","className","style","_ref3$size","testID","hitSlop","htmlTitle","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchStart","onTouchEnd","onMouseDown","onMouseUp","rest","_objectWithoutProperties","_excluded","childrenString","getStringFromReactText","_useInteraction","useInteraction","setCurrentInteraction","syntheticEvents","_excluded2","_useTheme","useTheme","throwBladeError","message","moduleName","_getProps","handleOnClick","event","asProp","isReactNative","_jsx","StyledBaseLink","_objectSpread","metaAttribute","name","MetaConstants","Link","makeAccessible","getStyledProps","makeAnalyticsAttribute","title","_jsxs","BaseBox","display","flexDirection","alignItems","paddingRight","BaseText","textAlign","fontWeight","paddingLeft","BaseLink","assignWithoutSideEffects","React","forwardRef","displayName","componentId"],"mappings":"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"}

package/build/lib/web/development/components/List/List.js

@@ -69,7 +69,7 @@ var StyledUnorderedList = /*#__PURE__*/styled(UnorderedList).withConfig({
  *  <List />
  * ```
  */
-var _List = function _List(_ref3) {
+var _List = function _List(_ref3, ref) {
   var _ref3$variant = _ref3.variant,
     variant = _ref3$variant === void 0 ? 'unordered' : _ref3$variant,
     size = _ref3.size,
@@ -106,7 +106,9 @@ var _List = function _List(_ref3) {
   });
   return /*#__PURE__*/jsx(ListProvider, {
     value: listContextValue,
-    children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({}, getStyledProps(styledProps)), {}, {
+    children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({
+      ref: ref
+    }, getStyledProps(styledProps)), {}, {
       children: /*#__PURE__*/jsx(ListElement, _objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
         name: MetaConstants.List,
         testID: testID
@@ -123,7 +125,7 @@ var _List = function _List(_ref3) {
     }))
   });
 };
-var List = /*#__PURE__*/assignWithoutSideEffects(_List, {
+var List = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__default.forwardRef(_List), {
   componentId: MetaConstants.List
 });
 

package/build/lib/web/development/components/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../../../../src/components/List/List.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport styled from 'styled-components';\nimport { ListProvider, useListContext } from './ListContext';\nimport { UnorderedList } from './UnorderedList';\nimport { OrderedList } from './OrderedList';\nimport type { ListItemProps } from './ListItem';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { IconComponent, IconProps } from '~components/Icons';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { DotNotationSpacingStringToken, TestID } from '~utils/types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { isValidAllowedChildren } from '~utils/isValidAllowedChildren';\nimport { throwBladeError } from '~utils/logger';\n\ntype ListCommonProps = {\n  /**\n   * ListItem to be rendered for the List.\n   *\n   */\n  children: React.ReactElement<ListItemProps> | React.ReactElement<ListItemProps>[];\n  /**\n   * Sets the variant to be rendered for the List.\n   *\n   * @default 'unordered'\n   */\n  variant?: 'unordered' | 'ordered' | 'ordered-filled';\n  /**\n   * Sets the size for the List.\n   *\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  StyledPropsBlade;\n\ntype ListWithIconProps = ListCommonProps & {\n  variant?: 'unordered';\n  icon?: IconComponent;\n  iconColor?: IconProps['color'];\n};\ntype ListWithoutIconProps = ListCommonProps & {\n  variant?: 'ordered' | 'ordered-filled';\n  icon?: undefined;\n  iconColor?: undefined;\n};\ntype ListProps = ListWithIconProps | ListWithoutIconProps;\n\nconst StyledOrderedList = styled(OrderedList)<{ marginTop?: DotNotationSpacingStringToken }>(\n  ({ marginTop, theme }) => ({\n    marginTop: marginTop ? makeSpace(getIn(theme, marginTop)) : undefined,\n  }),\n);\n\nconst StyledUnorderedList = styled(UnorderedList)<{ marginTop?: DotNotationSpacingStringToken }>(\n  ({ marginTop, theme }) => ({\n    marginTop: marginTop ? makeSpace(getIn(theme, marginTop)) : undefined,\n  }),\n);\n\n/**\n * List Component is used to display a set of related items that are composed of text/links. Each list item begins with a bullet or a number.\n *\n * ## Usage\n *\n * ```tsx\n *   <List\n *     variant='unordered'\n *     size='medium'\n *   >\n *    <ListItem>\n *      Item 1\n *      <List>\n *        <ListItem>Item 1.1</ListItem>\n *      </List>\n *    </ListItem>\n *    <ListItem>Item 2</ListItem>\n *  <List />\n * ```\n */\nconst _List = ({\n  variant = 'unordered',\n  size,\n  children,\n  icon,\n  testID,\n  iconColor,\n  ...styledProps\n}: ListProps): React.ReactElement => {\n  const ListElement = variant === 'unordered' ? StyledUnorderedList : StyledOrderedList;\n  const { level, size: listContextSize } = useListContext();\n  const listContextValue = useMemo(\n    () => ({\n      level: level ? level + 1 : 1,\n      size: size ?? listContextSize,\n      icon,\n      iconColor,\n      variant,\n    }),\n    [icon, iconColor, level, listContextSize, size, variant],\n  );\n\n  const childrenArray = React.Children.toArray(children);\n  const childListItems = childrenArray.filter((child) => {\n    if (isValidAllowedChildren(child, MetaConstants.ListItem)) {\n      return child;\n    }\n    if (__DEV__) {\n      throwBladeError({\n        message: 'You can only pass a ListItem as a child to List.',\n        moduleName: 'List',\n      });\n    }\n    return null;\n  });\n\n  return (\n    <ListProvider value={listContextValue}>\n      <BaseBox {...getStyledProps(styledProps)}>\n        <ListElement\n          {...metaAttribute({ name: MetaConstants.List, testID })}\n          {...makeAccessible({ role: 'list' })} // Role needed for react-native\n        >\n          {variant === 'unordered'\n            ? childListItems\n            : childListItems.map(\n                (child, index) =>\n                  React.cloneElement(child as React.ReactElement, { _itemNumber: index + 1 }), // adds _itemNumber for rendering ordered list bullets\n              )}\n        </ListElement>\n      </BaseBox>\n    </ListProvider>\n  );\n};\n\nconst List = assignWithoutSideEffects(_List, { componentId: MetaConstants.List });\n\nexport { List };\nexport type { ListProps };\n"],"names":["StyledOrderedList","styled","OrderedList","withConfig","displayName","componentId","_ref","marginTop","theme","makeSpace","getIn","undefined","StyledUnorderedList","UnorderedList","_ref2","_List","_ref3","_ref3$variant","variant","size","children","icon","testID","iconColor","styledProps","_objectWithoutProperties","_excluded","ListElement","_useListContext","useListContext","level","listContextSize","listContextValue","useMemo","childrenArray","React","Children","toArray","childListItems","filter","child","isValidAllowedChildren","MetaConstants","ListItem","throwBladeError","message","moduleName","_jsx","ListProvider","value","BaseBox","_objectSpread","getStyledProps","metaAttribute","name","List","makeAccessible","role","map","index","cloneElement","_itemNumber","assignWithoutSideEffects"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../../../../src/components/List/List.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport styled from 'styled-components';\nimport { ListProvider, useListContext } from './ListContext';\nimport { UnorderedList } from './UnorderedList';\nimport { OrderedList } from './OrderedList';\nimport type { ListItemProps } from './ListItem';\nimport getIn from '~utils/lodashButBetter/get';\nimport type { IconComponent, IconProps } from '~components/Icons';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { BladeElementRef, DotNotationSpacingStringToken, TestID } from '~utils/types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { isValidAllowedChildren } from '~utils/isValidAllowedChildren';\nimport { throwBladeError } from '~utils/logger';\n\ntype ListCommonProps = {\n  /**\n   * ListItem to be rendered for the List.\n   *\n   */\n  children: React.ReactElement<ListItemProps> | React.ReactElement<ListItemProps>[];\n  /**\n   * Sets the variant to be rendered for the List.\n   *\n   * @default 'unordered'\n   */\n  variant?: 'unordered' | 'ordered' | 'ordered-filled';\n  /**\n   * Sets the size for the List.\n   *\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  StyledPropsBlade;\n\ntype ListWithIconProps = ListCommonProps & {\n  variant?: 'unordered';\n  icon?: IconComponent;\n  iconColor?: IconProps['color'];\n};\ntype ListWithoutIconProps = ListCommonProps & {\n  variant?: 'ordered' | 'ordered-filled';\n  icon?: undefined;\n  iconColor?: undefined;\n};\ntype ListProps = ListWithIconProps | ListWithoutIconProps;\n\nconst StyledOrderedList = styled(OrderedList)<{ marginTop?: DotNotationSpacingStringToken }>(\n  ({ marginTop, theme }) => ({\n    marginTop: marginTop ? makeSpace(getIn(theme, marginTop)) : undefined,\n  }),\n);\n\nconst StyledUnorderedList = styled(UnorderedList)<{ marginTop?: DotNotationSpacingStringToken }>(\n  ({ marginTop, theme }) => ({\n    marginTop: marginTop ? makeSpace(getIn(theme, marginTop)) : undefined,\n  }),\n);\n\n/**\n * List Component is used to display a set of related items that are composed of text/links. Each list item begins with a bullet or a number.\n *\n * ## Usage\n *\n * ```tsx\n *   <List\n *     variant='unordered'\n *     size='medium'\n *   >\n *    <ListItem>\n *      Item 1\n *      <List>\n *        <ListItem>Item 1.1</ListItem>\n *      </List>\n *    </ListItem>\n *    <ListItem>Item 2</ListItem>\n *  <List />\n * ```\n */\nconst _List = (\n  { variant = 'unordered', size, children, icon, testID, iconColor, ...styledProps }: ListProps,\n  ref: React.Ref<BladeElementRef>,\n): React.ReactElement => {\n  const ListElement = variant === 'unordered' ? StyledUnorderedList : StyledOrderedList;\n  const { level, size: listContextSize } = useListContext();\n  const listContextValue = useMemo(\n    () => ({\n      level: level ? level + 1 : 1,\n      size: size ?? listContextSize,\n      icon,\n      iconColor,\n      variant,\n    }),\n    [icon, iconColor, level, listContextSize, size, variant],\n  );\n\n  const childrenArray = React.Children.toArray(children);\n  const childListItems = childrenArray.filter((child) => {\n    if (isValidAllowedChildren(child, MetaConstants.ListItem)) {\n      return child;\n    }\n    if (__DEV__) {\n      throwBladeError({\n        message: 'You can only pass a ListItem as a child to List.',\n        moduleName: 'List',\n      });\n    }\n    return null;\n  });\n\n  return (\n    <ListProvider value={listContextValue}>\n      <BaseBox ref={ref as never} {...getStyledProps(styledProps)}>\n        <ListElement\n          {...metaAttribute({ name: MetaConstants.List, testID })}\n          {...makeAccessible({ role: 'list' })} // Role needed for react-native\n        >\n          {variant === 'unordered'\n            ? childListItems\n            : childListItems.map(\n                (child, index) =>\n                  React.cloneElement(child as React.ReactElement, { _itemNumber: index + 1 }), // adds _itemNumber for rendering ordered list bullets\n              )}\n        </ListElement>\n      </BaseBox>\n    </ListProvider>\n  );\n};\n\nconst List = assignWithoutSideEffects(React.forwardRef(_List), { componentId: MetaConstants.List });\n\nexport { List };\nexport type { ListProps };\n"],"names":["StyledOrderedList","styled","OrderedList","withConfig","displayName","componentId","_ref","marginTop","theme","makeSpace","getIn","undefined","StyledUnorderedList","UnorderedList","_ref2","_List","_ref3","ref","_ref3$variant","variant","size","children","icon","testID","iconColor","styledProps","_objectWithoutProperties","_excluded","ListElement","_useListContext","useListContext","level","listContextSize","listContextValue","useMemo","childrenArray","React","Children","toArray","childListItems","filter","child","isValidAllowedChildren","MetaConstants","ListItem","throwBladeError","message","moduleName","_jsx","ListProvider","value","BaseBox","_objectSpread","getStyledProps","metaAttribute","name","List","makeAccessible","role","map","index","cloneElement","_itemNumber","assignWithoutSideEffects","forwardRef"],"mappings":"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"}

package/build/lib/web/development/components/Modal/Modal.web.js

@@ -46,7 +46,7 @@ var ModalContent = /*#__PURE__*/styled(BaseBox).withConfig({
 })(function (_ref) {
   var isVisible = _ref.isVisible,
     theme = _ref.theme;
-  return css(["box-shadow:", ";position:fixed;transform:translate(-50%,-50%);opacity:", ";animation:", " ", " ", ";"], theme.elevation.highRaised, isVisible ? 1 : 0, isVisible ? entry : exit, castWebType(makeMotionTime(theme.motion.duration.xmoderate)), isVisible ? castWebType(theme.motion.easing.entrance.revealing) : castWebType(theme.motion.easing.exit.revealing));
+  return css(["box-shadow:", ";position:fixed;transform:translate(-50%,-50%);opacity:", ";animation:", " ", " ", ";"], theme.elevation.highRaised, isVisible ? 1 : 0, isVisible ? entry : exit, castWebType(makeMotionTime(theme.motion.duration.moderate)), isVisible ? castWebType(theme.motion.easing.entrance) : castWebType(theme.motion.easing.exit));
 });
 var Modal = function Modal(_ref2) {
   var _ref2$isOpen = _ref2.isOpen,
@@ -64,7 +64,7 @@ var Modal = function Modal(_ref2) {
     theme = _useTheme.theme,
     platform = _useTheme.platform;
   var _usePresence = usePresence(isOpen, {
-      transitionDuration: theme.motion.duration.xmoderate,
+      transitionDuration: theme.motion.duration.moderate,
       initialEnter: true
     }),
     isMounted = _usePresence.isMounted,

package/build/lib/web/development/components/Modal/Modal.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.web.js","sources":["../../../../../../src/components/Modal/Modal.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\nimport { FloatingFocusManager, FloatingPortal, useFloating } from '@floating-ui/react';\nimport usePresence from 'use-presence';\nimport { ModalHeader } from './ModalHeader';\nimport type { ModalHeaderProps } from './ModalHeader';\nimport { ModalFooter } from './ModalFooter';\nimport type { ModalFooterProps } from './ModalFooter';\nimport { ModalBody } from './ModalBody';\nimport type { ModalBodyProps } from './ModalBody';\nimport { ModalContext } from './ModalContext';\nimport { ModalBackdrop } from './ModalBackdrop';\nimport {\n  modalBorderRadius,\n  modalMaxHeight,\n  modalMaxWidth,\n  modalMinWidth,\n  modalResponsiveScreenGap,\n} from './modalTokens';\nimport type { ModalProps } from './types';\nimport { componentIds } from './constants';\nimport { castWebType, makeMotionTime, makeSize } from '~utils';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { useTheme } from '~components/BladeProvider';\nimport { Box } from '~components/Box';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { logger } from '~utils/logger';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst entry = keyframes`\n  from {\n    opacity: 0;\n    transform: translate(-50%, -50%) scale(0.9) translateY(20px);\n  }\n  to {\n    opacity: 1;\n    transform: translate(-50%, -50%) scale(1) translateY(0px);\n  }\n`;\n\nconst exit = keyframes`\n  from {\n    opacity: 1;\n    transform: translate(-50%, -50%) scale(1) translateY(0px);\n  }\n  to {\n    opacity: 0;\n    transform: translate(-50%, -50%) scale(0.9) translateY(20px);\n  }\n`;\n\nconst ModalContent = styled(BaseBox)<{ isVisible: boolean }>(({ isVisible, theme }) => {\n  return css`\n    box-shadow: ${theme.elevation.highRaised};\n    position: fixed;\n    transform: translate(-50%, -50%);\n    opacity: ${isVisible ? 1 : 0};\n    animation: ${isVisible ? entry : exit}\n      ${castWebType(makeMotionTime(theme.motion.duration.xmoderate))}\n      ${isVisible\n        ? castWebType(theme.motion.easing.entrance.revealing)\n        : castWebType(theme.motion.easing.exit.revealing)};\n  `;\n});\n\nconst Modal = ({\n  isOpen = false,\n  children,\n  onDismiss,\n  initialFocusRef,\n  size = 'small',\n  accessibilityLabel,\n  zIndex = componentZIndices.modal,\n  ...rest\n}: ModalProps): React.ReactElement => {\n  const { theme, platform } = useTheme();\n  const { isMounted, isVisible } = usePresence(isOpen, {\n    transitionDuration: theme.motion.duration.xmoderate,\n    initialEnter: true,\n  });\n\n  // Warn consumer if modal is opened on mobile\n  useEffect(() => {\n    if (__DEV__) {\n      if (platform === 'onMobile') {\n        logger({\n          message: 'Modal is not supported on mobile devices. Please use BottomSheet instead.',\n          moduleName: 'Modal',\n          type: 'warn',\n        });\n      }\n    }\n  }, [platform]);\n\n  // required by floating ui to handle focus\n  const { refs, context } = useFloating({\n    open: isMounted,\n  });\n\n  const defaultInitialFocusRef = React.useRef<any>(null);\n\n  const modalContext = React.useMemo(\n    () => ({\n      isOpen,\n      close: onDismiss,\n      defaultInitialFocusRef,\n      isVisible,\n    }),\n    [isOpen, onDismiss, defaultInitialFocusRef, isVisible],\n  );\n  const handleKeyDown = (event: React.KeyboardEvent): void => {\n    // close modal on escape key press\n    if (event?.key === 'Escape' || event?.code === 'Escape') {\n      onDismiss();\n    }\n  };\n\n  // Only allow ModalHeader, ModalBody and ModalFooter as children\n  useVerifyAllowedChildren({\n    allowedComponents: [componentIds.ModalHeader, componentIds.ModalBody, componentIds.ModalFooter],\n    children,\n    componentName: 'Modal',\n  });\n\n  return (\n    <FloatingPortal>\n      <ModalContext.Provider value={modalContext}>\n        {isMounted ? (\n          <FloatingFocusManager\n            returnFocus\n            initialFocus={initialFocusRef ?? defaultInitialFocusRef}\n            context={context}\n            modal={true}\n          >\n            <Box\n              zIndex={zIndex}\n              position=\"fixed\"\n              testID=\"modal-wrapper\"\n              {...makeAnalyticsAttribute(rest)}\n            >\n              <ModalBackdrop />\n              <ModalContent\n                {...metaAttribute({\n                  name: MetaConstants.Modal,\n                })}\n                {...makeAccessible({\n                  role: 'dialog',\n                  modal: true,\n                  label: accessibilityLabel,\n                })}\n                maxWidth={makeSize(modalMaxWidth[size])}\n                minWidth={makeSize(modalMinWidth)}\n                maxHeight={modalMaxHeight}\n                width={`calc(100vw - ${makeSize(modalResponsiveScreenGap)})`}\n                borderRadius={modalBorderRadius}\n                backgroundColor=\"popup.background.subtle\"\n                position=\"absolute\"\n                display=\"flex\"\n                flexDirection=\"column\"\n                top=\"50%\"\n                left=\"50%\"\n                onKeyDown={handleKeyDown}\n                isVisible={isVisible}\n                ref={refs.setFloating}\n              >\n                {children}\n              </ModalContent>\n            </Box>\n          </FloatingFocusManager>\n        ) : null}\n      </ModalContext.Provider>\n    </FloatingPortal>\n  );\n};\n\nexport { Modal, ModalHeader, ModalFooter, ModalBody };\nexport type { ModalProps, ModalHeaderProps, ModalFooterProps, ModalBodyProps };\n"],"names":["entry","keyframes","exit","ModalContent","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","theme","css","elevation","highRaised","castWebType","makeMotionTime","motion","duration","xmoderate","easing","entrance","revealing","Modal","_ref2","_ref2$isOpen","isOpen","children","onDismiss","initialFocusRef","_ref2$size","size","accessibilityLabel","_ref2$zIndex","zIndex","componentZIndices","modal","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","platform","_usePresence","usePresence","transitionDuration","initialEnter","isMounted","useEffect","logger","message","moduleName","type","_useFloating","useFloating","open","refs","context","defaultInitialFocusRef","React","useRef","modalContext","useMemo","close","handleKeyDown","event","key","code","useVerifyAllowedChildren","allowedComponents","componentIds","ModalHeader","ModalBody","ModalFooter","componentName","_jsx","FloatingPortal","ModalContext","Provider","value","FloatingFocusManager","returnFocus","initialFocus","_jsxs","Box","_objectSpread","position","testID","makeAnalyticsAttribute","ModalBackdrop","metaAttribute","name","MetaConstants","makeAccessible","role","label","maxWidth","makeSize","modalMaxWidth","minWidth","modalMinWidth","maxHeight","modalMaxHeight","width","concat","modalResponsiveScreenGap","borderRadius","modalBorderRadius","backgroundColor","display","flexDirection","top","left","onKeyDown","ref","setFloating"],"mappings":"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"}
+{"version":3,"file":"Modal.web.js","sources":["../../../../../../src/components/Modal/Modal.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\nimport { FloatingFocusManager, FloatingPortal, useFloating } from '@floating-ui/react';\nimport usePresence from 'use-presence';\nimport { ModalHeader } from './ModalHeader';\nimport type { ModalHeaderProps } from './ModalHeader';\nimport { ModalFooter } from './ModalFooter';\nimport type { ModalFooterProps } from './ModalFooter';\nimport { ModalBody } from './ModalBody';\nimport type { ModalBodyProps } from './ModalBody';\nimport { ModalContext } from './ModalContext';\nimport { ModalBackdrop } from './ModalBackdrop';\nimport {\n  modalBorderRadius,\n  modalMaxHeight,\n  modalMaxWidth,\n  modalMinWidth,\n  modalResponsiveScreenGap,\n} from './modalTokens';\nimport type { ModalProps } from './types';\nimport { componentIds } from './constants';\nimport { castWebType, makeMotionTime, makeSize } from '~utils';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { useTheme } from '~components/BladeProvider';\nimport { Box } from '~components/Box';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { logger } from '~utils/logger';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst entry = keyframes`\n  from {\n    opacity: 0;\n    transform: translate(-50%, -50%) scale(0.9) translateY(20px);\n  }\n  to {\n    opacity: 1;\n    transform: translate(-50%, -50%) scale(1) translateY(0px);\n  }\n`;\n\nconst exit = keyframes`\n  from {\n    opacity: 1;\n    transform: translate(-50%, -50%) scale(1) translateY(0px);\n  }\n  to {\n    opacity: 0;\n    transform: translate(-50%, -50%) scale(0.9) translateY(20px);\n  }\n`;\n\nconst ModalContent = styled(BaseBox)<{ isVisible: boolean }>(({ isVisible, theme }) => {\n  return css`\n    box-shadow: ${theme.elevation.highRaised};\n    position: fixed;\n    transform: translate(-50%, -50%);\n    opacity: ${isVisible ? 1 : 0};\n    animation: ${isVisible ? entry : exit}\n      ${castWebType(makeMotionTime(theme.motion.duration.moderate))}\n      ${isVisible\n        ? castWebType(theme.motion.easing.entrance)\n        : castWebType(theme.motion.easing.exit)};\n  `;\n});\n\nconst Modal = ({\n  isOpen = false,\n  children,\n  onDismiss,\n  initialFocusRef,\n  size = 'small',\n  accessibilityLabel,\n  zIndex = componentZIndices.modal,\n  ...rest\n}: ModalProps): React.ReactElement => {\n  const { theme, platform } = useTheme();\n  const { isMounted, isVisible } = usePresence(isOpen, {\n    transitionDuration: theme.motion.duration.moderate,\n    initialEnter: true,\n  });\n\n  // Warn consumer if modal is opened on mobile\n  useEffect(() => {\n    if (__DEV__) {\n      if (platform === 'onMobile') {\n        logger({\n          message: 'Modal is not supported on mobile devices. Please use BottomSheet instead.',\n          moduleName: 'Modal',\n          type: 'warn',\n        });\n      }\n    }\n  }, [platform]);\n\n  // required by floating ui to handle focus\n  const { refs, context } = useFloating({\n    open: isMounted,\n  });\n\n  const defaultInitialFocusRef = React.useRef<any>(null);\n\n  const modalContext = React.useMemo(\n    () => ({\n      isOpen,\n      close: onDismiss,\n      defaultInitialFocusRef,\n      isVisible,\n    }),\n    [isOpen, onDismiss, defaultInitialFocusRef, isVisible],\n  );\n  const handleKeyDown = (event: React.KeyboardEvent): void => {\n    // close modal on escape key press\n    if (event?.key === 'Escape' || event?.code === 'Escape') {\n      onDismiss();\n    }\n  };\n\n  // Only allow ModalHeader, ModalBody and ModalFooter as children\n  useVerifyAllowedChildren({\n    allowedComponents: [componentIds.ModalHeader, componentIds.ModalBody, componentIds.ModalFooter],\n    children,\n    componentName: 'Modal',\n  });\n\n  return (\n    <FloatingPortal>\n      <ModalContext.Provider value={modalContext}>\n        {isMounted ? (\n          <FloatingFocusManager\n            returnFocus\n            initialFocus={initialFocusRef ?? defaultInitialFocusRef}\n            context={context}\n            modal={true}\n          >\n            <Box\n              zIndex={zIndex}\n              position=\"fixed\"\n              testID=\"modal-wrapper\"\n              {...makeAnalyticsAttribute(rest)}\n            >\n              <ModalBackdrop />\n              <ModalContent\n                {...metaAttribute({\n                  name: MetaConstants.Modal,\n                })}\n                {...makeAccessible({\n                  role: 'dialog',\n                  modal: true,\n                  label: accessibilityLabel,\n                })}\n                maxWidth={makeSize(modalMaxWidth[size])}\n                minWidth={makeSize(modalMinWidth)}\n                maxHeight={modalMaxHeight}\n                width={`calc(100vw - ${makeSize(modalResponsiveScreenGap)})`}\n                borderRadius={modalBorderRadius}\n                backgroundColor=\"popup.background.subtle\"\n                position=\"absolute\"\n                display=\"flex\"\n                flexDirection=\"column\"\n                top=\"50%\"\n                left=\"50%\"\n                onKeyDown={handleKeyDown}\n                isVisible={isVisible}\n                ref={refs.setFloating}\n              >\n                {children}\n              </ModalContent>\n            </Box>\n          </FloatingFocusManager>\n        ) : null}\n      </ModalContext.Provider>\n    </FloatingPortal>\n  );\n};\n\nexport { Modal, ModalHeader, ModalFooter, ModalBody };\nexport type { ModalProps, ModalHeaderProps, ModalFooterProps, ModalBodyProps };\n"],"names":["entry","keyframes","exit","ModalContent","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","theme","css","elevation","highRaised","castWebType","makeMotionTime","motion","duration","moderate","easing","entrance","Modal","_ref2","_ref2$isOpen","isOpen","children","onDismiss","initialFocusRef","_ref2$size","size","accessibilityLabel","_ref2$zIndex","zIndex","componentZIndices","modal","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","platform","_usePresence","usePresence","transitionDuration","initialEnter","isMounted","useEffect","logger","message","moduleName","type","_useFloating","useFloating","open","refs","context","defaultInitialFocusRef","React","useRef","modalContext","useMemo","close","handleKeyDown","event","key","code","useVerifyAllowedChildren","allowedComponents","componentIds","ModalHeader","ModalBody","ModalFooter","componentName","_jsx","FloatingPortal","ModalContext","Provider","value","FloatingFocusManager","returnFocus","initialFocus","_jsxs","Box","_objectSpread","position","testID","makeAnalyticsAttribute","ModalBackdrop","metaAttribute","name","MetaConstants","makeAccessible","role","label","maxWidth","makeSize","modalMaxWidth","minWidth","modalMinWidth","maxHeight","modalMaxHeight","width","concat","modalResponsiveScreenGap","borderRadius","modalBorderRadius","backgroundColor","display","flexDirection","top","left","onKeyDown","ref","setFloating"],"mappings":"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"}

package/build/lib/web/development/components/Modal/ModalBackdrop.js

@@ -21,8 +21,8 @@ var StyledModalBackdrop = /*#__PURE__*/styled(FloatingOverlay).withConfig({
   var _useModalContext = useModalContext(),
     isVisible = _useModalContext.isVisible;
   return {
-    transitionDuration: "".concat(makeMotionTime(theme.motion.duration.xmoderate)),
-    transitionTimingFunction: isVisible ? castWebType(theme.motion.easing.entrance.revealing) : castWebType(theme.motion.easing.exit.revealing),
+    transitionDuration: "".concat(makeMotionTime(theme.motion.duration.moderate)),
+    transitionTimingFunction: isVisible ? castWebType(theme.motion.easing.entrance) : castWebType(theme.motion.easing.exit),
     transitionProperty: 'opacity',
     opacity: isVisible ? 1 : 0,
     backgroundColor: theme.colors.overlay.background.subtle

package/build/lib/web/development/components/Modal/ModalBackdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalBackdrop.js","sources":["../../../../../../src/components/Modal/ModalBackdrop.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport styled from 'styled-components';\nimport { FloatingOverlay } from '@floating-ui/react';\nimport { useModalContext } from './ModalContext';\nimport { castWebType, makeMotionTime } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst StyledModalBackdrop = styled(FloatingOverlay)(({ theme }) => {\n  const { isVisible } = useModalContext();\n\n  return {\n    transitionDuration: `${makeMotionTime(theme.motion.duration.xmoderate)}`,\n    transitionTimingFunction: isVisible\n      ? castWebType(theme.motion.easing.entrance.revealing)\n      : castWebType(theme.motion.easing.exit.revealing),\n    transitionProperty: 'opacity',\n    opacity: isVisible ? 1 : 0,\n    backgroundColor: theme.colors.overlay.background.subtle,\n  };\n});\n\nconst ModalBackdrop = (): React.ReactElement => {\n  const { close } = useModalContext();\n\n  return (\n    <StyledModalBackdrop\n      {...metaAttribute({ name: MetaConstants.ModalBackdrop, testID: MetaConstants.ModalBackdrop })}\n      onClick={() => {\n        close();\n      }}\n      lockScroll={true}\n    />\n  );\n};\n\nexport { ModalBackdrop };\n"],"names":["StyledModalBackdrop","styled","FloatingOverlay","withConfig","displayName","componentId","_ref","theme","_useModalContext","useModalContext","isVisible","transitionDuration","concat","makeMotionTime","motion","duration","xmoderate","transitionTimingFunction","castWebType","easing","entrance","revealing","exit","transitionProperty","opacity","backgroundColor","colors","overlay","background","subtle","ModalBackdrop","_useModalContext2","close","_jsx","_objectSpread","metaAttribute","name","MetaConstants","testID","onClick","lockScroll"],"mappings":";;;;;;;;;;;;;;;AAQA,IAAMA,mBAAmB,gBAAGC,MAAM,CAACC,eAAe,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,oCAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAC,CAAA,CAAA,UAAAC,IAAA,EAAe;AAAA,EAAA,IAAZC,KAAK,GAAAD,IAAA,CAALC,KAAK,CAAA;AAC1D,EAAA,IAAAC,gBAAA,GAAsBC,eAAe,EAAE;IAA/BC,SAAS,GAAAF,gBAAA,CAATE,SAAS,CAAA;EAEjB,OAAO;AACLC,IAAAA,kBAAkB,EAAAC,EAAAA,CAAAA,MAAA,CAAKC,cAAc,CAACN,KAAK,CAACO,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,CAAE;IACxEC,wBAAwB,EAAEP,SAAS,GAC/BQ,WAAW,CAACX,KAAK,CAACO,MAAM,CAACK,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,GACnDH,WAAW,CAACX,KAAK,CAACO,MAAM,CAACK,MAAM,CAACG,IAAI,CAACD,SAAS,CAAC;AACnDE,IAAAA,kBAAkB,EAAE,SAAS;AAC7BC,IAAAA,OAAO,EAAEd,SAAS,GAAG,CAAC,GAAG,CAAC;IAC1Be,eAAe,EAAElB,KAAK,CAACmB,MAAM,CAACC,OAAO,CAACC,UAAU,CAACC,MAAAA;GAClD,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,GAA6B;AAC9C,EAAA,IAAAC,iBAAA,GAAkBtB,eAAe,EAAE;IAA3BuB,KAAK,GAAAD,iBAAA,CAALC,KAAK,CAAA;EAEb,oBACEC,GAAA,CAACjC,mBAAmB,EAAAkC,aAAA,CAAAA,aAAA,CACdC,EAAAA,EAAAA,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACP,aAAa;IAAEQ,MAAM,EAAED,aAAa,CAACP,aAAAA;AAAc,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;IAC7FS,OAAO,EAAE,SAAAA,OAAAA,GAAM;AACbP,MAAAA,KAAK,EAAE,CAAA;KACP;AACFQ,IAAAA,UAAU,EAAE,IAAA;AAAK,GAAA,CAClB,CAAC,CAAA;AAEN;;;;"}
+{"version":3,"file":"ModalBackdrop.js","sources":["../../../../../../src/components/Modal/ModalBackdrop.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport styled from 'styled-components';\nimport { FloatingOverlay } from '@floating-ui/react';\nimport { useModalContext } from './ModalContext';\nimport { castWebType, makeMotionTime } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst StyledModalBackdrop = styled(FloatingOverlay)(({ theme }) => {\n  const { isVisible } = useModalContext();\n\n  return {\n    transitionDuration: `${makeMotionTime(theme.motion.duration.moderate)}`,\n    transitionTimingFunction: isVisible\n      ? castWebType(theme.motion.easing.entrance)\n      : castWebType(theme.motion.easing.exit),\n    transitionProperty: 'opacity',\n    opacity: isVisible ? 1 : 0,\n    backgroundColor: theme.colors.overlay.background.subtle,\n  };\n});\n\nconst ModalBackdrop = (): React.ReactElement => {\n  const { close } = useModalContext();\n\n  return (\n    <StyledModalBackdrop\n      {...metaAttribute({ name: MetaConstants.ModalBackdrop, testID: MetaConstants.ModalBackdrop })}\n      onClick={() => {\n        close();\n      }}\n      lockScroll={true}\n    />\n  );\n};\n\nexport { ModalBackdrop };\n"],"names":["StyledModalBackdrop","styled","FloatingOverlay","withConfig","displayName","componentId","_ref","theme","_useModalContext","useModalContext","isVisible","transitionDuration","concat","makeMotionTime","motion","duration","moderate","transitionTimingFunction","castWebType","easing","entrance","exit","transitionProperty","opacity","backgroundColor","colors","overlay","background","subtle","ModalBackdrop","_useModalContext2","close","_jsx","_objectSpread","metaAttribute","name","MetaConstants","testID","onClick","lockScroll"],"mappings":";;;;;;;;;;;;;;;AAQA,IAAMA,mBAAmB,gBAAGC,MAAM,CAACC,eAAe,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,oCAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAAC,CAAA,CAAA,UAAAC,IAAA,EAAe;AAAA,EAAA,IAAZC,KAAK,GAAAD,IAAA,CAALC,KAAK,CAAA;AAC1D,EAAA,IAAAC,gBAAA,GAAsBC,eAAe,EAAE;IAA/BC,SAAS,GAAAF,gBAAA,CAATE,SAAS,CAAA;EAEjB,OAAO;AACLC,IAAAA,kBAAkB,EAAAC,EAAAA,CAAAA,MAAA,CAAKC,cAAc,CAACN,KAAK,CAACO,MAAM,CAACC,QAAQ,CAACC,QAAQ,CAAC,CAAE;IACvEC,wBAAwB,EAAEP,SAAS,GAC/BQ,WAAW,CAACX,KAAK,CAACO,MAAM,CAACK,MAAM,CAACC,QAAQ,CAAC,GACzCF,WAAW,CAACX,KAAK,CAACO,MAAM,CAACK,MAAM,CAACE,IAAI,CAAC;AACzCC,IAAAA,kBAAkB,EAAE,SAAS;AAC7BC,IAAAA,OAAO,EAAEb,SAAS,GAAG,CAAC,GAAG,CAAC;IAC1Bc,eAAe,EAAEjB,KAAK,CAACkB,MAAM,CAACC,OAAO,CAACC,UAAU,CAACC,MAAAA;GAClD,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,GAA6B;AAC9C,EAAA,IAAAC,iBAAA,GAAkBrB,eAAe,EAAE;IAA3BsB,KAAK,GAAAD,iBAAA,CAALC,KAAK,CAAA;EAEb,oBACEC,GAAA,CAAChC,mBAAmB,EAAAiC,aAAA,CAAAA,aAAA,CACdC,EAAAA,EAAAA,aAAa,CAAC;IAAEC,IAAI,EAAEC,aAAa,CAACP,aAAa;IAAEQ,MAAM,EAAED,aAAa,CAACP,aAAAA;AAAc,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;IAC7FS,OAAO,EAAE,SAAAA,OAAAA,GAAM;AACbP,MAAAA,KAAK,EAAE,CAAA;KACP;AACFQ,IAAAA,UAAU,EAAE,IAAA;AAAK,GAAA,CAClB,CAAC,CAAA;AAEN;;;;"}

package/build/lib/web/development/components/Morph/Morph.web.js

@@ -0,0 +1,48 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import 'react';
+import '../BaseMotion/index.js';
+import { useMemoizedStyles } from '../Box/BaseBox/useMemoizedStyles.web.js';
+import '../../utils/index.js';
+import { cssBezierToArray } from '../../utils/cssBezierToArray.js';
+import { msToSeconds } from '../../utils/msToSeconds.js';
+import { jsx } from 'react/jsx-runtime';
+import useTheme from '../BladeProvider/useTheme.js';
+import { MotionDiv } from '../BaseMotion/BaseMotion.js';
+import { castWebType } from '../../utils/platform/castUtils.js';
+
+var _excluded = ["borderRadius", "backgroundColor"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Morph = function Morph(_ref) {
+  var children = _ref.children,
+    layoutId = _ref.layoutId;
+  // Apart from framer-motion's layout morphing, we also support morph of backgroundColor and borderRadius
+  var _children$props = children.props,
+    borderRadius = _children$props.borderRadius,
+    backgroundColor = _children$props.backgroundColor,
+    rest = _objectWithoutProperties(_children$props, _excluded);
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  var cssProps = useMemoizedStyles({
+    borderRadius: borderRadius,
+    backgroundColor: backgroundColor,
+    theme: theme
+  });
+  return /*#__PURE__*/jsx(MotionDiv, _objectSpread(_objectSpread({
+    as: children.type
+  }, rest), {}, {
+    layout: true,
+    layoutId: layoutId
+    // The animations that are not supported by layout animation are animated using `animate` prop here
+    ,
+    animate: cssProps,
+    transition: {
+      duration: msToSeconds(theme.motion.duration.moderate),
+      ease: cssBezierToArray(castWebType(theme.motion.easing.standard))
+    }
+  }));
+};
+
+export { Morph };
+//# sourceMappingURL=Morph.web.js.map

package/build/lib/web/development/components/Morph/Morph.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Morph.web.js","sources":["../../../../../../src/components/Morph/Morph.web.tsx"],"sourcesContent":["import React from 'react';\nimport type { MorphProps } from './types';\nimport { MotionDiv } from '~components/BaseMotion';\nimport { useMemoizedStyles } from '~components/Box/BaseBox/useMemoizedStyles.web';\nimport { castWebType, useTheme } from '~utils';\nimport { cssBezierToArray } from '~utils/cssBezierToArray';\nimport { msToSeconds } from '~utils/msToSeconds';\n\nconst Morph = ({ children, layoutId }: MorphProps): React.ReactElement => {\n  // Apart from framer-motion's layout morphing, we also support morph of backgroundColor and borderRadius\n  const { borderRadius, backgroundColor, ...rest } = children.props;\n  const { theme } = useTheme();\n  const cssProps = useMemoizedStyles({ borderRadius, backgroundColor, theme });\n\n  return (\n    <MotionDiv\n      as={children.type}\n      {...rest}\n      layout\n      layoutId={layoutId}\n      // The animations that are not supported by layout animation are animated using `animate` prop here\n      animate={cssProps}\n      transition={{\n        duration: msToSeconds(theme.motion.duration.moderate),\n        ease: cssBezierToArray(castWebType(theme.motion.easing.standard)),\n      }}\n    />\n  );\n};\n\nexport { Morph };\n"],"names":["Morph","_ref","children","layoutId","_children$props","props","borderRadius","backgroundColor","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","cssProps","useMemoizedStyles","_jsx","MotionDiv","_objectSpread","as","type","layout","animate","transition","duration","msToSeconds","motion","moderate","ease","cssBezierToArray","castWebType","easing","standard"],"mappings":";;;;;;;;;;;;;;;;AAQA,IAAMA,KAAK,GAAG,SAARA,KAAKA,CAAAC,IAAA,EAA+D;AAAA,EAAA,IAAzDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,QAAQ,GAAAF,IAAA,CAARE,QAAQ,CAAA;AACjC;AACA,EAAA,IAAAC,eAAA,GAAmDF,QAAQ,CAACG,KAAK;IAAzDC,YAAY,GAAAF,eAAA,CAAZE,YAAY;IAAEC,eAAe,GAAAH,eAAA,CAAfG,eAAe;AAAKC,IAAAA,IAAI,GAAAC,wBAAA,CAAAL,eAAA,EAAAM,SAAA,CAAA,CAAA;AAC9C,EAAA,IAAAC,SAAA,GAAkBC,QAAQ,EAAE;IAApBC,KAAK,GAAAF,SAAA,CAALE,KAAK,CAAA;EACb,IAAMC,QAAQ,GAAGC,iBAAiB,CAAC;AAAET,IAAAA,YAAY,EAAZA,YAAY;AAAEC,IAAAA,eAAe,EAAfA,eAAe;AAAEM,IAAAA,KAAK,EAALA,KAAAA;AAAM,GAAC,CAAC,CAAA;AAE5E,EAAA,oBACEG,GAAA,CAACC,SAAS,EAAAC,aAAA,CAAAA,aAAA,CAAA;IACRC,EAAE,EAAEjB,QAAQ,CAACkB,IAAAA;AAAK,GAAA,EACdZ,IAAI,CAAA,EAAA,EAAA,EAAA;IACRa,MAAM,EAAA,IAAA;AACNlB,IAAAA,QAAQ,EAAEA,QAAAA;AACV;AAAA;AACAmB,IAAAA,OAAO,EAAER,QAAS;AAClBS,IAAAA,UAAU,EAAE;MACVC,QAAQ,EAAEC,WAAW,CAACZ,KAAK,CAACa,MAAM,CAACF,QAAQ,CAACG,QAAQ,CAAC;AACrDC,MAAAA,IAAI,EAAEC,gBAAgB,CAACC,WAAW,CAACjB,KAAK,CAACa,MAAM,CAACK,MAAM,CAACC,QAAQ,CAAC,CAAA;AAClE,KAAA;AAAE,GAAA,CACH,CAAC,CAAA;AAEN;;;;"}

package/build/lib/web/development/components/Morph/index.js

@@ -0,0 +1,2 @@
+export { Morph } from './Morph.web.js';
+//# sourceMappingURL=index.js.map

package/build/lib/web/development/components/Morph/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/lib/web/development/components/Move/Move.web.js

@@ -0,0 +1,66 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _typeof from '@babel/runtime/helpers/typeof';
+import 'react';
+import '../BaseMotion/index.js';
+import { msToSeconds } from '../../utils/msToSeconds.js';
+import { cssBezierToArray } from '../../utils/cssBezierToArray.js';
+import '../../utils/index.js';
+import { jsx } from 'react/jsx-runtime';
+import useTheme from '../BladeProvider/useTheme.js';
+import { makeSpace } from '../../utils/makeSpace/makeSpace.js';
+import { castWebType } from '../../utils/platform/castUtils.js';
+import { BaseMotionEntryExit } from '../BaseMotion/BaseMotion.js';
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Move = function Move(_ref) {
+  var children = _ref.children,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'inout' : _ref$type,
+    isVisible = _ref.isVisible,
+    motionTriggers = _ref.motionTriggers,
+    shouldUnmountWhenHidden = _ref.shouldUnmountWhenHidden,
+    delay = _ref.delay;
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  var enterDelay = _typeof(delay) === 'object' ? delay.enter : delay;
+  var exitDelay = _typeof(delay) === 'object' ? delay.exit : delay;
+  var movePx = makeSpace(theme.spacing[5]);
+  var moveVariants = {
+    initial: {
+      opacity: 0,
+      transform: "translateY(".concat(movePx, ")")
+    },
+    animate: {
+      opacity: 1,
+      transform: "translateY(".concat(makeSpace(theme.spacing[0]), ")"),
+      transition: _objectSpread(_objectSpread({}, enterDelay ? {
+        delay: msToSeconds(theme.motion.delay[enterDelay])
+      } : {}), {}, {
+        duration: msToSeconds(theme.motion.duration.xmoderate),
+        ease: cssBezierToArray(castWebType(theme.motion.easing.entrance))
+      })
+    },
+    exit: {
+      opacity: 0,
+      transform: "translateY(".concat(movePx, ")"),
+      transition: _objectSpread(_objectSpread({}, exitDelay ? {
+        delay: msToSeconds(theme.motion.delay[exitDelay])
+      } : {}), {}, {
+        duration: msToSeconds(theme.motion.duration.quick),
+        ease: cssBezierToArray(castWebType(theme.motion.easing.exit))
+      })
+    }
+  };
+  return /*#__PURE__*/jsx(BaseMotionEntryExit, {
+    motionVariants: moveVariants,
+    children: children,
+    type: type,
+    isVisible: isVisible,
+    motionTriggers: motionTriggers,
+    shouldUnmountWhenHidden: shouldUnmountWhenHidden
+  });
+};
+
+export { Move };
+//# sourceMappingURL=Move.web.js.map

package/build/lib/web/development/components/Move/Move.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Move.web.js","sources":["../../../../../../src/components/Move/Move.web.tsx"],"sourcesContent":["import React from 'react';\nimport type { MoveProps } from './types';\nimport { BaseMotionEntryExit } from '~components/BaseMotion';\nimport type { MotionVariantsType } from '~components/BaseMotion';\nimport { msToSeconds } from '~utils/msToSeconds';\nimport { cssBezierToArray } from '~utils/cssBezierToArray';\nimport { castWebType, makeSpace, useTheme } from '~utils';\n\n/**\n * ## Move\n *\n * Move is one of the motion presets that we expose from blade to help you make components appear / disappear with move\n *\n * ### Usage\n *\n * #### Move in on mount\n *\n * ```jsx\n * <Move>\n *   <Card />\n * </Move>\n * ```\n *\n * #### Conditionally move based on state\n *\n * ```jsx\n * <Move isVisible={isVisibleState}>\n *   <Card />\n * </Move>\n * ```\n */\nconst Move = ({\n  children,\n  type = 'inout',\n  isVisible,\n  motionTriggers,\n  shouldUnmountWhenHidden,\n  delay,\n}: MoveProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const enterDelay = typeof delay === 'object' ? delay.enter : delay;\n  const exitDelay = typeof delay === 'object' ? delay.exit : delay;\n\n  const movePx = makeSpace(theme.spacing[5]);\n\n  const moveVariants: MotionVariantsType = {\n    initial: {\n      opacity: 0,\n      transform: `translateY(${movePx})`,\n    },\n    animate: {\n      opacity: 1,\n      transform: `translateY(${makeSpace(theme.spacing[0])})`,\n      transition: {\n        // We have to make sure we don't add delay prop because if we define it, it takes precedence in stagger.\n        // Even setting `undefined` would break the stagger\n        ...(enterDelay ? { delay: msToSeconds(theme.motion.delay[enterDelay]) } : {}),\n        duration: msToSeconds(theme.motion.duration.xmoderate),\n        ease: cssBezierToArray(castWebType(theme.motion.easing.entrance)),\n      },\n    },\n    exit: {\n      opacity: 0,\n      transform: `translateY(${movePx})`,\n      transition: {\n        ...(exitDelay ? { delay: msToSeconds(theme.motion.delay[exitDelay]) } : {}),\n        duration: msToSeconds(theme.motion.duration.quick),\n        ease: cssBezierToArray(castWebType(theme.motion.easing.exit)),\n      },\n    },\n  };\n\n  return (\n    <BaseMotionEntryExit\n      motionVariants={moveVariants}\n      children={children}\n      type={type}\n      isVisible={isVisible}\n      motionTriggers={motionTriggers}\n      shouldUnmountWhenHidden={shouldUnmountWhenHidden}\n    />\n  );\n};\n\nexport { Move };\n"],"names":["Move","_ref","children","_ref$type","type","isVisible","motionTriggers","shouldUnmountWhenHidden","delay","_useTheme","useTheme","theme","enterDelay","_typeof","enter","exitDelay","exit","movePx","makeSpace","spacing","moveVariants","initial","opacity","transform","concat","animate","transition","_objectSpread","msToSeconds","motion","duration","xmoderate","ease","cssBezierToArray","castWebType","easing","entrance","quick","_jsx","BaseMotionEntryExit","motionVariants"],"mappings":"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"}

package/build/lib/web/development/components/Move/index.js

@@ -0,0 +1,2 @@
+export { Move } from './Move.web.js';
+//# sourceMappingURL=index.js.map

package/build/lib/web/development/components/Move/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/lib/web/development/components/ProgressBar/CircularProgressBar.web.js

@@ -119,7 +119,7 @@ var CircularProgressBarFilled = function CircularProgressBarFilled(_ref4) {
         strokeDashoffset: dashOffset,
         pulseMotionDuration: "duration.2xgentle",
         pulseMotionDelay: "delay.long",
-        motionEasing: "easing.standard.revealing"
+        motionEasing: "easing.emphasized"
       }), showPercentage && size !== 'small' && /*#__PURE__*/jsxs(StyledSVGText, {
         size: circularProgressSizeTokens[size].percentTextSize,
         weight: "semibold",

package/build/lib/web/development/components/ProgressBar/CircularProgressBar.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"CircularProgressBar.web.js","sources":["../../../../../../src/components/ProgressBar/CircularProgressBar.web.tsx"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components';\nimport styled, { css, keyframes } from 'styled-components';\nimport React from 'react';\nimport type { CircularProgressBarFilledProps } from './types';\nimport {\n  pulseAnimation,\n  circularProgressSizeTokens,\n  getCircularProgressSVGTokens,\n} from './progressBarTokens';\nimport { CircularProgressLabel } from './CircularProgressLabel';\nimport getIn from '~utils/lodashButBetter/get';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castWebType } from '~utils';\nimport { makeMotionTime } from '~utils/makeMotionTime';\nimport type { TextProps } from '~components/Typography';\nimport { getTextProps } from '~components/Typography';\nimport { Svg, Circle } from '~components/Icons/_Svg';\nimport getBaseTextStyles from '~components/Typography/BaseText/getBaseTextStyles';\n\nconst pulseKeyframes = keyframes`\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.65;\n  }\n  100% {\n    opacity: 1;\n  }\n`;\n\nconst getPulseAnimationStyles = ({\n  duration,\n  easing,\n  progressPercent,\n  isMeter,\n}: {\n  duration: string;\n  easing: string;\n  progressPercent: number;\n  isMeter: boolean;\n}): FlattenSimpleInterpolation => {\n  if (isMeter || progressPercent === 100) {\n    return css`\n      height: 100%;\n      width: 100%;\n      transition: stroke-dashoffset ${duration} ${easing};\n    `;\n  }\n\n  return css`\n    height: 100%;\n    width: 100%;\n    opacity: ${pulseAnimation.opacityInitial};\n    background-color: ${pulseAnimation.backgroundColor};\n    transition: stroke-dashoffset ${duration} ${easing};\n    animation: ${pulseKeyframes} ${duration} ${easing} infinite;\n  `;\n};\n\nconst StyledSVGText = styled.text<Pick<TextProps<{ variant: 'body' }>, 'size' | 'weight'>>(\n  ({ theme, size, weight }) => {\n    return {\n      ...getBaseTextStyles({\n        theme,\n        ...getTextProps({ variant: 'body', size, weight }),\n      }),\n      fill: theme.colors.surface.text.gray.normal,\n    };\n  },\n);\n\nconst DeterminatePulseAnimation = styled.circle<\n  Pick<\n    CircularProgressBarFilledProps,\n    'pulseMotionDuration' | 'pulseMotionDelay' | 'motionEasing' | 'progressPercent' | 'isMeter'\n  >\n>(({ theme, pulseMotionDuration, motionEasing, progressPercent, isMeter }) => {\n  const duration = castWebType(makeMotionTime(getIn(theme.motion, pulseMotionDuration)));\n  const easing = castWebType(getIn(theme.motion, motionEasing));\n\n  return getPulseAnimationStyles({\n    duration,\n    easing,\n    progressPercent,\n    isMeter,\n  });\n});\n\nconst CircularProgressBarFilled = ({\n  progressPercent,\n  fillColor,\n  backgroundColor,\n  size = 'small',\n  label,\n  showPercentage = true,\n  isMeter,\n}: CircularProgressBarFilledProps): React.ReactElement => {\n  const {\n    sqSize,\n    strokeWidth,\n    radius,\n    viewBox,\n    dashArray,\n    dashOffset,\n  } = getCircularProgressSVGTokens({ size, progressPercent });\n\n  return (\n    <BaseBox\n      width=\"fit-content\"\n      textAlign=\"center\"\n      display=\"flex\"\n      flexDirection=\"column\"\n      alignItems=\"center\"\n    >\n      <Svg width={String(sqSize)} height={String(sqSize)} viewBox={viewBox}>\n        <Circle\n          fill=\"none\"\n          stroke={backgroundColor}\n          cx={String(sqSize / 2)}\n          cy={String(sqSize / 2)}\n          r={String(radius)}\n          strokeWidth={`${strokeWidth}px`}\n        />\n\n        <DeterminatePulseAnimation\n          progressPercent={progressPercent}\n          isMeter={isMeter}\n          fill=\"none\"\n          stroke={fillColor}\n          cx={sqSize / 2}\n          cy={sqSize / 2}\n          r={radius}\n          strokeWidth={`${strokeWidth}px`}\n          // Start progress marker at 12 O'Clock\n          transform={`rotate(-90 ${sqSize / 2} ${sqSize / 2})`}\n          strokeDasharray={dashArray}\n          strokeDashoffset={dashOffset}\n          pulseMotionDuration=\"duration.2xgentle\"\n          pulseMotionDelay=\"delay.long\"\n          motionEasing=\"easing.standard.revealing\"\n        />\n        {showPercentage && size !== 'small' && (\n          <StyledSVGText\n            size={circularProgressSizeTokens[size].percentTextSize}\n            weight=\"semibold\"\n            x=\"50%\"\n            y=\"50%\"\n            textAnchor=\"middle\"\n            dy=\".4em\"\n          >\n            {progressPercent}%\n          </StyledSVGText>\n        )}\n      </Svg>\n\n      <CircularProgressLabel\n        progressPercent={progressPercent}\n        size={size}\n        label={label}\n        showPercentage={showPercentage}\n      />\n    </BaseBox>\n  );\n};\n\nexport { CircularProgressBarFilled };\n"],"names":["pulseKeyframes","keyframes","getPulseAnimationStyles","_ref","duration","easing","progressPercent","isMeter","css","pulseAnimation","opacityInitial","backgroundColor","StyledSVGText","styled","text","withConfig","displayName","componentId","_ref2","theme","size","weight","_objectSpread","getBaseTextStyles","getTextProps","variant","fill","colors","surface","gray","normal","DeterminatePulseAnimation","circle","_ref3","pulseMotionDuration","motionEasing","castWebType","makeMotionTime","getIn","motion","CircularProgressBarFilled","_ref4","fillColor","_ref4$size","label","_ref4$showPercentage","showPercentage","_getCircularProgressS","getCircularProgressSVGTokens","sqSize","strokeWidth","radius","viewBox","dashArray","dashOffset","_jsxs","BaseBox","width","textAlign","display","flexDirection","alignItems","children","Svg","String","height","_jsx","Circle","stroke","cx","cy","r","concat","transform","strokeDasharray","strokeDashoffset","pulseMotionDelay","circularProgressSizeTokens","percentTextSize","x","y","textAnchor","dy","CircularProgressLabel"],"mappings":"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"}
+{"version":3,"file":"CircularProgressBar.web.js","sources":["../../../../../../src/components/ProgressBar/CircularProgressBar.web.tsx"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components';\nimport styled, { css, keyframes } from 'styled-components';\nimport React from 'react';\nimport type { CircularProgressBarFilledProps } from './types';\nimport {\n  pulseAnimation,\n  circularProgressSizeTokens,\n  getCircularProgressSVGTokens,\n} from './progressBarTokens';\nimport { CircularProgressLabel } from './CircularProgressLabel';\nimport getIn from '~utils/lodashButBetter/get';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castWebType } from '~utils';\nimport { makeMotionTime } from '~utils/makeMotionTime';\nimport type { TextProps } from '~components/Typography';\nimport { getTextProps } from '~components/Typography';\nimport { Svg, Circle } from '~components/Icons/_Svg';\nimport getBaseTextStyles from '~components/Typography/BaseText/getBaseTextStyles';\n\nconst pulseKeyframes = keyframes`\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.65;\n  }\n  100% {\n    opacity: 1;\n  }\n`;\n\nconst getPulseAnimationStyles = ({\n  duration,\n  easing,\n  progressPercent,\n  isMeter,\n}: {\n  duration: string;\n  easing: string;\n  progressPercent: number;\n  isMeter: boolean;\n}): FlattenSimpleInterpolation => {\n  if (isMeter || progressPercent === 100) {\n    return css`\n      height: 100%;\n      width: 100%;\n      transition: stroke-dashoffset ${duration} ${easing};\n    `;\n  }\n\n  return css`\n    height: 100%;\n    width: 100%;\n    opacity: ${pulseAnimation.opacityInitial};\n    background-color: ${pulseAnimation.backgroundColor};\n    transition: stroke-dashoffset ${duration} ${easing};\n    animation: ${pulseKeyframes} ${duration} ${easing} infinite;\n  `;\n};\n\nconst StyledSVGText = styled.text<Pick<TextProps<{ variant: 'body' }>, 'size' | 'weight'>>(\n  ({ theme, size, weight }) => {\n    return {\n      ...getBaseTextStyles({\n        theme,\n        ...getTextProps({ variant: 'body', size, weight }),\n      }),\n      fill: theme.colors.surface.text.gray.normal,\n    };\n  },\n);\n\nconst DeterminatePulseAnimation = styled.circle<\n  Pick<\n    CircularProgressBarFilledProps,\n    'pulseMotionDuration' | 'pulseMotionDelay' | 'motionEasing' | 'progressPercent' | 'isMeter'\n  >\n>(({ theme, pulseMotionDuration, motionEasing, progressPercent, isMeter }) => {\n  const duration = castWebType(makeMotionTime(getIn(theme.motion, pulseMotionDuration)));\n  const easing = castWebType(getIn(theme.motion, motionEasing));\n\n  return getPulseAnimationStyles({\n    duration,\n    easing,\n    progressPercent,\n    isMeter,\n  });\n});\n\nconst CircularProgressBarFilled = ({\n  progressPercent,\n  fillColor,\n  backgroundColor,\n  size = 'small',\n  label,\n  showPercentage = true,\n  isMeter,\n}: CircularProgressBarFilledProps): React.ReactElement => {\n  const {\n    sqSize,\n    strokeWidth,\n    radius,\n    viewBox,\n    dashArray,\n    dashOffset,\n  } = getCircularProgressSVGTokens({ size, progressPercent });\n\n  return (\n    <BaseBox\n      width=\"fit-content\"\n      textAlign=\"center\"\n      display=\"flex\"\n      flexDirection=\"column\"\n      alignItems=\"center\"\n    >\n      <Svg width={String(sqSize)} height={String(sqSize)} viewBox={viewBox}>\n        <Circle\n          fill=\"none\"\n          stroke={backgroundColor}\n          cx={String(sqSize / 2)}\n          cy={String(sqSize / 2)}\n          r={String(radius)}\n          strokeWidth={`${strokeWidth}px`}\n        />\n\n        <DeterminatePulseAnimation\n          progressPercent={progressPercent}\n          isMeter={isMeter}\n          fill=\"none\"\n          stroke={fillColor}\n          cx={sqSize / 2}\n          cy={sqSize / 2}\n          r={radius}\n          strokeWidth={`${strokeWidth}px`}\n          // Start progress marker at 12 O'Clock\n          transform={`rotate(-90 ${sqSize / 2} ${sqSize / 2})`}\n          strokeDasharray={dashArray}\n          strokeDashoffset={dashOffset}\n          pulseMotionDuration=\"duration.2xgentle\"\n          pulseMotionDelay=\"delay.long\"\n          motionEasing=\"easing.emphasized\"\n        />\n        {showPercentage && size !== 'small' && (\n          <StyledSVGText\n            size={circularProgressSizeTokens[size].percentTextSize}\n            weight=\"semibold\"\n            x=\"50%\"\n            y=\"50%\"\n            textAnchor=\"middle\"\n            dy=\".4em\"\n          >\n            {progressPercent}%\n          </StyledSVGText>\n        )}\n      </Svg>\n\n      <CircularProgressLabel\n        progressPercent={progressPercent}\n        size={size}\n        label={label}\n        showPercentage={showPercentage}\n      />\n    </BaseBox>\n  );\n};\n\nexport { CircularProgressBarFilled };\n"],"names":["pulseKeyframes","keyframes","getPulseAnimationStyles","_ref","duration","easing","progressPercent","isMeter","css","pulseAnimation","opacityInitial","backgroundColor","StyledSVGText","styled","text","withConfig","displayName","componentId","_ref2","theme","size","weight","_objectSpread","getBaseTextStyles","getTextProps","variant","fill","colors","surface","gray","normal","DeterminatePulseAnimation","circle","_ref3","pulseMotionDuration","motionEasing","castWebType","makeMotionTime","getIn","motion","CircularProgressBarFilled","_ref4","fillColor","_ref4$size","label","_ref4$showPercentage","showPercentage","_getCircularProgressS","getCircularProgressSVGTokens","sqSize","strokeWidth","radius","viewBox","dashArray","dashOffset","_jsxs","BaseBox","width","textAlign","display","flexDirection","alignItems","children","Svg","String","height","_jsx","Circle","stroke","cx","cy","r","concat","transform","strokeDasharray","strokeDashoffset","pulseMotionDelay","circularProgressSizeTokens","percentTextSize","x","y","textAnchor","dy","CircularProgressLabel"],"mappings":"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"}

package/build/lib/web/development/components/ProgressBar/ProgressBar.js

@@ -1,5 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React__default from 'react';
 import { ProgressBarFilled } from './ProgressBarFilled.web.js';
 import { CircularProgressBarFilled } from './CircularProgressBar.web.js';
 import clamp from '../../utils/lodashButBetter/clamp.js';
@@ -36,7 +37,7 @@ var progressBarHeight = {
   // Large size isn't available when variant is 'linear'
   large: size[0]
 };
-var ProgressBar = function ProgressBar(_ref) {
+var _ProgressBar = function _ProgressBar(_ref, ref) {
   var _label$trim;
   var accessibilityLabel = _ref.accessibilityLabel,
     color = _ref.color,
@@ -117,7 +118,9 @@ var ProgressBar = function ProgressBar(_ref) {
     accessibilityProps.valueMax = undefined;
     accessibilityProps.valueText = undefined;
   }
-  return /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, getStyledProps(rest)), metaAttribute({
+  return /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
+    ref: ref
+  }, getStyledProps(rest)), metaAttribute({
     name: MetaConstants.ProgressBar,
     testID: testID
   })), makeAnalyticsAttribute(rest)), {}, {
@@ -165,7 +168,7 @@ var ProgressBar = function ProgressBar(_ref) {
           pulseMotionDuration: "duration.2xgentle",
           fillMotionDuration: "duration.2xgentle",
           pulseMotionDelay: "delay.long",
-          motionEasing: "easing.standard.revealing"
+          motionEasing: "easing.emphasized"
         }) : /*#__PURE__*/jsx(BaseBox, {
           backgroundColor: unfilledBackgroundColor,
           height: makeSize(progressBarHeight[size]),
@@ -178,7 +181,7 @@ var ProgressBar = function ProgressBar(_ref) {
             pulseMotionDuration: "duration.2xgentle",
             indeterminateMotionDuration: "duration.2xgentle",
             pulseMotionDelay: "delay.long",
-            motionEasing: "easing.standard.revealing",
+            motionEasing: "easing.emphasized",
             type: progressType,
             isIndeterminate: isIndeterminate
           })
@@ -187,6 +190,7 @@ var ProgressBar = function ProgressBar(_ref) {
     })
   }));
 };
+var ProgressBar = /*#__PURE__*/React__default.forwardRef(_ProgressBar);
 
 export { ProgressBar };
 //# sourceMappingURL=ProgressBar.js.map