@edux-design/popovers 0.0.4 → 0.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edux-design/popovers",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "private": false,
   "sideEffects": [
     "**/*.css"

package/src/demos/Popover.stories.jsx

@@ -197,3 +197,52 @@ export const Sides = {
     },
   },
 };
+
+/**
+ * ───────────────────────────────────────────────
+ * 🧭 No Auto Focus Example
+ * ───────────────────────────────────────────────
+ */
+export const NoAutoFocus = {
+  render: (args) => (
+    <Popover>
+      <PopoverTrigger asChild>
+        <Button variant="primary">Open Non-Focusing Popover</Button>
+      </PopoverTrigger>
+
+      <PopoverContent
+        {...args}
+        onOpenAutoFocus={(event) => {
+          // Prevent Radix from automatically moving focus into the popover
+          event.preventDefault();
+        }}
+        trapFocus={false}
+        disableOutsidePointerEvents={false}
+        className="w-[220px]"
+      >
+        <p className="text-sm mb-4">
+          This popover <strong>does not steal focus</strong>. The trigger (or
+          other input) remains focused.
+        </p>
+        <PopoverClose asChild>
+          <Button variant="secondary" size="sm">
+            Close
+          </Button>
+        </PopoverClose>
+      </PopoverContent>
+    </Popover>
+  ),
+  args: {
+    side: "bottom",
+    align: "center",
+    sideOffset: 8,
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          "Demonstrates disabling Radix’s default auto-focus behaviour using `onOpenAutoFocus={(e) => e.preventDefault()}`. The editor or trigger element retains focus when the popover opens.",
+      },
+    },
+  },
+};