@primer/react
Version:
An implementation of GitHub's Primer Design System using React
166 lines (163 loc) • 3.75 kB
JavaScript
import { c } from 'react-compiler-runtime';
import { clsx } from 'clsx';
import React from 'react';
import classes from './UnderlineNav.module.css.js';
import { jsx, jsxs } from 'react/jsx-runtime';
function UnderlineNav(t0) {
const $ = c(24);
let actions;
let align;
let children;
let className;
let full;
let label;
let rest;
if ($[0] !== t0) {
({
actions,
className,
align,
children,
full,
label,
...rest
} = t0);
$[0] = t0;
$[1] = actions;
$[2] = align;
$[3] = children;
$[4] = className;
$[5] = full;
$[6] = label;
$[7] = rest;
} else {
actions = $[1];
align = $[2];
children = $[3];
className = $[4];
full = $[5];
label = $[6];
rest = $[7];
}
const t1 = align === "right";
let t2;
if ($[8] !== align || $[9] !== className || $[10] !== full || $[11] !== t1) {
t2 = clsx(className, classes.UnderlineNav, "PRC-UnderlineNav", {
[classes["UnderlineNav--right"]]: t1,
[classes["UnderlineNav--full"]]: full,
"PRC-UnderlineNav--full": full,
"PRC-UnderlineNav--right": align
});
$[8] = align;
$[9] = className;
$[10] = full;
$[11] = t1;
$[12] = t2;
} else {
t2 = $[12];
}
const navClasses = t2;
let t3;
if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
t3 = clsx(classes.UnderlineNavBody, "PRC-UnderlineNav-body");
$[13] = t3;
} else {
t3 = $[13];
}
let t4;
if ($[14] !== children) {
t4 = /*#__PURE__*/jsx("div", {
className: t3,
children: children
});
$[14] = children;
$[15] = t4;
} else {
t4 = $[15];
}
let t5;
if ($[16] !== actions) {
t5 = actions && /*#__PURE__*/jsx("div", {
className: clsx(classes.UnderlineNavActions, "PRC-UnderlineNav-actions"),
children: actions
});
$[16] = actions;
$[17] = t5;
} else {
t5 = $[17];
}
let t6;
if ($[18] !== label || $[19] !== navClasses || $[20] !== rest || $[21] !== t4 || $[22] !== t5) {
t6 = /*#__PURE__*/jsxs("nav", {
className: navClasses,
"aria-label": label,
...rest,
children: [t4, t5]
});
$[18] = label;
$[19] = navClasses;
$[20] = rest;
$[21] = t4;
$[22] = t5;
$[23] = t6;
} else {
t6 = $[23];
}
return t6;
}
const UnderlineNavLink = /*#__PURE__*/React.forwardRef(function UnderlineNavLink(t0, forwardRef) {
const $ = c(11);
let className;
let props;
let selected;
if ($[0] !== t0) {
({
className,
selected,
...props
} = t0);
$[0] = t0;
$[1] = className;
$[2] = props;
$[3] = selected;
} else {
className = $[1];
props = $[2];
selected = $[3];
}
let t1;
if ($[4] !== className) {
t1 = clsx(classes.UnderlineNavItem, className, classes.UnderlineNavLink);
$[4] = className;
$[5] = t1;
} else {
t1 = $[5];
}
const linkClasses = t1;
const t2 = selected ? "" : undefined;
let t3;
if ($[6] !== forwardRef || $[7] !== linkClasses || $[8] !== props || $[9] !== t2) {
t3 = /*#__PURE__*/jsx("a", {
ref: forwardRef,
"data-selected": t2,
className: linkClasses,
...props
});
$[6] = forwardRef;
$[7] = linkClasses;
$[8] = props;
$[9] = t2;
$[10] = t3;
} else {
t3 = $[10];
}
return t3;
});
UnderlineNavLink.displayName = 'UnderlineNav.Link';
/**
* @deprecated UnderlineNav is deprecated and will be replaced by the draft `UnderlineNav` in the next major release. See https://primer.style/react/drafts/UnderlineNav2 for more details.
*/
var UnderlineNav_default = Object.assign(UnderlineNav, {
Link: UnderlineNavLink
});
export { UnderlineNav_default as default };