@json-to-office/core-docx 0.7.0 → 0.8.0

package/dist/plugin/example/index.js

@@ -1969,24 +1969,175 @@ var formatDate = (date, formatString = "MMMM d, yyyy") => {
   return format(date, formatString);
 };
 
+// src/styles/utils/componentDefaults.ts
+import { mergeWithDefaults } from "@json-to-office/shared";
+import { mergeWithDefaults as mergeWithDefaults2 } from "@json-to-office/shared";
+function getComponentDefaults(theme) {
+  return theme.componentDefaults || {};
+}
+function getHeadingDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.heading || {};
+}
+function getHeadingDefaultsForLevel(theme, level) {
+  const defaults = {};
+  if (theme.styles) {
+    const styleKey = `heading${level}`;
+    const headingStyle = theme.styles[styleKey];
+    if (headingStyle?.alignment) {
+      defaults.alignment = headingStyle.alignment;
+    }
+  }
+  return defaults;
+}
+function getTextDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.paragraph || {};
+}
+function getImageDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.image || {};
+}
+function getStatisticDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.statistic || {};
+}
+function getTableDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.table || {};
+}
+function getSectionDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.section || {};
+}
+function getColumnsDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.columns || {};
+}
+function getListDefaults(theme) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.list || {};
+}
+function resolveHeadingProps(props, theme) {
+  const defaults = getHeadingDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveParagraphProps(props, theme) {
+  const defaults = getTextDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveImageProps(props, theme) {
+  const defaults = getImageDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveStatisticProps(props, theme) {
+  const defaults = getStatisticDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveTableProps(props, theme) {
+  const defaults = getTableDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveSectionProps(props, theme) {
+  const defaults = getSectionDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveColumnsProps(props, theme) {
+  const defaults = getColumnsDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveListProps(props, theme) {
+  const defaults = getListDefaults(theme);
+  return mergeWithDefaults(props, defaults);
+}
+function resolveHighchartsProps(props, _theme) {
+  return props;
+}
+function getCustomComponentDefaults(theme, componentName) {
+  const defaults = getComponentDefaults(theme);
+  return defaults?.[componentName] || {};
+}
+function resolveCustomComponentProps(props, theme, componentName) {
+  const defaults = getCustomComponentDefaults(theme, componentName);
+  return mergeWithDefaults(props, defaults);
+}
+
+// src/styles/utils/resolveComponentTree.ts
+function resolveHeadingWithLevelDefaults(props, theme) {
+  const resolved = resolveHeadingProps(props, theme);
+  const level = resolved.level || 1;
+  const levelDefaults = getHeadingDefaultsForLevel(theme, level);
+  return {
+    ...resolved,
+    // Only apply level-specific defaults if no explicit alignment in original props
+    ...props.alignment ? {} : levelDefaults
+  };
+}
+var RESOLVER_MAP = {
+  heading: resolveHeadingWithLevelDefaults,
+  paragraph: resolveParagraphProps,
+  image: resolveImageProps,
+  statistic: resolveStatisticProps,
+  table: resolveTableProps,
+  section: resolveSectionProps,
+  columns: resolveColumnsProps,
+  list: resolveListProps,
+  highcharts: resolveHighchartsProps
+};
+function resolveComponentDefaults(component, theme) {
+  if (!component.props) return component;
+  const resolver = RESOLVER_MAP[component.name];
+  const resolvedProps = resolver ? resolver(component.props, theme) : resolveCustomComponentProps(
+    component.props,
+    theme,
+    component.name
+  );
+  return { ...component, props: resolvedProps };
+}
+function resolveComponentTree(components, theme) {
+  return components.map((component) => {
+    const resolved = resolveComponentDefaults(component, theme);
+    const children = resolved.children;
+    if (children && children.length > 0) {
+      return {
+        ...resolved,
+        children: resolveComponentTree(children, theme)
+      };
+    }
+    return resolved;
+  });
+}
+
 // src/core/structure.ts
 async function processDocument(document, theme, themeName) {
   const metadata = createDocumentMetadata(document.props);
+  const docDefaults = document.props.componentDefaults;
+  const effectiveTheme = docDefaults ? {
+    ...theme,
+    componentDefaults: mergeWithDefaults2(
+      docDefaults,
+      theme.componentDefaults || {}
+    )
+  } : theme;
   const context = createRenderContext(
     {
       metadata,
       sections: [],
-      theme,
+      theme: effectiveTheme,
       themeName
     },
-    theme,
+    effectiveTheme,
     themeName
   );
-  const sections = await extractSections(document.children || [], context);
+  const resolvedChildren = resolveComponentTree(
+    document.children || [],
+    effectiveTheme
+  );
+  const sections = await extractSections(resolvedChildren, context);
   return {
     metadata,
     sections,
-    theme,
+    theme: effectiveTheme,
     themeName
   };
 }
@@ -2016,19 +2167,24 @@ async function extractSections(components, context) {
           Math.max(component.props.level || 1, 1),
           6
         );
-        sectionComponents.unshift({
-          name: "heading",
-          props: {
-            text: component.props.title,
-            level: headingLevel,
-            pageBreak: shouldPageBreak,
-            // Apply zero-spacing to prevent unwanted initial line
-            spacing: {
-              before: 0,
-              after: 0
-            }
-          }
-        });
+        sectionComponents.unshift(
+          resolveComponentDefaults(
+            {
+              name: "heading",
+              props: {
+                text: component.props.title,
+                level: headingLevel,
+                pageBreak: shouldPageBreak,
+                // Apply zero-spacing to prevent unwanted initial line
+                spacing: {
+                  before: 0,
+                  after: 0
+                }
+              }
+            },
+            context.fullTheme
+          )
+        );
       }
       sections.push({
         title: component.props?.title,
@@ -2068,18 +2224,23 @@ async function flattenComponents(components, context) {
           Math.max(component.props.level || 1, 1),
           6
         );
-        flattened.push({
-          name: "heading",
-          props: {
-            text: component.props.title,
-            level: headingLevel,
-            // Apply zero-spacing to prevent unwanted initial line
-            spacing: {
-              before: 0,
-              after: 0
-            }
-          }
-        });
+        flattened.push(
+          resolveComponentDefaults(
+            {
+              name: "heading",
+              props: {
+                text: component.props.title,
+                level: headingLevel,
+                // Apply zero-spacing to prevent unwanted initial line
+                spacing: {
+                  before: 0,
+                  after: 0
+                }
+              }
+            },
+            context.fullTheme
+          )
+        );
       }
       flattened.push(...await flattenComponents(component.children, context));
     } else {
@@ -3844,93 +4005,6 @@ async function renderComponentWithCache(component, theme, themeName, context, by
   return rendered;
 }
 
-// src/styles/utils/componentDefaults.ts
-function getComponentDefaults(theme) {
-  return theme.componentDefaults || {};
-}
-function getHeadingDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.heading || {};
-}
-function getHeadingDefaultsForLevel(theme, level) {
-  const defaults = {};
-  if (theme.styles) {
-    const styleKey = `heading${level}`;
-    const headingStyle = theme.styles[styleKey];
-    if (headingStyle?.alignment) {
-      defaults.alignment = headingStyle.alignment;
-    }
-  }
-  return defaults;
-}
-function getTextDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.paragraph || {};
-}
-function getImageDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.image || {};
-}
-function getStatisticDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.statistic || {};
-}
-function getColumnsDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.columns || {};
-}
-function getListDefaults(theme) {
-  const defaults = getComponentDefaults(theme);
-  return defaults?.list || {};
-}
-function deepMerge(target, source) {
-  const output = { ...target };
-  if (isObject(target) && isObject(source)) {
-    Object.keys(source).forEach((key) => {
-      if (isObject(source[key])) {
-        if (!(key in target)) {
-          output[key] = source[key];
-        } else {
-          output[key] = deepMerge(target[key], source[key]);
-        }
-      } else {
-        output[key] = source[key];
-      }
-    });
-  }
-  return output;
-}
-function isObject(item) {
-  return item !== null && typeof item === "object" && !Array.isArray(item);
-}
-function mergeWithDefaults(userConfig, themeDefaults) {
-  return deepMerge(themeDefaults, userConfig);
-}
-function resolveHeadingProps(props, theme) {
-  const defaults = getHeadingDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-function resolveParagraphProps(props, theme) {
-  const defaults = getTextDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-function resolveImageProps(props, theme) {
-  const defaults = getImageDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-function resolveStatisticProps(props, theme) {
-  const defaults = getStatisticDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-function resolveColumnsProps(props, theme) {
-  const defaults = getColumnsDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-function resolveListProps(props, theme) {
-  const defaults = getListDefaults(theme);
-  return mergeWithDefaults(props, defaults);
-}
-
 // src/core/content.ts
 import {
   Paragraph,
@@ -5144,35 +5218,28 @@ function createFooterElement(children, _options) {
 // src/components/heading.ts
 function renderHeadingComponent(component, theme, themeName) {
   if (!isHeadingComponent(component)) return [];
-  const resolvedConfig = resolveHeadingProps(component.props, theme);
-  const level = resolvedConfig.level || 1;
-  const levelDefaults = getHeadingDefaultsForLevel(theme, level);
-  const finalConfig = {
-    ...resolvedConfig,
-    // Only apply level defaults if no explicit alignment was provided in the original props
-    ...component.props.alignment ? {} : levelDefaults
-  };
-  const bookmarkId = component.id || globalBookmarkRegistry.generateId(finalConfig.text, "heading");
+  const config = component.props;
+  const bookmarkId = component.id || globalBookmarkRegistry.generateId(config.text, "heading");
   const header = createHeading(
-    finalConfig.text,
-    finalConfig.level || 1,
+    config.text,
+    config.level || 1,
     theme,
     themeName,
     {
-      alignment: finalConfig.alignment,
-      spacing: finalConfig.spacing,
-      lineSpacing: finalConfig.lineSpacing,
-      columnBreak: finalConfig.columnBreak,
+      alignment: config.alignment,
+      spacing: config.spacing,
+      lineSpacing: config.lineSpacing,
+      columnBreak: config.columnBreak,
       // Local font overrides
-      fontFamily: finalConfig.font?.family,
-      fontSize: finalConfig.font?.size,
-      fontColor: finalConfig.font?.color,
-      bold: finalConfig.font?.bold,
-      italic: finalConfig.font?.italic,
-      underline: finalConfig.font?.underline,
+      fontFamily: config.font?.family,
+      fontSize: config.font?.size,
+      fontColor: config.font?.color,
+      bold: config.font?.bold,
+      italic: config.font?.italic,
+      underline: config.font?.underline,
       // Pagination control
-      keepNext: finalConfig.keepNext,
-      keepLines: finalConfig.keepLines,
+      keepNext: config.keepNext,
+      keepLines: config.keepLines,
       // Bookmark ID for internal linking
       bookmarkId
     }
@@ -5217,7 +5284,7 @@ function parseMarkdownList(text) {
 }
 function renderParagraphComponent(component, theme, themeName) {
   if (!isParagraphComponent(component)) return [];
-  const resolvedConfig = resolveParagraphProps(component.props, theme);
+  const resolvedConfig = component.props;
   const listData = parseMarkdownList(resolvedConfig.text);
   if (listData) {
     const reference = globalNumberingRegistry.generateReference("markdown-list");
@@ -5402,7 +5469,7 @@ function fillMissingLevels(levels, maxLevel) {
 }
 function renderListComponent(component, theme, themeName) {
   if (!isListComponent(component)) return [];
-  const resolvedConfig = resolveListProps(component.props, theme);
+  const resolvedConfig = component.props;
   const maxLevel = getMaxLevelFromItems(resolvedConfig.items);
   const reference = resolvedConfig.reference || globalNumberingRegistry.generateReference("list");
   if (!globalNumberingRegistry.has(reference)) {
@@ -5433,7 +5500,7 @@ function renderListComponent(component, theme, themeName) {
 // src/components/image.ts
 async function renderImageComponent(component, theme, themeName) {
   if (!isImageComponent(component)) return [];
-  const resolvedConfig = resolveImageProps(component.props, theme);
+  const resolvedConfig = component.props;
   const imageSource = resolvedConfig.base64 || resolvedConfig.path;
   if (!imageSource) {
     throw new Error(
@@ -5793,7 +5860,6 @@ async function renderColumnsComponent(component, theme, themeName, context) {
   if (context.parent && isTextBoxComponent(context.parent)) {
     return await renderColumnsAsTable(component, theme, themeName, context);
   }
-  resolveColumnsProps(component.props, theme);
   const elements = [];
   if (component.children) {
     for (const child of component.children) {
@@ -5905,9 +5971,9 @@ async function renderColumnsAsTable(component, theme, themeName, context) {
 }
 
 // src/components/statistic.ts
-function renderStatisticComponent(component, theme) {
+function renderStatisticComponent(component, _theme) {
   if (!isStatisticComponent(component)) return [];
-  const resolvedConfig = resolveStatisticProps(component.props, theme);
+  const resolvedConfig = component.props;
   return createStatistic(
     {
       number: resolvedConfig.number,