chore: adding docs

CHANGELOG.md

@@ -17,7 +17,7 @@ Many small fixes:
 
 
 # 0.10.0
-SQLSeal is not compatible with mobile! Plugin now uses SQL.JS instead of better-sqlite3 which is written in Web Assembly so no longer native binaries are needed. This makes plugin portable.
+SQLSeal is now compatible with mobile! Plugin now uses SQL.JS instead of better-sqlite3 which is written in Web Assembly so no longer native binaries are needed. This makes plugin portable.
 Also reworked implementation of the parser from Antlr4TS into Antlr4.
 
 # 0.9.2

docs/.vitepress/config.mts

@@ -17,9 +17,11 @@ export default defineConfig({
         text: 'Documentation',
         items: [
           { text: 'Quick Start', link: '/quick-start' },
+          { text: 'Changing Render Methods', link: '/changing-render-method'},
           { text: 'Using properties', link: '/using-properties' },
           { text: 'Query Vault Content', link: '/query-vault-content' },
           { text: 'Links and Images', link: '/links-and-images' },
+          { text: 'CSV Viewer', link: '/csv-viewer'},
           { text: 'Troubleshooting', link: '/troubleshooting' },
           { text: 'Future Plans', link: '/future-plans' },
         ]

docs/changing-render-method.md

@@ -0,0 +1,73 @@
+# Changing Render Method
+SQLSeal allows for multiple render method to be used. By default it uses the Grid view (which is using AG Grid internally) to provide good looking, feature-rich grid display. You can customise how it is rendered as well as change the renderer all together.
+
+## Table (HTML)
+To display results as a regular HTML table you can add `HTML` above your `SELECT` query like following:
+```sqlseal
+TABLE data = file(./data.csv)
+
+HTML
+SELECT * FROM data
+LIMIT 10
+```
+
+![Table Renderer Example](./renderer_table.png)
+
+
+HTML render method does not come with any extra options (for now).
+
+## Markdown
+You can display table as a text based markdown table. This can be useful if you want to use SQLSeal output as a static table in your document or if you just prefer text look of the table.
+To use Markdown renderer, put `MARKDOWN` above your `SELECT` query like:
+
+```sqlseal
+TABLE data = file(./data.csv)
+
+MARKDOWN
+SELECT * FROM data
+LIMIT 10
+```
+
+Markdown renderer method does not come with any extra options (for now).
+
+![Markdown Renderer Example](./renderer_markdown.png)
+
+
+## Grid View Options
+
+The default renderer is grid. You can force this view by putting `GRID` before your `SELECT` query (in the future SQLSeal will allow to change the default renderer globally). You can also use it to provide extra parameters (read more in Advanced Options section below).
+
+
+```sqlseal
+TABLE data = file(./data.csv)
+
+GRID
+SELECT * FROM data
+LIMIT 10
+```
+![Grid Renderer Example](./renderer_grid.png)
+
+
+### Advanced options
+
+Grid renderer uses [AG Grid](https://www.ag-grid.com/) as a grid solution. You can pass options to it directly from your query to customise how it renders. Please note that configuration accepts only simple object and you cannot pass any functions or variables. For more information, see AG Grid documentation and examples below
+
+#### Changing default column behaviour
+To change behaviour of all columns, you can pass `defaultColDef` object. For more information, check [Column Definition documentation of AG Grid](https://www.ag-grid.com/javascript-data-grid/column-properties/).
+
+```sqlseal
+TABLE data = file(./data.csv)
+
+GRID {
+	defaultColDef: {
+		filter: "agTextColumnFilter",
+		flex: 1
+	}
+}
+SELECT * FROM data
+LIMIT 100
+```
+
+This adds text filtering options for each column and stretches them to the full width.
+
+![Grid Renderer Advanced Example](./renderer_grid_advanced.png)

docs/csv-viewer.md

@@ -0,0 +1,35 @@
+# CSV Viewer
+SQLSeal comes with included CSV Viewer (and editor) starting at version 0.11. The Viewer is enabled by default and can be configured using SQLSeal settings.
+
+![CSV Viewer](./csv_viewer_preview.png)
+
+## Viewing the file
+When CSV viewer is enabled, all the CSV files in your vault will be displayed in your Files view. They will also become searchable in the Quick Command (cmd+o).
+
+## Editing CSV files
+When editing is enabled you can:
+- Add new columns
+- Add new rows
+- Delete Columns
+- Delete Rows
+- Edit individual cells / values
+
+> [!CAUTION]
+> Editing CSV files might cause data loss! Make sure to always backup your files before proceeding.
+
+### Adding rows and columns
+To add and row or a column, click appropriate button above your table.
+![CSV Viewer Add](./csv_viewer_add.png)
+
+### Deleting Columns
+To delete a column, click the menu next to it and choose Remove Column. You will be asked to confirm your action. This will remove column and all the data assigned to this column from each individual row.
+
+### Deleting Row
+To delete a row, right click on a row and choose "Delete Row". You will be asked to confirm your action.
+
+### Editing values
+To edit specific value, double click onto the cell and start typing new value.
+
+## Generating SQLSeal code
+You can generate SQLSeal code from this view to speed up your process. It will fill in the file location and name the table based on the CSV file name.
+![CSV Viewer Add](./csv-viewer_code-gen.png)

src/renderer/GridRenderer.ts

@@ -2,6 +2,7 @@ import { createGrid, GridApi, GridOptions, themeQuartz } from "ag-grid-community
 import { merge } from "lodash";
 import { App } from "obsidian";
 import { RendererConfig } from "src/rendererRegistry";
+import { parse } from 'json5'
 import { displayError, displayNotice, parseCell } from "src/ui";
 
 const getCurrentTheme = () => {
@@ -116,7 +117,10 @@ export class GridRenderer implements RendererConfig {
     isInitialised = false
 
     validateConfig(config: string) {
-        return {}
+        if (!config || !config.trim()) {
+            return {}
+        }
+        return parse(config)
     }