abstract-sheet 0.0.3 → 0.0.5

package/src/abstract-sheet-exporters/react.tsx

@@ -0,0 +1,185 @@
+import React from "react";
+import { AbstractSheet, BorderStyle, Style } from "../abstract-sheet/abstract-sheet";
+
+export function toReact({ abstractSheet }: { readonly abstractSheet: AbstractSheet }): JSX.Element {
+  const styles = React.useMemo(
+    () => Object.fromEntries(abstractSheet.styles?.map((s) => [s.name, s]) ?? []),
+    [abstractSheet.styles]
+  );
+
+  return (
+    <div className="abstract-sheet">
+      {abstractSheet.sheets.map((s, si) => {
+        const maxCols = s.cells.reduce((a, c) => Math.max(a, c.length), 0);
+        const colArray = Array.from({ length: maxCols }, (_, i) => i);
+        return (
+          <div
+            className={`sheet sheet-${si} sheet-${s.name}`}
+            key={s.name}
+            style={{
+              display: "grid",
+              width: "max-content",
+              height: "max-content",
+              border: "1px solid rgb(200,200,200)",
+              gridTemplateRows: `${(s.direction === "col" ? colArray : s.cells)
+                .map((_, ri) => {
+                  const info = s.rowInfo?.[ri];
+                  return info?.hidden
+                    ? ""
+                    : info?.heightPixels !== undefined
+                    ? `${info.heightPixels}px`
+                    : "minmax(18px, max-content)";
+                })
+                .join(" ")}`,
+              gridTemplateColumns: `${(s.direction === "col" ? s.cells : colArray)
+                .map((_, ci) => {
+                  const co = s.colInfo?.[ci];
+                  return co?.hidden
+                    ? ""
+                    : co?.widthPixels !== undefined
+                    ? `${co.widthPixels}px`
+                    : "minmax(64px, max-content)";
+                })
+                .join(" ")}`,
+            }}
+          >
+            {s.cells.map((cells, cellsIdx) => (
+              <div
+                key={cellsIdx}
+                className={`cells cells-${cellsIdx}`}
+                style={{
+                  display: "grid",
+                  ...(s.direction === "col"
+                    ? { gridTemplateRows: `subgrid`, gridRow: "1 / -1" }
+                    : { gridTemplateColumns: `subgrid`, gridColumn: "1 / -1" }),
+                }}
+              >
+                {Array.from({ length: maxCols }, (_, i) => i).map((ci) => {
+                  const c = cells[ci];
+                  let s: Partial<Style> = {};
+                  if (c?.styles !== undefined) {
+                    for (const style of c.styles) {
+                      s = { ...s!, ...styles[style] };
+                    }
+                  }
+                  return (
+                    <div
+                      className={`cell cell-${ci} cell-${c?.type}`}
+                      key={ci}
+                      style={{
+                        padding: "1px",
+                        background: s.foreground,
+                        justifyContent:
+                          s.horizontal === "right"
+                            ? "end"
+                            : s.horizontal === "left"
+                            ? "start"
+                            : s.horizontal === "center"
+                            ? "center"
+                            : c?.type === "number"
+                            ? "end"
+                            : "start",
+                        display: "flex",
+                        alignItems:
+                          s.vertical === "top"
+                            ? "start"
+                            : s.vertical === "bottom"
+                            ? "end"
+                            : s.vertical === "center"
+                            ? "center"
+                            : c?.type === "number"
+                            ? "end"
+                            : "center ",
+                        borderTop: `${borderWidth(
+                          s.borderStyle?.top ?? (s.borderColor?.top ? "medium" : undefined)
+                        )} ${borderStyle(s.borderStyle?.top)} ${
+                          s.borderColor?.top ?? s.foreground ?? "rgb(200,200,200)"
+                        } `,
+                        borderRight: `${borderWidth(
+                          s.borderStyle?.right ?? (s.borderColor?.right ? "medium" : undefined)
+                        )} ${borderStyle(s.borderStyle?.right)} ${
+                          s.borderColor?.right ?? s.foreground ?? "rgb(200,200,200)"
+                        } `,
+                        borderBottom: `${borderWidth(
+                          s.borderStyle?.bottom ?? (s.borderColor?.bottom ? "medium" : undefined)
+                        )} ${borderStyle(s.borderStyle?.bottom)} ${
+                          s.borderColor?.bottom ?? s.foreground ?? "rgb(200,200,200)"
+                        } `,
+                        borderLeft: `${borderWidth(
+                          s.borderStyle?.left ?? (s.borderColor?.left ? "medium" : undefined)
+                        )} ${borderStyle(s.borderStyle?.left)} ${
+                          s.borderColor?.left ?? s.foreground ?? "rgb(200,200,200)"
+                        } `,
+                      }}
+                    >
+                      <div
+                        className={`value value-${ci} value-${c?.type}`}
+                        style={{
+                          fontFamily: "calibri",
+                          textDecoration: [s.strike ? "line-through" : "", s.underline ? "underline" : ""].join(" "),
+                          fontWeight: s.bold ? "bold" : undefined,
+                          fontStyle: s.italic ? "italic" : undefined,
+                          fontSize: `${s.size ?? 11}px`,
+                          lineHeight: `${s.size ?? 11}px`,
+                          height: `${s.size ?? 11}px`,
+                          color: s.color ? s.color : undefined,
+                          transform: s.textRotation ? `rotate(${s.textRotation})` : undefined,
+                        }}
+                      >
+                        {typeof c?.value === "object" ? c.value.toISOString() : c?.value ?? ""}
+                      </div>
+                    </div>
+                  );
+                })}
+              </div>
+            ))}
+          </div>
+        );
+      })}
+    </div>
+  );
+}
+
+function borderWidth(border: BorderStyle | undefined): string {
+  switch (border) {
+    case "hair":
+    case "thin":
+    default:
+    case undefined:
+      return "1px";
+    case "thick":
+      return "3px";
+    case "mediumDashDot":
+    case "mediumDashDotDot":
+    case "mediumDashed":
+    case "dotted":
+    case "dashDotDot":
+    case "slantDashDot":
+    case "dashed":
+    case "dashDot":
+    case "medium":
+      return "2px";
+  }
+}
+
+function borderStyle(border: BorderStyle | undefined): string {
+  switch (border) {
+    case "dashDot":
+    case "mediumDashDot":
+    case "mediumDashDotDot":
+    case "mediumDashed":
+    case "dashDotDot":
+    case "slantDashDot":
+    case "dashed":
+      return "dashed";
+    case "hair":
+    case "dotted":
+      return "dotted";
+    case undefined:
+    case "medium":
+    case "thick":
+    case "thin":
+    default:
+      return "solid";
+  }
+}

package/src/abstract-sheet-exporters/xlsx.ts

@@ -1,14 +1,17 @@
 import * as XLSX from "xlsx-js-style";
 import { AbstractSheet } from "../abstract-sheet/abstract-sheet";
-import { createStyle, xlsxWorkSheet } from "./_xlsx-sheet";
+import { xlsxWorkSheet } from "./_xlsx-sheet";
+import { createStyle } from "./_style";
 
-export function toXlsx(as: AbstractSheet): Buffer {
+export function toXlsx(...abstractSheets: ReadonlyArray<AbstractSheet>): Buffer {
   const sheets: Record<string, XLSX.WorkSheet> = {};
   const sheetNames = Array<string>();
-  const styles = Object.fromEntries(as.styles?.map((s) => [s.name, createStyle(s)]) ?? []);
-  for (const s of as.sheets) {
-    sheetNames.push(s.name);
-    sheets[s.name] = xlsxWorkSheet(s, styles);
+  for (const as of abstractSheets) {
+    const styles = Object.fromEntries(as.styles?.map((s) => [s.name, createStyle(s)]) ?? []);
+    for (const s of as.sheets) {
+      sheetNames.push(s.name);
+      sheets[s.name] = xlsxWorkSheet(s, styles);
+    }
   }
   const wb: XLSX.WorkBook = { Sheets: sheets, SheetNames: Object.keys(sheets) };
   return XLSX.write(wb, { bookType: "xlsx", bookSST: false, type: "buffer" });

package/src/abstract-sheet-xml/abstract-sheet-xml.ts

@@ -3,43 +3,48 @@ import {
   Cell,
   ColInfo,
   ColInfos,
-  Row,
+  Cells,
   RowInfo,
   RowInfos,
-  Rows,
   Sheet,
-  Sheets,
   Style,
   Styles,
+  AbstractSheet,
 } from "../abstract-sheet/abstract-sheet";
 import { xsd } from "../abstract-sheet/abstract-sheet-xsd";
-import { parseXml, parseXsd, XmlElement } from "./mustache-xml";
+import { parseMustacheXml, parseXsd, XmlElement } from "./mustache-xml";
 
-export function abstractSheetXml(el: XmlElement): unknown {
+export const abstractSheetXml = (
+  template: string,
+  data: any,
+  partials: Record<string, string>,
+  sheetPrefix?: string
+): AbstractSheet => abstractSheetOfXml(parseMustacheXml(template, data, partials)[0]!, sheetPrefix) as AbstractSheet;
+
+export function abstractSheetOfXml(el: XmlElement, sheetPrefix?: string): unknown {
   const children = Array<unknown>();
   const childElements = Array<XmlElement>();
   for (const child of el.children ?? []) {
     if (child.tagName !== undefined) {
-      children.push(abstractSheetXml(child));
+      children.push(abstractSheetOfXml(child, sheetPrefix));
       childElements.push(child);
     }
   }
+
   switch (el.tagName) {
     case "AbstractSheet":
       let styles: Styles | undefined = undefined;
-      let sheets: Sheets = [];
+      const sheets: Array<Sheet> = [];
       childElements.forEach((childEl, i) => {
-        if (childEl.tagName === "Sheets") {
-          sheets = children[i] as Sheets;
+        if (childEl.tagName === "Sheet") {
+          sheets.push(children[i] as Sheet);
         } else if (childEl.tagName === "Styles") {
           styles = children[i] as Styles;
         }
       });
-      return { styles, sheets };
-    case "Sheets":
-      return children as Sheets;
+      return { styles, sheets } satisfies AbstractSheet;
     case "Sheet": {
-      let rows: Rows = [];
+      const cells: Array<Cells> = [];
       let colInfo: ColInfos | undefined = undefined;
       let rowInfo: RowInfos | undefined = undefined;
       childElements.forEach((childEl, i) => {
@@ -47,16 +52,17 @@ export function abstractSheetXml(el: XmlElement): unknown {
           colInfo = children[i] as ColInfos;
         } else if (childEl.tagName === "RowInfos") {
           rowInfo = children[i] as RowInfos;
-        } else if (childEl.tagName === "Rows") {
-          rows = children[i] as Rows;
+        } else if (childEl.tagName === "Cells") {
+          cells.push(children[i] as Cells);
         }
       });
       return {
-        name: ((el.attributes as Partial<Record<keyof Sheet, unknown>>)?.name ?? "") as string,
-        rows,
+        name: `${sheetPrefix ?? ""}${((el.attributes as Partial<Record<keyof Sheet, unknown>>)?.name ?? "") as string}`,
+        cells,
         colInfo,
         rowInfo,
-      };
+        direction: ((el.attributes as Partial<Record<keyof Sheet, unknown>>)?.direction ?? "") as Sheet["direction"],
+      } satisfies Sheet;
     }
     case "ColInfos":
       return children as ColInfos;
@@ -66,12 +72,19 @@ export function abstractSheetXml(el: XmlElement): unknown {
       return children as RowInfos;
     case "RowInfo":
       return el.attributes as RowInfo;
-    case "Rows":
-      return children as Rows;
-    case "Row":
-      return children as Row;
+    case "Cells":
+      return children as Cells;
     case "Cell": {
-      return { ...el.attributes, styles: el.attributes.styles?.split(",") } as Cell;
+      const styles = el.attributes.styles?.split(",");
+      if (el.attributes.number !== undefined) {
+        return { ...el.attributes, type: "number", value: el.attributes.number, styles } as Cell;
+      } else if (el.attributes.bool !== undefined) {
+        return { ...el.attributes, type: "boolean", value: el.attributes.boolean, styles } as Cell;
+      } else if (el.attributes.date !== undefined) {
+        return { ...el.attributes, type: "date", value: el.attributes.date, styles } as Cell;
+      } else {
+        return { ...el.attributes, type: "string", value: el.attributes.text, styles } as Cell;
+      }
     }
     case "Styles":
       return children as Styles;