# Overview



EC React is a powerful, schema-driven framework for building
enterprise-grade insurance applications. This library provides a
comprehensive suite of dynamic forms and UI components designed to
accelerate development and handle the full spectrum of policy lifecycle
operations with unparalleled flexibility.

Core Philosophy [#core-philosophy]

At its core, this library is engineered to translate Socotra’s flexible
data model directly into a rich, interactive user interface. By
leveraging your unique data model, we dynamically generate complex
forms, eliminating the need to manually build and maintain forms for
every product or data variation. This schema-driven approach ensures
that as your insurance products evolve, your UI adapts automatically,
dramatically reducing development overhead and increasing speed to
market.

Our components are built with modern, robust technologies including
**React** , **TypeScript** , **Shadcn UI** , and **Tailwind CSS** ,
ensuring a developer-friendly, performant, and highly customizable
experience.

Key Features [#key-features]

* **Schema-Driven UI**: Forms for quotes, policies, accounts, and
  transactions are generated dynamically from your data model, not
  hardcoded.
* **Complex Logic Handling**: Built-in support for sophisticated
  insurance workflows, including constraint evaluation for real-time
  field dependency updates.
* **Highly Customizable**: A powerful `tag` system allows for deep
  customization of field behavior directly from the data model—from
  conditional visibility to special UI controls like multi-select and
  currency inputs.
* **Enterprise-Ready**: Designed to handle the intricate details of
  policy administration, including endorsements, payments,
  disbursements, and renewals.
* **Modern Tech Stack**: A clean, modern, and performant codebase that
  is a pleasure to work with and extend.

Installation [#installation]

This monorepo contains three core packages that can be installed from
`npm`. For most applications, you will want to install all three:

* `@socotra/ec-react-components`: The main library of schema-driven
  React components.
* `@socotra/ec-react-schemas`: TypeScript interfaces and `zod`
  schemas for all data models.
* `@socotra/ec-react-utils`: Helper functions for data transformation
  and API requests.

Install all packages with a single command:

```sh
npm i @socotra/ec-react-components @socotra/ec-react-schemas @socotra/ec-react-utils
```

For detailed setup instructions, such as Tailwind CSS configuration for
the component library, please see the `README.md` file within each
individual package directory.

Documentation [#documentation]

To contribute to the documentation, clone the repo and run the following
command:

```sh
git clone https://github.com/socotra/ec-react.git
cd ec-react/packages/docs
pnpm run sync
pnpm run sync:rst
```

Follow instructions in the `ec-react/packages/docs/README.md` file to
build the documentation and update the `Socotra Documentation` repo.