SDK UI for Apps

Requirements

• Tailwind CSS

Installation

Install the package using one of the following commands:

• Using Yarn:

  yarn add @oneid-xyz/app-ui-react

• Using npm:

  npm install @oneid-xyz/app-ui-react

• Using pnpm:

  pnpm i @oneid-xyz/app-ui-react

Setup

Configure Tailwind CSS

In your tailwind.config.js, add the following configuration:

const { classTailwind } = require('@oneid-xyz/app-ui-react');

module.exports = {
    content: [
        // Other content paths...
        './node_modules/@oneid-xyz/app-ui-react/dist/**/*.js',
    ],

    theme: {
        extend: {
            colors: {
                ...classTailwind,
            },
        },
    },
};

Import SDK Styles

Import the SDK styles in your layout page:

import '@oneid-xyz/app-ui-react/styles.css';

Usage

To use the SDK in your component, you can import the necessary components as follows:

import { Miniapp } from '@oneid-xyz/app-ui-react';
import Script from 'next/script';

export default function Home() {
  const address = ''; // Replace with your EVM address

  return (
    <div>
      <Miniapp address={address}/>
    </div>
  );
}

Props

address: The EVM address to be used with the app.

More documentation

More documentation and code examples can be found at https://docs.oneid.xyz/developers-guide/oneid-sdk.

Support

Should you encounter any technical issues during integration, please contact [email protected] team via the Customer Experience Portal which also includes support documentation.