Fixing unarchive/archive error in bindValues

Author: Ghnuberath

src/components/search-bar.jsx

@@ -467,10 +467,7 @@ export class SearchBar extends Component {
         editing: this.state.tokenValues,
         tokenValues: [...this.state.tokenValues.slice(0, idx), ...this.state.tokenValues.slice(idx + 1)]
       });
-      this.state.activeMachine.bindValues(toEdit.value).then(() => {
-        // hack to push the current value back into the archive when editing starts in the multivalue case
-        if (this.state.activeMachine.state.isMultivalue) this.state.activeMachine.archive(true);
-      });
+      this.state.activeMachine.bindValues(toEdit.value, false, true);
     } else if (this.state.active) {
       this.setState({
         flashActive: false

src/lib/token-state-machine.js

@@ -55,8 +55,9 @@ export class TokenStateMachine extends EventEmitter {
    *
    * @param {Object | undefined} values - A optional array of (boxed) values to apply to the machine's states (applied from the root state onward). If any value is an array, all but the final value are added to the `State` archive.
    * @param {boolean} finalTransition - Whether or not to apply the final transition.
+   * @param {boolean} editing - Whether or not the token we're binding to is being edited.
    */
-  async bindValues (values, finalTransition = false) {
+  async bindValues (values, finalTransition = false, editing = false) {
     try {
       // bind to states
       if (values !== undefined) {
@@ -65,6 +66,7 @@ export class TokenStateMachine extends EventEmitter {
         delete copy.actionValues; // we don't need actionValues in copy.
         while (Object.keys(copy).length > 0) {
           const v = copy[this.state.vkey];
+          this.state.reset();
           if (v === undefined) {
             await this.state.doInitialize(this.boxedValue);
             break; // we're missing a value for the current state, so break out.
@@ -78,7 +80,9 @@ export class TokenStateMachine extends EventEmitter {
               this.state.value = x;
               this.state.archiveValue(this.boxedValue, true);
             }
-            this.state.unarchiveValue(); // make the last value the "active" one
+            if (!editing) {
+              this.state.unarchiveValue(); // make the last value the "active" one
+            }
           } else {
             await this.state.doInitialize(this.boxedValue, [this.state.unboxValue(v)]);
             this.state.value = v;

src/style/lex.scss

@@ -83,6 +83,9 @@ div.lex-box div.token, ul.entered-values li.entered-value {
 
   &.active {
     padding: $lex-token-padding ($lex-token-padding + 16px) $lex-token-padding ($lex-token-padding + 2px);
+    .token-input {
+      cursor: text;
+    }
   }
 
   &.editing {