SidebarObject UI Component


npm i @synerise/ds-sidebar-object
yarn add @synerise/ds-sidebar-object


import SidebarObject from '@synerise/ds-sidebar-object'
<SidebarObject />



avatarAvatar element of the sidebarReact.ReactNode-
headerPreffixElement rendered on the left side of the headerReact.ReactNode-
headerTabsTabs component to switch between contentTabItem-
inputObjectObject to be displayed in the sidebarobject-
inlineEditInputPropsProps passed to the input of InlineEdit componentInlineEdit.InputProps-
onArrowUpCallback executed when arrowUp icon is clickedvoid-
onArrowDownCallback executed when arrowDown icon is clickedvoid-
onEditCallback executed when clicked on edit icon(inputObject:object) => void-
onDuplicateCallback executed when clicked on duplicate icon(inputObject:object) => void-
onMoveCallback executed when clicked on move icon(inputObject:object) => void-
onDeleteCallback executed when clicked on delete icon(inputObject:object) => void-
onIdCallback executed after clicking on the object's ID(inputObject:object) => void-
onScrollbarCallback executed when scrollboolean-
textsGroup of textsHeaderTexts-
onCloseClickProp to close Drawervoid-
inputObjectIdUnique id of the object passed as stringstring-
handleTabClickCallback executed when you click on Tab(index: number) => void-
footerCallback executed to show footerReact.ReactNode-
additionalNodeCallback executed to show additional elementReact.ReactNode-
headerTypeProp to choose editable title‘readonly’ , ‘editable’-
typeButtonsProp to choose type of buttons‘twoButtons’ , ‘withNavigation’-