dsny_dashboard

Easy to use basic React components that are commonly used in Dashboard projects. This library is being built from scratch with React along with TypeScript and targeting the Bootstrap CSS framework. It includes basic Form building components / Sidebars / Custom Tabs / AGGrid Table with custom Filters / Popup modal & many more...

Usage no npm install needed!

<script type="module">
  import dsnyDashboard from 'https://cdn.skypack.dev/dsny_dashboard';
</script>

README

DSNY Dashboard Module

Easy to use basic React components that are commonly used in Dashboard projects. This library is being built from scratch with React along with TypeScript and targeting the Bootstrap CSS framework. It includes basic Form building components / Sidebars / Custom Tabs / AGGrid Table with custom Filters / Popup modal & many more...

Installation

$ npm install dsny_dashboard OR
$ npm i dsny_dashboard

Usage

  • Button Example

     import {Button} from 'dsny_dashboard';
     <Button 
        fieldName={"Submit"}
        identifier={"submit"}
        className= {"button_agree"} 
    />

- Form Components

  • Button

  • InputField

  • Checkbox

  • ListCheckboxes

  • FormikDatePicker

  • DatePicker

  • DropdownField

  • FormikInputField

  • ListItems

  • FormikTextArea

  • TextArea

  • FormikTimePicker

  • TimePickerField

Form View Components

  • Card

  • ImageBox

  • FormikLabelField

  • LabelField

  • FormikLabelText

  • LabelText

  • BackwardHeader

- Table Components

  • AgGridComponent

  • TableHeader

- Sidebar Components

  • Sidebar

  • SidebarHeader

  • SidebarItems

- Loader and Modal Popup Components

  • Loader

  • ModalPopup

- Tabs Components

  • Tabs

  • ButtonFilter

  • DropdownFilter

- Containers Components

  • FormikKeyValueField

  • KeyValueDataFields

  • ModalPopupContainer

- Utility Component

  • TextUtility

Storybook

Click here to View each component's storybook