Function LeadingVisual

packages/react/src/ActionList/Visuals.tsx:33–52

({sx = {}, ...props})

export type ActionListLeadingVisualProps = VisualProps
export const LeadingVisual: React.FC<React.PropsWithChildren<VisualProps>> = ({sx = {}, ...props}) => {
  const {variant, disabled, inactive} = React.useContext(ItemContext)
  return (
    <LeadingVisualContainer
      sx={merge(
        {
          color: getVariantStyles(variant, disabled, inactive).iconColor,
          svg: {fontSize: 0},
          '[data-variant="danger"]:hover &, [data-variant="danger"]:active &': {
            color: getVariantStyles(variant, disabled, inactive).hoverColor,
          },
        },
        sx as SxProp,
      )}
      {...props}
    >
      {props.children}
    </LeadingVisualContainer>
  )
}

export type ActionListTrailingVisualProps = VisualProps
export const TrailingVisual: React.FC<React.PropsWithChildren<VisualProps>> = ({sx = {}, ...props}) => {