@overdoser/react-toolkit 0.0.8 → 0.0.9

package/AGENTS.md

@@ -112,6 +112,7 @@ Full copy-paste-able files live alongside this doc. Each is one self-contained f
 - [recipes/interactive-area-chart.tsx](./recipes/interactive-area-chart.tsx) — Data-range filter (not series toggle): all series stay visible, the selector picks the time window. Three selector UIs exported: `InteractiveAreaChartTiles`, `InteractiveAreaChartNavigator`, `InteractiveAreaChartDropdown`.
 - [recipes/interactive-pie-chart.tsx](./recipes/interactive-pie-chart.tsx) — Metric/period filter for `PieChart`: all slices stay visible, the selector picks which metric drives the pie. Three exports: `InteractivePieChartTiles`, `InteractivePieChartNavigator`, `InteractivePieChartDropdown`.
 - [recipes/trading-chart.tsx](./recipes/trading-chart.tsx) — Full-stack `TradingChart` with a resolution selector, in-memory datafeed adapter, and the SMA/EMA/Bollinger/RSI/Volume indicator stack. Swap `createMemoryDatafeed` for your own REST/WebSocket adapter; everything else carries over.
+- [recipes/tag-input.tsx](./recipes/tag-input.tsx) — Tag-input pattern via `<Select multiple allowCreate>`: pick from existing tags or type a new one + Enter to create. `onCreate` persists the new tag back into the options list. Wired through `<FormField>` for react-hook-form integration.
 
 ## Anti-patterns to refuse
 

package/components/inputs/Select/Select.d.ts

@@ -46,6 +46,24 @@ export interface SelectProps extends Omit<ComponentPropsWithRef<'select'>, 'onCh
     onValuesChange?: (values: string[]) => void;
     /** Clear the search query after each toggle in multi mode. @default true */
     clearSearchOnSelect?: boolean;
+    /**
+     * Multi-mode only. When `true`, an extra "Create '<query>'" row appears
+     * in the menu whenever the search query doesn't match an existing option.
+     * Pressing Enter (or clicking the row) adds the trimmed query as a new
+     * selected value and fires `onCreate`. @default false
+     */
+    allowCreate?: boolean;
+    /**
+     * Multi-mode only. Called with the newly-created value when `allowCreate`
+     * is true and the user creates a new tag. Consumers typically persist the
+     * new value (e.g. push it into their options list).
+     */
+    onCreate?: (value: string) => void;
+    /**
+     * Multi-mode only. Custom render function for the "Create" row body.
+     * @default (q) => `Create "${q}"`
+     */
+    createLabel?: (query: string) => React.ReactNode;
 }
 /**
  * Three internal modes, picked automatically: