• Installation
• Usage
  • Options
• Generate form from Treege data
• Local installation
• Available Scripts
  • yarn dev
  • yarn build
  • yarn preview
• Convention

Installation

yarn add treege

Usage

import { Treege } from "treege";

const App = () => {
  return <Treege />;
};

export default App;

Options

| Props | Type | Default | Required | Detail | |---------------|--------|-----------|----------|-----------------------------------------------------------------------------------------------| | backendConfig | object | undefined | false | Backend configuration. Only necessary if you want backend communication. | | initialTreeId | string | undefined | false | If provided, this will fetch initial tree id. Cannot provided with initialTree in same time | | initialTree | object | undefined | false | Initial tree data. Cannot provided with initialTreeId in same time |

backendConfig

| Props | Type | Default | Required | Detail | |-----------|--------|-----------|----------|-------------------------------------------------------------| | baseUrl | string | undefined | true | Base url for API communication. ex : https://api.treege.com | | authToken | string | undefined | false | Authentication token | | endpoints | object | undefined | false | Endpoints configuration |

endpoints

| Props | Type | Default | Required | Detail | |-----------|--------|-----------|-----------------|-------------------------------------------------------------| | workflow | string | undefined | "/v1/workflow" | Endpoint for get/post/patch single workflow | | workflows | string | undefined | "/v1/workflows" | Endpoint for get all workflows. It is a array on workflow |

Backend model need to be compatible with the following interface:

interface Workflow {
  id: string;
  name: string;
  description: string;
  tree: Tree;
}

Tree is a JSON object generated by Treege with the following interface:

interface Tree {
  name: string;
  attributes: any;
  children: Tree[];
  treeId?: string;
}

How use Treege data ?

You can easily generate a form with the React library treege-consumer or use our own application !

Local installation

Clone the repository and install dependencies

yarn install

Available Scripts

In the project directory, you can run:

yarn dev

Runs the app in the development mode.
Open http://localhost:5173 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn build

Builds the app for production to the dist folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

yarn preview

Locally preview production build

Convention

• Airbnb JavaScript Style Guide
• Versioning
• Conventional Commits