@talenra/components documentation
  1. Components
  2. SidepanelComponent

File

workspace-sidepanel/src/sidepanel/sidepanel.component.ts

Description

Wrapper for content do be displayed in a sidepanel.

see WorkspaceSidepanelComponent

Import

Example :
import { SidepanelComponent } from '@talenra/components/workspace-sidepanel';

../../../#/workspace-layout/workspace-sidepanel

Metadata

host {
}
selector talenra-sidepanel
imports ScrollContainerComponent NgTemplateOutlet
styleUrls ./sidepanel.component.scss
templateUrl ./sidepanel.component.html

Index

Inputs
Outputs

Inputs

counter
Type : number | undefined, unknown
Default value : undefined, { transform: numberAttribute }

A counter value attached to the icon (visually represented as badge/call-out). Typically a number that represents the number of items contained in this sidepanel.
counterMax
Type : number | undefined, unknown
Default value : 99, { transform: numberAttribute }

The maximum value of the counter. If the counter value exceeds this limit, "+" will be displayed (e.g. "99+").

Example :
<talenra-sidepanel ... counterMax="99"></talenra-sidepanel>
fullwidth
Type : boolean, unknown
Default value : false, { transform: booleanAttribute }

Determine whether the panel shall indent its content horizontally (false) or not (true). Be aware, that '{ fullwidth: true, useScroll: true }' will render a space for the vertical scrollbar. Use '{ fullwidth: true, useScroll: false }' will render the content edge-to-edge and gives you the opportunity to implement a custom scroll behavior.
icon
Type : string
Default value : ''

Identifier of the icon displayed. A list of all icons supported is included in the README of package @talenra/icons.
key
Type : string
Default value : ''

Unique identifier for the sidepanel
label
Type : string
Default value : ''

The name of the sidepanel as displayed to the user
useScroll
Type : boolean, unknown
Default value : true, { transform: booleanAttribute }

Determine whether a vertical scroll is applied if the sidepanel's content exceeds the available height.

Outputs

counterMaxUpdate
Type : number | undefined

Triggered whenever counterMax value is updated.
counterUpdate
Type : number | undefined

Triggered whenever counter value is updated.

results matching ""

    No results matching ""