@pinkpixel/marzipan 1.1.2 → 1.2.1

package/dist/styles.js

@@ -800,7 +800,7 @@ export function generateStyles(options = {}) {
     .marzipan-preview .marzipan-table {
       border-collapse: collapse !important;
       margin: 1em 0 !important;
-      width: 100% !important;
+      width: auto !important;
       overflow: auto !important;
       display: table !important;
     }
@@ -830,6 +830,70 @@ export function generateStyles(options = {}) {
     .marzipan-preview .marzipan-table tr {
       display: table-row !important;
     }
+
+    /* Table alignment (parsed from GFM :--- :---: ---: markers) */
+    .marzipan-preview .marzipan-table th[style*="text-align: center"],
+    .marzipan-preview .marzipan-table td[style*="text-align: center"] {
+      text-align: center !important;
+    }
+    .marzipan-preview .marzipan-table th[style*="text-align: right"],
+    .marzipan-preview .marzipan-table td[style*="text-align: right"] {
+      text-align: right !important;
+    }
+
+    /* Table style presets */
+    .marzipan-preview .marzipan-table.mz-table-striped tr:nth-child(odd) td {
+      background: transparent !important;
+    }
+    .marzipan-preview .marzipan-table.mz-table-striped tr:nth-child(even) td {
+      background: var(--bg-secondary, rgba(128,128,128,0.08)) !important;
+    }
+
+    .marzipan-preview .marzipan-table.mz-table-rainbow tr:nth-child(even) td { background: transparent !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+1) td { background: rgba(236,72,153,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+2) td { background: rgba(139,92,246,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+3) td { background: rgba(6,182,212,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+4) td { background: rgba(16,185,129,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+5) td { background: rgba(245,158,11,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow tbody tr:nth-child(6n+6) td { background: rgba(59,130,246,0.10) !important; }
+    .marzipan-preview .marzipan-table.mz-table-rainbow th {
+      background: rgba(236,72,153,0.18) !important;
+    }
+
+    .marzipan-preview .marzipan-table.mz-table-minimal {
+      border: none !important;
+    }
+    .marzipan-preview .marzipan-table.mz-table-minimal th,
+    .marzipan-preview .marzipan-table.mz-table-minimal td {
+      border: none !important;
+      border-bottom: 1px solid var(--border, rgba(128,128,128,0.25)) !important;
+    }
+    .marzipan-preview .marzipan-table.mz-table-minimal th {
+      border-bottom: 2px solid var(--border, rgba(128,128,128,0.5)) !important;
+      background: transparent !important;
+    }
+    .marzipan-preview .marzipan-table.mz-table-minimal tr:nth-child(even) td {
+      background: transparent !important;
+    }
+
+    /* Table border style presets */
+    .marzipan-preview .marzipan-table.mz-border-dashed th,
+    .marzipan-preview .marzipan-table.mz-border-dashed td {
+      border-style: dashed !important;
+    }
+    .marzipan-preview .marzipan-table.mz-border-dotted th,
+    .marzipan-preview .marzipan-table.mz-border-dotted td {
+      border-style: dotted !important;
+    }
+    .marzipan-preview .marzipan-table.mz-border-double th,
+    .marzipan-preview .marzipan-table.mz-border-double td {
+      border-style: double !important;
+      border-width: 3px !important;
+    }
+    .marzipan-preview .marzipan-table.mz-border-none th,
+    .marzipan-preview .marzipan-table.mz-border-none td {
+      border-color: transparent !important;
+    }
     
     /* In preview mode - hide table syntax markers */
     .marzipan-container.preview-mode .marzipan-wrapper .marzipan-preview .table-row,

package/dist/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,cAAc;AACd;;;GAGG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAC,UAAe,EAAE;IAC9C,MAAM,EACJ,QAAQ,GAAG,MAAM,EACjB,UAAU,GAAG,GAAG;IAChB,iFAAiF;IACjF,UAAU,GAAG,kNAAkN,EAC/N,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,IAAI,EACZ,MAAM,GAAG,EAAE,EACZ,GAAG,OAAO,CAAC;IAEZ,4BAA4B;IAC5B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;UAI9C,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;SACrB,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,GAAG,CAAC,EAAE,EAAE;QACnB,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;QAC9D,OAAO,GAAG,OAAO,KAAK,GAAG,cAAc,CAAC;IAC1C,CAAC,CAAC;SACD,IAAI,CAAC,YAAY,CAAC;;;GAG1B,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,uCAAuC;IACvC,MAAM,SAAS,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAE5E,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAyCD,SAAS,CAAC,CAAC,CAAC;;QAEZ,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA0CH,UAAU;;6CAEc,QAAQ;iDACJ,UAAU;;;;;;;;;yCASlB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAmmB3B,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAiCV,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkFzB,YAAY;GACf,CAAC;AACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,cAAc;AACd;;;GAGG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C;;;;GAIG;AACH,MAAM,UAAU,cAAc,CAAC,UAAe,EAAE;IAC9C,MAAM,EACJ,QAAQ,GAAG,MAAM,EACjB,UAAU,GAAG,GAAG;IAChB,iFAAiF;IACjF,UAAU,GAAG,kNAAkN,EAC/N,OAAO,GAAG,MAAM,EAChB,KAAK,GAAG,IAAI,EACZ,MAAM,GAAG,EAAE,EACZ,GAAG,OAAO,CAAC;IAEZ,4BAA4B;IAC5B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;UAI9C,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;SACrB,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,GAAG,CAAC,EAAE,EAAE;QACnB,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;QAC9D,OAAO,GAAG,OAAO,KAAK,GAAG,cAAc,CAAC;IAC1C,CAAC,CAAC;SACD,IAAI,CAAC,YAAY,CAAC;;;GAG1B,CAAC,CAAC,CAAC,EAAE,CAAC;IAEP,uCAAuC;IACvC,MAAM,SAAS,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAE5E,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAyCD,SAAS,CAAC,CAAC,CAAC;;QAEZ,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA0CH,UAAU;;6CAEc,QAAQ;iDACJ,UAAU;;;;;;;;;yCASlB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAmmB3B,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAiCV,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkJzB,YAAY;GACf,CAAC;AACJ,CAAC"}

package/dist/table-CJHCBhPo.js

@@ -0,0 +1,33 @@
+function y(r, a) {
+  let e;
+  typeof r == "number" ? e = { rows: r, cols: a ?? 2 } : e = r;
+  const t = Math.max(1, Math.floor(e.rows)), n = Math.max(1, Math.floor(e.cols)), m = e.headers ?? Array.from({ length: n }, (o, s) => `Header ${s + 1}`), u = e.alignment ?? Array(n).fill("left"), d = m.slice(0, n).map((o) => o || " ").join(" | "), h = Array.from({ length: n }, (o, s) => {
+    const f = u[s] ?? "left";
+    return f === "center" ? ":---:" : f === "right" ? "---:" : "---";
+  }).join(" | "), c = Array.from(
+    { length: t },
+    () => Array.from({ length: n }, () => " ").join(" | ")
+  ).map((o) => `| ${o} |`).join(`
+`);
+  let i = "";
+  const l = [];
+  return e.style && e.style !== "default" && l.push(`style=${e.style}`), e.borderStyle && e.borderStyle !== "solid" && l.push(`border=${e.borderStyle}`), l.length && (i = `<!-- mz-table: ${l.join(" ")} -->
+`), `${i}| ${d} |
+| ${h} |
+${c}
+`;
+}
+function b(r, a) {
+  if (r === null)
+    return null;
+  const e = r.trim();
+  if (!e)
+    return Math.max(1, a);
+  const t = Number.parseInt(e, 10);
+  return Number.isNaN(t) || t < 1 ? Math.max(1, a) : t;
+}
+export {
+  y as b,
+  b as r
+};
+//# sourceMappingURL=table-CJHCBhPo.js.map

package/dist/table-CJHCBhPo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-CJHCBhPo.js","sources":["../src/plugins/utils/table.ts"],"sourcesContent":["export type ColumnAlignment = 'left' | 'center' | 'right';\nexport type TableStyle = 'default' | 'striped' | 'rainbow' | 'minimal';\nexport type BorderStyle = 'solid' | 'dashed' | 'dotted' | 'double' | 'none';\n\nexport interface TableBuildOptions {\n  rows: number;\n  cols: number;\n  headers?: string[];\n  alignment?: ColumnAlignment[];\n  style?: TableStyle;\n  borderStyle?: BorderStyle;\n}\n\nexport function buildTableMarkdown(rowsOrOpts: number | TableBuildOptions, colsArg?: number): string {\n  let opts: TableBuildOptions;\n  if (typeof rowsOrOpts === 'number') {\n    opts = { rows: rowsOrOpts, cols: colsArg ?? 2 };\n  } else {\n    opts = rowsOrOpts;\n  }\n\n  const safeRows = Math.max(1, Math.floor(opts.rows));\n  const safeCols = Math.max(1, Math.floor(opts.cols));\n  const headers = opts.headers ?? Array.from({ length: safeCols }, (_, i) => `Header ${i + 1}`);\n  const alignment = opts.alignment ?? Array(safeCols).fill('left' as ColumnAlignment);\n\n  const headerRow = headers.slice(0, safeCols).map(h => h || ' ').join(' | ');\n\n  const divider = Array.from({ length: safeCols }, (_, i) => {\n    const align = alignment[i] ?? 'left';\n    if (align === 'center') return ':---:';\n    if (align === 'right') return '---:';\n    return '---';\n  }).join(' | ');\n\n  const body = Array.from({ length: safeRows }, () =>\n    Array.from({ length: safeCols }, () => ' ').join(' | '),\n  )\n    .map((row) => `| ${row} |`)\n    .join('\\n');\n\n  // Build annotation comment for non-default styles\n  let annotation = '';\n  const parts: string[] = [];\n  if (opts.style && opts.style !== 'default') parts.push(`style=${opts.style}`);\n  if (opts.borderStyle && opts.borderStyle !== 'solid') parts.push(`border=${opts.borderStyle}`);\n  if (parts.length) annotation = `<!-- mz-table: ${parts.join(' ')} -->\\n`;\n\n  return `${annotation}| ${headerRow} |\\n| ${divider} |\\n${body}\\n`;\n}\n\nexport function resolvePositiveInteger(value: string | null, fallback: number): number | null {\n  if (value === null) {\n    return null;\n  }\n\n  const trimmed = value.trim();\n  if (!trimmed) {\n    return Math.max(1, fallback);\n  }\n\n  const parsed = Number.parseInt(trimmed, 10);\n  if (Number.isNaN(parsed) || parsed < 1) {\n    return Math.max(1, fallback);\n  }\n\n  return parsed;\n}\n"],"names":["buildTableMarkdown","rowsOrOpts","colsArg","opts","safeRows","safeCols","headers","_","i","alignment","headerRow","h","divider","align","body","row","annotation","parts","resolvePositiveInteger","value","fallback","trimmed","parsed"],"mappings":"AAaO,SAASA,EAAmBC,GAAwCC,GAA0B;AACnG,MAAIC;AACJ,EAAI,OAAOF,KAAe,WACxBE,IAAO,EAAE,MAAMF,GAAY,MAAMC,KAAW,EAAA,IAE5CC,IAAOF;AAGT,QAAMG,IAAW,KAAK,IAAI,GAAG,KAAK,MAAMD,EAAK,IAAI,CAAC,GAC5CE,IAAW,KAAK,IAAI,GAAG,KAAK,MAAMF,EAAK,IAAI,CAAC,GAC5CG,IAAUH,EAAK,WAAW,MAAM,KAAK,EAAE,QAAQE,EAAA,GAAY,CAACE,GAAGC,MAAM,UAAUA,IAAI,CAAC,EAAE,GACtFC,IAAYN,EAAK,aAAa,MAAME,CAAQ,EAAE,KAAK,MAAyB,GAE5EK,IAAYJ,EAAQ,MAAM,GAAGD,CAAQ,EAAE,IAAI,CAAAM,MAAKA,KAAK,GAAG,EAAE,KAAK,KAAK,GAEpEC,IAAU,MAAM,KAAK,EAAE,QAAQP,EAAA,GAAY,CAACE,GAAGC,MAAM;AACzD,UAAMK,IAAQJ,EAAUD,CAAC,KAAK;AAC9B,WAAIK,MAAU,WAAiB,UAC3BA,MAAU,UAAgB,SACvB;AAAA,EACT,CAAC,EAAE,KAAK,KAAK,GAEPC,IAAO,MAAM;AAAA,IAAK,EAAE,QAAQV,EAAA;AAAA,IAAY,MAC5C,MAAM,KAAK,EAAE,QAAQC,EAAA,GAAY,MAAM,GAAG,EAAE,KAAK,KAAK;AAAA,EAAA,EAErD,IAAI,CAACU,MAAQ,KAAKA,CAAG,IAAI,EACzB,KAAK;AAAA,CAAI;AAGZ,MAAIC,IAAa;AACjB,QAAMC,IAAkB,CAAA;AACxB,SAAId,EAAK,SAASA,EAAK,UAAU,eAAiB,KAAK,SAASA,EAAK,KAAK,EAAE,GACxEA,EAAK,eAAeA,EAAK,gBAAgB,aAAe,KAAK,UAAUA,EAAK,WAAW,EAAE,GACzFc,EAAM,WAAQD,IAAa,kBAAkBC,EAAM,KAAK,GAAG,CAAC;AAAA,IAEzD,GAAGD,CAAU,KAAKN,CAAS;AAAA,IAASE,CAAO;AAAA,EAAOE,CAAI;AAAA;AAC/D;AAEO,SAASI,EAAuBC,GAAsBC,GAAiC;AAC5F,MAAID,MAAU;AACZ,WAAO;AAGT,QAAME,IAAUF,EAAM,KAAA;AACtB,MAAI,CAACE;AACH,WAAO,KAAK,IAAI,GAAGD,CAAQ;AAG7B,QAAME,IAAS,OAAO,SAASD,GAAS,EAAE;AAC1C,SAAI,OAAO,MAAMC,CAAM,KAAKA,IAAS,IAC5B,KAAK,IAAI,GAAGF,CAAQ,IAGtBE;AACT;"}

package/docs/index.md

@@ -31,13 +31,13 @@ features:
     details: Formatting helpers live in src/actions and export with the library — no extra installs needed.
   - icon: 🧩
     title: Plugin Library
-    details: Production-ready plugins for tables, Mermaid, syntax highlighting, media helpers, and more.
+    details: Production-ready plugins for tables (with alignment, style presets & borders), Mermaid, syntax highlighting, media helpers, and more.
   - icon: 👁️
     title: Overlay Preview
     details: Renders markdown directly over the textarea so alignment never drifts.
   - icon: 🎨
     title: Themeable UI
-    details: Includes Solar (light) and Cave (dark) themes, plus accent swatch tooling for custom palettes.
+    details: Includes Solar (light) and Cave (dark) themes with full CSS variable customization.
   - icon: 🛝
     title: Demo Bakeshop
     details: A Vite + React playground that exercises every option and plugin in a live environment.
@@ -88,7 +88,6 @@ new Marzipan("#editor", {
 | `tableGridPlugin`       | Grid overlay for rapid column/row creation                                                |
 | `tableGeneratorPlugin`  | Quick GFM table inserter with prompt-driven sizing                                        |
 | `tinyHighlightPlugin`   | Zero-runtime syntax highlighting for fenced code blocks                                   |
-| `accentSwatchPlugin`    | Synced accent palette picker                                                              |
 | `imageManagerPlugin`    | Dropzone and gallery UI for inserting images and managing uploads                         |
 | `imagePickerPlugin`     | Toolbar button for inserting images via URL or optional uploader callback                 |
 | `mermaidPlugin`         | Diagram rendering via ESM import                                                          |

package/docs/plugins.md

@@ -37,11 +37,7 @@ new Marzipan("#editor", {
 import { Marzipan, plugins } from "@pinkpixel/marzipan";
 
 new Marzipan("#editor", {
-  plugins: [
-    plugins.tablePlugin(),
-    plugins.mermaidPlugin(),
-    plugins.accentSwatchPlugin(),
-  ],
+  plugins: [plugins.tablePlugin(), plugins.mermaidPlugin()],
 });
 ```
 
@@ -51,18 +47,100 @@ Every factory returns an object that Marzipan consumes internally. You can mix a
 
 | Plugin                  | Import Path                                      | Description                                                                                       |
 | ----------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------- |
-| `accentSwatchPlugin`    | `@pinkpixel/marzipan/plugins/accentSwatchPlugin` | Adds a palette picker for accent colours and syncs with the toolbar + stats bar.                  |
 | `imageManagerPlugin`    | `@pinkpixel/marzipan/plugins/imageManagerPlugin` | Dropzone and gallery UI for inserting images and managing uploads.                                |
 | `imagePickerPlugin`     | `@pinkpixel/marzipan/plugins/imagePickerPlugin`  | Toolbar button for inserting images via URL or optional uploader callback.                        |
 | `mermaidPlugin`         | `@pinkpixel/marzipan/plugins/mermaidPlugin`      | Lazy-loads Mermaid from npm/ESM and renders diagrams inline.                                      |
 | `mermaidExternalPlugin` | `@pinkpixel/marzipan/plugins/mermaidExternal`    | Mermaid integration that targets a CDN script tag—perfect for sandboxed playgrounds.              |
 | `tablePlugin`           | `@pinkpixel/marzipan/plugins/tablePlugin`        | Toolbar-driven table generator with inline editing controls.                                      |
-| `tableGridPlugin`       | `@pinkpixel/marzipan/plugins/tableGridPlugin`    | Grid overlay for rapid column/row creation (exports `tableGridStyles`).                           |
+| `tableGridPlugin`       | `@pinkpixel/marzipan/plugins/tableGridPlugin`    | Grid popover with alignment, style presets, and border options (exports `tableGridStyles`).       |
 | `tableGeneratorPlugin`  | `@pinkpixel/marzipan/plugins/tableGenerator`     | Quick GFM table inserter with prompt-driven sizing.                                               |
 | `tinyHighlightPlugin`   | `@pinkpixel/marzipan/plugins/tinyHighlight`      | Zero-runtime syntax highlighting for fenced code blocks (`tinyHighlightStyles` helper available). |
 
 > 📝 The plugin names map 1:1 to files in `src/plugins`. Inspect those files for advanced configuration options.
 
+## Table Plugin Enhancements
+
+The table plugins now support rich styling via GFM alignment markers and an HTML comment annotation system.
+
+### Column Alignment
+
+GFM column alignment is fully supported. Use `:---` (left), `:---:` (center), or `---:` (right) in the separator row:
+
+```markdown
+| Left | Center | Right |
+| :--- | :----: | ----: |
+| A    |   B    |     C |
+```
+
+The `tableGridPlugin` popover includes alignment buttons (Left / Center / Right) that set the alignment for all columns.
+
+### Style Presets
+
+Four style presets are available via the `<!-- mz-table: style=<preset> -->` annotation:
+
+| Preset    | Description                                            |
+| --------- | ------------------------------------------------------ |
+| `default` | Standard table styling — no extra classes.             |
+| `striped` | Alternating row backgrounds for readability.           |
+| `rainbow` | Cycles through six pastel colours per row.             |
+| `minimal` | Light borders with a clean, reduced-chrome appearance. |
+
+### Border Styles
+
+Border styles are set via the `border=<style>` annotation parameter:
+
+| Style    | Description                       |
+| -------- | --------------------------------- |
+| `solid`  | Standard solid borders (default). |
+| `dashed` | Dashed cell borders.              |
+| `dotted` | Dotted cell borders.              |
+| `double` | Double-line cell borders.         |
+| `none`   | No visible borders.               |
+
+### Annotation Syntax
+
+Place a hidden HTML comment immediately before the table to apply style and border options:
+
+```markdown
+<!-- mz-table: style=rainbow border=dashed -->
+
+| Name  | Score |
+| ----- | ----- |
+| Alice | 95    |
+| Bob   | 87    |
+```
+
+The comment is invisible to standard markdown renderers and only parsed by Marzipan.
+
+### `tableGridPlugin` Popover
+
+The grid popover now includes an options panel below the size grid with:
+
+- **Align** – Left / Center / Right toggle buttons.
+- **Style** – Default / Striped / Rainbow / Minimal presets.
+- **Border** – Solid / Dashed / Dotted / Double / None options.
+
+Preferences are persisted to `localStorage` (key `marzipan.table.prefs`) so they survive page reloads.
+
+### `buildTableMarkdown` Utility
+
+The `buildTableMarkdown()` helper (exported from `@pinkpixel/marzipan/plugins/utils/table`) now accepts a `TableBuildOptions` object:
+
+```ts
+import { buildTableMarkdown } from "@pinkpixel/marzipan";
+import type { TableBuildOptions } from "@pinkpixel/marzipan";
+
+const md = buildTableMarkdown({
+  rows: 3,
+  cols: 4,
+  alignment: ["left", "center", "right", "left"],
+  style: "striped",
+  borderStyle: "dashed",
+});
+```
+
+The original `(rows, cols)` signature remains supported for backward compatibility.
+
 ## Configuration tips
 
 - **Tree shaking** – Import plugins individually; bundlers remove unused exports automatically.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pinkpixel/marzipan",
-  "version": "1.1.2",
+  "version": "1.2.1",
   "description": "Pure TypeScript markdown editor library with overlay preview",
   "license": "Apache-2.0",
   "type": "module",