{"version":3,"file":"index.mjs","sources":[""],"sourcesContent":["import \"./style.pcss\";\r\nimport { getDebouncedFn } from \"@web3r/flowerkit/fn\";\r\nimport type {\r\n  FC,\r\n  ReactElement,\r\n  ChangeEvent,\r\n  ClipboardEvent,\r\n  FocusEvent,\r\n} from \"react\";\r\nimport {\r\n  useImperativeHandle,\r\n  useState,\r\n  useEffect,\r\n  useRef,\r\n  useMemo, useCallback,\r\n} from \"react\";\r\nimport { IMaskInput } from \"react-imask\";\r\nimport type { ReactMaskProps } from \"react-imask\";\r\nimport type {\r\n  IMaskedInput, TMaskedCallbackArg, TInstance, TMaskedInputProps, TMaskedRef, TMaskOptions,\r\n} from \"./config/types\";\r\nimport { getCurrentMask, getCurrentValue } from \"./lib\";\r\nimport { constants } from \"../../constants\";\r\nimport type { IComponentBaseProps } from \"../../types\";\r\nimport { useCN } from \"../../utils/react/useCN\";\r\nimport { useFormValidation } from \"../../utils/react/useFormValidation\";\r\nimport { useSSGRender } from \"../../utils/react/useSSGRender\";\r\nimport { Input } from \"../input\";\r\n\r\n\r\nconst MaskedControl: FC<TInstance & IMaskedInput & ReactMaskProps<HTMLInputElement> & {\r\n  onAccept: unknown;\r\n  onComplete: unknown;\r\n  onPaste: unknown;\r\n  onKeyDown: unknown;\r\n  defaultValue: IMaskedInput[\"value\"];\r\n}> = (props = {}): ReactElement => {\r\n\r\n  const { getCN } = useCN(\"formInput\");\r\n\r\n  const computedProps = useMemo<TMaskedInputProps>(() => {\r\n\r\n    const extraClasses: IComponentBaseProps[\"extraClasses\"] = {};\r\n\r\n    const currentProps: TMaskedInputProps = {\r\n      ...props,\r\n      ...((props?.mask ?? {}) as object),\r\n    } as TMaskedInputProps;\r\n\r\n    // readonly prop\r\n    if (currentProps.isReadOnly) {\r\n      currentProps.readOnly = true;\r\n      extraClasses.isReadOnly = true;\r\n    }\r\n    delete currentProps.isReadOnly;\r\n\r\n    // disabled prop\r\n    if (currentProps.isDisabled) {\r\n      currentProps.disabled = true;\r\n      extraClasses.isDisabled = true;\r\n    }\r\n    delete currentProps.isDisabled;\r\n\r\n    // inputMode prop\r\n    if (!currentProps.inputMode) {\r\n      delete currentProps.inputMode;\r\n    }\r\n\r\n    // form prop\r\n    if (!currentProps.form) {\r\n      delete currentProps.form;\r\n    }\r\n\r\n    // name prop\r\n    if (!currentProps.name) {\r\n      delete currentProps.name;\r\n    }\r\n\r\n    // id prop\r\n    if (!currentProps.id) {\r\n      delete currentProps.id;\r\n    }\r\n\r\n    // classname\r\n    if (currentProps.inputExtraClasses) {\r\n      currentProps.className = getCN(\"\", {\r\n        ...extraClasses,\r\n        ...(props?.inputExtraClasses ?? {}),\r\n      });\r\n      delete currentProps.inputExtraClasses;\r\n    }\r\n\r\n    // extra attrs\r\n    if (currentProps.inputExtraAttrs) {\r\n      Object.entries(currentProps.inputExtraAttrs)\r\n        .forEach(([ key, value ]: [ string, unknown ]) => {\r\n          currentProps[key as keyof TMaskedInputProps] = value;\r\n        });\r\n      delete currentProps.inputExtraAttrs;\r\n    }\r\n\r\n    return currentProps;\r\n  }, [ getCN, props ]);\r\n\r\n  return <IMaskInput {...computedProps} />;\r\n\r\n};\r\n\r\n\r\n/**\r\n * Компонент маски\r\n * @returns {ReactElement}\r\n */\r\nconst MaskedInput: FC<IMaskedInput & IComponentBaseProps> = (props): ReactElement => {\r\n\r\n  const {\r\n    baseClass = \"maskedInput\",\r\n    extraAttrs = {},\r\n    extraClasses = {},\r\n    children = null,\r\n    isDisabled = false,\r\n    isReadOnly = false,\r\n    isRequired = false,\r\n    value = \"\",\r\n    mask,\r\n    name = \"\",\r\n    onBlur = null,\r\n    onChange = null,\r\n    onFocus = null,\r\n    onPaste = null,\r\n    onInput = null,\r\n    onKeyDown = null,\r\n    placeholder = \"\",\r\n    title = \"\",\r\n    form = \"\",\r\n    id = \"\",\r\n    inputMode,\r\n    onMount = null,\r\n    onUnmount = null,\r\n    inputExtraAttrs = {},\r\n    inputExtraClasses = {},\r\n    ref,\r\n  } = props || {};\r\n\r\n  // Classnames\r\n  const { getCN } = useCN(baseClass);\r\n\r\n  // Ref\r\n  const containerRef = useRef<HTMLDivElement>(null);\r\n  const instanceRef = useRef<TInstance>(null);\r\n  const inputRef = useRef(null);\r\n\r\n  // States\r\n  const [ inputValue, setInputValue ] = useState<IMaskedInput[\"value\"]>(() => getCurrentValue(value));\r\n  const [ isInputDisabled, setIsInputDisabled ] = useState<IMaskedInput[\"isDisabled\"]>(isDisabled);\r\n  const [ isInputReadOnly, setIsInputReadOnly ] = useState<IMaskedInput[\"isReadOnly\"]>(isReadOnly);\r\n  const [ isInputRequired, setIsInputRequired ] = useState<IMaskedInput[\"isRequired\"]>(isRequired);\r\n  const [ currentMask, setCurrentMask ] = useState<IMaskedInput[\"mask\"]>(() => getCurrentMask(mask));\r\n\r\n  // Prev states\r\n  const prevMask = useRef<IMaskedInput[\"mask\"]>(currentMask);\r\n  const prevValue = useRef<IMaskedInput[\"value\"]>(inputValue);\r\n\r\n  // State actions\r\n  const stateActions = useMemo(() => ({\r\n    setInputValue,\r\n    setIsInputDisabled,\r\n    setIsInputReadOnly,\r\n    setIsInputRequired,\r\n    setCurrentMask,\r\n  }), []);\r\n\r\n  // Updater\r\n  const syncInstance = getDebouncedFn(() => {\r\n    const instance = instanceRef?.current?.maskRef;\r\n    if (instance) {\r\n      instance.updateValue();\r\n      instance.updateControl();\r\n    }\r\n  }, 300);\r\n\r\n  // Callback arg\r\n  const getCbArg = useCallback<((value: IMaskedInput[\"value\"], event?: ChangeEvent | FocusEvent | ClipboardEvent) => TMaskedCallbackArg)>((value, event) => {\r\n    return {\r\n      el: containerRef.current,\r\n      ref: instanceRef,\r\n      utils: null,\r\n      event: event || null,\r\n      getData: () => ({\r\n        value,\r\n        prevValue: prevValue.current,\r\n        syncInstance,\r\n      }),\r\n      stateActions,\r\n    };\r\n  }, [ stateActions, syncInstance ]);\r\n\r\n  const emitChange = useMemo(() => getDebouncedFn((nextValue: string, event?: ChangeEvent) => {\r\n    if (typeof onChange === \"function\") {\r\n      const arg = getCbArg(nextValue, event);\r\n      onChange(arg);\r\n    }\r\n  }, 300), [ getCbArg, onChange ]);\r\n\r\n  const emitInput = useMemo(() => getDebouncedFn((nextValue: string, event?: ChangeEvent) => {\r\n    if (typeof onInput === \"function\") {\r\n      const arg = getCbArg(nextValue, event);\r\n      onInput(arg);\r\n    }\r\n  }, 300), [ getCbArg, onInput ]);\r\n\r\n  // onChange\r\n  const handleChange = useCallback((value: string, mask: TInstance, event?: ChangeEvent) => {\r\n    const nextValue = value || \"\";\r\n    setInputValue((prev) => (prev !== nextValue ? nextValue : prev));\r\n    emitChange(nextValue, event);\r\n  }, [ emitChange ]);\r\n\r\n  const handleInput = useCallback((value: string, mask: TInstance, event?: ChangeEvent) => {\r\n    const nextValue = value || \"\";\r\n    setInputValue((prev) => (prev !== nextValue ? nextValue : prev));\r\n    emitInput(nextValue, event);\r\n  }, [ emitInput ]);\r\n\r\n  // onBlur\r\n  const handleBlur = useCallback((event: FocusEvent) => {\r\n    if (typeof onBlur === \"function\") {\r\n      const arg = getCbArg((event.target as HTMLInputElement).value, event);\r\n      onBlur(arg);\r\n    }\r\n  }, [ getCbArg, onBlur ]);\r\n\r\n  // onFocus\r\n  const handleFocus = useCallback((event: FocusEvent) => {\r\n    if (typeof onFocus === \"function\") {\r\n      const arg = getCbArg((event.target as HTMLInputElement).value, event);\r\n      onFocus(arg);\r\n    }\r\n  }, [ getCbArg, onFocus ]);\r\n\r\n  // onPaste\r\n  const handlePaste = useCallback((event: ClipboardEvent) => {\r\n    if (typeof onPaste === \"function\") {\r\n      const arg = getCbArg((event.target as HTMLInputElement).value, event);\r\n      onPaste(arg);\r\n    }\r\n  }, [ getCbArg, onPaste ]);\r\n\r\n  // onKeyDown\r\n  const handleKeyDown = useCallback((event: ClipboardEvent) => {\r\n    if (typeof onKeyDown === \"function\") {\r\n      const arg = getCbArg((event.target as HTMLInputElement).value, event);\r\n      onKeyDown(arg);\r\n    }\r\n  }, [ getCbArg, onKeyDown ]);\r\n\r\n  // Validation\r\n  useFormValidation(inputRef, (e) => {\r\n    containerRef?.current?.classList.toggle(constants.stateClasses.invalid, !e.detail.isValid);\r\n  });\r\n\r\n  // Ref\r\n  useImperativeHandle(ref, () => {\r\n    return getCbArg(inputValue) as TMaskedRef;\r\n  }, [ getCbArg, inputValue ]);\r\n\r\n  useEffect(() => {\r\n    if (typeof onMount === \"function\") {\r\n      onMount(instanceRef);\r\n    }\r\n    return () => {\r\n      if (typeof onUnmount === \"function\") {\r\n        onUnmount(instanceRef);\r\n      }\r\n    };\r\n\r\n  }, []);\r\n\r\n  // Change `mask` or `value`\r\n  useEffect(() => {\r\n    // value\r\n    const newValue = getCurrentValue(value);\r\n    if (newValue !== prevValue.current) {\r\n      prevValue.current = newValue;\r\n      setInputValue(newValue);\r\n    }\r\n    // mask\r\n    const newMask = getCurrentMask(mask);\r\n    if (newMask !== prevMask.current) {\r\n      prevMask.current = newMask;\r\n      setCurrentMask(newMask);\r\n    }\r\n  }, [ mask, value ]);\r\n\r\n  // Sync\r\n  useEffect(() => {\r\n    if (inputValue !== prevValue.current) {\r\n      prevValue.current = inputValue;\r\n      syncInstance();\r\n    }\r\n\r\n  }, [ inputValue ]);\r\n\r\n  // Classnames\r\n  const classMods = useMemo(() => ({\r\n    isDisabled: !!isInputDisabled,\r\n    isReadOnly: !!isInputReadOnly,\r\n    isRequired: !!isInputRequired,\r\n    ...extraClasses,\r\n  }), [ extraClasses, isInputDisabled, isInputReadOnly, isInputRequired ]);\r\n\r\n  const SSGComponent = useSSGRender(\"data-js-masked-input\", props);\r\n\r\n  if (SSGComponent) {\r\n    return SSGComponent;\r\n  }\r\n\r\n  return (\r\n    <div ref={containerRef} className={getCN(\"\", classMods)} {...extraAttrs}>\r\n      <Input extraAttrs={{\r\n        \"data-js-input-validation-bubble\": \"true\",\r\n        \"data-js-component-input\": \"maskedInput\",\r\n      }} isRequired={isInputRequired} ref={inputRef} type={\"hidden\"} name={name} value={inputValue} />\r\n      <MaskedControl\r\n        value={inputValue}\r\n        ref={instanceRef}\r\n        mask={currentMask}\r\n        isReadOnly={isReadOnly}\r\n        isDisabled={isInputDisabled}\r\n        placeholder={placeholder}\r\n        title={title}\r\n        inputMode={inputMode}\r\n        defaultValue={value}\r\n        onAccept={handleInput}\r\n        onPaste={handlePaste}\r\n        onComplete={handleChange}\r\n        onKeyDown={handleKeyDown}\r\n        onBlur={handleBlur}\r\n        onFocus={handleFocus}\r\n        form={form}\r\n        id={id}\r\n        inputExtraAttrs={inputExtraAttrs}\r\n        inputExtraClasses={inputExtraClasses}\r\n      />\r\n      {children}\r\n    </div>\r\n  );\r\n\r\n};\r\n\r\nexport type {\r\n  IMaskedInput, TMaskedCallbackArg, TMaskedRef, TMaskOptions,\r\n};\r\n\r\nexport {\r\n  MaskedInput,\r\n};\r\n"],"names":["MaskedControl","props","getCN","useCN","computedProps","useMemo","extraClasses","currentProps","mask","isReadOnly","readOnly","isDisabled","disabled","inputMode","form","name","id","inputExtraClasses","className","inputExtraAttrs","Object","entries","forEach","key","value","_jsx","IMaskInput","MaskedInput","baseClass","extraAttrs","children","isRequired","onBlur","onChange","onFocus","onPaste","onInput","onKeyDown","placeholder","title","onMount","onUnmount","ref","containerRef","useRef","instanceRef","inputRef","inputValue","setInputValue","useState","getCurrentValue","isInputDisabled","setIsInputDisabled","isInputReadOnly","setIsInputReadOnly","isInputRequired","setIsInputRequired","currentMask","setCurrentMask","getCurrentMask","prevMask","prevValue","stateActions","syncInstance","getDebouncedFn","instance","current","maskRef","updateValue","updateControl","getCbArg","useCallback","event","el","utils","getData","emitChange","nextValue","arg","emitInput","handleChange","prev","handleInput","handleBlur","target","handleFocus","handlePaste","handleKeyDown","useFormValidation","e","classList","toggle","constants","stateClasses","invalid","detail","isValid","useImperativeHandle","useEffect","newValue","newMask","classMods","SSGComponent","useSSGRender","_jsxs","Input","type","defaultValue","onAccept","onComplete"],"mappings":"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"}