@skbkontur/react-ui 5.0.11 → 5.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,18 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [5.0.12](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.0.11...@skbkontur/react-ui@5.0.12) (2025-03-11)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **Loader,ZIndex:** fix overlap of dropdowns in widgets ([#3612](https://github.com/skbkontur/retail-ui/issues/3612)) ([7990c6d](https://github.com/skbkontur/retail-ui/commit/7990c6d4b661e49e5fec8707f4f06a9655bce25e))
12
+ * **MaskedInput:** rerender after theme change ([#3614](https://github.com/skbkontur/retail-ui/issues/3614)) ([840443f](https://github.com/skbkontur/retail-ui/commit/840443fff46bc6037b92e3da6151312075c25fc7))
13
+
14
+
15
+
16
+
17
+
6
18
  ## [5.0.11](https://github.com/skbkontur/retail-ui/compare/@skbkontur/react-ui@5.0.10...@skbkontur/react-ui@5.0.11) (2025-03-03)
7
19
 
8
20
 
@@ -1,4 +1,5 @@
1
- "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.ColorableInputElement = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
1
+ "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.ColorableInputElement = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
2
+ var _react = _interopRequireWildcard(require("react"));
2
3
  var _globalObject = require("@skbkontur/global-object");
3
4
  var _lodash = _interopRequireDefault(require("lodash.debounce"));
4
5
 
@@ -7,7 +8,7 @@ var _ThemeContext = require("../../../lib/theming/ThemeContext");
7
8
  var _forwardRefAndName = require("../../../lib/forwardRefAndName");
8
9
  var _Emotion = require("../../../lib/theming/Emotion");
9
10
 
10
- var _ColorableInputElement = require("./ColorableInputElement.styles");var _excluded = ["children", "onInput", "onFocus", "onBlur", "showOnFocus"];
11
+ var _ColorableInputElement = require("./ColorableInputElement.styles");var _excluded = ["children", "onInput", "onFocus", "onBlur", "showOnFocus"]; /* eslint react-hooks/exhaustive-deps: 2 */
11
12
 
12
13
 
13
14
 
@@ -27,7 +28,6 @@ var ColorableInputElement = exports.ColorableInputElement = (0, _forwardRefAndNa
27
28
  var focused = (0, _react.useRef)(false);
28
29
  var inputStyle = _react.default.useRef();
29
30
  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
30
- var debouncedPaintText = (0, _react.useCallback)((0, _lodash.default)(paintText), []);
31
31
  var _useState = (0, _react.useState)(true),active = _useState[0],setActive = _useState[1];
32
32
 
33
33
  var children = props.children,onInput = props.onInput,onFocus = props.onFocus,onBlur = props.onBlur,showOnFocus = props.showOnFocus,inputProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
@@ -43,10 +43,78 @@ var ColorableInputElement = exports.ColorableInputElement = (0, _forwardRefAndNa
43
43
 
44
44
  (0, _react.useEffect)(updateActive, []);
45
45
 
46
+ var paintText = (0, _react.useCallback)(function () {var _inputRef$current, _shadow;
47
+ if (!spanRef.current || !inputRef.current || !inputStyle.current || !(0, _globalObject.isBrowser)(_globalObject.globalObject)) {
48
+ return;
49
+ }
50
+
51
+ (_inputRef$current = inputRef.current) == null || _inputRef$current.classList.add(_ColorableInputElement.globalClasses.input);
52
+
53
+ var shadow = spanRef.current.shadowRoot;
54
+ var typedValueElement = (_shadow = shadow) == null ? void 0 : _shadow.getElementById('span');
55
+
56
+ if (!typedValueElement) {
57
+ shadow = spanRef.current.attachShadow({ mode: 'open' });
58
+
59
+ typedValueElement = _globalObject.globalObject.document.createElement('span');
60
+ typedValueElement.setAttribute('id', 'span');
61
+
62
+ shadow.appendChild(typedValueElement);
63
+ }
64
+
65
+ var style = inputStyle.current;
66
+
67
+ typedValueElement.textContent =
68
+ (inputRef.current.getAttribute('data-unmasked-value') || focused.current) &&
69
+ inputRef.current.getAttribute('data-typed-value') ||
70
+ '';
71
+
72
+ var inputRect = inputRef.current.getBoundingClientRect();
73
+ var filledRect = spanRef.current.getBoundingClientRect();
74
+
75
+ var threshold = filledRect.width / (inputRect.width / 100);
76
+ var degree = style.fontStyle === 'italic' ? 100 : 90;
77
+
78
+ var typedValueColor = theme.inputTextColor;
79
+ var maskColor = theme.inputPlaceholderColor;
80
+ if (props.disabled) {
81
+ typedValueColor = theme.inputTextColorDisabled;
82
+ maskColor = theme.inputTextColorDisabled;
83
+ }
84
+ if (props.showOnFocus) {
85
+ maskColor = focused.current ? maskColor : 'transparent';
86
+ }
87
+
88
+ inputRef.current.style.backgroundImage = "\n linear-gradient(\n " +
89
+
90
+ degree + "deg,\n " +
91
+ typedValueColor + " " + threshold + "%,\n " +
92
+ maskColor + " " + threshold + "%\n )";
93
+
94
+ }, [
95
+ props.showOnFocus,
96
+ props.disabled,
97
+ theme.inputTextColor,
98
+ theme.inputPlaceholderColor,
99
+ theme.inputTextColorDisabled]
100
+ );
101
+
102
+ var debouncedPaintText = (0, _react.useCallback)(function () {return (0, _lodash.default)(paintText);}, [paintText])();
103
+
104
+ var activation = (0, _react.useCallback)(function () {
105
+ if (active) {
106
+ debouncedPaintText();
107
+ } else {var _inputRef$current2;
108
+ debouncedPaintText.cancel();
109
+ inputRef.current && (inputRef.current.style.backgroundImage = '');
110
+ (_inputRef$current2 = inputRef.current) == null || _inputRef$current2.classList.remove(_ColorableInputElement.globalClasses.input);
111
+ }
112
+ }, [debouncedPaintText, active]);
113
+
46
114
  (0, _react.useEffect)(function () {
47
- activation(props);
115
+ activation();
48
116
  updateActive();
49
- }, [active, showOnFocus, props.value, props.defaultValue, props.disabled, focused.current]);
117
+ }, [props.value, props.defaultValue, theme, activation]);
50
118
 
51
119
  (0, _react.useEffect)(function () {
52
120
  if (inputRef.current) {
@@ -68,11 +136,11 @@ var ColorableInputElement = exports.ColorableInputElement = (0, _forwardRefAndNa
68
136
  ));
69
137
 
70
138
 
71
- function handleInput(e) {var _inputRef$current;
72
- var isActive = !((_inputRef$current = inputRef.current) != null && (_inputRef$current = _inputRef$current.parentElement) != null && _inputRef$current.querySelector(':placeholder-shown'));
139
+ function handleInput(e) {var _inputRef$current3;
140
+ var isActive = !((_inputRef$current3 = inputRef.current) != null && (_inputRef$current3 = _inputRef$current3.parentElement) != null && _inputRef$current3.querySelector(':placeholder-shown'));
73
141
  setActive(isActive);
74
142
 
75
- activation(props);
143
+ activation();
76
144
 
77
145
  onInput == null || onInput(e);
78
146
  }
@@ -94,69 +162,9 @@ var ColorableInputElement = exports.ColorableInputElement = (0, _forwardRefAndNa
94
162
  }
95
163
 
96
164
  function updateActive() {
97
- setTimeout(function () {var _inputRef$current2;
98
- setActive(!((_inputRef$current2 = inputRef.current) != null && (_inputRef$current2 = _inputRef$current2.parentElement) != null && _inputRef$current2.querySelector(':placeholder-shown')));
165
+ setTimeout(function () {var _inputRef$current4;
166
+ setActive(!((_inputRef$current4 = inputRef.current) != null && (_inputRef$current4 = _inputRef$current4.parentElement) != null && _inputRef$current4.querySelector(':placeholder-shown')));
99
167
  });
100
168
  }
101
-
102
- function activation(props) {
103
- if (active) {
104
- debouncedPaintText(props);
105
- } else {var _inputRef$current3;
106
- debouncedPaintText.cancel();
107
- inputRef.current && (inputRef.current.style.backgroundImage = '');
108
- (_inputRef$current3 = inputRef.current) == null || _inputRef$current3.classList.remove(_ColorableInputElement.globalClasses.input);
109
- }
110
- }
111
-
112
- function paintText(_props) {var _inputRef$current4, _shadow;if (_props === void 0) {_props = props;}
113
- if (!spanRef.current || !inputRef.current || !inputStyle.current || !(0, _globalObject.isBrowser)(_globalObject.globalObject)) {
114
- return;
115
- }
116
-
117
- (_inputRef$current4 = inputRef.current) == null || _inputRef$current4.classList.add(_ColorableInputElement.globalClasses.input);
118
-
119
- var shadow = spanRef.current.shadowRoot;
120
- var typedValueElement = (_shadow = shadow) == null ? void 0 : _shadow.getElementById('span');
121
-
122
- if (!typedValueElement) {
123
- shadow = spanRef.current.attachShadow({ mode: 'open' });
124
-
125
- typedValueElement = _globalObject.globalObject.document.createElement('span');
126
- typedValueElement.setAttribute('id', 'span');
127
-
128
- shadow.appendChild(typedValueElement);
129
- }
130
-
131
- var style = inputStyle.current;
132
-
133
- typedValueElement.textContent =
134
- (inputRef.current.getAttribute('data-unmasked-value') || focused.current) &&
135
- inputRef.current.getAttribute('data-typed-value') ||
136
- '';
137
-
138
- var inputRect = inputRef.current.getBoundingClientRect();
139
- var filledRect = spanRef.current.getBoundingClientRect();
140
-
141
- var threshold = filledRect.width / (inputRect.width / 100);
142
- var degree = style.fontStyle === 'italic' ? 100 : 90;
143
-
144
- var typedValueColor = theme.inputTextColor;
145
- var maskColor = theme.inputPlaceholderColor;
146
- if (_props.disabled) {
147
- typedValueColor = theme.inputTextColorDisabled;
148
- maskColor = theme.inputTextColorDisabled;
149
- }
150
- if (_props.showOnFocus) {
151
- maskColor = focused.current ? maskColor : 'transparent';
152
- }
153
-
154
- inputRef.current.style.backgroundImage = "\n linear-gradient(\n " +
155
-
156
- degree + "deg,\n " +
157
- typedValueColor + " " + threshold + "%,\n " +
158
- maskColor + " " + threshold + "%\n )";
159
-
160
- }
161
169
  }
162
170
  );
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireWildcard","require","_globalObject","_lodash","_interopRequireDefault","_ThemeContext","_forwardRefAndName","_Emotion","_ColorableInputElement","_excluded","ColorableInputElement","exports","forwardRefAndName","props","ref","inputRef","useRef","spanRef","focused","inputStyle","React","theme","useContext","ThemeContext","debouncedPaintText","useCallback","debounce","paintText","_useState","useState","active","setActive","children","onInput","onFocus","onBlur","showOnFocus","inputProps","_objectWithoutPropertiesLoose2","default","useImperativeHandle","input","current","getRootNode","useEffect","updateActive","activation","value","defaultValue","disabled","getComputedStyle","createElement","Fragment","cloneElement","_extends2","handleInput","handleFocus","handleBlur","className","cx","globalClasses","style","visibility","position","whiteSpace","e","_inputRef$current","isActive","parentElement","querySelector","setTimeout","_inputRef$current2","_inputRef$current3","cancel","backgroundImage","classList","remove","_props","_inputRef$current4","_shadow","isBrowser","globalObject","add","shadow","shadowRoot","typedValueElement","getElementById","attachShadow","mode","document","setAttribute","appendChild","textContent","getAttribute","inputRect","getBoundingClientRect","filledRect","threshold","width","degree","fontStyle","typedValueColor","inputTextColor","maskColor","inputPlaceholderColor","inputTextColorDisabled"],"sources":["ColorableInputElement.tsx"],"sourcesContent":["import 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 debouncedPaintText = useCallback(debounce(paintText), []);\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 useEffect(() => {\n activation(props);\n updateActive();\n }, [active, showOnFocus, props.value, props.defaultValue, props.disabled, focused.current]);\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(props);\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 function activation(props: ColorableInputElementProps) {\n if (active) {\n debouncedPaintText(props);\n } else {\n debouncedPaintText.cancel();\n inputRef.current && (inputRef.current.style.backgroundImage = '');\n inputRef.current?.classList.remove(globalClasses.input);\n }\n }\n\n function paintText(_props: Partial<ColorableInputElementProps> = props) {\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 },\n);\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_globalObject","_lodash","_interopRequireDefault","_ThemeContext","_forwardRefAndName","_Emotion","_ColorableInputElement","_excluded","ColorableInputElement","exports","forwardRefAndName","props","ref","inputRef","useRef","spanRef","focused","inputStyle","React","theme","useContext","ThemeContext","_useState","useState","active","setActive","children","onInput","onFocus","onBlur","showOnFocus","inputProps","_objectWithoutPropertiesLoose2","default","useImperativeHandle","input","current","getRootNode","useEffect","updateActive","paintText","useCallback","_inputRef$current","_shadow","isBrowser","globalObject","classList","add","globalClasses","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","debounce","activation","_inputRef$current2","cancel","remove","value","defaultValue","getComputedStyle","Fragment","cloneElement","_extends2","handleInput","handleFocus","handleBlur","className","cx","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":"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","ignoreList":[]}
@@ -23,7 +23,7 @@ export interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {
23
23
  type DefaultProps = Required<Pick<ZIndexProps, 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'>>;
24
24
  interface ZIndexState {
25
25
  zIndex: number;
26
- savedZIndexContext: {
26
+ DOMZIndexContext: {
27
27
  parentLayerZIndex: number;
28
28
  maxZIndex: number;
29
29
  } | null;
@@ -1,5 +1,6 @@
1
1
  "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ZIndex = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
2
2
  var _globalObject = require("@skbkontur/global-object");
3
+ var _lodash = _interopRequireDefault(require("lodash.isequal"));
3
4
 
4
5
  var _callChildRef = require("../../lib/callChildRef/callChildRef");
5
6
  var _rootNode = require("../../lib/rootNode");
@@ -88,7 +89,14 @@ ZIndex = exports.ZIndex = (0, _rootNode.rootNode)(_class = (_ZIndex = /*#__PURE_
88
89
 
89
90
 
90
91
  function ZIndex(props) {var _this;
91
- _this = _React$Component.call(this, props) || this;_this.state = { zIndex: 0, savedZIndexContext: null };_this.getProps = (0, _createPropsGetter.createPropsGetter)(ZIndex.defaultProps);_this.zIndexContext = null;_this.
92
+ _this = _React$Component.call(this, props) || this;_this.state = { zIndex: 0, DOMZIndexContext: null };_this.getProps = (0, _createPropsGetter.createPropsGetter)(ZIndex.defaultProps);_this.zIndexContext = null;_this.
93
+
94
+
95
+
96
+
97
+
98
+
99
+
92
100
 
93
101
 
94
102
 
@@ -183,8 +191,12 @@ ZIndex = exports.ZIndex = (0, _rootNode.rootNode)(_class = (_ZIndex = /*#__PURE_
183
191
  };_this.
184
192
 
185
193
  tryGetContextByDOM = function (element) {
186
- if (DEFAULT_ZINDEX_CONTEXT === _this.zIndexContext && _this.state.savedZIndexContext === null) {var _element$parentElemen;
187
- var savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;
194
+ if (
195
+ _this.props.applyZIndex &&
196
+ (0, _lodash.default)(DEFAULT_ZINDEX_CONTEXT, _this.zIndexContext) &&
197
+ _this.state.DOMZIndexContext === null)
198
+ {var _element$parentElemen;
199
+ var DOMZIndexContext = DEFAULT_ZINDEX_CONTEXT;
188
200
  var portal = (_element$parentElemen = element.parentElement) == null ? void 0 : _element$parentElemen.closest("[" + _RenderContainer.PORTAL_OUTLET_ATTR + "]");
189
201
 
190
202
  if ((0, _isInstanceOf.isInstanceOf)(portal, _globalObject.globalObject.HTMLElement)) {var _globalObject$documen, _noscript$parentEleme;
@@ -201,10 +213,10 @@ ZIndex = exports.ZIndex = (0, _rootNode.rootNode)(_class = (_ZIndex = /*#__PURE_
201
213
  maxZIndex = _this.calcZIndex(newZIndex, maxZIndex);
202
214
  }
203
215
 
204
- savedZIndexContext = { maxZIndex: maxZIndex, parentLayerZIndex: newZIndex };
216
+ DOMZIndexContext = { maxZIndex: maxZIndex, parentLayerZIndex: newZIndex };
205
217
  }
206
218
  }
207
219
 
208
- _this.setState({ savedZIndexContext: savedZIndexContext });
220
+ _this.setState({ DOMZIndexContext: DOMZIndexContext });
209
221
  }
210
- };_this.state.zIndex = _this.increment();return _this;}(0, _inheritsLoose2.default)(ZIndex, _React$Component);var _proto = ZIndex.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);this.setState({ zIndex: this.increment() });}};_proto.componentWillUnmount = function componentWillUnmount() {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);};_proto.render = function render() {var _this2 = this;var _this$getProps2 = this.getProps(),style = _this$getProps2.style,children = _this$getProps2.children,delta = _this$getProps2.delta,priority = _this$getProps2.priority,applyZIndex = _this$getProps2.applyZIndex,coverChildren = _this$getProps2.coverChildren,createStackingContext = _this$getProps2.createStackingContext,wrapperRef = _this$getProps2.wrapperRef,useWrapper = _this$getProps2.useWrapper,rest = (0, _objectWithoutPropertiesLoose2.default)(_this$getProps2, _excluded);var wrapperStyle = {};return /*#__PURE__*/_react.default.createElement(ZIndexContext.Consumer, null, function (context) {_this2.zIndexContext = context;var _ref = _this2.state.savedZIndexContext || context,parentLayerZIndex = _ref.parentLayerZIndex,maxZIndex = _ref.maxZIndex;var zIndexContextValue = { parentLayerZIndex: parentLayerZIndex, maxZIndex: maxZIndex };var newZIndex = 0;if (applyZIndex) {newZIndex = _this2.calcZIndex(parentLayerZIndex, maxZIndex);wrapperStyle.zIndex = newZIndex;zIndexContextValue = coverChildren ? { parentLayerZIndex: parentLayerZIndex, maxZIndex: newZIndex } : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };if (createStackingContext) {(0, _globalObject.isBrowser)(_globalObject.globalObject) && 'isolation' in _globalObject.globalObject.document.body.style ? wrapperStyle.isolation = 'isolate' : wrapperStyle.transform = 'rotate(0)';}}var child = !useWrapper ? children : /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({ style: (0, _extends2.default)({}, style, wrapperStyle), ref: _this2.wrapperRef }, rest), children);return /*#__PURE__*/_react.default.createElement(ZIndexContext.Provider, { value: zIndexContextValue }, child);});};_proto.calcZIndex = function calcZIndex(parentLayerZIndex, maxZIndex) {var newZIndex = this.state.zIndex;if (Number.isFinite(maxZIndex)) {var allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;var scale = _ZIndexStorage.upperBorder / allowedValuesIntervalLength;newZIndex = Math.ceil(newZIndex / scale);}newZIndex += parentLayerZIndex;return newZIndex;};return ZIndex;}(_react.default.Component), _ZIndex.priorities = _ZIndexStorage.componentPriorities, _ZIndex.__KONTUR_REACT_UI__ = 'ZIndex', _ZIndex.displayName = 'ZIndex', _ZIndex.defaultProps = { delta: 10, priority: 0, style: {}, applyZIndex: true, coverChildren: false, createStackingContext: false, useWrapper: true }, _ZIndex.propTypes = { delta: function delta(props) {if ((props.delta || _ZIndex.defaultProps.delta) <= 0) {return new Error("[ZIndex]: Prop 'delta' must be greater than 0, received " + props.delta);}if (Math.trunc(props.delta || _ZIndex.defaultProps.delta) !== props.delta) {return new Error("[ZIndex]: Prop 'delta' must be integer, received " + props.delta);}} }, _ZIndex)) || _class;
222
+ };_this.state.zIndex = _this.increment();return _this;}(0, _inheritsLoose2.default)(ZIndex, _React$Component);var _proto = ZIndex.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);this.setState({ zIndex: this.increment() });}};_proto.componentWillUnmount = function componentWillUnmount() {(0, _ZIndexStorage.removeZIndex)(this.state.zIndex);};_proto.render = function render() {var _this2 = this;var _this$getProps2 = this.getProps(),style = _this$getProps2.style,children = _this$getProps2.children,delta = _this$getProps2.delta,priority = _this$getProps2.priority,applyZIndex = _this$getProps2.applyZIndex,coverChildren = _this$getProps2.coverChildren,createStackingContext = _this$getProps2.createStackingContext,wrapperRef = _this$getProps2.wrapperRef,useWrapper = _this$getProps2.useWrapper,rest = (0, _objectWithoutPropertiesLoose2.default)(_this$getProps2, _excluded);var wrapperStyle = {};return /*#__PURE__*/_react.default.createElement(ZIndexContext.Consumer, null, function (context) {_this2.zIndexContext = context;var currentZIndexContext = _this2.state.DOMZIndexContext && (0, _lodash.default)(context, DEFAULT_ZINDEX_CONTEXT) ? _this2.state.DOMZIndexContext : context;var parentLayerZIndex = currentZIndexContext.parentLayerZIndex,maxZIndex = currentZIndexContext.maxZIndex;var newZIndexContext = currentZIndexContext;var newZIndex = 0;if (applyZIndex) {newZIndex = _this2.calcZIndex(parentLayerZIndex, maxZIndex);wrapperStyle.zIndex = newZIndex;newZIndexContext = coverChildren ? { parentLayerZIndex: parentLayerZIndex, maxZIndex: newZIndex } : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };if (createStackingContext) {(0, _globalObject.isBrowser)(_globalObject.globalObject) && 'isolation' in _globalObject.globalObject.document.body.style ? wrapperStyle.isolation = 'isolate' : wrapperStyle.transform = 'rotate(0)';}}var child = !useWrapper ? children : /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({ style: (0, _extends2.default)({}, style, wrapperStyle), ref: _this2.wrapperRef }, rest), children);return /*#__PURE__*/_react.default.createElement(ZIndexContext.Provider, { value: newZIndexContext }, child);});};_proto.calcZIndex = function calcZIndex(parentLayerZIndex, maxZIndex) {var newZIndex = this.state.zIndex;if (Number.isFinite(maxZIndex)) {var allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;var scale = _ZIndexStorage.upperBorder / allowedValuesIntervalLength;newZIndex = Math.ceil(newZIndex / scale);}newZIndex += parentLayerZIndex;return newZIndex;};return ZIndex;}(_react.default.Component), _ZIndex.priorities = _ZIndexStorage.componentPriorities, _ZIndex.__KONTUR_REACT_UI__ = 'ZIndex', _ZIndex.displayName = 'ZIndex', _ZIndex.defaultProps = { delta: 10, priority: 0, style: {}, applyZIndex: true, coverChildren: false, createStackingContext: false, useWrapper: true }, _ZIndex.propTypes = { delta: function delta(props) {if ((props.delta || _ZIndex.defaultProps.delta) <= 0) {return new Error("[ZIndex]: Prop 'delta' must be greater than 0, received " + props.delta);}if (Math.trunc(props.delta || _ZIndex.defaultProps.delta) !== props.delta) {return new Error("[ZIndex]: Prop 'delta' must be integer, received " + props.delta);}} }, _ZIndex)) || _class;
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_callChildRef","_rootNode","_createPropsGetter","_isInstanceOf","_Loader","_RenderContainer","_ZIndexStorage","_excluded","_class","_ZIndex","DEFAULT_ZINDEX_CONTEXT","parentLayerZIndex","maxZIndex","Infinity","ZIndexContext","React","createContext","displayName","ZIndex","exports","rootNode","_React$Component","props","_this","call","state","zIndex","savedZIndexContext","getProps","createPropsGetter","defaultProps","zIndexContext","wrapperRef","element","setRootNode","callChildRef","tryGetContextByDOM","increment","_this$getProps","priority","delta","incrementZIndex","_element$parentElemen","portal","parentElement","closest","PORTAL_OUTLET_ATTR","isInstanceOf","globalObject","HTMLElement","_globalObject$documen","_noscript$parentEleme","portalID","getAttribute","noscript","document","querySelector","PORTAL_INLET_ATTR","parent","_parent$parentElement","newZIndex","Number","style","dataset","tid","LoaderDataTids","veil","calcZIndex","setState","_inheritsLoose2","default","_proto","prototype","componentDidUpdate","prevProps","removeZIndex","componentWillUnmount","render","_this2","_this$getProps2","children","applyZIndex","coverChildren","createStackingContext","useWrapper","rest","_objectWithoutPropertiesLoose2","wrapperStyle","createElement","Consumer","context","_ref","zIndexContextValue","isFinite","isBrowser","body","isolation","transform","child","_extends2","ref","Provider","value","allowedValuesIntervalLength","scale","upperBorder","Math","ceil","Component","priorities","componentPriorities","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"sources":["ZIndex.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { LoaderDataTids } from '../../components/Loader';\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../RenderContainer';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName, componentPriorities } from './ZIndexStorage';\n\nconst DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };\n\nconst ZIndexContext = React.createContext(DEFAULT_ZINDEX_CONTEXT);\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Приращение к z-index\n */\n delta?: number;\n priority?: number | LayerComponentName;\n style?: React.CSSProperties;\n createStackingContext?: boolean;\n coverChildren?: boolean;\n applyZIndex?: boolean;\n className?: string;\n wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n * Для случаев, когда необходимо задать **только** контекст для области.\n *\n * @default true\n */\n useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n Pick<\n ZIndexProps,\n 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n >\n>;\n\ninterface ZIndexState {\n zIndex: number;\n savedZIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n public static priorities = componentPriorities;\n public static __KONTUR_REACT_UI__ = 'ZIndex';\n public static displayName = 'ZIndex';\n\n public static defaultProps: DefaultProps = {\n delta: 10,\n priority: 0,\n style: {},\n applyZIndex: true,\n coverChildren: false,\n createStackingContext: false,\n useWrapper: true,\n };\n\n public state: ZIndexState = {\n zIndex: 0,\n savedZIndexContext: null,\n };\n\n private getProps = createPropsGetter(ZIndex.defaultProps);\n\n public static propTypes = {\n delta(props: ZIndexProps) {\n if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n }\n if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n }\n },\n };\n\n private setRootNode!: TSetRootNode;\n private zIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null = null;\n\n constructor(props: ZIndexProps) {\n super(props);\n this.state.zIndex = this.increment();\n }\n\n public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n removeZIndex(this.state.zIndex);\n this.setState({ zIndex: this.increment() });\n }\n }\n\n public componentWillUnmount() {\n removeZIndex(this.state.zIndex);\n }\n\n public render() {\n const {\n style,\n children,\n delta,\n priority,\n applyZIndex,\n coverChildren,\n createStackingContext,\n wrapperRef,\n useWrapper,\n ...rest\n } = this.getProps();\n\n const wrapperStyle: React.CSSProperties = {};\n\n return (\n <ZIndexContext.Consumer>\n {(context) => {\n this.zIndexContext = context;\n const { parentLayerZIndex, maxZIndex } = this.state.savedZIndexContext || context;\n let zIndexContextValue = { parentLayerZIndex, maxZIndex };\n let newZIndex = 0;\n if (applyZIndex) {\n newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n wrapperStyle.zIndex = newZIndex;\n\n zIndexContextValue = coverChildren\n ? { parentLayerZIndex, maxZIndex: newZIndex }\n : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n if (createStackingContext) {\n isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n ? (wrapperStyle.isolation = 'isolate')\n : (wrapperStyle.transform = 'rotate(0)');\n }\n }\n\n const child = !useWrapper ? (\n children\n ) : (\n <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n {children}\n </div>\n );\n\n return <ZIndexContext.Provider value={zIndexContextValue}>{child}</ZIndexContext.Provider>;\n }}\n </ZIndexContext.Consumer>\n );\n }\n\n private wrapperRef = (element: HTMLDivElement | null) => {\n const { wrapperRef } = this.props;\n this.setRootNode(element);\n wrapperRef && callChildRef(wrapperRef, element);\n element && this.tryGetContextByDOM(element);\n };\n\n private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n let newZIndex = this.state.zIndex;\n\n if (Number.isFinite(maxZIndex)) {\n const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n const scale = upperBorder / allowedValuesIntervalLength;\n newZIndex = Math.ceil(newZIndex / scale);\n }\n\n newZIndex += parentLayerZIndex;\n\n return newZIndex;\n }\n\n private increment = () => {\n const { priority, delta } = this.getProps();\n\n return incrementZIndex(priority, delta);\n };\n\n private tryGetContextByDOM = (element: HTMLDivElement) => {\n if (DEFAULT_ZINDEX_CONTEXT === this.zIndexContext && this.state.savedZIndexContext === null) {\n let savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;\n const portal = element.parentElement?.closest(`[${PORTAL_OUTLET_ATTR}]`);\n\n if (isInstanceOf(portal, globalObject.HTMLElement)) {\n const portalID = portal.getAttribute(PORTAL_OUTLET_ATTR);\n const noscript = globalObject.document?.querySelector(`noscript[${PORTAL_INLET_ATTR}=\"${portalID}\"]`);\n const parent = noscript?.parentElement?.closest('[style*=z-index]');\n\n if (isInstanceOf(parent, globalObject.HTMLElement)) {\n const newZIndex = Number(parent.style.zIndex || 0);\n\n let maxZIndex = Infinity;\n\n if (parent.parentElement?.dataset.tid === LoaderDataTids.veil) {\n maxZIndex = this.calcZIndex(newZIndex, maxZIndex);\n }\n\n savedZIndexContext = { maxZIndex, parentLayerZIndex: newZIndex };\n }\n }\n\n this.setState({ savedZIndexContext });\n }\n };\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_globalObject","_lodash","_callChildRef","_rootNode","_createPropsGetter","_isInstanceOf","_Loader","_RenderContainer","_ZIndexStorage","_excluded","_class","_ZIndex","DEFAULT_ZINDEX_CONTEXT","parentLayerZIndex","maxZIndex","Infinity","ZIndexContext","React","createContext","displayName","ZIndex","exports","rootNode","_React$Component","props","_this","call","state","zIndex","DOMZIndexContext","getProps","createPropsGetter","defaultProps","zIndexContext","wrapperRef","element","setRootNode","callChildRef","tryGetContextByDOM","increment","_this$getProps","priority","delta","incrementZIndex","applyZIndex","isEqual","_element$parentElemen","portal","parentElement","closest","PORTAL_OUTLET_ATTR","isInstanceOf","globalObject","HTMLElement","_globalObject$documen","_noscript$parentEleme","portalID","getAttribute","noscript","document","querySelector","PORTAL_INLET_ATTR","parent","_parent$parentElement","newZIndex","Number","style","dataset","tid","LoaderDataTids","veil","calcZIndex","setState","_inheritsLoose2","default","_proto","prototype","componentDidUpdate","prevProps","removeZIndex","componentWillUnmount","render","_this2","_this$getProps2","children","coverChildren","createStackingContext","useWrapper","rest","_objectWithoutPropertiesLoose2","wrapperStyle","createElement","Consumer","context","currentZIndexContext","newZIndexContext","isFinite","isBrowser","body","isolation","transform","child","_extends2","ref","Provider","value","allowedValuesIntervalLength","scale","upperBorder","Math","ceil","Component","priorities","componentPriorities","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"sources":["ZIndex.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\nimport isEqual from 'lodash.isequal';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { LoaderDataTids } from '../../components/Loader';\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../RenderContainer';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName, componentPriorities } from './ZIndexStorage';\n\nconst DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };\n\nconst ZIndexContext = React.createContext(DEFAULT_ZINDEX_CONTEXT);\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Приращение к z-index\n */\n delta?: number;\n priority?: number | LayerComponentName;\n style?: React.CSSProperties;\n createStackingContext?: boolean;\n coverChildren?: boolean;\n applyZIndex?: boolean;\n className?: string;\n wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n * Для случаев, когда необходимо задать **только** контекст для области.\n *\n * @default true\n */\n useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n Pick<\n ZIndexProps,\n 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n >\n>;\n\ninterface ZIndexState {\n zIndex: number;\n DOMZIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n public static priorities = componentPriorities;\n public static __KONTUR_REACT_UI__ = 'ZIndex';\n public static displayName = 'ZIndex';\n\n public static defaultProps: DefaultProps = {\n delta: 10,\n priority: 0,\n style: {},\n applyZIndex: true,\n coverChildren: false,\n createStackingContext: false,\n useWrapper: true,\n };\n\n public state: ZIndexState = {\n zIndex: 0,\n DOMZIndexContext: null,\n };\n\n private getProps = createPropsGetter(ZIndex.defaultProps);\n\n public static propTypes = {\n delta(props: ZIndexProps) {\n if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n }\n if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n }\n },\n };\n\n private setRootNode!: TSetRootNode;\n private zIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null = null;\n\n constructor(props: ZIndexProps) {\n super(props);\n this.state.zIndex = this.increment();\n }\n\n public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n removeZIndex(this.state.zIndex);\n this.setState({ zIndex: this.increment() });\n }\n }\n\n public componentWillUnmount() {\n removeZIndex(this.state.zIndex);\n }\n\n public render() {\n const {\n style,\n children,\n delta,\n priority,\n applyZIndex,\n coverChildren,\n createStackingContext,\n wrapperRef,\n useWrapper,\n ...rest\n } = this.getProps();\n\n const wrapperStyle: React.CSSProperties = {};\n\n return (\n <ZIndexContext.Consumer>\n {(context) => {\n this.zIndexContext = context;\n\n const currentZIndexContext =\n this.state.DOMZIndexContext && isEqual(context, DEFAULT_ZINDEX_CONTEXT)\n ? this.state.DOMZIndexContext\n : context;\n const { parentLayerZIndex, maxZIndex } = currentZIndexContext;\n\n let newZIndexContext = currentZIndexContext;\n let newZIndex = 0;\n\n if (applyZIndex) {\n newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n wrapperStyle.zIndex = newZIndex;\n\n newZIndexContext = coverChildren\n ? { parentLayerZIndex, maxZIndex: newZIndex }\n : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n if (createStackingContext) {\n isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n ? (wrapperStyle.isolation = 'isolate')\n : (wrapperStyle.transform = 'rotate(0)');\n }\n }\n\n const child = !useWrapper ? (\n children\n ) : (\n <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n {children}\n </div>\n );\n\n return <ZIndexContext.Provider value={newZIndexContext}>{child}</ZIndexContext.Provider>;\n }}\n </ZIndexContext.Consumer>\n );\n }\n\n private wrapperRef = (element: HTMLDivElement | null) => {\n const { wrapperRef } = this.props;\n this.setRootNode(element);\n wrapperRef && callChildRef(wrapperRef, element);\n element && this.tryGetContextByDOM(element);\n };\n\n private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n let newZIndex = this.state.zIndex;\n\n if (Number.isFinite(maxZIndex)) {\n const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n const scale = upperBorder / allowedValuesIntervalLength;\n newZIndex = Math.ceil(newZIndex / scale);\n }\n\n newZIndex += parentLayerZIndex;\n\n return newZIndex;\n }\n\n private increment = () => {\n const { priority, delta } = this.getProps();\n\n return incrementZIndex(priority, delta);\n };\n\n private tryGetContextByDOM = (element: HTMLDivElement) => {\n if (\n this.props.applyZIndex &&\n isEqual(DEFAULT_ZINDEX_CONTEXT, this.zIndexContext) &&\n this.state.DOMZIndexContext === null\n ) {\n let DOMZIndexContext = DEFAULT_ZINDEX_CONTEXT;\n const portal = element.parentElement?.closest(`[${PORTAL_OUTLET_ATTR}]`);\n\n if (isInstanceOf(portal, globalObject.HTMLElement)) {\n const portalID = portal.getAttribute(PORTAL_OUTLET_ATTR);\n const noscript = globalObject.document?.querySelector(`noscript[${PORTAL_INLET_ATTR}=\"${portalID}\"]`);\n const parent = noscript?.parentElement?.closest('[style*=z-index]');\n\n if (isInstanceOf(parent, globalObject.HTMLElement)) {\n const newZIndex = Number(parent.style.zIndex || 0);\n\n let maxZIndex = Infinity;\n\n if (parent.parentElement?.dataset.tid === LoaderDataTids.veil) {\n maxZIndex = this.calcZIndex(newZIndex, maxZIndex);\n }\n\n DOMZIndexContext = { maxZIndex, parentLayerZIndex: newZIndex };\n }\n }\n\n this.setState({ DOMZIndexContext });\n }\n };\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- var _excluded = ["children", "onInput", "onFocus", "onBlur", "showOnFocus"];
3
+ var _excluded = ["children", "onInput", "onFocus", "onBlur", "showOnFocus"]; /* eslint react-hooks/exhaustive-deps: 2 */
4
4
  import React, { useContext, useEffect, useImperativeHandle, useRef, useCallback, useState } from 'react';
5
5
  import { globalObject, isBrowser } from '@skbkontur/global-object';
6
6
  import debounce from 'lodash.debounce';
@@ -20,7 +20,6 @@ export var ColorableInputElement = forwardRefAndName('ColorableInputElement', fu
20
20
  var focused = useRef(false);
21
21
  var inputStyle = React.useRef();
22
22
  var theme = useContext(ThemeContext);
23
- var debouncedPaintText = useCallback(debounce(paintText), []);
24
23
  var _useState = useState(true),
25
24
  active = _useState[0],
26
25
  setActive = _useState[1];
@@ -39,10 +38,56 @@ export var ColorableInputElement = forwardRefAndName('ColorableInputElement', fu
39
38
  };
40
39
  }, []);
41
40
  useEffect(updateActive, []);
41
+ var paintText = useCallback(function () {
42
+ var _inputRef$current, _shadow;
43
+ if (!spanRef.current || !inputRef.current || !inputStyle.current || !isBrowser(globalObject)) {
44
+ return;
45
+ }
46
+ (_inputRef$current = inputRef.current) == null || _inputRef$current.classList.add(globalClasses.input);
47
+ var shadow = spanRef.current.shadowRoot;
48
+ var typedValueElement = (_shadow = shadow) == null ? void 0 : _shadow.getElementById('span');
49
+ if (!typedValueElement) {
50
+ shadow = spanRef.current.attachShadow({
51
+ mode: 'open'
52
+ });
53
+ typedValueElement = globalObject.document.createElement('span');
54
+ typedValueElement.setAttribute('id', 'span');
55
+ shadow.appendChild(typedValueElement);
56
+ }
57
+ var style = inputStyle.current;
58
+ typedValueElement.textContent = (inputRef.current.getAttribute('data-unmasked-value') || focused.current) && inputRef.current.getAttribute('data-typed-value') || '';
59
+ var inputRect = inputRef.current.getBoundingClientRect();
60
+ var filledRect = spanRef.current.getBoundingClientRect();
61
+ var threshold = filledRect.width / (inputRect.width / 100);
62
+ var degree = style.fontStyle === 'italic' ? 100 : 90;
63
+ var typedValueColor = theme.inputTextColor;
64
+ var maskColor = theme.inputPlaceholderColor;
65
+ if (props.disabled) {
66
+ typedValueColor = theme.inputTextColorDisabled;
67
+ maskColor = theme.inputTextColorDisabled;
68
+ }
69
+ if (props.showOnFocus) {
70
+ maskColor = focused.current ? maskColor : 'transparent';
71
+ }
72
+ inputRef.current.style.backgroundImage = "\n linear-gradient(\n " + degree + "deg,\n " + typedValueColor + " " + threshold + "%,\n " + maskColor + " " + threshold + "%\n )";
73
+ }, [props.showOnFocus, props.disabled, theme.inputTextColor, theme.inputPlaceholderColor, theme.inputTextColorDisabled]);
74
+ var debouncedPaintText = useCallback(function () {
75
+ return debounce(paintText);
76
+ }, [paintText])();
77
+ var activation = useCallback(function () {
78
+ if (active) {
79
+ debouncedPaintText();
80
+ } else {
81
+ var _inputRef$current2;
82
+ debouncedPaintText.cancel();
83
+ inputRef.current && (inputRef.current.style.backgroundImage = '');
84
+ (_inputRef$current2 = inputRef.current) == null || _inputRef$current2.classList.remove(globalClasses.input);
85
+ }
86
+ }, [debouncedPaintText, active]);
42
87
  useEffect(function () {
43
- activation(props);
88
+ activation();
44
89
  updateActive();
45
- }, [active, showOnFocus, props.value, props.defaultValue, props.disabled, focused.current]);
90
+ }, [props.value, props.defaultValue, theme, activation]);
46
91
  useEffect(function () {
47
92
  if (inputRef.current) {
48
93
  inputStyle.current = getComputedStyle(inputRef.current);
@@ -66,10 +111,10 @@ export var ColorableInputElement = forwardRefAndName('ColorableInputElement', fu
66
111
  }))
67
112
  );
68
113
  function handleInput(e) {
69
- var _inputRef$current;
70
- var isActive = !((_inputRef$current = inputRef.current) != null && (_inputRef$current = _inputRef$current.parentElement) != null && _inputRef$current.querySelector(':placeholder-shown'));
114
+ var _inputRef$current3;
115
+ var isActive = !((_inputRef$current3 = inputRef.current) != null && (_inputRef$current3 = _inputRef$current3.parentElement) != null && _inputRef$current3.querySelector(':placeholder-shown'));
71
116
  setActive(isActive);
72
- activation(props);
117
+ activation();
73
118
  onInput == null || onInput(e);
74
119
  }
75
120
  function handleFocus(e) {
@@ -84,54 +129,8 @@ export var ColorableInputElement = forwardRefAndName('ColorableInputElement', fu
84
129
  }
85
130
  function updateActive() {
86
131
  setTimeout(function () {
87
- var _inputRef$current2;
88
- setActive(!((_inputRef$current2 = inputRef.current) != null && (_inputRef$current2 = _inputRef$current2.parentElement) != null && _inputRef$current2.querySelector(':placeholder-shown')));
132
+ var _inputRef$current4;
133
+ setActive(!((_inputRef$current4 = inputRef.current) != null && (_inputRef$current4 = _inputRef$current4.parentElement) != null && _inputRef$current4.querySelector(':placeholder-shown')));
89
134
  });
90
135
  }
91
- function activation(props) {
92
- if (active) {
93
- debouncedPaintText(props);
94
- } else {
95
- var _inputRef$current3;
96
- debouncedPaintText.cancel();
97
- inputRef.current && (inputRef.current.style.backgroundImage = '');
98
- (_inputRef$current3 = inputRef.current) == null || _inputRef$current3.classList.remove(globalClasses.input);
99
- }
100
- }
101
- function paintText(_props) {
102
- var _inputRef$current4, _shadow;
103
- if (_props === void 0) {
104
- _props = props;
105
- }
106
- if (!spanRef.current || !inputRef.current || !inputStyle.current || !isBrowser(globalObject)) {
107
- return;
108
- }
109
- (_inputRef$current4 = inputRef.current) == null || _inputRef$current4.classList.add(globalClasses.input);
110
- var shadow = spanRef.current.shadowRoot;
111
- var typedValueElement = (_shadow = shadow) == null ? void 0 : _shadow.getElementById('span');
112
- if (!typedValueElement) {
113
- shadow = spanRef.current.attachShadow({
114
- mode: 'open'
115
- });
116
- typedValueElement = globalObject.document.createElement('span');
117
- typedValueElement.setAttribute('id', 'span');
118
- shadow.appendChild(typedValueElement);
119
- }
120
- var style = inputStyle.current;
121
- typedValueElement.textContent = (inputRef.current.getAttribute('data-unmasked-value') || focused.current) && inputRef.current.getAttribute('data-typed-value') || '';
122
- var inputRect = inputRef.current.getBoundingClientRect();
123
- var filledRect = spanRef.current.getBoundingClientRect();
124
- var threshold = filledRect.width / (inputRect.width / 100);
125
- var degree = style.fontStyle === 'italic' ? 100 : 90;
126
- var typedValueColor = theme.inputTextColor;
127
- var maskColor = theme.inputPlaceholderColor;
128
- if (_props.disabled) {
129
- typedValueColor = theme.inputTextColorDisabled;
130
- maskColor = theme.inputTextColorDisabled;
131
- }
132
- if (_props.showOnFocus) {
133
- maskColor = focused.current ? maskColor : 'transparent';
134
- }
135
- inputRef.current.style.backgroundImage = "\n linear-gradient(\n " + degree + "deg,\n " + typedValueColor + " " + threshold + "%,\n " + maskColor + " " + threshold + "%\n )";
136
- }
137
136
  });
@@ -1 +1 @@
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","debouncedPaintText","paintText","_useState","active","setActive","children","onInput","onFocus","onBlur","showOnFocus","inputProps","_objectWithoutPropertiesLoose","_excluded","input","current","getRootNode","updateActive","activation","value","defaultValue","disabled","getComputedStyle","createElement","Fragment","cloneElement","_extends","handleInput","handleFocus","handleBlur","className","style","visibility","position","whiteSpace","e","_inputRef$current","isActive","parentElement","querySelector","setTimeout","_inputRef$current2","_inputRef$current3","cancel","backgroundImage","classList","remove","_props","_inputRef$current4","_shadow","add","shadow","shadowRoot","typedValueElement","getElementById","attachShadow","mode","document","setAttribute","appendChild","textContent","getAttribute","inputRect","getBoundingClientRect","filledRect","threshold","width","degree","fontStyle","typedValueColor","inputTextColor","maskColor","inputPlaceholderColor","inputTextColorDisabled"],"sources":["ColorableInputElement.tsx"],"sourcesContent":["import 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 debouncedPaintText = useCallback(debounce(paintText), []);\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 useEffect(() => {\n activation(props);\n updateActive();\n }, [active, showOnFocus, props.value, props.defaultValue, props.disabled, focused.current]);\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(props);\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 function activation(props: ColorableInputElementProps) {\n if (active) {\n debouncedPaintText(props);\n } else {\n debouncedPaintText.cancel();\n inputRef.current && (inputRef.current.style.backgroundImage = '');\n inputRef.current?.classList.remove(globalClasses.input);\n }\n }\n\n function paintText(_props: Partial<ColorableInputElementProps> = props) {\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 },\n);\n"],"mappings":"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","ignoreList":[]}
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":"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","ignoreList":[]}
@@ -5,6 +5,7 @@ var _excluded = ["style", "children", "delta", "priority", "applyZIndex", "cover
5
5
  var _class, _ZIndex;
6
6
  import React from 'react';
7
7
  import { globalObject, isBrowser } from '@skbkontur/global-object';
8
+ import isEqual from 'lodash.isequal';
8
9
  import { callChildRef } from "../../../lib/callChildRef/callChildRef";
9
10
  import { rootNode } from "../../../lib/rootNode";
10
11
  import { createPropsGetter } from "../../../lib/createPropsGetter";
@@ -24,7 +25,7 @@ export var ZIndex = rootNode(_class = (_ZIndex = /*#__PURE__*/function (_React$C
24
25
  _this = _React$Component.call(this, props) || this;
25
26
  _this.state = {
26
27
  zIndex: 0,
27
- savedZIndexContext: null
28
+ DOMZIndexContext: null
28
29
  };
29
30
  _this.getProps = createPropsGetter(ZIndex.defaultProps);
30
31
  _this.zIndexContext = null;
@@ -41,9 +42,9 @@ export var ZIndex = rootNode(_class = (_ZIndex = /*#__PURE__*/function (_React$C
41
42
  return incrementZIndex(priority, delta);
42
43
  };
43
44
  _this.tryGetContextByDOM = function (element) {
44
- if (DEFAULT_ZINDEX_CONTEXT === _this.zIndexContext && _this.state.savedZIndexContext === null) {
45
+ if (_this.props.applyZIndex && isEqual(DEFAULT_ZINDEX_CONTEXT, _this.zIndexContext) && _this.state.DOMZIndexContext === null) {
45
46
  var _element$parentElemen;
46
- var savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;
47
+ var DOMZIndexContext = DEFAULT_ZINDEX_CONTEXT;
47
48
  var portal = (_element$parentElemen = element.parentElement) == null ? void 0 : _element$parentElemen.closest("[" + PORTAL_OUTLET_ATTR + "]");
48
49
  if (isInstanceOf(portal, globalObject.HTMLElement)) {
49
50
  var _globalObject$documen, _noscript$parentEleme;
@@ -57,14 +58,14 @@ export var ZIndex = rootNode(_class = (_ZIndex = /*#__PURE__*/function (_React$C
57
58
  if (((_parent$parentElement = parent.parentElement) == null ? void 0 : _parent$parentElement.dataset.tid) === LoaderDataTids.veil) {
58
59
  maxZIndex = _this.calcZIndex(newZIndex, maxZIndex);
59
60
  }
60
- savedZIndexContext = {
61
+ DOMZIndexContext = {
61
62
  maxZIndex: maxZIndex,
62
63
  parentLayerZIndex: newZIndex
63
64
  };
64
65
  }
65
66
  }
66
67
  _this.setState({
67
- savedZIndexContext: savedZIndexContext
68
+ DOMZIndexContext: DOMZIndexContext
68
69
  });
69
70
  }
70
71
  };
@@ -100,18 +101,15 @@ export var ZIndex = rootNode(_class = (_ZIndex = /*#__PURE__*/function (_React$C
100
101
  var wrapperStyle = {};
101
102
  return /*#__PURE__*/React.createElement(ZIndexContext.Consumer, null, function (context) {
102
103
  _this2.zIndexContext = context;
103
- var _ref = _this2.state.savedZIndexContext || context,
104
- parentLayerZIndex = _ref.parentLayerZIndex,
105
- maxZIndex = _ref.maxZIndex;
106
- var zIndexContextValue = {
107
- parentLayerZIndex: parentLayerZIndex,
108
- maxZIndex: maxZIndex
109
- };
104
+ var currentZIndexContext = _this2.state.DOMZIndexContext && isEqual(context, DEFAULT_ZINDEX_CONTEXT) ? _this2.state.DOMZIndexContext : context;
105
+ var parentLayerZIndex = currentZIndexContext.parentLayerZIndex,
106
+ maxZIndex = currentZIndexContext.maxZIndex;
107
+ var newZIndexContext = currentZIndexContext;
110
108
  var newZIndex = 0;
111
109
  if (applyZIndex) {
112
110
  newZIndex = _this2.calcZIndex(parentLayerZIndex, maxZIndex);
113
111
  wrapperStyle.zIndex = newZIndex;
114
- zIndexContextValue = coverChildren ? {
112
+ newZIndexContext = coverChildren ? {
115
113
  parentLayerZIndex: parentLayerZIndex,
116
114
  maxZIndex: newZIndex
117
115
  } : {
@@ -127,7 +125,7 @@ export var ZIndex = rootNode(_class = (_ZIndex = /*#__PURE__*/function (_React$C
127
125
  ref: _this2.wrapperRef
128
126
  }, rest), children);
129
127
  return /*#__PURE__*/React.createElement(ZIndexContext.Provider, {
130
- value: zIndexContextValue
128
+ value: newZIndexContext
131
129
  }, child);
132
130
  });
133
131
  };
@@ -1 +1 @@
1
- {"version":3,"names":["React","globalObject","isBrowser","callChildRef","rootNode","createPropsGetter","isInstanceOf","LoaderDataTids","PORTAL_INLET_ATTR","PORTAL_OUTLET_ATTR","incrementZIndex","removeZIndex","upperBorder","componentPriorities","DEFAULT_ZINDEX_CONTEXT","parentLayerZIndex","maxZIndex","Infinity","ZIndexContext","createContext","displayName","ZIndex","_class","_ZIndex","_React$Component","props","_this","call","state","zIndex","savedZIndexContext","getProps","defaultProps","zIndexContext","wrapperRef","element","setRootNode","tryGetContextByDOM","increment","_this$getProps","priority","delta","_element$parentElemen","portal","parentElement","closest","HTMLElement","_globalObject$documen","_noscript$parentEleme","portalID","getAttribute","noscript","document","querySelector","parent","_parent$parentElement","newZIndex","Number","style","dataset","tid","veil","calcZIndex","setState","_inheritsLoose","_proto","prototype","componentDidUpdate","prevProps","componentWillUnmount","render","_this2","_this$getProps2","children","applyZIndex","coverChildren","createStackingContext","useWrapper","rest","_objectWithoutPropertiesLoose","_excluded","wrapperStyle","createElement","Consumer","context","_ref","zIndexContextValue","isFinite","body","isolation","transform","child","_extends","ref","Provider","value","allowedValuesIntervalLength","scale","Math","ceil","Component","priorities","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"sources":["ZIndex.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { LoaderDataTids } from '../../components/Loader';\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../RenderContainer';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName, componentPriorities } from './ZIndexStorage';\n\nconst DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };\n\nconst ZIndexContext = React.createContext(DEFAULT_ZINDEX_CONTEXT);\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Приращение к z-index\n */\n delta?: number;\n priority?: number | LayerComponentName;\n style?: React.CSSProperties;\n createStackingContext?: boolean;\n coverChildren?: boolean;\n applyZIndex?: boolean;\n className?: string;\n wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n * Для случаев, когда необходимо задать **только** контекст для области.\n *\n * @default true\n */\n useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n Pick<\n ZIndexProps,\n 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n >\n>;\n\ninterface ZIndexState {\n zIndex: number;\n savedZIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n public static priorities = componentPriorities;\n public static __KONTUR_REACT_UI__ = 'ZIndex';\n public static displayName = 'ZIndex';\n\n public static defaultProps: DefaultProps = {\n delta: 10,\n priority: 0,\n style: {},\n applyZIndex: true,\n coverChildren: false,\n createStackingContext: false,\n useWrapper: true,\n };\n\n public state: ZIndexState = {\n zIndex: 0,\n savedZIndexContext: null,\n };\n\n private getProps = createPropsGetter(ZIndex.defaultProps);\n\n public static propTypes = {\n delta(props: ZIndexProps) {\n if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n }\n if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n }\n },\n };\n\n private setRootNode!: TSetRootNode;\n private zIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null = null;\n\n constructor(props: ZIndexProps) {\n super(props);\n this.state.zIndex = this.increment();\n }\n\n public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n removeZIndex(this.state.zIndex);\n this.setState({ zIndex: this.increment() });\n }\n }\n\n public componentWillUnmount() {\n removeZIndex(this.state.zIndex);\n }\n\n public render() {\n const {\n style,\n children,\n delta,\n priority,\n applyZIndex,\n coverChildren,\n createStackingContext,\n wrapperRef,\n useWrapper,\n ...rest\n } = this.getProps();\n\n const wrapperStyle: React.CSSProperties = {};\n\n return (\n <ZIndexContext.Consumer>\n {(context) => {\n this.zIndexContext = context;\n const { parentLayerZIndex, maxZIndex } = this.state.savedZIndexContext || context;\n let zIndexContextValue = { parentLayerZIndex, maxZIndex };\n let newZIndex = 0;\n if (applyZIndex) {\n newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n wrapperStyle.zIndex = newZIndex;\n\n zIndexContextValue = coverChildren\n ? { parentLayerZIndex, maxZIndex: newZIndex }\n : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n if (createStackingContext) {\n isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n ? (wrapperStyle.isolation = 'isolate')\n : (wrapperStyle.transform = 'rotate(0)');\n }\n }\n\n const child = !useWrapper ? (\n children\n ) : (\n <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n {children}\n </div>\n );\n\n return <ZIndexContext.Provider value={zIndexContextValue}>{child}</ZIndexContext.Provider>;\n }}\n </ZIndexContext.Consumer>\n );\n }\n\n private wrapperRef = (element: HTMLDivElement | null) => {\n const { wrapperRef } = this.props;\n this.setRootNode(element);\n wrapperRef && callChildRef(wrapperRef, element);\n element && this.tryGetContextByDOM(element);\n };\n\n private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n let newZIndex = this.state.zIndex;\n\n if (Number.isFinite(maxZIndex)) {\n const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n const scale = upperBorder / allowedValuesIntervalLength;\n newZIndex = Math.ceil(newZIndex / scale);\n }\n\n newZIndex += parentLayerZIndex;\n\n return newZIndex;\n }\n\n private increment = () => {\n const { priority, delta } = this.getProps();\n\n return incrementZIndex(priority, delta);\n };\n\n private tryGetContextByDOM = (element: HTMLDivElement) => {\n if (DEFAULT_ZINDEX_CONTEXT === this.zIndexContext && this.state.savedZIndexContext === null) {\n let savedZIndexContext = DEFAULT_ZINDEX_CONTEXT;\n const portal = element.parentElement?.closest(`[${PORTAL_OUTLET_ATTR}]`);\n\n if (isInstanceOf(portal, globalObject.HTMLElement)) {\n const portalID = portal.getAttribute(PORTAL_OUTLET_ATTR);\n const noscript = globalObject.document?.querySelector(`noscript[${PORTAL_INLET_ATTR}=\"${portalID}\"]`);\n const parent = noscript?.parentElement?.closest('[style*=z-index]');\n\n if (isInstanceOf(parent, globalObject.HTMLElement)) {\n const newZIndex = Number(parent.style.zIndex || 0);\n\n let maxZIndex = Infinity;\n\n if (parent.parentElement?.dataset.tid === LoaderDataTids.veil) {\n maxZIndex = this.calcZIndex(newZIndex, maxZIndex);\n }\n\n savedZIndexContext = { maxZIndex, parentLayerZIndex: newZIndex };\n }\n }\n\n this.setState({ savedZIndexContext });\n }\n };\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["React","globalObject","isBrowser","isEqual","callChildRef","rootNode","createPropsGetter","isInstanceOf","LoaderDataTids","PORTAL_INLET_ATTR","PORTAL_OUTLET_ATTR","incrementZIndex","removeZIndex","upperBorder","componentPriorities","DEFAULT_ZINDEX_CONTEXT","parentLayerZIndex","maxZIndex","Infinity","ZIndexContext","createContext","displayName","ZIndex","_class","_ZIndex","_React$Component","props","_this","call","state","zIndex","DOMZIndexContext","getProps","defaultProps","zIndexContext","wrapperRef","element","setRootNode","tryGetContextByDOM","increment","_this$getProps","priority","delta","applyZIndex","_element$parentElemen","portal","parentElement","closest","HTMLElement","_globalObject$documen","_noscript$parentEleme","portalID","getAttribute","noscript","document","querySelector","parent","_parent$parentElement","newZIndex","Number","style","dataset","tid","veil","calcZIndex","setState","_inheritsLoose","_proto","prototype","componentDidUpdate","prevProps","componentWillUnmount","render","_this2","_this$getProps2","children","coverChildren","createStackingContext","useWrapper","rest","_objectWithoutPropertiesLoose","_excluded","wrapperStyle","createElement","Consumer","context","currentZIndexContext","newZIndexContext","isFinite","body","isolation","transform","child","_extends","ref","Provider","value","allowedValuesIntervalLength","scale","Math","ceil","Component","priorities","__KONTUR_REACT_UI__","propTypes","Error","trunc"],"sources":["ZIndex.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject, isBrowser } from '@skbkontur/global-object';\nimport isEqual from 'lodash.isequal';\n\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { LoaderDataTids } from '../../components/Loader';\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../RenderContainer';\n\nimport { incrementZIndex, removeZIndex, upperBorder, LayerComponentName, componentPriorities } from './ZIndexStorage';\n\nconst DEFAULT_ZINDEX_CONTEXT = { parentLayerZIndex: 0, maxZIndex: Infinity };\n\nconst ZIndexContext = React.createContext(DEFAULT_ZINDEX_CONTEXT);\n\nZIndexContext.displayName = 'ZIndexContext';\n\nexport interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {\n /**\n * Приращение к z-index\n */\n delta?: number;\n priority?: number | LayerComponentName;\n style?: React.CSSProperties;\n createStackingContext?: boolean;\n coverChildren?: boolean;\n applyZIndex?: boolean;\n className?: string;\n wrapperRef?: React.Ref<HTMLDivElement> | undefined | null;\n\n /**\n * Явно указывает, что вложенные элементы должны быть обёрнуты в `<div/>`.\n * Для случаев, когда необходимо задать **только** контекст для области.\n *\n * @default true\n */\n useWrapper?: boolean;\n}\n\ntype DefaultProps = Required<\n Pick<\n ZIndexProps,\n 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'\n >\n>;\n\ninterface ZIndexState {\n zIndex: number;\n DOMZIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null;\n}\n\n@rootNode\nexport class ZIndex extends React.Component<ZIndexProps, ZIndexState> {\n public static priorities = componentPriorities;\n public static __KONTUR_REACT_UI__ = 'ZIndex';\n public static displayName = 'ZIndex';\n\n public static defaultProps: DefaultProps = {\n delta: 10,\n priority: 0,\n style: {},\n applyZIndex: true,\n coverChildren: false,\n createStackingContext: false,\n useWrapper: true,\n };\n\n public state: ZIndexState = {\n zIndex: 0,\n DOMZIndexContext: null,\n };\n\n private getProps = createPropsGetter(ZIndex.defaultProps);\n\n public static propTypes = {\n delta(props: ZIndexProps) {\n if ((props.delta || ZIndex.defaultProps.delta) <= 0) {\n return new Error(`[ZIndex]: Prop 'delta' must be greater than 0, received ${props.delta}`);\n }\n if (Math.trunc(props.delta || ZIndex.defaultProps.delta) !== props.delta) {\n return new Error(`[ZIndex]: Prop 'delta' must be integer, received ${props.delta}`);\n }\n },\n };\n\n private setRootNode!: TSetRootNode;\n private zIndexContext: { parentLayerZIndex: number; maxZIndex: number } | null = null;\n\n constructor(props: ZIndexProps) {\n super(props);\n this.state.zIndex = this.increment();\n }\n\n public componentDidUpdate(prevProps: Readonly<ZIndexProps>) {\n if (prevProps.priority !== this.props.priority || prevProps.delta !== this.props.delta) {\n removeZIndex(this.state.zIndex);\n this.setState({ zIndex: this.increment() });\n }\n }\n\n public componentWillUnmount() {\n removeZIndex(this.state.zIndex);\n }\n\n public render() {\n const {\n style,\n children,\n delta,\n priority,\n applyZIndex,\n coverChildren,\n createStackingContext,\n wrapperRef,\n useWrapper,\n ...rest\n } = this.getProps();\n\n const wrapperStyle: React.CSSProperties = {};\n\n return (\n <ZIndexContext.Consumer>\n {(context) => {\n this.zIndexContext = context;\n\n const currentZIndexContext =\n this.state.DOMZIndexContext && isEqual(context, DEFAULT_ZINDEX_CONTEXT)\n ? this.state.DOMZIndexContext\n : context;\n const { parentLayerZIndex, maxZIndex } = currentZIndexContext;\n\n let newZIndexContext = currentZIndexContext;\n let newZIndex = 0;\n\n if (applyZIndex) {\n newZIndex = this.calcZIndex(parentLayerZIndex, maxZIndex);\n wrapperStyle.zIndex = newZIndex;\n\n newZIndexContext = coverChildren\n ? { parentLayerZIndex, maxZIndex: newZIndex }\n : { parentLayerZIndex: newZIndex, maxZIndex: Number.isFinite(maxZIndex) ? newZIndex : Infinity };\n\n if (createStackingContext) {\n isBrowser(globalObject) && 'isolation' in globalObject.document.body.style\n ? (wrapperStyle.isolation = 'isolate')\n : (wrapperStyle.transform = 'rotate(0)');\n }\n }\n\n const child = !useWrapper ? (\n children\n ) : (\n <div style={{ ...style, ...wrapperStyle }} ref={this.wrapperRef} {...rest}>\n {children}\n </div>\n );\n\n return <ZIndexContext.Provider value={newZIndexContext}>{child}</ZIndexContext.Provider>;\n }}\n </ZIndexContext.Consumer>\n );\n }\n\n private wrapperRef = (element: HTMLDivElement | null) => {\n const { wrapperRef } = this.props;\n this.setRootNode(element);\n wrapperRef && callChildRef(wrapperRef, element);\n element && this.tryGetContextByDOM(element);\n };\n\n private calcZIndex(parentLayerZIndex: number, maxZIndex: number) {\n let newZIndex = this.state.zIndex;\n\n if (Number.isFinite(maxZIndex)) {\n const allowedValuesIntervalLength = maxZIndex - parentLayerZIndex;\n const scale = upperBorder / allowedValuesIntervalLength;\n newZIndex = Math.ceil(newZIndex / scale);\n }\n\n newZIndex += parentLayerZIndex;\n\n return newZIndex;\n }\n\n private increment = () => {\n const { priority, delta } = this.getProps();\n\n return incrementZIndex(priority, delta);\n };\n\n private tryGetContextByDOM = (element: HTMLDivElement) => {\n if (\n this.props.applyZIndex &&\n isEqual(DEFAULT_ZINDEX_CONTEXT, this.zIndexContext) &&\n this.state.DOMZIndexContext === null\n ) {\n let DOMZIndexContext = DEFAULT_ZINDEX_CONTEXT;\n const portal = element.parentElement?.closest(`[${PORTAL_OUTLET_ATTR}]`);\n\n if (isInstanceOf(portal, globalObject.HTMLElement)) {\n const portalID = portal.getAttribute(PORTAL_OUTLET_ATTR);\n const noscript = globalObject.document?.querySelector(`noscript[${PORTAL_INLET_ATTR}=\"${portalID}\"]`);\n const parent = noscript?.parentElement?.closest('[style*=z-index]');\n\n if (isInstanceOf(parent, globalObject.HTMLElement)) {\n const newZIndex = Number(parent.style.zIndex || 0);\n\n let maxZIndex = Infinity;\n\n if (parent.parentElement?.dataset.tid === LoaderDataTids.veil) {\n maxZIndex = this.calcZIndex(newZIndex, maxZIndex);\n }\n\n DOMZIndexContext = { maxZIndex, parentLayerZIndex: newZIndex };\n }\n }\n\n this.setState({ DOMZIndexContext });\n }\n };\n}\n"],"mappings":"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","ignoreList":[]}
@@ -23,7 +23,7 @@ export interface ZIndexProps extends React.HTMLAttributes<HTMLDivElement> {
23
23
  type DefaultProps = Required<Pick<ZIndexProps, 'delta' | 'priority' | 'style' | 'applyZIndex' | 'coverChildren' | 'createStackingContext' | 'useWrapper'>>;
24
24
  interface ZIndexState {
25
25
  zIndex: number;
26
- savedZIndexContext: {
26
+ DOMZIndexContext: {
27
27
  parentLayerZIndex: number;
28
28
  maxZIndex: number;
29
29
  } | null;
package/package.json CHANGED
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "name": "@skbkontur/react-ui",
3
- "version": "5.0.11",
3
+ "version": "5.0.12",
4
4
  "description": "UI Components",
5
5
  "main": "cjs/index.js",
6
6
  "module": "index.js",
7
7
  "sideEffects": false,
8
- "homepage": "https://tech.skbkontur.ru/react-ui/5.0.11/",
8
+ "homepage": "https://tech.skbkontur.ru/react-ui/5.0.12/",
9
9
  "repository": {
10
10
  "type": "git",
11
11
  "url": "git@github.com:skbkontur/retail-ui.git"