Supercharge your react component development with Zoids using Zoids snippets
Zoids is the internal design system for cleartax built with react and styled-components.
| Prefix | Component |
|---|---|
zi→ |
import { componentName } from '@cleartax/zoids' |
zib→ |
import { button } from '@cleartax/zoids' |
zcon→ |
<Container></Container> |
zcel→ |
<Cell width=''></Cell> |
zcelc→ |
<Cell width='' className=''></Cell> |
zcelc→ |
<Cell width='' className=''></Cell> |
zsk→ |
<Skeleton active title loading=''></Skeleton> |
zhe→ |
<Heading text='' size='' /> |
zte→ |
<Text></Text> |
zbu→ |
<Button nature='' size='' onClick=''></Button> |
zbug→ |
<ButtonGroup></ButtonGroup> |
zcard→ |
<Card nature=''></Card> |
zcardp→ |
<Card nature='' align='left'></Card> |
zlo→ |
<Loader nature=''></Loader> |
zme→ |
<Message nature='' heading='' description='' /> |
zli→ |
<List type='ul' size='' listStyle=''></List> |
zpg→ |
<Pagination total='' /> |
zbr→ |
<Breadcrumbs breadcrumbs={} inline={} /> |
ztag→ |
<Tag color=''></Tag> |
zto→ |
<Tooltip content='' placement=''></Tooltip> |
zmod→ |
<Modal size='m' open={}></Modal> |
zmodf→ |
<Modal.Footer></Modal.Footer> |
Built a new Zoids component? Creating a snippet to support your component is super easy.
Use the snip snippet to create Zoids snippets
- Add your snippet to the
snippets/zoids.jsonfile. - Update the Zoids snippets section in
README.md. - Update the
CHANGELOG.md. - Bump up the version in
package.json. - Install Visual Studio Code Extention by running
npm install -g vsce. - Run
vsce packageto build a new version. - Go to cleartax's Visual Studio marketplace and upload the package.
Note: Reach out to
rajanand@cleartax.into get access to publish the package in marketplace