sanity
Version:
Sanity is a real-time content infrastructure with a scalable, hosted backend featuring a Graph Oriented Query Language (GROQ), asset pipelines and fast edge caches
104 lines (103 loc) • 5.45 kB
JavaScript
import { jsx, jsxs } from "react/jsx-runtime";
import { c } from "react/compiler-runtime";
import { Popover, useLayer, useGlobalKeyDown, useClickOutsideEvent, Flex, Box, Text, Button, Grid, MenuGroup as MenuGroup$1 } from "@sanity/ui";
import { useRef } from "react";
import { useTranslation } from "react-i18next";
import { Tooltip } from "./TooltipDelayGroupProvider.js";
function ConfirmPopover(t0) {
const $ = c(16), {
cancelButtonIcon,
cancelButtonText,
confirmButtonIcon,
confirmButtonText,
message,
onCancel,
onConfirm,
open,
referenceElement,
tone: t1,
placement: t2,
fallbackPlacements: t3
} = t0, tone = t1 === void 0 ? "critical" : t1, placement = t2 === void 0 ? "top" : t2;
let t4;
$[0] !== t3 ? (t4 = t3 === void 0 ? ["left", "bottom"] : t3, $[0] = t3, $[1] = t4) : t4 = $[1];
const fallbackPlacements = t4;
if (!open)
return null;
let t5;
$[2] !== cancelButtonIcon || $[3] !== cancelButtonText || $[4] !== confirmButtonIcon || $[5] !== confirmButtonText || $[6] !== message || $[7] !== onCancel || $[8] !== onConfirm || $[9] !== tone ? (t5 = /* @__PURE__ */ jsx(ConfirmPopoverContent, { cancelButtonIcon, cancelButtonText, confirmButtonIcon, confirmButtonText, message, onCancel, onConfirm, tone }), $[2] = cancelButtonIcon, $[3] = cancelButtonText, $[4] = confirmButtonIcon, $[5] = confirmButtonText, $[6] = message, $[7] = onCancel, $[8] = onConfirm, $[9] = tone, $[10] = t5) : t5 = $[10];
let t6;
return $[11] !== fallbackPlacements || $[12] !== placement || $[13] !== referenceElement || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsx(Popover, { content: t5, constrainSize: !0, fallbackPlacements, open: !0, placement, portal: !0, preventOverflow: !0, referenceElement }), $[11] = fallbackPlacements, $[12] = placement, $[13] = referenceElement, $[14] = t5, $[15] = t6) : t6 = $[15], t6;
}
function ConfirmPopoverContent(t0) {
const $ = c(29), {
cancelButtonIcon,
cancelButtonText,
confirmButtonIcon,
confirmButtonText,
message,
onCancel,
onConfirm,
tone
} = t0, {
t
} = useTranslation(), {
isTopLayer
} = useLayer(), ref = useRef(null);
let t1;
$[0] !== isTopLayer || $[1] !== onCancel ? (t1 = (event) => {
event.key === "Escape" && isTopLayer && onCancel();
}, $[0] = isTopLayer, $[1] = onCancel, $[2] = t1) : t1 = $[2], useGlobalKeyDown(t1);
let t2;
$[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = () => [ref.current], $[3] = t2) : t2 = $[3], useClickOutsideEvent(isTopLayer && onCancel, t2);
let t3;
$[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = {
minWidth: 280,
maxWidth: 350
}, $[4] = t3) : t3 = $[4];
let t4;
$[5] !== message ? (t4 = /* @__PURE__ */ jsx(Box, { flex: 1, overflow: "auto", padding: 4, children: /* @__PURE__ */ jsx(Text, { size: 1, children: message }) }), $[5] = message, $[6] = t4) : t4 = $[6];
let t5;
$[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t5 = {
borderTop: "1px solid var(--card-border-color)"
}, $[7] = t5) : t5 = $[7];
let t6;
$[8] !== cancelButtonText || $[9] !== t ? (t6 = cancelButtonText || t("common.dialog.cancel-button.text"), $[8] = cancelButtonText, $[9] = t, $[10] = t6) : t6 = $[10];
let t7;
$[11] !== cancelButtonIcon || $[12] !== onCancel || $[13] !== t6 ? (t7 = /* @__PURE__ */ jsx(Button, { "data-testid": "confirm-popover-cancel-button", icon: cancelButtonIcon, onClick: onCancel, mode: "ghost", padding: 2, text: t6, size: 1 }), $[11] = cancelButtonIcon, $[12] = onCancel, $[13] = t6, $[14] = t7) : t7 = $[14];
let t8;
$[15] !== confirmButtonText || $[16] !== t ? (t8 = confirmButtonText || t("common.dialog.confirm-button.text"), $[15] = confirmButtonText, $[16] = t, $[17] = t8) : t8 = $[17];
let t9;
$[18] !== confirmButtonIcon || $[19] !== onConfirm || $[20] !== t8 || $[21] !== tone ? (t9 = /* @__PURE__ */ jsx(Button, { "data-testid": "confirm-popover-confirm-button", icon: confirmButtonIcon, onClick: onConfirm, padding: 2, text: t8, tone, size: 1 }), $[18] = confirmButtonIcon, $[19] = onConfirm, $[20] = t8, $[21] = tone, $[22] = t9) : t9 = $[22];
let t10;
$[23] !== t7 || $[24] !== t9 ? (t10 = /* @__PURE__ */ jsx(Box, { paddingX: 4, paddingY: 3, style: t5, children: /* @__PURE__ */ jsxs(Grid, { columns: 2, gap: 2, children: [
t7,
t9
] }) }), $[23] = t7, $[24] = t9, $[25] = t10) : t10 = $[25];
let t11;
return $[26] !== t10 || $[27] !== t4 ? (t11 = /* @__PURE__ */ jsxs(Flex, { direction: "column", ref, style: t3, children: [
t4,
t10
] }), $[26] = t10, $[27] = t4, $[28] = t11) : t11 = $[28], t11;
}
const MenuGroup = (props) => {
const $ = c(8), {
tooltipProps
} = props;
let t0;
$[0] !== props ? (t0 = /* @__PURE__ */ jsx(MenuGroup$1, { ...props, fontSize: 1, padding: 3 }), $[0] = props, $[1] = t0) : t0 = $[1];
const children = t0;
if (tooltipProps) {
const t1 = tooltipProps?.content;
let t2;
$[2] !== children ? (t2 = /* @__PURE__ */ jsx("div", { children }), $[2] = children, $[3] = t2) : t2 = $[3];
let t3;
return $[4] !== t1 || $[5] !== t2 || $[6] !== tooltipProps ? (t3 = /* @__PURE__ */ jsx(Tooltip, { content: t1, portal: !0, ...tooltipProps, children: t2 }), $[4] = t1, $[5] = t2, $[6] = tooltipProps, $[7] = t3) : t3 = $[7], t3;
}
return children;
};
export {
ConfirmPopover,
MenuGroup
};
//# sourceMappingURL=MenuGroup.js.map