@dmitryvim/form-builder 0.2.18 → 0.2.19
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 +57 -0
- package/dist/browser/formbuilder.min.js +142 -80
- package/dist/browser/formbuilder.v0.2.19.min.js +448 -0
- package/dist/cjs/index.cjs +1042 -2
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/index.js +1024 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/form-builder.js +142 -80
- package/dist/types/components/index.d.ts +2 -1
- package/dist/types/components/table.d.ts +4 -0
- package/dist/types/types/config.d.ts +6 -0
- package/dist/types/types/index.d.ts +1 -1
- package/dist/types/types/schema.d.ts +28 -1
- package/package.json +1 -1
- package/dist/browser/formbuilder.v0.2.18.min.js +0 -386
package/README.md
CHANGED
|
@@ -292,6 +292,7 @@ See [Integration Guide](docs/integration.md) for detailed setup instructions.
|
|
|
292
292
|
- **Switcher**: Segmented button group (all options visible, ≤4) — same data model as Select
|
|
293
293
|
- **Colour**: Colour picker with hex values (single or palette)
|
|
294
294
|
- **Slider**: Range slider with linear/exponential scales (v0.2.7+)
|
|
295
|
+
- **Table**: 2D editable grid with cell merging, keyboard navigation, readonly mode
|
|
295
296
|
- **File**: Single file upload with preview and type restrictions
|
|
296
297
|
- **Files**: Multiple file upload with grid layout and drag-and-drop
|
|
297
298
|
- **Container**: Nested containers with repeatable array support
|
|
@@ -654,6 +655,62 @@ The `enableIf` system is designed for future expansion:
|
|
|
654
655
|
}
|
|
655
656
|
```
|
|
656
657
|
|
|
658
|
+
### Table Element
|
|
659
|
+
|
|
660
|
+
An editable 2D grid with plain-text cells, cell merging, and full keyboard navigation.
|
|
661
|
+
|
|
662
|
+
**Schema:**
|
|
663
|
+
|
|
664
|
+
```json
|
|
665
|
+
{
|
|
666
|
+
"type": "table",
|
|
667
|
+
"key": "data",
|
|
668
|
+
"label": "Data Table",
|
|
669
|
+
"columns": 4,
|
|
670
|
+
"rows": 5
|
|
671
|
+
}
|
|
672
|
+
```
|
|
673
|
+
|
|
674
|
+
**Data format** — a 2D array of strings with optional merge definitions:
|
|
675
|
+
|
|
676
|
+
```json
|
|
677
|
+
{
|
|
678
|
+
"cells": [
|
|
679
|
+
["Product", "Q1", "Q2", "Q3"],
|
|
680
|
+
["Widget A", "100", "120", "140"],
|
|
681
|
+
["Widget B", "80", "90", "95"]
|
|
682
|
+
],
|
|
683
|
+
"merges": [
|
|
684
|
+
{ "row": 0, "col": 0, "rowspan": 1, "colspan": 2 }
|
|
685
|
+
]
|
|
686
|
+
}
|
|
687
|
+
```
|
|
688
|
+
|
|
689
|
+
**Keyboard shortcuts:**
|
|
690
|
+
|
|
691
|
+
- **Tab / Shift+Tab** — move to next/previous cell
|
|
692
|
+
- **Arrow keys** — navigate between cells
|
|
693
|
+
- **Enter** — confirm cell and move down
|
|
694
|
+
- **Escape** — cancel edit
|
|
695
|
+
- **Ctrl+M** — merge selected cells
|
|
696
|
+
- **Ctrl+Shift+M** — split merged cell
|
|
697
|
+
|
|
698
|
+
**Properties:**
|
|
699
|
+
|
|
700
|
+
| Property | Type | Default | Description |
|
|
701
|
+
|----------|------|---------|-------------|
|
|
702
|
+
| `columns` | `number` | `3` | Initial column count |
|
|
703
|
+
| `rows` | `number` | `3` | Initial row count |
|
|
704
|
+
|
|
705
|
+
**Features:**
|
|
706
|
+
|
|
707
|
+
- Plain-text cell editing via `contentEditable`
|
|
708
|
+
- First row visually highlighted as header
|
|
709
|
+
- Add/remove rows and columns at runtime
|
|
710
|
+
- Cell merging (colspan/rowspan) with Ctrl+M
|
|
711
|
+
- Readonly mode renders a static `<table>`
|
|
712
|
+
- Full i18n support (6 translation keys: `tableAddRow`, `tableAddColumn`, `tableRemoveRow`, `tableRemoveColumn`, `tableMergeCells`, `tableSplitCell`)
|
|
713
|
+
|
|
657
714
|
## Documentation
|
|
658
715
|
|
|
659
716
|
- **API Reference** - See above for core methods and theming
|