@primer/react
Version:
An implementation of GitHub's Primer Design System using React
138 lines (137 loc) • 4.29 kB
JavaScript
import ButtonBase_module_css_default from "./ButtonBase.module.css.js";
import { ButtonBase } from "./ButtonBase.js";
import { TooltipContext } from "../TooltipV2/TooltipContext.js";
import { Tooltip } from "../TooltipV2/Tooltip.js";
import { TooltipContext as TooltipContext$1 } from "../Tooltip/TooltipContext.js";
import { c } from "react-compiler-runtime";
import { clsx } from "clsx";
import { jsx } from "react/jsx-runtime";
import React, { forwardRef } from "react";
//#region src/Button/IconButton.tsx
const IconButton = /*#__PURE__*/ forwardRef((t0, forwardedRef) => {
const $ = c(36);
let Icon;
let ariaLabel;
let className;
let description;
let disabled;
let keybindingHint;
let keyshortcuts;
let props;
let t1;
let tooltipDirection;
if ($[0] !== t0) {
({icon: Icon, "aria-label": ariaLabel, description, disabled, tooltipDirection, unsafeDisableTooltip: t1, keyshortcuts, keybindingHint, className, ...props} = t0);
$[0] = t0;
$[1] = Icon;
$[2] = ariaLabel;
$[3] = className;
$[4] = description;
$[5] = disabled;
$[6] = keybindingHint;
$[7] = keyshortcuts;
$[8] = props;
$[9] = t1;
$[10] = tooltipDirection;
} else {
Icon = $[1];
ariaLabel = $[2];
className = $[3];
description = $[4];
disabled = $[5];
keybindingHint = $[6];
keyshortcuts = $[7];
props = $[8];
t1 = $[9];
tooltipDirection = $[10];
}
const unsafeDisableTooltip = t1 === void 0 ? false : t1;
const { tooltipId } = React.useContext(TooltipContext);
const { tooltipId: tooltipIdV1 } = React.useContext(TooltipContext$1);
const { "aria-expanded": isExpanded, "aria-haspopup": hasPopup } = props;
const hasExternalTooltip = tooltipId || tooltipIdV1;
const hasActivePopup = (isExpanded === true || isExpanded === "true") && hasPopup === "true";
if (unsafeDisableTooltip || disabled || ariaLabel === void 0 || ariaLabel === "" || hasExternalTooltip) {
let t2;
if ($[11] !== className) {
t2 = clsx(className, ButtonBase_module_css_default.IconButton);
$[11] = className;
$[12] = t2;
} else t2 = $[12];
let t3;
if ($[13] !== Icon || $[14] !== ariaLabel || $[15] !== disabled || $[16] !== forwardedRef || $[17] !== props || $[18] !== t2) {
t3 = /*#__PURE__*/ jsx(ButtonBase, {
icon: Icon,
className: t2,
"data-component": "IconButton",
type: "button",
"aria-label": ariaLabel,
disabled,
...props,
ref: forwardedRef
});
$[13] = Icon;
$[14] = ariaLabel;
$[15] = disabled;
$[16] = forwardedRef;
$[17] = props;
$[18] = t2;
$[19] = t3;
} else t3 = $[19];
return t3;
} else {
var _description, _keybindingHint, _keyshortcuts;
const tooltipText = (_description = description) !== null && _description !== void 0 ? _description : ariaLabel;
const t2 = description ? void 0 : "label";
const t3 = (_keybindingHint = keybindingHint) !== null && _keybindingHint !== void 0 ? _keybindingHint : keyshortcuts;
let t4;
if ($[20] !== className) {
t4 = clsx(className, ButtonBase_module_css_default.IconButton);
$[20] = className;
$[21] = t4;
} else t4 = $[21];
const t5 = (_keyshortcuts = keyshortcuts) !== null && _keyshortcuts !== void 0 ? _keyshortcuts : void 0;
const t6 = description ? ariaLabel : void 0;
let t7;
if ($[22] !== Icon || $[23] !== props || $[24] !== t4 || $[25] !== t5 || $[26] !== t6) {
t7 = /*#__PURE__*/ jsx(ButtonBase, {
icon: Icon,
className: t4,
"data-component": "IconButton",
type: "button",
"aria-keyshortcuts": t5,
"aria-label": t6,
...props
});
$[22] = Icon;
$[23] = props;
$[24] = t4;
$[25] = t5;
$[26] = t6;
$[27] = t7;
} else t7 = $[27];
let t8;
if ($[28] !== forwardedRef || $[29] !== hasActivePopup || $[30] !== t2 || $[31] !== t3 || $[32] !== t7 || $[33] !== tooltipDirection || $[34] !== tooltipText) {
t8 = /*#__PURE__*/ jsx(Tooltip, {
ref: forwardedRef,
text: tooltipText,
type: t2,
direction: tooltipDirection,
keybindingHint: t3,
_privateDisableTooltip: hasActivePopup,
children: t7
});
$[28] = forwardedRef;
$[29] = hasActivePopup;
$[30] = t2;
$[31] = t3;
$[32] = t7;
$[33] = tooltipDirection;
$[34] = tooltipText;
$[35] = t8;
} else t8 = $[35];
return t8;
}
});
//#endregion
export { IconButton };