React-typescript-ui-component-library NPM

Installation

$ npm install -save-dev react-typescript-ui-component-library

Set Up instructions

You can create new react project using the typescript or you can use your existing react-typescript project

$ npx install create-react-app --template typescript<br>

Environment file

Create .env file in your root directory to resolve the sourcemap dependency issue and paste the below code GENERATE_SOURCEMAP=false

Usage

import { Button, Input, Dropdown, Modal } from 'react-typescript-ui-component-library';

function App() {
    return (
        <div className="App">
         <Modal isOpen={true}></Modal>
         <Button label="Test" onClick={(e) => console.log(e.target)} style={{size: 'large'}}></Button>
         <Input type="email" placeholder="text" isValid={true} onChange={()=> {}}></Input>
         <Dropdown options={["sdf", "sdfsdf", "Sfsdf"]} selectedOption='sdfsdf'></Dropdown>
        </div>
    )
}

export default App;

Button component optional properties

label: string disabled: boolean style: object { size?: "small" | "medium" | "large"; primary?: boolean; primaryColor?: string; secondaryColor?: string; hoverPrimaryColor?: string; hoverSecondaryColor?: string; } onClick: MouseEventHandler

Input component optional properties

id: string type: "text" | "number" | "email" value: string isValid: boolean disabled: boolean placeholder: string onChange: ChangeEventHandler