From b8d775eaa6dd486becbd42e6e179cd2e26ac6b4c Mon Sep 17 00:00:00 2001
From: cha0s <git@cha0s.io>
Date: Fri, 9 Jul 2021 12:50:17 -0500
Subject: [PATCH] chore: ded

---
 .../src/components/condition.jsx              | 131 -------
 .../src/components/condition.scss             |  49 ---
 .../src/components/expression.jsx             | 367 ------------------
 .../src/components/expression.scss            |  37 --
 .../src/components/expression/invocation.jsx  | 137 -------
 .../src/components/expression/invocation.scss |  53 ---
 .../src/components/expression/key.jsx         | 140 -------
 .../src/components/expression/key.scss        |   3 -
 .../src/components/expressions.jsx            | 149 -------
 .../src/components/expressions.scss           |  54 ---
 .../src/components/help/variant.jsx           |  31 --
 .../src/components/literal.jsx                | 263 -------------
 .../src/components/literal.scss               |   5 -
 13 files changed, 1419 deletions(-)
 delete mode 100644 packages/behavior-persea/src/components/condition.jsx
 delete mode 100644 packages/behavior-persea/src/components/condition.scss
 delete mode 100644 packages/behavior-persea/src/components/expression.jsx
 delete mode 100644 packages/behavior-persea/src/components/expression.scss
 delete mode 100644 packages/behavior-persea/src/components/expression/invocation.jsx
 delete mode 100644 packages/behavior-persea/src/components/expression/invocation.scss
 delete mode 100644 packages/behavior-persea/src/components/expression/key.jsx
 delete mode 100644 packages/behavior-persea/src/components/expression/key.scss
 delete mode 100644 packages/behavior-persea/src/components/expressions.jsx
 delete mode 100644 packages/behavior-persea/src/components/expressions.scss
 delete mode 100644 packages/behavior-persea/src/components/help/variant.jsx
 delete mode 100644 packages/behavior-persea/src/components/literal.jsx
 delete mode 100644 packages/behavior-persea/src/components/literal.scss

diff --git a/packages/behavior-persea/src/components/condition.jsx b/packages/behavior-persea/src/components/condition.jsx
deleted file mode 100644
index 1abd117..0000000
--- a/packages/behavior-persea/src/components/condition.jsx
+++ /dev/null
@@ -1,131 +0,0 @@
-import './condition.scss';
-
-import {join} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  classnames,
-  PropTypes,
-  React,
-} from '@latus/react';
-
-import Variant from './help/variant';
-
-const Condition = ({context, path, value}) => {
-  const patch = useJsonPatcher();
-  const operands = value.operands.map((operand, i) => {
-    const operandKey = join(path, 'operands', i.toString());
-    return (
-      <Variant
-        context={context}
-        key={operandKey}
-        onChange={(event, value, localPath) => {
-          patch({
-            path: localPath,
-            value,
-          });
-        }}
-        path={operandKey}
-        type="any"
-        value={operand}
-      />
-    );
-  });
-  const operator = (
-    <select
-      key={join(path, 'operator')}
-      onChange={(event) => {
-        patch({
-          path: join(path, 'operator'),
-          value: event.target.value,
-        });
-      }}
-      value={value.operator}
-    >
-      <option value="is">is</option>
-      <option value="isnt">isnt</option>
-      <option value=">">&gt;</option>
-      <option value=">=">&gt;=</option>
-      <option value="<">&lt;</option>
-      <option value="<=">&lt;=</option>
-      <option value="or">or</option>
-      <option value="and">and</option>
-      <option value="contains">contains</option>
-    </select>
-  );
-  const renderables = [];
-  switch (value.operator) {
-    case 'or':
-    case 'and':
-      renderables.push(operator);
-      renderables.push(...operands.map((operand, i) => (
-        <div className="operand__wrapper">
-          {operand}
-          <button
-            className="condition__remove-operand"
-            onClick={() => {
-              patch({
-                op: 'remove',
-                path: join(path, 'operands', i.toString()),
-              });
-            }}
-            type="button"
-          >
-            x
-          </button>
-        </div>
-      )));
-      renderables.push(
-        <button
-          onClick={() => {
-            patch({
-              op: 'add',
-              path: join(path, 'operands/-'),
-              value: {
-                type: 'literal',
-                value: true,
-              },
-            });
-          }}
-          type="button"
-        >
-          Add operand
-        </button>,
-      );
-      break;
-    default:
-      renderables.push(operands.shift());
-      renderables.push(operator);
-      renderables.push(...operands);
-  }
-  return (
-    <div
-      className={classnames(
-        'condition',
-        {'condition--vertical': -1 !== ['and', 'or'].indexOf(value.operator)},
-      )}
-    >
-      {renderables}
-    </div>
-  );
-};
-
-Condition.defaultProps = {};
-
-Condition.displayName = 'Condition';
-
-Condition.propTypes = {
-  context: PropTypes.shape({
-    describeChildren: PropTypes.func,
-    get: PropTypes.func,
-  }).isRequired,
-  path: PropTypes.string.isRequired,
-  value: PropTypes.shape({
-    operator: PropTypes.string,
-    operands: PropTypes.arrayOf(
-      PropTypes.any,
-    ),
-  }).isRequired,
-};
-
-export default Condition;
diff --git a/packages/behavior-persea/src/components/condition.scss b/packages/behavior-persea/src/components/condition.scss
deleted file mode 100644
index 69e0734..0000000
--- a/packages/behavior-persea/src/components/condition.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-.condition {
-  align-items: center;
-  display: flex;
-  &.condition--vertical {
-    align-items: flex-start;
-    flex-direction: column;
-  }
-}
-
-.condition--vertical {
-
-  > select {
-    margin-bottom: 1em;
-  }
-  > .expression,
-  > .key,
-  > .literal {
-    margin-left: 1em;
-  }
-  > .expression {
-    margin-bottom: 0.5em;
-    &:last-child {
-      margin-bottom: 0;
-    }
-  }
-}
-
-.condition .condition--vertical {
-  padding-top: 0.5em;
-}
-
-.operand__wrapper {
-  align-items: center;
-  display: flex;
-  padding-left: 0.5em;
-  width: 100%;
-  &:nth-of-type(2n+1) {
-    background-color: rgba(255, 255, 255, 0.05);
-  }
-  > button {
-    background-color: transparent;
-    border: none;
-    font-size: 0.8em;
-    margin-left: auto;
-    margin-right: 0.5em;
-    padding: 1em;
-    pointer-events: auto;
-  }
-}
diff --git a/packages/behavior-persea/src/components/expression.jsx b/packages/behavior-persea/src/components/expression.jsx
deleted file mode 100644
index 93fef05..0000000
--- a/packages/behavior-persea/src/components/expression.jsx
+++ /dev/null
@@ -1,367 +0,0 @@
-import './expression.scss';
-
-import {join, relative} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  classnames,
-  PropTypes,
-  React,
-  useLatus,
-} from '@latus/react';
-
-import compile from '../../compilers/compile';
-import {isInvocation, isKey} from '../../testers';
-import Invocation from './expression/invocation';
-import Key from './expression/key';
-import Variant from './help/variant';
-
-const Expression = ({
-  context,
-  path,
-  type,
-  value,
-  vararg,
-}) => {
-  const latus = useLatus();
-  const patch = useJsonPatcher();
-  const types = latus.get('%behavior-types');
-  let i = 0;
-  const {ops, value: expressionValue} = value;
-  const Renderables = [];
-  let opsCount = 0;
-  // eslint-disable-next-line react/destructuring-assignment
-  let description = context.describeChildren();
-  const onChange = (event, value, localPath) => {
-    const patches = [];
-    const j = parseInt(relative(path, localPath).split('/')[1], 10);
-    if (j < ops.length - 1) {
-      for (let k = j + 1; k < ops.length; ++k) {
-        patches.unshift({
-          op: 'remove',
-          path: join(path, 'ops', k.toString()),
-        });
-      }
-    }
-    else if (event && j === ops.length) {
-      patches.push({
-        op: 'add',
-        path: join(path, 'ops', j.toString()),
-        value: {
-          type: 'key',
-        },
-      });
-    }
-    patches.push({
-      path: localPath,
-      value,
-    });
-    patch(patches);
-  };
-  do {
-    const op = ops[i];
-    const opPath = join(path, 'ops', opsCount.toString());
-    const nextOp = i === ops.length - 1 ? undefined : ops[i + 1];
-    if (isKey(op)) {
-      const isFirst = 0 === i;
-      const isLast = i === ops.length - 1 ? true : isInvocation(ops[i + 1]);
-      Renderables.push(
-        <Key
-          childrenDescription={{
-            ...(
-              isFirst && 'void' !== type
-                ? {
-                  '[literal]': {label: '', type},
-                }
-                : {}
-            ),
-            ...(
-              vararg && isFirst
-                ? {'...': {label: '', type: description.type}}
-                : {}
-            ),
-            ...(
-              isLast && !isFirst
-                ? {'.': {label: '', type: description.type}}
-                : {}
-            ),
-            ...description.children,
-            ...(
-              isFirst
-                ? {
-                  '[key]': {label: '', type: 'undefined'},
-                }
-                : {
-                  '[key]': {label: '', type: 'undefined'},
-                  '[invoke]': {label: '', type: 'undefined'},
-                }
-            ),
-          }}
-          key={opPath}
-          onChange={((i) => (event, value, localPath) => {
-            if ('.' === value || '...' === value) {
-              const parts = localPath.split('/');
-              parts.pop();
-              parts.pop();
-              if ('...' === value) {
-                parts.pop();
-                patch({
-                  op: 'remove',
-                  path: parts.join('/'),
-                });
-                return;
-              }
-              const patches = [];
-              for (let j = i; j < ops.length; ++j) {
-                patches.unshift(
-                  {
-                    op: 'remove',
-                    path: join(parts.join('/'), j.toString()),
-                  },
-                );
-              }
-              patch(patches);
-            }
-            else if ('[literal]' === value) {
-              patch({
-                op: 'replace',
-                path,
-                value: {
-                  type: 'literal',
-                  value: null,
-                },
-              });
-            }
-            else {
-              onChange(event, value, localPath);
-            }
-          })(i)}
-          path={opPath}
-          value={op.key}
-        />,
-      );
-      opsCount += 1;
-    }
-    if (isInvocation(op)) {
-      const R = Renderables.pop();
-      Renderables.push(
-        <div
-          className="expression__invocation-toggle-wrapper"
-          key={`${opPath}-toggle-from`}
-        >
-          {R}
-          <button
-            className="expression__invocation-toggle from"
-            onClick={() => {
-              patch({
-                op: 'remove',
-                path: opPath,
-              });
-            }}
-            type="button"
-          >
-            →
-          </button>
-        </div>,
-      );
-      Renderables.push(
-        <Invocation
-          context={context}
-          description={description}
-          Expression={Expression}
-          key={opPath}
-          onChange={onChange}
-          op={op}
-          path={opPath}
-        />,
-      );
-      opsCount += 1;
-    }
-    if (isKey(op)) {
-      const current = compile({type: 'expression', ops: ops.slice(0, i + 1)}, latus)(context);
-      description = description.children?.[op.key] || {type: 'undefined'};
-      const {args, type} = description;
-      if ('void' !== type) {
-        description = {
-          ...context.constructor.descriptionFor(
-            type,
-            current,
-            latus,
-          ),
-          ...(args ? {args} : {}),
-        };
-      }
-      if (description.args && (!nextOp || !isInvocation(nextOp))) {
-        const R = Renderables.pop();
-        Renderables.push(
-          <div
-            className="expression__invocation-toggle-wrapper"
-            key={`${opPath}-toggle-to`}
-          >
-            {R}
-            <button
-              className="expression__invocation-toggle to"
-              onClick={((description, opPath) => () => {
-                const parts = opPath.split('/');
-                parts.push(parseInt(parts.pop(), 10) + 1);
-                patch({
-                  op: 'add',
-                  path: parts.join('/'),
-                  value: {
-                    type: 'invoke',
-                    args: description.vararg
-                      ? []
-                      : description.args.map(
-                        (arg) => ({
-                          ...(false === arg.compile ? {compile: false} : {}),
-                          ...(
-                            (types[arg.type] || types.undefined).create(
-                              (arg.options?.length || 0) > 0
-                                ? arg.options[0].value
-                                : undefined,
-                            )
-                          ),
-                        }),
-                      ),
-                  },
-                });
-              })(description, opPath)}
-              type="button"
-            >
-              →
-            </button>
-          </div>,
-        );
-      }
-    }
-    if (isInvocation(op)) {
-      if ('void' !== description.type) {
-        description = context.constructor.descriptionFor(
-          description.type,
-          undefined,
-          latus,
-        );
-      }
-    }
-  } while (i++ < ops.length - 1);
-  if (
-    description.children
-    || 'undefined' === description.type
-  ) {
-    const opPath = join(path, 'ops', opsCount.toString());
-    Renderables.push(
-      <Key
-        childrenDescription={{
-          '.': {label: '', type: description.type},
-          ...(description.children || {}),
-          '[key]': {label: '', type: 'undefined'},
-          '[invoke]': {label: '', type: 'undefined'},
-        }}
-        key={opPath}
-        onChange={onChange}
-        path={opPath}
-        value="."
-      />,
-    );
-    opsCount += 1;
-  }
-  const [lastOp] = ops.slice(-1);
-  if (
-    'void' === type
-    && isKey(lastOp)
-  ) {
-    const opPath = join(path, 'value');
-    Renderables.push(
-      <Key
-        childrenDescription={{
-          '≡': {label: '', type: description.type},
-          '≔': {label: '', type: 'void'},
-        }}
-        key={opPath}
-        onChange={(event, value) => {
-          if ('≡' === value) {
-            patch({
-              op: 'remove',
-              path: opPath,
-            });
-          }
-          else {
-            patch({
-              path: opPath,
-              value: (types[description.type] || types.undefined).create(),
-            });
-          }
-        }}
-        path={opPath}
-        value={expressionValue ? '≔' : '≡'}
-      />,
-    );
-    if (expressionValue) {
-      const expressionType = isKey(lastOp) && description.args
-        ? 'function'
-        : description.type;
-      Renderables.push(
-        <Variant
-          context={context}
-          onChange={(event, value, localPath) => {
-            patch({
-              path: localPath,
-              value,
-            });
-          }}
-          key={join(opPath, 'expression')}
-          path={opPath}
-          type={expressionType}
-          value={expressionValue}
-          vararg={vararg}
-        />,
-      );
-    }
-  }
-  let realType = description.type;
-  if (isKey(lastOp) && description.args) {
-    realType = 'function';
-  }
-  if (expressionValue) {
-    realType = 'undefined' === description.type ? 'undefined' : 'void';
-  }
-  return (
-    <div
-      className={classnames(
-        'expression',
-        {'wrong-type': 'any' !== type && 'undefined' !== type && realType !== type},
-        {'undefined-type': 'undefined' === realType},
-      )}
-    >
-      {Renderables}
-    </div>
-  );
-};
-
-Expression.defaultProps = {
-  vararg: false,
-};
-
-Expression.displayName = 'Expression';
-
-Expression.propTypes = {
-  context: PropTypes.shape({
-    constructor: PropTypes.func,
-    describeChildren: PropTypes.func,
-    get: PropTypes.func,
-  }).isRequired,
-  value: PropTypes.shape({
-    ops: PropTypes.arrayOf(
-      PropTypes.shape({
-        key: PropTypes.string,
-      }),
-    ),
-    // eslint-disable-next-line react/forbid-prop-types
-    value: PropTypes.any,
-  }).isRequired,
-  vararg: PropTypes.bool,
-  path: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
-};
-
-export default Expression;
diff --git a/packages/behavior-persea/src/components/expression.scss b/packages/behavior-persea/src/components/expression.scss
deleted file mode 100644
index 9c9e434..0000000
--- a/packages/behavior-persea/src/components/expression.scss
+++ /dev/null
@@ -1,37 +0,0 @@
-.expression {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  button, .button {
-    color: #00bdd6;
-  }
-  &.wrong-type {
-    background-color: rgb(180, 0, 0);
-    padding: 0.5em;
-  }
-  &.undefined-type {
-    background-color: rgb(180, 180, 0);
-    padding: 0.5em;
-  }
-  > .expression {
-    width: auto;
-  }
-}
-
-.expression__invocation-toggle-wrapper {
-  align-items: center;
-  display: flex;
-}
-
-.expression__invocation-toggle {
-  background: #222222;
-  margin: 0;
-  padding: 0.25em;
-  pointer-events: auto;
-  &:hover {
-    background: #333333;
-  }
-  &.to {
-    transform: rotate(180deg);
-  }
-}
diff --git a/packages/behavior-persea/src/components/expression/invocation.jsx b/packages/behavior-persea/src/components/expression/invocation.jsx
deleted file mode 100644
index 5b8424d..0000000
--- a/packages/behavior-persea/src/components/expression/invocation.jsx
+++ /dev/null
@@ -1,137 +0,0 @@
-import './invocation.scss';
-
-import {join} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  PropTypes,
-  React,
-} from '@latus/react';
-
-import Variant from '../help/variant';
-import Key from './key';
-
-const Invocation = ({
-  context,
-  description,
-  onChange,
-  op,
-  path,
-}) => {
-  const patch = useJsonPatcher();
-  const argComponent = (arg, i) => {
-    const argPath = join(path, 'args', i.toString());
-    if ('undefined' === arg.type) {
-      return (
-        <Key
-          childrenDescription={{
-            '...': {label: '', type: 'undefined'},
-            '[literal]': {label: '', type: 'undefined'},
-            ...context.describeChildren().children,
-            '[key]': {label: '', type: 'undefined'},
-          }}
-          key={path}
-          onChange={(event, value) => {
-            if ('[literal]' === value) {
-              patch({
-                type: 'add',
-                path: argPath,
-                value: {
-                  type: 'literal',
-                  value: null,
-                },
-              });
-              return;
-            }
-            patch({
-              type: 'add',
-              path: argPath,
-              value: {
-                type: 'expression',
-                ops: [
-                  {
-                    type: 'key',
-                  },
-                ],
-              },
-            });
-            onChange(false, value, join(argPath, 'ops/0/key'));
-          }}
-          path={argPath}
-          value="..."
-        />
-      );
-    }
-    let darg;
-    if ('function' === typeof description?.args) {
-      darg = description?.args(i);
-    }
-    else {
-      const j = description.vararg ? i % description?.args?.length : i;
-      darg = description?.args?.[j];
-    }
-    const type = darg?.type || 'undefined';
-    return (
-      <Variant
-        context={context}
-        onChange={onChange}
-        options={darg?.options}
-        path={argPath}
-        type={type}
-        value={arg}
-        vararg={
-          'undefined' === type
-          || description.vararg
-        }
-      />
-    );
-  };
-  const isVarArg = 'undefined' === description.type || description.vararg;
-  const args = op.args.concat();
-  if (isVarArg) {
-    args.push({type: 'undefined'});
-  }
-  return (
-    <div className="invocation">
-      {args.length > 0 && (
-        <div className="invocation__args-wrapper">
-          {
-            args.map((arg, i) => (
-              <div
-                key={join(path, 'args', i.toString())}
-                className="invocation__arg"
-              >
-                {argComponent(arg, i)}
-              </div>
-            ))
-          }
-        </div>
-      )}
-    </div>
-  );
-};
-
-Invocation.displayName = 'Invocation';
-
-Invocation.propTypes = {
-  context: PropTypes.shape({
-    describeChildren: PropTypes.func,
-  }).isRequired,
-  description: PropTypes.shape({
-    args: PropTypes.arrayOf(
-      PropTypes.shape({
-        options: PropTypes.arrayOf(PropTypes.any),
-        type: PropTypes.string,
-      }),
-    ),
-    type: PropTypes.string,
-    vararg: PropTypes.bool,
-  }).isRequired,
-  onChange: PropTypes.func.isRequired,
-  op: PropTypes.shape({
-    args: PropTypes.arrayOf(PropTypes.any),
-  }).isRequired,
-  path: PropTypes.string.isRequired,
-};
-
-export default Invocation;
diff --git a/packages/behavior-persea/src/components/expression/invocation.scss b/packages/behavior-persea/src/components/expression/invocation.scss
deleted file mode 100644
index 13a6775..0000000
--- a/packages/behavior-persea/src/components/expression/invocation.scss
+++ /dev/null
@@ -1,53 +0,0 @@
-.invocation {
-  align-items: center;
-  display: flex;
-  margin-left: 0.25em;
-  > .expression {
-    margin: 0 0.5em;
-  }
-  &:after {
-    color: #00bdd6;
-    content: ')';
-    font-size: 1.5em;
-  }
-  &:before {
-    color: #00bdd6;
-    content: '(';
-    font-size: 1.5em;
-  }
-}
-
-.invocation__args-wrapper {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  margin: 0.25em;
-}
-
-.invocation__arg {
-  align-items: center;
-  background-color: rgba(255, 255, 255, 0.1);
-  display: flex;
-  padding: 0.5em;
-  position: relative;
-  &:nth-of-type(2n+1) {
-    background-color: rgba(0, 0, 0, 0.1);
-  }
-  &:after {
-    color: #00bdd6;
-    content: ',';
-    font-size: 1.5em;
-    position: absolute;
-    bottom: 0;
-    right: 0;
-  }
-  &:last-of-type {
-    &::after {
-      content: '';
-    }
-  }
-}
-
-.invocation__arg-sep {
-  align-self: flex-end;
-}
diff --git a/packages/behavior-persea/src/components/expression/key.jsx b/packages/behavior-persea/src/components/expression/key.jsx
deleted file mode 100644
index 94328de..0000000
--- a/packages/behavior-persea/src/components/expression/key.jsx
+++ /dev/null
@@ -1,140 +0,0 @@
-import './key.scss';
-
-import {join} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  PropTypes,
-  React,
-  useEffect,
-  useRef,
-  useState,
-} from '@latus/react';
-import natsort from 'natsort';
-
-const sorter = natsort({insensitive: true});
-
-const Key = ({
-  childrenDescription,
-  onChange,
-  path,
-  value,
-}) => {
-  const patch = useJsonPatcher();
-  const customizeRef = useRef();
-  const [customization, setCustomization] = useState(false);
-  const [customizationPath, setCustomizationPath] = useState('/');
-  useEffect(() => {
-    customizeRef.current?.focus();
-  });
-  const optionKeys = Object.entries(childrenDescription).map(([key]) => key);
-  if (-1 === optionKeys.indexOf(value)) {
-    optionKeys.unshift(value);
-  }
-  const options = optionKeys
-    .sort(sorter)
-    .map((key) => (
-      <option key={key} value={key}>{key}</option>
-    ));
-  const confirmCustomization = () => {
-    const parts = customizationPath.split('/');
-    parts.pop();
-    setCustomization(false);
-    setCustomizationPath('/');
-    if ('value' === parts[parts.length - 1]) {
-      patch({
-        type: 'add',
-        path: parts.join('/'),
-        value: {
-          type: 'expression',
-          ops: [
-            {
-              type: 'key',
-              key: customization,
-            },
-          ],
-        },
-      });
-    }
-    else {
-      patch({
-        type: 'add',
-        path: parts.join('/'),
-        value: {
-          type: 'key',
-        },
-      });
-      onChange(false, customization, join(parts.join('/'), 'key'));
-    }
-  };
-  return (
-    <div
-      className="key"
-    >
-      {
-        false === customization
-          ? (
-            <select
-              className="key__selector"
-              onChange={(event) => {
-                const localPath = join(path, 'key');
-                const {target: {value}} = event;
-                switch (value) {
-                  case '[key]': {
-                    setCustomization('');
-                    setCustomizationPath(localPath);
-                    break;
-                  }
-                  case '[invoke]': {
-                    const parts = localPath.split('/');
-                    parts.pop();
-                    patch({
-                      type: 'add',
-                      path: parts.join('/'),
-                      value: {
-                        type: 'invoke',
-                        args: [],
-                      },
-                    });
-                    break;
-                  }
-                  default:
-                    onChange(event, value, localPath);
-                }
-              }}
-              value={value}
-            >
-              {options}
-            </select>
-          )
-          : (
-            <input
-              type="text"
-              onBlur={confirmCustomization}
-              onChange={({target: {value}}) => {
-                setCustomization(value);
-              }}
-              onKeyPress={(event) => {
-                if ('Enter' === event.key) {
-                  confirmCustomization(event);
-                }
-              }}
-              ref={customizeRef}
-              value={customization}
-            />
-          )
-      }
-    </div>
-  );
-};
-
-Key.displayName = 'Key';
-
-Key.propTypes = {
-  childrenDescription: PropTypes.shape({}).isRequired,
-  onChange: PropTypes.func.isRequired,
-  path: PropTypes.string.isRequired,
-  value: PropTypes.string.isRequired,
-};
-
-export default Key;
diff --git a/packages/behavior-persea/src/components/expression/key.scss b/packages/behavior-persea/src/components/expression/key.scss
deleted file mode 100644
index 5cb71c6..0000000
--- a/packages/behavior-persea/src/components/expression/key.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.key__selector {
-  pointer-events: auto;
-}
diff --git a/packages/behavior-persea/src/components/expressions.jsx b/packages/behavior-persea/src/components/expressions.jsx
deleted file mode 100644
index 44a6aef..0000000
--- a/packages/behavior-persea/src/components/expressions.jsx
+++ /dev/null
@@ -1,149 +0,0 @@
-import './expressions.scss';
-
-import {join} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  PropTypes,
-  React,
-  useLatus,
-} from '@latus/react';
-
-import compile from '../../compilers/compile';
-import Expression from './expression';
-
-const Expressions = ({
-  context,
-  value: {expressions},
-  path,
-}) => {
-  const latus = useLatus();
-  const patch = useJsonPatcher();
-  const createExpressionSwapper = (l, r) => () => {
-    const le = expressions[l];
-    const re = expressions[r];
-    patch([
-      {
-        path: join(path, 'expressions', l.toString()),
-        value: re,
-      },
-      {
-        path: join(path, 'expressions', r.toString()),
-        value: le,
-      },
-    ]);
-  };
-  let currentContext = context;
-  return (
-    <div className="expressions">
-      {
-        expressions.map((expression, i) => {
-          currentContext = currentContext.clone();
-          const {ops} = expression;
-          if (3 === ops.length && 'context' === ops[0].key && 'add' === ops[1].key) {
-            const [key, value] = ops[2].args;
-            if ('undefined' !== key.type && 'undefined' !== value.type) {
-              currentContext.add(
-                compile(key, latus)(currentContext),
-                compile(value, latus)(currentContext),
-              );
-            }
-          }
-          const expressionPath = join(path, 'expressions', i.toString());
-          return (
-            <div
-              className="expressions__expression-wrapper"
-              key={expressionPath}
-            >
-              <div className="expressions__move-expression">
-                {i > 0 && (
-                  <button
-                    className="expressions__move-expression-up"
-                    onClick={createExpressionSwapper(i, i - 1)}
-                    type="button"
-                  >
-                    🠹
-                  </button>
-                )}
-                <div className="expressions__move-expression-spacer" />
-                {i < expressions.length - 1 && (
-                  <button
-                    className="expressions__move-expression-down"
-                    onClick={createExpressionSwapper(i, i + 1)}
-                    type="button"
-                  >
-                    🠻
-                  </button>
-                )}
-              </div>
-              <Expression
-                context={currentContext}
-                value={expression}
-                path={expressionPath}
-                type="void"
-              />
-              <button
-                className="expressions__remove-expression"
-                onClick={() => {
-                  patch({
-                    op: 'remove',
-                    path: expressionPath,
-                  });
-                }}
-                type="button"
-              >
-                x
-              </button>
-            </div>
-          );
-        })
-      }
-      <div className="expressions__expression-wrapper">
-        <button
-          className="expressions__add-expression"
-          onClick={() => {
-            patch({
-              op: 'add',
-              path: join(path, 'expressions/-'),
-              value: {
-                type: 'expression',
-                ops: [
-                  {
-                    type: 'key',
-                    key: 'Flow',
-                  },
-                  {
-                    type: 'key',
-                    key: 'nop',
-                  },
-                  {
-                    type: 'invoke',
-                    args: [],
-                  },
-                ],
-              },
-            });
-          }}
-          type="button"
-        >
-          Add expression
-        </button>
-      </div>
-    </div>
-  );
-};
-
-Expressions.displayName = 'Expressions';
-
-Expressions.propTypes = {
-  context: PropTypes.shape({}).isRequired,
-  value: PropTypes.shape({
-    type: PropTypes.string,
-    expressions: PropTypes.arrayOf(
-      PropTypes.shape({}),
-    ),
-  }).isRequired,
-  path: PropTypes.string.isRequired,
-};
-
-export default Expressions;
diff --git a/packages/behavior-persea/src/components/expressions.scss b/packages/behavior-persea/src/components/expressions.scss
deleted file mode 100644
index 970be1c..0000000
--- a/packages/behavior-persea/src/components/expressions.scss
+++ /dev/null
@@ -1,54 +0,0 @@
-.expressions__expression-wrapper {
-  align-items: center;
-  background-color: rgba(0, 0, 0, 0.05);
-  display: flex;
-  &:nth-of-type(2n+1) {
-    background-color: rgba(255, 255, 255, 0.05);
-  }
-  button, .button {
-    color: #00bdd6;
-  }
-}
-
-.expressions__move-expression {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  margin: 0.5em;
-}
-
-.expressions__move-expression-up,
-.expressions__move-expression-down {
-  margin: 0;
-  padding: 0 0.5em;
-  pointer-events: auto;
-}
-
-.expressions__move-expression-up
-  + .expressions__move-expression-spacer
-  + .expressions__move-expression-down {
-  margin-top: 0.5em;
-}
-
-.expressions__expression-wrapper > .expression {
-  margin-right: 0.5em;
-  padding: 0.5em;
-  width: 100%;
-}
-
-.expressions__remove-expression {
-  background-color: transparent;
-  border: none;
-  font-size: 0.8em;
-  margin-left: auto;
-  margin-right: 0.5em;
-  padding: 1em;
-  pointer-events: auto;
-}
-
-.expressions__add-expression {
-  font-size: 0.8em;
-  margin-left: 0.5em;
-  margin-right: 0.5em;
-  pointer-events: auto;
-}
diff --git a/packages/behavior-persea/src/components/help/variant.jsx b/packages/behavior-persea/src/components/help/variant.jsx
deleted file mode 100644
index d036ea0..0000000
--- a/packages/behavior-persea/src/components/help/variant.jsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import {
-  PropTypes,
-  React,
-  useLatus,
-} from '@latus/react';
-
-const Variant = (props) => {
-  const {value} = props;
-  const {type} = value;
-  const latus = useLatus();
-  const Component = latus.get('%behavior-components')[type];
-  return (
-    <Component
-      value={value}
-      // eslint-disable-next-line react/jsx-props-no-spreading
-      {...props}
-    />
-  );
-};
-
-Variant.displayName = 'Variant';
-
-Variant.propTypes = {
-  onChange: PropTypes.func.isRequired,
-  path: PropTypes.string.isRequired,
-  value: PropTypes.shape({
-    type: PropTypes.string,
-  }).isRequired,
-};
-
-export default Variant;
diff --git a/packages/behavior-persea/src/components/literal.jsx b/packages/behavior-persea/src/components/literal.jsx
deleted file mode 100644
index 0f2e3a5..0000000
--- a/packages/behavior-persea/src/components/literal.jsx
+++ /dev/null
@@ -1,263 +0,0 @@
-import './literal.scss';
-
-import {join} from 'path';
-
-import {useJsonPatcher} from '@avocado/resource-persea';
-import {
-  Rectangle,
-  Vector,
-} from '@avocado/math-persea';
-import {
-  Json,
-  Number,
-} from '@avocado/react';
-import {
-  PropTypes,
-  React,
-  useLatus,
-  useState,
-} from '@latus/react';
-
-import Context from '../../context';
-import Key from './expression/key';
-
-const Literal = ({
-  context,
-  onChange,
-  path,
-  type,
-  options,
-  value,
-  vararg,
-}) => {
-  const latus = useLatus();
-  const patch = useJsonPatcher();
-  const [selectingType, setSelectingType] = useState(false);
-  const types = latus.get('%behavior-types');
-  const setLiteralType = (type) => {
-    const value = (types[type] || types.undefined).create();
-    if (null !== value) {
-      patch({
-        op: 'replace',
-        path,
-        value,
-      });
-    }
-    setSelectingType(false);
-  };
-  // eslint-disable-next-line react/destructuring-assignment
-  const contextDescription = context.describeChildren();
-  const valueComponent = (path, type, {value}) => {
-    switch (type) {
-      case 'bool': {
-        return (
-          <select
-            onChange={(event) => {
-              onChange(event, !!event.target.value, path);
-            }}
-            value={null === value ? false : value}
-          >
-            <option value={false}>false</option>
-            <option value>true</option>
-          </select>
-        );
-      }
-      case 'number':
-        return (
-          <Number
-            onChange={(event, value) => {
-              onChange(event, value, path);
-            }}
-            value={null === value ? 0 : value}
-          />
-        );
-      case 'string':
-        return (
-          <input
-            type="text"
-            onChange={(event) => {
-              onChange(event, event.target.value, path);
-            }}
-            value={null === value ? '' : value}
-          />
-        );
-      case 'object':
-        return (
-          <Json
-            onChange={(event, value) => {
-              onChange(event, value, path);
-            }}
-            json={null === value ? {} : value}
-          />
-        );
-      case 'vector':
-        return (
-          <Vector
-            onChange={(event, value) => {
-              onChange(event, value, path);
-            }}
-            value={null === value ? [0, 0] : value}
-          />
-        );
-      case 'rectangle':
-        return (
-          <Rectangle
-            onChange={(event, value) => {
-              onChange(event, value, path);
-            }}
-            value={null === value ? [0, 0, 0, 0] : value}
-          />
-        );
-      case 'function':
-      case 'null':
-      case 'array':
-        return null;
-      default: {
-        const elements = [];
-        if ('undefined' === type || 'any' === type) {
-          elements.push(
-            <select
-              key={join(path, 'equality')}
-              onChange={({target: {value}}) => {
-                setSelectingType('≟' === value);
-              }}
-              value={selectingType ? '≟' : '='}
-            >
-              <option>=</option>
-              <option>≟</option>
-            </select>,
-          );
-        }
-        if ('undefined' !== typeof value) {
-          elements.push(
-            <div className="component" key={join(path, 'component')}>
-              {
-                valueComponent(
-                  path,
-                  Context.descriptionFor(undefined, value, latus).type,
-                  {value},
-                )
-              }
-            </div>,
-          );
-        }
-        return <>{elements}</>;
-      }
-    }
-  };
-  const {type: inferred} = Context.descriptionFor(undefined, value.value, latus);
-  const typeKey = `[literal ${inferred}]`;
-  return (
-    <>
-      {
-        selectingType
-          ? (
-            <select
-              onChange={({target: {value}}) => {
-                setLiteralType(value);
-              }}
-            >
-              <option>- Select type -</option>
-              {
-                Object.entries(types)
-                  .filter(([type, value]) => value.create && type)
-                  .map(([type]) => type)
-                  .map((type) => <option key={type} value={type}>{type}</option>)
-              }
-            </select>
-          )
-          : (
-            <Key
-              childrenDescription={{
-                ...(
-                  'undefined' === type
-                    ? {'.': {label: '', type: 'undefined'}}
-                    : {}
-                ),
-                ...(
-                  vararg
-                    ? {'...': {label: '', type: 'undefined'}}
-                    : {}
-                ),
-                [typeKey]: {label: '', type: value.type},
-                ...contextDescription.children,
-                '[key]': {label: '', type: value.type},
-              }}
-              onChange={(event, value) => {
-                if ('.' === value || '...' === value) {
-                  patch({
-                    op: 'remove',
-                    path,
-                  });
-                  return;
-                }
-                patch({
-                  op: 'replace',
-                  path,
-                  value: {
-                    type: 'expression',
-                    ops: [
-                      {
-                        type: 'key',
-                        key: value,
-                      },
-                    ],
-                  },
-                });
-              }}
-              path={path}
-              value={typeKey}
-            />
-          )
-      }
-      <div className="literal">
-        {
-          options.length > 0
-            ? (
-              <select
-                onChange={(event) => {
-                  onChange(event, options[event.target.value].value, join(path, 'value'));
-                }}
-                value={options.findIndex(({value: optionValue}) => value.value === optionValue)}
-              >
-                {
-                  Object.entries(options)
-                    .map(([key, {label}]) => (
-                      <option
-                        key={label}
-                        value={key}
-                      >
-                        {label}
-                      </option>
-                    ))
-                }
-              </select>
-            )
-            : valueComponent(join(path, 'value'), type, value)
-        }
-      </div>
-    </>
-  );
-};
-
-Literal.defaultProps = {
-  options: [],
-  vararg: false,
-};
-
-Literal.displayName = 'Literal';
-
-Literal.propTypes = {
-  context: PropTypes.shape({
-    describeChildren: PropTypes.func,
-  }).isRequired,
-  type: PropTypes.string.isRequired,
-  onChange: PropTypes.func.isRequired,
-  options: PropTypes.arrayOf(PropTypes.any),
-  path: PropTypes.string.isRequired,
-  // eslint-disable-next-line react/forbid-prop-types
-  value: PropTypes.any.isRequired,
-  vararg: PropTypes.bool,
-};
-
-export default Literal;
diff --git a/packages/behavior-persea/src/components/literal.scss b/packages/behavior-persea/src/components/literal.scss
deleted file mode 100644
index 8c159db..0000000
--- a/packages/behavior-persea/src/components/literal.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.literal {
-  align-items: center;
-  display: flex;
-  pointer-events: auto;
-}