@keboola/design 11.0.1 → 11.2.0

package/AGENTS.md

@@ -458,7 +458,7 @@ A host that tracks the request itself rather than returning a promise passes `is
 
 Both router wirings (TanStack Router, and a custom named router) are in [`RECIPES.md`](./RECIPES.md#section-nav).
 
-**Creatable combobox** — `Combobox` with `allowCreate` accepts values not in `items`:
+**Creatable combobox** — `Combobox` with `allowCreate` accepts values not in `items`. Add `canCreate` when the free-form value has a format: it gates the create row on the typed query, so an unparseable one shows the `empty` state instead of an "Add …" row the app would have to reject afterwards.
 
 ```tsx
 <Combobox
@@ -467,10 +467,25 @@ Both router wirings (TanStack Router, and a custom named router) are in [`RECIPE
   onValueChange={setTag}
   allowCreate
   allowClear
+  canCreate={(query) => /^[a-z0-9-]+$/.test(query)}
   placeholder="Pick or create a tag"
 />
 ```
 
+**Adder combobox** — a picker that hands each selection to something else (a list, an API) rather than holding it. Pin `value` to `null`: the input clears after every pick, ready for the next one, and the chosen items live in whatever you render below.
+
+```tsx
+<Combobox
+  items={colleagues}
+  value={null}
+  onValueChange={(email) => email && addRecipient(email)}
+  allowCreate
+  canCreate={isEmailValid}
+  empty="Enter a valid email address"
+  placeholder="Choose a colleague or enter an email address"
+/>
+```
+
 **Sheet** — use `Sheet.Header title="…" description="…"` for a styled title + close icon; do **not** hand-roll with the raw `Sheet.Title`, which renders an unstyled `<h2>`. `Sheet.Body` provides horizontal padding only (`tw:px-4`) — add your own vertical rhythm/gap:
 
 ```tsx