npm - @skbkontur/react-ui - Versions diffs - 4.10.0-theme2022.4 → 4.11.0-revert-datatids - Mend

@skbkontur/react-ui 4.10.0-theme2022.4 → 4.11.0-revert-datatids

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.

Files changed (1219) hide show

package/cjs/internal/DropdownContainer/DropdownContainer.js CHANGED Viewed

@@ -9,7 +9,12 @@ var _Emotion = require("../../lib/theming/Emotion");
 var _client = require("../../lib/client");
 var _getDOMRect = require("../../lib/dom/getDOMRect");
-var _DropdownContainer = require("./DropdownContainer.styles");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}var
+var _DropdownContainer = require("./DropdownContainer.styles");
+var _getManualPosition = require("./getManualPosition");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}var
@@ -142,18 +147,18 @@ DropdownContainer = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsL
         var distanceToBottom = docEl.clientHeight - targetRect.bottom;
         var dropdownHeight = _this.getHeight();
+        var clientHeight = _this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;
         if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {
-          var clientHeight = _this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;
           top = null;
-          bottom = clientHeight + offsetY - scrollY - targetRect.top;
+          bottom = (0, _getManualPosition.getTopAlignment)({ clientHeight: clientHeight, offsetY: offsetY, scrollY: scrollY, target: target });
         }
-        var position = {
+        var position = (0, _extends2.default)({
           top: top,
           left: left,
           right: right,
-          bottom: bottom };
+          bottom: bottom },
+        (0, _getManualPosition.getManualPosition)({ menuPos: _this.props.menuPos, target: target, offsetY: offsetY, clientHeight: clientHeight, scrollY: scrollY }));
         _this.setState({

package/cjs/internal/DropdownContainer/DropdownContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["DropdownContainer.tsx"],"names":["DropdownContainer","props","getProps","defaultProps","ZIndexRef","element","dom","isElement","node","Element","position","target","getParent","targetRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","state","isDocumentElementRoot","scrollHeight","setState","minWidth","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","getIsDocumentElementRoot","componentDidMount","layoutSub","LayoutEvents","addListener","componentWillUnmount","remove","render","style","undefined","maxWidth","hasFixedWidth","content","styles","alignRight","isIE11","React","PureComponent","__KONTUR_REACT_UI__","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './DropdownContainer.styles';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' \| 'right';\n getParent: () => Nullable<Element>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n hasFixedWidth?: boolean;\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\ntype DefaultProps = Required<Pick<DropdownContainerProps, 'align' \| 'disablePortal' \| 'offsetY' \| 'offsetX'>>;\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps: DefaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n constructor(props: DropdownContainerProps) {\n super(props);\n\n this.state = { position: null, minWidth: 0, isDocumentElementRoot: getIsDocumentElementRoot() };\n }\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined,\n };\n }\n\n const content = (\n <ZIndex\n priority={'DropdownContainer'}\n wrapperRef={this.ZIndexRef}\n style={style}\n className={cx({\n [styles.alignRight()]: this.getProps().align === 'right' && !isIE11,\n })}\n >\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = getDOMRect(target);\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset \|\| docEl.scrollLeft \|\| 0;\n const scrollY = window.pageYOffset \|\| docEl.scrollTop \|\| 0;\n\n let left = null;\n let right = null;\n\n if (this.getProps().align === 'right') {\n const docWidth = docEl.offsetWidth \|\| 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const offsetY = this.getProps().offsetY \|\| 0;\n let bottom = null;\n let top: number \| null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n\n top = null;\n bottom = clientHeight + offsetY - scrollY - targetRect.top;\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.getProps().disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n return getDOMRect(child).height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n return getDOMRect(target).width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const offsetX = this.getProps().offsetX \|\| 0;\n const offsetY = this.getProps().offsetY \|\| 0;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = getDOMRect(target).height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n\nconst getIsDocumentElementRoot = () => {\n const { body, documentElement } = document;\n const htmlPosition = getComputedStyle(documentElement).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n return hasLimitedHeightRoot \|\| hasStaticRoot;\n};\n"]}
1	+ {"version":3,"sources":["DropdownContainer.tsx"],"names":["DropdownContainer","props","getProps","defaultProps","ZIndexRef","element","dom","isElement","node","Element","position","target","getParent","targetRect","document","body","docEl","documentElement","Error","scrollX","window","pageXOffset","scrollLeft","scrollY","pageYOffset","scrollTop","left","right","align","docWidth","offsetWidth","offsetX","offsetY","bottom","top","distanceToBottom","clientHeight","dropdownHeight","getHeight","state","isDocumentElementRoot","scrollHeight","menuPos","setState","minWidth","getMinWidth","disablePortal","convertToRelativePosition","child","children","item","height","width","targetHeight","getIsDocumentElementRoot","componentDidMount","layoutSub","LayoutEvents","addListener","componentWillUnmount","remove","render","style","undefined","maxWidth","hasFixedWidth","content","styles","alignRight","isIE11","React","PureComponent","__KONTUR_REACT_UI__","htmlPosition","getComputedStyle","bodyPosition","hasLimitedHeightRoot","hasStaticRoot"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../RenderContainer';\nimport { ZIndex } from '../ZIndex';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Nullable } from '../../typings/utility-types';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './DropdownContainer.styles';\nimport { getManualPosition, getTopAlignment } from './getManualPosition';\n\nexport interface DropdownContainerPosition {\n top: Nullable<number>;\n bottom: Nullable<number>;\n left: Nullable<number>;\n right: Nullable<number>;\n}\n\nexport interface DropdownContainerProps {\n align?: 'left' \| 'right';\n getParent: () => Nullable<Element>;\n children?: React.ReactNode;\n disablePortal?: boolean;\n offsetY?: number;\n offsetX?: number;\n hasFixedWidth?: boolean;\n /*\n Позволяет вручную задать текущую позицию выпадающего окна\n */\n menuPos?: 'top' \| 'bottom';\n}\n\nexport interface DropdownContainerState {\n position: Nullable<DropdownContainerPosition>;\n minWidth: number;\n isDocumentElementRoot?: boolean;\n}\n\ntype DefaultProps = Required<Pick<DropdownContainerProps, 'align' \| 'disablePortal' \| 'offsetY' \| 'offsetX'>>;\n\nexport class DropdownContainer extends React.PureComponent<DropdownContainerProps, DropdownContainerState> {\n public static __KONTUR_REACT_UI__ = 'DropdownContainer';\n\n public static defaultProps: DefaultProps = {\n align: 'left',\n disablePortal: false,\n offsetX: 0,\n offsetY: -1,\n };\n\n private getProps = createPropsGetter(DropdownContainer.defaultProps);\n\n private dom: Nullable<HTMLDivElement>;\n private layoutSub: Nullable<ReturnType<typeof LayoutEvents.addListener>>;\n\n constructor(props: DropdownContainerProps) {\n super(props);\n\n this.state = { position: null, minWidth: 0, isDocumentElementRoot: getIsDocumentElementRoot() };\n }\n\n public componentDidMount() {\n this.position();\n this.layoutSub = LayoutEvents.addListener(this.position);\n }\n\n public componentWillUnmount() {\n if (this.layoutSub) {\n this.layoutSub.remove();\n }\n }\n\n public render() {\n let style: React.CSSProperties = {\n position: 'absolute',\n top: '0',\n };\n if (this.state.position) {\n const { top, bottom, left, right } = this.state.position;\n style = {\n ...style,\n top: top !== null ? top : undefined,\n bottom: bottom !== null ? bottom : undefined,\n left: left !== null ? left : undefined,\n right: right !== null ? right : undefined,\n minWidth: this.state.minWidth,\n maxWidth: this.props.hasFixedWidth ? this.state.minWidth : undefined,\n };\n }\n\n const content = (\n <ZIndex\n priority={'DropdownContainer'}\n wrapperRef={this.ZIndexRef}\n style={style}\n className={cx({\n [styles.alignRight()]: this.getProps().align === 'right' && !isIE11,\n })}\n >\n {this.props.children}\n </ZIndex>\n );\n\n return this.props.disablePortal ? content : <RenderContainer>{content}</RenderContainer>;\n }\n\n private ZIndexRef = (element: Nullable<HTMLDivElement>) => {\n this.dom = element;\n };\n\n private isElement = (node: Nullable<Element>): node is Element => {\n return node instanceof Element;\n };\n\n public position = () => {\n const target = this.props.getParent();\n const dom = this.dom;\n\n if (target && this.isElement(target) && dom) {\n const targetRect = getDOMRect(target);\n const { body, documentElement: docEl } = document;\n\n if (!docEl) {\n throw Error('There is no \"documentElement\" in \"document\"');\n }\n\n const scrollX = window.pageXOffset \|\| docEl.scrollLeft \|\| 0;\n const scrollY = window.pageYOffset \|\| docEl.scrollTop \|\| 0;\n\n let left = null;\n let right = null;\n\n if (this.getProps().align === 'right') {\n const docWidth = docEl.offsetWidth \|\| 0;\n right = docWidth - (targetRect.right + scrollX) + this.getProps().offsetX;\n } else {\n left = targetRect.left + scrollX + this.getProps().offsetX;\n }\n\n const offsetY = this.getProps().offsetY \|\| 0;\n let bottom = null;\n let top: number \| null = targetRect.bottom + scrollY + offsetY;\n\n const distanceToBottom = docEl.clientHeight - targetRect.bottom;\n const dropdownHeight = this.getHeight();\n\n const clientHeight = this.state.isDocumentElementRoot ? docEl.clientHeight : body.scrollHeight;\n if (distanceToBottom < dropdownHeight && targetRect.top > dropdownHeight) {\n top = null;\n bottom = getTopAlignment({ clientHeight, offsetY, scrollY, target });\n }\n\n const position = {\n top,\n left,\n right,\n bottom,\n ...getManualPosition({ menuPos: this.props.menuPos, target, offsetY, clientHeight, scrollY }),\n };\n\n this.setState({\n minWidth: this.getMinWidth(),\n position: this.getProps().disablePortal ? this.convertToRelativePosition(position) : position,\n });\n }\n };\n\n private getHeight = () => {\n if (!this.isElement(this.dom)) {\n return 0;\n }\n const child = this.dom.children.item(0);\n return getDOMRect(child).height;\n };\n\n private getMinWidth = () => {\n const target = this.props.getParent();\n return getDOMRect(target).width;\n };\n\n private convertToRelativePosition = (position: DropdownContainerPosition): DropdownContainerPosition => {\n const target = this.props.getParent();\n const offsetX = this.getProps().offsetX \|\| 0;\n const offsetY = this.getProps().offsetY \|\| 0;\n const { top, bottom, left, right } = position;\n if (target && this.isElement(target)) {\n const targetHeight = getDOMRect(target).height;\n return {\n top: top !== null ? targetHeight + offsetY : null,\n bottom: bottom !== null ? targetHeight + offsetY : null,\n left: left !== null ? offsetX : null,\n right: right !== null ? offsetX : null,\n };\n }\n return {\n top: offsetY,\n bottom: null,\n left: offsetX,\n right: null,\n };\n };\n}\n\nconst getIsDocumentElementRoot = () => {\n const { body, documentElement } = document;\n const htmlPosition = getComputedStyle(documentElement).position;\n const bodyPosition = getComputedStyle(body).position;\n\n const hasLimitedHeightRoot = body.scrollHeight > body.clientHeight;\n const hasStaticRoot = htmlPosition === 'static' && bodyPosition === 'static';\n return hasLimitedHeightRoot \|\| hasStaticRoot;\n};\n"]}

package/cjs/internal/DropdownContainer/getManualPosition.d.ts ADDED Viewed

@@ -0,0 +1,19 @@
+import { DropdownContainerProps } from './DropdownContainer';
+export declare const getTopAlignment: ({ clientHeight, offsetY, scrollY, target, }: Required<Pick<DropdownContainerProps, "offsetY">> & {
+    clientHeight: number;
+    scrollY: number;
+    target: Element;
+}) => number;
+interface ManualPositionFuncArgs extends Required<Pick<DropdownContainerProps, 'offsetY'>>, Pick<DropdownContainerProps, 'menuPos'> {
+    target: Element;
+    clientHeight: number;
+    scrollY: number;
+}
+export declare const getManualPosition: ({ menuPos, target, offsetY, clientHeight }: ManualPositionFuncArgs) => {
+    top: null;
+    bottom: number;
+} | {
+    top: number;
+    bottom?: undefined;
+} | undefined;
+export {};

package/cjs/internal/DropdownContainer/getManualPosition.js ADDED Viewed

@@ -0,0 +1,41 @@
+"use strict";exports.__esModule = true;exports.getTopAlignment = exports.getManualPosition = void 0;var _getDOMRect = require("../../lib/dom/getDOMRect");
+var getTopAlignment = function getTopAlignment(_ref)
+{var clientHeight = _ref.clientHeight,offsetY = _ref.offsetY,scrollY = _ref.scrollY,target = _ref.target;
+  return clientHeight + offsetY - scrollY - (0, _getDOMRect.getDOMRect)(target).top;
+};exports.getTopAlignment = getTopAlignment;
+var getManualPosition = function getManualPosition(_ref2) {var menuPos = _ref2.menuPos,target = _ref2.target,offsetY = _ref2.offsetY,clientHeight = _ref2.clientHeight;
+  if (!menuPos) {
+    return undefined;
+  }
+  if (menuPos === 'top') {
+    return {
+      top: null,
+      bottom: getTopAlignment({ clientHeight: clientHeight, offsetY: offsetY, scrollY: scrollY, target: target }) };
+  }
+  if (menuPos === 'bottom') {
+    return { top: scrollY + (0, _getDOMRect.getDOMRect)(target).top + target.clientHeight + offsetY };
+  }
+};exports.getManualPosition = getManualPosition;

package/cjs/internal/DropdownContainer/getManualPosition.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["getManualPosition.ts"],"names":["getTopAlignment","clientHeight","offsetY","scrollY","target","top","getManualPosition","menuPos","undefined","bottom"],"mappings":"oGAAA;;;;AAIO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB;;;;;;;;;AASzB,KARJC,YAQI,QARJA,YAQI,CAPJC,OAOI,QAPJA,OAOI,CANJC,OAMI,QANJA,OAMI,CALJC,MAKI,QALJA,MAKI;AACJ,SAAOH,YAAY,GAAGC,OAAf,GAAyBC,OAAzB,GAAmC,4BAAWC,MAAX,EAAmBC,GAA7D;AACD,CAXM,C;;;;;;;;;;AAqBA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,QAAwE,KAArEC,OAAqE,SAArEA,OAAqE,CAA5DH,MAA4D,SAA5DA,MAA4D,CAApDF,OAAoD,SAApDA,OAAoD,CAA3CD,YAA2C,SAA3CA,YAA2C;AACvG,MAAI,CAACM,OAAL,EAAc;AACZ,WAAOC,SAAP;AACD;;AAED,MAAID,OAAO,KAAK,KAAhB,EAAuB;AACrB,WAAO;AACLF,MAAAA,GAAG,EAAE,IADA;AAELI,MAAAA,MAAM,EAAET,eAAe,CAAC,EAAEC,YAAY,EAAZA,YAAF,EAAgBC,OAAO,EAAPA,OAAhB,EAAyBC,OAAO,EAAPA,OAAzB,EAAkCC,MAAM,EAANA,MAAlC,EAAD,CAFlB,EAAP;;AAID;;AAED,MAAIG,OAAO,KAAK,QAAhB,EAA0B;AACxB,WAAO,EAAEF,GAAG,EAAEF,OAAO,GAAG,4BAAWC,MAAX,EAAmBC,GAA7B,GAAmCD,MAAM,CAACH,YAA1C,GAAyDC,OAAhE,EAAP;AACD;AACF,CAfM,C","sourcesContent":["import { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { DropdownContainerProps } from './DropdownContainer';\n\nexport const getTopAlignment = ({\n clientHeight,\n offsetY,\n scrollY,\n target,\n}: Required<Pick<DropdownContainerProps, 'offsetY'>> & {\n clientHeight: number;\n scrollY: number;\n target: Element;\n}) => {\n return clientHeight + offsetY - scrollY - getDOMRect(target).top;\n};\n\ninterface ManualPositionFuncArgs\n extends Required<Pick<DropdownContainerProps, 'offsetY'>>,\n Pick<DropdownContainerProps, 'menuPos'> {\n target: Element;\n clientHeight: number;\n scrollY: number;\n}\n\nexport const getManualPosition = ({ menuPos, target, offsetY, clientHeight }: ManualPositionFuncArgs) => {\n if (!menuPos) {\n return undefined;\n }\n\n if (menuPos === 'top') {\n return {\n top: null,\n bottom: getTopAlignment({ clientHeight, offsetY, scrollY, target }),\n };\n }\n\n if (menuPos === 'bottom') {\n return { top: scrollY + getDOMRect(target).top + target.clientHeight + offsetY };\n }\n};\n"]}

package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.d.ts CHANGED Viewed

@@ -8,13 +8,6 @@ interface FileUploaderFileProps {
     /** Состояние ошибки контрола файла */
     error?: boolean;
 }
-export declare const FileUploaderFileDataTids: {
-    readonly file: "FileUploader__file";
-    readonly fileTooltip: "FileUploader__fileTooltip";
-    readonly fileName: "FileUploader__fileName";
-    readonly fileSize: "FileUploader__fileSize";
-    readonly fileIcon: "FileUploader__fileIcon";
-};
 export declare const FileUploaderFile: {
     (props: FileUploaderFileProps): JSX.Element;
     displayName: string;

package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js CHANGED Viewed

@@ -1,12 +1,14 @@
-"use strict";exports.__esModule = true;exports.FileUploaderFileDataTids = exports.FileUploaderFile = void 0;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.FileUploaderFile = void 0;var _react = _interopRequireWildcard(require("react"));
+var _fileUtils = require("../fileUtils");
 var _utils = require("../../../lib/utils");
 var _TextWidthHelper = require("../../../internal/TextWidthHelper/TextWidthHelper");
 var _stringUtils = require("../../../lib/stringUtils");
+var _Spinner = require("../../../components/Spinner");
 var _FileUploaderControlContext = require("../FileUploaderControlContext");
 var _Emotion = require("../../../lib/theming/Emotion");
 var _ThemeContext = require("../../../lib/theming/ThemeContext");
+var _px = require("../../icons/16px");
 var _keyListener = require("../../../lib/events/keyListener");
 var _identifiers = require("../../../lib/events/keyboard/identifiers");
@@ -16,8 +18,7 @@ var _getDOMRect = require("../../../lib/dom/getDOMRect");
 var _useFileUploaderSize = require("../hooks/useFileUploaderSize");
-var _FileUploaderFile = require("./FileUploaderFile.styles");
-var _FileUploaderFileStatusIcon = require("./FileUploaderFileStatusIcon");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _FileUploaderFile = require("./FileUploaderFile.styles");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
@@ -56,14 +57,6 @@ name)
 var MIN_CHARS_LENGTH = 3;
-var FileUploaderFileDataTids = {
-  file: 'FileUploader__file',
-  fileTooltip: 'FileUploader__fileTooltip',
-  fileName: 'FileUploader__fileName',
-  fileSize: 'FileUploader__fileSize',
-  fileIcon: 'FileUploader__fileIcon' };exports.FileUploaderFileDataTids = FileUploaderFileDataTids;
 var FileUploaderFile = function FileUploaderFile(props) {var _cx, _cx2;
   var file = props.file,showSize = props.showSize,error = props.error,multiple = props.multiple,size = props.size;
   var id = file.id,originalFile = file.originalFile,status = file.status,validationResult = file.validationResult;
@@ -112,6 +105,27 @@ var FileUploaderFile = function FileUploaderFile(props) {var _cx, _cx2;
   var isInvalid = error || !isValid;
+  var icon = (0, _react.useMemo)(function () {
+    var deleteIcon = /*#__PURE__*/_react.default.createElement(_px.DeleteIcon, { className: _FileUploaderFile.jsStyles.deleteIcon(theme) });
+    if (hovered || focusedByTab) {
+      return deleteIcon;
+    }
+    if (isInvalid) {
+      return /*#__PURE__*/_react.default.createElement(_px.ErrorIcon, null);
+    }
+    switch (status) {
+      case _fileUtils.FileUploaderFileStatus.Loading:
+        return /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { type: "mini", dimmed: true, caption: "" });
+      case _fileUtils.FileUploaderFileStatus.Uploaded:
+        return /*#__PURE__*/_react.default.createElement(_px.OkIcon, { color: theme.fileUploaderIconColor });
+      default:
+        return deleteIcon;}
+  }, [hovered, status, isInvalid, theme, focusedByTab]);
   var sizeIconClass = (0, _useFileUploaderSize.useFileUploaderSize)(size, {
     small: _FileUploaderFile.jsStyles.iconSmall(),
     medium: _FileUploaderFile.jsStyles.iconMedium(),
@@ -174,40 +188,34 @@ var FileUploaderFile = function FileUploaderFile(props) {var _cx, _cx2;
   return /*#__PURE__*/(
     _react.default.createElement("div", {
-      "data-tid": FileUploaderFileDataTids.file,
+      "data-tid": "FileUploader__file",
       className: _FileUploaderFile.jsStyles.root(),
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave }, /*#__PURE__*/
-    _react.default.createElement(_Tooltip.Tooltip, { "data-tid": FileUploaderFileDataTids.fileTooltip, pos: "right middle", render: renderTooltipContent }, /*#__PURE__*/
+    _react.default.createElement(_Tooltip.Tooltip, { "data-tid": "FileUploader__fileTooltip", pos: "right middle", render: renderTooltipContent }, /*#__PURE__*/
     _react.default.createElement("div", { className: contentClassNames }, /*#__PURE__*/
     _react.default.createElement(_TextWidthHelper.TextWidthHelper, { ref: textHelperRef, text: name }), /*#__PURE__*/
     _react.default.createElement(_Hint.Hint, { maxWidth: '100%', text: isTruncated ? name : null }, /*#__PURE__*/
-    _react.default.createElement("span", { "data-tid": FileUploaderFileDataTids.fileName, ref: fileNameElementRef, className: _FileUploaderFile.jsStyles.name() },
+    _react.default.createElement("span", { "data-tid": "FileUploader__fileName", ref: fileNameElementRef, className: _FileUploaderFile.jsStyles.name() },
     truncatedFileName)),
     !!showSize && formattedSize && /*#__PURE__*/
-    _react.default.createElement("span", { "data-tid": FileUploaderFileDataTids.fileSize, className: _FileUploaderFile.jsStyles.size() },
+    _react.default.createElement("span", { "data-tid": "FileUploader__fileSize", className: _FileUploaderFile.jsStyles.size() },
     formattedSize), /*#__PURE__*/
     _react.default.createElement("div", {
       className: iconClassNames,
-      "data-tid": FileUploaderFileDataTids.fileIcon,
+      "data-tid": "FileUploader__fileIcon",
       tabIndex: 0,
       onClick: handleRemove,
       onFocus: handleFocus,
       onBlur: handleBlur,
-      onKeyDown: handleIconKeyDown }, /*#__PURE__*/
-    _react.default.createElement(_FileUploaderFileStatusIcon.FileUploaderFileStatusIcon, {
-      status: status,
-      hovered: hovered,
-      focusedByTab: focusedByTab,
-      isInvalid: isInvalid,
-      size: size }))))));
+      onKeyDown: handleIconKeyDown },
+    icon)))));

package/cjs/internal/FileUploaderControl/FileUploaderFile/FileUploaderFile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["FileUploaderFile.tsx"],"names":["getTruncatedName","fileNameWidth","fileNameElementWidth","name","charWidth","Math","ceil","length","maxCharsCountInSpan","calcTruncatedName","textHelperRef","fileNameElementRef","current","getTextWidth","width","MIN_CHARS_LENGTH","FileUploaderFileDataTids","file","fileTooltip","fileName","fileSize","fileIcon","FileUploaderFile","props","showSize","error","multiple","size","id","originalFile","status","validationResult","hovered","setHovered","focusedByTab","setFocusedByTab","truncatedFileName","setTruncatedFileName","FileUploaderControlContext","removeFile","setIsMinLengthReached","isMinLengthReached","theme","ThemeContext","formattedSize","truncatedName","removeUploadFile","handleRemove","event","preventDefault","stopPropagation","isValid","message","isInvalid","sizeIconClass","small","jsStyles","iconSmall","medium","iconMedium","large","iconLarge","renderTooltipContent","sizeContentClass","contentSmall","contentMedium","contentLarge","contentClassNames","content","handleMouseEnter","handleMouseLeave","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","handleIconKeyDown","e","iconClassNames","icon","focusedIcon","iconMultiple","isTruncated","root","displayName"],"mappings":"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","sourcesContent":["import React, { ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { FileUploaderAttachedFile } from '../fileUtils';\nimport { formatBytes } from '../../../lib/utils';\nimport { TextWidthHelper } from '../../../internal/TextWidthHelper/TextWidthHelper';\nimport { truncate } from '../../../lib/stringUtils';\nimport { FileUploaderControlContext } from '../FileUploaderControlContext';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { keyListener } from '../../../lib/events/keyListener';\nimport { isKeyEnter } from '../../../lib/events/keyboard/identifiers';\nimport { Nullable } from '../../../typings/utility-types';\nimport { Hint } from '../../../components/Hint';\nimport { Tooltip } from '../../../components/Tooltip';\nimport { getDOMRect } from '../../../lib/dom/getDOMRect';\nimport { FileUploaderSize } from '../../../components/FileUploader';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize';\n\nimport { jsStyles } from './FileUploaderFile.styles';\nimport { FileUploaderFileStatusIcon } from './FileUploaderFileStatusIcon';\n\ninterface FileUploaderFileProps {\n file: FileUploaderAttachedFile;\n showSize?: boolean;\n multiple?: boolean;\n size: FileUploaderSize;\n /** Состояние ошибки контрола файла */\n error?: boolean;\n}\n\nconst getTruncatedName = (fileNameWidth: number, fileNameElementWidth: number, name: string) => {\n if (!fileNameWidth && !fileNameElementWidth) {\n return null;\n }\n\n if (fileNameWidth <= fileNameElementWidth) {\n return name;\n }\n\n const charWidth = Math.ceil(fileNameWidth / name.length);\n const maxCharsCountInSpan = Math.ceil(fileNameElementWidth / charWidth);\n\n return truncate(name, maxCharsCountInSpan);\n};\n\nconst calcTruncatedName = (\n textHelperRef: React.RefObject<TextWidthHelper>,\n fileNameElementRef: React.RefObject<HTMLSpanElement>,\n name: string,\n) => {\n const fileNameWidth = textHelperRef.current?.getTextWidth() \|\| 0;\n const fileNameElementWidth = getDOMRect(fileNameElementRef.current).width;\n\n return getTruncatedName(fileNameWidth, fileNameElementWidth, name);\n};\n\nconst MIN_CHARS_LENGTH = 3;\n\nexport const FileUploaderFileDataTids = {\n file: 'FileUploader__file',\n fileTooltip: 'FileUploader__fileTooltip',\n fileName: 'FileUploader__fileName',\n fileSize: 'FileUploader__fileSize',\n fileIcon: 'FileUploader__fileIcon',\n} as const;\n\nexport const FileUploaderFile = (props: FileUploaderFileProps) => {\n const { file, showSize, error, multiple, size } = props;\n const { id, originalFile, status, validationResult } = file;\n const { name, size: fileSize } = originalFile;\n\n const [hovered, setHovered] = useState<boolean>(false);\n const [focusedByTab, setFocusedByTab] = useState(false);\n const [truncatedFileName, setTruncatedFileName] = useState<Nullable<string>>(null);\n\n const textHelperRef = useRef<TextWidthHelper>(null);\n const fileNameElementRef = useRef<HTMLSpanElement>(null);\n\n const { removeFile, setIsMinLengthReached, isMinLengthReached } = useContext(FileUploaderControlContext);\n const theme = useContext(ThemeContext);\n\n const formattedSize = useMemo(() => formatBytes(fileSize, 1), [fileSize]);\n\n useEffect(() => {\n if (setIsMinLengthReached) {\n const truncatedName = calcTruncatedName(textHelperRef, fileNameElementRef, name);\n\n setIsMinLengthReached((truncatedName?.length ?? 0) <= MIN_CHARS_LENGTH);\n }\n }, [name, isMinLengthReached]);\n\n useEffect(() => {\n const truncatedName = calcTruncatedName(textHelperRef, fileNameElementRef, name);\n\n setTruncatedFileName(truncatedName);\n });\n\n const removeUploadFile = useCallback(() => {\n removeFile(id);\n }, [removeFile, id]);\n\n const handleRemove = useCallback(\n (event: React.MouseEvent<HTMLElement>) => {\n event.preventDefault();\n event.stopPropagation();\n removeUploadFile();\n },\n [removeUploadFile],\n );\n\n const { isValid, message } = validationResult;\n\n const isInvalid = error \|\| !isValid;\n\n const sizeIconClass = useFileUploaderSize(size, {\n small: jsStyles.iconSmall(),\n medium: jsStyles.iconMedium(),\n large: jsStyles.iconLarge(),\n });\n\n const renderTooltipContent = useCallback((): ReactNode => {\n return !isValid && !error && message ? message : null;\n }, [isValid, error, message]);\n\n const sizeContentClass = useFileUploaderSize(size, {\n small: jsStyles.contentSmall(theme),\n medium: jsStyles.contentMedium(theme),\n large: jsStyles.contentLarge(theme),\n });\n\n const contentClassNames = cx(jsStyles.content(), {\n [sizeContentClass]: true,\n [jsStyles.error(theme)]: isInvalid,\n });\n\n const handleMouseEnter = useCallback(() => {\n setHovered(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setHovered(false);\n }, []);\n\n const handleFocus = useCallback(() => {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n setFocusedByTab(true);\n }\n });\n }, []);\n\n const handleBlur = useCallback(() => {\n setFocusedByTab(false);\n }, []);\n\n const handleIconKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (isKeyEnter(e)) {\n removeUploadFile();\n }\n },\n [removeUploadFile],\n );\n\n const iconClassNames = cx(jsStyles.icon(theme), {\n [jsStyles.focusedIcon(theme)]: focusedByTab,\n [sizeIconClass]: true,\n [jsStyles.iconMultiple()]: multiple,\n });\n\n const isTruncated = truncatedFileName !== name;\n\n return (\n <div\n data-tid={FileUploaderFileDataTids.file}\n className={jsStyles.root()}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n <Tooltip data-tid={FileUploaderFileDataTids.fileTooltip} pos=\"right middle\" render={renderTooltipContent}>\n <div className={contentClassNames}>\n <TextWidthHelper ref={textHelperRef} text={name} />\n <Hint maxWidth={'100%'} text={isTruncated ? name : null}>\n <span data-tid={FileUploaderFileDataTids.fileName} ref={fileNameElementRef} className={jsStyles.name()}>\n {truncatedFileName}\n </span>\n </Hint>\n {!!showSize && formattedSize && (\n <span data-tid={FileUploaderFileDataTids.fileSize} className={jsStyles.size()}>\n {formattedSize}\n </span>\n )}\n <div\n className={iconClassNames}\n data-tid={FileUploaderFileDataTids.fileIcon}\n tabIndex={0}\n onClick={handleRemove}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleIconKeyDown}\n >\n <FileUploaderFileStatusIcon\n status={status}\n hovered={hovered}\n focusedByTab={focusedByTab}\n isInvalid={isInvalid}\n size={size}\n />\n </div>\n </div>\n </Tooltip>\n </div>\n );\n};\n\nFileUploaderFile.displayName = 'FileUploaderFile';\n"]}
1	+ {"version":3,"sources":["FileUploaderFile.tsx"],"names":["getTruncatedName","fileNameWidth","fileNameElementWidth","name","charWidth","Math","ceil","length","maxCharsCountInSpan","calcTruncatedName","textHelperRef","fileNameElementRef","current","getTextWidth","width","MIN_CHARS_LENGTH","FileUploaderFile","props","file","showSize","error","multiple","size","id","originalFile","status","validationResult","fileSize","hovered","setHovered","focusedByTab","setFocusedByTab","truncatedFileName","setTruncatedFileName","FileUploaderControlContext","removeFile","setIsMinLengthReached","isMinLengthReached","theme","ThemeContext","formattedSize","truncatedName","removeUploadFile","handleRemove","event","preventDefault","stopPropagation","isValid","message","isInvalid","icon","deleteIcon","jsStyles","FileUploaderFileStatus","Loading","Uploaded","fileUploaderIconColor","sizeIconClass","small","iconSmall","medium","iconMedium","large","iconLarge","renderTooltipContent","sizeContentClass","contentSmall","contentMedium","contentLarge","contentClassNames","content","handleMouseEnter","handleMouseLeave","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","handleIconKeyDown","e","iconClassNames","focusedIcon","iconMultiple","isTruncated","root","displayName"],"mappings":"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","sourcesContent":["import React, { ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { FileUploaderAttachedFile, FileUploaderFileStatus } from '../fileUtils';\nimport { formatBytes } from '../../../lib/utils';\nimport { TextWidthHelper } from '../../../internal/TextWidthHelper/TextWidthHelper';\nimport { truncate } from '../../../lib/stringUtils';\nimport { Spinner } from '../../../components/Spinner';\nimport { FileUploaderControlContext } from '../FileUploaderControlContext';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { DeleteIcon, ErrorIcon, OkIcon } from '../../icons/16px';\nimport { keyListener } from '../../../lib/events/keyListener';\nimport { isKeyEnter } from '../../../lib/events/keyboard/identifiers';\nimport { Nullable } from '../../../typings/utility-types';\nimport { Hint } from '../../../components/Hint';\nimport { Tooltip } from '../../../components/Tooltip';\nimport { getDOMRect } from '../../../lib/dom/getDOMRect';\nimport { FileUploaderSize } from '../../../components/FileUploader';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize';\n\nimport { jsStyles } from './FileUploaderFile.styles';\n\ninterface FileUploaderFileProps {\n file: FileUploaderAttachedFile;\n showSize?: boolean;\n multiple?: boolean;\n size: FileUploaderSize;\n /** Состояние ошибки контрола файла */\n error?: boolean;\n}\n\nconst getTruncatedName = (fileNameWidth: number, fileNameElementWidth: number, name: string) => {\n if (!fileNameWidth && !fileNameElementWidth) {\n return null;\n }\n\n if (fileNameWidth <= fileNameElementWidth) {\n return name;\n }\n\n const charWidth = Math.ceil(fileNameWidth / name.length);\n const maxCharsCountInSpan = Math.ceil(fileNameElementWidth / charWidth);\n\n return truncate(name, maxCharsCountInSpan);\n};\n\nconst calcTruncatedName = (\n textHelperRef: React.RefObject<TextWidthHelper>,\n fileNameElementRef: React.RefObject<HTMLSpanElement>,\n name: string,\n) => {\n const fileNameWidth = textHelperRef.current?.getTextWidth() \|\| 0;\n const fileNameElementWidth = getDOMRect(fileNameElementRef.current).width;\n\n return getTruncatedName(fileNameWidth, fileNameElementWidth, name);\n};\n\nconst MIN_CHARS_LENGTH = 3;\n\nexport const FileUploaderFile = (props: FileUploaderFileProps) => {\n const { file, showSize, error, multiple, size } = props;\n const { id, originalFile, status, validationResult } = file;\n const { name, size: fileSize } = originalFile;\n\n const [hovered, setHovered] = useState<boolean>(false);\n const [focusedByTab, setFocusedByTab] = useState(false);\n const [truncatedFileName, setTruncatedFileName] = useState<Nullable<string>>(null);\n\n const textHelperRef = useRef<TextWidthHelper>(null);\n const fileNameElementRef = useRef<HTMLSpanElement>(null);\n\n const { removeFile, setIsMinLengthReached, isMinLengthReached } = useContext(FileUploaderControlContext);\n const theme = useContext(ThemeContext);\n\n const formattedSize = useMemo(() => formatBytes(fileSize, 1), [fileSize]);\n\n useEffect(() => {\n if (setIsMinLengthReached) {\n const truncatedName = calcTruncatedName(textHelperRef, fileNameElementRef, name);\n\n setIsMinLengthReached((truncatedName?.length ?? 0) <= MIN_CHARS_LENGTH);\n }\n }, [name, isMinLengthReached]);\n\n useEffect(() => {\n const truncatedName = calcTruncatedName(textHelperRef, fileNameElementRef, name);\n\n setTruncatedFileName(truncatedName);\n });\n\n const removeUploadFile = useCallback(() => {\n removeFile(id);\n }, [removeFile, id]);\n\n const handleRemove = useCallback(\n (event: React.MouseEvent<HTMLElement>) => {\n event.preventDefault();\n event.stopPropagation();\n removeUploadFile();\n },\n [removeUploadFile],\n );\n\n const { isValid, message } = validationResult;\n\n const isInvalid = error \|\| !isValid;\n\n const icon: ReactNode = useMemo(() => {\n const deleteIcon = <DeleteIcon className={jsStyles.deleteIcon(theme)} />;\n\n if (hovered \|\| focusedByTab) {\n return deleteIcon;\n }\n\n if (isInvalid) {\n return <ErrorIcon />;\n }\n\n switch (status) {\n case FileUploaderFileStatus.Loading:\n return <Spinner type=\"mini\" dimmed caption=\"\" />;\n case FileUploaderFileStatus.Uploaded:\n return <OkIcon color={theme.fileUploaderIconColor} />;\n default:\n return deleteIcon;\n }\n }, [hovered, status, isInvalid, theme, focusedByTab]);\n\n const sizeIconClass = useFileUploaderSize(size, {\n small: jsStyles.iconSmall(),\n medium: jsStyles.iconMedium(),\n large: jsStyles.iconLarge(),\n });\n\n const renderTooltipContent = useCallback((): ReactNode => {\n return !isValid && !error && message ? message : null;\n }, [isValid, error, message]);\n\n const sizeContentClass = useFileUploaderSize(size, {\n small: jsStyles.contentSmall(theme),\n medium: jsStyles.contentMedium(theme),\n large: jsStyles.contentLarge(theme),\n });\n\n const contentClassNames = cx(jsStyles.content(), {\n [sizeContentClass]: true,\n [jsStyles.error(theme)]: isInvalid,\n });\n\n const handleMouseEnter = useCallback(() => {\n setHovered(true);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setHovered(false);\n }, []);\n\n const handleFocus = useCallback(() => {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n setFocusedByTab(true);\n }\n });\n }, []);\n\n const handleBlur = useCallback(() => {\n setFocusedByTab(false);\n }, []);\n\n const handleIconKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (isKeyEnter(e)) {\n removeUploadFile();\n }\n },\n [removeUploadFile],\n );\n\n const iconClassNames = cx(jsStyles.icon(theme), {\n [jsStyles.focusedIcon(theme)]: focusedByTab,\n [sizeIconClass]: true,\n [jsStyles.iconMultiple()]: multiple,\n });\n\n const isTruncated = truncatedFileName !== name;\n\n return (\n <div\n data-tid=\"FileUploader__file\"\n className={jsStyles.root()}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n <Tooltip data-tid=\"FileUploader__fileTooltip\" pos=\"right middle\" render={renderTooltipContent}>\n <div className={contentClassNames}>\n <TextWidthHelper ref={textHelperRef} text={name} />\n <Hint maxWidth={'100%'} text={isTruncated ? name : null}>\n <span data-tid=\"FileUploader__fileName\" ref={fileNameElementRef} className={jsStyles.name()}>\n {truncatedFileName}\n </span>\n </Hint>\n {!!showSize && formattedSize && (\n <span data-tid=\"FileUploader__fileSize\" className={jsStyles.size()}>\n {formattedSize}\n </span>\n )}\n <div\n className={iconClassNames}\n data-tid=\"FileUploader__fileIcon\"\n tabIndex={0}\n onClick={handleRemove}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleIconKeyDown}\n >\n {icon}\n </div>\n </div>\n </Tooltip>\n </div>\n );\n};\n\nFileUploaderFile.displayName = 'FileUploaderFile';\n"]}

package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.d.ts CHANGED Viewed

@@ -5,9 +5,6 @@ interface FileUploaderFileListProps {
     renderFile: (file: FileUploaderAttachedFile, fileNode: React.ReactElement) => React.ReactNode;
     size: FileUploaderSize;
 }
-export declare const FileUploaderFileDataTids: {
-    readonly fileList: "FileUploader__fileList";
-};
 export declare const FileUploaderFileList: {
     (props: FileUploaderFileListProps): JSX.Element;
     displayName: string;

package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.FileUploaderFileList = exports.FileUploaderFileDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.FileUploaderFileList = void 0;var _react = _interopRequireWildcard(require("react"));
 var _FileUploaderControlContext = require("../FileUploaderControlContext");
 var _ThemeContext = require("../../../lib/theming/ThemeContext");
@@ -15,10 +15,6 @@ var _FileUploaderFileList = require("./FileUploaderFileList.styles");function _g
-var FileUploaderFileDataTids = {
-  fileList: 'FileUploader__fileList' };exports.FileUploaderFileDataTids = FileUploaderFileDataTids;
 var FileUploaderFileList = function FileUploaderFileList(props) {
   var renderFile = props.renderFile,size = props.size;
   var _useContext = (0, _react.useContext)(_FileUploaderControlContext.FileUploaderControlContext),files = _useContext.files;
@@ -31,7 +27,7 @@ var FileUploaderFileList = function FileUploaderFileList(props) {
   return /*#__PURE__*/(
-    _react.default.createElement("div", { "data-tid": FileUploaderFileDataTids.fileList },
+    _react.default.createElement("div", { "data-tid": "FileUploader__fileList" },
     files.map(function (file) {return /*#__PURE__*/(
         _react.default.createElement("div", { key: file.id, className: (0, _Emotion.cx)(_FileUploaderFileList.jsStyles.fileWrapper(theme), fileWrapperClass) }, /*#__PURE__*/
         _react.default.createElement("div", { className: _FileUploaderFileList.jsStyles.file() },

package/cjs/internal/FileUploaderControl/FileUploaderFileList/FileUploaderFileList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["FileUploaderFileList.tsx"],"names":["~~FileUploaderFileDataTids","fileList","~~FileUploaderFileList","props","renderFile","size","FileUploaderControlContext","files","theme","ThemeContext","fileWrapperClass","small","jsStyles","fileWrapperSmall","medium","fileWrapperMedium","large","fileWrapperLarge","map","file","id","fileWrapper","displayName"],"mappings":"~~gHAAA~~;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA,qE;;;;;;;AAOO,IAAMA,~~wBAAwB,GAAG;AACtCC,EAAAA,QAAQ,EAAE,wBAD4B,EAAjC,C;;;AAIA,IAAMC,~~oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAsC;AACxE,MAAQC,UAAR,GAA6BD,KAA7B,CAAQC,UAAR,CAAoBC,IAApB,GAA6BF,KAA7B,CAAoBE,IAApB;AACA,oBAAkB,uBAAWC,sDAAX,CAAlB,CAAQC,KAAR,eAAQA,KAAR;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA,MAAMC,gBAAgB,GAAG,8CAAoBL,IAApB,EAA0B;AACjDM,IAAAA,KAAK,EAAEC,+BAASC,gBAAT,CAA0BL,KAA1B,CAD0C;AAEjDM,IAAAA,MAAM,EAAEF,+BAASG,iBAAT,CAA2BP,KAA3B,CAFyC;AAGjDQ,IAAAA,KAAK,EAAEJ,+BAASK,gBAAT,CAA0BT,KAA1B,CAH0C,EAA1B,CAAzB;;;AAMA;AACE,0CAAK,~~YAAUR~~,~~wBAAwB,CAACC,QAAxC~~;~~AACGM~~,IAAAA,KAAK,CAACW,GAAN,CAAU,UAACC,IAAD;AACT,8CAAK,GAAG,EAAEA,IAAI,CAACC,EAAf,EAAmB,SAAS,EAAE,iBAAGR,+BAASS,WAAT,CAAqBb,KAArB,CAAH,EAAgCE,gBAAhC,CAA9B;AACE,8CAAK,SAAS,EAAEE,+BAASO,IAAT,EAAhB;AACGf,QAAAA,UAAU,CAACe,IAAD,eAAO,6BAAC,kCAAD,IAAkB,IAAI,EAAEA,IAAxB,EAA8B,QAAQ,MAAtC,EAAuC,QAAQ,MAA/C,EAAgD,IAAI,EAAEd,IAAtD,GAAP,CADb,CADF,CADS,GAAV,CADH,CADF;;;;;;AAWD,CAtBM,C;;AAwBPH,oBAAoB,CAACoB,WAArB,GAAmC,sBAAnC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { FileUploaderControlContext } from '../FileUploaderControlContext';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { FileUploaderFile } from '../FileUploaderFile/FileUploaderFile';\nimport { FileUploaderAttachedFile } from '../fileUtils';\nimport { FileUploaderSize } from '../../../components/FileUploader';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize';\n\nimport { jsStyles } from './FileUploaderFileList.styles';\n\ninterface FileUploaderFileListProps {\n renderFile: (file: FileUploaderAttachedFile, fileNode: React.ReactElement) => React.ReactNode;\n size: FileUploaderSize;\n}\n\nexport const ~~FileUploaderFileDataTids = {\n fileList: 'FileUploader__fileList',\n} as const;\n\nexport const~~ FileUploaderFileList = (props: FileUploaderFileListProps) => {\n const { renderFile, size } = props;\n const { files } = useContext(FileUploaderControlContext);\n const theme = useContext(ThemeContext);\n\n const fileWrapperClass = useFileUploaderSize(size, {\n small: jsStyles.fileWrapperSmall(theme),\n medium: jsStyles.fileWrapperMedium(theme),\n large: jsStyles.fileWrapperLarge(theme),\n });\n\n return (\n <div data-tid~~={FileUploaderFileDataTids.fileList}~~>\n {files.map((file) => (\n <div key={file.id} className={cx(jsStyles.fileWrapper(theme), fileWrapperClass)}>\n <div className={jsStyles.file()}>\n {renderFile(file, <FileUploaderFile file={file} showSize multiple size={size} />)}\n </div>\n </div>\n ))}\n </div>\n );\n};\n\nFileUploaderFileList.displayName = 'FileUploaderFileList';\n"]}
1	+ {"version":3,"sources":["FileUploaderFileList.tsx"],"names":["FileUploaderFileList","props","renderFile","size","FileUploaderControlContext","files","theme","ThemeContext","fileWrapperClass","small","jsStyles","fileWrapperSmall","medium","fileWrapperMedium","large","fileWrapperLarge","map","file","id","fileWrapper","displayName"],"mappings":"6EAAA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA,qE;;;;;;;AAOO,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAsC;AACxE,MAAQC,UAAR,GAA6BD,KAA7B,CAAQC,UAAR,CAAoBC,IAApB,GAA6BF,KAA7B,CAAoBE,IAApB;AACA,oBAAkB,uBAAWC,sDAAX,CAAlB,CAAQC,KAAR,eAAQA,KAAR;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA,MAAMC,gBAAgB,GAAG,8CAAoBL,IAApB,EAA0B;AACjDM,IAAAA,KAAK,EAAEC,+BAASC,gBAAT,CAA0BL,KAA1B,CAD0C;AAEjDM,IAAAA,MAAM,EAAEF,+BAASG,iBAAT,CAA2BP,KAA3B,CAFyC;AAGjDQ,IAAAA,KAAK,EAAEJ,+BAASK,gBAAT,CAA0BT,KAA1B,CAH0C,EAA1B,CAAzB;;;AAMA;AACE,0CAAK,YAAS,wBAAd;AACGD,IAAAA,KAAK,CAACW,GAAN,CAAU,UAACC,IAAD;AACT,8CAAK,GAAG,EAAEA,IAAI,CAACC,EAAf,EAAmB,SAAS,EAAE,iBAAGR,+BAASS,WAAT,CAAqBb,KAArB,CAAH,EAAgCE,gBAAhC,CAA9B;AACE,8CAAK,SAAS,EAAEE,+BAASO,IAAT,EAAhB;AACGf,QAAAA,UAAU,CAACe,IAAD,eAAO,6BAAC,kCAAD,IAAkB,IAAI,EAAEA,IAAxB,EAA8B,QAAQ,MAAtC,EAAuC,QAAQ,MAA/C,EAAgD,IAAI,EAAEd,IAAtD,GAAP,CADb,CADF,CADS,GAAV,CADH,CADF;;;;;;AAWD,CAtBM,C;;AAwBPH,oBAAoB,CAACoB,WAArB,GAAmC,sBAAnC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { FileUploaderControlContext } from '../FileUploaderControlContext';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { FileUploaderFile } from '../FileUploaderFile/FileUploaderFile';\nimport { FileUploaderAttachedFile } from '../fileUtils';\nimport { FileUploaderSize } from '../../../components/FileUploader';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { useFileUploaderSize } from '../hooks/useFileUploaderSize';\n\nimport { jsStyles } from './FileUploaderFileList.styles';\n\ninterface FileUploaderFileListProps {\n renderFile: (file: FileUploaderAttachedFile, fileNode: React.ReactElement) => React.ReactNode;\n size: FileUploaderSize;\n}\n\nexport const FileUploaderFileList = (props: FileUploaderFileListProps) => {\n const { renderFile, size } = props;\n const { files } = useContext(FileUploaderControlContext);\n const theme = useContext(ThemeContext);\n\n const fileWrapperClass = useFileUploaderSize(size, {\n small: jsStyles.fileWrapperSmall(theme),\n medium: jsStyles.fileWrapperMedium(theme),\n large: jsStyles.fileWrapperLarge(theme),\n });\n\n return (\n <div data-tid=\"FileUploader__fileList\">\n {files.map((file) => (\n <div key={file.id} className={cx(jsStyles.fileWrapper(theme), fileWrapperClass)}>\n <div className={jsStyles.file()}>\n {renderFile(file, <FileUploaderFile file={file} showSize multiple size={size} />)}\n </div>\n </div>\n ))}\n </div>\n );\n};\n\nFileUploaderFileList.displayName = 'FileUploaderFileList';\n"]}

package/cjs/internal/InputLikeText/InputLikeText.d.ts CHANGED Viewed

@@ -12,10 +12,6 @@ export interface InputLikeTextProps extends CommonProps, InputProps {
     takeContentWidth?: boolean;
 }
 export declare type InputLikeTextState = Omit<InputState, 'needsPolyfillPlaceholder'>;
-export declare const InputLikeTextDataTids: {
-    readonly root: "InputLikeText__root";
-    readonly input: "InputLikeText__input";
-};
 declare type DefaultProps = Required<Pick<InputLikeTextProps, 'size'>>;
 export declare class InputLikeText extends React.Component<InputLikeTextProps, InputLikeTextState> {
     static __KONTUR_REACT_UI__: string;

package/cjs/internal/InputLikeText/InputLikeText.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.InputLikeTextDataTids = exports.InputLikeText = 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"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.InputLikeText = 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"));
@@ -17,12 +17,9 @@ var _Emotion = require("../../lib/theming/Emotion");
 var _listenFocusOutside = require("../../lib/listenFocusOutside");
 var _rootNode = require("../../lib/rootNode");
 var _createPropsGetter = require("../../lib/createPropsGetter");
-var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
-var _InputLayoutAside = require("../../components/Input/InputLayout/InputLayoutAside");
-var _InputLayoutContext = require("../../components/Input/InputLayout/InputLayoutContext");
-var _HiddenInput = require("./HiddenInput");
-var _InputLikeText = require("./InputLikeText.styles");var _excluded = ["innerRef", "tabIndex", "placeholder", "align", "borderless", "width", "size", "error", "warning", "onValueChange", "disabled", "prefix", "suffix", "leftIcon", "rightIcon", "value", "onMouseDragStart", "onMouseDragEnd", "takeContentWidth"];var _class, _class2, _temp;
+var _InputLikeText = require("./InputLikeText.styles");
+var _HiddenInput = require("./HiddenInput");var _excluded = ["innerRef", "tabIndex", "placeholder", "align", "borderless", "width", "size", "error", "warning", "onValueChange", "disabled", "prefix", "suffix", "leftIcon", "rightIcon", "value", "onMouseDragStart", "onMouseDragEnd", "takeContentWidth"];var _class, _class2, _temp;var
@@ -36,11 +33,6 @@ var _InputLikeText = require("./InputLikeText.styles");var _excluded = ["innerRe
-var InputLikeTextDataTids = {
-  root: 'InputLikeText__root',
-  input: 'InputLikeText__input' };exports.InputLikeTextDataTids = InputLikeTextDataTids;var
@@ -175,16 +167,8 @@ InputLikeText = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
       var _this$state = _this.state,focused = _this$state.focused,blinking = _this$state.blinking;
-      var leftSide = (0, _ThemeHelpers.isTheme2022)(_this.theme) ? /*#__PURE__*/
-      _react.default.createElement(_InputLayoutAside.InputLayoutAside, { icon: leftIcon, text: prefix, side: "left" }) :
-      _this.renderLeftSide();
-      var rightSide = (0, _ThemeHelpers.isTheme2022)(_this.theme) ? /*#__PURE__*/
-      _react.default.createElement(_InputLayoutAside.InputLayoutAside, { icon: rightIcon, text: suffix, side: "right" }) :
-      _this.renderRightSide();
+      var leftSide = _this.renderLeftSide();
+      var rightSide = _this.renderRightSide();
       var className = (0, _Emotion.cx)(_InputLikeText.styles.root(), _Input.styles.root(_this.theme), _this.getSizeClassName(), (_cx = {}, _cx[
       _Input.styles.disabled(_this.theme)] = !!disabled, _cx[
@@ -203,12 +187,8 @@ InputLikeText = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
       _InputLikeText.styles.userSelectContain()] = focused, _cx2));
-      var context = _InputLayoutContext.InputLayoutContextDefault;
-      Object.assign(context, { disabled: disabled, focused: focused, size: size });
       return /*#__PURE__*/(
-        _react.default.createElement("span", (0, _extends2.default)({
-          "data-tid": InputLikeTextDataTids.root },
+        _react.default.createElement("span", (0, _extends2.default)({},
         rest, {
           className: className,
           style: { width: width, textAlign: align },
@@ -219,12 +199,11 @@ InputLikeText = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
           onKeyDown: _this.handleKeyDown,
           onMouseDown: _this.handleMouseDown }), /*#__PURE__*/
-        _react.default.createElement(_InputLayoutContext.InputLayoutContext.Provider, { value: context }, /*#__PURE__*/
         _react.default.createElement("input", { type: "hidden", value: value }),
         leftSide, /*#__PURE__*/
         _react.default.createElement("span", { className: wrapperClass }, /*#__PURE__*/
         _react.default.createElement("span", {
-          "data-tid": InputLikeTextDataTids.input,
+          "data-tid": "InputLikeText__input",
           className: (0, _Emotion.cx)(_Input.styles.input(_this.theme), (_cx3 = {}, _cx3[
           _InputLikeText.styles.absolute()] = !takeContentWidth, _cx3[
           _Input.styles.inputFocus(_this.theme)] = focused, _cx3[
@@ -236,8 +215,7 @@ InputLikeText = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*
         _this.renderPlaceholder()),
         rightSide,
-        _client.isIE11 && focused && /*#__PURE__*/_react.default.createElement(_HiddenInput.HiddenInput, { nodeRef: _this.hiddenInputRef }))));
+        _client.isIE11 && focused && /*#__PURE__*/_react.default.createElement(_HiddenInput.HiddenInput, { nodeRef: _this.hiddenInputRef })));
     };_this.