{"slug":"simstudioai-add-column-type","name":"add-column-type","description":"Add a new table column type to Sim — registry entry, icon, storage shape, coercion, and the behavioral hooks the grid and API read. Use when adding a value kind under `apps/sim/lib/table/column-types/`.","long_description":"---\nname: add-column-type\ndescription: Add a new table column type to Sim — registry entry, icon, storage shape, coercion, and the behavioral hooks the grid and API read. Use when adding a value kind under `apps/sim/lib/table/column-types/`.\nargument-hint: \n---\n\n# Adding a Table Column Type\n\nA column type is **one file** in `apps/sim/lib/table/column-types/` plus a registry entry. Everything that varies per type — label, icon, storage cast, coercion, validation, conversion compatibility, formatting, editor, filter operators — lives on that one object, so no consumer needs editing.\n\nA `case 'yourtype':` outside `column-types/` fails **silently** when missed (a wrong `jsonbCast` breaks every filter on the column). The registry exists to make that impossible, so the rule is absolute with one documented exception (`import.ts`'s `coerceValue`, see \"Traps\" below): **if you find yourself adding a `case 'yourtype':` anywhere else outside `column-types/`, the registry is missing a field. Add the field instead.**\n\n## Hard Rule: the compiler tells you what to do\n\nDo **not** hunt for places to edit. Add your type to the `ColumnType` union first and let `tsc` produce the list:\n\n```bash\ncd apps/sim && bun run type-check\n```\n\nYou will get two errors, naming `column-types/registry.ts` and `column-types/registry.server.ts`. Register in both.\n\nIf your type owns metadata, adding its key to `TYPE_SPECIFIC_COLUMN_KEYS` produces two more legitimate errors — `FOREIGN_METADATA_VERB` in `validation.ts` (a `Record` over those keys) and the key's absence from `ColumnDefinition`. Those are the gate working, not sites to \"fix\".\n\nAny error beyond those four is a site reading a hardcoded type list that should read the registry — fix that site, don't work around it.\n\n## Directory Structure\n\n```\napps/sim/lib/table/column-types/\n├── types.ts # ColumnTypeDefinition — the contract you implement\n├── types.server.ts # ColumnTypeServerDefinition — cell migrations only\n├── registry.ts # Record ← client-safe, the gate\n├── registry.server.ts # Record ← adds migrations (drizzle)\n├── index.ts # barrel + accessors (columnTypeOf, columnTypeById, …)\n└── {type}.ts # one file per type — what you write\n```\n\n## Step 1: Pick the storage shape\n\nDecide what a cell literally holds in `user_table_rows.data` (JSONB). This drives almost everything else:\n\n| Storage | `jsonbCast` | Notes |\n|---------|-------------|-------|\n| number | `'numeric'` | Filters/sorts compare numerically. `currency` does this. |\n| ISO string | `'timestamptz'` | `date` does this. |\n| string / bool / object | `null` | Text comparison is correct. |\n\n**Prefer an existing primitive over a new shape.** `currency` stores a plain number and keeps its ISO code as *display metadata* — which is why filtering, sorting, uniqueness, and CSV export all reuse the numeric paths untouched, and why re-denominating a column rewrites zero rows.\n\n## Step 2: Add the icon\n\nCreate `packages/emcn/src/icons/type-{name}.tsx`, copying the geometry conventions of its siblings exactly:\n\n```tsx\nimport type { SVGProps } from 'react'\n\n/**\n * Type {name} icon component - {what the glyph is} for {name} columns\n * @param props - SVG properties including className, fill, etc.\n */\nexport function Type{Pascal}(props: SVGProps) {\n return (\n