@halodigital/pane v1.0.10

Pane by Halo-Digital

This package contains a side pane with the following features:

• Horizontal and vertical Resizing

• Horizontal and vertical scrolling

• Close button

Enjoy!

Attributes

horizontalResize

Declare if the pane will be resizable horizontally and where to place the resize bar
Type: 'right' | 'left' Default: null

verticalResize

Declare if the pane will be resizable vertically and where to place the resize bar
Type: 'top' | 'bottom'
Default: null

state

The pane state
Type: 'opened' | 'closed'
Default: 'opened'

showCloseButton

Declare if close button will appear in the right top corner
Type: boolean
Default: true

Events

stateChange

Triggers on state change
Event Parameter Type: 'opened' | 'closed'

sizeChange

Triggers on size change
Event Parameter Type: {dimension: 'width' | 'height', value: string}

Example

<halo-pane
    horizontalResize="right"
    verticalResize="bottom"
    state="opened"
    [showCloseButton]="false"
    (stateChange)="stateChanged($event)"
    (sizeChange)="sizeChanged($event)">

    <div>Some content</div>

</halo-pane>