@salutejs/plasma-new-hope 0.163.1-canary.1476.11275359231.0 → 0.163.1-canary.1479.11291358294.0

package/emotion/cjs/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx

@@ -50,8 +50,6 @@ const getContentRight = (contentRightOption: string, size: Size) => {
 };
 
 type StoryTabsProps = ComponentProps<typeof Tabs> & CustomStoryTabsProps;
-type HorizontalStoryTabsProps = StoryTabsProps & { width: string };
-type VerticalStoryTabsProps = StoryTabsProps & { height: string };
 
 const meta: Meta<StoryTabsProps> = {
     title: 'plasma_b2c/Tabs',
@@ -81,7 +79,7 @@ const meta: Meta<StoryTabsProps> = {
 
 export default meta;
 
-const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -136,7 +134,7 @@ const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -146,13 +144,18 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        width,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
 
     return (
-        <Tabs clip={clip} view={hasDivider ? 'divider' : 'clear'} disabled={disabled} size={size} style={{ width }}>
+        <Tabs
+            clip={clip}
+            view={hasDivider ? 'divider' : 'clear'}
+            disabled={disabled}
+            size={size}
+            style={{ width: '15rem' }}
+        >
             {items.map((_, i) => {
                 if (helperText !== '') {
                     return (
@@ -192,7 +195,7 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -279,15 +282,13 @@ const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
+export const HorizontalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
         hasDivider: true,
         helperText: '',
         itemQuantity: 8,
-        stretch: false,
-        width: '15rem',
     },
     argTypes: {
         contentLeft: {
@@ -309,12 +310,6 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
             },
             if: { arg: 'stretch', truthy: false },
         },
-        width: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
         size: {
             options: sizes,
             control: {
@@ -334,7 +329,7 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
     },
 };
 
-const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
+const StoryVerticalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -390,7 +385,7 @@ const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -400,7 +395,6 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        height,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
@@ -411,8 +405,8 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
             size={size as Size}
             disabled={disabled}
             clip={clip}
+            style={{ height: '10rem' }}
             hasDivider={hasDivider}
-            style={{ height }}
         >
             {items.map((_, i) => {
                 if (helperText !== '') {
@@ -455,7 +449,7 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -543,7 +537,7 @@ const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
+export const VerticalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
@@ -551,7 +545,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
         itemQuantity: 8,
         orientation: 'vertical',
         helperText: '',
-        height: '10rem',
     },
     argTypes: {
         contentLeft: {
@@ -584,12 +577,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
                 disable: true,
             },
         },
-        height: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
     },
     render: (args) => {
         switch (args.clip) {

package/emotion/cjs/examples/plasma_web/components/Tabs/Tabs.stories.tsx

@@ -50,8 +50,6 @@ const getContentRight = (contentRightOption: string, size: Size) => {
 };
 
 type StoryTabsProps = ComponentProps<typeof Tabs> & CustomStoryTabsProps;
-type HorizontalStoryTabsProps = StoryTabsProps & { width: string };
-type VerticalStoryTabsProps = StoryTabsProps & { height: string };
 
 const meta: Meta<StoryTabsProps> = {
     title: 'plasma_web/Tabs',
@@ -81,7 +79,7 @@ const meta: Meta<StoryTabsProps> = {
 
 export default meta;
 
-const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -136,7 +134,7 @@ const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -146,13 +144,18 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        width,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
 
     return (
-        <Tabs clip={clip} view={hasDivider ? 'divider' : 'clear'} disabled={disabled} size={size} style={{ width }}>
+        <Tabs
+            clip={clip}
+            view={hasDivider ? 'divider' : 'clear'}
+            disabled={disabled}
+            size={size}
+            style={{ width: '15rem' }}
+        >
             {items.map((_, i) => {
                 if (helperText !== '') {
                     return (
@@ -192,7 +195,7 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -279,15 +282,13 @@ const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
+export const HorizontalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
         hasDivider: true,
         helperText: '',
         itemQuantity: 8,
-        stretch: false,
-        width: '15rem',
     },
     argTypes: {
         contentLeft: {
@@ -309,12 +310,6 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
             },
             if: { arg: 'stretch', truthy: false },
         },
-        width: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
         size: {
             options: sizes,
             control: {
@@ -334,7 +329,7 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
     },
 };
 
-const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
+const StoryVerticalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -390,7 +385,7 @@ const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -400,7 +395,6 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        height,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
@@ -411,8 +405,8 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
             size={size as Size}
             disabled={disabled}
             clip={clip}
+            style={{ height: '10rem' }}
             hasDivider={hasDivider}
-            style={{ height }}
         >
             {items.map((_, i) => {
                 if (helperText !== '') {
@@ -455,7 +449,7 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -543,7 +537,7 @@ const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
+export const VerticalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
@@ -551,7 +545,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
         itemQuantity: 8,
         orientation: 'vertical',
         helperText: '',
-        height: '10rem',
     },
     argTypes: {
         contentLeft: {
@@ -584,12 +577,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
                 disable: true,
             },
         },
-        height: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
     },
     render: (args) => {
         switch (args.clip) {

package/emotion/es/components/Attach/Attach.js

@@ -1,5 +1,5 @@
 var _IconCloseCircleOutli;
-var _excluded = ["flow", "buttonType", "hasAttachment", "acceptedFileFormats", "size", "view", "className", "style", "isLoading", "disabled"];
+var _excluded = ["flow", "buttonType", "hasAttachment", "acceptedFileFormats", "size", "view", "className", "style", "isLoading", "disabled", "id", "name", "onChange"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -36,6 +36,9 @@ export var attachRoot = function attachRoot(Root) {
       style = props.style,
       isLoading = props.isLoading,
       disabled = props.disabled,
+      id = props.id,
+      name = props.name,
+      onChange = props.onChange,
       rest = _objectWithoutProperties(props, _excluded);
     var innerRef = useRef(null);
     var ref = useForkRef(outerRef, innerRef);
@@ -104,11 +107,14 @@ export var attachRoot = function attachRoot(Root) {
       }
       inputRef.current.click();
     };
-    var handleChange = function handleChange() {
-      if (!inputRef.current || !inputRef.current.files) {
+    var handleChange = function handleChange(e) {
+      if (!e.target.files) {
         return;
       }
-      setFilename(inputRef.current.files[0].name);
+      if (onChange) {
+        onChange(e);
+      }
+      setFilename(e.target.files[0].name);
     };
     var handleClear = function handleClear() {
       if (!inputRef.current) {
@@ -128,12 +134,11 @@ export var attachRoot = function attachRoot(Root) {
       ref: inputRef,
       accept: accept,
       type: "file",
-      id: "attachHiddenInput",
-      name: "attachHiddenInput",
+      id: id,
+      name: name,
       onChange: handleChange
     }), /*#__PURE__*/React.createElement(StyledHiddenInputHelper, {
-      ref: inputHelperRef,
-      id: "attachHiddenInputHelper"
+      ref: inputHelperRef
     }, filename), /*#__PURE__*/React.createElement(AttachButton, _extends({
       buttonType: buttonType,
       view: view,

package/emotion/es/components/Tabs/ui/horizontal/HorizontalTabs/HorizontalTabs.js

@@ -83,7 +83,7 @@ export var horizontalTabsRoot = function horizontalTabsRoot(Root) {
       });
       firstOverflowingTab === null || firstOverflowingTab === void 0 || (_firstOverflowingTab$ = firstOverflowingTab.current) === null || _firstOverflowingTab$ === void 0 || _firstOverflowingTab$.scrollIntoView({
         block: 'nearest',
-        inline: 'start'
+        inline: 'nearest'
       });
     }, [disabled, scrollRef, refs]);
     var onNext = useCallback(function () {
@@ -101,7 +101,7 @@ export var horizontalTabsRoot = function horizontalTabsRoot(Root) {
       });
       lastOverflowingTab === null || lastOverflowingTab === void 0 || (_lastOverflowingTab$c = lastOverflowingTab.current) === null || _lastOverflowingTab$c === void 0 || _lastOverflowingTab$c.scrollIntoView({
         block: 'nearest',
-        inline: 'end'
+        inline: 'nearest'
       });
     }, [disabled, scrollRef, refs]);
     var PreviousButton = useMemo(function () {

package/emotion/es/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.js

@@ -76,7 +76,7 @@ export var verticalTabsRoot = function verticalTabsRoot(Root) {
         return tabStartY < scrollTop;
       });
       firstOverflowingTab === null || firstOverflowingTab === void 0 || (_firstOverflowingTab$ = firstOverflowingTab.current) === null || _firstOverflowingTab$ === void 0 || _firstOverflowingTab$.scrollIntoView({
-        block: 'start',
+        block: 'nearest',
         inline: 'nearest'
       });
     }, [disabled, scrollRef, refs]);
@@ -94,7 +94,7 @@ export var verticalTabsRoot = function verticalTabsRoot(Root) {
         return tabEndY > scrollBottom;
       });
       lastOverflowingTab === null || lastOverflowingTab === void 0 || (_lastOverflowingTab$c = lastOverflowingTab.current) === null || _lastOverflowingTab$c === void 0 || _lastOverflowingTab$c.scrollIntoView({
-        block: 'end',
+        block: 'nearest',
         inline: 'nearest'
       });
     }, [disabled, scrollRef, refs]);

package/emotion/es/examples/plasma_b2c/components/Tabs/Tabs.stories.tsx

@@ -50,8 +50,6 @@ const getContentRight = (contentRightOption: string, size: Size) => {
 };
 
 type StoryTabsProps = ComponentProps<typeof Tabs> & CustomStoryTabsProps;
-type HorizontalStoryTabsProps = StoryTabsProps & { width: string };
-type VerticalStoryTabsProps = StoryTabsProps & { height: string };
 
 const meta: Meta<StoryTabsProps> = {
     title: 'plasma_b2c/Tabs',
@@ -81,7 +79,7 @@ const meta: Meta<StoryTabsProps> = {
 
 export default meta;
 
-const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -136,7 +134,7 @@ const StoryHorizontalDefault = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -146,13 +144,18 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        width,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
 
     return (
-        <Tabs clip={clip} view={hasDivider ? 'divider' : 'clear'} disabled={disabled} size={size} style={{ width }}>
+        <Tabs
+            clip={clip}
+            view={hasDivider ? 'divider' : 'clear'}
+            disabled={disabled}
+            size={size}
+            style={{ width: '15rem' }}
+        >
             {items.map((_, i) => {
                 if (helperText !== '') {
                     return (
@@ -192,7 +195,7 @@ const StoryHorizontalScroll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
+const StoryHorizontalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -279,15 +282,13 @@ const StoryHorizontalShowAll = (props: HorizontalStoryTabsProps) => {
     );
 };
 
-export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
+export const HorizontalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
         hasDivider: true,
         helperText: '',
         itemQuantity: 8,
-        stretch: false,
-        width: '15rem',
     },
     argTypes: {
         contentLeft: {
@@ -309,12 +310,6 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
             },
             if: { arg: 'stretch', truthy: false },
         },
-        width: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
         size: {
             options: sizes,
             control: {
@@ -334,7 +329,7 @@ export const HorizontalTabs: StoryObj<HorizontalStoryTabsProps> = {
     },
 };
 
-const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
+const StoryVerticalDefault = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -390,7 +385,7 @@ const StoryVerticalDefault = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalScroll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -400,7 +395,6 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
         contentRight: contentRightOption,
         hasDivider,
         helperText,
-        height,
     } = props;
     const items = Array(itemQuantity).fill(0);
     const [index, setIndex] = useState(0);
@@ -411,8 +405,8 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
             size={size as Size}
             disabled={disabled}
             clip={clip}
+            style={{ height: '10rem' }}
             hasDivider={hasDivider}
-            style={{ height }}
         >
             {items.map((_, i) => {
                 if (helperText !== '') {
@@ -455,7 +449,7 @@ const StoryVerticalScroll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
+const StoryVerticalShowAll = (props: StoryTabsProps) => {
     const {
         disabled,
         itemQuantity,
@@ -543,7 +537,7 @@ const StoryVerticalShowAll = (props: VerticalStoryTabsProps) => {
     );
 };
 
-export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
+export const VerticalTabs: StoryObj<StoryTabsProps> = {
     args: {
         size: 'xs',
         disabled: false,
@@ -551,7 +545,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
         itemQuantity: 8,
         orientation: 'vertical',
         helperText: '',
-        height: '10rem',
     },
     argTypes: {
         contentLeft: {
@@ -584,12 +577,6 @@ export const VerticalTabs: StoryObj<VerticalStoryTabsProps> = {
                 disable: true,
             },
         },
-        height: {
-            control: {
-                type: 'text',
-            },
-            if: { arg: 'clip', eq: 'scroll' },
-        },
     },
     render: (args) => {
         switch (args.clip) {