@salutejs/plasma-new-hope 0.339.0-canary.2299.18865993815.0 → 0.339.0-canary.2301.18868987022.0

package/es/components/_Icon/Icons/IconDotsHorizontalOutline.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { DotsHorizontalOutline } from '../Icon.assets/DotsHorizontalOutline.js';
+import { IconRoot } from '../IconRoot.js';
+
+var IconDotsHorizontalOutline = function IconDotsHorizontalOutline(_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 's' : _ref$size,
+    color = _ref.color,
+    className = _ref.className,
+    sizeCustomProperty = _ref.sizeCustomProperty,
+    sizeCustomValue = _ref.sizeCustomValue;
+  return /*#__PURE__*/React.createElement(IconRoot, {
+    className: className,
+    size: size,
+    color: color,
+    sizeCustomProperty: sizeCustomProperty,
+    sizeCustomValue: sizeCustomValue,
+    icon: DotsHorizontalOutline
+  });
+};
+
+export { IconDotsHorizontalOutline };
+//# sourceMappingURL=IconDotsHorizontalOutline.js.map

package/es/components/_Icon/Icons/IconDotsHorizontalOutline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconDotsHorizontalOutline.js","sources":["../../../../src/components/_Icon/Icons/IconDotsHorizontalOutline.tsx"],"sourcesContent":["import React from 'react';\n\nimport { DotsHorizontalOutline } from '../Icon.assets/DotsHorizontalOutline';\nimport { IconRoot, IconProps } from '../IconRoot';\n\nexport const IconDotsHorizontalOutline: React.FC<IconProps> = ({\n    size = 's',\n    color,\n    className,\n    sizeCustomProperty,\n    sizeCustomValue,\n}) => {\n    return (\n        <IconRoot\n            className={className}\n            size={size}\n            color={color}\n            sizeCustomProperty={sizeCustomProperty}\n            sizeCustomValue={sizeCustomValue}\n            icon={DotsHorizontalOutline}\n        />\n    );\n};\n"],"names":["IconDotsHorizontalOutline","_ref","_ref$size","size","color","className","sizeCustomProperty","sizeCustomValue","React","createElement","IconRoot","icon","DotsHorizontalOutline"],"mappings":";;;;IAKaA,yBAA8C,GAAG,SAAjDA,yBAA8CA,CAAAC,IAAA,EAMrD;AAAA,EAAA,IAAAC,SAAA,GAAAD,IAAA,CALFE,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,GAAG,GAAAA,SAAA;IACVE,KAAK,GAAAH,IAAA,CAALG,KAAK;IACLC,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,kBAAkB,GAAAL,IAAA,CAAlBK,kBAAkB;IAClBC,eAAe,GAAAN,IAAA,CAAfM,eAAe,CAAA;AAEf,EAAA,oBACIC,KAAA,CAAAC,aAAA,CAACC,QAAQ,EAAA;AACLL,IAAAA,SAAS,EAAEA,SAAU;AACrBF,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,KAAK,EAAEA,KAAM;AACbE,IAAAA,kBAAkB,EAAEA,kBAAmB;AACvCC,IAAAA,eAAe,EAAEA,eAAgB;AACjCI,IAAAA,IAAI,EAAEC,qBAAAA;AAAsB,GAC/B,CAAC,CAAA;AAEV;;;;"}

package/es/index.css

@@ -885,24 +885,32 @@
 
 .base_54y6eh_b1x5zqph__a3c52690 .base_54y6eh_e1fh2i5t__a3c52690{padding-left:var(--plasma-editable-edit-button-padding-left);}.base_54y6eh_b1x5zqph__a3c52690 .base_54y6eh_editableTextBox__a3c52690{margin-right:var(--plasma-editable-text-box-margin-right);padding-right:var(--plasma-editable-text-box-padding-right);}
 
-.base_kpo9at_b1pj1390__d0613261.base_kpo9at_horizontal__d0613261{-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_kpo9at_b1pj1390__d0613261.base_kpo9at_vertical__d0613261{row-gap:var(--plasma-attach-vertical-gap);}.base_kpo9at_b1pj1390__d0613261.base_kpo9at_auto__d0613261{row-gap:var(--plasma-attach-vertical-gap);-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_kpo9at_b1pj1390__d0613261.base_kpo9at_withHelperText__d0613261{row-gap:var(--plasma-attach-vertical-gap-with-helper-text);}.base_kpo9at_b1pj1390__d0613261 .base_kpo9at_fssye98__d0613261{font-family:var(--plasma-attach-cell-title-font-family);font-size:var(--plasma-attach-cell-title-font-size);font-style:var(--plasma-attach-cell-title-font-style);font-weight:var(--plasma-attach-cell-title-font-weight);-webkit-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);-moz-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);-ms-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);letter-spacing:var(--plasma-attach-cell-title-letter-spacing);line-height:var(--plasma-attach-cell-title-line-height);height:var(--plasma-attach-filename-wrapper-height);}.base_kpo9at_b1pj1390__d0613261 .base_kpo9at_sjp429d__d0613261{font-family:var(--plasma-typo-body-xs-font-family);font-size:var(--plasma-typo-body-xs-font-size);font-style:var(--plasma-typo-body-xs-font-style);font-weight:var(--plasma-typo-body-xs-font-weight);-webkit-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);-moz-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);-ms-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);letter-spacing:var(--plasma-typo-body-xs-letter-spacing);line-height:var(--plasma-typo-body-xs-line-height);}
+.base_1x0gzlt_b1pj1390__acafdc8a.base_1x0gzlt_plasmaAttachHorizontal__acafdc8a{-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_1x0gzlt_b1pj1390__acafdc8a.base_1x0gzlt_plasmaAttachVertical__acafdc8a{row-gap:var(--plasma-attach-vertical-gap);}.base_1x0gzlt_b1pj1390__acafdc8a.base_1x0gzlt_plasmaAttachAuto__acafdc8a{row-gap:var(--plasma-attach-vertical-gap);-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_1x0gzlt_b1pj1390__acafdc8a .base_1x0gzlt_plasmaAttachHorizontal__acafdc8a{-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_1x0gzlt_b1pj1390__acafdc8a .base_1x0gzlt_plasmaAttachAuto__acafdc8a{-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}.base_1x0gzlt_b1pj1390__acafdc8a.base_1x0gzlt_plasmaAttachWithHelperText__acafdc8a{row-gap:var(--plasma-attach-vertical-gap-with-helper-text);}.base_1x0gzlt_b1pj1390__acafdc8a .base_1x0gzlt_fssye98__acafdc8a{font-family:var(--plasma-attach-cell-title-font-family);font-size:var(--plasma-attach-cell-title-font-size);font-style:var(--plasma-attach-cell-title-font-style);font-weight:var(--plasma-attach-cell-title-font-weight);-webkit-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);-moz-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);-ms-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);letter-spacing:var(--plasma-attach-cell-title-letter-spacing);line-height:var(--plasma-attach-cell-title-line-height);}.base_1x0gzlt_b1pj1390__acafdc8a .base_1x0gzlt_sjp429d__acafdc8a{font-family:var(--plasma-typo-body-xs-font-family);font-size:var(--plasma-typo-body-xs-font-size);font-style:var(--plasma-typo-body-xs-font-style);font-weight:var(--plasma-typo-body-xs-font-weight);-webkit-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);-moz-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);-ms-letter-spacing:var(--plasma-typo-body-xs-letter-spacing);letter-spacing:var(--plasma-typo-body-xs-letter-spacing);line-height:var(--plasma-typo-body-xs-line-height);}
 
-.base_1nvsg1b_b438e2d__83d45116.base_1nvsg1b_horizontal__83d45116{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}.base_1nvsg1b_b438e2d__83d45116.base_1nvsg1b_vertical__83d45116{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.base_1nvsg1b_b438e2d__83d45116.base_1nvsg1b_auto__83d45116{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
+.base_d9xz7t_b438e2d__8119a832.base_d9xz7t_plasmaAttachHorizontal__8119a832{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}.base_d9xz7t_b438e2d__8119a832.base_d9xz7t_plasmaAttachVertical__8119a832{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.base_d9xz7t_b438e2d__8119a832.base_d9xz7t_plasmaAttachAuto__8119a832{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
 
 .base_1tgnvl9_b1psfq3i__8ccb119d .base_1tgnvl9_sjp429d__8ccb119d{color:var(--plasma-attach-helper-text-color);}
 
-.Attach_styles_pso18d_by826kf__6f8aab6e{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
-.Attach_styles_pso18d_sw7vb9c__6f8aab6e{display:none;}
-.Attach_styles_pso18d_suojwhg__6f8aab6e{position:relative;}
-.Attach_styles_pso18d_sjp429d__6f8aab6e{position:absolute;margin-top:0.25rem;}
-.Attach_styles_pso18d_fssye98__6f8aab6e{display:inline-grid;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;grid-template-columns:auto 1fr;min-width:8ch;}
-.Attach_styles_pso18d_t1531dv__6f8aab6e{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.Attach_styles_17eum4v_by826kf__a54172eb{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
+.Attach_styles_17eum4v_sw7vb9c__a54172eb{display:none;}
+.Attach_styles_17eum4v_suojwhg__a54172eb{position:relative;}
+.Attach_styles_17eum4v_sjp429d__a54172eb{position:absolute;margin-top:0.25rem;}
+.Attach_styles_17eum4v_fssye98__a54172eb{display:inline-grid;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;grid-template-columns:auto 1fr;min-width:8ch;height:var(--fssye98-0);}
+.Attach_styles_17eum4v_f1531dv__a54172eb{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:var(--f1531dv-0);}.Attach_styles_17eum4v_f1531dv__a54172eb.Attach_styles_17eum4v_plasmaAttachHorizontal__a54172eb{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}.Attach_styles_17eum4v_f1531dv__a54172eb.Attach_styles_17eum4v_plasmaAttachVertical__a54172eb{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.Attach_styles_17eum4v_f1531dv__a54172eb.Attach_styles_17eum4v_plasmaAttachAuto__a54172eb{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}.Attach_styles_17eum4v_f1531dv__a54172eb.Attach_styles_17eum4v_plasmaAttachHorizontalHidden__a54172eb{position:absolute;top:0;left:0;z-index:-999;visibility:hidden;opacity:0;max-width:100%;overflow:hidden;}
+.Attach_styles_17eum4v_t7plw5t__a54172eb{overflow:var(--t7plw5t-0);text-overflow:var(--t7plw5t-1);white-space:nowrap;}
 
 
-.Cell_styles_69w962_si1k6gv__a96d6b9b{--plasma-cell-label-color:var(--plasma-attach-cell-label-color);--plasma-cell-title-color:var(--plasma-attach-cell-title-color);--plasma-cell-subtitle-color:var(--plasma-attach-cell-subtitle-color);--plasma-cell-background-color:var(--plasma-attach-cell-background-color);--plasma-cell-width:var(--plasma-attach-cell-width);--plasma-cell-padding:var(--plasma-attach-cell-padding);--plasma-cell-padding-left-content:var(--plasma-attach-cell-padding-left-content);--plasma-cell-padding-content:var(--plasma-attach-cell-padding-content);--plasma-cell-padding-right-content:var(--plasma-attach-cell-padding-right-content);--plasma-cell-textbox-gap:var(--plasma-attach-cell-textbox-gap);--plasma-cell-gap:var(--plasma-attach-cell-gap);--plasma-cell-label-font-family:var(--plasma-attach-cell-label-font-family);--plasma-cell-label-font-size:var(--plasma-attach-cell-label-font-size);--plasma-cell-label-font-style:var(--plasma-attach-cell-label-font-style);--plasma-cell-label-font-weight:var(--plasma-attach-cell-label-font-weight);--plasma-cell-label-letter-spacing:var(--plasma-attach-cell-label-letter-spacing);--plasma-cell-label-line-height:var(--plasma-attach-cell-label-line-height);--plasma-cell-title-font-family:var(--plasma-attach-cell-title-font-family);--plasma-cell-title-font-size:var(--plasma-attach-cell-title-font-size);--plasma-cell-title-font-style:var(--plasma-attach-cell-title-font-style);--plasma-cell-title-font-weight:var(--plasma-attach-cell-title-font-weight);--plasma-cell-title-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);--plasma-cell-title-line-height:var(--plasma-attach-cell-title-line-height);--plasma-cell-subtitle-font-family:var(--plasma-attach-cell-subtitle-font-family);--plasma-cell-subtitle-font-size:var(--plasma-attach-cell-subtitle-font-size);--plasma-cell-subtitle-font-style:var(--plasma-attach-cell-subtitle-font-style);--plasma-cell-subtitle-font-weight:var(--plasma-attach-cell-subtitle-font-weight);--plasma-cell-subtitle-letter-spacing:var(--plasma-attach-cell-subtitle-letter-spacing);--plasma-cell-subtitle-line-height:var(--plasma-attach-cell-subtitle-line-height);white-space:nowrap;}.Cell_styles_69w962_si1k6gv__a96d6b9b.Cell_styles_69w962_cellHidden__a96d6b9b{visibility:hidden;}
+.HiddenWidthHelper_styles_3t6n6e_hgjzppa__f7fb7ae5{position:absolute;inset:0;z-index:-999;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);box-sizing:border-box;visibility:hidden;opacity:0;}
+.HiddenWidthHelper_styles_3t6n6e_h1ad4wty__f7fb7ae5{width:100%;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;-webkit-column-gap:var(--plasma-attach-horizontal-gap);column-gap:var(--plasma-attach-horizontal-gap);}
 
 .Button_styles_bj69th_sfplb1t__569490a7{--plasma-button-color:var(--plasma-attach-button-color);--plasma-button-value-color:var(--plasma-attach-button-value-color);--plasma-button-background-color:var(--plasma-attach-button-background-color);--plasma-button-color-hover:var(--plasma-attach-button-color-hover);--plasma-button-background-color-hover:var(--plasma-attach-button-background-color-hover);--plasma-button-color-active:var(--plasma-attach-button-color-active);--plasma-button-background-color-active:var(--plasma-attach-button-background-color-active);--plasma-button-loading-background-color:var(--plasma-attach-button-loading-background-color);--plasma-button-scale-hover:var(--plasma-attach-button-scale-hover);---plasma-button-scale-active:var(---plasma-attach-button-scale-active);--plasma-button-height:var(--plasma-attach-button-height);--plasma-button-width:var(--plasma-attach-button-width);--plasma-button-padding:var(--plasma-attach-button-padding);--plasma-button-radius:var(--plasma-attach-button-radius);--plasma-button-radius-circle:var(--plasma-attach-button-radius-circle);--plasma-button-font-family:var(--plasma-attach-button-font-family);--plasma-button-font-size:var(--plasma-attach-button-font-size);--plasma-button-font-style:var(--plasma-attach-button-font-style);--plasma-button-font-weight:var(--plasma-attach-button-font-weight);--plasma-button-letter-spacing:var(--plasma-attach-button-letter-spacing);--plasma-button-line-height:var(--plasma-attach-button-line-height);--plasma-button-left-content-margin:var(--plasma-attach-button-left-content-margin);--plasma-button-left-content-align-self:var(--plasma-attach-button-left-content-align-self);--plasma-button-right-content-margin:var(--plasma-attach-button-right-content-margin);--plasma-button-right-content-align-self:var(--plasma-attach-button-right-content-align-self);--plasma-button-value-margin:var(--plasma-attach-button-value-margin);--plasma-button-disabled-opacity:var(--plasma-attach-button-disabled-opacity);--plasma-button-focus-color:var(--plasma-attach-button-focus-color);--plasma-button-spinner-color:var(--plasma-attach-button-spinner-color);--plasma-button-spinner-size:var(--plasma-attach-button-spinner-size);}
 
+.Cell_styles_lpj30y_si1k6gv__80725697{--plasma-cell-label-color:var(--plasma-attach-cell-label-color);--plasma-cell-title-color:var(--plasma-attach-cell-title-color);--plasma-cell-subtitle-color:var(--plasma-attach-cell-subtitle-color);--plasma-cell-background-color:var(--plasma-attach-cell-background-color);--plasma-cell-width:var(--plasma-attach-cell-width);--plasma-cell-padding:var(--plasma-attach-cell-padding);--plasma-cell-padding-left-content:var(--plasma-attach-cell-padding-left-content);--plasma-cell-padding-content:var(--plasma-attach-cell-padding-content);--plasma-cell-padding-right-content:var(--plasma-attach-cell-padding-right-content);--plasma-cell-textbox-gap:var(--plasma-attach-cell-textbox-gap);--plasma-cell-gap:var(--plasma-attach-cell-gap);--plasma-cell-label-font-family:var(--plasma-attach-cell-label-font-family);--plasma-cell-label-font-size:var(--plasma-attach-cell-label-font-size);--plasma-cell-label-font-style:var(--plasma-attach-cell-label-font-style);--plasma-cell-label-font-weight:var(--plasma-attach-cell-label-font-weight);--plasma-cell-label-letter-spacing:var(--plasma-attach-cell-label-letter-spacing);--plasma-cell-label-line-height:var(--plasma-attach-cell-label-line-height);--plasma-cell-title-font-family:var(--plasma-attach-cell-title-font-family);--plasma-cell-title-font-size:var(--plasma-attach-cell-title-font-size);--plasma-cell-title-font-style:var(--plasma-attach-cell-title-font-style);--plasma-cell-title-font-weight:var(--plasma-attach-cell-title-font-weight);--plasma-cell-title-letter-spacing:var(--plasma-attach-cell-title-letter-spacing);--plasma-cell-title-line-height:var(--plasma-attach-cell-title-line-height);--plasma-cell-subtitle-font-family:var(--plasma-attach-cell-subtitle-font-family);--plasma-cell-subtitle-font-size:var(--plasma-attach-cell-subtitle-font-size);--plasma-cell-subtitle-font-style:var(--plasma-attach-cell-subtitle-font-style);--plasma-cell-subtitle-font-weight:var(--plasma-attach-cell-subtitle-font-weight);--plasma-cell-subtitle-letter-spacing:var(--plasma-attach-cell-subtitle-letter-spacing);--plasma-cell-subtitle-line-height:var(--plasma-attach-cell-subtitle-line-height);white-space:nowrap;}.Cell_styles_lpj30y_si1k6gv__80725697.Cell_styles_lpj30y_plasmaAttachCellHidden__80725697{visibility:hidden;}
+
+.MoreTrigger_styles_5yseaa_i1fc84ks__90d41151{line-height:0;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:var(--plasma-attach-more-icon-padding);}
+
+.Dropdown_styles_1ge65dg_s1qvmnsb__e948565f{--plasma-dropdown-border-width:var(--plasma-attach-dropdown-border-width);--plasma-dropdown-padding:var(--plasma-attach-dropdown-padding);--plasma-dropdown-border-radius:var(--plasma-attach-dropdown-border-radius);--plasma-dropdown-width:var(--plasma-attach-dropdown-width);--plasma-dropdown-item-padding:var(--plasma-attach-dropdown-item-padding);--plasma-dropdown-background:var(--plasma-attach-dropdown-background);--plasma-dropdown-box-shadow:var(--plasma-attach-dropdown-box-shadow);--plasma-dropdown-border-color:var(--plasma-attach-dropdown-border-color);}.Dropdown_styles_1ge65dg_s1qvmnsb__e948565f .Dropdown_styles_1ge65dg_w1jav4ek__e948565f:hover{cursor:default;}
+
 .IconButton_styles_7clf9d_s1uu1svj__424ea6e4{--plasma-icon-button-color:var(--plasma-attach-icon-button-color);--plasma-icon-button-background-color:var(--plasma-attach-icon-button-background-color);--plasma-icon-button-loading-background-color:var(--plasma-attach-icon-button-loading-background-color);--plasma-icon-button-color-hover:var(--plasma-attach-icon-button-color-hover);--plasma-icon-button-background-color-hover:var(--plasma-attach-icon-button-background-color-hover);--plasma-icon-button-color-active:var(--plasma-attach-icon-button-color-active);--plasma-icon-button-background-color-active:var(--plasma-attach-icon-button-background-color-active);--plasma-icon-button-scale-hover:var(--plasma-attach-icon-button-scale-hover);---plasma-icon-button-scale-active:var(---plasma-attach-icon-button-scale-active);--plasma-icon-button-height:var(--plasma-attach-icon-button-height);--plasma-icon-button-width:var(--plasma-attach-icon-button-width);--plasma-icon-button-padding:var(--plasma-attach-icon-button-padding);--plasma-icon-button-radius:var(--plasma-attach-icon-button-radius);--plasma-icon-button-radius-circle:var(--plasma-attach-icon-button-radius-circle);--plasma-icon-button-font-family:var(--plasma-attach-icon-button-font-family);--plasma-icon-button-font-size:var(--plasma-attach-icon-button-font-size);--plasma-icon-button-font-style:var(--plasma-attach-icon-button-font-style);--plasma-icon-button-font-weight:var(--plasma-attach-icon-button-font-weight);--plasma-icon-button-letter-spacing:var(--plasma-attach-icon-button-letter-spacing);--plasma-icon-button-line-height:var(--plasma-attach-icon-button-line-height);--plasma-icon-button-disabled-opacity:var(--plasma-attach-icon-button-disabled-opacity);--plasma-icon-button-focus-color:var(--plasma-attach-icon-button-focus-color);--plasma-icon-button-spinner-color:var(--plasma-attach-icon-button-spinner-color);--plasma-icon-button-spinner-size:var(--plasma-attach-icon-button-spinner-size);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
 .IconButton_styles_7clf9d_s17hmg85__424ea6e4{--plasma-icon-button-color:var(--plasma-attach-icon-button-cancel-color);--plasma-icon-button-background-color:var(--plasma-attach-icon-button-cancel-background-color);--plasma-icon-button-loading-background-color:var(--plasma-attach-icon-button-cancel-loading-background-color);--plasma-icon-button-color-hover:var(--plasma-attach-icon-button-cancel-color-hover);--plasma-icon-button-background-color-hover:var(--plasma-attach-icon-button-cancel-background-color-hover);--plasma-icon-button-color-active:var(--plasma-attach-icon-button-cancel-color-active);--plasma-icon-button-background-color-active:var(--plasma-attach-icon-button-cancel-background-color-active);--plasma-icon-button-scale-hover:var(--plasma-attach-icon-button-cancel-scale-hover);---plasma-icon-button-scale-active:var(---plasma-attach-icon-button-cancel-scale-active);--plasma-icon-button-height:var(--plasma-attach-icon-button-cancel-height);--plasma-icon-button-width:var(--plasma-attach-icon-button-cancel-width);--plasma-icon-button-padding:var(--plasma-attach-icon-button-cancel-padding);--plasma-icon-button-radius:var(--plasma-attach-icon-button-cancel-radius);--plasma-icon-button-radius-circle:var(--plasma-attach-icon-button-cancel-radius-circle);--plasma-icon-button-font-family:var(--plasma-attach-icon-button-cancel-font-family);--plasma-icon-button-font-size:var(--plasma-attach-icon-button-cancel-font-size);--plasma-icon-button-font-style:var(--plasma-attach-icon-button-cancel-font-style);--plasma-icon-button-font-weight:var(--plasma-attach-icon-button-cancel-font-weight);--plasma-icon-button-letter-spacing:var(--plasma-attach-icon-button-cancel-letter-spacing);--plasma-icon-button-line-height:var(--plasma-attach-icon-button-cancel-line-height);--plasma-icon-button-disabled-opacity:var(--plasma-attach-icon-button-cancel-disabled-opacity);--plasma-icon-button-focus-color:var(--plasma-attach-icon-button-cancel-focus-color);--plasma-icon-button-spinner-color:var(--plasma-attach-icon-button-cancel-spinner-color);--plasma-icon-button-spinner-size:var(--plasma-attach-icon-button-cancel-spinner-size);}
 
@@ -1171,11 +1179,11 @@
 .Section_styles_147bzzp_a6i3xtj__60e0567c{margin:auto;}
 .Section_styles_147bzzp_lnmmdxt__60e0567c{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
 
-.ProgressBarCircular_styles_16hxdvd_b18reh89__8bec966a{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;width:var(--plasma-progressbar-circular-height);height:var(--plasma-progressbar-circular-height);}
-.ProgressBarCircular_styles_16hxdvd_s2tt3b5__8bec966a{width:100%;height:100%;}
-.ProgressBarCircular_styles_16hxdvd_slvt37h__8bec966a{fill:none;r:var(--slvt37h-0);stroke:var(--plasma-progressbar-circular-background-stroke);stroke-width:var(--slvt37h-1);}
-.ProgressBarCircular_styles_16hxdvd_s1d8ncmi__8bec966a{--percentage:var(--s1d8ncmi-0);--radius:var(--s1d8ncmi-1);--circumference:calc(calc(2 * 3.1415926535) * var(--radius));--dashoffset:calc(var(--circumference) - (var(--percentage,0) * var(--circumference) / 100));fill:none;stroke:var(--plasma-progressbar-circular-progress-stroke);stroke-width:var(--s1d8ncmi-2);stroke-linecap:round;r:var(--radius);stroke-dasharray:var(--circumference);stroke-dashoffset:var(--dashoffset);-webkit-transition:stroke-dashoffset 0.3s linear;transition:stroke-dashoffset 0.3s linear;}
-.ProgressBarCircular_styles_16hxdvd_sg9aoc4__8bec966a{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:var(--plasma-progressbar-circular-content-color);font-family:var(--plasma-progressbar-circular-content-font-family);font-size:var(--plasma-progressbar-circular-content-font-size);font-style:var(--plasma-progressbar-circular-content-font-style);font-weight:var(--plasma-progressbar-circular-content-font-weight);-webkit-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);-moz-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);-ms-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);line-height:var(--plasma-progressbar-circular-content-line-height);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
+.ProgressBarCircular_styles_1cnlydo_b18reh89__42dafeea{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;width:var(--plasma-progressbar-circular-height);height:var(--plasma-progressbar-circular-height);}
+.ProgressBarCircular_styles_1cnlydo_s2tt3b5__42dafeea{width:100%;height:100%;}
+.ProgressBarCircular_styles_1cnlydo_slvt37h__42dafeea{fill:none;r:var(--slvt37h-0);stroke:var(--plasma-progressbar-circular-background-stroke);stroke-width:var(--slvt37h-1);}
+.ProgressBarCircular_styles_1cnlydo_s1d8ncmi__42dafeea{--percentage:var(--s1d8ncmi-0);--radius:var(--s1d8ncmi-1);--circumference:calc(calc(2 * 3.1415926535) * var(--radius));--dashoffset:calc(var(--circumference) - (var(--percentage,0) * var(--circumference) / 100));fill:none;stroke:var(--plasma-progressbar-circular-progress-stroke);stroke-width:var(--s1d8ncmi-2);stroke-linecap:round;r:var(--radius);stroke-dasharray:var(--circumference);stroke-dashoffset:var(--dashoffset);-webkit-transition:stroke-dashoffset 0.3s ease-in-out;transition:stroke-dashoffset 0.3s ease-in-out;}
+.ProgressBarCircular_styles_1cnlydo_sg9aoc4__42dafeea{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);color:var(--plasma-progressbar-circular-content-color);font-family:var(--plasma-progressbar-circular-content-font-family);font-size:var(--plasma-progressbar-circular-content-font-size);font-style:var(--plasma-progressbar-circular-content-font-style);font-weight:var(--plasma-progressbar-circular-content-font-weight);-webkit-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);-moz-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);-ms-letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);letter-spacing:var(--plasma-progressbar-circular-content-letter-spacing);line-height:var(--plasma-progressbar-circular-content-line-height);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}
 
 .TimePickerGrid_styles_mz2mkl_b1gxyazn__68be6be3{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;height:10rem;}
 .TimePickerGrid_styles_mz2mkl_s5pkh4__68be6be3{background:var(--plasma-time-picker-grid-grid-background);border-radius:var(--plasma-time-picker-grid-grid-border-radius);width:var(--s5pkh4-0);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:var(--plasma-time-picker-grid-grid-padding);-webkit-flex:1 1 1;-ms-flex:1 1 1;flex:1 1 1;gap:var(--plasma-time-picker-grid-scrollbar-width);box-sizing:border-box;position:relative;height:var(--plasma-time-picker-grid-column-height);}
@@ -1197,7 +1205,3 @@
 .base_nyid0i_bxyi89k__8a89f178[disabled]{opacity:var(--plasma-time-picker-disabled-opacity);cursor:not-allowed;}
 
 .base_zalfas_b13m44ib__f47929ae[readonly]{cursor:not-allowed;}
-
-.Loader_styles_1i0a33d_b1pysjlh__1de0e3cd{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;box-sizing:border-box;width:var(--plasma-loader-width);height:var(--plasma-loader-height);}.Loader_styles_1i0a33d_b1pysjlh__1de0e3cd.Loader_styles_1i0a33d__PlasmaLoaderSmallBlur__1de0e3cd{-webkit-backdrop-filter:blur(1.6875rem);backdrop-filter:blur(1.6875rem);}.Loader_styles_1i0a33d_b1pysjlh__1de0e3cd.Loader_styles_1i0a33d__PlasmaLoaderMediumBlur__1de0e3cd{-webkit-backdrop-filter:blur(2.3125rem);backdrop-filter:blur(2.3125rem);}.Loader_styles_1i0a33d_b1pysjlh__1de0e3cd.Loader_styles_1i0a33d__PlasmaLoaderLargeBlur__1de0e3cd{-webkit-backdrop-filter:blur(3.125rem);backdrop-filter:blur(3.125rem);}.Loader_styles_1i0a33d_b1pysjlh__1de0e3cd.Loader_styles_1i0a33d__PlasmaProgressbarCircularBackgroundCircle__1de0e3cd{background:var(--plasma_private-loader-overlay-color);}
-.Loader_styles_1i0a33d_s14s1lcu__1de0e3cd{--plasma-spinner-size:var(--plasma-loader-spinner-size);--plasma-spinner-color:var(--plasma-loader-spinner-color);}
-.Loader_styles_1i0a33d_s14gpc11__1de0e3cd{--plasma-progressbar-circular-size:var(--plasma-loader-progressbar-circular-size);--plasma-progressbar-circular-width:var(--plasma-loader-progressbar-circular-width);--plasma-progressbar-circular-height:var(--plasma-loader-progressbar-circular-height);--plasma-progressbar-circular-stroke-width:var(--plasma-loader-progressbar-circular-stroke-width);--plasma-progressbar-circular-stroke-size:var(--plasma-loader-progressbar-circular-stroke-size);--plasma-progressbar-circular-background-stroke:var(--plasma-loader-progressbar-circular-background-stroke);--plasma-progressbar-circular-progress-stroke:var(--plasma-loader-progressbar-circular-progress-stroke);--plasma-progressbar-circular-content-color:var(--plasma-loader-progressbar-circular-content-color);--plasma-progressbar-circular-content-font-family:var(--plasma-loader-progressbar-circular-content-font-family);--plasma-progressbar-circular-content-font-size:var(--plasma-loader-progressbar-circular-content-font-size);--plasma-progressbar-circular-content-font-style:var(--plasma-loader-progressbar-circular-content-font-style);--plasma-progressbar-circular-content-font-weight:var(--plasma-loader-progressbar-circular-content-font-weight);--plasma-progressbar-circular-content-letter-spacing:var(--plasma-loader-progressbar-circular-content-letter-spacing);--plasma-progressbar-circular-content-line-height:var(--plasma-loader-progressbar-circular-content-line-height);}

package/es/index.js

@@ -265,6 +265,4 @@ export { progressBarCircularConfig, progressBarCircularRoot } from './components
 export { tokens as progressBarCircularTokens } from './components/ProgressBarCircular/ProgressBarCircular.tokens.js';
 export { timePickerConfig, timePickerRoot } from './components/TimePicker/TimePicker.js';
 export { classes as timePickerClasses, tokens as timePickerTokens } from './components/TimePicker/TimePicker.tokens.js';
-export { loaderConfig, loaderRoot } from './components/Loader/Loader.js';
-export { tokens as loaderTokens } from './components/Loader/Loader.tokens.js';
 //# sourceMappingURL=index.js.map

package/es/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salutejs/plasma-new-hope",
-  "version": "0.339.0-canary.2299.18865993815.0",
+  "version": "0.339.0-canary.2301.18868987022.0",
   "description": "Salute Design System blueprint",
   "main": "cjs/index.js",
   "module": "es/index.js",
@@ -79,7 +79,7 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^25.0.4",
     "@rollup/plugin-node-resolve": "^15.1.0",
-    "@salutejs/plasma-sb-utils": "0.209.0-canary.2299.18865993815.0",
+    "@salutejs/plasma-sb-utils": "0.209.0-canary.2301.18868987022.0",
     "@salutejs/plasma-themes": "0.38.0",
     "@storybook/addon-docs": "8.6.12",
     "@storybook/addon-essentials": "8.6.12",
@@ -117,7 +117,7 @@
     "@linaria/react": "5.0.3",
     "@popperjs/core": "2.11.8",
     "@salutejs/input-core": "2.1.2",
-    "@salutejs/plasma-core": "1.209.0-canary.2299.18865993815.0",
+    "@salutejs/plasma-core": "1.209.0-canary.2301.18868987022.0",
     "@salutejs/react-maskinput": "3.2.6",
     "@tanstack/react-table": "8.21.2",
     "@tanstack/react-virtual": "3.13.2",
@@ -137,5 +137,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "0e77fd556bd99dc83727df4fe08eda0a3f5dd419"
+  "gitHead": "5bea749e6ebd5d44affff78465f914446a0913d2"
 }

package/styled-components/cjs/components/Attach/Attach.js

@@ -19,16 +19,14 @@ _export(exports, {
 var _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 var _plasmacore = require("@salutejs/plasma-core");
 var _utils = require("../../utils");
-var _Icon = require("../_Icon");
 var _base = require("./variations/_size/base");
 var _base1 = require("./variations/_view/base");
 var _base2 = require("./variations/_helperTextView/base");
 var _Attachstyles = require("./Attach.styles");
-var _Cell = require("./ui/Cell/Cell");
 var _utils1 = require("./utils");
 var _Attachtokens = require("./Attach.tokens");
-var _AttachButton = require("./components/AttachButton");
-var _IconButtonstyles = require("./ui/IconButton/IconButton.styles");
+var _components = require("./components");
+var _ui = require("./ui");
 function _array_like_to_array(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
@@ -133,6 +131,30 @@ function _object_spread(target) {
     }
     return target;
 }
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
 function _object_without_properties(source, excluded) {
     if (source == null) return {};
     var target = _object_without_properties_loose(source, excluded);
@@ -173,11 +195,13 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 var attachRoot = function(Root) {
     return /*#__PURE__*/ (0, _react.forwardRef)(function(props, outerRef) {
-        var _props_flow = props.flow, flow = _props_flow === void 0 ? 'auto' : _props_flow, _props_buttonType = props.buttonType, buttonType = _props_buttonType === void 0 ? 'button' : _props_buttonType, _props_hideButtonOnAttach = props.hideButtonOnAttach, hideButtonOnAttach = _props_hideButtonOnAttach === void 0 ? false : _props_hideButtonOnAttach, _props_hasAttachment = props.hasAttachment, hasAttachment = _props_hasAttachment === void 0 ? true : _props_hasAttachment, acceptedFileFormats = props.acceptedFileFormats, helperText = props.helperText, size = props.size, view = props.view, helperTextView = props.helperTextView, className = props.className, style = props.style, isLoading = props.isLoading, disabled = props.disabled, id = props.id, name = props.name, customIcon = props.customIcon, onClick = props.onClick, onChange = props.onChange, onClear = props.onClear, rest = _object_without_properties(props, [
+        var _props_flow = props.flow, flow = _props_flow === void 0 ? 'auto' : _props_flow, _props_buttonType = props.buttonType, buttonType = _props_buttonType === void 0 ? 'button' : _props_buttonType, _props_hideButtonOnAttach = props.hideButtonOnAttach, hideButtonOnAttach = _props_hideButtonOnAttach === void 0 ? false : _props_hideButtonOnAttach, _props_hasAttachment = props.hasAttachment, hasAttachment = _props_hasAttachment === void 0 ? true : _props_hasAttachment, multiple = props.multiple, dropdownOptions = props.dropdownOptions, acceptedFileFormats = props.acceptedFileFormats, helperText = props.helperText, size = props.size, view = props.view, helperTextView = props.helperTextView, className = props.className, style = props.style, isLoading = props.isLoading, disabled = props.disabled, id = props.id, name = props.name, customIcon = props.customIcon, onClick = props.onClick, onChange = props.onChange, onClear = props.onClear, rest = _object_without_properties(props, [
             "flow",
             "buttonType",
             "hideButtonOnAttach",
             "hasAttachment",
+            "multiple",
+            "dropdownOptions",
             "acceptedFileFormats",
             "helperText",
             "size",
@@ -197,17 +221,18 @@ var attachRoot = function(Root) {
         var innerRef = (0, _react.useRef)(null);
         var ref = (0, _plasmacore.useForkRef)(outerRef, innerRef);
         var inputRef = (0, _react.useRef)(null);
-        var cellRef = (0, _react.useRef)(null);
         var buttonRef = (0, _react.useRef)(null);
-        var _useState = _sliced_to_array((0, _react.useState)(''), 2), filename = _useState[0], setFilename = _useState[1];
+        var fileWrapperWidthRef = (0, _react.useRef)(null);
+        var fileWrapperHelperRef = (0, _react.useRef)(null);
+        var cellHelperRefs = (0, _react.useRef)({});
+        var _useState = _sliced_to_array((0, _react.useState)({}), 2), filesInfo = _useState[0], setFilesInfo = _useState[1];
+        var _useState1 = _sliced_to_array((0, _react.useState)(false), 2), hasHiddenFiles = _useState1[0], setHasHiddenFiles = _useState1[1];
+        var filesLength = Object.keys(filesInfo).length;
         var horizontalClass = flow === 'horizontal' ? _Attachtokens.classes.horizontal : undefined;
         var verticalClass = flow === 'vertical' ? _Attachtokens.classes.vertical : undefined;
-        var withHelperTextClass = helperText ? _Attachtokens.classes.withHelperText : undefined;
         var autoClass = flow === 'auto' ? _Attachtokens.classes.auto : undefined;
+        var withHelperTextClass = helperText ? _Attachtokens.classes.withHelperText : undefined;
         var accept = acceptedFileFormats === null || acceptedFileFormats === void 0 ? void 0 : acceptedFileFormats.join(',');
-        var extension = (0, _utils1.extractExtension)(filename);
-        var filenameWithoutExtension = filename.slice(0, -1 - ((extension === null || extension === void 0 ? void 0 : extension.length) || 0));
-        var cellContentLeft = customIcon || (0, _utils1.getFileIcon)(extension, size);
         var handleClick = function(e) {
             if (!inputRef.current) {
                 return;
@@ -218,24 +243,121 @@ var attachRoot = function(Root) {
             inputRef.current.click();
         };
         var handleChange = function(e) {
-            if (!e.target.files) {
+            var fileList = e.target.files;
+            if (!fileList || fileList.length === 0) {
                 return;
             }
             if (onChange) {
                 onChange(e);
             }
-            setFilename(e.target.files[0].name);
+            if (!hasAttachment) {
+                return;
+            }
+            var fileArray = Array.from(fileList);
+            var filesData = fileArray.reduce(function(acc, file, ind) {
+                var fileKey = "".concat(ind, "_").concat(file.name);
+                acc[fileKey] = (0, _utils1.getFilenameParts)(file.name, size, customIcon);
+                return acc;
+            }, {});
+            cellHelperRefs.current = {};
+            setFilesInfo(filesData);
+            setHasHiddenFiles(false);
         };
-        var handleClear = function() {
+        var handleClear = function(fileKey) {
             if (!inputRef.current) {
                 return;
             }
             if (onClear) {
                 onClear();
             }
-            inputRef.current.value = '';
-            setFilename('');
+            setFilesInfo(function(prevFileInfo) {
+                var updatedFilesInfo = _object_spread({}, prevFileInfo);
+                delete updatedFilesInfo[fileKey];
+                return updatedFilesInfo;
+            });
+            delete cellHelperRefs.current[fileKey];
+            setHasHiddenFiles(false);
+        };
+        var getCellRef = function(element, key) {
+            if (element && (cellHelperRefs === null || cellHelperRefs === void 0 ? void 0 : cellHelperRefs.current)) {
+                cellHelperRefs.current[key] = element;
+            }
         };
+        var updateHiddenFiles = function() {
+            var newFilesInfo = _object_spread({}, filesInfo);
+            if (!multiple || Object.keys(filesInfo).length === 0) {
+                setHasHiddenFiles(false);
+                return;
+            }
+            if (flow !== 'horizontal') {
+                Object.keys(newFilesInfo).forEach(function(key) {
+                    newFilesInfo[key].isVisible = true;
+                });
+                setHasHiddenFiles(false);
+                setFilesInfo(newFilesInfo);
+                return;
+            }
+            if (!fileWrapperWidthRef.current || !fileWrapperHelperRef.current || !Object.keys(cellHelperRefs.current).length) {
+                return;
+            }
+            var fileWrapper = fileWrapperWidthRef.current;
+            var fileWrapperWidth = fileWrapper.clientWidth;
+            var _window_getComputedStyle_columnGap;
+            var fileWrapperGap = parseInt((_window_getComputedStyle_columnGap = window.getComputedStyle(fileWrapper).columnGap) !== null && _window_getComputedStyle_columnGap !== void 0 ? _window_getComputedStyle_columnGap : 0, 10);
+            var totalWidth = 0;
+            var firstHidden = Object.entries(cellHelperRefs.current).findIndex(function(param) {
+                var _param = _sliced_to_array(param, 2), _ = _param[0], cell = _param[1];
+                totalWidth += cell.clientWidth + fileWrapperGap;
+                if (totalWidth > fileWrapperWidth) {
+                    setHasHiddenFiles(true);
+                    return true;
+                }
+                return false;
+            });
+            var newKeys = Object.keys(newFilesInfo);
+            var filesInfoVisibleKeys = firstHidden >= 0 ? newKeys.slice(0, firstHidden) : newKeys;
+            var filesInfoHiddenKeys = firstHidden >= 0 ? newKeys.slice(firstHidden) : [];
+            filesInfoVisibleKeys.forEach(function(key) {
+                newFilesInfo[key].isVisible = true;
+            });
+            filesInfoHiddenKeys.forEach(function(key) {
+                newFilesInfo[key].isVisible = false;
+            });
+            setFilesInfo(newFilesInfo);
+        };
+        (0, _react.useLayoutEffect)(function() {
+            updateHiddenFiles();
+        }, [
+            filesLength,
+            flow,
+            multiple
+        ]);
+        (0, _react.useEffect)(function() {
+            if (flow !== 'horizontal' || !multiple) {
+                return;
+            }
+            var observer = new ResizeObserver(function() {
+                updateHiddenFiles();
+            });
+            if (innerRef.current) {
+                observer.observe(innerRef.current);
+            }
+            return function() {
+                return observer.disconnect();
+            };
+        }, [
+            filesLength,
+            flow,
+            multiple
+        ]);
+        var RootWrapper = function(param) {
+            var children = param.children;
+            return /*#__PURE__*/ _react.default.createElement(Root, {
+                size: size,
+                view: view
+            }, children);
+        };
+        var _dropdownOptions_placement;
         return /*#__PURE__*/ _react.default.createElement(Root, {
             className: (0, _utils.cx)(horizontalClass, verticalClass, autoClass, withHelperTextClass, className),
             style: style,
@@ -249,25 +371,65 @@ var attachRoot = function(Root) {
             type: "file",
             id: id,
             name: name,
+            multiple: multiple,
             onChange: handleChange
-        }), (!hideButtonOnAttach || !filename) && /*#__PURE__*/ _react.default.createElement(_Attachstyles.StyledAttachButtonWrapper, null, /*#__PURE__*/ _react.default.createElement(_AttachButton.AttachButton, _object_spread({
+        }), (!hideButtonOnAttach || !filesLength) && /*#__PURE__*/ _react.default.createElement(_Attachstyles.StyledAttachButtonWrapper, null, /*#__PURE__*/ _react.default.createElement(_components.AttachButton, _object_spread({
             ref: buttonRef,
             buttonType: buttonType,
             isLoading: isLoading,
             disabled: disabled,
             onClick: handleClick
-        }, rest)), helperText && /*#__PURE__*/ _react.default.createElement(_Attachstyles.StyledHelperText, null, helperText)), (hasAttachment || hideButtonOnAttach) && filename && /*#__PURE__*/ _react.default.createElement(_Cell.StyledCell, {
-            stretching: "fixed",
-            ref: cellRef,
+        }, rest)), helperText && /*#__PURE__*/ _react.default.createElement(_Attachstyles.StyledHelperText, null, helperText)), (hasAttachment || hideButtonOnAttach) && Boolean(filesLength) && Object.values(filesInfo)[0].isVisible && /*#__PURE__*/ _react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/ _react.default.createElement(_Attachstyles.FilesWrapper, {
+            className: (0, _utils.cx)(horizontalClass, verticalClass, autoClass),
+            applyOverflow: multiple && flow === 'horizontal'
+        }, Object.entries(filesInfo).map(function(param) {
+            var _param = _sliced_to_array(param, 2), key = _param[0], _param_ = _param[1], extension = _param_.extension, filenameWithoutExtension = _param_.filenameWithoutExtension, cellContentLeft = _param_.cellContentLeft, isVisible = _param_.isVisible;
+            if (!isVisible) {
+                return;
+            }
+            return /*#__PURE__*/ _react.default.createElement(_ui.CellUI, {
+                key: key,
+                filenameWithoutExtension: filenameWithoutExtension,
+                extension: extension,
+                size: size,
+                cellContentLeft: cellContentLeft,
+                multiple: multiple,
+                flow: flow,
+                onClick: function() {
+                    return handleClear(key);
+                }
+            });
+        }))), (hasAttachment || hideButtonOnAttach) && hasHiddenFiles && /*#__PURE__*/ _react.default.createElement(_ui.DropdownUI, _object_spread_props(_object_spread({
+            rootWrapper: RootWrapper,
             size: size,
-            contentLeft: cellContentLeft,
-            contentRight: /*#__PURE__*/ _react.default.createElement(_IconButtonstyles.StyledIconButtonCancel, {
-                onClick: handleClear
-            }, /*#__PURE__*/ _react.default.createElement(_Icon.IconCloseCircleOutline, {
-                size: "xs",
-                color: "inherit"
-            }))
-        }, /*#__PURE__*/ _react.default.createElement(_Attachstyles.FilenameWrapper, null, /*#__PURE__*/ _react.default.createElement(_Attachstyles.TruncatedFilenamePart, null, filenameWithoutExtension.slice(0, -1)), /*#__PURE__*/ _react.default.createElement(_Attachstyles.FilenameExtensionPart, null, filenameWithoutExtension.at(-1), ".", extension))));
+            filesInfo: filesInfo,
+            customIcon: customIcon,
+            handleClear: handleClear
+        }, dropdownOptions), {
+            placement: (_dropdownOptions_placement = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.placement) !== null && _dropdownOptions_placement !== void 0 ? _dropdownOptions_placement : 'bottom'
+        })), multiple && flow === 'horizontal' && /*#__PURE__*/ _react.default.createElement(_components.HiddenWidthHelper, {
+            ref: fileWrapperWidthRef,
+            hasHiddenFiles: hasHiddenFiles,
+            size: size
+        }), multiple && flow === 'horizontal' && (hasAttachment || hideButtonOnAttach) && Boolean(filesLength) && /*#__PURE__*/ _react.default.createElement(_Attachstyles.FilesWrapper, {
+            ref: fileWrapperHelperRef,
+            className: (0, _utils.cx)(horizontalClass, _Attachtokens.classes.horizontalHidden)
+        }, Object.entries(filesInfo).map(function(param) {
+            var _param = _sliced_to_array(param, 2), key = _param[0], _param_ = _param[1], extension = _param_.extension, filenameWithoutExtension = _param_.filenameWithoutExtension, cellContentLeft = _param_.cellContentLeft;
+            return /*#__PURE__*/ _react.default.createElement(_ui.CellUI, {
+                key: key,
+                ref: function(el) {
+                    return getCellRef(el, key);
+                },
+                filenameWithoutExtension: filenameWithoutExtension,
+                extension: extension,
+                size: size,
+                cellContentLeft: cellContentLeft,
+                multiple: multiple,
+                flow: flow,
+                isHelper: true
+            });
+        })));
     });
 };
 var attachConfig = {

package/styled-components/cjs/components/Attach/Attach.styles.js

@@ -15,6 +15,9 @@ _export(exports, {
     get FilenameWrapper () {
         return FilenameWrapper;
     },
+    get FilesWrapper () {
+        return FilesWrapper;
+    },
     get StyledAttachButtonWrapper () {
         return StyledAttachButtonWrapper;
     },
@@ -32,7 +35,7 @@ _export(exports, {
     }
 });
 var _styledcomponents = /*#__PURE__*/ _interop_require_wildcard(require("styled-components"));
-var _mixins = require("../../mixins");
+var _Attachtokens = require("./Attach.tokens");
 function _getRequireWildcardCache(nodeInterop) {
     if (typeof WeakMap !== "function") return null;
     var cacheBabelInterop = new WeakMap();
@@ -79,38 +82,63 @@ var base = (0, _styledcomponents.css)([
 ]);
 var StyledHiddenInput = _styledcomponents.default.input.withConfig({
     displayName: "Attach.styles__StyledHiddenInput",
-    componentId: "sc-ebfa8a10-0"
+    componentId: "sc-328589a4-0"
 })([
     "display:none;"
 ]);
 var StyledAttachButtonWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Attach.styles__StyledAttachButtonWrapper",
-    componentId: "sc-ebfa8a10-1"
+    componentId: "sc-328589a4-1"
 })([
     "position:relative;"
 ]);
 var StyledHelperText = _styledcomponents.default.div.withConfig({
     displayName: "Attach.styles__StyledHelperText",
-    componentId: "sc-ebfa8a10-2"
+    componentId: "sc-328589a4-2"
 })([
     "position:absolute;margin-top:0.25rem;"
 ]);
 var FilenameWrapper = _styledcomponents.default.div.withConfig({
     displayName: "Attach.styles__FilenameWrapper",
-    componentId: "sc-ebfa8a10-3"
+    componentId: "sc-328589a4-3"
 })([
-    "display:inline-grid;align-items:center;grid-template-columns:auto 1fr;min-width:8ch;"
-]);
+    "display:inline-grid;align-items:center;grid-template-columns:auto 1fr;min-width:8ch;height:",
+    ";"
+], function(param) {
+    var isInsideDropdown = param.isInsideDropdown;
+    return isInsideDropdown ? "var(".concat(_Attachtokens.tokens.filenameDropdownWrapperHeight, ")") : "var(".concat(_Attachtokens.tokens.filenameWrapperHeight, ")");
+});
+var FilesWrapper = _styledcomponents.default.div.withConfig({
+    displayName: "Attach.styles__FilesWrapper",
+    componentId: "sc-328589a4-4"
+})([
+    "display:flex;overflow:",
+    ";&.",
+    "{flex-direction:row;}&.",
+    "{flex-direction:column;}&.",
+    "{flex-wrap:wrap;}&.",
+    "{position:absolute;top:0;left:0;z-index:-999;visibility:hidden;opacity:0;max-width:100%;overflow:hidden;}"
+], function(param) {
+    var applyOverflow = param.applyOverflow;
+    return applyOverflow ? 'hidden' : 'unset';
+}, _Attachtokens.classes.horizontal, _Attachtokens.classes.vertical, _Attachtokens.classes.auto, _Attachtokens.classes.horizontalHidden);
 var TruncatedFilenamePart = _styledcomponents.default.span.withConfig({
     displayName: "Attach.styles__TruncatedFilenamePart",
-    componentId: "sc-ebfa8a10-4"
+    componentId: "sc-328589a4-5"
 })([
-    "",
-    ""
-], (0, _mixins.applyEllipsis)());
+    "overflow:",
+    ";text-overflow:",
+    ";white-space:nowrap;"
+], function(param) {
+    var applyEllipsis = param.applyEllipsis;
+    return applyEllipsis ? 'hidden' : 'visible';
+}, function(param) {
+    var applyEllipsis = param.applyEllipsis;
+    return applyEllipsis ? 'ellipsis' : 'unset';
+});
 var FilenameExtensionPart = _styledcomponents.default.span.withConfig({
     displayName: "Attach.styles__FilenameExtensionPart",
-    componentId: "sc-ebfa8a10-5"
+    componentId: "sc-328589a4-6"
 })([
     ""
 ]);

package/styled-components/cjs/components/Attach/Attach.tokens.js

@@ -17,17 +17,19 @@ _export(exports, {
     }
 });
 var classes = {
-    auto: 'auto',
-    horizontal: 'horizontal',
-    vertical: 'vertical',
-    withHelperText: 'with-helper-text',
-    cellHidden: 'cell-hidden'
+    auto: 'plasma-attach-auto',
+    horizontal: 'plasma-attach-horizontal',
+    horizontalHidden: 'plasma-attach-horizontal-hidden',
+    vertical: 'plasma-attach-vertical',
+    withHelperText: 'plasma-attach-with-helper-text',
+    cellHidden: 'plasma-attach-cell-hidden'
 };
 var tokens = {
     horizontalGap: '--plasma-attach-horizontal-gap',
     verticalGap: '--plasma-attach-vertical-gap',
     verticalGapWithHelperText: '--plasma-attach-vertical-gap-with-helper-text',
     filenameWrapperHeight: '--plasma-attach-filename-wrapper-height',
+    filenameDropdownWrapperHeight: '--plasma-attach-filename-dropdown-wrapper-height',
     helperTextColor: '--plasma-attach-helper-text-color',
     // Токены для Button
     buttonColor: '--plasma-attach-button-color',
@@ -140,5 +142,18 @@ var tokens = {
     iconButtonCancelDisabledOpacity: '--plasma-attach-icon-button-cancel-disabled-opacity',
     iconButtonCancelFocusColor: '--plasma-attach-icon-button-cancel-focus-color',
     iconButtonCancelSpinnerColor: '--plasma-attach-icon-button-cancel-spinner-color',
-    iconButtonCancelSpinnerSize: '--plasma-attach-icon-button-cancel-spinner-size'
+    iconButtonCancelSpinnerSize: '--plasma-attach-icon-button-cancel-spinner-size',
+    // Токены для MoreIcon
+    moreIconPadding: '--plasma-attach-more-icon-padding',
+    moreIconColor: '--plasma-attach-more-icon-color',
+    moreIconColorHover: '--plasma-attach-more-icon-color-hover',
+    // Токены для Dropdown
+    dropdownBackground: '--plasma-attach-dropdown-background',
+    dropdownBoxShadow: '--plasma-attach-dropdown-box-shadow',
+    dropdownWidth: '--plasma-attach-dropdown-width',
+    dropdownBorderRadius: '--plasma-attach-dropdown-border-radius',
+    dropdownPadding: '--plasma-attach-dropdown-padding',
+    dropdownBorderColor: '--plasma-attach-dropdown-border-color',
+    dropdownBorderWidth: '--plasma-attach-dropdown-border-width',
+    dropdownItemPadding: '--plasma-attach-dropdown-item-padding'
 };