@xyo-network/react-chain 1.15.1 → 1.15.3

package/README.md

@@ -79,6 +79,8 @@ XYO Layer One React SDK
 - [ContractDetails](#interfaces/ContractDetails)
 - [Erc20ContractConstants](#interfaces/Erc20ContractConstants)
 - [TransactionResponse](#interfaces/TransactionResponse)
+- [TransferRenderBoxDetailsProps](#interfaces/TransferRenderBoxDetailsProps)
+- [TransferRenderCardProps](#interfaces/TransferRenderCardProps)
 
 ## Type Aliases
 
@@ -171,11 +173,18 @@ XYO Layer One React SDK
 - [useViewerInPage](#variables/useViewerInPage)
 - [useViewerInWallet](#variables/useViewerInWallet)
 - [usePollNetworkStatus](#variables/usePollNetworkStatus)
+- [listenForClientInjection](#variables/listenForClientInjection)
 - [useAddressBalance](#variables/useAddressBalance)
+- [useClient](#variables/useClient)
+- [useConnectAccount](#variables/useConnectAccount)
 - [useCurrentBlock](#variables/useCurrentBlock)
+- [useGateway](#variables/useGateway)
 - [useHttpRpcRunner](#variables/useHttpRpcRunner)
 - [useNetwork](#variables/useNetwork)
 - [useSigner](#variables/useSigner)
+- [useCheckLocalRpc](#variables/useCheckLocalRpc)
+- [useCheckSequenceRpc](#variables/useCheckSequenceRpc)
+- [useCheckRpc](#variables/useCheckRpc)
 - [useHttpRpcViewer](#variables/useHttpRpcViewer)
 - [useViewerFromWallet](#variables/useViewerFromWallet)
 - [ActiveMenuItem](#variables/ActiveMenuItem)
@@ -220,6 +229,9 @@ XYO Layer One React SDK
 - [ERC20\_SEPOLIA\_CONTRACT\_CONSTANTS](#variables/ERC20_SEPOLIA_CONTRACT_CONSTANTS)
 - [ERC20\_MAINNET\_CONTRACT\_CONSTANTS](#variables/ERC20_MAINNET_CONTRACT_CONSTANTS)
 - [a11yProps](#variables/a11yProps)
+- [TransferRenderPlugin](#variables/TransferRenderPlugin)
+- [TransferRenderBoxDetails](#variables/TransferRenderBoxDetails)
+- [TransferRenderCard](#variables/TransferRenderCard)
 
 ## Functions
 
@@ -227,6 +239,7 @@ XYO Layer One React SDK
 - [renderIcon](#functions/renderIcon)
 - [createIcon](#functions/createIcon)
 - [getXyoProvider](#functions/getXyoProvider)
+- [getXyoClient](#functions/getXyoClient)
 
 ### classes
 
@@ -255,12 +268,12 @@ new ChainIteratorStore(): ChainIteratorStore;
 ### Get Signature
 
 ```ts
-get chainIterator(): EventingChainBlockNumberIterator;
+get chainIterator(): EventingChainBlockNumberIteratorService;
 ```
 
 #### Returns
 
-`EventingChainBlockNumberIterator`
+`EventingChainBlockNumberIteratorService`
 
 ***
 
@@ -384,6 +397,20 @@ function createIcon(opts): HTMLCanvasElement;
 
 `HTMLCanvasElement`
 
+  ### <a id="getXyoClient"></a>getXyoClient
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+function getXyoClient(): Promise<undefined | XyoClient>;
+```
+
+## Returns
+
+`Promise`\<`undefined` \| `XyoClient`\>
+
   ### <a id="getXyoProvider"></a>getXyoProvider
 
 [**@xyo-network/react-chain**](#../README)
@@ -391,7 +418,7 @@ function createIcon(opts): HTMLCanvasElement;
 ***
 
 ```ts
-function getXyoProvider(options): XyoConnectionProvider;
+function getXyoProvider(options): XyoConnection;
 ```
 
 ## Parameters
@@ -404,7 +431,7 @@ function getXyoProvider(options): XyoConnectionProvider;
 
 ## Returns
 
-`XyoConnectionProvider`
+`XyoConnection`
 
   ### <a id="renderIcon"></a>renderIcon
 
@@ -667,7 +694,7 @@ BlockTableCellProps.linked
 ### block
 
 ```ts
-block: Lowercase<string>;
+block: Brand;
 ```
 
 ***
@@ -821,7 +848,7 @@ optional evmBlockRewardService: EvmBlockRewardService;
 ### block
 
 ```ts
-block: Lowercase<string>;
+block: Brand;
 ```
 
 ***
@@ -936,9 +963,7 @@ optional bgcolor: string;
 
 ### Inherited from
 
-```ts
-Partial.bgcolor
-```
+[`BlockiesOptions`](#BlockiesOptions).[`bgcolor`](BlockiesOptions.md#bgcolor)
 
 ***
 
@@ -950,9 +975,7 @@ optional color: string;
 
 ### Inherited from
 
-```ts
-Partial.color
-```
+[`BlockiesOptions`](#BlockiesOptions).[`color`](BlockiesOptions.md#color)
 
 ***
 
@@ -964,9 +987,7 @@ optional scale: number;
 
 ### Inherited from
 
-```ts
-Partial.scale
-```
+[`BlockiesOptions`](#BlockiesOptions).[`scale`](BlockiesOptions.md#scale)
 
 ***
 
@@ -978,9 +999,7 @@ optional seed: string;
 
 ### Inherited from
 
-```ts
-Partial.seed
-```
+[`BlockiesOptions`](#BlockiesOptions).[`seed`](BlockiesOptions.md#seed)
 
 ***
 
@@ -992,9 +1011,7 @@ optional size: number;
 
 ### Inherited from
 
-```ts
-Partial.size
-```
+[`BlockiesOptions`](#BlockiesOptions).[`size`](BlockiesOptions.md#size)
 
 ***
 
@@ -1006,9 +1023,7 @@ optional spotcolor: string;
 
 ### Inherited from
 
-```ts
-Partial.spotcolor
-```
+[`BlockiesOptions`](#BlockiesOptions).[`spotcolor`](BlockiesOptions.md#spotcolor)
 
   ### <a id="BlockiesAvatarAddressProps"></a>BlockiesAvatarAddressProps
 
@@ -1074,6 +1089,8 @@ optional blockiesOptions: Partial<BlockiesOptions>;
 
 ***
 
+inspired by https://github.com/download13/blockies/blob/master/src/blockies.mjs
+
 ## Properties
 
 ### bgcolor
@@ -1151,7 +1168,7 @@ optional chainArchivist: ArchivistInstance<ArchivistParams<AnyConfigSchema<Archi
 ### chainIterator?
 
 ```ts
-optional chainIterator: ChainBlockNumberIterator;
+optional chainIterator: ChainBlockNumberIteratorService;
 ```
 
 ***
@@ -1293,7 +1310,7 @@ optional onNetworkChange: (url) => void;
 ### address?
 
 ```ts
-optional address: string;
+optional address: EthAddress;
 ```
 
 ***
@@ -5497,7 +5514,7 @@ optional activeStake: bigint;
 ### chainId?
 
 ```ts
-optional chainId: string;
+optional chainId: Chain;
 ```
 
 ***
@@ -5551,7 +5568,7 @@ optional withdrawnStake: bigint;
 ### firstBlockHash
 
 ```ts
-firstBlockHash: Lowercase<string>;
+firstBlockHash: Brand;
 ```
 
 ***
@@ -5559,7 +5576,7 @@ firstBlockHash: Lowercase<string>;
 ### forkFromChainId
 
 ```ts
-forkFromChainId: Lowercase<string>;
+forkFromChainId: EthAddress;
 ```
 
 ***
@@ -5567,7 +5584,7 @@ forkFromChainId: Lowercase<string>;
 ### forkFromLastBlockNumber
 
 ```ts
-forkFromLastBlockNumber: Lowercase<string>;
+forkFromLastBlockNumber: number;
 ```
 
 ***
@@ -5575,7 +5592,7 @@ forkFromLastBlockNumber: Lowercase<string>;
 ### forkFromLastHash
 
 ```ts
-forkFromLastHash: Lowercase<string>;
+forkFromLastHash: Brand;
 ```
 
 ***
@@ -5583,7 +5600,7 @@ forkFromLastHash: Lowercase<string>;
 ### genesisBlockRewardAddress
 
 ```ts
-genesisBlockRewardAddress: Lowercase<string>;
+genesisBlockRewardAddress: Brand;
 ```
 
 ***
@@ -5591,7 +5608,7 @@ genesisBlockRewardAddress: Lowercase<string>;
 ### genesisBlockRewardAmount
 
 ```ts
-genesisBlockRewardAmount: Lowercase<string>;
+genesisBlockRewardAmount: Brand;
 ```
 
 ***
@@ -5607,7 +5624,7 @@ initialProducerKey: string;
 ### minWithdrawalBlocks
 
 ```ts
-minWithdrawalBlocks: Lowercase<string>;
+minWithdrawalBlocks: Brand;
 ```
 
 ***
@@ -5615,7 +5632,7 @@ minWithdrawalBlocks: Lowercase<string>;
 ### rewardsContractAddress
 
 ```ts
-rewardsContractAddress: Lowercase<string>;
+rewardsContractAddress: Brand;
 ```
 
 ***
@@ -5623,7 +5640,7 @@ rewardsContractAddress: Lowercase<string>;
 ### stakingTokenAddress
 
 ```ts
-stakingTokenAddress: Lowercase<string>;
+stakingTokenAddress: Brand;
 ```
 
   ### <a id="DeployStakeContractProps"></a>DeployStakeContractProps
@@ -7707,7 +7724,7 @@ optional signer: Signer;
 ### contractAddress?
 
 ```ts
-optional contractAddress: Lowercase<string>;
+optional contractAddress: EthAddress;
 ```
 
 ***
@@ -9811,7 +9828,15 @@ optional tooltipTitle: string;
 ### address
 
 ```ts
-address: Lowercase<string>;
+address: Brand;
+```
+
+***
+
+### chainId
+
+```ts
+chainId: Brand;
 ```
 
 ***
@@ -16357,7 +16382,7 @@ $timestamp: number;
 ### contractAddress
 
 ```ts
-contractAddress: Lowercase<string>;
+contractAddress: EthAddress;
 ```
 
 ***
@@ -16421,7 +16446,9 @@ optional showDivider: boolean;
 ### transactions?
 
 ```ts
-optional transactions: Lowercase<string>[];
+optional transactions: Brand<Brand<Lowercase<string>, {
+}>, {
+}>[];
 ```
 
   ### <a id="TransactionResponse"></a>TransactionResponse
@@ -16520,268 +16547,2400 @@ optional onBuild: (payload) => void;
 
 [`PayloadBuilderComponentProps`](#PayloadBuilderComponentProps).[`onBuild`](PayloadBuilderComponentProps.md#onbuild)
 
-  ### <a id="XyoGlobal"></a>XyoGlobal
+  ### <a id="TransferRenderBoxDetailsProps"></a>TransferRenderBoxDetailsProps
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
-## Properties
-
-### \_debug()
-
-```ts
-_debug: () => void;
-```
-
-### Returns
-
-`void`
-
-***
-
-### connections
-
-```ts
-connections: object;
-```
-
-### Index Signature
-
-```ts
-[chainId: string]: ChainConnection
-```
-
-***
-
-### errors
-
-```ts
-errors: Error[];
-```
-
-***
-
-### gateway?
-
-```ts
-optional gateway: XyoGatewayProvider;
-```
-
-***
-
-### provider?
+## Extends
 
-```ts
-optional provider: XyoConnectionProvider;
-```
+- `PayloadDetailsRenderProps`.`FlexBoxProps`
 
-***
+## Properties
 
-### walletExtensionId()
+### height?
 
 ```ts
-walletExtensionId: () => string;
+optional height: 
+  | ResponsiveStyleValue<Height<string | number> | readonly NonNullable<Height<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Height<string | number> | readonly NonNullable<Height<string | number> | undefined>[] | undefined>;
 ```
 
-### Returns
-
-`string`
-
-### type-aliases
-
-  ### <a id="BlockHeaderEventNouns"></a>BlockHeaderEventNouns
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### Inherited from
 
 ```ts
-type BlockHeaderEventNouns = 
-  | "transaction-count"
-  | "block-hash"
-  | "block-number"
-  | "block-producer"
-  | "block-verification"
-  | "payload-counts";
+FlexBoxProps.height
 ```
 
-  ### <a id="ChainIteratorStoreValues"></a>ChainIteratorStoreValues
-
-[**@xyo-network/react-chain**](#../README)
-
 ***
 
-```ts
-type ChainIteratorStoreValues = object;
-```
-
-## Properties
-
-### chainIterator
+### width?
 
 ```ts
-chainIterator: ChainBlockNumberIterationService;
+optional width: 
+  | ResponsiveStyleValue<Width<string | number> | readonly NonNullable<Width<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Width<string | number> | readonly NonNullable<Width<string | number> | undefined>[] | undefined>;
 ```
 
-***
-
-### error?
+### Inherited from
 
 ```ts
-optional error: Error;
+FlexBoxProps.width
 ```
 
 ***
 
-### head
+### p?
 
 ```ts
-head: HydratedBlock;
+optional p: 
+  | ResponsiveStyleValue<Padding<string | number> | readonly NonNullable<Padding<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Padding<string | number> | readonly NonNullable<Padding<string | number> | undefined>[] | undefined>;
 ```
 
-  ### <a id="ChainNetworkState"></a>ChainNetworkState
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### Inherited from
 
 ```ts
-type ChainNetworkState = ContextExState<{
-  activeNetwork?: NetworkBootstrap;
-  chainNetworkError?: Error;
-  networks?: NetworkBootstrap[];
-  updateActiveNetwork?: (networkId) => void;
-}>;
+FlexBoxProps.p
 ```
 
-  ### <a id="Listener"></a>Listener
-
-[**@xyo-network/react-chain**](#../README)
-
 ***
 
-```ts
-type Listener = (...args) => void;
-```
-
-## Parameters
-
-### args
-
-...`unknown`[]
-
-## Returns
-
-`void`
-
-  ### <a id="PollingState"></a>PollingState
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### color?
 
 ```ts
-type PollingState = "paused" | "running";
+optional color: 
+  | ResponsiveStyleValue<readonly string[] | Color | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | Color | undefined>;
 ```
 
-  ### <a id="SmartContractDeploy"></a>SmartContractDeploy
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### Inherited from
 
 ```ts
-type SmartContractDeploy = Payload<SmartContractDeployFields, SmartContractDeploySchema>;
+FlexBoxProps.color
 ```
 
-  ### <a id="SmartContractDeploySchema"></a>SmartContractDeploySchema
-
-[**@xyo-network/react-chain**](#../README)
-
 ***
 
-```ts
-type SmartContractDeploySchema = typeof SmartContractDeploySchema;
-```
-
-### variables
-
-  ### <a id="ActiveMenuItem"></a>ActiveMenuItem
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### left?
 
 ```ts
-const ActiveMenuItem: React.FC<MenuItemProps & object>;
+optional left: 
+  | ResponsiveStyleValue<Left<string | number> | readonly NonNullable<Left<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Left<string | number> | readonly NonNullable<Left<string | number> | undefined>[] | undefined>;
 ```
 
-  ### <a id="ActiveNetworkAvatar"></a>ActiveNetworkAvatar
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### Inherited from
 
 ```ts
-const ActiveNetworkAvatar: React.FC<AvatarProps>;
+FlexBoxProps.left
 ```
 
-  ### <a id="BlockChainPagination"></a>BlockChainPagination
-
-[**@xyo-network/react-chain**](#../README)
-
 ***
 
-```ts
-const BlockChainPagination: React.FC<BlockChainPaginationProps>;
-```
-
-  ### <a id="BlockChainTableRow"></a>BlockChainTableRow
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### right?
 
 ```ts
-const BlockChainTableRow: React.FC<BlockChainTableRowProps>;
+optional right: 
+  | ResponsiveStyleValue<Right<string | number> | readonly NonNullable<Right<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Right<string | number> | readonly NonNullable<Right<string | number> | undefined>[] | undefined>;
 ```
 
-  ### <a id="BlockEpochTableCell"></a>BlockEpochTableCell
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### Inherited from
 
 ```ts
-const BlockEpochTableCell: React.FC<BlockEpochTableCellProps>;
+FlexBoxProps.right
 ```
 
-  ### <a id="BlockHashTableCell"></a>BlockHashTableCell
-
-[**@xyo-network/react-chain**](#../README)
-
 ***
 
-```ts
-const BlockHashTableCell: React.FC<BlockHashTableCellProps>;
-```
-
-  ### <a id="BlockHeadingFlexbox"></a>BlockHeadingFlexbox
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+### border?
 
 ```ts
-const BlockHeadingFlexbox: React.FC<BlockComponentWithTxsProps>;
-```
-
-  ### <a id="BlockJsonViewTableCell"></a>BlockJsonViewTableCell
-
-[**@xyo-network/react-chain**](#../README)
-
-***
+optional border: 
+  | ResponsiveStyleValue<
+  | undefined
+  | number
+  | "hidden"
+  | "none"
+  | string & object
+  | "inherit"
+  | "inset"
+  | "-moz-initial"
+  | "initial"
+  | "revert"
+  | "revert-layer"
+  | "unset"
+  | "aliceblue"
+  | "antiquewhite"
+  | "aqua"
+  | "aquamarine"
+  | "azure"
+  | "beige"
+  | "bisque"
+  | "black"
+  | "blanchedalmond"
+  | "blue"
+  | "blueviolet"
+  | "brown"
+  | "burlywood"
+  | "cadetblue"
+  | "chartreuse"
+  | "chocolate"
+  | "coral"
+  | "cornflowerblue"
+  | "cornsilk"
+  | "crimson"
+  | "cyan"
+  | "darkblue"
+  | "darkcyan"
+  | "darkgoldenrod"
+  | "darkgray"
+  | "darkgreen"
+  | "darkgrey"
+  | "darkkhaki"
+  | "darkmagenta"
+  | "darkolivegreen"
+  | "darkorange"
+  | "darkorchid"
+  | "darkred"
+  | "darksalmon"
+  | "darkseagreen"
+  | "darkslateblue"
+  | "darkslategray"
+  | "darkslategrey"
+  | "darkturquoise"
+  | "darkviolet"
+  | "deeppink"
+  | "deepskyblue"
+  | "dimgray"
+  | "dimgrey"
+  | "dodgerblue"
+  | "firebrick"
+  | "floralwhite"
+  | "forestgreen"
+  | "fuchsia"
+  | "gainsboro"
+  | "ghostwhite"
+  | "gold"
+  | "goldenrod"
+  | "gray"
+  | "green"
+  | "greenyellow"
+  | "grey"
+  | "honeydew"
+  | "hotpink"
+  | "indianred"
+  | "indigo"
+  | "ivory"
+  | "khaki"
+  | "lavender"
+  | "lavenderblush"
+  | "lawngreen"
+  | "lemonchiffon"
+  | "lightblue"
+  | "lightcoral"
+  | "lightcyan"
+  | "lightgoldenrodyellow"
+  | "lightgray"
+  | "lightgreen"
+  | "lightgrey"
+  | "lightpink"
+  | "lightsalmon"
+  | "lightseagreen"
+  | "lightskyblue"
+  | "lightslategray"
+  | "lightslategrey"
+  | "lightsteelblue"
+  | "lightyellow"
+  | "lime"
+  | "limegreen"
+  | "linen"
+  | "magenta"
+  | "maroon"
+  | "mediumaquamarine"
+  | "mediumblue"
+  | "mediumorchid"
+  | "mediumpurple"
+  | "mediumseagreen"
+  | "mediumslateblue"
+  | "mediumspringgreen"
+  | "mediumturquoise"
+  | "mediumvioletred"
+  | "midnightblue"
+  | "mintcream"
+  | "mistyrose"
+  | "moccasin"
+  | "navajowhite"
+  | "navy"
+  | "oldlace"
+  | "olive"
+  | "olivedrab"
+  | "orange"
+  | "orangered"
+  | "orchid"
+  | "palegoldenrod"
+  | "palegreen"
+  | "paleturquoise"
+  | "palevioletred"
+  | "papayawhip"
+  | "peachpuff"
+  | "peru"
+  | "pink"
+  | "plum"
+  | "powderblue"
+  | "purple"
+  | "rebeccapurple"
+  | "red"
+  | "rosybrown"
+  | "royalblue"
+  | "saddlebrown"
+  | "salmon"
+  | "sandybrown"
+  | "seagreen"
+  | "seashell"
+  | "sienna"
+  | "silver"
+  | "skyblue"
+  | "slateblue"
+  | "slategray"
+  | "slategrey"
+  | "snow"
+  | "springgreen"
+  | "steelblue"
+  | "tan"
+  | "teal"
+  | "thistle"
+  | "tomato"
+  | "transparent"
+  | "turquoise"
+  | "violet"
+  | "wheat"
+  | "white"
+  | "whitesmoke"
+  | "yellow"
+  | "yellowgreen"
+  | "ActiveBorder"
+  | "ActiveCaption"
+  | "AppWorkspace"
+  | "Background"
+  | "ButtonFace"
+  | "ButtonHighlight"
+  | "ButtonShadow"
+  | "ButtonText"
+  | "CaptionText"
+  | "GrayText"
+  | "Highlight"
+  | "HighlightText"
+  | "InactiveBorder"
+  | "InactiveCaption"
+  | "InactiveCaptionText"
+  | "InfoBackground"
+  | "InfoText"
+  | "Menu"
+  | "MenuText"
+  | "Scrollbar"
+  | "ThreeDDarkShadow"
+  | "ThreeDFace"
+  | "ThreeDHighlight"
+  | "ThreeDLightShadow"
+  | "ThreeDShadow"
+  | "Window"
+  | "WindowFrame"
+  | "WindowText"
+  | "currentcolor"
+  | "medium"
+  | "thick"
+  | "thin"
+  | "dashed"
+  | "dotted"
+  | "double"
+  | "groove"
+  | "outset"
+  | "ridge"
+  | "solid">
+  | (theme) => ResponsiveStyleValue<
+  | undefined
+  | number
+  | "hidden"
+  | "none"
+  | string & object
+  | "inherit"
+  | "inset"
+  | "-moz-initial"
+  | "initial"
+  | "revert"
+  | "revert-layer"
+  | "unset"
+  | "aliceblue"
+  | "antiquewhite"
+  | "aqua"
+  | "aquamarine"
+  | "azure"
+  | "beige"
+  | "bisque"
+  | "black"
+  | "blanchedalmond"
+  | "blue"
+  | "blueviolet"
+  | "brown"
+  | "burlywood"
+  | "cadetblue"
+  | "chartreuse"
+  | "chocolate"
+  | "coral"
+  | "cornflowerblue"
+  | "cornsilk"
+  | "crimson"
+  | "cyan"
+  | "darkblue"
+  | "darkcyan"
+  | "darkgoldenrod"
+  | "darkgray"
+  | "darkgreen"
+  | "darkgrey"
+  | "darkkhaki"
+  | "darkmagenta"
+  | "darkolivegreen"
+  | "darkorange"
+  | "darkorchid"
+  | "darkred"
+  | "darksalmon"
+  | "darkseagreen"
+  | "darkslateblue"
+  | "darkslategray"
+  | "darkslategrey"
+  | "darkturquoise"
+  | "darkviolet"
+  | "deeppink"
+  | "deepskyblue"
+  | "dimgray"
+  | "dimgrey"
+  | "dodgerblue"
+  | "firebrick"
+  | "floralwhite"
+  | "forestgreen"
+  | "fuchsia"
+  | "gainsboro"
+  | "ghostwhite"
+  | "gold"
+  | "goldenrod"
+  | "gray"
+  | "green"
+  | "greenyellow"
+  | "grey"
+  | "honeydew"
+  | "hotpink"
+  | "indianred"
+  | "indigo"
+  | "ivory"
+  | "khaki"
+  | "lavender"
+  | "lavenderblush"
+  | "lawngreen"
+  | "lemonchiffon"
+  | "lightblue"
+  | "lightcoral"
+  | "lightcyan"
+  | "lightgoldenrodyellow"
+  | "lightgray"
+  | "lightgreen"
+  | "lightgrey"
+  | "lightpink"
+  | "lightsalmon"
+  | "lightseagreen"
+  | "lightskyblue"
+  | "lightslategray"
+  | "lightslategrey"
+  | "lightsteelblue"
+  | "lightyellow"
+  | "lime"
+  | "limegreen"
+  | "linen"
+  | "magenta"
+  | "maroon"
+  | "mediumaquamarine"
+  | "mediumblue"
+  | "mediumorchid"
+  | "mediumpurple"
+  | "mediumseagreen"
+  | "mediumslateblue"
+  | "mediumspringgreen"
+  | "mediumturquoise"
+  | "mediumvioletred"
+  | "midnightblue"
+  | "mintcream"
+  | "mistyrose"
+  | "moccasin"
+  | "navajowhite"
+  | "navy"
+  | "oldlace"
+  | "olive"
+  | "olivedrab"
+  | "orange"
+  | "orangered"
+  | "orchid"
+  | "palegoldenrod"
+  | "palegreen"
+  | "paleturquoise"
+  | "palevioletred"
+  | "papayawhip"
+  | "peachpuff"
+  | "peru"
+  | "pink"
+  | "plum"
+  | "powderblue"
+  | "purple"
+  | "rebeccapurple"
+  | "red"
+  | "rosybrown"
+  | "royalblue"
+  | "saddlebrown"
+  | "salmon"
+  | "sandybrown"
+  | "seagreen"
+  | "seashell"
+  | "sienna"
+  | "silver"
+  | "skyblue"
+  | "slateblue"
+  | "slategray"
+  | "slategrey"
+  | "snow"
+  | "springgreen"
+  | "steelblue"
+  | "tan"
+  | "teal"
+  | "thistle"
+  | "tomato"
+  | "transparent"
+  | "turquoise"
+  | "violet"
+  | "wheat"
+  | "white"
+  | "whitesmoke"
+  | "yellow"
+  | "yellowgreen"
+  | "ActiveBorder"
+  | "ActiveCaption"
+  | "AppWorkspace"
+  | "Background"
+  | "ButtonFace"
+  | "ButtonHighlight"
+  | "ButtonShadow"
+  | "ButtonText"
+  | "CaptionText"
+  | "GrayText"
+  | "Highlight"
+  | "HighlightText"
+  | "InactiveBorder"
+  | "InactiveCaption"
+  | "InactiveCaptionText"
+  | "InfoBackground"
+  | "InfoText"
+  | "Menu"
+  | "MenuText"
+  | "Scrollbar"
+  | "ThreeDDarkShadow"
+  | "ThreeDFace"
+  | "ThreeDHighlight"
+  | "ThreeDLightShadow"
+  | "ThreeDShadow"
+  | "Window"
+  | "WindowFrame"
+  | "WindowText"
+  | "currentcolor"
+  | "medium"
+  | "thick"
+  | "thin"
+  | "dashed"
+  | "dotted"
+  | "double"
+  | "groove"
+  | "outset"
+  | "ridge"
+| "solid">;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.border
+```
+
+***
+
+### borderTop?
+
+```ts
+optional borderTop: 
+  | ResponsiveStyleValue<BorderTop<string | number> | readonly NonNullable<BorderTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BorderTop<string | number> | readonly NonNullable<BorderTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderTop
+```
+
+***
+
+### borderRight?
+
+```ts
+optional borderRight: 
+  | ResponsiveStyleValue<BorderRight<string | number> | readonly NonNullable<BorderRight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BorderRight<string | number> | readonly NonNullable<BorderRight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderRight
+```
+
+***
+
+### borderBottom?
+
+```ts
+optional borderBottom: 
+  | ResponsiveStyleValue<BorderBottom<string | number> | readonly NonNullable<BorderBottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BorderBottom<string | number> | readonly NonNullable<BorderBottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderBottom
+```
+
+***
+
+### borderLeft?
+
+```ts
+optional borderLeft: 
+  | ResponsiveStyleValue<BorderLeft<string | number> | readonly NonNullable<BorderLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BorderLeft<string | number> | readonly NonNullable<BorderLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderLeft
+```
+
+***
+
+### borderColor?
+
+```ts
+optional borderColor: 
+  | ResponsiveStyleValue<readonly string[] | BorderColor | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | BorderColor | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderColor
+```
+
+***
+
+### borderRadius?
+
+```ts
+optional borderRadius: 
+  | ResponsiveStyleValue<BorderRadius<string | number> | readonly NonNullable<BorderRadius<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BorderRadius<string | number> | readonly NonNullable<BorderRadius<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.borderRadius
+```
+
+***
+
+### display?
+
+```ts
+optional display: 
+  | ResponsiveStyleValue<readonly string[] | Display | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | Display | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.display
+```
+
+***
+
+### displayPrint?
+
+```ts
+optional displayPrint: 
+  | ResponsiveStyleValue<readonly string[] | Display | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | Display | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.displayPrint
+```
+
+***
+
+### overflow?
+
+```ts
+optional overflow: 
+  | ResponsiveStyleValue<readonly string[] | Overflow | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | Overflow | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.overflow
+```
+
+***
+
+### textOverflow?
+
+```ts
+optional textOverflow: 
+  | ResponsiveStyleValue<readonly string[] | TextOverflow | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | TextOverflow | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.textOverflow
+```
+
+***
+
+### visibility?
+
+```ts
+optional visibility: 
+  | ResponsiveStyleValue<Visibility | readonly NonNullable<Visibility | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Visibility | readonly NonNullable<Visibility | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.visibility
+```
+
+***
+
+### whiteSpace?
+
+```ts
+optional whiteSpace: 
+  | ResponsiveStyleValue<readonly string[] | WhiteSpace | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | WhiteSpace | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.whiteSpace
+```
+
+***
+
+### flexBasis?
+
+```ts
+optional flexBasis: 
+  | ResponsiveStyleValue<FlexBasis<string | number> | readonly NonNullable<FlexBasis<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FlexBasis<string | number> | readonly NonNullable<FlexBasis<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flexBasis
+```
+
+***
+
+### flexDirection?
+
+```ts
+optional flexDirection: 
+  | ResponsiveStyleValue<FlexDirection | readonly NonNullable<FlexDirection | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FlexDirection | readonly NonNullable<FlexDirection | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flexDirection
+```
+
+***
+
+### flexWrap?
+
+```ts
+optional flexWrap: 
+  | ResponsiveStyleValue<FlexWrap | readonly NonNullable<FlexWrap | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FlexWrap | readonly NonNullable<FlexWrap | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flexWrap
+```
+
+***
+
+### justifyContent?
+
+```ts
+optional justifyContent: 
+  | ResponsiveStyleValue<readonly string[] | JustifyContent | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | JustifyContent | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.justifyContent
+```
+
+***
+
+### alignItems?
+
+```ts
+optional alignItems: 
+  | ResponsiveStyleValue<readonly string[] | AlignItems | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | AlignItems | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.alignItems
+```
+
+***
+
+### alignContent?
+
+```ts
+optional alignContent: 
+  | ResponsiveStyleValue<readonly string[] | AlignContent | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | AlignContent | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.alignContent
+```
+
+***
+
+### order?
+
+```ts
+optional order: 
+  | ResponsiveStyleValue<Order | readonly NonNullable<Order | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Order | readonly NonNullable<Order | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.order
+```
+
+***
+
+### flex?
+
+```ts
+optional flex: 
+  | ResponsiveStyleValue<Flex<string | number> | readonly NonNullable<Flex<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Flex<string | number> | readonly NonNullable<Flex<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flex
+```
+
+***
+
+### flexGrow?
+
+```ts
+optional flexGrow: 
+  | ResponsiveStyleValue<FlexGrow | readonly NonNullable<FlexGrow | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FlexGrow | readonly NonNullable<FlexGrow | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flexGrow
+```
+
+***
+
+### flexShrink?
+
+```ts
+optional flexShrink: 
+  | ResponsiveStyleValue<FlexShrink | readonly NonNullable<FlexShrink | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FlexShrink | readonly NonNullable<FlexShrink | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.flexShrink
+```
+
+***
+
+### alignSelf?
+
+```ts
+optional alignSelf: 
+  | ResponsiveStyleValue<readonly string[] | AlignSelf | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | AlignSelf | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.alignSelf
+```
+
+***
+
+### justifyItems?
+
+```ts
+optional justifyItems: 
+  | ResponsiveStyleValue<readonly string[] | JustifyItems | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | JustifyItems | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.justifyItems
+```
+
+***
+
+### justifySelf?
+
+```ts
+optional justifySelf: 
+  | ResponsiveStyleValue<readonly string[] | JustifySelf | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | JustifySelf | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.justifySelf
+```
+
+***
+
+### gap?
+
+```ts
+optional gap: 
+  | ResponsiveStyleValue<Gap<string | number> | readonly NonNullable<Gap<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Gap<string | number> | readonly NonNullable<Gap<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gap
+```
+
+***
+
+### columnGap?
+
+```ts
+optional columnGap: 
+  | ResponsiveStyleValue<ColumnGap<string | number> | readonly NonNullable<ColumnGap<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<ColumnGap<string | number> | readonly NonNullable<ColumnGap<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.columnGap
+```
+
+***
+
+### rowGap?
+
+```ts
+optional rowGap: 
+  | ResponsiveStyleValue<RowGap<string | number> | readonly NonNullable<RowGap<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<RowGap<string | number> | readonly NonNullable<RowGap<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.rowGap
+```
+
+***
+
+### gridColumn?
+
+```ts
+optional gridColumn: 
+  | ResponsiveStyleValue<GridColumn | readonly NonNullable<GridColumn | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridColumn | readonly NonNullable<GridColumn | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridColumn
+```
+
+***
+
+### gridRow?
+
+```ts
+optional gridRow: 
+  | ResponsiveStyleValue<GridRow | readonly NonNullable<GridRow | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridRow | readonly NonNullable<GridRow | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridRow
+```
+
+***
+
+### gridAutoFlow?
+
+```ts
+optional gridAutoFlow: 
+  | ResponsiveStyleValue<readonly string[] | GridAutoFlow | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | GridAutoFlow | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridAutoFlow
+```
+
+***
+
+### gridAutoColumns?
+
+```ts
+optional gridAutoColumns: 
+  | ResponsiveStyleValue<GridAutoColumns<string | number> | readonly NonNullable<GridAutoColumns<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridAutoColumns<string | number> | readonly NonNullable<GridAutoColumns<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridAutoColumns
+```
+
+***
+
+### gridAutoRows?
+
+```ts
+optional gridAutoRows: 
+  | ResponsiveStyleValue<GridAutoRows<string | number> | readonly NonNullable<GridAutoRows<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridAutoRows<string | number> | readonly NonNullable<GridAutoRows<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridAutoRows
+```
+
+***
+
+### gridTemplateColumns?
+
+```ts
+optional gridTemplateColumns: 
+  | ResponsiveStyleValue<GridTemplateColumns<string | number> | readonly NonNullable<GridTemplateColumns<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridTemplateColumns<string | number> | readonly NonNullable<GridTemplateColumns<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridTemplateColumns
+```
+
+***
+
+### gridTemplateRows?
+
+```ts
+optional gridTemplateRows: 
+  | ResponsiveStyleValue<GridTemplateRows<string | number> | readonly NonNullable<GridTemplateRows<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridTemplateRows<string | number> | readonly NonNullable<GridTemplateRows<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridTemplateRows
+```
+
+***
+
+### gridTemplateAreas?
+
+```ts
+optional gridTemplateAreas: 
+  | ResponsiveStyleValue<readonly string[] | GridTemplateAreas | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | GridTemplateAreas | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridTemplateAreas
+```
+
+***
+
+### gridArea?
+
+```ts
+optional gridArea: 
+  | ResponsiveStyleValue<GridArea | readonly NonNullable<GridArea | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<GridArea | readonly NonNullable<GridArea | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.gridArea
+```
+
+***
+
+### bgcolor?
+
+```ts
+optional bgcolor: 
+  | ResponsiveStyleValue<readonly string[] | BackgroundColor | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | BackgroundColor | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.bgcolor
+```
+
+***
+
+### zIndex?
+
+```ts
+optional zIndex: 
+  | ResponsiveStyleValue<undefined | string | string & object | number & object>
+| (theme) => ResponsiveStyleValue<undefined | string | string & object | number & object>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.zIndex
+```
+
+***
+
+### position?
+
+```ts
+optional position: 
+  | ResponsiveStyleValue<Position | readonly NonNullable<Position | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Position | readonly NonNullable<Position | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.position
+```
+
+***
+
+### top?
+
+```ts
+optional top: 
+  | ResponsiveStyleValue<Top<string | number> | readonly NonNullable<Top<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Top<string | number> | readonly NonNullable<Top<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.top
+```
+
+***
+
+### bottom?
+
+```ts
+optional bottom: 
+  | ResponsiveStyleValue<Bottom<string | number> | readonly NonNullable<Bottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Bottom<string | number> | readonly NonNullable<Bottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.bottom
+```
+
+***
+
+### boxShadow?
+
+```ts
+optional boxShadow: 
+  | ResponsiveStyleValue<number | BoxShadow | undefined>
+| (theme) => ResponsiveStyleValue<number | BoxShadow | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.boxShadow
+```
+
+***
+
+### maxWidth?
+
+```ts
+optional maxWidth: 
+  | ResponsiveStyleValue<MaxWidth<string | number> | readonly NonNullable<MaxWidth<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MaxWidth<string | number> | readonly NonNullable<MaxWidth<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.maxWidth
+```
+
+***
+
+### minWidth?
+
+```ts
+optional minWidth: 
+  | ResponsiveStyleValue<MinWidth<string | number> | readonly NonNullable<MinWidth<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MinWidth<string | number> | readonly NonNullable<MinWidth<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.minWidth
+```
+
+***
+
+### maxHeight?
+
+```ts
+optional maxHeight: 
+  | ResponsiveStyleValue<MaxHeight<string | number> | readonly NonNullable<MaxHeight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MaxHeight<string | number> | readonly NonNullable<MaxHeight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.maxHeight
+```
+
+***
+
+### minHeight?
+
+```ts
+optional minHeight: 
+  | ResponsiveStyleValue<MinHeight<string | number> | readonly NonNullable<MinHeight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MinHeight<string | number> | readonly NonNullable<MinHeight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.minHeight
+```
+
+***
+
+### boxSizing?
+
+```ts
+optional boxSizing: 
+  | ResponsiveStyleValue<BoxSizing | readonly NonNullable<BoxSizing | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<BoxSizing | readonly NonNullable<BoxSizing | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.boxSizing
+```
+
+***
+
+### m?
+
+```ts
+optional m: 
+  | ResponsiveStyleValue<Margin<string | number> | readonly NonNullable<Margin<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Margin<string | number> | readonly NonNullable<Margin<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.m
+```
+
+***
+
+### mt?
+
+```ts
+optional mt: 
+  | ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.mt
+```
+
+***
+
+### mr?
+
+```ts
+optional mr: 
+  | ResponsiveStyleValue<MarginRight<string | number> | readonly NonNullable<MarginRight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginRight<string | number> | readonly NonNullable<MarginRight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.mr
+```
+
+***
+
+### mb?
+
+```ts
+optional mb: 
+  | ResponsiveStyleValue<MarginBottom<string | number> | readonly NonNullable<MarginBottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginBottom<string | number> | readonly NonNullable<MarginBottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.mb
+```
+
+***
+
+### ml?
+
+```ts
+optional ml: 
+  | ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.ml
+```
+
+***
+
+### mx?
+
+```ts
+optional mx: 
+  | ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.mx
+```
+
+***
+
+### my?
+
+```ts
+optional my: 
+  | ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.my
+```
+
+***
+
+### pt?
+
+```ts
+optional pt: 
+  | ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.pt
+```
+
+***
+
+### pr?
+
+```ts
+optional pr: 
+  | ResponsiveStyleValue<PaddingRight<string | number> | readonly NonNullable<PaddingRight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingRight<string | number> | readonly NonNullable<PaddingRight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.pr
+```
+
+***
+
+### pb?
+
+```ts
+optional pb: 
+  | ResponsiveStyleValue<PaddingBottom<string | number> | readonly NonNullable<PaddingBottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingBottom<string | number> | readonly NonNullable<PaddingBottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.pb
+```
+
+***
+
+### pl?
+
+```ts
+optional pl: 
+  | ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.pl
+```
+
+***
+
+### px?
+
+```ts
+optional px: 
+  | ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.px
+```
+
+***
+
+### py?
+
+```ts
+optional py: 
+  | ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.py
+```
+
+***
+
+### margin?
+
+```ts
+optional margin: 
+  | ResponsiveStyleValue<Margin<string | number> | readonly NonNullable<Margin<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Margin<string | number> | readonly NonNullable<Margin<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.margin
+```
+
+***
+
+### marginTop?
+
+```ts
+optional marginTop: 
+  | ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginTop
+```
+
+***
+
+### marginRight?
+
+```ts
+optional marginRight: 
+  | ResponsiveStyleValue<MarginRight<string | number> | readonly NonNullable<MarginRight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginRight<string | number> | readonly NonNullable<MarginRight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginRight
+```
+
+***
+
+### marginBottom?
+
+```ts
+optional marginBottom: 
+  | ResponsiveStyleValue<MarginBottom<string | number> | readonly NonNullable<MarginBottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginBottom<string | number> | readonly NonNullable<MarginBottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginBottom
+```
+
+***
+
+### marginLeft?
+
+```ts
+optional marginLeft: 
+  | ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginLeft
+```
+
+***
+
+### marginX?
+
+```ts
+optional marginX: 
+  | ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginLeft<string | number> | readonly NonNullable<MarginLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginX
+```
+
+***
+
+### marginY?
+
+```ts
+optional marginY: 
+  | ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginTop<string | number> | readonly NonNullable<MarginTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginY
+```
+
+***
+
+### marginInline?
+
+```ts
+optional marginInline: 
+  | ResponsiveStyleValue<MarginInline<string | number> | readonly NonNullable<MarginInline<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginInline<string | number> | readonly NonNullable<MarginInline<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginInline
+```
+
+***
+
+### marginInlineStart?
+
+```ts
+optional marginInlineStart: 
+  | ResponsiveStyleValue<MarginInlineStart<string | number> | readonly NonNullable<MarginInlineStart<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginInlineStart<string | number> | readonly NonNullable<MarginInlineStart<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginInlineStart
+```
+
+***
+
+### marginInlineEnd?
+
+```ts
+optional marginInlineEnd: 
+  | ResponsiveStyleValue<MarginInlineEnd<string | number> | readonly NonNullable<MarginInlineEnd<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginInlineEnd<string | number> | readonly NonNullable<MarginInlineEnd<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginInlineEnd
+```
+
+***
+
+### marginBlock?
+
+```ts
+optional marginBlock: 
+  | ResponsiveStyleValue<MarginBlock<string | number> | readonly NonNullable<MarginBlock<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginBlock<string | number> | readonly NonNullable<MarginBlock<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginBlock
+```
+
+***
+
+### marginBlockStart?
+
+```ts
+optional marginBlockStart: 
+  | ResponsiveStyleValue<MarginBlockStart<string | number> | readonly NonNullable<MarginBlockStart<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginBlockStart<string | number> | readonly NonNullable<MarginBlockStart<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginBlockStart
+```
+
+***
+
+### marginBlockEnd?
+
+```ts
+optional marginBlockEnd: 
+  | ResponsiveStyleValue<MarginBlockEnd<string | number> | readonly NonNullable<MarginBlockEnd<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<MarginBlockEnd<string | number> | readonly NonNullable<MarginBlockEnd<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.marginBlockEnd
+```
+
+***
+
+### padding?
+
+```ts
+optional padding: 
+  | ResponsiveStyleValue<Padding<string | number> | readonly NonNullable<Padding<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<Padding<string | number> | readonly NonNullable<Padding<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.padding
+```
+
+***
+
+### paddingTop?
+
+```ts
+optional paddingTop: 
+  | ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingTop
+```
+
+***
+
+### paddingRight?
+
+```ts
+optional paddingRight: 
+  | ResponsiveStyleValue<PaddingRight<string | number> | readonly NonNullable<PaddingRight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingRight<string | number> | readonly NonNullable<PaddingRight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingRight
+```
+
+***
+
+### paddingBottom?
+
+```ts
+optional paddingBottom: 
+  | ResponsiveStyleValue<PaddingBottom<string | number> | readonly NonNullable<PaddingBottom<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingBottom<string | number> | readonly NonNullable<PaddingBottom<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingBottom
+```
+
+***
+
+### paddingLeft?
+
+```ts
+optional paddingLeft: 
+  | ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingLeft
+```
+
+***
+
+### paddingX?
+
+```ts
+optional paddingX: 
+  | ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingLeft<string | number> | readonly NonNullable<PaddingLeft<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingX
+```
+
+***
+
+### paddingY?
+
+```ts
+optional paddingY: 
+  | ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingTop<string | number> | readonly NonNullable<PaddingTop<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingY
+```
+
+***
+
+### paddingInline?
+
+```ts
+optional paddingInline: 
+  | ResponsiveStyleValue<PaddingInline<string | number> | readonly NonNullable<PaddingInline<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingInline<string | number> | readonly NonNullable<PaddingInline<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingInline
+```
+
+***
+
+### paddingInlineStart?
+
+```ts
+optional paddingInlineStart: 
+  | ResponsiveStyleValue<PaddingInlineStart<string | number> | readonly NonNullable<PaddingInlineStart<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingInlineStart<string | number> | readonly NonNullable<PaddingInlineStart<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingInlineStart
+```
+
+***
+
+### paddingInlineEnd?
+
+```ts
+optional paddingInlineEnd: 
+  | ResponsiveStyleValue<PaddingInlineEnd<string | number> | readonly NonNullable<PaddingInlineEnd<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingInlineEnd<string | number> | readonly NonNullable<PaddingInlineEnd<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingInlineEnd
+```
+
+***
+
+### paddingBlock?
+
+```ts
+optional paddingBlock: 
+  | ResponsiveStyleValue<PaddingBlock<string | number> | readonly NonNullable<PaddingBlock<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingBlock<string | number> | readonly NonNullable<PaddingBlock<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingBlock
+```
+
+***
+
+### paddingBlockStart?
+
+```ts
+optional paddingBlockStart: 
+  | ResponsiveStyleValue<PaddingBlockStart<string | number> | readonly NonNullable<PaddingBlockStart<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingBlockStart<string | number> | readonly NonNullable<PaddingBlockStart<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingBlockStart
+```
+
+***
+
+### paddingBlockEnd?
+
+```ts
+optional paddingBlockEnd: 
+  | ResponsiveStyleValue<PaddingBlockEnd<string | number> | readonly NonNullable<PaddingBlockEnd<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<PaddingBlockEnd<string | number> | readonly NonNullable<PaddingBlockEnd<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.paddingBlockEnd
+```
+
+***
+
+### typography?
+
+```ts
+optional typography: 
+  | ResponsiveStyleValue<undefined | string>
+| (theme) => ResponsiveStyleValue<undefined | string>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.typography
+```
+
+***
+
+### fontFamily?
+
+```ts
+optional fontFamily: 
+  | ResponsiveStyleValue<readonly string[] | FontFamily | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | FontFamily | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.fontFamily
+```
+
+***
+
+### fontSize?
+
+```ts
+optional fontSize: 
+  | ResponsiveStyleValue<FontSize<string | number> | readonly NonNullable<FontSize<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<FontSize<string | number> | readonly NonNullable<FontSize<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.fontSize
+```
+
+***
+
+### fontStyle?
+
+```ts
+optional fontStyle: 
+  | ResponsiveStyleValue<readonly string[] | FontStyle | undefined>
+| (theme) => ResponsiveStyleValue<readonly string[] | FontStyle | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.fontStyle
+```
+
+***
+
+### fontWeight?
+
+```ts
+optional fontWeight: 
+  | ResponsiveStyleValue<undefined | string | string & object | number & object>
+| (theme) => ResponsiveStyleValue<undefined | string | string & object | number & object>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.fontWeight
+```
+
+***
+
+### letterSpacing?
+
+```ts
+optional letterSpacing: 
+  | ResponsiveStyleValue<LetterSpacing<string | number> | readonly NonNullable<LetterSpacing<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<LetterSpacing<string | number> | readonly NonNullable<LetterSpacing<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.letterSpacing
+```
+
+***
+
+### lineHeight?
+
+```ts
+optional lineHeight: 
+  | ResponsiveStyleValue<LineHeight<string | number> | readonly NonNullable<LineHeight<string | number> | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<LineHeight<string | number> | readonly NonNullable<LineHeight<string | number> | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.lineHeight
+```
+
+***
+
+### textAlign?
+
+```ts
+optional textAlign: 
+  | ResponsiveStyleValue<TextAlign | readonly NonNullable<TextAlign | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<TextAlign | readonly NonNullable<TextAlign | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.textAlign
+```
+
+***
+
+### textTransform?
+
+```ts
+optional textTransform: 
+  | ResponsiveStyleValue<TextTransform | readonly NonNullable<TextTransform | undefined>[] | undefined>
+| (theme) => ResponsiveStyleValue<TextTransform | readonly NonNullable<TextTransform | undefined>[] | undefined>;
+```
+
+### Inherited from
+
+```ts
+FlexBoxProps.textTransform
+```
+
+***
+
+### options?
+
+```ts
+optional options: TransferRenderOptions;
+```
+
+***
+
+### payload?
+
+```ts
+optional payload: Payload;
+```
+
+### Overrides
+
+```ts
+PayloadDetailsRenderProps.payload
+```
+
+  ### <a id="TransferRenderCardProps"></a>TransferRenderCardProps
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+## Extends
+
+- `PayloadDetailsRenderProps`.`CardProps`
+
+## Properties
+
+### options?
+
+```ts
+optional options: TransferRenderOptions;
+```
+
+***
+
+### payload?
+
+```ts
+optional payload: Payload;
+```
+
+### Overrides
+
+```ts
+PayloadDetailsRenderProps.payload
+```
+
+  ### <a id="XyoGlobal"></a>XyoGlobal
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+## Properties
+
+### client?
+
+```ts
+optional client: XyoClient;
+```
+
+***
+
+### ~~connections~~
+
+```ts
+connections: object;
+```
+
+### Index Signature
+
+```ts
+[chainId: string]: ChainConnection
+```
+
+### Deprecated
+
+- use client gateways instead
+
+***
+
+### errors?
+
+```ts
+optional errors: Error[];
+```
+
+***
+
+### gateway?
+
+```ts
+optional gateway: XyoGatewayProvider;
+```
+
+***
+
+### ~~provider?~~
+
+```ts
+optional provider: XyoConnection;
+```
+
+### Deprecated
+
+- use client gateways instead
+
+***
+
+### sessionId()
+
+```ts
+sessionId: () => string;
+```
+
+### Returns
+
+`string`
+
+***
+
+### ~~walletExtensionId()~~
+
+```ts
+walletExtensionId: () => string;
+```
+
+### Returns
+
+`string`
+
+### Deprecated
+
+- use session id instead
+
+### type-aliases
+
+  ### <a id="BlockHeaderEventNouns"></a>BlockHeaderEventNouns
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type BlockHeaderEventNouns = 
+  | "transaction-count"
+  | "block-hash"
+  | "block-number"
+  | "block-producer"
+  | "block-verification"
+  | "payload-counts";
+```
+
+  ### <a id="ChainIteratorStoreValues"></a>ChainIteratorStoreValues
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type ChainIteratorStoreValues = object;
+```
+
+## Properties
+
+### chainIterator
+
+```ts
+chainIterator: ChainBlockNumberIterationService;
+```
+
+***
+
+### error?
+
+```ts
+optional error: Error;
+```
+
+***
+
+### head
+
+```ts
+head: HydratedBlock;
+```
+
+  ### <a id="ChainNetworkState"></a>ChainNetworkState
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type ChainNetworkState = ContextExState<{
+  activeNetwork?: NetworkBootstrap;
+  chainNetworkError?: Error;
+  networks?: NetworkBootstrap[];
+  updateActiveNetwork?: (networkId) => void;
+}>;
+```
+
+  ### <a id="Listener"></a>Listener
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type Listener = (...args) => void;
+```
+
+## Parameters
+
+### args
+
+...`unknown`[]
+
+## Returns
+
+`void`
+
+  ### <a id="PollingState"></a>PollingState
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type PollingState = "paused" | "running";
+```
+
+  ### <a id="SmartContractDeploy"></a>SmartContractDeploy
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type SmartContractDeploy = Payload<SmartContractDeployFields, SmartContractDeploySchema>;
+```
+
+  ### <a id="SmartContractDeploySchema"></a>SmartContractDeploySchema
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+type SmartContractDeploySchema = typeof SmartContractDeploySchema;
+```
+
+### variables
+
+  ### <a id="ActiveMenuItem"></a>ActiveMenuItem
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const ActiveMenuItem: React.FC<MenuItemProps & object>;
+```
+
+  ### <a id="ActiveNetworkAvatar"></a>ActiveNetworkAvatar
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const ActiveNetworkAvatar: React.FC<AvatarProps>;
+```
+
+  ### <a id="BlockChainPagination"></a>BlockChainPagination
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const BlockChainPagination: React.FC<BlockChainPaginationProps>;
+```
+
+  ### <a id="BlockChainTableRow"></a>BlockChainTableRow
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const BlockChainTableRow: React.FC<BlockChainTableRowProps>;
+```
+
+  ### <a id="BlockEpochTableCell"></a>BlockEpochTableCell
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const BlockEpochTableCell: React.FC<BlockEpochTableCellProps>;
+```
+
+  ### <a id="BlockHashTableCell"></a>BlockHashTableCell
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const BlockHashTableCell: React.FC<BlockHashTableCellProps>;
+```
+
+  ### <a id="BlockHeadingFlexbox"></a>BlockHeadingFlexbox
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const BlockHeadingFlexbox: React.FC<BlockComponentWithTxsProps>;
+```
+
+  ### <a id="BlockJsonViewTableCell"></a>BlockJsonViewTableCell
+
+[**@xyo-network/react-chain**](#../README)
+
+***
 
 ```ts
 const BlockJsonViewTableCell: React.FC<BlockJsonViewTableCellProps>;
@@ -16890,7 +19049,7 @@ const BlockchainTableEx: {
 };
 ```
 
-## Type declaration
+## Type Declaration
 
 ## Parameters
 
@@ -17188,7 +19347,7 @@ const DetailsStack: React.FC<DetailsStackProps>;
 const DynamicBlockchainRenderFlexbox: object;
 ```
 
-## Type declaration
+## Type Declaration
 
 ### Base
 
@@ -17408,7 +19567,7 @@ const ProducerIntentBuilderForm: React.FC<ProducerIntentBuilderFormProps>;
 const PulseSvgIcon: OverridableComponent & object;
 ```
 
-## Type declaration
+## Type Declaration
 
 ### muiName
 
@@ -17446,7 +19605,7 @@ const StakingTokenAddress: React.FC<EvmContractChainStakeProps>;
 const StaticBlockchainRenderFlexBox: object;
 ```
 
-## Type declaration
+## Type Declaration
 
 ### Base
 
@@ -17480,64 +19639,94 @@ const StyledPulseSvgIcon: StyledComponent;
 const SubmitChainTransaction: React.FC;
 ```
 
-  ### <a id="SuccessfulDeploy"></a>SuccessfulDeploy
+  ### <a id="SuccessfulDeploy"></a>SuccessfulDeploy
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const SuccessfulDeploy: React.FC<SuccessfulDeployProps>;
+```
+
+  ### <a id="TransactionCountChip"></a>TransactionCountChip
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const TransactionCountChip: React.FC<TransactionCountChipProps>;
+```
+
+  ### <a id="TransactionsDialog"></a>TransactionsDialog
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const TransactionsDialog: React.FC<TransactionsDialogProps>;
+```
+
+  ### <a id="TransactionsQuickTipButton"></a>TransactionsQuickTipButton
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const SuccessfulDeploy: React.FC<SuccessfulDeployProps>;
+const TransactionsQuickTipButton: React.FC<TransactionsQuickTipButtonQuickTipButtonProps>;
 ```
 
-  ### <a id="TransactionCountChip"></a>TransactionCountChip
+  ### <a id="TransferBuilderFlexbox"></a>TransferBuilderFlexbox
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const TransactionCountChip: React.FC<TransactionCountChipProps>;
+const TransferBuilderFlexbox: React.FC<PayloadBuilderComponentProps>;
 ```
 
-  ### <a id="TransactionsDialog"></a>TransactionsDialog
+  ### <a id="TransferBuilderForm"></a>TransferBuilderForm
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const TransactionsDialog: React.FC<TransactionsDialogProps>;
+const TransferBuilderForm: React.FC<TransferBuilderFormProps>;
 ```
 
-  ### <a id="TransactionsQuickTipButton"></a>TransactionsQuickTipButton
+  ### <a id="TransferRenderBoxDetails"></a>TransferRenderBoxDetails
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const TransactionsQuickTipButton: React.FC<TransactionsQuickTipButtonQuickTipButtonProps>;
+const TransferRenderBoxDetails: React.FC<TransferRenderBoxDetailsProps>;
 ```
 
-  ### <a id="TransferBuilderFlexbox"></a>TransferBuilderFlexbox
+  ### <a id="TransferRenderCard"></a>TransferRenderCard
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const TransferBuilderFlexbox: React.FC<PayloadBuilderComponentProps>;
+const TransferRenderCard: React.FC<TransferRenderCardProps>;
 ```
 
-  ### <a id="TransferBuilderForm"></a>TransferBuilderForm
+  ### <a id="TransferRenderPlugin"></a>TransferRenderPlugin
 
 [**@xyo-network/react-chain**](#../README)
 
 ***
 
 ```ts
-const TransferBuilderForm: React.FC<TransferBuilderFormProps>;
+const TransferRenderPlugin: PayloadRenderPlugin;
 ```
 
   ### <a id="XyoAddressTextField"></a>XyoAddressTextField
@@ -17622,7 +19811,7 @@ const asSmartContractDeploy: AsTypeFunction;
 ***
 
 ```ts
-const blockProducer: (block) => Lowercase<string>;
+const blockProducer: (block) => Brand;
 ```
 
 ## Parameters
@@ -17633,7 +19822,7 @@ const blockProducer: (block) => Lowercase<string>;
 
 ## Returns
 
-`Lowercase`\<`string`\>
+`Brand`
 
   ### <a id="buildBlockChainRenderComponent"></a>buildBlockChainRenderComponent
 
@@ -17803,6 +19992,30 @@ const isSmartContractDeploy: (x?) => x is SmartContractDeploy;
 
 `x is SmartContractDeploy`
 
+  ### <a id="listenForClientInjection"></a>listenForClientInjection
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const listenForClientInjection: (onClientReady, onTimeout) => void;
+```
+
+## Parameters
+
+### onClientReady
+
+() => `void`
+
+### onTimeout
+
+() => `void`
+
+## Returns
+
+`void`
+
   ### <a id="payloadCountsFromBlock"></a>payloadCountsFromBlock
 
 [**@xyo-network/react-chain**](#../README)
@@ -17970,7 +20183,7 @@ const useAddressBalance: (address?, viewer?, refresh?) => object;
 ### address
 
 ```ts
-address: Lowercase<string> | undefined;
+address: Brand | undefined;
 ```
 
 ### balanceForAddress
@@ -18094,7 +20307,7 @@ const useBlockHeadingEvents: <TElement>(...args) => [RefObject, EventDispatch];
 ***
 
 ```ts
-const useBlockProducer: (block?) => Lowercase<string> | undefined;
+const useBlockProducer: (block?) => Brand | undefined;
 ```
 
 ## Parameters
@@ -18105,7 +20318,7 @@ const useBlockProducer: (block?) => Lowercase<string> | undefined;
 
 ## Returns
 
-`Lowercase`\<`string`\> \| `undefined`
+`Brand` \| `undefined`
 
   ### <a id="useChainIteratorParams"></a>useChainIteratorParams
 
@@ -18117,23 +20330,8 @@ const useBlockProducer: (block?) => Lowercase<string> | undefined;
 const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
   | {
   chainArchivist: ArchivistInstance;
-  chainId: Lowercase<string>;
+  chainId: Chain;
   config: {
-     chain: {
-        id?: string;
-     };
-     logLevel: "error" | "warn" | "info" | "log" | "debug" | "trace";
-     storage: {
-        root?: string;
-        mongo?: {
-           connectionString?: string;
-           database?: string;
-           domain?: string;
-           password?: string;
-           username?: string;
-        };
-     };
-     silent: boolean;
      api: {
         host: string;
         port: number;
@@ -18142,6 +20340,9 @@ const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
      app: {
         port: number;
      };
+     chain: {
+        id?: string;
+     };
      evm: {
         chainId?: string;
         infura?: {
@@ -18153,21 +20354,35 @@ const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
         };
      };
      producer: {
-        port: number;
+        heartbeatInterval: number;
         minStake: number;
-        mnemonic?: string;
-        healthCheckPort?: number;
+        port: number;
+        allowlist?: Brand[];
         disableIntentRedeclaration?: boolean;
+        healthCheckPort?: number;
+        mnemonic?: string;
         rewardAddress?: string;
      };
+     storage: {
+        mongo?: {
+           connectionString?: string;
+           database?: string;
+           domain?: string;
+           password?: string;
+           username?: string;
+        };
+        root?: string;
+     };
      telemetry: {
         otel?: {
            otlpEndpoint?: string;
         };
      };
+     logLevel: "error" | "warn" | "info" | "log" | "debug" | "trace";
+     silent: boolean;
   };
-  head: DeepRestrictToStringKeys & Partial<PayloadMetaFields> & StorageMeta & DeepRestrictToStringKeys & BoundWitnessMeta & object;
-  name: string;
+  head: SchemaFields & PayloadFields & object & Partial<PayloadMetaFields> & StorageMeta & BoundWitnessFields & BlockBoundWitnessFields & BlockBoundWitnessMeta & object & BoundWitnessMeta & object;
+  name: CreatableName;
 }
   | undefined, Error | undefined, UsePromiseState | undefined];
 ```
@@ -18183,23 +20398,8 @@ const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
 \[
   \| \{
   `chainArchivist`: `ArchivistInstance`;
-  `chainId`: `Lowercase`\<`string`\>;
+  `chainId`: `Chain`;
   `config`: \{
-     `chain`: \{
-        `id?`: `string`;
-     \};
-     `logLevel`: `"error"` \| `"warn"` \| `"info"` \| `"log"` \| `"debug"` \| `"trace"`;
-     `storage`: \{
-        `root?`: `string`;
-        `mongo?`: \{
-           `connectionString?`: `string`;
-           `database?`: `string`;
-           `domain?`: `string`;
-           `password?`: `string`;
-           `username?`: `string`;
-        \};
-     \};
-     `silent`: `boolean`;
      `api`: \{
         `host`: `string`;
         `port`: `number`;
@@ -18208,6 +20408,9 @@ const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
      `app`: \{
         `port`: `number`;
      \};
+     `chain`: \{
+        `id?`: `string`;
+     \};
      `evm`: \{
         `chainId?`: `string`;
         `infura?`: \{
@@ -18219,21 +20422,35 @@ const useChainIteratorParams: ({ chainArchivist, chainId, head, name, }) => [
         \};
      \};
      `producer`: \{
-        `port`: `number`;
+        `heartbeatInterval`: `number`;
         `minStake`: `number`;
-        `mnemonic?`: `string`;
-        `healthCheckPort?`: `number`;
+        `port`: `number`;
+        `allowlist?`: `Brand`[];
         `disableIntentRedeclaration?`: `boolean`;
+        `healthCheckPort?`: `number`;
+        `mnemonic?`: `string`;
         `rewardAddress?`: `string`;
      \};
+     `storage`: \{
+        `mongo?`: \{
+           `connectionString?`: `string`;
+           `database?`: `string`;
+           `domain?`: `string`;
+           `password?`: `string`;
+           `username?`: `string`;
+        \};
+        `root?`: `string`;
+     \};
      `telemetry`: \{
         `otel?`: \{
            `otlpEndpoint?`: `string`;
         \};
      \};
+     `logLevel`: `"error"` \| `"warn"` \| `"info"` \| `"log"` \| `"debug"` \| `"trace"`;
+     `silent`: `boolean`;
   \};
-  `head`: `DeepRestrictToStringKeys` & `Partial`\<`PayloadMetaFields`\> & `StorageMeta` & `DeepRestrictToStringKeys` & `BoundWitnessMeta` & `object`;
-  `name`: `string`;
+  `head`: `SchemaFields` & `PayloadFields` & `object` & `Partial`\<`PayloadMetaFields`\> & `StorageMeta` & `BoundWitnessFields` & `BlockBoundWitnessFields` & `BlockBoundWitnessMeta` & `object` & `BoundWitnessMeta` & `object`;
+  `name`: `CreatableName`;
 \}
   \| `undefined`, `Error` \| `undefined`, `UsePromiseState` \| `undefined`\]
 
@@ -18354,6 +20571,146 @@ page: number;
 
 ```ts
 paginatedBlockComponents: BlockChainRenderComponent[] | undefined;
+```
+
+  ### <a id="useCheckLocalRpc"></a>useCheckLocalRpc
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useCheckLocalRpc: () => object;
+```
+
+## Returns
+
+`object`
+
+### isLocalProducer
+
+```ts
+isLocalProducer: boolean;
+```
+
+### error
+
+```ts
+error: Error | undefined;
+```
+
+  ### <a id="useCheckRpc"></a>useCheckRpc
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useCheckRpc: (endpoint?) => object;
+```
+
+## Parameters
+
+### endpoint?
+
+`string`
+
+## Returns
+
+`object`
+
+### isLocalProducer
+
+```ts
+isLocalProducer: boolean;
+```
+
+### error
+
+```ts
+error: Error | undefined;
+```
+
+  ### <a id="useCheckSequenceRpc"></a>useCheckSequenceRpc
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useCheckSequenceRpc: () => object;
+```
+
+## Returns
+
+`object`
+
+### isLocalProducer
+
+```ts
+isLocalProducer: boolean;
+```
+
+### error
+
+```ts
+error: Error | undefined;
+```
+
+  ### <a id="useClient"></a>useClient
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useClient: () => ClientState;
+```
+
+## Returns
+
+`ClientState`
+
+  ### <a id="useConnectAccount"></a>useConnectAccount
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useConnectAccount: (gatewayName?) => object;
+```
+
+## Parameters
+
+### gatewayName?
+
+`GatewayName`
+
+## Returns
+
+`object`
+
+### address
+
+```ts
+address: string | undefined;
+```
+
+### connectSigner()
+
+```ts
+connectSigner: () => Promise<Brand>;
+```
+
+### Returns
+
+`Promise`\<`Brand`\>
+
+### error
+
+```ts
+error: Error | null;
 ```
 
   ### <a id="useContractConnect"></a>useContractConnect
@@ -18373,7 +20730,7 @@ const useContractConnect: () => object;
 ### address
 
 ```ts
-address: Lowercase<string> | undefined;
+address: EthAddress | undefined;
 ```
 
 ### handleConnectContract()
@@ -18389,7 +20746,7 @@ handleConnectContract: () => void;
 ### addressField
 
 ```ts
-addressField: Lowercase<string> | undefined;
+addressField: EthAddress | undefined;
 ```
 
 ### handleAddressChange()
@@ -18600,7 +20957,7 @@ const useEvmContractChainStake: (address?, runner?, refresh?) => [EvmChainServic
 
 ### address?
 
-`Address`
+`EthAddress`
 
 ### runner?
 
@@ -18614,6 +20971,44 @@ const useEvmContractChainStake: (address?, runner?, refresh?) => [EvmChainServic
 
 \[`EvmChainService` \| `undefined`, `Error` \| `undefined`, `UsePromiseState` \| `undefined`\]
 
+  ### <a id="useGateway"></a>useGateway
+
+[**@xyo-network/react-chain**](#../README)
+
+***
+
+```ts
+const useGateway: (gatewayName?) => object;
+```
+
+## Parameters
+
+### gatewayName?
+
+`GatewayName`
+
+## Returns
+
+`object`
+
+### gateway
+
+```ts
+gateway: XyoGatewayProvider | undefined;
+```
+
+### isLoading
+
+```ts
+isLoading: boolean;
+```
+
+### error
+
+```ts
+error: Error | null;
+```
+
   ### <a id="useHttpRpcRunner"></a>useHttpRpcRunner
 
 [**@xyo-network/react-chain**](#../README)
@@ -18798,7 +21193,7 @@ const useSigner: (_provider?, account?) => XyoSigner | undefined;
 
 ### \_provider?
 
-`XyoConnectionProvider`
+`XyoConnection`
 
 ### account?
 
@@ -18875,7 +21270,7 @@ readonly \[`number` \| `undefined`, (`_`, `newValue`) => `void`\]
 ***
 
 ```ts
-const useTxsFromBlock: (block?) => [[WithStorageMeta, Lowercase<string>][] | undefined, Error | undefined, UsePromiseState | undefined];
+const useTxsFromBlock: (block?) => [[WithStorageMeta, Brand][] | undefined, Error | undefined, UsePromiseState | undefined];
 ```
 
 ## Parameters
@@ -18886,7 +21281,7 @@ const useTxsFromBlock: (block?) => [[WithStorageMeta, Lowercase<string>][] | und
 
 ## Returns
 
-\[\[`WithStorageMeta`, `Lowercase`\<`string`\>\][] \| `undefined`, `Error` \| `undefined`, `UsePromiseState` \| `undefined`\]
+\[\[`WithStorageMeta`, `Brand`\][] \| `undefined`, `Error` \| `undefined`, `UsePromiseState` \| `undefined`\]
 
   ### <a id="useViewerFromWallet"></a>useViewerFromWallet
 
@@ -18895,7 +21290,7 @@ const useTxsFromBlock: (block?) => [[WithStorageMeta, Lowercase<string>][] | und
 ***
 
 ```ts
-const useViewerFromWallet: (networkId?) => JsonRpcXyoViewer | undefined;
+const useViewerFromWallet: (networkId?) => XyoViewer | undefined;
 ```
 
 Creates a JsonRpcXyoViewer instance based on the provided networkId.
@@ -18904,15 +21299,15 @@ Creates a JsonRpcXyoViewer instance based on the provided networkId.
 
 ### networkId?
 
-`string`
+`GatewayName`
 
 a network id like 'sequence', 'local', etc.
 
 ## Returns
 
-`JsonRpcXyoViewer` \| `undefined`
+`XyoViewer` \| `undefined`
 
-An instance of JsonRpcXyoViewer if the networkId is found in walletConnections,
+An instance of XyoViewer if the networkId is found in wallet gateways
 otherwise undefined.
 
   ### <a id="useViewerInPage"></a>useViewerInPage
@@ -18922,14 +21317,14 @@ otherwise undefined.
 ***
 
 ```ts
-const useViewerInPage: () => JsonRpcXyoViewer | undefined;
+const useViewerInPage: () => XyoViewer | undefined;
 ```
 
 Get the viewer for the active network, first from the wallet or fallback to HTTP RPC
 
 ## Returns
 
-`JsonRpcXyoViewer` \| `undefined`
+`XyoViewer` \| `undefined`
 
 - XyoViewer for the active network