Orange eXperience Design

orange experience design is a component library that based orangehrm 5.x version

Technology Stack

• Vue3
• Sass - Component theming
• Jest - componnet unit tests
• xState - component state management

Base Components

• Data Tables
• Buttons
• Forms
• Dialogue
• Cards
• Filters

Prerequisites

• Yarn
• Visual Studio Code with Vetur extension

Getting Started

Install dependancies

yarn install

Start Storybook

yarn dev

Build Storybook

yarn workspace oxd-storybook build

Unit Testing

yarn test:unit

Linting

yarn lint