@overdoser/react-toolkit 0.0.7 → 0.0.8

package/llms.txt

@@ -222,7 +222,8 @@ Mode B example:
 Import: `import { Popover } from '@overdoser/react-toolkit'`
 
 Props:
-- `trigger: ReactNode` — required. Wrapped in an internal `<button>`.
+- `trigger: ReactNode` — required. By default, wrapped in an internal `<button>` (so a plain `'Help'` string or an icon is fine).
+- `asChild?: boolean` — default `false`. When `true` and `trigger` is a single React element, the trigger is rendered **as-is** with click/aria/ref merged into it via `cloneElement` (no wrapping `<button>`). Use this when you want to pass your own interactive element (e.g. a `<Button>`) without producing `<button>` nested inside `<button>` (a hydration error).
 - `content: ReactNode` — required. Rendered inside an `[role="dialog"]` panel when open.
 - `position?: 'top' | 'bottom' | 'left' | 'right'` — default `'bottom'`
 - `open?: boolean` — controlled.
@@ -233,11 +234,20 @@ Closes on outside click and Escape. Auto-focuses the first focusable child of `c
 
 `children` is intentionally typed as `never` — pass via `content`.
 
-Example:
+Example — string trigger (default wrapping):
 ```tsx
 <Popover trigger="Help" content={<p>Some help text</p>} position="right" />
 ```
 
+Example — passing a `<Button>` without nested-button warning:
+```tsx
+<Popover
+  asChild
+  trigger={<Button iconOnly aria-label="Settings"><GearIcon /></Button>}
+  content={<Settings />}
+/>
+```
+
 ### Modal
 Import: `import { Modal } from '@overdoser/react-toolkit'`
 

package/manifest.json

@@ -143,7 +143,8 @@
       "import": "import { Popover } from '@overdoser/react-toolkit'",
       "element": "div",
       "props": {
-        "trigger": { "type": "ReactNode", "required": true },
+        "trigger": { "type": "ReactNode", "required": true, "notes": "Default mode wraps the value in an internal <button>. Set asChild=true to pass your own interactive element instead." },
+        "asChild": { "type": "boolean", "default": false, "notes": "When true and trigger is a single React element, the element is rendered as-is with onClick/aria-*/ref cloned onto it (no wrapping <button>). Use to avoid the button-in-button hydration warning when passing <Button> as the trigger." },
         "content": { "type": "ReactNode", "required": true },
         "position": { "type": "enum", "values": ["top", "bottom", "left", "right"], "default": "bottom" },
         "open": { "type": "boolean", "notes": "Controlled mode." },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@overdoser/react-toolkit",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "type": "module",
   "main": "./index.js",
   "module": "./index.js",