@alfalab/core-components-file-upload-item 7.0.0 → 7.0.1

package/esm/components/status-control/progress-bar/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+
+var ProgressBar = function (props) {
+    var className = props.className, strokeDasharray = props.strokeDasharray, strokeDashoffset = props.strokeDashoffset;
+    return (React.createElement("svg", { className: className, width: '56', height: '56', viewBox: '0 0 56 56', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' },
+        React.createElement("path", { d: 'M28 1C32.7738 1 36.7752 1.34174 40.0029 1.80371C47.4798 2.87385 53.1262 8.52019 54.1963 15.9971C54.6583 19.2248 55 23.2262 55 28C55 32.7738 54.6583 36.7752 54.1963 40.0029C53.1262 47.4798 47.4798 53.1262 40.0029 54.1963C36.7752 54.6583 32.7738 55 28 55C23.2262 55 19.2248 54.6583 15.9971 54.1963C8.5202 53.1262 2.87385 47.4798 1.80371 40.0029C1.34175 36.7752 1 32.7738 1 28C1 23.2262 1.34174 19.2248 1.80371 15.9971C2.87385 8.5202 8.5202 2.87385 15.9971 1.80371C19.2248 1.34174 23.2262 1 28 1Z', stroke: '#babbc2', strokeWidth: '2', strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset })));
+};
+
+export { ProgressBar };
+//# sourceMappingURL=index.js.map

package/esm/components/status-control/progress-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/status-control/progress-bar/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\ntype Props = {\n    className: string;\n    strokeDasharray: number;\n    strokeDashoffset: number;\n};\n\nexport const ProgressBar: FC<Props> = (props) => {\n    const { className, strokeDasharray, strokeDashoffset } = props;\n\n    return (\n        <svg\n            className={className}\n            width='56'\n            height='56'\n            viewBox='0 0 56 56'\n            fill='none'\n            xmlns='http://www.w3.org/2000/svg'\n        >\n            <path\n                d='M28 1C32.7738 1 36.7752 1.34174 40.0029 1.80371C47.4798 2.87385 53.1262 8.52019 54.1963 15.9971C54.6583 19.2248 55 23.2262 55 28C55 32.7738 54.6583 36.7752 54.1963 40.0029C53.1262 47.4798 47.4798 53.1262 40.0029 54.1963C36.7752 54.6583 32.7738 55 28 55C23.2262 55 19.2248 54.6583 15.9971 54.1963C8.5202 53.1262 2.87385 47.4798 1.80371 40.0029C1.34175 36.7752 1 32.7738 1 28C1 23.2262 1.34174 19.2248 1.80371 15.9971C2.87385 8.5202 8.5202 2.87385 15.9971 1.80371C19.2248 1.34174 23.2262 1 28 1Z'\n                stroke='#babbc2'\n                strokeWidth='2'\n                strokeDasharray={strokeDasharray}\n                strokeDashoffset={strokeDashoffset}\n            />\n        </svg>\n    );\n};\n"],"names":[],"mappings":";;AAQO,IAAM,WAAW,GAAc,UAAC,KAAK,EAAA;AAChC,IAAA,IAAA,SAAS,GAAwC,KAAK,CAAA,SAA7C,EAAE,eAAe,GAAuB,KAAK,CAAA,eAA5B,EAAE,gBAAgB,GAAK,KAAK,iBAAV;IAEpD,QACI,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAAA;QAElC,KACI,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,+eAA+e,EACjf,MAAM,EAAC,SAAS,EAChB,WAAW,EAAC,GAAG,EACf,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAAA,CACpC,CACA;AAEd;;;;"}

package/esm/const/progress-bar.d.ts

@@ -1,2 +1 @@
 export declare const MAX_PROGRESS_BAR_VALUE = 100;
-export declare const RADIUS = 360;

package/esm/const/progress-bar.js

@@ -1,5 +1,4 @@
 var MAX_PROGRESS_BAR_VALUE = 100;
-var RADIUS = 360;
 
-export { MAX_PROGRESS_BAR_VALUE, RADIUS };
+export { MAX_PROGRESS_BAR_VALUE };
 //# sourceMappingURL=progress-bar.js.map

package/esm/const/progress-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar.js","sources":["../../src/const/progress-bar.ts"],"sourcesContent":["export const MAX_PROGRESS_BAR_VALUE = 100;\nexport const RADIUS = 360;\n"],"names":[],"mappings":"AAAO,IAAM,sBAAsB,GAAG;AAC/B,IAAM,MAAM,GAAG;;;;"}
+{"version":3,"file":"progress-bar.js","sources":["../../src/const/progress-bar.ts"],"sourcesContent":["export const MAX_PROGRESS_BAR_VALUE = 100;\n"],"names":[],"mappings":"AAAO,IAAM,sBAAsB,GAAG;;;;"}

package/esm/index.css

@@ -3,13 +3,13 @@
     --gap-s: 12px;
     --gap-2: var(--gap-3xs);
     --gap-12: var(--gap-s);
-} .file-upload-item__component_g62kk {
+} .file-upload-item__component_1abzh {
     box-sizing: border-box;
     display: flex;
     align-items: flex-start;
     width: 100%;
     min-height: 48px;
-} .file-upload-item__restore_g62kk {
+} .file-upload-item__restore_1abzh {
     margin-left: var(--gap-12);
     margin-top: var(--gap-2);
 }

package/esm/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-var styles = {"component":"file-upload-item__component_g62kk","restore":"file-upload-item__restore_g62kk"};
+var styles = {"component":"file-upload-item__component_1abzh","restore":"file-upload-item__restore_1abzh"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/esm/utils.d.ts

@@ -1,5 +1,4 @@
 import { type FileUploadItemStatus } from './types/status';
-export declare function humanFileSize(size: string | number): string;
 export declare const getExtension: (filename: string) => string | undefined;
 export declare const isInitialStatus: (status?: FileUploadItemStatus) => boolean;
 export declare const isSuccessStatus: (status?: FileUploadItemStatus) => boolean;

package/esm/utils.js

@@ -1,14 +1,3 @@
-function humanFileSize(size) {
-    var units = ['Б', 'КБ', 'МБ', 'ГБ'];
-    var humanSize = Number(size);
-    var factor = 0;
-    while (humanSize >= 1024 && factor < units.length - 1) {
-        humanSize /= 1024;
-        factor += 1;
-    }
-    humanSize = humanSize.toFixed(2);
-    return "".concat(Number(humanSize), " ").concat(units[factor]);
-}
 var getExtension = function (filename) { return filename.toLowerCase().split('.').pop(); };
 var isInitialStatus = function (status) { return status === 'INITIAL'; };
 var isSuccessStatus = function (status) { return status === 'SUCCESS'; };
@@ -16,5 +5,5 @@ var isErrorStatus = function (status) { return status === 'ERROR'; };
 var isUploadingStatus = function (status) { return status === 'UPLOADING'; };
 var isUploadedStatus = function (status) { return status === 'UPLOADED'; };
 
-export { getExtension, humanFileSize, isErrorStatus, isInitialStatus, isSuccessStatus, isUploadedStatus, isUploadingStatus };
+export { getExtension, isErrorStatus, isInitialStatus, isSuccessStatus, isUploadedStatus, isUploadingStatus };
 //# sourceMappingURL=utils.js.map

package/esm/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type FileUploadItemStatus } from './types/status';\n\nexport function humanFileSize(size: string | number) {\n    const units = ['Б', 'КБ', 'МБ', 'ГБ'];\n\n    let humanSize: string | number = Number(size);\n    let factor = 0;\n\n    while (humanSize >= 1024 && factor < units.length - 1) {\n        humanSize /= 1024;\n        factor += 1;\n    }\n\n    humanSize = humanSize.toFixed(2);\n\n    return `${Number(humanSize)} ${units[factor]}`;\n}\n\nexport const getExtension = (filename: string) => filename.toLowerCase().split('.').pop();\n\nexport const isInitialStatus = (status?: FileUploadItemStatus) => status === 'INITIAL';\nexport const isSuccessStatus = (status?: FileUploadItemStatus) => status === 'SUCCESS';\nexport const isErrorStatus = (status?: FileUploadItemStatus) => status === 'ERROR';\nexport const isUploadingStatus = (status?: FileUploadItemStatus) => status === 'UPLOADING';\nexport const isUploadedStatus = (status?: FileUploadItemStatus) => status === 'UPLOADED';\n"],"names":[],"mappings":"AAEM,SAAU,aAAa,CAAC,IAAqB,EAAA;IAC/C,IAAM,KAAK,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;AAErC,IAAA,IAAI,SAAS,GAAoB,MAAM,CAAC,IAAI,CAAC;IAC7C,IAAI,MAAM,GAAG,CAAC;IAEd,OAAO,SAAS,IAAI,IAAI,IAAI,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;QACnD,SAAS,IAAI,IAAI;QACjB,MAAM,IAAI,CAAC;AACd;AAED,IAAA,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;IAEhC,OAAO,EAAA,CAAA,MAAA,CAAG,MAAM,CAAC,SAAS,CAAC,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,KAAK,CAAC,MAAM,CAAC,CAAE;AAClD;IAEa,YAAY,GAAG,UAAC,QAAgB,EAAA,EAAK,OAAA,QAAQ,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAvC;AAE3C,IAAM,eAAe,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,SAAS,CAAA;AAC/E,IAAM,eAAe,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,SAAS,CAAA;AAC/E,IAAM,aAAa,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,OAAO,CAAA;AAC3E,IAAM,iBAAiB,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,WAAW,CAAA;AACnF,IAAM,gBAAgB,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,UAAU,CAAA;;;;"}
+{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type FileUploadItemStatus } from './types/status';\n\nexport const getExtension = (filename: string) => filename.toLowerCase().split('.').pop();\n\nexport const isInitialStatus = (status?: FileUploadItemStatus) => status === 'INITIAL';\nexport const isSuccessStatus = (status?: FileUploadItemStatus) => status === 'SUCCESS';\nexport const isErrorStatus = (status?: FileUploadItemStatus) => status === 'ERROR';\nexport const isUploadingStatus = (status?: FileUploadItemStatus) => status === 'UPLOADING';\nexport const isUploadedStatus = (status?: FileUploadItemStatus) => status === 'UPLOADED';\n"],"names":[],"mappings":"IAEa,YAAY,GAAG,UAAC,QAAgB,EAAA,EAAK,OAAA,QAAQ,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAvC;AAE3C,IAAM,eAAe,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,SAAS,CAAA;AAC/E,IAAM,eAAe,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,SAAS,CAAA;AAC/E,IAAM,aAAa,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,OAAO,CAAA;AAC3E,IAAM,iBAAiB,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,WAAW,CAAA;AACnF,IAAM,gBAAgB,GAAG,UAAC,MAA6B,EAAK,EAAA,OAAA,MAAM,KAAK,UAAU,CAAA;;;;"}

package/index.css

@@ -3,13 +3,13 @@
     --gap-s: 12px;
     --gap-2: var(--gap-3xs);
     --gap-12: var(--gap-s);
-} .file-upload-item__component_g62kk {
+} .file-upload-item__component_1abzh {
     box-sizing: border-box;
     display: flex;
     align-items: flex-start;
     width: 100%;
     min-height: 48px;
-} .file-upload-item__restore_g62kk {
+} .file-upload-item__restore_1abzh {
     margin-left: var(--gap-12);
     margin-top: var(--gap-2);
 }

package/index.module.css.js

@@ -2,7 +2,7 @@
 
 require('./index.css');
 
-var styles = {"component":"file-upload-item__component_g62kk","restore":"file-upload-item__restore_g62kk"};
+var styles = {"component":"file-upload-item__component_1abzh","restore":"file-upload-item__restore_1abzh"};
 
 module.exports = styles;
 //# sourceMappingURL=index.module.css.js.map

package/modern/Component.js

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import cn from 'classnames';
 import { Actions } from './components/actions-control/actions.js';
 import { Content } from './components/content/content.js';
-import { StatusControl } from './components/status-control/status-control.js';
+import { StatusControl } from './components/status-control/index.js';
 import { FileUploadItemContext } from './context/file-upload-item-context.js';
 import styles from './index.module.css.js';
 

package/modern/components/actions-control/actions-control.css

@@ -1,22 +1,22 @@
 :root {
     --color-light-text-tertiary: rgba(5, 8, 29, 0.38);
     --color-light-text-tertiary-hover: rgba(4, 4, 21, 0.47);
-} .file-upload-item__container_1y4lw {
+} .file-upload-item__container_1i1mv {
     display: flex;
     max-width: 144px
-} .file-upload-item__container_1y4lw .file-upload-item__icon_1y4lw {
+} .file-upload-item__container_1i1mv .file-upload-item__icon_1i1mv {
         width: 48px;
         height: 48px;
-    } .file-upload-item__deleteIconColor_1y4lw {
+    } .file-upload-item__deleteIconColor_1i1mv {
     fill: var(--color-light-text-tertiary)
-} .file-upload-item__deleteIconColor_1y4lw:hover {
+} .file-upload-item__deleteIconColor_1i1mv:hover {
         fill: var(--color-light-text-tertiary-hover);
-    } .file-upload-item__downloadIconColor_1y4lw {
+    } .file-upload-item__downloadIconColor_1i1mv {
     fill: var(--color-light-text-tertiary)
-} .file-upload-item__downloadIconColor_1y4lw:hover {
+} .file-upload-item__downloadIconColor_1i1mv:hover {
         fill: var(--color-light-text-tertiary-hover);
-    } .file-upload-item__restoreIconColor_1y4lw {
+    } .file-upload-item__restoreIconColor_1i1mv {
     fill: var(--color-light-text-tertiary)
-} .file-upload-item__restoreIconColor_1y4lw:hover {
+} .file-upload-item__restoreIconColor_1i1mv:hover {
         fill: var(--color-light-text-tertiary-hover);
     }

package/modern/components/actions-control/actions-control.module.css.js

@@ -1,6 +1,6 @@
 import './actions-control.css';
 
-const styles = {"container":"file-upload-item__container_1y4lw","icon":"file-upload-item__icon_1y4lw","deleteIconColor":"file-upload-item__deleteIconColor_1y4lw","downloadIconColor":"file-upload-item__downloadIconColor_1y4lw","restoreIconColor":"file-upload-item__restoreIconColor_1y4lw"};
+const styles = {"container":"file-upload-item__container_1i1mv","icon":"file-upload-item__icon_1i1mv","deleteIconColor":"file-upload-item__deleteIconColor_1i1mv","downloadIconColor":"file-upload-item__downloadIconColor_1i1mv","restoreIconColor":"file-upload-item__restoreIconColor_1i1mv"};
 
 export { styles as default };
 //# sourceMappingURL=actions-control.module.css.js.map

package/modern/components/content/components/content-error/content-error.css

@@ -1,3 +1,3 @@
-.file-upload-item__errorItem_105a4 {
+.file-upload-item__errorItem_290ow {
     display: block;
 }

package/modern/components/content/components/content-error/content-error.module.css.js

@@ -1,6 +1,6 @@
 import './content-error.css';
 
-const styles = {"errorItem":"file-upload-item__errorItem_105a4"};
+const styles = {"errorItem":"file-upload-item__errorItem_290ow"};
 
 export { styles as default };
 //# sourceMappingURL=content-error.module.css.js.map

package/modern/components/content/components/content-subtitle/content-subtitle.css

@@ -1,12 +1,12 @@
 :root {
     --gap-xs: 8px;
     --gap-8: var(--gap-xs);
-} .file-upload-item__subtitle_shgl9 {
+} .file-upload-item__subtitle_1xcnq {
     display: block
-} .file-upload-item__subtitle_shgl9.file-upload-item__truncate_shgl9 {
+} .file-upload-item__subtitle_1xcnq.file-upload-item__truncate_1xcnq {
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
-    } .file-upload-item__size_shgl9 {
+    } .file-upload-item__size_1xcnq {
     margin-right: var(--gap-8);
 }

package/modern/components/content/components/content-subtitle/content-subtitle.js

@@ -1,9 +1,10 @@
 import React, { useContext } from 'react';
 import cn from 'classnames';
+import { humanFileSize } from '@alfalab/core-components-shared/modern';
 import { Text } from '@alfalab/core-components-typography/modern';
 import { MAX_PROGRESS_BAR_VALUE } from '../../../../const/progress-bar.js';
 import { FileUploadItemContext } from '../../../../context/file-upload-item-context.js';
-import { isErrorStatus, isUploadingStatus, humanFileSize, isSuccessStatus, isUploadedStatus } from '../../../../utils.js';
+import { isErrorStatus, isUploadingStatus, isSuccessStatus, isUploadedStatus } from '../../../../utils.js';
 import { isError } from '../../utils/isError.js';
 import { ContentError } from '../content-error/content-error.js';
 import styles from './content-subtitle.module.css.js';

package/modern/components/content/components/content-subtitle/content-subtitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"content-subtitle.js","sources":["../../../../../src/components/content/components/content-subtitle/content-subtitle.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Text } from '@alfalab/core-components-typography';\n\nimport { MAX_PROGRESS_BAR_VALUE } from '../../../../const/progress-bar';\nimport { FileUploadItemContext } from '../../../../context/file-upload-item-context';\nimport {\n    humanFileSize,\n    isErrorStatus,\n    isSuccessStatus,\n    isUploadedStatus,\n    isUploadingStatus,\n} from '../../../../utils';\nimport { isError } from '../../utils/isError';\nimport { ContentError } from '../content-error';\n\nimport styles from './content-subtitle.module.css';\n\nexport const ContentSubtitle = () => {\n    const { uploadStatus, subtitle, uploadDate, size, truncate, showRestore, error, progressBar } =\n        useContext(FileUploadItemContext);\n\n    const shouldShownError = isErrorStatus(uploadStatus) || isError(error);\n    const showMeta =\n        !showRestore && (isSuccessStatus(uploadStatus) || isUploadedStatus(uploadStatus));\n\n    // валидация progressBar (не должен превышать 100 и быть меньше 0)\n    const validateProgressBarValue = (progressValue: number | undefined) => {\n        if (progressValue === undefined) {\n            return 0;\n        }\n\n        return Math.min(Math.max(progressValue, 0), MAX_PROGRESS_BAR_VALUE);\n    };\n\n    const validProgressBar = validateProgressBarValue(progressBar);\n\n    // uploading status\n    if (isUploadingStatus(uploadStatus)) {\n        return (\n            <Text view='primary-small' color='secondary'>\n                Загружено{'\\u00A0'}\n                {Math.floor(validProgressBar)}%\n            </Text>\n        );\n    }\n\n    // error status\n    if (shouldShownError) {\n        return <ContentError />;\n    }\n\n    // success status\n    if (showMeta) {\n        return (\n            <div>\n                {size && (\n                    <Text className={styles.size} view='primary-small' color='secondary'>\n                        {humanFileSize(size)}\n                    </Text>\n                )}\n                {uploadDate && (\n                    <Text view='primary-small' color='secondary'>\n                        {uploadDate}\n                    </Text>\n                )}\n            </div>\n        );\n    }\n\n    // restore status\n    if (showRestore) {\n        return (\n            <Text view='primary-small' color='tertiary'>\n                Файл удален\n            </Text>\n        );\n    }\n\n    return (\n        <Text\n            className={cn(styles.subtitle, {\n                [styles.truncate]: truncate,\n            })}\n            view='primary-small'\n            color='secondary'\n        >\n            {subtitle}\n        </Text>\n    );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAmBO,MAAM,eAAe,GAAG,MAAK;IAChC,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,GACzF,UAAU,CAAC,qBAAqB,CAAC;IAErC,MAAM,gBAAgB,GAAG,aAAa,CAAC,YAAY,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC;AACtE,IAAA,MAAM,QAAQ,GACV,CAAC,WAAW,KAAK,eAAe,CAAC,YAAY,CAAC,IAAI,gBAAgB,CAAC,YAAY,CAAC,CAAC;;AAGrF,IAAA,MAAM,wBAAwB,GAAG,CAAC,aAAiC,KAAI;QACnE,IAAI,aAAa,KAAK,SAAS,EAAE;AAC7B,YAAA,OAAO,CAAC;AACX;AAED,QAAA,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC,CAAC,EAAE,sBAAsB,CAAC;AACvE,KAAC;AAED,IAAA,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,WAAW,CAAC;;AAG9D,IAAA,IAAI,iBAAiB,CAAC,YAAY,CAAC,EAAE;QACjC,QACI,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EAAA;;YAC9B,QAAQ;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC;AAC1B,YAAA,GAAA,CAAA;AAEd;;AAGD,IAAA,IAAI,gBAAgB,EAAE;QAClB,OAAO,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,IAAA,CAAG;AAC1B;;AAGD,IAAA,IAAI,QAAQ,EAAE;AACV,QAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;YACK,IAAI,KACD,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EAAA,EAC/D,aAAa,CAAC,IAAI,CAAC,CACjB,CACV;AACA,YAAA,UAAU,KACP,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EACvC,EAAA,UAAU,CACR,CACV,CACC;AAEb;;AAGD,IAAA,IAAI,WAAW,EAAE;AACb,QAAA,QACI,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,UAAU,EAAA,EAAA,+DAAA,CAEpC;AAEd;IAED,QACI,KAAC,CAAA,aAAA,CAAA,IAAI,EACD,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE;AAC3B,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,QAAQ;AAC9B,SAAA,CAAC,EACF,IAAI,EAAC,eAAe,EACpB,KAAK,EAAC,WAAW,EAEhB,EAAA,QAAQ,CACN;AAEf;;;;"}
+{"version":3,"file":"content-subtitle.js","sources":["../../../../../src/components/content/components/content-subtitle/content-subtitle.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { humanFileSize } from '@alfalab/core-components-shared';\nimport { Text } from '@alfalab/core-components-typography';\n\nimport { MAX_PROGRESS_BAR_VALUE } from '../../../../const/progress-bar';\nimport { FileUploadItemContext } from '../../../../context/file-upload-item-context';\nimport {\n    isErrorStatus,\n    isSuccessStatus,\n    isUploadedStatus,\n    isUploadingStatus,\n} from '../../../../utils';\nimport { isError } from '../../utils/isError';\nimport { ContentError } from '../content-error';\n\nimport styles from './content-subtitle.module.css';\n\nexport const ContentSubtitle = () => {\n    const { uploadStatus, subtitle, uploadDate, size, truncate, showRestore, error, progressBar } =\n        useContext(FileUploadItemContext);\n\n    const shouldShownError = isErrorStatus(uploadStatus) || isError(error);\n    const showMeta =\n        !showRestore && (isSuccessStatus(uploadStatus) || isUploadedStatus(uploadStatus));\n\n    // валидация progressBar (не должен превышать 100 и быть меньше 0)\n    const validateProgressBarValue = (progressValue: number | undefined) => {\n        if (progressValue === undefined) {\n            return 0;\n        }\n\n        return Math.min(Math.max(progressValue, 0), MAX_PROGRESS_BAR_VALUE);\n    };\n\n    const validProgressBar = validateProgressBarValue(progressBar);\n\n    // uploading status\n    if (isUploadingStatus(uploadStatus)) {\n        return (\n            <Text view='primary-small' color='secondary'>\n                Загружено{'\\u00A0'}\n                {Math.floor(validProgressBar)}%\n            </Text>\n        );\n    }\n\n    // error status\n    if (shouldShownError) {\n        return <ContentError />;\n    }\n\n    // success status\n    if (showMeta) {\n        return (\n            <div>\n                {size && (\n                    <Text className={styles.size} view='primary-small' color='secondary'>\n                        {humanFileSize(size)}\n                    </Text>\n                )}\n                {uploadDate && (\n                    <Text view='primary-small' color='secondary'>\n                        {uploadDate}\n                    </Text>\n                )}\n            </div>\n        );\n    }\n\n    // restore status\n    if (showRestore) {\n        return (\n            <Text view='primary-small' color='tertiary'>\n                Файл удален\n            </Text>\n        );\n    }\n\n    return (\n        <Text\n            className={cn(styles.subtitle, {\n                [styles.truncate]: truncate,\n            })}\n            view='primary-small'\n            color='secondary'\n        >\n            {subtitle}\n        </Text>\n    );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAmBO,MAAM,eAAe,GAAG,MAAK;IAChC,MAAM,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,WAAW,EAAE,GACzF,UAAU,CAAC,qBAAqB,CAAC;IAErC,MAAM,gBAAgB,GAAG,aAAa,CAAC,YAAY,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC;AACtE,IAAA,MAAM,QAAQ,GACV,CAAC,WAAW,KAAK,eAAe,CAAC,YAAY,CAAC,IAAI,gBAAgB,CAAC,YAAY,CAAC,CAAC;;AAGrF,IAAA,MAAM,wBAAwB,GAAG,CAAC,aAAiC,KAAI;QACnE,IAAI,aAAa,KAAK,SAAS,EAAE;AAC7B,YAAA,OAAO,CAAC;AACX;AAED,QAAA,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC,CAAC,EAAE,sBAAsB,CAAC;AACvE,KAAC;AAED,IAAA,MAAM,gBAAgB,GAAG,wBAAwB,CAAC,WAAW,CAAC;;AAG9D,IAAA,IAAI,iBAAiB,CAAC,YAAY,CAAC,EAAE;QACjC,QACI,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EAAA;;YAC9B,QAAQ;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC;AAC1B,YAAA,GAAA,CAAA;AAEd;;AAGD,IAAA,IAAI,gBAAgB,EAAE;QAClB,OAAO,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,IAAA,CAAG;AAC1B;;AAGD,IAAA,IAAI,QAAQ,EAAE;AACV,QAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;YACK,IAAI,KACD,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EAAA,EAC/D,aAAa,CAAC,IAAI,CAAC,CACjB,CACV;AACA,YAAA,UAAU,KACP,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,WAAW,EACvC,EAAA,UAAU,CACR,CACV,CACC;AAEb;;AAGD,IAAA,IAAI,WAAW,EAAE;AACb,QAAA,QACI,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAC,eAAe,EAAC,KAAK,EAAC,UAAU,EAAA,EAAA,+DAAA,CAEpC;AAEd;IAED,QACI,KAAC,CAAA,aAAA,CAAA,IAAI,EACD,EAAA,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE;AAC3B,YAAA,CAAC,MAAM,CAAC,QAAQ,GAAG,QAAQ;AAC9B,SAAA,CAAC,EACF,IAAI,EAAC,eAAe,EACpB,KAAK,EAAC,WAAW,EAEhB,EAAA,QAAQ,CACN;AAEf;;;;"}

package/modern/components/content/components/content-subtitle/content-subtitle.module.css.js

@@ -1,6 +1,6 @@
 import './content-subtitle.css';
 
-const styles = {"subtitle":"file-upload-item__subtitle_shgl9","truncate":"file-upload-item__truncate_shgl9","size":"file-upload-item__size_shgl9"};
+const styles = {"subtitle":"file-upload-item__subtitle_1xcnq","truncate":"file-upload-item__truncate_1xcnq","size":"file-upload-item__size_1xcnq"};
 
 export { styles as default };
 //# sourceMappingURL=content-subtitle.module.css.js.map

package/modern/components/content/content.css

@@ -7,28 +7,28 @@
     --gap-2: var(--gap-3xs);
     --gap-4: var(--gap-2xs);
     --gap-16: var(--gap-m);
-} .file-upload-item__container_kiylw {
+} .file-upload-item__container_4fzkr {
     padding: var(--gap-2) 0 0 var(--gap-16);
     flex-grow: 1;
     min-width: 0
-} .file-upload-item__container_kiylw.file-upload-item__clickable_kiylw {
+} .file-upload-item__container_4fzkr.file-upload-item__clickable_4fzkr {
         cursor: pointer;
-    } .file-upload-item__container_kiylw.file-upload-item__single_kiylw {
+    } .file-upload-item__container_4fzkr.file-upload-item__single_4fzkr {
         display: flex;
         flex-direction: column;
         justify-content: center;
         padding-top: 0;
         min-height: 48px
-    } .file-upload-item__container_kiylw.file-upload-item__single_kiylw .file-upload-item__title_kiylw {
+    } .file-upload-item__container_4fzkr.file-upload-item__single_4fzkr .file-upload-item__title_4fzkr {
             margin-bottom: 0;
-        } .file-upload-item__container_kiylw .file-upload-item__title_kiylw {
+        } .file-upload-item__container_4fzkr .file-upload-item__title_4fzkr {
         margin-bottom: var(--gap-4);
         display: block;
         overflow-wrap: break-word
-    } .file-upload-item__container_kiylw .file-upload-item__title_kiylw.file-upload-item__truncate_kiylw {
+    } .file-upload-item__container_4fzkr .file-upload-item__title_4fzkr.file-upload-item__truncate_4fzkr {
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
-        } .file-upload-item__container_kiylw .file-upload-item__title_kiylw.file-upload-item__restore_kiylw {
+        } .file-upload-item__container_4fzkr .file-upload-item__title_4fzkr.file-upload-item__restore_4fzkr {
             color: var(--color-light-text-tertiary);
         }

package/modern/components/content/content.module.css.js

@@ -1,6 +1,6 @@
 import './content.css';
 
-const styles = {"container":"file-upload-item__container_kiylw","clickable":"file-upload-item__clickable_kiylw","single":"file-upload-item__single_kiylw","title":"file-upload-item__title_kiylw","truncate":"file-upload-item__truncate_kiylw","restore":"file-upload-item__restore_kiylw"};
+const styles = {"container":"file-upload-item__container_4fzkr","clickable":"file-upload-item__clickable_4fzkr","single":"file-upload-item__single_4fzkr","title":"file-upload-item__title_4fzkr","truncate":"file-upload-item__truncate_4fzkr","restore":"file-upload-item__restore_4fzkr"};
 
 export { styles as default };
 //# sourceMappingURL=content.module.css.js.map

package/{components/status-control/components/status-control-icon/status-control-icon.css → modern/components/status-control/extension-icon/index.css}

@@ -5,14 +5,14 @@
     --color-light-decorative-green: #0cc44d;
     --color-light-decorative-orange: #fa9313;
     --color-light-decorative-red: #fe5e48;
-} .file-upload-item__iconPDFColored_9haca {
+} .file-upload-item__iconPDFColored_1h67t {
     fill: var(--color-light-decorative-red);
-} .file-upload-item__iconDOCColored_9haca {
+} .file-upload-item__iconDOCColored_1h67t {
     fill: var(--color-light-decorative-blue);
-} .file-upload-item__iconExcelColored_9haca {
+} .file-upload-item__iconExcelColored_1h67t {
     fill: var(--color-light-decorative-green);
-} .file-upload-item__icon1CColored_9haca {
+} .file-upload-item__icon1CColored_1h67t {
     fill: var(--color-light-decorative-orange);
-} .file-upload-item__iconDocumentColored_9haca {
+} .file-upload-item__iconDocumentColored_1h67t {
     fill: var(--color-light-neutral-translucent-1300);
 }

package/modern/components/status-control/extension-icon/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ExtensionIcon: () => React.JSX.Element | null;

package/{moderncssm/components/status-control/components/status-control-icon/status-control-icon.js → modern/components/status-control/extension-icon/index.js}

@@ -5,15 +5,14 @@ import { DocumentDocMIcon } from '@alfalab/icons-glyph/DocumentDocMIcon';
 import { DocumentExcelMIcon } from '@alfalab/icons-glyph/DocumentExcelMIcon';
 import { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';
 import { DocumentMIcon } from '@alfalab/icons-glyph/DocumentMIcon';
-import DocumentOffMIcon from '@alfalab/icons-glyph/DocumentOffMIcon';
+import { DocumentOffMIcon } from '@alfalab/icons-glyph/DocumentOffMIcon';
 import { DocumentPdfMIcon } from '@alfalab/icons-glyph/DocumentPdfMIcon';
 import { PaperclipMIcon } from '@alfalab/icons-glyph/PaperclipMIcon';
-import { FileUploadItemContext } from '../../../../context/file-upload-item-context.js';
-import { isInitialStatus, getExtension } from '../../../../utils.js';
-import styles from './status-control-icon.module.css';
+import { FileUploadItemContext } from '../../../context/file-upload-item-context.js';
+import { isInitialStatus, getExtension } from '../../../utils.js';
+import styles from './index.module.css.js';
 
-/* eslint-disable complexity */
-const StatusControlIcon = () => {
+const ExtensionIcon = () => {
     const { title = '', uploadStatus, iconStyle, customIcon: CustomIcon, imageUrl, showRestore, } = useContext(FileUploadItemContext);
     if (imageUrl) {
         return null;
@@ -54,5 +53,5 @@ const StatusControlIcon = () => {
     }
 };
 
-export { StatusControlIcon };
-//# sourceMappingURL=status-control-icon.js.map
+export { ExtensionIcon };
+//# sourceMappingURL=index.js.map

package/modern/components/status-control/extension-icon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/status-control/extension-icon/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Document1CMIcon } from '@alfalab/icons-glyph/Document1CMIcon';\nimport { DocumentDocMIcon } from '@alfalab/icons-glyph/DocumentDocMIcon';\nimport { DocumentExcelMIcon } from '@alfalab/icons-glyph/DocumentExcelMIcon';\nimport { DocumentImageMIcon } from '@alfalab/icons-glyph/DocumentImageMIcon';\nimport { DocumentMIcon } from '@alfalab/icons-glyph/DocumentMIcon';\nimport { DocumentOffMIcon } from '@alfalab/icons-glyph/DocumentOffMIcon';\nimport { DocumentPdfMIcon } from '@alfalab/icons-glyph/DocumentPdfMIcon';\nimport { PaperclipMIcon } from '@alfalab/icons-glyph/PaperclipMIcon';\n\nimport { FileUploadItemContext } from '../../../context/file-upload-item-context';\nimport { getExtension, isInitialStatus } from '../../../utils';\n\nimport styles from './index.module.css';\n\nexport const ExtensionIcon = () => {\n    const {\n        title = '',\n        uploadStatus,\n        iconStyle,\n        customIcon: CustomIcon,\n        imageUrl,\n        showRestore,\n    } = useContext(FileUploadItemContext);\n\n    if (imageUrl) {\n        return null;\n    }\n\n    if (CustomIcon) {\n        return <CustomIcon />;\n    }\n\n    if (isInitialStatus(uploadStatus)) {\n        return <PaperclipMIcon />;\n    }\n\n    if (showRestore) {\n        return <DocumentOffMIcon />;\n    }\n\n    const isColoredIcon = iconStyle === 'colored';\n    const fileType = getExtension(title);\n\n    switch (fileType) {\n        case 'pdf':\n        case 'ppt':\n        case 'pptx':\n            return <DocumentPdfMIcon className={cn({ [styles.iconPDFColored]: isColoredIcon })} />;\n        case 'doc':\n        case 'docx':\n            return <DocumentDocMIcon className={cn({ [styles.iconDOCColored]: isColoredIcon })} />;\n        case 'xls':\n        case 'xlsx':\n            return (\n                <DocumentExcelMIcon className={cn({ [styles.iconExcelColored]: isColoredIcon })} />\n            );\n        case '1c':\n            return <Document1CMIcon className={cn({ [styles.icon1CColored]: isColoredIcon })} />;\n        case 'png':\n        case 'jpg':\n        case 'jpeg':\n        case 'svg':\n        case 'tif':\n        case 'tiff':\n            return <DocumentImageMIcon />;\n        default:\n            return (\n                <DocumentMIcon className={cn({ [styles.iconDocumentColored]: isColoredIcon })} />\n            );\n    }\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAiBO,MAAM,aAAa,GAAG,MAAK;IAC9B,MAAM,EACF,KAAK,GAAG,EAAE,EACV,YAAY,EACZ,SAAS,EACT,UAAU,EAAE,UAAU,EACtB,QAAQ,EACR,WAAW,GACd,GAAG,UAAU,CAAC,qBAAqB,CAAC;AAErC,IAAA,IAAI,QAAQ,EAAE;AACV,QAAA,OAAO,IAAI;AACd;AAED,IAAA,IAAI,UAAU,EAAE;QACZ,OAAO,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,IAAA,CAAG;AACxB;AAED,IAAA,IAAI,eAAe,CAAC,YAAY,CAAC,EAAE;QAC/B,OAAO,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA,CAAG;AAC5B;AAED,IAAA,IAAI,WAAW,EAAE;QACb,OAAO,KAAA,CAAA,aAAA,CAAC,gBAAgB,EAAA,IAAA,CAAG;AAC9B;AAED,IAAA,MAAM,aAAa,GAAG,SAAS,KAAK,SAAS;AAC7C,IAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,KAAK,CAAC;AAEpC,IAAA,QAAQ,QAAQ;AACZ,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,MAAM;AACP,YAAA,OAAO,oBAAC,gBAAgB,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,cAAc,GAAG,aAAa,EAAE,CAAC,GAAI;AAC1F,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,MAAM;AACP,YAAA,OAAO,oBAAC,gBAAgB,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,cAAc,GAAG,aAAa,EAAE,CAAC,GAAI;AAC1F,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,MAAM;YACP,QACI,oBAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,gBAAgB,GAAG,aAAa,EAAE,CAAC,EAAA,CAAI;AAE3F,QAAA,KAAK,IAAI;AACL,YAAA,OAAO,oBAAC,eAAe,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,aAAa,GAAG,aAAa,EAAE,CAAC,GAAI;AACxF,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,MAAM;AACX,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,KAAK;AACV,QAAA,KAAK,MAAM;YACP,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAkB,EAAA,IAAA,CAAG;AACjC,QAAA;YACI,QACI,oBAAC,aAAa,EAAA,EAAC,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,mBAAmB,GAAG,aAAa,EAAE,CAAC,EAAA,CAAI;AAE5F;AACL;;;;"}

package/modern/components/status-control/extension-icon/index.module.css.js

@@ -0,0 +1,6 @@
+import './index.css';
+
+const styles = {"iconPDFColored":"file-upload-item__iconPDFColored_1h67t","iconDOCColored":"file-upload-item__iconDOCColored_1h67t","iconExcelColored":"file-upload-item__iconExcelColored_1h67t","icon1CColored":"file-upload-item__icon1CColored_1h67t","iconDocumentColored":"file-upload-item__iconDocumentColored_1h67t"};
+
+export { styles as default };
+//# sourceMappingURL=index.module.css.js.map

package/modern/components/status-control/extension-icon/index.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.module.css.js","sources":["../../../src/components/status-control/extension-icon/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n@import '@alfalab/core-components-vars/src/colors-decorative.css';\n\n.iconPDFColored {\n    fill: var(--color-light-decorative-red);\n}\n\n.iconDOCColored {\n    fill: var(--color-light-decorative-blue);\n}\n\n.iconExcelColored {\n    fill: var(--color-light-decorative-green);\n}\n\n.icon1CColored {\n    fill: var(--color-light-decorative-orange);\n}\n\n.iconDocumentColored {\n    fill: var(--color-light-neutral-translucent-1300);\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,gBAAgB,CAAC,wCAAwC,CAAC,gBAAgB,CAAC,wCAAwC,CAAC,kBAAkB,CAAC,0CAA0C,CAAC,eAAe,CAAC,uCAAuC,CAAC,qBAAqB,CAAC,6CAA6C,CAAC;;;;"}

package/modern/components/status-control/index.css

@@ -0,0 +1,25 @@
+:root {
+    --color-light-status-negative: #ff4837;
+    --color-light-status-positive: #0cc44d;
+} :root {
+    --gap-2xs-neg: -4px;
+    --gap-4-neg: var(--gap-2xs-neg);
+} .file-upload-item__container_1duff {
+    position: relative
+} .file-upload-item__container_1duff.file-upload-item__clickable_1duff {
+        cursor: pointer;
+    } .file-upload-item__container_1duff .file-upload-item__progress_1duff {
+        position: absolute;
+        top: var(--gap-4-neg);
+        left: var(--gap-4-neg);
+        z-index: 1;
+        will-change: opacity
+    } .file-upload-item__container_1duff .file-upload-item__progress_1duff.file-upload-item__success_1duff,
+        .file-upload-item__container_1duff .file-upload-item__progress_1duff.file-upload-item__error_1duff {
+            transition: opacity 400ms ease-in;
+            opacity: 0;
+        } .file-upload-item__container_1duff .file-upload-item__progress_1duff.file-upload-item__success_1duff path {
+                stroke: var(--color-light-status-positive);
+            } .file-upload-item__container_1duff .file-upload-item__progress_1duff.file-upload-item__error_1duff path {
+                stroke: var(--color-light-status-negative);
+            }

package/modern/components/status-control/index.d.ts

@@ -1 +1,2 @@
-export { StatusControl } from './status-control';
+import React from 'react';
+export declare const StatusControl: () => React.JSX.Element;

package/modern/components/status-control/index.js

@@ -1,2 +1,27 @@
-export { StatusControl } from './status-control.js';
+import React, { useContext } from 'react';
+import cn from 'classnames';
+import { SuperEllipse } from '@alfalab/core-components-icon-view/modern/super-ellipse';
+import { FileUploadItemContext } from '../../context/file-upload-item-context.js';
+import { isErrorStatus, isSuccessStatus } from '../../utils.js';
+import { ExtensionIcon } from './extension-icon/index.js';
+import { ProgressBar } from './progress-bar/index.js';
+import styles from './index.module.css.js';
+
+const StatusControl = () => {
+    const { uploadStatus = 'INITIAL', progressBar = 0, imageUrl, actionsPresent, isClickable, } = useContext(FileUploadItemContext);
+    const strokeDasharray = 182.5742645263672; // total length
+    const measureDashoffset = strokeDasharray * (1 - progressBar / 100);
+    const strokeDashoffset = Math.max(measureDashoffset, 0);
+    return (React.createElement("div", { className: cn(styles.container, {
+            [styles.clickable]: !actionsPresent && isClickable,
+        }) },
+        React.createElement(SuperEllipse, { size: 48, ...(imageUrl && { imageUrl }) },
+            React.createElement(ExtensionIcon, null)),
+        React.createElement(ProgressBar, { className: cn(styles.progress, {
+                [styles.success]: isSuccessStatus(uploadStatus),
+                [styles.error]: isErrorStatus(uploadStatus),
+            }), strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset })));
+};
+
+export { StatusControl };
 //# sourceMappingURL=index.js.map

package/modern/components/status-control/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"index.js","sources":["../../../src/components/status-control/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { SuperEllipse } from '@alfalab/core-components-icon-view/super-ellipse';\n\nimport { FileUploadItemContext } from '../../context/file-upload-item-context';\nimport { isErrorStatus, isSuccessStatus } from '../../utils';\n\nimport { ExtensionIcon } from './extension-icon';\nimport { ProgressBar } from './progress-bar';\n\nimport styles from './index.module.css';\n\nexport const StatusControl = () => {\n    const {\n        uploadStatus = 'INITIAL',\n        progressBar = 0,\n        imageUrl,\n        actionsPresent,\n        isClickable,\n    } = useContext(FileUploadItemContext);\n\n    const strokeDasharray = 182.5742645263672; // total length\n    const measureDashoffset = strokeDasharray * (1 - progressBar / 100);\n    const strokeDashoffset = Math.max(measureDashoffset, 0);\n\n    return (\n        <div\n            className={cn(styles.container, {\n                [styles.clickable]: !actionsPresent && isClickable,\n            })}\n        >\n            <SuperEllipse size={48} {...(imageUrl && { imageUrl })}>\n                <ExtensionIcon />\n            </SuperEllipse>\n            <ProgressBar\n                className={cn(styles.progress, {\n                    [styles.success]: isSuccessStatus(uploadStatus),\n                    [styles.error]: isErrorStatus(uploadStatus),\n                })}\n                strokeDasharray={strokeDasharray}\n                strokeDashoffset={strokeDashoffset}\n            />\n        </div>\n    );\n};\n"],"names":[],"mappings":";;;;;;;;;AAaO,MAAM,aAAa,GAAG,MAAK;IAC9B,MAAM,EACF,YAAY,GAAG,SAAS,EACxB,WAAW,GAAG,CAAC,EACf,QAAQ,EACR,cAAc,EACd,WAAW,GACd,GAAG,UAAU,CAAC,qBAAqB,CAAC;AAErC,IAAA,MAAM,eAAe,GAAG,iBAAiB,CAAC;IAC1C,MAAM,iBAAiB,GAAG,eAAe,IAAI,CAAC,GAAG,WAAW,GAAG,GAAG,CAAC;IACnE,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC,CAAC;IAEvD,QACI,6BACI,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE;YAC5B,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,cAAc,IAAI,WAAW;SACrD,CAAC,EAAA;AAEF,QAAA,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,IAAI,EAAE,EAAE,EAAA,IAAO,QAAQ,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAA;YAClD,KAAC,CAAA,aAAA,CAAA,aAAa,OAAG,CACN;QACf,KAAC,CAAA,aAAA,CAAA,WAAW,IACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE;gBAC3B,CAAC,MAAM,CAAC,OAAO,GAAG,eAAe,CAAC,YAAY,CAAC;gBAC/C,CAAC,MAAM,CAAC,KAAK,GAAG,aAAa,CAAC,YAAY,CAAC;aAC9C,CAAC,EACF,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAAA,CACpC,CACA;AAEd;;;;"}

package/modern/components/status-control/index.module.css.js

@@ -0,0 +1,6 @@
+import './index.css';
+
+const styles = {"container":"file-upload-item__container_1duff","clickable":"file-upload-item__clickable_1duff","progress":"file-upload-item__progress_1duff","success":"file-upload-item__success_1duff","error":"file-upload-item__error_1duff"};
+
+export { styles as default };
+//# sourceMappingURL=index.module.css.js.map

package/modern/components/status-control/index.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.module.css.js","sources":["../../src/components/status-control/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/index.css';\n\n.container {\n    position: relative;\n\n    &.clickable {\n        cursor: pointer;\n    }\n\n    & .progress {\n        position: absolute;\n        top: var(--gap-4-neg);\n        left: var(--gap-4-neg);\n        z-index: 1;\n        will-change: opacity;\n\n        &.success,\n        &.error {\n            transition: opacity 400ms ease-in;\n            opacity: 0;\n        }\n\n        &.success {\n            & path {\n                stroke: var(--color-light-status-positive);\n            }\n        }\n\n        &.error {\n            & path {\n                stroke: var(--color-light-status-negative);\n            }\n        }\n    }\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,mCAAmC,CAAC,WAAW,CAAC,mCAAmC,CAAC,UAAU,CAAC,kCAAkC,CAAC,SAAS,CAAC,iCAAiC,CAAC,OAAO,CAAC,+BAA+B,CAAC;;;;"}

package/modern/components/status-control/progress-bar/index.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+declare type Props = {
+    className: string;
+    strokeDasharray: number;
+    strokeDashoffset: number;
+};
+export declare const ProgressBar: FC<Props>;
+export {};

package/modern/components/status-control/progress-bar/index.js

@@ -0,0 +1,10 @@
+import React from 'react';
+
+const ProgressBar = (props) => {
+    const { className, strokeDasharray, strokeDashoffset } = props;
+    return (React.createElement("svg", { className: className, width: '56', height: '56', viewBox: '0 0 56 56', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' },
+        React.createElement("path", { d: 'M28 1C32.7738 1 36.7752 1.34174 40.0029 1.80371C47.4798 2.87385 53.1262 8.52019 54.1963 15.9971C54.6583 19.2248 55 23.2262 55 28C55 32.7738 54.6583 36.7752 54.1963 40.0029C53.1262 47.4798 47.4798 53.1262 40.0029 54.1963C36.7752 54.6583 32.7738 55 28 55C23.2262 55 19.2248 54.6583 15.9971 54.1963C8.5202 53.1262 2.87385 47.4798 1.80371 40.0029C1.34175 36.7752 1 32.7738 1 28C1 23.2262 1.34174 19.2248 1.80371 15.9971C2.87385 8.5202 8.5202 2.87385 15.9971 1.80371C19.2248 1.34174 23.2262 1 28 1Z', stroke: '#babbc2', strokeWidth: '2', strokeDasharray: strokeDasharray, strokeDashoffset: strokeDashoffset })));
+};
+
+export { ProgressBar };
+//# sourceMappingURL=index.js.map

package/modern/components/status-control/progress-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/status-control/progress-bar/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\ntype Props = {\n    className: string;\n    strokeDasharray: number;\n    strokeDashoffset: number;\n};\n\nexport const ProgressBar: FC<Props> = (props) => {\n    const { className, strokeDasharray, strokeDashoffset } = props;\n\n    return (\n        <svg\n            className={className}\n            width='56'\n            height='56'\n            viewBox='0 0 56 56'\n            fill='none'\n            xmlns='http://www.w3.org/2000/svg'\n        >\n            <path\n                d='M28 1C32.7738 1 36.7752 1.34174 40.0029 1.80371C47.4798 2.87385 53.1262 8.52019 54.1963 15.9971C54.6583 19.2248 55 23.2262 55 28C55 32.7738 54.6583 36.7752 54.1963 40.0029C53.1262 47.4798 47.4798 53.1262 40.0029 54.1963C36.7752 54.6583 32.7738 55 28 55C23.2262 55 19.2248 54.6583 15.9971 54.1963C8.5202 53.1262 2.87385 47.4798 1.80371 40.0029C1.34175 36.7752 1 32.7738 1 28C1 23.2262 1.34174 19.2248 1.80371 15.9971C2.87385 8.5202 8.5202 2.87385 15.9971 1.80371C19.2248 1.34174 23.2262 1 28 1Z'\n                stroke='#babbc2'\n                strokeWidth='2'\n                strokeDasharray={strokeDasharray}\n                strokeDashoffset={strokeDashoffset}\n            />\n        </svg>\n    );\n};\n"],"names":[],"mappings":";;AAQa,MAAA,WAAW,GAAc,CAAC,KAAK,KAAI;IAC5C,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,gBAAgB,EAAE,GAAG,KAAK;IAE9D,QACI,KACI,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,EAAA;QAElC,KACI,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,+eAA+e,EACjf,MAAM,EAAC,SAAS,EAChB,WAAW,EAAC,GAAG,EACf,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAAA,CACpC,CACA;AAEd;;;;"}

package/modern/const/progress-bar.d.ts

@@ -1,2 +1 @@
 export declare const MAX_PROGRESS_BAR_VALUE = 100;
-export declare const RADIUS = 360;

package/modern/const/progress-bar.js

@@ -1,5 +1,4 @@
 const MAX_PROGRESS_BAR_VALUE = 100;
-const RADIUS = 360;
 
-export { MAX_PROGRESS_BAR_VALUE, RADIUS };
+export { MAX_PROGRESS_BAR_VALUE };
 //# sourceMappingURL=progress-bar.js.map

package/modern/const/progress-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar.js","sources":["../../src/const/progress-bar.ts"],"sourcesContent":["export const MAX_PROGRESS_BAR_VALUE = 100;\nexport const RADIUS = 360;\n"],"names":[],"mappings":"AAAO,MAAM,sBAAsB,GAAG;AAC/B,MAAM,MAAM,GAAG;;;;"}
+{"version":3,"file":"progress-bar.js","sources":["../../src/const/progress-bar.ts"],"sourcesContent":["export const MAX_PROGRESS_BAR_VALUE = 100;\n"],"names":[],"mappings":"AAAO,MAAM,sBAAsB,GAAG;;;;"}

package/modern/index.css

@@ -3,13 +3,13 @@
     --gap-s: 12px;
     --gap-2: var(--gap-3xs);
     --gap-12: var(--gap-s);
-} .file-upload-item__component_g62kk {
+} .file-upload-item__component_1abzh {
     box-sizing: border-box;
     display: flex;
     align-items: flex-start;
     width: 100%;
     min-height: 48px;
-} .file-upload-item__restore_g62kk {
+} .file-upload-item__restore_1abzh {
     margin-left: var(--gap-12);
     margin-top: var(--gap-2);
 }

package/modern/index.module.css.js

@@ -1,6 +1,6 @@
 import './index.css';
 
-const styles = {"component":"file-upload-item__component_g62kk","restore":"file-upload-item__restore_g62kk"};
+const styles = {"component":"file-upload-item__component_1abzh","restore":"file-upload-item__restore_1abzh"};
 
 export { styles as default };
 //# sourceMappingURL=index.module.css.js.map

package/modern/utils.d.ts

@@ -1,5 +1,4 @@
 import { type FileUploadItemStatus } from './types/status';
-export declare function humanFileSize(size: string | number): string;
 export declare const getExtension: (filename: string) => string | undefined;
 export declare const isInitialStatus: (status?: FileUploadItemStatus) => boolean;
 export declare const isSuccessStatus: (status?: FileUploadItemStatus) => boolean;

package/modern/utils.js

@@ -1,14 +1,3 @@
-function humanFileSize(size) {
-    const units = ['Б', 'КБ', 'МБ', 'ГБ'];
-    let humanSize = Number(size);
-    let factor = 0;
-    while (humanSize >= 1024 && factor < units.length - 1) {
-        humanSize /= 1024;
-        factor += 1;
-    }
-    humanSize = humanSize.toFixed(2);
-    return `${Number(humanSize)} ${units[factor]}`;
-}
 const getExtension = (filename) => filename.toLowerCase().split('.').pop();
 const isInitialStatus = (status) => status === 'INITIAL';
 const isSuccessStatus = (status) => status === 'SUCCESS';
@@ -16,5 +5,5 @@ const isErrorStatus = (status) => status === 'ERROR';
 const isUploadingStatus = (status) => status === 'UPLOADING';
 const isUploadedStatus = (status) => status === 'UPLOADED';
 
-export { getExtension, humanFileSize, isErrorStatus, isInitialStatus, isSuccessStatus, isUploadedStatus, isUploadingStatus };
+export { getExtension, isErrorStatus, isInitialStatus, isSuccessStatus, isUploadedStatus, isUploadingStatus };
 //# sourceMappingURL=utils.js.map

package/modern/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type FileUploadItemStatus } from './types/status';\n\nexport function humanFileSize(size: string | number) {\n    const units = ['Б', 'КБ', 'МБ', 'ГБ'];\n\n    let humanSize: string | number = Number(size);\n    let factor = 0;\n\n    while (humanSize >= 1024 && factor < units.length - 1) {\n        humanSize /= 1024;\n        factor += 1;\n    }\n\n    humanSize = humanSize.toFixed(2);\n\n    return `${Number(humanSize)} ${units[factor]}`;\n}\n\nexport const getExtension = (filename: string) => filename.toLowerCase().split('.').pop();\n\nexport const isInitialStatus = (status?: FileUploadItemStatus) => status === 'INITIAL';\nexport const isSuccessStatus = (status?: FileUploadItemStatus) => status === 'SUCCESS';\nexport const isErrorStatus = (status?: FileUploadItemStatus) => status === 'ERROR';\nexport const isUploadingStatus = (status?: FileUploadItemStatus) => status === 'UPLOADING';\nexport const isUploadedStatus = (status?: FileUploadItemStatus) => status === 'UPLOADED';\n"],"names":[],"mappings":"AAEM,SAAU,aAAa,CAAC,IAAqB,EAAA;IAC/C,MAAM,KAAK,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;AAErC,IAAA,IAAI,SAAS,GAAoB,MAAM,CAAC,IAAI,CAAC;IAC7C,IAAI,MAAM,GAAG,CAAC;IAEd,OAAO,SAAS,IAAI,IAAI,IAAI,MAAM,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;QACnD,SAAS,IAAI,IAAI;QACjB,MAAM,IAAI,CAAC;AACd;AAED,IAAA,SAAS,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;IAEhC,OAAO,CAAA,EAAG,MAAM,CAAC,SAAS,CAAC,CAAI,CAAA,EAAA,KAAK,CAAC,MAAM,CAAC,CAAA,CAAE;AAClD;MAEa,YAAY,GAAG,CAAC,QAAgB,KAAK,QAAQ,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG;AAEhF,MAAM,eAAe,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACtE,MAAM,eAAe,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACtE,MAAM,aAAa,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACpE,MAAM,iBAAiB,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACxE,MAAM,gBAAgB,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;;;;"}
+{"version":3,"file":"utils.js","sources":["../src/utils.ts"],"sourcesContent":["import { type FileUploadItemStatus } from './types/status';\n\nexport const getExtension = (filename: string) => filename.toLowerCase().split('.').pop();\n\nexport const isInitialStatus = (status?: FileUploadItemStatus) => status === 'INITIAL';\nexport const isSuccessStatus = (status?: FileUploadItemStatus) => status === 'SUCCESS';\nexport const isErrorStatus = (status?: FileUploadItemStatus) => status === 'ERROR';\nexport const isUploadingStatus = (status?: FileUploadItemStatus) => status === 'UPLOADING';\nexport const isUploadedStatus = (status?: FileUploadItemStatus) => status === 'UPLOADED';\n"],"names":[],"mappings":"MAEa,YAAY,GAAG,CAAC,QAAgB,KAAK,QAAQ,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG;AAEhF,MAAM,eAAe,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACtE,MAAM,eAAe,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACtE,MAAM,aAAa,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACpE,MAAM,iBAAiB,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;AACxE,MAAM,gBAAgB,GAAG,CAAC,MAA6B,KAAK,MAAM,KAAK;;;;"}

package/moderncssm/Component.js

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import cn from 'classnames';
 import { Actions } from './components/actions-control/actions.js';
 import { Content } from './components/content/content.js';
-import { StatusControl } from './components/status-control/status-control.js';
+import { StatusControl } from './components/status-control/index.js';
 import { FileUploadItemContext } from './context/file-upload-item-context.js';
 import styles from './index.module.css';