Main
 Installation Versioning Theming Typography Design tokens Schematics Migration guides
Components
 Accordion Actions panel AG grid Alert App Switcher Autocomplete Badge Breadcrumbs Button Button Group Button toggle Checkbox Clamped list Clamped text Code block Content panel Core Datepicker Description list Divider Dropdown Dynamic translation Empty state File upload Filter Bar Flag New Form field Highlight New Icon Icon Button Icon Item Inline edit Input Layout flex Link List Markdown Modal Navbar Notification Center Overflow items Overlay Popover Progress bar Progress spinner Radio Resizer Scrollbar Search expandable Select Sidebar Sidepanel Skeleton Split button Splitter Table Tabs Tag Tag autocomplete Tag input Tag list Textarea Time range Timepicker Timezone Title Toast Toggle Tooltip Topbar Tree Tree select Username
Other
 Date formatter Filesize formatter Forms Number formatter Validation
Icons
Interface and examples language
English
Version
20.1.0
Content panel 
import { KbqContentPanelModule } from '@koobiq/components/content-panel';
Directives
KbqContentPanelAside

Selector: kbq-content-panel-aside

Exported as: kbqContentPanelAside
KbqContentPanelHeaderTitle

Selector: [kbqContentPanelHeaderTitle]

Exported as: kbqContentPanelHeaderTitle
KbqContentPanelHeaderActions

Selector: [kbqContentPanelHeaderActions]

Exported as: kbqContentPanelHeaderActions
KbqContentPanelHeader

Selector: kbq-content-panel-header

KbqContentPanelBody

Selector: kbq-content-panel-body

Exported as: kbqContentPanelBody
KbqContentPanelFooter

Selector: kbq-content-panel-footer

KbqContentPanel

Selector: kbq-content-panel

Properties
Name Description
bodyOverflow: Signal Current body overflow state. Read by the header and footer to render their `box-shadow`.
KbqContentPanelContainer

Selector: kbq-content-panel-container

Exported as: kbqContentPanelContainer
Properties
Name Description
@Input()
disableClose: InputSignalWithTransform 		Whether the content panel can not be closed by clicking on the close button or pressing the ESCAPE key.
@Input()
disableCloseByEscape: InputSignalWithTransform 		Whether the content panel can not be closed by pressing the ESCAPE key.
@Input()
disableResizer: InputSignalWithTransform 		Whether the content panel resizer is disabled.
@Input()
maxWidth: InputSignalWithTransform 		Max width of the `KbqContentPanel`.
@Input()
minWidth: InputSignalWithTransform 		Minimum width of the `KbqContentPanel`.
@Input()
opened: InputSignalWithTransform 		Whether the content panel is opened.
@Input()
width: InputSignalWithTransform 		Width of the `KbqContentPanel`.
@Output('openedChange')
openedChange: OutputEmitterRef 		Emits event when the content panel opened state is changed.
isOpened: Signal Whether the content panel is opened.
Methods
close
Closes the content panel.
open
Opens the content panel.
toggle
Toggles the content panel opened state.
Suggestions for improvement
If you found a mistake or want to improve the article, create an issue on GitHub.