@skuad/ui v0.2.20
Skuad Design System contains foundational React UI components, created using Mui components in it's core to provide a consistent look and feel across the Skuad product in terms of both design and functionality.
Installation
Make sure to also add other dependencies which is needed to run this library
yarn add @skuad/ui
Direct Dependencies needed to run this library
- "@emotion/react": "^11.10.5",
- "@emotion/styled": "^11.10.5",
- "@mui/icons-material": "^5.6.2",
- "@mui/lab": "^5.0.0-alpha.79",
- "@mui/material": "^5.11.7",
- "dayjs": "^1.11.5",
- "react": "^17.0.1",
- "react-phone-input-2": "^2.15.1",
- "react-router-dom": "^6.3.0"
Collaboration
We're very delighted to have you join the Skuad community. We're always looking for new collaborators to work together. Please follow the Skuad Git Contribution Guidelines to get started.
Documentation
This UI library consist of a number of components that are used to build the Skuad frontend applications.
It is divided in two main categories:
core - These are the core components that are used to create UI, which is using Mui components in it's core. It includes all primary Mui components with addition of following new components too:-
- CheckboxGroupInput
- CurrencyInput
- RadioGroupInput
web - These are re-usable components responsible for giving consistent UI/UX.
- CalloutData and CalloutDataSet
- DetailedAvatar
- HistoryCard
- RouteLink
- SkeletonProgress
- SubmitButtonGroup
- Table
icon - These are custom icon for skuad application created with Mui's
createSvgIcon
and extends all default Mui-Icon functionalities. It also includes all the Mui inbuilt icons.
Core Components
import { Button, Alert, Select } from '@skuad/ui';
// or
import { Button, Alert, Select } from '@skuad/ui/core';
Web Components
import { DetailedAvatar, CalloutDataSet, Table } from '@skuad/ui';
// or
import { DetailedAvatar, CalloutDataSet, Table } from '@skuad/ui/web';
Icon
import { SettingIcon, DashboardIcon } from '@skuad/ui/icon';
Themes
This library also exposes default theme to be used across the Skuad product.
import { SkuadDefaultTheme } from '@skuad/ui';
Storybook
All the components in this library are available in the storybook with their dedicated stories.
Skuad UI Storybook can be found at http://skuad-ui.dev.internal.skuad.in/
Due to internal organization rules, this url is only accessible with skuad vpn access.
Steps to open above url with VPN -
Navigate to https://vpn.skuad.in and login using skuad email, and generate Profile URI.
Download client application and start the VPN after importing the profile in VPN client application.
Now you can access the URL
2 months ago
2 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
4 months ago
5 months ago
5 months ago
5 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
10 months ago
10 months ago
6 months ago
9 months ago
6 months ago
6 months ago
10 months ago
10 months ago
9 months ago
9 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago