applesauce-react 5.0.0 → 5.1.0

package/dist/helpers/build-link-renderer.d.ts

@@ -1,3 +1,5 @@
 import { Link } from "applesauce-content/nast";
+import { ComponentMap } from "./nast.js";
 export type LinkRenderer = (url: URL, node: Link) => JSX.Element | false | null;
-export declare function buildLinkRenderer(handlers: LinkRenderer[]): import("react").NamedExoticComponent<import("./nast.js").ExtraProps<Link>>;
+/** Creates a link renderer component that can be used in the {@link ComponentMap} */
+export declare function buildLinkRenderer(handlers: LinkRenderer[]): ComponentMap["link"];

package/dist/helpers/build-link-renderer.js

@@ -1,5 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
 import { memo, useMemo } from "react";
+/** Creates a link renderer component that can be used in the {@link ComponentMap} */
 export function buildLinkRenderer(handlers) {
     const LinkRenderer = ({ node }) => {
         const content = useMemo(() => {

package/dist/hooks/use-$.js

@@ -5,3 +5,57 @@ export function use$(observable, deps) {
     const resolved = useMemo(() => (typeof observable === "function" ? observable() : observable) ?? of(undefined), deps ?? [observable]);
     return useObservableState(resolved);
 }
+// export function use$<T>(input?: BehaviorSubject<T>): T;
+// export function use$<T>(input?: Observable<T> | undefined): T | undefined;
+// export function use$<T>(input: () => Observable<T> | undefined, deps: unknown[]): T | undefined;
+// export function use$<T>(
+//   input?: Observable<T> | BehaviorSubject<T> | (() => Observable<T> | undefined),
+//   deps?: unknown[],
+// ): T | undefined {
+//   const state$: Observable<T | undefined> = useMemo(
+//     () => (typeof input === "function" ? input() : input) ?? of(undefined),
+//     deps ?? [input],
+//   );
+//   const valueRef = useRef<T | undefined>(state$ instanceof BehaviorSubject ? state$.getValue() : undefined);
+//   const subRef = useRef<Subscription | null>(null);
+//   const callbackRef = useRef<(() => void) | null>(null);
+//   const subscribe = useCallback(
+//     (callback: () => void) => {
+//       // Store the callback
+//       callbackRef.current = callback;
+//       // Subscribe if not already subscribed
+//       if (!subRef.current) {
+//         subRef.current = state$.subscribe((v) => {
+//           valueRef.current = v;
+//           callbackRef.current?.();
+//         });
+//       }
+//       return () => {
+//         subRef.current?.unsubscribe();
+//         subRef.current = null;
+//         callbackRef.current = null;
+//       };
+//     },
+//     [state$],
+//   );
+//   const getSnapshot = useCallback(() => {
+//     let inSnapshot = true;
+//     // Server snapshot
+//     if (typeof window === "undefined") {
+//       // On server: use take(1) and don't store the ref
+//       state$.pipe(take(1)).subscribe((v) => {
+//         valueRef.current = v;
+//       });
+//     } else if (!subRef.current) {
+//       // Create subscription if needed to get the initial value
+//       subRef.current = state$.subscribe((v) => {
+//         valueRef.current = v;
+//         // Call the callback if it exists (set by subscribe)
+//         if (!inSnapshot) callbackRef.current?.();
+//       });
+//     }
+//     inSnapshot = false;
+//     return valueRef.current;
+//   }, [state$]);
+//   return useSyncExternalStore(subscribe, getSnapshot);
+// }

package/dist/hooks/use-account-manager.d.ts

@@ -1,4 +1,5 @@
 import { AccountManager } from "applesauce-accounts";
+/** Gets the {@link AccountManager} from the {@link AccountsProvider} */
 export declare function useAccountManager(): AccountManager;
 export declare function useAccountManager(require: false): AccountManager | undefined;
 export declare function useAccountManager(require: true): AccountManager;

package/dist/hooks/use-accounts.d.ts

@@ -1,2 +1,3 @@
 import { IAccount } from "applesauce-accounts";
+/** Gets the list of accounts from the {@link AccountManager} */
 export declare function useAccounts(): IAccount[];

package/dist/hooks/use-accounts.js

@@ -1,5 +1,6 @@
 import { useObservableEagerState } from "observable-hooks";
 import { useAccountManager } from "./use-account-manager.js";
+/** Gets the list of accounts from the {@link AccountManager} */
 export function useAccounts() {
     const manager = useAccountManager();
     return useObservableEagerState(manager.accounts$);

package/dist/hooks/use-action-runner.d.ts

@@ -1 +1,2 @@
+/** Gets the {@link ActionRunner} from the {@link ActionsProvider} */
 export declare function useActionRunner(): import("applesauce-actions").ActionRunner;

package/dist/hooks/use-action-runner.js

@@ -1,5 +1,6 @@
 import { useContext } from "react";
 import { ActionsContext } from "../providers/actions-provider.js";
+/** Gets the {@link ActionRunner} from the {@link ActionsProvider} */
 export function useActionRunner() {
     const hub = useContext(ActionsContext);
     if (!hub)

package/dist/hooks/use-action.d.ts

@@ -1,6 +1,11 @@
 import { ActionBuilder } from "applesauce-actions";
-export declare function useAction<Args extends Array<any>>(Action: ActionBuilder<Args>, args: Args | undefined): {
+import { NostrEvent } from "applesauce-core/helpers/event";
+import { Observable } from "rxjs";
+export type UseActionResult<Args extends Array<any>> = {
     loading: boolean;
-    run: () => Promise<void>;
-    exec: () => import("rxjs").Observable<import("nostr-tools").NostrEvent> | undefined;
+    run: (...args: Args) => Promise<void>;
+    exec: (...args: Args) => Observable<NostrEvent>;
 };
+/** A hook to run an action inside the {@link ActionsProvider} */
+export declare function useAction<Args extends Array<any>>(Action: ActionBuilder<Args>): UseActionResult<Args>;
+export declare function useAction<Args extends Array<any>>(Action: ActionBuilder<Args>, args: Args | undefined): UseActionResult<Args>;

package/dist/hooks/use-action.js

@@ -3,15 +3,13 @@ import { finalize } from "rxjs";
 import { useActionRunner } from "./use-action-runner.js";
 export function useAction(Action, args) {
     const [loading, setLoading] = useState(false);
-    const ref = useRef(args);
-    ref.current = args;
+    const staticArgs = useRef(args);
+    staticArgs.current = args;
     const hub = useActionRunner();
-    const run = useCallback(async () => {
-        if (args === undefined)
-            return;
+    const run = useCallback(async (...args) => {
         setLoading(true);
         try {
-            await hub.run(Action, ...args);
+            await hub.run(Action, ...(staticArgs.current ?? args));
             setLoading(false);
         }
         catch (error) {
@@ -19,12 +17,10 @@ export function useAction(Action, args) {
             throw error;
         }
     }, [Action]);
-    const exec = useCallback(() => {
-        if (args === undefined)
-            return;
+    const exec = useCallback((...args) => {
         setLoading(true);
         try {
-            return hub.exec(Action, ...args).pipe(finalize(() => {
+            return hub.exec(Action, ...(staticArgs.current ?? args)).pipe(finalize(() => {
                 setLoading(false);
             }));
         }

package/dist/hooks/use-active-account.d.ts

@@ -1,2 +1,3 @@
 import { IAccount } from "applesauce-accounts";
+/** Gets the currently active account from the {@link AccountsProvider} */
 export declare function useActiveAccount(): IAccount | undefined;

package/dist/hooks/use-active-account.js

@@ -1,5 +1,6 @@
 import { useObservableEagerState } from "observable-hooks";
 import { useAccountManager } from "./use-account-manager.js";
+/** Gets the currently active account from the {@link AccountsProvider} */
 export function useActiveAccount() {
     const manager = useAccountManager();
     return useObservableEagerState(manager.active$);

package/dist/hooks/use-event-factory.d.ts

@@ -1,4 +1,5 @@
 import { EventFactory } from "applesauce-core";
+/** Gets the {@link EventFactory} from the {@link EventFactoryProvider} */
 export declare function useEventFactory(require: false): EventFactory | undefined;
 export declare function useEventFactory(require: true): EventFactory;
 export declare function useEventFactory(): EventFactory;

package/dist/hooks/use-event-model.d.ts

@@ -1,3 +1,3 @@
 import { ModelConstructor } from "applesauce-core";
-/** Runs and subscribes to a model on the event store */
+/** Runs and subscribes to a model on the {@link EventStore} */
 export declare function useEventModel<T extends unknown, Args extends Array<any>>(factory: ModelConstructor<T, Args>, args?: Args | null): T | undefined;

package/dist/hooks/use-event-model.js

@@ -3,7 +3,7 @@ import hash_sum from "hash-sum";
 import { of } from "rxjs";
 import { useEventStore } from "./use-event-store.js";
 import { useObservableEagerMemo } from "./use-observable-memo.js";
-/** Runs and subscribes to a model on the event store */
+/** Runs and subscribes to a model on the {@link EventStore} */
 export function useEventModel(factory, args) {
     const store = useEventStore();
     return useObservableEagerMemo(() => {

package/dist/hooks/use-event-store.d.ts

@@ -1,6 +1,3 @@
 import { IEventStore } from "applesauce-core/event-store";
-/**
- * Gets the EventStore from a parent {@link EventStoreProvider} component
- * If there is none it throws an error
- */
+/** Gets the {@link EventStore} from the {@link EventStoreProvider} */
 export declare function useEventStore(): IEventStore;

package/dist/hooks/use-event-store.js

@@ -1,9 +1,6 @@
 import { useContext } from "react";
 import { EventStoreContext } from "../providers/store-provider.js";
-/**
- * Gets the EventStore from a parent {@link EventStoreProvider} component
- * If there is none it throws an error
- */
+/** Gets the {@link EventStore} from the {@link EventStoreProvider} */
 export function useEventStore() {
     const store = useContext(EventStoreContext);
     if (!store)

package/dist/hooks/use-render-nast.d.ts

@@ -1,5 +1,5 @@
 import { Root } from "applesauce-content/nast";
 import { ComponentMap } from "../helpers/nast.js";
 export { ComponentMap };
-/** A hook to get the rendered output of a nostr syntax tree */
+/** A hook to get the rendered output of a {@link Root} nostr syntax tree */
 export declare function useRenderNast(root: Root | undefined, components: ComponentMap): JSX.Element | null;

package/dist/hooks/use-render-nast.js

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
 import { renderNast } from "../helpers/nast.js";
-/** A hook to get the rendered output of a nostr syntax tree */
+/** A hook to get the rendered output of a {@link Root} nostr syntax tree */
 export function useRenderNast(root, components) {
     return useMemo(() => (root ? renderNast(root, components) : null), [root, Object.keys(components).join("|")]);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "applesauce-react",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "description": "React hooks for applesauce",
   "type": "module",
   "main": "dist/index.js",
@@ -47,19 +47,28 @@
       "types": "./dist/helpers/index.d.ts"
     }
   },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
   "dependencies": {
-    "applesauce-accounts": "^5.0.0",
-    "applesauce-actions": "^5.0.0",
-    "applesauce-content": "^5.0.0",
-    "applesauce-core": "^5.0.0",
     "hash-sum": "^2.0.0",
     "observable-hooks": "^4.2.4",
-    "react": "^18.3.1",
     "rxjs": "^7.8.1"
   },
+  "optionalDependencies": {
+    "applesauce-accounts": "^5.1.0",
+    "applesauce-actions": "^5.0.0",
+    "applesauce-content": "^5.0.0",
+    "applesauce-core": "^5.1.0"
+  },
   "devDependencies": {
     "@types/hash-sum": "^1.0.2",
-    "@types/react": "^18.3.18",
+    "@types/react": "^18.0.0 || ^19.0.0",
+    "applesauce-accounts": "^5.1.0",
+    "applesauce-actions": "^5.0.0",
+    "applesauce-content": "^5.0.0",
+    "applesauce-core": "^5.1.0",
+    "react": "^18.0.0 || ^19.0.0",
     "rimraf": "^6.0.1",
     "typescript": "^5.8.3",
     "vitest": "^4.0.15"