@skbkontur/react-ui 6.1.4-4e59f.0 → 6.1.4-5ebac.0

package/components/MaskedInputV2/MaskedInputV2.styles.js

@@ -0,0 +1,19 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { UI_FONT_NAME, injectGlobalFont } from '../../lib/styles/UiFont.js';
+import { memoizeGetStyles, prefix } from '../../lib/theming/Emotion.js';
+export var globalClasses = prefix('masked-input-v2')({
+    root: 'root',
+});
+export var getStyles = memoizeGetStyles(function (emotion) {
+    injectGlobalFont(emotion);
+    return {
+        root: function (t) {
+            return emotion.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        font-family: ", ", ", ";\n        font-variant-numeric: tabular-nums;\n      "], ["\n        font-family: ", ", ", ";\n        font-variant-numeric: tabular-nums;\n      "])), UI_FONT_NAME, t.baseFontFamily);
+        },
+    };
+});
+var templateObject_1;
+//# sourceMappingURL=MaskedInputV2.styles.js.map

package/components/MaskedInputV2/MaskedInputV2.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInputV2.styles.js","sourceRoot":"","sources":["MaskedInputV2.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AAGxE,MAAM,CAAC,IAAM,aAAa,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IACrD,IAAI,EAAE,MAAM;CACb,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,OAAgB;IACzD,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAC1B,OAAO;QACL,IAAI,YAAC,CAAQ;YACX,OAAO,OAAO,CAAC,GAAG,4JAAA,yBACD,EAAY,IAAK,EAAgB,wDAEjD,KAFgB,YAAY,EAAK,CAAC,CAAC,cAAc,EAEhD;QACJ,CAAC;KACF,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { UI_FONT_NAME, injectGlobalFont } from '../../lib/styles/UiFont.js';\nimport { memoizeGetStyles, prefix } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const globalClasses = prefix('masked-input-v2')({\n  root: 'root',\n});\n\nexport const getStyles = memoizeGetStyles((emotion: Emotion) => {\n  injectGlobalFont(emotion);\n  return {\n    root(t: Theme) {\n      return emotion.css`\n        font-family: ${UI_FONT_NAME}, ${t.baseFontFamily};\n        font-variant-numeric: tabular-nums;\n      `;\n    },\n  };\n});\n"]}

package/components/MaskedInputV2/index.d.ts

@@ -0,0 +1 @@
+export { MaskedInputV2, getSafeMaskInputType, type MaskedInputV2Props, type MaskedInputV2OnBeforePasteValue, type MaskInputType, } from './MaskedInputV2.js';

package/components/MaskedInputV2/index.js

@@ -0,0 +1,2 @@
+export { MaskedInputV2, getSafeMaskInputType, } from './MaskedInputV2.js';
+//# sourceMappingURL=index.js.map

package/components/MaskedInputV2/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,oBAAoB,GAIrB,MAAM,oBAAoB,CAAC","sourcesContent":["export {\n  MaskedInputV2,\n  getSafeMaskInputType,\n  type MaskedInputV2Props,\n  type MaskedInputV2OnBeforePasteValue,\n  type MaskInputType,\n} from './MaskedInputV2.js';\n"]}

package/components/MaskedInputV2/internal/MaskOverlay.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+interface MaskOverlayProps {
+    typedValue: string;
+    displayValue: string;
+    selectionStart: number;
+    selectionEnd: number;
+    disabled?: boolean;
+    textAlign?: React.CSSProperties['textAlign'];
+    containerRef?: React.RefObject<HTMLSpanElement | null>;
+    colored?: boolean;
+}
+/**
+ * Абсолютно позиционированный слой над <input>.
+ * Input делается прозрачным (color: transparent), а весь текст
+ * (typedValue + maskPart) рендерится здесь с раскраской.
+ * При center/right align overlay выравнивает маску, а input смещается paddingLeft.
+ */
+export declare function MaskOverlay({ typedValue, displayValue, selectionStart, selectionEnd, disabled, textAlign, containerRef, colored, }: MaskOverlayProps): React.JSX.Element | null;
+export {};

package/components/MaskedInputV2/internal/MaskOverlay.js

@@ -0,0 +1,54 @@
+import { cx } from '@emotion/css';
+import React, { useContext } from 'react';
+import { useStyles } from '../../../lib/renderEnvironment/index.js';
+import { ThemeContext } from '../../../lib/theming/ThemeContext.js';
+import { getStyles, globalClasses } from './MaskedInternal.styles.js';
+function splitTextBySelection(text, textStartOffset, selectionStart, selectionEnd) {
+    if (selectionStart === selectionEnd) {
+        return [text, '', ''];
+    }
+    var localStart = Math.max(0, selectionStart - textStartOffset);
+    var localEnd = Math.min(text.length, selectionEnd - textStartOffset);
+    if (localEnd <= localStart) {
+        return [text, '', ''];
+    }
+    return [text.slice(0, localStart), text.slice(localStart, localEnd), text.slice(localEnd)];
+}
+/**
+ * Абсолютно позиционированный слой над <input>.
+ * Input делается прозрачным (color: transparent), а весь текст
+ * (typedValue + maskPart) рендерится здесь с раскраской.
+ * При center/right align overlay выравнивает маску, а input смещается paddingLeft.
+ */
+export function MaskOverlay(_a) {
+    var typedValue = _a.typedValue, displayValue = _a.displayValue, selectionStart = _a.selectionStart, selectionEnd = _a.selectionEnd, disabled = _a.disabled, textAlign = _a.textAlign, containerRef = _a.containerRef, _b = _a.colored, colored = _b === void 0 ? true : _b;
+    var theme = useContext(ThemeContext);
+    var styles = useStyles(getStyles);
+    var maskPart = displayValue.slice(typedValue.length);
+    var disabledClass = disabled && globalClasses.disabled;
+    var coloredClass = colored && globalClasses.colored;
+    var selectedSegmentClass = styles.selectedSegment();
+    if (!typedValue && !maskPart) {
+        return null;
+    }
+    function renderSegment(text, offset, segmentClassName) {
+        var _a = splitTextBySelection(text, offset, selectionStart, selectionEnd), before = _a[0], selected = _a[1], after = _a[2];
+        return (React.createElement(React.Fragment, null,
+            before ? React.createElement("span", { className: segmentClassName }, before) : null,
+            selected ? React.createElement("span", { className: selectedSegmentClass }, selected) : null,
+            after ? React.createElement("span", { className: segmentClassName }, after) : null));
+    }
+    return (React.createElement("span", { ref: containerRef, "aria-hidden": "true", className: styles.overlay() },
+        React.createElement("span", { "data-tid": "masked-input-overlay", style: {
+                display: 'inline-block',
+                width: '100%',
+                whiteSpace: 'nowrap',
+                textAlign: textAlign,
+                lineHeight: 'inherit',
+            } },
+            typedValue ? renderSegment(typedValue, 0, cx(styles.typed(theme), disabledClass, coloredClass)) : null,
+            maskPart
+                ? renderSegment(maskPart, typedValue.length, cx(styles.mask(theme), disabledClass, coloredClass))
+                : null)));
+}
+//# sourceMappingURL=MaskOverlay.js.map

package/components/MaskedInputV2/internal/MaskOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskOverlay.js","sourceRoot":"","sources":["MaskOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cx } from '@emotion/css';\nimport React, { useContext } from 'react';\n\nimport { useStyles } from '../../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext.js';\nimport { getStyles, globalClasses } from './MaskedInternal.styles.js';\n\ninterface MaskOverlayProps {\n  typedValue: string;\n  displayValue: string;\n  selectionStart: number;\n  selectionEnd: number;\n  disabled?: boolean;\n  textAlign?: React.CSSProperties['textAlign'];\n  containerRef?: React.RefObject<HTMLSpanElement | null>;\n  colored?: boolean;\n}\n\nfunction splitTextBySelection(\n  text: string,\n  textStartOffset: number,\n  selectionStart: number,\n  selectionEnd: number,\n): [string, string, string] {\n  if (selectionStart === selectionEnd) {\n    return [text, '', ''];\n  }\n\n  const localStart = Math.max(0, selectionStart - textStartOffset);\n  const localEnd = Math.min(text.length, selectionEnd - textStartOffset);\n\n  if (localEnd <= localStart) {\n    return [text, '', ''];\n  }\n\n  return [text.slice(0, localStart), text.slice(localStart, localEnd), text.slice(localEnd)];\n}\n\n/**\n * Абсолютно позиционированный слой над <input>.\n * Input делается прозрачным (color: transparent), а весь текст\n * (typedValue + maskPart) рендерится здесь с раскраской.\n * При center/right align overlay выравнивает маску, а input смещается paddingLeft.\n */\nexport function MaskOverlay({\n  typedValue,\n  displayValue,\n  selectionStart,\n  selectionEnd,\n  disabled,\n  textAlign,\n  containerRef,\n  colored = true,\n}: MaskOverlayProps) {\n  const theme = useContext(ThemeContext);\n  const styles = useStyles(getStyles);\n  const maskPart = displayValue.slice(typedValue.length);\n\n  const disabledClass = disabled && globalClasses.disabled;\n  const coloredClass = colored && globalClasses.colored;\n  const selectedSegmentClass = styles.selectedSegment();\n\n  if (!typedValue && !maskPart) {\n    return null;\n  }\n\n  function renderSegment(text: string, offset: number, segmentClassName: string) {\n    const [before, selected, after] = splitTextBySelection(text, offset, selectionStart, selectionEnd);\n\n    return (\n      <>\n        {before ? <span className={segmentClassName}>{before}</span> : null}\n        {selected ? <span className={selectedSegmentClass}>{selected}</span> : null}\n        {after ? <span className={segmentClassName}>{after}</span> : null}\n      </>\n    );\n  }\n\n  return (\n    <span ref={containerRef} aria-hidden=\"true\" className={styles.overlay()}>\n      <span\n        data-tid=\"masked-input-overlay\"\n        style={{\n          display: 'inline-block',\n          width: '100%',\n          whiteSpace: 'nowrap',\n          textAlign,\n          lineHeight: 'inherit',\n        }}\n      >\n        {typedValue ? renderSegment(typedValue, 0, cx(styles.typed(theme), disabledClass, coloredClass)) : null}\n        {maskPart\n          ? renderSegment(maskPart, typedValue.length, cx(styles.mask(theme), disabledClass, coloredClass))\n          : null}\n      </span>\n    </span>\n  );\n}\n"]}

package/components/MaskedInputV2/internal/MaskedCore.d.ts

@@ -0,0 +1,8 @@
+import type { InputElement } from '../../Input/Input.typings.js';
+import type { MaskedCoreProps } from './MaskedCore.types.js';
+export type { MaskedCoreProps } from './MaskedCore.types.js';
+/**
+ * Headless-слой MaskedInputV2: прозрачный `<input>` для ввода и {@link MaskOverlay} для отображения маски.
+ * Управляется через {@link useMaskedCoreHandlers}.
+ */
+export declare const MaskedCore: import("../../../lib/forwardRefAndName.js").ReactUIComponentWithRef<InputElement | null, MaskedCoreProps> & Record<never, never>;

package/components/MaskedInputV2/internal/MaskedCore.js

@@ -0,0 +1,186 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { cx } from '@emotion/css';
+import React, { useCallback, useContext, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState, } from 'react';
+import { forwardRefAndName } from '../../../lib/forwardRefAndName.js';
+import { useGlobal, useStyles } from '../../../lib/renderEnvironment/index.js';
+import { scrollInputCaretIntoView } from '../../../lib/scrollInputCaretIntoView.js';
+import { ThemeContext } from '../../../lib/theming/ThemeContext.js';
+import { needsMaskAlignPadding } from './computeMaskAlignPadding.js';
+import { getStyles, globalClasses } from './MaskedInternal.styles.js';
+import { MaskOverlay } from './MaskOverlay.js';
+import { setMaskInputSelectionRange } from './setMaskInputSelectionRange.js';
+import { getShowOverlay } from './showOverlay.js';
+import { useInputOverflow } from './useInputOverflow.js';
+import { useMaskAlignPadding } from './useMaskAlignPadding.js';
+import { useMaskedCoreHandlers } from './useMaskedCoreHandlers.js';
+/**
+ * Headless-слой MaskedInputV2: прозрачный `<input>` для ввода и {@link MaskOverlay} для отображения маски.
+ * Управляется через {@link useMaskedCoreHandlers}.
+ */
+export var MaskedCore = forwardRefAndName('MaskedCore', function MaskedCore(props, ref) {
+    var _a, _b;
+    var maskState = props.maskState, slotMap = props.slotMap, engine = props.engine, focused = props.focused, currentRaw = props.currentRaw, onRawChange = props.onRawChange, onUnexpectedInput = props.onUnexpectedInput, onUndo = props.onUndo, onRedo = props.onRedo, coreInputRef = props.coreInputRef, _c = props.colored, colored = _c === void 0 ? true : _c, selectAllOnFocus = props.selectAllOnFocus, externalSelectionIntent = props.selectionIntent, onSelectionIntentChange = props.onSelectionIntentChange, onKeyDown = props.onKeyDown, onMouseUp = props.onMouseUp, onInput = props.onInput, onSelect = props.onSelect, onFocus = props.onFocus, onPaste = props.onPaste, onBlur = props.onBlur, placeholder = props.placeholder, className = props.className, disabled = props.disabled, rest = __rest(props, ["maskState", "slotMap", "engine", "focused", "currentRaw", "onRawChange", "onUnexpectedInput", "onUndo", "onRedo", "coreInputRef", "colored", "selectAllOnFocus", "selectionIntent", "onSelectionIntentChange", "onKeyDown", "onMouseUp", "onInput", "onSelect", "onFocus", "onPaste", "onBlur", "placeholder", "className", "disabled"]);
+    var styles = useStyles(getStyles);
+    var globalObject = useGlobal();
+    var overlayRef = useRef(null);
+    var theme = useContext(ThemeContext);
+    var textAlign = (_a = rest.style) === null || _a === void 0 ? void 0 : _a.textAlign;
+    var _d = useState(null), internalSelectionIntent = _d[0], setInternalSelectionIntent = _d[1];
+    var selectionIntent = externalSelectionIntent === undefined ? internalSelectionIntent : externalSelectionIntent;
+    var selectionIntentRef = useRef(selectionIntent);
+    selectionIntentRef.current = selectionIntent;
+    var requestSelectionIntent = useCallback(function (intent) {
+        if (onSelectionIntentChange) {
+            onSelectionIntentChange(intent);
+            return;
+        }
+        setInternalSelectionIntent(function (current) {
+            return current === 'select-all' && intent === 'caret-end' ? current : intent;
+        });
+    }, [onSelectionIntentChange]);
+    var syncOverlayScroll = useCallback(function () {
+        if (overlayRef.current && coreInputRef.current) {
+            overlayRef.current.style.transform = "translateX(-".concat(coreInputRef.current.scrollLeft, "px)");
+        }
+    }, [coreInputRef]);
+    var overflows = useInputOverflow(coreInputRef, maskState.displayValue, focused);
+    var showOverlay = getShowOverlay(maskState, focused, overflows);
+    var _e = useMaskedCoreHandlers({
+        maskState: maskState,
+        slotMap: slotMap,
+        engine: engine,
+        currentRaw: currentRaw,
+        onRawChange: onRawChange,
+        onUnexpectedInput: onUnexpectedInput,
+        onUndo: onUndo,
+        onRedo: onRedo,
+        coreInputRef: coreInputRef,
+        selectAllOnFocus: selectAllOnFocus,
+        onKeyDown: onKeyDown,
+        onMouseUp: onMouseUp,
+        onInput: onInput,
+        onSelect: onSelect,
+        onFocus: onFocus,
+        onBlur: onBlur,
+        onPaste: onPaste,
+        syncOverlayScroll: syncOverlayScroll,
+        requestSelectionIntent: requestSelectionIntent,
+    }), pendingCursorRef = _e.pendingCursorRef, selectionRange = _e.selectionRange, syncSelection = _e.syncSelection, handleChange = _e.handleChange, handleKeyDown = _e.handleKeyDown, handleSelect = _e.handleSelect, handlePaste = _e.handlePaste, handleCopy = _e.handleCopy, handleCut = _e.handleCut, handleInput = _e.handleInput, handleMouseDown = _e.handleMouseDown, handleMouseUp = _e.handleMouseUp, handleFocus = _e.handleFocus, handleBlur = _e.handleBlur;
+    useImperativeHandle(ref, function () { return ({
+        input: coreInputRef.current,
+        getRootNode: function () { return coreInputRef.current; },
+    }); }, [coreInputRef]);
+    var applySelectionIntent = useCallback(function (intent) {
+        var _a, _b;
+        var el = coreInputRef.current;
+        if (!el || !focused) {
+            return;
+        }
+        if (intent === 'select-all') {
+            setMaskInputSelectionRange(el, 0, maskState.typedLength);
+        }
+        else {
+            var start = (_a = el.selectionStart) !== null && _a !== void 0 ? _a : 0;
+            var end = (_b = el.selectionEnd) !== null && _b !== void 0 ? _b : 0;
+            if (start === end && start !== 0 && start !== maskState.typedLength) {
+                return;
+            }
+            setMaskInputSelectionRange(el, maskState.typedLength);
+        }
+        scrollInputCaretIntoView(el);
+        syncSelection(el);
+    }, [coreInputRef, focused, maskState.typedLength, syncSelection]);
+    useLayoutEffect(function () {
+        var el = coreInputRef.current;
+        if (selectionIntent) {
+            applySelectionIntent(selectionIntent);
+        }
+        else if (pendingCursorRef.current !== null && el) {
+            var pos = pendingCursorRef.current;
+            pendingCursorRef.current = null;
+            setMaskInputSelectionRange(el, pos);
+            scrollInputCaretIntoView(el);
+            syncSelection(el);
+        }
+        else if (el && focused) {
+            scrollInputCaretIntoView(el);
+        }
+        syncOverlayScroll();
+        // typedValue в deps обязателен: после controlled-update React сбрасывает selection,
+        // а typedLength при shift-перезаписи в полной маске может не измениться (1212 → 1251).
+    }, [applySelectionIntent, focused, maskState.typedValue, selectionIntent, syncOverlayScroll, syncSelection]);
+    // Браузер может применить свою Tab-selection после focus-хендлеров.
+    // Один отменяемый retry после события оставляет последнее намерение победителем.
+    useEffect(function () {
+        if (!selectionIntent || !focused) {
+            return;
+        }
+        var appliedIntent = selectionIntent;
+        var setTimeout = globalObject.setTimeout;
+        if (!setTimeout) {
+            requestSelectionIntent(null);
+            return;
+        }
+        var timer = setTimeout(function () {
+            var _a;
+            if (selectionIntentRef.current !== appliedIntent) {
+                return;
+            }
+            var el = coreInputRef.current;
+            if (!el || ((_a = globalObject.document) === null || _a === void 0 ? void 0 : _a.activeElement) !== el) {
+                requestSelectionIntent(null);
+                return;
+            }
+            applySelectionIntent(appliedIntent);
+            requestSelectionIntent(null);
+        }, 0);
+        return function () { var _a; return (_a = globalObject.clearTimeout) === null || _a === void 0 ? void 0 : _a.call(globalObject, timer); };
+    }, [applySelectionIntent, coreInputRef, focused, globalObject, requestSelectionIntent, selectionIntent]);
+    useEffect(function () {
+        if (!focused) {
+            return;
+        }
+        var el = coreInputRef.current;
+        if (!el) {
+            return;
+        }
+        var handleSelectionChange = function () {
+            if (document.activeElement === el) {
+                handleSelect();
+            }
+        };
+        document.addEventListener('selectionchange', handleSelectionChange);
+        return function () { return document.removeEventListener('selectionchange', handleSelectionChange); };
+    }, [focused, handleSelect]);
+    var alignPadding = useMaskAlignPadding(coreInputRef, overlayRef, maskState.displayValue, textAlign, focused && showOverlay && needsMaskAlignPadding(textAlign));
+    var inputStyle = alignPadding > 0 ? __assign(__assign({}, rest.style), { textAlign: 'left', paddingLeft: alignPadding }) : rest.style;
+    return (React.createElement(React.Fragment, null,
+        React.createElement("input", __assign({}, rest, { style: inputStyle, placeholder: showOverlay ? undefined : placeholder, "aria-disabled": disabled, disabled: disabled, ref: coreInputRef, className: cx(globalClasses.input, styles.input(theme), showOverlay && globalClasses.masked, className), value: maskState.typedValue, onChange: handleChange, onKeyDown: handleKeyDown, onSelect: handleSelect, onPaste: handlePaste, onCopy: handleCopy, onCut: handleCut, onFocus: handleFocus, onBlur: handleBlur, onInput: handleInput, onMouseDown: function (e) {
+                var _a;
+                handleMouseDown();
+                (_a = rest.onMouseDown) === null || _a === void 0 ? void 0 : _a.call(rest, e);
+            }, onMouseUp: handleMouseUp, onScroll: syncOverlayScroll })),
+        showOverlay && (React.createElement(MaskOverlay, { containerRef: overlayRef, typedValue: maskState.typedValue, displayValue: maskState.displayValue, selectionStart: selectionRange.start, selectionEnd: selectionRange.end, disabled: disabled, textAlign: (_b = rest.style) === null || _b === void 0 ? void 0 : _b.textAlign, colored: colored }))));
+});
+//# sourceMappingURL=MaskedCore.js.map

package/components/MaskedInputV2/internal/MaskedCore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedCore.js","sourceRoot":"","sources":["MaskedCore.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cx } from '@emotion/css';\nimport React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { forwardRefAndName } from '../../../lib/forwardRefAndName.js';\nimport { useGlobal, useStyles } from '../../../lib/renderEnvironment/index.js';\nimport { scrollInputCaretIntoView } from '../../../lib/scrollInputCaretIntoView.js';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext.js';\nimport type { InputElement } from '../../Input/Input.typings.js';\nimport { needsMaskAlignPadding } from './computeMaskAlignPadding.js';\nimport type { MaskedCoreProps } from './MaskedCore.types.js';\nimport { getStyles, globalClasses } from './MaskedInternal.styles.js';\nimport { MaskOverlay } from './MaskOverlay.js';\nimport { setMaskInputSelectionRange } from './setMaskInputSelectionRange.js';\nimport { getShowOverlay } from './showOverlay.js';\nimport { useInputOverflow } from './useInputOverflow.js';\nimport { useMaskAlignPadding } from './useMaskAlignPadding.js';\nimport { useMaskedCoreHandlers } from './useMaskedCoreHandlers.js';\n\nexport type { MaskedCoreProps } from './MaskedCore.types.js';\n\n/**\n * Headless-слой MaskedInputV2: прозрачный `<input>` для ввода и {@link MaskOverlay} для отображения маски.\n * Управляется через {@link useMaskedCoreHandlers}.\n */\nexport const MaskedCore = forwardRefAndName(\n  'MaskedCore',\n  function MaskedCore(props: MaskedCoreProps, ref: React.ForwardedRef<InputElement | null>) {\n    const {\n      maskState,\n      slotMap,\n      engine,\n      focused,\n      currentRaw,\n      onRawChange,\n      onUnexpectedInput,\n      onUndo,\n      onRedo,\n      coreInputRef,\n      colored = true,\n      selectAllOnFocus,\n      selectionIntent: externalSelectionIntent,\n      onSelectionIntentChange,\n      onKeyDown,\n      onMouseUp,\n      onInput,\n      onSelect,\n      onFocus,\n      onPaste,\n      onBlur,\n      placeholder,\n      className,\n      disabled,\n      ...rest\n    } = props;\n\n    const styles = useStyles(getStyles);\n    const globalObject = useGlobal();\n    const overlayRef = useRef<HTMLSpanElement>(null);\n    const theme = useContext(ThemeContext);\n    const textAlign = rest.style?.textAlign;\n    const [internalSelectionIntent, setInternalSelectionIntent] = useState<NonNullable<\n      MaskedCoreProps['selectionIntent']\n    > | null>(null);\n    const selectionIntent = externalSelectionIntent === undefined ? internalSelectionIntent : externalSelectionIntent;\n    const selectionIntentRef = useRef(selectionIntent);\n    selectionIntentRef.current = selectionIntent;\n\n    const requestSelectionIntent = useCallback(\n      (intent: NonNullable<MaskedCoreProps['selectionIntent']> | null) => {\n        if (onSelectionIntentChange) {\n          onSelectionIntentChange(intent);\n          return;\n        }\n        setInternalSelectionIntent((current) =>\n          current === 'select-all' && intent === 'caret-end' ? current : intent,\n        );\n      },\n      [onSelectionIntentChange],\n    );\n\n    const syncOverlayScroll = useCallback(() => {\n      if (overlayRef.current && coreInputRef.current) {\n        overlayRef.current.style.transform = `translateX(-${coreInputRef.current.scrollLeft}px)`;\n      }\n    }, [coreInputRef]);\n\n    const overflows = useInputOverflow(coreInputRef, maskState.displayValue, focused);\n    const showOverlay = getShowOverlay(maskState, focused, overflows);\n\n    const {\n      pendingCursorRef,\n      selectionRange,\n      syncSelection,\n      handleChange,\n      handleKeyDown,\n      handleSelect,\n      handlePaste,\n      handleCopy,\n      handleCut,\n      handleInput,\n      handleMouseDown,\n      handleMouseUp,\n      handleFocus,\n      handleBlur,\n    } = useMaskedCoreHandlers({\n      maskState,\n      slotMap,\n      engine,\n      currentRaw,\n      onRawChange,\n      onUnexpectedInput,\n      onUndo,\n      onRedo,\n      coreInputRef,\n      selectAllOnFocus,\n      onKeyDown,\n      onMouseUp,\n      onInput,\n      onSelect,\n      onFocus,\n      onBlur,\n      onPaste,\n      syncOverlayScroll,\n      requestSelectionIntent,\n    });\n\n    useImperativeHandle(\n      ref,\n      () => ({\n        input: coreInputRef.current,\n        getRootNode: () => coreInputRef.current,\n      }),\n      [coreInputRef],\n    );\n\n    const applySelectionIntent = useCallback(\n      (intent: NonNullable<MaskedCoreProps['selectionIntent']>) => {\n        const el = coreInputRef.current;\n        if (!el || !focused) {\n          return;\n        }\n\n        if (intent === 'select-all') {\n          setMaskInputSelectionRange(el, 0, maskState.typedLength);\n        } else {\n          const start = el.selectionStart ?? 0;\n          const end = el.selectionEnd ?? 0;\n          if (start === end && start !== 0 && start !== maskState.typedLength) {\n            return;\n          }\n          setMaskInputSelectionRange(el, maskState.typedLength);\n        }\n        scrollInputCaretIntoView(el);\n        syncSelection(el);\n      },\n      [coreInputRef, focused, maskState.typedLength, syncSelection],\n    );\n\n    useLayoutEffect(() => {\n      const el = coreInputRef.current;\n\n      if (selectionIntent) {\n        applySelectionIntent(selectionIntent);\n      } else if (pendingCursorRef.current !== null && el) {\n        const pos = pendingCursorRef.current;\n        pendingCursorRef.current = null;\n        setMaskInputSelectionRange(el, pos);\n        scrollInputCaretIntoView(el);\n        syncSelection(el);\n      } else if (el && focused) {\n        scrollInputCaretIntoView(el);\n      }\n\n      syncOverlayScroll();\n      // typedValue в deps обязателен: после controlled-update React сбрасывает selection,\n      // а typedLength при shift-перезаписи в полной маске может не измениться (1212 → 1251).\n    }, [applySelectionIntent, focused, maskState.typedValue, selectionIntent, syncOverlayScroll, syncSelection]);\n\n    // Браузер может применить свою Tab-selection после focus-хендлеров.\n    // Один отменяемый retry после события оставляет последнее намерение победителем.\n    useEffect(() => {\n      if (!selectionIntent || !focused) {\n        return;\n      }\n\n      const appliedIntent = selectionIntent;\n      const setTimeout = globalObject.setTimeout;\n      if (!setTimeout) {\n        requestSelectionIntent(null);\n        return;\n      }\n      const timer = setTimeout(() => {\n        if (selectionIntentRef.current !== appliedIntent) {\n          return;\n        }\n        const el = coreInputRef.current;\n        if (!el || globalObject.document?.activeElement !== el) {\n          requestSelectionIntent(null);\n          return;\n        }\n        applySelectionIntent(appliedIntent);\n        requestSelectionIntent(null);\n      }, 0);\n\n      return () => globalObject.clearTimeout?.(timer);\n    }, [applySelectionIntent, coreInputRef, focused, globalObject, requestSelectionIntent, selectionIntent]);\n\n    useEffect(() => {\n      if (!focused) {\n        return;\n      }\n\n      const el = coreInputRef.current;\n      if (!el) {\n        return;\n      }\n\n      const handleSelectionChange = () => {\n        if (document.activeElement === el) {\n          handleSelect();\n        }\n      };\n\n      document.addEventListener('selectionchange', handleSelectionChange);\n      return () => document.removeEventListener('selectionchange', handleSelectionChange);\n    }, [focused, handleSelect]);\n\n    const alignPadding = useMaskAlignPadding(\n      coreInputRef,\n      overlayRef,\n      maskState.displayValue,\n      textAlign,\n      focused && showOverlay && needsMaskAlignPadding(textAlign),\n    );\n    const inputStyle =\n      alignPadding > 0 ? { ...rest.style, textAlign: 'left' as const, paddingLeft: alignPadding } : rest.style;\n\n    return (\n      <>\n        <input\n          {...rest}\n          style={inputStyle}\n          placeholder={showOverlay ? undefined : placeholder}\n          aria-disabled={disabled}\n          disabled={disabled}\n          ref={coreInputRef}\n          className={cx(globalClasses.input, styles.input(theme), showOverlay && globalClasses.masked, className)}\n          value={maskState.typedValue}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          onSelect={handleSelect}\n          onPaste={handlePaste}\n          onCopy={handleCopy}\n          onCut={handleCut}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          onInput={handleInput}\n          onMouseDown={(e) => {\n            handleMouseDown();\n            rest.onMouseDown?.(e);\n          }}\n          onMouseUp={handleMouseUp}\n          onScroll={syncOverlayScroll}\n        />\n        {showOverlay && (\n          <MaskOverlay\n            containerRef={overlayRef}\n            typedValue={maskState.typedValue}\n            displayValue={maskState.displayValue}\n            selectionStart={selectionRange.start}\n            selectionEnd={selectionRange.end}\n            disabled={disabled}\n            textAlign={rest.style?.textAlign}\n            colored={colored}\n          />\n        )}\n      </>\n    );\n  },\n);\n"]}

package/components/MaskedInputV2/internal/MaskedCore.types.d.ts

@@ -0,0 +1,37 @@
+import type React from 'react';
+import type { InputElement } from '../../Input/Input.typings.js';
+import type { MaskEngine, MaskState, SlotMap } from './types.js';
+export type MaskedSelectionIntent = 'caret-end' | 'select-all' | null;
+/**
+ * Пропсы headless-слоя {@link MaskedCore}: прозрачный `<input>` + overlay маски.
+ */
+export interface MaskedCoreProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'defaultValue'> {
+    /** Вычисленное состояние маски для отображения. */
+    maskState: MaskState;
+    /** Карта слотов для clipboard/delete/navigation. */
+    slotMap: SlotMap;
+    /** Headless IMask-движок. */
+    engine: MaskEngine;
+    /** Поле в фокусе — влияет на lazy-режим displayValue. */
+    focused: boolean;
+    /** Текущее raw-значение (источник истины). */
+    currentRaw: string;
+    /** Колбэк изменения raw от пользовательского ввода или paste. */
+    onRawChange: (newRaw: string, source: 'input' | 'paste', cursorPos?: number) => void;
+    /** Колбэк отклонённого ввода (невалидный символ или граничное удаление). */
+    onUnexpectedInput: () => void;
+    onUndo?: () => void;
+    onRedo?: () => void;
+    /** Ref на нативный `<input>` внутри MaskedCore. */
+    coreInputRef: React.RefObject<HTMLInputElement | null>;
+    /** Раскрашивать ли символы маски в overlay. @default true */
+    colored?: boolean;
+    /** Не сбрасывать каретку на mouseup — нужно для selectAllOnFocus. */
+    selectAllOnFocus?: boolean;
+    /** Намерение выставить каретку или выделение после актуализации maskState. */
+    selectionIntent?: MaskedSelectionIntent;
+    /** Запрашивает новое намерение выставить каретку или выделение. */
+    onSelectionIntentChange?: (intent: MaskedSelectionIntent) => void;
+}
+/** Ref, который MaskedCore пробрасывает наружу для совместимости с Input.refInput. */
+export type MaskedCoreRef = InputElement | null;

package/components/MaskedInputV2/internal/MaskedCore.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=MaskedCore.types.js.map

package/components/MaskedInputV2/internal/MaskedCore.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedCore.types.js","sourceRoot":"","sources":["MaskedCore.types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { InputElement } from '../../Input/Input.typings.js';\nimport type { MaskEngine, MaskState, SlotMap } from './types.js';\n\nexport type MaskedSelectionIntent = 'caret-end' | 'select-all' | null;\n\n/**\n * Пропсы headless-слоя {@link MaskedCore}: прозрачный `<input>` + overlay маски.\n */\nexport interface MaskedCoreProps extends Omit<\n  React.InputHTMLAttributes<HTMLInputElement>,\n  'value' | 'onChange' | 'defaultValue'\n> {\n  /** Вычисленное состояние маски для отображения. */\n  maskState: MaskState;\n  /** Карта слотов для clipboard/delete/navigation. */\n  slotMap: SlotMap;\n  /** Headless IMask-движок. */\n  engine: MaskEngine;\n  /** Поле в фокусе — влияет на lazy-режим displayValue. */\n  focused: boolean;\n  /** Текущее raw-значение (источник истины). */\n  currentRaw: string;\n  /** Колбэк изменения raw от пользовательского ввода или paste. */\n  onRawChange: (newRaw: string, source: 'input' | 'paste', cursorPos?: number) => void;\n  /** Колбэк отклонённого ввода (невалидный символ или граничное удаление). */\n  onUnexpectedInput: () => void;\n  onUndo?: () => void;\n  onRedo?: () => void;\n  /** Ref на нативный `<input>` внутри MaskedCore. */\n  coreInputRef: React.RefObject<HTMLInputElement | null>;\n  /** Раскрашивать ли символы маски в overlay. @default true */\n  colored?: boolean;\n  /** Не сбрасывать каретку на mouseup — нужно для selectAllOnFocus. */\n  selectAllOnFocus?: boolean;\n  /** Намерение выставить каретку или выделение после актуализации maskState. */\n  selectionIntent?: MaskedSelectionIntent;\n  /** Запрашивает новое намерение выставить каретку или выделение. */\n  onSelectionIntentChange?: (intent: MaskedSelectionIntent) => void;\n}\n\n/** Ref, который MaskedCore пробрасывает наружу для совместимости с Input.refInput. */\nexport type MaskedCoreRef = InputElement | null;\n"]}

package/components/MaskedInputV2/internal/MaskedInternal.styles.d.ts

@@ -0,0 +1,15 @@
+import type { Theme } from '../../../lib/theming/Theme.js';
+export declare const globalClasses: {
+    input: string;
+    disabled: string;
+    selected: string;
+    masked: string;
+    colored: string;
+};
+export declare const getStyles: import("../../../lib/theming/Emotion.js").StylesGetter<{
+    input(t: Theme): string;
+    overlay(): string;
+    typed(t: Theme): string;
+    mask(t: Theme): string;
+    selectedSegment(): string;
+}>;

package/components/MaskedInputV2/internal/MaskedInternal.styles.js

@@ -0,0 +1,34 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles, prefix } from '../../../lib/theming/Emotion.js';
+export var globalClasses = prefix('masked-internal')({
+    input: 'input',
+    disabled: 'disabled',
+    selected: 'selected',
+    masked: 'masked',
+    colored: 'colored',
+});
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        input: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      color-scheme: ", ";\n\n      &:-internal-autofill-selected {\n        background-color: ", " !important;\n        background-image: none !important;\n        color: ", " !important;\n      }\n\n      &:-webkit-autofill,\n      &:-webkit-autofill:hover,\n      &:-webkit-autofill:focus {\n        -webkit-box-shadow: 0 0 0 1000px ", " inset;\n        box-shadow: 0 0 0 1000px ", " inset;\n        -webkit-text-fill-color: ", " !important;\n        color: ", " !important;\n        transition:\n          background-color 0s 600000s,\n          color 0s 600000s !important;\n      }\n\n      &:disabled {\n        color: ", ";\n\n        &:-internal-autofill-selected {\n          background-color: ", " !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-box-shadow: 0 0 0 1000px ", " inset;\n          box-shadow: 0 0 0 1000px ", " inset;\n        }\n      }\n\n      &.", " {\n        color: transparent;\n        -webkit-text-fill-color: transparent;\n        caret-color: ", ";\n\n        &::selection {\n          background-color: transparent !important;\n          color: transparent !important;\n          -webkit-text-fill-color: transparent !important;\n        }\n\n        /* \u0422\u0435\u043A\u0441\u0442 \u0440\u0438\u0441\u0443\u0435\u0442 MaskOverlay; \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043F\u0440\u0438 autofill \u043D\u0435 \u0434\u043E\u043B\u0436\u0435\u043D \u043F\u0435\u0440\u0435\u0431\u0438\u0432\u0430\u0442\u044C fill-color. */\n        &:-internal-autofill-selected {\n          color: transparent !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-text-fill-color: transparent !important;\n          color: transparent !important;\n        }\n      }\n    "], ["\n      color-scheme: ", ";\n\n      &:-internal-autofill-selected {\n        background-color: ", " !important;\n        background-image: none !important;\n        color: ", " !important;\n      }\n\n      &:-webkit-autofill,\n      &:-webkit-autofill:hover,\n      &:-webkit-autofill:focus {\n        -webkit-box-shadow: 0 0 0 1000px ", " inset;\n        box-shadow: 0 0 0 1000px ", " inset;\n        -webkit-text-fill-color: ", " !important;\n        color: ", " !important;\n        transition:\n          background-color 0s 600000s,\n          color 0s 600000s !important;\n      }\n\n      &:disabled {\n        color: ", ";\n\n        &:-internal-autofill-selected {\n          background-color: ", " !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-box-shadow: 0 0 0 1000px ", " inset;\n          box-shadow: 0 0 0 1000px ", " inset;\n        }\n      }\n\n      &.", " {\n        color: transparent;\n        -webkit-text-fill-color: transparent;\n        caret-color: ", ";\n\n        &::selection {\n          background-color: transparent !important;\n          color: transparent !important;\n          -webkit-text-fill-color: transparent !important;\n        }\n\n        /* \u0422\u0435\u043A\u0441\u0442 \u0440\u0438\u0441\u0443\u0435\u0442 MaskOverlay; \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043F\u0440\u0438 autofill \u043D\u0435 \u0434\u043E\u043B\u0436\u0435\u043D \u043F\u0435\u0440\u0435\u0431\u0438\u0432\u0430\u0442\u044C fill-color. */\n        &:-internal-autofill-selected {\n          color: transparent !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-text-fill-color: transparent !important;\n          color: transparent !important;\n        }\n      }\n    "])), t.inputColorScheme, t.inputBg, t.inputTextColor, t.inputBg, t.inputBg, t.inputTextColor, t.inputTextColor, t.inputTextColorDisabled, t.inputDisabledBg, t.inputDisabledBg, t.inputDisabledBg, globalClasses.masked, t.inputTextColor);
+        },
+        overlay: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      user-select: none;\n      overflow: hidden;\n      display: flex;\n      align-items: center;\n      z-index: 2;\n    "], ["\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      user-select: none;\n      overflow: hidden;\n      display: flex;\n      align-items: center;\n      z-index: 2;\n    "])));
+        },
+        typed: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      white-space: pre;\n      color: ", ";\n\n      &.", " {\n        color: ", ";\n      }\n    "], ["\n      white-space: pre;\n      color: ", ";\n\n      &.", " {\n        color: ", ";\n      }\n    "])), t.inputTextColor, globalClasses.disabled, t.inputTextColorDisabled);
+        },
+        mask: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      white-space: pre;\n      color: ", ";\n\n      &.", " {\n        color: ", ";\n      }\n\n      &.", " {\n        color: ", ";\n      }\n    "], ["\n      white-space: pre;\n      color: ", ";\n\n      &.", " {\n        color: ", ";\n      }\n\n      &.", " {\n        color: ", ";\n      }\n    "])), t.inputTextColor, globalClasses.colored, t.inputPlaceholderColor, globalClasses.disabled, t.inputTextColorDisabled);
+        },
+        selectedSegment: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      background-color: #3390ff;\n      color: #fff !important;\n      -webkit-text-fill-color: #fff !important;\n    "], ["\n      background-color: #3390ff;\n      color: #fff !important;\n      -webkit-text-fill-color: #fff !important;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+//# sourceMappingURL=MaskedInternal.styles.js.map

package/components/MaskedInputV2/internal/MaskedInternal.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInternal.styles.js","sourceRoot":"","sources":["MaskedInternal.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAG3E,MAAM,CAAC,IAAM,aAAa,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IACrD,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,UAAU;IACpB,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,QAAQ;IAChB,OAAO,EAAE,SAAS;CACnB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,KAAK,YAAC,CAAQ;YACZ,OAAO,GAAG,q6DAAA,wBACQ,EAAkB,wEAGZ,EAAS,2EAEpB,EAAgB,kKAMU,EAAS,4CACjB,EAAS,4CACT,EAAgB,+BAClC,EAAgB,mKAOhB,EAAwB,4EAGX,EAAiB,4KAMF,EAAiB,8CACzB,EAAiB,yCAI5C,EAAoB,uGAGP,EAAgB,2yBAoBlC,KA1DiB,CAAC,CAAC,gBAAgB,EAGZ,CAAC,CAAC,OAAO,EAEpB,CAAC,CAAC,cAAc,EAMU,CAAC,CAAC,OAAO,EACjB,CAAC,CAAC,OAAO,EACT,CAAC,CAAC,cAAc,EAClC,CAAC,CAAC,cAAc,EAOhB,CAAC,CAAC,sBAAsB,EAGX,CAAC,CAAC,eAAe,EAMF,CAAC,CAAC,eAAe,EACzB,CAAC,CAAC,eAAe,EAI5C,aAAa,CAAC,MAAM,EAGP,CAAC,CAAC,cAAc,EAoBjC;QACJ,CAAC;QACD,OAAO;YACL,OAAO,GAAG,4QAAA,yMAST,KAAC;QACJ,CAAC;QACD,KAAK,YAAC,CAAQ;YACZ,OAAO,GAAG,yKAAA,0CAEC,EAAgB,eAErB,EAAsB,qBACf,EAAwB,kBAEpC,KALU,CAAC,CAAC,cAAc,EAErB,aAAa,CAAC,QAAQ,EACf,CAAC,CAAC,sBAAsB,EAEnC;QACJ,CAAC;QACD,IAAI,YAAC,CAAQ;YACX,OAAO,GAAG,0NAAA,0CAEC,EAAgB,eAErB,EAAqB,qBACd,EAAuB,wBAG9B,EAAsB,qBACf,EAAwB,kBAEpC,KATU,CAAC,CAAC,cAAc,EAErB,aAAa,CAAC,OAAO,EACd,CAAC,CAAC,qBAAqB,EAG9B,aAAa,CAAC,QAAQ,EACf,CAAC,CAAC,sBAAsB,EAEnC;QACJ,CAAC;QACD,eAAe;YACb,OAAO,GAAG,6LAAA,0HAIT,KAAC;QACJ,CAAC;KACF,CAAC;AA1G8D,CA0G9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles, prefix } from '../../../lib/theming/Emotion.js';\nimport type { Theme } from '../../../lib/theming/Theme.js';\n\nexport const globalClasses = prefix('masked-internal')({\n  input: 'input',\n  disabled: 'disabled',\n  selected: 'selected',\n  masked: 'masked',\n  colored: 'colored',\n});\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  input(t: Theme) {\n    return css`\n      color-scheme: ${t.inputColorScheme};\n\n      &:-internal-autofill-selected {\n        background-color: ${t.inputBg} !important;\n        background-image: none !important;\n        color: ${t.inputTextColor} !important;\n      }\n\n      &:-webkit-autofill,\n      &:-webkit-autofill:hover,\n      &:-webkit-autofill:focus {\n        -webkit-box-shadow: 0 0 0 1000px ${t.inputBg} inset;\n        box-shadow: 0 0 0 1000px ${t.inputBg} inset;\n        -webkit-text-fill-color: ${t.inputTextColor} !important;\n        color: ${t.inputTextColor} !important;\n        transition:\n          background-color 0s 600000s,\n          color 0s 600000s !important;\n      }\n\n      &:disabled {\n        color: ${t.inputTextColorDisabled};\n\n        &:-internal-autofill-selected {\n          background-color: ${t.inputDisabledBg} !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-box-shadow: 0 0 0 1000px ${t.inputDisabledBg} inset;\n          box-shadow: 0 0 0 1000px ${t.inputDisabledBg} inset;\n        }\n      }\n\n      &.${globalClasses.masked} {\n        color: transparent;\n        -webkit-text-fill-color: transparent;\n        caret-color: ${t.inputTextColor};\n\n        &::selection {\n          background-color: transparent !important;\n          color: transparent !important;\n          -webkit-text-fill-color: transparent !important;\n        }\n\n        /* Текст рисует MaskOverlay; браузер при autofill не должен перебивать fill-color. */\n        &:-internal-autofill-selected {\n          color: transparent !important;\n        }\n\n        &:-webkit-autofill,\n        &:-webkit-autofill:hover,\n        &:-webkit-autofill:focus {\n          -webkit-text-fill-color: transparent !important;\n          color: transparent !important;\n        }\n      }\n    `;\n  },\n  overlay() {\n    return css`\n      position: absolute;\n      inset: 0;\n      pointer-events: none;\n      user-select: none;\n      overflow: hidden;\n      display: flex;\n      align-items: center;\n      z-index: 2;\n    `;\n  },\n  typed(t: Theme) {\n    return css`\n      white-space: pre;\n      color: ${t.inputTextColor};\n\n      &.${globalClasses.disabled} {\n        color: ${t.inputTextColorDisabled};\n      }\n    `;\n  },\n  mask(t: Theme) {\n    return css`\n      white-space: pre;\n      color: ${t.inputTextColor};\n\n      &.${globalClasses.colored} {\n        color: ${t.inputPlaceholderColor};\n      }\n\n      &.${globalClasses.disabled} {\n        color: ${t.inputTextColorDisabled};\n      }\n    `;\n  },\n  selectedSegment() {\n    return css`\n      background-color: #3390ff;\n      color: #fff !important;\n      -webkit-text-fill-color: #fff !important;\n    `;\n  },\n}));\n"]}

package/components/MaskedInputV2/internal/buildSlotMap.d.ts

@@ -0,0 +1,11 @@
+import type { MaskedPattern } from '../react-imask/imask/index.js';
+import type { SlotMap } from './types.js';
+/**
+ * Строит карту соответствия позиций displayValue и raw-слотов для текущей маски.
+ * Временно сбрасывает IMask в пустое состояние с `lazy: false`, чтобы получить
+ * полный шаблон с плейсхолдерами (например, `"__.__"` для `mask="99.99"`).
+ *
+ * @param imask — IMask-инстанс с настроенной маской.
+ * @returns карта пользовательских слотов и отображения masked ↔ raw.
+ */
+export declare function buildSlotMap(imask: MaskedPattern): SlotMap;

package/components/MaskedInputV2/internal/buildSlotMap.js

@@ -0,0 +1,37 @@
+/**
+ * Строит карту соответствия позиций displayValue и raw-слотов для текущей маски.
+ * Временно сбрасывает IMask в пустое состояние с `lazy: false`, чтобы получить
+ * полный шаблон с плейсхолдерами (например, `"__.__"` для `mask="99.99"`).
+ *
+ * @param imask — IMask-инстанс с настроенной маской.
+ * @returns карта пользовательских слотов и отображения masked ↔ raw.
+ */
+export function buildSlotMap(imask) {
+    var _a, _b, _c;
+    // Сохраняем состояние
+    var savedRaw = imask.unmaskedValue;
+    var savedLazy = (_c = (_b = (_a = imask._masked) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.lazy) !== null && _c !== void 0 ? _c : true;
+    // Получаем пустой шаблон: "_._._" для mask="99.99"
+    imask.unmaskedValue = '';
+    imask.updateOptions({ lazy: false });
+    var emptyDisplay = imask.displayValue;
+    // Восстанавливаем состояние
+    imask.unmaskedValue = savedRaw;
+    imask.updateOptions({ lazy: savedLazy });
+    var placeholderChar = imask.placeholderChar;
+    var userSlots = [];
+    var maskedToRaw = [];
+    var rawToMasked = [];
+    for (var i = 0; i < emptyDisplay.length; i++) {
+        if (emptyDisplay[i] === placeholderChar) {
+            rawToMasked.push(i);
+            maskedToRaw.push(userSlots.length);
+            userSlots.push(i);
+        }
+        else {
+            maskedToRaw.push(null);
+        }
+    }
+    return { userSlots: userSlots, maskedToRaw: maskedToRaw, rawToMasked: rawToMasked };
+}
+//# sourceMappingURL=buildSlotMap.js.map

package/components/MaskedInputV2/internal/buildSlotMap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildSlotMap.js","sourceRoot":"","sources":["buildSlotMap.ts"],"names":[],"mappings":"AAGA;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CAAC,KAAoB;;IAC/C,sBAAsB;IACtB,IAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC;IACrC,IAAM,SAAS,GAAG,MAAA,MAAA,MAAC,KAAa,CAAC,OAAO,0CAAE,OAAO,0CAAE,IAAI,mCAAI,IAAI,CAAC;IAEhE,mDAAmD;IACnD,KAAK,CAAC,aAAa,GAAG,EAAE,CAAC;IACzB,KAAK,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;IACrC,IAAM,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC;IAExC,4BAA4B;IAC5B,KAAK,CAAC,aAAa,GAAG,QAAQ,CAAC;IAC/B,KAAK,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;IAEzC,IAAM,eAAe,GAAG,KAAK,CAAC,eAAe,CAAC;IAC9C,IAAM,SAAS,GAAa,EAAE,CAAC;IAC/B,IAAM,WAAW,GAAyB,EAAE,CAAC;IAC7C,IAAM,WAAW,GAAa,EAAE,CAAC;IAEjC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QAC7C,IAAI,YAAY,CAAC,CAAC,CAAC,KAAK,eAAe,EAAE,CAAC;YACxC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YACpB,WAAW,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;YACnC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACpB,CAAC;aAAM,CAAC;YACN,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzB,CAAC;IACH,CAAC;IAED,OAAO,EAAE,SAAS,WAAA,EAAE,WAAW,aAAA,EAAE,WAAW,aAAA,EAAE,CAAC;AACjD,CAAC","sourcesContent":["import type { MaskedPattern } from '../react-imask/imask/index.js';\nimport type { SlotMap } from './types.js';\n\n/**\n * Строит карту соответствия позиций displayValue и raw-слотов для текущей маски.\n * Временно сбрасывает IMask в пустое состояние с `lazy: false`, чтобы получить\n * полный шаблон с плейсхолдерами (например, `\"__.__\"` для `mask=\"99.99\"`).\n *\n * @param imask — IMask-инстанс с настроенной маской.\n * @returns карта пользовательских слотов и отображения masked ↔ raw.\n */\nexport function buildSlotMap(imask: MaskedPattern): SlotMap {\n  // Сохраняем состояние\n  const savedRaw = imask.unmaskedValue;\n  const savedLazy = (imask as any)._masked?.options?.lazy ?? true;\n\n  // Получаем пустой шаблон: \"_._._\" для mask=\"99.99\"\n  imask.unmaskedValue = '';\n  imask.updateOptions({ lazy: false });\n  const emptyDisplay = imask.displayValue;\n\n  // Восстанавливаем состояние\n  imask.unmaskedValue = savedRaw;\n  imask.updateOptions({ lazy: savedLazy });\n\n  const placeholderChar = imask.placeholderChar;\n  const userSlots: number[] = [];\n  const maskedToRaw: Array<number | null> = [];\n  const rawToMasked: number[] = [];\n\n  for (let i = 0; i < emptyDisplay.length; i++) {\n    if (emptyDisplay[i] === placeholderChar) {\n      rawToMasked.push(i);\n      maskedToRaw.push(userSlots.length);\n      userSlots.push(i);\n    } else {\n      maskedToRaw.push(null);\n    }\n  }\n\n  return { userSlots, maskedToRaw, rawToMasked };\n}\n"]}

package/components/MaskedInputV2/internal/computeMaskAlignPadding.d.ts

@@ -0,0 +1,6 @@
+import type React from 'react';
+/** Горизонтальный offset начала текста overlay относительно левого края input. */
+export declare function measureOverlayTextStart(input: HTMLInputElement, overlayContainer: HTMLElement | null): number;
+/** Смещение текста input влево, чтобы каретка совпала с overlay при center/right align. */
+export declare function computeMaskAlignPadding(input: HTMLInputElement, displayValue: string, textAlign?: React.CSSProperties['textAlign'], overlayContainer?: HTMLElement | null): number;
+export declare function needsMaskAlignPadding(textAlign?: React.CSSProperties['textAlign']): boolean;

package/components/MaskedInputV2/internal/computeMaskAlignPadding.js

@@ -0,0 +1,47 @@
+import { getOwnerGlobalObject, isBrowser } from '../../../lib/globalObject.js';
+import { measureInputTextWidth } from './measureInputTextWidth.js';
+/** Горизонтальный offset начала текста overlay относительно левого края input. */
+export function measureOverlayTextStart(input, overlayContainer) {
+    if (!overlayContainer) {
+        return 0;
+    }
+    var textEl = overlayContainer.querySelector('[data-tid="masked-input-overlay"]');
+    if (!(textEl === null || textEl === void 0 ? void 0 : textEl.textContent)) {
+        return 0;
+    }
+    var globalObject = getOwnerGlobalObject(input);
+    if (!isBrowser(globalObject) || !('createRange' in globalObject.document)) {
+        return 0;
+    }
+    var range = globalObject.document.createRange();
+    range.selectNodeContents(textEl);
+    var textRect = range.getBoundingClientRect();
+    var inputRect = input.getBoundingClientRect();
+    return Math.max(0, textRect.left - inputRect.left);
+}
+function computeMaskAlignPaddingFromTextWidth(input, displayValue, textAlign) {
+    var textWidth = measureInputTextWidth(input, displayValue);
+    var availableWidth = input.clientWidth;
+    if (textAlign === 'center') {
+        return Math.max(0, (availableWidth - textWidth) / 2);
+    }
+    return Math.max(0, availableWidth - textWidth);
+}
+/** Смещение текста input влево, чтобы каретка совпала с overlay при center/right align. */
+export function computeMaskAlignPadding(input, displayValue, textAlign, overlayContainer) {
+    if (textAlign !== 'center' && textAlign !== 'right') {
+        return 0;
+    }
+    if (!displayValue) {
+        return 0;
+    }
+    var measuredStart = measureOverlayTextStart(input, overlayContainer !== null && overlayContainer !== void 0 ? overlayContainer : null);
+    if (measuredStart > 0) {
+        return measuredStart;
+    }
+    return computeMaskAlignPaddingFromTextWidth(input, displayValue, textAlign);
+}
+export function needsMaskAlignPadding(textAlign) {
+    return textAlign === 'center' || textAlign === 'right';
+}
+//# sourceMappingURL=computeMaskAlignPadding.js.map