@gluonjs/store


@gluonjs/store / packages/store/src / StorePluginStore

Interface: StorePluginStore

Extends

Indexable

[key: string]: unknown

Properties

$extensions

readonly $extensions: Readonly<Record<string, unknown>>

Inherited from

StoreProperties.$extensions


$id

readonly $id: string

Inherited from

StoreProperties.$id


$state

readonly $state: State

Inherited from

StoreProperties.$state

Methods

$dispose()

$dispose(): void

Returns

void

Inherited from

StoreProperties.$dispose


$onAction()

$onAction(callback): () => void

Parameters

callback

StoreActionSubscription

Returns

() => void

Inherited from

StoreProperties.$onAction


$patch()

Call Signature

$patch(patch, metadata?): void

Parameters
patch

Partial<State>

metadata?

Readonly<Record<string, unknown>>

Returns

void

Inherited from

StoreProperties.$patch

Call Signature

$patch(mutator, metadata?): void

Parameters
mutator

(state) => void

metadata?

Readonly<Record<string, unknown>>

Returns

void

Inherited from

StoreProperties.$patch


$reset()

$reset(metadata?): void

Parameters

metadata?

Readonly<Record<string, unknown>>

Returns

void

Inherited from

StoreProperties.$reset


$subscribe()

$subscribe(callback): () => void

Parameters

callback

StoreSubscription

Returns

() => void

Inherited from

StoreProperties.$subscribe

Example

Use the runtime Store surface exposed to plugins without depending on one application's concrete state type:

ts
import {
  StoreManager,
  createStoreManager,
  createTestingStoreManager,
  defineStore,
  type JsonPrimitive,
  type JsonValue,
  type StateTree,
  type Store,
  type StoreActionContext,
  type StoreActionSubscription,
  type StoreActionTree,
  type StoreGetterTree,
  type StoreGetterValues,
  type StoreManagerOptions,
  type StorePlugin,
  type StorePluginDefinition,
  type StorePluginResult,
  type StorePluginStore,
  type StoreProperties,
  type StoreSnapshot,
  type StoreSubscription,
  type StoreTransaction,
  type StoreTransactionMetadata,
  type StoreTransactionStatus,
  type StoreTransactionType,
  type TestingStoreManagerOptions,
} from '@gluonjs/store';

type CartState = { items: string[]; open: boolean };
type CartGetters = { count: number };
type CartActions = { add(item: string): number };
const stateTree: StateTree = { items: [], open: false };
const getterTree: StoreGetterTree<CartState> = { count: 0 };
const getterValues: StoreGetterValues<CartGetters> = { count: 0 };
const actionTree: StoreActionTree = { add: (_item: string) => 1 };
const transactionType: StoreTransactionType = 'action';
const transactionStatus: StoreTransactionStatus = 'fulfilled';
const metadata: StoreTransactionMetadata = { source: 'product-page' };
const primitive: JsonPrimitive = 'lamp';
const json: JsonValue = { items: [primitive] };
const records: StoreTransaction[] = [];
const subscription: StoreSubscription = (transaction) => records.push(transaction);
const options = { onTransaction: subscription } satisfies StoreManagerOptions;
const manager: StoreManager = createStoreManager(options);

const definition = defineStore({
  id: 'cart',
  state: (): CartState => ({ items: [], open: false }),
  getters: (state): CartGetters => ({ count: state.items.length }),
  actions: (store): CartActions => ({ add(item) { store.items.push(item); return store.items.length; } }),
});
const cart: Store<'cart', CartState, CartGetters, CartActions> = definition.use(manager);
const properties: StoreProperties<'cart', CartState> = cart;
const actionSubscription: StoreActionSubscription = (context: StoreActionContext) =>
  context.after((result) => console.log('action result', result));
const stopAction = cart.$onAction(actionSubscription);
manager.withMetadata(metadata, () => cart.add('lamp'));
const snapshot: StoreSnapshot = manager.dehydrate();

const plugin: StorePlugin = ({ definition: pluginDefinition, store }) => {
  const typedDefinition: StorePluginDefinition = pluginDefinition;
  const typedStore: StorePluginStore = store;
  const result: StorePluginResult = { inspectionId: `${typedDefinition.id}:${typedStore.$id}` };
  return result;
};
manager.addPlugin(plugin);
const testingOptions = { initialState: snapshot, plugins: [plugin] } satisfies TestingStoreManagerOptions;
const testing = createTestingStoreManager(testingOptions);
console.log(stateTree, getterTree, getterValues, actionTree, transactionType, transactionStatus, json, properties.$state, testing.use(definition).items);
stopAction();
testing.dispose();
manager.dispose();