Terminal TAST

Inline Types

TAST Inline types allows to create a set of preconfigured, styles, actions, and other properties that affects to all inlines of that type.

Good developers are lazy and do not want to repeat the same thing more than twice. When it happens they love to create abstractions and generics to cover repeated cases. The problem is that TAST must work with JSON and should be serializable, which does not allows to use complex structures of reutilizable code. In order to solve this restriction, TAST Inlines can be typed. Inline types have those definitions and are applied to all the inlines of the same inlineType.

Default Inline types

There are three default Inline types: actionLink, infoLink and stripedTable. Configure the property inlineType to use any of them.

Show example

Sets text colors and background colors using inline styles.

tast.json

Copy

[
  {
    "type": "Inline",
    "inlineType": "actionLink",
    "children": ["- actionLink\n"]
  },
  {
    "type": "Inline",
    "inlineType": "infoLink",
    "children": ["- infoLink\n"]
  },
  {
    "type": "Inline",
    "inlineType": "stripedTable",
    "children": ["- stripedTable\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Custom Inline types styles

Use setTerminalsInlineTypes to define your own inline types. Then, use them from the TAST as many times as you want.

Show example

Sets background colors for text.

tast.json

Copy

[
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "style": {
            "background": "red"
          }
        }
      }
    },
    "children": ["[CLICK ME => SET inlineType: 'example/MyInlineType' background red ]\n"]
  },
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "style": {
            "background": "blue"
          }
        }
      }
    },
    "children": ["[CLICK ME => SET inlineType: 'example/MyInlineType' background blue]\n"]
  },
  "\n",
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "children": ["- Inline 1\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "children": ["- Inline 2\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "children": ["- Inline 3\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Note that if the Inline type does not exists, nothing happens.

Extending styles

Inlines can extend the style of its Inline type. They just must have a style property in addition to the inlineType property.

Show example

Sets text colors, hover colors, and background colors.

tast.json

Copy

[
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "style": {
      "color": "cyan"
    },
    "children": ["- Inline cyan\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "style": {
      "color": "yellow"
    },
    "children": ["- Inline yellow\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "style": {
      ":hover": {
        "color": "magenta"
      }
    },
    "children": ["- Inline magenta on hover\n"]
  },
  "\n",
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "style": {
            "background": "red"
          }
        }
      }
    },
    "children": ["[CLICK ME => SET inlineType: 'example/MyInlineType' background red ]\n"]
  },
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "style": {
            "background": "blue"
          }
        }
      }
    },
    "children": ["[CLICK ME => SET inlineType: 'example/MyInlineType' background blue]\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Themes

Inline types can define theme. They can mark that all inlines of that type apply one theme.

Show example

Click to set text as info links or triggers with corresponding theme.

tast.json

Copy

[
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "themeType": "actionLink"
        }
      }
    },
    "children": ["[CLICK ME => Make them infoLinks ]\n"]
  },
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyInlineType": {
          "themeType": "trigger"
        }
      }
    },
    "children": ["[CLICK ME => Make them triggers  ]\n"]
  },
  "\n",
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "children": ["- Inline 1\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "children": ["- Inline 2\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyInlineType",
    "style": {
      "background": "white"
    },
    "children": ["- Inline with white background\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Custom actions

Inline types can also define actions to be executed. All Inlines with that type will fire the same action when clicked o pressed intro. Of course terminalId and inlineId are added.

Show example

Clicking sets the text background to blue.

tast.json

Copy

[
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyAddsTAST": {
          "action": {
            "type": "@orion/terminals-helper/APPEND_TERMINAL_TAST",
            "tast": ["- Added TAST\n"]
          },
          "style": {
            "background": "blue"
          }
        }
      }
    },
    "children": ["[CLICK ME => Enable AddTAST action]\n"]
  },
  "\n",
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 1\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 2\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 3\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Extending actions

Inlines extends actions with the action property.

Show example

Clicking sets the text background to blue.

tast.json

Copy

[
  {
    "type": "Inline",
    "action": {
      "type": "@orion/terminals-helper/SET_TERMINALS_INLINE_TYPES",
      "inlineTypes": {
        "example/MyAddsTAST": {
          "action": {
            "type": "@orion/terminals-helper/APPEND_TERMINAL_TAST",
            "tast": ["- Added TAST\n"]
          },
          "style": {
            "background": "blue"
          }
        }
      }
    },
    "children": ["[CLICK ME => Enable AddTAST action]\n"]
  },
  "\n",
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 1\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 2\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "action": {
      "tast": "HELLO!\n"
    },
    "children": ["- Say hello\n"]
  }
]

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST"
          ]
        }
      }
    }
  }
}

Configuring Inline types

Inline types should configured by the plugin in the beginning of the plugin. This is required to do once, and the defined Inline types will be actived for all terminal outputs.

Show example

Sets background of the text to blue.

configureInlineTypes.js

Copy

export default function configureInlineTypes({ dispatchersHelper }) {
  dispatchersHelper.dispatch('setTerminalsInlineTypes', {
    inlineTypes: {
      'example/MyAddsTAST': {
        action: {
          type: '@orion/terminals-helper/APPEND_TERMINAL_TAST',
          tast: ['- Added TAST\n'],
        },
        style: {
          background: 'blue',
        },
      },
    },
  });
}

tast.json

Copy

[
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 1\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "children": ["- Inline 2\n"]
  },
  {
    "type": "Inline",
    "inlineType": "example/MyAddsTAST",
    "action": {
      "tast": "HELLO!\n"
    },
    "children": ["- Say hello\n"]
  }
]

index.js

Copy

import configureInlineTypes from './configureInlineTypes.js';
import configureTerminal from './configureTerminal.js';
import configureExampleComponent from './configureExampleComponent.js';

export default class Plugin {
  constructor(dio) {
    configureInlineTypes(dio);
    configureTerminal(dio);
    configureExampleComponent(dio);
  }
}

configureTerminal.js

Copy

import tast from './tast.json';

export default function configureTerminal({ dispatchersHelper, tastHelper }) {
  dispatchersHelper.dispatch('createTerminal', { terminal: { id: '1' } });
  dispatchersHelper.dispatch('spliceTerminalTAST', {
    terminalId: '1',
    tast: tastHelper.bind(tast, {}),
    from: { line: 1 },
    to: { line: 2 },
  });
}

configureExampleComponent.js

Copy

import React from 'react';

export default function configureExampleComponent({ uiHelper }) {
  uiHelper.putComponent('Example', () => (
    <div style={{ background: '#555', lineHeight: 1.1 }}>
      <uiHelper.POSComponent componentName="Terminal" terminalId="1" />
    </div>
  ));
}

package.json

Copy

{
  "name": "example",
  "version": "1.0.0",
  "orion": {
    "dispatchersHelper": {
      "actionCreators": {
        "consumes": {
          "@orion/terminals": [
            "createTerminal",
            "spliceTerminalTAST",
            "setTerminalsInlineTypes"
          ]
        }
      }
    }
  }
}