@primer/react
Version:
An implementation of GitHub's Primer Design System using React
190 lines (187 loc) • 4.25 kB
JavaScript
import { c } from 'react-compiler-runtime';
import { isElement } from 'react-is';
import classes from './SegmentedControl.module.css.js';
import { clsx } from 'clsx';
import { jsx, jsxs } from 'react/jsx-runtime';
import CounterLabel from '../CounterLabel/CounterLabel.js';
const SegmentedControlButton = t0 => {
var _leadingVisual;
const $ = c(36);
let children;
let className;
let count;
let disabled;
let leadingIcon;
let leadingVisual;
let props;
let selected;
if ($[0] !== t0) {
const {
children: t1,
leadingVisual: t2,
leadingIcon: t3,
selected: t4,
className: t5,
disabled: t6,
defaultSelected: _defaultSelected,
count: t7,
...t8
} = t0;
children = t1;
leadingVisual = t2;
leadingIcon = t3;
selected = t4;
className = t5;
disabled = t6;
count = t7;
props = t8;
$[0] = t0;
$[1] = children;
$[2] = className;
$[3] = count;
$[4] = disabled;
$[5] = leadingIcon;
$[6] = leadingVisual;
$[7] = props;
$[8] = selected;
} else {
children = $[1];
className = $[2];
count = $[3];
disabled = $[4];
leadingIcon = $[5];
leadingVisual = $[6];
props = $[7];
selected = $[8];
}
let ariaDisabled;
let rest;
if ($[9] !== props) {
({
"aria-disabled": ariaDisabled,
...rest
} = props);
$[9] = props;
$[10] = ariaDisabled;
$[11] = rest;
} else {
ariaDisabled = $[10];
rest = $[11];
}
const LeadingVisual = (_leadingVisual = leadingVisual) !== null && _leadingVisual !== void 0 ? _leadingVisual : leadingIcon;
let t1;
if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
t1 = clsx(classes.Item);
$[12] = t1;
} else {
t1 = $[12];
}
const t2 = selected ? "" : undefined;
const t3 = disabled || ariaDisabled || undefined;
let t4;
if ($[13] !== className) {
t4 = clsx(classes.Button, className);
$[13] = className;
$[14] = t4;
} else {
t4 = $[14];
}
let t5;
if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
t5 = clsx(classes.Content, "segmentedControl-content");
$[15] = t5;
} else {
t5 = $[15];
}
let t6;
if ($[16] !== LeadingVisual) {
t6 = LeadingVisual && /*#__PURE__*/jsx("div", {
className: classes.LeadingIcon,
children: isElement(LeadingVisual) ? LeadingVisual : /*#__PURE__*/jsx(LeadingVisual, {})
});
$[16] = LeadingVisual;
$[17] = t6;
} else {
t6 = $[17];
}
let t7;
if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
t7 = clsx(classes.Text, "segmentedControl-text");
$[18] = t7;
} else {
t7 = $[18];
}
let t8;
if ($[19] !== children) {
t8 = /*#__PURE__*/jsx("div", {
className: t7,
"data-text": children,
children: children
});
$[19] = children;
$[20] = t8;
} else {
t8 = $[20];
}
let t9;
if ($[21] !== count) {
t9 = count !== undefined && /*#__PURE__*/jsx("span", {
className: classes.Counter,
children: /*#__PURE__*/jsx(CounterLabel, {
children: count
})
});
$[21] = count;
$[22] = t9;
} else {
t9 = $[22];
}
let t10;
if ($[23] !== t6 || $[24] !== t8 || $[25] !== t9) {
t10 = /*#__PURE__*/jsxs("span", {
className: t5,
children: [t6, t8, t9]
});
$[23] = t6;
$[24] = t8;
$[25] = t9;
$[26] = t10;
} else {
t10 = $[26];
}
let t11;
if ($[27] !== rest || $[28] !== selected || $[29] !== t10 || $[30] !== t3 || $[31] !== t4) {
t11 = /*#__PURE__*/jsx("button", {
"aria-current": selected,
"aria-disabled": t3,
className: t4,
type: "button",
...rest,
children: t10
});
$[27] = rest;
$[28] = selected;
$[29] = t10;
$[30] = t3;
$[31] = t4;
$[32] = t11;
} else {
t11 = $[32];
}
let t12;
if ($[33] !== t11 || $[34] !== t2) {
t12 = /*#__PURE__*/jsx("li", {
className: t1,
"data-selected": t2,
children: t11
});
$[33] = t11;
$[34] = t2;
$[35] = t12;
} else {
t12 = $[35];
}
return t12;
};
SegmentedControlButton.__SLOT__ = Symbol('SegmentedControl.Button');
export { SegmentedControlButton as default };