@skbkontur/react-ui 6.4.6 → 6.4.7-9ac75.0

package/components/FileUploader/FileUploaderFileList/FileUploaderFileList.js

@@ -19,26 +19,20 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 import React, { useContext, useRef, useState } from 'react';
+import { cx } from '../../../lib/cx.js';
 import { LocaleContext } from '../../../lib/locale/index.js';
 import { pluralize } from '../../../lib/pluralize.js';
-import { useEmotion, useStyles } from '../../../lib/renderEnvironment/index.js';
-import { ThemeContext } from '../../../lib/theming/ThemeContext.js';
 import { FileUploaderControlContext } from '../FileUploaderControlContext.js';
 import { FileUploaderFileStatus } from '../fileUtils.js';
 import { useControlLocale } from '../hooks/useControlLocale.js';
 import { useFileUploaderSize } from '../hooks/useFileUploaderSize.js';
-import { getJsRowStyles, getJsStyles, getJsTileStyles } from './FileUploaderFileList.styles.js';
+import { jsRowStyles, jsStyles, jsTileStyles } from './FileUploaderFileList.css.js';
 export var FileUploaderFileDataTids = {
     fileList: 'FileUploader__fileList',
 };
 export var FileUploaderFileList = function (props) {
     var renderFile = props.renderFile, size = props.size, _a = props.view, view = _a === void 0 ? 'row' : _a, _b = props.validationSummary, validationSummary = _b === void 0 ? 'auto' : _b, _c = props.validationSummaryStart, validationSummaryStart = _c === void 0 ? 5 : _c, withValidationTooltip = props.withValidationTooltip, validationTooltipPosition = props.validationTooltipPosition, withWarningIcon = props.withWarningIcon, _d = props.disabled, disabled = _d === void 0 ? false : _d, onRemove = props.onRemove;
     var files = useContext(FileUploaderControlContext).files;
-    var cx = useEmotion().cx;
-    var jsStyles = useStyles(getJsStyles);
-    var jsRowStyles = useStyles(getJsRowStyles);
-    var jsTileStyles = useStyles(getJsTileStyles);
-    var theme = useContext(ThemeContext);
     var locale = useControlLocale();
     var langCode = useContext(LocaleContext).langCode;
     var _e = useState(null), focusedByTab = _e[0], setFocusedByTab = _e[1];
@@ -67,14 +61,14 @@ export var FileUploaderFileList = function (props) {
     var isTileView = view === 'tile';
     var jsViewStyles = isTileView ? jsTileStyles : jsRowStyles;
     var fileWrapperClass = useFileUploaderSize(size, {
-        small: jsViewStyles.fileWrapperSmall(theme),
-        medium: jsViewStyles.fileWrapperMedium(theme),
-        large: jsViewStyles.fileWrapperLarge(theme),
+        small: jsViewStyles.fileWrapperSmall,
+        medium: jsViewStyles.fileWrapperMedium,
+        large: jsViewStyles.fileWrapperLarge,
     });
     var summaryClass = useFileUploaderSize(size, {
-        small: jsStyles.summarySmall(theme),
-        medium: jsStyles.summaryMedium(theme),
-        large: jsStyles.summaryLarge(theme),
+        small: jsStyles.summarySmall,
+        medium: jsStyles.summaryMedium,
+        large: jsStyles.summaryLarge,
     });
     var renderSummary = function () {
         if (validationSummary === 'disabled') {
@@ -88,17 +82,17 @@ export var FileUploaderFileList = function (props) {
         if (!(warningLength + errorLength)) {
             return null;
         }
-        return (React.createElement("div", { className: cx(jsStyles.summary(theme), summaryClass) },
-            errorLength > 0 && (React.createElement("span", { className: jsStyles.summaryErrorText(theme) },
+        return (React.createElement("div", { className: cx(jsStyles.summary, summaryClass) },
+            errorLength > 0 && (React.createElement("span", { className: jsStyles.summaryErrorText },
                 errorLength,
                 "\u00A0",
                 pluralize.apply(void 0, __spreadArray([langCode, errorLength], locale.errors, false)))),
-            warningLength > 0 && (React.createElement("span", { className: jsStyles.summaryWarningText(theme) },
+            warningLength > 0 && (React.createElement("span", { className: jsStyles.summaryWarningText },
                 warningLength,
                 "\u00A0",
                 pluralize.apply(void 0, __spreadArray([langCode, warningLength], locale.warnings, false))))));
     };
-    return (React.createElement("div", { "data-tid": FileUploaderFileDataTids.fileList, className: jsViewStyles.fileListWrapper(theme) },
+    return (React.createElement("div", { "data-tid": FileUploaderFileDataTids.fileList, className: jsViewStyles.fileListWrapper },
         renderSummary(),
         files.map(function (file, idx) {
             var _a, _b, _c, _d, _e;
@@ -107,20 +101,20 @@ export var FileUploaderFileList = function (props) {
             var hasHover = hovered === file.id;
             var hasError = file.status === FileUploaderFileStatus.Error;
             var hasWarning = file.status === FileUploaderFileStatus.Warning;
-            var fileWrapperClassNames = cx(jsStyles.fileWrapper(theme), fileWrapperClass, __assign(__assign(__assign(__assign((_a = {}, _a[jsStyles.fileWrapperFocus(theme)] = hasFocus, _a[jsStyles.fileWrapperHover(theme)] = hasHover, _a), (hasError && (_b = {},
-                _b[jsStyles.errorFile(theme)] = !isTileView || hasHover,
-                _b[jsViewStyles.errorFileFocus(theme)] = hasFocus,
+            var fileWrapperClassNames = cx(jsStyles.fileWrapper, fileWrapperClass, __assign(__assign(__assign(__assign((_a = {}, _a[jsStyles.fileWrapperFocus] = hasFocus, _a[jsStyles.fileWrapperHover] = hasHover, _a), (hasError && (_b = {},
+                _b[jsStyles.errorFile] = !isTileView || hasHover,
+                _b[jsViewStyles.errorFileFocus] = hasFocus,
                 _b))), (!isTileView &&
                 hasError && (_c = {},
-                _c[jsStyles.removeBorderTopRadius()] = ((_f = files[idx - 1]) === null || _f === void 0 ? void 0 : _f.status) === FileUploaderFileStatus.Error,
-                _c[jsStyles.removeBorderBottomRadius()] = ((_g = files[idx + 1]) === null || _g === void 0 ? void 0 : _g.status) === FileUploaderFileStatus.Error,
+                _c[jsStyles.removeBorderTopRadius] = ((_f = files[idx - 1]) === null || _f === void 0 ? void 0 : _f.status) === FileUploaderFileStatus.Error,
+                _c[jsStyles.removeBorderBottomRadius] = ((_g = files[idx + 1]) === null || _g === void 0 ? void 0 : _g.status) === FileUploaderFileStatus.Error,
                 _c))), (hasWarning && (_d = {},
-                _d[jsStyles.warningFile(theme)] = !isTileView || hasHover,
-                _d[jsViewStyles.warningFileFocus(theme)] = hasFocus,
+                _d[jsStyles.warningFile] = !isTileView || hasHover,
+                _d[jsViewStyles.warningFileFocus] = hasFocus,
                 _d))), (!isTileView &&
                 hasWarning && (_e = {},
-                _e[jsStyles.removeBorderTopRadius()] = ((_h = files[idx - 1]) === null || _h === void 0 ? void 0 : _h.status) === FileUploaderFileStatus.Warning,
-                _e[jsStyles.removeBorderBottomRadius()] = ((_j = files[idx + 1]) === null || _j === void 0 ? void 0 : _j.status) === FileUploaderFileStatus.Warning,
+                _e[jsStyles.removeBorderTopRadius] = ((_h = files[idx - 1]) === null || _h === void 0 ? void 0 : _h.status) === FileUploaderFileStatus.Warning,
+                _e[jsStyles.removeBorderBottomRadius] = ((_j = files[idx + 1]) === null || _j === void 0 ? void 0 : _j.status) === FileUploaderFileStatus.Warning,
                 _e))));
             var fileProps = {
                 file: file,
@@ -137,7 +131,7 @@ export var FileUploaderFileList = function (props) {
             };
             var fileElement = renderFile(fileProps);
             return (React.createElement("div", { key: file.id, className: fileWrapperClassNames, onMouseEnter: function () { return handleMouseEnter(file.id); }, onMouseLeave: function () { return handleMouseLeave(); }, onFocus: function () { return setFocusedByTab(file.id); }, onBlur: function () { return setFocusedByTab(null); } },
-                React.createElement("div", { className: jsViewStyles.file() }, fileElement)));
+                React.createElement("div", { className: jsViewStyles.file }, fileElement)));
         })));
 };
 FileUploaderFileList.__KONTUR_REACT_UI__ = 'FileUploaderFileList';

package/components/FileUploader/FileUploaderFileList/FileUploaderFileList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploaderFileList.js","sourceRoot":"","sources":["FileUploaderFileList.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useRef, useState } from 'react';\n\nimport type { PopupPositionsType, ShortPopupPositionsType } from '../../../internal/Popup/index.js';\nimport { LocaleContext } from '../../../lib/locale/index.js';\nimport { pluralize } from '../../../lib/pluralize.js';\nimport { useEmotion, useStyles } from '../../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../../lib/types/props.js';\nimport { FileUploaderControlContext } from '../FileUploaderControlContext.js';\nimport type { FileUploaderFileProps } from '../FileUploaderFile.js';\nimport { FileUploaderFileStatus, type FileUploaderValidationSummary, type FileUploaderView } from '../fileUtils.js';\nimport { useControlLocale } from '../hooks/useControlLocale.js';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize.js';\nimport { getJsRowStyles, getJsStyles, getJsTileStyles } from './FileUploaderFileList.styles.js';\n\ninterface FileUploaderFileListProps {\n  renderFile: (props: FileUploaderFileProps) => React.ReactNode;\n  size: SizeProp;\n  view?: FileUploaderView;\n  validationSummary?: FileUploaderValidationSummary;\n  validationSummaryStart?: number;\n  onRemove(fileId: string): void;\n  withValidationTooltip?: boolean;\n  validationTooltipPosition?: ShortPopupPositionsType | PopupPositionsType;\n  withWarningIcon?: boolean;\n  disabled?: boolean;\n}\n\nexport const FileUploaderFileDataTids = {\n  fileList: 'FileUploader__fileList',\n} as const;\n\nexport const FileUploaderFileList = (props: FileUploaderFileListProps): React.ReactElement => {\n  const {\n    renderFile,\n    size,\n    view = 'row',\n    validationSummary = 'auto',\n    validationSummaryStart = 5,\n    withValidationTooltip,\n    validationTooltipPosition,\n    withWarningIcon,\n    disabled = false,\n    onRemove,\n  } = props;\n  const { files } = useContext(FileUploaderControlContext);\n  const { cx } = useEmotion();\n  const jsStyles = useStyles(getJsStyles);\n  const jsRowStyles = useStyles(getJsRowStyles);\n  const jsTileStyles = useStyles(getJsTileStyles);\n  const theme = useContext(ThemeContext);\n  const locale = useControlLocale();\n  const { langCode } = useContext(LocaleContext);\n\n  const [focusedByTab, setFocusedByTab] = useState<string | null>(null);\n  const [hovered, setHovered] = useState<string | null>(null);\n  const mouseIsOverRef = useRef(false);\n\n  const handleMouseEnter = (index: string | null) => {\n    setHovered(index);\n    mouseIsOverRef.current = true;\n  };\n\n  const handleMouseLeave = () => {\n    setHovered(null);\n    mouseIsOverRef.current = false;\n  };\n\n  const handleRemoveItem = (index: string) => {\n    onRemove(index);\n    if (hovered === index && mouseIsOverRef.current) {\n      const currentIndex = files.findIndex((file) => file.id === index);\n      if (currentIndex !== -1 && files[currentIndex + 1]) {\n        setHovered(files[currentIndex + 1].id);\n      } else {\n        setHovered(null);\n      }\n    }\n  };\n\n  const isTileView = view === 'tile';\n  const jsViewStyles = isTileView ? jsTileStyles : jsRowStyles;\n\n  const fileWrapperClass = useFileUploaderSize(size, {\n    small: jsViewStyles.fileWrapperSmall(theme),\n    medium: jsViewStyles.fileWrapperMedium(theme),\n    large: jsViewStyles.fileWrapperLarge(theme),\n  });\n\n  const summaryClass = useFileUploaderSize(size, {\n    small: jsStyles.summarySmall(theme),\n    medium: jsStyles.summaryMedium(theme),\n    large: jsStyles.summaryLarge(theme),\n  });\n\n  const renderSummary = () => {\n    if (validationSummary === 'disabled') {\n      return null;\n    }\n\n    const warningLength = files.filter((file) => file.status === FileUploaderFileStatus.Warning).length;\n    const errorLength = files.filter((file) => file.status === FileUploaderFileStatus.Error).length;\n\n    if (validationSummary === 'auto' && files.length < validationSummaryStart) {\n      return null;\n    }\n\n    if (!(warningLength + errorLength)) {\n      return null;\n    }\n\n    return (\n      <div className={cx(jsStyles.summary(theme), summaryClass)}>\n        {errorLength > 0 && (\n          <span className={jsStyles.summaryErrorText(theme)}>\n            {errorLength}&nbsp;{pluralize(langCode, errorLength, ...locale.errors)}\n          </span>\n        )}\n        {warningLength > 0 && (\n          <span className={jsStyles.summaryWarningText(theme)}>\n            {warningLength}&nbsp;{pluralize(langCode, warningLength, ...locale.warnings)}\n          </span>\n        )}\n      </div>\n    );\n  };\n\n  return (\n    <div data-tid={FileUploaderFileDataTids.fileList} className={jsViewStyles.fileListWrapper(theme)}>\n      {renderSummary()}\n      {files.map((file, idx) => {\n        const hasFocus = focusedByTab === file.id;\n        const hasHover = hovered === file.id;\n        const hasError = file.status === FileUploaderFileStatus.Error;\n        const hasWarning = file.status === FileUploaderFileStatus.Warning;\n\n        const fileWrapperClassNames = cx(jsStyles.fileWrapper(theme), fileWrapperClass, {\n          [jsStyles.fileWrapperFocus(theme)]: hasFocus,\n          [jsStyles.fileWrapperHover(theme)]: hasHover,\n          ...(hasError && {\n            [jsStyles.errorFile(theme)]: !isTileView || hasHover,\n            [jsViewStyles.errorFileFocus(theme)]: hasFocus,\n          }),\n          ...(!isTileView &&\n            hasError && {\n              [jsStyles.removeBorderTopRadius()]: files[idx - 1]?.status === FileUploaderFileStatus.Error,\n              [jsStyles.removeBorderBottomRadius()]: files[idx + 1]?.status === FileUploaderFileStatus.Error,\n            }),\n          ...(hasWarning && {\n            [jsStyles.warningFile(theme)]: !isTileView || hasHover,\n            [jsViewStyles.warningFileFocus(theme)]: hasFocus,\n          }),\n          ...(!isTileView &&\n            hasWarning && {\n              [jsStyles.removeBorderTopRadius()]: files[idx - 1]?.status === FileUploaderFileStatus.Warning,\n              [jsStyles.removeBorderBottomRadius()]: files[idx + 1]?.status === FileUploaderFileStatus.Warning,\n            }),\n        });\n\n        const fileProps: FileUploaderFileProps = {\n          file,\n          multiple: true,\n          size,\n          view,\n          disabled,\n          hovered: hasHover,\n          focused: hasFocus,\n          onRemove: handleRemoveItem,\n          withValidationTooltip,\n          validationTooltipPosition,\n          withWarningIcon,\n        };\n\n        const fileElement = renderFile(fileProps);\n\n        return (\n          <div\n            key={file.id}\n            className={fileWrapperClassNames}\n            onMouseEnter={() => handleMouseEnter(file.id)}\n            onMouseLeave={() => handleMouseLeave()}\n            onFocus={() => setFocusedByTab(file.id)}\n            onBlur={() => setFocusedByTab(null)}\n          >\n            <div className={jsViewStyles.file()}>{fileElement}</div>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nFileUploaderFileList.__KONTUR_REACT_UI__ = 'FileUploaderFileList';\nFileUploaderFileList.displayName = 'FileUploaderFileList';\n"]}
+{"version":3,"file":"FileUploaderFileList.js","sourceRoot":"","sources":["FileUploaderFileList.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useRef, useState } from 'react';\n\nimport type { PopupPositionsType, ShortPopupPositionsType } from '../../../internal/Popup/index.js';\nimport { cx } from '../../../lib/cx.js';\nimport { LocaleContext } from '../../../lib/locale/index.js';\nimport { pluralize } from '../../../lib/pluralize.js';\nimport type { SizeProp } from '../../../lib/types/props.js';\nimport { FileUploaderControlContext } from '../FileUploaderControlContext.js';\nimport type { FileUploaderFileProps } from '../FileUploaderFile.js';\nimport { FileUploaderFileStatus, type FileUploaderValidationSummary, type FileUploaderView } from '../fileUtils.js';\nimport { useControlLocale } from '../hooks/useControlLocale.js';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize.js';\nimport { jsRowStyles, jsStyles, jsTileStyles } from './FileUploaderFileList.css.js';\n\ninterface FileUploaderFileListProps {\n  renderFile: (props: FileUploaderFileProps) => React.ReactNode;\n  size: SizeProp;\n  view?: FileUploaderView;\n  validationSummary?: FileUploaderValidationSummary;\n  validationSummaryStart?: number;\n  onRemove(fileId: string): void;\n  withValidationTooltip?: boolean;\n  validationTooltipPosition?: ShortPopupPositionsType | PopupPositionsType;\n  withWarningIcon?: boolean;\n  disabled?: boolean;\n}\n\nexport const FileUploaderFileDataTids = {\n  fileList: 'FileUploader__fileList',\n} as const;\n\nexport const FileUploaderFileList = (props: FileUploaderFileListProps): React.ReactElement => {\n  const {\n    renderFile,\n    size,\n    view = 'row',\n    validationSummary = 'auto',\n    validationSummaryStart = 5,\n    withValidationTooltip,\n    validationTooltipPosition,\n    withWarningIcon,\n    disabled = false,\n    onRemove,\n  } = props;\n  const { files } = useContext(FileUploaderControlContext);\n  const locale = useControlLocale();\n  const { langCode } = useContext(LocaleContext);\n\n  const [focusedByTab, setFocusedByTab] = useState<string | null>(null);\n  const [hovered, setHovered] = useState<string | null>(null);\n  const mouseIsOverRef = useRef(false);\n\n  const handleMouseEnter = (index: string | null) => {\n    setHovered(index);\n    mouseIsOverRef.current = true;\n  };\n\n  const handleMouseLeave = () => {\n    setHovered(null);\n    mouseIsOverRef.current = false;\n  };\n\n  const handleRemoveItem = (index: string) => {\n    onRemove(index);\n    if (hovered === index && mouseIsOverRef.current) {\n      const currentIndex = files.findIndex((file) => file.id === index);\n      if (currentIndex !== -1 && files[currentIndex + 1]) {\n        setHovered(files[currentIndex + 1].id);\n      } else {\n        setHovered(null);\n      }\n    }\n  };\n\n  const isTileView = view === 'tile';\n  const jsViewStyles = isTileView ? jsTileStyles : jsRowStyles;\n\n  const fileWrapperClass = useFileUploaderSize(size, {\n    small: jsViewStyles.fileWrapperSmall,\n    medium: jsViewStyles.fileWrapperMedium,\n    large: jsViewStyles.fileWrapperLarge,\n  });\n\n  const summaryClass = useFileUploaderSize(size, {\n    small: jsStyles.summarySmall,\n    medium: jsStyles.summaryMedium,\n    large: jsStyles.summaryLarge,\n  });\n\n  const renderSummary = () => {\n    if (validationSummary === 'disabled') {\n      return null;\n    }\n\n    const warningLength = files.filter((file) => file.status === FileUploaderFileStatus.Warning).length;\n    const errorLength = files.filter((file) => file.status === FileUploaderFileStatus.Error).length;\n\n    if (validationSummary === 'auto' && files.length < validationSummaryStart) {\n      return null;\n    }\n\n    if (!(warningLength + errorLength)) {\n      return null;\n    }\n\n    return (\n      <div className={cx(jsStyles.summary, summaryClass)}>\n        {errorLength > 0 && (\n          <span className={jsStyles.summaryErrorText}>\n            {errorLength}&nbsp;{pluralize(langCode, errorLength, ...locale.errors)}\n          </span>\n        )}\n        {warningLength > 0 && (\n          <span className={jsStyles.summaryWarningText}>\n            {warningLength}&nbsp;{pluralize(langCode, warningLength, ...locale.warnings)}\n          </span>\n        )}\n      </div>\n    );\n  };\n\n  return (\n    <div data-tid={FileUploaderFileDataTids.fileList} className={jsViewStyles.fileListWrapper}>\n      {renderSummary()}\n      {files.map((file, idx) => {\n        const hasFocus = focusedByTab === file.id;\n        const hasHover = hovered === file.id;\n        const hasError = file.status === FileUploaderFileStatus.Error;\n        const hasWarning = file.status === FileUploaderFileStatus.Warning;\n\n        const fileWrapperClassNames = cx(jsStyles.fileWrapper, fileWrapperClass, {\n          [jsStyles.fileWrapperFocus]: hasFocus,\n          [jsStyles.fileWrapperHover]: hasHover,\n          ...(hasError && {\n            [jsStyles.errorFile]: !isTileView || hasHover,\n            [jsViewStyles.errorFileFocus]: hasFocus,\n          }),\n          ...(!isTileView &&\n            hasError && {\n              [jsStyles.removeBorderTopRadius]: files[idx - 1]?.status === FileUploaderFileStatus.Error,\n              [jsStyles.removeBorderBottomRadius]: files[idx + 1]?.status === FileUploaderFileStatus.Error,\n            }),\n          ...(hasWarning && {\n            [jsStyles.warningFile]: !isTileView || hasHover,\n            [jsViewStyles.warningFileFocus]: hasFocus,\n          }),\n          ...(!isTileView &&\n            hasWarning && {\n              [jsStyles.removeBorderTopRadius]: files[idx - 1]?.status === FileUploaderFileStatus.Warning,\n              [jsStyles.removeBorderBottomRadius]: files[idx + 1]?.status === FileUploaderFileStatus.Warning,\n            }),\n        });\n\n        const fileProps: FileUploaderFileProps = {\n          file,\n          multiple: true,\n          size,\n          view,\n          disabled,\n          hovered: hasHover,\n          focused: hasFocus,\n          onRemove: handleRemoveItem,\n          withValidationTooltip,\n          validationTooltipPosition,\n          withWarningIcon,\n        };\n\n        const fileElement = renderFile(fileProps);\n\n        return (\n          <div\n            key={file.id}\n            className={fileWrapperClassNames}\n            onMouseEnter={() => handleMouseEnter(file.id)}\n            onMouseLeave={() => handleMouseLeave()}\n            onFocus={() => setFocusedByTab(file.id)}\n            onBlur={() => setFocusedByTab(null)}\n          >\n            <div className={jsViewStyles.file}>{fileElement}</div>\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n\nFileUploaderFileList.__KONTUR_REACT_UI__ = 'FileUploaderFileList';\nFileUploaderFileList.displayName = 'FileUploaderFileList';\n"]}

package/components/FileUploader/FileUploaderFileStatusIcon.js

@@ -1,18 +1,13 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import { LoadingIcon } from '../../internal/icons2022/LoadingIcon.js';
-import { useStyles } from '../../lib/renderEnvironment/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { useResponsiveLayout } from '../ResponsiveLayout/index.js';
-import { getJsRowStyles, getJsTileStyles } from './FileUploaderFile.styles.js';
+import { jsRowStyles, jsTileStyles } from './FileUploaderFile.css.js';
 import { FileUploaderFileStatus } from './fileUtils.js';
 import { DeleteIcon } from './icons/DeleteIcon.js';
 export var FileUploaderFileStatusIcon = function (_a) {
     var hovered = _a.hovered, isTileView = _a.isTileView, disabled = _a.disabled, focusedByTab = _a.focusedByTab, isInvalid = _a.isInvalid, status = _a.status, size = _a.size, hasValidation = _a.hasValidation;
     var isMobile = useResponsiveLayout().isMobile;
-    var theme = useContext(ThemeContext);
-    var jsTileStyles = useStyles(getJsTileStyles);
-    var jsRowStyles = useStyles(getJsRowStyles);
-    var iconClassNames = isTileView ? jsTileStyles.iconColor(theme) : jsRowStyles.iconColor(theme);
+    var iconClassNames = isTileView ? jsTileStyles.iconColor : jsRowStyles.iconColor;
     var iconDelete = React.createElement(DeleteIcon, { size: size, className: iconClassNames });
     if (status === FileUploaderFileStatus.Loading) {
         return hovered || isTileView ? iconDelete : React.createElement(LoadingIcon, { size: size });

package/components/FileUploader/FileUploaderFileStatusIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploaderFileStatusIcon.js","sourceRoot":"","sources":["FileUploaderFileStatusIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,MAAM,yCAAyC,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAanD,MAAM,CAAC,IAAM,0BAA0B,GAA6D,UAAC,EASpG;QARC,OAAO,aAAA,EACP,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,MAAM,YAAA,EACN,IAAI,UAAA,EACJ,aAAa,mBAAA;IAEL,IAAA,QAAQ,GAAK,mBAAmB,EAAE,SAA1B,CAA2B;IAC3C,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACvC,IAAM,YAAY,GAAG,SAAS,CAAC,eAAe,CAAC,CAAC;IAChD,IAAM,WAAW,GAAG,SAAS,CAAC,cAAc,CAAC,CAAC;IAE9C,IAAM,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IACjG,IAAM,UAAU,GAAG,oBAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,cAAc,GAAI,CAAC;IAEzE,IAAI,MAAM,KAAK,sBAAsB,CAAC,OAAO,EAAE,CAAC;QAC9C,OAAO,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC;IAC1E,CAAC;IACD,IAAI,QAAQ,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;QACzD,OAAO,IAAI,CAAC;IACd,CAAC;IACD,IAAI,SAAS,IAAI,aAAa,EAAE,CAAC;QAC/B,OAAO,UAAU,CAAC;IACpB,CAAC;IACD,2FAA2F;IAC3F,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { LoadingIcon } from '../../internal/icons2022/LoadingIcon.js';\nimport { useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { useResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { getJsRowStyles, getJsTileStyles } from './FileUploaderFile.styles.js';\nimport { FileUploaderFileStatus } from './fileUtils.js';\nimport { DeleteIcon } from './icons/DeleteIcon.js';\n\ninterface FileUploaderFileStatusIconProps {\n  hovered: boolean;\n  isTileView?: boolean;\n  disabled?: boolean;\n  focusedByTab: boolean;\n  isInvalid: boolean;\n  status: FileUploaderFileStatus;\n  size: SizeProp;\n  hasValidation?: boolean;\n}\n\nexport const FileUploaderFileStatusIcon: React.FunctionComponent<FileUploaderFileStatusIconProps> = ({\n  hovered,\n  isTileView,\n  disabled,\n  focusedByTab,\n  isInvalid,\n  status,\n  size,\n  hasValidation,\n}) => {\n  const { isMobile } = useResponsiveLayout();\n  const theme = useContext(ThemeContext);\n  const jsTileStyles = useStyles(getJsTileStyles);\n  const jsRowStyles = useStyles(getJsRowStyles);\n\n  const iconClassNames = isTileView ? jsTileStyles.iconColor(theme) : jsRowStyles.iconColor(theme);\n  const iconDelete = <DeleteIcon size={size} className={iconClassNames} />;\n\n  if (status === FileUploaderFileStatus.Loading) {\n    return hovered || isTileView ? iconDelete : <LoadingIcon size={size} />;\n  }\n  if (disabled || (!isMobile && !hovered && !focusedByTab)) {\n    return null;\n  }\n  if (isInvalid || hasValidation) {\n    return iconDelete;\n  }\n  // TODO - IF-2270 - добавить логику для действий по наведению и клику, пока только удаление\n  return iconDelete;\n};\n"]}
+{"version":3,"file":"FileUploaderFileStatusIcon.js","sourceRoot":"","sources":["FileUploaderFileStatusIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,yCAAyC,CAAC;AAEtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACtE,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAanD,MAAM,CAAC,IAAM,0BAA0B,GAA6D,UAAC,EASpG;QARC,OAAO,aAAA,EACP,UAAU,gBAAA,EACV,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,MAAM,YAAA,EACN,IAAI,UAAA,EACJ,aAAa,mBAAA;IAEL,IAAA,QAAQ,GAAK,mBAAmB,EAAE,SAA1B,CAA2B;IAE3C,IAAM,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC;IACnF,IAAM,UAAU,GAAG,oBAAC,UAAU,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,cAAc,GAAI,CAAC;IAEzE,IAAI,MAAM,KAAK,sBAAsB,CAAC,OAAO,EAAE,CAAC;QAC9C,OAAO,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,oBAAC,WAAW,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC;IAC1E,CAAC;IACD,IAAI,QAAQ,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC;QACzD,OAAO,IAAI,CAAC;IACd,CAAC;IACD,IAAI,SAAS,IAAI,aAAa,EAAE,CAAC;QAC/B,OAAO,UAAU,CAAC;IACpB,CAAC;IACD,2FAA2F;IAC3F,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC","sourcesContent":["import React from 'react';\n\nimport { LoadingIcon } from '../../internal/icons2022/LoadingIcon.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { useResponsiveLayout } from '../ResponsiveLayout/index.js';\nimport { jsRowStyles, jsTileStyles } from './FileUploaderFile.css.js';\nimport { FileUploaderFileStatus } from './fileUtils.js';\nimport { DeleteIcon } from './icons/DeleteIcon.js';\n\ninterface FileUploaderFileStatusIconProps {\n  hovered: boolean;\n  isTileView?: boolean;\n  disabled?: boolean;\n  focusedByTab: boolean;\n  isInvalid: boolean;\n  status: FileUploaderFileStatus;\n  size: SizeProp;\n  hasValidation?: boolean;\n}\n\nexport const FileUploaderFileStatusIcon: React.FunctionComponent<FileUploaderFileStatusIconProps> = ({\n  hovered,\n  isTileView,\n  disabled,\n  focusedByTab,\n  isInvalid,\n  status,\n  size,\n  hasValidation,\n}) => {\n  const { isMobile } = useResponsiveLayout();\n\n  const iconClassNames = isTileView ? jsTileStyles.iconColor : jsRowStyles.iconColor;\n  const iconDelete = <DeleteIcon size={size} className={iconClassNames} />;\n\n  if (status === FileUploaderFileStatus.Loading) {\n    return hovered || isTileView ? iconDelete : <LoadingIcon size={size} />;\n  }\n  if (disabled || (!isMobile && !hovered && !focusedByTab)) {\n    return null;\n  }\n  if (isInvalid || hasValidation) {\n    return iconDelete;\n  }\n  // TODO - IF-2270 - добавить логику для действий по наведению и клику, пока только удаление\n  return iconDelete;\n};\n"]}

package/components/GlobalLoader/GlobalLoaderView.css.d.ts

@@ -0,0 +1,26 @@
+export declare const outer: string;
+export declare const inner: string;
+export declare const standardWithoutAnimation: string;
+export declare const successWithoutAnimation: string;
+export declare const errorWithoutAnimation: string;
+export declare const styles: {
+    outer: string;
+    inner: string;
+    standardWithoutAnimation: string;
+    successWithoutAnimation: string;
+    errorWithoutAnimation: string;
+};
+export declare const successAnimation: string;
+export declare const errorAnimation: string;
+export declare const standardAnimation: string;
+export declare const acceptAnimation: string;
+export declare const slowAcceptAnimation: string;
+export declare const acceptWithoutAnimation: string;
+export declare const animations: {
+    successAnimation: string;
+    errorAnimation: string;
+    standardAnimation: string;
+    acceptAnimation: string;
+    slowAcceptAnimation: string;
+    acceptWithoutAnimation: string;
+};

package/components/GlobalLoader/GlobalLoaderView.css.js

@@ -0,0 +1,14 @@
+
+export var acceptAnimation = 'react-ui-GlobalLoaderView__acceptAnimation';
+export var acceptWithoutAnimation = 'react-ui-GlobalLoaderView__acceptWithoutAnimation';
+export var animations = {successAnimation:'react-ui-GlobalLoaderView__successAnimation',errorAnimation:'react-ui-GlobalLoaderView__errorAnimation',standardAnimation:'react-ui-GlobalLoaderView__standardAnimation',acceptAnimation:'react-ui-GlobalLoaderView__acceptAnimation',slowAcceptAnimation:'react-ui-GlobalLoaderView__slowAcceptAnimation',acceptWithoutAnimation:'react-ui-GlobalLoaderView__acceptWithoutAnimation'};
+export var errorAnimation = 'react-ui-GlobalLoaderView__errorAnimation';
+export var errorWithoutAnimation = 'react-ui-GlobalLoaderView__errorWithoutAnimation';
+export var inner = 'react-ui-GlobalLoaderView__inner';
+export var outer = 'react-ui-GlobalLoaderView__outer';
+export var slowAcceptAnimation = 'react-ui-GlobalLoaderView__slowAcceptAnimation';
+export var standardAnimation = 'react-ui-GlobalLoaderView__standardAnimation';
+export var standardWithoutAnimation = 'react-ui-GlobalLoaderView__standardWithoutAnimation';
+export var styles = {outer:'react-ui-GlobalLoaderView__outer',inner:'react-ui-GlobalLoaderView__inner',standardWithoutAnimation:'react-ui-GlobalLoaderView__standardWithoutAnimation',successWithoutAnimation:'react-ui-GlobalLoaderView__successWithoutAnimation',errorWithoutAnimation:'react-ui-GlobalLoaderView__errorWithoutAnimation'};
+export var successAnimation = 'react-ui-GlobalLoaderView__successAnimation';
+export var successWithoutAnimation = 'react-ui-GlobalLoaderView__successWithoutAnimation';

package/components/GlobalLoader/GlobalLoaderView.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalLoaderView.css.js","sourceRoot":"","sources":["GlobalLoaderView.css.ts"],"names":[],"mappings":"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","sourcesContent":["import { keyframes, style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\n\nconst successKeyframes = keyframes({\n  '0%': {\n    width: 'var(--react-ui-global-loader-width)',\n    left: 'var(--react-ui-global-loader-left)',\n    opacity: 1,\n  },\n  '20%': { width: '100%', left: 0, opacity: 1 },\n  '80%': { width: '100%', left: 0, opacity: 1 },\n  '100%': { width: '100%', opacity: 0 },\n});\n\nconst moveToRightAnimation = keyframes({\n  '0%': { left: 0, width: '100%' },\n  '50%': { left: '50%', width: '50%' },\n  '100%': { left: '99%', width: '1%' },\n});\n\nconst spinnerAnimation = keyframes({\n  '0%': {\n    transform: 'translateX(50%) scaleX(.005)',\n    animationTimingFunction: 'cubic-bezier(.895,.03,.685,.22)',\n  },\n  '50%': {\n    transform: 'translateX(0) scaleX(.35)',\n    animationTimingFunction: 'cubic-bezier(.165,.84,.44,1)',\n  },\n  '100%': { transform: 'translateX(-50%) scaleX(.005)' },\n});\n\nconst linearProgressAnimation = keyframes({\n  from: { width: 0 },\n  to: { width: '80%' },\n});\n\nconst slowProgressAnimation = keyframes({\n  from: { width: '80%' },\n  to: { width: '90%' },\n});\n\nconst transitionAnimation = keyframes({\n  from: {\n    width: 'var(--react-ui-global-loader-width)',\n    left: 'var(--react-ui-global-loader-left)',\n  },\n  to: {\n    width: 'var(--react-ui-global-loader-start-width)',\n    left: 0,\n  },\n});\n\nconst acceptProgressAnimation = keyframes({\n  from: { width: 'var(--react-ui-global-loader-start-width)' },\n  to: { width: '80%' },\n});\n\nconst slowAcceptProgressAnimation = keyframes({\n  from: { width: 'var(--react-ui-global-loader-start-width)' },\n  to: { width: '90%' },\n});\n\nexport const outer = style({\n  width: t.globalLoaderWidth,\n  height: t.globalLoaderHeight,\n  backgroundColor: t.globalLoaderBackgroundColor,\n  position: t.globalLoaderPosition as 'fixed',\n  left: t.globalLoaderLeft,\n  top: t.globalLoaderTop,\n  right: t.globalLoaderRight,\n  bottom: t.globalLoaderBottom,\n  overflow: 'hidden',\n});\n\nexport const inner = style({\n  backgroundColor: t.globalLoaderColor,\n  width: 0,\n  height: t.globalLoaderHeight,\n  position: 'absolute',\n  left: 0,\n  overflow: 'hidden',\n});\n\nexport const standardWithoutAnimation = style({ left: 0, width: '90%' });\n\nexport const successWithoutAnimation = style({ left: 0, width: '100%' });\n\nexport const errorWithoutAnimation = style({ left: '40%', width: '20%' });\n\nexport const styles = {\n  outer,\n  inner,\n  standardWithoutAnimation,\n  successWithoutAnimation,\n  errorWithoutAnimation,\n};\n\n/**\n * Параметры анимаций приходят из компонента CSS-переменными (inline-стилем), потому что при сборке их нет:\n * `--react-ui-global-loader-delay-before-hide`, `--react-ui-global-loader-expected-time` (оба со значением в ms),\n * `--react-ui-global-loader-width`, `--react-ui-global-loader-start-width`, `--react-ui-global-loader-left` (в px).\n */\nconst toSpinnerDuration = `calc(${t.globalLoaderTransitionToSpinnerDuration} * 1ms)`;\nconst spinnerAnimationDuration = `calc(${t.globalLoaderSpinnerAnimationDuration} * 1ms)`;\nconst fromSpinnerDuration = `calc(${t.globalLoaderTransitionFromSpinnerDuration} * 1ms)`;\nconst slowProgressAnimationTime = `calc(${t.globalLoaderSlowAnimationDuration} * 1ms)`;\n\nexport const successAnimation = style({\n  animation: `${successKeyframes} var(--react-ui-global-loader-delay-before-hide)`,\n});\n\nexport const errorAnimation = style({\n  left: 0,\n  width: '100%',\n  animation: [\n    `${moveToRightAnimation} ${toSpinnerDuration} linear`,\n    `${spinnerAnimationDuration} ${spinnerAnimation} ${toSpinnerDuration} infinite alternate`,\n  ].join(','),\n});\n\nexport const standardAnimation = style({\n  width: '90%',\n  animation: [\n    `${linearProgressAnimation} var(--react-ui-global-loader-expected-time) cubic-bezier(0, 0.4, 0.4, 1)`,\n    `${slowProgressAnimationTime} ${slowProgressAnimation} var(--react-ui-global-loader-expected-time) linear`,\n  ].join(','),\n});\n\nexport const acceptAnimation = style({\n  width: '90%',\n  animation: [\n    `${transitionAnimation} ${fromSpinnerDuration} linear`,\n    `var(--react-ui-global-loader-expected-time) ${acceptProgressAnimation} ${fromSpinnerDuration} cubic-bezier(0, 0.4, 0.4, 1)`,\n    `${slowProgressAnimationTime} ${slowProgressAnimation} calc(var(--react-ui-global-loader-expected-time) + ${fromSpinnerDuration}) linear`,\n  ].join(','),\n});\n\nexport const slowAcceptAnimation = style({\n  width: '90%',\n  animation: [\n    `${transitionAnimation} ${fromSpinnerDuration} linear`,\n    `${slowProgressAnimationTime} ${slowAcceptProgressAnimation} ${fromSpinnerDuration} linear`,\n  ].join(','),\n});\n\nexport const acceptWithoutAnimation = style({ width: 'var(--react-ui-global-loader-start-width)' });\n\nexport const animations = {\n  successAnimation,\n  errorAnimation,\n  standardAnimation,\n  acceptAnimation,\n  slowAcceptAnimation,\n  acceptWithoutAnimation,\n};\n"]}

package/components/GlobalLoader/GlobalLoaderView.js

@@ -20,53 +20,54 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { forwardRef, useContext, useRef } from 'react';
+import React, { forwardRef, useRef } from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
 import { ZIndex } from '../../internal/ZIndex/index.js';
-import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
-import { getAnimations, getStyles } from './GlobalLoaderView.styles.js';
+import { cx } from '../../lib/cx.js';
+import { animations, styles } from './GlobalLoaderView.css.js';
 import { useGlobalLoaderPosition, useGlobalLoaderWidth } from './useParams.js';
 export var GlobalLoaderView = forwardRef(function (_a, externalRef) {
     var expectedResponseTime = _a.expectedResponseTime, delayBeforeHide = _a.delayBeforeHide, status = _a.status, disableAnimations = _a.disableAnimations, rest = __rest(_a, ["expectedResponseTime", "delayBeforeHide", "status", "disableAnimations"]);
     var ref = useRef(null);
-    var theme = useContext(ThemeContext);
-    var cx = useEmotion().cx;
-    var styles = useStyles(getStyles);
-    var animations = useStyles(getAnimations);
     var _b = useGlobalLoaderWidth(status, ref), width = _b.width, startWidth = _b.startWidth, fullWidth = _b.fullWidth;
     var left = useGlobalLoaderPosition(ref).left;
     var getAnimationClass = function (status) {
         if (!disableAnimations) {
             switch (status) {
                 case 'success':
-                    return animations.successAnimation(delayBeforeHide, width, left);
+                    return animations.successAnimation;
                 case 'accept':
                     if (startWidth < fullWidth * 0.8) {
-                        return animations.acceptAnimation(theme, startWidth, expectedResponseTime, width, left);
+                        return animations.acceptAnimation;
                     }
-                    return animations.slowAcceptAnimation(theme, startWidth, width, left);
+                    return animations.slowAcceptAnimation;
                 case 'error':
-                    return animations.errorAnimation(theme);
+                    return animations.errorAnimation;
                 case 'standard':
-                    return animations.standardAnimation(theme, expectedResponseTime);
+                    return animations.standardAnimation;
             }
         }
         if (disableAnimations) {
             switch (status) {
                 case 'success':
-                    return styles.successWithoutAnimation();
+                    return styles.successWithoutAnimation;
                 case 'accept':
-                    return animations.acceptWithoutAnimation(startWidth);
+                    return animations.acceptWithoutAnimation;
                 case 'error':
-                    return styles.errorWithoutAnimation();
+                    return styles.errorWithoutAnimation;
                 case 'standard':
-                    return styles.standardWithoutAnimation();
+                    return styles.standardWithoutAnimation;
             }
         }
     };
     return (React.createElement(CommonWrapper, __assign({}, rest, { "data-status": status, ref: externalRef }),
-        React.createElement(ZIndex, { priority: "GlobalLoader", className: styles.outer(theme) },
-            React.createElement("div", { ref: ref, className: cx(styles.inner(theme), getAnimationClass(status)) }))));
+        React.createElement(ZIndex, { priority: "GlobalLoader", className: styles.outer },
+            React.createElement("div", { ref: ref, className: cx(styles.inner, getAnimationClass(status)), style: {
+                    '--react-ui-global-loader-delay-before-hide': "".concat(delayBeforeHide, "ms"),
+                    '--react-ui-global-loader-expected-time': "".concat(expectedResponseTime, "ms"),
+                    '--react-ui-global-loader-width': "".concat(width, "px"),
+                    '--react-ui-global-loader-start-width': "".concat(startWidth, "px"),
+                    '--react-ui-global-loader-left': "".concat(left, "px"),
+                } }))));
 });
 //# sourceMappingURL=GlobalLoaderView.js.map

package/components/GlobalLoader/GlobalLoaderView.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalLoaderView.js","sourceRoot":"","sources":["GlobalLoaderView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, useContext, useRef } from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { getAnimations, getStyles } from './GlobalLoaderView.styles.js';\nimport { useGlobalLoaderPosition, useGlobalLoaderWidth } from './useParams.js';\n\nexport interface GlobalLoaderViewProps extends Pick<CommonProps, 'data-tid'> {\n  /** Устанавливает ожидаемое время(ms) ответа сервера. */\n  expectedResponseTime: number;\n\n  /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */\n  delayBeforeHide: number;\n\n  /** Устанавливает статус операции. */\n  status?: 'success' | 'error' | 'standard' | 'accept';\n\n  /** Отключает анимацию. */\n  disableAnimations: boolean;\n}\n\nexport interface GlobalLoaderViewRef {\n  element: HTMLDivElement;\n  refObject: React.RefObject<GlobalLoaderViewRef['element'] | null>;\n}\n\nexport const GlobalLoaderView = forwardRef(\n  (\n    { expectedResponseTime, delayBeforeHide, status, disableAnimations, ...rest }: GlobalLoaderViewProps,\n    externalRef: React.Ref<CommonWrapper<CommonProps>>,\n  ) => {\n    const ref = useRef<GlobalLoaderViewRef['element']>(null);\n    const theme = useContext(ThemeContext);\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n    const animations = useStyles(getAnimations);\n    const { width, startWidth, fullWidth } = useGlobalLoaderWidth(status, ref);\n    const { left } = useGlobalLoaderPosition(ref);\n\n    const getAnimationClass = (status: GlobalLoaderViewProps['status']) => {\n      if (!disableAnimations) {\n        switch (status) {\n          case 'success':\n            return animations.successAnimation(delayBeforeHide, width, left);\n          case 'accept':\n            if (startWidth < fullWidth * 0.8) {\n              return animations.acceptAnimation(theme, startWidth, expectedResponseTime, width, left);\n            }\n            return animations.slowAcceptAnimation(theme, startWidth, width, left);\n          case 'error':\n            return animations.errorAnimation(theme);\n          case 'standard':\n            return animations.standardAnimation(theme, expectedResponseTime);\n        }\n      }\n\n      if (disableAnimations) {\n        switch (status) {\n          case 'success':\n            return styles.successWithoutAnimation();\n          case 'accept':\n            return animations.acceptWithoutAnimation(startWidth);\n          case 'error':\n            return styles.errorWithoutAnimation();\n          case 'standard':\n            return styles.standardWithoutAnimation();\n        }\n      }\n    };\n\n    return (\n      <CommonWrapper {...rest} data-status={status} ref={externalRef}>\n        <ZIndex priority=\"GlobalLoader\" className={styles.outer(theme)}>\n          <div ref={ref} className={cx(styles.inner(theme), getAnimationClass(status))} />\n        </ZIndex>\n      </CommonWrapper>\n    );\n  },\n);\n"]}
+{"version":3,"file":"GlobalLoaderView.js","sourceRoot":"","sources":["GlobalLoaderView.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAGlD,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAE,uBAAuB,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAqB/E,MAAM,CAAC,IAAM,gBAAgB,GAAG,UAAU,CACxC,UACE,EAAoG,EACpG,WAAkD;IADhD,IAAA,oBAAoB,0BAAA,EAAE,eAAe,qBAAA,EAAE,MAAM,YAAA,EAAE,iBAAiB,uBAAA,EAAK,IAAI,cAA3E,0EAA6E,CAAF;IAG3E,IAAM,GAAG,GAAG,MAAM,CAAiC,IAAI,CAAC,CAAC;IACnD,IAAA,KAAmC,oBAAoB,CAAC,MAAM,EAAE,GAAG,CAAC,EAAlE,KAAK,WAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAsC,CAAC;IACnE,IAAA,IAAI,GAAK,uBAAuB,CAAC,GAAG,CAAC,KAAjC,CAAkC;IAE9C,IAAM,iBAAiB,GAAG,UAAC,MAAuC;QAChE,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACvB,QAAQ,MAAM,EAAE,CAAC;gBACf,KAAK,SAAS;oBACZ,OAAO,UAAU,CAAC,gBAAgB,CAAC;gBACrC,KAAK,QAAQ;oBACX,IAAI,UAAU,GAAG,SAAS,GAAG,GAAG,EAAE,CAAC;wBACjC,OAAO,UAAU,CAAC,eAAe,CAAC;oBACpC,CAAC;oBACD,OAAO,UAAU,CAAC,mBAAmB,CAAC;gBACxC,KAAK,OAAO;oBACV,OAAO,UAAU,CAAC,cAAc,CAAC;gBACnC,KAAK,UAAU;oBACb,OAAO,UAAU,CAAC,iBAAiB,CAAC;YACxC,CAAC;QACH,CAAC;QAED,IAAI,iBAAiB,EAAE,CAAC;YACtB,QAAQ,MAAM,EAAE,CAAC;gBACf,KAAK,SAAS;oBACZ,OAAO,MAAM,CAAC,uBAAuB,CAAC;gBACxC,KAAK,QAAQ;oBACX,OAAO,UAAU,CAAC,sBAAsB,CAAC;gBAC3C,KAAK,OAAO;oBACV,OAAO,MAAM,CAAC,qBAAqB,CAAC;gBACtC,KAAK,UAAU;oBACb,OAAO,MAAM,CAAC,wBAAwB,CAAC;YAC3C,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,aAAa,eAAK,IAAI,mBAAe,MAAM,EAAE,GAAG,EAAE,WAAW;QAC5D,oBAAC,MAAM,IAAC,QAAQ,EAAC,cAAc,EAAC,SAAS,EAAE,MAAM,CAAC,KAAK;YACrD,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,EACtD,KAAK,EACH;oBACE,4CAA4C,EAAE,UAAG,eAAe,OAAI;oBACpE,wCAAwC,EAAE,UAAG,oBAAoB,OAAI;oBACrE,gCAAgC,EAAE,UAAG,KAAK,OAAI;oBAC9C,sCAAsC,EAAE,UAAG,UAAU,OAAI;oBACzD,+BAA+B,EAAE,UAAG,IAAI,OAAI;iBACtB,GAE1B,CACK,CACK,CACjB,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["import React, { forwardRef, useRef } from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { cx } from '../../lib/cx.js';\nimport { animations, styles } from './GlobalLoaderView.css.js';\nimport { useGlobalLoaderPosition, useGlobalLoaderWidth } from './useParams.js';\n\nexport interface GlobalLoaderViewProps extends Pick<CommonProps, 'data-tid'> {\n  /** Устанавливает ожидаемое время(ms) ответа сервера. */\n  expectedResponseTime: number;\n\n  /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */\n  delayBeforeHide: number;\n\n  /** Устанавливает статус операции. */\n  status?: 'success' | 'error' | 'standard' | 'accept';\n\n  /** Отключает анимацию. */\n  disableAnimations: boolean;\n}\n\nexport interface GlobalLoaderViewRef {\n  element: HTMLDivElement;\n  refObject: React.RefObject<GlobalLoaderViewRef['element'] | null>;\n}\n\nexport const GlobalLoaderView = forwardRef(\n  (\n    { expectedResponseTime, delayBeforeHide, status, disableAnimations, ...rest }: GlobalLoaderViewProps,\n    externalRef: React.Ref<CommonWrapper<CommonProps>>,\n  ) => {\n    const ref = useRef<GlobalLoaderViewRef['element']>(null);\n    const { width, startWidth, fullWidth } = useGlobalLoaderWidth(status, ref);\n    const { left } = useGlobalLoaderPosition(ref);\n\n    const getAnimationClass = (status: GlobalLoaderViewProps['status']) => {\n      if (!disableAnimations) {\n        switch (status) {\n          case 'success':\n            return animations.successAnimation;\n          case 'accept':\n            if (startWidth < fullWidth * 0.8) {\n              return animations.acceptAnimation;\n            }\n            return animations.slowAcceptAnimation;\n          case 'error':\n            return animations.errorAnimation;\n          case 'standard':\n            return animations.standardAnimation;\n        }\n      }\n\n      if (disableAnimations) {\n        switch (status) {\n          case 'success':\n            return styles.successWithoutAnimation;\n          case 'accept':\n            return animations.acceptWithoutAnimation;\n          case 'error':\n            return styles.errorWithoutAnimation;\n          case 'standard':\n            return styles.standardWithoutAnimation;\n        }\n      }\n    };\n\n    return (\n      <CommonWrapper {...rest} data-status={status} ref={externalRef}>\n        <ZIndex priority=\"GlobalLoader\" className={styles.outer}>\n          <div\n            ref={ref}\n            className={cx(styles.inner, getAnimationClass(status))}\n            style={\n              {\n                '--react-ui-global-loader-delay-before-hide': `${delayBeforeHide}ms`,\n                '--react-ui-global-loader-expected-time': `${expectedResponseTime}ms`,\n                '--react-ui-global-loader-width': `${width}px`,\n                '--react-ui-global-loader-start-width': `${startWidth}px`,\n                '--react-ui-global-loader-left': `${left}px`,\n              } as React.CSSProperties\n            }\n          />\n        </ZIndex>\n      </CommonWrapper>\n    );\n  },\n);\n"]}

package/components/Group/Group.css.d.ts

@@ -0,0 +1,14 @@
+export declare const root: string;
+export declare const wrappedChildren: string;
+export declare const fixed: string;
+export declare const stretch: string;
+export declare const item: string;
+export declare const itemFirst: string;
+export declare const styles: {
+    root: string;
+    wrappedChildren: string;
+    fixed: string;
+    stretch: string;
+    item: string;
+    itemFirst: string;
+};

package/components/Group/Group.css.js

@@ -0,0 +1,8 @@
+
+export var fixed = 'react-ui-Group__fixed';
+export var item = 'react-ui-Group__item';
+export var itemFirst = 'react-ui-Group__itemFirst';
+export var root = 'react-ui-Group__root';
+export var stretch = 'react-ui-Group__stretch';
+export var styles = {root:'react-ui-Group__root',wrappedChildren:'react-ui-Group__wrappedChildren',fixed:'react-ui-Group__fixed',stretch:'react-ui-Group__stretch',item:'react-ui-Group__item',itemFirst:'react-ui-Group__itemFirst'};
+export var wrappedChildren = 'react-ui-Group__wrappedChildren';

package/components/Group/Group.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Group.css.js","sourceRoot":"","sources":["Group.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,QAAQ;CACrB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,eAAe,GAAG,KAAK,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;AAE1D,MAAM,CAAC,IAAM,KAAK,GAAG,KAAK,CAAC;IACzB,UAAU,EAAE,CAAC;IACb,OAAO,EAAE,cAAc;CACxB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,QAAQ,EAAE,CAAC;IACX,UAAU,EAAE,CAAC;CACd,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AAE9C,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC;AAElD,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,eAAe,iBAAA;IACf,KAAK,OAAA;IACL,OAAO,SAAA;IACP,IAAI,MAAA;IACJ,SAAS,WAAA;CACV,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nexport const root = style({\n  display: 'inline-flex',\n  lineHeight: 'normal',\n});\n\nexport const wrappedChildren = style({ display: 'flex' });\n\nexport const fixed = style({\n  flexShrink: 0,\n  display: 'inline-block',\n});\n\nexport const stretch = style({\n  flexGrow: 1,\n  flexShrink: 1,\n});\n\nexport const item = style({ marginLeft: -1 });\n\nexport const itemFirst = style({ marginLeft: 0 });\n\nexport const styles = {\n  root,\n  wrappedChildren,\n  fixed,\n  stretch,\n  item,\n  itemFirst,\n};\n"]}

package/components/Group/Group.d.ts

@@ -17,9 +17,6 @@ export declare class Group extends React.Component<GroupProps> {
     static displayName: string;
     getRootNode: TGetRootNode;
     private setRootNode;
-    private emotion;
-    private cx;
-    private styles;
     render(): React.JSX.Element;
     private renderChild;
     private renderWrappedChildren;

package/components/Group/Group.js

@@ -32,10 +32,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
-import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { cx } from '../../lib/cx.js';
 import { rootNode } from '../../lib/rootNode/index.js';
 import { isAutocomplete, isButton, isCurrencyInput, isDropdown, isDropdownMenu, isFxInput, isHint, isInput, isPasswordInput, isSelect, isTooltip, isTimePicker, } from '../../lib/utils.js';
-import { getStyles } from './Group.styles.js';
+import { styles } from './Group.css.js';
 var getFirstChild = function (children) {
     if (!Array.isArray(children)) {
         return children;
@@ -98,13 +98,13 @@ var Group = /** @class */ (function (_super) {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.renderChild = function (child, isFirstChild, isLastChild, isWidthInPercent) {
             var _a, _b;
-            return (React.createElement("div", { className: _this.cx((_a = {},
-                    _a[_this.styles.fixed()] = !isWidthInPercent,
-                    _a[_this.styles.stretch()] = isWidthInPercent,
+            return (React.createElement("div", { className: cx((_a = {},
+                    _a[styles.fixed] = !isWidthInPercent,
+                    _a[styles.stretch] = isWidthInPercent,
                     _a)) },
-                React.createElement("div", { className: _this.cx((_b = {},
-                        _b[_this.styles.item()] = true,
-                        _b[_this.styles.itemFirst()] = isFirstChild,
+                React.createElement("div", { className: cx((_b = {},
+                        _b[styles.item] = true,
+                        _b[styles.itemFirst] = isFirstChild,
                         _b)) }, tryPassCorners(child, isFirstChild, isLastChild))));
         };
         return _this;
@@ -117,9 +117,8 @@ var Group = /** @class */ (function (_super) {
         var childrenArray = React.Children.toArray(this.props.children);
         var firstChild = getFirstChild(childrenArray);
         var lastChild = getLastChild(childrenArray);
-        this.styles = getStyles(this.emotion);
         return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
-            React.createElement("span", { "data-tid": GroupDataTids.root, className: this.styles.root(), style: style }, React.Children.map(childrenArray, function (child) {
+            React.createElement("span", { "data-tid": GroupDataTids.root, className: styles.root, style: style }, React.Children.map(childrenArray, function (child) {
                 if (!child || !React.isValidElement(child)) {
                     return null;
                 }
@@ -147,7 +146,7 @@ var Group = /** @class */ (function (_super) {
             }
             return _this.renderChild(nestedChild, isFirstChild, isLastChild, hasWidthInPercent(nestedChild));
         });
-        var wrappedChildren = (React.createElement("div", { className: this.cx(this.styles.wrappedChildren(), (_a = {}, _a[this.styles.stretch()] = shouldStretchParent, _a)) }, modifiedChildren));
+        var wrappedChildren = (React.createElement("div", { className: cx(styles.wrappedChildren, (_a = {}, _a[styles.stretch] = shouldStretchParent, _a)) }, modifiedChildren));
         return React.cloneElement(parent, {
             children: wrappedChildren,
         });
@@ -155,7 +154,6 @@ var Group = /** @class */ (function (_super) {
     Group.__KONTUR_REACT_UI__ = 'Group';
     Group.displayName = 'Group';
     Group = __decorate([
-        withRenderEnvironment,
         rootNode
     ], Group);
     return Group;

package/components/Group/Group.js.map

@@ -1 +1 @@
-{"version":3,"file":"Group.js","sourceRoot":"","sources":["Group.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport {\n  isAutocomplete,\n  isButton,\n  isCurrencyInput,\n  isDropdown,\n  isDropdownMenu,\n  isFxInput,\n  isHint,\n  isInput,\n  isPasswordInput,\n  isSelect,\n  isTooltip,\n  isTimePicker,\n} from '../../lib/utils.js';\nimport { getStyles } from './Group.styles.js';\n\nexport interface GroupProps extends CommonProps {\n  /** Ширина компонента. */\n  width?: React.CSSProperties['width'];\n}\n\ninterface GroupChildProps extends CommonProps {\n  width?: React.CSSProperties['width'];\n  corners?: number;\n}\n\nconst getFirstChild = (children: React.ReactNode) => {\n  if (!Array.isArray(children)) {\n    return children;\n  }\n\n  return children?.[0] as React.ReactNode;\n};\n\nconst getLastChild = (children: React.ReactNode) => {\n  if (!Array.isArray(children)) {\n    return children;\n  }\n\n  const numberOfChildren = React.Children.count(children);\n\n  return children?.[numberOfChildren - 1] as React.ReactNode;\n};\n\nexport const getButtonCorners = (isFirstChild: boolean, isLastChild: boolean): React.CSSProperties => {\n  if (isFirstChild && isLastChild) {\n    return {};\n  }\n\n  if (isFirstChild) {\n    return {\n      borderTopRightRadius: 0,\n      borderBottomRightRadius: 0,\n    };\n  }\n\n  if (isLastChild) {\n    return {\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n    };\n  }\n\n  return {\n    borderRadius: 0,\n  };\n};\n\nconst tryPassCorners = (child: React.ReactNode, isFirstChild: boolean, isLastChild: boolean) => {\n  const corners = getButtonCorners(isFirstChild, isLastChild);\n\n  if (\n    isButton(child) ||\n    isInput(child) ||\n    isFxInput(child) ||\n    isAutocomplete(child) ||\n    isPasswordInput(child) ||\n    isCurrencyInput(child) ||\n    isSelect(child) ||\n    isDropdown(child) ||\n    isDropdownMenu(child) ||\n    isTimePicker(child)\n  ) {\n    return React.cloneElement<(typeof child)['props']>(child, { corners: { ...corners, ...child.props.corners } });\n  }\n\n  return child;\n};\n\nconst hasWidthInPercent = (child: React.ReactElement<GroupChildProps>) => String(child.props.width).includes('%');\n\nexport const GroupDataTids = {\n  root: 'Group__root',\n} as const;\n\n/**\n *  Контейнер используется для создания логически сгруппированных элементов, выровненных по горизонтали.\n */\n@withRenderEnvironment\n@rootNode\nexport class Group extends React.Component<GroupProps> {\n  public static __KONTUR_REACT_UI__ = 'Group';\n  public static displayName = 'Group';\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n\n  public render(): React.JSX.Element {\n    const style: React.CSSProperties = {\n      width: this.props.width,\n    };\n\n    const childrenArray = React.Children.toArray(this.props.children);\n    const firstChild = getFirstChild(childrenArray);\n    const lastChild = getLastChild(childrenArray);\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <span data-tid={GroupDataTids.root} className={this.styles.root()} style={style}>\n          {React.Children.map(childrenArray, (child) => {\n            if (!child || !React.isValidElement<GroupChildProps>(child)) {\n              return null;\n            }\n\n            const isFirstChild = child === firstChild;\n            const isLastChild = child === lastChild;\n\n            if (isHint(child) || isTooltip(child)) {\n              return this.renderWrappedChildren(child, isFirstChild, isLastChild);\n            }\n\n            return this.renderChild(child, isFirstChild, isLastChild, hasWidthInPercent(child));\n          })}\n        </span>\n      </CommonWrapper>\n    );\n  }\n\n  private renderChild = (\n    child: React.ReactNode,\n    isFirstChild: boolean,\n    isLastChild: boolean,\n    isWidthInPercent: boolean,\n  ) => (\n    <div\n      className={this.cx({\n        [this.styles.fixed()]: !isWidthInPercent,\n        [this.styles.stretch()]: isWidthInPercent,\n      })}\n    >\n      <div\n        className={this.cx({\n          [this.styles.item()]: true,\n          [this.styles.itemFirst()]: isFirstChild,\n        })}\n      >\n        {tryPassCorners(child, isFirstChild, isLastChild)}\n      </div>\n    </div>\n  );\n\n  private renderWrappedChildren(\n    parent: React.ReactElement<GroupChildProps>,\n    isParentFirst: boolean,\n    isParentLast: boolean,\n  ): React.ReactNode {\n    let shouldStretchParent = false;\n    const nestedChildren = React.Children.toArray(parent.props.children);\n\n    const modifiedChildren = nestedChildren.map((nestedChild, index) => {\n      if (!nestedChild || !React.isValidElement<GroupChildProps>(nestedChild)) {\n        return null;\n      }\n\n      const isFirstChild = isParentFirst && index === 0;\n      const isLastChild = isParentLast && index === nestedChildren.length - 1;\n      if (hasWidthInPercent(nestedChild)) {\n        shouldStretchParent = true;\n      }\n\n      return this.renderChild(nestedChild, isFirstChild, isLastChild, hasWidthInPercent(nestedChild));\n    });\n\n    const wrappedChildren = (\n      <div className={this.cx(this.styles.wrappedChildren(), { [this.styles.stretch()]: shouldStretchParent })}>\n        {modifiedChildren}\n      </div>\n    );\n\n    return React.cloneElement<GroupChildProps>(parent, {\n      children: wrappedChildren,\n    });\n  }\n}\n"]}
+{"version":3,"file":"Group.js","sourceRoot":"","sources":["Group.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { cx } from '../../lib/cx.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport {\n  isAutocomplete,\n  isButton,\n  isCurrencyInput,\n  isDropdown,\n  isDropdownMenu,\n  isFxInput,\n  isHint,\n  isInput,\n  isPasswordInput,\n  isSelect,\n  isTooltip,\n  isTimePicker,\n} from '../../lib/utils.js';\nimport { styles } from './Group.css.js';\n\nexport interface GroupProps extends CommonProps {\n  /** Ширина компонента. */\n  width?: React.CSSProperties['width'];\n}\n\ninterface GroupChildProps extends CommonProps {\n  width?: React.CSSProperties['width'];\n  corners?: number;\n}\n\nconst getFirstChild = (children: React.ReactNode) => {\n  if (!Array.isArray(children)) {\n    return children;\n  }\n\n  return children?.[0] as React.ReactNode;\n};\n\nconst getLastChild = (children: React.ReactNode) => {\n  if (!Array.isArray(children)) {\n    return children;\n  }\n\n  const numberOfChildren = React.Children.count(children);\n\n  return children?.[numberOfChildren - 1] as React.ReactNode;\n};\n\nexport const getButtonCorners = (isFirstChild: boolean, isLastChild: boolean): React.CSSProperties => {\n  if (isFirstChild && isLastChild) {\n    return {};\n  }\n\n  if (isFirstChild) {\n    return {\n      borderTopRightRadius: 0,\n      borderBottomRightRadius: 0,\n    };\n  }\n\n  if (isLastChild) {\n    return {\n      borderTopLeftRadius: 0,\n      borderBottomLeftRadius: 0,\n    };\n  }\n\n  return {\n    borderRadius: 0,\n  };\n};\n\nconst tryPassCorners = (child: React.ReactNode, isFirstChild: boolean, isLastChild: boolean) => {\n  const corners = getButtonCorners(isFirstChild, isLastChild);\n\n  if (\n    isButton(child) ||\n    isInput(child) ||\n    isFxInput(child) ||\n    isAutocomplete(child) ||\n    isPasswordInput(child) ||\n    isCurrencyInput(child) ||\n    isSelect(child) ||\n    isDropdown(child) ||\n    isDropdownMenu(child) ||\n    isTimePicker(child)\n  ) {\n    return React.cloneElement<(typeof child)['props']>(child, { corners: { ...corners, ...child.props.corners } });\n  }\n\n  return child;\n};\n\nconst hasWidthInPercent = (child: React.ReactElement<GroupChildProps>) => String(child.props.width).includes('%');\n\nexport const GroupDataTids = {\n  root: 'Group__root',\n} as const;\n\n/**\n *  Контейнер используется для создания логически сгруппированных элементов, выровненных по горизонтали.\n */\n@rootNode\nexport class Group extends React.Component<GroupProps> {\n  public static __KONTUR_REACT_UI__ = 'Group';\n  public static displayName = 'Group';\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n\n  public render(): React.JSX.Element {\n    const style: React.CSSProperties = {\n      width: this.props.width,\n    };\n\n    const childrenArray = React.Children.toArray(this.props.children);\n    const firstChild = getFirstChild(childrenArray);\n    const lastChild = getLastChild(childrenArray);\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <span data-tid={GroupDataTids.root} className={styles.root} style={style}>\n          {React.Children.map(childrenArray, (child) => {\n            if (!child || !React.isValidElement<GroupChildProps>(child)) {\n              return null;\n            }\n\n            const isFirstChild = child === firstChild;\n            const isLastChild = child === lastChild;\n\n            if (isHint(child) || isTooltip(child)) {\n              return this.renderWrappedChildren(child, isFirstChild, isLastChild);\n            }\n\n            return this.renderChild(child, isFirstChild, isLastChild, hasWidthInPercent(child));\n          })}\n        </span>\n      </CommonWrapper>\n    );\n  }\n\n  private renderChild = (\n    child: React.ReactNode,\n    isFirstChild: boolean,\n    isLastChild: boolean,\n    isWidthInPercent: boolean,\n  ) => (\n    <div\n      className={cx({\n        [styles.fixed]: !isWidthInPercent,\n        [styles.stretch]: isWidthInPercent,\n      })}\n    >\n      <div\n        className={cx({\n          [styles.item]: true,\n          [styles.itemFirst]: isFirstChild,\n        })}\n      >\n        {tryPassCorners(child, isFirstChild, isLastChild)}\n      </div>\n    </div>\n  );\n\n  private renderWrappedChildren(\n    parent: React.ReactElement<GroupChildProps>,\n    isParentFirst: boolean,\n    isParentLast: boolean,\n  ): React.ReactNode {\n    let shouldStretchParent = false;\n    const nestedChildren = React.Children.toArray(parent.props.children);\n\n    const modifiedChildren = nestedChildren.map((nestedChild, index) => {\n      if (!nestedChild || !React.isValidElement<GroupChildProps>(nestedChild)) {\n        return null;\n      }\n\n      const isFirstChild = isParentFirst && index === 0;\n      const isLastChild = isParentLast && index === nestedChildren.length - 1;\n      if (hasWidthInPercent(nestedChild)) {\n        shouldStretchParent = true;\n      }\n\n      return this.renderChild(nestedChild, isFirstChild, isLastChild, hasWidthInPercent(nestedChild));\n    });\n\n    const wrappedChildren = (\n      <div className={cx(styles.wrappedChildren, { [styles.stretch]: shouldStretchParent })}>{modifiedChildren}</div>\n    );\n\n    return React.cloneElement<GroupChildProps>(parent, {\n      children: wrappedChildren,\n    });\n  }\n}\n"]}

package/components/Hint/Hint.css.d.ts

@@ -0,0 +1,6 @@
+export declare const content: string;
+export declare const contentCenter: string;
+export declare const styles: {
+    content: string;
+    contentCenter: string;
+};

package/components/Hint/Hint.css.js

@@ -0,0 +1,4 @@
+
+export var content = 'react-ui-Hint__content';
+export var contentCenter = 'react-ui-Hint__contentCenter';
+export var styles = {content:'react-ui-Hint__content',contentCenter:'react-ui-Hint__contentCenter'};

package/components/Hint/Hint.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hint.css.js","sourceRoot":"","sources":["Hint.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AAEjD,MAAM,CAAC,IAAM,OAAO,GAAG,KAAK,CAAC;IAC3B,SAAS,EAAE,YAAY;IACvB,KAAK,EAAE,CAAC,CAAC,SAAS;IAClB,QAAQ,EAAE,CAAC,CAAC,YAAY;IACxB,UAAU,EAAE,CAAC,CAAC,cAAc;IAC5B,QAAQ,EAAE,CAAC,CAAC,YAAY;IACxB,YAAY,EAAE,YAAY;IAC1B,OAAO,EAAE,UAAG,CAAC,CAAC,YAAY,cAAI,CAAC,CAAC,YAAY,CAAE;IAC9C,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,YAAY;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,aAAa,GAAG,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,aAAmC,EAAE,CAAC,CAAC;AAEzF,MAAM,CAAC,IAAM,MAAM,GAAG,EAAE,OAAO,SAAA,EAAE,aAAa,eAAA,EAAE,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\n\nexport const content = style({\n  boxSizing: 'border-box',\n  color: t.hintColor,\n  fontSize: t.hintFontSize,\n  lineHeight: t.hintLineHeight,\n  maxWidth: t.hintMaxWidth,\n  overflowWrap: 'break-word',\n  padding: `${t.hintPaddingY} ${t.hintPaddingX}`,\n  wordBreak: 'break-word',\n  wordWrap: 'break-word',\n});\n\nexport const contentCenter = style({ textAlign: t.hintTextAlign as `var(--${string})` });\n\nexport const styles = { content, contentCenter };\n"]}

package/components/Hint/Hint.d.ts

@@ -53,9 +53,6 @@ export declare class Hint extends React.PureComponent<HintProps, HintState> impl
     private theme;
     getRootNode: TGetRootNode;
     private setRootNode;
-    private styles;
-    private emotion;
-    private cx;
     private globalObject;
     private disableAnimationsOnOpen;
     private popupRef;