@octanejs/radix 0.1.48 → 0.1.50

package/README.md

@@ -7,6 +7,13 @@ primitives) on octane's hooks. It mirrors the unified `radix-ui` package's shape
 low-level composition utilities are exported directly, and each component is a namespace
 (`Separator.Root`, `Label.Root`).
 
+## Installation
+
+```sh
+npm install @octanejs/radix
+pnpm add @octanejs/radix
+```
+
 ```tsx
 import { Separator, Label } from '@octanejs/radix';
 

package/dist/cjs/collection-order.cjs

@@ -0,0 +1,44 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var collection_order_exports = {};
+__export(collection_order_exports, {
+  COLLECTION_ORDER_INDEX_THRESHOLD: () => COLLECTION_ORDER_INDEX_THRESHOLD,
+  sortCollectionItemsByDomOrder: () => sortCollectionItemsByDomOrder
+});
+module.exports = __toCommonJS(collection_order_exports);
+const COLLECTION_ORDER_INDEX_THRESHOLD = 256;
+function sortCollectionItemsByDomOrder(orderedNodes, items) {
+  if (items.length >= COLLECTION_ORDER_INDEX_THRESHOLD) {
+    const nodeIndexes = /* @__PURE__ */ new Map();
+    for (let index = 0; index < orderedNodes.length; index++) {
+      nodeIndexes.set(orderedNodes[index], index);
+    }
+    return items.sort(
+      (a, b) => (nodeIndexes.get(a.ref.current) ?? -1) - (nodeIndexes.get(b.ref.current) ?? -1)
+    );
+  }
+  return items.sort(
+    (a, b) => orderedNodes.indexOf(a.ref.current) - orderedNodes.indexOf(b.ref.current)
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  COLLECTION_ORDER_INDEX_THRESHOLD,
+  sortCollectionItemsByDomOrder
+});

package/dist/cjs/collection.cjs

@@ -22,6 +22,7 @@ __export(collection_exports, {
 });
 module.exports = __toCommonJS(collection_exports);
 var import_octane = require("octane");
+var import_collection_order = require("./collection-order.cjs");
 var import_compose_refs = require("./compose-refs.cjs");
 var import_context = require("./context.cjs");
 var import_internal = require("./internal.cjs");
@@ -76,11 +77,11 @@ function createCollection(name) {
     return () => {
       const collectionNode = context.collectionRef.current;
       if (!collectionNode) return [];
-      const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));
-      const items = Array.from(context.itemMap.values());
-      return items.sort(
-        (a, b) => orderedNodes.indexOf(a.ref.current) - orderedNodes.indexOf(b.ref.current)
+      const orderedNodes = Array.from(
+        collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`)
       );
+      const items = Array.from(context.itemMap.values());
+      return (0, import_collection_order.sortCollectionItemsByDomOrder)(orderedNodes, items);
     };
   }
   return [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octanejs/radix",
-  "version": "0.1.48",
+  "version": "0.1.50",
   "license": "MIT",
   "type": "module",
   "sideEffects": false,
@@ -47,10 +47,10 @@
   },
   "dependencies": {
     "aria-hidden": "^1.2.6",
-    "@octanejs/floating-ui": "0.1.48"
+    "@octanejs/floating-ui": "0.1.50"
   },
   "peerDependencies": {
-    "octane": "0.1.49"
+    "octane": "0.1.51"
   },
   "devDependencies": {
     "@tsrx/react": "^0.2.61",
@@ -59,7 +59,7 @@
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "vitest": "^4.1.10",
-    "octane": "0.1.49"
+    "octane": "0.1.51"
   },
   "scripts": {
     "build:cjs": "node ../../scripts/build-package-commonjs.mjs",

package/src/collection-order.ts

@@ -0,0 +1,24 @@
+interface CollectionItem<TNode> {
+	ref: { current: TNode | null };
+}
+
+export const COLLECTION_ORDER_INDEX_THRESHOLD = 256;
+
+export function sortCollectionItemsByDomOrder<TNode, TItem extends CollectionItem<TNode>>(
+	orderedNodes: readonly TNode[],
+	items: TItem[],
+): TItem[] {
+	if (items.length >= COLLECTION_ORDER_INDEX_THRESHOLD) {
+		const nodeIndexes = new Map<TNode, number>();
+		for (let index = 0; index < orderedNodes.length; index++) {
+			nodeIndexes.set(orderedNodes[index], index);
+		}
+		return items.sort(
+			(a, b) => (nodeIndexes.get(a.ref.current!) ?? -1) - (nodeIndexes.get(b.ref.current!) ?? -1),
+		);
+	}
+
+	return items.sort(
+		(a, b) => orderedNodes.indexOf(a.ref.current!) - orderedNodes.indexOf(b.ref.current!),
+	);
+}

package/src/collection.ts

@@ -6,6 +6,7 @@
 // octane ref-as-prop + our `Slot`.
 import { createElement, useEffect, useRef } from 'octane';
 
+import { sortCollectionItemsByDomOrder } from './collection-order';
 import { useComposedRefs } from './compose-refs';
 import { createContextScope } from './context';
 import { S, splitSlot, subSlot } from './internal';
@@ -81,11 +82,11 @@ export function createCollection(name: string): [
 		return () => {
 			const collectionNode = context.collectionRef.current;
 			if (!collectionNode) return [];
-			const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));
-			const items = Array.from(context.itemMap.values());
-			return items.sort(
-				(a, b) => orderedNodes.indexOf(a.ref.current!) - orderedNodes.indexOf(b.ref.current!),
+			const orderedNodes = Array.from(
+				collectionNode.querySelectorAll<HTMLElement>(`[${ITEM_DATA_ATTR}]`),
 			);
+			const items = Array.from(context.itemMap.values());
+			return sortCollectionItemsByDomOrder(orderedNodes, items);
 		};
 	}