atom.io 0.13.0 → 0.14.0

package/internal/src/subscribe/subscribe-to-state.ts

@@ -0,0 +1,47 @@
+import type { ReadonlySelectorToken, StateToken, UpdateHandler } from "atom.io"
+import type { Store } from "atom.io/internal"
+import { subscribeToRootAtoms, withdraw } from "atom.io/internal"
+
+export function subscribeToState<T>(
+	token: ReadonlySelectorToken<T> | StateToken<T>,
+	handleUpdate: UpdateHandler<T>,
+	key: string,
+	store: Store,
+): () => void {
+	const state = withdraw<T>(token, store)
+	if (state === undefined) {
+		throw new Error(
+			`State "${token.key}" not found in this store. Did you forget to initialize with the "atom" or "selector" function?`,
+		)
+	}
+	const unsubFunction = state.subject.subscribe(key, handleUpdate)
+	store.logger.info(`👀`, state.type, state.key, `Adding subscription "${key}"`)
+	const dependencyUnsubFunctions =
+		state.type !== `atom` ? subscribeToRootAtoms(state, store) : null
+
+	const unsubscribe =
+		dependencyUnsubFunctions === null
+			? () => {
+					store.logger.info(
+						`🙈`,
+						state.type,
+						state.key,
+						`Removing subscription "${key}"`,
+					)
+					unsubFunction()
+			  }
+			: () => {
+					store.logger.info(
+						`🙈`,
+						state.type,
+						state.key,
+						`Removing subscription "${key}"`,
+					)
+					unsubFunction()
+					for (const unsubFromDependency of dependencyUnsubFunctions) {
+						unsubFromDependency()
+					}
+			  }
+
+	return unsubscribe
+}

package/internal/src/subscribe/subscribe-to-timeline.ts

@@ -0,0 +1,28 @@
+import type { TimelineToken, TimelineUpdate } from "atom.io"
+import type { Store } from "atom.io/internal"
+import { withdraw } from "atom.io/internal"
+
+export const subscribeToTimeline = (
+	token: TimelineToken,
+	handleUpdate: (update: TimelineUpdate | `redo` | `undo`) => void,
+	key: string,
+	store: Store,
+): (() => void) => {
+	const tl = withdraw(token, store)
+	if (tl === undefined) {
+		throw new Error(
+			`Cannot subscribe to timeline "${token.key}": timeline not found in store "${store.config.name}".`,
+		)
+	}
+	store.logger.info(`👀`, `timeline`, token.key, `Adding subscription "${key}"`)
+	const unsubscribe = tl.subject.subscribe(key, handleUpdate)
+	return () => {
+		store.logger.info(
+			`🙈`,
+			`timeline`,
+			token.key,
+			`Removing subscription "${key}" from timeline`,
+		)
+		unsubscribe()
+	}
+}

package/internal/src/subscribe/subscribe-to-transaction.ts

@@ -0,0 +1,33 @@
+import type { TransactionToken, TransactionUpdateHandler, ƒn } from "atom.io"
+import type { Store } from "atom.io/internal"
+import { withdraw } from "atom.io/internal"
+
+export const subscribeToTransaction = <ƒ extends ƒn>(
+	token: TransactionToken<ƒ>,
+	handleUpdate: TransactionUpdateHandler<ƒ>,
+	key: string,
+	store: Store,
+): (() => void) => {
+	const tx = withdraw(token, store)
+	if (tx === undefined) {
+		throw new Error(
+			`Cannot subscribe to transaction "${token.key}": transaction not found in store "${store.config.name}".`,
+		)
+	}
+	store.logger.info(
+		`👀`,
+		`transaction`,
+		token.key,
+		`Adding subscription "${key}"`,
+	)
+	const unsubscribe = tx.subject.subscribe(key, handleUpdate)
+	return () => {
+		store.logger.info(
+			`🙈`,
+			`transaction`,
+			token.key,
+			`Removing subscription "${key}"`,
+		)
+		unsubscribe()
+	}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "atom.io",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "Composable and testable reactive data library.",
   "homepage": "https://atom.io.fyi",
   "sideEffects": false,
@@ -54,17 +54,17 @@
     "@types/npmlog": "7.0.0",
     "@types/react": "18.2.42",
     "@types/tmp": "0.2.6",
-    "@vitest/coverage-v8": "1.0.1",
+    "@vitest/coverage-v8": "1.0.2",
     "concurrently": "8.2.2",
     "drizzle-kit": "0.20.6",
     "drizzle-orm": "0.29.1",
     "eslint": "8.55.0",
-    "framer-motion": "10.16.14",
+    "framer-motion": "10.16.16",
     "happy-dom": "12.10.3",
     "http-proxy": "1.18.1",
     "npmlog": "7.0.1",
     "postgres": "3.4.3",
-    "preact": "10.19.2",
+    "preact": "10.19.3",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-router-dom": "6.20.1",
@@ -72,10 +72,10 @@
     "socket.io-client": "4.7.2",
     "tmp": "0.2.1",
     "tsup": "8.0.1",
-    "typescript": "5.3.2",
-    "vite": "5.0.6",
-    "vite-tsconfig-paths": "4.2.1",
-    "vitest": "1.0.1"
+    "typescript": "5.3.3",
+    "vite": "5.0.7",
+    "vite-tsconfig-paths": "4.2.2",
+    "vitest": "1.0.2"
   },
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/react/dist/index.cjs

@@ -40,7 +40,7 @@ function useO(token) {
   const store = React2__namespace.useContext(StoreContext);
   const id = React2__namespace.useId();
   return React2__namespace.useSyncExternalStore(
-    (dispatch) => atom_io.subscribe(token, dispatch, `use-o:${id}`, store),
+    (dispatch) => internal.subscribeToState(token, dispatch, `use-o:${id}`, store),
     () => atom_io.getState(token, store),
     () => atom_io.getState(token, store)
   );
@@ -49,11 +49,49 @@ function useJSON(token) {
   const jsonToken = internal.getJsonToken(token);
   return useO(jsonToken);
 }
+function useTL(token) {
+  const store = React2__namespace.useContext(StoreContext);
+  const id = React2__namespace.useId();
+  const timeline = internal.withdraw(token, store);
+  if (timeline === void 0) {
+    store.logger.error(
+      `\u274C`,
+      `timeline`,
+      token.key,
+      `Failed to use timeline because it does not exist`
+    );
+    return {
+      at: NaN,
+      length: NaN,
+      undo: () => {
+      },
+      redo: () => {
+      }
+    };
+  }
+  const meta = React2__namespace.useRef({
+    at: timeline.at,
+    length: timeline.history.length,
+    undo: () => atom_io.undo(token),
+    redo: () => atom_io.redo(token)
+  });
+  const retrieve = React2__namespace.useCallback(() => {
+    meta.current.at = timeline.at;
+    meta.current.length = timeline.history.length;
+    return meta.current;
+  }, [meta]);
+  return React2__namespace.useSyncExternalStore(
+    (dispatch) => internal.subscribeToTimeline(token, dispatch, `use-tl:${id}`, store),
+    retrieve,
+    retrieve
+  );
+}
 
 exports.StoreContext = StoreContext;
 exports.StoreProvider = StoreProvider;
 exports.useI = useI;
 exports.useJSON = useJSON;
 exports.useO = useO;
+exports.useTL = useTL;
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.cjs.map

package/react/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/store-context.tsx","../src/store-hooks.ts"],"names":["React"],"mappings":";AACA,SAAS,gBAAgB;AACzB,YAAY,WAAW;AAQtB;AANM,IAAM,eAAqB,oBAAqB,SAAS,KAAK;AAE9D,IAAM,gBAGR,CAAC,EAAE,UAAU,QAAQ,SAAS,MAAM,MACxC,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAAQ,UAAS;;;ACVhD,YAAYA,YAAW;AAEvB,SAAS,UAAU,UAAU,iBAAiB;AAO9C,SAAS,oBAAoB;AAItB,SAAS,KACf,OACyD;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,SAEI,cAAO,IAAI;AACrB,MAAI,OAAO,YAAY,MAAM;AAC5B,WAAO,UAAU,CAAC,SAAS,SAAS,OAAO,MAAM,KAAK;AAAA,EACvD;AACA,SAAO,OAAO;AACf;AAEO,SAAS,KAAQ,OAAoD;AAC3E,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,SAAa;AAAA,IACZ,CAAC,aAAa,UAAU,OAAO,UAAU,SAAS,EAAE,IAAI,KAAK;AAAA,IAC7D,MAAM,SAAS,OAAO,KAAK;AAAA,IAC3B,MAAM,SAAS,OAAO,KAAK;AAAA,EAC5B;AACD;AAEO,SAAS,QACf,OACe;AACf,QAAM,YAAY,aAAa,KAAK;AACpC,SAAO,KAAK,SAAS;AACtB","sourcesContent":["import type { Store } from \"atom.io/internal\"\nimport { IMPLICIT } from \"atom.io/internal\"\nimport * as React from \"react\"\n\nexport const StoreContext = React.createContext<Store>(IMPLICIT.STORE)\n\nexport const StoreProvider: React.FC<{\n\tchildren: React.ReactNode\n\tstore?: Store\n}> = ({ children, store = IMPLICIT.STORE }) => (\n\t<StoreContext.Provider value={store}>{children}</StoreContext.Provider>\n)\n","import * as React from \"react\"\n\nimport { getState, setState, subscribe } from \"atom.io\"\nimport type {\n\tMutableAtomToken,\n\tReadonlySelectorToken,\n\tStateToken,\n} from \"atom.io\"\n\nimport { getJsonToken } from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"./store-context\"\n\nexport function useI<T>(\n\ttoken: StateToken<T>,\n): <New extends T>(next: New | ((old: T) => New)) => void {\n\tconst store = React.useContext(StoreContext)\n\tconst setter: React.MutableRefObject<\n\t\t(<New extends T>(next: New | ((old: T) => New)) => void) | null\n\t> = React.useRef(null)\n\tif (setter.current === null) {\n\t\tsetter.current = (next) => setState(token, next, store)\n\t}\n\treturn setter.current\n}\n\nexport function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\treturn React.useSyncExternalStore<T>(\n\t\t(dispatch) => subscribe(token, dispatch, `use-o:${id}`, store),\n\t\t() => getState(token, store),\n\t\t() => getState(token, store),\n\t)\n}\n\nexport function useJSON<Serializable extends Json.Serializable>(\n\ttoken: MutableAtomToken<any, Serializable>,\n): Serializable {\n\tconst jsonToken = getJsonToken(token)\n\treturn useO(jsonToken)\n}\n"]}
+{"version":3,"sources":["../src/store-context.tsx","../src/store-hooks.ts"],"names":["React"],"mappings":";AACA,SAAS,gBAAgB;AACzB,YAAY,WAAW;AAQtB;AANM,IAAM,eAAqB,oBAAqB,SAAS,KAAK;AAE9D,IAAM,gBAGR,CAAC,EAAE,UAAU,QAAQ,SAAS,MAAM,MACxC,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAAQ,UAAS;;;ACVhD,YAAYA,YAAW;AAEvB,SAAS,UAAU,MAAM,UAAU,YAAY;AAQ/C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAIA,SAAS,KACf,OACyD;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,SAEI,cAAO,IAAI;AACrB,MAAI,OAAO,YAAY,MAAM;AAC5B,WAAO,UAAU,CAAC,SAAS,SAAS,OAAO,MAAM,KAAK;AAAA,EACvD;AACA,SAAO,OAAO;AACf;AAEO,SAAS,KAAQ,OAAoD;AAC3E,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,SAAa;AAAA,IACZ,CAAC,aAAa,iBAAiB,OAAO,UAAU,SAAS,EAAE,IAAI,KAAK;AAAA,IACpE,MAAM,SAAS,OAAO,KAAK;AAAA,IAC3B,MAAM,SAAS,OAAO,KAAK;AAAA,EAC5B;AACD;AAEO,SAAS,QACf,OACe;AACf,QAAM,YAAY,aAAa,KAAK;AACpC,SAAO,KAAK,SAAS;AACtB;AASO,SAAS,MAAM,OAAoC;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,QAAM,WAAW,SAAS,OAAO,KAAK;AACtC,MAAI,aAAa,QAAW;AAC3B,UAAM,OAAO;AAAA,MACZ;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,IACD;AACA,WAAO;AAAA,MACN,IAAI;AAAA,MACJ,QAAQ;AAAA,MACR,MAAM,MAAM;AAAA,MAAC;AAAA,MACb,MAAM,MAAM;AAAA,MAAC;AAAA,IACd;AAAA,EACD;AACA,QAAM,OAAa,cAAqB;AAAA,IACvC,IAAI,SAAS;AAAA,IACb,QAAQ,SAAS,QAAQ;AAAA,IACzB,MAAM,MAAM,KAAK,KAAK;AAAA,IACtB,MAAM,MAAM,KAAK,KAAK;AAAA,EACvB,CAAC;AACD,QAAM,WAAiB,mBAAY,MAAM;AACxC,SAAK,QAAQ,KAAK,SAAS;AAC3B,SAAK,QAAQ,SAAS,SAAS,QAAQ;AACvC,WAAO,KAAK;AAAA,EACb,GAAG,CAAC,IAAI,CAAC;AACT,SAAa;AAAA,IACZ,CAAC,aAAa,oBAAoB,OAAO,UAAU,UAAU,EAAE,IAAI,KAAK;AAAA,IACxE;AAAA,IACA;AAAA,EACD;AACD","sourcesContent":["import type { Store } from \"atom.io/internal\"\nimport { IMPLICIT } from \"atom.io/internal\"\nimport * as React from \"react\"\n\nexport const StoreContext = React.createContext<Store>(IMPLICIT.STORE)\n\nexport const StoreProvider: React.FC<{\n\tchildren: React.ReactNode\n\tstore?: Store\n}> = ({ children, store = IMPLICIT.STORE }) => (\n\t<StoreContext.Provider value={store}>{children}</StoreContext.Provider>\n)\n","import * as React from \"react\"\n\nimport { getState, redo, setState, undo } from \"atom.io\"\nimport type {\n\tMutableAtomToken,\n\tReadonlySelectorToken,\n\tStateToken,\n\tTimelineToken,\n} from \"atom.io\"\n\nimport {\n\tgetJsonToken,\n\tsubscribeToState,\n\tsubscribeToTimeline,\n\twithdraw,\n} from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"./store-context\"\n\nexport function useI<T>(\n\ttoken: StateToken<T>,\n): <New extends T>(next: New | ((old: T) => New)) => void {\n\tconst store = React.useContext(StoreContext)\n\tconst setter: React.MutableRefObject<\n\t\t(<New extends T>(next: New | ((old: T) => New)) => void) | null\n\t> = React.useRef(null)\n\tif (setter.current === null) {\n\t\tsetter.current = (next) => setState(token, next, store)\n\t}\n\treturn setter.current\n}\n\nexport function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\treturn React.useSyncExternalStore<T>(\n\t\t(dispatch) => subscribeToState(token, dispatch, `use-o:${id}`, store),\n\t\t() => getState(token, store),\n\t\t() => getState(token, store),\n\t)\n}\n\nexport function useJSON<Serializable extends Json.Serializable>(\n\ttoken: MutableAtomToken<any, Serializable>,\n): Serializable {\n\tconst jsonToken = getJsonToken(token)\n\treturn useO(jsonToken)\n}\n\nexport type TimelineMeta = {\n\tat: number\n\tlength: number\n\tundo: () => void\n\tredo: () => void\n}\n\nexport function useTL(token: TimelineToken): TimelineMeta {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\tconst timeline = withdraw(token, store)\n\tif (timeline === undefined) {\n\t\tstore.logger.error(\n\t\t\t`❌`,\n\t\t\t`timeline`,\n\t\t\ttoken.key,\n\t\t\t`Failed to use timeline because it does not exist`,\n\t\t)\n\t\treturn {\n\t\t\tat: NaN,\n\t\t\tlength: NaN,\n\t\t\tundo: () => {},\n\t\t\tredo: () => {},\n\t\t}\n\t}\n\tconst meta = React.useRef<TimelineMeta>({\n\t\tat: timeline.at,\n\t\tlength: timeline.history.length,\n\t\tundo: () => undo(token),\n\t\tredo: () => redo(token),\n\t})\n\tconst retrieve = React.useCallback(() => {\n\t\tmeta.current.at = timeline.at\n\t\tmeta.current.length = timeline.history.length\n\t\treturn meta.current\n\t}, [meta])\n\treturn React.useSyncExternalStore<TimelineMeta>(\n\t\t(dispatch) => subscribeToTimeline(token, dispatch, `use-tl:${id}`, store),\n\t\tretrieve,\n\t\tretrieve,\n\t)\n}\n"]}

package/react/dist/index.d.cts

@@ -1,6 +1,6 @@
 import { Store } from 'atom.io/internal';
 import * as React from 'react';
-import { StateToken, ReadonlySelectorToken, MutableAtomToken } from 'atom.io';
+import { StateToken, ReadonlySelectorToken, MutableAtomToken, TimelineToken } from 'atom.io';
 import { Json } from 'atom.io/json';
 
 declare const StoreContext: React.Context<Store>;
@@ -12,5 +12,12 @@ declare const StoreProvider: React.FC<{
 declare function useI<T>(token: StateToken<T>): <New extends T>(next: New | ((old: T) => New)) => void;
 declare function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T;
 declare function useJSON<Serializable extends Json.Serializable>(token: MutableAtomToken<any, Serializable>): Serializable;
+type TimelineMeta = {
+    at: number;
+    length: number;
+    undo: () => void;
+    redo: () => void;
+};
+declare function useTL(token: TimelineToken): TimelineMeta;
 
-export { StoreContext, StoreProvider, useI, useJSON, useO };
+export { StoreContext, StoreProvider, type TimelineMeta, useI, useJSON, useO, useTL };

package/react/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { Store } from 'atom.io/internal';
 import * as React from 'react';
-import { StateToken, ReadonlySelectorToken, MutableAtomToken } from 'atom.io';
+import { StateToken, ReadonlySelectorToken, MutableAtomToken, TimelineToken } from 'atom.io';
 import { Json } from 'atom.io/json';
 
 declare const StoreContext: React.Context<Store>;
@@ -12,5 +12,12 @@ declare const StoreProvider: React.FC<{
 declare function useI<T>(token: StateToken<T>): <New extends T>(next: New | ((old: T) => New)) => void;
 declare function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T;
 declare function useJSON<Serializable extends Json.Serializable>(token: MutableAtomToken<any, Serializable>): Serializable;
+type TimelineMeta = {
+    at: number;
+    length: number;
+    undo: () => void;
+    redo: () => void;
+};
+declare function useTL(token: TimelineToken): TimelineMeta;
 
-export { StoreContext, StoreProvider, useI, useJSON, useO };
+export { StoreContext, StoreProvider, type TimelineMeta, useI, useJSON, useO, useTL };

package/react/dist/index.js

@@ -1,7 +1,7 @@
-import { IMPLICIT, getJsonToken } from 'atom.io/internal';
+import { IMPLICIT, subscribeToState, getJsonToken, withdraw, subscribeToTimeline } from 'atom.io/internal';
 import * as React2 from 'react';
 import { jsx } from 'react/jsx-runtime';
-import { setState, subscribe, getState } from 'atom.io';
+import { setState, getState, undo, redo } from 'atom.io';
 
 // src/store-context.tsx
 var StoreContext = React2.createContext(IMPLICIT.STORE);
@@ -18,7 +18,7 @@ function useO(token) {
   const store = React2.useContext(StoreContext);
   const id = React2.useId();
   return React2.useSyncExternalStore(
-    (dispatch) => subscribe(token, dispatch, `use-o:${id}`, store),
+    (dispatch) => subscribeToState(token, dispatch, `use-o:${id}`, store),
     () => getState(token, store),
     () => getState(token, store)
   );
@@ -27,7 +27,44 @@ function useJSON(token) {
   const jsonToken = getJsonToken(token);
   return useO(jsonToken);
 }
+function useTL(token) {
+  const store = React2.useContext(StoreContext);
+  const id = React2.useId();
+  const timeline = withdraw(token, store);
+  if (timeline === void 0) {
+    store.logger.error(
+      `\u274C`,
+      `timeline`,
+      token.key,
+      `Failed to use timeline because it does not exist`
+    );
+    return {
+      at: NaN,
+      length: NaN,
+      undo: () => {
+      },
+      redo: () => {
+      }
+    };
+  }
+  const meta = React2.useRef({
+    at: timeline.at,
+    length: timeline.history.length,
+    undo: () => undo(token),
+    redo: () => redo(token)
+  });
+  const retrieve = React2.useCallback(() => {
+    meta.current.at = timeline.at;
+    meta.current.length = timeline.history.length;
+    return meta.current;
+  }, [meta]);
+  return React2.useSyncExternalStore(
+    (dispatch) => subscribeToTimeline(token, dispatch, `use-tl:${id}`, store),
+    retrieve,
+    retrieve
+  );
+}
 
-export { StoreContext, StoreProvider, useI, useJSON, useO };
+export { StoreContext, StoreProvider, useI, useJSON, useO, useTL };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map

package/react/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/store-context.tsx","../src/store-hooks.ts"],"names":["React"],"mappings":";AACA,SAAS,gBAAgB;AACzB,YAAY,WAAW;AAQtB;AANM,IAAM,eAAqB,oBAAqB,SAAS,KAAK;AAE9D,IAAM,gBAGR,CAAC,EAAE,UAAU,QAAQ,SAAS,MAAM,MACxC,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAAQ,UAAS;;;ACVhD,YAAYA,YAAW;AAEvB,SAAS,UAAU,UAAU,iBAAiB;AAO9C,SAAS,oBAAoB;AAItB,SAAS,KACf,OACyD;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,SAEI,cAAO,IAAI;AACrB,MAAI,OAAO,YAAY,MAAM;AAC5B,WAAO,UAAU,CAAC,SAAS,SAAS,OAAO,MAAM,KAAK;AAAA,EACvD;AACA,SAAO,OAAO;AACf;AAEO,SAAS,KAAQ,OAAoD;AAC3E,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,SAAa;AAAA,IACZ,CAAC,aAAa,UAAU,OAAO,UAAU,SAAS,EAAE,IAAI,KAAK;AAAA,IAC7D,MAAM,SAAS,OAAO,KAAK;AAAA,IAC3B,MAAM,SAAS,OAAO,KAAK;AAAA,EAC5B;AACD;AAEO,SAAS,QACf,OACe;AACf,QAAM,YAAY,aAAa,KAAK;AACpC,SAAO,KAAK,SAAS;AACtB","sourcesContent":["import type { Store } from \"atom.io/internal\"\nimport { IMPLICIT } from \"atom.io/internal\"\nimport * as React from \"react\"\n\nexport const StoreContext = React.createContext<Store>(IMPLICIT.STORE)\n\nexport const StoreProvider: React.FC<{\n\tchildren: React.ReactNode\n\tstore?: Store\n}> = ({ children, store = IMPLICIT.STORE }) => (\n\t<StoreContext.Provider value={store}>{children}</StoreContext.Provider>\n)\n","import * as React from \"react\"\n\nimport { getState, setState, subscribe } from \"atom.io\"\nimport type {\n\tMutableAtomToken,\n\tReadonlySelectorToken,\n\tStateToken,\n} from \"atom.io\"\n\nimport { getJsonToken } from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"./store-context\"\n\nexport function useI<T>(\n\ttoken: StateToken<T>,\n): <New extends T>(next: New | ((old: T) => New)) => void {\n\tconst store = React.useContext(StoreContext)\n\tconst setter: React.MutableRefObject<\n\t\t(<New extends T>(next: New | ((old: T) => New)) => void) | null\n\t> = React.useRef(null)\n\tif (setter.current === null) {\n\t\tsetter.current = (next) => setState(token, next, store)\n\t}\n\treturn setter.current\n}\n\nexport function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\treturn React.useSyncExternalStore<T>(\n\t\t(dispatch) => subscribe(token, dispatch, `use-o:${id}`, store),\n\t\t() => getState(token, store),\n\t\t() => getState(token, store),\n\t)\n}\n\nexport function useJSON<Serializable extends Json.Serializable>(\n\ttoken: MutableAtomToken<any, Serializable>,\n): Serializable {\n\tconst jsonToken = getJsonToken(token)\n\treturn useO(jsonToken)\n}\n"]}
+{"version":3,"sources":["../src/store-context.tsx","../src/store-hooks.ts"],"names":["React"],"mappings":";AACA,SAAS,gBAAgB;AACzB,YAAY,WAAW;AAQtB;AANM,IAAM,eAAqB,oBAAqB,SAAS,KAAK;AAE9D,IAAM,gBAGR,CAAC,EAAE,UAAU,QAAQ,SAAS,MAAM,MACxC,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAAQ,UAAS;;;ACVhD,YAAYA,YAAW;AAEvB,SAAS,UAAU,MAAM,UAAU,YAAY;AAQ/C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAIA,SAAS,KACf,OACyD;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,SAEI,cAAO,IAAI;AACrB,MAAI,OAAO,YAAY,MAAM;AAC5B,WAAO,UAAU,CAAC,SAAS,SAAS,OAAO,MAAM,KAAK;AAAA,EACvD;AACA,SAAO,OAAO;AACf;AAEO,SAAS,KAAQ,OAAoD;AAC3E,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,SAAa;AAAA,IACZ,CAAC,aAAa,iBAAiB,OAAO,UAAU,SAAS,EAAE,IAAI,KAAK;AAAA,IACpE,MAAM,SAAS,OAAO,KAAK;AAAA,IAC3B,MAAM,SAAS,OAAO,KAAK;AAAA,EAC5B;AACD;AAEO,SAAS,QACf,OACe;AACf,QAAM,YAAY,aAAa,KAAK;AACpC,SAAO,KAAK,SAAS;AACtB;AASO,SAAS,MAAM,OAAoC;AACzD,QAAM,QAAc,kBAAW,YAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,QAAM,WAAW,SAAS,OAAO,KAAK;AACtC,MAAI,aAAa,QAAW;AAC3B,UAAM,OAAO;AAAA,MACZ;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,IACD;AACA,WAAO;AAAA,MACN,IAAI;AAAA,MACJ,QAAQ;AAAA,MACR,MAAM,MAAM;AAAA,MAAC;AAAA,MACb,MAAM,MAAM;AAAA,MAAC;AAAA,IACd;AAAA,EACD;AACA,QAAM,OAAa,cAAqB;AAAA,IACvC,IAAI,SAAS;AAAA,IACb,QAAQ,SAAS,QAAQ;AAAA,IACzB,MAAM,MAAM,KAAK,KAAK;AAAA,IACtB,MAAM,MAAM,KAAK,KAAK;AAAA,EACvB,CAAC;AACD,QAAM,WAAiB,mBAAY,MAAM;AACxC,SAAK,QAAQ,KAAK,SAAS;AAC3B,SAAK,QAAQ,SAAS,SAAS,QAAQ;AACvC,WAAO,KAAK;AAAA,EACb,GAAG,CAAC,IAAI,CAAC;AACT,SAAa;AAAA,IACZ,CAAC,aAAa,oBAAoB,OAAO,UAAU,UAAU,EAAE,IAAI,KAAK;AAAA,IACxE;AAAA,IACA;AAAA,EACD;AACD","sourcesContent":["import type { Store } from \"atom.io/internal\"\nimport { IMPLICIT } from \"atom.io/internal\"\nimport * as React from \"react\"\n\nexport const StoreContext = React.createContext<Store>(IMPLICIT.STORE)\n\nexport const StoreProvider: React.FC<{\n\tchildren: React.ReactNode\n\tstore?: Store\n}> = ({ children, store = IMPLICIT.STORE }) => (\n\t<StoreContext.Provider value={store}>{children}</StoreContext.Provider>\n)\n","import * as React from \"react\"\n\nimport { getState, redo, setState, undo } from \"atom.io\"\nimport type {\n\tMutableAtomToken,\n\tReadonlySelectorToken,\n\tStateToken,\n\tTimelineToken,\n} from \"atom.io\"\n\nimport {\n\tgetJsonToken,\n\tsubscribeToState,\n\tsubscribeToTimeline,\n\twithdraw,\n} from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"./store-context\"\n\nexport function useI<T>(\n\ttoken: StateToken<T>,\n): <New extends T>(next: New | ((old: T) => New)) => void {\n\tconst store = React.useContext(StoreContext)\n\tconst setter: React.MutableRefObject<\n\t\t(<New extends T>(next: New | ((old: T) => New)) => void) | null\n\t> = React.useRef(null)\n\tif (setter.current === null) {\n\t\tsetter.current = (next) => setState(token, next, store)\n\t}\n\treturn setter.current\n}\n\nexport function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\treturn React.useSyncExternalStore<T>(\n\t\t(dispatch) => subscribeToState(token, dispatch, `use-o:${id}`, store),\n\t\t() => getState(token, store),\n\t\t() => getState(token, store),\n\t)\n}\n\nexport function useJSON<Serializable extends Json.Serializable>(\n\ttoken: MutableAtomToken<any, Serializable>,\n): Serializable {\n\tconst jsonToken = getJsonToken(token)\n\treturn useO(jsonToken)\n}\n\nexport type TimelineMeta = {\n\tat: number\n\tlength: number\n\tundo: () => void\n\tredo: () => void\n}\n\nexport function useTL(token: TimelineToken): TimelineMeta {\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\tconst timeline = withdraw(token, store)\n\tif (timeline === undefined) {\n\t\tstore.logger.error(\n\t\t\t`❌`,\n\t\t\t`timeline`,\n\t\t\ttoken.key,\n\t\t\t`Failed to use timeline because it does not exist`,\n\t\t)\n\t\treturn {\n\t\t\tat: NaN,\n\t\t\tlength: NaN,\n\t\t\tundo: () => {},\n\t\t\tredo: () => {},\n\t\t}\n\t}\n\tconst meta = React.useRef<TimelineMeta>({\n\t\tat: timeline.at,\n\t\tlength: timeline.history.length,\n\t\tundo: () => undo(token),\n\t\tredo: () => redo(token),\n\t})\n\tconst retrieve = React.useCallback(() => {\n\t\tmeta.current.at = timeline.at\n\t\tmeta.current.length = timeline.history.length\n\t\treturn meta.current\n\t}, [meta])\n\treturn React.useSyncExternalStore<TimelineMeta>(\n\t\t(dispatch) => subscribeToTimeline(token, dispatch, `use-tl:${id}`, store),\n\t\tretrieve,\n\t\tretrieve,\n\t)\n}\n"]}

package/react/dist/metafile-cjs.json

@@ -1 +1 @@
-{"inputs":{"src/store-context.tsx":{"bytes":399,"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"src/store-hooks.ts":{"bytes":1233,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"}],"format":"esm"},"src/index.ts":{"bytes":62,"imports":[{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"},{"path":"src/store-hooks.ts","kind":"import-statement","original":"./store-hooks"}],"format":"esm"}},"outputs":{"dist/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":2582},"dist/index.cjs":{"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true}],"exports":["StoreContext","StoreProvider","useI","useJSON","useO"],"entryPoint":"src/index.ts","inputs":{"src/store-context.tsx":{"bytesInOutput":308},"src/index.ts":{"bytesInOutput":0},"src/store-hooks.ts":{"bytesInOutput":750}},"bytes":1177}}}
+{"inputs":{"src/store-context.tsx":{"bytes":399,"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"src/store-hooks.ts":{"bytes":2285,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"}],"format":"esm"},"src/index.ts":{"bytes":62,"imports":[{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"},{"path":"src/store-hooks.ts","kind":"import-statement","original":"./store-hooks"}],"format":"esm"}},"outputs":{"dist/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":4490},"dist/index.cjs":{"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true}],"exports":["StoreContext","StoreProvider","useI","useJSON","useO","useTL"],"entryPoint":"src/index.ts","inputs":{"src/store-context.tsx":{"bytesInOutput":308},"src/index.ts":{"bytesInOutput":0},"src/store-hooks.ts":{"bytesInOutput":1717}},"bytes":2153}}}

package/react/dist/metafile-esm.json

@@ -1 +1 @@
-{"inputs":{"src/store-context.tsx":{"bytes":399,"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"src/store-hooks.ts":{"bytes":1233,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"}],"format":"esm"},"src/index.ts":{"bytes":62,"imports":[{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"},{"path":"src/store-hooks.ts","kind":"import-statement","original":"./store-hooks"}],"format":"esm"}},"outputs":{"dist/index.js.map":{"imports":[],"exports":[],"inputs":{},"bytes":2582},"dist/index.js":{"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true}],"exports":["StoreContext","StoreProvider","useI","useJSON","useO"],"entryPoint":"src/index.ts","inputs":{"src/store-context.tsx":{"bytesInOutput":308},"src/index.ts":{"bytesInOutput":0},"src/store-hooks.ts":{"bytesInOutput":750}},"bytes":1177}}}
+{"inputs":{"src/store-context.tsx":{"bytes":399,"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"src/store-hooks.ts":{"bytes":2285,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"}],"format":"esm"},"src/index.ts":{"bytes":62,"imports":[{"path":"src/store-context.tsx","kind":"import-statement","original":"./store-context"},{"path":"src/store-hooks.ts","kind":"import-statement","original":"./store-hooks"}],"format":"esm"}},"outputs":{"dist/index.js.map":{"imports":[],"exports":[],"inputs":{},"bytes":4490},"dist/index.js":{"imports":[{"path":"atom.io/internal","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"atom.io","kind":"import-statement","external":true},{"path":"atom.io/internal","kind":"import-statement","external":true}],"exports":["StoreContext","StoreProvider","useI","useJSON","useO","useTL"],"entryPoint":"src/index.ts","inputs":{"src/store-context.tsx":{"bytesInOutput":308},"src/index.ts":{"bytesInOutput":0},"src/store-hooks.ts":{"bytesInOutput":1717}},"bytes":2153}}}

package/react/src/store-hooks.ts

@@ -1,13 +1,19 @@
 import * as React from "react"
 
-import { getState, setState, subscribe } from "atom.io"
+import { getState, redo, setState, undo } from "atom.io"
 import type {
 	MutableAtomToken,
 	ReadonlySelectorToken,
 	StateToken,
+	TimelineToken,
 } from "atom.io"
 
-import { getJsonToken } from "atom.io/internal"
+import {
+	getJsonToken,
+	subscribeToState,
+	subscribeToTimeline,
+	withdraw,
+} from "atom.io/internal"
 import type { Json } from "atom.io/json"
 import { StoreContext } from "./store-context"
 
@@ -28,7 +34,7 @@ export function useO<T>(token: ReadonlySelectorToken<T> | StateToken<T>): T {
 	const store = React.useContext(StoreContext)
 	const id = React.useId()
 	return React.useSyncExternalStore<T>(
-		(dispatch) => subscribe(token, dispatch, `use-o:${id}`, store),
+		(dispatch) => subscribeToState(token, dispatch, `use-o:${id}`, store),
 		() => getState(token, store),
 		() => getState(token, store),
 	)
@@ -40,3 +46,46 @@ export function useJSON<Serializable extends Json.Serializable>(
 	const jsonToken = getJsonToken(token)
 	return useO(jsonToken)
 }
+
+export type TimelineMeta = {
+	at: number
+	length: number
+	undo: () => void
+	redo: () => void
+}
+
+export function useTL(token: TimelineToken): TimelineMeta {
+	const store = React.useContext(StoreContext)
+	const id = React.useId()
+	const timeline = withdraw(token, store)
+	if (timeline === undefined) {
+		store.logger.error(
+			`❌`,
+			`timeline`,
+			token.key,
+			`Failed to use timeline because it does not exist`,
+		)
+		return {
+			at: NaN,
+			length: NaN,
+			undo: () => {},
+			redo: () => {},
+		}
+	}
+	const meta = React.useRef<TimelineMeta>({
+		at: timeline.at,
+		length: timeline.history.length,
+		undo: () => undo(token),
+		redo: () => redo(token),
+	})
+	const retrieve = React.useCallback(() => {
+		meta.current.at = timeline.at
+		meta.current.length = timeline.history.length
+		return meta.current
+	}, [meta])
+	return React.useSyncExternalStore<TimelineMeta>(
+		(dispatch) => subscribeToTimeline(token, dispatch, `use-tl:${id}`, store),
+		retrieve,
+		retrieve,
+	)
+}