@vuu-ui/vuu-ui-controls 0.13.37 → 0.13.39

package/cjs/time-input/MaskedInput.js

@@ -299,6 +299,7 @@ class MaskedInput extends vuuUtils.EventEmitter {
     if (__privateGet(this, _input)) {
       const { cursorPos } = this;
       if (cursorPos < 8) {
+        const originalValue = __privateGet(this, _value);
         const newValue = __privateGet(this, _value).split("").toSpliced(cursorPos, 1, key).join("");
         this.setValue(newValue);
         if (!vuuUtils.isValidTimeString(newValue)) {
@@ -308,7 +309,9 @@ class MaskedInput extends vuuUtils.EventEmitter {
           }
         } else {
           __privateGet(this, _input).classList.remove("invalid");
-          if (!__privateGet(this, _controlled)) {
+          if (__privateGet(this, _controlled) && newValue === originalValue) {
+            this.advanceSelection();
+          } else if (!__privateGet(this, _controlled)) {
             this.advanceSelection();
           }
         }

package/cjs/time-input/MaskedInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"MaskedInput.js","sources":["../../../../packages/vuu-ui-controls/src/time-input/MaskedInput.ts"],"sourcesContent":["import {\n  createSyntheticEvent,\n  decrementTimeUnitValue,\n  EventEmitter,\n  Hours,\n  incrementTimeUnitValue,\n  isValidTimeString,\n  Minutes,\n  Seconds,\n  TimeString,\n  TimeUnit,\n  TimeUnitValue,\n  updateTimeString,\n  zeroTime,\n  zeroTimeUnit,\n} from \"@vuu-ui/vuu-utils\";\nimport { ChangeEventHandler } from \"react\";\n\nexport type Digit = \"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\";\n\ntype NullSelection = {\n  end: null;\n  start: null;\n};\ntype Selection =\n  | {\n      end: number;\n      start: number;\n    }\n  | NullSelection;\n\nconst NullSelection: NullSelection = { end: null, start: null };\nconst FullSelection: Selection = { end: 0, start: 8 };\nconst CursorAtEnd: Selection = { end: 8, start: 8 };\n\nexport type MaskedInputEvents = {\n  change: ChangeEventHandler<HTMLInputElement>;\n};\n\nexport class MaskedInput extends EventEmitter<MaskedInputEvents> {\n  #controlled = false;\n  #input: HTMLInputElement | null = null;\n  #isFocused = false;\n  #isIncrementalChange = false;\n  #selectionStart = -1;\n  #selectionEnd = -1;\n  #value;\n  #unitSelected?: TimeUnit;\n  #halfUnitSelected?: TimeUnit;\n\n  constructor(\n    defaultValue: TimeString | undefined,\n    inputEl: HTMLInputElement | null = null,\n  ) {\n    super();\n    if (inputEl) {\n      this.input = inputEl;\n    }\n    this.#value = defaultValue ?? zeroTime;\n  }\n\n  set input(el: HTMLInputElement) {\n    if (this.#input) {\n      throw Error(\n        \"MaskedInput cannot be reused, create a new instance for a new input\",\n      );\n    }\n    this.#input = el;\n    el.addEventListener(\"change\", this.emitSyntheticChangeEvent);\n  }\n\n  /**\n   * The change event is fired programatically. This will only be handled\n   * by a native event handler ( not a React handler). We handle this event\n   * and convert to a React (Synthetic) event.\n   */\n  private emitSyntheticChangeEvent = (e: Event) => {\n    const syntheticEvent = createSyntheticEvent(\n      e,\n    ) as React.ChangeEvent<HTMLInputElement>;\n\n    this.emit(\"change\", syntheticEvent);\n  };\n\n  get cursorPos() {\n    return this.selectionStart;\n  }\n  set cursorPos(value: number) {\n    this.selectionStart = value;\n    this.selectionEnd = value;\n    if (this.#input) {\n      this.#input.setSelectionRange(value, value);\n    }\n  }\n\n  get isFocused() {\n    return this.#isFocused;\n  }\n\n  get selectionStart() {\n    return this.#selectionStart;\n  }\n  set selectionStart(value: number) {\n    this.#selectionStart = value;\n  }\n\n  get selectionEnd() {\n    return this.#selectionEnd;\n  }\n  set selectionEnd(value: number) {\n    this.#selectionEnd = value;\n  }\n\n  private setValue(value: TimeString) {\n    if (!this.#controlled) {\n      this.#isIncrementalChange = false;\n      this.#value = value;\n    }\n\n    if (this.#input) {\n      // HM this updateds the input value, even if we are controlled.\n      // Thats not right, but if we don't update it, the event will\n      // not carry thwe right value. I don;t thibnk we can simulate\n      // the correct behaviour\n      this.#input.value = value;\n      // this triggers the native change event, which we convert\n      // // to synthetic event and emit in input setter above\n      this.#input.dispatchEvent(\n        new Event(\"change\", {\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    }\n  }\n\n  private setUnitValue(unit: TimeUnit, value: Hours | Minutes | Seconds) {\n    const newTimeString = updateTimeString(this.#value, unit, value);\n    this.setValue(newTimeString);\n  }\n\n  private getUnitValue<T extends TimeUnit>(unit: T): TimeUnitValue<T> {\n    switch (unit) {\n      case \"hours\":\n        return this.#value.slice(0, 2) as TimeUnitValue<T>;\n      case \"minutes\":\n        return this.#value.slice(3, 5) as TimeUnitValue<T>;\n      case \"seconds\":\n        return this.#value.slice(6, 8) as TimeUnitValue<T>;\n      default:\n        throw Error(`[MaskedInout] invalue unit ${unit}`);\n    }\n  }\n\n  get value() {\n    return this.#value;\n  }\n\n  /**\n   * Setting the value this way invokes 'controlled' mode\n   */\n  set value(value: TimeString) {\n    this.#controlled = true;\n    this.#value = value;\n    if (this.isFocused) {\n      const isIncremental = this.#isIncrementalChange;\n      this.#isIncrementalChange = false;\n\n      requestAnimationFrame(() => {\n        if (isIncremental) {\n          this.restoreSelection();\n        } else {\n          this.advanceSelection();\n        }\n      });\n    }\n  }\n\n  clear(unit: TimeUnit) {\n    if (this.#input) {\n      let newValue = this.#value;\n      if (unit === \"hours\") {\n        newValue = zeroTimeUnit.concat(this.#value.slice(2)) as TimeString;\n      } else if (unit === \"minutes\") {\n        newValue = this.#value\n          .slice(0, 3)\n          .concat(zeroTimeUnit)\n          .concat(this.#value.slice(5)) as TimeString;\n      } else if (unit === \"seconds\") {\n        newValue = this.#value.slice(0, 6).concat(zeroTimeUnit) as TimeString;\n      }\n      if (newValue !== this.#value) {\n        this.setValue(newValue);\n      }\n    }\n  }\n\n  select(unit: TimeUnit, halfUnit = false) {\n    if (this.#input) {\n      const offset = halfUnit ? 1 : 0;\n      if (unit === \"hours\") {\n        this.selectionStart = this.#input.selectionStart = 0 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 2;\n      } else if (unit === \"minutes\") {\n        this.selectionStart = this.#input.selectionStart = 3 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 5;\n      } else if (unit === \"seconds\") {\n        this.selectionStart = this.#input.selectionStart = 6 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 8;\n      }\n      this.#input.setSelectionRange(this.selectionStart, this.selectionEnd);\n      if (halfUnit) {\n        this.#halfUnitSelected = unit;\n        this.#unitSelected = undefined;\n      } else {\n        this.#halfUnitSelected = undefined;\n        this.#unitSelected = unit;\n      }\n    }\n  }\n\n  removeSelection() {\n    this.#selectionStart = this.selectionEnd = 8;\n    this.#unitSelected = undefined;\n    this.#halfUnitSelected = undefined;\n  }\n\n  restoreSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected);\n    }\n  }\n\n  advanceSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected, true);\n    } else if (this.#halfUnitSelected === \"hours\") {\n      this.select(\"minutes\");\n    } else if (this.#halfUnitSelected === \"minutes\") {\n      this.select(\"seconds\");\n    } else if (this.#halfUnitSelected === \"seconds\") {\n      this.select(\"seconds\");\n    } else {\n      throw Error(\"unreachable code, in theory\");\n    }\n  }\n\n  moveFocus(direction: \"left\" | \"right\") {\n    if (direction === \"right\") {\n      if (\n        this.#unitSelected === \"hours\" ||\n        this.#halfUnitSelected === \"hours\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"seconds\");\n      }\n    } else {\n      if (\n        this.#unitSelected === \"seconds\" ||\n        this.#halfUnitSelected === \"seconds\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"hours\");\n      } else {\n        const selection = this.getSelection();\n        if (selection === CursorAtEnd) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n  }\n\n  pasteValue(value: TimeString) {\n    this.#halfUnitSelected = undefined;\n    this.#unitSelected = undefined;\n    this.#value = value;\n  }\n\n  private getUnitAtCursorPos(cursorPos = this.cursorPos): TimeUnit {\n    if (cursorPos >= 0 && cursorPos < 3) {\n      return \"hours\";\n    } else if (cursorPos < 6) {\n      return \"minutes\";\n    } else if (cursorPos <= 8) {\n      return \"seconds\";\n    } else {\n      throw Error(\n        `[MaskedInput] getUnitAtCursorPos invalid cursor position ${cursorPos}`,\n      );\n    }\n  }\n\n  incrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = incrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  decrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = decrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  backspace() {\n    if (this.#input) {\n      const { cursorPos } = this;\n\n      if (this.#unitSelected === \"seconds\") {\n        this.clear(\"seconds\");\n        this.select(\"minutes\");\n      } else if (this.#unitSelected === \"minutes\") {\n        this.clear(\"minutes\");\n        this.select(\"hours\");\n      } else if (this.#unitSelected === \"hours\") {\n        this.clear(\"hours\");\n        this.select(\"hours\");\n      } else {\n        if (cursorPos > 0) {\n          const offset =\n            this.selectionStart === 6 || this.selectionStart === 3 ? 2 : 1;\n          const newValue = this.#value\n            .slice(0, cursorPos - offset)\n            .concat(zeroTime.slice(cursorPos - offset, cursorPos))\n            .concat(this.#value.slice(cursorPos)) as TimeString;\n          this.selectionStart -= offset;\n          this.selectionEnd -= offset;\n          this.setValue(newValue);\n\n          requestAnimationFrame(() => {\n            this.#input?.setSelectionRange(\n              this.#selectionStart,\n              this.selectionEnd,\n            );\n          });\n        }\n      }\n    }\n  }\n\n  update(key: Digit) {\n    if (this.#input) {\n      const { cursorPos } = this;\n      if (cursorPos < 8) {\n        const newValue = this.#value\n          .split(\"\")\n          .toSpliced(cursorPos, 1, key)\n          .join(\"\") as TimeString;\n\n        this.setValue(newValue);\n\n        if (!isValidTimeString(newValue)) {\n          if (this.#unitSelected) {\n            this.select(this.#unitSelected);\n            this.#input.classList.add(\"invalid\");\n          }\n        } else {\n          this.#input.classList.remove(\"invalid\");\n\n          if (!this.#controlled) {\n            this.advanceSelection();\n          }\n        }\n      }\n    }\n  }\n\n  private getSelection(): Selection {\n    if (this.#input) {\n      const { selectionEnd, selectionStart } = this.#input;\n      if (selectionEnd === null || selectionStart === null) {\n        return NullSelection;\n      } else if (selectionStart === 0 && selectionEnd === 8) {\n        return FullSelection;\n      } else if (selectionStart === 8 && selectionEnd === 8) {\n        return CursorAtEnd;\n      } else {\n        return {\n          end: selectionEnd,\n          start: selectionStart,\n        };\n      }\n    } else {\n      throw Error(`[MasketInput] selection referenced, but no input`);\n    }\n  }\n\n  click() {\n    if (this.#input) {\n      this.#isFocused = true;\n      const selection = this.getSelection();\n      if (selection === NullSelection) {\n        this.select(\"hours\");\n      } else if (selection === FullSelection) {\n        // do nothing\n      } else {\n        const cursorPos = this.#input.selectionStart ?? 0;\n        this.select(this.getUnitAtCursorPos(cursorPos));\n      }\n    }\n  }\n  doubleClick() {\n    if (this.#input) {\n      const { selectionStart, selectionEnd } = this.#input;\n      if (selectionStart === null || selectionEnd === null) {\n        // do nothing\n      } else {\n        if (selectionStart < 3) {\n          this.select(\"hours\");\n        } else if (selectionStart < 6) {\n          this.select(\"minutes\");\n        } else if (selectionStart <= 8) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n    // }\n  }\n\n  focus = () => {\n    if (this.#input) {\n      this.#isFocused = true;\n\n      requestAnimationFrame(() => {\n        this.select(\"hours\");\n        setTimeout(() => {\n          if (this.#input?.selectionStart !== 0) {\n            this.select(\"hours\");\n          }\n        }, 200);\n      });\n    }\n  };\n\n  blur = () => {\n    this.removeSelection();\n    this.#isFocused = false;\n  };\n}\n"],"names":["EventEmitter","createSyntheticEvent","zeroTime","updateTimeString","zeroTimeUnit","incrementTimeUnitValue","decrementTimeUnitValue","isValidTimeString"],"mappings":"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"}
+{"version":3,"file":"MaskedInput.js","sources":["../../../../packages/vuu-ui-controls/src/time-input/MaskedInput.ts"],"sourcesContent":["import {\n  createSyntheticEvent,\n  decrementTimeUnitValue,\n  EventEmitter,\n  Hours,\n  incrementTimeUnitValue,\n  isValidTimeString,\n  Minutes,\n  Seconds,\n  TimeString,\n  TimeUnit,\n  TimeUnitValue,\n  updateTimeString,\n  zeroTime,\n  zeroTimeUnit,\n} from \"@vuu-ui/vuu-utils\";\nimport { ChangeEventHandler } from \"react\";\n\nexport type Digit = \"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\";\n\ntype NullSelection = {\n  end: null;\n  start: null;\n};\ntype Selection =\n  | {\n      end: number;\n      start: number;\n    }\n  | NullSelection;\n\nconst NullSelection: NullSelection = { end: null, start: null };\nconst FullSelection: Selection = { end: 0, start: 8 };\nconst CursorAtEnd: Selection = { end: 8, start: 8 };\n\nexport type MaskedInputEvents = {\n  change: ChangeEventHandler<HTMLInputElement>;\n};\n\nexport class MaskedInput extends EventEmitter<MaskedInputEvents> {\n  #controlled = false;\n  #input: HTMLInputElement | null = null;\n  #isFocused = false;\n  #isIncrementalChange = false;\n  #selectionStart = -1;\n  #selectionEnd = -1;\n  #value;\n  #unitSelected?: TimeUnit;\n  #halfUnitSelected?: TimeUnit;\n\n  constructor(\n    defaultValue: TimeString | undefined,\n    inputEl: HTMLInputElement | null = null,\n  ) {\n    super();\n    if (inputEl) {\n      this.input = inputEl;\n    }\n    this.#value = defaultValue ?? zeroTime;\n  }\n\n  set input(el: HTMLInputElement) {\n    if (this.#input) {\n      throw Error(\n        \"MaskedInput cannot be reused, create a new instance for a new input\",\n      );\n    }\n    this.#input = el;\n    el.addEventListener(\"change\", this.emitSyntheticChangeEvent);\n  }\n\n  /**\n   * The change event is fired programatically. This will only be handled\n   * by a native event handler ( not a React handler). We handle this event\n   * and convert to a React (Synthetic) event.\n   */\n  private emitSyntheticChangeEvent = (e: Event) => {\n    const syntheticEvent = createSyntheticEvent(\n      e,\n    ) as React.ChangeEvent<HTMLInputElement>;\n\n    this.emit(\"change\", syntheticEvent);\n  };\n\n  get cursorPos() {\n    return this.selectionStart;\n  }\n  set cursorPos(value: number) {\n    this.selectionStart = value;\n    this.selectionEnd = value;\n    if (this.#input) {\n      this.#input.setSelectionRange(value, value);\n    }\n  }\n\n  get isFocused() {\n    return this.#isFocused;\n  }\n\n  get selectionStart() {\n    return this.#selectionStart;\n  }\n  set selectionStart(value: number) {\n    this.#selectionStart = value;\n  }\n\n  get selectionEnd() {\n    return this.#selectionEnd;\n  }\n  set selectionEnd(value: number) {\n    this.#selectionEnd = value;\n  }\n\n  private setValue(value: TimeString) {\n    if (!this.#controlled) {\n      this.#isIncrementalChange = false;\n      this.#value = value;\n    }\n\n    if (this.#input) {\n      // HM this updateds the input value, even if we are controlled.\n      // Thats not right, but if we don't update it, the event will\n      // not carry thwe right value. I don;t thibnk we can simulate\n      // the correct behaviour\n      this.#input.value = value;\n      // this triggers the native change event, which we convert\n      // // to synthetic event and emit in input setter above\n      this.#input.dispatchEvent(\n        new Event(\"change\", {\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    }\n  }\n\n  private setUnitValue(unit: TimeUnit, value: Hours | Minutes | Seconds) {\n    const newTimeString = updateTimeString(this.#value, unit, value);\n    this.setValue(newTimeString);\n  }\n\n  private getUnitValue<T extends TimeUnit>(unit: T): TimeUnitValue<T> {\n    switch (unit) {\n      case \"hours\":\n        return this.#value.slice(0, 2) as TimeUnitValue<T>;\n      case \"minutes\":\n        return this.#value.slice(3, 5) as TimeUnitValue<T>;\n      case \"seconds\":\n        return this.#value.slice(6, 8) as TimeUnitValue<T>;\n      default:\n        throw Error(`[MaskedInout] invalue unit ${unit}`);\n    }\n  }\n\n  get value() {\n    return this.#value;\n  }\n\n  /**\n   * Setting the value this way invokes 'controlled' mode\n   */\n  set value(value: TimeString) {\n    this.#controlled = true;\n    this.#value = value;\n    if (this.isFocused) {\n      const isIncremental = this.#isIncrementalChange;\n      this.#isIncrementalChange = false;\n\n      requestAnimationFrame(() => {\n        if (isIncremental) {\n          this.restoreSelection();\n        } else {\n          this.advanceSelection();\n        }\n      });\n    }\n  }\n\n  clear(unit: TimeUnit) {\n    if (this.#input) {\n      let newValue = this.#value;\n      if (unit === \"hours\") {\n        newValue = zeroTimeUnit.concat(this.#value.slice(2)) as TimeString;\n      } else if (unit === \"minutes\") {\n        newValue = this.#value\n          .slice(0, 3)\n          .concat(zeroTimeUnit)\n          .concat(this.#value.slice(5)) as TimeString;\n      } else if (unit === \"seconds\") {\n        newValue = this.#value.slice(0, 6).concat(zeroTimeUnit) as TimeString;\n      }\n      if (newValue !== this.#value) {\n        this.setValue(newValue);\n      }\n    }\n  }\n\n  select(unit: TimeUnit, halfUnit = false) {\n    if (this.#input) {\n      const offset = halfUnit ? 1 : 0;\n      if (unit === \"hours\") {\n        this.selectionStart = this.#input.selectionStart = 0 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 2;\n      } else if (unit === \"minutes\") {\n        this.selectionStart = this.#input.selectionStart = 3 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 5;\n      } else if (unit === \"seconds\") {\n        this.selectionStart = this.#input.selectionStart = 6 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 8;\n      }\n      this.#input.setSelectionRange(this.selectionStart, this.selectionEnd);\n      if (halfUnit) {\n        this.#halfUnitSelected = unit;\n        this.#unitSelected = undefined;\n      } else {\n        this.#halfUnitSelected = undefined;\n        this.#unitSelected = unit;\n      }\n    }\n  }\n\n  removeSelection() {\n    this.#selectionStart = this.selectionEnd = 8;\n    this.#unitSelected = undefined;\n    this.#halfUnitSelected = undefined;\n  }\n\n  restoreSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected);\n    }\n  }\n\n  advanceSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected, true);\n    } else if (this.#halfUnitSelected === \"hours\") {\n      this.select(\"minutes\");\n    } else if (this.#halfUnitSelected === \"minutes\") {\n      this.select(\"seconds\");\n    } else if (this.#halfUnitSelected === \"seconds\") {\n      this.select(\"seconds\");\n    } else {\n      throw Error(\"unreachable code, in theory\");\n    }\n  }\n\n  moveFocus(direction: \"left\" | \"right\") {\n    if (direction === \"right\") {\n      if (\n        this.#unitSelected === \"hours\" ||\n        this.#halfUnitSelected === \"hours\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"seconds\");\n      }\n    } else {\n      if (\n        this.#unitSelected === \"seconds\" ||\n        this.#halfUnitSelected === \"seconds\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"hours\");\n      } else {\n        const selection = this.getSelection();\n        if (selection === CursorAtEnd) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n  }\n\n  pasteValue(value: TimeString) {\n    this.#halfUnitSelected = undefined;\n    this.#unitSelected = undefined;\n    this.#value = value;\n  }\n\n  private getUnitAtCursorPos(cursorPos = this.cursorPos): TimeUnit {\n    if (cursorPos >= 0 && cursorPos < 3) {\n      return \"hours\";\n    } else if (cursorPos < 6) {\n      return \"minutes\";\n    } else if (cursorPos <= 8) {\n      return \"seconds\";\n    } else {\n      throw Error(\n        `[MaskedInput] getUnitAtCursorPos invalid cursor position ${cursorPos}`,\n      );\n    }\n  }\n\n  incrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = incrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  decrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = decrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  backspace() {\n    if (this.#input) {\n      const { cursorPos } = this;\n\n      if (this.#unitSelected === \"seconds\") {\n        this.clear(\"seconds\");\n        this.select(\"minutes\");\n      } else if (this.#unitSelected === \"minutes\") {\n        this.clear(\"minutes\");\n        this.select(\"hours\");\n      } else if (this.#unitSelected === \"hours\") {\n        this.clear(\"hours\");\n        this.select(\"hours\");\n      } else {\n        if (cursorPos > 0) {\n          const offset =\n            this.selectionStart === 6 || this.selectionStart === 3 ? 2 : 1;\n          const newValue = this.#value\n            .slice(0, cursorPos - offset)\n            .concat(zeroTime.slice(cursorPos - offset, cursorPos))\n            .concat(this.#value.slice(cursorPos)) as TimeString;\n          this.selectionStart -= offset;\n          this.selectionEnd -= offset;\n          this.setValue(newValue);\n\n          requestAnimationFrame(() => {\n            this.#input?.setSelectionRange(\n              this.#selectionStart,\n              this.selectionEnd,\n            );\n          });\n        }\n      }\n    }\n  }\n\n  update(key: Digit) {\n    if (this.#input) {\n      const { cursorPos } = this;\n      if (cursorPos < 8) {\n        const originalValue = this.#value;\n        const newValue = this.#value\n          .split(\"\")\n          .toSpliced(cursorPos, 1, key)\n          .join(\"\") as TimeString;\n\n        this.setValue(newValue);\n\n        if (!isValidTimeString(newValue)) {\n          if (this.#unitSelected) {\n            this.select(this.#unitSelected);\n            this.#input.classList.add(\"invalid\");\n          }\n        } else {\n          this.#input.classList.remove(\"invalid\");\n\n          if (this.#controlled && newValue === originalValue) {\n            // Special case - user has overtyped a digit with same digit,\n            // value has not changed, so will not be set, which would normally\n            // trigger advance in controlled mode. Advance so next digit\n            // typed will be in correct position\n            this.advanceSelection();\n          } else if (!this.#controlled) {\n            this.advanceSelection();\n          }\n        }\n      }\n    }\n  }\n\n  private getSelection(): Selection {\n    if (this.#input) {\n      const { selectionEnd, selectionStart } = this.#input;\n      if (selectionEnd === null || selectionStart === null) {\n        return NullSelection;\n      } else if (selectionStart === 0 && selectionEnd === 8) {\n        return FullSelection;\n      } else if (selectionStart === 8 && selectionEnd === 8) {\n        return CursorAtEnd;\n      } else {\n        return {\n          end: selectionEnd,\n          start: selectionStart,\n        };\n      }\n    } else {\n      throw Error(`[MasketInput] selection referenced, but no input`);\n    }\n  }\n\n  click() {\n    if (this.#input) {\n      this.#isFocused = true;\n      const selection = this.getSelection();\n      if (selection === NullSelection) {\n        this.select(\"hours\");\n      } else if (selection === FullSelection) {\n        // do nothing\n      } else {\n        const cursorPos = this.#input.selectionStart ?? 0;\n        this.select(this.getUnitAtCursorPos(cursorPos));\n      }\n    }\n  }\n  doubleClick() {\n    if (this.#input) {\n      const { selectionStart, selectionEnd } = this.#input;\n      if (selectionStart === null || selectionEnd === null) {\n        // do nothing\n      } else {\n        if (selectionStart < 3) {\n          this.select(\"hours\");\n        } else if (selectionStart < 6) {\n          this.select(\"minutes\");\n        } else if (selectionStart <= 8) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n    // }\n  }\n\n  focus = () => {\n    if (this.#input) {\n      this.#isFocused = true;\n\n      requestAnimationFrame(() => {\n        this.select(\"hours\");\n        setTimeout(() => {\n          if (this.#input?.selectionStart !== 0) {\n            this.select(\"hours\");\n          }\n        }, 200);\n      });\n    }\n  };\n\n  blur = () => {\n    this.removeSelection();\n    this.#isFocused = false;\n  };\n}\n"],"names":["EventEmitter","createSyntheticEvent","zeroTime","updateTimeString","zeroTimeUnit","incrementTimeUnitValue","decrementTimeUnitValue","isValidTimeString"],"mappings":"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"}

package/cjs/time-input/TimeInput.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var timeInputCss = ".salt-density-high .vuuTimeInput {\n    --time-input-width: 60px;\n}\n.salt-density-medium .vuuTimeInput {\n    --time-input-width: 70px;\n}\n.salt-density-low .vuuTimeInput {\n    --time-input-width: 80px;\n}\n.salt-density-touch .vuuTimeInput {\n    --time-input-width: 90px;\n}\n\n.vuuTimeInput {\n    border-width: 1px;\n    font-family: var(--salt-typography-fontFamily);\n    width: var(--vuuTimeInput-width, var(--time-input-width));\n\n    &:focus::-webkit-input-placeholder {\n        color: transparent;\n    }\n\n}\n\n.invalid {\n    border-color: red;\n}\n\n";
+var timeInputCss = ".salt-density-high .vuuTimeInput {\n    --time-input-width: 60px;\n}\n.salt-density-medium .vuuTimeInput {\n    --time-input-width: 70px;\n}\n.salt-density-low .vuuTimeInput {\n    --time-input-width: 80px;\n}\n.salt-density-touch .vuuTimeInput {\n    --time-input-width: 90px;\n}\n\n.vuuTimeInput {\n    background: var(--vuuTimeInput-background, inherit);\n    border-width: 1px;\n    font-family: var(--salt-typography-fontFamily);\n    width: var(--vuuTimeInput-width, var(--time-input-width));\n\n    &:focus::-webkit-input-placeholder {\n        color: transparent;\n    }\n\n}\n\n.invalid {\n    border-color: red;\n}\n\n";
 
 module.exports = timeInputCss;
 //# sourceMappingURL=TimeInput.css.js.map

package/cjs/vuu-typeahead-input/useVuuTypeaheadInput.js

@@ -79,20 +79,23 @@ const useVuuTypeaheadInput = ({
       }
     }
   }, [table, column, getSuggestions, value, NO_FREE_TEXT]);
-  const handleChange = (evt) => {
-    const { value: newValue } = evt.target;
-    const { current: value2 } = valueRef;
-    if (value2 === "" && newValue) {
-      setOpen(true);
-      const input = rootRef.current?.querySelector("input");
-      if (input && highlightFirstSuggestion) {
-        pendingListFocusRef.current = true;
+  const handleChange = React.useCallback(
+    (evt) => {
+      const { value: newValue } = evt.target;
+      const { current: value2 } = valueRef;
+      if (value2 === "" && newValue) {
+        setOpen(true);
+        const input = rootRef.current?.querySelector("input");
+        if (input && highlightFirstSuggestion) {
+          pendingListFocusRef.current = true;
+        }
+      } else if (newValue === "" && value2) {
+        onCommit(evt, "");
       }
-    } else if (newValue === "" && value2) {
-      onCommit(evt, "");
-    }
-    setValue(newValue);
-  };
+      setValue(newValue);
+    },
+    [highlightFirstSuggestion, onCommit, setValue, valueRef]
+  );
   const handleSelectionChange = (evt, [newSelected]) => {
     if (commitTimeout.current) {
       clearTimeout(commitTimeout.current);

package/cjs/vuu-typeahead-input/useVuuTypeaheadInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../../../packages/vuu-ui-controls/src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n  const commitTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          commitTimeout.current = setTimeout(() => {\n            onCommit?.(evt, value, \"text-input\");\n            setOpen(false);\n            commitTimeout.current = null;\n          }, 200);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                //TODO this is failing to work correctly in new version of cypress\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n    const { value: newValue } = evt.target;\n    const { current: value } = valueRef;\n    if (value === \"\" && newValue) {\n      setOpen(true);\n      const input = rootRef.current?.querySelector(\"input\");\n      if (input && highlightFirstSuggestion) {\n        pendingListFocusRef.current = true;\n      }\n    } else if (newValue === \"\" && value) {\n      // treat clear value as a commit event\n      onCommit(evt, \"\");\n    }\n    setValue(newValue);\n  };\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    if (commitTimeout.current) {\n      clearTimeout(commitTimeout.current);\n      commitTimeout.current = null;\n    }\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["useMemo","useStateRef","useState","useRef","useTypeaheadSuggestions","useCallback","value","useEffect","getVuuTable","NO_DATA_MATCH","dispatchKeyboardEvent"],"mappings":"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"}
+{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../../../packages/vuu-ui-controls/src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n  const commitTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          commitTimeout.current = setTimeout(() => {\n            onCommit?.(evt, value, \"text-input\");\n            setOpen(false);\n            commitTimeout.current = null;\n          }, 200);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                //TODO this is failing to work correctly in new version of cypress\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n    (evt) => {\n      const { value: newValue } = evt.target;\n      const { current: value } = valueRef;\n      if (value === \"\" && newValue) {\n        setOpen(true);\n        const input = rootRef.current?.querySelector(\"input\");\n        if (input && highlightFirstSuggestion) {\n          pendingListFocusRef.current = true;\n        }\n      } else if (newValue === \"\" && value) {\n        // treat clear value as a commit event\n        onCommit(evt, \"\");\n      }\n      setValue(newValue);\n    },\n    [highlightFirstSuggestion, onCommit, setValue, valueRef],\n  );\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    if (commitTimeout.current) {\n      clearTimeout(commitTimeout.current);\n      commitTimeout.current = null;\n    }\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["useMemo","useStateRef","useState","useRef","useTypeaheadSuggestions","useCallback","value","useEffect","getVuuTable","NO_DATA_MATCH","dispatchKeyboardEvent"],"mappings":"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"}

package/esm/time-input/MaskedInput.js

@@ -297,6 +297,7 @@ class MaskedInput extends EventEmitter {
     if (__privateGet(this, _input)) {
       const { cursorPos } = this;
       if (cursorPos < 8) {
+        const originalValue = __privateGet(this, _value);
         const newValue = __privateGet(this, _value).split("").toSpliced(cursorPos, 1, key).join("");
         this.setValue(newValue);
         if (!isValidTimeString(newValue)) {
@@ -306,7 +307,9 @@ class MaskedInput extends EventEmitter {
           }
         } else {
           __privateGet(this, _input).classList.remove("invalid");
-          if (!__privateGet(this, _controlled)) {
+          if (__privateGet(this, _controlled) && newValue === originalValue) {
+            this.advanceSelection();
+          } else if (!__privateGet(this, _controlled)) {
             this.advanceSelection();
           }
         }

package/esm/time-input/MaskedInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"MaskedInput.js","sources":["../../../../packages/vuu-ui-controls/src/time-input/MaskedInput.ts"],"sourcesContent":["import {\n  createSyntheticEvent,\n  decrementTimeUnitValue,\n  EventEmitter,\n  Hours,\n  incrementTimeUnitValue,\n  isValidTimeString,\n  Minutes,\n  Seconds,\n  TimeString,\n  TimeUnit,\n  TimeUnitValue,\n  updateTimeString,\n  zeroTime,\n  zeroTimeUnit,\n} from \"@vuu-ui/vuu-utils\";\nimport { ChangeEventHandler } from \"react\";\n\nexport type Digit = \"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\";\n\ntype NullSelection = {\n  end: null;\n  start: null;\n};\ntype Selection =\n  | {\n      end: number;\n      start: number;\n    }\n  | NullSelection;\n\nconst NullSelection: NullSelection = { end: null, start: null };\nconst FullSelection: Selection = { end: 0, start: 8 };\nconst CursorAtEnd: Selection = { end: 8, start: 8 };\n\nexport type MaskedInputEvents = {\n  change: ChangeEventHandler<HTMLInputElement>;\n};\n\nexport class MaskedInput extends EventEmitter<MaskedInputEvents> {\n  #controlled = false;\n  #input: HTMLInputElement | null = null;\n  #isFocused = false;\n  #isIncrementalChange = false;\n  #selectionStart = -1;\n  #selectionEnd = -1;\n  #value;\n  #unitSelected?: TimeUnit;\n  #halfUnitSelected?: TimeUnit;\n\n  constructor(\n    defaultValue: TimeString | undefined,\n    inputEl: HTMLInputElement | null = null,\n  ) {\n    super();\n    if (inputEl) {\n      this.input = inputEl;\n    }\n    this.#value = defaultValue ?? zeroTime;\n  }\n\n  set input(el: HTMLInputElement) {\n    if (this.#input) {\n      throw Error(\n        \"MaskedInput cannot be reused, create a new instance for a new input\",\n      );\n    }\n    this.#input = el;\n    el.addEventListener(\"change\", this.emitSyntheticChangeEvent);\n  }\n\n  /**\n   * The change event is fired programatically. This will only be handled\n   * by a native event handler ( not a React handler). We handle this event\n   * and convert to a React (Synthetic) event.\n   */\n  private emitSyntheticChangeEvent = (e: Event) => {\n    const syntheticEvent = createSyntheticEvent(\n      e,\n    ) as React.ChangeEvent<HTMLInputElement>;\n\n    this.emit(\"change\", syntheticEvent);\n  };\n\n  get cursorPos() {\n    return this.selectionStart;\n  }\n  set cursorPos(value: number) {\n    this.selectionStart = value;\n    this.selectionEnd = value;\n    if (this.#input) {\n      this.#input.setSelectionRange(value, value);\n    }\n  }\n\n  get isFocused() {\n    return this.#isFocused;\n  }\n\n  get selectionStart() {\n    return this.#selectionStart;\n  }\n  set selectionStart(value: number) {\n    this.#selectionStart = value;\n  }\n\n  get selectionEnd() {\n    return this.#selectionEnd;\n  }\n  set selectionEnd(value: number) {\n    this.#selectionEnd = value;\n  }\n\n  private setValue(value: TimeString) {\n    if (!this.#controlled) {\n      this.#isIncrementalChange = false;\n      this.#value = value;\n    }\n\n    if (this.#input) {\n      // HM this updateds the input value, even if we are controlled.\n      // Thats not right, but if we don't update it, the event will\n      // not carry thwe right value. I don;t thibnk we can simulate\n      // the correct behaviour\n      this.#input.value = value;\n      // this triggers the native change event, which we convert\n      // // to synthetic event and emit in input setter above\n      this.#input.dispatchEvent(\n        new Event(\"change\", {\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    }\n  }\n\n  private setUnitValue(unit: TimeUnit, value: Hours | Minutes | Seconds) {\n    const newTimeString = updateTimeString(this.#value, unit, value);\n    this.setValue(newTimeString);\n  }\n\n  private getUnitValue<T extends TimeUnit>(unit: T): TimeUnitValue<T> {\n    switch (unit) {\n      case \"hours\":\n        return this.#value.slice(0, 2) as TimeUnitValue<T>;\n      case \"minutes\":\n        return this.#value.slice(3, 5) as TimeUnitValue<T>;\n      case \"seconds\":\n        return this.#value.slice(6, 8) as TimeUnitValue<T>;\n      default:\n        throw Error(`[MaskedInout] invalue unit ${unit}`);\n    }\n  }\n\n  get value() {\n    return this.#value;\n  }\n\n  /**\n   * Setting the value this way invokes 'controlled' mode\n   */\n  set value(value: TimeString) {\n    this.#controlled = true;\n    this.#value = value;\n    if (this.isFocused) {\n      const isIncremental = this.#isIncrementalChange;\n      this.#isIncrementalChange = false;\n\n      requestAnimationFrame(() => {\n        if (isIncremental) {\n          this.restoreSelection();\n        } else {\n          this.advanceSelection();\n        }\n      });\n    }\n  }\n\n  clear(unit: TimeUnit) {\n    if (this.#input) {\n      let newValue = this.#value;\n      if (unit === \"hours\") {\n        newValue = zeroTimeUnit.concat(this.#value.slice(2)) as TimeString;\n      } else if (unit === \"minutes\") {\n        newValue = this.#value\n          .slice(0, 3)\n          .concat(zeroTimeUnit)\n          .concat(this.#value.slice(5)) as TimeString;\n      } else if (unit === \"seconds\") {\n        newValue = this.#value.slice(0, 6).concat(zeroTimeUnit) as TimeString;\n      }\n      if (newValue !== this.#value) {\n        this.setValue(newValue);\n      }\n    }\n  }\n\n  select(unit: TimeUnit, halfUnit = false) {\n    if (this.#input) {\n      const offset = halfUnit ? 1 : 0;\n      if (unit === \"hours\") {\n        this.selectionStart = this.#input.selectionStart = 0 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 2;\n      } else if (unit === \"minutes\") {\n        this.selectionStart = this.#input.selectionStart = 3 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 5;\n      } else if (unit === \"seconds\") {\n        this.selectionStart = this.#input.selectionStart = 6 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 8;\n      }\n      this.#input.setSelectionRange(this.selectionStart, this.selectionEnd);\n      if (halfUnit) {\n        this.#halfUnitSelected = unit;\n        this.#unitSelected = undefined;\n      } else {\n        this.#halfUnitSelected = undefined;\n        this.#unitSelected = unit;\n      }\n    }\n  }\n\n  removeSelection() {\n    this.#selectionStart = this.selectionEnd = 8;\n    this.#unitSelected = undefined;\n    this.#halfUnitSelected = undefined;\n  }\n\n  restoreSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected);\n    }\n  }\n\n  advanceSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected, true);\n    } else if (this.#halfUnitSelected === \"hours\") {\n      this.select(\"minutes\");\n    } else if (this.#halfUnitSelected === \"minutes\") {\n      this.select(\"seconds\");\n    } else if (this.#halfUnitSelected === \"seconds\") {\n      this.select(\"seconds\");\n    } else {\n      throw Error(\"unreachable code, in theory\");\n    }\n  }\n\n  moveFocus(direction: \"left\" | \"right\") {\n    if (direction === \"right\") {\n      if (\n        this.#unitSelected === \"hours\" ||\n        this.#halfUnitSelected === \"hours\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"seconds\");\n      }\n    } else {\n      if (\n        this.#unitSelected === \"seconds\" ||\n        this.#halfUnitSelected === \"seconds\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"hours\");\n      } else {\n        const selection = this.getSelection();\n        if (selection === CursorAtEnd) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n  }\n\n  pasteValue(value: TimeString) {\n    this.#halfUnitSelected = undefined;\n    this.#unitSelected = undefined;\n    this.#value = value;\n  }\n\n  private getUnitAtCursorPos(cursorPos = this.cursorPos): TimeUnit {\n    if (cursorPos >= 0 && cursorPos < 3) {\n      return \"hours\";\n    } else if (cursorPos < 6) {\n      return \"minutes\";\n    } else if (cursorPos <= 8) {\n      return \"seconds\";\n    } else {\n      throw Error(\n        `[MaskedInput] getUnitAtCursorPos invalid cursor position ${cursorPos}`,\n      );\n    }\n  }\n\n  incrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = incrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  decrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = decrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  backspace() {\n    if (this.#input) {\n      const { cursorPos } = this;\n\n      if (this.#unitSelected === \"seconds\") {\n        this.clear(\"seconds\");\n        this.select(\"minutes\");\n      } else if (this.#unitSelected === \"minutes\") {\n        this.clear(\"minutes\");\n        this.select(\"hours\");\n      } else if (this.#unitSelected === \"hours\") {\n        this.clear(\"hours\");\n        this.select(\"hours\");\n      } else {\n        if (cursorPos > 0) {\n          const offset =\n            this.selectionStart === 6 || this.selectionStart === 3 ? 2 : 1;\n          const newValue = this.#value\n            .slice(0, cursorPos - offset)\n            .concat(zeroTime.slice(cursorPos - offset, cursorPos))\n            .concat(this.#value.slice(cursorPos)) as TimeString;\n          this.selectionStart -= offset;\n          this.selectionEnd -= offset;\n          this.setValue(newValue);\n\n          requestAnimationFrame(() => {\n            this.#input?.setSelectionRange(\n              this.#selectionStart,\n              this.selectionEnd,\n            );\n          });\n        }\n      }\n    }\n  }\n\n  update(key: Digit) {\n    if (this.#input) {\n      const { cursorPos } = this;\n      if (cursorPos < 8) {\n        const newValue = this.#value\n          .split(\"\")\n          .toSpliced(cursorPos, 1, key)\n          .join(\"\") as TimeString;\n\n        this.setValue(newValue);\n\n        if (!isValidTimeString(newValue)) {\n          if (this.#unitSelected) {\n            this.select(this.#unitSelected);\n            this.#input.classList.add(\"invalid\");\n          }\n        } else {\n          this.#input.classList.remove(\"invalid\");\n\n          if (!this.#controlled) {\n            this.advanceSelection();\n          }\n        }\n      }\n    }\n  }\n\n  private getSelection(): Selection {\n    if (this.#input) {\n      const { selectionEnd, selectionStart } = this.#input;\n      if (selectionEnd === null || selectionStart === null) {\n        return NullSelection;\n      } else if (selectionStart === 0 && selectionEnd === 8) {\n        return FullSelection;\n      } else if (selectionStart === 8 && selectionEnd === 8) {\n        return CursorAtEnd;\n      } else {\n        return {\n          end: selectionEnd,\n          start: selectionStart,\n        };\n      }\n    } else {\n      throw Error(`[MasketInput] selection referenced, but no input`);\n    }\n  }\n\n  click() {\n    if (this.#input) {\n      this.#isFocused = true;\n      const selection = this.getSelection();\n      if (selection === NullSelection) {\n        this.select(\"hours\");\n      } else if (selection === FullSelection) {\n        // do nothing\n      } else {\n        const cursorPos = this.#input.selectionStart ?? 0;\n        this.select(this.getUnitAtCursorPos(cursorPos));\n      }\n    }\n  }\n  doubleClick() {\n    if (this.#input) {\n      const { selectionStart, selectionEnd } = this.#input;\n      if (selectionStart === null || selectionEnd === null) {\n        // do nothing\n      } else {\n        if (selectionStart < 3) {\n          this.select(\"hours\");\n        } else if (selectionStart < 6) {\n          this.select(\"minutes\");\n        } else if (selectionStart <= 8) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n    // }\n  }\n\n  focus = () => {\n    if (this.#input) {\n      this.#isFocused = true;\n\n      requestAnimationFrame(() => {\n        this.select(\"hours\");\n        setTimeout(() => {\n          if (this.#input?.selectionStart !== 0) {\n            this.select(\"hours\");\n          }\n        }, 200);\n      });\n    }\n  };\n\n  blur = () => {\n    this.removeSelection();\n    this.#isFocused = false;\n  };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MaskedInput.js","sources":["../../../../packages/vuu-ui-controls/src/time-input/MaskedInput.ts"],"sourcesContent":["import {\n  createSyntheticEvent,\n  decrementTimeUnitValue,\n  EventEmitter,\n  Hours,\n  incrementTimeUnitValue,\n  isValidTimeString,\n  Minutes,\n  Seconds,\n  TimeString,\n  TimeUnit,\n  TimeUnitValue,\n  updateTimeString,\n  zeroTime,\n  zeroTimeUnit,\n} from \"@vuu-ui/vuu-utils\";\nimport { ChangeEventHandler } from \"react\";\n\nexport type Digit = \"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\";\n\ntype NullSelection = {\n  end: null;\n  start: null;\n};\ntype Selection =\n  | {\n      end: number;\n      start: number;\n    }\n  | NullSelection;\n\nconst NullSelection: NullSelection = { end: null, start: null };\nconst FullSelection: Selection = { end: 0, start: 8 };\nconst CursorAtEnd: Selection = { end: 8, start: 8 };\n\nexport type MaskedInputEvents = {\n  change: ChangeEventHandler<HTMLInputElement>;\n};\n\nexport class MaskedInput extends EventEmitter<MaskedInputEvents> {\n  #controlled = false;\n  #input: HTMLInputElement | null = null;\n  #isFocused = false;\n  #isIncrementalChange = false;\n  #selectionStart = -1;\n  #selectionEnd = -1;\n  #value;\n  #unitSelected?: TimeUnit;\n  #halfUnitSelected?: TimeUnit;\n\n  constructor(\n    defaultValue: TimeString | undefined,\n    inputEl: HTMLInputElement | null = null,\n  ) {\n    super();\n    if (inputEl) {\n      this.input = inputEl;\n    }\n    this.#value = defaultValue ?? zeroTime;\n  }\n\n  set input(el: HTMLInputElement) {\n    if (this.#input) {\n      throw Error(\n        \"MaskedInput cannot be reused, create a new instance for a new input\",\n      );\n    }\n    this.#input = el;\n    el.addEventListener(\"change\", this.emitSyntheticChangeEvent);\n  }\n\n  /**\n   * The change event is fired programatically. This will only be handled\n   * by a native event handler ( not a React handler). We handle this event\n   * and convert to a React (Synthetic) event.\n   */\n  private emitSyntheticChangeEvent = (e: Event) => {\n    const syntheticEvent = createSyntheticEvent(\n      e,\n    ) as React.ChangeEvent<HTMLInputElement>;\n\n    this.emit(\"change\", syntheticEvent);\n  };\n\n  get cursorPos() {\n    return this.selectionStart;\n  }\n  set cursorPos(value: number) {\n    this.selectionStart = value;\n    this.selectionEnd = value;\n    if (this.#input) {\n      this.#input.setSelectionRange(value, value);\n    }\n  }\n\n  get isFocused() {\n    return this.#isFocused;\n  }\n\n  get selectionStart() {\n    return this.#selectionStart;\n  }\n  set selectionStart(value: number) {\n    this.#selectionStart = value;\n  }\n\n  get selectionEnd() {\n    return this.#selectionEnd;\n  }\n  set selectionEnd(value: number) {\n    this.#selectionEnd = value;\n  }\n\n  private setValue(value: TimeString) {\n    if (!this.#controlled) {\n      this.#isIncrementalChange = false;\n      this.#value = value;\n    }\n\n    if (this.#input) {\n      // HM this updateds the input value, even if we are controlled.\n      // Thats not right, but if we don't update it, the event will\n      // not carry thwe right value. I don;t thibnk we can simulate\n      // the correct behaviour\n      this.#input.value = value;\n      // this triggers the native change event, which we convert\n      // // to synthetic event and emit in input setter above\n      this.#input.dispatchEvent(\n        new Event(\"change\", {\n          bubbles: true,\n          composed: true,\n        }),\n      );\n    }\n  }\n\n  private setUnitValue(unit: TimeUnit, value: Hours | Minutes | Seconds) {\n    const newTimeString = updateTimeString(this.#value, unit, value);\n    this.setValue(newTimeString);\n  }\n\n  private getUnitValue<T extends TimeUnit>(unit: T): TimeUnitValue<T> {\n    switch (unit) {\n      case \"hours\":\n        return this.#value.slice(0, 2) as TimeUnitValue<T>;\n      case \"minutes\":\n        return this.#value.slice(3, 5) as TimeUnitValue<T>;\n      case \"seconds\":\n        return this.#value.slice(6, 8) as TimeUnitValue<T>;\n      default:\n        throw Error(`[MaskedInout] invalue unit ${unit}`);\n    }\n  }\n\n  get value() {\n    return this.#value;\n  }\n\n  /**\n   * Setting the value this way invokes 'controlled' mode\n   */\n  set value(value: TimeString) {\n    this.#controlled = true;\n    this.#value = value;\n    if (this.isFocused) {\n      const isIncremental = this.#isIncrementalChange;\n      this.#isIncrementalChange = false;\n\n      requestAnimationFrame(() => {\n        if (isIncremental) {\n          this.restoreSelection();\n        } else {\n          this.advanceSelection();\n        }\n      });\n    }\n  }\n\n  clear(unit: TimeUnit) {\n    if (this.#input) {\n      let newValue = this.#value;\n      if (unit === \"hours\") {\n        newValue = zeroTimeUnit.concat(this.#value.slice(2)) as TimeString;\n      } else if (unit === \"minutes\") {\n        newValue = this.#value\n          .slice(0, 3)\n          .concat(zeroTimeUnit)\n          .concat(this.#value.slice(5)) as TimeString;\n      } else if (unit === \"seconds\") {\n        newValue = this.#value.slice(0, 6).concat(zeroTimeUnit) as TimeString;\n      }\n      if (newValue !== this.#value) {\n        this.setValue(newValue);\n      }\n    }\n  }\n\n  select(unit: TimeUnit, halfUnit = false) {\n    if (this.#input) {\n      const offset = halfUnit ? 1 : 0;\n      if (unit === \"hours\") {\n        this.selectionStart = this.#input.selectionStart = 0 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 2;\n      } else if (unit === \"minutes\") {\n        this.selectionStart = this.#input.selectionStart = 3 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 5;\n      } else if (unit === \"seconds\") {\n        this.selectionStart = this.#input.selectionStart = 6 + offset;\n        this.selectionEnd = this.#input.selectionEnd = 8;\n      }\n      this.#input.setSelectionRange(this.selectionStart, this.selectionEnd);\n      if (halfUnit) {\n        this.#halfUnitSelected = unit;\n        this.#unitSelected = undefined;\n      } else {\n        this.#halfUnitSelected = undefined;\n        this.#unitSelected = unit;\n      }\n    }\n  }\n\n  removeSelection() {\n    this.#selectionStart = this.selectionEnd = 8;\n    this.#unitSelected = undefined;\n    this.#halfUnitSelected = undefined;\n  }\n\n  restoreSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected);\n    }\n  }\n\n  advanceSelection() {\n    if (this.#unitSelected) {\n      this.select(this.#unitSelected, true);\n    } else if (this.#halfUnitSelected === \"hours\") {\n      this.select(\"minutes\");\n    } else if (this.#halfUnitSelected === \"minutes\") {\n      this.select(\"seconds\");\n    } else if (this.#halfUnitSelected === \"seconds\") {\n      this.select(\"seconds\");\n    } else {\n      throw Error(\"unreachable code, in theory\");\n    }\n  }\n\n  moveFocus(direction: \"left\" | \"right\") {\n    if (direction === \"right\") {\n      if (\n        this.#unitSelected === \"hours\" ||\n        this.#halfUnitSelected === \"hours\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"seconds\");\n      }\n    } else {\n      if (\n        this.#unitSelected === \"seconds\" ||\n        this.#halfUnitSelected === \"seconds\"\n      ) {\n        this.select(\"minutes\");\n      } else if (\n        this.#unitSelected === \"minutes\" ||\n        this.#halfUnitSelected === \"minutes\"\n      ) {\n        this.select(\"hours\");\n      } else {\n        const selection = this.getSelection();\n        if (selection === CursorAtEnd) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n  }\n\n  pasteValue(value: TimeString) {\n    this.#halfUnitSelected = undefined;\n    this.#unitSelected = undefined;\n    this.#value = value;\n  }\n\n  private getUnitAtCursorPos(cursorPos = this.cursorPos): TimeUnit {\n    if (cursorPos >= 0 && cursorPos < 3) {\n      return \"hours\";\n    } else if (cursorPos < 6) {\n      return \"minutes\";\n    } else if (cursorPos <= 8) {\n      return \"seconds\";\n    } else {\n      throw Error(\n        `[MaskedInput] getUnitAtCursorPos invalid cursor position ${cursorPos}`,\n      );\n    }\n  }\n\n  incrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = incrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  decrementValue() {\n    if (this.#input) {\n      this.#isIncrementalChange = true;\n      const unit = this.getUnitAtCursorPos();\n      const unitValue = this.getUnitValue(unit);\n      const newUnitValue = decrementTimeUnitValue(unit, unitValue);\n      this.setUnitValue(unit, newUnitValue);\n      this.select(unit);\n    }\n  }\n\n  backspace() {\n    if (this.#input) {\n      const { cursorPos } = this;\n\n      if (this.#unitSelected === \"seconds\") {\n        this.clear(\"seconds\");\n        this.select(\"minutes\");\n      } else if (this.#unitSelected === \"minutes\") {\n        this.clear(\"minutes\");\n        this.select(\"hours\");\n      } else if (this.#unitSelected === \"hours\") {\n        this.clear(\"hours\");\n        this.select(\"hours\");\n      } else {\n        if (cursorPos > 0) {\n          const offset =\n            this.selectionStart === 6 || this.selectionStart === 3 ? 2 : 1;\n          const newValue = this.#value\n            .slice(0, cursorPos - offset)\n            .concat(zeroTime.slice(cursorPos - offset, cursorPos))\n            .concat(this.#value.slice(cursorPos)) as TimeString;\n          this.selectionStart -= offset;\n          this.selectionEnd -= offset;\n          this.setValue(newValue);\n\n          requestAnimationFrame(() => {\n            this.#input?.setSelectionRange(\n              this.#selectionStart,\n              this.selectionEnd,\n            );\n          });\n        }\n      }\n    }\n  }\n\n  update(key: Digit) {\n    if (this.#input) {\n      const { cursorPos } = this;\n      if (cursorPos < 8) {\n        const originalValue = this.#value;\n        const newValue = this.#value\n          .split(\"\")\n          .toSpliced(cursorPos, 1, key)\n          .join(\"\") as TimeString;\n\n        this.setValue(newValue);\n\n        if (!isValidTimeString(newValue)) {\n          if (this.#unitSelected) {\n            this.select(this.#unitSelected);\n            this.#input.classList.add(\"invalid\");\n          }\n        } else {\n          this.#input.classList.remove(\"invalid\");\n\n          if (this.#controlled && newValue === originalValue) {\n            // Special case - user has overtyped a digit with same digit,\n            // value has not changed, so will not be set, which would normally\n            // trigger advance in controlled mode. Advance so next digit\n            // typed will be in correct position\n            this.advanceSelection();\n          } else if (!this.#controlled) {\n            this.advanceSelection();\n          }\n        }\n      }\n    }\n  }\n\n  private getSelection(): Selection {\n    if (this.#input) {\n      const { selectionEnd, selectionStart } = this.#input;\n      if (selectionEnd === null || selectionStart === null) {\n        return NullSelection;\n      } else if (selectionStart === 0 && selectionEnd === 8) {\n        return FullSelection;\n      } else if (selectionStart === 8 && selectionEnd === 8) {\n        return CursorAtEnd;\n      } else {\n        return {\n          end: selectionEnd,\n          start: selectionStart,\n        };\n      }\n    } else {\n      throw Error(`[MasketInput] selection referenced, but no input`);\n    }\n  }\n\n  click() {\n    if (this.#input) {\n      this.#isFocused = true;\n      const selection = this.getSelection();\n      if (selection === NullSelection) {\n        this.select(\"hours\");\n      } else if (selection === FullSelection) {\n        // do nothing\n      } else {\n        const cursorPos = this.#input.selectionStart ?? 0;\n        this.select(this.getUnitAtCursorPos(cursorPos));\n      }\n    }\n  }\n  doubleClick() {\n    if (this.#input) {\n      const { selectionStart, selectionEnd } = this.#input;\n      if (selectionStart === null || selectionEnd === null) {\n        // do nothing\n      } else {\n        if (selectionStart < 3) {\n          this.select(\"hours\");\n        } else if (selectionStart < 6) {\n          this.select(\"minutes\");\n        } else if (selectionStart <= 8) {\n          this.select(\"seconds\");\n        }\n      }\n    }\n    // }\n  }\n\n  focus = () => {\n    if (this.#input) {\n      this.#isFocused = true;\n\n      requestAnimationFrame(() => {\n        this.select(\"hours\");\n        setTimeout(() => {\n          if (this.#input?.selectionStart !== 0) {\n            this.select(\"hours\");\n          }\n        }, 200);\n      });\n    }\n  };\n\n  blur = () => {\n    this.removeSelection();\n    this.#isFocused = false;\n  };\n}\n"],"names":[],"mappings":"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"}

package/esm/time-input/TimeInput.css.js

@@ -1,4 +1,4 @@
-var timeInputCss = ".salt-density-high .vuuTimeInput {\n    --time-input-width: 60px;\n}\n.salt-density-medium .vuuTimeInput {\n    --time-input-width: 70px;\n}\n.salt-density-low .vuuTimeInput {\n    --time-input-width: 80px;\n}\n.salt-density-touch .vuuTimeInput {\n    --time-input-width: 90px;\n}\n\n.vuuTimeInput {\n    border-width: 1px;\n    font-family: var(--salt-typography-fontFamily);\n    width: var(--vuuTimeInput-width, var(--time-input-width));\n\n    &:focus::-webkit-input-placeholder {\n        color: transparent;\n    }\n\n}\n\n.invalid {\n    border-color: red;\n}\n\n";
+var timeInputCss = ".salt-density-high .vuuTimeInput {\n    --time-input-width: 60px;\n}\n.salt-density-medium .vuuTimeInput {\n    --time-input-width: 70px;\n}\n.salt-density-low .vuuTimeInput {\n    --time-input-width: 80px;\n}\n.salt-density-touch .vuuTimeInput {\n    --time-input-width: 90px;\n}\n\n.vuuTimeInput {\n    background: var(--vuuTimeInput-background, inherit);\n    border-width: 1px;\n    font-family: var(--salt-typography-fontFamily);\n    width: var(--vuuTimeInput-width, var(--time-input-width));\n\n    &:focus::-webkit-input-placeholder {\n        color: transparent;\n    }\n\n}\n\n.invalid {\n    border-color: red;\n}\n\n";
 
 export { timeInputCss as default };
 //# sourceMappingURL=TimeInput.css.js.map

package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js

@@ -77,20 +77,23 @@ const useVuuTypeaheadInput = ({
       }
     }
   }, [table, column, getSuggestions, value, NO_FREE_TEXT]);
-  const handleChange = (evt) => {
-    const { value: newValue } = evt.target;
-    const { current: value2 } = valueRef;
-    if (value2 === "" && newValue) {
-      setOpen(true);
-      const input = rootRef.current?.querySelector("input");
-      if (input && highlightFirstSuggestion) {
-        pendingListFocusRef.current = true;
+  const handleChange = useCallback(
+    (evt) => {
+      const { value: newValue } = evt.target;
+      const { current: value2 } = valueRef;
+      if (value2 === "" && newValue) {
+        setOpen(true);
+        const input = rootRef.current?.querySelector("input");
+        if (input && highlightFirstSuggestion) {
+          pendingListFocusRef.current = true;
+        }
+      } else if (newValue === "" && value2) {
+        onCommit(evt, "");
       }
-    } else if (newValue === "" && value2) {
-      onCommit(evt, "");
-    }
-    setValue(newValue);
-  };
+      setValue(newValue);
+    },
+    [highlightFirstSuggestion, onCommit, setValue, valueRef]
+  );
   const handleSelectionChange = (evt, [newSelected]) => {
     if (commitTimeout.current) {
       clearTimeout(commitTimeout.current);

package/esm/vuu-typeahead-input/useVuuTypeaheadInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../../../packages/vuu-ui-controls/src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n  const commitTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          commitTimeout.current = setTimeout(() => {\n            onCommit?.(evt, value, \"text-input\");\n            setOpen(false);\n            commitTimeout.current = null;\n          }, 200);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                //TODO this is failing to work correctly in new version of cypress\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (evt) => {\n    const { value: newValue } = evt.target;\n    const { current: value } = valueRef;\n    if (value === \"\" && newValue) {\n      setOpen(true);\n      const input = rootRef.current?.querySelector(\"input\");\n      if (input && highlightFirstSuggestion) {\n        pendingListFocusRef.current = true;\n      }\n    } else if (newValue === \"\" && value) {\n      // treat clear value as a commit event\n      onCommit(evt, \"\");\n    }\n    setValue(newValue);\n  };\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    if (commitTimeout.current) {\n      clearTimeout(commitTimeout.current);\n      commitTimeout.current = null;\n    }\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["value"],"mappings":"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"}
+{"version":3,"file":"useVuuTypeaheadInput.js","sources":["../../../../packages/vuu-ui-controls/src/vuu-typeahead-input/useVuuTypeaheadInput.ts"],"sourcesContent":["import { useTypeaheadSuggestions } from \"@vuu-ui/vuu-data-react\";\nimport type { TypeaheadParams } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  dispatchKeyboardEvent,\n  getVuuTable,\n  useStateRef,\n  NO_DATA_MATCH,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  ComponentPropsWithoutRef,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ChangeEventHandler,\n  type RefCallback,\n  type SyntheticEvent,\n} from \"react\";\nimport type { VuuTypeaheadInputProps } from \"./VuuTypeaheadInput\";\n\nexport type VuuTypeaheadInputHookProps = Pick<\n  VuuTypeaheadInputProps,\n  | \"allowFreeInput\"\n  | \"column\"\n  | \"freeTextWarning\"\n  | \"highlightFirstSuggestion\"\n  | \"inputProps\"\n  | \"onCommit\"\n  | \"table\"\n>;\n\nconst defaultFreeTextWarning =\n  \"Please select a value from the list of suggestions. If no suggestions match your text, then the value is not valid. If you believe this should be a valid value, please reach out to the support team\";\n\nexport const useVuuTypeaheadInput = ({\n  allowFreeInput = true,\n  column,\n  freeTextWarning,\n  highlightFirstSuggestion = true,\n  inputProps: inputPropsProp,\n  onCommit,\n  table,\n}: VuuTypeaheadInputHookProps) => {\n  const NO_FREE_TEXT = useMemo(\n    () => [freeTextWarning ?? defaultFreeTextWarning],\n    [freeTextWarning],\n  );\n  const [valueRef, setValue] = useStateRef(\"\");\n  const [open, setOpen] = useState(false);\n  const inputRef = useRef<HTMLInputElement | null>(null);\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [typeaheadValues, setTypeaheadValues] = useState<string[]>([]);\n  const getSuggestions = useTypeaheadSuggestions();\n  const pendingListFocusRef = useRef(false);\n\n  const { current: value } = valueRef;\n  const commitTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const { current: value } = valueRef;\n      if (evt.key === \"Enter\" && value !== \"\") {\n        if (allowFreeInput) {\n          commitTimeout.current = setTimeout(() => {\n            onCommit?.(evt, value, \"text-input\");\n            setOpen(false);\n            commitTimeout.current = null;\n          }, 200);\n        } else {\n          setTypeaheadValues(NO_FREE_TEXT);\n        }\n      }\n    },\n    [NO_FREE_TEXT, allowFreeInput, onCommit, valueRef],\n  );\n\n  const callbackRef = useCallback<RefCallback<HTMLDivElement>>((el) => {\n    rootRef.current = el;\n    const input = el?.querySelector(\"input\") ?? null;\n    inputRef.current = input;\n  }, []);\n\n  useEffect(() => {\n    if (table) {\n      const vuuTable = getVuuTable(table);\n      if (value) {\n        const params: TypeaheadParams = value\n          ? [vuuTable, column, value]\n          : [vuuTable, column];\n        getSuggestions(params)\n          .then((suggestions) => {\n            if (suggestions === false) {\n              // TODO is this right\n              setTypeaheadValues([]);\n            } else if (suggestions.length === 0 && value) {\n              setTypeaheadValues((values) =>\n                // Do not update if we have already set suggestions to the no free text warning\n                values === NO_FREE_TEXT ? NO_FREE_TEXT : NO_DATA_MATCH,\n              );\n            } else {\n              setTypeaheadValues(suggestions);\n              if (pendingListFocusRef.current && inputRef.current) {\n                // This is a workaround for the fact that ComboBox does not automatically\n                // highlight first list item when items have been populated dynamically.\n                // This has been raised as a bug.\n                //TODO this is failing to work correctly in new version of cypress\n                dispatchKeyboardEvent(inputRef.current, \"keydown\", \"ArrowUp\");\n              }\n            }\n            pendingListFocusRef.current = false;\n          })\n          .catch((err) => {\n            console.error(\"Error getting suggestions\", err);\n          });\n      } else {\n        setTypeaheadValues([]);\n      }\n    }\n  }, [table, column, getSuggestions, value, NO_FREE_TEXT]);\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n    (evt) => {\n      const { value: newValue } = evt.target;\n      const { current: value } = valueRef;\n      if (value === \"\" && newValue) {\n        setOpen(true);\n        const input = rootRef.current?.querySelector(\"input\");\n        if (input && highlightFirstSuggestion) {\n          pendingListFocusRef.current = true;\n        }\n      } else if (newValue === \"\" && value) {\n        // treat clear value as a commit event\n        onCommit(evt, \"\");\n      }\n      setValue(newValue);\n    },\n    [highlightFirstSuggestion, onCommit, setValue, valueRef],\n  );\n\n  const handleSelectionChange = (\n    evt: SyntheticEvent,\n    [newSelected]: string[],\n  ) => {\n    if (commitTimeout.current) {\n      clearTimeout(commitTimeout.current);\n      commitTimeout.current = null;\n    }\n    setValue(newSelected);\n    onCommit(\n      evt as SyntheticEvent<HTMLInputElement>,\n      newSelected,\n      \"typeahead-suggestion\",\n    );\n  };\n\n  const handleOpenChange = (newOpen: boolean) => {\n    if (newOpen && valueRef.current === \"\") {\n      // ignore this, don't open dropdown unless user has typed at least one character\n    } else {\n      setOpen(newOpen);\n    }\n  };\n\n  const inputProps: ComponentPropsWithoutRef<\"input\"> = {\n    ...inputPropsProp,\n    autoComplete: \"off\",\n  };\n\n  const [noFreeText] = NO_FREE_TEXT;\n  return {\n    inputProps,\n    noFreeText,\n    onChange: handleChange,\n    onKeyDown: handleKeyDown,\n    onOpenChange: handleOpenChange,\n    onSelectionChange: handleSelectionChange,\n    open,\n    ref: callbackRef,\n    typeaheadValues,\n    value: valueRef.current,\n  };\n};\n"],"names":["value"],"mappings":"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"}

package/package.json

@@ -1,20 +1,20 @@
 {
-  "version": "0.13.37",
+  "version": "0.13.39",
   "description": "VUU UI Controls",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.13.37",
-    "@vuu-ui/vuu-protocol-types": "0.13.37",
-    "@vuu-ui/vuu-table-types": "0.13.37"
+    "@vuu-ui/vuu-data-types": "0.13.39",
+    "@vuu-ui/vuu-protocol-types": "0.13.39",
+    "@vuu-ui/vuu-table-types": "0.13.39"
   },
   "dependencies": {
-    "@vuu-ui/vuu-context-menu": "0.13.37",
-    "@vuu-ui/vuu-data-react": "0.13.37",
-    "@vuu-ui/vuu-layout": "0.13.37",
-    "@vuu-ui/vuu-popups": "0.13.37",
-    "@vuu-ui/vuu-table": "0.13.37",
-    "@vuu-ui/vuu-utils": "0.13.37",
+    "@vuu-ui/vuu-context-menu": "0.13.39",
+    "@vuu-ui/vuu-data-react": "0.13.39",
+    "@vuu-ui/vuu-layout": "0.13.39",
+    "@vuu-ui/vuu-popups": "0.13.39",
+    "@vuu-ui/vuu-table": "0.13.39",
+    "@vuu-ui/vuu-utils": "0.13.39",
     "@salt-ds/core": "1.43.0",
     "@salt-ds/icons": "1.13.2",
     "@salt-ds/styles": "0.2.1",