jssm 5.80.1 → 5.82.0

package/dist/es6/jssm.d.ts

@@ -94,7 +94,7 @@ declare function arrow_right_kind(arrow: JssmArrow): JssmArrowKind;
  *  ```typescript
  *  import { sm } from 'jssm';
  *
- *  const switch = sm`on <=> off;`;
+ *  const lswitch = sm`on <=> off;`;
  *  ```
  *
  *  Method {@link from}:
@@ -149,7 +149,7 @@ declare function wrap_parse(input: string, options?: Object): any;
  *  ```typescript
  *  import { sm } from 'jssm';
  *
- *  const switch = sm`on <=> off;`;
+ *  const lswitch = sm`on <=> off;`;
  *  ```
  *
  *  Method {@link from}:
@@ -218,7 +218,7 @@ declare class Machine<mDT> {
     _arrange_declaration: Array<Array<StateType>>;
     _arrange_start_declaration: Array<Array<StateType>>;
     _arrange_end_declaration: Array<Array<StateType>>;
-    _theme: FslTheme;
+    _themes: FslTheme[];
     _flow: FslDirection;
     _has_hooks: boolean;
     _has_basic_hooks: boolean;
@@ -266,6 +266,7 @@ declare class Machine<mDT> {
     _terminal_state_style: JssmStateConfig;
     _start_state_style: JssmStateConfig;
     _end_state_style: JssmStateConfig;
+    _state_labels: Map<string, string>;
     constructor({ start_states, end_states, complete, transitions, machine_author, machine_comment, machine_contributor, machine_definition, machine_language, machine_license, machine_name, machine_version, state_declaration, property_definition, state_property, fsl_version, dot_preamble, arrange_declaration, arrange_start_declaration, arrange_end_declaration, theme, flow, graph_layout, instance_name, history, data, default_state_config, default_active_state_config, default_hooked_state_config, default_terminal_state_config, default_start_state_config, default_end_state_config }: JssmGenericConfig<mDT>);
     /********
      *
@@ -282,17 +283,32 @@ declare class Machine<mDT> {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
-     *  console.log( switch.state() );             // 'on'
+     *  const lswitch = jssm.from('on <=> off;');
+     *  console.log( lswitch.state() );             // 'on'
      *
-     *  switch.transition('off');
-     *  console.log( switch.state() );             // 'off'
+     *  lswitch.transition('off');
+     *  console.log( lswitch.state() );             // 'off'
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
      *
      */
     state(): StateType;
+    /*********
+     *
+     *  Get the label for a given state, if any; return `undefined` otherwise.
+     *
+     *  ```typescript
+     *  import * as jssm from 'jssm';
+     *
+     *  const lswitch = jssm.from('a -> b; state a: { label: "Foo!"; };');
+     *  console.log( lswitch.label_for('a') );              // 'Foo!'
+     *  ```
+     *
+     *  @typeparam mDT The type of the machine data member; usually omitted
+     *
+     */
+    label_for(state: StateType): string;
     /*********
      *
      *  Get the current data of a machine.
@@ -300,8 +316,8 @@ declare class Machine<mDT> {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;', {data: 1});
-     *  console.log( switch.data() );              // 1
+     *  const lswitch = jssm.from('on <=> off;', {data: 1});
+     *  console.log( lswitch.data() );              // 1
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -545,8 +561,8 @@ declare class Machine<mDT> {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
-     *  console.log( switch.states() );             // ['on', 'off']
+     *  const lswitch = jssm.from('on <=> off;');
+     *  console.log( lswitch.states() );             // ['on', 'off']
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -561,10 +577,10 @@ declare class Machine<mDT> {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
+     *  const lswitch = jssm.from('on <=> off;');
      *
-     *  console.log( switch.has_state('off') );     // true
-     *  console.log( switch.has_state('dance') );   // false
+     *  console.log( lswitch.has_state('off') );     // true
+     *  console.log( lswitch.has_state('dance') );   // false
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -609,7 +625,7 @@ declare class Machine<mDT> {
     list_edges(): Array<JssmTransition<mDT>>;
     list_named_transitions(): Map<StateType, number>;
     list_actions(): Array<StateType>;
-    theme(): FslTheme;
+    themes(): FslTheme[];
     flow(): FslDirection;
     get_transition_by_state_names(from: StateType, to: StateType): number;
     lookup_transition_for(from: StateType, to: StateType): JssmTransition<mDT>;
@@ -1054,7 +1070,7 @@ declare class Machine<mDT> {
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
-  b   *
+     *
      *  @param actionName The action to engage
      *
      *  @param newData The data change to insert during the action
@@ -1155,7 +1171,7 @@ declare class Machine<mDT> {
  *  ```typescript
  *  import * as jssm from 'jssm';
  *
- *  const switch = jssm.from('on <=> off;');
+ *  const lswitch = jssm.from('on <=> off;');
  *  ```
  *
  *  @typeparam mDT The type of the machine data member; usually omitted
@@ -1178,7 +1194,7 @@ declare function sm<mDT>(template_strings: TemplateStringsArray, ...remainder: a
  *  ```typescript
  *  import * as jssm from 'jssm';
  *
- *  const switch = jssm.from('on <=> off;');
+ *  const lswitch = jssm.from('on <=> off;');
  *  ```
  *
  *  @typeparam mDT The type of the machine data member; usually omitted

package/dist/es6/jssm.js

@@ -1,7 +1,14 @@
 // whargarbl lots of these return arrays could/should be sets
 import { reduce as reduce_to_639 } from 'reduce-to-639-1';
 import { circular_buffer } from 'circular_buffer_js';
-import { base_state_style, base_start_state_style, base_end_state_style, base_terminal_state_style, base_active_state_style } from './jssm_base_stylesheet';
+import { base_theme } from './themes/jssm_base_stylesheet';
+import { default_theme } from './themes/jssm_theme_default';
+import { modern_theme } from './themes/jssm_theme_modern';
+import { ocean_theme } from './themes/jssm_theme_ocean';
+const theme_mapping = new Map();
+theme_mapping.set('default', default_theme);
+theme_mapping.set('modern', modern_theme);
+theme_mapping.set('ocean', ocean_theme);
 import { seq, unique, find_repeated, weighted_rand_select, weighted_sample_select, histograph, weighted_histo_key, array_box_if_string, name_bind_prop_and_state, hook_name, named_hook_name } from './jssm_util';
 import * as constants from './jssm_constants';
 const { shapes, gviz_shapes, named_colors } = constants;
@@ -272,7 +279,7 @@ function makeTransition(this_se, from, to, isRight, _wasList, _wasIndex) {
  *  ```typescript
  *  import { sm } from 'jssm';
  *
- *  const switch = sm`on <=> off;`;
+ *  const lswitch = sm`on <=> off;`;
  *  ```
  *
  *  Method {@link from}:
@@ -424,7 +431,7 @@ function compile_rule_handler(rule) {
  *  ```typescript
  *  import { sm } from 'jssm';
  *
- *  const switch = sm`on <=> off;`;
+ *  const lswitch = sm`on <=> off;`;
  *  ```
  *
  *  Method {@link from}:
@@ -491,7 +498,7 @@ function compile(tree) {
     const oneOnlyKeys = [
         'graph_layout', 'machine_name', 'machine_version', 'machine_comment',
         'fsl_version', 'machine_license', 'machine_definition', 'machine_language',
-        'theme', 'flow', 'dot_preamble'
+        'flow', 'dot_preamble'
     ];
     oneOnlyKeys.map((oneOnlyKey) => {
         if (results[oneOnlyKey].length > 1) {
@@ -504,7 +511,7 @@ function compile(tree) {
         }
     });
     ['arrange_declaration', 'arrange_start_declaration', 'arrange_end_declaration',
-        'machine_author', 'machine_contributor', 'machine_reference',
+        'machine_author', 'machine_contributor', 'machine_reference', 'theme',
         'state_declaration', 'property_definition', 'default_state_config',
         'default_start_state_config', 'default_end_state_config',
         'default_hooked_state_config', 'default_terminal_state_config',
@@ -574,6 +581,9 @@ function transfer_state_properties(state_decl) {
             case 'background-color':
                 state_decl.backgroundColor = d.value;
                 break;
+            case 'state-label':
+                state_decl.stateLabel = d.value;
+                break;
             case 'border-color':
                 state_decl.borderColor = d.value;
                 break;
@@ -629,6 +639,12 @@ function state_style_condense(jssk) {
                     }
                     state_style.backgroundColor = key.value;
                     break;
+                case 'state-label':
+                    if (state_style.stateLabel !== undefined) {
+                        throw new JssmError(this, `cannot redefine 'state-label' in state_style_condense, already defined`);
+                    }
+                    state_style.stateLabel = key.value;
+                    break;
                 case 'border-color':
                     if (state_style.borderColor !== undefined) {
                         throw new JssmError(this, `cannot redefine 'border-color' in state_style_condense, already defined`);
@@ -652,7 +668,7 @@ function state_style_condense(jssk) {
 // TODO add a lotta docblock here
 class Machine {
     // whargarbl this badly needs to be broken up, monolith master
-    constructor({ start_states, end_states = [], complete = [], transitions, machine_author, machine_comment, machine_contributor, machine_definition, machine_language, machine_license, machine_name, machine_version, state_declaration, property_definition, state_property, fsl_version, dot_preamble = undefined, arrange_declaration = [], arrange_start_declaration = [], arrange_end_declaration = [], theme = 'default', flow = 'down', graph_layout = 'dot', instance_name, history, data, default_state_config, default_active_state_config, default_hooked_state_config, default_terminal_state_config, default_start_state_config, default_end_state_config }) {
+    constructor({ start_states, end_states = [], complete = [], transitions, machine_author, machine_comment, machine_contributor, machine_definition, machine_language, machine_license, machine_name, machine_version, state_declaration, property_definition, state_property, fsl_version, dot_preamble = undefined, arrange_declaration = [], arrange_start_declaration = [], arrange_end_declaration = [], theme = ['default'], flow = 'down', graph_layout = 'dot', instance_name, history, data, default_state_config, default_active_state_config, default_hooked_state_config, default_terminal_state_config, default_start_state_config, default_end_state_config }) {
         this._instance_name = instance_name;
         this._state = start_states[0];
         this._states = new Map();
@@ -679,7 +695,7 @@ class Machine {
         this._arrange_start_declaration = arrange_start_declaration;
         this._arrange_end_declaration = arrange_end_declaration;
         this._dot_preamble = dot_preamble;
-        this._theme = theme;
+        this._themes = theme;
         this._flow = flow;
         this._graph_layout = graph_layout;
         this._has_hooks = false;
@@ -731,6 +747,8 @@ class Machine {
         this._end_state_style = state_style_condense(default_end_state_config);
         this._history_length = history || 0;
         this._history = new circular_buffer(this._history_length);
+        this._state_labels = new Map();
+        // consolidate the state declarations
         if (state_declaration) {
             state_declaration.map((state_decl) => {
                 if (this._state_declarations.has(state_decl.state)) { // no repeats
@@ -739,6 +757,17 @@ class Machine {
                 this._state_declarations.set(state_decl.state, transfer_state_properties(state_decl));
             });
         }
+        // walk the decls for labels; aggregate them when found
+        [...this._state_declarations].map(sd => {
+            const [key, decl] = sd, labelled = decl.declarations.filter(d => d.key === 'state-label');
+            if (labelled.length > 1) {
+                throw new JssmError(this, `state ${key} may only have one state-label; has ${labelled.length}`);
+            }
+            if (labelled.length === 1) {
+                this._state_labels.set(key, labelled[0].value);
+            }
+        });
+        // walk the transitions
         transitions.map((tr) => {
             if (tr.from === undefined) {
                 throw new JssmError(this, `transition must define 'from': ${JSON.stringify(tr)}`);
@@ -890,11 +919,11 @@ class Machine {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
-     *  console.log( switch.state() );             // 'on'
+     *  const lswitch = jssm.from('on <=> off;');
+     *  console.log( lswitch.state() );             // 'on'
      *
-     *  switch.transition('off');
-     *  console.log( switch.state() );             // 'off'
+     *  lswitch.transition('off');
+     *  console.log( lswitch.state() );             // 'off'
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -903,13 +932,23 @@ class Machine {
     state() {
         return this._state;
     }
-    /* whargarbl todo major
-       when we reimplement this, reintroduce this change to the is_final call
-  
-      is_changing(): boolean {
-        return true; // todo whargarbl
-      }
-    */
+    /*********
+     *
+     *  Get the label for a given state, if any; return `undefined` otherwise.
+     *
+     *  ```typescript
+     *  import * as jssm from 'jssm';
+     *
+     *  const lswitch = jssm.from('a -> b; state a: { label: "Foo!"; };');
+     *  console.log( lswitch.label_for('a') );              // 'Foo!'
+     *  ```
+     *
+     *  @typeparam mDT The type of the machine data member; usually omitted
+     *
+     */
+    label_for(state) {
+        return this._state_labels.get(state);
+    }
     /*********
      *
      *  Get the current data of a machine.
@@ -917,8 +956,8 @@ class Machine {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;', {data: 1});
-     *  console.log( switch.data() );              // 1
+     *  const lswitch = jssm.from('on <=> off;', {data: 1});
+     *  console.log( lswitch.data() );              // 1
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -927,13 +966,6 @@ class Machine {
     data() {
         return this._data;
     }
-    /* whargarbl todo major
-       when we reimplement this, reintroduce this change to the is_final call
-  
-      is_changing(): boolean {
-        return true; // todo whargarbl
-      }
-    */
     // NEEDS_DOCS
     /*********
      *
@@ -1273,8 +1305,8 @@ class Machine {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
-     *  console.log( switch.states() );             // ['on', 'off']
+     *  const lswitch = jssm.from('on <=> off;');
+     *  console.log( lswitch.states() );             // ['on', 'off']
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -1299,10 +1331,10 @@ class Machine {
      *  ```typescript
      *  import * as jssm from 'jssm';
      *
-     *  const switch = jssm.from('on <=> off;');
+     *  const lswitch = jssm.from('on <=> off;');
      *
-     *  console.log( switch.has_state('off') );     // true
-     *  console.log( switch.has_state('dance') );   // false
+     *  console.log( lswitch.has_state('off') );     // true
+     *  console.log( lswitch.has_state('dance') );   // false
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
@@ -1355,8 +1387,8 @@ class Machine {
     list_actions() {
         return Array.from(this._actions.keys());
     }
-    theme() {
-        return this._theme; // constructor sets this to "default" otherwise
+    themes() {
+        return this._themes; // constructor sets this to "default" otherwise
     }
     flow() {
         return this._flow;
@@ -2292,6 +2324,12 @@ class Machine {
     get active_state_style() {
         return this._active_state_style;
     }
+    /*
+     */
+    // TODO COMEBACK IMPLEMENTME FIXME
+    // has_hooks(state: StateType): false {
+    //   return false;
+    // }
     /********
      *
      *  Gets the composite style for a specific node by individually imposing the
@@ -2312,48 +2350,76 @@ class Machine {
      *
      */
     style_for(state) {
+        // first look up the themes
+        const themes = [];
+        this._themes.forEach(th => {
+            const theme_impl = theme_mapping.get(th);
+            if (theme_impl !== undefined) {
+                themes.push(theme_impl);
+            }
+        });
         // basic state style
-        const layers = [base_state_style];
-        //  if (theme.state_style) { layers.push(theme.state_style); }
+        const layers = [base_theme.state];
+        themes.reverse().map(theme => {
+            if (theme.state) {
+                layers.push(theme.state);
+            }
+        });
         if (this._state_style) {
             layers.push(this._state_style);
         }
-        /*
-            // hooked state style
-            if (this.has_hooks(state)) {
-              layers.push(base_hooked_state_style);
-        //    if (theme.hooked_state_style) { layers.push(theme.hooked_state_style); }
-              if (this._hooked_state_style) { layers.push(this._hooked_state_style); }
-            }
-        */
+        // hooked state style
+        // if (this.has_hooks(state)) {
+        //   layers.push(base_theme.hooked);
+        //   themes.map(theme => {
+        //     if (theme.hooked) { layers.push(theme.hooked); }
+        //   });
+        //   if (this._hooked_state_style) { layers.push(this._hooked_state_style); }
+        // }
         // terminal state style
         if (this.state_is_terminal(state)) {
-            layers.push(base_terminal_state_style);
-            //    if (theme.terminal_state_style) { layers.push(theme.terminal_state_style); }
+            layers.push(base_theme.terminal);
+            themes.map(theme => {
+                if (theme.terminal) {
+                    layers.push(theme.terminal);
+                }
+            });
             if (this._terminal_state_style) {
                 layers.push(this._terminal_state_style);
             }
         }
         // start state style
         if (this.is_start_state(state)) {
-            layers.push(base_start_state_style);
-            //    if (theme.start_state_style) { layers.push(theme.start_state_style); }
+            layers.push(base_theme.start);
+            themes.map(theme => {
+                if (theme.start) {
+                    layers.push(theme.start);
+                }
+            });
             if (this._start_state_style) {
                 layers.push(this._start_state_style);
             }
         }
         // end state style
         if (this.is_end_state(state)) {
-            layers.push(base_end_state_style);
-            //    if (theme.end_state_style) { layers.push(theme.end_state_style); }
+            layers.push(base_theme.end);
+            themes.map(theme => {
+                if (theme.end) {
+                    layers.push(theme.end);
+                }
+            });
             if (this._end_state_style) {
                 layers.push(this._end_state_style);
             }
         }
         // active state style
         if (this.state() === state) {
-            layers.push(base_active_state_style);
-            //    if (theme.active_state_style) { layers.push(theme.active_state_style); }
+            layers.push(base_theme.active);
+            themes.map(theme => {
+                if (theme.active) {
+                    layers.push(theme.active);
+                }
+            });
             if (this._active_state_style) {
                 layers.push(this._active_state_style);
             }
@@ -2398,7 +2464,7 @@ class Machine {
      *  ```
      *
      *  @typeparam mDT The type of the machine data member; usually omitted
-  b   *
+     *
      *  @param actionName The action to engage
      *
      *  @param newData The data change to insert during the action
@@ -2543,7 +2609,7 @@ class Machine {
  *  ```typescript
  *  import * as jssm from 'jssm';
  *
- *  const switch = jssm.from('on <=> off;');
+ *  const lswitch = jssm.from('on <=> off;');
  *  ```
  *
  *  @typeparam mDT The type of the machine data member; usually omitted
@@ -2578,7 +2644,7 @@ function sm(template_strings, ...remainder /* , arguments */) {
  *  ```typescript
  *  import * as jssm from 'jssm';
  *
- *  const switch = jssm.from('on <=> off;');
+ *  const lswitch = jssm.from('on <=> off;');
  *  ```
  *
  *  @typeparam mDT The type of the machine data member; usually omitted

package/dist/es6/jssm_types.d.ts

@@ -106,6 +106,7 @@ declare type JssmStateDeclaration = {
     color?: JssmColor;
     corners?: JssmCorner;
     lineStyle?: JssmLineStyle;
+    stateLabel?: string;
     textColor?: JssmColor;
     backgroundColor?: JssmColor;
     borderColor?: JssmColor;
@@ -136,6 +137,10 @@ declare type JssmStateStyleLineStyle = {
     key: 'line-style';
     value: JssmLineStyle;
 };
+declare type JssmStateStyleStateLabel = {
+    key: 'state-label';
+    value: string;
+};
 declare type JssmStateStyleBackgroundColor = {
     key: 'background-color';
     value: JssmColor;
@@ -144,13 +149,32 @@ declare type JssmStateStyleBorderColor = {
     key: 'border-color';
     value: JssmColor;
 };
-declare type JssmStateStyleKey = JssmStateStyleShape | JssmStateStyleColor | JssmStateStyleTextColor | JssmStateStyleCorners | JssmStateStyleLineStyle | JssmStateStyleBackgroundColor | JssmStateStyleBorderColor;
+declare type JssmStateStyleKey = JssmStateStyleShape | JssmStateStyleColor | JssmStateStyleTextColor | JssmStateStyleCorners | JssmStateStyleLineStyle | JssmStateStyleBackgroundColor | JssmStateStyleStateLabel | JssmStateStyleBorderColor;
 declare type JssmStateStyleKeyList = JssmStateStyleKey[];
+declare type JssmBaseTheme = {
+    state: JssmStateConfig;
+    hooked: JssmStateConfig;
+    start: JssmStateConfig;
+    end: JssmStateConfig;
+    terminal: JssmStateConfig;
+    active: JssmStateConfig;
+    active_hooked: JssmStateConfig;
+    active_start: JssmStateConfig;
+    active_end: JssmStateConfig;
+    active_terminal: JssmStateConfig;
+    graph: undefined;
+    legal: undefined;
+    main: undefined;
+    forced: undefined;
+    action: undefined;
+    title: undefined;
+};
+declare type JssmTheme = Partial<JssmBaseTheme>;
 declare type JssmGenericConfig<DataType> = {
     graph_layout?: JssmLayout;
     complete?: Array<StateType>;
     transitions: JssmTransitions<DataType>;
-    theme?: FslTheme;
+    theme?: FslTheme[];
     flow?: FslDirection;
     name?: string;
     data?: DataType;
@@ -327,4 +351,4 @@ declare type JssmErrorExtendedInfo = {
     requested_state?: StateType | undefined;
 };
 declare type JssmHistory<mDT> = circular_buffer<[StateType, mDT]>;
-export { JssmColor, JssmShape, JssmTransition, JssmTransitions, JssmTransitionList, JssmTransitionRule, JssmArrow, JssmArrowKind, JssmArrowDirection, JssmGenericConfig, JssmGenericState, JssmGenericMachine, JssmParseTree, JssmCompileSe, JssmCompileSeStart, JssmCompileRule, JssmPermitted, JssmPermittedOpt, JssmResult, JssmStateDeclaration, JssmStateDeclarationRule, JssmStateConfig, JssmStateStyleKey, JssmStateStyleKeyList, JssmLayout, JssmHistory, JssmSerialization, JssmPropertyDefinition, JssmParseFunctionType, JssmMachineInternalState, JssmErrorExtendedInfo, FslDirection, FslTheme, HookDescription, HookHandler, HookContext, HookResult, HookComplexResult };
+export { JssmColor, JssmShape, JssmTransition, JssmTransitions, JssmTransitionList, JssmTransitionRule, JssmArrow, JssmArrowKind, JssmArrowDirection, JssmGenericConfig, JssmGenericState, JssmGenericMachine, JssmParseTree, JssmCompileSe, JssmCompileSeStart, JssmCompileRule, JssmPermitted, JssmPermittedOpt, JssmResult, JssmStateDeclaration, JssmStateDeclarationRule, JssmStateConfig, JssmStateStyleKey, JssmStateStyleKeyList, JssmBaseTheme, JssmTheme, JssmLayout, JssmHistory, JssmSerialization, JssmPropertyDefinition, JssmParseFunctionType, JssmMachineInternalState, JssmErrorExtendedInfo, FslDirection, FslTheme, HookDescription, HookHandler, HookContext, HookResult, HookComplexResult };

package/dist/es6/{jssm_base_stylesheet.d.ts → themes/jssm_base_stylesheet.d.ts}

@@ -1,4 +1,4 @@
-import { JssmStateConfig } from './jssm_types';
+import { JssmStateConfig, JssmBaseTheme } from '../jssm_types';
 declare const base_state_style: JssmStateConfig;
 declare const base_active_state_style: JssmStateConfig;
 declare const base_terminal_state_style: JssmStateConfig;
@@ -7,4 +7,5 @@ declare const base_start_state_style: JssmStateConfig;
 declare const base_active_start_state_style: JssmStateConfig;
 declare const base_end_state_style: JssmStateConfig;
 declare const base_active_end_state_style: JssmStateConfig;
-export { base_state_style, base_active_state_style, base_terminal_state_style, base_active_terminal_state_style, base_start_state_style, base_active_start_state_style, base_end_state_style, base_active_end_state_style };
+declare const base_theme: JssmBaseTheme;
+export { base_state_style, base_active_state_style, base_terminal_state_style, base_active_terminal_state_style, base_start_state_style, base_active_start_state_style, base_end_state_style, base_active_end_state_style, base_theme, base_theme as theme };

package/dist/es6/{jssm_base_stylesheet.js → themes/jssm_base_stylesheet.js}

@@ -8,6 +8,9 @@ const base_active_state_style = {
     textColor: 'white',
     backgroundColor: 'dodgerblue4'
 };
+const base_hooked_state_style = {
+    shape: 'component'
+};
 const base_terminal_state_style = {
     textColor: 'white',
     backgroundColor: 'crimson'
@@ -22,6 +25,9 @@ const base_start_state_style = {
 const base_active_start_state_style = {
     backgroundColor: 'yellowgreen'
 };
+const base_active_hooked_state_style = {
+    backgroundColor: 'yellowgreen'
+};
 const base_end_state_style = {
     textColor: 'white',
     backgroundColor: 'darkolivegreen'
@@ -30,4 +36,22 @@ const base_active_end_state_style = {
     textColor: 'white',
     backgroundColor: 'darkgreen'
 };
-export { base_state_style, base_active_state_style, base_terminal_state_style, base_active_terminal_state_style, base_start_state_style, base_active_start_state_style, base_end_state_style, base_active_end_state_style };
+const base_theme = {
+    state: base_state_style,
+    start: base_start_state_style,
+    end: base_end_state_style,
+    terminal: base_terminal_state_style,
+    hooked: base_hooked_state_style,
+    active: base_active_state_style,
+    active_start: base_active_start_state_style,
+    active_end: base_active_end_state_style,
+    active_terminal: base_active_terminal_state_style,
+    active_hooked: base_active_hooked_state_style,
+    legal: undefined,
+    main: undefined,
+    forced: undefined,
+    action: undefined,
+    graph: undefined,
+    title: undefined // TODO FIXME
+};
+export { base_state_style, base_active_state_style, base_terminal_state_style, base_active_terminal_state_style, base_start_state_style, base_active_start_state_style, base_end_state_style, base_active_end_state_style, base_theme, base_theme as theme };

package/dist/es6/themes/jssm_theme_default.d.ts

@@ -0,0 +1,11 @@
+import { JssmStateConfig, JssmBaseTheme } from '../jssm_types';
+declare const base_state_style: JssmStateConfig;
+declare const base_active_state_style: JssmStateConfig;
+declare const base_terminal_state_style: JssmStateConfig;
+declare const base_active_terminal_state_style: JssmStateConfig;
+declare const base_start_state_style: JssmStateConfig;
+declare const base_active_start_state_style: JssmStateConfig;
+declare const base_end_state_style: JssmStateConfig;
+declare const base_active_end_state_style: JssmStateConfig;
+declare const default_theme: JssmBaseTheme;
+export { base_state_style, base_active_state_style, base_terminal_state_style, base_active_terminal_state_style, base_start_state_style, base_active_start_state_style, base_end_state_style, base_active_end_state_style, default_theme, default_theme as theme };