@primer/react/dist/ActionList/LinkItem.js

An implementation of GitHub's Primer Design System using React

import { Item } from './Item.js';
import { fixedForwardRef } from '../utils/modern-polymorphic.js';
import { jsx } from 'react/jsx-runtime';
import Link from '../Link/Link.js';

const LinkItemComponent = fixedForwardRef(({
  active,
  inactiveText,
  variant,
  size,
  as: Component,
  className,
  ...props
}, forwardedRef) => {
  return /*#__PURE__*/jsx(Item, {
    className: className,
    active: active,
    inactiveText: inactiveText,
    "data-inactive": inactiveText ? true : undefined,
    variant: variant,
    size: size,
    _PrivateItemWrapper: ({
      children,
      onClick,
      ...rest
    }) => {
      const clickHandler = event => {
        onClick && onClick(event);
        props.onClick && props.onClick(event);
      };
      if (inactiveText) {
        return /*#__PURE__*/jsx("span", {
          ...rest,
          children: children
        });
      }

      // Type safety for the polymorphic `as` prop is enforced at the
      // LinkItem boundary via fixedForwardRef. Internally we widen
      // Link's type so TypeScript doesn't re-check the generic
      // constraint across two polymorphic layers.
      const InternalLink = Link;
      return /*#__PURE__*/jsx(InternalLink, {
        as: Component,
        ...rest,
        ...props,
        onClick: clickHandler,
        ref: forwardedRef,
        children: children
      });
    },
    children: props.children
  });
});
const LinkItem = Object.assign(LinkItemComponent, {
  displayName: 'ActionList.LinkItem',
  __SLOT__: Symbol('ActionList.LinkItem')
});

export { LinkItem };