fix: updating correct map

Author: thejackshelton

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

@@ -0,0 +1,84 @@
+import { Component, JSXNode, PropsOf, QRL, Signal } from '@builder.io/qwik';
+import { HAccordionItem } from './accordion-item';
+import { HAccordionRootImpl } from './accordion-root';
+
+export type AccordionRootProps = PropsOf<'div'> & {
+  /** If true, multiple items can be open at the same time. */
+  multiple?: boolean;
+
+  /** The reactive value controlling which item is open. */
+  'bind:value'?: Signal<string | null>;
+
+  /** The initial value of the currently open item. */
+  value?: string;
+
+  /** The initial index of the currently open item. */
+  initialIndex?: number;
+
+  /** A QRL that is called when the selected item changes. */
+  onChange$?: QRL<(value: string) => void>;
+
+  /** A map of the item indexes and their disabled state. */
+  itemsMap?: Map<number, boolean>;
+};
+
+export const HAccordionRoot: Component<AccordionRootProps> = (
+  props: AccordionRootProps,
+) => {
+  const { children: accordionChildren, ...rest } = props;
+
+  let currItemIndex = 0;
+  let initialIndex = null;
+  const itemsMap = new Map();
+
+  const childrenToProcess = (
+    Array.isArray(accordionChildren) ? [...accordionChildren] : [accordionChildren]
+  ) as Array<JSXNode>;
+
+  while (childrenToProcess.length) {
+    const child = childrenToProcess.shift();
+
+    if (!child) {
+      continue;
+    }
+
+    if (Array.isArray(child)) {
+      childrenToProcess.unshift(...child);
+      continue;
+    }
+
+    switch (child.type) {
+      case HAccordionItem: {
+        child.props._index = currItemIndex;
+        if (props.value !== undefined && props.value === child.props.value) {
+          initialIndex = currItemIndex;
+        }
+        itemsMap.set(currItemIndex, child.props.disabled === true);
+
+        currItemIndex++;
+        break;
+      }
+
+      default: {
+        if (child) {
+          const anyChildren = Array.isArray(child.children)
+            ? [...child.children]
+            : [child.children];
+          childrenToProcess.unshift(...(anyChildren as JSXNode[]));
+        }
+
+        break;
+      }
+    }
+  }
+
+  return (
+    <HAccordionRootImpl
+      initialIndex={initialIndex ?? undefined}
+      itemsMap={itemsMap}
+      {...rest}
+    >
+      {props.children}
+    </HAccordionRootImpl>
+  );
+};

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

@@ -1,98 +1,13 @@
 import {
-  Component,
-  JSXNode,
-  PropsOf,
-  QRL,
   Signal,
   Slot,
   component$,
+  useComputed$,
   useContextProvider,
   useSignal,
-  useComputed$,
 } from '@builder.io/qwik';
+import { AccordionRootProps } from './accordion-inline';
 import { accordionContextId } from './accordion-context';
-import { HAccordionItem } from './accordion-item';
-
-export type AccordionRootProps = PropsOf<'div'> & {
-  /** If true, multiple items can be open at the same time. */
-  multiple?: boolean;
-
-  /** The reactive value controlling which item is open. */
-  'bind:value'?: Signal<string | null>;
-
-  /** The initial value of the currently open item. */
-  value?: string;
-
-  /** The initial index of the currently open item. */
-  initialIndex?: number;
-
-  /** A QRL that is called when the selected item changes. */
-  onChange$?: QRL<(value: string) => void>;
-
-  /** A map of the item indexes and their disabled state. */
-  itemsMap?: Map<number, boolean>;
-};
-
-export const HAccordionRoot: Component<AccordionRootProps> = (
-  props: AccordionRootProps,
-) => {
-  const { children: accordionChildren, ...rest } = props;
-
-  let currItemIndex = 0;
-  let initialIndex = null;
-  const itemsMap = new Map();
-
-  const childrenToProcess = (
-    Array.isArray(accordionChildren) ? [...accordionChildren] : [accordionChildren]
-  ) as Array<JSXNode>;
-
-  while (childrenToProcess.length) {
-    const child = childrenToProcess.shift();
-
-    if (!child) {
-      continue;
-    }
-
-    if (Array.isArray(child)) {
-      childrenToProcess.unshift(...child);
-      continue;
-    }
-
-    switch (child.type) {
-      case HAccordionItem: {
-        child.props._index = currItemIndex;
-        if (props.value !== undefined && props.value === child.props.value) {
-          initialIndex = currItemIndex;
-        }
-        itemsMap.set(currItemIndex, child.props.disabled === true);
-
-        currItemIndex++;
-        break;
-      }
-
-      default: {
-        if (child) {
-          const anyChildren = Array.isArray(child.children)
-            ? [...child.children]
-            : [child.children];
-          childrenToProcess.unshift(...(anyChildren as JSXNode[]));
-        }
-
-        break;
-      }
-    }
-  }
-
-  return (
-    <HAccordionRootImpl
-      initialIndex={initialIndex ?? undefined}
-      itemsMap={itemsMap}
-      {...rest}
-    >
-      {props.children}
-    </HAccordionRootImpl>
-  );
-};
 
 export const HAccordionRootImpl = component$((props: AccordionRootProps) => {
   const {
@@ -104,11 +19,13 @@ export const HAccordionRootImpl = component$((props: AccordionRootProps) => {
     ...rest
   } = props;
 
+  itemsMap;
+
   const selectedIndexSig = useSignal<number>(initialIndex ?? -1);
   const triggerRefsArray = useSignal<Array<Signal>>([]);
 
   const itemsMapSig = useComputed$(() => {
-    return itemsMap ?? new Map();
+    return props.itemsMap!;
   });
 
   const context = {

packages/kit-headless/src/components/accordion/index.ts

@@ -1,4 +1,4 @@
-export { HAccordionRoot as Root } from './accordion-root';
+export { HAccordionRoot as Root } from './accordion-inline';
 export { HAccordionItem as Item } from './accordion-item';
 export { HAccordionTrigger as Trigger } from './accordion-trigger';
 export { HAccordionContent as Content } from './accordion-content';