@octanejs/window 0.0.18 → 0.0.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octanejs/window",
-  "version": "0.0.18",
+  "version": "0.0.19",
   "license": "MIT",
   "type": "module",
   "engines": {
@@ -48,14 +48,14 @@
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "16.3.2",
-    "@tsrx/react": "^0.2.63",
+    "@tsrx/react": "^0.2.67",
     "esbuild": "^0.28.1",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "react-window": "2.3.0",
     "vitest": "^4.1.10",
-    "@octanejs/testing-library": "0.1.49",
-    "octane": "0.2.0"
+    "@octanejs/testing-library": "0.1.50",
+    "octane": "0.2.4"
   },
   "scripts": {
     "adapted:generate": "node ../../scripts/react-port/materialize.mjs run --package-dir .",

package/src/components/grid/types.ts

@@ -2,10 +2,11 @@ import type {
 	ComponentProps,
 	CSSProperties,
 	HTMLAttributes,
-	ReactElement,
-	ReactNode,
+	Key,
+	OctaneElement,
+	OctaneNode,
 	Ref,
-} from 'react';
+} from 'octane';
 import type { TagNames } from '../../types.js';
 
 type ForbiddenKeys = 'ariaAttributes' | 'columnIndex' | 'rowIndex' | 'style';
@@ -15,7 +16,7 @@ type ExcludeForbiddenKeys<Type> = {
 
 export type GridProps<CellProps extends object, TagName extends TagNames = 'div'> = Omit<
 	HTMLAttributes<HTMLDivElement>,
-	'onResize'
+	'onResize' | 'style'
 > & {
 	/**
 	 * React component responsible for rendering a cell.
@@ -35,7 +36,7 @@ export type GridProps<CellProps extends object, TagName extends TagNames = 'div'
 			rowIndex: number;
 			style: CSSProperties;
 		} & CellProps,
-	) => ReactElement | null;
+	) => OctaneElement | null;
 
 	/**
 	 * Additional props to be passed to the cell-rendering component.
@@ -49,7 +50,7 @@ export type GridProps<CellProps extends object, TagName extends TagNames = 'div'
 	 * Additional content to be rendered within the grid (above cells).
 	 * This property can be used to render things like overlays or tooltips.
 	 */
-	children?: ReactNode;
+	children?: OctaneNode;
 
 	/**
 	 * CSS class name.
@@ -72,7 +73,7 @@ export type GridProps<CellProps extends object, TagName extends TagNames = 'div'
 	 * ⚠️ This prop cannot be auto-memoized because it is called during render.
 	 * It is important to always `useCallback` for this prop; do not use an inline function.
 	 */
-	columnKey?: (args: { columnIndex: number; data: CellProps; rowIndex: number }) => React.Key;
+	columnKey?: (args: { columnIndex: number; data: CellProps; rowIndex: number }) => Key;
 
 	/**
 	 * Column width; the following formats are supported:
@@ -219,7 +220,7 @@ export type GridProps<CellProps extends object, TagName extends TagNames = 'div'
 	 * ⚠️ This prop cannot be auto-memoized because it is called during render.
 	 * It is important to always `useCallback` for this prop; do not use an inline function.
 	 */
-	rowKey?: (args: { data: CellProps; rowIndex: number }) => React.Key;
+	rowKey?: (args: { data: CellProps; rowIndex: number }) => Key;
 
 	/**
 	 * Optional CSS properties.

package/src/components/list/types.ts

@@ -2,10 +2,11 @@ import type {
 	ComponentProps,
 	CSSProperties,
 	HTMLAttributes,
-	ReactElement,
-	ReactNode,
+	Key,
+	OctaneElement,
+	OctaneNode,
 	Ref,
-} from 'react';
+} from 'octane';
 import type { TagNames } from '../../types.js';
 
 export type DynamicRowHeight = {
@@ -22,13 +23,13 @@ type ExcludeForbiddenKeys<Type> = {
 
 export type ListProps<RowProps extends object, TagName extends TagNames = 'div'> = Omit<
 	HTMLAttributes<HTMLDivElement>,
-	'onResize'
+	'onResize' | 'style'
 > & {
 	/**
 	 * Additional content to be rendered within the list (above cells).
 	 * This property can be used to render things like overlays or tooltips.
 	 */
-	children?: ReactNode;
+	children?: OctaneNode;
 
 	/**
 	 * CSS class name.
@@ -111,7 +112,7 @@ export type ListProps<RowProps extends object, TagName extends TagNames = 'div'>
 			index: number;
 			style: CSSProperties;
 		} & RowProps,
-	) => ReactElement | null;
+	) => OctaneElement | null;
 
 	/**
 	 * Number of items to be rendered in the list.
@@ -141,7 +142,7 @@ export type ListProps<RowProps extends object, TagName extends TagNames = 'div'>
 	 * ⚠️ This prop cannot be auto-memoized because it is called during render.
 	 * It is important to always `useCallback` for this prop; do not use an inline function.
 	 */
-	rowKey?: (index: number, data: RowProps) => React.Key;
+	rowKey?: (index: number, data: RowProps) => Key;
 
 	/**
 	 * Additional props to be passed to the row-rendering component.

package/src/hooks/useMemoizedObject.ts

@@ -6,9 +6,13 @@ export function useMemoizedObject<Type extends object>(
 	...rest: unknown[]
 ): Type {
 	const slot = getSlot(rest);
-	return useMemo(
-		() => unstableObject,
-		Object.values(unstableObject),
-		subSlot(slot, 'memoized-object'),
-	);
+	const dependencies: unknown[] = Object.keys(unstableObject);
+	const keyCount = dependencies.length;
+	// The count must be first: memo compares only common prefixes when lengths
+	// change, and an old value can equal a newly inserted key.
+	for (let index = 0; index < keyCount; index++) {
+		dependencies.push(unstableObject[dependencies[index] as keyof Type]);
+	}
+	dependencies.unshift(keyCount);
+	return useMemo(() => unstableObject, dependencies, subSlot(slot, 'memoized-object'));
 }

package/src/types.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react';
+import type { JSX } from 'octane';
 
 export type Align = 'auto' | 'center' | 'end' | 'smart' | 'start';