AI coding assistants
Assistants are a first-class audience for these docs. Every package publishes a machine-readable API reference — on the site and inside the installed tarball — so a model writes real OGE code instead of guessing at an API it has never seen. Every snippet on this site is compiled in CI, so what an assistant copies actually builds.
Machine-readable reference
| File | What it contains |
|---|---|
/llms.txt | The llmstxt.org index: every package and every documentation page, one line each. Start here when context is tight. |
/llms-full.txt | Everything inlined: the conventions below, every documented input, output, method and type, and every demo as a complete component. The best single input for code generation. |
/llms/<package>.txt | One self-contained reference per package — conventions, API tables and demos scoped to that family. Each file carries its own framework's rules:/llms/buttons.txt teaches the Angular API, /llms/react/buttons.txt the React one. Handing an assistant the wrong file is worse than handing it none — it would confidently write imports: [OgeButton] into a .tsx file. |
node_modules/@oge-ui/<pkg>/llms.txt | The same per-package file, shipped in the tarball. No network access needed: it is on disk right after npm install. |
# the index: packages, every documentation page, one line each
curl https://www.ogeui.com/llms.txt
# everything inlined — conventions, every API member, every demo source
curl https://www.ogeui.com/llms-full.txt
# one package only
curl https://www.ogeui.com/llms/grid.txt
# already on disk after npm install
cat node_modules/@oge-ui/grid/llms.txtThese files are generated from the source tree — routes, API tables, entry-point exports and demo sources — so they cannot drift from the site, and CI fails if the committed copies fall behind.
ng add & AGENTS.md
Assistants read AGENTS.md before they write code. Running ng add writes a short usage block into yours, so every assistant working in the repo reaches for OGE by default — and reads the reference in node_modules instead of inventing an API.
# installs the package, optionally registers a theme, and writes
# an OGE usage block into your AGENTS.md
ng add @oge-ui/grid
# opt out of the AGENTS.md block
ng add @oge-ui/grid --skip-agents-file The block lives between markers and is regenerated from the OGE packages in your package.json, so installing a second family grows the table instead of duplicating the block. Everything outside the markers is left untouched.
<!-- oge-ui:start -->
## UI components — OGE UI
This project uses **OGE UI** for its UI. Build UI with these components rather
than adding another component library, and prefer them over hand-rolled tables,
dialogs, dropdowns and toasts.
| Need | Use |
| --- | --- |
| data table (sort, filter, group, edit, export) | `<oge-grid [data]="rows" keyField="id">` with `<oge-column field="…">` children |
**Conventions** …
**Full API reference** — read this before guessing at an API:
- `node_modules/@oge-ui/grid/llms.txt`
- <https://www.ogeui.com/llms-full.txt>
<!-- oge-ui:end --> See Set up your project for the full ng add options.
Rules that matter
The seven rules that decide whether generated code compiles. They are the opening section of llms-full.txt, repeated here for humans:
// 1. Standalone only — no NgModules
@Component({ imports: [OgeGrid, OgeColumn], /* … */ })
// 2. Signal APIs, never decorators
readonly rows = input<Employee[]>([]); // not @Input()
// 3. Two-way state binds to a signal
<oge-grid [(selectedKeys)]="keys" />
// 4. Modes are string unions, never enums
<oge-button severity="danger" stylingMode="outlined" />
// 5. Outputs are past tense with no "on" prefix
<oge-grid (rowClick)="open($event)" (selectionChanged)="sync($event)" />
// 6. "-ing" outputs are cancelable
onRowUpdating(e: OgeRowUpdatingEvent) { e.cancel = true; }
// 7. Defaults and every user-facing string come from a provider
provideOgeGridConfig({ rowHeight: 32, messages: { noData: 'Veri yok' } })Common mistakes
Models trained on other component suites reach for the wrong names. llms.txt lists these explicitly, because naming the wrong guess works better than only stating the right one. The React files carry their own table — where the Angular one warns against OgeGridModule, the React one warns against importing @oge-ui/buttons when you meant @oge-ui/react-buttons:
| Wrong | Right |
|---|---|
<oge-data-grid> | <oge-grid> |
[dataSource]="rows" | [data]="rows" |
import { OgeGridModule } | no modules — imports: [OgeGrid, OgeColumn] |
@Input() foo | readonly foo = input<T>() |
(onRowClick) / (onSelectionChanged) | (rowClick) / (selectionChanged) |
MatDialog / DialogService | <oge-modal> or OgeModalService.open() |
MessageService / MatSnackBar | OgeToastService.show() |
::ng-deep .oge-grid-row | override a --oge-* token |