wagmi 0.2.18 → 0.2.21

package/README.md

@@ -1,34 +1,7 @@
-# wagmi
+# wagmi [![Version](https://img.shields.io/npm/v/wagmi)](https://www.npmjs.com/package/wagmi) [![Downloads](https://img.shields.io/npm/dm/wagmi)](https://www.npmjs.com/package/wagmi) [![Sponsors](https://img.shields.io/github/sponsors/tmm)](https://github.com/sponsors/tmm)
 
 React Hooks library for Ethereum, built on [ethers.js](https://github.com/ethers-io/ethers.js).
 
-<p>
-  <a aria-label="Version" href="https://www.npmjs.com/package/wagmi">
-    <img
-      alt=""
-      src="https://img.shields.io/npm/v/wagmi?color=%23161b22&label=%20npm"
-    />
-  </a>
-  <a aria-label="License" href="/LICENSE">
-    <img
-      alt=""
-      src="https://img.shields.io/npm/l/wagmi?color=%23161b22"
-    />
-  </a>
-  <a aria-label="Sponsors" href="https://github.com/sponsors/tmm">
-    <img
-      alt=""
-      src="https://img.shields.io/github/sponsors/tmm?color=%23161b22"
-    />
-  </a>
-  <a aria-label="Downloads" href="https://www.npmjs.com/package/wagmi">
-    <img
-      alt=""
-      src="https://img.shields.io/npm/dm/wagmi?color=%23161b22"
-    />
-  </a>
-</p>
-
 ## Features
 
 - 🚀 20+ hooks for working with wallets, ENS, contracts, transactions, signing, etc.
@@ -41,7 +14,7 @@ React Hooks library for Ethereum, built on [ethers.js](https://github.com/ethers
 
 ## Documentation
 
-Visit https://wagmi-xyz.vercel.app to view the full documentation.
+Visit https://wagmi.sh to view the full documentation.
 
 ## Usage
 

package/dist/declarations/src/hooks/accounts/index.d.ts

@@ -4,3 +4,4 @@ export { useConnect } from './useConnect';
 export { useNetwork } from './useNetwork';
 export { useSigner } from './useSigner';
 export { useSignMessage } from './useSignMessage';
+export { useSignTypedData } from './useSignTypedData';

package/dist/declarations/src/hooks/accounts/useSignTypedData.d.ts

@@ -0,0 +1,33 @@
+import { BigNumberish, BytesLike } from 'ethers/lib/ethers';
+declare type TypedDataDomain = {
+    name?: string;
+    version?: string;
+    chainId?: BigNumberish;
+    verifyingContract?: string;
+    salt?: BytesLike;
+};
+declare type TypedDataField = {
+    name: string;
+    type: string;
+};
+export declare type Config = {
+    domain?: TypedDataDomain;
+    types?: Record<string, Array<TypedDataField>>;
+    value?: Record<string, any>;
+};
+export declare const useSignTypedData: ({ domain, types, value }?: Config) => readonly [{
+    readonly data: string | undefined;
+    readonly error: Error | undefined;
+    readonly loading: boolean | undefined;
+}, (config?: {
+    domain?: Config['domain'];
+    types?: Config['types'];
+    value?: Config['value'];
+} | undefined) => Promise<{
+    data: string;
+    error: undefined;
+} | {
+    data: undefined;
+    error: Error;
+}>];
+export {};

package/dist/declarations/src/hooks/index.d.ts

@@ -1,4 +1,4 @@
-export { useAccount, useBalance, useConnect, useNetwork, useSigner, useSignMessage, } from './accounts';
+export { useAccount, useBalance, useConnect, useNetwork, useSigner, useSignMessage, useSignTypedData, } from './accounts';
 export { useContract, useContractEvent, useContractRead, useContractWrite, useToken, } from './contracts';
 export { useEnsAvatar, useEnsLookup, useEnsResolveName, useEnsResolver, } from './ens';
 export { useBlockNumber, useFeeData } from './network-status';

package/dist/declarations/src/index.d.ts

@@ -1,5 +1,5 @@
 export { Provider, Provider as WagmiProvider, useContext, Context, } from './context';
 export type { Props as ProviderProps, Props as WagmiProviderProps, } from './context';
-export { useAccount, useBalance, useBlockNumber, useConnect, useContract, useContractEvent, useContractRead, useContractWrite, useEnsAvatar, useEnsLookup, useEnsResolveName, useEnsResolver, useFeeData, useNetwork, useProvider, useSigner, useSignMessage, useToken, useTransaction, useWaitForTransaction, useWebSocketProvider, } from './hooks';
+export { useAccount, useBalance, useBlockNumber, useConnect, useContract, useContractEvent, useContractRead, useContractWrite, useEnsAvatar, useEnsLookup, useEnsResolveName, useEnsResolver, useFeeData, useNetwork, useProvider, useSigner, useSignMessage, useSignTypedData, useToken, useTransaction, useWaitForTransaction, useWebSocketProvider, } from './hooks';
 export { Connector, InjectedConnector, chain, allChains, defaultChains, defaultL2Chains, developmentChains, erc1155ABI, erc20ABI, erc721ABI, normalizeChainId, AddChainError, ChainNotConfiguredError, ConnectorAlreadyConnectedError, ConnectorNotFoundError, SwitchChainError, UserRejectedRequestError, } from 'wagmi-core';
 export type { Chain, ConnectorData } from 'wagmi-core';

package/dist/wagmi.cjs.dev.js

@@ -172,7 +172,7 @@ var useLocalStorage = function useLocalStorage(key) {
   return [value, setLocalStorage];
 };
 
-var initialState$f = {
+var initialState$g = {
   loading: false
 };
 var useEnsAvatar = function useEnsAvatar() {
@@ -182,7 +182,7 @@ var useEnsAvatar = function useEnsAvatar() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$f);
+  var [state, setState] = React__namespace.useState(initialState$g);
   var cancelQuery = useCancel();
   var getEnsAvatar = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -247,7 +247,7 @@ var useEnsAvatar = function useEnsAvatar() {
   }, getEnsAvatar];
 };
 
-var initialState$e = {
+var initialState$f = {
   loading: false
 };
 var useEnsLookup = function useEnsLookup() {
@@ -257,7 +257,7 @@ var useEnsLookup = function useEnsLookup() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$e);
+  var [state, setState] = React__namespace.useState(initialState$f);
   var cancelQuery = useCancel();
   var lookupAddress = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -328,7 +328,7 @@ var useEnsLookup = function useEnsLookup() {
   }, lookupAddress];
 };
 
-var initialState$d = {
+var initialState$e = {
   loading: false
 };
 var useEnsResolveName = function useEnsResolveName() {
@@ -338,7 +338,7 @@ var useEnsResolveName = function useEnsResolveName() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$d);
+  var [state, setState] = React__namespace.useState(initialState$e);
   var cancelQuery = useCancel();
   var resolveName = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -409,7 +409,7 @@ var useEnsResolveName = function useEnsResolveName() {
   }, resolveName];
 };
 
-var initialState$c = {
+var initialState$d = {
   loading: false
 };
 var useEnsResolver = function useEnsResolver() {
@@ -419,7 +419,7 @@ var useEnsResolver = function useEnsResolver() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$c);
+  var [state, setState] = React__namespace.useState(initialState$d);
   var cancelQuery = useCancel();
   var getEnsResolver = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -543,7 +543,7 @@ var useAccount = function useAccount() {
   }, disconnect];
 };
 
-var initialState$b = {
+var initialState$c = {
   loading: false
 };
 var useBlockNumber = function useBlockNumber() {
@@ -554,7 +554,7 @@ var useBlockNumber = function useBlockNumber() {
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
   var webSocketProvider = useWebSocketProvider();
-  var [state, setState] = React__namespace.useState(initialState$b);
+  var [state, setState] = React__namespace.useState(initialState$c);
   var cancelQuery = useCancel();
   var getBlockNumber = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -633,7 +633,7 @@ var useBlockNumber = function useBlockNumber() {
   }, getBlockNumber];
 };
 
-var initialState$a = {
+var initialState$b = {
   loading: false
 };
 var useFeeData = function useFeeData() {
@@ -650,7 +650,7 @@ var useFeeData = function useFeeData() {
     watch
   });
   var cacheBuster = useCacheBuster();
-  var [state, setState] = React__namespace.useState(initialState$a);
+  var [state, setState] = React__namespace.useState(initialState$b);
   var cancelQuery = useCancel();
   var getFeeData = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -721,7 +721,7 @@ var useFeeData = function useFeeData() {
   }, getFeeData];
 };
 
-var initialState$9 = {
+var initialState$a = {
   loading: false
 };
 var useBalance = function useBalance() {
@@ -745,7 +745,7 @@ var useBalance = function useBalance() {
     skip: true,
     watch
   });
-  var [state, setState] = React__namespace.useState(initialState$9);
+  var [state, setState] = React__namespace.useState(initialState$a);
   var cancelQuery = useCancel();
   var getBalance = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -832,7 +832,7 @@ var useBalance = function useBalance() {
   }, getBalance];
 };
 
-var initialState$8 = {
+var initialState$9 = {
   loading: false
 };
 var useConnect = () => {
@@ -843,7 +843,7 @@ var useConnect = () => {
     setState: setGlobalState,
     setLastUsedConnector
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$8);
+  var [state, setState] = React__namespace.useState(initialState$9);
   var cancelQuery = useCancel();
   var connect = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (connector) {
@@ -919,7 +919,7 @@ var useConnect = () => {
   }, connect];
 };
 
-var initialState$7 = {
+var initialState$8 = {
   loading: false
 };
 var useNetwork = () => {
@@ -931,7 +931,7 @@ var useNetwork = () => {
       data
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$7);
+  var [state, setState] = React__namespace.useState(initialState$8);
   var chainId = data === null || data === void 0 ? void 0 : (_data$chain = data.chain) === null || _data$chain === void 0 ? void 0 : _data$chain.id;
   var unsupported = data === null || data === void 0 ? void 0 : (_data$chain2 = data.chain) === null || _data$chain2 === void 0 ? void 0 : _data$chain2.unsupported;
   var activeChains = (_connector$chains = connector === null || connector === void 0 ? void 0 : connector.chains) !== null && _connector$chains !== void 0 ? _connector$chains : [];
@@ -999,7 +999,7 @@ var useNetwork = () => {
   }, connector !== null && connector !== void 0 && connector.switchChain ? switchNetwork : undefined];
 };
 
-var initialState$6 = {
+var initialState$7 = {
   data: undefined,
   error: undefined,
   loading: false
@@ -1014,7 +1014,7 @@ var useSigner = function useSigner() {
       connector
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$6);
+  var [state, setState] = React__namespace.useState(initialState$7);
   var cancelQuery = useCancel();
   var getSigner = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -1061,7 +1061,7 @@ var useSigner = function useSigner() {
   return [state, getSigner];
 };
 
-var initialState$5 = {
+var initialState$6 = {
   loading: false
 };
 var useSignMessage = function useSignMessage() {
@@ -1073,7 +1073,7 @@ var useSignMessage = function useSignMessage() {
       connector
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$5);
+  var [state, setState] = React__namespace.useState(initialState$6);
   var cancelQuery = useCancel();
   var signMessage = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -1135,6 +1135,87 @@ var useSignMessage = function useSignMessage() {
   }, signMessage];
 };
 
+var initialState$5 = {
+  loading: false
+};
+var useSignTypedData = function useSignTypedData() {
+  var {
+    domain,
+    types,
+    value
+  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var {
+    state: {
+      connector
+    }
+  } = useContext();
+  var [state, setState] = React__namespace.useState(initialState$5);
+  var cancelQuery = useCancel();
+  var signTypedData = React__namespace.useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(function* (config) {
+      var didCancel = false;
+      cancelQuery(() => {
+        didCancel = true;
+      });
+
+      try {
+        var config_ = config !== null && config !== void 0 ? config : {
+          domain,
+          types,
+          value
+        };
+        if (!config_.domain) throw new Error('domain is required');
+        if (!config_.types) throw new Error('type is required');
+        if (!config_.value) throw new Error('value is required');
+        if (!connector) throw new wagmiCore.ConnectorNotFoundError();
+        setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+          error: undefined,
+          loading: true
+        }));
+        var signer = yield connector.getSigner(); // Method name may be changed in the future, see https://docs.ethers.io/v5/api/signer/#Signer-signTypedData
+
+        var signature = yield signer._signTypedData(config_.domain, config_.types, config_.value);
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            signature,
+            loading: false
+          }));
+        }
+
+        return {
+          data: signature,
+          error: undefined
+        };
+      } catch (error_) {
+        var error = error_;
+        if (error_.code === 4001) error = new wagmiCore.UserRejectedRequestError();
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            error,
+            loading: false
+          }));
+        }
+
+        return {
+          data: undefined,
+          error
+        };
+      }
+    });
+
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [cancelQuery, connector, domain, types, value]);
+  return [{
+    data: state.signature,
+    error: state.error,
+    loading: state.loading
+  }, signTypedData];
+};
+
 var getContract = _ref => {
   var {
     addressOrName,
@@ -1883,6 +1964,7 @@ exports.useFeeData = useFeeData;
 exports.useNetwork = useNetwork;
 exports.useProvider = useProvider;
 exports.useSignMessage = useSignMessage;
+exports.useSignTypedData = useSignTypedData;
 exports.useSigner = useSigner;
 exports.useToken = useToken;
 exports.useTransaction = useTransaction;

package/dist/wagmi.cjs.prod.js

@@ -172,7 +172,7 @@ var useLocalStorage = function useLocalStorage(key) {
   return [value, setLocalStorage];
 };
 
-var initialState$f = {
+var initialState$g = {
   loading: false
 };
 var useEnsAvatar = function useEnsAvatar() {
@@ -182,7 +182,7 @@ var useEnsAvatar = function useEnsAvatar() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$f);
+  var [state, setState] = React__namespace.useState(initialState$g);
   var cancelQuery = useCancel();
   var getEnsAvatar = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -247,7 +247,7 @@ var useEnsAvatar = function useEnsAvatar() {
   }, getEnsAvatar];
 };
 
-var initialState$e = {
+var initialState$f = {
   loading: false
 };
 var useEnsLookup = function useEnsLookup() {
@@ -257,7 +257,7 @@ var useEnsLookup = function useEnsLookup() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$e);
+  var [state, setState] = React__namespace.useState(initialState$f);
   var cancelQuery = useCancel();
   var lookupAddress = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -328,7 +328,7 @@ var useEnsLookup = function useEnsLookup() {
   }, lookupAddress];
 };
 
-var initialState$d = {
+var initialState$e = {
   loading: false
 };
 var useEnsResolveName = function useEnsResolveName() {
@@ -338,7 +338,7 @@ var useEnsResolveName = function useEnsResolveName() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$d);
+  var [state, setState] = React__namespace.useState(initialState$e);
   var cancelQuery = useCancel();
   var resolveName = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -409,7 +409,7 @@ var useEnsResolveName = function useEnsResolveName() {
   }, resolveName];
 };
 
-var initialState$c = {
+var initialState$d = {
   loading: false
 };
 var useEnsResolver = function useEnsResolver() {
@@ -419,7 +419,7 @@ var useEnsResolver = function useEnsResolver() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React__namespace.useState(initialState$c);
+  var [state, setState] = React__namespace.useState(initialState$d);
   var cancelQuery = useCancel();
   var getEnsResolver = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -543,7 +543,7 @@ var useAccount = function useAccount() {
   }, disconnect];
 };
 
-var initialState$b = {
+var initialState$c = {
   loading: false
 };
 var useBlockNumber = function useBlockNumber() {
@@ -554,7 +554,7 @@ var useBlockNumber = function useBlockNumber() {
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
   var webSocketProvider = useWebSocketProvider();
-  var [state, setState] = React__namespace.useState(initialState$b);
+  var [state, setState] = React__namespace.useState(initialState$c);
   var cancelQuery = useCancel();
   var getBlockNumber = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -633,7 +633,7 @@ var useBlockNumber = function useBlockNumber() {
   }, getBlockNumber];
 };
 
-var initialState$a = {
+var initialState$b = {
   loading: false
 };
 var useFeeData = function useFeeData() {
@@ -650,7 +650,7 @@ var useFeeData = function useFeeData() {
     watch
   });
   var cacheBuster = useCacheBuster();
-  var [state, setState] = React__namespace.useState(initialState$a);
+  var [state, setState] = React__namespace.useState(initialState$b);
   var cancelQuery = useCancel();
   var getFeeData = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -721,7 +721,7 @@ var useFeeData = function useFeeData() {
   }, getFeeData];
 };
 
-var initialState$9 = {
+var initialState$a = {
   loading: false
 };
 var useBalance = function useBalance() {
@@ -745,7 +745,7 @@ var useBalance = function useBalance() {
     skip: true,
     watch
   });
-  var [state, setState] = React__namespace.useState(initialState$9);
+  var [state, setState] = React__namespace.useState(initialState$a);
   var cancelQuery = useCancel();
   var getBalance = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -832,7 +832,7 @@ var useBalance = function useBalance() {
   }, getBalance];
 };
 
-var initialState$8 = {
+var initialState$9 = {
   loading: false
 };
 var useConnect = () => {
@@ -843,7 +843,7 @@ var useConnect = () => {
     setState: setGlobalState,
     setLastUsedConnector
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$8);
+  var [state, setState] = React__namespace.useState(initialState$9);
   var cancelQuery = useCancel();
   var connect = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (connector) {
@@ -919,7 +919,7 @@ var useConnect = () => {
   }, connect];
 };
 
-var initialState$7 = {
+var initialState$8 = {
   loading: false
 };
 var useNetwork = () => {
@@ -931,7 +931,7 @@ var useNetwork = () => {
       data
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$7);
+  var [state, setState] = React__namespace.useState(initialState$8);
   var chainId = data === null || data === void 0 ? void 0 : (_data$chain = data.chain) === null || _data$chain === void 0 ? void 0 : _data$chain.id;
   var unsupported = data === null || data === void 0 ? void 0 : (_data$chain2 = data.chain) === null || _data$chain2 === void 0 ? void 0 : _data$chain2.unsupported;
   var activeChains = (_connector$chains = connector === null || connector === void 0 ? void 0 : connector.chains) !== null && _connector$chains !== void 0 ? _connector$chains : [];
@@ -999,7 +999,7 @@ var useNetwork = () => {
   }, connector !== null && connector !== void 0 && connector.switchChain ? switchNetwork : undefined];
 };
 
-var initialState$6 = {
+var initialState$7 = {
   data: undefined,
   error: undefined,
   loading: false
@@ -1014,7 +1014,7 @@ var useSigner = function useSigner() {
       connector
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$6);
+  var [state, setState] = React__namespace.useState(initialState$7);
   var cancelQuery = useCancel();
   var getSigner = React__namespace.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -1061,7 +1061,7 @@ var useSigner = function useSigner() {
   return [state, getSigner];
 };
 
-var initialState$5 = {
+var initialState$6 = {
   loading: false
 };
 var useSignMessage = function useSignMessage() {
@@ -1073,7 +1073,7 @@ var useSignMessage = function useSignMessage() {
       connector
     }
   } = useContext();
-  var [state, setState] = React__namespace.useState(initialState$5);
+  var [state, setState] = React__namespace.useState(initialState$6);
   var cancelQuery = useCancel();
   var signMessage = React__namespace.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -1135,6 +1135,87 @@ var useSignMessage = function useSignMessage() {
   }, signMessage];
 };
 
+var initialState$5 = {
+  loading: false
+};
+var useSignTypedData = function useSignTypedData() {
+  var {
+    domain,
+    types,
+    value
+  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var {
+    state: {
+      connector
+    }
+  } = useContext();
+  var [state, setState] = React__namespace.useState(initialState$5);
+  var cancelQuery = useCancel();
+  var signTypedData = React__namespace.useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(function* (config) {
+      var didCancel = false;
+      cancelQuery(() => {
+        didCancel = true;
+      });
+
+      try {
+        var config_ = config !== null && config !== void 0 ? config : {
+          domain,
+          types,
+          value
+        };
+        if (!config_.domain) throw new Error('domain is required');
+        if (!config_.types) throw new Error('type is required');
+        if (!config_.value) throw new Error('value is required');
+        if (!connector) throw new wagmiCore.ConnectorNotFoundError();
+        setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+          error: undefined,
+          loading: true
+        }));
+        var signer = yield connector.getSigner(); // Method name may be changed in the future, see https://docs.ethers.io/v5/api/signer/#Signer-signTypedData
+
+        var signature = yield signer._signTypedData(config_.domain, config_.types, config_.value);
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            signature,
+            loading: false
+          }));
+        }
+
+        return {
+          data: signature,
+          error: undefined
+        };
+      } catch (error_) {
+        var error = error_;
+        if (error_.code === 4001) error = new wagmiCore.UserRejectedRequestError();
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            error,
+            loading: false
+          }));
+        }
+
+        return {
+          data: undefined,
+          error
+        };
+      }
+    });
+
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [cancelQuery, connector, domain, types, value]);
+  return [{
+    data: state.signature,
+    error: state.error,
+    loading: state.loading
+  }, signTypedData];
+};
+
 var getContract = _ref => {
   var {
     addressOrName,
@@ -1883,6 +1964,7 @@ exports.useFeeData = useFeeData;
 exports.useNetwork = useNetwork;
 exports.useProvider = useProvider;
 exports.useSignMessage = useSignMessage;
+exports.useSignTypedData = useSignTypedData;
 exports.useSigner = useSigner;
 exports.useToken = useToken;
 exports.useTransaction = useTransaction;

package/dist/wagmi.esm.js

@@ -149,7 +149,7 @@ var useLocalStorage = function useLocalStorage(key) {
   return [value, setLocalStorage];
 };
 
-var initialState$f = {
+var initialState$g = {
   loading: false
 };
 var useEnsAvatar = function useEnsAvatar() {
@@ -159,7 +159,7 @@ var useEnsAvatar = function useEnsAvatar() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React.useState(initialState$f);
+  var [state, setState] = React.useState(initialState$g);
   var cancelQuery = useCancel();
   var getEnsAvatar = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -224,7 +224,7 @@ var useEnsAvatar = function useEnsAvatar() {
   }, getEnsAvatar];
 };
 
-var initialState$e = {
+var initialState$f = {
   loading: false
 };
 var useEnsLookup = function useEnsLookup() {
@@ -234,7 +234,7 @@ var useEnsLookup = function useEnsLookup() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React.useState(initialState$e);
+  var [state, setState] = React.useState(initialState$f);
   var cancelQuery = useCancel();
   var lookupAddress = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -305,7 +305,7 @@ var useEnsLookup = function useEnsLookup() {
   }, lookupAddress];
 };
 
-var initialState$d = {
+var initialState$e = {
   loading: false
 };
 var useEnsResolveName = function useEnsResolveName() {
@@ -315,7 +315,7 @@ var useEnsResolveName = function useEnsResolveName() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React.useState(initialState$d);
+  var [state, setState] = React.useState(initialState$e);
   var cancelQuery = useCancel();
   var resolveName = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -386,7 +386,7 @@ var useEnsResolveName = function useEnsResolveName() {
   }, resolveName];
 };
 
-var initialState$c = {
+var initialState$d = {
   loading: false
 };
 var useEnsResolver = function useEnsResolver() {
@@ -396,7 +396,7 @@ var useEnsResolver = function useEnsResolver() {
   } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
-  var [state, setState] = React.useState(initialState$c);
+  var [state, setState] = React.useState(initialState$d);
   var cancelQuery = useCancel();
   var getEnsResolver = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -520,7 +520,7 @@ var useAccount = function useAccount() {
   }, disconnect];
 };
 
-var initialState$b = {
+var initialState$c = {
   loading: false
 };
 var useBlockNumber = function useBlockNumber() {
@@ -531,7 +531,7 @@ var useBlockNumber = function useBlockNumber() {
   var cacheBuster = useCacheBuster();
   var provider = useProvider();
   var webSocketProvider = useWebSocketProvider();
-  var [state, setState] = React.useState(initialState$b);
+  var [state, setState] = React.useState(initialState$c);
   var cancelQuery = useCancel();
   var getBlockNumber = React.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -610,7 +610,7 @@ var useBlockNumber = function useBlockNumber() {
   }, getBlockNumber];
 };
 
-var initialState$a = {
+var initialState$b = {
   loading: false
 };
 var useFeeData = function useFeeData() {
@@ -627,7 +627,7 @@ var useFeeData = function useFeeData() {
     watch
   });
   var cacheBuster = useCacheBuster();
-  var [state, setState] = React.useState(initialState$a);
+  var [state, setState] = React.useState(initialState$b);
   var cancelQuery = useCancel();
   var getFeeData = React.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -698,7 +698,7 @@ var useFeeData = function useFeeData() {
   }, getFeeData];
 };
 
-var initialState$9 = {
+var initialState$a = {
   loading: false
 };
 var useBalance = function useBalance() {
@@ -722,7 +722,7 @@ var useBalance = function useBalance() {
     skip: true,
     watch
   });
-  var [state, setState] = React.useState(initialState$9);
+  var [state, setState] = React.useState(initialState$a);
   var cancelQuery = useCancel();
   var getBalance = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -809,7 +809,7 @@ var useBalance = function useBalance() {
   }, getBalance];
 };
 
-var initialState$8 = {
+var initialState$9 = {
   loading: false
 };
 var useConnect = () => {
@@ -820,7 +820,7 @@ var useConnect = () => {
     setState: setGlobalState,
     setLastUsedConnector
   } = useContext();
-  var [state, setState] = React.useState(initialState$8);
+  var [state, setState] = React.useState(initialState$9);
   var cancelQuery = useCancel();
   var connect = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (connector) {
@@ -896,7 +896,7 @@ var useConnect = () => {
   }, connect];
 };
 
-var initialState$7 = {
+var initialState$8 = {
   loading: false
 };
 var useNetwork = () => {
@@ -908,7 +908,7 @@ var useNetwork = () => {
       data
     }
   } = useContext();
-  var [state, setState] = React.useState(initialState$7);
+  var [state, setState] = React.useState(initialState$8);
   var chainId = data === null || data === void 0 ? void 0 : (_data$chain = data.chain) === null || _data$chain === void 0 ? void 0 : _data$chain.id;
   var unsupported = data === null || data === void 0 ? void 0 : (_data$chain2 = data.chain) === null || _data$chain2 === void 0 ? void 0 : _data$chain2.unsupported;
   var activeChains = (_connector$chains = connector === null || connector === void 0 ? void 0 : connector.chains) !== null && _connector$chains !== void 0 ? _connector$chains : [];
@@ -976,7 +976,7 @@ var useNetwork = () => {
   }, connector !== null && connector !== void 0 && connector.switchChain ? switchNetwork : undefined];
 };
 
-var initialState$6 = {
+var initialState$7 = {
   data: undefined,
   error: undefined,
   loading: false
@@ -991,7 +991,7 @@ var useSigner = function useSigner() {
       connector
     }
   } = useContext();
-  var [state, setState] = React.useState(initialState$6);
+  var [state, setState] = React.useState(initialState$7);
   var cancelQuery = useCancel();
   var getSigner = React.useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
     var didCancel = false;
@@ -1038,7 +1038,7 @@ var useSigner = function useSigner() {
   return [state, getSigner];
 };
 
-var initialState$5 = {
+var initialState$6 = {
   loading: false
 };
 var useSignMessage = function useSignMessage() {
@@ -1050,7 +1050,7 @@ var useSignMessage = function useSignMessage() {
       connector
     }
   } = useContext();
-  var [state, setState] = React.useState(initialState$5);
+  var [state, setState] = React.useState(initialState$6);
   var cancelQuery = useCancel();
   var signMessage = React.useCallback( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator(function* (config) {
@@ -1112,6 +1112,87 @@ var useSignMessage = function useSignMessage() {
   }, signMessage];
 };
 
+var initialState$5 = {
+  loading: false
+};
+var useSignTypedData = function useSignTypedData() {
+  var {
+    domain,
+    types,
+    value
+  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var {
+    state: {
+      connector
+    }
+  } = useContext();
+  var [state, setState] = React.useState(initialState$5);
+  var cancelQuery = useCancel();
+  var signTypedData = React.useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(function* (config) {
+      var didCancel = false;
+      cancelQuery(() => {
+        didCancel = true;
+      });
+
+      try {
+        var config_ = config !== null && config !== void 0 ? config : {
+          domain,
+          types,
+          value
+        };
+        if (!config_.domain) throw new Error('domain is required');
+        if (!config_.types) throw new Error('type is required');
+        if (!config_.value) throw new Error('value is required');
+        if (!connector) throw new ConnectorNotFoundError();
+        setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+          error: undefined,
+          loading: true
+        }));
+        var signer = yield connector.getSigner(); // Method name may be changed in the future, see https://docs.ethers.io/v5/api/signer/#Signer-signTypedData
+
+        var signature = yield signer._signTypedData(config_.domain, config_.types, config_.value);
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            signature,
+            loading: false
+          }));
+        }
+
+        return {
+          data: signature,
+          error: undefined
+        };
+      } catch (error_) {
+        var error = error_;
+        if (error_.code === 4001) error = new UserRejectedRequestError();
+
+        if (!didCancel) {
+          setState(x => _objectSpread2(_objectSpread2({}, x), {}, {
+            error,
+            loading: false
+          }));
+        }
+
+        return {
+          data: undefined,
+          error
+        };
+      }
+    });
+
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), [cancelQuery, connector, domain, types, value]);
+  return [{
+    data: state.signature,
+    error: state.error,
+    loading: state.loading
+  }, signTypedData];
+};
+
 var getContract = _ref => {
   var {
     addressOrName,
@@ -1772,4 +1853,4 @@ var useContext = () => {
   return context;
 };
 
-export { Context, Provider, Provider as WagmiProvider, useAccount, useBalance, useBlockNumber, useConnect, useContext, useContract, useContractEvent, useContractRead, useContractWrite, useEnsAvatar, useEnsLookup, useEnsResolveName, useEnsResolver, useFeeData, useNetwork, useProvider, useSignMessage, useSigner, useToken, useTransaction, useWaitForTransaction, useWebSocketProvider };
+export { Context, Provider, Provider as WagmiProvider, useAccount, useBalance, useBlockNumber, useConnect, useContext, useContract, useContractEvent, useContractRead, useContractWrite, useEnsAvatar, useEnsLookup, useEnsResolveName, useEnsResolver, useFeeData, useNetwork, useProvider, useSignMessage, useSignTypedData, useSigner, useToken, useTransaction, useWaitForTransaction, useWebSocketProvider };

package/package.json

@@ -2,10 +2,10 @@
   "name": "wagmi",
   "description": "React Hooks library for Ethereum",
   "license": "MIT",
-  "version": "0.2.18",
+  "version": "0.2.21",
   "ethereum": "awkweb.eth",
   "repository": "tmm/wagmi",
-  "homepage": "https://wagmi-xyz.vercel.app",
+  "homepage": "https://wagmi.sh",
   "sideEffects": false,
   "main": "dist/wagmi.cjs.js",
   "module": "dist/wagmi.esm.js",
@@ -46,18 +46,17 @@
   },
   "dependencies": {
     "@ethersproject/providers": "^5.5.1",
-    "@walletconnect/ethereum-provider": "1.7.4",
-    "wagmi-core": "0.1.14",
+    "@walletconnect/ethereum-provider": "1.7.5",
+    "wagmi-core": "0.1.15",
     "walletlink": "^2.5.0"
   },
   "devDependencies": {
     "@testing-library/react-hooks": "^7.0.2",
     "@types/react": "^17.0.0",
-    "wagmi-testing": "0.1.14",
-    "@walletconnect/ethereum-provider": "1.7.4",
     "ethers": "^5.5.1",
     "react": "^17.0.0",
+    "wagmi-testing": "0.1.15",
     "walletlink": "^2.5.0"
   },
-  "readme": "# wagmi\n\nReact Hooks library for Ethereum, built on [ethers.js](https://github.com/ethers-io/ethers.js).\n\n<p>\n  <a aria-label=\"Version\" href=\"https://www.npmjs.com/package/wagmi\">\n    <img\n      alt=\"\"\n      src=\"https://img.shields.io/npm/v/wagmi?color=%23161b22&label=%20npm\"\n    />\n  </a>\n  <a aria-label=\"License\" href=\"/LICENSE\">\n    <img\n      alt=\"\"\n      src=\"https://img.shields.io/npm/l/wagmi?color=%23161b22\"\n    />\n  </a>\n  <a aria-label=\"Sponsors\" href=\"https://github.com/sponsors/tmm\">\n    <img\n      alt=\"\"\n      src=\"https://img.shields.io/github/sponsors/tmm?color=%23161b22\"\n    />\n  </a>\n  <a aria-label=\"Downloads\" href=\"https://www.npmjs.com/package/wagmi\">\n    <img\n      alt=\"\"\n      src=\"https://img.shields.io/npm/dm/wagmi?color=%23161b22\"\n    />\n  </a>\n</p>\n\n## Features\n\n- 🚀 20+ hooks for working with wallets, ENS, contracts, transactions, signing, etc.\n- 💼 Built-in wallet connectors for MetaMask, WalletConnect, and Coinbase Wallet\n- 🌀 Auto-refresh data on wallet and network changes\n- 🦄 TypeScript ready\n- 💨 Zero-dependencies (besides ethers.js peer dependency)\n- 🌳 Test suite and documentation\n- 📖 MIT License\n\n## Documentation\n\nVisit https://wagmi-xyz.vercel.app to view the full documentation.\n\n## Usage\n\n1. Install the dependencies.\n\n```bash\nnpm add wagmi ethers\n```\n\n2. Wrap your app with the `Provider` component.\n\n```tsx\nimport { Provider } from 'wagmi'\n\nconst App = () => (\n  <Provider>\n    <YourRoutes />\n  </Provider>\n)\n```\n\n3. Use hooks.\n\n```tsx\nimport { useAccount } from 'wagmi'\n\nconst Page = () => {\n  const [{ data, error, loading }, disconnect] = useAccount({\n    fetchEns: true,\n  })\n\n  return ...\n}\n```\n\nEvery component inside the `Provider` is set up with the default `InjectedConnector` for connecting wallets and ethers.js [Default Provider](https://docs.ethers.io/v5/api/providers/#providers-getDefaultProvider) for fetching data.\n\nWant to learn more? Check out the [guides](https://wagmi-xyz.vercel.app/guides/connect-wallet) or browse the [API docs](https://wagmi-xyz.vercel.app/docs/provider).\n\n## Community\n\n- Join the [discussions on GitHub](https://github.com/tmm/wagmi/discussions)\n- Follow [@awkweb](https://twitter.com/awkweb) on Twitter for project updates\n- Sign the [guestbook](https://github.com/tmm/wagmi/discussions/2)\n- Share [your project/organization](https://github.com/tmm/wagmi/discussions/201) that uses wagmi\n\n## Support\n\n- awkweb.eth\n- [GitHub Sponsors](https://github.com/sponsors/tmm)\n- [Gitcoin Grant](https://gitcoin.co/grants/4493/wagmi-react-hooks-library-for-ethereum)\n\n## Thanks\n\n- [ricmoo.eth](https://twitter.com/ricmoo) for creating and continued work on [ethers.js](https://github.com/ethers-io/ethers.js)\n- [Mirror](https://mirror.xyz) for creating space to do good work\n\n## License\n\nMIT.\n\n<br />\n\nwagmi\n"
+  "readme": "# wagmi [![Version](https://img.shields.io/npm/v/wagmi)](https://www.npmjs.com/package/wagmi) [![Downloads](https://img.shields.io/npm/dm/wagmi)](https://www.npmjs.com/package/wagmi) [![Sponsors](https://img.shields.io/github/sponsors/tmm)](https://github.com/sponsors/tmm)\n\nReact Hooks library for Ethereum, built on [ethers.js](https://github.com/ethers-io/ethers.js).\n\n## Features\n\n- 🚀 20+ hooks for working with wallets, ENS, contracts, transactions, signing, etc.\n- 💼 Built-in wallet connectors for MetaMask, WalletConnect, and Coinbase Wallet\n- 🌀 Auto-refresh data on wallet and network changes\n- 🦄 TypeScript ready\n- 💨 Zero-dependencies (besides ethers.js peer dependency)\n- 🌳 Test suite and documentation\n- 📖 MIT License\n\n## Documentation\n\nVisit https://wagmi.sh to view the full documentation.\n\n## Usage\n\n1. Install the dependencies.\n\n```bash\nnpm add wagmi ethers\n```\n\n2. Wrap your app with the `Provider` component.\n\n```tsx\nimport { Provider } from 'wagmi'\n\nconst App = () => (\n  <Provider>\n    <YourRoutes />\n  </Provider>\n)\n```\n\n3. Use hooks.\n\n```tsx\nimport { useAccount } from 'wagmi'\n\nconst Page = () => {\n  const [{ data, error, loading }, disconnect] = useAccount({\n    fetchEns: true,\n  })\n\n  return ...\n}\n```\n\nEvery component inside the `Provider` is set up with the default `InjectedConnector` for connecting wallets and ethers.js [Default Provider](https://docs.ethers.io/v5/api/providers/#providers-getDefaultProvider) for fetching data.\n\nWant to learn more? Check out the [guides](https://wagmi-xyz.vercel.app/guides/connect-wallet) or browse the [API docs](https://wagmi-xyz.vercel.app/docs/provider).\n\n## Community\n\n- Join the [discussions on GitHub](https://github.com/tmm/wagmi/discussions)\n- Follow [@awkweb](https://twitter.com/awkweb) on Twitter for project updates\n- Sign the [guestbook](https://github.com/tmm/wagmi/discussions/2)\n- Share [your project/organization](https://github.com/tmm/wagmi/discussions/201) that uses wagmi\n\n## Support\n\n- awkweb.eth\n- [GitHub Sponsors](https://github.com/sponsors/tmm)\n- [Gitcoin Grant](https://gitcoin.co/grants/4493/wagmi-react-hooks-library-for-ethereum)\n\n## Thanks\n\n- [ricmoo.eth](https://twitter.com/ricmoo) for creating and continued work on [ethers.js](https://github.com/ethers-io/ethers.js)\n- [Mirror](https://mirror.xyz) for creating space to do good work\n\n## License\n\nMIT.\n\n<br />\n\nwagmi\n"
 }