DocSpace-client/packages/components/icon-button
2023-10-30 19:52:34 +05:00
..
icon-button.stories.js Web: Components: fixed console warnings 2023-05-31 20:01:38 +05:00
icon-button.test.js Web:Common/Client/Components: add PUBLIC_DIR alias 2023-01-27 17:08:30 +03:00
index.js Web:InfoPanel Fixed close icon 2023-10-30 19:52:34 +05:00
README.md Web:Common/Client/Components: add PUBLIC_DIR alias 2023-01-27 17:08:30 +03:00
styled-icon-button.js Web:InfoPanel Fixed close icon 2023-10-30 19:52:34 +05:00

IconButton

IconButton is used for a action on a page

Usage

import IconButton from "@docspace/components/icon-button";
import SearchReactSvgUrl from "PUBLIC_DIR/images/search.react.svg?url";
<IconButton
  size="25"
  isDisabled={false}
  onClick={() => alert("Clicked")}
  iconName={SearchReactSvgUrl}
  isFill={true}
  isClickable={false}
/>

Properties

Props Type Required Values Default Description
className string - - - Set component class
clickColor string - - - Icon color on click action
color string - - #d0d5da Icon color
hoverColor string - - - Icon color on hover action
iconClickName string - - - Icon name on click action
iconHoverName string - - - Icon name on hover action
iconName string - AZSortingIcon Icon name
id string, number - - - Set component id
isClickable bool - - false Set cursor value
isDisabled bool - - false Tells when the button should present a disabled state
isFill bool - - true Determines if icon fill is needed
onClick func - - - What the button will trigger when clicked
onMouseDown func - - - What the button will trigger when cursor down
onMouseEnter func - - - What the button will trigger when cursor enter
onMouseUp func - - - What the button will trigger when cursor up
size number,string - - 25 Button height and width value
style obj, array - - - Accepts css style