UNPKG

@lion/ui

Version:

A package of extendable web components

github.com/ing-bank/lion/

ing-bank/lion

65 lines (51 loc) • 4.56 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
--- parts: - API Table - Drawer title: 'Drawer: API Table' eleventyNavigation: key: API Table >> Drawer title: API Table order: 90 parent: Drawer --- # Drawer: API Table ## class: `LionDrawer`, `lion-drawer` ### Fields | Name | Privacy | Type | Default | Description | Inherited From | | ---------------- | --------- | --------- | ------- | ---------------------------------------------------------------------------- | --------------- | | `opened` | public | `boolean` | `false` | | LionCollapsible | | `position` | public | `string` | | Setter for position property, available values are 'top', 'left' and 'right' | | | `transitioning` | public | `boolean` | | | | | `_contentHeight` | protected | | | | LionCollapsible | | `_contentNode` | protected | | | | LionCollapsible | | `_contentWidth` | protected | | | | | | `_invokerNode` | protected | | | | LionCollapsible | ### Methods | Name | Privacy | Description | Parameters | Return | Inherited From | | -------------------- | --------- | -------------------------------------------------------------- | -------------------------------------------------------------------------- | --------------- | --------------- | | `hide` | public | Hide extra content. | | | LionCollapsible | | `show` | public | Show extra content. | | | LionCollapsible | | `toggle` | public | Toggle the current(opened/closed) state. | | | LionCollapsible | | `_hideAnimation` | protected | Trigger hide animation and wait for transition to be finished. | `{ contentNode }, options: @param {HTMLElement} options.contentNode * ` | | LionCollapsible | | `_openedChanged` | protected | | | | | | `_showAnimation` | protected | Trigger show animation and wait for transition to be finished. | `{ contentNode }, options: @param {HTMLElement} options.contentNode * ` | | LionCollapsible | | `_updateContentSize` | protected | | | | | | `_waitForTransition` | protected | Wait until the transition event is finished. | `{ contentNode }, options: @param {HTMLElement} options.contentNode * ` | `Promise<void>` | | ### Events | Name | Type | Description | Inherited From | | ---------------- | ------------- | ----------- | --------------- | | `opened-changed` | `CustomEvent` | | LionCollapsible | ### Attributes | Name | Field | Inherited From | | --------------- | ------------- | --------------- | | `transitioning` | transitioning | | | `opened` | opened | LionCollapsible | | `position` | position | | ### Slots | Name | Description | | ---------- | ----------------------------------- | | `invoker` | The invoker element for the drawer | | `content` | The content element for the drawer | | `headline` | The headline element for the drawer | <hr/>