Skip to content
Snippets Groups Projects
mixins.rst 3.55 KiB

Features
#########
We call "mixins" features for SIB components. Basicly they provide attribute to it.

List
=====

[Description]

Attributes available:
--------------------

+------------+-----------------+---------+----------------------------------------+
| Name | expected | Default | Description |
+===========+=================+=========+=========================================+
| order-by | | | |
+-----------+-----------------+---------+-----------------------------------------+
| counter | | | |
+-----------+-----------------+---------+-----------------------------------------+

Used in components:
-------------------

* link to `Sib-Display `__
* link to `Sib-Form `__

Store
=====

[Description]

Attributes available:
--------------------

+---------------+-----------------+---------+-----------------------------------------+
| Name | expected | Default | Description |
+=======+=========================+=========+=========================================+
| nested-field | | | |
+---------------+-----------------+---------+-----------------------------------------+
| | | | |
+---------------+-----------------+---------+-----------------------------------------+

Used in components:
-------------------

* link to `Sib-Display `__
* link to `Sib-Form `__

Events
######

Some event are available on specific wiget. You'll find corresponding events for your components in its documentation.

+------------+-----------------+---------+----------------------------------------+
| Event name | Parameters | Fired by | Fired when |
+=======+=====================+=========+=========================================+
| `resourceSelect` | `{detail:{resource}}` | `sib-display`, `sib-calendar`, `sib-map` | The user clicks an child in the list, with the resource as a detail of the event. |
+-----------+-----------------+---------+-----------------------------------------+
| `populate` | `{detail:{resource}}` | `sib-display`, `sib-form`, `sib-calendar`, `sib-map` | The component got and displayed all its datas. |
+-----------+-----------------+---------+-----------------------------------------+
| `save` | `{detail:{resource}}` | `sib-form` | The form has saved successfully. |
+-----------+-----------------+---------+-----------------------------------------+

Examples
========

Populate
--------
Use to do something if and when the element is generated.

.. code:: js

element.addEventListener("populate", event => {
// Do something when the element is generated.
})

Save
----
Use to do something when a form is successfully saved.

.. code:: js

form.addEventListener("save", event => {
// Do something when the form has been successfully saved.
});