@razorpay/blade 12.0.0 → 12.0.2

package/build/lib/native/components/ActionList/ActionListItem.js

@@ -31,6 +31,7 @@ import { Checkbox } from '../Checkbox/Checkbox.js';
 import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import '../Checkbox/CheckboxGroup/CheckboxGroupContext.js';
+import '../../utils/useCallbackRef.js';
 import '@gorhom/portal';
 import 'react-native-gesture-handler';
 import '../BottomSheet/BottomSheetStack.js';

package/build/lib/native/components/ActionList/ActionListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionListItem.js","sources":["../../../../../src/components/ActionList/ActionListItem.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { TouchableOpacity } from 'react-native';\nimport { componentIds } from './componentIds';\nimport { validateActionListItemProps, getNormalTextColor } from './actionListUtils';\nimport { getActionListItemRole, getActionListSectionRole } from './getA11yRoles';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { IconComponent } from '~components/Icons';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { Text } from '~components/Typography';\nimport type { Platform } from '~utils';\nimport { castWebType, isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { DataAnalyticsAttribute, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\nimport type { BadgeProps } from '~components/Badge';\nimport { Badge } from '~components/Badge';\nimport { Box } from '~components/Box';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { BaseMenuItem, useBaseMenuItem } from '~components/BaseMenu';\nimport { Checkbox } from '~components/Checkbox';\nimport type { AvatarProps } from '~components/Avatar/types';\nimport { Avatar } from '~components/Avatar';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype ActionListItemProps = {\n  title: string;\n  description?: string;\n  onClick?: (clickProps: {\n    name: string;\n    value?: boolean;\n    event: Platform.Select<{\n      web: React.MouseEvent;\n      native: React.TouchEvent<TouchableOpacity>;\n    }>;\n  }) => void;\n  /**\n   * value that you get from `onChange` event on SelectInput or in form submissions.\n   */\n  value: string;\n  /**\n   * Link to open when item is clicked.\n   */\n  href?: string;\n  /**\n   * HTML target of the link\n   */\n  target?: string;\n  /**\n   * Item that goes on left-side of item.\n   *\n   * Valid elements - `<ActionListItemIcon />`, `<ActionListItemAsset />`\n   *\n   * Will be overriden in multiselect\n   */\n  leading?: React.ReactNode;\n  /**\n   * Item that goes on right-side of item.\n   *\n   * Valid elements - `<ActionListItemText />`, `<ActionListItemIcon />`\n   */\n  trailing?: React.ReactNode;\n  /**\n   * Item that goes immediately next to the title.\n   *\n   * Valid elements - `<ActionListItemBadge />`, `<ActionListItemBadgeGroup />`\n   *\n   */\n  titleSuffix?: React.ReactElement;\n  isDisabled?: boolean;\n  intent?: Extract<FeedbackColors, 'negative'>;\n  /**\n   * Can be used in combination of `onClick` to highlight item as selected in Button Triggers.\n   *\n   * When trigger is SelectInput, Use `value` prop on SelectInput instead to make dropdown controlled.\n   */\n  isSelected?: boolean;\n  /**\n   * Internally passed from ActionList. No need to pass it explicitly\n   *\n   * @private\n   */\n  _index?: number;\n} & TestID &\n  DataAnalyticsAttribute;\n\nconst StyledActionListSectionTitle = styled(BaseBox)((props) => ({\n  // @TODO: replace this styled-component with new layout box when we have padding shorthand\n  padding: makeSize(props.theme.spacing[3]),\n}));\n\ntype ActionListSectionProps = {\n  title: string;\n  children: React.ReactNode[] | React.ReactNode;\n  /**\n   * Internally used to hide the divider on final item in React Native.\n   *\n   * Should not be used by consumers (also won't work on web)\n   *\n   * @private\n   */\n  _hideDivider?: boolean;\n  /**\n   * Internally used to hide / show section in AutoComplete\n   *\n   * @private\n   */\n  _sectionChildValues?: string[];\n} & TestID &\n  DataAnalyticsAttribute;\nconst _ActionListSection = ({\n  title,\n  children,\n  testID,\n  _hideDivider,\n  _sectionChildValues,\n  ...rest\n}: ActionListSectionProps): React.ReactElement => {\n  const { hasAutoCompleteInBottomSheetHeader, dropdownTriggerer, filteredValues } = useDropdown();\n  const hasAutoComplete =\n    hasAutoCompleteInBottomSheetHeader ||\n    dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n  const isSectionVisible = React.useMemo(() => {\n    if (hasAutoComplete) {\n      const visibleActionListItemInSection = _sectionChildValues?.find((actionItemValue) =>\n        filteredValues.includes(actionItemValue),\n      );\n\n      return Boolean(visibleActionListItemInSection);\n    }\n\n    return true;\n  }, [_sectionChildValues, hasAutoComplete, filteredValues]);\n\n  const showDividerInRN = !(_hideDivider && isReactNative());\n  const showDividerInAutoComplete = hasAutoComplete\n    ? isSectionVisible && filteredValues.length > 1\n    : true;\n\n  return (\n    <BaseBox\n      {...makeAccessible({\n        role: getActionListSectionRole(),\n        label: title,\n      })}\n      {...metaAttribute({ name: MetaConstants.ActionListSection, testID })}\n      {...makeAnalyticsAttribute(rest as Record<string, unknown>)}\n    >\n      {/* We're announcing title as group label so we can hide this */}\n      {isSectionVisible ? (\n        <StyledActionListSectionTitle {...makeAccessible({ hidden: true })}>\n          <Text color=\"surface.text.gray.muted\" size=\"small\" weight=\"semibold\">\n            {title}\n          </Text>\n        </StyledActionListSectionTitle>\n      ) : null}\n      <BaseBox\n        {...makeAccessible({\n          // On web, we just wrap it in another listbox to announce item count properly for particular group.\n          // On React Native, we ignore it since `menu` + `group` role will take care of accessibility\n          role: isReactNative() ? undefined : 'listbox',\n        })}\n      >\n        {children}\n      </BaseBox>\n      {showDividerInAutoComplete && showDividerInRN ? (\n        <Divider marginX=\"spacing.3\" marginY=\"spacing.1\" />\n      ) : null}\n    </BaseBox>\n  );\n};\n\nconst ActionListSection = assignWithoutSideEffects(_ActionListSection, {\n  componentId: componentIds.ActionListSection,\n});\n\nconst _ActionListItemIcon = ({ icon }: { icon: IconComponent }): React.ReactElement => {\n  const Icon = icon;\n  const { color, isDisabled } = useBaseMenuItem();\n  const iconState = isDisabled ? 'disabled' : 'muted';\n  return (\n    <Icon\n      color={\n        color === 'negative'\n          ? 'feedback.icon.negative.intense'\n          : `interactive.icon.gray.${iconState}`\n      }\n      size=\"medium\"\n    />\n  );\n};\n\nconst ActionListItemIcon = assignWithoutSideEffects(_ActionListItemIcon, {\n  componentId: componentIds.ActionListItemIcon,\n});\n\nconst _ActionListItemBadgeGroup = ({\n  children,\n}: {\n  children: React.ReactElement[] | React.ReactElement;\n}): React.ReactElement => {\n  return (\n    <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n      {children}\n    </Box>\n  );\n};\n\nconst ActionListItemBadgeGroup = assignWithoutSideEffects(_ActionListItemBadgeGroup, {\n  componentId: componentIds.ActionListItemBadgeGroup,\n});\n\nconst _ActionListItemAvatar = (avatarProps: Omit<AvatarProps, 'size' | ''>): React.ReactElement => {\n  return <Avatar size=\"xsmall\" {...avatarProps} />;\n};\n\nconst ActionListItemAvatar = assignWithoutSideEffects(_ActionListItemAvatar, {\n  componentId: componentIds.ActionListItemAvatar,\n});\n\nconst _ActionListItemBadge = (props: BadgeProps): React.ReactElement => {\n  return <Badge size=\"medium\" marginLeft=\"spacing.3\" {...props} />;\n};\n\nconst ActionListItemBadge = assignWithoutSideEffects(_ActionListItemBadge, {\n  componentId: componentIds.ActionListItemBadge,\n});\n\nconst _ActionListItemText = ({\n  children,\n}: {\n  children: StringChildrenType;\n}): React.ReactElement => {\n  const { isDisabled } = useBaseMenuItem();\n\n  return (\n    <Text variant=\"caption\" color={getNormalTextColor(isDisabled, { isMuted: true })}>\n      {children}\n    </Text>\n  );\n};\n\nconst ActionListItemText = assignWithoutSideEffects(_ActionListItemText, {\n  componentId: componentIds.ActionListItemText,\n});\n\ntype ClickHandlerType = (e: React.MouseEvent<HTMLButtonElement>) => void;\n\nconst makeActionListItemClickable = (\n  clickHandler: ClickHandlerType,\n): { onPress?: (e: React.TouchEvent<TouchableOpacity>) => void; onClick?: ClickHandlerType } => {\n  if (isReactNative()) {\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n    // @ts-ignore: ignoring ReactNative press type for the peace of mind\n    return { onPress: clickHandler };\n  }\n\n  return {\n    onClick: clickHandler,\n  };\n};\n\n/**\n * ### ActionListItem\n *\n * Creates option inside `ActionList`.\n *\n * #### Usage\n *\n * ```jsx\n * <ActionList>\n *  <ActionListItem\n *    title=\"Home\"\n *    value=\"home\"\n *    leading={<ActionListItemIcon icon={HomeIcon} />}\n *    trailing={<ActionListItemText>⌘ + S</ActionListItemText>}\n *  />\n * </ActionList>\n * ```\n */\nconst _ActionListItem = (props: ActionListItemProps): React.ReactElement => {\n  const {\n    activeIndex,\n    dropdownBaseId,\n    onOptionClick,\n    selectedIndices,\n    setShouldIgnoreBlurAnimation,\n    selectionType,\n    dropdownTriggerer,\n    isKeydownPressed,\n    filteredValues,\n    hasAutoCompleteInBottomSheetHeader,\n  } = useDropdown();\n\n  const hasAutoComplete =\n    hasAutoCompleteInBottomSheetHeader ||\n    dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n  const renderOnWebAs = props.href ? 'a' : 'button';\n\n  /**\n   * In SelectInput, returns the isSelected according to selected indexes in the state\n   *\n   * In Other Triggers (Menu Usecase), returns `props.isSelected` since passing the\n   * isSelected prop explicitly is the only way to select item in menu\n   */\n  const getIsSelected = (): boolean | undefined => {\n    if (dropdownTriggerer === dropdownComponentIds.triggers.SelectInput || hasAutoComplete) {\n      if (typeof props._index === 'number') {\n        return selectedIndices.includes(props._index);\n      }\n\n      return undefined;\n    }\n\n    return props.isSelected;\n  };\n\n  const isSelected = getIsSelected();\n\n  React.useEffect(() => {\n    validateActionListItemProps({\n      leading: props.leading,\n      trailing: props.trailing,\n      titleSuffix: props.titleSuffix,\n    });\n  }, [props.leading, props.trailing, props.titleSuffix]);\n\n  React.useEffect(() => {\n    if (__DEV__) {\n      if (\n        dropdownTriggerer === dropdownComponentIds.triggers.SelectInput &&\n        props.intent === 'negative'\n      ) {\n        throwBladeError({\n          message:\n            'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',\n          moduleName: 'ActionListItem',\n        });\n      }\n    }\n  }, [props.intent, dropdownTriggerer]);\n\n  return (\n    // We use this context to change the color of subcomponents like ActionListItemIcon, ActionListItemText, etc\n    <BaseMenuItem\n      isVisible={hasAutoComplete && filteredValues ? filteredValues.includes(props.value) : true}\n      as={!isReactNative() ? renderOnWebAs : undefined}\n      id={`${dropdownBaseId}-${props._index}`}\n      tabIndex={-1}\n      title={props.title}\n      description={props.description}\n      leading={\n        selectionType === 'multiple' ? (\n          <BaseBox\n            pointerEvents=\"none\"\n            // Adding aria-hidden because the listbox item in multiselect in itself explains the behaviour so announcing checkbox is unneccesary and just a nice UI tweak for us\n            {...makeAccessible({\n              hidden: true,\n            })}\n          >\n            <Checkbox isChecked={isSelected} tabIndex={-1} isDisabled={props.isDisabled}>\n              {/* \n      Checkbox requires children. Didn't want to make it optional because its helpful for consumers\n      But for this case in particular, we just want to use Text separately so that we can control spacing and color and keep it consistent with non-multiselect dropdowns\n    */}\n              {null}\n            </Checkbox>\n          </BaseBox>\n        ) : (\n          props.leading\n        )\n      }\n      trailing={props.trailing}\n      titleSuffix={props.titleSuffix}\n      href={props.href}\n      target={props.target}\n      className={activeIndex === props._index ? 'active-focus' : ''}\n      isSelected={isSelected}\n      isDisabled={props.isDisabled}\n      role={getActionListItemRole(dropdownTriggerer, props.href)}\n      {...makeActionListItemClickable((e: React.MouseEvent<HTMLButtonElement>): void => {\n        if (typeof props._index === 'number') {\n          onOptionClick(e, props._index);\n          props.onClick?.({ name: props.value, value: isSelected, event: castWebType(e) });\n        }\n      })}\n      {...makeAnalyticsAttribute({ ...props })}\n      {...metaAttribute({ name: MetaConstants.ActionListItem, testID: props.testID })}\n      onMouseDown={() => {\n        // We want to keep focus on Dropdown's trigger while option is being clicked\n        // So We set this flag that ignores the blur animation to avoid the flicker between focus out + focus in\n        setShouldIgnoreBlurAnimation(true);\n      }}\n      onMouseUp={() => {\n        // (Contd from above comment...) We set this flag back to false since blur of SelectInput is done calling by this time\n        setShouldIgnoreBlurAnimation(false);\n      }}\n      data-value={props.value}\n      data-index={props._index}\n      selectionType={selectionType}\n      color={props.intent}\n      isKeydownPressed={isKeydownPressed}\n    />\n  );\n};\n\nconst ActionListItem = assignWithoutSideEffects(React.memo(_ActionListItem), {\n  componentId: componentIds.ActionListItem,\n  displayName: componentIds.ActionListItem,\n});\n\nexport type { ActionListItemProps, ActionListSectionProps };\nexport {\n  ActionListItem,\n  ActionListItemIcon,\n  ActionListItemText,\n  ActionListItemAvatar,\n  ActionListItemBadge,\n  ActionListItemBadgeGroup,\n  ActionListSection,\n};\n"],"names":["StyledActionListSectionTitle","styled","BaseBox","props","padding","makeSize","theme","spacing","_ActionListSection","_ref","title","children","testID","_hideDivider","_sectionChildValues","rest","_objectWithoutProperties","_excluded","_useDropdown","useDropdown","hasAutoCompleteInBottomSheetHeader","dropdownTriggerer","filteredValues","hasAutoComplete","dropdownComponentIds","triggers","AutoComplete","isSectionVisible","React","useMemo","visibleActionListItemInSection","find","actionItemValue","includes","Boolean","showDividerInRN","isReactNative","showDividerInAutoComplete","length","_jsxs","Object","assign","makeAccessible","role","getActionListSectionRole","label","metaAttribute","name","MetaConstants","ActionListSection","makeAnalyticsAttribute","_jsx","hidden","Text","color","size","weight","undefined","Divider","marginX","marginY","assignWithoutSideEffects","componentId","componentIds","_ActionListItemIcon","_ref2","icon","Icon","_useBaseMenuItem","useBaseMenuItem","isDisabled","iconState","ActionListItemIcon","_ActionListItemBadgeGroup","_ref3","Box","display","alignItems","flexDirection","ActionListItemBadgeGroup","_ActionListItemAvatar","avatarProps","Avatar","ActionListItemAvatar","_ActionListItemBadge","Badge","marginLeft","ActionListItemBadge","_ActionListItemText","_ref4","_useBaseMenuItem2","variant","getNormalTextColor","isMuted","ActionListItemText","makeActionListItemClickable","clickHandler","onPress","onClick","_ActionListItem","_useDropdown2","activeIndex","dropdownBaseId","onOptionClick","selectedIndices","setShouldIgnoreBlurAnimation","selectionType","isKeydownPressed","renderOnWebAs","href","getIsSelected","SelectInput","_index","isSelected","useEffect","validateActionListItemProps","leading","trailing","titleSuffix","__DEV__","intent","throwBladeError","message","moduleName","BaseMenuItem","isVisible","value","as","id","tabIndex","description","pointerEvents","Checkbox","isChecked","target","className","getActionListItemRole","e","event","castWebType","ActionListItem","onMouseDown","onMouseUp","memo","displayName"],"mappings":"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"}
+{"version":3,"file":"ActionListItem.js","sources":["../../../../../src/components/ActionList/ActionListItem.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport styled from 'styled-components';\nimport type { TouchableOpacity } from 'react-native';\nimport { componentIds } from './componentIds';\nimport { validateActionListItemProps, getNormalTextColor } from './actionListUtils';\nimport { getActionListItemRole, getActionListSectionRole } from './getA11yRoles';\nimport { Divider } from '~components/Divider';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { IconComponent } from '~components/Icons';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport type { FeedbackColors } from '~tokens/theme/theme';\nimport { Text } from '~components/Typography';\nimport type { Platform } from '~utils';\nimport { castWebType, isReactNative } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport type { DataAnalyticsAttribute, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\nimport type { BadgeProps } from '~components/Badge';\nimport { Badge } from '~components/Badge';\nimport { Box } from '~components/Box';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { BaseMenuItem, useBaseMenuItem } from '~components/BaseMenu';\nimport { Checkbox } from '~components/Checkbox';\nimport type { AvatarProps } from '~components/Avatar/types';\nimport { Avatar } from '~components/Avatar';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype ActionListItemProps = {\n  title: string;\n  description?: string;\n  onClick?: (clickProps: {\n    name: string;\n    value?: boolean;\n    event: Platform.Select<{\n      web: React.MouseEvent;\n      native: React.TouchEvent<TouchableOpacity>;\n    }>;\n  }) => void;\n  /**\n   * value that you get from `onChange` event on SelectInput or in form submissions.\n   */\n  value: string;\n  /**\n   * Link to open when item is clicked.\n   */\n  href?: string;\n  /**\n   * HTML target of the link\n   */\n  target?: string;\n  /**\n   * Item that goes on left-side of item.\n   *\n   * Valid elements - `<ActionListItemIcon />`, `<ActionListItemAsset />`\n   *\n   * Will be overriden in multiselect\n   */\n  leading?: React.ReactNode;\n  /**\n   * Item that goes on right-side of item.\n   *\n   * Valid elements - `<ActionListItemText />`, `<ActionListItemIcon />`\n   */\n  trailing?: React.ReactNode;\n  /**\n   * Item that goes immediately next to the title.\n   *\n   * Valid elements - `<ActionListItemBadge />`, `<ActionListItemBadgeGroup />`\n   *\n   */\n  titleSuffix?: React.ReactElement;\n  isDisabled?: boolean;\n  intent?: Extract<FeedbackColors, 'negative'>;\n  /**\n   * Can be used in combination of `onClick` to highlight item as selected in Button Triggers.\n   *\n   * When trigger is SelectInput, Use `value` prop on SelectInput instead to make dropdown controlled.\n   */\n  isSelected?: boolean;\n  /**\n   * Internally passed from ActionList. No need to pass it explicitly\n   *\n   * @private\n   */\n  _index?: number;\n} & TestID &\n  DataAnalyticsAttribute;\n\nconst StyledActionListSectionTitle = styled(BaseBox)((props) => ({\n  // @TODO: replace this styled-component with new layout box when we have padding shorthand\n  padding: makeSize(props.theme.spacing[3]),\n}));\n\ntype ActionListSectionProps = {\n  title: string;\n  children: React.ReactNode[] | React.ReactNode;\n  /**\n   * Internally used to hide the divider on final item in React Native.\n   *\n   * Should not be used by consumers (also won't work on web)\n   *\n   * @private\n   */\n  _hideDivider?: boolean;\n  /**\n   * Internally used to hide / show section in AutoComplete\n   *\n   * @private\n   */\n  _sectionChildValues?: string[];\n} & TestID &\n  DataAnalyticsAttribute;\nconst _ActionListSection = ({\n  title,\n  children,\n  testID,\n  _hideDivider,\n  _sectionChildValues,\n  ...rest\n}: ActionListSectionProps): React.ReactElement => {\n  const { hasAutoCompleteInBottomSheetHeader, dropdownTriggerer, filteredValues } = useDropdown();\n  const hasAutoComplete =\n    hasAutoCompleteInBottomSheetHeader ||\n    dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n  const isSectionVisible = React.useMemo(() => {\n    if (hasAutoComplete) {\n      const visibleActionListItemInSection = _sectionChildValues?.find((actionItemValue) =>\n        filteredValues.includes(actionItemValue),\n      );\n\n      return Boolean(visibleActionListItemInSection);\n    }\n\n    return true;\n  }, [_sectionChildValues, hasAutoComplete, filteredValues]);\n\n  const showDividerInRN = !(_hideDivider && isReactNative());\n  const showDividerInAutoComplete = hasAutoComplete\n    ? isSectionVisible && filteredValues.length > 1\n    : true;\n\n  return (\n    <BaseBox\n      {...makeAccessible({\n        role: getActionListSectionRole(),\n        label: title,\n      })}\n      {...metaAttribute({ name: MetaConstants.ActionListSection, testID })}\n      {...makeAnalyticsAttribute(rest as Record<string, unknown>)}\n    >\n      {/* We're announcing title as group label so we can hide this */}\n      {isSectionVisible ? (\n        <StyledActionListSectionTitle {...makeAccessible({ hidden: true })}>\n          <Text color=\"surface.text.gray.muted\" size=\"small\" weight=\"semibold\">\n            {title}\n          </Text>\n        </StyledActionListSectionTitle>\n      ) : null}\n      <BaseBox\n        {...makeAccessible({\n          // On web, we just wrap it in another listbox to announce item count properly for particular group.\n          // On React Native, we ignore it since `menu` + `group` role will take care of accessibility\n          role: isReactNative() ? undefined : 'listbox',\n        })}\n      >\n        {children}\n      </BaseBox>\n      {showDividerInAutoComplete && showDividerInRN ? (\n        <Divider marginX=\"spacing.3\" marginY=\"spacing.1\" />\n      ) : null}\n    </BaseBox>\n  );\n};\n\nconst ActionListSection = assignWithoutSideEffects(_ActionListSection, {\n  componentId: componentIds.ActionListSection,\n});\n\nconst _ActionListItemIcon = ({ icon }: { icon: IconComponent }): React.ReactElement => {\n  const Icon = icon;\n  const { color, isDisabled } = useBaseMenuItem();\n  const iconState = isDisabled ? 'disabled' : 'muted';\n  return (\n    <Icon\n      color={\n        color === 'negative'\n          ? 'feedback.icon.negative.intense'\n          : `interactive.icon.gray.${iconState}`\n      }\n      size=\"medium\"\n    />\n  );\n};\n\nconst ActionListItemIcon = assignWithoutSideEffects(_ActionListItemIcon, {\n  componentId: componentIds.ActionListItemIcon,\n});\n\nconst _ActionListItemBadgeGroup = ({\n  children,\n}: {\n  children: React.ReactElement[] | React.ReactElement;\n}): React.ReactElement => {\n  return (\n    <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n      {children}\n    </Box>\n  );\n};\n\nconst ActionListItemBadgeGroup = assignWithoutSideEffects(_ActionListItemBadgeGroup, {\n  componentId: componentIds.ActionListItemBadgeGroup,\n});\n\nconst _ActionListItemAvatar = (avatarProps: Omit<AvatarProps, 'size' | ''>): React.ReactElement => {\n  return <Avatar size=\"xsmall\" {...avatarProps} />;\n};\n\nconst ActionListItemAvatar = assignWithoutSideEffects(_ActionListItemAvatar, {\n  componentId: componentIds.ActionListItemAvatar,\n});\n\nconst _ActionListItemBadge = (props: BadgeProps): React.ReactElement => {\n  return <Badge size=\"medium\" marginLeft=\"spacing.3\" {...props} />;\n};\n\nconst ActionListItemBadge = assignWithoutSideEffects(_ActionListItemBadge, {\n  componentId: componentIds.ActionListItemBadge,\n});\n\nconst _ActionListItemText = ({\n  children,\n}: {\n  children: StringChildrenType;\n}): React.ReactElement => {\n  const { isDisabled } = useBaseMenuItem();\n\n  return (\n    <Text variant=\"caption\" color={getNormalTextColor(isDisabled, { isMuted: true })}>\n      {children}\n    </Text>\n  );\n};\n\nconst ActionListItemText = assignWithoutSideEffects(_ActionListItemText, {\n  componentId: componentIds.ActionListItemText,\n});\n\ntype ClickHandlerType = (e: React.MouseEvent<HTMLButtonElement>) => void;\n\nconst makeActionListItemClickable = (\n  clickHandler: ClickHandlerType,\n): { onPress?: (e: React.TouchEvent<TouchableOpacity>) => void; onClick?: ClickHandlerType } => {\n  if (isReactNative()) {\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n    // @ts-ignore: ignoring ReactNative press type for the peace of mind\n    return { onPress: clickHandler };\n  }\n\n  return {\n    onClick: clickHandler,\n  };\n};\n\n/**\n * ### ActionListItem\n *\n * Creates option inside `ActionList`.\n *\n * #### Usage\n *\n * ```jsx\n * <ActionList>\n *  <ActionListItem\n *    title=\"Home\"\n *    value=\"home\"\n *    leading={<ActionListItemIcon icon={HomeIcon} />}\n *    trailing={<ActionListItemText>⌘ + S</ActionListItemText>}\n *  />\n * </ActionList>\n * ```\n */\nconst _ActionListItem = (props: ActionListItemProps): React.ReactElement => {\n  const {\n    activeIndex,\n    dropdownBaseId,\n    onOptionClick,\n    selectedIndices,\n    setShouldIgnoreBlurAnimation,\n    selectionType,\n    dropdownTriggerer,\n    isKeydownPressed,\n    filteredValues,\n    hasAutoCompleteInBottomSheetHeader,\n  } = useDropdown();\n\n  const hasAutoComplete =\n    hasAutoCompleteInBottomSheetHeader ||\n    dropdownTriggerer === dropdownComponentIds.triggers.AutoComplete;\n\n  const renderOnWebAs = props.href ? 'a' : 'button';\n\n  /**\n   * In SelectInput, returns the isSelected according to selected indexes in the state\n   *\n   * In Other Triggers (Menu Usecase), returns `props.isSelected` since passing the\n   * isSelected prop explicitly is the only way to select item in menu\n   */\n  const getIsSelected = (): boolean | undefined => {\n    if (dropdownTriggerer === dropdownComponentIds.triggers.SelectInput || hasAutoComplete) {\n      if (typeof props._index === 'number') {\n        return selectedIndices.includes(props._index);\n      }\n\n      return undefined;\n    }\n\n    return props.isSelected;\n  };\n\n  const isSelected = getIsSelected();\n\n  React.useEffect(() => {\n    validateActionListItemProps({\n      leading: props.leading,\n      trailing: props.trailing,\n      titleSuffix: props.titleSuffix,\n    });\n  }, [props.leading, props.trailing, props.titleSuffix]);\n\n  React.useEffect(() => {\n    if (__DEV__) {\n      if (\n        dropdownTriggerer === dropdownComponentIds.triggers.SelectInput &&\n        props.intent === 'negative'\n      ) {\n        throwBladeError({\n          message:\n            'negative intent ActionListItem cannot be used inside Dropdown with SelectInput trigger',\n          moduleName: 'ActionListItem',\n        });\n      }\n    }\n  }, [props.intent, dropdownTriggerer]);\n\n  return (\n    // We use this context to change the color of subcomponents like ActionListItemIcon, ActionListItemText, etc\n    <BaseMenuItem\n      isVisible={hasAutoComplete && filteredValues ? filteredValues.includes(props.value) : true}\n      as={!isReactNative() ? renderOnWebAs : undefined}\n      id={`${dropdownBaseId}-${props._index}`}\n      tabIndex={-1}\n      title={props.title}\n      description={props.description}\n      leading={\n        selectionType === 'multiple' ? (\n          <BaseBox\n            pointerEvents=\"none\"\n            // Adding aria-hidden because the listbox item in multiselect in itself explains the behaviour so announcing checkbox is unneccesary and just a nice UI tweak for us\n            {...makeAccessible({\n              hidden: true,\n            })}\n          >\n            <Checkbox isChecked={isSelected} tabIndex={-1} isDisabled={props.isDisabled}>\n              {/* \n      Checkbox requires children. Didn't want to make it optional because its helpful for consumers\n      But for this case in particular, we just want to use Text separately so that we can control spacing and color and keep it consistent with non-multiselect dropdowns\n    */}\n              {null}\n            </Checkbox>\n          </BaseBox>\n        ) : (\n          props.leading\n        )\n      }\n      trailing={props.trailing}\n      titleSuffix={props.titleSuffix}\n      href={props.href}\n      target={props.target}\n      className={activeIndex === props._index ? 'active-focus' : ''}\n      isSelected={isSelected}\n      isDisabled={props.isDisabled}\n      role={getActionListItemRole(dropdownTriggerer, props.href)}\n      {...makeActionListItemClickable((e: React.MouseEvent<HTMLButtonElement>): void => {\n        if (typeof props._index === 'number') {\n          onOptionClick(e, props._index);\n          props.onClick?.({ name: props.value, value: isSelected, event: castWebType(e) });\n        }\n      })}\n      {...makeAnalyticsAttribute({ ...props })}\n      {...metaAttribute({ name: MetaConstants.ActionListItem, testID: props.testID })}\n      onMouseDown={() => {\n        // We want to keep focus on Dropdown's trigger while option is being clicked\n        // So We set this flag that ignores the blur animation to avoid the flicker between focus out + focus in\n        setShouldIgnoreBlurAnimation(true);\n      }}\n      onMouseUp={() => {\n        // (Contd from above comment...) We set this flag back to false since blur of SelectInput is done calling by this time\n        setShouldIgnoreBlurAnimation(false);\n      }}\n      data-value={props.value}\n      data-index={props._index}\n      selectionType={selectionType}\n      color={props.intent}\n      isKeydownPressed={isKeydownPressed}\n    />\n  );\n};\n\nconst ActionListItem = assignWithoutSideEffects(React.memo(_ActionListItem), {\n  componentId: componentIds.ActionListItem,\n  displayName: componentIds.ActionListItem,\n});\n\nexport type { ActionListItemProps, ActionListSectionProps };\nexport {\n  ActionListItem,\n  ActionListItemIcon,\n  ActionListItemText,\n  ActionListItemAvatar,\n  ActionListItemBadge,\n  ActionListItemBadgeGroup,\n  ActionListSection,\n};\n"],"names":["StyledActionListSectionTitle","styled","BaseBox","props","padding","makeSize","theme","spacing","_ActionListSection","_ref","title","children","testID","_hideDivider","_sectionChildValues","rest","_objectWithoutProperties","_excluded","_useDropdown","useDropdown","hasAutoCompleteInBottomSheetHeader","dropdownTriggerer","filteredValues","hasAutoComplete","dropdownComponentIds","triggers","AutoComplete","isSectionVisible","React","useMemo","visibleActionListItemInSection","find","actionItemValue","includes","Boolean","showDividerInRN","isReactNative","showDividerInAutoComplete","length","_jsxs","Object","assign","makeAccessible","role","getActionListSectionRole","label","metaAttribute","name","MetaConstants","ActionListSection","makeAnalyticsAttribute","_jsx","hidden","Text","color","size","weight","undefined","Divider","marginX","marginY","assignWithoutSideEffects","componentId","componentIds","_ActionListItemIcon","_ref2","icon","Icon","_useBaseMenuItem","useBaseMenuItem","isDisabled","iconState","ActionListItemIcon","_ActionListItemBadgeGroup","_ref3","Box","display","alignItems","flexDirection","ActionListItemBadgeGroup","_ActionListItemAvatar","avatarProps","Avatar","ActionListItemAvatar","_ActionListItemBadge","Badge","marginLeft","ActionListItemBadge","_ActionListItemText","_ref4","_useBaseMenuItem2","variant","getNormalTextColor","isMuted","ActionListItemText","makeActionListItemClickable","clickHandler","onPress","onClick","_ActionListItem","_useDropdown2","activeIndex","dropdownBaseId","onOptionClick","selectedIndices","setShouldIgnoreBlurAnimation","selectionType","isKeydownPressed","renderOnWebAs","href","getIsSelected","SelectInput","_index","isSelected","useEffect","validateActionListItemProps","leading","trailing","titleSuffix","__DEV__","intent","throwBladeError","message","moduleName","BaseMenuItem","isVisible","value","as","id","tabIndex","description","pointerEvents","Checkbox","isChecked","target","className","getActionListItemRole","e","event","castWebType","ActionListItem","onMouseDown","onMouseUp","memo","displayName"],"mappings":"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"}

package/build/lib/native/components/AnimateInteractions/AnimateInteractions.native.js

@@ -0,0 +1,11 @@
+import '../Typography/Heading/Heading.js';
+import { Text } from '../Typography/Text/Text.js';
+import '../Typography/Code/Code.js';
+import '../Typography/Display/Display.js';
+import { throwBladeError } from '../../utils/logger/logger.js';
+import { jsx } from 'react/jsx-runtime';
+
+var AnimateInteractions=function AnimateInteractions(_props){throwBladeError({message:'AnimateInteractions is not yet implemented for native',moduleName:'AnimateInteractions'});return jsx(Text,{children:"AnimateInteractions Component is not available for Native mobile apps."});};
+
+export { AnimateInteractions };
+//# sourceMappingURL=AnimateInteractions.native.js.map

package/build/lib/native/components/AnimateInteractions/AnimateInteractions.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateInteractions.native.js","sources":["../../../../../src/components/AnimateInteractions/AnimateInteractions.native.tsx"],"sourcesContent":["import type { AnimateInteractionsProps } from './types';\nimport { Text } from '~components/Typography';\nimport { throwBladeError } from '~utils/logger';\n\nconst AnimateInteractions = (_props: AnimateInteractionsProps): React.ReactElement => {\n  throwBladeError({\n    message: 'AnimateInteractions is not yet implemented for native',\n    moduleName: 'AnimateInteractions',\n  });\n\n  return <Text>AnimateInteractions Component is not available for Native mobile apps.</Text>;\n};\n\nexport { AnimateInteractions };\n"],"names":["AnimateInteractions","_props","throwBladeError","message","moduleName","_jsx","Text","children"],"mappings":";;;;;;;AAIM,IAAAA,mBAAmB,CAAG,SAAtBA,mBAAmBA,CAAIC,MAAgC,CAAyB,CACpFC,eAAe,CAAC,CACdC,OAAO,CAAE,uDAAuD,CAChEC,UAAU,CAAE,qBACd,CAAC,CAAC,CAEF,OAAOC,GAAA,CAACC,IAAI,CAAA,CAAAC,QAAA,CAAC,wEAAsE,CAAM,CAAC,CAC5F;;;;"}

package/build/lib/native/components/Stagger/Stagger.native.js

@@ -0,0 +1,11 @@
+import '../Typography/Heading/Heading.js';
+import { Text } from '../Typography/Text/Text.js';
+import '../Typography/Code/Code.js';
+import '../Typography/Display/Display.js';
+import { throwBladeError } from '../../utils/logger/logger.js';
+import { jsx } from 'react/jsx-runtime';
+
+var Stagger=function Stagger(_props){throwBladeError({message:'Stagger is not yet implemented for native',moduleName:'Stagger'});return jsx(Text,{children:"Stagger Component is not available for Native mobile apps."});};
+
+export { Stagger };
+//# sourceMappingURL=Stagger.native.js.map

package/build/lib/native/components/Stagger/Stagger.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stagger.native.js","sources":["../../../../../src/components/Stagger/Stagger.native.tsx"],"sourcesContent":["import type { StaggerProps } from './types';\nimport { Text } from '~components/Typography';\nimport { throwBladeError } from '~utils/logger';\n\nconst Stagger = (_props: StaggerProps): React.ReactElement => {\n  throwBladeError({\n    message: 'Stagger is not yet implemented for native',\n    moduleName: 'Stagger',\n  });\n\n  return <Text>Stagger Component is not available for Native mobile apps.</Text>;\n};\n\nexport { Stagger };\n"],"names":["Stagger","_props","throwBladeError","message","moduleName","_jsx","Text","children"],"mappings":";;;;;;;AAIM,IAAAA,OAAO,CAAG,SAAVA,OAAOA,CAAIC,MAAoB,CAAyB,CAC5DC,eAAe,CAAC,CACdC,OAAO,CAAE,2CAA2C,CACpDC,UAAU,CAAE,SACd,CAAC,CAAC,CAEF,OAAOC,GAAA,CAACC,IAAI,CAAA,CAAAC,QAAA,CAAC,4DAA0D,CAAM,CAAC,CAChF;;;;"}

package/build/lib/native/components/index.js

@@ -7,6 +7,7 @@ export { ActionListItem, ActionListItemAvatar, ActionListItemBadge, ActionListIt
 export { ActionListItemAsset } from './ActionList/ActionListItemAsset.native.js';
 export { Alert } from './Alert/Alert.js';
 export { Amount } from './Amount/Amount.js';
+export { AnimateInteractions } from './AnimateInteractions/AnimateInteractions.native.js';
 export { Avatar } from './Avatar/Avatar.native.js';
 export { AvatarGroup } from './Avatar/AvatarGroup.native.js';
 export { TrustedBadgeIcon } from './Avatar/TrustedBadgeIcon.native.js';
@@ -454,6 +455,7 @@ export { Spinner } from './Spinner/Spinner/Spinner.js';
 export { Tour } from './SpotlightPopoverTour/Tour.native.js';
 export { SpotlightPopoverTourFooter } from './SpotlightPopoverTour/TourFooter.native.js';
 export { SpotlightPopoverTourStep } from './SpotlightPopoverTour/TourStep.native.js';
+export { Stagger } from './Stagger/Stagger.native.js';
 export { StepGroup } from './StepGroup/StepGroup.native.js';
 export { StepItem } from './StepGroup/StepItem.native.js';
 export { StepItemIcon, StepItemIndicator } from './StepGroup/StepItemMarker.js';

package/build/lib/native/components/index.js.map

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

package/build/lib/native/utils/useCallbackRef.js

@@ -1,6 +1,7 @@
-import { useRef, useInsertionEffect, useCallback } from 'react';
+import React__default, { useRef, useCallback } from 'react';
+import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.js';
 
-function useCallbackRef(callback){var deps=arguments.length>1&&arguments[1]!==undefined?arguments[1]:[];var callbackRef=useRef(function(){throw new Error('Cannot call an event handler while rendering.');});useInsertionEffect(function(){callbackRef.current=callback;});return useCallback(function(){for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return callbackRef.current==null?void 0:callbackRef.current.apply(callbackRef,args);},deps);}
+var useReactInsertionEffect=React__default[' useInsertionEffect '.trim().toString()];var useInsertionEffectFallback=useReactInsertionEffect||useIsomorphicLayoutEffect;function useCallbackRef(callback){var deps=arguments.length>1&&arguments[1]!==undefined?arguments[1]:[];var callbackRef=useRef(callback);useInsertionEffectFallback(function(){callbackRef.current=callback;});return useCallback(function(){for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return callbackRef.current==null?void 0:callbackRef.current.apply(callbackRef,args);},deps);}
 
 export { useCallbackRef };
 //# sourceMappingURL=useCallbackRef.js.map

package/build/lib/native/utils/useCallbackRef.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCallbackRef.js","sources":["../../../../src/utils/useCallbackRef.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport { useCallback, useInsertionEffect, useRef } from 'react';\n\n/**\n * This hook is user-land implementation of the experimental `useEffectEvent` hook.\n * React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event\n *\n * This hook is useful when you want to use a callback function inside a useEffect while keeping it \"fresh\" but you don't want to add it to the dependency array.\n */\nfunction useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: React.DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(() => {\n    throw new Error('Cannot call an event handler while rendering.');\n  });\n\n  useInsertionEffect(() => {\n    callbackRef.current = callback;\n  });\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps);\n}\n\nexport { useCallbackRef };\n"],"names":["useCallbackRef","callback","deps","arguments","length","undefined","callbackRef","useRef","Error","useInsertionEffect","current","useCallback","_len","args","Array","_key","apply"],"mappings":";;AASA,SAASA,cAAcA,CACrBC,QAAiD,CAEjD,CADA,IAAAC,IAA0B,CAAAC,SAAA,CAAAC,MAAA,CAAA,CAAA,EAAAD,SAAA,CAAA,CAAA,CAAA,GAAAE,SAAA,CAAAF,SAAA,CAAA,CAAA,CAAA,CAAG,EAAE,CAE/B,IAAMG,WAAW,CAAGC,MAAM,CAAkB,UAAM,CAChD,MAAU,IAAAC,KAAK,CAAC,+CAA+C,CAAC,CAClE,CAAC,CAAC,CAEFC,kBAAkB,CAAC,UAAM,CACvBH,WAAW,CAACI,OAAO,CAAGT,QAAQ,CAChC,CAAC,CAAC,CAGF,OAAOU,WAAW,CAAC,UAAA,CAAA,IAAA,IAAAC,IAAA,CAAAT,SAAA,CAAAC,MAAA,CAAIS,IAAI,CAAAC,IAAAA,KAAA,CAAAF,IAAA,CAAAG,CAAAA,IAAA,CAAAA,CAAAA,CAAAA,IAAA,CAAAH,IAAA,CAAAG,IAAA,EAAJF,CAAAA,CAAAA,IAAI,CAAAE,IAAA,CAAA,CAAAZ,SAAA,CAAAY,IAAA,CAAA,CAAA,CAAA,OAAWT,WAAW,CAACI,OAAO,EAAnBJ,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,WAAW,CAACI,OAAO,CAAAM,KAAA,CAAnBV,WAAW,CAAcO,IAAI,CAAC,CAAEX,CAAAA,CAAAA,IAAI,CAAC,CAC7E;;;;"}
+{"version":3,"file":"useCallbackRef.js","sources":["../../../../src/utils/useCallbackRef.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { useCallback, useRef } from 'react';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\n// Prevent webpack from importing this:\n// https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985\n// https://github.com/radix-ui/primitives/issues/2796\nconst useReactInsertionEffect = (React as any)[' useInsertionEffect '.trim().toString()];\nconst useInsertionEffectFallback = useReactInsertionEffect || useIsomorphicLayoutEffect;\n\n/**\n * This hook is user-land implementation of the experimental `useEffectEvent` hook.\n * React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event\n *\n * This hook is useful when you want to use a callback function inside a useEffect while keeping it \"fresh\" but you don't want to add it to the dependency array.\n */\nfunction useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: React.DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(callback);\n\n  useInsertionEffectFallback(() => {\n    callbackRef.current = callback;\n  });\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps);\n}\n\nexport { useCallbackRef };\n"],"names":["useReactInsertionEffect","React","trim","toString","useInsertionEffectFallback","useIsomorphicLayoutEffect","useCallbackRef","callback","deps","arguments","length","undefined","callbackRef","useRef","current","useCallback","_len","args","Array","_key","apply"],"mappings":";;;AAQA,IAAMA,uBAAuB,CAAIC,cAAK,CAAS,sBAAsB,CAACC,IAAI,EAAE,CAACC,QAAQ,EAAE,CAAC,CACxF,IAAMC,0BAA0B,CAAGJ,uBAAuB,EAAIK,yBAAyB,CAQvF,SAASC,cAAcA,CACrBC,QAAiD,CAEjD,CAAA,IADAC,IAA0B,CAAAC,SAAA,CAAAC,MAAA,CAAA,CAAA,EAAAD,SAAA,CAAA,CAAA,CAAA,GAAAE,SAAA,CAAAF,SAAA,CAAG,CAAA,CAAA,CAAA,EAAE,CAE/B,IAAMG,WAAW,CAAGC,MAAM,CAAkBN,QAAQ,CAAC,CAErDH,0BAA0B,CAAC,UAAM,CAC/BQ,WAAW,CAACE,OAAO,CAAGP,QAAQ,CAChC,CAAC,CAAC,CAGF,OAAOQ,WAAW,CAAC,UAAA,CAAA,IAAA,IAAAC,IAAA,CAAAP,SAAA,CAAAC,MAAA,CAAIO,IAAI,CAAAC,IAAAA,KAAA,CAAAF,IAAA,CAAAG,CAAAA,IAAA,GAAAA,IAAA,CAAAH,IAAA,CAAAG,IAAA,EAAA,CAAA,CAAJF,IAAI,CAAAE,IAAA,CAAA,CAAAV,SAAA,CAAAU,IAAA,CAAA,CAAA,CAAA,OAAWP,WAAW,CAACE,OAAO,EAAA,IAAA,CAAA,KAAA,CAAA,CAAnBF,WAAW,CAACE,OAAO,CAAAM,KAAA,CAAnBR,WAAW,CAAcK,IAAI,CAAC,CAAA,CAAA,CAAET,IAAI,CAAC,CAC7E;;;;"}

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

@@ -0,0 +1,37 @@
+import React__default from 'react';
+import { useAnimation } from 'framer-motion';
+import { AnimateInteractionsContext } from './AnimateInteractionsProvider.js';
+import { useFocusWithin } from './useFocusWithin.js';
+import '../BaseMotion/index.js';
+import { jsx } from 'react/jsx-runtime';
+import { BaseMotionEnhancerBox } from '../BaseMotion/BaseMotion.js';
+
+var AnimateInteractions = function AnimateInteractions(_ref) {
+  var children = _ref.children,
+    _ref$motionTriggers = _ref.motionTriggers,
+    motionTriggers = _ref$motionTriggers === void 0 ? ['hover'] : _ref$motionTriggers;
+  var baseMotionRef = React__default.useRef(null);
+  var controls = useAnimation();
+  useFocusWithin(baseMotionRef, {
+    onFocusWithin: function onFocusWithin() {
+      void controls.start('animate');
+    },
+    onBlurWithin: function onBlurWithin() {
+      void controls.start('exit');
+    }
+  });
+  return /*#__PURE__*/jsx(AnimateInteractionsContext.Provider, {
+    value: {
+      isInsideAnimateInteractionsContainer: true
+    },
+    children: /*#__PURE__*/jsx(BaseMotionEnhancerBox, {
+      ref: baseMotionRef,
+      motionTriggers: motionTriggers,
+      animate: controls,
+      children: children
+    })
+  });
+};
+
+export { AnimateInteractions };
+//# sourceMappingURL=AnimateInteractions.web.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateInteractions.web.js","sources":["../../../../../../src/components/AnimateInteractions/AnimateInteractions.web.tsx"],"sourcesContent":["import React from 'react';\nimport { useAnimation } from 'framer-motion';\nimport { AnimateInteractionsContext } from './AnimateInteractionsProvider';\nimport { useFocusWithin } from './useFocusWithin';\nimport type { AnimateInteractionsProps } from './types';\nimport { BaseMotionEnhancerBox } from '~components/BaseMotion';\n\n/**\n * ## AnimateInteractions\n *\n * AnimateInteractions is the utility preset that we offer to help you animate children when the parent is interacted.\n *\n * This is in a way equivalent to following CSS-\n * ```css\n * .parent:hover .child { }\n * ```\n *\n * ### Usage\n *\n * ```jsx\n * <AnimateInteractions\n *    motionTriggers={['hover']}\n *  > // <-- When this is hovered\n *  <Box>\n *    <Move\n *      motionTriggers={['on-animate-interactions']}\n *    > // <-- this animates in\n *      <Box />\n *    </Move>\n *  </Box>\n * </AnimateInteractions>\n * ```\n */\nconst AnimateInteractions = ({\n  children,\n  motionTriggers = ['hover'],\n}: AnimateInteractionsProps): React.ReactElement => {\n  const baseMotionRef = React.useRef<HTMLDivElement | null>(null);\n  const controls = useAnimation();\n\n  useFocusWithin(baseMotionRef, {\n    onFocusWithin: () => {\n      void controls.start('animate');\n    },\n    onBlurWithin: () => {\n      void controls.start('exit');\n    },\n  });\n\n  return (\n    <AnimateInteractionsContext.Provider value={{ isInsideAnimateInteractionsContainer: true }}>\n      <BaseMotionEnhancerBox ref={baseMotionRef} motionTriggers={motionTriggers} animate={controls}>\n        {children}\n      </BaseMotionEnhancerBox>\n    </AnimateInteractionsContext.Provider>\n  );\n};\n\nexport { AnimateInteractions };\n"],"names":["AnimateInteractions","_ref","children","_ref$motionTriggers","motionTriggers","baseMotionRef","React","useRef","controls","useAnimation","useFocusWithin","onFocusWithin","start","onBlurWithin","_jsx","AnimateInteractionsContext","Provider","value","isInsideAnimateInteractionsContainer","BaseMotionEnhancerBox","ref","animate"],"mappings":";;;;;;;;AAiCA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAG2B;AAAA,EAAA,IAFlDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,mBAAA,GAAAF,IAAA,CACRG,cAAc;AAAdA,IAAAA,cAAc,GAAAD,mBAAA,KAAA,KAAA,CAAA,GAAG,CAAC,OAAO,CAAC,GAAAA,mBAAA,CAAA;AAE1B,EAAA,IAAME,aAAa,GAAGC,cAAK,CAACC,MAAM,CAAwB,IAAI,CAAC,CAAA;AAC/D,EAAA,IAAMC,QAAQ,GAAGC,YAAY,EAAE,CAAA;EAE/BC,cAAc,CAACL,aAAa,EAAE;IAC5BM,aAAa,EAAE,SAAAA,aAAAA,GAAM;AACnB,MAAA,KAAKH,QAAQ,CAACI,KAAK,CAAC,SAAS,CAAC,CAAA;KAC/B;IACDC,YAAY,EAAE,SAAAA,YAAAA,GAAM;AAClB,MAAA,KAAKL,QAAQ,CAACI,KAAK,CAAC,MAAM,CAAC,CAAA;AAC7B,KAAA;AACF,GAAC,CAAC,CAAA;AAEF,EAAA,oBACEE,GAAA,CAACC,0BAA0B,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAE;AAAEC,MAAAA,oCAAoC,EAAE,IAAA;KAAO;IAAAhB,QAAA,eACzFY,GAAA,CAACK,qBAAqB,EAAA;AAACC,MAAAA,GAAG,EAAEf,aAAc;AAACD,MAAAA,cAAc,EAAEA,cAAe;AAACiB,MAAAA,OAAO,EAAEb,QAAS;AAAAN,MAAAA,QAAA,EAC1FA,QAAAA;KACoB,CAAA;AAAC,GACW,CAAC,CAAA;AAE1C;;;;"}

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

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

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

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

package/build/lib/web/development/components/AnimateInteractions/useFocusWithin.js

@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+
+var useFocusWithin = function useFocusWithin(ref, _ref) {
+  var onFocusWithin = _ref.onFocusWithin,
+    onBlurWithin = _ref.onBlurWithin;
+  useEffect(function () {
+    var element = ref.current;
+    if (!element) return;
+    var handleFocusIn = function handleFocusIn() {
+      onFocusWithin === null || onFocusWithin === void 0 ? void 0 : onFocusWithin();
+    };
+    var handleFocusOut = function handleFocusOut(event) {
+      // Ensure that focus is not still within the container
+      if (element && !element.contains(event.relatedTarget)) {
+        onBlurWithin === null || onBlurWithin === void 0 ? void 0 : onBlurWithin();
+      }
+    };
+    element.addEventListener('focusin', handleFocusIn);
+    element.addEventListener('focusout', handleFocusOut);
+
+    // eslint-disable-next-line consistent-return
+    return function () {
+      element.removeEventListener('focusin', handleFocusIn);
+      element.removeEventListener('focusout', handleFocusOut);
+    };
+  }, [ref, onFocusWithin, onBlurWithin]);
+};
+
+export { useFocusWithin };
+//# sourceMappingURL=useFocusWithin.js.map

package/build/lib/web/development/components/AnimateInteractions/useFocusWithin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusWithin.js","sources":["../../../../../../src/components/AnimateInteractions/useFocusWithin.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ntype FocusWithinHandlers = {\n  onFocusWithin?: () => void;\n  onBlurWithin?: () => void;\n};\n\nexport const useFocusWithin = <T extends HTMLElement>(\n  ref: React.RefObject<T>,\n  { onFocusWithin, onBlurWithin }: FocusWithinHandlers,\n): void => {\n  useEffect(() => {\n    const element = ref.current;\n    if (!element) return;\n\n    const handleFocusIn = (): void => {\n      onFocusWithin?.();\n    };\n\n    const handleFocusOut = (event: FocusEvent): void => {\n      // Ensure that focus is not still within the container\n      if (element && !element.contains(event.relatedTarget as Node)) {\n        onBlurWithin?.();\n      }\n    };\n\n    element.addEventListener('focusin', handleFocusIn);\n    element.addEventListener('focusout', handleFocusOut);\n\n    // eslint-disable-next-line consistent-return\n    return () => {\n      element.removeEventListener('focusin', handleFocusIn);\n      element.removeEventListener('focusout', handleFocusOut);\n    };\n  }, [ref, onFocusWithin, onBlurWithin]);\n};\n"],"names":["useFocusWithin","ref","_ref","onFocusWithin","onBlurWithin","useEffect","element","current","handleFocusIn","handleFocusOut","event","contains","relatedTarget","addEventListener","removeEventListener"],"mappings":";;AAOO,IAAMA,cAAc,GAAG,SAAjBA,cAAcA,CACzBC,GAAuB,EAAAC,IAAA,EAEd;AAAA,EAAA,IADPC,aAAa,GAAAD,IAAA,CAAbC,aAAa;IAAEC,YAAY,GAAAF,IAAA,CAAZE,YAAY,CAAA;AAE7BC,EAAAA,SAAS,CAAC,YAAM;AACd,IAAA,IAAMC,OAAO,GAAGL,GAAG,CAACM,OAAO,CAAA;IAC3B,IAAI,CAACD,OAAO,EAAE,OAAA;AAEd,IAAA,IAAME,aAAa,GAAG,SAAhBA,aAAaA,GAAe;AAChCL,MAAAA,aAAa,KAAbA,IAAAA,IAAAA,aAAa,KAAbA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,aAAa,EAAI,CAAA;KAClB,CAAA;AAED,IAAA,IAAMM,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,KAAiB,EAAW;AAClD;MACA,IAAIJ,OAAO,IAAI,CAACA,OAAO,CAACK,QAAQ,CAACD,KAAK,CAACE,aAAqB,CAAC,EAAE;AAC7DR,QAAAA,YAAY,KAAZA,IAAAA,IAAAA,YAAY,KAAZA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,YAAY,EAAI,CAAA;AAClB,OAAA;KACD,CAAA;AAEDE,IAAAA,OAAO,CAACO,gBAAgB,CAAC,SAAS,EAAEL,aAAa,CAAC,CAAA;AAClDF,IAAAA,OAAO,CAACO,gBAAgB,CAAC,UAAU,EAAEJ,cAAc,CAAC,CAAA;;AAEpD;AACA,IAAA,OAAO,YAAM;AACXH,MAAAA,OAAO,CAACQ,mBAAmB,CAAC,SAAS,EAAEN,aAAa,CAAC,CAAA;AACrDF,MAAAA,OAAO,CAACQ,mBAAmB,CAAC,UAAU,EAAEL,cAAc,CAAC,CAAA;KACxD,CAAA;GACF,EAAE,CAACR,GAAG,EAAEE,aAAa,EAAEC,YAAY,CAAC,CAAC,CAAA;AACxC;;;;"}

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

@@ -0,0 +1,73 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _typeof from '@babel/runtime/helpers/typeof';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React__default from 'react';
+import { AnimatePresence } from 'framer-motion';
+import { StaggerContext } from './StaggerProvider.js';
+import '../BaseMotion/index.js';
+import { msToSeconds } from '../../utils/msToSeconds.js';
+import '../../utils/index.js';
+import { jsx } from 'react/jsx-runtime';
+import useTheme from '../BladeProvider/useTheme.js';
+import { BaseMotionBox } from '../BaseMotion/BaseMotion.js';
+
+var _excluded = ["children", "isVisible", "type", "shouldUnmountWhenHidden", "delay", "motionTriggers"];
+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 Stagger = function Stagger(_ref) {
+  var children = _ref.children,
+    _ref$isVisible = _ref.isVisible,
+    isVisible = _ref$isVisible === void 0 ? true : _ref$isVisible,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'inout' : _ref$type,
+    _ref$shouldUnmountWhe = _ref.shouldUnmountWhenHidden,
+    shouldUnmountWhenHidden = _ref$shouldUnmountWhe === void 0 ? false : _ref$shouldUnmountWhe,
+    delay = _ref.delay,
+    motionTriggers = _ref.motionTriggers,
+    boxProps = _objectWithoutProperties(_ref, _excluded);
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  // Only need AnimatePresence when we have to unmount the component
+  var AnimateWrapper = shouldUnmountWhenHidden ? AnimatePresence : React__default.Fragment;
+  // keep it always mounted when shouldUnmountWhenHidden is false
+  var isMounted = shouldUnmountWhenHidden ? isVisible : true;
+  var enterDelay = _typeof(delay) === 'object' ? delay.enter : delay;
+  var exitDelay = _typeof(delay) === 'object' ? delay.exit : delay;
+  var staggerVariants = {
+    initial: {},
+    animate: {
+      transition: _objectSpread(_objectSpread({}, enterDelay ? {
+        delayChildren: msToSeconds(theme.motion.delay[enterDelay])
+      } : {}), {}, {
+        staggerChildren: msToSeconds(theme.motion.duration['2xquick'])
+      })
+    },
+    exit: {
+      transition: _objectSpread(_objectSpread({}, exitDelay ? {
+        delayChildren: msToSeconds(theme.motion.delay[exitDelay])
+      } : {}), {}, {
+        staggerChildren: msToSeconds(theme.motion.duration['2xquick'])
+      })
+    }
+  };
+  return /*#__PURE__*/jsx(AnimateWrapper, {
+    children: isMounted ? /*#__PURE__*/jsx(BaseMotionBox, _objectSpread(_objectSpread(_objectSpread({
+      type: type,
+      motionVariants: staggerVariants,
+      motionTriggers: motionTriggers
+    }, shouldUnmountWhenHidden ? {} : {
+      animateVisibility: isVisible ? 'animate' : 'exit'
+    }), boxProps), {}, {
+      children: /*#__PURE__*/jsx(StaggerContext.Provider, {
+        value: {
+          isInsideStaggerContainer: true,
+          staggerType: type
+        },
+        children: children
+      })
+    })) : null
+  });
+};
+
+export { Stagger };
+//# sourceMappingURL=Stagger.web.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Stagger.web.js","sources":["../../../../../../src/components/Stagger/Stagger.web.tsx"],"sourcesContent":["import React from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { StaggerContext } from './StaggerProvider';\nimport type { StaggerProps } from './types';\nimport { BaseMotionBox } from '~components/BaseMotion';\nimport type { MotionVariantsType } from '~components/BaseMotion';\nimport { msToSeconds } from '~utils/msToSeconds';\nimport { useTheme } from '~utils';\n\n/**\n * ## Stagger\n *\n * Stagger is a utility motion preset we expose from blade to help you implement stagger animations.\n *\n * You can use any of the base entry / exit presets like `Fade`, `Move`, `Slide` inside of it and the components will appear one after the other instead of all at once.\n *\n * **Note:** Unlike other motion presets, Stagger is not an enhancer components and renders a Box instead. You can use BoxProps on this component.\n *\n * ### Usage\n *\n * #### Move with Stagger\n *\n * ```jsx\n * <Stagger>\n *  <Move><Chip /></Move>\n *  <Move><Chip /></Move>\n *  <Move><Chip /></Move>\n * </Stagger>\n * ```\n *\n * #### Conditionally make the parent visible or invisible\n *\n * `isVisible` prop in this case should be on Stagger instead of children preset component\n *\n * ```jsx\n * <Stagger isVisible={isVisibleState}>\n *  <Move><Chip /></Move>\n *  <Move><Chip /></Move>\n *  <Move><Chip /></Move>\n * </Stagger>\n * ```\n *\n */\nconst Stagger = ({\n  children,\n  isVisible = true,\n  type = 'inout',\n  shouldUnmountWhenHidden = false,\n  delay,\n  motionTriggers,\n  ...boxProps\n}: StaggerProps): React.ReactElement => {\n  const { theme } = useTheme();\n  // Only need AnimatePresence when we have to unmount the component\n  const AnimateWrapper = shouldUnmountWhenHidden ? AnimatePresence : React.Fragment;\n  // keep it always mounted when shouldUnmountWhenHidden is false\n  const isMounted = shouldUnmountWhenHidden ? isVisible : true;\n\n  const enterDelay = typeof delay === 'object' ? delay.enter : delay;\n  const exitDelay = typeof delay === 'object' ? delay.exit : delay;\n\n  const staggerVariants: MotionVariantsType = {\n    initial: {},\n    animate: {\n      transition: {\n        ...(enterDelay ? { delayChildren: msToSeconds(theme.motion.delay[enterDelay]) } : {}),\n        staggerChildren: msToSeconds(theme.motion.duration['2xquick']),\n      },\n    },\n    exit: {\n      transition: {\n        ...(exitDelay ? { delayChildren: msToSeconds(theme.motion.delay[exitDelay]) } : {}),\n        staggerChildren: msToSeconds(theme.motion.duration['2xquick']),\n      },\n    },\n  };\n\n  return (\n    <AnimateWrapper>\n      {isMounted ? (\n        <BaseMotionBox\n          type={type}\n          motionVariants={staggerVariants}\n          motionTriggers={motionTriggers}\n          {...(shouldUnmountWhenHidden\n            ? {}\n            : { animateVisibility: isVisible ? 'animate' : 'exit' })}\n          {...boxProps}\n        >\n          <StaggerContext.Provider value={{ isInsideStaggerContainer: true, staggerType: type }}>\n            {children}\n          </StaggerContext.Provider>\n        </BaseMotionBox>\n      ) : null}\n    </AnimateWrapper>\n  );\n};\n\nexport { Stagger };\n"],"names":["Stagger","_ref","children","_ref$isVisible","isVisible","_ref$type","type","_ref$shouldUnmountWhe","shouldUnmountWhenHidden","delay","motionTriggers","boxProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","AnimateWrapper","AnimatePresence","React","Fragment","isMounted","enterDelay","_typeof","enter","exitDelay","exit","staggerVariants","initial","animate","transition","_objectSpread","delayChildren","msToSeconds","motion","staggerChildren","duration","_jsx","BaseMotionBox","motionVariants","animateVisibility","StaggerContext","Provider","value","isInsideStaggerContainer","staggerType"],"mappings":"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"}

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

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

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

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

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

@@ -2,6 +2,7 @@ import './Accordion/index.js';
 import './ActionList/index.js';
 import './Alert/index.js';
 import './Amount/index.js';
+import './AnimateInteractions/index.js';
 import './Avatar/index.js';
 import './Badge/index.js';
 import './BladeProvider/index.js';
@@ -49,6 +50,7 @@ import './Skeleton/index.js';
 import './SkipNav/index.web.js';
 import './Spinner/index.js';
 import './SpotlightPopoverTour/index.js';
+import './Stagger/index.js';
 import './StepGroup/index.js';
 import './Slide/index.js';
 import './Switch/index.js';
@@ -70,6 +72,7 @@ export { ActionListItem, ActionListItemAvatar, ActionListItemBadge, ActionListIt
 export { ActionListItemAsset } from './ActionList/ActionListItemAsset.web.js';
 export { Alert } from './Alert/Alert.js';
 export { Amount } from './Amount/Amount.js';
+export { AnimateInteractions } from './AnimateInteractions/AnimateInteractions.web.js';
 export { Avatar } from './Avatar/Avatar.web.js';
 export { AvatarGroup } from './Avatar/AvatarGroup.web.js';
 export { TrustedBadgeIcon } from './Avatar/TrustedBadgeIcon.web.js';
@@ -523,6 +526,7 @@ export { Spinner } from './Spinner/Spinner/Spinner.js';
 export { SpotlightPopoverTour } from './SpotlightPopoverTour/Tour.web.js';
 export { SpotlightPopoverTourFooter } from './SpotlightPopoverTour/TourFooter.web.js';
 export { SpotlightPopoverTourStep } from './SpotlightPopoverTour/TourStep.web.js';
+export { Stagger } from './Stagger/Stagger.web.js';
 export { StepGroup } from './StepGroup/StepGroup.web.js';
 export { StepItem } from './StepGroup/StepItem.web.js';
 export { StepItemIcon, StepItemIndicator } from './StepGroup/StepItemMarker.js';

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

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

package/build/lib/web/development/utils/useCallbackRef.js

@@ -1,7 +1,15 @@
-import { useRef, useInsertionEffect, useCallback } from 'react';
+import React__default, { useRef, useCallback } from 'react';
+import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.js';
 
+/* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable @typescript-eslint/explicit-function-return-type */
 
+// Prevent webpack from importing this:
+// https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985
+// https://github.com/radix-ui/primitives/issues/2796
+var useReactInsertionEffect = React__default[' useInsertionEffect '.trim().toString()];
+var useInsertionEffectFallback = useReactInsertionEffect || useIsomorphicLayoutEffect;
+
 /**
  * This hook is user-land implementation of the experimental `useEffectEvent` hook.
  * React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event
@@ -10,10 +18,8 @@ import { useRef, useInsertionEffect, useCallback } from 'react';
  */
 function useCallbackRef(callback) {
   var deps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  var callbackRef = useRef(function () {
-    throw new Error('Cannot call an event handler while rendering.');
-  });
-  useInsertionEffect(function () {
+  var callbackRef = useRef(callback);
+  useInsertionEffectFallback(function () {
     callbackRef.current = callback;
   });
 

package/build/lib/web/development/utils/useCallbackRef.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCallbackRef.js","sources":["../../../../../src/utils/useCallbackRef.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport { useCallback, useInsertionEffect, useRef } from 'react';\n\n/**\n * This hook is user-land implementation of the experimental `useEffectEvent` hook.\n * React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event\n *\n * This hook is useful when you want to use a callback function inside a useEffect while keeping it \"fresh\" but you don't want to add it to the dependency array.\n */\nfunction useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: React.DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(() => {\n    throw new Error('Cannot call an event handler while rendering.');\n  });\n\n  useInsertionEffect(() => {\n    callbackRef.current = callback;\n  });\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps);\n}\n\nexport { useCallbackRef };\n"],"names":["useCallbackRef","callback","deps","arguments","length","undefined","callbackRef","useRef","Error","useInsertionEffect","current","useCallback","_callbackRef$current","_len","args","Array","_key","call","apply","concat"],"mappings":";;AAAA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,cAAcA,CACrBC,QAAiD,EAEjD;AAAA,EAAA,IADAC,IAA0B,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,EAAE,CAAA;AAE/B,EAAA,IAAMG,WAAW,GAAGC,MAAM,CAAkB,YAAM;AAChD,IAAA,MAAM,IAAIC,KAAK,CAAC,+CAA+C,CAAC,CAAA;AAClE,GAAC,CAAC,CAAA;AAEFC,EAAAA,kBAAkB,CAAC,YAAM;IACvBH,WAAW,CAACI,OAAO,GAAGT,QAAQ,CAAA;AAChC,GAAC,CAAC,CAAA;;AAEF;AACA,EAAA,OAAOU,WAAW,CAAC,YAAA;AAAA,IAAA,IAAAC,oBAAA,CAAA;AAAA,IAAA,KAAA,IAAAC,IAAA,GAAAV,SAAA,CAAAC,MAAA,EAAIU,IAAI,GAAAC,IAAAA,KAAA,CAAAF,IAAA,GAAAG,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAH,IAAA,EAAAG,IAAA,EAAA,EAAA;AAAJF,MAAAA,IAAI,CAAAE,IAAA,CAAAb,GAAAA,SAAA,CAAAa,IAAA,CAAA,CAAA;AAAA,KAAA;IAAA,OAAAJ,CAAAA,oBAAA,GAAWN,WAAW,CAACI,OAAO,MAAAE,IAAAA,IAAAA,oBAAA,uBAAnBA,oBAAA,CAAAK,IAAA,CAAAC,KAAA,CAAAN,oBAAA,EAAA,CAAAN,WAAW,CAAAa,CAAAA,MAAA,CAAcL,IAAI,CAAC,CAAA,CAAA;AAAA,GAAA,EAAEZ,IAAI,CAAC,CAAA;AAC7E;;;;"}
+{"version":3,"file":"useCallbackRef.js","sources":["../../../../../src/utils/useCallbackRef.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { useCallback, useRef } from 'react';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\n// Prevent webpack from importing this:\n// https://github.com/webpack/webpack/issues/14814#issuecomment-1536757985\n// https://github.com/radix-ui/primitives/issues/2796\nconst useReactInsertionEffect = (React as any)[' useInsertionEffect '.trim().toString()];\nconst useInsertionEffectFallback = useReactInsertionEffect || useIsomorphicLayoutEffect;\n\n/**\n * This hook is user-land implementation of the experimental `useEffectEvent` hook.\n * React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event\n *\n * This hook is useful when you want to use a callback function inside a useEffect while keeping it \"fresh\" but you don't want to add it to the dependency array.\n */\nfunction useCallbackRef<Args extends unknown[], Return>(\n  callback: ((...args: Args) => Return) | undefined,\n  deps: React.DependencyList = [],\n) {\n  const callbackRef = useRef<typeof callback>(callback);\n\n  useInsertionEffectFallback(() => {\n    callbackRef.current = callback;\n  });\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  return useCallback((...args: Args) => callbackRef.current?.(...args), deps);\n}\n\nexport { useCallbackRef };\n"],"names":["useReactInsertionEffect","React","trim","toString","useInsertionEffectFallback","useIsomorphicLayoutEffect","useCallbackRef","callback","deps","arguments","length","undefined","callbackRef","useRef","current","useCallback","_callbackRef$current","_len","args","Array","_key","call","apply","concat"],"mappings":";;;AAAA;AACA;;AAIA;AACA;AACA;AACA,IAAMA,uBAAuB,GAAIC,cAAK,CAAS,sBAAsB,CAACC,IAAI,EAAE,CAACC,QAAQ,EAAE,CAAC,CAAA;AACxF,IAAMC,0BAA0B,GAAGJ,uBAAuB,IAAIK,yBAAyB,CAAA;;AAEvF;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,cAAcA,CACrBC,QAAiD,EAEjD;AAAA,EAAA,IADAC,IAA0B,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,EAAE,CAAA;AAE/B,EAAA,IAAMG,WAAW,GAAGC,MAAM,CAAkBN,QAAQ,CAAC,CAAA;AAErDH,EAAAA,0BAA0B,CAAC,YAAM;IAC/BQ,WAAW,CAACE,OAAO,GAAGP,QAAQ,CAAA;AAChC,GAAC,CAAC,CAAA;;AAEF;AACA,EAAA,OAAOQ,WAAW,CAAC,YAAA;AAAA,IAAA,IAAAC,oBAAA,CAAA;AAAA,IAAA,KAAA,IAAAC,IAAA,GAAAR,SAAA,CAAAC,MAAA,EAAIQ,IAAI,GAAAC,IAAAA,KAAA,CAAAF,IAAA,GAAAG,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAH,IAAA,EAAAG,IAAA,EAAA,EAAA;AAAJF,MAAAA,IAAI,CAAAE,IAAA,CAAAX,GAAAA,SAAA,CAAAW,IAAA,CAAA,CAAA;AAAA,KAAA;IAAA,OAAAJ,CAAAA,oBAAA,GAAWJ,WAAW,CAACE,OAAO,MAAAE,IAAAA,IAAAA,oBAAA,uBAAnBA,oBAAA,CAAAK,IAAA,CAAAC,KAAA,CAAAN,oBAAA,EAAA,CAAAJ,WAAW,CAAAW,CAAAA,MAAA,CAAcL,IAAI,CAAC,CAAA,CAAA;AAAA,GAAA,EAAEV,IAAI,CAAC,CAAA;AAC7E;;;;"}

package/build/lib/web/production/components/AnimateInteractions/AnimateInteractions.web.js

@@ -0,0 +1,37 @@
+import React__default from 'react';
+import { useAnimation } from 'framer-motion';
+import { AnimateInteractionsContext } from './AnimateInteractionsProvider.js';
+import { useFocusWithin } from './useFocusWithin.js';
+import '../BaseMotion/index.js';
+import { jsx } from 'react/jsx-runtime';
+import { BaseMotionEnhancerBox } from '../BaseMotion/BaseMotion.js';
+
+var AnimateInteractions = function AnimateInteractions(_ref) {
+  var children = _ref.children,
+    _ref$motionTriggers = _ref.motionTriggers,
+    motionTriggers = _ref$motionTriggers === void 0 ? ['hover'] : _ref$motionTriggers;
+  var baseMotionRef = React__default.useRef(null);
+  var controls = useAnimation();
+  useFocusWithin(baseMotionRef, {
+    onFocusWithin: function onFocusWithin() {
+      void controls.start('animate');
+    },
+    onBlurWithin: function onBlurWithin() {
+      void controls.start('exit');
+    }
+  });
+  return /*#__PURE__*/jsx(AnimateInteractionsContext.Provider, {
+    value: {
+      isInsideAnimateInteractionsContainer: true
+    },
+    children: /*#__PURE__*/jsx(BaseMotionEnhancerBox, {
+      ref: baseMotionRef,
+      motionTriggers: motionTriggers,
+      animate: controls,
+      children: children
+    })
+  });
+};
+
+export { AnimateInteractions };
+//# sourceMappingURL=AnimateInteractions.web.js.map

package/build/lib/web/production/components/AnimateInteractions/AnimateInteractions.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateInteractions.web.js","sources":["../../../../../../src/components/AnimateInteractions/AnimateInteractions.web.tsx"],"sourcesContent":["import React from 'react';\nimport { useAnimation } from 'framer-motion';\nimport { AnimateInteractionsContext } from './AnimateInteractionsProvider';\nimport { useFocusWithin } from './useFocusWithin';\nimport type { AnimateInteractionsProps } from './types';\nimport { BaseMotionEnhancerBox } from '~components/BaseMotion';\n\n/**\n * ## AnimateInteractions\n *\n * AnimateInteractions is the utility preset that we offer to help you animate children when the parent is interacted.\n *\n * This is in a way equivalent to following CSS-\n * ```css\n * .parent:hover .child { }\n * ```\n *\n * ### Usage\n *\n * ```jsx\n * <AnimateInteractions\n *    motionTriggers={['hover']}\n *  > // <-- When this is hovered\n *  <Box>\n *    <Move\n *      motionTriggers={['on-animate-interactions']}\n *    > // <-- this animates in\n *      <Box />\n *    </Move>\n *  </Box>\n * </AnimateInteractions>\n * ```\n */\nconst AnimateInteractions = ({\n  children,\n  motionTriggers = ['hover'],\n}: AnimateInteractionsProps): React.ReactElement => {\n  const baseMotionRef = React.useRef<HTMLDivElement | null>(null);\n  const controls = useAnimation();\n\n  useFocusWithin(baseMotionRef, {\n    onFocusWithin: () => {\n      void controls.start('animate');\n    },\n    onBlurWithin: () => {\n      void controls.start('exit');\n    },\n  });\n\n  return (\n    <AnimateInteractionsContext.Provider value={{ isInsideAnimateInteractionsContainer: true }}>\n      <BaseMotionEnhancerBox ref={baseMotionRef} motionTriggers={motionTriggers} animate={controls}>\n        {children}\n      </BaseMotionEnhancerBox>\n    </AnimateInteractionsContext.Provider>\n  );\n};\n\nexport { AnimateInteractions };\n"],"names":["AnimateInteractions","_ref","children","_ref$motionTriggers","motionTriggers","baseMotionRef","React","useRef","controls","useAnimation","useFocusWithin","onFocusWithin","start","onBlurWithin","_jsx","AnimateInteractionsContext","Provider","value","isInsideAnimateInteractionsContainer","BaseMotionEnhancerBox","ref","animate"],"mappings":";;;;;;;;AAiCA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAG2B;AAAA,EAAA,IAFlDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAAC,mBAAA,GAAAF,IAAA,CACRG,cAAc;AAAdA,IAAAA,cAAc,GAAAD,mBAAA,KAAA,KAAA,CAAA,GAAG,CAAC,OAAO,CAAC,GAAAA,mBAAA,CAAA;AAE1B,EAAA,IAAME,aAAa,GAAGC,cAAK,CAACC,MAAM,CAAwB,IAAI,CAAC,CAAA;AAC/D,EAAA,IAAMC,QAAQ,GAAGC,YAAY,EAAE,CAAA;EAE/BC,cAAc,CAACL,aAAa,EAAE;IAC5BM,aAAa,EAAE,SAAAA,aAAAA,GAAM;AACnB,MAAA,KAAKH,QAAQ,CAACI,KAAK,CAAC,SAAS,CAAC,CAAA;KAC/B;IACDC,YAAY,EAAE,SAAAA,YAAAA,GAAM;AAClB,MAAA,KAAKL,QAAQ,CAACI,KAAK,CAAC,MAAM,CAAC,CAAA;AAC7B,KAAA;AACF,GAAC,CAAC,CAAA;AAEF,EAAA,oBACEE,GAAA,CAACC,0BAA0B,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAE;AAAEC,MAAAA,oCAAoC,EAAE,IAAA;KAAO;IAAAhB,QAAA,eACzFY,GAAA,CAACK,qBAAqB,EAAA;AAACC,MAAAA,GAAG,EAAEf,aAAc;AAACD,MAAAA,cAAc,EAAEA,cAAe;AAACiB,MAAAA,OAAO,EAAEb,QAAS;AAAAN,MAAAA,QAAA,EAC1FA,QAAAA;KACoB,CAAA;AAAC,GACW,CAAC,CAAA;AAE1C;;;;"}

package/build/lib/web/production/components/AnimateInteractions/index.js

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

package/build/lib/web/production/components/AnimateInteractions/index.js.map

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

package/build/lib/web/production/components/AnimateInteractions/useFocusWithin.js

@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+
+var useFocusWithin = function useFocusWithin(ref, _ref) {
+  var onFocusWithin = _ref.onFocusWithin,
+    onBlurWithin = _ref.onBlurWithin;
+  useEffect(function () {
+    var element = ref.current;
+    if (!element) return;
+    var handleFocusIn = function handleFocusIn() {
+      onFocusWithin === null || onFocusWithin === void 0 ? void 0 : onFocusWithin();
+    };
+    var handleFocusOut = function handleFocusOut(event) {
+      // Ensure that focus is not still within the container
+      if (element && !element.contains(event.relatedTarget)) {
+        onBlurWithin === null || onBlurWithin === void 0 ? void 0 : onBlurWithin();
+      }
+    };
+    element.addEventListener('focusin', handleFocusIn);
+    element.addEventListener('focusout', handleFocusOut);
+
+    // eslint-disable-next-line consistent-return
+    return function () {
+      element.removeEventListener('focusin', handleFocusIn);
+      element.removeEventListener('focusout', handleFocusOut);
+    };
+  }, [ref, onFocusWithin, onBlurWithin]);
+};
+
+export { useFocusWithin };
+//# sourceMappingURL=useFocusWithin.js.map