@opengeni/react 7.1.0 → 7.1.2-canary.36079201993001

package/dist/{chunk-XMXRI5JK.js → chunk-ZZ4744OZ.js}

@@ -6,7 +6,7 @@ import {
   editableArtifactProjectionKey,
   editableArtifactStatusLabel,
   useEditableArtifactView
-} from "./chunk-KCGXPP5V.js";
+} from "./chunk-6P7T4RPE.js";
 import {
   cn
 } from "./chunk-22KP6LR5.js";
@@ -587,79 +587,100 @@ function DocumentEditorCore({
                     children: "Start writing"
                   }
                 ) : null
-              ] }) }) : /* @__PURE__ */ jsx("div", { className: "relative min-w-full", style: { height: axis.total }, children: mountedIndexes.map((pageIndex) => {
-                const page = pages[pageIndex];
-                const top = axis.offsets[pageIndex];
-                return /* @__PURE__ */ jsx(
-                  "article",
-                  {
-                    "aria-label": `${layout === "paginated" ? "Page" : "Section"} ${pageIndex + 1} of ${pages.length}`,
-                    "aria-posinset": pageIndex + 1,
-                    "aria-setsize": pages.length,
-                    "data-og-document-page": pageIndex + 1,
-                    "data-og-page-width-pt": page.page.widthPt,
-                    "data-og-page-height-pt": page.page.heightPt,
-                    className: cn(
-                      "absolute overflow-hidden",
-                      layout === "paginated" ? "left-1/2 -translate-x-1/2 border shadow-og-sm" : "left-0 right-0 border-b border-og-border bg-og-surface-1 text-og-fg"
-                    ),
-                    style: {
-                      top,
-                      color: layout === "paginated" ? "#171717" : void 0,
-                      backgroundColor: layout === "paginated" ? "#fff" : void 0,
-                      borderColor: layout === "paginated" ? "#0000001a" : void 0,
-                      width: layout === "paginated" ? page.page.widthPt * POINT_TO_CSS_PIXEL * page.renderScale : void 0,
-                      height: page.height
-                    },
-                    children: /* @__PURE__ */ jsx(
-                      MeasuredPageBody,
+              ] }) }) : /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "relative min-w-full",
+                  style: {
+                    height: axis.total,
+                    minWidth: layout === "paginated" ? pages.reduce(
+                      (width, page) => Math.max(
+                        width,
+                        page.page.widthPt * POINT_TO_CSS_PIXEL * page.renderScale + 32
+                      ),
+                      0
+                    ) : void 0
+                  },
+                  children: mountedIndexes.map((pageIndex) => {
+                    const page = pages[pageIndex];
+                    const top = axis.offsets[pageIndex];
+                    const pageWidth = page.page.widthPt * POINT_TO_CSS_PIXEL * page.renderScale;
+                    return /* @__PURE__ */ jsx(
+                      "article",
                       {
-                        pageKey: page.key,
-                        measureToken: documentRevision,
-                        onHeight: recordPageHeight,
+                        "aria-label": `${layout === "paginated" ? "Page" : "Section"} ${pageIndex + 1} of ${pages.length}`,
+                        "aria-posinset": pageIndex + 1,
+                        "aria-setsize": pages.length,
+                        "data-og-document-page": pageIndex + 1,
+                        "data-og-page-width-pt": page.page.widthPt,
+                        "data-og-page-height-pt": page.page.heightPt,
                         className: cn(
-                          layout === "paginated" ? "absolute left-0 top-0 overflow-hidden" : "mx-auto"
+                          "absolute overflow-hidden",
+                          layout === "paginated" ? "border shadow-og-sm" : "left-0 right-0 border-b border-og-border bg-og-surface-1 text-og-fg"
                         ),
                         style: {
-                          ...pageContentStyle(page.page, layout),
-                          maxWidth: layout === "continuous" ? "68rem" : void 0,
-                          ...layout === "paginated" ? {
-                            width: page.page.widthPt * POINT_TO_CSS_PIXEL,
-                            minHeight: page.naturalHeight,
-                            transform: `scale(${page.renderScale})`,
-                            transformOrigin: "top left"
-                          } : {}
+                          top,
+                          // Center against the visible viewport, not the shared width
+                          // reserved for the widest section in this document.
+                          left: layout === "paginated" ? Math.max(16, (measuredViewport.width - pageWidth) / 2) : void 0,
+                          color: layout === "paginated" ? "#171717" : void 0,
+                          backgroundColor: layout === "paginated" ? "#fff" : void 0,
+                          borderColor: layout === "paginated" ? "#0000001a" : void 0,
+                          width: layout === "paginated" ? pageWidth : void 0,
+                          height: page.height,
+                          containerType: layout === "continuous" ? "inline-size" : void 0
                         },
-                        children: page.blocks.map(({ block, listOrdinal }) => /* @__PURE__ */ jsx(
-                          DocumentBlockView,
+                        children: /* @__PURE__ */ jsx(
+                          MeasuredPageBody,
                           {
-                            block,
-                            viewBlockId: blockIdForView(block.id),
-                            comments: annotations.comments.get(block.id) ?? EMPTY_COMMENTS,
-                            changes: annotations.changes.get(block.id) ?? EMPTY_CHANGES,
-                            projectionRevision: localRevision,
-                            listOrdinal,
-                            readOnly,
-                            selected: selectedBlockId === block.id,
-                            openThreadId,
-                            registerEditor: (node) => {
-                              if (node) editorNodes.current.set(block.id, node);
-                              else editorNodes.current.delete(block.id);
+                            pageKey: page.key,
+                            measureToken: documentRevision,
+                            onHeight: recordPageHeight,
+                            className: cn(
+                              layout === "paginated" ? "absolute left-0 top-0 overflow-hidden" : "mx-auto"
+                            ),
+                            style: {
+                              ...pageContentStyle(page.page, layout),
+                              maxWidth: layout === "continuous" ? "68rem" : void 0,
+                              ...layout === "paginated" ? {
+                                width: page.page.widthPt * POINT_TO_CSS_PIXEL,
+                                minHeight: page.naturalHeight,
+                                transform: `scale(${page.renderScale})`,
+                                transformOrigin: "top left"
+                              } : {}
                             },
-                            onThreadToggle: (threadId) => setOpenThreadId((current) => current === threadId ? null : threadId),
-                            onInput: (paragraph, text) => commitText(paragraph, text),
-                            onBlur: () => setLocalRevision(document2.revision),
-                            onSelection: (paragraph) => readDomSelection(paragraph.id),
-                            onKeyDown: handleEditorKeyDown
-                          },
-                          block.id
-                        ))
-                      }
-                    )
-                  },
-                  page.key
-                );
-              }) })
+                            children: page.blocks.map(({ block, listOrdinal }) => /* @__PURE__ */ jsx(
+                              DocumentBlockView,
+                              {
+                                block,
+                                viewBlockId: blockIdForView(block.id),
+                                comments: annotations.comments.get(block.id) ?? EMPTY_COMMENTS,
+                                changes: annotations.changes.get(block.id) ?? EMPTY_CHANGES,
+                                projectionRevision: localRevision,
+                                listOrdinal,
+                                readOnly,
+                                selected: selectedBlockId === block.id,
+                                openThreadId,
+                                registerEditor: (node) => {
+                                  if (node) editorNodes.current.set(block.id, node);
+                                  else editorNodes.current.delete(block.id);
+                                },
+                                onThreadToggle: (threadId) => setOpenThreadId((current) => current === threadId ? null : threadId),
+                                onInput: (paragraph, text) => commitText(paragraph, text),
+                                onBlur: () => setLocalRevision(document2.revision),
+                                onSelection: (paragraph) => readDomSelection(paragraph.id),
+                                onKeyDown: handleEditorKeyDown
+                              },
+                              block.id
+                            ))
+                          }
+                        )
+                      },
+                      page.key
+                    );
+                  })
+                }
+              )
             ]
           }
         )
@@ -670,6 +691,7 @@ function DocumentEditorCore({
 function DocumentArtifactSurface({
   document: document2,
   title,
+  showHeader,
   subtitle,
   busy,
   className,
@@ -681,6 +703,7 @@ function DocumentArtifactSurface({
     {
       modality: "document",
       title,
+      showHeader,
       subtitle,
       busy,
       className,
@@ -699,6 +722,7 @@ function DocumentArtifactSurface({
 function DocumentProjectionArtifactSurface({
   projection,
   title,
+  showHeader,
   subtitle,
   busy,
   className,
@@ -710,6 +734,7 @@ function DocumentProjectionArtifactSurface({
     {
       modality: "document",
       title,
+      showHeader,
       subtitle,
       busy,
       className,
@@ -974,12 +999,13 @@ function DocumentTableView({
   viewBlockId
 }) {
   const columnWidths = table.style.columnWidthsPt;
+  const headerColor = tableHeaderTextColor(table.style.headerFill);
   return /* @__PURE__ */ jsx(
     "div",
     {
       "data-og-document-block": viewBlockId,
       "data-og-block-kind": "table",
-      className: "overflow-x-auto py-2",
+      className: "w-full max-w-full overflow-x-auto py-2",
       children: /* @__PURE__ */ jsxs(
         "table",
         {
@@ -1008,6 +1034,8 @@ function DocumentTableView({
                     style: {
                       borderColor: table.style.borderColor ?? "#d1d5db",
                       background: header ? table.style.headerFill ?? "#f3f4f6" : void 0,
+                      // An explicitly colored run still owns its authored text style.
+                      color: header ? headerColor : void 0,
                       padding: `${table.style.cellPaddingPt ?? 6}pt`
                     },
                     children: cell.map((run, index) => (
@@ -1026,6 +1054,32 @@ function DocumentTableView({
     }
   );
 }
+function tableHeaderTextColor(fill) {
+  if (!fill) return "#171717";
+  const hex = /^#([\da-f]{3}|[\da-f]{6}|[\da-f]{8})$/i.exec(fill)?.[1];
+  if (!hex) return void 0;
+  const channels = hex.length === 3 ? [...hex].map((digit) => Number.parseInt(digit + digit, 16)) : [0, 2, 4].map((index) => Number.parseInt(hex.slice(index, index + 2), 16));
+  const alpha = hex.length === 8 ? Number.parseInt(hex.slice(6), 16) / 255 : 1;
+  const luminanceOn = (backdrop) => {
+    const linear = channels.map((channel) => {
+      const normalized = (channel * alpha + backdrop * (1 - alpha)) / 255;
+      return normalized <= 0.04045 ? normalized / 12.92 : ((normalized + 0.055) / 1.055) ** 2.4;
+    });
+    return linear[0] * 0.2126 + linear[1] * 0.7152 + linear[2] * 0.0722;
+  };
+  const backdrops = alpha < 1 ? [luminanceOn(0), luminanceOn(255)] : [luminanceOn(255)];
+  const darkTextLuminance = ((23 / 255 + 0.055) / 1.055) ** 2.4;
+  const whiteContrast = Math.min(...backdrops.map((value) => 1.05 / (value + 0.05)));
+  const darkContrast = Math.min(
+    ...backdrops.map(
+      (value) => (Math.max(value, darkTextLuminance) + 0.05) / (Math.min(value, darkTextLuminance) + 0.05)
+    )
+  );
+  if (Math.max(whiteContrast, darkContrast) < 4.5) {
+    return alpha < 1 ? void 0 : "#000";
+  }
+  return whiteContrast > darkContrast ? "#fff" : "#171717";
+}
 function ToolbarButton({
   label,
   shortcut,
@@ -1173,12 +1227,12 @@ function visiblePageIndexes(axis, count, scrollTop, viewportHeight, overscan, re
 function responsiveDocumentPageScale(page, viewportWidth) {
   if (viewportWidth <= 0) return 1;
   const naturalWidth = page.widthPt * POINT_TO_CSS_PIXEL;
-  return Math.min(1, Math.max(0.1, (viewportWidth - 32) / naturalWidth));
+  return Math.min(1, Math.max(0.75, (viewportWidth - 32) / naturalWidth));
 }
 function pageContentStyle(page, layout) {
   if (layout === "continuous") {
     return {
-      padding: "24px clamp(24px, 8vw, 96px)"
+      padding: "24px clamp(12px, 4cqw, 72px)"
     };
   }
   return {
@@ -1713,6 +1767,7 @@ var DOCUMENT_COMPOSITION_ATTEMPTS = 3;
 function EditableDocumentArtifactSurface({
   session,
   title,
+  showHeader,
   subtitle,
   readOnly = false,
   onCommit,
@@ -1880,6 +1935,7 @@ function EditableDocumentArtifactSurface({
     {
       ...surfaceProps,
       title,
+      showHeader,
       subtitle: subtitle ?? `${projection.blocks.length} block${projection.blocks.length === 1 ? "" : "s"}${writable ? "" : " \xB7 Read only"}`,
       projection,
       commit: writable ? applyCommit : void 0,
@@ -1892,6 +1948,7 @@ function EditableDocumentArtifactSurface({
     {
       modality: "document",
       title,
+      showHeader,
       subtitle: subtitle ?? status,
       busy: !accessRevoked && !state.error,
       className: surfaceProps.className,
@@ -2192,4 +2249,4 @@ export {
   DocumentProjectionArtifactSurface,
   EditableDocumentArtifactSurface
 };
-//# sourceMappingURL=chunk-XMXRI5JK.js.map
+//# sourceMappingURL=chunk-ZZ4744OZ.js.map