@skbkontur/react-ui 0.0.0-3c309a601b → 0.0.0-3dbb8bef27

package/components/MaskedInput/ColorableInputElement/ColorableInputElement/ColorableInputElement.js

@@ -0,0 +1,136 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["children", "onInput", "onFocus", "onBlur", "showOnFocus"]; /* eslint react-hooks/exhaustive-deps: 2 */
+import React, { useContext, useEffect, useImperativeHandle, useRef, useCallback, useState } from 'react';
+import { globalObject, isBrowser } from '@skbkontur/global-object';
+import debounce from 'lodash.debounce';
+import { ThemeContext } from "../../../../lib/theming/ThemeContext";
+import { forwardRefAndName } from "../../../../lib/forwardRefAndName";
+import { cx } from "../../../../lib/theming/Emotion";
+import { globalClasses } from "../ColorableInputElement.styles";
+
+// Возможно придётся включить.
+// Иногда, на тяжёлых страницах, текст рендерится итеративно.
+// Из-за этого могут оставаться артефакты при покраске компонента, которые пропадут только после фокуса.
+// setInterval(() => window.requestAnimationFrame(() => dictionary.forEach((paint) => paint())), 1000);
+
+export var ColorableInputElement = forwardRefAndName('ColorableInputElement', function ColorableInputElement(props, ref) {
+  var inputRef = useRef(null);
+  var spanRef = useRef(null);
+  var focused = useRef(false);
+  var inputStyle = React.useRef();
+  var theme = useContext(ThemeContext);
+  var _useState = useState(true),
+    active = _useState[0],
+    setActive = _useState[1];
+  var children = props.children,
+    onInput = props.onInput,
+    onFocus = props.onFocus,
+    onBlur = props.onBlur,
+    showOnFocus = props.showOnFocus,
+    inputProps = _objectWithoutPropertiesLoose(props, _excluded);
+  useImperativeHandle(ref, function () {
+    return {
+      input: inputRef.current,
+      getRootNode: function getRootNode() {
+        return inputRef.current;
+      }
+    };
+  }, []);
+  useEffect(updateActive, []);
+  var paintText = useCallback(function () {
+    var _inputRef$current, _shadow;
+    if (!spanRef.current || !inputRef.current || !inputStyle.current || !isBrowser(globalObject)) {
+      return;
+    }
+    (_inputRef$current = inputRef.current) == null || _inputRef$current.classList.add(globalClasses.input);
+    var shadow = spanRef.current.shadowRoot;
+    var typedValueElement = (_shadow = shadow) == null ? void 0 : _shadow.getElementById('span');
+    if (!typedValueElement) {
+      shadow = spanRef.current.attachShadow({
+        mode: 'open'
+      });
+      typedValueElement = globalObject.document.createElement('span');
+      typedValueElement.setAttribute('id', 'span');
+      shadow.appendChild(typedValueElement);
+    }
+    var style = inputStyle.current;
+    typedValueElement.textContent = (inputRef.current.getAttribute('data-unmasked-value') || focused.current) && inputRef.current.getAttribute('data-typed-value') || '';
+    var inputRect = inputRef.current.getBoundingClientRect();
+    var filledRect = spanRef.current.getBoundingClientRect();
+    var threshold = filledRect.width / (inputRect.width / 100);
+    var degree = style.fontStyle === 'italic' ? 100 : 90;
+    var typedValueColor = theme.inputTextColor;
+    var maskColor = theme.inputPlaceholderColor;
+    if (props.disabled) {
+      typedValueColor = theme.inputTextColorDisabled;
+      maskColor = theme.inputTextColorDisabled;
+    }
+    if (props.showOnFocus) {
+      maskColor = focused.current ? maskColor : 'transparent';
+    }
+    inputRef.current.style.backgroundImage = "\n      linear-gradient(\n          " + degree + "deg,\n          " + typedValueColor + " " + threshold + "%,\n          " + maskColor + " " + threshold + "%\n      )";
+  }, [props.showOnFocus, props.disabled, theme.inputTextColor, theme.inputPlaceholderColor, theme.inputTextColorDisabled]);
+  var debouncedPaintText = useCallback(function () {
+    return debounce(paintText);
+  }, [paintText])();
+  var activation = useCallback(function () {
+    if (active) {
+      debouncedPaintText();
+    } else {
+      var _inputRef$current2;
+      debouncedPaintText.cancel();
+      inputRef.current && (inputRef.current.style.backgroundImage = '');
+      (_inputRef$current2 = inputRef.current) == null || _inputRef$current2.classList.remove(globalClasses.input);
+    }
+  }, [debouncedPaintText, active]);
+  useEffect(function () {
+    activation();
+    updateActive();
+  }, [props.value, props.defaultValue, theme, activation]);
+  useEffect(function () {
+    if (inputRef.current) {
+      inputStyle.current = getComputedStyle(inputRef.current);
+    }
+  });
+  return /*#__PURE__*/(
+    React.createElement(React.Fragment, null, /*#__PURE__*/
+    React.cloneElement(children, _extends({}, inputProps, {
+      onInput: handleInput,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      inputRef: inputRef,
+      className: cx(props.className, active && globalClasses.input)
+    })), active && /*#__PURE__*/React.createElement("span", {
+      style: {
+        visibility: 'hidden',
+        position: 'absolute',
+        whiteSpace: 'pre'
+      },
+      ref: spanRef
+    }))
+  );
+  function handleInput(e) {
+    var _inputRef$current3;
+    var isActive = !((_inputRef$current3 = inputRef.current) != null && (_inputRef$current3 = _inputRef$current3.parentElement) != null && _inputRef$current3.querySelector(':placeholder-shown'));
+    setActive(isActive);
+    activation();
+    onInput == null || onInput(e);
+  }
+  function handleFocus(e) {
+    setTimeout(updateActive);
+    focused.current = true;
+    onFocus == null || onFocus(e);
+  }
+  function handleBlur(e) {
+    updateActive();
+    focused.current = false;
+    onBlur == null || onBlur(e);
+  }
+  function updateActive() {
+    setTimeout(function () {
+      var _inputRef$current4;
+      setActive(!((_inputRef$current4 = inputRef.current) != null && (_inputRef$current4 = _inputRef$current4.parentElement) != null && _inputRef$current4.querySelector(':placeholder-shown')));
+    });
+  }
+});

package/components/MaskedInput/ColorableInputElement/ColorableInputElement/ColorableInputElement.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useContext","useEffect","useImperativeHandle","useRef","useCallback","useState","globalObject","isBrowser","debounce","ThemeContext","forwardRefAndName","cx","globalClasses","ColorableInputElement","props","ref","inputRef","spanRef","focused","inputStyle","theme","_useState","active","setActive","children","onInput","onFocus","onBlur","showOnFocus","inputProps","_objectWithoutPropertiesLoose","_excluded","input","current","getRootNode","updateActive","paintText","_inputRef$current","_shadow","classList","add","shadow","shadowRoot","typedValueElement","getElementById","attachShadow","mode","document","createElement","setAttribute","appendChild","style","textContent","getAttribute","inputRect","getBoundingClientRect","filledRect","threshold","width","degree","fontStyle","typedValueColor","inputTextColor","maskColor","inputPlaceholderColor","disabled","inputTextColorDisabled","backgroundImage","debouncedPaintText","activation","_inputRef$current2","cancel","remove","value","defaultValue","getComputedStyle","Fragment","cloneElement","_extends","handleInput","handleFocus","handleBlur","className","visibility","position","whiteSpace","e","_inputRef$current3","isActive","parentElement","querySelector","setTimeout","_inputRef$current4"],"sources":["ColorableInputElement.tsx"],"sourcesContent":["/* eslint react-hooks/exhaustive-deps: 2 */\nimport React, { ForwardedRef, useContext, useEffect, useImperativeHandle, useRef, useCallback, useState } from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\nimport debounce from 'lodash.debounce';\n\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { InputElement, InputElementProps } from '../../Input';\nimport { forwardRefAndName } from '../../../lib/forwardRefAndName';\nimport { cx } from '../../../lib/theming/Emotion';\n\nimport { globalClasses } from './ColorableInputElement.styles';\n\nexport type ColorableInputElementProps = InputElementProps & {\n  showOnFocus?: boolean;\n  children: React.ReactElement;\n};\n\n// Возможно придётся включить.\n// Иногда, на тяжёлых страницах, текст рендерится итеративно.\n// Из-за этого могут оставаться артефакты при покраске компонента, которые пропадут только после фокуса.\n// setInterval(() => window.requestAnimationFrame(() => dictionary.forEach((paint) => paint())), 1000);\n\nexport const ColorableInputElement = forwardRefAndName(\n  'ColorableInputElement',\n  function ColorableInputElement(props: ColorableInputElementProps, ref: ForwardedRef<InputElement>) {\n    const inputRef = useRef<HTMLInputElement | null>(null);\n    const spanRef = useRef<HTMLSpanElement | null>(null);\n    const focused = useRef(false);\n    const inputStyle = React.useRef<CSSStyleDeclaration>();\n    const theme = useContext(ThemeContext);\n    const [active, setActive] = useState(true);\n\n    const { children, onInput, onFocus, onBlur, showOnFocus, ...inputProps } = props;\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        input: inputRef.current,\n        getRootNode: () => inputRef.current,\n      }),\n      [],\n    );\n\n    useEffect(updateActive, []);\n\n    const paintText = useCallback(() => {\n      if (!spanRef.current || !inputRef.current || !inputStyle.current || !isBrowser(globalObject)) {\n        return;\n      }\n\n      inputRef.current?.classList.add(globalClasses.input);\n\n      let shadow = spanRef.current.shadowRoot;\n      let typedValueElement = shadow?.getElementById('span');\n\n      if (!typedValueElement) {\n        shadow = spanRef.current.attachShadow({ mode: 'open' });\n\n        typedValueElement = globalObject.document.createElement('span');\n        typedValueElement.setAttribute('id', 'span');\n\n        shadow.appendChild(typedValueElement);\n      }\n\n      const style = inputStyle.current;\n\n      typedValueElement.textContent =\n        ((inputRef.current.getAttribute('data-unmasked-value') || focused.current) &&\n          inputRef.current.getAttribute('data-typed-value')) ||\n        '';\n\n      const inputRect = inputRef.current.getBoundingClientRect();\n      const filledRect = spanRef.current.getBoundingClientRect();\n\n      const threshold = filledRect.width / (inputRect.width / 100);\n      const degree = style.fontStyle === 'italic' ? 100 : 90;\n\n      let typedValueColor = theme.inputTextColor;\n      let maskColor = theme.inputPlaceholderColor;\n      if (props.disabled) {\n        typedValueColor = theme.inputTextColorDisabled;\n        maskColor = theme.inputTextColorDisabled;\n      }\n      if (props.showOnFocus) {\n        maskColor = focused.current ? maskColor : 'transparent';\n      }\n\n      inputRef.current.style.backgroundImage = `\n      linear-gradient(\n          ${degree}deg,\n          ${typedValueColor} ${threshold}%,\n          ${maskColor} ${threshold}%\n      )`;\n    }, [\n      props.showOnFocus,\n      props.disabled,\n      theme.inputTextColor,\n      theme.inputPlaceholderColor,\n      theme.inputTextColorDisabled,\n    ]);\n\n    const debouncedPaintText = useCallback(() => debounce(paintText), [paintText])();\n\n    const activation = useCallback(() => {\n      if (active) {\n        debouncedPaintText();\n      } else {\n        debouncedPaintText.cancel();\n        inputRef.current && (inputRef.current.style.backgroundImage = '');\n        inputRef.current?.classList.remove(globalClasses.input);\n      }\n    }, [debouncedPaintText, active]);\n\n    useEffect(() => {\n      activation();\n      updateActive();\n    }, [props.value, props.defaultValue, theme, activation]);\n\n    useEffect(() => {\n      if (inputRef.current) {\n        inputStyle.current = getComputedStyle(inputRef.current);\n      }\n    });\n\n    return (\n      <>\n        {React.cloneElement(children, {\n          ...inputProps,\n          onInput: handleInput,\n          onFocus: handleFocus,\n          onBlur: handleBlur,\n          inputRef,\n          className: cx(props.className, active && globalClasses.input),\n        })}\n        {active && <span style={{ visibility: 'hidden', position: 'absolute', whiteSpace: 'pre' }} ref={spanRef} />}\n      </>\n    );\n\n    function handleInput(e: React.ChangeEvent<HTMLInputElement>) {\n      const isActive = !inputRef.current?.parentElement?.querySelector(':placeholder-shown');\n      setActive(isActive);\n\n      activation();\n\n      onInput?.(e);\n    }\n\n    function handleFocus(e: React.FocusEvent<HTMLInputElement>) {\n      setTimeout(updateActive);\n\n      focused.current = true;\n\n      onFocus?.(e);\n    }\n\n    function handleBlur(e: React.FocusEvent<HTMLInputElement>) {\n      updateActive();\n\n      focused.current = false;\n\n      onBlur?.(e);\n    }\n\n    function updateActive() {\n      setTimeout(() => {\n        setActive(!inputRef.current?.parentElement?.querySelector(':placeholder-shown'));\n      });\n    }\n  },\n);\n"],"mappings":"2OAAA;AACA,OAAOA,KAAK,IAAkBC,UAAU,EAAEC,SAAS,EAAEC,mBAAmB,EAAEC,MAAM,EAAEC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACtH,SAASC,YAAY,EAAEC,SAAS,QAAQ,0BAA0B;AAClE,OAAOC,QAAQ,MAAM,iBAAiB;;AAEtC,SAASC,YAAY,QAAQ,mCAAmC;;AAEhE,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SAASC,EAAE,QAAQ,8BAA8B;;AAEjD,SAASC,aAAa,QAAQ,gCAAgC;;;;;;;AAO9D;AACA;AACA;AACA;;AAEA,OAAO,IAAMC,qBAAqB,GAAGH,iBAAiB;EACpD,uBAAuB;EACvB,SAASG,qBAAqBA,CAACC,KAAiC,EAAEC,GAA+B,EAAE;IACjG,IAAMC,QAAQ,GAAGb,MAAM,CAA0B,IAAI,CAAC;IACtD,IAAMc,OAAO,GAAGd,MAAM,CAAyB,IAAI,CAAC;IACpD,IAAMe,OAAO,GAAGf,MAAM,CAAC,KAAK,CAAC;IAC7B,IAAMgB,UAAU,GAAGpB,KAAK,CAACI,MAAM,CAAsB,CAAC;IACtD,IAAMiB,KAAK,GAAGpB,UAAU,CAACS,YAAY,CAAC;IACtC,IAAAY,SAAA,GAA4BhB,QAAQ,CAAC,IAAI,CAAC,CAAnCiB,MAAM,GAAAD,SAAA,IAAEE,SAAS,GAAAF,SAAA;;IAExB,IAAQG,QAAQ,GAA2DV,KAAK,CAAxEU,QAAQ,CAAEC,OAAO,GAAkDX,KAAK,CAA9DW,OAAO,CAAEC,OAAO,GAAyCZ,KAAK,CAArDY,OAAO,CAAEC,MAAM,GAAiCb,KAAK,CAA5Ca,MAAM,CAAEC,WAAW,GAAoBd,KAAK,CAApCc,WAAW,CAAKC,UAAU,GAAAC,6BAAA,CAAKhB,KAAK,EAAAiB,SAAA;;IAEhF7B,mBAAmB;MACjBa,GAAG;MACH,oBAAO;UACLiB,KAAK,EAAEhB,QAAQ,CAACiB,OAAO;UACvBC,WAAW,EAAE,SAAAA,YAAA,UAAMlB,QAAQ,CAACiB,OAAO;QACrC,CAAC,EAAC;MACF;IACF,CAAC;;IAEDhC,SAAS,CAACkC,YAAY,EAAE,EAAE,CAAC;;IAE3B,IAAMC,SAAS,GAAGhC,WAAW,CAAC,YAAM,KAAAiC,iBAAA,EAAAC,OAAA;MAClC,IAAI,CAACrB,OAAO,CAACgB,OAAO,IAAI,CAACjB,QAAQ,CAACiB,OAAO,IAAI,CAACd,UAAU,CAACc,OAAO,IAAI,CAAC1B,SAAS,CAACD,YAAY,CAAC,EAAE;QAC5F;MACF;;MAEA,CAAA+B,iBAAA,GAAArB,QAAQ,CAACiB,OAAO,aAAhBI,iBAAA,CAAkBE,SAAS,CAACC,GAAG,CAAC5B,aAAa,CAACoB,KAAK,CAAC;;MAEpD,IAAIS,MAAM,GAAGxB,OAAO,CAACgB,OAAO,CAACS,UAAU;MACvC,IAAIC,iBAAiB,IAAAL,OAAA,GAAGG,MAAM,qBAANH,OAAA,CAAQM,cAAc,CAAC,MAAM,CAAC;;MAEtD,IAAI,CAACD,iBAAiB,EAAE;QACtBF,MAAM,GAAGxB,OAAO,CAACgB,OAAO,CAACY,YAAY,CAAC,EAAEC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC;;QAEvDH,iBAAiB,GAAGrC,YAAY,CAACyC,QAAQ,CAACC,aAAa,CAAC,MAAM,CAAC;QAC/DL,iBAAiB,CAACM,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC;;QAE5CR,MAAM,CAACS,WAAW,CAACP,iBAAiB,CAAC;MACvC;;MAEA,IAAMQ,KAAK,GAAGhC,UAAU,CAACc,OAAO;;MAEhCU,iBAAiB,CAACS,WAAW;MAC1B,CAACpC,QAAQ,CAACiB,OAAO,CAACoB,YAAY,CAAC,qBAAqB,CAAC,IAAInC,OAAO,CAACe,OAAO;MACvEjB,QAAQ,CAACiB,OAAO,CAACoB,YAAY,CAAC,kBAAkB,CAAC;MACnD,EAAE;;MAEJ,IAAMC,SAAS,GAAGtC,QAAQ,CAACiB,OAAO,CAACsB,qBAAqB,CAAC,CAAC;MAC1D,IAAMC,UAAU,GAAGvC,OAAO,CAACgB,OAAO,CAACsB,qBAAqB,CAAC,CAAC;;MAE1D,IAAME,SAAS,GAAGD,UAAU,CAACE,KAAK,IAAIJ,SAAS,CAACI,KAAK,GAAG,GAAG,CAAC;MAC5D,IAAMC,MAAM,GAAGR,KAAK,CAACS,SAAS,KAAK,QAAQ,GAAG,GAAG,GAAG,EAAE;;MAEtD,IAAIC,eAAe,GAAGzC,KAAK,CAAC0C,cAAc;MAC1C,IAAIC,SAAS,GAAG3C,KAAK,CAAC4C,qBAAqB;MAC3C,IAAIlD,KAAK,CAACmD,QAAQ,EAAE;QAClBJ,eAAe,GAAGzC,KAAK,CAAC8C,sBAAsB;QAC9CH,SAAS,GAAG3C,KAAK,CAAC8C,sBAAsB;MAC1C;MACA,IAAIpD,KAAK,CAACc,WAAW,EAAE;QACrBmC,SAAS,GAAG7C,OAAO,CAACe,OAAO,GAAG8B,SAAS,GAAG,aAAa;MACzD;;MAEA/C,QAAQ,CAACiB,OAAO,CAACkB,KAAK,CAACgB,eAAe;;MAEhCR,MAAM;MACNE,eAAe,SAAIJ,SAAS;MAC5BM,SAAS,SAAIN,SAAS,eAC1B;;IACJ,CAAC,EAAE;IACD3C,KAAK,CAACc,WAAW;IACjBd,KAAK,CAACmD,QAAQ;IACd7C,KAAK,CAAC0C,cAAc;IACpB1C,KAAK,CAAC4C,qBAAqB;IAC3B5C,KAAK,CAAC8C,sBAAsB;IAC7B,CAAC;;IAEF,IAAME,kBAAkB,GAAGhE,WAAW,CAAC,oBAAMI,QAAQ,CAAC4B,SAAS,CAAC,IAAE,CAACA,SAAS,CAAC,CAAC,CAAC,CAAC;;IAEhF,IAAMiC,UAAU,GAAGjE,WAAW,CAAC,YAAM;MACnC,IAAIkB,MAAM,EAAE;QACV8C,kBAAkB,CAAC,CAAC;MACtB,CAAC,MAAM,KAAAE,kBAAA;QACLF,kBAAkB,CAACG,MAAM,CAAC,CAAC;QAC3BvD,QAAQ,CAACiB,OAAO,KAAKjB,QAAQ,CAACiB,OAAO,CAACkB,KAAK,CAACgB,eAAe,GAAG,EAAE,CAAC;QACjE,CAAAG,kBAAA,GAAAtD,QAAQ,CAACiB,OAAO,aAAhBqC,kBAAA,CAAkB/B,SAAS,CAACiC,MAAM,CAAC5D,aAAa,CAACoB,KAAK,CAAC;MACzD;IACF,CAAC,EAAE,CAACoC,kBAAkB,EAAE9C,MAAM,CAAC,CAAC;;IAEhCrB,SAAS,CAAC,YAAM;MACdoE,UAAU,CAAC,CAAC;MACZlC,YAAY,CAAC,CAAC;IAChB,CAAC,EAAE,CAACrB,KAAK,CAAC2D,KAAK,EAAE3D,KAAK,CAAC4D,YAAY,EAAEtD,KAAK,EAAEiD,UAAU,CAAC,CAAC;;IAExDpE,SAAS,CAAC,YAAM;MACd,IAAIe,QAAQ,CAACiB,OAAO,EAAE;QACpBd,UAAU,CAACc,OAAO,GAAG0C,gBAAgB,CAAC3D,QAAQ,CAACiB,OAAO,CAAC;MACzD;IACF,CAAC,CAAC;;IAEF;MACElC,KAAA,CAAAiD,aAAA,CAAAjD,KAAA,CAAA6E,QAAA;MACG7E,KAAK,CAAC8E,YAAY,CAACrD,QAAQ,EAAAsD,QAAA;MACvBjD,UAAU;QACbJ,OAAO,EAAEsD,WAAW;QACpBrD,OAAO,EAAEsD,WAAW;QACpBrD,MAAM,EAAEsD,UAAU;QAClBjE,QAAQ,EAARA,QAAQ;QACRkE,SAAS,EAAEvE,EAAE,CAACG,KAAK,CAACoE,SAAS,EAAE5D,MAAM,IAAIV,aAAa,CAACoB,KAAK,CAAC;MAC9D,CAAC;MACDV,MAAM,iBAAIvB,KAAA,CAAAiD,aAAA,WAAMG,KAAK,EAAE,EAAEgC,UAAU,EAAE,QAAQ,EAAEC,QAAQ,EAAE,UAAU,EAAEC,UAAU,EAAE,KAAK,CAAC,CAAE,EAACtE,GAAG,EAAEE,OAAQ,EAAE;MAC1G,CAAC;;;IAGL,SAAS8D,WAAWA,CAACO,CAAsC,EAAE,KAAAC,kBAAA;MAC3D,IAAMC,QAAQ,GAAG,GAAAD,kBAAA,GAACvE,QAAQ,CAACiB,OAAO,cAAAsD,kBAAA,GAAhBA,kBAAA,CAAkBE,aAAa,aAA/BF,kBAAA,CAAiCG,aAAa,CAAC,oBAAoB,CAAC;MACtFnE,SAAS,CAACiE,QAAQ,CAAC;;MAEnBnB,UAAU,CAAC,CAAC;;MAEZ5C,OAAO,YAAPA,OAAO,CAAG6D,CAAC,CAAC;IACd;;IAEA,SAASN,WAAWA,CAACM,CAAqC,EAAE;MAC1DK,UAAU,CAACxD,YAAY,CAAC;;MAExBjB,OAAO,CAACe,OAAO,GAAG,IAAI;;MAEtBP,OAAO,YAAPA,OAAO,CAAG4D,CAAC,CAAC;IACd;;IAEA,SAASL,UAAUA,CAACK,CAAqC,EAAE;MACzDnD,YAAY,CAAC,CAAC;;MAEdjB,OAAO,CAACe,OAAO,GAAG,KAAK;;MAEvBN,MAAM,YAANA,MAAM,CAAG2D,CAAC,CAAC;IACb;;IAEA,SAASnD,YAAYA,CAAA,EAAG;MACtBwD,UAAU,CAAC,YAAM,KAAAC,kBAAA;QACfrE,SAAS,CAAC,GAAAqE,kBAAA,GAAC5E,QAAQ,CAACiB,OAAO,cAAA2D,kBAAA,GAAhBA,kBAAA,CAAkBH,aAAa,aAA/BG,kBAAA,CAAiCF,aAAa,CAAC,oBAAoB,CAAC,EAAC;MAClF,CAAC,CAAC;IACJ;EACF;AACF,CAAC","ignoreList":[]}

package/components/MaskedInput/ColorableInputElement/ColorableInputElement/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/MaskedInput/ColorableInputElement/ColorableInputElement.js",
+  "module": "ColorableInputElement",
+  "types": "../ColorableInputElement.d.ts",
+  "sideEffects": false
+}

package/components/MaskedInput/ColorableInputElement/ColorableInputElement.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputElement, InputElementProps } from '../../Input';
+export type ColorableInputElementProps = InputElementProps & {
+    showOnFocus?: boolean;
+    children: React.ReactElement;
+};
+export declare const ColorableInputElement: import("../../../lib/forwardRefAndName").ReactUIComponentWithRef<InputElement, ColorableInputElementProps> & Record<never, never>;

package/components/MaskedInput/ColorableInputElement/ColorableInputElement.styles/ColorableInputElement.styles.js

@@ -0,0 +1,7 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+var _templateObject;
+import { injectGlobal, prefix } from "../../../../lib/theming/Emotion";
+export var globalClasses = prefix('colorable')({
+  input: 'input'
+});
+injectGlobal(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  input.", " {\n    display: inline-block;\n    background-color: transparent;\n    background-size: 100%;\n    background-repeat: repeat;\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n"])), globalClasses.input);

package/components/MaskedInput/ColorableInputElement/ColorableInputElement.styles/ColorableInputElement.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["injectGlobal","prefix","globalClasses","input","_templateObject","_taggedTemplateLiteralLoose"],"sources":["ColorableInputElement.styles.ts"],"sourcesContent":["import { injectGlobal, prefix } from '../../../lib/theming/Emotion';\n\nexport const globalClasses = prefix('colorable')({\n  input: 'input',\n});\n\ninjectGlobal`\n  input.${globalClasses.input} {\n    display: inline-block;\n    background-color: transparent;\n    background-size: 100%;\n    background-repeat: repeat;\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n  }\n`;\n"],"mappings":"oHAAA,SAASA,YAAY,EAAEC,MAAM,QAAQ,8BAA8B;;AAEnE,OAAO,IAAMC,aAAa,GAAGD,MAAM,CAAC,WAAW,CAAC,CAAC;EAC/CE,KAAK,EAAE;AACT,CAAC,CAAC;;AAEFH,YAAY,CAAAI,eAAA,KAAAA,eAAA,GAAAC,2BAAA;AACFH,aAAa,CAACC,KAAK","ignoreList":[]}

package/components/MaskedInput/ColorableInputElement/ColorableInputElement.styles/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/MaskedInput/ColorableInputElement/ColorableInputElement.styles.js",
+  "module": "ColorableInputElement.styles",
+  "types": "../ColorableInputElement.styles.d.ts",
+  "sideEffects": false
+}

package/components/MaskedInput/ColorableInputElement/ColorableInputElement.styles.d.ts

@@ -0,0 +1,3 @@
+export declare const globalClasses: {
+    input: string;
+};

package/components/MaskedInput/ColorableInputElement/index/index.js

@@ -0,0 +1 @@
+export * from "../ColorableInputElement";

package/components/MaskedInput/ColorableInputElement/index/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from './ColorableInputElement';\n"],"mappings":"AAAA,cAAc,yBAAyB","ignoreList":[]}

package/components/MaskedInput/ColorableInputElement/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/MaskedInput/ColorableInputElement/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/components/MaskedInput/ColorableInputElement/index.d.ts

@@ -0,0 +1 @@
+export * from './ColorableInputElement';

package/components/MaskedInput/ColorableInputElement/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MaskedInput/ColorableInputElement/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/MaskedInput/FixedIMaskInput/FixedIMaskInput.js

@@ -0,0 +1,197 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["inputRef"];
+import React, { useEffect, useImperativeHandle, useRef } from 'react';
+import { IMaskInput } from 'react-imask';
+import { forwardRefAndName } from "../../../lib/forwardRefAndName";
+import { isKeyArrow, isKeyArrowHorizontal, isKeyArrowLeft, isKeyArrowUp, isKeyEnd, isKeyHome, isModShift, isShortcutJumpCaret, isShortcutSelectAll, someKeys } from "../../../lib/events/keyboard/identifiers";
+import { MouseDrag } from "../../../lib/events/MouseDrag";
+export var FixedIMaskInput = forwardRefAndName('FixedIMaskInput', function FixedIMaskInput(props, ref) {
+  var inputRef = props.inputRef,
+    restProps = _objectWithoutPropertiesLoose(props, _excluded);
+  var imaskRef = useRef(null);
+  var focused = useRef(false);
+  useEffect(function () {
+    var _imaskRef$current;
+    if ((_imaskRef$current = imaskRef.current) != null && _imaskRef$current.element) {
+      fillTypedValue();
+      var mouseDrag = MouseDrag.listen(imaskRef.current.element).onMouseDragEnd(function (e) {
+        var _imaskRef$current2, _imaskRef$current3;
+        var direction = 'none';
+        if (mouseDrag.mouseDragStartEvent && ((_imaskRef$current2 = imaskRef.current) == null ? void 0 : _imaskRef$current2.element.selectionStart) !== ((_imaskRef$current3 = imaskRef.current) == null ? void 0 : _imaskRef$current3.element.selectionEnd)) {
+          direction = mouseDrag.mouseDragStartEvent.pageX > e.pageX ? 'backward' : 'forward';
+        }
+        var _getSelection = getSelection(),
+          start = _getSelection[0],
+          end = _getSelection[1];
+        setSelection(start, end, direction);
+      });
+    }
+  }, []);
+  useImperativeHandle(ref, function () {
+    return imaskRef.current;
+  }, []);
+  return /*#__PURE__*/(
+    React.createElement(IMaskInput, _extends({}, restProps, {
+      ref: imaskRef,
+      inputRef: inputRef,
+      onKeyDown: handleKeyDown,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onMouseUp: handleMouseUp,
+      onAccept: handleAccept,
+      onInput: handleInput
+    }))
+  );
+  function getTypedValue() {
+    var _imaskRef$current4;
+    var _ref = ((_imaskRef$current4 = imaskRef.current) == null ? void 0 : _imaskRef$current4.maskRef.masked) || {},
+      _ref$_value = _ref._value,
+      _value = _ref$_value === void 0 ? '' : _ref$_value,
+      _ref$displayValue = _ref.displayValue,
+      displayValue = _ref$displayValue === void 0 ? '' : _ref$displayValue;
+    var end = getMaxCaretPosition();
+    var value = _value !== '' || focused.current === true ? displayValue : '';
+    return value.slice(0, end);
+  }
+  function fillTypedValue() {
+    var _imaskRef$current5, _imaskRef$current6, _imaskRef$current7;
+    (_imaskRef$current5 = imaskRef.current) == null || _imaskRef$current5.element.setAttribute('data-typed-value', getTypedValue());
+    (_imaskRef$current6 = imaskRef.current) == null || _imaskRef$current6.element.setAttribute('data-unmasked-value', (_imaskRef$current7 = imaskRef.current) == null ? void 0 : _imaskRef$current7.maskRef.unmaskedValue);
+  }
+  function getMaxCaretPosition() {
+    var maskChars = [];
+    if (imaskRef.current) {
+      maskChars.push(imaskRef.current.maskRef.masked.placeholderChar);
+      if (imaskRef.current.maskRef.masked.blocks) {
+        Object.values(imaskRef.current.maskRef.masked.blocks).forEach(function (_ref2) {
+          var placeholderChar = _ref2.placeholderChar;
+          return placeholderChar && maskChars.push(placeholderChar);
+        });
+      }
+      return imaskRef.current.element.value.split(new RegExp(maskChars.join('|')))[0].length;
+    }
+    return Infinity;
+  }
+  function normalizeSelection() {
+    var _getSelection2 = getSelection(),
+      start = _getSelection2[0],
+      end = _getSelection2[1];
+    var max = getMaxCaretPosition();
+    if (end > max) {
+      setSelection(start, max);
+    }
+  }
+  function getNormalizedRange(calc) {
+    return typeof calc === 'number' ? Math.min(getMaxCaretPosition(), Math.max(0, calc)) : 0;
+  }
+  function getSelection() {
+    if (imaskRef.current) {
+      return [imaskRef.current.element.selectionStart || 0, imaskRef.current.element.selectionEnd || 0, imaskRef.current.element.selectionDirection || 'none'];
+    }
+    return [0, 0, 'none'];
+  }
+  function setSelection() {
+    var _imaskRef$current8;
+    for (var _len = arguments.length, _ref3 = new Array(_len), _key = 0; _key < _len; _key++) {
+      _ref3[_key] = arguments[_key];
+    }
+    var start = _ref3[0],
+      end = _ref3[1],
+      direction = _ref3[2];
+    (_imaskRef$current8 = imaskRef.current) == null || _imaskRef$current8.element.setSelectionRange(getNormalizedRange(start), getNormalizedRange(end), direction || 'none');
+  }
+  function jumpCaret(prev, headDirection) {
+    var _imaskRef$current9;
+    var word = /а-яa-z0-9_/.valueOf();
+    var wordRegExp = new RegExp("([" + word + "])+[\\s]*|([^" + word + "])+", 'gi');
+    var next = headDirection === 'right' ? prev : 0;
+    (_imaskRef$current9 = imaskRef.current) == null || (_imaskRef$current9 = _imaskRef$current9.element.value.match(wordRegExp)) == null || _imaskRef$current9.reduce(function (s, a) {
+      var pos = a.length + (s.slice(-1)[0] || 0);
+      if (headDirection === 'right' && next === prev && next < pos) {
+        next = getNormalizedRange(pos);
+      } else if (headDirection === 'left' && prev > pos) {
+        next = getNormalizedRange(pos);
+      }
+      return [].concat(s, [pos]);
+    }, []);
+    return next;
+  }
+
+  /**
+   * Вычислят положение каретки при управлении клавишами
+   * @param e
+   */
+  function calcSelection(e) {
+    var _getSelection3 = getSelection(),
+      start = _getSelection3[0],
+      end = _getSelection3[1],
+      direction = _getSelection3[2];
+    var isSelectionMode = isModShift()(e);
+    var tail = start !== end && direction === 'backward' ? end : start;
+    var head = start !== end && direction === 'backward' ? start : end;
+    var headDirection = someKeys(isKeyArrowLeft, isKeyArrowUp, isKeyHome)(e) ? 'left' : 'right';
+    var step = isKeyArrowHorizontal(e) ? 1 : Infinity;
+    var increment = headDirection === 'left' ? -step : step;
+    if (isShortcutJumpCaret(e)) {
+      head = jumpCaret(head, headDirection);
+    } else if (head !== tail && !isSelectionMode && isKeyArrowHorizontal(e)) {
+      head = headDirection === 'right' ? Math.max(tail, head) : Math.min(tail, head);
+    } else {
+      head = head + increment;
+    }
+    if (isSelectionMode) {
+      var _start = Math.min(tail, head);
+      var _end = Math.max(tail, head);
+      return [getNormalizedRange(_start), getNormalizedRange(_end), _end === head ? 'forward' : 'backward'];
+    }
+    tail = head;
+    return [getNormalizedRange(tail), getNormalizedRange(head), 'none'];
+  }
+  function handleMouseUp(e) {
+    normalizeSelection();
+    props.onMouseUp == null || props.onMouseUp(e);
+  }
+  function handleFocus(e) {
+    focused.current = true;
+    fillTypedValue();
+    setTimeout(normalizeSelection);
+    props.onFocus == null || props.onFocus(e);
+  }
+  function handleBlur(e) {
+    focused.current = false;
+    fillTypedValue();
+    props.onBlur == null || props.onBlur(e);
+  }
+  function handleAccept() {
+    fillTypedValue();
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+    props.onAccept == null || props.onAccept.apply(props, args);
+  }
+  function handleInput(e) {
+    var _imaskRef$current10;
+    var maskRef = (_imaskRef$current10 = imaskRef.current) == null ? void 0 : _imaskRef$current10.maskRef;
+    if (restProps.unmask && maskRef && maskRef.rawInputValue === '' && maskRef.unmaskedValue !== '') {
+      // Для случаев, когда в value остаются только зафиксированные - {} - очищаем value полностью
+      props.onAccept == null || props.onAccept('', maskRef, e.nativeEvent);
+    }
+    props.onInput == null || props.onInput(e);
+  }
+  function handleKeyDown(e) {
+    var nearest = getMaxCaretPosition();
+    if (isShortcutSelectAll(e)) {
+      e.preventDefault();
+      setSelection(0, nearest);
+    } else if (isKeyArrow(e) || isKeyEnd(e) || isKeyHome(e)) {
+      e.preventDefault();
+      var _calcSelection = calcSelection(e),
+        start = _calcSelection[0],
+        end = _calcSelection[1],
+        direction = _calcSelection[2];
+      setSelection(start, end, direction);
+    }
+    props.onKeyDown == null || props.onKeyDown(e);
+  }
+});

package/components/MaskedInput/FixedIMaskInput/FixedIMaskInput.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useImperativeHandle","useRef","IMaskInput","forwardRefAndName","isKeyArrow","isKeyArrowHorizontal","isKeyArrowLeft","isKeyArrowUp","isKeyEnd","isKeyHome","isModShift","isShortcutJumpCaret","isShortcutSelectAll","someKeys","MouseDrag","FixedIMaskInput","props","ref","inputRef","restProps","_objectWithoutPropertiesLoose","_excluded","imaskRef","focused","_imaskRef$current","current","element","fillTypedValue","mouseDrag","listen","onMouseDragEnd","e","_imaskRef$current2","_imaskRef$current3","direction","mouseDragStartEvent","selectionStart","selectionEnd","pageX","_getSelection","getSelection","start","end","setSelection","createElement","_extends","onKeyDown","handleKeyDown","onFocus","handleFocus","onBlur","handleBlur","onMouseUp","handleMouseUp","onAccept","handleAccept","onInput","handleInput","getTypedValue","_imaskRef$current4","_ref","maskRef","masked","_ref$_value","_value","_ref$displayValue","displayValue","getMaxCaretPosition","value","slice","_imaskRef$current5","_imaskRef$current6","_imaskRef$current7","setAttribute","unmaskedValue","maskChars","push","placeholderChar","blocks","Object","values","forEach","_ref2","split","RegExp","join","length","Infinity","normalizeSelection","_getSelection2","max","getNormalizedRange","calc","Math","min","selectionDirection","_imaskRef$current8","_len","arguments","_ref3","Array","_key","setSelectionRange","jumpCaret","prev","headDirection","_imaskRef$current9","word","valueOf","wordRegExp","next","match","reduce","s","a","pos","concat","calcSelection","_getSelection3","isSelectionMode","tail","head","step","increment","setTimeout","_len2","args","_key2","apply","_imaskRef$current10","unmask","rawInputValue","nativeEvent","nearest","preventDefault","_calcSelection"],"sources":["FixedIMaskInput.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useRef } from 'react';\nimport { InputMask, MaskedPatternOptions } from 'imask';\nimport { IMaskInput, IMaskInputProps } from 'react-imask';\n\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport {\n  isKeyArrow,\n  isKeyArrowHorizontal,\n  isKeyArrowLeft,\n  isKeyArrowUp,\n  isKeyEnd,\n  isKeyHome,\n  isModShift,\n  isShortcutJumpCaret,\n  isShortcutSelectAll,\n  someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { MouseDrag } from '../../lib/events/MouseDrag';\n\nexport type FixedIMaskInputProps = IMaskInputProps<HTMLInputElement>;\n\ntype HeadDirection = 'left' | 'right';\ntype SelectionDirection = 'forward' | 'backward' | 'none';\ntype SelectionSet = [number, number, SelectionDirection];\n\ninterface IMaskRefType {\n  maskRef: InputMask<MaskedPatternOptions>;\n  element: HTMLInputElement;\n}\n\nexport const FixedIMaskInput = forwardRefAndName(\n  'FixedIMaskInput',\n  function FixedIMaskInput(props: FixedIMaskInputProps, ref: React.Ref<IMaskRefType | null>) {\n    const { inputRef, ...restProps } = props;\n    const imaskRef = useRef<IMaskRefType>(null);\n    const focused = useRef(false);\n\n    useEffect(() => {\n      if (imaskRef.current?.element) {\n        fillTypedValue();\n        const mouseDrag = MouseDrag.listen(imaskRef.current.element).onMouseDragEnd((e) => {\n          let direction: SelectionDirection = 'none';\n\n          if (\n            mouseDrag.mouseDragStartEvent &&\n            imaskRef.current?.element.selectionStart !== imaskRef.current?.element.selectionEnd\n          ) {\n            direction = mouseDrag.mouseDragStartEvent.pageX > e.pageX ? 'backward' : 'forward';\n          }\n\n          const [start, end] = getSelection();\n          setSelection(start, end, direction);\n        });\n      }\n    }, []);\n\n    useImperativeHandle(ref, () => imaskRef.current, []);\n\n    return (\n      <IMaskInput\n        {...restProps}\n        ref={imaskRef}\n        inputRef={inputRef}\n        onKeyDown={handleKeyDown}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onMouseUp={handleMouseUp}\n        onAccept={handleAccept}\n        onInput={handleInput}\n      />\n    );\n\n    function getTypedValue() {\n      const { _value = '', displayValue = '' } = imaskRef.current?.maskRef.masked || {};\n      const end = getMaxCaretPosition();\n      const value = _value !== '' || focused.current === true ? displayValue : '';\n\n      return value.slice(0, end);\n    }\n\n    function fillTypedValue() {\n      imaskRef.current?.element.setAttribute('data-typed-value', getTypedValue());\n      imaskRef.current?.element.setAttribute('data-unmasked-value', imaskRef.current?.maskRef.unmaskedValue);\n    }\n\n    function getMaxCaretPosition(): number {\n      const maskChars = [];\n      if (imaskRef.current) {\n        maskChars.push(imaskRef.current.maskRef.masked.placeholderChar);\n        if (imaskRef.current.maskRef.masked.blocks) {\n          (Object.values(imaskRef.current.maskRef.masked.blocks) as Array<{ placeholderChar?: string }>).forEach(\n            ({ placeholderChar }) => placeholderChar && maskChars.push(placeholderChar),\n          );\n        }\n        return imaskRef.current.element.value.split(new RegExp(maskChars.join('|')))[0].length;\n      }\n\n      return Infinity;\n    }\n\n    function normalizeSelection() {\n      const [start, end] = getSelection();\n      const max = getMaxCaretPosition();\n      if (end > max) {\n        setSelection(start, max);\n      }\n    }\n\n    function getNormalizedRange(calc: number | unknown) {\n      return typeof calc === 'number' ? Math.min(getMaxCaretPosition(), Math.max(0, calc)) : 0;\n    }\n\n    function getSelection(): SelectionSet {\n      if (imaskRef.current) {\n        return [\n          imaskRef.current.element.selectionStart || 0,\n          imaskRef.current.element.selectionEnd || 0,\n          imaskRef.current.element.selectionDirection || 'none',\n        ];\n      }\n      return [0, 0, 'none'];\n    }\n\n    function setSelection(...[start, end, direction]: Parameters<HTMLInputElement['setSelectionRange']>) {\n      imaskRef.current?.element.setSelectionRange(\n        getNormalizedRange(start),\n        getNormalizedRange(end),\n        direction || 'none',\n      );\n    }\n\n    function jumpCaret(prev: number, headDirection: HeadDirection) {\n      const word = /а-яa-z0-9_/.valueOf();\n      const wordRegExp = new RegExp(`([${word}])+[\\\\s]*|([^${word}])+`, 'gi');\n      let next = headDirection === 'right' ? prev : 0;\n      imaskRef.current?.element.value.match(wordRegExp)?.reduce<number[]>((s, a) => {\n        const pos = a.length + (s.slice(-1)[0] || 0);\n        if (headDirection === 'right' && next === prev && next < pos) {\n          next = getNormalizedRange(pos);\n        } else if (headDirection === 'left' && prev > pos) {\n          next = getNormalizedRange(pos);\n        }\n        return [...s, pos];\n      }, []);\n      return next;\n    }\n\n    /**\n     * Вычислят положение каретки при управлении клавишами\n     * @param e\n     */\n    function calcSelection(e: React.KeyboardEvent<HTMLInputElement>): SelectionSet {\n      const [start, end, direction] = getSelection();\n      const isSelectionMode = isModShift()(e);\n      let tail = start !== end && direction === 'backward' ? end : start;\n      let head = start !== end && direction === 'backward' ? start : end;\n      const headDirection: HeadDirection = someKeys(isKeyArrowLeft, isKeyArrowUp, isKeyHome)(e) ? 'left' : 'right';\n      const step = isKeyArrowHorizontal(e) ? 1 : Infinity;\n      const increment = headDirection === 'left' ? -step : step;\n      if (isShortcutJumpCaret(e)) {\n        head = jumpCaret(head, headDirection);\n      } else if (head !== tail && !isSelectionMode && isKeyArrowHorizontal(e)) {\n        head = headDirection === 'right' ? Math.max(tail, head) : Math.min(tail, head);\n      } else {\n        head = head + increment;\n      }\n      if (isSelectionMode) {\n        const start = Math.min(tail, head);\n        const end = Math.max(tail, head);\n        return [getNormalizedRange(start), getNormalizedRange(end), end === head ? 'forward' : 'backward'];\n      }\n      tail = head;\n      return [getNormalizedRange(tail), getNormalizedRange(head), 'none'];\n    }\n\n    function handleMouseUp(e: React.MouseEvent<HTMLInputElement>) {\n      normalizeSelection();\n\n      props.onMouseUp?.(e);\n    }\n\n    function handleFocus(e: React.FocusEvent<HTMLInputElement>) {\n      focused.current = true;\n      fillTypedValue();\n\n      setTimeout(normalizeSelection);\n\n      props.onFocus?.(e);\n    }\n\n    function handleBlur(e: React.FocusEvent<HTMLInputElement>) {\n      focused.current = false;\n      fillTypedValue();\n\n      props.onBlur?.(e);\n    }\n\n    function handleAccept(...args: Parameters<Required<IMaskInputProps<HTMLInputElement>>['onAccept']>) {\n      fillTypedValue();\n\n      props.onAccept?.(...args);\n    }\n\n    function handleInput(e: React.ChangeEvent<HTMLInputElement>) {\n      const maskRef = imaskRef.current?.maskRef;\n      if (restProps.unmask && maskRef && maskRef.rawInputValue === '' && maskRef.unmaskedValue !== '') {\n        // Для случаев, когда в value остаются только зафиксированные - {} - очищаем value полностью\n        props.onAccept?.('', maskRef, e.nativeEvent as InputEvent);\n      }\n\n      props.onInput?.(e);\n    }\n\n    function handleKeyDown(e: React.KeyboardEvent<HTMLInputElement>) {\n      const nearest = getMaxCaretPosition();\n      if (isShortcutSelectAll(e)) {\n        e.preventDefault();\n        setSelection(0, nearest);\n      } else if (isKeyArrow(e) || isKeyEnd(e) || isKeyHome(e)) {\n        e.preventDefault();\n        const [start, end, direction] = calcSelection(e);\n        setSelection(start, end, direction);\n      }\n\n      props.onKeyDown?.(e);\n    }\n  },\n);\n"],"mappings":"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","ignoreList":[]}

package/components/MaskedInput/FixedIMaskInput/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MaskedInput/FixedIMaskInput.js",
+  "module": "FixedIMaskInput",
+  "types": "../FixedIMaskInput.d.ts",
+  "sideEffects": false
+}

package/components/MaskedInput/FixedIMaskInput.d.ts

@@ -0,0 +1,9 @@
+import { InputMask, MaskedPatternOptions } from 'imask';
+import { IMaskInputProps } from 'react-imask';
+export type FixedIMaskInputProps = IMaskInputProps<HTMLInputElement>;
+interface IMaskRefType {
+    maskRef: InputMask<MaskedPatternOptions>;
+    element: HTMLInputElement;
+}
+export declare const FixedIMaskInput: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<IMaskRefType, FixedIMaskInputProps> & Record<never, never>;
+export {};