@primer/react/dist/Token/_RemoveTokenButton.js

An implementation of GitHub's Primer Design System using React

import { XIcon } from '@primer/octicons-react';
import { clsx } from 'clsx';
import { defaultTokenSize } from './TokenBase.js';
import classes from './_RemoveTokenButton.module.css.js';
import { jsx } from 'react/jsx-runtime';

const RemoveTokenButton = ({
  'aria-label': ariaLabel,
  isParentInteractive,
  size = defaultTokenSize,
  className,
  borderOffset = 0,
  as: _as,
  children: _children,
  ...rest
}) => {
  if (isParentInteractive) {
    return /*#__PURE__*/jsx("span", {
      ...rest,
      tabIndex: -1,
      "aria-label": ariaLabel,
      "data-size": size,
      className: clsx(classes.TokenButton, className),
      style: {
        transform: `translate(${borderOffset}px, -${borderOffset}px)`
      },
      children: /*#__PURE__*/jsx(XIcon, {
        size: size === 'small' || size === 'medium' ? 12 : 16
      })
    });
  }
  return /*#__PURE__*/jsx("button", {
    ...rest,
    "aria-label": 'Remove token',
    "data-size": size,
    className: clsx(classes.TokenButton, className),
    style: {
      transform: `translate(${borderOffset}px, -${borderOffset}px)`
    }
    // eslint-disable-next-line react-hooks/refs
    ,
    ref: rest.ref,
    type: "button",
    children: /*#__PURE__*/jsx(XIcon, {
      size: size === 'small' || size === 'medium' ? 12 : 16
    })
  });
};
RemoveTokenButton.displayName = "RemoveTokenButton";

export { RemoveTokenButton as default };