vapor-chamber API reference - v1.3.0
    Preparing search index...

    Function useSharedCommandState

    • useSharedCommandState — one set of reactive signals shared across every caller, instead of two signals (loading, lastError) per call.

      Designed for component-heavy pages where many components need to react to "is anything in flight?" or "what was the last error?". Replaces N × useCommand() allocations with a single shared state per bus.

      Memory math: 50 components × 2 signals each = 100 signal nodes today. With shared state: ~5 signal nodes total + a counter, regardless of subscriber count.

      Parameters

      Returns {
          dispatch: (
              action: string,
              target: any,
              payload?: any,
              opts?: { signal?: AbortSignal },
          ) => CommandResult | Promise<CommandResult>;
          inFlight: Signal<number>;
          isAnyLoading: Signal<boolean>;
          lastError: Signal<Error | null>;
          errors: Signal<Error[]>;
          errorCount: Signal<number>;
          clear: () => void;
          dispose: () => void;
      }

      • dispatch: (
            action: string,
            target: any,
            payload?: any,
            opts?: { signal?: AbortSignal },
        ) => CommandResult | Promise<CommandResult>
      • inFlight: Signal<number>

        Number of dispatches currently in flight across all subscribers.

      • isAnyLoading: Signal<boolean>

        True when inFlight > 0. Bind to button disabled etc.

      • lastError: Signal<Error | null>

        Most recent error (across all subscribers).

      • errors: Signal<Error[]>

        Ring buffer of recent errors, newest last, capped at errorCap.

      • errorCount: Signal<number>

        Current size of the errors buffer.

      • clear: () => void

        Wipe accumulated errors.

      • dispose: () => void

        Manually unhook. Most callers don't need this — tryAutoCleanup hooks Vue's scope/unmount lifecycle.

      // Components using this share isAnyLoading, errors, etc.
      const { dispatch, isAnyLoading, lastError } = useSharedCommandState();
      await dispatch('cartAdd', product);
      // Disable an entire toolbar while any command is in flight.
      const { isAnyLoading } = useSharedCommandState();
      <Button :disabled="isAnyLoading.value">Save</Button>

      Auto-cleanup on Vue scope/component disposal via tryAutoCleanup.