Skip to main content

Button

A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic.

Usage​

import React from 'react';
import {  Button } from 'qdm-component-library';

function App() {
  return ( <Button/> );
}
export default App;

Reference​

Props​

here all the list of Props you can use for Button Component

name​

props for adding the button text and type string by default it will be in Button

import React from 'react';
import {  Button } from 'qdm-component-library';

function App() {
  return ( <Button name="Button" /> );
}
export default App;

color​

In Qdm Component we provide 3 types of color.

  • primary
  • secondary
  • default
import React from 'react';
import {  Button } from 'qdm-component-library';

function App() {
  return ( <Button name="Button" color="primary"/> );
}
export default App;

variant​

In Qdm Component we provide 2 types of variant.

  • outlined
  • text
import React from 'react';
import {  Button } from 'qdm-component-library';

function App() {
  return ( <Button name="Button" color="primary" variant="outlined"/> );
}
export default App;

size​

In Qdm Component we provide 3 types of size.

  • large
  • small
  • medium
import React from 'react';
import {  Button } from 'qdm-component-library';

function App() {
  return ( <Button name="Button" color="primary" variant="outlined" size="medium"/> );
}
export default App;

onClick​

props for on click function type funcation

disabled​

If true, disable all interactions for this component. type boolean

inLineStyles​

props give addition props to the Button element type Object