From 737d8fea68246808ad35dc23f48d107ae22539c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr>
Date: Wed, 6 May 2020 10:50:20 +0200
Subject: [PATCH] [ivette] formatting TypeDoc comments

---
 ivette/src/dome/src/main/dome.js              |   1 +
 ivette/src/dome/src/misc/system.js            |   5 +-
 .../src/dome/src/renderer/controls/buttons.js |   6 +-
 .../src/dome/src/renderer/controls/icons.js   |   2 +
 .../src/dome/src/renderer/controls/labels.js  |   5 +-
 ivette/src/dome/src/renderer/data.js          | 240 +++++++++---------
 ivette/src/dome/src/renderer/dialogs.js       |   1 +
 ivette/src/dome/src/renderer/dnd.js           |  20 +-
 ivette/src/dome/src/renderer/dome.js          |  15 +-
 ivette/src/dome/src/renderer/errors.js        |   7 +-
 .../src/dome/src/renderer/frame/sidebars.js   |   9 +-
 ivette/src/dome/src/renderer/frame/tabs.js    |  12 +-
 .../src/dome/src/renderer/frame/toolbars.js   |   7 +-
 ivette/src/dome/src/renderer/layout/boxes.js  |  56 ++--
 .../src/dome/src/renderer/layout/dispatch.js  |  18 +-
 ivette/src/dome/src/renderer/layout/forms.js  |  51 ++--
 ivette/src/dome/src/renderer/layout/grids.js  |  31 ++-
 .../src/dome/src/renderer/layout/splitters.js |   5 +-
 ivette/src/dome/src/renderer/table/arrays.js  |  18 +-
 ivette/src/dome/src/renderer/table/models.js  |   7 +-
 ivette/src/dome/src/renderer/table/views.js   |  16 +-
 ivette/src/dome/src/renderer/text/buffers.js  |   5 +-
 ivette/src/dome/src/renderer/text/editors.js  |   9 +-
 ivette/src/dome/src/renderer/text/pages.js    |   5 +-
 ivette/src/frama-c/LabViews.tsx               |   8 +-
 ivette/src/frama-c/server.ts                  |   8 +-
 ivette/src/frama-c/states.ts                  |   9 +-
 27 files changed, 311 insertions(+), 265 deletions(-)

diff --git a/ivette/src/dome/src/main/dome.js b/ivette/src/dome/src/main/dome.js
index 6aa043b842e..c1f1452eb93 100644
--- a/ivette/src/dome/src/main/dome.js
+++ b/ivette/src/dome/src/main/dome.js
@@ -1,4 +1,5 @@
 /**
+   @packageDocumentation
    @module dome(main)
    @description
 
diff --git a/ivette/src/dome/src/misc/system.js b/ivette/src/dome/src/misc/system.js
index f246c2c372f..48808f72562 100644
--- a/ivette/src/dome/src/misc/system.js
+++ b/ivette/src/dome/src/misc/system.js
@@ -1,4 +1,7 @@
-/** @module dome/system */
+/**
+   @packageDocumentation
+   @module dome/system
+*/
 
 // --------------------------------------------------------------------------
 // --- Evolved Spawn Process
diff --git a/ivette/src/dome/src/renderer/controls/buttons.js b/ivette/src/dome/src/renderer/controls/buttons.js
index a79c24cbb0b..c1bb0d0724d 100644
--- a/ivette/src/dome/src/renderer/controls/buttons.js
+++ b/ivette/src/dome/src/renderer/controls/buttons.js
@@ -3,6 +3,7 @@
 // --------------------------------------------------------------------------
 
 /**
+   @packageDocumentation
    @module dome/controls/buttons
    @description
 
@@ -346,7 +347,7 @@ export const Switch = (props) => {
    @property {string} [className] - Additional class
    @property {object} [style] - Additional style
    @description
-   See also [RadioGroup](module-dome_controls_buttons.RadioGroup.html).
+   See also [[RadioGroup]].
 
    <strong>Note:</strong> property `value` and `selection` are consistent
    with HTML standards and DOM element properties.
@@ -382,8 +383,7 @@ export const Radio = (props) => {
    @property {string} [className] - Additional class of the container `<div>`
    @property {object} [style] - Additional style of the container `<div>`
    @description
-   Childrens of the `RadioGroup` shall be [Radio](module-dome_controls_buttons.Radio.html)
-   buttons.
+   Childrens of the `RadioGroup` shall be [[Radio]] buttons.
 
    The selected value of the group is broadcasted to the radio buttons. Their
    callbacks are activated _before_ the radio group one, if any.
diff --git a/ivette/src/dome/src/renderer/controls/icons.js b/ivette/src/dome/src/renderer/controls/icons.js
index 35da53950a7..1b7e040130b 100644
--- a/ivette/src/dome/src/renderer/controls/icons.js
+++ b/ivette/src/dome/src/renderer/controls/icons.js
@@ -3,8 +3,10 @@
 // --------------------------------------------------------------------------
 
 /**
+   @packageDocumentation
    @module dome/controls/icons
    @description
+
    Consult the [Icon Gallery](gallery-icons.html) for default icons.
    You can [register](#.register) new icons or override existing ones
    and [iterate](#.forEach) over the icon base.
diff --git a/ivette/src/dome/src/renderer/controls/labels.js b/ivette/src/dome/src/renderer/controls/labels.js
index 70c86ce8577..53b435e8884 100644
--- a/ivette/src/dome/src/renderer/controls/labels.js
+++ b/ivette/src/dome/src/renderer/controls/labels.js
@@ -2,7 +2,10 @@
 // --- Labels
 // --------------------------------------------------------------------------
 
-/** @module dome/controls/labels */
+/**
+   @packageDocumentation
+   @module dome/controls/labels
+*/
 
 import React from 'react' ;
 import { Icon } from './icons' ;
diff --git a/ivette/src/dome/src/renderer/data.js b/ivette/src/dome/src/renderer/data.js
index 82659851493..2105a9bfafd 100644
--- a/ivette/src/dome/src/renderer/data.js
+++ b/ivette/src/dome/src/renderer/data.js
@@ -2,123 +2,124 @@
 // --- Data Collector
 // --------------------------------------------------------------------------
 
-/** @module dome/data
-    @description
-
-This module allows to integrate data definitions within React elements.
-Typically, you can use it to define your own structure of logical elements
-and display them at different places in the GUI. For instance, you may
-want to define a custom list of elements, where each element
-will be rendered twice: locally with the currenly selected item, and in a side-bar
-or in the menu-bar, or for any other purpose than rendering. You want to declare
-your list like this:
-
-```{jsx}
-    <MyList>
-       <MyItem id={A} ... >...</MyItem>
-       <MyItem id={B} ... >...</MyItem>
-       <MyItem id={C} ... >...</MyItem>
-    </MyList>
-```
-
-Dome data libraries, as provided by this module, allows you to define such
-collection of data mixed with rendered elements.
-
-Data are collected through libraries.
-You create libraries with `createLibrary()` or `useLocalLibrary()` and
-then provide them to `<Data.Item>`, `<Data.Component>`, `<Data.Node>` or
-`<Data.Fragment>` elements.
-
-At any (other) point of the tree, you can use the collected items
-with the `useLibrary()` custom React hook.
-
-Libraries are pushed down the React virtual tree _via_ React context,
-so you don't need to re-specify it for children of `<Data.Node/>`
-and `<Data.Fragment/>`.
-
-Items must be identified with a unique `id` ; they are sorted according
-to their `order` property, although `<Data.Fragment/>` and `<Data.Node/>`
-preserve the order of data collected from each of their children. Items are
-collected when they are actually _mounted_ by React,
-like any other React element.
-
-Data elements are normal React element, that might be rendered by
-visible elements in the DOM. You may think of data elements as having a
-double rendering: mounted data items are collected into libraries, and normal visible
-elements are collected into the React virtual DOM. Each kind of data element is
-rendered differenly with this respect:
-
-- `<Data.Item>` renders its children within a React fragment;
-- `<Data.Node>` is like an item, with its data children stored in the registered item;
-- `<Data.Component>` always renders 'null' and capture its React children elements in the registered item;
-- `<Data.Fragment>` renders its children within a React fragment, with optional context library and specified order.
-
-See each component for more details.
-
-As an example of use, the introductory example can be implemented as follows:
-
-
-```{jsx}
-    const lib = createLibrary();
-
-    // To be used at any (possibly repeated) place in the hierarchy of react elements
-    // Children items are only added to the library when the list is mounted
-    const MyList = ({ children }) => {
+/**
+   @packageDocumentation
+   @module dome/data
+   @description
+   This module allows to integrate data definitions within React elements.
+
+   Typically, you can use it to define your own structure of logical elements
+   and display them at different places in the GUI. For instance, you may
+   want to define a custom list of elements, where each element
+   will be rendered twice: locally with the currenly selected item, and in a side-bar
+   or in the menu-bar, or for any other purpose than rendering. You want to declare
+   your list like this:
+
+   * ```jsx
+   * <MyList>
+   *   <MyItem id={A} ... >...</MyItem>
+   *   <MyItem id={B} ... >...</MyItem>
+   *   <MyItem id={C} ... >...</MyItem>
+   * </MyList>
+   * ```
+
+   Dome data libraries, as provided by this module, allows you to define such
+   collection of data mixed with rendered elements.
+
+   Data are collected through libraries.
+   You create libraries with `createLibrary()` or `useLocalLibrary()` and
+   then provide them to `<Data.Item>`, `<Data.Component>`, `<Data.Node>` or
+   `<Data.Fragment>` elements.
+
+   At any (other) point of the tree, you can use the collected items
+   with the `useLibrary()` custom React hook.
+
+   Libraries are pushed down the React virtual tree _via_ React context,
+   so you don't need to re-specify it for children of `<Data.Node/>`
+   and `<Data.Fragment/>`.
+
+   Items must be identified with a unique `id` ; they are sorted according
+   to their `order` property, although `<Data.Fragment/>` and `<Data.Node/>`
+   preserve the order of data collected from each of their children. Items are
+   collected when they are actually _mounted_ by React,
+   like any other React element.
+
+   Data elements are normal React element, that might be rendered by
+   visible elements in the DOM. You may think of data elements as having a
+   double rendering: mounted data items are collected into libraries, and normal visible
+   elements are collected into the React virtual DOM. Each kind of data element is
+   rendered differenly with this respect:
+
+   - `<Data.Item>` renders its children within a React fragment;
+   - `<Data.Node>` is like an item, with its data children stored in the registered item;
+   - `<Data.Component>` always renders 'null' and capture its React children elements
+     in the registered item;
+   - `<Data.Fragment>` renders its children within a React fragment, with optional context
+     library and specified order.
+
+   See each component for more details.
+
+   As an example of use, the introductory example can be implemented as follows:
+
+   ```jsx
+     const lib = createLibrary();
+
+     // To be used at any (possibly repeated) place in the hierarchy of react elements
+     // Children items are only added to the library when the list is mounted
+     const MyList = ({ children }) => {
        // Actually renders nothing if children only contains items.
        // The fragment makes items keep their declaration ordering.
        return (
           <Data.Fragment lib={lib}>{children}</Data.Fragment>
        );
-    };
+     };
 
-    // To be used also at any (possibly repeated) place in the hierarchy
-    const MyItem = (props) => <Data.Item lib={lib} {...props} /> ;
+     // To be used also at any (possibly repeated) place in the hierarchy
+     const MyItem = (props) => <Data.Item lib={lib} {...props} /> ;
 
-    // To be used for instance at top-level inside a side-bar
-    const MyListIndex = () => {
+     // To be used for instance at top-level inside a side-bar
+     const MyListIndex = () => {
        let items = Data.useLibrary(lib);
        return (
          <ul>
            { items.map(({id,label}) => (<li key={id}>{label}</li>)) }
          </ul>
        );
-    };
-```
-
+     };
+   ```
 */
 
-import _ from 'lodash' ;
+import _ from 'lodash';
 import React from 'react';
-import * as Dome from 'dome' ;
-import EventEmitter from 'events' ;
+import * as Dome from 'dome';
+import EventEmitter from 'events';
 
 // --------------------------------------------------------------------------
 // --- Libraries
 // --------------------------------------------------------------------------
 
 const reOrder = (items) =>
-      _.sortBy( items , [ 'order','id' ] )
-      .map( (item,order) => Object.assign( item, { order } ));
+  _.sortBy(items, ['order', 'id'])
+    .map((item, order) => Object.assign(item, { order }));
 
 /**
     @summary Data Collector.
     @description
     Libraries are used to collect data through the React virtual DOM.
 */
-class Library extends EventEmitter
-{
+class Library extends EventEmitter {
 
   constructor() {
     super();
     this.items = {};
     this.lastItems = {};
-    this._trigger = _.debounce(this._trigger,10);
+    this._trigger = _.debounce(this._trigger, 10);
   }
 
   _trigger() {
-    if (!_.isEqual( this.items , this.lastItems )) {
-      this.lastItems = this.items ;
-      this.sorted = undefined ;
+    if (!_.isEqual(this.items, this.lastItems)) {
+      this.lastItems = this.items;
+      this.sorted = undefined;
       this.emit('trigger');
     }
   };
@@ -128,10 +129,10 @@ class Library extends EventEmitter
      @param {object} item - must have an `'id'` property
    */
   add(item) {
-    const id = item.id ;
+    const id = item.id;
     if (Dome.DEVEL && this.items[id])
       console.warn(`[dome/data] duplicate item identifier (${id})`);
-    this.items[id] = item ;
+    this.items[id] = item;
     this._trigger();
   }
 
@@ -149,20 +150,20 @@ class Library extends EventEmitter
      @return {Array<object>} items array sorted by `'order'` and `'id'` properties.
    */
   contents() {
-    return this.sorted || (this.sorted = reOrder( this.items ));
+    return this.sorted || (this.sorted = reOrder(this.items));
   }
 
   /**
      @summary Register callback.
      @param {function} callback - invoked when library contents changes
   **/
-  on(callback) { this.on('trigger',callback); }
+  on(callback) { this.on('trigger', callback); }
 
   /**
      @summary Un-register callback.
      @param {function} callback - callback to unregister
   **/
-  off(callback) { this.off('trigger',callback); }
+  off(callback) { this.off('trigger', callback); }
 
 }
 
@@ -184,7 +185,7 @@ export function createLibrary() { return new Library(); }
  */
 export function useLibrary(library) {
   const forceUpdate = Dome.useForceUpdate();
-  Dome.useEmitter( library , 'trigger' , forceUpdate );
+  Dome.useEmitter(library, 'trigger', forceUpdate);
   return library.contents();
 }
 
@@ -200,40 +201,39 @@ export function useLibrary(library) {
    ```
  */
 export function useLocalLibrary() {
-  const library = React.useMemo( createLibrary , [] );
-  const items = useLibrary( library );
-  return { library , items };
+  const library = React.useMemo(createLibrary, []);
+  const items = useLibrary(library);
+  return { library, items };
 }
 
 const CurrentLib = React.createContext();
 const CurrentPath = React.createContext([]);
 
-const makePath = (path,order) =>
-      order === undefined ? path : path.slice(0,-1).concat(order);
+const makePath = (path, order) =>
+  order === undefined ? path : path.slice(0, -1).concat(order);
 
 /**
    @summary Current library (Custom React Hook).
    @return {Library} in local context
  */
 export function useCurrentLibrary() {
-  return React.useContext( CurrentLib );
+  return React.useContext(CurrentLib);
 }
 
 // --------------------------------------------------------------------------
 // --- Internals
 // --------------------------------------------------------------------------
 
-function useLocalItem( { lib:localLib, id, order, ...itemProps }, children )
-{
+function useLocalItem({ lib: localLib, id, order, ...itemProps }, children) {
   const currentLib = React.useContext(CurrentLib);
   const currentPath = React.useContext(CurrentPath);
-  const path = makePath( currentPath, order );
-  React.useEffect( () => {
-    const library = localLib || currentLib ;
+  const path = makePath(currentPath, order);
+  React.useEffect(() => {
+    const library = localLib || currentLib;
     if (id && library) {
-      const item = { id, order:path, ...itemProps };
-      if (children) item.children = children ;
-      library.add(item) ;
+      const item = { id, order: path, ...itemProps };
+      if (children) item.children = children;
+      library.add(item);
       return () => library.remove(id);
     } else
       return undefined;
@@ -241,23 +241,22 @@ function useLocalItem( { lib:localLib, id, order, ...itemProps }, children )
   return path;
 };
 
-function makeChildren( path, children)
-{
-  const n = React.Children.count( children );
+function makeChildren(path, children) {
+  const n = React.Children.count(children);
   if (n == 0) return null;
   else {
-    const childContext = (elt,k) => {
+    const childContext = (elt, k) => {
       if (elt) {
-        const newPath = path.concat(1+k);
+        const newPath = path.concat(1 + k);
         return (
           <CurrentPath.Provider value={newPath}>
             {elt}
           </CurrentPath.Provider>
         );
       } else
-        return elt ;
+        return elt;
     };
-    return React.Children.map( children, childContext );
+    return React.Children.map(children, childContext);
   }
 }
 
@@ -285,9 +284,9 @@ function makeChildren( path, children)
    An `<Item/>` element rendres its children in a nested, ordered fragment,
    but with the same current library than the inherited one, if any.
 */
-export const Item = ( { children, ...props} ) => {
-  let path = useLocalItem( props );
-  return (<React.Fragment>{makeChildren(path,children)}</React.Fragment>);
+export const Item = ({ children, ...props }) => {
+  let path = useLocalItem(props);
+  return (<React.Fragment>{makeChildren(path, children)}</React.Fragment>);
 };
 
 // --------------------------------------------------------------------------
@@ -321,8 +320,8 @@ export const Item = ( { children, ...props} ) => {
 
    The component element itself is rendered as `null` when mounted in the virtual DOM by React.
 */
-export const Component = ( { children, ...props} ) => {
-  useLocalItem( props, children );
+export const Component = ({ children, ...props }) => {
+  useLocalItem(props, children);
   return null;
 };
 
@@ -358,10 +357,10 @@ export const Component = ( { children, ...props} ) => {
 */
 export const Node = ({ children, ...props }) => {
   let { library, items } = useLocalLibrary();
-  let path = useLocalItem( props , items );
+  let path = useLocalItem(props, items);
   return (
     <CurrentLib.Provider value={library}>
-      {makeChildren( path, children )}
+      {makeChildren(path, children)}
     </CurrentLib.Provider>
   );
 };
@@ -378,16 +377,15 @@ export const Node = ({ children, ...props }) => {
    @property {boolean} [disabled] - fragment shal not be rendered (default: `false`)
    @property {React.Children} [children] - sub-data and rendering of the data collection
  */
-export const Fragment = ({lib:localLib, order, enabled=true, disabled=false, children, ...localProps}) => {
+export const Fragment = ({ lib: localLib, order, enabled = true, disabled = false, children, ...localProps }) => {
   const currentLib = React.useContext(CurrentLib);
   const currentPath = React.useContext(CurrentPath);
-  const library = localLib || currentLib ;
-  if ( enabled && !disabled && React.Children.count(children) > 0 )
-  {
-    const path = makePath( currentPath, order );
+  const library = localLib || currentLib;
+  if (enabled && !disabled && React.Children.count(children) > 0) {
+    const path = makePath(currentPath, order);
     return (
       <CurrentLib.Provider value={library}>
-        {makeChildren( path, children )}
+        {makeChildren(path, children)}
       </CurrentLib.Provider>
     );
   } else
diff --git a/ivette/src/dome/src/renderer/dialogs.js b/ivette/src/dome/src/renderer/dialogs.js
index f76515e4587..1532f867e03 100644
--- a/ivette/src/dome/src/renderer/dialogs.js
+++ b/ivette/src/dome/src/renderer/dialogs.js
@@ -1,4 +1,5 @@
 /**
+   @packageDocumentation
    @module dome/dialogs
    @description
    Various kind of (modal) dialogs attached to the main application window.
diff --git a/ivette/src/dome/src/renderer/dnd.js b/ivette/src/dome/src/renderer/dnd.js
index 74aa1755bba..b27c0ef3e5c 100644
--- a/ivette/src/dome/src/renderer/dnd.js
+++ b/ivette/src/dome/src/renderer/dnd.js
@@ -1,9 +1,9 @@
 /**
+   @packageDocumentation
    @module dome/dnd
-   @summary Drag & Drop Features.
    @description
 
-## D&D Sequences
+## Drag & Drop
 
 A Drag & Drop sequence is monitored by a D&D controller.
 Drag Sources initiates the a D&D sequence, and the D&D controller will then
@@ -200,8 +200,7 @@ export const dispatchEvent = ( dragging , handlers ) => {
 
    The handler object shall define listeners to the D&D dragging events.
    Each callback is sensible to specific kind of events, as specified
-   in the [event listeners](module-dome_dnd.html)
-   documentation.
+   in the [[dome/dnd | event listeners]] documentation.
 
    You need a D&D controller whenever an element can be dragged
    between different containers. D&D controllers also offers an
@@ -620,17 +619,16 @@ Source element to attach its event handlers into it. You are then fully responsi
 the element both _during_ and _outside_ of a D&D sequence. No internal `<div>` element is inserted for you,
 and the `className`, `style` and `position` properties are ignored.
 
-Finally, you may also use an [Overlay](module-dome_dnd.Overlay.html) component to render
+Finally, you may also use an [[Overlay]] component to render
 your content, by setting `overlay=true` or passing `overlay` the desired properties.
 
-When dragged, the [DnD](module-dome_dnd.DnD.html) controller is informed and dispatches
+When dragged, the [[DnD]] controller is informed and dispatches
 the dragging events to the registered drop targets. The `handle` selector can be used
 to identify which parts of the content may initiate the drag. By default, any drag event
 may initiate the drag.
 
 The `onDnd` event listener receives all D&D events associated to this drop target.
-See [event callbacks](module-dome_dnd.html)
-documentation for more details on other specific event listeners.
+See event callbacks documentation for more details on other specific event listeners.
 
 The `draggable` object, when provided, is used to inject additional properties
 into the internal `Draggable` or `DraggableCore` wrapper used to manage D&D events.
@@ -762,7 +760,7 @@ export class DragSource extends React.Component
    @description
 
 Crates a drop target container and register its callbacks into the specified
-[DnD](module-dome_dnd.DnD.html) controller. In case the DnD controller is undefined,
+[[DnD]] controller. In case the DnD controller is undefined,
 the drag events are just disabled.
 
 The drop target container must inform the D&D controller of its DOM element that is responsible
@@ -778,8 +776,8 @@ will not respond to dragging events.
 In case of custom rendering, the `className` and `style` properties are ignored.
 
 During a D&D sequence, the `onDnd` event listener receives all D&D events associated
-to this drop target. See [event callbacks](module-dome_dnd.html)
-documentation for more details on other specific event listeners.
+to this drop target. See event callbacks documentation for more details on
+other specific event listeners.
 
 */
 export class DropTarget extends React.Component
diff --git a/ivette/src/dome/src/renderer/dome.js b/ivette/src/dome/src/renderer/dome.js
index 0c97272ae00..6a1dd9d107f 100644
--- a/ivette/src/dome/src/renderer/dome.js
+++ b/ivette/src/dome/src/renderer/dome.js
@@ -1,4 +1,5 @@
 /**
+   @packageDocumentation
    @module dome(renderer)
    @description
 
@@ -7,9 +8,13 @@
    This modules manages your main application window
    and its interaction with the main process.
 
-   @example // File 'src/renderer/index.js':
+   Example:
+
+   ```typescript
+   // File 'src/renderer/index.js':
    import Application from './Application.js' ;
    Dome.setContent( Application );
+   ```
  */
 
 import _ from 'lodash' ;
@@ -51,7 +56,7 @@ export const DEVEL = System.DEVEL ;
 
 /** @summary System platform.
     @description
-    Same as [`platform`](module-dome_system.html#.platform) from `dome/system` */
+    Same as `platform` from `dome/system` */
 export const platform = System.platform ;
 
 // --------------------------------------------------------------------------
@@ -127,9 +132,9 @@ Register a callback on [dome.command](#~event:'dome.reload') event,
 emitted by the `Main` process when the application instance is launched.
 
 See also:
- - [Dome.useCommand](#.useCommand)
- - [System.getArguments](module-dome_system.html#.getArguments)
- - [System.getWorkingDir](module-dome_system.html#.getWorkingDir)
+ - [[useCommand]]
+ - [[System.getArguments]]
+ - [[System.getWorkingDir]]
 */
 export function onCommand(job) { emitter.on('dome.command',job); }
 
diff --git a/ivette/src/dome/src/renderer/errors.js b/ivette/src/dome/src/renderer/errors.js
index bb3ea064aae..ae951aa7ee0 100644
--- a/ivette/src/dome/src/renderer/errors.js
+++ b/ivette/src/dome/src/renderer/errors.js
@@ -2,12 +2,15 @@
 // --- Managing Errors
 // --------------------------------------------------------------------------
 
+/**
+   @packageDocumentation
+   @module dome/errors
+*/
+
 import React from 'react' ;
 import { Label } from 'dome/controls/labels' ;
 import { Button } from 'dome/controls/buttons' ;
 
-/** @module dome/errors */
-
 // --------------------------------------------------------------------------
 // --- Error Boundaries
 // --------------------------------------------------------------------------
diff --git a/ivette/src/dome/src/renderer/frame/sidebars.js b/ivette/src/dome/src/renderer/frame/sidebars.js
index 5f0421cfd42..c4b6ce3b177 100644
--- a/ivette/src/dome/src/renderer/frame/sidebars.js
+++ b/ivette/src/dome/src/renderer/frame/sidebars.js
@@ -2,7 +2,10 @@
 // --- SideBars
 // --------------------------------------------------------------------------
 
-/** @module dome/frame/sidebars */
+/**
+   @packageDocumentation
+   @module dome/frame/sidebars
+*/
 
 import React from 'react' ;
 import * as Dome from 'dome' ;
@@ -25,7 +28,7 @@ const SideBarContext = React.createContext();
    @property {function} [onSelection] - Selection callback
    @property {function} [onContextMenu] - Context Menu callback
    @description
-   See also [Frame](module-dome_layout_frames.Frame.html) containers.
+   See also [[Frame]] containers.
 
    When a base settings is set on the sidebar, all contained
    sections and items are attributed derived settings based on their identifiers.
@@ -160,7 +163,7 @@ export function Section(props) {
    Context menu callback also triggers the selection callback (first).
    In case callbacks are defined from the englobing sidebar, both are invoked.
 
-   Badges can be single or multiple [Badge](module-dome_controls_icons.Badge.html) values.
+   Badges can be single or multiple [[Badge]] values.
    They are displayed stacked on the right edge of the item.
 
 **/
diff --git a/ivette/src/dome/src/renderer/frame/tabs.js b/ivette/src/dome/src/renderer/frame/tabs.js
index 9f14f3c9d6d..3a8fff85f0d 100644
--- a/ivette/src/dome/src/renderer/frame/tabs.js
+++ b/ivette/src/dome/src/renderer/frame/tabs.js
@@ -2,7 +2,10 @@
 // --- Tabs
 // --------------------------------------------------------------------------
 
-/** @module dome/frame/tabs */
+/**
+   @packageDocumentation
+   @module dome/frame/tabs
+*/
 
 import React from 'react' ;
 import { Icon } from 'dome/controls/icons' ;
@@ -13,7 +16,7 @@ import './style.css' ;
    @class
    @summary Pure Container for tab buttons.
    @description
-   Shall contains [Tab](module-dome_layout_tabs.Tab.html) instances.
+   Shall contains only [[Tab]] instances.
 */
 // --------------------------------------------------------------------------
 // --- Tabs Bar
@@ -48,8 +51,7 @@ const HIDDEN  = { display: 'none' };
    @property {boolean} [content] - render content instead of tab
    @description
    A single tab selector. Shall only be used as a children
-   of [TabsBar](module-dome_layout_tabs.TabsBar.html)
-   or [Frame](module-dome_layout_frames.Frame.html).
+   of [[TabsBar]] or [[Frame]].
 
    When `content` is positionned, the component renders
    its content children instead of the tab button. In such a case, content
@@ -98,7 +100,7 @@ export function Tab(props) {
    @property {string} selection - tab identifier to render
    @property {Tab[]} children - tabs (content) to render
    @description
-   Shall contains [Tab](module-dome_layout_tabs.Tab.html) instances.
+   Shall contains [[Tab]] instances.
    Only the selected tab identifier will be displayed, although all tab
    contents remains properly mounted. If no tab is selected,
    no content is displayed.
diff --git a/ivette/src/dome/src/renderer/frame/toolbars.js b/ivette/src/dome/src/renderer/frame/toolbars.js
index 24dff66185f..c17ea7ca1ff 100644
--- a/ivette/src/dome/src/renderer/frame/toolbars.js
+++ b/ivette/src/dome/src/renderer/frame/toolbars.js
@@ -2,7 +2,10 @@
 // --- ToolBars
 // --------------------------------------------------------------------------
 
-/** @module dome/frame/toolbars */
+/**
+   @packageDocumentation
+   @module dome/frame/toolbars
+*/
 
 import React from 'react' ;
 
@@ -16,7 +19,7 @@ import './style.css' ;
    @class
    @summary Container for toolbar items.
    @description
-   See also [Frame](module-dome_layout_frames.Frame.html) containers.
+   See also [[Frame]] containers.
  */
 export class ToolBar extends React.Component {
 
diff --git a/ivette/src/dome/src/renderer/layout/boxes.js b/ivette/src/dome/src/renderer/layout/boxes.js
index 6dc0a7b8c92..e7848a9ddcc 100644
--- a/ivette/src/dome/src/renderer/layout/boxes.js
+++ b/ivette/src/dome/src/renderer/layout/boxes.js
@@ -2,41 +2,39 @@
 // --- Box Layout
 // --------------------------------------------------------------------------
 
-/** @module dome/layout/boxes
-    @description
-
-This modules offers several `<div>` containers with various
-predefined layout.
-
-Boxes are the very elementary way to layout components horizontally
-or vertically. The different kinds of proposed boxes differ in how they
-extends in both directions: normal boxes extends
-along their layout direction, _pack_ boxes don't extends and _fill_ boxes
-extends along both directions.
+/**
+   @packageDocumentation
+   @module dome/layout/boxes
+   @description
 
-Grids layout their component from left-to-right inside predefined _columns_,
-then vertically by wrapping cells in rows.
+   This modules offers several `<div>` containers with various
+   predefined layout.
 
-The various containers are summarized on the table below:
+   Boxes are the very elementary way to layout components horizontally
+   or vertically. The different kinds of proposed boxes differ in how they
+   extends in both directions: normal boxes extends
+   along their layout direction, _pack_ boxes don't extends and _fill_ boxes
+   extends along both directions.
 
-| **Box** | Layout | Extends |
-|:-------------:|:-----------:|:----------:|:----------:|
-| [Hbox](module-dome_layout_boxes.Hpack.html) | horiz. | horiz. |
-| [Vbox](module-dome_layout_boxes.Vpack.html) | vert. | vert. |
-| [Hpack](module-dome_layout_boxes.Hpack.html) | horiz. | none |
-| [Vpack](module-dome_layout_boxes.Vpack.html) | vert. | none |
-| [Hfill](module-dome_layout_boxes.Hpack.html) | horiz. | both |
-| [Vfill](module-dome_layout_boxes.Vpack.html) | vert. | both |
-| [Grid](module-dome_layout_boxes.Hpack.html) | columns | both |
-| [Scroll](module-dome_layout_boxes.Scroll.html) | n/a | both |
+   Grids layout their component from left-to-right inside predefined _columns_,
+   then vertically by wrapping cells in rows.
 
-Inside a box, you may add `<Space/>` and `<Filler/>` to separate items.
-Inside a grid, you may also use `<Space/>` or an empty `<div/>` for empty cells.
+   The various containers layout and extensibility is listed below:
+    - [[Hbox]] horizontal, fixed height
+    - [[Vbox]] vertical, fixed width
+    - [[Hpack]] horizontal, fixed dimensions
+    - [[Vpack]] vertical, fixed dimensions
+    - [[Hfill]] horizontal, extends in both directions
+    - [[Vfill]] vertical, extends in both directions
+    - [[Grid]] uses CSS grid columns, extends in both directions
+    - [[Scroll]] scrolls its content
 
-<strong>Warning:</strong> large elements will be clipped if they overflow.
-If you want to add scrolling capabilities to some item that does not manage overflow
-natively, place it inside a `<Scroll/>` sub-container.
+   Inside a box, you may add `<Space/>` and `<Filler/>` to separate items.
+   Inside a grid, you may also use `<Space/>` or an empty `<div/>` for empty cells.
 
+   <strong>Warning:</strong> large elements will be clipped if they overflow.
+   If you want to add scrolling capabilities to some item that does not manage overflow
+   natively, place it inside a `<Scroll/>` sub-container.
 */
 
 import React from 'react';
diff --git a/ivette/src/dome/src/renderer/layout/dispatch.js b/ivette/src/dome/src/renderer/layout/dispatch.js
index 3ab66aeeb6f..1e02c53c0c8 100644
--- a/ivette/src/dome/src/renderer/layout/dispatch.js
+++ b/ivette/src/dome/src/renderer/layout/dispatch.js
@@ -2,17 +2,19 @@
 // --- Dispatch Layout
 // --------------------------------------------------------------------------
 
-/** @module dome/layout/dispatch
-    @description
+/**
+   @packageDocumentation
+   @module dome/layout/dispatch
+   @description
 
-This module allow to declare components anywhere in a component hierarchy
-and to render them a totally different place.
+   This module allows to declare components anywhere in a component hierarchy
+   and to render them a totally different place.
 
-You shall wrap dispatched components inside a `<Dispatch.Item>` container,
-and render them wherever you want with `<Dispatch.Render>`. Each target
-place can display only one uniquely identified item.
+   You shall wrap dispatched components inside a `<Dispatch.Item>` container,
+   and render them wherever you want with `<Dispatch.Render>`. Each target
+   place can display only one uniquely identified item.
 
-This can be also used to display some item among many in one unique place.
+   This can be also used to display some item among many in one unique place.
 */
 
 import _ from 'lodash' ;
diff --git a/ivette/src/dome/src/renderer/layout/forms.js b/ivette/src/dome/src/renderer/layout/forms.js
index ad53e812169..101bbfaf6ff 100644
--- a/ivette/src/dome/src/renderer/layout/forms.js
+++ b/ivette/src/dome/src/renderer/layout/forms.js
@@ -2,7 +2,10 @@
 // --- Form Layout
 // --------------------------------------------------------------------------
 
-/** @module dome/layout/forms */
+/**
+   @packageDocumentation
+   @module dome/layout/forms
+*/
 
 import _ from 'lodash' ;
 import React from 'react' ;
@@ -307,14 +310,14 @@ export function Select({
    @property {object} [error] - Set the form context error
    @property {boolean} [disabled] - Disables the form (default is `false`)
    @property {onChange} [function] - Callback to updated `(value,error)`
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {React.children|function} [children] - Fields to populate the form
    @description
 
    Setup a form context with the provided values.
    A local state is maintained unless you fully control the `value` and `error`
    properties. You may also specify any other properties of the
-   [Select](module-dome_layout_forms.Select.html) filter component.
+   [[Select]] filter component.
 
 */
 
@@ -387,7 +390,7 @@ const TITLE_DISABLED = 'dome-text-title dome-disabled' ;
    @property {string} [path] - Fields selection
    @property {string} [settings] - User's settings for making fold/unfold state persistent
    @property {boolean} [unfold] - Default fold/unfold state (default is `false`)
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {React.children|function} [children] - Section field content
    @description
    Wraps some fields inside a foldable section.
@@ -431,7 +434,7 @@ export function Section(props)
 
 /**
    @summary Full width form block.
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {React.children|function} [children] - Block content
    @description
    Wraps its children inside the entire width of the form.
@@ -464,7 +467,7 @@ const FIELD_DISABLED = 'dome-xForm-field dome-text-label dome-disabled';
    @property {string} [title] - Field tooltip text
    @property {number} [offset] - Vertical label offset (for baseline alignment)
    @property {boolean|string} [warn] - Display errors (default: `true`)
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {React.children|function} [children] - Custom field content
    @description
 
@@ -472,10 +475,10 @@ Field layout inside a Form container.
 The custom field component is positionned on the left of the label, right-aligned.
 The label itself is left-aligned with the other fields.
 
-The Field component setup a [Select](module-dome_layout_forms.Select.html)
-filter for your custom component. Additionnaly, if you use a custom function rendering,
-the context is enriched with the `id` of the `<label/>` DOM element of the label, that
-you can use with `<input htmlFor={id}/>` as custom field component.
+The Field component setup a [[Select]] filter for your custom
+component. Additionnaly, if you use a custom function rendering, the context is
+enriched with the `id` of the `<label/>` DOM element of the label, that you can
+use with `<input htmlFor={id}/>` as custom field component.
 
 A warning badge is displayed on the right of your custom component, unless `warn:false`
 is specified. When hovered, the badge displays `Error` or the specified `string`. When
@@ -524,7 +527,7 @@ export class Field extends React.Component
    @property {string} [label] - Field label
    @property {string} [title] - Field tooltip text
    @property {boolean} [warn] - Display errors (default: `false`)
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {React.children|function} [children] - List field content
    @description
 
@@ -554,7 +557,7 @@ export const FieldList = ({ label, title, warn=false, children, ...props }) => (
    @property {string} [placeholder] - Input field place holder
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Text Input element. The default latency is set to 600ms.
 */
@@ -585,7 +588,7 @@ export const FieldText = ({ className, style, latency=true, placeholder, ...prop
    @property {string} [placeholder] - Input field place holder
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Text Input element. The default latency is set to 600ms.
 */
@@ -618,7 +621,7 @@ export const FieldCode = ({ className, style, latency=true, placeholder, ...prop
    @property {number} [cols] - Number of columns (default 35, min 5)
    @property {number} [rows] - Number of lines (default 5, min 2)
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Text Input element. The default latency is set to 900ms.
 */
@@ -654,7 +657,7 @@ export const FieldTextArea = ({ className, style, cols=35, rows=5,
    @property {number} [cols] - Number of columns (default 35, min 5)
    @property {number} [rows] - Number of lines (default 5, min 2)
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Text Input element. The default latency is set to 900ms.
 */
@@ -706,7 +709,7 @@ const NUMBER_OF_TEXT = (s) => s==='' ? undefined : PARSE_NUMBER(s.replace(/[ ,]/
    @property {string} [units] - Number units or currency
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field to edit number values with a Text Input element.
    The default latency is set to 600ms. Numbers are rendered in the english locale, grouping thousands
@@ -772,7 +775,7 @@ const INT_RANGE = (min,max,warning) => (v) =>
    @property {string} [warning] - Out of bound message (default is explaining the range)
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field to edit integer numbers with a spinner element.
    The default latency is set to 600ms.
@@ -868,7 +871,7 @@ class REVEAL extends React.Component {
    @property {boolean|function} [show] - Display the selected value on the right (default is `true`)
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field to edit integer numbers with a spinner element.
    The default latency is set to 600ms. Double click on the slider reset it
@@ -914,7 +917,7 @@ export const FieldSlider =
    @property {string} [max] - Maximum date (default to `undefined`)
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Date Input element. The default latency is set to 600ms.
    The date is presented in english locale, with format `mm/dd/yyyy`, but the internal value
@@ -947,7 +950,7 @@ export const FieldDate = ({ className, style, latency=true, min, max, ...props }
    @property {string} [max] - Maximum time (default to `undefined`)
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Time Input element. The default latency is set to 600ms.
    The time is presented in english locale, but its internal value is a string 'hh:mm'
@@ -979,7 +982,7 @@ export const FieldTime = ({ className, style, latency=true, min, max, ...props }
    @property {string} [title] - Field tooltip text
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    Field with a Text Input element. The default latency is set to 600ms.
 */
@@ -1009,7 +1012,7 @@ export const FieldColor = ({ className, style, latency=true, ...props }) => (
    @property {string} [placeholder] - Selector placeholder
    @property {string} [className] - Input field additional class
    @property {object} [style] - Input field additional style
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @property {option|optgroup} [children] - HTML options of the `<select>` element
    @description
    Field with a Select element. Children must be standard `<option>` and `<optgroup>` elements.
@@ -1048,7 +1051,7 @@ export const FieldSelect = ({ className, style, children, placeholder, ...props
    @property {string} [label] - Field label
    @property {string} [title] - Field tooltip text
    @property {boolean} [inverted] - Inverted value (incompatible with `input` and `output` properties)
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    A check box field.
 */
@@ -1076,7 +1079,7 @@ export const FieldCheckbox = ({ label, title, inverted, ...props }) => {
    @property {string} [label] - Field label
    @property {string} [title] - Field tooltip text
    @property {any} [value] - Value associated with the radio button
-   @property {any} [...props] - [Select](module-dome_layout_forms.Select.html) properties
+   @property {any} [...props] - [[Select]] properties
    @description
    A radio button field.
 
diff --git a/ivette/src/dome/src/renderer/layout/grids.js b/ivette/src/dome/src/renderer/layout/grids.js
index aad4e32c7b6..dd38a71915d 100644
--- a/ivette/src/dome/src/renderer/layout/grids.js
+++ b/ivette/src/dome/src/renderer/layout/grids.js
@@ -2,7 +2,10 @@
 // --- Grid Layout
 // --------------------------------------------------------------------------
 
-/** @module dome/layout/grids */
+/**
+   @packageDocumentation
+   @module dome/layout/grids
+*/
 
 import _ from 'lodash' ;
 import React from 'react' ;
@@ -790,26 +793,22 @@ It can be used only as direct children of `GridLayout`
 and other `GridBox` containers.
 
 See also:
-  - [GridLayout](module-dome_layout_grids.GridLayout.html) top-level container
-  - [GridItem](module-dome_layout_grids.GridItem.html) elementary component
-  - [GridHbox](module-dome_layout_grids.GridHbox.html) horizontal box
-  - [GridVbox](module-dome_layout_grids.GridVbox.html) vertical box
+  - [[GridLayout]] top-level container
+  - [[GridItem]] elementary component
+  - [[GridHbox]] horizontal box
+  - [[GridVbox]] vertical box
 */
 export const GridBox = (props) => null ;
 
 /**
-   @summary Layout its content in an horizontal box.
+   [[GridBox]] with horizontal layout
    @property {ident} [id] - the box identifier
-   @description
-   See [GridBox](module-dome_layout_grids.GridBox.html)
 */
 export const GridHbox = (props) => null ;
 
 /**
-   @summary Layout its content in a vertical box.
+   [[GridBox]] with vertical layout
    @property {ident} [id] - the box identifier
-   @description
-   See [GridBox](module-dome_layout_grids.GridBox.html)
 */
 export const GridVbox = (props) => null ;
 
@@ -956,7 +955,7 @@ Low-level GridLayout container, with only resizing capabilities.
 Additional rendering options are available:
 
 - `dragged` : item being dragged, materialized with a dragging background;
-- `dragging` : current [D&D](dome-module_dnd.html) event to notify `onTarget()` with;
+- `dragging` : current D&D event to notify `onTarget()` with;
 - `target` : `{at,dir,left,top,width,height}` insertion position to materialize;
 - `shape:Shape` : desired reshaping of the children grid;
 - `onReshape(Shape)` : notified when grid content has been resized;
@@ -1112,14 +1111,14 @@ const DRAGGABLEITEM =
    @property {function}  [onReshape] - Callback on reshaping self content
    @property {function}  [onInsert] - Callback on dropping the holding element
    @property {function}  [onDnd] - Callback on D&D events
-   @property {function}  [onXxx] - Other D&D [callback events](module-dome_dnd.html)
+   @property {function}  [onXxx] - Other D&D callback events
    @description
 
 Layout several components with nested vertical and horizontal boxes.
 
 Direct children of the container must be either:
-- [GridBox](module-dome_layout_grids.GridBox.html) and its derivated
-- [GridItem](module-dome_layout_grids.GridItem.html) for elementary component
+- [[GridBox]] and its derivated
+- [[GridItem]] for elementary component
 
 Top-level children are laidout vertically (default) or horizontally according
 to the `dir` property. Nested boxes of same directions are flattened,
@@ -1136,7 +1135,7 @@ simply ignored from the shape taken into account.
 
 GridLayout containers can be used as drop targets, both for re-arranging
 internal grid items, or to insert external drag sources inside.
-If you supply an external [DnD](module-dome_dnd.DnD.html) controller,
+If you supply an external [[DnD]] controller,
 the GridLayout will register itself as a drop target. Otherwize, it will
 use its own controller.
 
diff --git a/ivette/src/dome/src/renderer/layout/splitters.js b/ivette/src/dome/src/renderer/layout/splitters.js
index 5b4ced76388..b6468165cfc 100644
--- a/ivette/src/dome/src/renderer/layout/splitters.js
+++ b/ivette/src/dome/src/renderer/layout/splitters.js
@@ -2,7 +2,10 @@
 // --- Splitters
 // --------------------------------------------------------------------------
 
-/** @module dome/layout/splitters */
+/**
+    @packageDocumentation
+    @module dome/layout/splitters
+*/
 
 import _ from 'lodash' ;
 import * as React from 'react' ;
diff --git a/ivette/src/dome/src/renderer/table/arrays.js b/ivette/src/dome/src/renderer/table/arrays.js
index 92836415961..19f0fd189fc 100644
--- a/ivette/src/dome/src/renderer/table/arrays.js
+++ b/ivette/src/dome/src/renderer/table/arrays.js
@@ -2,7 +2,10 @@
 // --- Table Models
 // --------------------------------------------------------------------------
 
-/** @module dome/table/arrays */
+/**
+   @packageDocumentation
+   @module dome/table/arrays
+*/
 
 import _ from 'lodash' ;
 import React from 'react' ;
@@ -173,11 +176,11 @@ A comparison ring can be used to implement column ordering, where each
 column selection _refines_ the previous ordering.
 
 Hence, the ring holds the current comparison order and it is well suited
-for being used in conjunction with [Table](module-dome_table_views.Table.html)
+for being used in conjunction with [[Table]]
 components.
 
 A comparison specification can be a property name or a function.
-See [compareWith](module-dome_table_arrays.html#compareWith) for more details.
+See [[compareWith]] for more details.
 By default, the ring uses the column identifier as a property name for comparing.
 
 Initially, the ordering is _natural_.
@@ -201,7 +204,7 @@ export class ComparisonRing {
      @description
      Returns the comparison function corresponding to the current order.
      The comparison function is _chainable_, see
-     [compareWith](module-dome_table_arrays.html#compareWith) for more details.
+     [[compareWith]] for more details.
   */
   compareWith()
   {
@@ -303,7 +306,7 @@ export class ComparisonRing {
    @summary A table Model for unsorted datasets.
    @description
 
-   This class implements a simple [Model](module-dome_table_models.Model.html)
+   This class implements a simple [[Model]]
    where item's are identified by their index. Such a model is not adapted to
    re-ordering and filtering, because table views will have no way to synchronize
    the selected index before and after re-ordering, hence the name.
@@ -359,11 +362,10 @@ export class UnsortedModel extends Model {
    @extends Model
    @description
 
-   This class implements a simple [Model](module-dome_table_models.Model.html)
+   This class implements a simple [[Model]]
    implementation where item's are stored in an array. The model supports built-in
    ordering thanks with a
-   [ComparisonRing](module-dome_table_arrays.ComparisonRing.html)
-   with additional filtering capabilities.
+   [[ComparisonRing]] with additional filtering capabilities.
 
    The model keep items in sync with their ordered & filtered index by
    injecting an `index` property in them each time the collection is re-ordered.
diff --git a/ivette/src/dome/src/renderer/table/models.js b/ivette/src/dome/src/renderer/table/models.js
index 1f95258200b..142e44824f6 100644
--- a/ivette/src/dome/src/renderer/table/models.js
+++ b/ivette/src/dome/src/renderer/table/models.js
@@ -2,7 +2,10 @@
 // --- Models
 // --------------------------------------------------------------------------
 
-/** @module dome/table/models */
+/**
+   @packageDocumentation
+   @module dome/table/models
+*/
 
 import _ from 'lodash' ;
 import { SortDirection } from 'react-virtualized' ;
@@ -91,7 +94,7 @@ export const DESC = SortDirection.DESC ;
 
    ##### Model Helpers
 
-   The module [dome/table/arrays](module-dome_table_arrays.html) provides you with
+   The module [[dome/table/arrays]] provides you with
    usefull helpers to implement Models with filtering and ordering features.
 
 */
diff --git a/ivette/src/dome/src/renderer/table/views.js b/ivette/src/dome/src/renderer/table/views.js
index 696552bb85a..3bde6dcb50b 100644
--- a/ivette/src/dome/src/renderer/table/views.js
+++ b/ivette/src/dome/src/renderer/table/views.js
@@ -2,7 +2,10 @@
 // --- Tables
 // --------------------------------------------------------------------------
 
-/** @module dome/table/views */
+/**
+   @packageDocumentation
+   @module dome/table/views
+*/
 
 import _ from 'lodash' ;
 import React from 'react' ;
@@ -153,7 +156,7 @@ const computeWidth = (elt) => {
 
 
    By default, values are obtained from the underlying model by invoking
-   [Model.getValue](module-dome_table_models.Model.html#getValue) with the column
+   [[Model.getValue]] with the column
    identifier.
 
    The default `renderValue` renders the item's value
@@ -163,7 +166,7 @@ const computeWidth = (elt) => {
    This separation of concerns allows for defining
    Column types, where for instance the renderer is already defined and you only need to
    know how to extract the expected value of items.
-   See [DefineColumn](module-dome_table_views.DefineColumn.html)
+   See [[DefineColumn]]
    for more informations and examples.
 
    A table should have at least one extensible column to occupy the available width.
@@ -229,8 +232,7 @@ const defaultVisible = (visible) => {
    @return {Column} a new Column class of Component
    @description
 
-   Allow to define specialized instances of
-   [Column](module-dome_table_views.Column.html)
+   Allow to define specialized instances of [[Column]].
 
    @example // Example of column type
    import { DefineColumn } from 'dome/table/views' ;
@@ -293,11 +295,11 @@ const DEFAULT_STATE = { width:{}, resize:{}, visible:{} };
    datasets.
 
    A table shall be connected to an instance of
-   [Model](module-dome_table_models.Model.html) class to retrieve the data and
+   [[Model]] class to retrieve the data and
    get informed of data updates.
 
    The table columns shall be instances of
-   [Column](module-dome_table_views.Column.html) class.
+   [[Column]] class.
 
    Clicking on table headers trigger re-ordering callback on the model with the
    expected column and direction, unless disabled _via_ the column
diff --git a/ivette/src/dome/src/renderer/text/buffers.js b/ivette/src/dome/src/renderer/text/buffers.js
index 6bd46b845ca..ebab6e603ab 100644
--- a/ivette/src/dome/src/renderer/text/buffers.js
+++ b/ivette/src/dome/src/renderer/text/buffers.js
@@ -2,7 +2,10 @@
 // --- Text Documents
 // --------------------------------------------------------------------------
 
-/** @module dome/text/buffers */
+/**
+   @packageDocumentation
+   @module dome/text/buffers
+*/
 
 import Emitter from 'events' ;
 import CodeMirror from 'codemirror/lib/codemirror.js' ;
diff --git a/ivette/src/dome/src/renderer/text/editors.js b/ivette/src/dome/src/renderer/text/editors.js
index aece9b84143..6eb0c8f28cc 100644
--- a/ivette/src/dome/src/renderer/text/editors.js
+++ b/ivette/src/dome/src/renderer/text/editors.js
@@ -2,7 +2,10 @@
 // --- Text Documents
 // --------------------------------------------------------------------------
 
-/** @module dome/text/editors */
+/**
+   @packageDocumentation
+   @module dome/text/editors
+*/
 
 import _ from 'lodash' ;
 import React from 'react' ;
@@ -23,7 +26,7 @@ const CSS_SELECTED = 'dome-xText-select' ;
    @class
    @summary Rich Text Editor.
    @property {Buffer} buffer -
-      associated [Buffer](module-dome_text_buffers.Buffer.html) holding the text content
+      associated [[Buffer]] holding the text content
    @property {string} className - additional class name(s)
    @property {object} style - additional CSS style
    @property {number} fontSize - editor font-size
@@ -35,7 +38,7 @@ const CSS_SELECTED = 'dome-xText-select' ;
    @description
 
    A component rendering the content of a text buffer, that shall be instances
-   of the [Buffer](module-dome_text_buffers.Buffer.html) base class.
+   of the [[Buffer]] base class.
 
    The view is based on a [CodeMirror](https://codemirror.net) component linked with
    the internal Code Mirror Document from the associated buffer.
diff --git a/ivette/src/dome/src/renderer/text/pages.js b/ivette/src/dome/src/renderer/text/pages.js
index ca8b486e080..9714adbb0a0 100644
--- a/ivette/src/dome/src/renderer/text/pages.js
+++ b/ivette/src/dome/src/renderer/text/pages.js
@@ -3,8 +3,10 @@
 // --------------------------------------------------------------------------
 
 /**
+   @packageDocumentation
    @module dome/text/pages
    @description
+
    A collection of text area and elements do render textual content.
 
    Inside such areas, all elements are styled like a classical web page.
@@ -15,12 +17,11 @@
    most other widget components.
 
    The behaviour of `<a href=...>` elements differs for local links and external URLs.
-   Local links trigger a ['dome.href'](dome_.html#~event:'dome.href') event, that
+   Local links trigger a `'dome.href'` event, that
    you can listen to from the originating renderer process, _eg. by using `Dome.useUpdate()`
    custom hook.
 
    External links launch the user's default browser.
-
 */
 
 import React from 'react' ;
diff --git a/ivette/src/frama-c/LabViews.tsx b/ivette/src/frama-c/LabViews.tsx
index 0c3cadd7c71..ff74b6542fe 100644
--- a/ivette/src/frama-c/LabViews.tsx
+++ b/ivette/src/frama-c/LabViews.tsx
@@ -2,7 +2,10 @@
 // ---  Lab View Component
 // --------------------------------------------------------------------------
 
-/** @module frama-c/labviews */
+/**
+   @packageDocumentation
+   @module frama-c/labviews
+*/
 
 import _ from 'lodash';
 import React from 'react';
@@ -527,8 +530,7 @@ function CustomGroup({
   title: sectionTitle,
   label: sectionLabel,
   components,
-}: any)
-{
+}: any) {
   const makeComponent = ({ id, label, title }: any) => {
     const itemId = getItemId('components', id);
     const disabled = Grids.getShapeItem(shape, itemId) !== undefined;
diff --git a/ivette/src/frama-c/server.ts b/ivette/src/frama-c/server.ts
index 0d68f26e796..4220a8918ae 100644
--- a/ivette/src/frama-c/server.ts
+++ b/ivette/src/frama-c/server.ts
@@ -3,9 +3,11 @@
 // --------------------------------------------------------------------------
 
 /**
- *  @module frama-c/server
- *  @description Manage the current Frama-C server/client interface
- */
+   @packageDocumentation
+   @module frama-c/server
+   @description
+   Manage the current Frama-C server/client interface
+*/
 
 import _ from 'lodash';
 import React from 'react';
diff --git a/ivette/src/frama-c/states.ts b/ivette/src/frama-c/states.ts
index 5241835c744..13298285713 100644
--- a/ivette/src/frama-c/states.ts
+++ b/ivette/src/frama-c/states.ts
@@ -3,10 +3,11 @@
 // --------------------------------------------------------------------------
 
 /**
- *   @module frama-c/states
- *   @description
- *   Manage the current Frama-C project and projectified state values.
- */
+   @packageDocumentation
+   @module frama-c/states
+   @decsription
+   Manage the current Frama-C project and projectified state values.
+*/
 
 import _ from 'lodash';
 import React from 'react';
-- 
GitLab