fix: accordion item focus effect input focus event

.changeset/short-bulldogs-divide.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/accordion": patch
+---
+
+Fix input focus error in default expanded accordion item, add `onClick`, `onFocus` to `AccordionItem` content wrapper

packages/components/accordion/__tests__/accordion.test.tsx

@@ -345,4 +345,22 @@ describe("Accordion", () => {
 
     expect(getByRole("separator")).toHaveClass("bg-rose-500");
   });
+
+  it("should focus input inside default expanded accordion item correctly", async () => {
+    const wrapper = render(
+      <Accordion defaultExpandedKeys={["1"]}>
+        <AccordionItem key="1" title="Accordion Item 1">
+          <Input label="name" type="text" />
+        </AccordionItem>
+      </Accordion>,
+    );
+
+    const input = wrapper.container.querySelector("input");
+
+    expect(input).not.toBeNull();
+
+    await user.click(input!);
+
+    expect(input).toHaveFocus();
+  });
 });

packages/components/accordion/src/accordion-item.tsx

@@ -71,6 +71,12 @@ const AccordionItem = forwardRef<"button", AccordionItemProps>((props, ref) => {
           initial="exit"
           style={{willChange}}
           variants={transitionVariants}
+          onClick={(e) => {
+            e.stopPropagation();
+          }}
+          onFocus={(e) => {
+            e.stopPropagation();
+          }}
           onKeyDown={(e) => {
             e.stopPropagation();
           }}
@@ -90,6 +96,12 @@ const AccordionItem = forwardRef<"button", AccordionItemProps>((props, ref) => {
               initial="exit"
               style={{willChange}}
               variants={transitionVariants}
+              onClick={(e) => {
+                e.stopPropagation();
+              }}
+              onFocus={(e) => {
+                e.stopPropagation();
+              }}
               onKeyDown={(e) => {
                 e.stopPropagation();
               }}