@primer/react/lib/SegmentedControl/SegmentedControlButton.js

An implementation of GitHub's Primer Design System using React

'use strict';

var reactCompilerRuntime = require('react-compiler-runtime');
var reactIs = require('react-is');
var SegmentedControl_module = require('./SegmentedControl.module.css.js');
var clsx = require('clsx');
var BoxWithFallback = require('../internal/components/BoxWithFallback.js');
var jsxRuntime = require('react/jsx-runtime');

const SegmentedControlButton = t0 => {
  const $ = reactCompilerRuntime.c(28);
  let LeadingIcon;
  let children;
  let className;
  let rest;
  let selected;
  let sxProp;
  if ($[0] !== t0) {
    const {
      children: t1,
      leadingIcon: t2,
      selected: t3,
      sx: t4,
      className: t5,
      defaultSelected: _defaultSelected,
      ...t6
    } = t0;
    children = t1;
    LeadingIcon = t2;
    selected = t3;
    sxProp = t4;
    className = t5;
    rest = t6;
    $[0] = t0;
    $[1] = LeadingIcon;
    $[2] = children;
    $[3] = className;
    $[4] = rest;
    $[5] = selected;
    $[6] = sxProp;
  } else {
    LeadingIcon = $[1];
    children = $[2];
    className = $[3];
    rest = $[4];
    selected = $[5];
    sxProp = $[6];
  }
  let t1;
  if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
    t1 = clsx.clsx(SegmentedControl_module.Item);
    $[7] = t1;
  } else {
    t1 = $[7];
  }
  const t2 = selected ? "" : undefined;
  let t3;
  if ($[8] !== className) {
    t3 = clsx.clsx(SegmentedControl_module.Button, className);
    $[8] = className;
    $[9] = t3;
  } else {
    t3 = $[9];
  }
  let t4;
  if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
    t4 = clsx.clsx(SegmentedControl_module.Content, "segmentedControl-content");
    $[10] = t4;
  } else {
    t4 = $[10];
  }
  let t5;
  if ($[11] !== LeadingIcon) {
    t5 = LeadingIcon && /*#__PURE__*/jsxRuntime.jsx("div", {
      className: SegmentedControl_module.LeadingIcon,
      children: reactIs.isElement(LeadingIcon) ? LeadingIcon : /*#__PURE__*/jsxRuntime.jsx(LeadingIcon, {})
    });
    $[11] = LeadingIcon;
    $[12] = t5;
  } else {
    t5 = $[12];
  }
  let t6;
  if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
    t6 = clsx.clsx(SegmentedControl_module.Text, "segmentedControl-text");
    $[13] = t6;
  } else {
    t6 = $[13];
  }
  let t7;
  if ($[14] !== children) {
    t7 = /*#__PURE__*/jsxRuntime.jsx("div", {
      className: t6,
      "data-text": children,
      children: children
    });
    $[14] = children;
    $[15] = t7;
  } else {
    t7 = $[15];
  }
  let t8;
  if ($[16] !== t5 || $[17] !== t7) {
    t8 = /*#__PURE__*/jsxRuntime.jsxs("span", {
      className: t4,
      children: [t5, t7]
    });
    $[16] = t5;
    $[17] = t7;
    $[18] = t8;
  } else {
    t8 = $[18];
  }
  let t9;
  if ($[19] !== rest || $[20] !== selected || $[21] !== t3 || $[22] !== t8) {
    t9 = /*#__PURE__*/jsxRuntime.jsx(BoxWithFallback.BoxWithFallback, {
      as: "button",
      "aria-current": selected,
      className: t3,
      type: "button",
      ...rest,
      children: t8
    });
    $[19] = rest;
    $[20] = selected;
    $[21] = t3;
    $[22] = t8;
    $[23] = t9;
  } else {
    t9 = $[23];
  }
  let t10;
  if ($[24] !== sxProp || $[25] !== t2 || $[26] !== t9) {
    t10 = /*#__PURE__*/jsxRuntime.jsx(BoxWithFallback.BoxWithFallback, {
      as: "li",
      sx: sxProp,
      className: t1,
      "data-selected": t2,
      children: t9
    });
    $[24] = sxProp;
    $[25] = t2;
    $[26] = t9;
    $[27] = t10;
  } else {
    t10 = $[27];
  }
  return t10;
};

module.exports = SegmentedControlButton;