@proyecto-viviana/solidaria 0.4.2 → 0.6.0-rc.0

package/src/tooltip/intl/index.ts

@@ -0,0 +1,76 @@
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/ar-AE.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/bg-BG.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/cs-CZ.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/da-DK.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/de-DE.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/el-GR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/en-US.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/es-ES.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/et-EE.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/fi-FI.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/fr-FR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/he-IL.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/hr-HR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/hu-HU.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/it-IT.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/ja-JP.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/ko-KR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/lt-LT.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/lv-LV.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/nb-NO.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/nl-NL.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/pl-PL.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/pt-BR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/pt-PT.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/ro-RO.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/ru-RU.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/sk-SK.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/sl-SI.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/sr-SP.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/sv-SE.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/tr-TR.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/uk-UA.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/zh-CN.json
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/intl/previewtrigger/zh-TW.json
+
+// Ported from @react-aria/link-preview intl catalog.
+/** Preview-trigger internationalization strings from the pinned React Aria source. */
+
+import type { LocalizedStrings } from "@internationalized/string";
+
+export const previewTriggerIntlStrings: LocalizedStrings<"longPressMessage", string> = {
+  "ar-AE": { longPressMessage: "اضغط مطولاً لفتح المعاينة" },
+  "bg-BG": { longPressMessage: "Натиснете продължително, за да отворите предварителен преглед" },
+  "cs-CZ": { longPressMessage: "Podržením tlačítka otevřete náhled" },
+  "da-DK": { longPressMessage: "Tryk og hold nede for at åbne forhåndsvisningen" },
+  "de-DE": { longPressMessage: "Zum Öffnen der Vorschau lange drücken" },
+  "el-GR": { longPressMessage: "Πατήστε παρατεταμένα για να ανοίξετε την προεπισκόπηση" },
+  "en-US": { longPressMessage: "Long press to open preview" },
+  "es-ES": { longPressMessage: "Pulse para abrir la vista previa" },
+  "et-EE": { longPressMessage: "Eelvaate avamiseks vajutage pikalt" },
+  "fi-FI": { longPressMessage: "Avaa esikatselu painamalla pitkään" },
+  "fr-FR": { longPressMessage: "Appuyer longuement pour ouvrir la prévisualisation" },
+  "he-IL": { longPressMessage: "לחצו לחיצה ארוכה כדי לפתוח תצוגה מקדימה" },
+  "hr-HR": { longPressMessage: "Potreban je duži pritisak za otvaranje pregleda" },
+  "hu-HU": { longPressMessage: "Nyomja meg hosszan az előnézet megnyitásához" },
+  "it-IT": { longPressMessage: "Tieni premuto per aprire l’anteprima" },
+  "ja-JP": { longPressMessage: "長押ししてプレビューを開く" },
+  "ko-KR": { longPressMessage: "길게 눌러 미리 보기 열기" },
+  "lt-LT": { longPressMessage: "Ilgai paspauskite, kad atvertumėte peržiūrą" },
+  "lv-LV": { longPressMessage: "Nospiediet un paturiet, lai skatītu priekšskatījumu" },
+  "nb-NO": { longPressMessage: "Langt trykk for å åpne forhåndsvisningen" },
+  "nl-NL": { longPressMessage: "Lang indrukken voor voorvertoning" },
+  "pl-PL": { longPressMessage: "Naciśnij i przytrzymaj, aby otworzyć podgląd" },
+  "pt-BR": { longPressMessage: "Pressione e segure para abrir a visualização" },
+  "pt-PT": { longPressMessage: "Prima e mantenha premido para abrir a pré-visualização" },
+  "ro-RO": { longPressMessage: "Apăsați lung pentru a deschide previzualizarea" },
+  "ru-RU": { longPressMessage: "Нажмите и удерживайте, чтобы открыть предварительный просмотр" },
+  "sk-SK": { longPressMessage: "Náhľad otvoríte dlhým stlačením" },
+  "sl-SI": { longPressMessage: "Dolg pritisk za odpiranje predogleda" },
+  "sr-SP": { longPressMessage: "Dugo pritisnite da biste otvorili pregled" },
+  "sv-SE": { longPressMessage: "Håll nedtryckt för att öppna förhandsgranskningen" },
+  "tr-TR": { longPressMessage: "Önizlemeyi açmak için uzun süre basılı tutun" },
+  "uk-UA": { longPressMessage: "Натисніть і утримуйте, щоб відкрити попередній перегляд" },
+  "zh-CN": { longPressMessage: "长按以打开预览" },
+  "zh-TW": { longPressMessage: "長按以開啟預覽" },
+};

package/src/tree/createTree.ts

@@ -1,15 +1,32 @@
+/*
+ * Copyright 2024 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tree/useTree.ts
+
 /**
  * createTree - Provides accessibility for a tree component.
  * Based on @react-aria/tree/useTree.
  */
 
-import { createEffect, createMemo, type Accessor } from "solid-js";
-import type { JSX } from "solid-js";
+import { createMemo, createTrackedEffect } from "solid-js";
+import type { Accessor } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import { createId } from "@proyecto-viviana/solid-stately";
-import type { TreeState, TreeCollection, Key } from "@proyecto-viviana/solid-stately";
+import type { TreeState, TreeCollection, Key, Collection } from "@proyecto-viviana/solid-stately";
 import type { AriaTreeProps, TreeAria } from "./types";
 import { scrollIntoViewport } from "../utils";
 import { getInteractionModality } from "../interactions/createInteractionModality";
+import { mergeProps } from "../utils/mergeProps";
+import { createTypeSelect } from "../selection/createTypeSelect";
 
 /**
  * Metadata stored for a tree instance.
@@ -103,6 +120,23 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
   // Store in WeakMap using the state as key
   treeDataMap.set(state(), treeData);
 
+  const { typeSelectProps } = createTypeSelect({
+    collection: () => state().collection as unknown as Collection<T>,
+    focusedKey: () => state().focusedKey,
+    onFocusedKeyChange: (key) => state().setFocusedKey(key),
+    isKeyDisabled: (key) => isNavigationDisabled(state(), key),
+  });
+
+  const restoreFocusedRow = (key: Key | null) => {
+    if (key == null) return;
+    queueMicrotask(() => {
+      state().setFocused(true);
+      const el = ref();
+      const target = el?.querySelector<HTMLElement>(`[data-key="${CSS.escape(String(key))}"]`);
+      target?.focus();
+    });
+  };
+
   // Handle keyboard navigation
   const onKeyDown = (e: KeyboardEvent) => {
     const s = state();
@@ -126,6 +160,9 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
               )
             : findNextNavigableKey(s, collection.getFirstKey(), (k) => collection.getKeyAfter(k));
         if (nextKey != null) {
+          if (e.shiftKey) {
+            s.extendSelection(nextKey);
+          }
           s.setFocusedKey(nextKey);
         }
         break;
@@ -139,6 +176,9 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
               )
             : findNextNavigableKey(s, collection.getLastKey(), (k) => collection.getKeyBefore(k));
         if (prevKey != null) {
+          if (e.shiftKey) {
+            s.extendSelection(prevKey);
+          }
           s.setFocusedKey(prevKey);
         }
         break;
@@ -153,6 +193,7 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
             if (node?.isExpandable) {
               if (!s.isExpanded(focusedKey)) {
                 s.expandKey(focusedKey);
+                restoreFocusedRow(focusedKey);
               } else {
                 const children = [...collection.getChildren(focusedKey)];
                 if (children.length > 0) {
@@ -164,6 +205,7 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
             // Collapse or move to parent
             if (node?.isExpandable && s.isExpanded(focusedKey)) {
               s.collapseKey(focusedKey);
+              restoreFocusedRow(focusedKey);
             } else if (node?.parentKey != null) {
               s.setFocusedKey(node.parentKey);
             }
@@ -211,32 +253,6 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
         }
         break;
       }
-      case "*": {
-        // Expand all siblings at current level
-        e.preventDefault();
-        if (focusedKey != null) {
-          const node = collection.getItem(focusedKey);
-          if (node) {
-            // Find all siblings at the same level
-            const parentKey = node.parentKey;
-            let siblings: Key[];
-            if (parentKey != null) {
-              siblings = [...collection.getChildren(parentKey)].map((n) => n.key);
-            } else {
-              // Root level siblings
-              siblings = collection.rows.filter((n) => n.level === 0).map((n) => n.key);
-            }
-            // Expand all expandable siblings
-            for (const siblingKey of siblings) {
-              const sibling = collection.getItem(siblingKey);
-              if (sibling?.isExpandable && !s.isExpanded(siblingKey)) {
-                s.expandKey(siblingKey);
-              }
-            }
-          }
-        }
-        break;
-      }
     }
   };
 
@@ -287,10 +303,7 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
       // enters at the first selected row, else the first navigable row.
       const backward =
         !!relatedTarget &&
-        !!(
-          currentTarget.compareDocumentPosition(relatedTarget) &
-          Node.DOCUMENT_POSITION_FOLLOWING
-        );
+        !!(currentTarget.compareDocumentPosition(relatedTarget) & Node.DOCUMENT_POSITION_FOLLOWING);
       key = backward
         ? (lastSelectedKey(s) ??
           findNextNavigableKey(s, s.collection.getLastKey(), (k) => s.collection.getKeyBefore(k)))
@@ -312,7 +325,7 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
     }
   };
 
-  createEffect(() => {
+  createTrackedEffect(() => {
     const s = state();
     const key = s.focusedKey;
     const el = ref();
@@ -339,22 +352,25 @@ export function createTree<T extends object, C extends TreeCollection<T> = TreeC
     const p = props();
     const s = state();
 
-    const baseProps: Record<string, unknown> = {
-      role: "treegrid",
-      id: treeId,
-      "aria-label": p["aria-label"],
-      "aria-labelledby": p["aria-labelledby"],
-      "aria-describedby": p["aria-describedby"],
-      "aria-multiselectable": s.selectionMode === "multiple" ? true : undefined,
-      "aria-disabled": p.isDisabled || undefined,
-      // Roving container tab stop: `0` while no row is focused (Tab enters the
-      // tree), `-1` once a row takes focus (the row holds the tab stop). Mirrors
-      // `useSelectableCollection` `tabIndex = focusedKey == null ? 0 : -1`.
-      tabIndex: p.isDisabled ? undefined : s.focusedKey == null ? 0 : -1,
-      onKeyDown,
-      onFocusIn,
-      onFocusOut,
-    };
+    const baseProps: Record<string, unknown> = mergeProps(
+      typeSelectProps as Record<string, unknown>,
+      {
+        role: "treegrid",
+        id: treeId,
+        "aria-label": p["aria-label"],
+        "aria-labelledby": p["aria-labelledby"],
+        "aria-describedby": p["aria-describedby"],
+        "aria-multiselectable": s.selectionMode === "multiple" ? true : undefined,
+        "aria-disabled": p.isDisabled || undefined,
+        // Roving container tab stop: `0` while no row is focused (Tab enters the
+        // tree), `-1` once a row takes focus (the row holds the tab stop). Mirrors
+        // `useSelectableCollection` `tabIndex = focusedKey == null ? 0 : -1`.
+        tabIndex: p.isDisabled ? undefined : s.focusedKey == null ? 0 : -1,
+        onKeyDown,
+        onFocusIn,
+        onFocusOut,
+      },
+    );
 
     // Add row count for virtualized trees
     if (p.isVirtualized) {

package/src/tree/createTreeItem.ts

@@ -1,10 +1,26 @@
+/*
+ * Copyright 2024 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tree/useTreeItem.ts
+
 /**
  * createTreeItem - Provides accessibility for a tree item.
  * Based on @react-aria/tree/useTreeItem.
  */
 
-import { createMemo, type Accessor } from "solid-js";
-import type { JSX } from "solid-js";
+import { createMemo } from "solid-js";
+import { bindCapture } from "../utils/capture";
+import type { Accessor } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import { createId } from "@proyecto-viviana/solid-stately";
 import type {
   Collection,
@@ -18,6 +34,8 @@ import { getTreeData } from "./createTree";
 import { createSelectableItem, type SelectableItemState } from "../selection/createSelectableItem";
 import { mergeCollectionRowInteractionProps } from "../selection/createCollectionRowInteraction";
 import { mergeProps } from "../utils/mergeProps";
+import { createStringFormatter } from "../i18n";
+import { treeIntlStrings } from "./intl";
 
 /**
  * Creates accessibility props for a tree item.
@@ -27,6 +45,7 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
   state: Accessor<TreeState<T, C>>,
   ref: Accessor<HTMLElement | null>,
 ): TreeItemAria {
+  const stringFormatter = createStringFormatter(treeIntlStrings, "@react-aria/tree");
   const fallbackRowId = createId();
   const expandButtonId = createId();
 
@@ -35,17 +54,9 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
     return treeData ? `${treeData.treeId}-row-${String(props().node.key)}` : fallbackRowId;
   });
 
-  const isSelected = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isSelected(p.node.key);
-  });
+  const isSelected = () => state().isSelected(props().node.key);
 
-  const isExpanded = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isExpanded(p.node.key);
-  });
+  const isExpanded = () => state().isExpanded(props().node.key);
 
   const isExpandable = createMemo(() => {
     const p = props();
@@ -120,6 +131,7 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
                 treeAction?.(p.node.key);
                 if (shouldToggleOnAction) {
                   s.toggleKey(p.node.key);
+                  queueMicrotask(() => ref()?.focus());
                 }
               }
             : undefined,
@@ -155,7 +167,7 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
     };
   });
 
-  const rowProps = createMemo(() => {
+  const rowProps = () => {
     const p = props();
     const node = p.node;
     const { posinset, setsize } = siblingInfo();
@@ -166,9 +178,13 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
     const baseProps: Record<string, unknown> = {
       role: "row",
       "aria-label": textValue || undefined,
-      "aria-selected": selectableState.canSelectItem?.(node.key) ? isSelected() : undefined,
-      "aria-disabled": selectableItem.isDisabled() || undefined,
-      "aria-expanded": isExpandable() ? isExpanded() : undefined,
+      "aria-selected": selectableState.canSelectItem?.(node.key)
+        ? isSelected()
+          ? "true"
+          : "false"
+        : undefined,
+      "aria-disabled": selectableItem.isDisabled() ? "true" : undefined,
+      "aria-expanded": isExpandable() ? (isExpanded() ? "true" : "false") : undefined,
       "aria-level": node.level + 1, // 1-based for ARIA
       "aria-posinset": posinset,
       "aria-setsize": setsize,
@@ -185,11 +201,58 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
       baseProps,
     );
 
+    const direction = () => treeData?.direction ?? "ltr";
+    const expandKey = () => (direction() === "rtl" ? "ArrowLeft" : "ArrowRight");
+    const collapseKey = () => (direction() === "rtl" ? "ArrowRight" : "ArrowLeft");
+
     return mergeCollectionRowInteractionProps(mergedProps, {
       ref,
       keyboardNavigationBehavior: () => treeData?.keyboardNavigationBehavior ?? "arrow",
-      direction: () => treeData?.direction ?? "ltr",
+      direction,
+      onBeforeArrowNavigation: (event) => {
+        const s = state();
+        const node = props().node;
+        const row = ref();
+        if (!row || s.focusedKey !== node.key) {
+          return false;
+        }
+        if (event.key === expandKey() && isExpandable() && !s.isExpanded(node.key)) {
+          event.preventDefault();
+          event.stopPropagation();
+          s.toggleKey(node.key);
+          queueMicrotask(() => row.focus());
+          return true;
+        }
+        if (event.key === collapseKey()) {
+          if (isExpandable() && s.isExpanded(node.key)) {
+            event.preventDefault();
+            event.stopPropagation();
+            s.toggleKey(node.key);
+            queueMicrotask(() => row.focus());
+            return true;
+          }
+          if (
+            !s.isExpanded(node.key) &&
+            node.parentKey != null &&
+            s.collection.getItem(node.parentKey)?.type === "item"
+          ) {
+            event.preventDefault();
+            event.stopPropagation();
+            s.setFocusedKey(node.parentKey);
+            return true;
+          }
+        }
+        return false;
+      },
     });
+  };
+
+  bindCapture(ref, {
+    keydown: (event) => {
+      const handler = (rowProps() as { onKeyDownCapture?: (event: KeyboardEvent) => void })
+        .onKeyDownCapture;
+      handler?.(event as KeyboardEvent);
+    },
   });
 
   const gridCellProps = createMemo(() => {
@@ -208,6 +271,7 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
     if (selectableItem.isDisabled()) return;
 
     s.toggleKey(p.node.key);
+    queueMicrotask(() => ref()?.focus());
   };
 
   const stopPointerPropagation = (e: Event) => {
@@ -216,11 +280,11 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
     e.stopPropagation();
   };
 
-  const expandButtonProps = createMemo(() => {
+  const expandButtonProps = () => {
     const baseProps: Record<string, unknown> = {
       type: "button",
       id: expandButtonId,
-      "aria-label": isExpanded() ? "Collapse" : "Expand",
+      "aria-label": stringFormatter().format(isExpanded() ? "collapse" : "expand"),
       "aria-labelledby": isExpandable() ? `${expandButtonId} ${rowId()}` : undefined,
       "data-react-aria-prevent-focus": true,
       onClick: onExpandClick,
@@ -229,11 +293,11 @@ export function createTreeItem<T extends object, C extends TreeCollection<T> = T
       onMouseDown: stopPointerPropagation,
       onMouseUp: stopPointerPropagation,
       tabIndex: -1, // Not in tab order, use arrow keys
-      "aria-hidden": !isExpandable() ? true : undefined,
+      "aria-hidden": !isExpandable() ? "true" : undefined,
     };
 
     return baseProps as JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-  });
+  };
 
   return {
     get rowProps() {

package/src/tree/createTreeSelectionCheckbox.ts

@@ -1,10 +1,25 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/gridlist/useGridListSelectionCheckbox.ts
+
 /**
  * createTreeSelectionCheckbox - Provides accessibility for a tree item's selection checkbox.
  * Based on @react-aria/gridlist/useGridListSelectionCheckbox.
  */
 
-import { createMemo, type Accessor } from "solid-js";
-import type { JSX } from "solid-js";
+import { createMemo } from "solid-js";
+import type { Accessor } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import { createId } from "@proyecto-viviana/solid-stately";
 import type { TreeState, TreeCollection } from "@proyecto-viviana/solid-stately";
 import type { AriaTreeSelectionCheckboxProps, TreeSelectionCheckboxAria } from "./types";
@@ -30,17 +45,9 @@ export function createTreeSelectionCheckbox<
     return treeData ? `${treeData.treeId}-row-${String(props().key)}` : fallbackRowId;
   });
 
-  const isSelected = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isSelected(p.key);
-  });
+  const isSelected = () => state().isSelected(props().key);
 
-  const isDisabled = createMemo(() => {
-    const s = state();
-    const p = props();
-    return s.isDisabled(p.key);
-  });
+  const isDisabled = () => state().isDisabled(props().key);
 
   const onChange = (e: Event) => {
     const s = state();
@@ -61,24 +68,18 @@ export function createTreeSelectionCheckbox<
     e.stopPropagation();
   };
 
-  const checkboxProps = createMemo(() => {
-    const baseProps: Record<string, unknown> = {
-      type: "checkbox",
-      id: checkboxId,
-      "aria-label": "Select",
-      "aria-labelledby": `${checkboxId} ${rowId()}`,
-      checked: isSelected(),
-      disabled: isDisabled(),
-      onChange,
-      onClick,
-    };
-
-    return baseProps as JSX.InputHTMLAttributes<HTMLInputElement>;
-  });
-
   return {
     get checkboxProps() {
-      return checkboxProps();
+      return {
+        type: "checkbox",
+        id: checkboxId,
+        "aria-label": "Select",
+        "aria-labelledby": `${checkboxId} ${rowId()}`,
+        checked: isSelected(),
+        disabled: isDisabled(),
+        onChange,
+        onClick,
+      } as JSX.InputHTMLAttributes<HTMLInputElement>;
     },
   };
 }

package/src/tree/intl/ar-AE.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "طي",
+  "expand": "تمديد"
+}

package/src/tree/intl/bg-BG.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Свиване",
+  "expand": "Разширяване"
+}

package/src/tree/intl/cs-CZ.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Sbalit",
+  "expand": "Roztáhnout"
+}

package/src/tree/intl/da-DK.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Skjul",
+  "expand": "Udvid"
+}

package/src/tree/intl/de-DE.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Reduzieren",
+  "expand": "Erweitern"
+}

package/src/tree/intl/el-GR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Σύμπτυξη",
+  "expand": "Ανάπτυξη"
+}

package/src/tree/intl/en-US.json

@@ -0,0 +1,4 @@
+{
+  "expand": "Expand",
+  "collapse": "Collapse"
+}

package/src/tree/intl/es-ES.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Contraer",
+  "expand": "Expandir"
+}

package/src/tree/intl/et-EE.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Ahenda",
+  "expand": "Laienda"
+}

package/src/tree/intl/fi-FI.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Pienennä",
+  "expand": "Laajenna"
+}

package/src/tree/intl/fr-FR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Réduire",
+  "expand": "Développer"
+}

package/src/tree/intl/he-IL.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "כווץ",
+  "expand": "הרחב"
+}

package/src/tree/intl/hr-HR.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Sažmi",
+  "expand": "Proširi"
+}

package/src/tree/intl/hu-HU.json

@@ -0,0 +1,4 @@
+{
+  "collapse": "Összecsukás",
+  "expand": "Kibontás"
+}