koota 0.0.4 → 0.0.5

package/README.md

@@ -449,4 +449,20 @@ const id = entity.id()
 
 // Destroys the entity making its number no longer valid
 entity.destroy()
+```
+
+### React
+
+`useEntityRef` is a safe way to spawn an entity per React primitive and add traits. It is usually used for adding traits that capture the ref to the entity. The entity will be stable for the lifetime of the React component, except in cases like HMR.
+
+```js
+const Ref = trait({ value: null! })
+
+function Rocket() {
+    const entityRef = useEntityRef((node, entity) => {
+        entity.add(Ref({ value: node }))
+    })
+
+    return <div ref={entityRef}>🚀</div>
+}
 ```

package/dist/index.cjs

@@ -297,10 +297,12 @@ function addTrait(world, entity, ...traits) {
         }
       }
     }
-    const defaults = data.schema;
-    for (const key in defaults) {
-      if (typeof defaults[key] === "function") {
-        defaults[key] = defaults[key]();
+    const defaults = {};
+    for (const key in data.schema) {
+      if (typeof data.schema[key] === "function") {
+        defaults[key] = data.schema[key]();
+      } else {
+        defaults[key] = data.schema[key];
       }
     }
     entity.set(trait2, { ...defaults, ...params }, false);
@@ -350,7 +352,6 @@ function hasTrait(world, entity, trait2) {
 }
 function getStore(world, trait2) {
   const ctx = world[$internal];
-  if (!ctx.traitData.has(trait2)) registerTrait(world, trait2);
   const data = ctx.traitData.get(trait2);
   const store = data.store;
   return store;

package/dist/index.js

@@ -258,10 +258,12 @@ function addTrait(world, entity, ...traits) {
         }
       }
     }
-    const defaults = data.schema;
-    for (const key in defaults) {
-      if (typeof defaults[key] === "function") {
-        defaults[key] = defaults[key]();
+    const defaults = {};
+    for (const key in data.schema) {
+      if (typeof data.schema[key] === "function") {
+        defaults[key] = data.schema[key]();
+      } else {
+        defaults[key] = data.schema[key];
       }
     }
     entity.set(trait2, { ...defaults, ...params }, false);
@@ -311,7 +313,6 @@ function hasTrait(world, entity, trait2) {
 }
 function getStore(world, trait2) {
   const ctx = world[$internal];
-  if (!ctx.traitData.has(trait2)) registerTrait(world, trait2);
   const data = ctx.traitData.get(trait2);
   const store = data.store;
   return store;

package/dist/react.cjs

@@ -22,13 +22,14 @@ var react_exports = {};
 __export(react_exports, {
   WorldProvider: () => WorldProvider,
   createActions: () => createActions,
+  useEntityRef: () => useEntityRef,
   useObserve: () => useObserve,
   useQuery: () => useQuery,
   useWorld: () => useWorld
 });
 module.exports = __toCommonJS(react_exports);
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 var import_react3 = require("react");
 
 // ../react/src/world/use-world.ts
@@ -45,7 +46,7 @@ function useWorld() {
   return world;
 }
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 function useQuery(...parameters) {
   const world = useWorld();
   const [entities, setEntities] = (0, import_react3.useState)([]);
@@ -83,7 +84,7 @@ function createActions(actionSet) {
   );
 }
 
-// ../react/src/trait/use-observe.tsx
+// ../react/src/hooks/use-observe.ts
 var import_react4 = require("react");
 function useObserve(entity, trait) {
   const world = useWorld();
@@ -101,10 +102,30 @@ function useObserve(entity, trait) {
   }, [entity, trait]);
   return value;
 }
+
+// ../react/src/hooks/use-entity-ref.ts
+var import_react5 = require("react");
+function useEntityRef(callback) {
+  const world = useWorld();
+  const entityRef = (0, import_react5.useRef)(null);
+  return (0, import_react5.useCallback)(
+    (node) => {
+      if (node) {
+        if (entityRef.current) entityRef.current.destroy();
+        entityRef.current = world.spawn();
+        callback(node, entityRef.current);
+      } else if (entityRef.current) {
+        entityRef.current.destroy();
+      }
+    },
+    [world]
+  );
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   WorldProvider,
   createActions,
+  useEntityRef,
   useObserve,
   useQuery,
   useWorld

package/dist/react.d.cts

@@ -1,7 +1,7 @@
-import { Q as QueryParameter, W as World, T as Trait, j as Entity, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.cjs';
+import { Q as QueryParameter, j as Entity, W as World, T as Trait, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.cjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-declare function useQuery(...parameters: QueryParameter[]): number[];
+declare function useQuery(...parameters: QueryParameter[]): Entity[];
 
 declare function WorldProvider({ children, world }: {
     children: React.ReactNode;
@@ -16,4 +16,6 @@ declare function createActions<T extends Record<string, (...args: any[]) => any>
 
 declare function useObserve<T extends Trait>(entity: Entity, trait: T): TraitInstanceFromSchema<ExtractSchema<T>> | undefined;
 
-export { WorldProvider, createActions, useObserve, useQuery, useWorld };
+declare function useEntityRef<T = any>(callback: (node: T, entity: Entity) => void): (node: T) => void;
+
+export { WorldProvider, createActions, useEntityRef, useObserve, useQuery, useWorld };

package/dist/react.d.ts

@@ -1,7 +1,7 @@
-import { Q as QueryParameter, W as World, T as Trait, j as Entity, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.js';
+import { Q as QueryParameter, j as Entity, W as World, T as Trait, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-declare function useQuery(...parameters: QueryParameter[]): number[];
+declare function useQuery(...parameters: QueryParameter[]): Entity[];
 
 declare function WorldProvider({ children, world }: {
     children: React.ReactNode;
@@ -16,4 +16,6 @@ declare function createActions<T extends Record<string, (...args: any[]) => any>
 
 declare function useObserve<T extends Trait>(entity: Entity, trait: T): TraitInstanceFromSchema<ExtractSchema<T>> | undefined;
 
-export { WorldProvider, createActions, useObserve, useQuery, useWorld };
+declare function useEntityRef<T = any>(callback: (node: T, entity: Entity) => void): (node: T) => void;
+
+export { WorldProvider, createActions, useEntityRef, useObserve, useQuery, useWorld };

package/dist/react.js

@@ -1,6 +1,6 @@
 import "./chunk-AQ5VUG5P.js";
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 import { useEffect, useState } from "react";
 
 // ../react/src/world/use-world.ts
@@ -17,7 +17,7 @@ function useWorld() {
   return world;
 }
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 function useQuery(...parameters) {
   const world = useWorld();
   const [entities, setEntities] = useState([]);
@@ -55,7 +55,7 @@ function createActions(actionSet) {
   );
 }
 
-// ../react/src/trait/use-observe.tsx
+// ../react/src/hooks/use-observe.ts
 import { useEffect as useEffect2, useState as useState2 } from "react";
 function useObserve(entity, trait) {
   const world = useWorld();
@@ -73,9 +73,29 @@ function useObserve(entity, trait) {
   }, [entity, trait]);
   return value;
 }
+
+// ../react/src/hooks/use-entity-ref.ts
+import { useCallback, useRef } from "react";
+function useEntityRef(callback) {
+  const world = useWorld();
+  const entityRef = useRef(null);
+  return useCallback(
+    (node) => {
+      if (node) {
+        if (entityRef.current) entityRef.current.destroy();
+        entityRef.current = world.spawn();
+        callback(node, entityRef.current);
+      } else if (entityRef.current) {
+        entityRef.current.destroy();
+      }
+    },
+    [world]
+  );
+}
 export {
   WorldProvider,
   createActions,
+  useEntityRef,
   useObserve,
   useQuery,
   useWorld

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "koota",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "🌎 Performant data-oriented state management for React and TypeScript.",
   "license": "ISC",
   "type": "module",
@@ -38,9 +38,9 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "tsup": "^8.3.0",
+    "@koota/core": "0.0.1",
     "@koota/react": "0.0.1",
-    "tsconfig": "0.1.0",
-    "@koota/core": "0.0.1"
+    "tsconfig": "0.1.0"
   },
   "peerDependencies": {
     "@react-three/fiber": "^8.17.5",

package/react/index.cjs

@@ -22,13 +22,14 @@ var react_exports = {};
 __export(react_exports, {
   WorldProvider: () => WorldProvider,
   createActions: () => createActions,
+  useEntityRef: () => useEntityRef,
   useObserve: () => useObserve,
   useQuery: () => useQuery,
   useWorld: () => useWorld
 });
 module.exports = __toCommonJS(react_exports);
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 var import_react3 = require("react");
 
 // ../react/src/world/use-world.ts
@@ -45,7 +46,7 @@ function useWorld() {
   return world;
 }
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 function useQuery(...parameters) {
   const world = useWorld();
   const [entities, setEntities] = (0, import_react3.useState)([]);
@@ -83,7 +84,7 @@ function createActions(actionSet) {
   );
 }
 
-// ../react/src/trait/use-observe.tsx
+// ../react/src/hooks/use-observe.ts
 var import_react4 = require("react");
 function useObserve(entity, trait) {
   const world = useWorld();
@@ -101,10 +102,30 @@ function useObserve(entity, trait) {
   }, [entity, trait]);
   return value;
 }
+
+// ../react/src/hooks/use-entity-ref.ts
+var import_react5 = require("react");
+function useEntityRef(callback) {
+  const world = useWorld();
+  const entityRef = (0, import_react5.useRef)(null);
+  return (0, import_react5.useCallback)(
+    (node) => {
+      if (node) {
+        if (entityRef.current) entityRef.current.destroy();
+        entityRef.current = world.spawn();
+        callback(node, entityRef.current);
+      } else if (entityRef.current) {
+        entityRef.current.destroy();
+      }
+    },
+    [world]
+  );
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   WorldProvider,
   createActions,
+  useEntityRef,
   useObserve,
   useQuery,
   useWorld

package/react/index.d.cts

@@ -1,7 +1,7 @@
-import { Q as QueryParameter, W as World, T as Trait, j as Entity, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.cjs';
+import { Q as QueryParameter, j as Entity, W as World, T as Trait, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.cjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-declare function useQuery(...parameters: QueryParameter[]): number[];
+declare function useQuery(...parameters: QueryParameter[]): Entity[];
 
 declare function WorldProvider({ children, world }: {
     children: React.ReactNode;
@@ -16,4 +16,6 @@ declare function createActions<T extends Record<string, (...args: any[]) => any>
 
 declare function useObserve<T extends Trait>(entity: Entity, trait: T): TraitInstanceFromSchema<ExtractSchema<T>> | undefined;
 
-export { WorldProvider, createActions, useObserve, useQuery, useWorld };
+declare function useEntityRef<T = any>(callback: (node: T, entity: Entity) => void): (node: T) => void;
+
+export { WorldProvider, createActions, useEntityRef, useObserve, useQuery, useWorld };

package/react/index.d.ts

@@ -1,7 +1,7 @@
-import { Q as QueryParameter, W as World, T as Trait, j as Entity, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.js';
+import { Q as QueryParameter, j as Entity, W as World, T as Trait, d as TraitInstanceFromSchema, E as ExtractSchema } from './world-BRz2NI5_.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-declare function useQuery(...parameters: QueryParameter[]): number[];
+declare function useQuery(...parameters: QueryParameter[]): Entity[];
 
 declare function WorldProvider({ children, world }: {
     children: React.ReactNode;
@@ -16,4 +16,6 @@ declare function createActions<T extends Record<string, (...args: any[]) => any>
 
 declare function useObserve<T extends Trait>(entity: Entity, trait: T): TraitInstanceFromSchema<ExtractSchema<T>> | undefined;
 
-export { WorldProvider, createActions, useObserve, useQuery, useWorld };
+declare function useEntityRef<T = any>(callback: (node: T, entity: Entity) => void): (node: T) => void;
+
+export { WorldProvider, createActions, useEntityRef, useObserve, useQuery, useWorld };

package/react/index.js

@@ -1,6 +1,6 @@
 import "./chunk-AQ5VUG5P.js";
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 import { useEffect, useState } from "react";
 
 // ../react/src/world/use-world.ts
@@ -17,7 +17,7 @@ function useWorld() {
   return world;
 }
 
-// ../react/src/query/use-query.ts
+// ../react/src/hooks/use-query.ts
 function useQuery(...parameters) {
   const world = useWorld();
   const [entities, setEntities] = useState([]);
@@ -55,7 +55,7 @@ function createActions(actionSet) {
   );
 }
 
-// ../react/src/trait/use-observe.tsx
+// ../react/src/hooks/use-observe.ts
 import { useEffect as useEffect2, useState as useState2 } from "react";
 function useObserve(entity, trait) {
   const world = useWorld();
@@ -73,9 +73,29 @@ function useObserve(entity, trait) {
   }, [entity, trait]);
   return value;
 }
+
+// ../react/src/hooks/use-entity-ref.ts
+import { useCallback, useRef } from "react";
+function useEntityRef(callback) {
+  const world = useWorld();
+  const entityRef = useRef(null);
+  return useCallback(
+    (node) => {
+      if (node) {
+        if (entityRef.current) entityRef.current.destroy();
+        entityRef.current = world.spawn();
+        callback(node, entityRef.current);
+      } else if (entityRef.current) {
+        entityRef.current.destroy();
+      }
+    },
+    [world]
+  );
+}
 export {
   WorldProvider,
   createActions,
+  useEntityRef,
   useObserve,
   useQuery,
   useWorld