From 8bdbb415b56432ef382800fff72500b23f4ac836 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?G=C3=A9ry=20Debongnie?= Date: Fri, 22 Oct 2021 11:02:36 +0000 Subject: [PATCH] [ADD] developer: add page on generic components (js) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit closes odoo/documentation#1209 Signed-off-by: Géry Debongnie (ged) --- content/developer/reference/javascript.rst | 1 + .../javascript/generic_components.rst | 47 +++++++++++++++++++ 2 files changed, 48 insertions(+) create mode 100644 content/developer/reference/javascript/generic_components.rst diff --git a/content/developer/reference/javascript.rst b/content/developer/reference/javascript.rst index eb7426972..eacd15c6e 100644 --- a/content/developer/reference/javascript.rst +++ b/content/developer/reference/javascript.rst @@ -12,6 +12,7 @@ Javascript javascript/owl_component_system javascript/registries javascript/services + javascript/generic_components javascript/javascript_cheatsheet javascript/javascript_reference javascript/mobile diff --git a/content/developer/reference/javascript/generic_components.rst b/content/developer/reference/javascript/generic_components.rst new file mode 100644 index 000000000..9d08a8cc8 --- /dev/null +++ b/content/developer/reference/javascript/generic_components.rst @@ -0,0 +1,47 @@ +================== +Generic Components +================== + +The Odoo web client is built with `Owl `_ components. +To make it easier, the Odoo javascript framework provides a suite of generic +components that can be reused in some common situations, such as dropdowns, +checkboxes or datepickers. This page explains how to use these generic components. + +CheckBox +======== + +Location +-------- + +`@web/core/checkbox/checkbox` + +Description +----------- + +This is a simple checkbox component with a label next to it. The checkbox is +linked to the label: the checkbox is toggled whenever the label is clicked. + +.. code-block:: xml + + + Some Text + + +Props +----- + +.. list-table:: + :widths: 20 20 60 + :header-rows: 1 + + * - Name + - Type + - Description + * - `value` + - `boolean` + - if true, the checkbox is checked, otherwise it is unchecked + * - `disabled` + - `boolean` + - if true, the checkbox is disabled, otherwise it is enabled + +