@primer/react/dist/CounterLabel/CounterLabel.js

An implementation of GitHub's Primer Design System using React

import { clsx } from 'clsx';
import { forwardRef } from 'react';
import classes from './CounterLabel.module.css.js';
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';

const CounterLabel = /*#__PURE__*/forwardRef(({
  variant,
  scheme,
  className,
  children,
  ['data-component']: dataComponent,
  ...rest
}, forwardedRef) => {
  const label = /*#__PURE__*/jsxs(VisuallyHidden, {
    children: ["\xA0(", children, ")"]
  });
  const inferredVariant = variant || scheme || 'secondary';
  const counterProps = {
    ref: forwardedRef,
    ['aria-hidden']: 'true',
    ['data-variant']: inferredVariant,
    ...rest
  };
  return /*#__PURE__*/jsxs(Fragment, {
    children: [/*#__PURE__*/jsx("span", {
      ...counterProps,
      "data-component": dataComponent !== null && dataComponent !== void 0 ? dataComponent : 'CounterLabel',
      className: clsx(className, classes.CounterLabel),
      children: children
    }), label]
  });
});
CounterLabel.displayName = 'CounterLabel';

export { CounterLabel as default };