@megafon/ui-core 8.12.1 → 8.13.1

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 (24) hide show
  1. package/dist/es/components/Accordion/Accordion.d.ts +3 -1
  2. package/dist/es/components/Accordion/Accordion.js +2 -0
  3. package/dist/es/components/Carousel/Carousel.css +1 -1
  4. package/dist/es/components/Pagination/Pagination.css +1 -1
  5. package/dist/es/components/UploadForm/UploadField/UploadField.d.ts +1 -1
  6. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.css +1 -1
  7. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.d.ts +1 -1
  8. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.js +21 -3
  9. package/dist/es/components/UploadForm/UploadFileItem/UploadFileItem.css +1 -1
  10. package/dist/es/components/UploadForm/UploadFileItem/UploadFileItem.d.ts +3 -1
  11. package/dist/es/components/UploadForm/UploadFileItem/UploadFileItem.js +6 -2
  12. package/dist/lib/components/Accordion/Accordion.d.ts +3 -1
  13. package/dist/lib/components/Accordion/Accordion.js +2 -0
  14. package/dist/lib/components/Carousel/Carousel.css +1 -1
  15. package/dist/lib/components/Pagination/Pagination.css +1 -1
  16. package/dist/lib/components/UploadForm/UploadField/UploadField.d.ts +1 -1
  17. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.css +1 -1
  18. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.d.ts +1 -1
  19. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.js +21 -3
  20. package/dist/lib/components/UploadForm/UploadFileItem/UploadFileItem.css +1 -1
  21. package/dist/lib/components/UploadForm/UploadFileItem/UploadFileItem.d.ts +3 -1
  22. package/dist/lib/components/UploadForm/UploadFileItem/UploadFileItem.js +6 -2
  23. package/package.json +2 -2
  24. package/styles/colors.css +15 -1
@@ -6,8 +6,10 @@ export interface IAccordionProps {
6
6
  rootRef?: React.Ref<HTMLDivElement>;
7
7
  /** Заголовок */
8
8
  title: string | React.ReactNode | React.ReactNode[];
9
- /** Заголовок */
9
+ /** Тег заголовка (определяет базовый тег и стили) */
10
10
  titleTag?: IHeaderProps['as'];
11
+ /** Тег заголовка для семантической разметки (переопределение тега без изменения стилей) */
12
+ titleTagName?: IHeaderProps['tag'];
11
13
  /** Состояние открытости */
12
14
  isOpened?: boolean;
13
15
  /** Включить микроразметку */
@@ -20,6 +20,7 @@ var Accordion = function Accordion(_ref) {
20
20
  title = _ref.title,
21
21
  _ref$titleTag = _ref.titleTag,
22
22
  titleTag = _ref$titleTag === void 0 ? 'h5' : _ref$titleTag,
23
+ titleTagName = _ref.titleTagName,
23
24
  _ref$isOpened = _ref.isOpened,
24
25
  isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
25
26
  _ref$hasMicrodata = _ref.hasMicrodata,
@@ -81,6 +82,7 @@ var Accordion = function Accordion(_ref) {
81
82
  itemProp: 'name'
82
83
  }), /*#__PURE__*/React.createElement(Header, {
83
84
  as: titleTag,
85
+ tag: titleTagName,
84
86
  dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header,
85
87
  className: titlePropsClasses
86
88
  }, title), /*#__PURE__*/React.createElement("div", {
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-carousel,.mfui-carousel__swiper{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.mfui-carousel__swiper{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-20px 0 -25px;overflow:hidden;padding:20px 0 25px}@media screen and (min-width:1024px){.mfui-carousel__swiper{margin-left:-20px!important;margin-right:-20px!important;padding-left:20px!important;padding-right:20px!important}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-carousel__swiper_default-inner-indents{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px}}@media screen and (max-width:767px){.mfui-carousel__swiper_default-inner-indents{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:32px}}.mfui-carousel__swiper_gradient:after,.mfui-carousel__swiper_gradient:before{bottom:0;content:"";position:absolute;top:0;width:var(--gap);z-index:5}.mfui-carousel__swiper_gradient:before{background:-webkit-gradient(linear,right top,left top,from(transparent),to(var(--gradientColor)));background:linear-gradient(270deg,transparent 0,var(--gradientColor) 100%);left:0}.mfui-carousel__swiper_gradient:after{background:-webkit-gradient(linear,right top,left top,from(var(--gradientColor)),to(transparent));background:linear-gradient(270deg,var(--gradientColor) 0,transparent 100%);right:0}.mfui-carousel__swiper_gradient-color_default{--gradientColor:var(--background)}.mfui-carousel__swiper_gradient-color_green{--gradientColor:var(--brandGreen)}.mfui-carousel__swiper_gradient-color_black{--gradientColor:var(--stcBlack)}.mfui-carousel__swiper_gradient-color_spbSky0{--gradientColor:var(--spbSky0)}.mfui-carousel__swiper_gradient-color_spbSky1{--gradientColor:var(--spbSky1)}.mfui-carousel__swiper_gradient-color_spbSky2{--gradientColor:var(--spbSky2)}.mfui-carousel .swiper-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;z-index:1}.mfui-carousel__slide{-ms-flex-negative:0;flex-shrink:0}@media screen and (min-width:1024px){.mfui-carousel__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;-webkit-transition:opacity .2s;transition:opacity .2s}.mfui-carousel .swiper-slide-visible{opacity:1;-webkit-transition:opacity .4s;transition:opacity .4s}}.mfui-carousel__arrow{position:absolute;top:50%;-webkit-transform:translateY(calc(-50% - 20px));transform:translateY(calc(-50% - 20px));z-index:6}@media screen and (max-width:1023px){.mfui-carousel__arrow{display:none}}.mfui-carousel__arrow_prev{right:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_prev{right:calc(100% + 20px)}}.mfui-carousel__arrow_next{left:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_next{left:calc(100% + 20px)}}.mfui-carousel__arrow_locked{display:none}.mfui-carousel .swiper-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;justify-self:center;-webkit-box-ordinal-group:3;-ms-flex-order:2;border-radius:12px;order:2;padding-top:32px;width:100%}.mfui-carousel .swiper-pagination.swiper-pagination-lock{display:none}.mfui-carousel .swiper-pagination-bullet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:8px;justify-content:center;-webkit-transition:width .5s,background-color .3s;transition:width .5s,background-color .3s;width:8px}.mfui-carousel .swiper-pagination-bullet:before{border-radius:50%;content:"";display:block;height:100%;-webkit-transition:border-radius .5s;transition:border-radius .5s;width:100%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet:before{background-color:var(--stcWhite50)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet:before{background-color:var(--spbSky2)}.mfui-carousel .swiper-pagination-bullet-active{cursor:default;width:20px}.mfui-carousel .swiper-pagination-bullet-active:before{border-radius:4px}.mfui-carousel_nav-theme_green .swiper-pagination-bullet-active:before{background-color:var(--base)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet-active:before{background-color:var(--brandGreen)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-carousel,.mfui-carousel__swiper{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.mfui-carousel__swiper{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-20px 0 -25px;overflow:hidden;padding:20px 0 25px}@media screen and (min-width:1024px){.mfui-carousel__swiper{margin-left:-20px!important;margin-right:-20px!important;padding-left:20px!important;padding-right:20px!important}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-carousel__swiper_default-inner-indents{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px}}@media screen and (max-width:767px){.mfui-carousel__swiper_default-inner-indents{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:32px}}.mfui-carousel__swiper_gradient:after,.mfui-carousel__swiper_gradient:before{bottom:0;content:"";position:absolute;top:0;width:var(--gap);z-index:5}.mfui-carousel__swiper_gradient:before{background:-webkit-gradient(linear,right top,left top,from(rgba(var(--gradientColorRGB),0)),to(var(--gradientColor)));background:linear-gradient(270deg,rgba(var(--gradientColorRGB),0) 0,var(--gradientColor) 100%);left:0}.mfui-carousel__swiper_gradient:after{background:-webkit-gradient(linear,right top,left top,from(var(--gradientColor)),to(rgba(var(--gradientColorRGB),0)));background:linear-gradient(270deg,var(--gradientColor) 0,rgba(var(--gradientColorRGB),0) 100%);right:0}.mfui-carousel__swiper_gradient-color_default{--gradientColor:var(--background);--gradientColorRGB:var(--background-rgb)}.mfui-carousel__swiper_gradient-color_green{--gradientColor:var(--brandGreen);--gradientColorRGB:var(--brandGreen-rgb)}.mfui-carousel__swiper_gradient-color_black{--gradientColor:var(--stcBlack);--gradientColorRGB:var(--stcBlack-rgb)}.mfui-carousel__swiper_gradient-color_spbSky0{--gradientColor:var(--spbSky0);--gradientColorRGB:var(--spbSky0-rgb)}.mfui-carousel__swiper_gradient-color_spbSky1{--gradientColor:var(--spbSky1);--gradientColorRGB:var(--spbSky1-rgb)}.mfui-carousel__swiper_gradient-color_spbSky2{--gradientColor:var(--spbSky2);--gradientColorRGB:var(--spbSky2-rgb)}.mfui-carousel .swiper-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;z-index:1}.mfui-carousel__slide{-ms-flex-negative:0;flex-shrink:0}@media screen and (min-width:1024px){.mfui-carousel__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;-webkit-transition:opacity .2s;transition:opacity .2s}.mfui-carousel .swiper-slide-visible{opacity:1;-webkit-transition:opacity .4s;transition:opacity .4s}}.mfui-carousel__arrow{position:absolute;top:50%;-webkit-transform:translateY(calc(-50% - 20px));transform:translateY(calc(-50% - 20px));z-index:6}@media screen and (max-width:1023px){.mfui-carousel__arrow{display:none}}.mfui-carousel__arrow_prev{right:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_prev{right:calc(100% + 20px)}}.mfui-carousel__arrow_next{left:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_next{left:calc(100% + 20px)}}.mfui-carousel__arrow_locked{display:none}.mfui-carousel .swiper-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;justify-self:center;-webkit-box-ordinal-group:3;-ms-flex-order:2;border-radius:12px;order:2;padding-top:32px;width:100%}.mfui-carousel .swiper-pagination.swiper-pagination-lock{display:none}.mfui-carousel .swiper-pagination-bullet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:8px;justify-content:center;-webkit-transition:all .5s,background-color .3s;transition:all .5s,background-color .3s;width:8px}.mfui-carousel .swiper-pagination-bullet:before{border-radius:50%;content:"";display:block;height:100%;-webkit-transition:border-radius .5s;transition:border-radius .5s;width:100%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet:before{background-color:var(--stcWhite50)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet:before{background-color:var(--spbSky2)}.mfui-carousel .swiper-pagination-bullet-active{cursor:default;-webkit-transform:scaleX(2.3);transform:scaleX(2.3)}.mfui-carousel .swiper-pagination-bullet-active:before{border-radius:40%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet-active:before{background-color:var(--base)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet-active:before{background-color:var(--brandGreen)}
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:767px){.mfui-pagination{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px}}.mfui-pagination__input,.mfui-pagination__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-pagination__input{gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-pagination__input-caption{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}.mfui-pagination__input-field{width:90px}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:12px;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:767px){.mfui-pagination{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px}}.mfui-pagination__input,.mfui-pagination__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-pagination__input{gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-pagination__input-caption{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}.mfui-pagination__input-field{width:90px}
@@ -10,7 +10,7 @@ export interface IUploadDropField {
10
10
  /** Действие при выборе файла */
11
11
  onChange: (files: File[]) => void;
12
12
  /** Дополнительная информация */
13
- description?: string;
13
+ description?: string | string[];
14
14
  /** Список допустимых типов файлов для внутреннего input */
15
15
  accept?: string;
16
16
  /** Дополнительные data атрибуты к внутренним элементам */
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:12px;padding:12px 32px 20px;width:100%}.mfui-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-upload-field-drop-area__content{text-align:center}.mfui-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;text-align:center}.mfui-upload-field-drop-area__select-button:focus,.mfui-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-upload-field-drop-area__mark{color:var(--fury)}.mfui-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-upload-field-drop-area_dragging *{pointer-events:none}.mfui-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__mark{color:var(--spbSky3)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:12px;padding:12px 32px 20px;width:100%}.mfui-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-upload-field-drop-area__content{text-align:center}.mfui-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;list-style:none;margin:0;padding:0;text-align:center}.mfui-upload-field-drop-area__description-item{margin:0;padding:0}.mfui-upload-field-drop-area__select-button:focus,.mfui-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-upload-field-drop-area__mark{color:var(--fury)}.mfui-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-upload-field-drop-area_dragging *{pointer-events:none}.mfui-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__mark{color:var(--spbSky3)}
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import './UploadFieldDropArea.scss';
3
3
  export interface IUploadFieldDropArea {
4
4
  /** Дополнительная информация */
5
- description?: string;
5
+ description?: string | string[];
6
6
  /** Обязательность поля */
7
7
  required: boolean;
8
8
  /** Заблокированное состояние */
@@ -1,6 +1,8 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import "core-js/modules/es.symbol.js";
3
3
  import "core-js/modules/es.symbol.description.js";
4
+ import "core-js/modules/es.array.is-array.js";
5
+ import "core-js/modules/es.array.map.js";
4
6
  import * as React from 'react';
5
7
  import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
6
8
  import useDragAndDrop from "../useDragAndDrop";
@@ -25,6 +27,24 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
25
27
  current: null
26
28
  };
27
29
  var isDragging = useDragAndDrop(currentDropAreaRef, onDrop);
30
+ var renderDescription = function renderDescription() {
31
+ if (!description) {
32
+ return null;
33
+ }
34
+ if (Array.isArray(description)) {
35
+ return /*#__PURE__*/React.createElement("ul", {
36
+ className: cn('description')
37
+ }, description.map(function (item, index) {
38
+ return /*#__PURE__*/React.createElement("li", {
39
+ key: index,
40
+ className: cn('description-item')
41
+ }, item);
42
+ }));
43
+ }
44
+ return /*#__PURE__*/React.createElement("div", {
45
+ className: cn('description')
46
+ }, description);
47
+ };
28
48
  return /*#__PURE__*/React.createElement("div", _extends({
29
49
  className: cn({
30
50
  disabled: disabled,
@@ -43,8 +63,6 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
43
63
  onClick: !disabled ? onSelectButtonClick : undefined
44
64
  }), "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0430\u0439\u043B\u044B"), /*#__PURE__*/React.createElement("span", null, "\u0438\u043B\u0438 \u043F\u0435\u0440\u0435\u043C\u0435\u0441\u0442\u0438\u0442\u0435 \u0438\u0445 \u0441\u044E\u0434\u0430", required && /*#__PURE__*/React.createElement("span", {
45
65
  className: cn('mark')
46
- }, "*"))), !!description && /*#__PURE__*/React.createElement("div", {
47
- className: cn('description')
48
- }, description));
66
+ }, "*"))), renderDescription());
49
67
  };
50
68
  export default UploadFieldDropArea;
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:12px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-upload-file-item__cancel-icon-box svg,.mfui-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-upload-file-item__icon{height:100%;width:100%}.mfui-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-upload-file-item__service-message{color:var(--content)}.mfui-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-upload-file-item_error{border-color:var(--fury20)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:12px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-upload-file-item__cancel-icon-box svg,.mfui-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-upload-file-item__icon{height:100%;width:100%}.mfui-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-upload-file-item__service-message{color:var(--content)}.mfui-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-upload-file-item_error{border-color:var(--fury20)}.mfui-upload-file-item_disabled{background-color:var(--spbSky0);border-color:var(--spbSky0);color:var(--spbSky3);pointer-events:none}.mfui-upload-file-item_disabled .mfui-upload-file-item__progress-bar-fill{background-color:var(--spbSky2)}.mfui-upload-file-item_disabled .mfui-upload-file-item__error-message,.mfui-upload-file-item_disabled .mfui-upload-file-item__service-message{color:var(--spbSky3)}.mfui-upload-file-item_disabled .mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item_disabled .mfui-upload-file-item__download-icon-box,.mfui-upload-file-item_disabled .mfui-upload-file-item__file-icon-box{opacity:.4}
@@ -14,13 +14,15 @@ export interface IUploadFileItem {
14
14
  /** Сообщение об ошибке */
15
15
  errorText?: string;
16
16
  /** Проверка файла */
17
- isChecking?: string;
17
+ isChecking?: boolean;
18
18
  /** Ссылка на файл. Если параметр задан, то появляется кнопка скачивания */
19
19
  downloadLink?: string;
20
20
  /** Рекомендует браузеру скачивать контент по ссылке. Может быть передано рекомендуемое название скачиваемого файла. */
21
21
  download?: boolean | string;
22
22
  /** Указывает, где открыть скачиваемый документ */
23
23
  target?: React.HTMLAttributeAnchorTarget;
24
+ /** Заблокированное состояние */
25
+ disabled?: boolean;
24
26
  /** Обработчик скачивания файла */
25
27
  onDownload?: (e: React.SyntheticEvent<EventTarget>) => void;
26
28
  /** Обработчик удаления файла */
@@ -40,6 +40,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
40
40
  downloadLink = _ref.downloadLink,
41
41
  download = _ref.download,
42
42
  target = _ref.target,
43
+ _ref$disabled = _ref.disabled,
44
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
43
45
  onDownload = _ref.onDownload,
44
46
  onDelete = _ref.onDelete,
45
47
  dataAttrs = _ref.dataAttrs;
@@ -80,7 +82,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
80
82
  };
81
83
  return /*#__PURE__*/React.createElement("div", _extends({
82
84
  className: cn({
83
- error: isError
85
+ error: isError,
86
+ disabled: disabled
84
87
  }, [className])
85
88
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
86
89
  className: cn('file-icon-box')
@@ -113,7 +116,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
113
116
  type: "button",
114
117
  className: cn('cancel-icon-box')
115
118
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.deleteButton), {
116
- onClick: onDelete
119
+ onClick: onDelete,
120
+ disabled: disabled
117
121
  }), /*#__PURE__*/React.createElement(CancelIcon, {
118
122
  className: cn('icon')
119
123
  })));
@@ -6,8 +6,10 @@ export interface IAccordionProps {
6
6
  rootRef?: React.Ref<HTMLDivElement>;
7
7
  /** Заголовок */
8
8
  title: string | React.ReactNode | React.ReactNode[];
9
- /** Заголовок */
9
+ /** Тег заголовка (определяет базовый тег и стили) */
10
10
  titleTag?: IHeaderProps['as'];
11
+ /** Тег заголовка для семантической разметки (переопределение тега без изменения стилей) */
12
+ titleTagName?: IHeaderProps['tag'];
11
13
  /** Состояние открытости */
12
14
  isOpened?: boolean;
13
15
  /** Включить микроразметку */
@@ -29,6 +29,7 @@ var Accordion = function Accordion(_ref) {
29
29
  title = _ref.title,
30
30
  _ref$titleTag = _ref.titleTag,
31
31
  titleTag = _ref$titleTag === void 0 ? 'h5' : _ref$titleTag,
32
+ titleTagName = _ref.titleTagName,
32
33
  _ref$isOpened = _ref.isOpened,
33
34
  isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
34
35
  _ref$hasMicrodata = _ref.hasMicrodata,
@@ -90,6 +91,7 @@ var Accordion = function Accordion(_ref) {
90
91
  itemProp: 'name'
91
92
  }), /*#__PURE__*/React.createElement(_Header["default"], {
92
93
  as: titleTag,
94
+ tag: titleTagName,
93
95
  dataAttrs: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.header,
94
96
  className: titlePropsClasses
95
97
  }, title), /*#__PURE__*/React.createElement("div", {
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-carousel,.mfui-carousel__swiper{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.mfui-carousel__swiper{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-20px 0 -25px;overflow:hidden;padding:20px 0 25px}@media screen and (min-width:1024px){.mfui-carousel__swiper{margin-left:-20px!important;margin-right:-20px!important;padding-left:20px!important;padding-right:20px!important}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-carousel__swiper_default-inner-indents{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px}}@media screen and (max-width:767px){.mfui-carousel__swiper_default-inner-indents{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:32px}}.mfui-carousel__swiper_gradient:after,.mfui-carousel__swiper_gradient:before{bottom:0;content:"";position:absolute;top:0;width:var(--gap);z-index:5}.mfui-carousel__swiper_gradient:before{background:-webkit-gradient(linear,right top,left top,from(transparent),to(var(--gradientColor)));background:linear-gradient(270deg,transparent 0,var(--gradientColor) 100%);left:0}.mfui-carousel__swiper_gradient:after{background:-webkit-gradient(linear,right top,left top,from(var(--gradientColor)),to(transparent));background:linear-gradient(270deg,var(--gradientColor) 0,transparent 100%);right:0}.mfui-carousel__swiper_gradient-color_default{--gradientColor:var(--background)}.mfui-carousel__swiper_gradient-color_green{--gradientColor:var(--brandGreen)}.mfui-carousel__swiper_gradient-color_black{--gradientColor:var(--stcBlack)}.mfui-carousel__swiper_gradient-color_spbSky0{--gradientColor:var(--spbSky0)}.mfui-carousel__swiper_gradient-color_spbSky1{--gradientColor:var(--spbSky1)}.mfui-carousel__swiper_gradient-color_spbSky2{--gradientColor:var(--spbSky2)}.mfui-carousel .swiper-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;z-index:1}.mfui-carousel__slide{-ms-flex-negative:0;flex-shrink:0}@media screen and (min-width:1024px){.mfui-carousel__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;-webkit-transition:opacity .2s;transition:opacity .2s}.mfui-carousel .swiper-slide-visible{opacity:1;-webkit-transition:opacity .4s;transition:opacity .4s}}.mfui-carousel__arrow{position:absolute;top:50%;-webkit-transform:translateY(calc(-50% - 20px));transform:translateY(calc(-50% - 20px));z-index:6}@media screen and (max-width:1023px){.mfui-carousel__arrow{display:none}}.mfui-carousel__arrow_prev{right:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_prev{right:calc(100% + 20px)}}.mfui-carousel__arrow_next{left:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_next{left:calc(100% + 20px)}}.mfui-carousel__arrow_locked{display:none}.mfui-carousel .swiper-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;justify-self:center;-webkit-box-ordinal-group:3;-ms-flex-order:2;border-radius:12px;order:2;padding-top:32px;width:100%}.mfui-carousel .swiper-pagination.swiper-pagination-lock{display:none}.mfui-carousel .swiper-pagination-bullet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:8px;justify-content:center;-webkit-transition:width .5s,background-color .3s;transition:width .5s,background-color .3s;width:8px}.mfui-carousel .swiper-pagination-bullet:before{border-radius:50%;content:"";display:block;height:100%;-webkit-transition:border-radius .5s;transition:border-radius .5s;width:100%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet:before{background-color:var(--stcWhite50)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet:before{background-color:var(--spbSky2)}.mfui-carousel .swiper-pagination-bullet-active{cursor:default;width:20px}.mfui-carousel .swiper-pagination-bullet-active:before{border-radius:4px}.mfui-carousel_nav-theme_green .swiper-pagination-bullet-active:before{background-color:var(--base)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet-active:before{background-color:var(--brandGreen)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-carousel,.mfui-carousel__swiper{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative}.mfui-carousel__swiper{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:1;flex-shrink:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:-20px 0 -25px;overflow:hidden;padding:20px 0 25px}@media screen and (min-width:1024px){.mfui-carousel__swiper{margin-left:-20px!important;margin-right:-20px!important;padding-left:20px!important;padding-right:20px!important}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-carousel__swiper_default-inner-indents{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px}}@media screen and (max-width:767px){.mfui-carousel__swiper_default-inner-indents{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:32px}}.mfui-carousel__swiper_gradient:after,.mfui-carousel__swiper_gradient:before{bottom:0;content:"";position:absolute;top:0;width:var(--gap);z-index:5}.mfui-carousel__swiper_gradient:before{background:-webkit-gradient(linear,right top,left top,from(rgba(var(--gradientColorRGB),0)),to(var(--gradientColor)));background:linear-gradient(270deg,rgba(var(--gradientColorRGB),0) 0,var(--gradientColor) 100%);left:0}.mfui-carousel__swiper_gradient:after{background:-webkit-gradient(linear,right top,left top,from(var(--gradientColor)),to(rgba(var(--gradientColorRGB),0)));background:linear-gradient(270deg,var(--gradientColor) 0,rgba(var(--gradientColorRGB),0) 100%);right:0}.mfui-carousel__swiper_gradient-color_default{--gradientColor:var(--background);--gradientColorRGB:var(--background-rgb)}.mfui-carousel__swiper_gradient-color_green{--gradientColor:var(--brandGreen);--gradientColorRGB:var(--brandGreen-rgb)}.mfui-carousel__swiper_gradient-color_black{--gradientColor:var(--stcBlack);--gradientColorRGB:var(--stcBlack-rgb)}.mfui-carousel__swiper_gradient-color_spbSky0{--gradientColor:var(--spbSky0);--gradientColorRGB:var(--spbSky0-rgb)}.mfui-carousel__swiper_gradient-color_spbSky1{--gradientColor:var(--spbSky1);--gradientColorRGB:var(--spbSky1-rgb)}.mfui-carousel__swiper_gradient-color_spbSky2{--gradientColor:var(--spbSky2);--gradientColorRGB:var(--spbSky2-rgb)}.mfui-carousel .swiper-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;z-index:1}.mfui-carousel__slide{-ms-flex-negative:0;flex-shrink:0}@media screen and (min-width:1024px){.mfui-carousel__slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;-webkit-transition:opacity .2s;transition:opacity .2s}.mfui-carousel .swiper-slide-visible{opacity:1;-webkit-transition:opacity .4s;transition:opacity .4s}}.mfui-carousel__arrow{position:absolute;top:50%;-webkit-transform:translateY(calc(-50% - 20px));transform:translateY(calc(-50% - 20px));z-index:6}@media screen and (max-width:1023px){.mfui-carousel__arrow{display:none}}.mfui-carousel__arrow_prev{right:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_prev{right:calc(100% + 20px)}}.mfui-carousel__arrow_next{left:calc(100% + 12px)}@media screen and (min-width:1280px){.mfui-carousel__arrow_next{left:calc(100% + 20px)}}.mfui-carousel__arrow_locked{display:none}.mfui-carousel .swiper-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;justify-self:center;-webkit-box-ordinal-group:3;-ms-flex-order:2;border-radius:12px;order:2;padding-top:32px;width:100%}.mfui-carousel .swiper-pagination.swiper-pagination-lock{display:none}.mfui-carousel .swiper-pagination-bullet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;border-radius:50%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:8px;justify-content:center;-webkit-transition:all .5s,background-color .3s;transition:all .5s,background-color .3s;width:8px}.mfui-carousel .swiper-pagination-bullet:before{border-radius:50%;content:"";display:block;height:100%;-webkit-transition:border-radius .5s;transition:border-radius .5s;width:100%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet:before{background-color:var(--stcWhite50)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet:before{background-color:var(--spbSky2)}.mfui-carousel .swiper-pagination-bullet-active{cursor:default;-webkit-transform:scaleX(2.3);transform:scaleX(2.3)}.mfui-carousel .swiper-pagination-bullet-active:before{border-radius:40%}.mfui-carousel_nav-theme_green .swiper-pagination-bullet-active:before{background-color:var(--base)}.mfui-carousel_nav-theme_light .swiper-pagination-bullet-active:before{background-color:var(--brandGreen)}
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:12px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:767px){.mfui-pagination{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px}}.mfui-pagination__input,.mfui-pagination__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-pagination__input{gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-pagination__input-caption{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}.mfui-pagination__input-field{width:90px}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:12px;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:767px){.mfui-pagination{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:16px}}.mfui-pagination__input,.mfui-pagination__wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-pagination__input{gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-pagination__input-caption{min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}.mfui-pagination__input-field{width:90px}
@@ -10,7 +10,7 @@ export interface IUploadDropField {
10
10
  /** Действие при выборе файла */
11
11
  onChange: (files: File[]) => void;
12
12
  /** Дополнительная информация */
13
- description?: string;
13
+ description?: string | string[];
14
14
  /** Список допустимых типов файлов для внутреннего input */
15
15
  accept?: string;
16
16
  /** Дополнительные data атрибуты к внутренним элементам */
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:12px;padding:12px 32px 20px;width:100%}.mfui-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-upload-field-drop-area__content{text-align:center}.mfui-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;text-align:center}.mfui-upload-field-drop-area__select-button:focus,.mfui-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-upload-field-drop-area__mark{color:var(--fury)}.mfui-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-upload-field-drop-area_dragging *{pointer-events:none}.mfui-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__mark{color:var(--spbSky3)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:12px;padding:12px 32px 20px;width:100%}.mfui-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-upload-field-drop-area__content{text-align:center}.mfui-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;list-style:none;margin:0;padding:0;text-align:center}.mfui-upload-field-drop-area__description-item{margin:0;padding:0}.mfui-upload-field-drop-area__select-button:focus,.mfui-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-upload-field-drop-area__mark{color:var(--fury)}.mfui-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-upload-field-drop-area_dragging *{pointer-events:none}.mfui-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-upload-field-drop-area_disabled .mfui-upload-field-drop-area__mark{color:var(--spbSky3)}
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import './UploadFieldDropArea.scss';
3
3
  export interface IUploadFieldDropArea {
4
4
  /** Дополнительная информация */
5
- description?: string;
5
+ description?: string | string[];
6
6
  /** Обязательность поля */
7
7
  required: boolean;
8
8
  /** Заблокированное состояние */
@@ -8,6 +8,8 @@ exports["default"] = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  require("core-js/modules/es.symbol.js");
10
10
  require("core-js/modules/es.symbol.description.js");
11
+ require("core-js/modules/es.array.is-array.js");
12
+ require("core-js/modules/es.array.map.js");
11
13
  var React = _interopRequireWildcard(require("react"));
12
14
  var _uiHelpers = require("@megafon/ui-helpers");
13
15
  var _useDragAndDrop = _interopRequireDefault(require("../useDragAndDrop"));
@@ -34,6 +36,24 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
34
36
  current: null
35
37
  };
36
38
  var isDragging = (0, _useDragAndDrop["default"])(currentDropAreaRef, onDrop);
39
+ var renderDescription = function renderDescription() {
40
+ if (!description) {
41
+ return null;
42
+ }
43
+ if (Array.isArray(description)) {
44
+ return /*#__PURE__*/React.createElement("ul", {
45
+ className: cn('description')
46
+ }, description.map(function (item, index) {
47
+ return /*#__PURE__*/React.createElement("li", {
48
+ key: index,
49
+ className: cn('description-item')
50
+ }, item);
51
+ }));
52
+ }
53
+ return /*#__PURE__*/React.createElement("div", {
54
+ className: cn('description')
55
+ }, description);
56
+ };
37
57
  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
38
58
  className: cn({
39
59
  disabled: disabled,
@@ -52,8 +72,6 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
52
72
  onClick: !disabled ? onSelectButtonClick : undefined
53
73
  }), "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u0444\u0430\u0439\u043B\u044B"), /*#__PURE__*/React.createElement("span", null, "\u0438\u043B\u0438 \u043F\u0435\u0440\u0435\u043C\u0435\u0441\u0442\u0438\u0442\u0435 \u0438\u0445 \u0441\u044E\u0434\u0430", required && /*#__PURE__*/React.createElement("span", {
54
74
  className: cn('mark')
55
- }, "*"))), !!description && /*#__PURE__*/React.createElement("div", {
56
- className: cn('description')
57
- }, description));
75
+ }, "*"))), renderDescription());
58
76
  };
59
77
  var _default = exports["default"] = UploadFieldDropArea;
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:12px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-upload-file-item__cancel-icon-box svg,.mfui-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-upload-file-item__icon{height:100%;width:100%}.mfui-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-upload-file-item__service-message{color:var(--content)}.mfui-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-upload-file-item_error{border-color:var(--fury20)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:12px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-upload-file-item__cancel-icon-box svg,.mfui-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-upload-file-item__icon{height:100%;width:100%}.mfui-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-upload-file-item__service-message{color:var(--content)}.mfui-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-upload-file-item_error{border-color:var(--fury20)}.mfui-upload-file-item_disabled{background-color:var(--spbSky0);border-color:var(--spbSky0);color:var(--spbSky3);pointer-events:none}.mfui-upload-file-item_disabled .mfui-upload-file-item__progress-bar-fill{background-color:var(--spbSky2)}.mfui-upload-file-item_disabled .mfui-upload-file-item__error-message,.mfui-upload-file-item_disabled .mfui-upload-file-item__service-message{color:var(--spbSky3)}.mfui-upload-file-item_disabled .mfui-upload-file-item__cancel-icon-box,.mfui-upload-file-item_disabled .mfui-upload-file-item__download-icon-box,.mfui-upload-file-item_disabled .mfui-upload-file-item__file-icon-box{opacity:.4}
@@ -14,13 +14,15 @@ export interface IUploadFileItem {
14
14
  /** Сообщение об ошибке */
15
15
  errorText?: string;
16
16
  /** Проверка файла */
17
- isChecking?: string;
17
+ isChecking?: boolean;
18
18
  /** Ссылка на файл. Если параметр задан, то появляется кнопка скачивания */
19
19
  downloadLink?: string;
20
20
  /** Рекомендует браузеру скачивать контент по ссылке. Может быть передано рекомендуемое название скачиваемого файла. */
21
21
  download?: boolean | string;
22
22
  /** Указывает, где открыть скачиваемый документ */
23
23
  target?: React.HTMLAttributeAnchorTarget;
24
+ /** Заблокированное состояние */
25
+ disabled?: boolean;
24
26
  /** Обработчик скачивания файла */
25
27
  onDownload?: (e: React.SyntheticEvent<EventTarget>) => void;
26
28
  /** Обработчик удаления файла */
@@ -49,6 +49,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
49
49
  downloadLink = _ref.downloadLink,
50
50
  download = _ref.download,
51
51
  target = _ref.target,
52
+ _ref$disabled = _ref.disabled,
53
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
52
54
  onDownload = _ref.onDownload,
53
55
  onDelete = _ref.onDelete,
54
56
  dataAttrs = _ref.dataAttrs;
@@ -89,7 +91,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
89
91
  };
90
92
  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
91
93
  className: cn({
92
- error: isError
94
+ error: isError,
95
+ disabled: disabled
93
96
  }, [className])
94
97
  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
95
98
  className: cn('file-icon-box')
@@ -122,7 +125,8 @@ var UploadFileItem = function UploadFileItem(_ref) {
122
125
  type: "button",
123
126
  className: cn('cancel-icon-box')
124
127
  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.deleteButton), {
125
- onClick: onDelete
128
+ onClick: onDelete,
129
+ disabled: disabled
126
130
  }), /*#__PURE__*/React.createElement(CancelIcon, {
127
131
  className: cn('icon')
128
132
  })));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "8.12.1",
3
+ "version": "8.13.1",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -104,5 +104,5 @@
104
104
  "simplebar-react": "^3.2.5",
105
105
  "swiper": "^11.1.1"
106
106
  },
107
- "gitHead": "8a69aba34853a115f6b8aba23641784eb6ffe1cf"
107
+ "gitHead": "ba0372a7d2d677d5e8ce0a227cfdb4ae67591ae8"
108
108
  }
package/styles/colors.css CHANGED
@@ -80,6 +80,14 @@
80
80
  --137C20: #FFEDD1;
81
81
  --fury80: #F8505D;
82
82
  --fury20: #FFC5C9;
83
+
84
+ /* RGB Colors */
85
+ --spbSky0-rgb: 246, 246, 246;
86
+ --spbSky1-rgb: 237, 237, 237;
87
+ --spbSky2-rgb: 216, 216, 216;
88
+ --brandGreen-rgb: 0, 185, 86;
89
+ --background-rgb: 255, 255, 255;
90
+ --stcBlack-rgb: 51, 51, 51;
83
91
  }
84
92
 
85
93
  [data-theme='dark'] {
@@ -92,7 +100,7 @@
92
100
  --spbSky2: #595959;
93
101
  --spbSky3: #999999;
94
102
  --lime: #AAFF00;
95
- --sky: #3CB9FF;
103
+ --sky: #3CB9FF;
96
104
  --night: #1E64AA;
97
105
  --berry: #AA5AFF;
98
106
  --flamingo: #E64DE6;
@@ -147,5 +155,11 @@
147
155
  --137C20: #4A3D27;
148
156
  --fury80: #CA3A43;
149
157
  --fury20: #442B2D;
158
+ --spbSky0-rgb: 61, 61, 61;
159
+ --spbSky1-rgb: 69, 69, 69;
160
+ --spbSky2-rgb: 89, 89, 89;
161
+ --background-rgb: 31, 31, 31;
162
+ --brandGreen-rgb: 0, 185, 86;
163
+ --stcBlack-rgb: 51, 51, 51;
150
164
  }
151
165