atom.io 0.9.8 → 0.9.10

package/internal/src/atom/is-default.ts

@@ -32,6 +32,6 @@ export const isSelectorDefault = (
 	key: string,
 	store: Store = IMPLICIT.STORE,
 ): boolean => {
-	const roots = traceAllSelectorAtoms(key, store)
-	return roots.every((root) => isAtomDefault(root.key, store))
+	const rootKeys = traceAllSelectorAtoms(key, store)
+	return rootKeys.every((rootKey) => isAtomDefault(rootKey, store))
 }

package/internal/src/caching.ts

@@ -27,10 +27,12 @@ export const cacheValue = (
 				subject.next({ newValue: value, oldValue: value })
 			})
 			.catch((error) => {
-				store.config.logger?.error(
-					`Promised value for "${key}" rejected:`,
-					error,
-				)
+				if (error !== `canceled`) {
+					store.config.logger?.error(
+						`Promised value for "${key}" rejected:`,
+						error,
+					)
+				}
 			})
 	} else {
 		target(store).valueMap.set(key, value)

package/internal/src/index.ts

@@ -3,6 +3,7 @@ export * from "./caching"
 export * from "./families"
 export * from "./future"
 export * from "./get-state-internal"
+export * from "./keys"
 export * from "./operation"
 export * from "./mutable"
 export * from "./selector"

package/internal/src/keys.ts

@@ -0,0 +1,30 @@
+import type { Store } from "./store"
+import { target } from "./transaction"
+
+export type AtomKey<T> = string & { __atomKey?: never; __brand?: T }
+export type SelectorKey<T> = string & { __selectorKey?: never; __brand?: T }
+export type ReadonlySelectorKey<T> = string & {
+	__readonlySelectorKey?: never
+	__brand?: T
+}
+
+export const isAtomKey = (key: string, store: Store): key is AtomKey<unknown> =>
+	target(store).atoms.has(key)
+export const isSelectorKey = (
+	key: string,
+	store: Store,
+): key is SelectorKey<unknown> => target(store).selectors.has(key)
+export const isReadonlySelectorKey = (
+	key: string,
+	store: Store,
+): key is ReadonlySelectorKey<unknown> =>
+	target(store).readonlySelectors.has(key)
+
+export type StateKey<T> = AtomKey<T> | ReadonlySelectorKey<T> | SelectorKey<T>
+export const isStateKey = (
+	key: string,
+	store: Store,
+): key is StateKey<unknown> =>
+	isAtomKey(key, store) ||
+	isSelectorKey(key, store) ||
+	isReadonlySelectorKey(key, store)

package/internal/src/selector/get-selector-dependency-keys.ts

@@ -0,0 +1,20 @@
+import type { AtomKey, ReadonlySelectorKey, SelectorKey } from "../keys"
+import { isStateKey } from "../keys"
+import type { Store } from "../store"
+import { target } from "../transaction"
+
+export const getSelectorDependencyKeys = (
+	key: string,
+	store: Store,
+): (
+	| AtomKey<unknown>
+	| ReadonlySelectorKey<unknown>
+	| SelectorKey<unknown>
+)[] => {
+	const sources = target(store)
+		.selectorGraph.getRelationEntries({ downstreamSelectorKey: key })
+		.filter(([_, { source }]) => source !== key)
+		.map(([_, { source }]) => source)
+		.filter((source) => isStateKey(source, store))
+	return sources
+}

package/internal/src/selector/index.ts

@@ -1,4 +1,4 @@
-export * from "./lookup-selector-sources"
+export * from "./get-selector-dependency-keys"
 export * from "./register-selector"
 export * from "./create-selector"
 export * from "./trace-selector-atoms"

package/internal/src/selector/trace-selector-atoms.ts

@@ -1,45 +1,50 @@
-import type { AtomToken, ReadonlySelectorToken, StateToken } from "atom.io"
-
 import type { Store } from ".."
-import { lookupSelectorSources } from "./lookup-selector-sources"
+import type { AtomKey, StateKey } from "../keys"
+import { isAtomKey } from "../keys"
+import { getSelectorDependencyKeys } from "./get-selector-dependency-keys"
 
 export const traceSelectorAtoms = (
 	selectorKey: string,
-	dependency: ReadonlySelectorToken<unknown> | StateToken<unknown>,
+	directDependencyKey: StateKey<unknown>,
 	store: Store,
-): AtomToken<unknown>[] => {
-	const roots: AtomToken<unknown>[] = []
+): AtomKey<unknown>[] => {
+	const rootKeys: AtomKey<unknown>[] = []
 
-	const sources = lookupSelectorSources(dependency.key, store)
+	const indirectDependencyKeys = getSelectorDependencyKeys(
+		directDependencyKey,
+		store,
+	)
 	let depth = 0
-	while (sources.length > 0) {
+	while (indirectDependencyKeys.length > 0) {
 		// biome-ignore lint/style/noNonNullAssertion: just checked length ^^^
-		const source = sources.shift()!
+		const indirectDependencyKey = indirectDependencyKeys.shift()!
 		++depth
-		if (depth > 999) {
+		if (depth > 99999) {
 			throw new Error(
-				`Maximum selector dependency depth exceeded in selector "${selectorKey}".`,
+				`Maximum selector dependency depth exceeded (> 99999) in selector "${selectorKey}". This is likely due to a circular dependency.`,
 			)
 		}
 
-		if (source.type !== `atom`) {
-			sources.push(...lookupSelectorSources(source.key, store))
-		} else {
-			roots.push(source)
+		if (!isAtomKey(indirectDependencyKey, store)) {
+			indirectDependencyKeys.push(
+				...getSelectorDependencyKeys(indirectDependencyKey, store),
+			)
+		} else if (!rootKeys.includes(indirectDependencyKey)) {
+			rootKeys.push(indirectDependencyKey)
 		}
 	}
 
-	return roots
+	return rootKeys
 }
 
 export const traceAllSelectorAtoms = (
 	selectorKey: string,
 	store: Store,
-): AtomToken<unknown>[] => {
-	const sources = lookupSelectorSources(selectorKey, store)
-	return sources.flatMap((source) =>
-		source.type === `atom`
-			? source
-			: traceSelectorAtoms(selectorKey, source, store),
+): AtomKey<unknown>[] => {
+	const directDependencyKeys = getSelectorDependencyKeys(selectorKey, store)
+	return directDependencyKeys.flatMap((depKey) =>
+		isAtomKey(depKey, store)
+			? depKey
+			: traceSelectorAtoms(selectorKey, depKey, store),
 	)
 }

package/internal/src/selector/update-selector-atoms.ts

@@ -20,15 +20,15 @@ export const updateSelectorAtoms = (
 		)
 		return
 	}
-	const roots = traceSelectorAtoms(selectorKey, dependency, store)
+	const rootKeys = traceSelectorAtoms(selectorKey, dependency.key, store)
 	store.config.logger?.info(
 		`   || adding roots for "${selectorKey}":`,
-		roots.map((r) => r.key),
+		rootKeys.map((r) => r),
 	)
-	for (const root of roots) {
+	for (const atomKey of rootKeys) {
 		core.selectorAtoms = core.selectorAtoms.set({
 			selectorKey,
-			atomKey: root.key,
+			atomKey,
 		})
 	}
 }

package/internal/src/store/index.ts

@@ -1,5 +1,4 @@
 export * from "./deposit"
-export * from "./lookup"
 export * from "./store"
 export * from "./withdraw"
 export * from "./withdraw-new-family-member"

package/internal/src/subscribe/subscribe-to-root-atoms.ts

@@ -2,7 +2,6 @@ import { getState__INTERNAL } from "../get-state-internal"
 import type { ReadonlySelector, Selector } from "../selector"
 import { traceAllSelectorAtoms } from "../selector"
 import type { Store } from "../store"
-import { withdraw } from "../store"
 import { recallState } from "./recall-state"
 
 export const subscribeToRootAtoms = <T>(
@@ -12,18 +11,18 @@ export const subscribeToRootAtoms = <T>(
 	const dependencySubscriptions =
 		`default` in state
 			? null
-			: traceAllSelectorAtoms(state.key, store).map((atomToken) => {
-					const atom = withdraw(atomToken, store)
+			: traceAllSelectorAtoms(state.key, store).map((atomKey) => {
+					const atom = store.atoms.get(atomKey)
 					if (atom === undefined) {
 						throw new Error(
-							`Atom "${atomToken.key}", a dependency of selector "${state.key}", not found in store "${store.config.name}".`,
+							`Atom "${atomKey}", a dependency of selector "${state.key}", not found in store "${store.config.name}".`,
 						)
 					}
 					return atom.subject.subscribe(
 						`${state.type}:${state.key}`,
 						(atomChange) => {
 							store.config.logger?.info(
-								`📢 selector "${state.key}" saw root "${atomToken.key}" go (`,
+								`📢 selector "${state.key}" saw root "${atomKey}" go (`,
 								atomChange.oldValue,
 								`->`,
 								atomChange.newValue,

package/introspection/dist/index.d.mts

@@ -21,4 +21,4 @@ type FamilyNode<Token extends AtomToken<unknown> | ReadonlySelectorToken<unknown
 };
 type StateTokenIndex<Token extends AtomToken<unknown> | ReadonlySelectorToken<unknown> | SelectorToken<unknown>> = Record<string, FamilyNode<Token> | Token>;
 
-export { FamilyNode, StateTokenIndex, attachIntrospectionStates };
+export { type FamilyNode, type StateTokenIndex, attachIntrospectionStates };

package/introspection/dist/index.d.ts

@@ -21,4 +21,4 @@ type FamilyNode<Token extends AtomToken<unknown> | ReadonlySelectorToken<unknown
 };
 type StateTokenIndex<Token extends AtomToken<unknown> | ReadonlySelectorToken<unknown> | SelectorToken<unknown>> = Record<string, FamilyNode<Token> | Token>;
 
-export { FamilyNode, StateTokenIndex, attachIntrospectionStates };
+export { type FamilyNode, type StateTokenIndex, attachIntrospectionStates };

package/json/dist/index.d.mts

@@ -23,11 +23,7 @@ type Array<Element extends Serializable = Serializable> = ReadonlyArray<Element>
 type json_Array<Element extends Serializable = Serializable> = Array<Element>;
 type json_Serializable = Serializable;
 declare namespace json {
-  export {
-    json_Array as Array,
-    Object$1 as Object,
-    json_Serializable as Serializable,
-  };
+  export type { json_Array as Array, Object$1 as Object, json_Serializable as Serializable };
 }
 
 declare const parseJson: <S extends Stringified<Serializable>>(str: string | S) => S extends Stringified<infer J extends Serializable> ? J : Serializable;
@@ -52,4 +48,4 @@ declare const selectJson: <T, J extends Serializable>(atom: AtomIO.AtomToken<T>,
 
 declare const selectJsonFamily: <T, J extends Serializable, K extends Serializable>(atomFamily: AtomIO.AtomFamily<T, K>, transform: JsonInterface<T, J>, store?: Store) => AtomIO.SelectorFamily<J, K>;
 
-export { Empty, JSON_DEFAULTS, JSON_TYPE_NAMES, json as Json, JsonInterface, JsonTypeName, JsonTypes, Stringified, isBoolean, isNull, isNumber, isPrimitive, isString, parseJson, primitive, selectJson, selectJsonFamily, stringSetJsonInterface, stringifyJson };
+export { type Empty, JSON_DEFAULTS, JSON_TYPE_NAMES, json as Json, type JsonInterface, type JsonTypeName, type JsonTypes, type Stringified, isBoolean, isNull, isNumber, isPrimitive, isString, parseJson, type primitive, selectJson, selectJsonFamily, stringSetJsonInterface, stringifyJson };

package/json/dist/index.d.ts

@@ -23,11 +23,7 @@ type Array<Element extends Serializable = Serializable> = ReadonlyArray<Element>
 type json_Array<Element extends Serializable = Serializable> = Array<Element>;
 type json_Serializable = Serializable;
 declare namespace json {
-  export {
-    json_Array as Array,
-    Object$1 as Object,
-    json_Serializable as Serializable,
-  };
+  export type { json_Array as Array, Object$1 as Object, json_Serializable as Serializable };
 }
 
 declare const parseJson: <S extends Stringified<Serializable>>(str: string | S) => S extends Stringified<infer J extends Serializable> ? J : Serializable;
@@ -52,4 +48,4 @@ declare const selectJson: <T, J extends Serializable>(atom: AtomIO.AtomToken<T>,
 
 declare const selectJsonFamily: <T, J extends Serializable, K extends Serializable>(atomFamily: AtomIO.AtomFamily<T, K>, transform: JsonInterface<T, J>, store?: Store) => AtomIO.SelectorFamily<J, K>;
 
-export { Empty, JSON_DEFAULTS, JSON_TYPE_NAMES, json as Json, JsonInterface, JsonTypeName, JsonTypes, Stringified, isBoolean, isNull, isNumber, isPrimitive, isString, parseJson, primitive, selectJson, selectJsonFamily, stringSetJsonInterface, stringifyJson };
+export { type Empty, JSON_DEFAULTS, JSON_TYPE_NAMES, json as Json, type JsonInterface, type JsonTypeName, type JsonTypes, type Stringified, isBoolean, isNull, isNumber, isPrimitive, isString, parseJson, type primitive, selectJson, selectJsonFamily, stringSetJsonInterface, stringifyJson };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "atom.io",
-  "version": "0.9.8",
+  "version": "0.9.10",
   "description": "Composable and testable reactive data library.",
   "homepage": "https://atom.io.fyi",
   "sideEffects": false,
@@ -49,13 +49,13 @@
   },
   "devDependencies": {
     "@emotion/react": "11.11.1",
-    "@testing-library/react": "14.1.0",
+    "@testing-library/react": "14.1.2",
     "@types/npmlog": "4.1.6",
     "@types/react": "18.2.37",
     "@types/tmp": "0.2.6",
     "@vitest/coverage-v8": "0.34.6",
     "concurrently": "8.2.2",
-    "eslint": "8.53.0",
+    "eslint": "8.54.0",
     "framer-motion": "10.16.5",
     "happy-dom": "12.10.3",
     "npmlog": "7.0.1",
@@ -66,7 +66,7 @@
     "socket.io": "4.7.2",
     "socket.io-client": "4.7.2",
     "tmp": "0.2.1",
-    "tsup": "7.2.0",
+    "tsup": "7.3.0",
     "typescript": "5.2.2",
     "vite": "4.5.0",
     "vite-tsconfig-paths": "4.2.1",

package/react-devtools/dist/index.css

@@ -3,7 +3,17 @@
   display: flex;
   flex-flow: row wrap;
   gap: 4px;
-  section { display: flex; flex-flow: row; margin-bottom: 1rem; border: 1px solid #ccc; padding: 2px; margin: 0; span { display: flex; } };
+  section {
+    display: flex;
+    flex-flow: row;
+    margin-bottom: 1rem;
+    border: 1px solid #ccc;
+    padding: 2px;
+    margin: 0;
+    span {
+      display: flex;
+    }
+  }
 }
 
 /* src/devtools.scss */
@@ -41,11 +51,279 @@ main.atom_io_devtools {
     padding-bottom: 0;
     display: flex;
     justify-content: space-between;
-    h1 { font-size: inherit; margin: 0; font-size: 24px; font-family: charter; } nav { display: flex; flex-flow: row nowrap; button { cursor: pointer; background: none; border: none; padding: none; margin-bottom: -2px; z-index: 1000; &:disabled { cursor: default; background-color: var(--bg-tint1); color: var(--fg-color); border: var(--fg-border); border-bottom: none; } } };
+    h1 {
+      font-size: inherit;
+      margin: 0;
+      font-size: 24px;
+      font-family: charter;
+    }
+    nav {
+      display: flex;
+      flex-flow: row nowrap;
+      button {
+        cursor: pointer;
+        background: none;
+        border: none;
+        padding: none;
+        margin-bottom: -2px;
+        z-index: 1000;
+        &:disabled {
+          cursor: default;
+          background-color: var(--bg-tint1);
+          color: var(--fg-color);
+          border: var(--fg-border);
+          border-bottom: none;
+        }
+      }
+    }
   }
   > main {
     background: var(--bg-tint1);
   }
-  main { overflow-y: scroll; flex-grow: 1; display: flex; flex-flow: column; gap: 0; article.index { .node .node { border-right: var(--fg-border); padding-right: 0; background: #fff3; } .node > .node { margin: 5px 0; margin-left: 12px; border-left: var(--fg-border); } .node { border-top: var(--fg-border); overflow-x: scroll; padding: 5px; &:last-of-type { border-bottom: var(--fg-border); } &.transaction_update { padding: 0; } header { display: flex; flex-flow: row; gap: 5px; position: sticky; z-index: 999; top: 0; button.carat { cursor: pointer; background: none; border: none; width: 20px; &.open { transform: rotate(90deg); } &:disabled { cursor: default; } } label { display: flex; flex-flow: row; gap: 5px; cursor: help; h2 { display: inline-block; margin: 0; } .detail { color: #777; @media (prefers-color-scheme: light) { color: #999; } } } } main { margin-left: 15px; } } section.transaction_log { margin-top: 0; header: { padding: 5px; } main { display: flex; flex-flow: row wrap; gap: 5px; .transaction_update { width: 100%; display: flex; flex-flow: row; align-items: flex-start; justify-content: flex-start; justify-items: flex-start; align-content: flex-start; border-left: var(--fg-border); border-top: var(--fg-border); header { padding: 5px; h4 { margin: 0; padding: 0; font-size: inherit; } } main { margin-left: 0; display: flex; flex-flow: column; gap: 0px; border-left: 1px solid #333; section ~ section { border-top: 1px solid #333; } section { padding: 5px; &.transaction_output { border-right: none; } &.transaction_impact { padding: 5px; } margin: 0; article { border-left: var(--fg-border); border-right: var(--fg-border); .summary { white-space: nowrap; } } } } } } } section.timeline_log { header { display: flex; label { display: flex; width: 100%; flex-grow: 1; .gap { flex-grow: 1; } nav { display: flex; flex-flow: row nowrap; gap: 5px; } } } .timeline_update { padding: 5px; border-left: var(--fg-border); h4 { margin: 0; padding: 0; font-size: inherit; } main { margin: 0; .node.atom_update { border-left: var(--fg-border); } } } .you_are_here { background: var(--fg-color); color: var(--bg-color); text-align: center; } } } } footer { display: flex; justify-content: flex-end; button { cursor: pointer; background: none; border: none; padding: none; position: absolute; right: 0; bottom: 0; } } .json_editor { input { font-family: theia; border: none; border-bottom: 1px solid; background: none; &:disabled { border: none; } } button { background: none; margin-left: auto; color: #777; border: none; font-family: theia; font-size: 14px; margin: none; padding: 4px; padding-bottom: 6px; cursor: pointer; &:hover { color: #333; background-color: #aaa; } } select { font-family: theia; font-size: 14px; background: none; border: none; color: #777; @media (prefers-color-scheme: light) { color: #999; } } .json_editor_unofficial { background-color: #777; button { color: #333; } } .json_editor_missing { background-color: #f055; } .json_editor_key { padding-right: 10px; input { color: #999; @media (prefers-color-scheme: light) { color: #777; } } } .json_editor_object { border-left: 2px solid #333; padding-left: 20px; @media (prefers-color-scheme: light) { border-color: #ccc; } .json_editor_properties { > * { border-bottom: var(--fg-border); margin-bottom: 2px; } } } };
+  main {
+    overflow-y: scroll;
+    flex-grow: 1;
+    display: flex;
+    flex-flow: column;
+    gap: 0;
+    article.index {
+      .node .node {
+        border-right: var(--fg-border);
+        padding-right: 0;
+        background: #fff3;
+      }
+      .node > .node {
+        margin: 5px 0;
+        margin-left: 12px;
+        border-left: var(--fg-border);
+      }
+      .node {
+        border-top: var(--fg-border);
+        overflow-x: scroll;
+        padding: 5px;
+        &:last-of-type {
+          border-bottom: var(--fg-border);
+        }
+        &.transaction_update {
+          padding: 0;
+        }
+        header {
+          display: flex;
+          flex-flow: row;
+          gap: 5px;
+          position: sticky;
+          z-index: 999;
+          top: 0;
+          button.carat {
+            cursor: pointer;
+            background: none;
+            border: none;
+            width: 20px;
+            &.open {
+              transform: rotate(90deg);
+            }
+            &:disabled {
+              cursor: default;
+            }
+          }
+          label {
+            display: flex;
+            flex-flow: row;
+            gap: 5px;
+            cursor: help;
+            h2 {
+              display: inline-block;
+              margin: 0;
+            }
+            .detail {
+              color: #777;
+              @media (prefers-color-scheme: light) {
+                color: #999;
+              }
+            }
+          }
+        }
+        main {
+          margin-left: 15px;
+        }
+      }
+      section.transaction_log {
+        margin-top: 0;
+        header: {
+          padding: 5px;
+        }
+        main {
+          display: flex;
+          flex-flow: row wrap;
+          gap: 5px;
+          .transaction_update {
+            width: 100%;
+            display: flex;
+            flex-flow: row;
+            align-items: flex-start;
+            justify-content: flex-start;
+            justify-items: flex-start;
+            align-content: flex-start;
+            border-left: var(--fg-border);
+            border-top: var(--fg-border);
+            header {
+              padding: 5px;
+              h4 {
+                margin: 0;
+                padding: 0;
+                font-size: inherit;
+              }
+            }
+            main {
+              margin-left: 0;
+              display: flex;
+              flex-flow: column;
+              gap: 0px;
+              border-left: 1px solid #333;
+              section ~ section {
+                border-top: 1px solid #333;
+              }
+              section {
+                padding: 5px;
+                &.transaction_output {
+                  border-right: none;
+                }
+                &.transaction_impact {
+                  padding: 5px;
+                }
+                margin: 0;
+                article {
+                  border-left: var(--fg-border);
+                  border-right: var(--fg-border);
+                  .summary {
+                    white-space: nowrap;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+      section.timeline_log {
+        header {
+          display: flex;
+          label {
+            display: flex;
+            width: 100%;
+            flex-grow: 1;
+            .gap {
+              flex-grow: 1;
+            }
+            nav {
+              display: flex;
+              flex-flow: row nowrap;
+              gap: 5px;
+            }
+          }
+        }
+        .timeline_update {
+          padding: 5px;
+          border-left: var(--fg-border);
+          h4 {
+            margin: 0;
+            padding: 0;
+            font-size: inherit;
+          }
+          main {
+            margin: 0;
+            .node.atom_update {
+              border-left: var(--fg-border);
+            }
+          }
+        }
+        .you_are_here {
+          background: var(--fg-color);
+          color: var(--bg-color);
+          text-align: center;
+        }
+      }
+    }
+  }
+  footer {
+    display: flex;
+    justify-content: flex-end;
+    button {
+      cursor: pointer;
+      background: none;
+      border: none;
+      padding: none;
+      position: absolute;
+      right: 0;
+      bottom: 0;
+    }
+  }
+  .json_editor {
+    input {
+      font-family: theia;
+      border: none;
+      border-bottom: 1px solid;
+      background: none;
+      &:disabled {
+        border: none;
+      }
+    }
+    button {
+      background: none;
+      margin-left: auto;
+      color: #777;
+      border: none;
+      font-family: theia;
+      font-size: 14px;
+      margin: none;
+      padding: 4px;
+      padding-bottom: 6px;
+      cursor: pointer;
+      &:hover {
+        color: #333;
+        background-color: #aaa;
+      }
+    }
+    select {
+      font-family: theia;
+      font-size: 14px;
+      background: none;
+      border: none;
+      color: #777;
+      @media (prefers-color-scheme: light) {
+        color: #999;
+      }
+    }
+    .json_editor_unofficial {
+      background-color: #777;
+      button {
+        color: #333;
+      }
+    }
+    .json_editor_missing {
+      background-color: #f055;
+    }
+    .json_editor_key {
+      padding-right: 10px;
+      input {
+        color: #999;
+        @media (prefers-color-scheme: light) {
+          color: #777;
+        }
+      }
+    }
+    .json_editor_object {
+      border-left: 2px solid #333;
+      padding-left: 20px;
+      @media (prefers-color-scheme: light) {
+        border-color: #ccc;
+      }
+      .json_editor_properties {
+        > * {
+          border-bottom: var(--fg-border);
+          margin-bottom: 2px;
+        }
+      }
+    }
+  }
 }
 /*# sourceMappingURL=index.css.map */