feat(*): Flow component

salute-developers · Dec 27, 2024 · f82692c · f82692c
1 parent 28cb052
commit f82692c
Show file tree

Hide file tree

Showing 106 changed files with 3,125 additions and 134 deletions.
diff --git a/...components/Flow/Flow.component-test.tsx/plasma-b2c Flow -- flex-rapgap.snap.png b/...components/Flow/Flow.component-test.tsx/plasma-b2c Flow -- flex-rapgap.snap.png
diff --git a/...ow/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentcenter.snap.png b/...ow/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentcenter.snap.png
diff --git a/.../Flow/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentend.snap.png b/.../Flow/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentend.snap.png
diff --git a/...low/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentstart.snap.png b/...low/Flow.component-test.tsx/plasma-b2c Flow -- flex-wrapalignmentstart.snap.png
diff --git a/.../Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementcenter.snap.png b/.../Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementcenter.snap.png
diff --git a/...low/Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementend.snap.png b/...low/Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementend.snap.png
diff --git a/....component-test.tsx/plasma-b2c Flow -- flex-wraparrangementspaceAround.snap.png b/....component-test.tsx/plasma-b2c Flow -- flex-wraparrangementspaceAround.snap.png
diff --git a/...component-test.tsx/plasma-b2c Flow -- flex-wraparrangementspaceBetween.snap.png b/...component-test.tsx/plasma-b2c Flow -- flex-wraparrangementspaceBetween.snap.png
diff --git a/...w/Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementstart.snap.png b/...w/Flow.component-test.tsx/plasma-b2c Flow -- flex-wraparrangementstart.snap.png
diff --git a/...s/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentcenter.snap.png b/...s/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentcenter.snap.png
diff --git a/...ents/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentend.snap.png b/...ents/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentend.snap.png
diff --git a/...ts/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentstart.snap.png b/...ts/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesalignmentstart.snap.png
diff --git a/...Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementcenter.snap.png b/...Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementcenter.snap.png
diff --git a/...ts/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementend.snap.png b/...ts/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementend.snap.png
diff --git a/...Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementspaceAround.snap.png b/...Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementspaceAround.snap.png
diff --git a/...low.component-test.tsx/plasma-b2c Flow -- linesarrangementspaceBetween.snap.png b/...low.component-test.tsx/plasma-b2c Flow -- linesarrangementspaceBetween.snap.png
diff --git a/.../Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementstart.snap.png b/.../Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesarrangementstart.snap.png
diff --git a/...2c/components/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesgap.snap.png b/...2c/components/Flow/Flow.component-test.tsx/plasma-b2c Flow -- linesgap.snap.png
diff --git a/...components/Flow/Flow.component-test.tsx/plasma-web Flow -- flex-rapgap.snap.png b/...components/Flow/Flow.component-test.tsx/plasma-web Flow -- flex-rapgap.snap.png
diff --git a/...ow/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentcenter.snap.png b/...ow/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentcenter.snap.png
diff --git a/.../Flow/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentend.snap.png b/.../Flow/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentend.snap.png
diff --git a/...low/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentstart.snap.png b/...low/Flow.component-test.tsx/plasma-web Flow -- flex-wrapalignmentstart.snap.png
diff --git a/.../Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementcenter.snap.png b/.../Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementcenter.snap.png
diff --git a/...low/Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementend.snap.png b/...low/Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementend.snap.png
diff --git a/....component-test.tsx/plasma-web Flow -- flex-wraparrangementspaceAround.snap.png b/....component-test.tsx/plasma-web Flow -- flex-wraparrangementspaceAround.snap.png
diff --git a/...component-test.tsx/plasma-web Flow -- flex-wraparrangementspaceBetween.snap.png b/...component-test.tsx/plasma-web Flow -- flex-wraparrangementspaceBetween.snap.png
diff --git a/...w/Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementstart.snap.png b/...w/Flow.component-test.tsx/plasma-web Flow -- flex-wraparrangementstart.snap.png
diff --git a/...s/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentcenter.snap.png b/...s/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentcenter.snap.png
diff --git a/...ents/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentend.snap.png b/...ents/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentend.snap.png
diff --git a/...ts/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentstart.snap.png b/...ts/Flow/Flow.component-test.tsx/plasma-web Flow -- linesalignmentstart.snap.png
diff --git a/...Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementcenter.snap.png b/...Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementcenter.snap.png
diff --git a/...ts/Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementend.snap.png b/...ts/Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementend.snap.png
diff --git a/...Flow.component-test.tsx/plasma-web Flow -- linesarrangementspaceAround.snap.png b/...Flow.component-test.tsx/plasma-web Flow -- linesarrangementspaceAround.snap.png
diff --git a/...low.component-test.tsx/plasma-web Flow -- linesarrangementspaceBetween.snap.png b/...low.component-test.tsx/plasma-web Flow -- linesarrangementspaceBetween.snap.png
diff --git a/.../Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementstart.snap.png b/.../Flow/Flow.component-test.tsx/plasma-web Flow -- linesarrangementstart.snap.png
diff --git a/...eb/components/Flow/Flow.component-test.tsx/plasma-web Flow -- linesgap.snap.png b/...eb/components/Flow/Flow.component-test.tsx/plasma-web Flow -- linesgap.snap.png
diff --git a/packages/plasma-asdk/api/plasma-asdk.api.md b/packages/plasma-asdk/api/plasma-asdk.api.md
@@ -157,7 +157,7 @@ contentPlacing?: ("default" | "relaxed") | undefined;
 isLoading?: boolean | undefined;
 loader?: ReactNode;
 stretch?: boolean | undefined;
-stretching?: ("fixed" | "auto" | "filled") | undefined;
+stretching?: ("auto" | "filled" | "fixed") | undefined;
 square?: boolean | undefined;
 focused?: boolean | undefined;
 disabled?: boolean | undefined;
@@ -178,7 +178,7 @@ contentPlacing?: ("default" | "relaxed") | undefined;
 isLoading?: boolean | undefined;
 loader?: ReactNode;
 stretch?: boolean | undefined;
-stretching?: ("fixed" | "auto" | "filled") | undefined;
+stretching?: ("auto" | "filled" | "fixed") | undefined;
 square?: boolean | undefined;
 focused?: boolean | undefined;
 disabled?: boolean | undefined;

diff --git a/packages/plasma-b2c/api/plasma-b2c.api.md b/packages/plasma-b2c/api/plasma-b2c.api.md
@@ -149,6 +149,7 @@ import { extractTextFrom } from '@salutejs/plasma-core';
 import { FC } from 'react';
 import { FileProcessHandler } from '@salutejs/plasma-new-hope/types/components/Dropzone/Dropzone.types';
 import { Filter } from '@salutejs/plasma-new-hope/types/engines/types';
+import { FlowProps } from '@salutejs/plasma-new-hope/styled-components';
 import { FocusProps } from '@salutejs/plasma-core';
 import { formatCurrency } from '@salutejs/plasma-core';
 import { FormTypeNumber } from '@salutejs/plasma-new-hope/types/types/FormType';
@@ -167,8 +168,9 @@ import { ImageProps } from '@salutejs/plasma-new-hope/styled-components';
 import { ImgHTMLAttributes } from 'react';
 import { IndicatorProps } from '@salutejs/plasma-new-hope/styled-components';
 import { InputHTMLAttributes } from '@salutejs/plasma-core';
-import { InputHTMLAttributes as InputHTMLAttributes_2 } from '@salutejs/plasma-new-hope/styled-components';
-import { InputHTMLAttributes as InputHTMLAttributes_3 } from 'react';
+import { InputHTMLAttributes as InputHTMLAttributes_2 } from '@salutejs/plasma-hope';
+import { InputHTMLAttributes as InputHTMLAttributes_3 } from '@salutejs/plasma-new-hope/styled-components';
+import { InputHTMLAttributes as InputHTMLAttributes_4 } from 'react';
 import type { ItemOption } from '@salutejs/plasma-new-hope';
 import { JSXElementConstructor } from 'react';
 import { KeyboardEvent as KeyboardEvent_2 } from 'react';
@@ -713,7 +715,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -745,7 +747,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -775,7 +777,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -807,7 +809,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -837,7 +839,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -869,7 +871,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -899,7 +901,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>) | (BaseProps & Omit<{
 titleCaption?: ReactNode;
 leftHelper?: ReactNode;
 contentLeft?: ReactElement<any, string | JSXElementConstructor<any>> | undefined;
@@ -931,7 +933,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>))>;
+}, "labelPlacement" | "enumerationType" | "chipType" | "chipView" | "chips" | "onChangeChips" | "chipValidator"> & Omit<InputHTMLAttributes_4<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement>))>;
 
 // @public (undocumented)
 export const Avatar: FunctionComponent<PropsType<    {
@@ -1964,7 +1966,7 @@ onDragOver?: ((event: DragEvent_2<HTMLDivElement>) => void) | undefined;
 validator?: ((files: File[]) => ValidatorReturnType) | undefined;
 onDrop?: FileProcessHandler | undefined;
 onChoseFiles?: FileProcessHandler | undefined;
-} & InputHTMLAttributes_3<HTMLInputElement> & RefAttributes<HTMLInputElement>>;
+} & InputHTMLAttributes_4<HTMLInputElement> & RefAttributes<HTMLInputElement>>;
 
 export { dropzoneClasses }
 
@@ -2029,6 +2031,11 @@ xs: PolymorphicClassName;
 
 export { extractTextFrom }
 
+// @public (undocumented)
+export const Flow: FunctionComponent<PropsType<    {}> & FlowProps & {
+minColWidth?: string | undefined;
+} & RefAttributes<HTMLDivElement>>;
+
 export { FocusProps }
 
 // @public (undocumented)
@@ -2408,7 +2415,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2486,7 +2493,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2562,7 +2569,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2640,7 +2647,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2716,7 +2723,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2794,7 +2801,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2870,7 +2877,7 @@ onSearch?: ((value: string, event?: KeyboardEvent_2<HTMLInputElement> | undefine
 chipType?: undefined;
 chipView?: undefined;
 chipValidator?: undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref"> | Omit<PropsType<    {
 view: {
 default: PolymorphicClassName;
 positive: PolymorphicClassName;
@@ -2948,7 +2955,7 @@ chipView?: string | undefined;
 chipValidator?: ((value: string) => {
 view?: string | undefined;
 }) | undefined;
-} & Omit<InputHTMLAttributes_2<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref">) & RefAttributes<HTMLInputElement>>;
+} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "size" | "required"> & RefAttributes<HTMLInputElement> & MaskProps, "ref">) & RefAttributes<HTMLInputElement>>;
 
 export { MaxLinesProps }
 
@@ -3093,7 +3100,7 @@ onDecrement?: ((value: number) => void) | undefined;
 } & {
 segmentation?: "clear" | undefined;
 inputBackgroundType?: undefined;
-} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>) | ({
+} & Omit<InputHTMLAttributes_4<HTMLInputElement>, "onChange" | "value" | "size"> & RefAttributes<HTMLInputElement>) | ({
 value?: number | undefined;
 min?: number | undefined;
 max?: number | undefined;
@@ -3118,7 +3125,7 @@ onDecrement?: ((value: number) => void) | undefined;
 } & {
 segmentation?: string | undefined;
 inputBackgroundType?: string | undefined;
-} & Omit<InputHTMLAttributes_3<HTMLInputElement>, "onChange" | "size" | "value"> & RefAttributes<HTMLInputElement>))>;
+} & Omit<InputHTMLAttributes_4<HTMLInputElement>, "onChange" | "value" | "size"> & RefAttributes<HTMLInputElement>))>;
 
 export { numberInputClasses }
 
@@ -3286,7 +3293,7 @@ true: PolymorphicClassName;
 focused: {
 true: PolymorphicClassName;
 };
-}> & Filter<InputHTMLAttributes_2<HTMLInputElement>, "size"> & Omit<BaseboxProps, "indeterminate"> & RefAttributes<HTMLInputElement>>;
+}> & Filter<InputHTMLAttributes_3<HTMLInputElement>, "size"> & Omit<BaseboxProps, "indeterminate"> & RefAttributes<HTMLInputElement>>;
 
 // Warning: (ae-forgotten-export) The symbol "RadioboxComponent" needs to be exported by the entry point index.d.ts
 //

diff --git a/packages/plasma-b2c/src/components/Flow/Flow.component-test.tsx b/packages/plasma-b2c/src/components/Flow/Flow.component-test.tsx
@@ -0,0 +1,153 @@
+import { mount, CypressTestDecorator, getComponent } from '@salutejs/plasma-cy-utils';
+import React from 'react';
+import styled from 'styled-components';
+
+const arrangements = ['start', 'center', 'end', 'spaceBetween', 'spaceAround'];
+const alignments = ['start', 'center', 'end'];
+
+const widths = [100, 32, 171, 74, 179, 55];
+const heights = [10, 50, 45, 33, 14, 55];
+
+const itemsCount = widths.length;
+
+const Item = styled.div`
+    padding: 0.5rem 1rem;
+    border-radius: 0.5rem;
+    background: #aab1e9;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+`;
+
+describe('plasma-b2c: Flow', () => {
+    const Flow = getComponent('Flow');
+
+    const FlowCustom = styled(Flow)`
+        background: var(--surface-transparent-primary);
+        border-radius: 0.5rem;
+    `;
+
+    const Demo: React.FC<any> = (props) => {
+        return (
+            <CypressTestDecorator>
+                <FlowCustom
+                    {...props}
+                    style={{
+                        maxWidth: '28rem',
+                        height: '13rem',
+                    }}
+                >
+                    {new Array(itemsCount).fill(null).map((width, index) => (
+                        <Item
+                            key={index}
+                            style={{
+                                minWidth: widths[index % widths.length],
+                                minHeight: heights[index % heights.length],
+                            }}
+                        >
+                            {index + 1}
+                        </Item>
+                    ))}
+                </FlowCustom>
+            </CypressTestDecorator>
+        );
+    };
+
+    arrangements.forEach((arrangement) => {
+        it(`flex-wrap:arrangement:${arrangement}`, () => {
+            mount(
+                <>
+                    <Demo orientation="horizontal" arrangement={arrangement} alignment="center" />
+                    <Demo orientation="vertical" arrangement={arrangement} alignment="center" />
+                </>,
+            );
+
+            cy.matchImageSnapshot();
+        });
+    });
+    alignments.forEach((alignment) => {
+        it(`flex-wrap:alignment:${alignment}`, () => {
+            mount(
+                <>
+                    <Demo orientation="horizontal" arrangement="center" alignment={alignment} />
+                    <Demo orientation="vertical" arrangement="center" alignment={alignment} />
+                </>,
+            );
+
+            cy.matchImageSnapshot();
+        });
+    });
+
+    arrangements.forEach((arrangement) => {
+        it(`lines:arrangement:${arrangement}`, () => {
+            mount(
+                <>
+                    <Demo orientation="horizontal" arrangement={arrangement} alignment="center" itemsPerLine={3} />
+                    <Demo orientation="vertical" arrangement={arrangement} alignment="center" itemsPerLine={3} />
+                </>,
+            );
+
+            cy.matchImageSnapshot();
+        });
+    });
+    alignments.forEach((alignment) => {
+        it(`lines:alignment:${alignment}`, () => {
+            mount(
+                <>
+                    <Demo orientation="horizontal" arrangement="center" alignment={alignment} itemsPerLine={3} />
+                    <Demo orientation="vertical" arrangement="center" alignment={alignment} itemsPerLine={3} />
+                </>,
+            );
+
+            cy.matchImageSnapshot();
+        });
+    });
+
+    it('flex-rap:gap', () => {
+        mount(
+            <>
+                <Demo
+                    mainAxisGap="0.5rem"
+                    crossAxisGap="2rem"
+                    orientation="horizontal"
+                    arrangement="center"
+                    alignment="center"
+                />
+                <Demo
+                    mainAxisGap="0.5rem"
+                    crossAxisGap="2rem"
+                    orientation="vertical"
+                    arrangement="center"
+                    alignment="center"
+                />
+            </>,
+        );
+
+        cy.matchImageSnapshot();
+    });
+
+    it('lines:gap', () => {
+        mount(
+            <>
+                <Demo
+                    mainAxisGap="2rem"
+                    crossAxisGap="1rem"
+                    itemsPerLine={3}
+                    orientation="horizontal"
+                    arrangement="center"
+                    alignment="center"
+                />
+                <Demo
+                    mainAxisGap="2rem"
+                    crossAxisGap="1rem"
+                    itemsPerLine={3}
+                    orientation="vertical"
+                    arrangement="center"
+                    alignment="center"
+                />
+            </>,
+        );
+
+        cy.matchImageSnapshot();
+    });
+});
diff --git a/packages/plasma-b2c/src/components/Flow/Flow.config.ts b/packages/plasma-b2c/src/components/Flow/Flow.config.ts
@@ -0,0 +1,4 @@
+export const config = {
+    defaults: {},
+    variations: {},
+};