{"version":3,"file":"TwofaInput-DNUubHmE.js","sources":["../../../app/javascript/components/FormBuilder/Tooltip.jsx","../../../app/javascript/components/FormBuilder/FormLabel.jsx","../../../app/javascript/components/FormBuilder/InputField/index.jsx","../../../app/javascript/components/TwofaInput.jsx"],"sourcesContent":["import React from 'react';\n\nconst Tooltip = ({ tip, onHover }) => (\n  <div\n    className=\"tooltip\"\n    onMouseEnter={onHover}\n    onClick={onHover}\n  >\n    <span className=\"tooltip-caret\" />\n    <span className=\"tooltip-text\">\n      {tip}\n    </span>\n  </div>\n);\n\nexport default Tooltip;\n","import React from 'react';\n\nimport Tooltip from './Tooltip';\nimport { notEmpty } from '@javascript/util.js';\n\nconst FormLabel = ({\n  label,\n  klass,\n  spanKlass,\n  htmlFor,\n  children,\n  required,\n  tooltip,\n  mobileSubLabel,\n}) => (\n  <label htmlFor={htmlFor} className={klass}>\n    {\n      label.length > 0 && (\n        <span className={spanKlass ? `label-text ${spanKlass}` : 'label-text'}>\n          {label}\n          {required && <span className=\"required\">*</span>}\n          {tooltip && <Tooltip tip={tooltip} />}\n          {notEmpty(mobileSubLabel) && <div className=\"sub-label\">{mobileSubLabel}</div>}\n        </span>\n      )\n    }\n    {children}\n  </label>\n);\n\nexport default FormLabel;\n","import React from 'react';\n\nimport FormLabel from '../FormLabel';\nimport ErrorNotice from '../ErrorNotice';\nimport { generateClassName, generateErrors } from '@javascript/util';\n\nconst InputField = (props) => {\n  const {\n    charLimit = null,\n    disabled = false,\n    error = [],\n    idPrefix = null,\n    inputClass = null,\n    labelKlass = null,\n    maxLength = null,\n    min = null,\n    mobileSubLabel = null,\n    onBlur = null,\n    onKeyDown = () => {},\n    placeholder = null,\n    required = false,\n    subtext = null,\n    textMask = null,\n    spanKlass = '',\n    tooltip = null,\n    type = 'text',\n    value = '',\n    handleChange,\n    id,\n    klass,\n    label,\n    pattern,\n    subTextClassName,\n  } = props;\n\n  const fieldId = ['fb'];\n  if (idPrefix) {\n    fieldId.push(idPrefix);\n  }\n  fieldId.push(id);\n\n  const charlimitError = charLimit && value.length > charLimit;\n  const className = generateClassName(klass);\n  const { errorMessage, errorBool } = generateErrors(error);\n  const charLimitClass = ['char-limit'];\n  if (charlimitError) {\n    charLimitClass.push('error');\n  }\n\n  const charLimitText = `${value.length}/${charLimit}`;\n\n  return (\n    <div className={className}>\n      <FormLabel\n        label={label}\n        htmlFor={id}\n        klass={labelKlass}\n        spanKlass={spanKlass}\n        tooltip={tooltip}\n        mobileSubLabel={mobileSubLabel}\n        required={required}\n      >\n        <input\n          type={type}\n          id={fieldId.join('-')}\n          name={id}\n          error={errorBool}\n          placeholder={placeholder || ''}\n          onBlur={onBlur}\n          value={textMask ? textMask(value) : value}\n          pattern={pattern}\n          onChange={handleChange}\n          disabled={disabled}\n          className={inputClass}\n          maxLength={maxLength}\n          onKeyDown={onKeyDown}\n          min={min}\n        />\n        {subtext && (\n          <span className={`${subTextClassName} subtext`}>{subtext}</span>\n        )}\n      </FormLabel>\n      <ErrorNotice error={errorMessage}>\n        {charLimit && (\n          <span className={charLimitClass.join(' ')}>{charLimitText}</span>\n        )}\n      </ErrorNotice>\n    </div>\n  );\n};\n\nexport default InputField;\n","import PropTypes from \"prop-types\";\nimport { useEffect, useRef, useState } from \"react\";\n\nconst TwofaInput = (props) => {\n  const {\n    pinLength = 6,\n    className = '',\n    helpText = '',\n    value = '',\n    onChange,\n    error = '',\n    setError,\n    confirmTwofa,\n  } = props;\n\n  const inputElms = useRef(new Array(pinLength));\n  const [valids, setValids] = useState(new Array(pinLength).fill(false));\n  const [hasBeenFocused, setHasBeenFocused] = useState(\n    new Array(pinLength).fill(false)\n  );\n  const [errors, setErrors] = useState([]);\n\n  const [internalValue, setInternalValue] = useState(\"\");\n\n  useEffect(() => {\n    if (error) {\n      setErrors([{ message: \"Please enter a valid verification code.\" }]);\n      setHasBeenFocused(new Array(pinLength).fill(false));\n    } else {\n      setErrors([]);\n    }\n  }, [error]);\n\n  const navKeys = [\n    \"ArrowLeft\",\n    \"ArrowRight\",\n    \"ArrowUp\",\n    \"ArrowDown\",\n    \"Tab\",\n    \"Shift\",\n    \"Backspace\",\n  ];\n\n  const handleChange = (e, i) => {\n    let newValue = \"\";\n    let newHasBeenFocused = hasBeenFocused;\n    inputElms.current.map((e, i) => {\n      const inputValue = e.value\n        .trim()\n        .charAt()\n        .replace(/[^0-9]/g, \"\");\n      e.value = inputValue;\n      newValue = newValue + inputValue;\n      if (e.value.length > 0) {\n        newHasBeenFocused[i] = true;\n      }\n    });\n\n    let newValids = valids;\n    newValids[i] = e.target.validity.valid;\n    setValids(newValids);\n    setHasBeenFocused(newHasBeenFocused);\n\n    setInternalValue(newValue);\n\n    if (i < inputElms.current.length - 1 && e.target.value != \"\") {\n      inputElms.current[i + 1].focus();\n    }\n\n    onChange(e, newValue);\n    setError(false);\n  };\n\n  const handleKeyDown = (e, i) => {\n    if (e.key == \"Backspace\" && e.target.value == \"\" && i > 0) {\n      inputElms.current[i - 1].focus();\n    }\n    if (e.key == \"ArrowLeft\" && i > 0) {\n      inputElms.current[i - 1].focus();\n    }\n\n    if (e.key == \"ArrowRight\" && i < inputElms.current.length - 1) {\n      inputElms.current[i + 1].focus();\n    }\n\n    if (e.key === \"Enter\") {\n      confirmTwofa(e);\n    }\n  };\n\n  const handleFocus = (e, i) => {\n    if (e.target.value != \"\") {\n      e.target.select();\n    }\n\n    if (error) {\n      setError(false);\n    }\n  };\n\n  const handleBlur = (e, i) => {\n    let newHasBeenFocused = hasBeenFocused;\n    newHasBeenFocused[i] = true;\n    setHasBeenFocused(newHasBeenFocused);\n  };\n\n  const handlePaste = (e) => {\n    const data = e.clipboardData\n      .getData(\"text/plain\")\n      .trim()\n      .slice(0, pinLength);\n    let newValue = \"\";\n    let newValids = valids;\n    let newHasBeenFocused = hasBeenFocused;\n\n    inputElms.current.map((e, i) => {\n      if (data[i] != undefined) {\n        newValue = newValue + data[i];\n        e.value = data[i];\n      } else {\n        e.value = \"\";\n      }\n      if (e.value.length > 0) {\n        newHasBeenFocused[i] = true;\n      }\n      newValids[i] = e.validity.valid;\n    });\n    setValids(newValids);\n    setHasBeenFocused(newHasBeenFocused);\n    setInternalValue(newValue);\n    onChange(e, newValue);\n    inputElms.current[pinLength - 1].focus();\n  };\n\n  const classList = ['TwoFA'];\n\n  if (className) {\n    classList.push(className);\n  }\n\n  if (error) {\n    classList.push('twofa-error')\n  }\n\n  return (\n    <div className={classList.join(' ')}>\n      <div className=\"TwoFA__wrapper\">\n        <div className=\"TwoFA__grid\">\n          {Array.apply(null, { length: pinLength }).map((e, i) => (\n            <div className=\"TwoFA__input\" key={i}>\n              <input\n                className={`${\n                  hasBeenFocused[i] ? (valids[i] ? \"--valid\" : \"--invalid\") : \"\"\n                }`}\n                ref={(element) => (inputElms.current[i] = element)}\n                maxLength={1}\n                onChange={(e) => {\n                  handleChange(e, i);\n                }}\n                onKeyDown={(e) => {\n                  handleKeyDown(e, i);\n                }}\n                onFocus={(e) => {\n                  handleFocus(e, i);\n                }}\n                onBlur={(e) => {\n                  handleBlur(e, i);\n                }}\n                required={true}\n                value={value.split(\"\")[i]}\n                onPaste={handlePaste}\n                type={\"number\"}\n                inputMode={\"numeric\"}\n                pattern=\"\\d*\"\n                min={0}\n                max={9}\n              />\n            </div>\n          ))}\n        </div>\n        {helpText != \"\" && <div className=\"TwoFA__help-text\">{helpText}</div>}\n        {errors && (\n          <ul className=\"TwoFA__errors\">\n            {errors.map((error, index) => (\n              <li key={index}>{error.message}</li>\n            ))}\n          </ul>\n        )}\n      </div>\n    </div>\n  );\n};\n\nTwofaInput.propTypes = {\n  className: PropTypes.string,\n  pinLength: PropTypes.number,\n  helpText: PropTypes.string,\n  value: PropTypes.string,\n  onChange: PropTypes.func,\n  error: PropTypes.bool,\n  setError: PropTypes.func,\n};\n\nexport default TwofaInput;\n"],"names":["Tooltip","tip","onHover","jsxs","jsx","FormLabel","label","klass","spanKlass","htmlFor","children","required","tooltip","mobileSubLabel","notEmpty","InputField","props","charLimit","disabled","error","idPrefix","inputClass","labelKlass","maxLength","min","onBlur","onKeyDown","placeholder","subtext","textMask","type","value","handleChange","id","pattern","subTextClassName","fieldId","charlimitError","className","generateClassName","errorMessage","errorBool","generateErrors","charLimitClass","charLimitText","ErrorNotice","TwofaInput","pinLength","helpText","onChange","setError","confirmTwofa","inputElms","useRef","valids","setValids","useState","hasBeenFocused","setHasBeenFocused","errors","setErrors","internalValue","setInternalValue","useEffect","e","i","newValue","newHasBeenFocused","inputValue","newValids","handleKeyDown","handleFocus","handleBlur","handlePaste","data","classList","element","index","PropTypes"],"mappings":"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"}