@rowsncolumns/spreadsheet 10.5.12 → 10.5.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/print-preview/print-preview-dialog.d.ts.map +1 -1
- package/dist/cjs/components/print-preview/print-preview-dialog.js +9 -2
- package/dist/esm/components/print-preview/print-preview-dialog.d.ts.map +1 -1
- package/dist/esm/components/print-preview/print-preview-dialog.js +10 -3
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"print-preview-dialog.d.ts","sourceRoot":"","sources":["../../../../components/print-preview/print-preview-dialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAMN,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"print-preview-dialog.d.ts","sourceRoot":"","sources":["../../../../components/print-preview/print-preview-dialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAMN,MAAM,OAAO,CAAC;AAef,OAAO,KAAK,EACV,QAAQ,EACR,UAAU,EAEX,MAAM,4BAA4B,CAAC;AAKpC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AA4BxD,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,iBAAiB,EAAE,CACjB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IAC/B,kBAAkB,EAAE,CAClB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,UAAU,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,0EAA0E;IAC1E,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC1D,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,CACZ,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,QAAQ,GAAG,IAAI,GAAG,SAAS,CAAC;IACjC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;CAC1B,CAAC;AAgEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA8sBhE,CAAC"}
|
|
@@ -14,6 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
14
14
|
exports.PrintPreviewDialog = void 0;
|
|
15
15
|
var tslib_1 = require("tslib");
|
|
16
16
|
var react_1 = tslib_1.__importStar(require("react"));
|
|
17
|
+
var react_dom_1 = require("react-dom");
|
|
17
18
|
var ui_1 = require("@rowsncolumns/ui");
|
|
18
19
|
var icons_1 = require("@rowsncolumns/icons");
|
|
19
20
|
var page_block_1 = require("./page-block");
|
|
@@ -57,6 +58,12 @@ var PrintPreviewDialog = function (_a) {
|
|
|
57
58
|
var _b = tslib_1.__read((0, react_1.useState)(settings_1.DEFAULT_PRINT_SETTINGS), 2), settings = _b[0], setSettings = _b[1];
|
|
58
59
|
var printContainerRef = (0, react_1.useRef)(null);
|
|
59
60
|
var getChartActions = (0, chart_actions_atom_1.useGetChartActions)();
|
|
61
|
+
// The host renders the grid inside its own stacking contexts (a pane with a
|
|
62
|
+
// z-index, a transformed panel); a `fixed` overlay left inline there competes
|
|
63
|
+
// only within that context and the host's navigation paints over it. Mount
|
|
64
|
+
// at the portal container like every other overlay — `document.body`, or the
|
|
65
|
+
// popout window's body when the host provides one.
|
|
66
|
+
var portalContainer = (0, ui_1.usePortalContainer)();
|
|
60
67
|
// Look up the active sheet from the supplied list. When the id
|
|
61
68
|
// doesn't match anything (shouldn't happen) we render nothing.
|
|
62
69
|
var activeSheetSource = (0, react_1.useMemo)(function () { return sheets.find(function (s) { return s.sheetId === activeSheetId; }); }, [sheets, activeSheetId]);
|
|
@@ -342,7 +349,7 @@ var PrintPreviewDialog = function (_a) {
|
|
|
342
349
|
var range = (0, use_page_layout_1.measureRange)(bounds.startRow, bounds.endRow, bounds.startColumn, bounds.endColumn, sheet.getColumnWidth, sheet.getRowHeight);
|
|
343
350
|
return (0, use_page_layout_1.resolveScale)(settings.scaleMode, settings.customScale, range.width, range.height, contentArea.width, contentArea.height);
|
|
344
351
|
};
|
|
345
|
-
return (react_1.default.createElement("div", { className: "fixed inset-0 z-[100] bg-rnc-background flex flex-col font-system", role: "dialog", "aria-modal": "true", "aria-label": "Print preview" },
|
|
352
|
+
return (0, react_dom_1.createPortal)(react_1.default.createElement("div", { className: "fixed inset-0 z-[100] bg-rnc-background flex flex-col font-system", role: "dialog", "aria-modal": "true", "aria-label": "Print preview" },
|
|
346
353
|
react_1.default.createElement("div", { className: "flex items-center justify-between px-4 py-2 border-b border-solid border-rnc-border" },
|
|
347
354
|
react_1.default.createElement("div", { className: "flex items-center gap-3" },
|
|
348
355
|
react_1.default.createElement(ui_1.IconButton, { onClick: onClose, "aria-label": "Close" },
|
|
@@ -510,6 +517,6 @@ var PrintPreviewDialog = function (_a) {
|
|
|
510
517
|
react_1.default.createElement("input", { type: "checkbox", disabled: !activeSheet.frozenColumns, checked: settings.repeatFrozenColumns, onChange: function (e) {
|
|
511
518
|
return setField("repeatFrozenColumns", e.target.checked);
|
|
512
519
|
} }),
|
|
513
|
-
"Repeat frozen columns")))));
|
|
520
|
+
"Repeat frozen columns")))), portalContainer !== null && portalContainer !== void 0 ? portalContainer : document.body);
|
|
514
521
|
};
|
|
515
522
|
exports.PrintPreviewDialog = PrintPreviewDialog;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"print-preview-dialog.d.ts","sourceRoot":"","sources":["../../../../components/print-preview/print-preview-dialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAMN,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"print-preview-dialog.d.ts","sourceRoot":"","sources":["../../../../components/print-preview/print-preview-dialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAMN,MAAM,OAAO,CAAC;AAef,OAAO,KAAK,EACV,QAAQ,EACR,UAAU,EAEX,MAAM,4BAA4B,CAAC;AAKpC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AA4BxD,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,iBAAiB,EAAE,CACjB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IAC/B,kBAAkB,EAAE,CAClB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,UAAU,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,0EAA0E;IAC1E,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC1D,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IAC7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,CACZ,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,QAAQ,GAAG,IAAI,GAAG,SAAS,CAAC;IACjC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;CAC1B,CAAC;AAgEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA8sBhE,CAAC"}
|
|
@@ -10,7 +10,8 @@
|
|
|
10
10
|
// alongside (`getFormattedValue`, `getEffectiveFormat`, …) — no
|
|
11
11
|
// adapter object, no nested PrintSheet construction.
|
|
12
12
|
import React, { useCallback, useEffect, useMemo, useRef, useState, } from "react";
|
|
13
|
-
import {
|
|
13
|
+
import { createPortal } from "react-dom";
|
|
14
|
+
import { Button, IconButton, Select, SelectContent, SelectItem, SelectPortal, SelectTrigger, SelectValue, usePortalContainer, } from "@rowsncolumns/ui";
|
|
14
15
|
import { Cross2Icon } from "@rowsncolumns/icons";
|
|
15
16
|
import { PageBlock } from "./page-block";
|
|
16
17
|
import { useGetChartActions } from "../../atoms/chart-actions.atom";
|
|
@@ -47,6 +48,12 @@ export const PrintPreviewDialog = ({ isOpen, onClose, sheets, activeSheetId, sel
|
|
|
47
48
|
const [settings, setSettings] = useState(DEFAULT_PRINT_SETTINGS);
|
|
48
49
|
const printContainerRef = useRef(null);
|
|
49
50
|
const getChartActions = useGetChartActions();
|
|
51
|
+
// The host renders the grid inside its own stacking contexts (a pane with a
|
|
52
|
+
// z-index, a transformed panel); a `fixed` overlay left inline there competes
|
|
53
|
+
// only within that context and the host's navigation paints over it. Mount
|
|
54
|
+
// at the portal container like every other overlay — `document.body`, or the
|
|
55
|
+
// popout window's body when the host provides one.
|
|
56
|
+
const portalContainer = usePortalContainer();
|
|
50
57
|
// Look up the active sheet from the supplied list. When the id
|
|
51
58
|
// doesn't match anything (shouldn't happen) we render nothing.
|
|
52
59
|
const activeSheetSource = useMemo(() => sheets.find((s) => s.sheetId === activeSheetId), [sheets, activeSheetId]);
|
|
@@ -243,7 +250,7 @@ export const PrintPreviewDialog = ({ isOpen, onClose, sheets, activeSheetId, sel
|
|
|
243
250
|
const range = measureRange(bounds.startRow, bounds.endRow, bounds.startColumn, bounds.endColumn, sheet.getColumnWidth, sheet.getRowHeight);
|
|
244
251
|
return resolveScale(settings.scaleMode, settings.customScale, range.width, range.height, contentArea.width, contentArea.height);
|
|
245
252
|
};
|
|
246
|
-
return (React.createElement("div", { className: "fixed inset-0 z-[100] bg-rnc-background flex flex-col font-system", role: "dialog", "aria-modal": "true", "aria-label": "Print preview" },
|
|
253
|
+
return createPortal(React.createElement("div", { className: "fixed inset-0 z-[100] bg-rnc-background flex flex-col font-system", role: "dialog", "aria-modal": "true", "aria-label": "Print preview" },
|
|
247
254
|
React.createElement("div", { className: "flex items-center justify-between px-4 py-2 border-b border-solid border-rnc-border" },
|
|
248
255
|
React.createElement("div", { className: "flex items-center gap-3" },
|
|
249
256
|
React.createElement(IconButton, { onClick: onClose, "aria-label": "Close" },
|
|
@@ -406,5 +413,5 @@ export const PrintPreviewDialog = ({ isOpen, onClose, sheets, activeSheetId, sel
|
|
|
406
413
|
"Repeat frozen rows"),
|
|
407
414
|
React.createElement("label", { className: `flex items-center gap-2 text-xs py-1 text-rnc-foreground ${activeSheet.frozenColumns ? "" : "opacity-40 cursor-not-allowed"}` },
|
|
408
415
|
React.createElement("input", { type: "checkbox", disabled: !activeSheet.frozenColumns, checked: settings.repeatFrozenColumns, onChange: (e) => setField("repeatFrozenColumns", e.target.checked) }),
|
|
409
|
-
"Repeat frozen columns")))));
|
|
416
|
+
"Repeat frozen columns")))), portalContainer ?? document.body);
|
|
410
417
|
};
|