initialize new project

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1,5 @@
+build/
+dist/
+node_modules/
+.snapshots/
+*.min.js

.eslintrc

@@ -0,0 +1,35 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "extends": [
+    "standard",
+    "standard-react",
+    "plugin:prettier/recommended",
+    "prettier/standard",
+    "prettier/react",
+    "plugin:@typescript-eslint/eslint-recommended"
+  ],
+  "env": {
+    "node": true
+  },
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "ecmaFeatures": {
+      "legacyDecorators": true,
+      "jsx": true
+    }
+  },
+  "settings": {
+    "react": {
+      "version": "16"
+    }
+  },
+  "rules": {
+    "space-before-function-paren": 0,
+    "react/prop-types": 0,
+    "react/jsx-handler-names": 0,
+    "react/jsx-fragments": 0,
+    "react/no-unused-prop-types": 0,
+    "import/export": 0,
+    "no-unused-vars": "off"
+  }
+}

.gitignore

@@ -0,0 +1,23 @@
+
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+
+# builds
+build
+dist
+.rpt2_cache
+
+# misc
+.DS_Store
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+.vscode
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

.prettierrc

@@ -0,0 +1,10 @@
+{
+  "singleQuote": true,
+  "jsxSingleQuote": true,
+  "semi": false,
+  "tabWidth": 2,
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false,
+  "arrowParens": "always",
+  "trailingComma": "none"
+}

.travis.yml

@@ -0,0 +1,4 @@
+language: node_js
+node_js:
+  - 12
+  - 10

README.md

@@ -0,0 +1,64 @@
+# agora-react-uikit
+
+> A React based UIKit for the Agora Web SDK
+
+[![NPM](https://img.shields.io/npm/v/agora-react-uikit.svg)](https://www.npmjs.com/package/agora-react-uikit) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Getting started
+
+### Requirements
+- [An Agora developer account](https://sso.agora.io/en/signup?utm_source=github&utm_repo=Agora-React-Web-UIKit)
+- A React project
+- A Modern Web Browser
+
+You can also use the UIKit outside a React project (for example in a vanilla-js project) using web-components. Find out more in the `/web-component` directory.
+### Installation
+To a react app (generated using create-react-app) add the UIKit:
+
+```bash
+npm i agora-react-uikit
+```
+
+### Usage
+
+This UIKit is very simple to use and contains a high level component called `AgoraUIKit`. You can check out code explanation here.
+
+**A simple sample app integrating Agora UI Kit:**
+```jsx
+import React, { useState } from 'react'
+import AgoraUIKit, { layout } from 'agora-react-uikit'
+
+const App = () => {
+  const [videocall, setVideocall] = useState(true)
+
+  return videocall ? (
+    <div style={{display: 'flex', flex: 1}}>
+        <AgoraUIKit
+        rtcProps={{
+            appId: '<Agora App ID>',
+            channel: 'test',
+            token: '<Channel Token>',
+        }}
+        callbacks={{
+            EndCall: () => setVideocall(false),
+        }} />
+    <div/>
+  ) : (
+    <h3 onClick={() => setVideocall(true)}>Start Call</h3>
+  )   
+}
+
+export default App
+```
+
+**Replace the `'<Agora App ID>'` with your own appID**.
+
+If you're using an App ID in secured mode, you'll need to pass in a token (you can generate a temporary token using the Agora console). Otherwise for testing, you can use the insecure mode and pass in null for the token.
+
+### Demo Project
+There's a demo available in `/example`.
+
+- Instal Node.js LTS
+- Add your Agora App ID to `/example/src/App.tsx`
+- Run `npm start` to start the bundler
+- Run `cd example && npm start` to run the example app

example/README.md

@@ -0,0 +1,5 @@
+This example was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+
+It is linked to the agora-react-uikit package in the parent directory for development purposes.
+
+You can run `npm install` and then `npm start` to test your package.