atom.io 0.6.9 → 0.8.0

package/react-devtools/src/devtools.scss

@@ -0,0 +1,310 @@
+main.atom_io_devtools {
+  --fg-color: #eee;
+  --bg-color: #111;
+  --bg-tint1: #222;
+  --fg-border: 1px solid var(--fg-color);
+  @media (prefers-color-scheme: light) {
+    --fg-color: #444;
+    --bg-color: #ddd;
+    --bg-tint1: #e3e3e3;
+  }
+  box-sizing: border-box;
+  color: var(--fg-color);
+  background-color: var(--bg-color);
+  border: 2px solid var(--fg-color);
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  height: 100%;
+  display: flex;
+  flex-flow: column;
+  max-height: 800px;
+  width: 100%;
+  max-width: 500px;
+  overflow-y: scroll;
+  * {
+    font-size: 16px;
+    font-family: theia, monospace;
+  }
+  > header {
+    padding: 5px;
+    padding-left: 10px;
+    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;
+        }
+      }
+    }
+  }
+  > 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;
+        }
+      }
+    }
+  }
+}

package/react-devtools/src/index.ts

@@ -0,0 +1,72 @@
+import { atom, atomFamily } from "atom.io"
+import { attachIntrospectionStates } from "atom.io/introspection"
+import { lazyLocalStorageEffect } from "~/packages/atom.io/__unstable__/web-effects/src"
+
+import { isPlainObject } from "~/packages/anvl/src/object"
+import { Refinery } from "~/packages/anvl/src/refinement/refinery"
+import {
+	Differ,
+	diffArray,
+	diffBoolean,
+	diffNumber,
+	diffObject,
+	diffString,
+} from "~/packages/anvl/src/tree/differ"
+
+export * from "./AtomIODevtools"
+
+export const {
+	atomIndex,
+	selectorIndex,
+	transactionIndex,
+	findTransactionLogState,
+	timelineIndex,
+	findTimelineState,
+} = attachIntrospectionStates()
+
+export const devtoolsAreOpenState = atom<boolean>({
+	key: `👁‍🗨 Devtools Are Open`,
+	default: true,
+	effects: [lazyLocalStorageEffect(`👁‍🗨 Devtools Are Open`)],
+})
+
+type DevtoolsView = `atoms` | `selectors` | `timelines` | `transactions`
+
+export const devtoolsViewSelectionState = atom<DevtoolsView>({
+	key: `👁‍🗨 Devtools View Selection`,
+	default: `atoms`,
+	effects: [lazyLocalStorageEffect(`👁‍🗨 Devtools View`)],
+})
+
+export const devtoolsViewOptionsState = atom<DevtoolsView[]>({
+	key: `👁‍🗨 Devtools View Options`,
+	default: [`atoms`, `selectors`, `transactions`, `timelines`],
+	effects: [lazyLocalStorageEffect(`👁‍🗨 Devtools View Options`)],
+})
+
+export const findViewIsOpenState = atomFamily<boolean, string>({
+	key: `👁‍🗨 Devtools View Is Open`,
+	default: false,
+	effects: (key) => [lazyLocalStorageEffect(key + `:view-is-open`)],
+})
+
+export const primitiveRefinery = new Refinery({
+	number: (input: unknown): input is number => typeof input === `number`,
+	string: (input: unknown): input is string => typeof input === `string`,
+	boolean: (input: unknown): input is boolean => typeof input === `boolean`,
+	null: (input: unknown): input is null => input === null,
+})
+
+export const jsonTreeRefinery = new Refinery({
+	object: isPlainObject,
+	array: (input: unknown): input is unknown[] => Array.isArray(input),
+})
+
+export const prettyJson = new Differ(primitiveRefinery, jsonTreeRefinery, {
+	number: diffNumber,
+	string: diffString,
+	boolean: diffBoolean,
+	null: () => ({ summary: `No Change` }),
+	object: diffObject,
+	array: diffArray,
+})

package/realtime-react/dist/index.d.mts

@@ -1,6 +1,8 @@
 import * as React from 'react';
 import { Socket } from 'socket.io-client';
 import * as AtomIO from 'atom.io';
+import { Json } from 'atom.io/json';
+import { Transceiver } from 'atom.io/internal';
 
 declare const RealtimeContext: React.Context<{
     socket: Socket;
@@ -10,32 +12,16 @@ declare const RealtimeProvider: React.FC<{
     socket: Socket;
 }>;
 
-type primitive = boolean | number | string | null;
+declare function usePull<J extends Json.Serializable>(token: AtomIO.StateToken<J>): void;
 
-type Serializable = primitive | Readonly<{
-    [key: string]: Serializable;
-}> | ReadonlyArray<Serializable>;
+declare function usePullFamilyMember<J extends Json.Serializable>(token: AtomIO.AtomToken<J>): void;
 
-declare function usePull<J extends Serializable>(token: AtomIO.StateToken<J>): void;
+declare function usePullMutable<T extends Transceiver<Json.Serializable>, J extends Json.Serializable>(token: AtomIO.MutableAtomToken<T, J>): void;
 
-declare function usePullFamily<J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>): void;
+declare function usePullMutableFamilyMember<T extends Transceiver<Json.Serializable>, J extends Json.Serializable>(token: AtomIO.MutableAtomToken<T, J>): void;
 
-declare function usePullFamilyMember<J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>, subKey: AtomIO.Json.Serializable): void;
-
-declare function usePush<J extends Serializable>(token: AtomIO.StateToken<J>): void;
+declare function usePush<J extends Json.Serializable>(token: AtomIO.StateToken<J>): void;
 
 declare function useServerAction<ƒ extends AtomIO.ƒn>(token: AtomIO.TransactionToken<ƒ>): (...parameters: Parameters<ƒ>) => ReturnType<ƒ>;
 
-type RealtimeHooks = {
-    usePull: <J extends Serializable>(token: AtomIO.StateToken<J>) => void;
-    usePullFamily: <J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>) => void;
-    usePullFamilyMember: <J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>, subKey: string) => void;
-    usePush: <J extends Serializable>(token: AtomIO.StateToken<J>) => void;
-    useServerAction: <ƒ extends AtomIO.ƒn>(token: AtomIO.TransactionToken<ƒ>) => (...parameters: Parameters<ƒ>) => ReturnType<ƒ>;
-};
-declare const realtimeHooks: RealtimeHooks;
-
-declare const myIdState__INTERNAL: AtomIO.AtomToken<string | null>;
-declare const myIdState: AtomIO.ReadonlySelectorToken<string | null>;
-
-export { RealtimeContext, RealtimeHooks, RealtimeProvider, myIdState, myIdState__INTERNAL, realtimeHooks, usePull, usePullFamily, usePullFamilyMember, usePush, useServerAction };
+export { RealtimeContext, RealtimeProvider, usePull, usePullFamilyMember, usePullMutable, usePullMutableFamilyMember, usePush, useServerAction };

package/realtime-react/dist/index.d.ts

@@ -1,6 +1,8 @@
 import * as React from 'react';
 import { Socket } from 'socket.io-client';
 import * as AtomIO from 'atom.io';
+import { Json } from 'atom.io/json';
+import { Transceiver } from 'atom.io/internal';
 
 declare const RealtimeContext: React.Context<{
     socket: Socket;
@@ -10,32 +12,16 @@ declare const RealtimeProvider: React.FC<{
     socket: Socket;
 }>;
 
-type primitive = boolean | number | string | null;
+declare function usePull<J extends Json.Serializable>(token: AtomIO.StateToken<J>): void;
 
-type Serializable = primitive | Readonly<{
-    [key: string]: Serializable;
-}> | ReadonlyArray<Serializable>;
+declare function usePullFamilyMember<J extends Json.Serializable>(token: AtomIO.AtomToken<J>): void;
 
-declare function usePull<J extends Serializable>(token: AtomIO.StateToken<J>): void;
+declare function usePullMutable<T extends Transceiver<Json.Serializable>, J extends Json.Serializable>(token: AtomIO.MutableAtomToken<T, J>): void;
 
-declare function usePullFamily<J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>): void;
+declare function usePullMutableFamilyMember<T extends Transceiver<Json.Serializable>, J extends Json.Serializable>(token: AtomIO.MutableAtomToken<T, J>): void;
 
-declare function usePullFamilyMember<J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>, subKey: AtomIO.Json.Serializable): void;
-
-declare function usePush<J extends Serializable>(token: AtomIO.StateToken<J>): void;
+declare function usePush<J extends Json.Serializable>(token: AtomIO.StateToken<J>): void;
 
 declare function useServerAction<ƒ extends AtomIO.ƒn>(token: AtomIO.TransactionToken<ƒ>): (...parameters: Parameters<ƒ>) => ReturnType<ƒ>;
 
-type RealtimeHooks = {
-    usePull: <J extends Serializable>(token: AtomIO.StateToken<J>) => void;
-    usePullFamily: <J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>) => void;
-    usePullFamilyMember: <J extends Serializable>(family: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>, subKey: string) => void;
-    usePush: <J extends Serializable>(token: AtomIO.StateToken<J>) => void;
-    useServerAction: <ƒ extends AtomIO.ƒn>(token: AtomIO.TransactionToken<ƒ>) => (...parameters: Parameters<ƒ>) => ReturnType<ƒ>;
-};
-declare const realtimeHooks: RealtimeHooks;
-
-declare const myIdState__INTERNAL: AtomIO.AtomToken<string | null>;
-declare const myIdState: AtomIO.ReadonlySelectorToken<string | null>;
-
-export { RealtimeContext, RealtimeHooks, RealtimeProvider, myIdState, myIdState__INTERNAL, realtimeHooks, usePull, usePullFamily, usePullFamilyMember, usePush, useServerAction };
+export { RealtimeContext, RealtimeProvider, usePull, usePullFamilyMember, usePullMutable, usePullMutableFamilyMember, usePush, useServerAction };

package/realtime-react/dist/index.js

@@ -1,44 +1,99 @@
 'use strict';
 
-var J = require('atom.io/react');
-var n = require('react');
+var react = require('atom.io/react');
+var RTC = require('atom.io/realtime-client');
+var React6 = require('react');
 var socket_ioClient = require('socket.io-client');
-var p = require('atom.io');
 var jsxRuntime = require('react/jsx-runtime');
+var AtomIO = require('atom.io');
 
 function _interopNamespace(e) {
-	if (e && e.__esModule) return e;
-	var n = Object.create(null);
-	if (e) {
-		Object.keys(e).forEach(function (k) {
-			if (k !== 'default') {
-				var d = Object.getOwnPropertyDescriptor(e, k);
-				Object.defineProperty(n, k, d.get ? d : {
-					enumerable: true,
-					get: function () { return e[k]; }
-				});
-			}
-		});
-	}
-	n.default = e;
-	return Object.freeze(n);
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
 }
 
-var J__namespace = /*#__PURE__*/_interopNamespace(J);
-var n__namespace = /*#__PURE__*/_interopNamespace(n);
-var p__namespace = /*#__PURE__*/_interopNamespace(p);
+var RTC__namespace = /*#__PURE__*/_interopNamespace(RTC);
+var React6__namespace = /*#__PURE__*/_interopNamespace(React6);
+var AtomIO__namespace = /*#__PURE__*/_interopNamespace(AtomIO);
 
-var R=p__namespace.atom({key:"myId__INTERNAL",default:null}),h=p__namespace.selector({key:"myId",get:({get:e})=>e(R)});var m=n__namespace.createContext({socket:socket_ioClient.io()}),L=({children:e,socket:t})=>{let r=J__namespace.useI(R);return n__namespace.useEffect(()=>{t.on("connect",()=>{r(t.id);}),t.on("disconnect",()=>{r(null);});},[t,r]),jsxRuntime.jsx(m.Provider,{value:{socket:t},children:e})};function d(e){let{socket:t}=n__namespace.useContext(m),r=n__namespace.useContext(J.StoreContext);n__namespace.useEffect(()=>(t.on(`serve:${e.key}`,o=>{p__namespace.setState(e,o,r);}),t.emit(`sub:${e.key}`),()=>{t.off(`serve:${e.key}`),t.emit(`unsub:${e.key}`);}),[e.key]);}function b(e){let{socket:t}=n__namespace.useContext(m),r=n__namespace.useContext(J.StoreContext);n__namespace.useEffect(()=>(t.on(`serve:${e.key}`,(o,s)=>{p__namespace.setState(e(o),s,r);}),t==null||t.emit(`sub:${e.key}`),()=>{t==null||t.off(`serve:${e.key}`),t==null||t.emit(`unsub:${e.key}`);}),[e.key]);}function v(e,t){let r=e(t),{socket:o}=n__namespace.useContext(m),s=n__namespace.useContext(J.StoreContext);n__namespace.useEffect(()=>(o==null||o.on(`serve:${r.key}`,l=>{p__namespace.setState(e(t),l,s);}),o==null||o.emit(`sub:${e.key}`,t),()=>{o==null||o.off(`serve:${r.key}`),o==null||o.emit(`unsub:${r.key}`);}),[e.key]);}function P(e){let{socket:t}=n__namespace.useContext(m),r=n__namespace.useContext(J.StoreContext),o=n__namespace.useId();n__namespace.useEffect(()=>(t.emit(`claim:${e.key}`),p__namespace.subscribe(e,({newValue:s})=>{t.emit(`pub:${e.key}`,s);},`use-push:${o}`,r),()=>{t.emit(`unclaim:${e.key}`);}),[e.key]);}var x=new Map;function T(e){let t=n__namespace.useContext(J.StoreContext),{socket:r}=n__namespace.useContext(m);return n__namespace.useEffect(()=>{var l;let o=(l=x.get(e.key))!=null?l:0;x.set(e.key,o+1);let s=o===0?p__namespace.subscribeToTransaction(e,A=>r.emit(`tx:${e.key}`,A),"use-server-action",t):()=>null;return ()=>{var I;let A=(I=x.get(e.key))!=null?I:0;x.set(e.key,A-1),s();}},[e.key]),p__namespace.runTransaction(e,t)}var ue={usePull:d,usePullFamily:b,usePullFamilyMember:v,usePush:P,useServerAction:T};
+// src/realtime-context.tsx
+var RealtimeContext = React6__namespace.createContext({
+  socket: socket_ioClient.io()
+});
+var RealtimeProvider = ({ children, socket }) => {
+  const setMyId = react.useI(RTC__namespace.myIdState__INTERNAL);
+  React6__namespace.useEffect(() => {
+    socket.on(`connect`, () => {
+      setMyId(socket.id);
+    });
+    socket.on(`disconnect`, () => {
+      setMyId(null);
+    });
+  }, [socket, setMyId]);
+  return /* @__PURE__ */ jsxRuntime.jsx(RealtimeContext.Provider, { value: { socket }, children });
+};
+function usePull(token) {
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  const store = React6__namespace.useContext(react.StoreContext);
+  React6__namespace.useEffect(() => RTC__namespace.pullState(token, socket, store), [token.key]);
+}
+function usePullFamilyMember(token) {
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  const store = React6__namespace.useContext(react.StoreContext);
+  React6__namespace.useEffect(() => RTC__namespace.pullFamilyMember(token, socket, store), [token.key]);
+}
+function usePullMutable(token) {
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  const store = React6__namespace.useContext(react.StoreContext);
+  React6__namespace.useEffect(() => RTC__namespace.pullMutableState(token, socket, store), [token.key]);
+}
+function usePullMutableFamilyMember(token) {
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  const store = React6__namespace.useContext(react.StoreContext);
+  React6__namespace.useEffect(
+    () => RTC__namespace.pullMutableFamilyMember(token, socket, store),
+    [token.key]
+  );
+}
+function usePush(token) {
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  const store = React6__namespace.useContext(react.StoreContext);
+  const id = React6__namespace.useId();
+  React6__namespace.useEffect(
+    () => RTC__namespace.pushState(token, socket, `use-push:${id}`, store),
+    [token.key]
+  );
+}
+function useServerAction(token) {
+  const store = React6__namespace.useContext(react.StoreContext);
+  const { socket } = React6__namespace.useContext(RealtimeContext);
+  React6__namespace.useEffect(
+    () => RTC__namespace.synchronizeTransactionResults(token, socket, store),
+    [token.key]
+  );
+  return AtomIO__namespace.runTransaction(token, store);
+}
 
-exports.RealtimeContext = m;
-exports.RealtimeProvider = L;
-exports.myIdState = h;
-exports.myIdState__INTERNAL = R;
-exports.realtimeHooks = ue;
-exports.usePull = d;
-exports.usePullFamily = b;
-exports.usePullFamilyMember = v;
-exports.usePush = P;
-exports.useServerAction = T;
+exports.RealtimeContext = RealtimeContext;
+exports.RealtimeProvider = RealtimeProvider;
+exports.usePull = usePull;
+exports.usePullFamilyMember = usePullFamilyMember;
+exports.usePullMutable = usePullMutable;
+exports.usePullMutableFamilyMember = usePullMutableFamilyMember;
+exports.usePush = usePush;
+exports.useServerAction = useServerAction;
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map

package/realtime-react/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/realtime-context.tsx","../src/realtime-state.ts","../src/use-pull.ts","../src/use-pull-family.ts","../src/use-pull-family-member.ts","../src/use-push.ts","../src/use-server-action.ts","../src/realtime-hooks.ts"],"names":["AR","React","io","AtomIO","myIdState__INTERNAL","myIdState","get","jsx","RealtimeContext","RealtimeProvider","children","socket","setMyId","StoreContext","usePull","token","store","data","usePullFamily","family","key","usePullFamilyMember","subKey","usePush","id","newValue","TX_SUBS","useServerAction","_a","count","unsubscribe","update","newCount","realtimeHooks"],"mappings":"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","sourcesContent":["import * as AR from \"atom.io/react\"\nimport * as React from \"react\"\nimport type { Socket } from \"socket.io-client\"\nimport { io } from \"socket.io-client\"\n\nimport { myIdState__INTERNAL } from \"./realtime-state\"\n\nexport const RealtimeContext = React.createContext<{ socket: Socket }>({\n\tsocket: io(),\n})\n\nexport const RealtimeProvider: React.FC<{\n\tchildren: React.ReactNode\n\tsocket: Socket\n}> = ({ children, socket }) => {\n\tconst setMyId = AR.useI(myIdState__INTERNAL)\n\tReact.useEffect(() => {\n\t\tsocket.on(`connect`, () => {\n\t\t\tsetMyId(socket.id)\n\t\t})\n\t\tsocket.on(`disconnect`, () => {\n\t\t\tsetMyId(null)\n\t\t})\n\t}, [socket, setMyId])\n\treturn (\n\t\t<RealtimeContext.Provider value={{ socket }}>\n\t\t\t{children}\n\t\t</RealtimeContext.Provider>\n\t)\n}\n","import * as AtomIO from \"atom.io\"\n\nexport const myIdState__INTERNAL = AtomIO.atom<string | null>({\n\tkey: `myId__INTERNAL`,\n\tdefault: null,\n})\nexport const myIdState = AtomIO.selector<string | null>({\n\tkey: `myId`,\n\tget: ({ get }) => get(myIdState__INTERNAL),\n})\n","import * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePull<J extends Json.Serializable>(\n\ttoken: AtomIO.StateToken<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => {\n\t\tsocket.on(`serve:${token.key}`, (data: J) => {\n\t\t\tAtomIO.setState(token, data, store)\n\t\t})\n\t\tsocket.emit(`sub:${token.key}`)\n\t\treturn () => {\n\t\t\tsocket.off(`serve:${token.key}`)\n\t\t\tsocket.emit(`unsub:${token.key}`)\n\t\t}\n\t}, [token.key])\n}\n","import * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePullFamily<J extends Json.Serializable>(\n\tfamily: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => {\n\t\tsocket.on(`serve:${family.key}`, (key: Json.Serializable, data: J) => {\n\t\t\tAtomIO.setState(family(key), data, store)\n\t\t})\n\t\tsocket?.emit(`sub:${family.key}`)\n\t\treturn () => {\n\t\t\tsocket?.off(`serve:${family.key}`)\n\t\t\tsocket?.emit(`unsub:${family.key}`)\n\t\t}\n\t}, [family.key])\n}\n","import * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePullFamilyMember<J extends Json.Serializable>(\n\tfamily: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>,\n\tsubKey: AtomIO.Json.Serializable,\n): void {\n\tconst token = family(subKey)\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => {\n\t\tsocket?.on(`serve:${token.key}`, (data: J) => {\n\t\t\tAtomIO.setState(family(subKey), data, store)\n\t\t})\n\t\tsocket?.emit(`sub:${family.key}`, subKey)\n\t\treturn () => {\n\t\t\tsocket?.off(`serve:${token.key}`)\n\t\t\tsocket?.emit(`unsub:${token.key}`)\n\t\t}\n\t}, [family.key])\n}\n","import * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePush<J extends Json.Serializable>(\n\ttoken: AtomIO.StateToken<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\tReact.useEffect(() => {\n\t\tsocket.emit(`claim:${token.key}`)\n\t\tAtomIO.subscribe(\n\t\t\ttoken,\n\t\t\t({ newValue }) => {\n\t\t\t\tsocket.emit(`pub:${token.key}`, newValue)\n\t\t\t},\n\t\t\t`use-push:${id}`,\n\t\t\tstore,\n\t\t)\n\t\treturn () => {\n\t\t\tsocket.emit(`unclaim:${token.key}`)\n\t\t}\n\t}, [token.key])\n}\n","import * as AtomIO from \"atom.io\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nconst TX_SUBS = new Map<string, number>()\nexport function useServerAction<ƒ extends AtomIO.ƒn>(\n\ttoken: AtomIO.TransactionToken<ƒ>,\n): (...parameters: Parameters<ƒ>) => ReturnType<ƒ> {\n\tconst store = React.useContext(StoreContext)\n\tconst { socket } = React.useContext(RealtimeContext)\n\tReact.useEffect(() => {\n\t\tconst count = TX_SUBS.get(token.key) ?? 0\n\t\tTX_SUBS.set(token.key, count + 1)\n\t\tconst unsubscribe =\n\t\t\tcount === 0\n\t\t\t\t? AtomIO.subscribeToTransaction(\n\t\t\t\t\t\ttoken,\n\t\t\t\t\t\t(update) => socket.emit(`tx:${token.key}`, update),\n\t\t\t\t\t\t`use-server-action`,\n\t\t\t\t\t\tstore,\n\t\t\t\t  )\n\t\t\t\t: () => null\n\t\treturn () => {\n\t\t\tconst newCount = TX_SUBS.get(token.key) ?? 0\n\t\t\tTX_SUBS.set(token.key, newCount - 1)\n\t\t\tunsubscribe()\n\t\t}\n\t}, [token.key])\n\treturn AtomIO.runTransaction(token, store)\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\n\nimport { usePull } from \"./use-pull\"\nimport { usePullFamily } from \"./use-pull-family\"\nimport { usePullFamilyMember } from \"./use-pull-family-member\"\nimport { usePush } from \"./use-push\"\nimport { useServerAction } from \"./use-server-action\"\n\nexport type RealtimeHooks = {\n\tusePull: <J extends Json.Serializable>(token: AtomIO.StateToken<J>) => void\n\tusePullFamily: <J extends Json.Serializable>(\n\t\tfamily: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>,\n\t) => void\n\tusePullFamilyMember: <J extends Json.Serializable>(\n\t\tfamily: AtomIO.AtomFamily<J> | AtomIO.SelectorFamily<J>,\n\t\tsubKey: string,\n\t) => void\n\tusePush: <J extends Json.Serializable>(token: AtomIO.StateToken<J>) => void\n\tuseServerAction: <ƒ extends AtomIO.ƒn>(\n\t\ttoken: AtomIO.TransactionToken<ƒ>,\n\t) => (...parameters: Parameters<ƒ>) => ReturnType<ƒ>\n}\n\nexport const realtimeHooks: RealtimeHooks = {\n\tusePull,\n\tusePullFamily,\n\tusePullFamilyMember,\n\tusePush,\n\tuseServerAction,\n}\n\nexport * from \"./use-pull\"\nexport * from \"./use-pull-family\"\nexport * from \"./use-pull-family-member\"\nexport * from \"./use-push\"\nexport * from \"./use-server-action\"\n"]}
+{"version":3,"sources":["../src/realtime-context.tsx","../src/use-pull.ts","../src/use-pull-family-member.ts","../src/use-pull-mutable.ts","../src/use-pull-mutable-family-member.ts","../src/use-push.ts","../src/use-server-action.ts"],"names":["RTC","React","StoreContext"],"mappings":";AAAA,SAAS,YAAY;AACrB,YAAY,SAAS;AACrB,YAAY,WAAW;AAEvB,SAAS,UAAU;AAoBjB;AAlBK,IAAM,kBAAwB,oBAAkC;AAAA,EACtE,QAAQ,GAAG;AACZ,CAAC;AAEM,IAAM,mBAGR,CAAC,EAAE,UAAU,OAAO,MAAM;AAC9B,QAAM,UAAU,KAAS,uBAAmB;AAC5C,EAAM,gBAAU,MAAM;AACrB,WAAO,GAAG,WAAW,MAAM;AAC1B,cAAQ,OAAO,EAAE;AAAA,IAClB,CAAC;AACD,WAAO,GAAG,cAAc,MAAM;AAC7B,cAAQ,IAAI;AAAA,IACb,CAAC;AAAA,EACF,GAAG,CAAC,QAAQ,OAAO,CAAC;AACpB,SACC,oBAAC,gBAAgB,UAAhB,EAAyB,OAAO,EAAE,OAAO,GACxC,UACF;AAEF;;;AC1BA,SAAS,oBAAoB;AAC7B,YAAYA,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,QACf,OACO;AACP,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,QAAM,QAAc,kBAAW,YAAY;AAC3C,EAAM,iBAAU,MAAU,eAAU,OAAO,QAAQ,KAAK,GAAG,CAAC,MAAM,GAAG,CAAC;AACvE;;;ACZA,SAAS,gBAAAC,qBAAoB;AAC7B,YAAYF,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,oBACf,OACO;AACP,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,QAAM,QAAc,kBAAWC,aAAY;AAC3C,EAAM,iBAAU,MAAU,sBAAiB,OAAO,QAAQ,KAAK,GAAG,CAAC,MAAM,GAAG,CAAC;AAC9E;;;ACXA,SAAS,gBAAAA,qBAAoB;AAC7B,YAAYF,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,eAGd,OAA4C;AAC7C,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,QAAM,QAAc,kBAAWC,aAAY;AAC3C,EAAM,iBAAU,MAAU,sBAAiB,OAAO,QAAQ,KAAK,GAAG,CAAC,MAAM,GAAG,CAAC;AAC9E;;;ACbA,SAAS,gBAAAA,qBAAoB;AAC7B,YAAYF,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,2BAGd,OAA4C;AAC7C,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,QAAM,QAAc,kBAAWC,aAAY;AAC3C,EAAM;AAAA,IACL,MAAU,6BAAwB,OAAO,QAAQ,KAAK;AAAA,IACtD,CAAC,MAAM,GAAG;AAAA,EACX;AACD;;;ACjBA,SAAS,gBAAAA,qBAAoB;AAC7B,YAAYF,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,QACf,OACO;AACP,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,QAAM,QAAc,kBAAWC,aAAY;AAC3C,QAAM,KAAW,aAAM;AACvB,EAAM;AAAA,IACL,MAAU,eAAU,OAAO,QAAQ,YAAY,EAAE,IAAI,KAAK;AAAA,IAC1D,CAAC,MAAM,GAAG;AAAA,EACX;AACD;;;AClBA,YAAY,YAAY;AACxB,SAAS,gBAAAA,qBAAoB;AAC7B,YAAYF,UAAS;AACrB,YAAYC,YAAW;AAIhB,SAAS,gBACf,OACkD;AAClD,QAAM,QAAc,kBAAWC,aAAY;AAC3C,QAAM,EAAE,OAAO,IAAU,kBAAW,eAAe;AACnD,EAAM;AAAA,IACL,MAAU,mCAA8B,OAAO,QAAQ,KAAK;AAAA,IAC5D,CAAC,MAAM,GAAG;AAAA,EACX;AACA,SAAc,sBAAe,OAAO,KAAK;AAC1C","sourcesContent":["import { useI } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\nimport type { Socket } from \"socket.io-client\"\nimport { io } from \"socket.io-client\"\n\nexport const RealtimeContext = React.createContext<{ socket: Socket }>({\n\tsocket: io(),\n})\n\nexport const RealtimeProvider: React.FC<{\n\tchildren: React.ReactNode\n\tsocket: Socket\n}> = ({ children, socket }) => {\n\tconst setMyId = useI(RTC.myIdState__INTERNAL)\n\tReact.useEffect(() => {\n\t\tsocket.on(`connect`, () => {\n\t\t\tsetMyId(socket.id)\n\t\t})\n\t\tsocket.on(`disconnect`, () => {\n\t\t\tsetMyId(null)\n\t\t})\n\t}, [socket, setMyId])\n\treturn (\n\t\t<RealtimeContext.Provider value={{ socket }}>\n\t\t\t{children}\n\t\t</RealtimeContext.Provider>\n\t)\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePull<J extends Json.Serializable>(\n\ttoken: AtomIO.StateToken<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => RTC.pullState(token, socket, store), [token.key])\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePullFamilyMember<J extends Json.Serializable>(\n\ttoken: AtomIO.AtomToken<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => RTC.pullFamilyMember(token, socket, store), [token.key])\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Transceiver } from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePullMutable<\n\tT extends Transceiver<Json.Serializable>,\n\tJ extends Json.Serializable,\n>(token: AtomIO.MutableAtomToken<T, J>): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(() => RTC.pullMutableState(token, socket, store), [token.key])\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Transceiver } from \"atom.io/internal\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePullMutableFamilyMember<\n\tT extends Transceiver<Json.Serializable>,\n\tJ extends Json.Serializable,\n>(token: AtomIO.MutableAtomToken<T, J>): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tReact.useEffect(\n\t\t() => RTC.pullMutableFamilyMember(token, socket, store),\n\t\t[token.key],\n\t)\n}\n","import type * as AtomIO from \"atom.io\"\nimport type { Json } from \"atom.io/json\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function usePush<J extends Json.Serializable>(\n\ttoken: AtomIO.StateToken<J>,\n): void {\n\tconst { socket } = React.useContext(RealtimeContext)\n\tconst store = React.useContext(StoreContext)\n\tconst id = React.useId()\n\tReact.useEffect(\n\t\t() => RTC.pushState(token, socket, `use-push:${id}`, store),\n\t\t[token.key],\n\t)\n}\n","import * as AtomIO from \"atom.io\"\nimport { StoreContext } from \"atom.io/react\"\nimport * as RTC from \"atom.io/realtime-client\"\nimport * as React from \"react\"\n\nimport { RealtimeContext } from \"./realtime-context\"\n\nexport function useServerAction<ƒ extends AtomIO.ƒn>(\n\ttoken: AtomIO.TransactionToken<ƒ>,\n): (...parameters: Parameters<ƒ>) => ReturnType<ƒ> {\n\tconst store = React.useContext(StoreContext)\n\tconst { socket } = React.useContext(RealtimeContext)\n\tReact.useEffect(\n\t\t() => RTC.synchronizeTransactionResults(token, socket, store),\n\t\t[token.key],\n\t)\n\treturn AtomIO.runTransaction(token, store)\n}\n"]}