From d93d63372aa1c105e6e9891e4b62f02bd4f7e6d3 Mon Sep 17 00:00:00 2001
From: Matthieu Fesselier <matthieu.fesselier@gmail.com>
Date: Fri, 6 Nov 2020 09:26:11 +0100
Subject: [PATCH] update doc
---
.../Components/Solid-Delete.rst | 2 +-
.../Components/Solid-Display.rst | 13 +++++++++---
.../Components/Solid-Form-Search.rst | 20 +++++++++++--------
.../Components/Solid-Form.rst | 10 +++++++++-
source/import_documentation/Events.rst | 8 ++++----
.../Helpers-functions.rst | 2 +-
.../Mixins/filter-mixin.rst | 6 +++---
.../Mixins/grouper-mixin.rst | 5 +++++
.../Mixins/required-mixin.rst | 8 +++++---
.../Mixins/store-mixin.rst | 4 ++++
.../introduction-framework-documentation.rst | 4 +++-
source/index.rst | 16 +++++++--------
12 files changed, 65 insertions(+), 33 deletions(-)
diff --git a/source/import_documentation/Components/Solid-Delete.rst b/source/import_documentation/Components/Solid-Delete.rst
index 6e88424..0470de6 100644
--- a/source/import_documentation/Components/Solid-Delete.rst
+++ b/source/import_documentation/Components/Solid-Delete.rst
@@ -7,7 +7,7 @@ Receives the URL of a resource or of a container of resources via its
.. code:: html
- <solid-delete data-src="http://localhost:8000/conversations/9/"></solid-delete>
+ <solid-delete data-src="http://server/conversations/9/"></solid-delete>
Mixins
diff --git a/source/import_documentation/Components/Solid-Display.rst b/source/import_documentation/Components/Solid-Display.rst
index 5a60037..27c4254 100644
--- a/source/import_documentation/Components/Solid-Display.rst
+++ b/source/import_documentation/Components/Solid-Display.rst
@@ -13,11 +13,18 @@ added to interact with the list of data being displayed.
.. code:: html
<solid-display
- data-src="https://api.startinblox.com/users/"
+ data-src="https://server/users/"
fields="first_name, last_name"
></solid-display>
+To make the styling easier, if the ``solid-display`` shows a resource,
+a ``solid-resource`` attribute is automatically added to the element.
+If it's a container, a ``solid-container`` attribute is added.
+Then, you can target your elements with the CSS rules ``solid-display[solid-resource]``
+or ``solid-display[solid-container]``.
+
+
Mixins
------
@@ -47,9 +54,9 @@ Attributes
``<solid-display>``. Make sure you don’t give your set the same name as
a field as it would result in an infinite loop.
-``child-xyz``
+``child-[field]``
~~~~~~~~~~~~~
- add attribute ``xyz`` to all children.
+ add attribute ``[field]`` to all children.
Widgets
diff --git a/source/import_documentation/Components/Solid-Form-Search.rst b/source/import_documentation/Components/Solid-Form-Search.rst
index 3713eb9..5fdeac0 100644
--- a/source/import_documentation/Components/Solid-Form-Search.rst
+++ b/source/import_documentation/Components/Solid-Form-Search.rst
@@ -14,7 +14,7 @@ This must have a ``filtered-by`` attribute set to the id of the current ``solid-
></solid-form-search>
<solid-display
- data-src="http://example.com/users"
+ data-src="http://server/users"
fields="username, last_name, email"
filtered-by="my-filter"
></solid-display>
@@ -36,7 +36,7 @@ Attributes
~~~~~~~~~~
List of fields used to perform the search.
-``label-xyz``
+``label-[field]``
~~~~~~~~~~~~~
When displaying a form, the default labels are the fields names of the model.
If you want something fancier, you can set this attribute.
@@ -44,26 +44,30 @@ Attributes
``submit-button``
~~~~~~~~~~~~~
+ *Available from version 0.13*
+
Text of the submit button to create in the search form. If the attribute is not defined,
no button will be added and the form will trigger the search on change.
-``range-xyz``
+``range-[field]``
~~~~~~~~~~~~~
URL of a container which list the accepted values
- for the field ``xyz``. It’s particularly useful with a dropdown
+ for the field ``[field]``. It’s particularly useful with a dropdown
field.
-``enum-xyz``
+``enum-[field]``
~~~~~~~~~~~~~
- List of values of your choice for the field ``xyz``.
+ *Available from version 0.13*
+
+ List of values of your choice for the field ``[field]``.
They have to be filled manually and must be separated by commas.
It’s particularly useful with a dropdown or radio field.
Two formats are possible:
- * ``enum-xyz="value1, value2, value3"`` : each value will be displayed
+ * ``enum-[field]="value1, value2, value3"`` : each value will be displayed
and loaded in value attribute
- * ``enum-xyz="value1 = a, value2 = b, value3 = c"``: each value will be displayed
+ * ``enum-[field]="value1 = a, value2 = b, value3 = c"``: each value will be displayed
and "a", "b", "c" will be loaded in value attribute.
Widgets
diff --git a/source/import_documentation/Components/Solid-Form.rst b/source/import_documentation/Components/Solid-Form.rst
index 6bd207e..6fd65a7 100644
--- a/source/import_documentation/Components/Solid-Form.rst
+++ b/source/import_documentation/Components/Solid-Form.rst
@@ -9,7 +9,7 @@ container.
.. code:: html
- <solid-form data-src="http://localhost:8000/todos/"></solid-form>
+ <solid-form data-src="http://server/todos/"></solid-form>
Mixins
------
@@ -58,6 +58,8 @@ Attributes
``enum-[field]``
~~~~~~~~~~~~~
+ *Available from version 0.13*
+
List of values of your choice for the field ``[field]``.
They have to be filled manually and must be separated by commas.
It’s particularly useful with a dropdown or radio field.
@@ -90,16 +92,22 @@ Attributes
``pattern-[field]``
~~~~~~~~~~~~~~~
+ *Available from version 0.13*
+
Add this attribute for the field ``[field]`` to define a regular expression to check the input's value.
It works only with a ``solid-form-text`` widget.
``title-[field]``
~~~~~~~~~~~~~~
+ *Available from version 0.13*
+
Add this attribute for the field ``[field]`` to precise extra information about an element.
It works only with a ``solid-form-text`` widget.
``confirmation-message``
~~~~~~~~~~~~~~~~~~~~~~~~~
+ *Available from version 0.13*
+
Add this attribute to create a dialog box linked with the submit button of the solid-form.
Its value matches the message displayed in the dialog box.
diff --git a/source/import_documentation/Events.rst b/source/import_documentation/Events.rst
index 0f47672..c94aa3c 100644
--- a/source/import_documentation/Events.rst
+++ b/source/import_documentation/Events.rst
@@ -30,8 +30,8 @@ But for now, here are some events that will be useful to you.
Examples
~~~~~~~~
-Populate
-^^^^^^^^
+``populate``
+^^^^^^^^^^^^
Use to do something if and when the element is generated.
@@ -41,8 +41,8 @@ Use to do something if and when the element is generated.
// Do something when the element is generated.
})
-Save
-^^^^
+``save``
+^^^^^^^^
Use to do something when a form is successfully saved.
diff --git a/source/import_documentation/Helpers-functions.rst b/source/import_documentation/Helpers-functions.rst
index 83216cf..8208ec0 100644
--- a/source/import_documentation/Helpers-functions.rst
+++ b/source/import_documentation/Helpers-functions.rst
@@ -26,7 +26,7 @@ Creating a component, you should import those function like this :
.. code:: js
- import { Helpers } from "https://unpkg.com/@startinblox/core@0.10";
+ import { Helpers } from "https://unpkg.com/@startinblox/core@0.12/dist/libs/helpers.js";
You should always use ``importCSS`` and ``importJS`` to make your extra
importation. Otherwise, you’ll get this king of message :
diff --git a/source/import_documentation/Mixins/filter-mixin.rst b/source/import_documentation/Mixins/filter-mixin.rst
index 25d6245..35546ce 100644
--- a/source/import_documentation/Mixins/filter-mixin.rst
+++ b/source/import_documentation/Mixins/filter-mixin.rst
@@ -18,12 +18,12 @@ Attributes
``filtered-by``
~~~~~~~~~~~~~~~
- Target a `<sib-form-search>` used to filter current list of resource.
+ Target a ``<solid-form-search>`` used to filter current list of resource.
example:
.. code:: html
-
+
<solid-form-search
id="my-filter"
fields="email"
@@ -31,7 +31,7 @@ Attributes
></solid-form-search>
<solid-display
- data-src="http://example.com/users"
+ data-src="http://server/users"
fields="username, last_name, email"
filtered-by="my-filter"
></solid-display>
diff --git a/source/import_documentation/Mixins/grouper-mixin.rst b/source/import_documentation/Mixins/grouper-mixin.rst
index 9b82705..1cc4c0d 100644
--- a/source/import_documentation/Mixins/grouper-mixin.rst
+++ b/source/import_documentation/Mixins/grouper-mixin.rst
@@ -17,6 +17,7 @@ Attributes
``group-by``
~~~~~~~~~~~~
+
The resources will be grouped by the field you give as a parameter.
In this example, the mixin will render one
@@ -33,8 +34,12 @@ Attributes
When used with the pagination, each group is paginated.
+ You can also use the dot syntax to group by a nested resource. For example,
+ set the ``group-by`` attribute to ``nested_resource.name``.
+
``group-widget``
~~~~~~~~~~~~~~~~~~~
+ *Available from version 0.13*
default: ``solid-group-default``
The name of the widget to use as a group widget.
diff --git a/source/import_documentation/Mixins/required-mixin.rst b/source/import_documentation/Mixins/required-mixin.rst
index 48cca54..5c1aa71 100644
--- a/source/import_documentation/Mixins/required-mixin.rst
+++ b/source/import_documentation/Mixins/required-mixin.rst
@@ -14,9 +14,11 @@ Used by:
Attributes
----------
-``required-xyz``
+``required-[field]``
~~~~~~~~~~~~~~~~
- The attribute takes no value. ``xyz`` represents the mandatory property of resources to be displayed.
+ *Available from version 0.13*
+
+ The attribute takes no value. ``[field]`` represents the mandatory property of resources to be displayed.
In this example, users must have email to be dislayed.
@@ -28,4 +30,4 @@ Attributes
required-email
></solid-display>
- It is possible to combine this mixin twice, ``required-uvw`` and ``required-xyz``.
\ No newline at end of file
+ It is possible to combine this mixin twice, ``required-uvw`` and ``required-[field]``.
\ No newline at end of file
diff --git a/source/import_documentation/Mixins/store-mixin.rst b/source/import_documentation/Mixins/store-mixin.rst
index 30b86a0..e3c4956 100644
--- a/source/import_documentation/Mixins/store-mixin.rst
+++ b/source/import_documentation/Mixins/store-mixin.rst
@@ -77,6 +77,8 @@ Attributes
``no-render``
~~~~~~~~~~~~~
+ *Available from version 0.13*
+
While this attribute is present on a component, no data will be fetched.
This attribute is automatically removed by the router when the component
is in a view which has been activated.
@@ -85,6 +87,8 @@ Attributes
``store://`` attribute values
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ *Available from version 0.13*
+
This mixin decode all attribute values starting by ``store://resource`` or
``store://user`` and replace them by the values fetched from the store.
diff --git a/source/import_documentation/introduction-framework-documentation.rst b/source/import_documentation/introduction-framework-documentation.rst
index 96d8e86..66cc1d7 100644
--- a/source/import_documentation/introduction-framework-documentation.rst
+++ b/source/import_documentation/introduction-framework-documentation.rst
@@ -12,19 +12,21 @@ For each component, you will find:
**External components** don’t belong to the core of the framework but are often used in applications.
+
.. note::
Each component have its own features, and is composed of mixins which provides new ones.
Therefore, attributes and events of a component are the combination of attributes and events of
all its mixins.
+
In the **mixin** section, each one has:
* a description of its function,
* a list of components using it,
* a list of attributes,
* a list of events.
-The **widget** section presents the API to create widgets and give examples about how to create and use them.
+The **widget** section presents the API to create widgets and gives examples about how to create and use them.
The last section concerns **Javascript API** you can use with sib-core.
diff --git a/source/index.rst b/source/index.rst
index 408e6cb..2ec6672 100644
--- a/source/index.rst
+++ b/source/index.rst
@@ -3,7 +3,7 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: First Step:
+ :caption: First Step
import_documentation/what-is-sib
import_documentation/why-use-sib
@@ -13,7 +13,7 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: How it works:
+ :caption: How it works
import_documentation/How-to-make-components
import_documentation/install-sib-server
@@ -23,14 +23,14 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: Introduction to the core documentation:
+ :caption: Get started with sib-core
import_documentation/introduction-framework-documentation
import_documentation/attributes-list
.. toctree::
:maxdepth: 2
- :caption: Base components:
+ :caption: Base components
import_documentation/Components/Solid-Display
import_documentation/Components/Solid-Form
@@ -44,7 +44,7 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: External components:
+ :caption: External components
import_documentation/Components/Solid-Auth
import_documentation/Components/Solid-Router
@@ -52,7 +52,7 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: Mixins:
+ :caption: Mixins
import_documentation/Mixins/store-mixin
import_documentation/Mixins/widget-mixin
@@ -69,14 +69,14 @@ Welcome to Startinblox's documentation
.. toctree::
:maxdepth: 2
- :caption: Widgets:
+ :caption: Widgets
import_documentation/Widgets/Reference
import_documentation/Widgets/Examples
.. toctree::
:maxdepth: 2
- :caption: Javascript API:
+ :caption: Javascript API
import_documentation/Events
import_documentation/Helpers-functions
--
GitLab