Merge remote-tracking branch 'origin/next'

skbkontur · Dec 4, 2024 · 11c0376 · 11c0376
2 parents 54a6db8 + 5a0c990
commit 11c0376
Show file tree

Hide file tree

Showing 20 changed files with 58 additions and 13 deletions.
diff --git a/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/0.png b/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/0.png
diff --git a/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/1.png b/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/1.png
diff --git a/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/2.png b/...eact-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022/2.png
diff --git a/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/0.png b/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/0.png
diff --git a/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/1.png b/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/1.png
diff --git a/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/2.png b/...-ui/.creevey/images/TokenInput/size/MenuItem inherits size/chrome2022Dark/2.png
diff --git a/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/0.png b/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/0.png
diff --git a/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/1.png b/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/1.png
diff --git a/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/2.png b/...act-ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022/2.png
diff --git a/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/0.png b/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/0.png
diff --git a/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/1.png b/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/1.png
diff --git a/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/2.png b/...ui/.creevey/images/TokenInput/size/MenuItem inherits size/firefox2022Dark/2.png
diff --git a/packages/react-ui/.creevey/images/TokenInput/size/chrome2022.png b/packages/react-ui/.creevey/images/TokenInput/size/chrome2022.png
diff --git a/packages/react-ui/.creevey/images/TokenInput/size/chrome2022Dark.png b/packages/react-ui/.creevey/images/TokenInput/size/chrome2022Dark.png
diff --git a/packages/react-ui/.creevey/images/TokenInput/size/firefox2022.png b/packages/react-ui/.creevey/images/TokenInput/size/firefox2022.png
diff --git a/packages/react-ui/.creevey/images/TokenInput/size/firefox2022Dark.png b/packages/react-ui/.creevey/images/TokenInput/size/firefox2022Dark.png
diff --git a/packages/react-ui/components/TokenInput/TokenInput.tsx b/packages/react-ui/components/TokenInput/TokenInput.tsx
@@ -537,6 +537,7 @@ export class TokenInput<T = string> extends React.PureComponent<TokenInputProps<
                 menuAlign={menuAlign}
                 renderTotalCount={renderTotalCount}
                 totalCount={totalCount}
+                size={this.getProps().size}
               />
             )}
             {this.renderTokensEnd()}

diff --git a/packages/react-ui/components/TokenInput/TokenInputMenu.tsx b/packages/react-ui/components/TokenInput/TokenInputMenu.tsx
@@ -104,6 +104,7 @@ export class TokenInputMenu<T = string> extends React.Component<TokenInputMenuPr
         withoutMobile
       >
         <ComboBoxMenu
+          size={this.props.size}
           items={items}
           loading={loading}
           hasMargin={false}

diff --git a/packages/react-ui/components/TokenInput/__creevey__/TokenInput.creevey.ts b/packages/react-ui/components/TokenInput/__creevey__/TokenInput.creevey.ts
@@ -391,4 +391,23 @@ kind('TokenInput', () => {
       await this.expect(await this.takeScreenshot()).to.matchImage();
     });
   });
+
+  story('Size', ({ setStoryParameters }) => {
+    setStoryParameters({
+      captureElement: '[data-tid="Gapped__vertical"]',
+    });
+
+    test('MenuItem inherits size', async function () {
+      await this.browser.actions({ bridge: true }).keyDown(this.keys.TAB).perform();
+      const tab1 = await this.takeScreenshot();
+
+      await this.browser.actions({ bridge: true }).keyDown(this.keys.TAB).perform();
+      const tab2 = await this.takeScreenshot();
+
+      await this.browser.actions({ bridge: true }).keyDown(this.keys.TAB).perform();
+      const tab3 = await this.takeScreenshot();
+
+      await this.expect([tab1, tab2, tab3]).to.matchImages();
+    });
+  });
 });
diff --git a/packages/react-ui/components/TokenInput/__stories__/TokenInput.stories.tsx b/packages/react-ui/components/TokenInput/__stories__/TokenInput.stories.tsx
@@ -293,7 +293,7 @@ CustomRenderTotalCount.storyName = 'custom render total count';
 
 export const Size = () => {
   return (
-    <Gapped vertical gap={10}>
+    <Gapped vertical gap={10} style={{ padding: '10px 10px 120px' }}>
       <Wrapper numberItems={5} getItems={getItems} size="small" />
       <Wrapper numberItems={5} getItems={getItems} size="medium" />
       <Wrapper numberItems={5} getItems={getItems} size="large" />