DocSpace-client/packages/shared/components/icon-button
2024-02-05 16:06:57 +03:00
..
IconButton.stories.tsx Shared: rewrite components to typescript 2023-11-24 19:35:40 +03:00
IconButton.styled.ts Shared: rewrite components to typescript 2023-11-24 19:35:40 +03:00
IconButton.test.tsx Shared: rewrite components to typescript 2023-11-24 19:35:40 +03:00
IconButton.tsx Shared:Components:IconButton: remove icon button 2024-02-05 16:06:57 +03:00
IconButton.types.ts Shared:Components:Table\ColorTheme: rewrite to typescript 2023-12-20 12:14:18 +03:00
index.tsx Shared: refactoring and apply code guide style 2023-12-05 19:52:30 +03:00
README.md Client: fix wrong import - export for shared components 2024-01-10 11:01:43 +03:00

IconButton

IconButton is used for a action on a page

Usage

import { IconButton } from "@docspace/shared/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