JavaScript Client SDK library built with Typescript that provides an interface for NiftyKit Drops.
- Install via npm
npm install dropkit.js
- Import via CDN
<script src="https://unpkg.com/dropkit.js/dist/umd/index.js"></script>
<!-- Import DropKit.js library -->
<script src="https://unpkg.com/dropkit.js/dist/umd/index.js"></script>
<script>
document.getElementById('mint_btn').onclick = async function mint() {
const drop = await DropKit.create('sdk-api-key-here'); // Supply API key
await drop.mint(1); // Number of NFTs to mint
}
</script>
This package uses Web3modal, which allows you to connect to multiple wallets. See the Providers Options
You can add your custom providers into the create
method like this:
import Torus from '@toruslabs/torus-embed'
import WalletConnectProvider from '@walletconnect/web3-provider'
import WalletLink from 'walletlink'
const providers = {
walletconnect: {
package: WalletConnectProvider,
options: {
infuraId: YOUR_INFURA_ID,
},
},
torus: {
package: Torus,
},
walletlink: {
package: WalletLink,
options: {
infuraId: YOUR_INFURA_ID,
},
},
}
// and then init the Dropkit instance
const dropkit = await DropKit.create('sdk-api-key-here', false, providers);
You can optionally pass in a custom provider to the create
method, which will be used instead of the Web3Provider
.
import { ethers } from 'ethers';
const provider = new ethers.providers.JsonRpcProvider(
'YOUR_RPC_URL',
);
const isDev = false;
const web3ModalProviders = {
walletconnect: {
package: WalletConnectProvider,
options: {
infuraId: YOUR_INFURA_ID,
},
},
torus: {
package: Torus,
},
walletlink: {
package: WalletLink,
options: {
infuraId: YOUR_INFURA_ID,
},
},
}
const drop = await DropKit.create('sdk-api-key-here', isDev, web3ModalProviders, provider);
// Minted to the connected wallet
drop.onMintedToWallet((...args) => {
console.log(
`[onMintedToWallet] TokenId: ${args[2]}, From ${args[0]}, To ${args[1]}`
);
});
// Minted from any wallet
drop.onMinted((...args) => {
console.log(
`[onMinted] TokenId: ${args[2]}, From ${args[0]}, To ${args[1]}`
);
});
class DropKit {
static create(key: string, isDev?: boolean, providerOptions?: IProviderOptions): Promise<DropKit | null>;
static getCollectionData(key: string, isDev?: boolean): Promise<DropApiResponse & ErrorApiResponse>;
price(): Promise<BigNumber>;
maxPerMint(): Promise<number>;
maxPerWallet(): Promise<number>;
maxAmount(): Promise<number>;
walletTokensCount(): Promise<number>;
totalSupply(): Promise<number>;
saleActive(): Promise<boolean>;
presaleActive(): Promise<boolean>;
auctionActive(): Promise<boolean>;
auctionDuration(): Promise<number>;
auctionPrice(): Promise<BigNumber>;
auctionStartedAt(): Promise<number>;
generateProof(): Promise<ProofApiResponse & ErrorApiResponse>;
mint(quantity: number): Promise<ContractReceipt | null>;
onMinted(listener: Listener): Contract;
onMintedToWallet(listener: Listener): Contract;
mintedToWalletListeners(): Listener[];
mintedListeners(): Listener[];
removeAllListeners(): Contract;
}