Integrate documentation generation for the Core Elements (initialization).

.gitignore

@@ -115,6 +115,7 @@ docs/manuals/gui/controls.md
 docs/manuals/gui/blocks.md
 docs/manuals/gui/viselements/*.md
 !docs/manuals/gui/viselements/index.md
+docs/manuals/gui/corelements/*.md
 docs/manuals/xrefs
 !docs/manuals/gui/gui_example.ipynb
 docs/manuals/reference_rest/*.md

Pipfile

@@ -8,8 +8,9 @@ name = "pypi"
 apispec = {extras = ["yaml"], version = "==5.0"}
 apispec-webframeworks = "==0.5.2"
 bcrypt = "==3.2.2"
+cookiecutter = "==2.1.1"
 deepdiff = "==6.2.2"
-flask = "==2.2.2"
+flask = "==2.2.5"
 flask-cors = "==3.0.10"
 flask-jwt-extended = "==4.3"
 flask-marshmallow = "==0.14"
@@ -31,7 +32,10 @@ pandas = "==1.5.1"
 passlib = "==1.7.4"
 pyarrow = "==10.0.1"
 pymongo = "==4.2.0"
+pyngrok = "==5.1"
 python-dotenv = "==0.19"
+python-magic = {version = "==0.4.24", sys_platform = "!= 'win32'"}
+python-magic-bin = {version = "==0.4.14", sys_platform = "== 'win32'"}
 pytz = "==2021.3"
 simple-websocket = "==0.9"
 sqlalchemy = "==1.4.18"

docs/manuals/gui/corelements/index.md_template

@@ -0,0 +1,17 @@
+# Core elements
+
+!!! warning "Available in Taipy Community and Enterprise editions"
+
+    The controls listed in this section are available only if the
+    [`taipy`](https://pypi.org/project/taipy/) Python package is installed. These controls are
+    **not** present if only [`taipy-gui`](https://pypi.org/project/taipy-gui/) is installed.
+
+Taipy provides a set of visual elements that are meant to simplify the use of Core
+objects... TODO
+
+## Elements list
+
+Here is the list of all the available Core elements in Taipy:
+
+[TOC]
+

docs/manuals/gui/corelements/scenario_selector.md_template

@@ -0,0 +1,8 @@
+Select scenarios from the list of all Taipy Core scenario entities.
+
+Shows all the scenario entities handled by Taipy Core, and lets the user
+select them.
+
+## Usage
+
+TODO

docs/manuals/gui/viselements/button.md_template

@@ -0,0 +1,91 @@
+A control that can trigger a function when pressed.
+
+## Styling
+
+All the button controls are generated with the "taipy-button" CSS class. You can use this class
+name to select the buttons on your page and apply style.
+
+### [Stylekit](../styling/stylekit.md) support
+
+The [Stylekit](../styling/stylekit.md) provides specific classes that you can use to style buttons:
+
+* *secondary*<br/>*error*<br/>*warning*<br/>*success*<br/>
+    Buttons are normally displayed using the value of the *color_primary* Stylekit variable.
+    These classes can be used to change the color used to draw the button, respectively, with
+    the *color_secondary*, *color_error*, *color_warning* and *color_success* Stylekit variable
+    values.
+
+    The Markdown content: 
+    ```
+    <|Error|button|class_name=error|><|Secondary|button|class_name=secondary|>
+    ```
+
+    Renders like this:
+    <figure>
+      <img src="../button-stylekit_color-d.png" class="visible-dark" />
+      <img src="../button-stylekit_color-l.png" class="visible-light"/>
+      <figcaption>Using color classes</figcaption>
+    </figure>
+
+* *plain*<br/>
+    The button is filled with a plain color rather than just outlined.
+
+    The Markdown content: 
+    ```
+    <|Button 1|button|><|Button 2|button|class_name=plain|>
+    ```
+
+    Renders like this:
+    <figure>
+        <img src="../button-stylekit_plain-d.png" class="visible-dark" />
+        <img src="../button-stylekit_plain-l.png" class="visible-light"/>
+        <figcaption>Using the <code>plain</code> class</figcaption>
+    </figure>
+
+* *fullwidth*: The button is rendered on its own line and expands across the entire available width.
+
+## Usage
+
+### Simple button
+
+The button label, which is the button control's default property, is simply displayed as the button
+text.
+
+!!! example "Page content"
+
+    === "Markdown"
+
+        ```
+        <|Button Label|button|>
+        ```
+
+    === "HTML"
+
+        ```html
+        <taipy:button>Button Label</taipy:button>
+        ```
+
+<figure>
+    <img src="../button-simple-d.png" class="visible-dark" />
+    <img src="../button-simple-l.png" class="visible-light"/>
+    <figcaption>A simple button</figcaption>
+</figure>
+
+### Specific action callback
+
+Button can specify a callback function to be invoked when the button is pressed.
+
+!!! example "Page content"
+
+    === "Markdown"
+
+        ```
+        <|Button Label|button|on_action=button_action_function_name|>
+        ```
+
+    === "HTML"
+
+        ```html
+        <taipy:button on_action="button_action_function_name">Button Label</taipy:button>
+        ```
+

docs/manuals/gui/viselements/chart.md_template

@@ -0,0 +1,126 @@
+Displays data sets in a chart or a group of charts.
+
+The chart control is based on the [plotly.js](https://plotly.com/javascript/)
+graphs library.
+
+Plotly is a graphing library that provides a vast number of visual
+representations of datasets with all sorts of customization capabilities. Taipy
+exposes the Plotly components through the `chart` control and heavily depends on
+the underlying implementation.
+
+The core principles of creating charts in Taipy are explained in the
+[Basic concepts](charts/basics.md) section.<br/>
+Advanced concepts are described in the [Advanced features](charts/advanced.md) section.
+
+# Description
+
+The chart control has a large set of properties to deal with the many types of charts
+it supports and the different kinds of customization that can be defined.
+
+### The *data* property
+
+All the data sets represented in the chart control must be assigned to
+its [*data*](#p-data) property.
+
+The supported types for the [*data*](#p-data) property are:
+
+- A list of values:<br/>
+    Most chart types use two axes (*x*/*y* or *theta*/*r*). When receiving a *data* that is just
+    a series of values, Taipy sets the first axis values to the value index ([0, 1, ...]) and
+    the values of the second axis to the values of the collection.
+- A [Pandas DataFrame](https://pandas.pydata.org/docs/reference/api/pandas.DataFrame.html):<br/>
+    Taipy charts can be defined by setting the appropriate axis property value to the DataFrame
+    column name.
+- A dictionary:<br/>
+    The value is converted into a Pandas DataFrame where each key/value pair is converted
+    to a column named *key* and the associated value. Note that this will work only when
+    all the values of the dictionary keys are series that have the same length.
+- A list of lists of values:<br/>
+    If all the lists have the same length, Taipy creates a Pandas DataFrame with it.<br/>
+    If sizes differ, then a DataFrame is created for each list, with a single column
+    called "*&lt;index&gt;*/0" where *index* is the index of the current list in the *data*
+    array. Then an array is built using all those DataFrames and used as described
+    below.
+- A Numpy series:<br/>
+    Taipy internally builds a Pandas DataFrame with the provided *data*.
+- A list of Pandas DataFrames:<br/>
+    This can be used when your chart must represent data sets of different sizes. In this case,
+    you must set the axis property ([*x*](#p-x), [*y*](#p-y), [*r*](#p-r), etc.) value to a string
+    with the format: "*&lt;index&gt;*/*&lt;column&gt;*" where *index* is the index of the DataFrame
+    you want to refer to (starting at index 0) and *column* would be the column name of the
+    referenced DataFrame.
+- A list of dictionaries<br/>
+    The *data* is converted to a list of Pandas DataFrames.
+
+### Indexed properties
+
+Chart controls can hold several traces that may display different data sets.<br/>
+To indicate properties for a given trace, you will use the indexed properties
+(the ones whose type is *indexed(type)*). When setting the value of an indexed
+property, you can specify which trace this property should apply to: you will
+use the *property_name[index]* syntax, where the indices start at index 1, to
+specify which trace is targeted for this property.
+
+Indexed properties can have a default value (using the *property_name* syntax with
+no index) which is overridden by any specified indexed property:<br/>
+Here is an example where *i_property* is an indexed property:
+
+```
+# This value applies to all the traces of the chart control
+general_value = <some_value>
+# This value applies to only the second trace of the chart control
+specific_value = <some_other_value>
+
+page = "<|...|chart|...|i_property={general_value}|i_property[2]={specific_value}|...|>"
+```
+
+In the definition for *page*, you can see that the value *general_value* is set to the
+property without the index operator ([]) syntax. That means it applies to all the traces
+of the chart control.<br/>
+*specific_value*, on the other hand, applies only to the second trace.
+
+An indexed property can also be assigned an array, without the index operator syntax.
+Then each value of the array is set to the property at the appropriate index, in sequence:
+
+```
+values = [
+    value1,
+    value2,
+    value3
+]
+
+page = "<|...|chart|...|i_property={values}|...|>"
+```
+
+is equivalent to
+
+```
+page = "<|...|chart|...|i_property[1]={value1}|i_property[2]={value2}|i_property[3]={value3}|...|>"
+```
+
+or slightly shorter (and if there are no more than three traces):
+
+```
+page = "<|...|chart|...|i_property={value1}|i_property[2]={value2}|i_property[3]={value3}|...|>"
+```
+
+## Styling
+
+All the chart controls are generated with the "taipy-chart" CSS class. You can use this class
+name to select the charts on your page and apply style.
+
+### [Stylekit](../styling/stylekit.md) support
+
+The [Stylekit](../styling/stylekit.md) provides a specific class that you can use to style charts:
+
+* *has-background*<br/>
+    When the chart control uses the *has-background* class, the rendering of the chart
+    background is left to the charting library.<br/>
+    The default behavior is to render the chart transparently.
+
+## Usage
+
+Here is a list of several sub-sections that you can check to get more details on a specific
+domain covered by the chart control:
+
+- [Basic concepts](charts/basics.md)

docs/manuals/gui/viselements/date.md_template

@@ -0,0 +1,55 @@
+A control that can display and specify a formatted date, with or without time.
+
+## Styling
+
+All the date controls are generated with the "taipy-date" CSS class. You can use this class
+name to select the date selectors on your page and apply style.
+
+### [Stylekit](../styling/stylekit.md) support
+
+The [Stylekit](../styling/stylekit.md) provides a specific class that you can use to style date selectors:
+
+* *fullwidth*<br/>
+    If a date selector uses the *fullwidth* class, then it uses the whole available
+    horizontal space.
+
+## Usage
+
+### Using the full date and time
+
+Assuming a variable _dt_ contains a Python `datetime` object, you can create
+a date selector that represents it:
+
+!!! example "Page content"
+
+    === "Markdown"
+
+        ```
+        <|{dt}|date|>
+        ```
+
+    === "HTML"
+
+        ```html
+        <taipy:date>{dt}</taipy:date>
+        ```
+
+### Using only the date
+
+If you don't need to use the date, you can do so:
+
+!!! example "Page content"
+
+    === "Markdown"
+
+        ```
+        <|{dt}|date|not with_time|>
+        ```
+
+    === "HTML"
+
+        ```html
+        <taipy:date with_time="false">{dt}</taipy:date>
+        ```
+
+