Import TableSettings and type ColumnDef from @atom-forge/ui. This exported visibility panel works inline or inside a popup and is useful when a table has no header or right-click is inconvenient.
Share the same reactive column objects with Table. Initialize visible explicitly in this example. Fixed columns are omitted from the settings panel; fixed does not force a column with visible=false to become visible. TableSettings has no class or children prop in 0.0.34; use an outer wrapper for layout.
| 1 | Design system | Alice |
| 2 | Documentation | Bob |
No visibility changes yet.
Use a snippet so the popup and Table share the parent’s columns binding. The example publishes the already-mutated visibility with an array copy. The popup manager must be provided by Root; retrieve it during component initialization, not inside the click handler.
| ID | Name | |
|---|---|---|
| 1 | John Doe | john.doe@example.com |
| 2 | Jane Smith | jane.smith@example.com |
| 3 | Sam Wilson | sam.wilson@example.com |
| 4 | Alice Johnson | alice.johnson@example.com |
In the installed implementation, Table captures its initial column array. Prefer changing the shared reactive column objects rather than replacing all definitions after mount. See Table for column sizing, row activation and formatting.