useReusableBlocks
This hook provides access to the reusable blocks store, a persisted Zustand store that manages reusable block templates. Reusable blocks are block configurations that can be shared across multiple pages.
Import
import { useReusableBlocks } from '@appmaker-xyz/core';
Basic Usage
// Read reusable blocks
const reusableBlocks = useReusableBlocks((state) => state.reusableBlocks);
// Get a specific reusable block
const headerBlock = reusableBlocks['header-block'];
// Add a reusable block
const addReusableBlock = useReusableBlocks((state) => state.addReusableBlock);
addReusableBlock('my-block', blockConfig);
// Set all reusable blocks
const setReusableBlocks = useReusableBlocks((state) => state.setReusableBlocks);
setReusableBlocks(allBlocks);
Parameters
| Parameter | Type | Description |
|---|---|---|
selector | Function | A selector function that receives the store state and returns the slice you need. |
Available State
| Property | Type | Description |
|---|---|---|
reusableBlocks | Object | Map of reusable block names to their block configurations. |
initialLoading | boolean | Whether the persisted store is still loading from storage. |
Available Actions
| Action | Type | Description |
|---|---|---|
setReusableBlocks | Function | Replaces all reusable blocks. Signature: setReusableBlocks(blocksMap). |
addReusableBlock | Function | Adds or overwrites a reusable block. Signature: addReusableBlock(name, block). |
addDefaultReusableBlock | Function | Adds a block only if it doesn't already exist. Signature: addDefaultReusableBlock(name, block). |