Lit Protocol Javascript/Typescript SDK V2

The Lit JavaScript SDK provides developers with a framework for implementing Lit functionality into their own applications. Find installation instructions in the docs to get started with the Lit SDK based on your use case:

https://developer.litprotocol.com/SDK/Explanation/installation

This new V2 SDK is written in Typescript and is a complete rewrite of the old SDK. It is much more modular and easier to use, and has a much smaller bundle size.

yarn add @lit-protocol/lit-node-client-nodejs

yarn add @lit-protocol/lit-node-client

<script src="https://cdn.jsdelivr.net/npm/@lit-protocol/lit-node-client-vanilla/lit-node-client.js"></script>
<script>
  const authSig = LitJsSdk_litNodeClient.checkAndSignAuthMessage({chain: 'ethereum'});
</script>

Packages

📝 If you're looking to use the Lit SDK, you're probably all set with just the lit-node-client .
Get started with interacting with Lit network!

Package	Category	Version	Download
@lit-protocol/lit-node-client-nodejs		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/lit-node-client		2.2.50	npm Vanilla JS (UMD)

If you're a tech-savvy user and wish to utilize only specific submodules that our main module relies upon, you can find individual packages listed below. This way, you can import only the necessary packages that cater to your specific use case::

Package	Category	Version	Download
@lit-protocol/access-control-conditions		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/auth-helpers		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/bls-sdk		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/constants		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/contracts-sdk		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/core		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/crypto		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/ecdsa-sdk		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/encryption		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/lit-third-party-libs		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/misc		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/nacl		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-base		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-client		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-cosmos		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-ethers		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-sui		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/pkp-walletconnect		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/types		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/uint8arrays		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/auth-browser		2.2.50	npm Vanilla JS (UMD)
@lit-protocol/misc-browser		2.2.50	npm Vanilla JS (UMD)

API Doc

http://docs.lit-js-sdk-v2.litprotocol.com/

NOTE: For (Test) apps, all packages and functions can be called inside the browser console. eg. window.LitJsSdk_[package_name].[function_name]

• node (v18.0.0)

• NX Console: https://nx.dev/core-features/integrate-with-editors

The following commands will help you start developing with this repository.

First, install the dependencies via yarn:

yarn

You can build the project with the following command:

yarn build

The test apps are configured to automatically import all modules and expose all module functions. For browsers, you can access these functions using window.LitJsSdk_<package_name>.<function_name>

// Running apps...
// html: http://localhost:4002
// react: http://localhost:4003
// nodejs: in the terminal
yarn apps

or runniny individually

// html
yarn nx run html:serve

// react
yarn nx run react:serve

// nodejs
yarn nx run nodejs:serve

yarn test:unit

yarn test:e2e

By default, NX provides a command to generate a library nx generate @nrwl/js:library. However, it doesn't have an esbuild built-in so that we've created a custom tool that modify the build commands.

yarn gen:lib <package-name> <tag>

yarn tools --create --react contracts-sdk --demo

// delete an app from ./app/<app-name>
yarn delete:app <app-name>

// delete a package from ./packages/<package-name>
yarn delete:package <package-name>

yarn build

yarn nx run <project-name>:build

During development you may wish to build your code changes in packages/ in a client application to test the correctness of the functionality.

If you would like to establish a dependency between packages within this monorepo and an external client application that consumes these packages,

1. Run npm link at the root of the specific package you are making code changes in.
2. Run yarn build:target <package> to build that specific package.
3. In the client application, run npm link <package> --force to ensure that the package.json of the client application is updated with a file: link to the dependency. This effectively creates a symlink in the node_modules of the client application to the local dependency in this repository.

Having done this setup, this is what the development cycle looks like moving forward:

1. Make code change
2. Rebuild specific package
3. Rebuild client application.

Run yarn bump to bump the version. You must have at least nodejs v18 to do this. Next, run yarn buildAndPublish to build and then publish.

yarn publish:packages

yarn tools --clone <project-name> <clone-project-name> <(?) --publish> <(?) --remove-after>

// eg
yarn tools --clone lit-node-client @litprotocol/dev --publish --remove-after

yarn bump
yarn build
yarn test:unit
yarn test:e2e
yarn gen:docs --push
yarn publish:packages
git add *
git commit -m "Published version X.X.X"
git push

The following will serve the react testing app and launch the cypress e2e testing after

yarn test:e2e

There are currently three environments can be tested on, each of which can be generated from a custom command, which would automatically import all the libraries in ./packages/*. The UI of HTML & React are visually identical but they are using different libraries.

yarn test:unit

Since both HTML & React UIs are identical, we can run the same test suite against two different environments of libraries. This is done by setting the PORT number before Cypress launch.

HTML

// E2E HTML
yarn tools --test --e2e html

React

// E2E React
yarn tools --test --e2e react

yarn graph

  "scripts": {
    "start": "GENERATE_SOURCEMAP=false react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

"_buildWeb": {
    "executor": "@websaam/nx-esbuild:package",
    "options": {
      "banner": {
        "js": "import { createRequire } from 'module';const require = createRequire(import.meta.url);"
      },
      "globalName": "LitJsSdk_CoreBrowser",
      "outfile":"dist/packages/core-browser-vanilla/core-browser.js",
      "entryPoints": ["./packages/core-browser/src/index.ts"],
      "define": { "global": "window" },
      "plugins":[
        {
          "package": "esbuild-node-builtins",
          "function": "nodeBuiltIns"
        }
      ]
    }
  }

import crypto, { createHash } from 'crypto';
Object.defineProperty(globalThis, 'crypto', {
  value: {
    getRandomValues: (arr: any) => crypto.randomBytes(arr.length),
    subtle: {
      digest: (algorithm: string, data: Uint8Array) => {
        return new Promise((resolve, reject) =>
          resolve(
            createHash(algorithm.toLowerCase().replace('-', ''))
              .update(data)
              .digest()
          )
        );
      },
    },
  },
});