@gluonjs/core / packages/store/src / StoreProperties
Interface: StoreProperties<Id, State>
Extended by
Type Parameters
Id
Id extends string
State
State extends StateTree
Properties
$extensions
readonly$extensions:Readonly<Record<string,unknown>>
$id
readonly$id:Id
$state
readonly$state:State
Methods
$dispose()
$dispose():
void
Returns
void
$onAction()
$onAction(
callback): () =>void
Parameters
callback
Returns
() => void
$patch()
Call Signature
$patch(
patch,metadata?):void
Parameters
patch
Partial<State>
metadata?
Readonly<Record<string, unknown>>
Returns
void
Call Signature
$patch(
mutator,metadata?):void
Parameters
mutator
(state) => void
metadata?
Readonly<Record<string, unknown>>
Returns
void
$reset()
$reset(
metadata?):void
Parameters
metadata?
Readonly<Record<string, unknown>>
Returns
void
$subscribe()
$subscribe(
callback): () =>void
Parameters
callback
Returns
() => void
Example
Access a Store's ID, state, extensions, patch/reset operations, subscriptions, and disposal independently of its domain fields:
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();