react-markdown-table-ts 1.2.0 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -7,27 +7,16 @@
7
7
  [![GitHub branch status](https://img.shields.io/github/checks-status/keithwalsh/react-markdown-table-ts/HEAD)](https://github.com/keithwalsh/react-markdown-table-ts/commits/HEAD/)
8
8
 
9
9
  | ![Light Theme Example](public/light.png) | ![Dark Theme Example](public/dark.png) |
10
- |------------------------------------------|----------------------------------------|
11
- | `'light'` theme | `'dark'` theme |
10
+ |------------------------------------------|-----------------------------------------|
11
+ | `'light'` theme | `'dark'` theme |
12
12
 
13
13
  ## Overview
14
-
15
- This library provides a React component for generating and displaying formatted Markdown tables with syntax highlighting. The core component is `MarkdownTable` which converts structured data into properly formatted Markdown table syntax. Columns of variable width maintain consistent spacing across all rows, ensuring vertical alignment of delimiters. For syntax highlighting and line numbering, Prism.js is used within a `<pre>` HTML element.
14
+ This library provides a React component for generating and displaying formatted Markdown tables with syntax highlighting. The core component is `MarkdownTable` which converts 2D array data into properly formatted Markdown table syntax. Columns of variable width maintain consistent spacing across all rows, ensuring vertical alignment of delimiters. For syntax highlighting and line numbering, Prism.js is used within a `<pre>` HTML element.
16
15
 
17
16
  ## API
18
-
19
17
  ```typescript
20
- interface CellData {
21
- content: string; // The text content of the cell
22
- alignment?: Alignment; // Text alignment ('left', 'center', 'right')
23
- bold?: boolean; // Bold formatting
24
- italic?: boolean; // Italic formatting
25
- code?: boolean; // Code (monospace) formatting
26
- link?: string; // Optional URL for cell content
27
- }
28
-
29
18
  interface MarkdownTableProps {
30
- inputData?: (string | CellData)[][] | null; // Table data as strings or CellData objects
19
+ inputData?: string[][] | null;
31
20
  columnAlignments?: readonly Alignment[];
32
21
  isCompact?: boolean;
33
22
  hasPadding?: boolean;
@@ -42,26 +31,24 @@ interface MarkdownTableProps {
42
31
  onGenerate?: (markdownTableString: string) => void;
43
32
  }
44
33
  ```
45
-
46
34
  | Prop | Type | Default | Description |
47
- |---------------------|----------------------------------------|-------------|------------------------------------------------------------------------------------|
48
- | `inputData` | `(string \| CellData)[][] \| null` | `null` | Table data as strings or CellData objects for rich text formatting |
49
- | `columnAlignments` | `readonly Alignment[]` | `[]` | Acceptable values are 'left', 'center', 'right', 'justify', or 'none' |
50
- | `isCompact` | `boolean` | `false` | Disables column width alignment to provide a more compact markdown table string |
51
- | `hasPadding` | `boolean` | `true` | One space added before and after the content in each cell |
52
- | `hasTabs` | `boolean` | `false` | Adds a tab character after each \| and before the content |
53
- | `hasHeader` | `boolean` | `true` | Indicates whether the first row of `data` is a header |
54
- | `convertLineBreaks` | `boolean` | `false` | Replace newlines with <br> tags in table cells |
55
- | `topPadding` | `number` | `16` | Controls the padding-top (in pixels) of the \<pre\> element display |
56
- | `theme` | `'light' \| 'dark'` | `light` | Controls the color scheme of the \<pre\> element display |
57
- | `className` | `string` | `undefined` | Class will be applied to the \<pre\> element display |
58
- | `preStyle` | `React.CSSProperties` | `undefined` | Allows direct styling of the display with CSS properties |
59
- | `minWidth` | `number` | `undefined` | Optional minimum width in pixels for the table container |
60
- | `onGenerate` | `(markdownTableString: string) => void`| `undefined` | Callback to receive the generated Markdown table string |
61
-
35
+ |----------------------|-----------------------------------------|-------------|------------------------------------------------------------------------------------|
36
+ | `inputData` | `string[][] \| null` | `null` | The outer array represents rows. The inner array represent cells within each row. |
37
+ | `columnAlignments` | `readonly Alignment[]` | `[]` | Acceptable values are 'left', 'center', 'right', 'justify', or 'none'. Defaults to 'none' when unspecified. |
38
+ | `isCompact` | `boolean` | `false` | Disables column width alignment to provide a more compact markdown table string. |
39
+ | `hasPadding` | `boolean` | `true` | One space added before and after the content in each cell. |
40
+ | `hasTabs` | `boolean` | `false` | Adds a tab character after each \| and before the content. |
41
+ | `hasHeader` | `boolean` | `true` | Indicates whether the first row of `data` is a header. |
42
+ | `convertLineBreaks` | `boolean` | `false` | Replace newlines with <br> tags in table cells. |
43
+ | `topPadding` | `number` | `16` | Controls the padding-top (in pixels) of the \<pre\> element display. |
44
+ | `theme` | `'light' \| 'dark'` | `light` | Controls the color scheme of the \<pre\> element display. |
45
+ | `className` | `string` | `undefined` | Class will be applied to the \<pre\> element display. |
46
+ | `preStyle` | `React.CSSProperties` | `undefined` | Allows direct styling of the display with CSS properties. |
47
+ | `minWidth` | `number` | `undefined` | Optional minimum width in pixels for the table container. |
48
+ | `onGenerate` | `(markdownTableString: string) => void` | `undefined` | Callback to receive the generated Markdown table string. |
62
49
  ## Usage Patterns
63
50
 
64
- 1. **Basic String Table**:
51
+ 1. **Basic Table Generation**:
65
52
  ```typescript
66
53
  <MarkdownTable
67
54
  inputData={[
@@ -70,44 +57,20 @@ interface MarkdownTableProps {
70
57
  ]}
71
58
  />
72
59
  ```
73
-
74
- 2. **Rich Text Formatting with CellData**:
60
+ 2. **Column Alignment**:
75
61
  ```typescript
76
62
  <MarkdownTable
77
- inputData={[
78
- [
79
- { content: "Package ID", alignment: "left", bold: true },
80
- { content: "Status", alignment: "center", bold: true }
81
- ],
82
- [
83
- { content: "PKG-001", code: true },
84
- { content: "In Transit", italic: true }
85
- ],
86
- [
87
- { content: "PKG-002", code: true },
88
- { content: "Delivered", bold: true }
89
- ]
90
- ]}
91
- columnAlignments={['left', 'center']}
63
+ inputData={data}
64
+ columnAlignments={['left', 'center', 'right', 'justify']}
92
65
  />
93
66
  ```
94
-
95
- 3. **Links and Mixed Formatting**:
67
+ 3. **Auto-Generated Headers**:
96
68
  ```typescript
97
69
  <MarkdownTable
98
- inputData={[
99
- [
100
- { content: "Product", bold: true },
101
- { content: "Details", bold: true }
102
- ],
103
- [
104
- { content: "Item 1", link: "https://example.com/item1" },
105
- { content: "New!", italic: true }
106
- ]
107
- ]}
70
+ inputData={data}
71
+ hasHeader={false} // Will generate A, B, C... headers
108
72
  />
109
73
  ```
110
-
111
74
  4. **Setting Minimum Width**:
112
75
  ```typescript
113
76
  <MarkdownTable
@@ -119,31 +82,34 @@ interface MarkdownTableProps {
119
82
  ## Behaviors
120
83
 
121
84
  1. **Input Validation**:
122
- - Input must be non-null 2D array of strings or CellData objects
123
- - All cells must contain valid content
124
- - Empty arrays are not allowed
125
-
126
- 2. **Markdown Formatting**:
127
- - Bold text is wrapped in `**`
128
- - Italic text is wrapped in `*`
129
- - Code is wrapped in backticks (\`)
130
- - Links are formatted as `[text](url)`
131
- - Alignments are reflected in the table separator row
132
-
133
- 3. **Theme Support**:
134
- - Light theme (default) for standard markdown appearance
135
- - Dark theme for better visibility on dark backgrounds
136
- - Custom styling through `className` and `preStyle` props
137
-
138
- 4. **Responsive Design**:
139
- - Tables adjust to content width by default
140
- - Minimum width can be enforced through `minWidth` prop
141
- - Compact mode available for dense data presentation
142
-
143
- ## Contributing
144
-
145
- Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
146
-
147
- ## License
148
-
149
- This project is licensed under the MIT License - see the LICENSE file for details.
85
+ - Input must be non-null 2D string array
86
+ - All rows should contain string values
87
+ - Empty arrays are not allowed
88
+ - Column alignments must be valid ('left', 'center', 'right', 'justify', 'none')
89
+
90
+ 2. **Column Width Handling**:
91
+ - Default: Adjusts columns to fit content with 'none' alignment
92
+ - `isCompact={true}`: Minimizes column widths
93
+ - Maintains minimum width of 3 characters for alignment indicators
94
+ - 'justify' alignment behaves same as 'none' for markdown compatibility
95
+
96
+ 3. **Error Handling**:
97
+ - Returns error message string if validation fails
98
+ - Wraps errors in `MarkdownTableError` class
99
+ - Preserves stack traces for debugging
100
+
101
+ 4. **Styling**:
102
+ - Uses Prism.js for syntax highlighting
103
+ - Supports light/dark themes
104
+ - Custom styles via `className` and `preStyle` props
105
+
106
+ ## Common Transformations
107
+
108
+ 1. **Data Formatting**:
109
+ - Newlines can be converted to `<br>` tags with `canReplaceNewlines`
110
+ - Padding can be controlled with `hasPadding`
111
+ - Tab spacing available with `hasTabs`
112
+
113
+ 2. **Header Generation**:
114
+ - Auto-generates A, B, C... headers when `hasHeader={false}`
115
+ - Supports custom headers via first row when `hasHeader={true}`
package/dist/index.cjs.js CHANGED
@@ -4069,62 +4069,55 @@ var Prism$1 = /*@__PURE__*/getDefaultExportFromCjs(prismExports);
4069
4069
  }());
4070
4070
 
4071
4071
  /**
4072
- * Formats cell content with markdown syntax based on CellData formatting options
4072
+ * @fileoverview Utilities for formatting and generating markdown tables with support
4073
+ * for cell formatting, alignment, and width calculations.
4073
4074
  */
4074
- function formatCellContent(cell) {
4075
- if (typeof cell === 'string') {
4076
- return cell;
4077
- }
4078
- var content = cell.content;
4079
- // Apply code formatting first (if present) as it should override other formatting
4080
- if (cell.code) {
4081
- content = "`".concat(content, "`");
4082
- return content; // Code formatting should not be combined with other formatting
4083
- }
4084
- // Apply bold formatting
4085
- if (cell.bold) {
4086
- content = "**".concat(content, "**");
4087
- }
4088
- // Apply italic formatting
4089
- if (cell.italic) {
4090
- content = "*".concat(content, "*");
4091
- }
4092
- // Apply link formatting last
4093
- if (cell.link) {
4094
- content = "[".concat(content, "](").concat(cell.link, ")");
4095
- }
4096
- return content;
4097
- }
4098
- /**
4099
- * Gets the alignment for a cell, prioritizing cell-specific alignment over column alignment
4100
- */
4101
- function getCellAlignment(cell, columnAlignment) {
4102
- if (typeof cell === 'string') {
4103
- return columnAlignment || 'none';
4104
- }
4105
- return cell.alignment || columnAlignment || 'none';
4106
- }
4107
-
4108
4075
  var CellFormatter = /** @class */ (function () {
4109
4076
  function CellFormatter(config) {
4110
4077
  this.config = config;
4111
- this.padding = this.config.useTabs ? '\t' : (this.config.hasPadding ? ' ' : '');
4078
+ this.padding = this.config.useTabs
4079
+ ? "\t"
4080
+ : this.config.hasPadding
4081
+ ? " "
4082
+ : "";
4112
4083
  }
4113
- CellFormatter.prototype.formatCell = function (cell, alignment, width) {
4114
- var content = formatCellContent(cell);
4115
- var cellAlignment = getCellAlignment(cell, alignment);
4116
- var totalWidth = width;
4117
- switch (cellAlignment) {
4118
- case 'right':
4119
- return "".concat(this.padding).concat(content.padStart(totalWidth)).concat(this.padding);
4120
- case 'center': {
4121
- var totalPadding = totalWidth - content.length;
4122
- var paddingLeft = Math.floor(totalPadding / 2);
4123
- var paddingRight = totalPadding - paddingLeft;
4124
- return "".concat(this.padding).concat(' '.repeat(paddingLeft)).concat(content).concat(' '.repeat(paddingRight)).concat(this.padding);
4084
+ CellFormatter.prototype.formatCellContent = function (cell) {
4085
+ var content = cell.content;
4086
+ if (cell.code) {
4087
+ content = "`".concat(content, "`");
4088
+ }
4089
+ if (cell.bold) {
4090
+ content = "**".concat(content, "**");
4091
+ }
4092
+ if (cell.italic) {
4093
+ content = "*".concat(content, "*");
4094
+ }
4095
+ if (cell.link) {
4096
+ content = "[".concat(content, "](").concat(cell.link, ")");
4097
+ }
4098
+ return content;
4099
+ };
4100
+ CellFormatter.prototype.formatCell = function (cell, width) {
4101
+ var content = this.formatCellContent(cell);
4102
+ var alignment = cell.alignment || "inherit";
4103
+ var effectiveAlignment = alignment === "inherit" ? "none" : alignment;
4104
+ var paddedContent = "".concat(this.padding).concat(content).concat(this.padding);
4105
+ var spacesToAdd = width - content.length;
4106
+ if (spacesToAdd <= 0)
4107
+ return paddedContent;
4108
+ switch (effectiveAlignment) {
4109
+ case "right":
4110
+ return " ".repeat(spacesToAdd) + paddedContent;
4111
+ case "center": {
4112
+ var leftPad = Math.floor(spacesToAdd / 2);
4113
+ var rightPad = spacesToAdd - leftPad;
4114
+ return " ".repeat(leftPad) + paddedContent + " ".repeat(rightPad);
4125
4115
  }
4126
- default: // left or none
4127
- return "".concat(this.padding).concat(content.padEnd(totalWidth)).concat(this.padding);
4116
+ case "justify":
4117
+ case "left":
4118
+ case "none":
4119
+ default:
4120
+ return paddedContent + " ".repeat(spacesToAdd);
4128
4121
  }
4129
4122
  };
4130
4123
  return CellFormatter;
@@ -4136,11 +4129,11 @@ var AlignmentFormatter = /** @class */ (function () {
4136
4129
  return this.indicators[alignment](width);
4137
4130
  };
4138
4131
  AlignmentFormatter.indicators = {
4139
- left: function (width) { return ":".concat('-'.repeat(width - 1)); },
4140
- right: function (width) { return "".concat('-'.repeat(width - 1), ":"); },
4141
- center: function (width) { return ":".concat('-'.repeat(width - 2), ":"); },
4142
- none: function (width) { return '-'.repeat(width); },
4143
- justify: function (width) { return '-'.repeat(width); }
4132
+ left: function (width) { return ":".concat("-".repeat(width - 1)); },
4133
+ right: function (width) { return "".concat("-".repeat(width - 1), ":"); },
4134
+ center: function (width) { return ":".concat("-".repeat(width - 2), ":"); },
4135
+ none: function (width) { return "-".repeat(width); },
4136
+ justify: function (width) { return "-".repeat(width); },
4144
4137
  };
4145
4138
  return AlignmentFormatter;
4146
4139
  }());
@@ -4151,9 +4144,9 @@ var TableFormatter = /** @class */ (function () {
4151
4144
  this.adjustedAlignments = this.getAdjustedAlignments();
4152
4145
  }
4153
4146
  TableFormatter.prototype.getAdjustedAlignments = function () {
4154
- var defaultAlignment = 'none';
4147
+ var defaultAlignment = "none";
4155
4148
  var sanitizeAlignment = function (alignment) {
4156
- return alignment === 'justify' ? 'none' : alignment;
4149
+ return alignment === "justify" ? "none" : alignment;
4157
4150
  };
4158
4151
  return this.config.columnAlignments.length < this.config.columnCount
4159
4152
  ? __spreadArray(__spreadArray([], Array.from(this.config.columnAlignments).map(sanitizeAlignment), true), Array(this.config.columnCount - this.config.columnAlignments.length).fill(defaultAlignment), true) : Array.from(this.config.columnAlignments).map(sanitizeAlignment);
@@ -4161,81 +4154,77 @@ var TableFormatter = /** @class */ (function () {
4161
4154
  TableFormatter.prototype.formatRow = function (row) {
4162
4155
  var _this = this;
4163
4156
  var formattedCells = Array.from({ length: this.config.columnCount }, function (_, i) {
4164
- var _a;
4165
- var cell = (_a = row[i]) !== null && _a !== void 0 ? _a : '';
4166
- if (_this.config.replaceNewlines) {
4167
- cell = replaceNewlinesInCell(cell);
4168
- }
4169
- var alignment = _this.adjustedAlignments[i];
4170
- var width = _this.config.columnWidths ? _this.config.columnWidths[i] : formatCellContent(cell).length;
4171
- return _this.cellFormatter.formatCell(cell, alignment, width);
4157
+ var _a, _b, _c;
4158
+ var cell = (_a = row[i]) !== null && _a !== void 0 ? _a : { content: "" };
4159
+ var width = (_c = (_b = _this.config.columnWidths) === null || _b === void 0 ? void 0 : _b[i]) !== null && _c !== void 0 ? _c : cell.content.length;
4160
+ return _this.cellFormatter.formatCell(cell, width);
4172
4161
  });
4173
- return "|".concat(formattedCells.join('|'), "|");
4162
+ return "|".concat(formattedCells.join("|"), "|");
4174
4163
  };
4175
4164
  TableFormatter.prototype.formatAlignmentRow = function () {
4176
4165
  var _this = this;
4177
- var padding = this.config.useTabs ? '\t' : (this.config.hasPadding ? ' ' : '');
4166
+ var padding = this.config.useTabs
4167
+ ? "\t"
4168
+ : this.config.hasPadding
4169
+ ? " "
4170
+ : "";
4178
4171
  var formattedColumns = Array.from({ length: this.config.columnCount }, function (_, i) {
4172
+ var _a, _b;
4179
4173
  var alignment = _this.adjustedAlignments[i];
4180
- var width = _this.config.columnWidths ? _this.config.columnWidths[i] : 3;
4174
+ var width = (_b = (_a = _this.config.columnWidths) === null || _a === void 0 ? void 0 : _a[i]) !== null && _b !== void 0 ? _b : 3;
4181
4175
  var indicator = AlignmentFormatter.formatIndicator(alignment, width);
4182
4176
  return "".concat(padding).concat(indicator).concat(padding);
4183
4177
  });
4184
- return "|".concat(formattedColumns.join('|'), "|");
4178
+ return "|".concat(formattedColumns.join("|"), "|");
4185
4179
  };
4186
4180
  return TableFormatter;
4187
4181
  }());
4188
- function calculateColumnWidths(tableRows, maxColumnCount) {
4182
+ function calculateColumnWidths(tableRows, maxColumnCount, config) {
4189
4183
  var widths = new Array(maxColumnCount).fill(3);
4184
+ var cellFormatter = new CellFormatter(config);
4190
4185
  tableRows.forEach(function (row) {
4191
- var _a;
4192
4186
  for (var i = 0; i < maxColumnCount; i++) {
4193
- var cell = (_a = row[i]) !== null && _a !== void 0 ? _a : '';
4194
- var content = formatCellContent(cell);
4195
- widths[i] = Math.max(widths[i], content.length);
4187
+ var cell = row[i];
4188
+ if (cell) {
4189
+ var formattedContent = cellFormatter["formatCellContent"](cell);
4190
+ widths[i] = Math.max(widths[i], formattedContent.length);
4191
+ }
4196
4192
  }
4197
4193
  });
4198
4194
  return widths;
4199
4195
  }
4200
- function calculateMaxColumnCount(inputData) {
4201
- var headerColumnCount = inputData.inputDataHeader.length;
4202
- var bodyColumnCounts = inputData.inputDataBody.map(function (row) { return row.length; });
4203
- return Math.max.apply(Math, __spreadArray([headerColumnCount], bodyColumnCounts, false));
4204
- }
4205
- function getColumnWidths(inputData, maxColumnCount, canAdjustColumnWidths) {
4206
- return canAdjustColumnWidths
4207
- ? calculateColumnWidths(__spreadArray([inputData.inputDataHeader], inputData.inputDataBody, true), maxColumnCount)
4208
- : undefined;
4209
- }
4210
4196
  function generateMarkdownTableString(inputData, columnAlignments, canAdjustColumnWidths, useTabs, replaceNewlines, hasPadding) {
4211
4197
  if (canAdjustColumnWidths === void 0) { canAdjustColumnWidths = true; }
4212
4198
  if (useTabs === void 0) { useTabs = false; }
4213
4199
  if (replaceNewlines === void 0) { replaceNewlines = false; }
4214
4200
  if (hasPadding === void 0) { hasPadding = true; }
4215
- var maxColumnCount = calculateMaxColumnCount(inputData);
4216
- var columnWidths = getColumnWidths(inputData, maxColumnCount, canAdjustColumnWidths);
4201
+ var maxColumnCount = Math.max.apply(Math, __spreadArray([inputData.inputDataHeader.length], inputData.inputDataBody.map(function (row) { return row.length; }), false));
4217
4202
  var config = {
4218
4203
  columnCount: maxColumnCount,
4219
4204
  columnAlignments: columnAlignments,
4220
- columnWidths: columnWidths,
4205
+ columnWidths: canAdjustColumnWidths
4206
+ ? calculateColumnWidths(__spreadArray([inputData.inputDataHeader], inputData.inputDataBody, true), maxColumnCount, {
4207
+ columnCount: maxColumnCount,
4208
+ columnAlignments: columnAlignments,
4209
+ useTabs: useTabs,
4210
+ replaceNewlines: replaceNewlines,
4211
+ hasPadding: hasPadding,
4212
+ })
4213
+ : undefined,
4221
4214
  useTabs: useTabs,
4222
4215
  replaceNewlines: replaceNewlines,
4223
- hasPadding: hasPadding
4216
+ hasPadding: hasPadding,
4224
4217
  };
4225
4218
  var tableFormatter = new TableFormatter(config);
4226
4219
  var headerRow = tableFormatter.formatRow(inputData.inputDataHeader);
4227
4220
  var alignmentRow = tableFormatter.formatAlignmentRow();
4228
4221
  var bodyRows = inputData.inputDataBody
4229
4222
  .map(function (row) { return tableFormatter.formatRow(row); })
4230
- .join('\n');
4223
+ .join("\n");
4231
4224
  return "".concat(headerRow, "\n").concat(alignmentRow, "\n").concat(bodyRows).trimEnd();
4232
4225
  }
4233
- function replaceNewlinesInCell(cell) {
4234
- var content = typeof cell === 'string' ? cell : cell.content;
4235
- return content.replace(/\n/g, '<br>');
4236
- }
4237
4226
  function getColumnName(index) {
4238
- var columnName = '';
4227
+ var columnName = "";
4239
4228
  var currentIndex = index;
4240
4229
  while (currentIndex >= 0) {
4241
4230
  columnName = String.fromCharCode((currentIndex % 26) + 65) + columnName;
@@ -4255,7 +4244,7 @@ var MarkdownTableError = /** @class */ (function (_super) {
4255
4244
  __extends(MarkdownTableError, _super);
4256
4245
  function MarkdownTableError(message) {
4257
4246
  var _this = _super.call(this, message) || this;
4258
- _this.name = 'MarkdownTableError';
4247
+ _this.name = "MarkdownTableError";
4259
4248
  Object.setPrototypeOf(_this, MarkdownTableError.prototype);
4260
4249
  return _this;
4261
4250
  }
@@ -4268,10 +4257,10 @@ var MarkdownTableError = /** @class */ (function (_super) {
4268
4257
  */
4269
4258
  function validateInputData(inputData) {
4270
4259
  if (inputData === null || !Array.isArray(inputData)) {
4271
- throw new MarkdownTableError('The \'data\' prop must be a two-dimensional array.');
4260
+ throw new MarkdownTableError("The 'data' prop must be a two-dimensional array.");
4272
4261
  }
4273
4262
  if (inputData.length === 0) {
4274
- throw new MarkdownTableError('The \'data\' array must contain at least one row.');
4263
+ throw new MarkdownTableError("The 'data' array must contain at least one row.");
4275
4264
  }
4276
4265
  }
4277
4266
 
@@ -4281,7 +4270,10 @@ var DARK_THEME_CSS = "\ncode[class*=language-],pre[class*=language-]{color:#f8f8
4281
4270
  var getTableData = function (inputData, hasHeader) {
4282
4271
  return hasHeader
4283
4272
  ? { inputDataHeader: inputData[0], inputDataBody: inputData.slice(1) }
4284
- : { inputDataHeader: generateAlphabetHeaders(inputData[0].length).map(function (header) { return ({ content: header }); }), inputDataBody: inputData };
4273
+ : {
4274
+ inputDataHeader: generateAlphabetHeaders(inputData[0].length).map(function (header) { return ({ content: header }); }),
4275
+ inputDataBody: inputData,
4276
+ };
4285
4277
  };
4286
4278
  var generateTableSyntax = function (inputData, hasHeader, columnAlignments, adjustColumnWidths, hasTabs, canReplaceNewlines, hasPadding) {
4287
4279
  try {
@@ -4311,7 +4303,9 @@ var MarkdownTable = function (_a) {
4311
4303
  var _b = _a.inputData, inputData = _b === void 0 ? null : _b, _c = _a.hasHeader, hasHeader = _c === void 0 ? true : _c, _d = _a.columnAlignments, columnAlignments = _d === void 0 ? [] : _d, _e = _a.isCompact, isCompact = _e === void 0 ? false : _e, _f = _a.hasTabs, hasTabs = _f === void 0 ? false : _f, _g = _a.hasPadding, hasPadding = _g === void 0 ? true : _g, _h = _a.convertLineBreaks, convertLineBreaks = _h === void 0 ? false : _h, className = _a.className, onGenerate = _a.onGenerate, _j = _a.theme, theme = _j === void 0 ? 'light' : _j, preStyle = _a.preStyle, _k = _a.topPadding, topPadding = _k === void 0 ? 16 : _k, minWidth = _a.minWidth;
4312
4304
  var adjustColumnWidths = !isCompact;
4313
4305
  var preElementRef = require$$0.useRef(null);
4314
- var markdownTableSyntax = require$$0.useMemo(function () { return generateTableSyntax(inputData, hasHeader, columnAlignments, adjustColumnWidths, hasTabs, convertLineBreaks, hasPadding); }, [
4306
+ var markdownTableSyntax = require$$0.useMemo(function () {
4307
+ return generateTableSyntax(inputData, hasHeader, columnAlignments, adjustColumnWidths, hasTabs, convertLineBreaks, hasPadding);
4308
+ }, [
4315
4309
  inputData,
4316
4310
  hasHeader,
4317
4311
  columnAlignments,
@@ -4329,7 +4323,7 @@ var MarkdownTable = function (_a) {
4329
4323
  return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs("style", { children: [theme === 'light' ? LIGHT_THEME_CSS : DARK_THEME_CSS, "\n pre {\n position: relative;\n padding-top: ".concat(topPadding, "px !important;\n }\n pre::before {\n position: absolute;\n top: 8px;\n left: 12px;\n color: ").concat(theme === 'light' ? '#666' : '#999', ";\n letter-spacing: 2px;\n font-size: 12px;\n }\n ")] }), jsxRuntimeExports.jsx("div", { id: "MarkdownTable", style: {
4330
4324
  position: 'relative',
4331
4325
  isolation: 'isolate',
4332
- display: 'inline-block'
4326
+ display: 'inline-block',
4333
4327
  }, children: jsxRuntimeExports.jsx("pre", { ref: preElementRef, className: "".concat(className, " language-markdown line-numbers ").concat(theme === 'dark' ? 'dark-theme' : ''), style: __assign({ width: 'fit-content', minWidth: minWidth ? "".concat(minWidth, "px") : 'min-content', margin: 0 }, preStyle), children: jsxRuntimeExports.jsx("code", { className: "language-markdown", role: "code", children: markdownTableSyntax }) }) })] }));
4334
4328
  };
4335
4329