From cd5ac208bf03aadc1f559f15136ecc9b6d91b557 Mon Sep 17 00:00:00 2001
From: TJ Egan <tw15egan@gmail.com>
Date: Thu, 7 Mar 2024 12:10:55 -0800
Subject: [PATCH] fix(CodeSnippet): adjust calculation when show more button is
 clicked (#15839)

* fix(CodeSnippet): adjust calculation when show more button is clicked

* fix(CodeSnippet): adjust showmore button logic, padding
---
 .../src/components/CodeSnippet/CodeSnippet.js |  5 ++---
 .../CodeSnippet/CodeSnippet.stories.js        | 19 +++++++++++++++++++
 .../code-snippet/_code-snippet.scss           |  1 -
 3 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/packages/react/src/components/CodeSnippet/CodeSnippet.js b/packages/react/src/components/CodeSnippet/CodeSnippet.js
index 8d045cfb54bd..75a5cbcba1eb 100644
--- a/packages/react/src/components/CodeSnippet/CodeSnippet.js
+++ b/packages/react/src/components/CodeSnippet/CodeSnippet.js
@@ -22,7 +22,7 @@ const rowHeightInPixels = 16;
 const defaultMaxCollapsedNumberOfRows = 15;
 const defaultMaxExpandedNumberOfRows = 0;
 const defaultMinCollapsedNumberOfRows = 3;
-const defaultMinExpandedNumberOfRows = 16;
+const defaultMinExpandedNumberOfRows = 0;
 
 function CodeSnippet({
   align = 'bottom',
@@ -108,8 +108,7 @@ function CodeSnippet({
       ref: getCodeRef(),
       onResize: () => {
         if (codeContentRef?.current && type === 'multi') {
-          const { height } = codeContentRef.current.getBoundingClientRect();
-
+          const { height } = innerCodeRef.current.getBoundingClientRect();
           if (
             maxCollapsedNumberOfRows > 0 &&
             (maxExpandedNumberOfRows <= 0 ||
diff --git a/packages/react/src/components/CodeSnippet/CodeSnippet.stories.js b/packages/react/src/components/CodeSnippet/CodeSnippet.stories.js
index 7050fcae9801..1987619740dc 100644
--- a/packages/react/src/components/CodeSnippet/CodeSnippet.stories.js
+++ b/packages/react/src/components/CodeSnippet/CodeSnippet.stories.js
@@ -69,6 +69,25 @@ export const Multiline = () => (
   </CodeSnippet>
 );
 
+export const Test = () => (
+  <CodeSnippet type="multi" feedback="Copied to clipboard">
+    {`  "scripts": {
+    "build": "lerna run build --stream --prefix --npm-client yarn",
+    "ci-check": "carbon-cli ci-check",
+    "clean": "lerna run clean && lerna clean --yes && rimraf node_modules",
+    "doctoc": "doctoc --title '## Table of Contents'",
+    "format": "prettier --write '**/*.{js,md,scss,ts}' '!**/{build,es,lib,storybook,ts,umd}/**'",
+    "format:diff": "prettier --list-different '**/*.{js,md,scss,ts}' '!**/{build,es,lib,storybook,ts,umd}/**' '!packages/components/**'",
+    "lint": "eslint actions config codemods packages",
+    "lint:styles": "stylelint '**/*.{css,scss}' --report-needless-disables --report-invalid-scope-disables",
+    "sync": "carbon-cli sync",
+    "test:e2e": "cross-env BABEL_ENV=test jest --testPathPattern=e2e",
+    "sync": "carbon-cli sync",
+  },
+  `}
+  </CodeSnippet>
+);
+
 export const Singleline = () => (
   <CodeSnippet type="single" feedback="Copied to clipboard">
     yarn add carbon-components@latest carbon-components-react@latest
diff --git a/packages/styles/scss/components/code-snippet/_code-snippet.scss b/packages/styles/scss/components/code-snippet/_code-snippet.scss
index d66d0023125b..dd7f8e9796a2 100644
--- a/packages/styles/scss/components/code-snippet/_code-snippet.scss
+++ b/packages/styles/scss/components/code-snippet/_code-snippet.scss
@@ -225,7 +225,6 @@ $copy-btn-feedback: $background-inverse !default;
 
   // collapsed pre
   .#{$prefix}--snippet--multi .#{$prefix}--snippet-container pre {
-    padding-block-end: convert.to-rem(24px);
     padding-inline-end: $spacing-08;
   }