feat: non-collapsible

Author: thejackshelton

apps/website/src/routes/docs/headless/accordion/index.mdx

@@ -101,6 +101,14 @@ Listen to when a new item is selected by passing a callback function to the `onC
 
 <Showcase name="on-change" />
 
+### Non-collapsible
+
+To disable collapsible behavior, set the `collapsible` prop to `false`.
+
+<Showcase name="collapsible" />
+
+This will prevent the accordion from collapsing when the user clicks on the trigger.
+
 ### Disabled items
 
 Items can be disabled by setting the `disabled` prop to true on the `<Accordion.Item />` component.
@@ -140,5 +148,3 @@ You have custom control over how to render items in the Accordion, allowing for
 ## Example CSS
 
 <CodeSnippet name="accordion.css" />
-
-<Showcase name="collapsible" />

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

@@ -103,6 +103,7 @@ export const HAccordionItem = component$(
         bind:open={isOpenSig}
         id={itemId}
         disabled={context.disabled || props.disabled}
+        collapsible={context.collapsible}
         {...props}
       >
         <Slot />

packages/kit-headless/src/components/collapsible/collapsible-trigger.tsx

@@ -7,7 +7,7 @@ export const HCollapsibleTrigger = component$<PropsOf<'button'>>(
     const contentId = `${context.itemId}-content`;
 
     const handleClick$ = $(async () => {
-      if (!context.collapsible) return;
+      if (context.isOpenSig.value && context.collapsible === false) return;
       context.isOpenSig.value = !context.isOpenSig.value;
     });