goblin-gadgets 3.2.2 → 3.2.3

package/widgets/wizard/service.js

@@ -1,2132 +1,2132 @@
-//T:2019-02-27
-//mock
-'use strict';
-
-const path = require('path');
-const goblinName = path.basename(module.parent.filename, '.js');
-const Goblin = require('xcraft-core-goblin');
-
-// Define initial logic values
-const logicState = {};
-
-const globalSettings = {
-  widget: {
-    id: 'widget',
-    value: 'Button',
-  },
-};
-
-const colorList = [
-  '',
-  'base',
-  'primary',
-  'secondary',
-  'success',
-  'pick',
-  'drop',
-  'task',
-  'white',
-  'lightgrey',
-  'grey',
-  'black',
-  'red',
-  'green',
-  'blue',
-  'yellow',
-  '#d2e6f9 — light blue',
-  '#8ab6df — blue',
-  '#f5ddb8 — light orange',
-  '#fbce89 — orange',
-  '#c6f7da — light green',
-  '#74f7a9 — green',
-];
-
-const properties = {
-  Button: {
-    id: 'Button',
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: [
-        '',
-        'action',
-        'button-notification',
-        'button-footer',
-        'calendar-navigator',
-        'check-button',
-        'chronos-navigator',
-        'chronos-navigator',
-        'combo',
-        'combo-item',
-        'combo-wrap-item',
-        'desk-title',
-        'disabled-light',
-        'dynamic-toolbar-left',
-        'dynamic-toolbar-top-left',
-        'dynamic-toolbar-top-right',
-        'glyph-item',
-        'hover',
-        'identity',
-        'label',
-        'main-tab',
-        'main-tab-right',
-        'menu-item',
-        'notification-close',
-        'pane-navigator',
-        'pane-hnavigator',
-        'pane-vnavigator',
-        'recurrence',
-        'round',
-        'subaction',
-        'task-bar',
-        'task-tab',
-        'task-logo',
-        'thin-left',
-        'thin-right',
-        'toolbar',
-        'view-tab',
-        'view-tab-right',
-        'warning',
-      ],
-      value: '',
-    },
-    active: {
-      id: 'active',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'active',
-      value: false,
-    },
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    focusable: {
-      id: 'focusable',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'focusable',
-      value: false,
-    },
-    busy: {
-      id: 'busy',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'busy',
-      value: false,
-    },
-    border: {
-      id: 'border',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'border',
-      list: ['', 'none'],
-      value: '',
-    },
-    text: {
-      id: 'text',
-      group: 'Text',
-      type: 'text',
-      field: 'text',
-      list: [
-        '',
-        'Button',
-        "D'accord",
-        'Annuler',
-        'Enregistrer',
-        'Ouvrir le dossier',
-        'Long mot (anticonstitutionnellement) pour tester le mode wrap',
-        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne<br/>Quatrième ligne<br/>Cinquième ligne',
-        'Normal <em>sélectionné</em> normal',
-      ],
-      value: 'Button',
-    },
-    glyph: {
-      id: 'glyph',
-      group: 'Glyph',
-      type: 'text',
-      field: 'glyph',
-      list: [
-        '',
-        'solid/check',
-        'solid/times',
-        'solid/bicycle',
-        'solid/car',
-        'solid/rocket',
-        'solid/calendar',
-      ],
-      value: 'solid/check',
-    },
-    glyphRotate: {
-      id: 'glyphRotate',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphRotate',
-      list: ['', '90', '180', '270'],
-      value: '',
-    },
-    glyphFlip: {
-      id: 'glyphFlip',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphFlip',
-      list: ['', 'horizontal', 'vertical'],
-      value: '',
-    },
-    glyphSpin: {
-      id: 'glyphSpin',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphSpin',
-      list: ['', 'yes'],
-      value: '',
-    },
-    glyphPosition: {
-      id: 'glyphPosition',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphPosition',
-      list: ['', 'left', 'right'],
-      value: '',
-    },
-    glyphColor: {
-      id: 'glyphColor',
-      group: 'Glyph',
-      type: 'text',
-      unit: 'color',
-      field: 'glyphColor',
-      list: colorList,
-      value: '',
-    },
-    glyphSize: {
-      id: 'glyphSize',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphSize',
-      list: ['', '50%', '75%', '100%', '150%', '200%'],
-      value: '',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: [
-        '',
-        'rounded',
-        'left-rounded',
-        'right-rounded',
-        'left-smooth',
-        'right-smooth',
-      ],
-      value: '',
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    shortcut: {
-      id: 'shortcut',
-      group: 'Aspect',
-      type: 'text',
-      field: 'shortcut',
-      list: ['', '_ctrl_+A', '_shift_+A', '_alt_+A'],
-      value: '',
-    },
-    justify: {
-      id: 'justify',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'justify',
-      list: ['', 'start', 'center', 'end', 'around', 'between', 'none'],
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    height: {
-      id: 'height',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'height',
-      list: ['', '32px', '50px', '100px', '150px', '200px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    textColor: {
-      id: 'textColor',
-      group: 'Text',
-      type: 'text',
-      unit: 'color',
-      field: 'textColor',
-      list: colorList,
-      value: '',
-    },
-    backgroundColor: {
-      id: 'backgroundColor',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'color',
-      field: 'backgroundColor',
-      list: colorList,
-      value: '',
-    },
-    activeColor: {
-      id: 'activeColor',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'color',
-      field: 'activeColor',
-      list: colorList,
-      value: '',
-    },
-    fontSize: {
-      id: 'fontSize',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontSize',
-      list: ['', '50%', '75%', '100%', '150%', '200%'],
-      value: '',
-    },
-    fontWeight: {
-      id: 'fontWeight',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontWeight',
-      list: ['', 'bold'],
-      value: '',
-    },
-    fontStyle: {
-      id: 'fontStyle',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontStyle',
-      list: ['', 'italic', 'oblique'],
-      value: '',
-    },
-    textTransform: {
-      id: 'textTransform',
-      group: 'Text',
-      type: 'combo',
-      field: 'textTransform',
-      list: ['', 'uppercase', 'none'],
-      value: '',
-    },
-    wrap: {
-      id: 'wrap',
-      group: 'Text',
-      type: 'combo',
-      field: 'wrap',
-      list: ['', 'no', 'no-strict', 'yes', 'yes-permissive'],
-      value: '',
-    },
-    badgeValue: {
-      id: 'badgeValue',
-      group: 'Badge',
-      type: 'text',
-      field: 'badgeValue',
-      list: ['', '1', '2', '99', '123456'],
-      value: '',
-    },
-    badgePush: {
-      id: 'badgePush',
-      group: 'Badge',
-      type: 'bool',
-      field: 'badgePush',
-      value: '',
-    },
-    place: {
-      id: 'place',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'place',
-      list: ['', '1/1', '1/3', '2/3', '3/3'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  Label: {
-    id: 'Label',
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: [
-        '',
-        'big-center',
-        'center-to-box',
-        'compact',
-        'floating-footer',
-        'floating-header',
-        'flying-balloon',
-        'footer',
-        'info',
-        'large-left',
-        'large-right',
-        'large-single',
-        'notification',
-        'one-line-height',
-        'pane-header',
-        'task',
-        'ticket-warning',
-        'title',
-        'title-recurrence',
-      ],
-      value: '',
-    },
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    text: {
-      id: 'text',
-      group: 'Text',
-      type: 'text',
-      field: 'text',
-      list: [
-        '',
-        'Label',
-        'Nom',
-        'Prénom',
-        'NPA',
-        'Ville',
-        'Long mot (anticonstitutionnellement) pour tester le mode wrap',
-        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne<br/>Quatrième ligne<br/>Cinquième ligne',
-        'Normal <em>sélectionné</em> normal',
-      ],
-      value: 'Label',
-    },
-    glyph: {
-      id: 'glyph',
-      group: 'Glyph',
-      type: 'text',
-      field: 'glyph',
-      list: [
-        '',
-        'solid/check',
-        'solid/times',
-        'solid/bicycle',
-        'solid/car',
-        'solid/rocket',
-        'solid/calendar',
-      ],
-      value: 'solid/rocket',
-    },
-    glyphRotate: {
-      id: 'glyphRotate',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphRotate',
-      list: ['', '90', '180', '270'],
-      value: '',
-    },
-    glyphFlip: {
-      id: 'glyphFlip',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphFlip',
-      list: ['', 'horizontal', 'vertical'],
-      value: '',
-    },
-    glyphSpin: {
-      id: 'glyphSpin',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphSpin',
-      list: ['', 'yes'],
-      value: '',
-    },
-    glyphPosition: {
-      id: 'glyphPosition',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphPosition',
-      list: ['', 'left', 'right'],
-      value: '',
-    },
-    glyphColor: {
-      id: 'glyphColor',
-      group: 'Glyph',
-      type: 'text',
-      unit: 'color',
-      field: 'glyphColor',
-      list: colorList,
-      value: '',
-    },
-    glyphSize: {
-      id: 'glyphSize',
-      group: 'Glyph',
-      type: 'combo',
-      field: 'glyphSize',
-      list: ['', '50%', '75%', '100%', '150%', '200%'],
-      value: '',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: [
-        '',
-        'rounded',
-        'left-rounded',
-        'right-rounded',
-        'left-smooth',
-        'right-smooth',
-      ],
-      value: '',
-    },
-    insideButton: {
-      id: 'insideButton',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'insideButton',
-      value: false,
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    justify: {
-      id: 'justify',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'justify',
-      list: ['', 'start', 'center', 'end', 'around', 'between', 'none'],
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    height: {
-      id: 'height',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'height',
-      list: ['', '32px', '50px', '100px', '150px', '200px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    bottomSpacing: {
-      id: 'bottomSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'bottomSpacing',
-      list: ['', 'large'],
-      value: '',
-    },
-    vpos: {
-      id: 'vpos',
-      group: 'Layout',
-      type: 'combo',
-      field: 'vpos',
-      list: ['', 'top'],
-      value: '',
-    },
-    textColor: {
-      id: 'textColor',
-      group: 'Text',
-      type: 'text',
-      unit: 'color',
-      field: 'textColor',
-      list: colorList,
-      value: '',
-    },
-    backgroundColor: {
-      id: 'backgroundColor',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'color',
-      field: 'backgroundColor',
-      list: colorList,
-      value: '',
-    },
-    fontSize: {
-      id: 'fontSize',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontSize',
-      list: ['', '50%', '75%', '100%', '150%', '200%'],
-      value: '',
-    },
-    fontWeight: {
-      id: 'fontWeight',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontWeight',
-      list: ['', 'bold'],
-      value: '',
-    },
-    fontStyle: {
-      id: 'fontStyle',
-      group: 'Text',
-      type: 'combo',
-      field: 'fontStyle',
-      list: ['', 'italic', 'oblique'],
-      value: '',
-    },
-    textTransform: {
-      id: 'textTransform',
-      group: 'Text',
-      type: 'combo',
-      field: 'textTransform',
-      list: ['', 'uppercase', 'none'],
-      value: '',
-    },
-    wrap: {
-      id: 'wrap',
-      group: 'Text',
-      type: 'combo',
-      field: 'wrap',
-      list: ['', 'no', 'no-strict', 'yes', 'yes-permissive'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  TextField: {
-    id: 'TextField',
-    active: {
-      id: 'active',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'active',
-      value: false,
-    },
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Text',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    defaultValue: {
-      id: 'defaultValue',
-      group: 'Text',
-      type: 'text',
-      field: 'defaultValue',
-      list: [
-        '',
-        'TextField',
-        'Jean Dupond',
-        'Lausanne',
-        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
-      ],
-      value: 'TextField',
-    },
-    hintText: {
-      id: 'hintText',
-      group: 'Text',
-      type: 'text',
-      field: 'hintText',
-      list: ['', 'Prénom et nom', 'Adresse', 'Ville'],
-      value: 'Prénom et nom',
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: [
-        '',
-        'rounded',
-        'left-rounded',
-        'right-rounded',
-        'left-smooth',
-        'right-smooth',
-      ],
-      value: '',
-    },
-    rows: {
-      id: 'rows',
-      group: 'Text',
-      type: 'combo',
-      field: 'rows',
-      list: ['', '1', '2', '3', '4', '5', '10'],
-      value: '',
-    },
-    size: {
-      id: 'size',
-      group: 'Text',
-      type: 'combo',
-      field: 'size',
-      list: ['', '1', '10', '100'],
-      value: '',
-    },
-    maxLength: {
-      id: 'maxLength',
-      group: 'Text',
-      type: 'combo',
-      field: 'maxLength',
-      list: ['', '1', '10', '20', '100'],
-      value: '',
-    },
-    messageInfo: {
-      id: 'messageInfo',
-      group: 'Message',
-      type: 'text',
-      field: 'messageInfo',
-      value: '',
-    },
-    messageWarning: {
-      id: 'messageWarning',
-      group: 'Message',
-      type: 'text',
-      field: 'messageWarning',
-      value: '',
-    },
-    flyingBalloonAnchor: {
-      id: 'flyingBalloonAnchor',
-      group: 'Message',
-      type: 'combo',
-      field: 'flyingBalloonAnchor',
-      list: ['left', 'right', 'top', 'bottom'],
-      value: 'bottom',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '1',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    justify: {
-      id: 'justify',
-      group: 'Text',
-      type: 'combo',
-      field: 'justify',
-      list: ['', 'left', 'right'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  LabelTextField: {
-    id: 'LabelTextField',
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Text',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    defaultValue: {
-      id: 'defaultValue',
-      group: 'Text',
-      type: 'text',
-      field: 'defaultValue',
-      list: [
-        '',
-        'LabelTextField',
-        'Jean Dupond',
-        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
-      ],
-      value: 'LabelTextField',
-    },
-    labelText: {
-      id: 'labelText',
-      group: 'Label',
-      type: 'text',
-      field: 'labelText',
-      list: ['', 'Label', 'Nom', 'Prénom', 'Adresse', 'Ville'],
-      value: '',
-    },
-    labelGlyph: {
-      id: 'labelGlyph',
-      group: 'Label',
-      type: 'text',
-      field: 'labelGlyph',
-      list: [
-        '',
-        'solid/check',
-        'solid/times',
-        'solid/bicycle',
-        'solid/car',
-        'solid/rocket',
-        'solid/calendar',
-      ],
-      value: 'solid/car',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: ['', 'rounded', 'smooth'],
-      value: '',
-    },
-    fieldJustify: {
-      id: 'fieldJustify',
-      group: 'Text',
-      type: 'combo',
-      field: 'fieldJustify',
-      list: ['', 'left', 'right'],
-      value: '',
-    },
-    messageInfo: {
-      id: 'messageInfo',
-      group: 'Message',
-      type: 'text',
-      field: 'messageInfo',
-      value: '',
-    },
-    messageWarning: {
-      id: 'messageWarning',
-      group: 'Message',
-      type: 'text',
-      field: 'messageWarning',
-      value: '',
-    },
-    hintText: {
-      id: 'hintText',
-      group: 'Text',
-      type: 'text',
-      field: 'hintText',
-      list: ['', 'Prénom et nom', 'Adresse'],
-      value: 'Adresse',
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    labelWidth: {
-      id: 'labelWidth',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'labelWidth',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    fieldWidth: {
-      id: 'fieldWidth',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'fieldWidth',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '1',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  TextFieldCombo: {
-    id: 'TextFieldCombo',
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Text',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    menuType: {
-      id: 'menuType',
-      group: 'Menu',
-      type: 'combo',
-      field: 'menuType',
-      list: ['', 'select', 'combo', 'wrap'],
-      value: 'wrap',
-    },
-    menuItemWidth: {
-      id: 'menuItemWidth',
-      group: 'Menu',
-      type: 'text',
-      unit: 'px',
-      field: 'menuItemWidth',
-      list: ['', '100px', '150px', '200px', '300px'],
-      value: '',
-    },
-    menuItemTooltips: {
-      id: 'menuItemTooltips',
-      group: 'Menu',
-      type: 'bool',
-      field: 'menuItemTooltips',
-      value: false,
-    },
-    defaultValue: {
-      id: 'defaultValue',
-      group: 'Text',
-      type: 'text',
-      field: 'defaultValue',
-      list: [
-        '',
-        'TextFieldCombo',
-        'Lundi',
-        'Mardi',
-        'Mercredi',
-        'Jeudi',
-        'Vendredi',
-        'Samedi',
-        'Dimanche',
-        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
-      ],
-      value: 'TextFieldCombo',
-    },
-    selectedValue: {
-      id: 'selectedValue',
-      group: 'Text',
-      type: 'text',
-      field: 'selectedValue',
-      list: [
-        '',
-        'Lundi',
-        'Mardi',
-        'Mercredi',
-        'Jeudi',
-        'Vendredi',
-        'Samedi',
-        'Dimanche',
-      ],
-      value: '',
-    },
-    comboGlyph: {
-      id: 'comboGlyph',
-      group: 'Aspect',
-      type: 'text',
-      field: 'comboGlyph',
-      list: ['', 'search'],
-      value: '',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: ['', 'rounded', 'smooth'],
-      value: '',
-    },
-    messageInfo: {
-      id: 'messageInfo',
-      group: 'Message',
-      type: 'text',
-      field: 'messageInfo',
-      value: '',
-    },
-    messageWarning: {
-      id: 'messageWarning',
-      group: 'Message',
-      type: 'text',
-      field: 'messageWarning',
-      value: '',
-    },
-    hintText: {
-      id: 'hintText',
-      group: 'Text',
-      type: 'text',
-      field: 'hintText',
-      list: ['', 'Jour de la semaine', 'Prénom et nom', 'Adresse'],
-      value: 'Jour de la semaine',
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '1',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  TextFieldTyped: {
-    id: 'TextFieldTyped',
-    active: {
-      id: 'active',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'active',
-      value: false,
-    },
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Text',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    type: {
-      id: 'type',
-      group: 'Text',
-      type: 'combo',
-      field: 'type',
-      list: ['date', 'time', 'price'],
-      value: 'date',
-    },
-    defaultValue: {
-      id: 'defaultValue',
-      group: 'Text',
-      type: 'text',
-      field: 'defaultValue',
-      list: ['', 'TextFieldTyped', '31.03.2017', '12:30'],
-      value: 'TextFieldTyped',
-    },
-    hintText: {
-      id: 'hintText',
-      group: 'Text',
-      type: 'text',
-      field: 'hintText',
-      list: ['', 'Date', 'Heure'],
-      value: 'Date',
-    },
-    tooltip: {
-      id: 'tooltip',
-      group: 'Aspect',
-      type: 'text',
-      field: 'tooltip',
-      value: '',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: [
-        '',
-        'rounded',
-        'left-rounded',
-        'right-rounded',
-        'left-smooth',
-        'right-smooth',
-      ],
-      value: '',
-    },
-    rows: {
-      id: 'rows',
-      group: 'Text',
-      type: 'combo',
-      field: 'rows',
-      list: ['', '1', '2', '3', '4', '5', '10'],
-      value: '',
-    },
-    size: {
-      id: 'size',
-      group: 'Text',
-      type: 'combo',
-      field: 'size',
-      list: ['', '1', '10', '100'],
-      value: '',
-    },
-    maxLength: {
-      id: 'maxLength',
-      group: 'Text',
-      type: 'combo',
-      field: 'maxLength',
-      list: ['', '1', '10', '20', '100'],
-      value: '',
-    },
-    messageInfo: {
-      id: 'messageInfo',
-      group: 'Message',
-      type: 'text',
-      field: 'messageInfo',
-      value: '',
-    },
-    messageWarning: {
-      id: 'messageWarning',
-      group: 'Message',
-      type: 'text',
-      field: 'messageWarning',
-      value: '',
-    },
-    flyingBalloonAnchor: {
-      id: 'flyingBalloonAnchor',
-      group: 'Message',
-      type: 'combo',
-      field: 'flyingBalloonAnchor',
-      list: ['left', 'right', 'top', 'bottom'],
-      value: 'bottom',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '1',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-    cursor: {
-      id: 'cursor',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'cursor',
-      list: [
-        '',
-        'default',
-        'none',
-        'pointer',
-        'cell',
-        'crosshair',
-        'text',
-        'move',
-        'not-allowed',
-        'ew-resize',
-        'ns-resize',
-        'grab',
-      ],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  Checkbox: {
-    id: 'Checkbox',
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: ['', 'switch', 'radio', 'active'],
-      value: '',
-    },
-    checked: {
-      id: 'checked',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'checked',
-      value: false,
-    },
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    readonly: {
-      id: 'readonly',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'readonly',
-      value: false,
-    },
-    focusable: {
-      id: 'focusable',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'focusable',
-      value: false,
-    },
-    text: {
-      id: 'text',
-      group: 'Text',
-      type: 'text',
-      field: 'text',
-      list: ['', 'Checkbox', 'Mise à jour automatique', 'Mode avancé'],
-      value: 'Checkbox',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'overlap', 'tiny', 'large', 'double'],
-      value: '',
-    },
-  },
-  Gauge: {
-    id: 'Gauge',
-    value: {
-      id: 'value',
-      group: 'Aspect',
-      type: 'text',
-      field: 'value',
-      list: [
-        '',
-        '0',
-        '10',
-        '20',
-        '30',
-        '40',
-        '50',
-        '60',
-        '70',
-        '80',
-        '90',
-        '100',
-      ],
-      value: '50',
-    },
-  },
-  Ticket: {
-    id: 'Ticket',
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: ['', 'ticket', 'rect', 'thin', 'event', 'subpane', 'cover'],
-      value: 'ticket',
-    },
-    shape: {
-      id: 'shape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'shape',
-      list: ['', 'first', 'last'],
-      value: '',
-    },
-    hoverShape: {
-      id: 'hoverShape',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'hoverShape',
-      list: ['', 'first', 'middle', 'last'],
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '150px',
-    },
-    height: {
-      id: 'height',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'height',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '250px'],
-      value: '100px',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'horizontalSpacing',
-      list: ['', '0px', '2px', '10px', '20px'],
-      value: '2px',
-    },
-    verticalSpacing: {
-      id: 'verticalSpacing',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'verticalSpacing',
-      list: ['', '0px', '2px', '10px', '20px'],
-      value: '2px',
-    },
-    hatch: {
-      id: 'hatch',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'hatch',
-      value: false,
-    },
-    flash: {
-      id: 'flash',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'flash',
-      value: false,
-    },
-    hideContent: {
-      id: 'hideContent',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'hideContent',
-      value: false,
-    },
-    color: {
-      id: 'color',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'color',
-      field: 'color',
-      list: colorList,
-      value: '#d2e6f9 — light blue',
-    },
-    hudGlyph: {
-      id: 'hudGlyph',
-      group: 'Content',
-      type: 'text',
-      field: 'hudGlyph',
-      list: [
-        '',
-        'solid/check',
-        'solid/times',
-        'solid/bicycle',
-        'solid/car',
-        'solid/rocket',
-        'solid/calendar',
-      ],
-      value: '',
-    },
-    backgroundText: {
-      id: 'backgroundText',
-      group: 'Content',
-      type: 'text',
-      field: 'backgroundText',
-      list: ['', '1', '2', '3', '4', 'Abc'],
-      value: '',
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    visibility: {
-      id: 'visibility',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'visibility',
-      value: true,
-    },
-  },
-  Container: {
-    id: 'Container',
-    disabled: {
-      id: 'disabled',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'disabled',
-      value: false,
-    },
-    show: {
-      id: 'show',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'show',
-      value: true,
-    },
-    selected: {
-      id: 'selected',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'selected',
-      value: false,
-    },
-    busy: {
-      id: 'busy',
-      group: 'Aspect',
-      type: 'bool',
-      field: 'busy',
-      value: false,
-    },
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: [
-        '',
-        'actions',
-        'box',
-        'boxes',
-        'chronos-events',
-        'column',
-        'column-full',
-        'compact-row',
-        'content',
-        'drag-to-delete',
-        'drag-too-many',
-        'floating',
-        'floating-footer',
-        'floating-header',
-        'flying-balloon',
-        'flying-chat',
-        'flying-dialog',
-        'footer',
-        'full-view',
-        'glyph-samples',
-        'left-bar',
-        'main-tab',
-        'main-tab-right',
-        'mandats',
-        'pane',
-        'pane-top',
-        'panes',
-        'pane-header',
-        'pane-header-light',
-        'pane-hnavigator',
-        'pane-navigator',
-        'pane-top',
-        'pane-vnavigator',
-        'right',
-        'row',
-        'row-pane',
-        'row-pane-drag',
-        'row-wrap',
-        'second-bar',
-        'task-bar',
-        'thin-center',
-        'thin-column',
-        'thin-main',
-        'thin-row',
-        'ticket-mode',
-        'ticket-row',
-        'ticket-column',
-        'tickets',
-        'tickets-desk',
-        'tickets-messengers',
-        'tickets-messenger',
-        'tickets-root',
-        'tickets-trips',
-        'tickets-tray',
-        'top-bar',
-        'view',
-        'view-edge',
-        'view-right',
-        'view-stretch',
-        'view-tab',
-        'view-tab-right',
-        'views',
-        'wrap',
-      ],
-      value: 'column',
-    },
-    subkind: {
-      id: 'subkind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'subkind',
-      list: [
-        '',
-        'box',
-        'box-left',
-        'footer',
-        'info',
-        'large-box',
-        'left',
-        'light-box',
-        'list',
-        'me',
-        'no-shadow',
-        'top-margin',
-        'wide-info',
-        'wrap',
-      ],
-      value: '',
-    },
-    border: {
-      id: 'border',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'border',
-      list: ['', 'top', 'right', 'bottom', 'left'],
-      value: '',
-    },
-    trianglePosition: {
-      id: 'trianglePosition',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'trianglePosition',
-      list: ['', 'top', 'right', 'bottom', 'left', 'none'],
-      value: '',
-    },
-    triangleShift: {
-      id: 'triangleShift',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'px',
-      field: 'triangleShift',
-      list: ['', '-50px', '-10px', '0px', '10px', '50px'],
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    height: {
-      id: 'height',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'height',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '250px'],
-      value: '',
-    },
-    marginBottom: {
-      id: 'marginBottom',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'marginBottom',
-      list: ['', '2px', '5px', '10px', '20px'],
-      value: '',
-    },
-    floatingHeight: {
-      id: 'floatingHeight',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'floatingHeight',
-      list: ['', '10px', '20px', '50px', '100px'],
-      value: '10px',
-    },
-    grow: {
-      id: 'grow',
-      group: 'Layout',
-      type: 'text',
-      field: 'grow',
-      list: ['', '0.5', '1'],
-      value: '',
-    },
-    horizontalSpacing: {
-      id: 'horizontalSpacing',
-      group: 'Layout',
-      type: 'combo',
-      field: 'horizontalSpacing',
-      list: ['', 'compact', 'large'],
-      value: '',
-    },
-    backgroundColor: {
-      id: 'backgroundColor',
-      group: 'Aspect',
-      type: 'text',
-      unit: 'color',
-      field: 'backgroundColor',
-      list: colorList,
-      value: '',
-    },
-  },
-  Field: {
-    id: 'Field',
-    kind: {
-      id: 'kind',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'kind',
-      list: ['', 'field', 'combo', 'radio', 'bool', 'hinter', 'file'],
-      value: 'field',
-    },
-    direction: {
-      id: 'direction',
-      group: 'Aspect',
-      type: 'combo',
-      field: 'direction',
-      list: ['', 'row', 'column', 'wrap'],
-      value: 'row',
-    },
-    rows: {
-      id: 'rows',
-      group: 'Text',
-      type: 'combo',
-      field: 'rows',
-      list: ['', '1', '2', '3', '4', '5', '10'],
-      value: '',
-    },
-    width: {
-      id: 'width',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'width',
-      list: ['', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    height: {
-      id: 'height',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'height',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px'],
-      value: '',
-    },
-    labelText: {
-      id: 'labelText',
-      group: 'Label',
-      type: 'text',
-      field: 'labelText',
-      list: ['', 'Field', 'Nom', 'Prénom', 'Adresse', 'Ville'],
-      value: 'Field',
-    },
-    labelGlyph: {
-      id: 'labelGlyph',
-      group: 'Label',
-      type: 'text',
-      field: 'labelGlyph',
-      list: [
-        '',
-        'solid/check',
-        'solid/times',
-        'solid/bicycle',
-        'solid/car',
-        'solid/rocket',
-        'solid/calendar',
-      ],
-      value: '',
-    },
-    labelWidth: {
-      id: 'labelWidth',
-      group: 'Layout',
-      type: 'text',
-      unit: 'px',
-      field: 'labelWidth',
-      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
-      value: '',
-    },
-    hintText: {
-      id: 'hintText',
-      group: 'Text',
-      type: 'text',
-      field: 'hintText',
-      list: ['', 'Prénom', 'Nom', 'Adresse', 'Numéro postal', 'Ville'],
-      value: '',
-    },
-    justify: {
-      id: 'justify',
-      group: 'Text',
-      type: 'combo',
-      field: 'justify',
-      list: ['', 'left', 'right'],
-      value: '',
-    },
-    menuItemWidth: {
-      id: 'menuItemWidth',
-      group: 'Menu',
-      type: 'text',
-      unit: 'px',
-      field: 'menuItemWidth',
-      list: ['', '100px', '150px', '200px', '300px'],
-      value: '',
-    },
-  },
-};
-
-const previewSettings = {
-  scale: {
-    id: 'scale',
-    order: 1,
-    group: 'Scale',
-    type: 'list',
-    list: [1, 1.5, 2, 3, 4],
-    value: 2,
-  },
-  color: {
-    id: 'color',
-    order: 2,
-    group: 'Color',
-    type: 'list',
-    list: ['pane', 'view', 'task', 'root', 'footer'],
-    value: 'pane',
-  },
-  items: {
-    id: 'items',
-    order: 3,
-    group: 'Items',
-    type: 'list',
-    list: [1, 2, 3, 4, 5, 10, 11],
-    value: 1,
-  },
-  layout: {
-    id: 'layout',
-    order: 4,
-    group: 'Layout',
-    type: 'list',
-    list: ['row', 'column', 'wrap'],
-    value: 'row',
-  },
-  showFrame: {
-    id: 'showFrame',
-    order: 5,
-    group: 'Frame',
-    type: 'bool',
-    value: false,
-  },
-  ticketLines: {
-    id: 'ticketLines',
-    for: 'Ticket',
-    order: 10,
-    group: 'Lines',
-    type: 'list',
-    list: [1, 2, 3, 4, 5, 10],
-    value: 1,
-  },
-  containerType: {
-    id: 'containerType',
-    for: 'Container',
-    order: 10,
-    group: 'Content',
-    type: 'list',
-    list: ['label', 'button', 'glyph'],
-    value: 'label',
-  },
-  containerItems: {
-    id: 'containerItems',
-    for: 'Container',
-    order: 11,
-    group: 'Content',
-    type: 'list',
-    list: [1, 2, 3, 4, 5, 12],
-    value: 1,
-  },
-  textFieldComboMenu: {
-    id: 'textFieldComboMenu',
-    for: 'TextFieldCombo',
-    order: 10,
-    group: 'Menu',
-    type: 'list',
-    list: ['short', 'long', 'glyphs', 'special1', 'special2'],
-    value: 'short',
-  },
-  fieldMenu: {
-    id: 'fieldMenu',
-    for: 'Field',
-    order: 10,
-    group: 'List',
-    type: 'list',
-    list: ['short', 'middle', 'long'],
-    value: 'short',
-  },
-};
-
-// Define logic handlers according rc.json
-const logicHandlers = {
-  create: (state, action) => {
-    const initialState = {
-      id: action.get('id'),
-      globalSettings: globalSettings,
-      properties: properties,
-      previewSettings: previewSettings,
-    };
-    return state.set('', initialState);
-  },
-};
-
-// Register quest's according rc.json
-Goblin.registerQuest(goblinName, 'create', function (quest, desktopId) {
-  const desk = quest.getAPI(desktopId);
-  desk.addTab({
-    name: 'Wizard',
-    contextId: 'test',
-    view: 'test-wizard',
-    workitemId: quest.goblin.id,
-  });
-  quest.do();
-  return quest.goblin.id;
-});
-
-Goblin.registerQuest(goblinName, 'delete', function () {});
-
-// Manage global settings.
-/*Object.keys (globalSettings).forEach (p => {
-  const globalSetting = globalSettings[p];
-  Goblin.registerQuest (goblinName, `change-global-setting-${p}`, function (
-    quest,
-    newValue
-  ) {
-    quest.do ({newValue});
-  });
-  logicHandlers[`change-global-setting-${p}`] = (state, action) => {
-    globalSetting.value = action.get ('newValue');
-    return state.set (`globalSettings.${p}`, globalSetting);
-  };
-});*/
-
-// Manage properties of widget.
-/*Object.keys (properties).forEach (w => {
-  const wizard = properties[w];
-  Object.keys (wizard).forEach (p => {
-    const property = wizard[p];
-    Goblin.registerQuest (
-      goblinName,
-      `change-properties.${w}.${property.field}.value`,
-      function (quest) {
-        quest.do ();
-      }
-    );
-    logicHandlers[`change-properties.${w}.${property.field}.value`] = (
-      state,
-      action
-    ) => {
-      property.value = action.get ('newValue');
-      return state.set (`properties.${w}.${property.field}`, property);
-    };
-  });
-});*/
-
-// Manage preview settings.
-/*Object.keys (previewSettings).forEach (p => {
-  const previewSetting = previewSettings[p];
-  Goblin.registerQuest (goblinName, `change-preview-setting-${p}`, function (
-    quest,
-    newValue
-  ) {
-    quest.do ({newValue});
-  });
-  logicHandlers[`change-preview-setting-${p}`] = (state, action) => {
-    previewSetting.value = action.get ('newValue');
-    return state.set (`previewSettings.${p}`, previewSetting);
-  };
-});*/
-
-// Create a Goblin with initial state and handlers
-module.exports = Goblin.configure(goblinName, logicState, logicHandlers);
+//T:2019-02-27
+//mock
+'use strict';
+
+const path = require('path');
+const goblinName = path.basename(module.parent.filename, '.js');
+const Goblin = require('xcraft-core-goblin');
+
+// Define initial logic values
+const logicState = {};
+
+const globalSettings = {
+  widget: {
+    id: 'widget',
+    value: 'Button',
+  },
+};
+
+const colorList = [
+  '',
+  'base',
+  'primary',
+  'secondary',
+  'success',
+  'pick',
+  'drop',
+  'task',
+  'white',
+  'lightgrey',
+  'grey',
+  'black',
+  'red',
+  'green',
+  'blue',
+  'yellow',
+  '#d2e6f9 — light blue',
+  '#8ab6df — blue',
+  '#f5ddb8 — light orange',
+  '#fbce89 — orange',
+  '#c6f7da — light green',
+  '#74f7a9 — green',
+];
+
+const properties = {
+  Button: {
+    id: 'Button',
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: [
+        '',
+        'action',
+        'button-notification',
+        'button-footer',
+        'calendar-navigator',
+        'check-button',
+        'chronos-navigator',
+        'chronos-navigator',
+        'combo',
+        'combo-item',
+        'combo-wrap-item',
+        'desk-title',
+        'disabled-light',
+        'dynamic-toolbar-left',
+        'dynamic-toolbar-top-left',
+        'dynamic-toolbar-top-right',
+        'glyph-item',
+        'hover',
+        'identity',
+        'label',
+        'main-tab',
+        'main-tab-right',
+        'menu-item',
+        'notification-close',
+        'pane-navigator',
+        'pane-hnavigator',
+        'pane-vnavigator',
+        'recurrence',
+        'round',
+        'subaction',
+        'task-bar',
+        'task-tab',
+        'task-logo',
+        'thin-left',
+        'thin-right',
+        'toolbar',
+        'view-tab',
+        'view-tab-right',
+        'warning',
+      ],
+      value: '',
+    },
+    active: {
+      id: 'active',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'active',
+      value: false,
+    },
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    focusable: {
+      id: 'focusable',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'focusable',
+      value: false,
+    },
+    busy: {
+      id: 'busy',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'busy',
+      value: false,
+    },
+    border: {
+      id: 'border',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'border',
+      list: ['', 'none'],
+      value: '',
+    },
+    text: {
+      id: 'text',
+      group: 'Text',
+      type: 'text',
+      field: 'text',
+      list: [
+        '',
+        'Button',
+        "D'accord",
+        'Annuler',
+        'Enregistrer',
+        'Ouvrir le dossier',
+        'Long mot (anticonstitutionnellement) pour tester le mode wrap',
+        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne<br/>Quatrième ligne<br/>Cinquième ligne',
+        'Normal <em>sélectionné</em> normal',
+      ],
+      value: 'Button',
+    },
+    glyph: {
+      id: 'glyph',
+      group: 'Glyph',
+      type: 'text',
+      field: 'glyph',
+      list: [
+        '',
+        'solid/check',
+        'solid/times',
+        'solid/bicycle',
+        'solid/car',
+        'solid/rocket',
+        'solid/calendar',
+      ],
+      value: 'solid/check',
+    },
+    glyphRotate: {
+      id: 'glyphRotate',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphRotate',
+      list: ['', '90', '180', '270'],
+      value: '',
+    },
+    glyphFlip: {
+      id: 'glyphFlip',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphFlip',
+      list: ['', 'horizontal', 'vertical'],
+      value: '',
+    },
+    glyphSpin: {
+      id: 'glyphSpin',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphSpin',
+      list: ['', 'yes'],
+      value: '',
+    },
+    glyphPosition: {
+      id: 'glyphPosition',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphPosition',
+      list: ['', 'left', 'right'],
+      value: '',
+    },
+    glyphColor: {
+      id: 'glyphColor',
+      group: 'Glyph',
+      type: 'text',
+      unit: 'color',
+      field: 'glyphColor',
+      list: colorList,
+      value: '',
+    },
+    glyphSize: {
+      id: 'glyphSize',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphSize',
+      list: ['', '50%', '75%', '100%', '150%', '200%'],
+      value: '',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: [
+        '',
+        'rounded',
+        'left-rounded',
+        'right-rounded',
+        'left-smooth',
+        'right-smooth',
+      ],
+      value: '',
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    shortcut: {
+      id: 'shortcut',
+      group: 'Aspect',
+      type: 'text',
+      field: 'shortcut',
+      list: ['', '_ctrl_+A', '_shift_+A', '_alt_+A'],
+      value: '',
+    },
+    justify: {
+      id: 'justify',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'justify',
+      list: ['', 'start', 'center', 'end', 'around', 'between', 'none'],
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    height: {
+      id: 'height',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'height',
+      list: ['', '32px', '50px', '100px', '150px', '200px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    textColor: {
+      id: 'textColor',
+      group: 'Text',
+      type: 'text',
+      unit: 'color',
+      field: 'textColor',
+      list: colorList,
+      value: '',
+    },
+    backgroundColor: {
+      id: 'backgroundColor',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'color',
+      field: 'backgroundColor',
+      list: colorList,
+      value: '',
+    },
+    activeColor: {
+      id: 'activeColor',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'color',
+      field: 'activeColor',
+      list: colorList,
+      value: '',
+    },
+    fontSize: {
+      id: 'fontSize',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontSize',
+      list: ['', '50%', '75%', '100%', '150%', '200%'],
+      value: '',
+    },
+    fontWeight: {
+      id: 'fontWeight',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontWeight',
+      list: ['', 'bold'],
+      value: '',
+    },
+    fontStyle: {
+      id: 'fontStyle',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontStyle',
+      list: ['', 'italic', 'oblique'],
+      value: '',
+    },
+    textTransform: {
+      id: 'textTransform',
+      group: 'Text',
+      type: 'combo',
+      field: 'textTransform',
+      list: ['', 'uppercase', 'none'],
+      value: '',
+    },
+    wrap: {
+      id: 'wrap',
+      group: 'Text',
+      type: 'combo',
+      field: 'wrap',
+      list: ['', 'no', 'no-strict', 'yes', 'yes-permissive'],
+      value: '',
+    },
+    badgeValue: {
+      id: 'badgeValue',
+      group: 'Badge',
+      type: 'text',
+      field: 'badgeValue',
+      list: ['', '1', '2', '99', '123456'],
+      value: '',
+    },
+    badgePush: {
+      id: 'badgePush',
+      group: 'Badge',
+      type: 'bool',
+      field: 'badgePush',
+      value: '',
+    },
+    place: {
+      id: 'place',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'place',
+      list: ['', '1/1', '1/3', '2/3', '3/3'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  Label: {
+    id: 'Label',
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: [
+        '',
+        'big-center',
+        'center-to-box',
+        'compact',
+        'floating-footer',
+        'floating-header',
+        'flying-balloon',
+        'footer',
+        'info',
+        'large-left',
+        'large-right',
+        'large-single',
+        'notification',
+        'one-line-height',
+        'pane-header',
+        'task',
+        'ticket-warning',
+        'title',
+        'title-recurrence',
+      ],
+      value: '',
+    },
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    text: {
+      id: 'text',
+      group: 'Text',
+      type: 'text',
+      field: 'text',
+      list: [
+        '',
+        'Label',
+        'Nom',
+        'Prénom',
+        'NPA',
+        'Ville',
+        'Long mot (anticonstitutionnellement) pour tester le mode wrap',
+        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne<br/>Quatrième ligne<br/>Cinquième ligne',
+        'Normal <em>sélectionné</em> normal',
+      ],
+      value: 'Label',
+    },
+    glyph: {
+      id: 'glyph',
+      group: 'Glyph',
+      type: 'text',
+      field: 'glyph',
+      list: [
+        '',
+        'solid/check',
+        'solid/times',
+        'solid/bicycle',
+        'solid/car',
+        'solid/rocket',
+        'solid/calendar',
+      ],
+      value: 'solid/rocket',
+    },
+    glyphRotate: {
+      id: 'glyphRotate',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphRotate',
+      list: ['', '90', '180', '270'],
+      value: '',
+    },
+    glyphFlip: {
+      id: 'glyphFlip',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphFlip',
+      list: ['', 'horizontal', 'vertical'],
+      value: '',
+    },
+    glyphSpin: {
+      id: 'glyphSpin',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphSpin',
+      list: ['', 'yes'],
+      value: '',
+    },
+    glyphPosition: {
+      id: 'glyphPosition',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphPosition',
+      list: ['', 'left', 'right'],
+      value: '',
+    },
+    glyphColor: {
+      id: 'glyphColor',
+      group: 'Glyph',
+      type: 'text',
+      unit: 'color',
+      field: 'glyphColor',
+      list: colorList,
+      value: '',
+    },
+    glyphSize: {
+      id: 'glyphSize',
+      group: 'Glyph',
+      type: 'combo',
+      field: 'glyphSize',
+      list: ['', '50%', '75%', '100%', '150%', '200%'],
+      value: '',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: [
+        '',
+        'rounded',
+        'left-rounded',
+        'right-rounded',
+        'left-smooth',
+        'right-smooth',
+      ],
+      value: '',
+    },
+    insideButton: {
+      id: 'insideButton',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'insideButton',
+      value: false,
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    justify: {
+      id: 'justify',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'justify',
+      list: ['', 'start', 'center', 'end', 'around', 'between', 'none'],
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    height: {
+      id: 'height',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'height',
+      list: ['', '32px', '50px', '100px', '150px', '200px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    bottomSpacing: {
+      id: 'bottomSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'bottomSpacing',
+      list: ['', 'large'],
+      value: '',
+    },
+    vpos: {
+      id: 'vpos',
+      group: 'Layout',
+      type: 'combo',
+      field: 'vpos',
+      list: ['', 'top'],
+      value: '',
+    },
+    textColor: {
+      id: 'textColor',
+      group: 'Text',
+      type: 'text',
+      unit: 'color',
+      field: 'textColor',
+      list: colorList,
+      value: '',
+    },
+    backgroundColor: {
+      id: 'backgroundColor',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'color',
+      field: 'backgroundColor',
+      list: colorList,
+      value: '',
+    },
+    fontSize: {
+      id: 'fontSize',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontSize',
+      list: ['', '50%', '75%', '100%', '150%', '200%'],
+      value: '',
+    },
+    fontWeight: {
+      id: 'fontWeight',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontWeight',
+      list: ['', 'bold'],
+      value: '',
+    },
+    fontStyle: {
+      id: 'fontStyle',
+      group: 'Text',
+      type: 'combo',
+      field: 'fontStyle',
+      list: ['', 'italic', 'oblique'],
+      value: '',
+    },
+    textTransform: {
+      id: 'textTransform',
+      group: 'Text',
+      type: 'combo',
+      field: 'textTransform',
+      list: ['', 'uppercase', 'none'],
+      value: '',
+    },
+    wrap: {
+      id: 'wrap',
+      group: 'Text',
+      type: 'combo',
+      field: 'wrap',
+      list: ['', 'no', 'no-strict', 'yes', 'yes-permissive'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  TextField: {
+    id: 'TextField',
+    active: {
+      id: 'active',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'active',
+      value: false,
+    },
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Text',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    defaultValue: {
+      id: 'defaultValue',
+      group: 'Text',
+      type: 'text',
+      field: 'defaultValue',
+      list: [
+        '',
+        'TextField',
+        'Jean Dupond',
+        'Lausanne',
+        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
+      ],
+      value: 'TextField',
+    },
+    hintText: {
+      id: 'hintText',
+      group: 'Text',
+      type: 'text',
+      field: 'hintText',
+      list: ['', 'Prénom et nom', 'Adresse', 'Ville'],
+      value: 'Prénom et nom',
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: [
+        '',
+        'rounded',
+        'left-rounded',
+        'right-rounded',
+        'left-smooth',
+        'right-smooth',
+      ],
+      value: '',
+    },
+    rows: {
+      id: 'rows',
+      group: 'Text',
+      type: 'combo',
+      field: 'rows',
+      list: ['', '1', '2', '3', '4', '5', '10'],
+      value: '',
+    },
+    size: {
+      id: 'size',
+      group: 'Text',
+      type: 'combo',
+      field: 'size',
+      list: ['', '1', '10', '100'],
+      value: '',
+    },
+    maxLength: {
+      id: 'maxLength',
+      group: 'Text',
+      type: 'combo',
+      field: 'maxLength',
+      list: ['', '1', '10', '20', '100'],
+      value: '',
+    },
+    messageInfo: {
+      id: 'messageInfo',
+      group: 'Message',
+      type: 'text',
+      field: 'messageInfo',
+      value: '',
+    },
+    messageWarning: {
+      id: 'messageWarning',
+      group: 'Message',
+      type: 'text',
+      field: 'messageWarning',
+      value: '',
+    },
+    flyingBalloonAnchor: {
+      id: 'flyingBalloonAnchor',
+      group: 'Message',
+      type: 'combo',
+      field: 'flyingBalloonAnchor',
+      list: ['left', 'right', 'top', 'bottom'],
+      value: 'bottom',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '1',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    justify: {
+      id: 'justify',
+      group: 'Text',
+      type: 'combo',
+      field: 'justify',
+      list: ['', 'left', 'right'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  LabelTextField: {
+    id: 'LabelTextField',
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Text',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    defaultValue: {
+      id: 'defaultValue',
+      group: 'Text',
+      type: 'text',
+      field: 'defaultValue',
+      list: [
+        '',
+        'LabelTextField',
+        'Jean Dupond',
+        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
+      ],
+      value: 'LabelTextField',
+    },
+    labelText: {
+      id: 'labelText',
+      group: 'Label',
+      type: 'text',
+      field: 'labelText',
+      list: ['', 'Label', 'Nom', 'Prénom', 'Adresse', 'Ville'],
+      value: '',
+    },
+    labelGlyph: {
+      id: 'labelGlyph',
+      group: 'Label',
+      type: 'text',
+      field: 'labelGlyph',
+      list: [
+        '',
+        'solid/check',
+        'solid/times',
+        'solid/bicycle',
+        'solid/car',
+        'solid/rocket',
+        'solid/calendar',
+      ],
+      value: 'solid/car',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: ['', 'rounded', 'smooth'],
+      value: '',
+    },
+    fieldJustify: {
+      id: 'fieldJustify',
+      group: 'Text',
+      type: 'combo',
+      field: 'fieldJustify',
+      list: ['', 'left', 'right'],
+      value: '',
+    },
+    messageInfo: {
+      id: 'messageInfo',
+      group: 'Message',
+      type: 'text',
+      field: 'messageInfo',
+      value: '',
+    },
+    messageWarning: {
+      id: 'messageWarning',
+      group: 'Message',
+      type: 'text',
+      field: 'messageWarning',
+      value: '',
+    },
+    hintText: {
+      id: 'hintText',
+      group: 'Text',
+      type: 'text',
+      field: 'hintText',
+      list: ['', 'Prénom et nom', 'Adresse'],
+      value: 'Adresse',
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    labelWidth: {
+      id: 'labelWidth',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'labelWidth',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    fieldWidth: {
+      id: 'fieldWidth',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'fieldWidth',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '1',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  TextFieldCombo: {
+    id: 'TextFieldCombo',
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Text',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    menuType: {
+      id: 'menuType',
+      group: 'Menu',
+      type: 'combo',
+      field: 'menuType',
+      list: ['', 'select', 'combo', 'wrap'],
+      value: 'wrap',
+    },
+    menuItemWidth: {
+      id: 'menuItemWidth',
+      group: 'Menu',
+      type: 'text',
+      unit: 'px',
+      field: 'menuItemWidth',
+      list: ['', '100px', '150px', '200px', '300px'],
+      value: '',
+    },
+    menuItemTooltips: {
+      id: 'menuItemTooltips',
+      group: 'Menu',
+      type: 'bool',
+      field: 'menuItemTooltips',
+      value: false,
+    },
+    defaultValue: {
+      id: 'defaultValue',
+      group: 'Text',
+      type: 'text',
+      field: 'defaultValue',
+      list: [
+        '',
+        'TextFieldCombo',
+        'Lundi',
+        'Mardi',
+        'Mercredi',
+        'Jeudi',
+        'Vendredi',
+        'Samedi',
+        'Dimanche',
+        'Première ligne<br/>Deuxième ligne<br/>Troisième ligne',
+      ],
+      value: 'TextFieldCombo',
+    },
+    selectedValue: {
+      id: 'selectedValue',
+      group: 'Text',
+      type: 'text',
+      field: 'selectedValue',
+      list: [
+        '',
+        'Lundi',
+        'Mardi',
+        'Mercredi',
+        'Jeudi',
+        'Vendredi',
+        'Samedi',
+        'Dimanche',
+      ],
+      value: '',
+    },
+    comboGlyph: {
+      id: 'comboGlyph',
+      group: 'Aspect',
+      type: 'text',
+      field: 'comboGlyph',
+      list: ['', 'search'],
+      value: '',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: ['', 'rounded', 'smooth'],
+      value: '',
+    },
+    messageInfo: {
+      id: 'messageInfo',
+      group: 'Message',
+      type: 'text',
+      field: 'messageInfo',
+      value: '',
+    },
+    messageWarning: {
+      id: 'messageWarning',
+      group: 'Message',
+      type: 'text',
+      field: 'messageWarning',
+      value: '',
+    },
+    hintText: {
+      id: 'hintText',
+      group: 'Text',
+      type: 'text',
+      field: 'hintText',
+      list: ['', 'Jour de la semaine', 'Prénom et nom', 'Adresse'],
+      value: 'Jour de la semaine',
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '1',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  TextFieldTyped: {
+    id: 'TextFieldTyped',
+    active: {
+      id: 'active',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'active',
+      value: false,
+    },
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Text',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    type: {
+      id: 'type',
+      group: 'Text',
+      type: 'combo',
+      field: 'type',
+      list: ['date', 'time', 'price'],
+      value: 'date',
+    },
+    defaultValue: {
+      id: 'defaultValue',
+      group: 'Text',
+      type: 'text',
+      field: 'defaultValue',
+      list: ['', 'TextFieldTyped', '31.03.2017', '12:30'],
+      value: 'TextFieldTyped',
+    },
+    hintText: {
+      id: 'hintText',
+      group: 'Text',
+      type: 'text',
+      field: 'hintText',
+      list: ['', 'Date', 'Heure'],
+      value: 'Date',
+    },
+    tooltip: {
+      id: 'tooltip',
+      group: 'Aspect',
+      type: 'text',
+      field: 'tooltip',
+      value: '',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: [
+        '',
+        'rounded',
+        'left-rounded',
+        'right-rounded',
+        'left-smooth',
+        'right-smooth',
+      ],
+      value: '',
+    },
+    rows: {
+      id: 'rows',
+      group: 'Text',
+      type: 'combo',
+      field: 'rows',
+      list: ['', '1', '2', '3', '4', '5', '10'],
+      value: '',
+    },
+    size: {
+      id: 'size',
+      group: 'Text',
+      type: 'combo',
+      field: 'size',
+      list: ['', '1', '10', '100'],
+      value: '',
+    },
+    maxLength: {
+      id: 'maxLength',
+      group: 'Text',
+      type: 'combo',
+      field: 'maxLength',
+      list: ['', '1', '10', '20', '100'],
+      value: '',
+    },
+    messageInfo: {
+      id: 'messageInfo',
+      group: 'Message',
+      type: 'text',
+      field: 'messageInfo',
+      value: '',
+    },
+    messageWarning: {
+      id: 'messageWarning',
+      group: 'Message',
+      type: 'text',
+      field: 'messageWarning',
+      value: '',
+    },
+    flyingBalloonAnchor: {
+      id: 'flyingBalloonAnchor',
+      group: 'Message',
+      type: 'combo',
+      field: 'flyingBalloonAnchor',
+      list: ['left', 'right', 'top', 'bottom'],
+      value: 'bottom',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '1',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+    cursor: {
+      id: 'cursor',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'cursor',
+      list: [
+        '',
+        'default',
+        'none',
+        'pointer',
+        'cell',
+        'crosshair',
+        'text',
+        'move',
+        'not-allowed',
+        'ew-resize',
+        'ns-resize',
+        'grab',
+      ],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  Checkbox: {
+    id: 'Checkbox',
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: ['', 'switch', 'radio', 'active'],
+      value: '',
+    },
+    checked: {
+      id: 'checked',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'checked',
+      value: false,
+    },
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    readonly: {
+      id: 'readonly',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'readonly',
+      value: false,
+    },
+    focusable: {
+      id: 'focusable',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'focusable',
+      value: false,
+    },
+    text: {
+      id: 'text',
+      group: 'Text',
+      type: 'text',
+      field: 'text',
+      list: ['', 'Checkbox', 'Mise à jour automatique', 'Mode avancé'],
+      value: 'Checkbox',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'overlap', 'tiny', 'large', 'double'],
+      value: '',
+    },
+  },
+  Gauge: {
+    id: 'Gauge',
+    value: {
+      id: 'value',
+      group: 'Aspect',
+      type: 'text',
+      field: 'value',
+      list: [
+        '',
+        '0',
+        '10',
+        '20',
+        '30',
+        '40',
+        '50',
+        '60',
+        '70',
+        '80',
+        '90',
+        '100',
+      ],
+      value: '50',
+    },
+  },
+  Ticket: {
+    id: 'Ticket',
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: ['', 'ticket', 'rect', 'thin', 'event', 'subpane', 'cover'],
+      value: 'ticket',
+    },
+    shape: {
+      id: 'shape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'shape',
+      list: ['', 'first', 'last'],
+      value: '',
+    },
+    hoverShape: {
+      id: 'hoverShape',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'hoverShape',
+      list: ['', 'first', 'middle', 'last'],
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '150px',
+    },
+    height: {
+      id: 'height',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'height',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '250px'],
+      value: '100px',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'horizontalSpacing',
+      list: ['', '0px', '2px', '10px', '20px'],
+      value: '2px',
+    },
+    verticalSpacing: {
+      id: 'verticalSpacing',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'verticalSpacing',
+      list: ['', '0px', '2px', '10px', '20px'],
+      value: '2px',
+    },
+    hatch: {
+      id: 'hatch',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'hatch',
+      value: false,
+    },
+    flash: {
+      id: 'flash',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'flash',
+      value: false,
+    },
+    hideContent: {
+      id: 'hideContent',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'hideContent',
+      value: false,
+    },
+    color: {
+      id: 'color',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'color',
+      field: 'color',
+      list: colorList,
+      value: '#d2e6f9 — light blue',
+    },
+    hudGlyph: {
+      id: 'hudGlyph',
+      group: 'Content',
+      type: 'text',
+      field: 'hudGlyph',
+      list: [
+        '',
+        'solid/check',
+        'solid/times',
+        'solid/bicycle',
+        'solid/car',
+        'solid/rocket',
+        'solid/calendar',
+      ],
+      value: '',
+    },
+    backgroundText: {
+      id: 'backgroundText',
+      group: 'Content',
+      type: 'text',
+      field: 'backgroundText',
+      list: ['', '1', '2', '3', '4', 'Abc'],
+      value: '',
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    visibility: {
+      id: 'visibility',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'visibility',
+      value: true,
+    },
+  },
+  Container: {
+    id: 'Container',
+    disabled: {
+      id: 'disabled',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'disabled',
+      value: false,
+    },
+    show: {
+      id: 'show',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'show',
+      value: true,
+    },
+    selected: {
+      id: 'selected',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'selected',
+      value: false,
+    },
+    busy: {
+      id: 'busy',
+      group: 'Aspect',
+      type: 'bool',
+      field: 'busy',
+      value: false,
+    },
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: [
+        '',
+        'actions',
+        'box',
+        'boxes',
+        'chronos-events',
+        'column',
+        'column-full',
+        'compact-row',
+        'content',
+        'drag-to-delete',
+        'drag-too-many',
+        'floating',
+        'floating-footer',
+        'floating-header',
+        'flying-balloon',
+        'flying-chat',
+        'flying-dialog',
+        'footer',
+        'full-view',
+        'glyph-samples',
+        'left-bar',
+        'main-tab',
+        'main-tab-right',
+        'mandats',
+        'pane',
+        'pane-top',
+        'panes',
+        'pane-header',
+        'pane-header-light',
+        'pane-hnavigator',
+        'pane-navigator',
+        'pane-top',
+        'pane-vnavigator',
+        'right',
+        'row',
+        'row-pane',
+        'row-pane-drag',
+        'row-wrap',
+        'second-bar',
+        'task-bar',
+        'thin-center',
+        'thin-column',
+        'thin-main',
+        'thin-row',
+        'ticket-mode',
+        'ticket-row',
+        'ticket-column',
+        'tickets',
+        'tickets-desk',
+        'tickets-messengers',
+        'tickets-messenger',
+        'tickets-root',
+        'tickets-trips',
+        'tickets-tray',
+        'top-bar',
+        'view',
+        'view-edge',
+        'view-right',
+        'view-stretch',
+        'view-tab',
+        'view-tab-right',
+        'views',
+        'wrap',
+      ],
+      value: 'column',
+    },
+    subkind: {
+      id: 'subkind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'subkind',
+      list: [
+        '',
+        'box',
+        'box-left',
+        'footer',
+        'info',
+        'large-box',
+        'left',
+        'light-box',
+        'list',
+        'me',
+        'no-shadow',
+        'top-margin',
+        'wide-info',
+        'wrap',
+      ],
+      value: '',
+    },
+    border: {
+      id: 'border',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'border',
+      list: ['', 'top', 'right', 'bottom', 'left'],
+      value: '',
+    },
+    trianglePosition: {
+      id: 'trianglePosition',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'trianglePosition',
+      list: ['', 'top', 'right', 'bottom', 'left', 'none'],
+      value: '',
+    },
+    triangleShift: {
+      id: 'triangleShift',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'px',
+      field: 'triangleShift',
+      list: ['', '-50px', '-10px', '0px', '10px', '50px'],
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    height: {
+      id: 'height',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'height',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '250px'],
+      value: '',
+    },
+    marginBottom: {
+      id: 'marginBottom',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'marginBottom',
+      list: ['', '2px', '5px', '10px', '20px'],
+      value: '',
+    },
+    floatingHeight: {
+      id: 'floatingHeight',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'floatingHeight',
+      list: ['', '10px', '20px', '50px', '100px'],
+      value: '10px',
+    },
+    grow: {
+      id: 'grow',
+      group: 'Layout',
+      type: 'text',
+      field: 'grow',
+      list: ['', '0.5', '1'],
+      value: '',
+    },
+    horizontalSpacing: {
+      id: 'horizontalSpacing',
+      group: 'Layout',
+      type: 'combo',
+      field: 'horizontalSpacing',
+      list: ['', 'compact', 'large'],
+      value: '',
+    },
+    backgroundColor: {
+      id: 'backgroundColor',
+      group: 'Aspect',
+      type: 'text',
+      unit: 'color',
+      field: 'backgroundColor',
+      list: colorList,
+      value: '',
+    },
+  },
+  Field: {
+    id: 'Field',
+    kind: {
+      id: 'kind',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'kind',
+      list: ['', 'field', 'combo', 'radio', 'bool', 'hinter', 'file'],
+      value: 'field',
+    },
+    direction: {
+      id: 'direction',
+      group: 'Aspect',
+      type: 'combo',
+      field: 'direction',
+      list: ['', 'row', 'column', 'wrap'],
+      value: 'row',
+    },
+    rows: {
+      id: 'rows',
+      group: 'Text',
+      type: 'combo',
+      field: 'rows',
+      list: ['', '1', '2', '3', '4', '5', '10'],
+      value: '',
+    },
+    width: {
+      id: 'width',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'width',
+      list: ['', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    height: {
+      id: 'height',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'height',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px'],
+      value: '',
+    },
+    labelText: {
+      id: 'labelText',
+      group: 'Label',
+      type: 'text',
+      field: 'labelText',
+      list: ['', 'Field', 'Nom', 'Prénom', 'Adresse', 'Ville'],
+      value: 'Field',
+    },
+    labelGlyph: {
+      id: 'labelGlyph',
+      group: 'Label',
+      type: 'text',
+      field: 'labelGlyph',
+      list: [
+        '',
+        'solid/check',
+        'solid/times',
+        'solid/bicycle',
+        'solid/car',
+        'solid/rocket',
+        'solid/calendar',
+      ],
+      value: '',
+    },
+    labelWidth: {
+      id: 'labelWidth',
+      group: 'Layout',
+      type: 'text',
+      unit: 'px',
+      field: 'labelWidth',
+      list: ['', '32px', '50px', '100px', '150px', '200px', '300px', '500px'],
+      value: '',
+    },
+    hintText: {
+      id: 'hintText',
+      group: 'Text',
+      type: 'text',
+      field: 'hintText',
+      list: ['', 'Prénom', 'Nom', 'Adresse', 'Numéro postal', 'Ville'],
+      value: '',
+    },
+    justify: {
+      id: 'justify',
+      group: 'Text',
+      type: 'combo',
+      field: 'justify',
+      list: ['', 'left', 'right'],
+      value: '',
+    },
+    menuItemWidth: {
+      id: 'menuItemWidth',
+      group: 'Menu',
+      type: 'text',
+      unit: 'px',
+      field: 'menuItemWidth',
+      list: ['', '100px', '150px', '200px', '300px'],
+      value: '',
+    },
+  },
+};
+
+const previewSettings = {
+  scale: {
+    id: 'scale',
+    order: 1,
+    group: 'Scale',
+    type: 'list',
+    list: [1, 1.5, 2, 3, 4],
+    value: 2,
+  },
+  color: {
+    id: 'color',
+    order: 2,
+    group: 'Color',
+    type: 'list',
+    list: ['pane', 'view', 'task', 'root', 'footer'],
+    value: 'pane',
+  },
+  items: {
+    id: 'items',
+    order: 3,
+    group: 'Items',
+    type: 'list',
+    list: [1, 2, 3, 4, 5, 10, 11],
+    value: 1,
+  },
+  layout: {
+    id: 'layout',
+    order: 4,
+    group: 'Layout',
+    type: 'list',
+    list: ['row', 'column', 'wrap'],
+    value: 'row',
+  },
+  showFrame: {
+    id: 'showFrame',
+    order: 5,
+    group: 'Frame',
+    type: 'bool',
+    value: false,
+  },
+  ticketLines: {
+    id: 'ticketLines',
+    for: 'Ticket',
+    order: 10,
+    group: 'Lines',
+    type: 'list',
+    list: [1, 2, 3, 4, 5, 10],
+    value: 1,
+  },
+  containerType: {
+    id: 'containerType',
+    for: 'Container',
+    order: 10,
+    group: 'Content',
+    type: 'list',
+    list: ['label', 'button', 'glyph'],
+    value: 'label',
+  },
+  containerItems: {
+    id: 'containerItems',
+    for: 'Container',
+    order: 11,
+    group: 'Content',
+    type: 'list',
+    list: [1, 2, 3, 4, 5, 12],
+    value: 1,
+  },
+  textFieldComboMenu: {
+    id: 'textFieldComboMenu',
+    for: 'TextFieldCombo',
+    order: 10,
+    group: 'Menu',
+    type: 'list',
+    list: ['short', 'long', 'glyphs', 'special1', 'special2'],
+    value: 'short',
+  },
+  fieldMenu: {
+    id: 'fieldMenu',
+    for: 'Field',
+    order: 10,
+    group: 'List',
+    type: 'list',
+    list: ['short', 'middle', 'long'],
+    value: 'short',
+  },
+};
+
+// Define logic handlers according rc.json
+const logicHandlers = {
+  create: (state, action) => {
+    const initialState = {
+      id: action.get('id'),
+      globalSettings: globalSettings,
+      properties: properties,
+      previewSettings: previewSettings,
+    };
+    return state.set('', initialState);
+  },
+};
+
+// Register quest's according rc.json
+Goblin.registerQuest(goblinName, 'create', function (quest, desktopId) {
+  const desk = quest.getAPI(desktopId);
+  desk.addTab({
+    name: 'Wizard',
+    contextId: 'test',
+    view: 'test-wizard',
+    workitemId: quest.goblin.id,
+  });
+  quest.do();
+  return quest.goblin.id;
+});
+
+Goblin.registerQuest(goblinName, 'delete', function () {});
+
+// Manage global settings.
+/*Object.keys (globalSettings).forEach (p => {
+  const globalSetting = globalSettings[p];
+  Goblin.registerQuest (goblinName, `change-global-setting-${p}`, function (
+    quest,
+    newValue
+  ) {
+    quest.do ({newValue});
+  });
+  logicHandlers[`change-global-setting-${p}`] = (state, action) => {
+    globalSetting.value = action.get ('newValue');
+    return state.set (`globalSettings.${p}`, globalSetting);
+  };
+});*/
+
+// Manage properties of widget.
+/*Object.keys (properties).forEach (w => {
+  const wizard = properties[w];
+  Object.keys (wizard).forEach (p => {
+    const property = wizard[p];
+    Goblin.registerQuest (
+      goblinName,
+      `change-properties.${w}.${property.field}.value`,
+      function (quest) {
+        quest.do ();
+      }
+    );
+    logicHandlers[`change-properties.${w}.${property.field}.value`] = (
+      state,
+      action
+    ) => {
+      property.value = action.get ('newValue');
+      return state.set (`properties.${w}.${property.field}`, property);
+    };
+  });
+});*/
+
+// Manage preview settings.
+/*Object.keys (previewSettings).forEach (p => {
+  const previewSetting = previewSettings[p];
+  Goblin.registerQuest (goblinName, `change-preview-setting-${p}`, function (
+    quest,
+    newValue
+  ) {
+    quest.do ({newValue});
+  });
+  logicHandlers[`change-preview-setting-${p}`] = (state, action) => {
+    previewSetting.value = action.get ('newValue');
+    return state.set (`previewSettings.${p}`, previewSetting);
+  };
+});*/
+
+// Create a Goblin with initial state and handlers
+module.exports = Goblin.configure(goblinName, logicState, logicHandlers);