Skip to Content
ConceptsThe catalog

The catalog

The catalog is the app’s vocabulary: its panels, the goals a user can have, and the next steps the app can suggest. The model reads it, so it is written in plain, literal words. Pass it through defineCatalog, which checks it when the app starts.

import { defineCatalog } from "@attuneui/core"; export const CATALOG = defineCatalog<PanelId, GoalId, ActionId>({ panelIds, panels, goalIds, goals, actionIds, actions, goalPanelAffinity, });

Panels

FieldMeaning
idThe panel id. It may not be "unclear".
titleThe name people see, also in the model’s state.
descriptionWhat the panel shows and what the user can do there. Sent to the model.
iconAn icon name. Your UI maps it to an icon component.
defaultVisibleShown on first load, before there is any activity.
commandExamplesOptional example commands this panel answers. Set on every panel or on none.

panelIds is the default order.

Goals

Each goal has a label (for example “Answering tickets”) and a description that the model reads. notFor is optional: what the goal is not, for goals the model confuses with another. Set it on every goal or on none. The goal ids must include "unclear" (UNCLEAR_GOAL), the answer when there is too little activity to tell.

Actions

Each action has a short label (it may hold placeholders such as {client}, which your app fills in), a description the model reads, and the panel that performs it. The action ids must include "none" (NO_ACTION), with panel: null: the answer when there is no clear next step.

Goal-to-panel affinity

goalPanelAffinity says how strongly each goal implies each panel, from 0 to 1. It is a hand-written rule, not a model call: the policy blends it with the model’s per-panel relevance, weighted by the model’s goal probabilities. A panel left out counts as 0.

goalPanelAffinity: { answer_tickets: { tickets: 1, macros: 0.6, articles: 0.5, customers: 0.3 }, research_issue: { articles: 1, tickets: 0.5 }, unclear: {}, },

The checks

defineCatalog throws a CatalogError that lists every problem at once: an empty or repeated id, an id with no definition or a definition with no id, a missing "unclear" goal or "none" action, a panel named "unclear", an action whose panel is not in the catalog, a goal with no affinity entry (use {} for none), an affinity outside 0 to 1, and an optional field set on some entries but not all.

Layout modes

The three layouts are the library’s, not the catalog’s, because the policy treats each one differently:

ModeWhenSlots
focusDeep work on one thingOne main panel, a few small helpers
compareMoving between two related thingsTwo large panels side by side
overviewScanning or switching between many areasMany medium panels
Last updated on