pptx-react-viewer 4.29.0 → 4.30.1

package/dist/{chunk-CTL42ZRR.js → chunk-XRFJ7TAF.js}

@@ -1846,7 +1846,9 @@ function getShapeVisualStyle(element, _hasFill, fillColor, _strokeWidth, _stroke
     // An unstroked element must occupy EXACTLY its authored box, so the
     // selection/hover affordance is an `outline` (see `ElementRenderer`) and
     // the border collapses to 0 rather than to a transparent 1px.
-    borderWidth: stroke.borderWidth,
+    // On screen the painted width never drops under one device pixel (shared
+    // `device-pixel-stroke`); an unstroked element keeps a plain `0`.
+    borderWidth: stroke.borderWidth > 0 ? stroke.cssBorderWidth : 0,
     borderColor: animatesStroke ? void 0 : stroke.borderColor,
     borderStyle: stroke.borderStyle,
     // Inherited SVG presentation properties: written on the container so the
@@ -1908,7 +1910,7 @@ function getShapeVisualStyle(element, _hasFill, fillColor, _strokeWidth, _stroke
         ...base,
         backgroundColor: "transparent",
         borderWidth: 0,
-        borderTopWidth: geometry.strokeWidth,
+        borderTopWidth: pptx.screenStrokeWidth(geometry.strokeWidth),
         borderTopColor: stroke.borderColor,
         borderTopStyle: stroke.borderStyle ?? "solid"
       };
@@ -2006,7 +2008,11 @@ function strokeStrands(d, keyBase, ctx) {
       strokeLinejoin: ctx.lineJoin,
       strokeMiterlimit: ctx.miterLimit,
       vectorEffect: "non-scaling-stroke",
-      style: offset !== 0 ? { transform: `translate(0, ${offset}px)` } : void 0
+      style: {
+        // Never under one device pixel on screen (shared `device-pixel-stroke`).
+        strokeWidth: pptx.screenStrokeWidth(Math.max(ctx.widths[idx] ?? ctx.strokeWidth, 1)),
+        transform: offset !== 0 ? `translate(0, ${offset}px)` : void 0
+      }
     },
     `${keyBase}-s${idx}`
   ));
@@ -2090,6 +2096,7 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
     const height = Math.max(element.height, 1);
     const rim = Math.max(Math.min(height * 0.16, 28), 6);
     const stroke = Math.max(strokeWidth, 1);
+    const screenStroke = { strokeWidth: pptx.screenStrokeWidth(stroke) };
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "svg",
       {
@@ -2108,7 +2115,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
               stroke: strokeWidth > 0 ? strokePaint : "none",
               strokeWidth: stroke,
               strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
+              vectorEffect: "non-scaling-stroke",
+              style: screenStroke
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -2122,7 +2130,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
               stroke: strokeWidth > 0 ? strokePaint : "none",
               strokeWidth: stroke,
               strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
+              vectorEffect: "non-scaling-stroke",
+              style: screenStroke
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -2136,7 +2145,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
               stroke: strokeWidth > 0 ? strokePaint : "none",
               strokeWidth: stroke,
               strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
+              vectorEffect: "non-scaling-stroke",
+              style: screenStroke
             }
           )
         ]
@@ -2188,7 +2198,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
               stroke: strokePaint,
               strokeWidth: strokeWidth * 2,
               strokeDasharray: dashArray,
-              vectorEffect: "non-scaling-stroke"
+              vectorEffect: "non-scaling-stroke",
+              style: { strokeWidth: `calc(2 * ${pptx.screenStrokeWidth(strokeWidth)})` }
             }
           )
         }
@@ -2231,7 +2242,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
                 stroke: strokeWidth > 0 ? strokePaint : "none",
                 strokeWidth,
                 strokeDasharray: dashArray,
-                vectorEffect: "non-scaling-stroke"
+                vectorEffect: "non-scaling-stroke",
+                style: { strokeWidth: pptx.screenStrokeWidth(strokeWidth) }
               }
             )
           ]
@@ -2278,7 +2290,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
                 y2: 0,
                 stroke: strokePaint,
                 strokeWidth: lineStroke,
-                vectorEffect: "non-scaling-stroke"
+                vectorEffect: "non-scaling-stroke",
+                style: { strokeWidth: pptx.screenStrokeWidth(lineStroke) }
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -2291,7 +2304,8 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
                 strokeDasharray: dashArray,
                 strokeLinecap: "round",
                 strokeLinejoin: "round",
-                vectorEffect: "non-scaling-stroke"
+                vectorEffect: "non-scaling-stroke",
+                style: { strokeWidth: pptx.screenStrokeWidth(lineStroke) }
               }
             )
           ]
@@ -2356,6 +2370,7 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
               vectorEffect: "non-scaling-stroke",
               style: {
                 pointerEvents: "none",
+                strokeWidth: pptx.screenStrokeWidth(Math.max(widths[idx] ?? strokeWidth, 1)),
                 ...offset !== 0 ? { transform: `translate(0, ${offset}px)` } : {}
               }
             },
@@ -2367,8 +2382,6 @@ function renderVectorShape(element, hasFill, fillColor, strokeWidth, strokeColor
   }
   return null;
 }
-
-// src/viewer/utils/table-cell-fill.tsx
 function parseGradientFillCss(gradFill) {
   if (!gradFill) {
     return void 0;
@@ -2543,7 +2556,11 @@ function parseCellBorders(cellProperties) {
     if (color) {
       const opacity = pptx.parseDrawingColorOpacity(ln["a:solidFill"]);
       const key = `${edge.prefix}`;
-      borderStyle[key] = `${widthPx}px ${cssBorderStyle} ${pptx.colorWithOpacity(color, opacity)}`;
+      borderStyle[key] = pptx.screenBorder(
+        widthPx,
+        cssBorderStyle,
+        pptx.colorWithOpacity(color, opacity)
+      );
     }
   }
   return borderStyle;
@@ -2825,26 +2842,37 @@ function parseTableElementData(element, fallbackTextStyle) {
   };
 }
 function renderTableCellContent(cell, fallbackText) {
+  const blocks = cell ? pptx.cellParagraphBlocks(cell) : void 0;
+  if (blocks) {
+    return blocks.map((block, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        style: { display: "block", ...block.css },
+        children: block.runs.map(renderRun)
+      },
+      `p-${index}`
+    ));
+  }
   const runs = cell?.textRuns;
   if (!runs || runs.length === 0) {
-    return fallbackText || "\xA0";
+    return fallbackText || " ";
   }
-  return runs.map((run, index) => {
-    if (run.isParagraphBreak) {
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "block", height: 0 } }, `p-${index}`);
-    }
-    if (run.isLineBreak) {
-      return /* @__PURE__ */ jsxRuntime.jsx("br", {}, `br-${index}`);
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        style: { position: "relative", ...pptx.cellRunStyle(run) },
-        children: run.text
-      },
-      `r-${index}`
-    );
-  });
+  return runs.map(
+    (run, index) => run.isParagraphBreak ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "block", height: 0 } }, `p-${index}`) : renderRun(run, index)
+  );
+}
+function renderRun(run, index) {
+  if (run.isLineBreak) {
+    return /* @__PURE__ */ jsxRuntime.jsx("br", {}, `br-${index}`);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      style: { position: "relative", ...pptx.cellRunStyle(run) },
+      children: run.text
+    },
+    `r-${index}`
+  );
 }
 function getCellDiagonalBorders(style, tableData, pos, styleCtx) {
   return pptx.getCellDiagonalBorders(style, tableData, pos, {
@@ -2882,7 +2910,8 @@ function TableCellDiagonalBorders({
             x2: "100%",
             y2: "100%",
             stroke: diag.diagDownColor,
-            strokeWidth: diag.diagDownWidth
+            strokeWidth: diag.diagDownWidth,
+            style: { strokeWidth: pptx.screenStrokeWidth(diag.diagDownWidth) }
           }
         ),
         hasUp && /* @__PURE__ */ jsxRuntime.jsx(
@@ -2893,7 +2922,8 @@ function TableCellDiagonalBorders({
             x2: "100%",
             y2: "0",
             stroke: diag.diagUpColor,
-            strokeWidth: diag.diagUpWidth
+            strokeWidth: diag.diagUpWidth,
+            style: { strokeWidth: pptx.screenStrokeWidth(diag.diagUpWidth) }
           }
         )
       ]
@@ -3470,10 +3500,7 @@ function partAttrs(part) {
   return part ? pptx.chartPartToAttrs(part) : void 0;
 }
 function resolveReactPalette(chartData) {
-  if (chartData.colorPalette && chartData.colorPalette.length > 0) {
-    return chartData.colorPalette;
-  }
-  return [...pptx.getChartStylePalette(chartData.style?.styleId)];
+  return pptx.resolveChartPalette(chartData);
 }
 function buildReactChartViewModel(element) {
   if (element.type !== "chart" || !element.chartData) {
@@ -3594,25 +3621,8 @@ function renderPrimitive(prim, key) {
         key
       );
     }
-    case "text": {
-      const t = prim;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "text",
-        {
-          x: t.x,
-          y: t.y,
-          textAnchor: t.textAnchor,
-          fontSize: t.fontSize,
-          fill: t.fill,
-          fontWeight: t.fontWeight ?? "normal",
-          dominantBaseline: t.dominantBaseline,
-          opacity: t.opacity ?? 1,
-          transform: t.transform,
-          children: t.text
-        },
-        key
-      );
-    }
+    case "text":
+      return renderText(prim, key);
     default:
       return null;
   }

package/dist/index.d.ts

@@ -394,6 +394,11 @@ interface PowerPointViewerProps extends ViewportFitOptions {
    * the user's own collapse toggle and the `slidesPane` customisation panel.
    */
   showThumbnails?: boolean;
+  /**
+   * Show the compatibility warning toast stack after a load. Default `true`.
+   * `false` hides the stack only; the warnings are still collected.
+   */
+  showCompatibilityToasts?: boolean;
   /**
    * Hide individual toolbar buttons and/or ribbon tabs instead of the whole
    * toolbar. Accepts any mix of button ids (`share`, `broadcast`, `export`,

package/dist/index.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var chunk7JMO6R6B_js = require('./chunk-7JMO6R6B.js');
-var chunkK3EGXT6W_js = require('./chunk-K3EGXT6W.js');
-var chunkCTL42ZRR_js = require('./chunk-CTL42ZRR.js');
+var chunkM2AKDETN_js = require('./chunk-M2AKDETN.js');
+var chunk355ICDU6_js = require('./chunk-355ICDU6.js');
+var chunkXRFJ7TAF_js = require('./chunk-XRFJ7TAF.js');
 require('./chunk-DFFCFNK2.js');
 var pptx = require('ooxml-ui/pptx');
 var i18n = require('ooxml-ui/pptx/i18n');
@@ -11,87 +11,87 @@ var i18n = require('ooxml-ui/pptx/i18n');
 
 Object.defineProperty(exports, "PowerPointViewer", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.PowerPointViewer; }
+  get: function () { return chunkM2AKDETN_js.PowerPointViewer; }
 });
 Object.defineProperty(exports, "SlideCanvas", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.SlideCanvas; }
+  get: function () { return chunkM2AKDETN_js.SlideCanvas; }
 });
 Object.defineProperty(exports, "SlideTemplateGalleryDialog", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.SlideTemplateGalleryDialog; }
+  get: function () { return chunkM2AKDETN_js.SlideTemplateGalleryDialog; }
 });
 Object.defineProperty(exports, "SlideTemplatePreview", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.SlideTemplatePreview; }
+  get: function () { return chunkM2AKDETN_js.SlideTemplatePreview; }
 });
 Object.defineProperty(exports, "THEME_CATALOG", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.THEME_CATALOG; }
+  get: function () { return chunkM2AKDETN_js.THEME_CATALOG; }
 });
 Object.defineProperty(exports, "Toolbar", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.Toolbar; }
+  get: function () { return chunkM2AKDETN_js.Toolbar; }
 });
 Object.defineProperty(exports, "ViewerThemeProvider", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.ViewerThemeProvider; }
+  get: function () { return chunkM2AKDETN_js.ViewerThemeProvider; }
 });
 Object.defineProperty(exports, "defaultCssVars", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.defaultCssVars; }
+  get: function () { return chunkM2AKDETN_js.defaultCssVars; }
 });
 Object.defineProperty(exports, "defaultRadius", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.defaultRadius; }
+  get: function () { return chunkM2AKDETN_js.defaultRadius; }
 });
 Object.defineProperty(exports, "defaultThemeColors", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.defaultThemeColors; }
+  get: function () { return chunkM2AKDETN_js.defaultThemeColors; }
 });
 Object.defineProperty(exports, "resolveThemeCatalogEntry", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.resolveThemeCatalogEntry; }
+  get: function () { return chunkM2AKDETN_js.resolveThemeCatalogEntry; }
 });
 Object.defineProperty(exports, "themeToCssVars", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.themeToCssVars; }
+  get: function () { return chunkM2AKDETN_js.themeToCssVars; }
 });
 Object.defineProperty(exports, "useViewerTheme", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.useViewerTheme; }
+  get: function () { return chunkM2AKDETN_js.useViewerTheme; }
 });
 Object.defineProperty(exports, "vermilionDarkColors", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.vermilionDarkColors; }
+  get: function () { return chunkM2AKDETN_js.vermilionDarkColors; }
 });
 Object.defineProperty(exports, "vermilionDarkTheme", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.vermilionDarkTheme; }
+  get: function () { return chunkM2AKDETN_js.vermilionDarkTheme; }
 });
 Object.defineProperty(exports, "vermilionLightColors", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.vermilionLightColors; }
+  get: function () { return chunkM2AKDETN_js.vermilionLightColors; }
 });
 Object.defineProperty(exports, "vermilionLightTheme", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.vermilionLightTheme; }
+  get: function () { return chunkM2AKDETN_js.vermilionLightTheme; }
 });
 Object.defineProperty(exports, "vermilionRadius", {
   enumerable: true,
-  get: function () { return chunk7JMO6R6B_js.vermilionRadius; }
+  get: function () { return chunkM2AKDETN_js.vermilionRadius; }
 });
 Object.defineProperty(exports, "renderToCanvas", {
   enumerable: true,
-  get: function () { return chunkK3EGXT6W_js.renderToCanvas; }
+  get: function () { return chunk355ICDU6_js.renderToCanvas; }
 });
 Object.defineProperty(exports, "useViewerBuildingBlocks", {
   enumerable: true,
-  get: function () { return chunkK3EGXT6W_js.useViewerBuildingBlocks; }
+  get: function () { return chunk355ICDU6_js.useViewerBuildingBlocks; }
 });
 Object.defineProperty(exports, "getAnimationInitialStyle", {
   enumerable: true,
-  get: function () { return chunkCTL42ZRR_js.getAnimationInitialStyle; }
+  get: function () { return chunkXRFJ7TAF_js.getAnimationInitialStyle; }
 });
 Object.defineProperty(exports, "AVATAR_COLOR_SWATCHES", {
   enumerable: true,

package/dist/index.mjs

@@ -1,6 +1,6 @@
-export { PowerPointViewer, SlideCanvas, SlideTemplateGalleryDialog, SlideTemplatePreview, THEME_CATALOG, Toolbar, ViewerThemeProvider, defaultCssVars, defaultRadius, defaultThemeColors, resolveThemeCatalogEntry, themeToCssVars, useViewerTheme, vermilionDarkColors, vermilionDarkTheme, vermilionLightColors, vermilionLightTheme, vermilionRadius } from './chunk-6YOFWVII.mjs';
-export { renderToCanvas, useViewerBuildingBlocks } from './chunk-EW45F35P.mjs';
-export { getAnimationInitialStyle } from './chunk-VI575UU6.mjs';
+export { PowerPointViewer, SlideCanvas, SlideTemplateGalleryDialog, SlideTemplatePreview, THEME_CATALOG, Toolbar, ViewerThemeProvider, defaultCssVars, defaultRadius, defaultThemeColors, resolveThemeCatalogEntry, themeToCssVars, useViewerTheme, vermilionDarkColors, vermilionDarkTheme, vermilionLightColors, vermilionLightTheme, vermilionRadius } from './chunk-FPACF36E.mjs';
+export { renderToCanvas, useViewerBuildingBlocks } from './chunk-CHZJORUW.mjs';
+export { getAnimationInitialStyle } from './chunk-ATGP75C4.mjs';
 import './chunk-GDQSMJQZ.mjs';
 export { AVATAR_COLOR_SWATCHES, BACKSTAGE_CARD_IDS, BACKSTAGE_PAGE_IDS, CANVAS_CONTEXT_MENU_COMMAND_IDS, DEFAULT_VIEWER_PROFILE, EDITOR_SHORTCUT_ACTION_IDS, ELEMENT_CONTEXT_MENU_COMMAND_IDS, OPTIONS_PAGE_IDS, OPTIONS_SECTION_IDS, OPTIONS_SETTING_IDS, PPTX_OPEN_ACCEPT, PRESENTATION_OPEN_EXTENSIONS, RIBBON_TAB_IDS, SLIDE_TEMPLATES, TOOLBAR_BUTTON_IDS, VIEWER_DIALOG_IDS, VIEWER_EXPORT_FORMAT_IDS, VIEWER_FEATURE_IDS, VIEWER_PANEL_IDS, VIEWER_PREFS_STORAGE_KEY, buildSlideTemplateContent, buildSlideTemplateSlide, clearAllLocalViewerData, clearStoredViewerPrefs, createImageElementFromFile, describeCollaborationShellState, getLocalStorageUsageSummary, isLegacyBinaryPresentation, isSupportedPresentationFile, presentationBaseName, readStoredViewerPrefs, resolveProfileInitial, saveViewerProfile, savedPresentationFileName, writeStoredViewerPrefs } from 'ooxml-ui/pptx';
 export { LOCALE_CATALOG } from 'ooxml-ui/pptx/i18n';