/ui/elements/control
Module to export a method to decorate a control element with tabs and a panel.
- Source
Methods
(inner) addControl This function allows for adding more controls to the control element. This is done by calling add on the conttol element. ```javascript contolElement.add({ key: 'layers', panel: layersPanel }) ```(params)
Parameters:
Properties| Name | Type | Description |
|---|---|---|
params | Object | configuration options for the new control. |
| Name | Type | Attributes | Description |
|---|---|---|---|
params.key | String | Identifier used as the data-id of the element. | |
params.minWidth | Integer | <optional> | Optional minimum width of the element. |
params.icon | String | <optional> | The name of a Material symbols icon. |
params.classList | String | <optional> | Class definitions for the element. |
params.onClick | function | <optional> | A function to call when the tab is clicked. |
params.title | String | <optional> | The title of the element i.e hover text. |
params.panel | HTMLElement | <optional> | The panel associated to the tab. |
- Source
(inner) control(params) → {Object}
Parameters:
Properties| Name | Type | Description |
|---|---|---|
params | Object |
| Name | Type | Description |
|---|---|---|
params.target | HTMLElement | The target for the control element. |
- Source
Returns:
The ctrlTarget with the tab and panel appended.
- Type:
- Object
(inner) onClick The defualt onClick behaviour for the tabs.(e, params)
Parameters:
Properties| Name | Type | Description |
|---|---|---|
e | Event | The event from the click. |
params | Object | Configurtation options for the tab. |
| Name | Type | Attributes | Description |
|---|---|---|---|
params.parent | HTMLElement | The parent element of the tab. | |
params.tab | HTMLElement | The tab itself. | |
params.panel | HTMLElement | The panel associated ot the tab. | |
params.focus | String | | <optional> | The name attribute of the element to focus when the tab is clicked. |
- Source