Skip to content

Minor fixes #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
anishagg17 merged 1 commit into from
Mar 18, 2020
Merged

Minor fixes #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/code/__snapshots__/_code_block.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ exports[`EuiCodeBlockImpl block highlights javascript code, adding "js" class 1`
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code js hljs javascript"
Expand All @@ -19,7 +19,7 @@ exports[`EuiCodeBlockImpl block renders a pre block tag 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
aria-label="aria-label"
Expand All @@ -38,7 +38,7 @@ exports[`EuiCodeBlockImpl block renders with transparent background 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand Down
28 changes: 14 additions & 14 deletions src/components/code/__snapshots__/code_block.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`EuiCodeBlock dynamic content updates DOM when input changes 1`] = `
"<div>
<div class=\\"euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge\\">
<pre class=\\"euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap\\">
<pre class=\\"euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap\\">
<code class=\\"euiCodeBlock__code javascript hljs\\">
<span class=\\"hljs-keyword\\">const</span>value =
<span class=\\"hljs-string\\">'State 1'</span>
Expand All @@ -16,7 +16,7 @@ exports[`EuiCodeBlock dynamic content updates DOM when input changes 1`] = `
exports[`EuiCodeBlock dynamic content updates DOM when input changes 2`] = `
"<div>
<div class=\\"euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge\\">
<pre class=\\"euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap\\">
<pre class=\\"euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap\\">
<code class=\\"euiCodeBlock__code javascript hljs\\">
<span class=\\"hljs-keyword\\">const</span>value =
<span class=\\"hljs-string\\">'State 2'</span>
Expand All @@ -31,7 +31,7 @@ exports[`EuiCodeBlock props fontSize l is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontLarge euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -48,7 +48,7 @@ exports[`EuiCodeBlock props fontSize m is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontMedium euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -65,7 +65,7 @@ exports[`EuiCodeBlock props fontSize s is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -82,7 +82,7 @@ exports[`EuiCodeBlock props isCopyable is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--hasControls"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand Down Expand Up @@ -122,7 +122,7 @@ exports[`EuiCodeBlock props language is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code html hljs xml"
Expand All @@ -140,7 +140,7 @@ exports[`EuiCodeBlock props overflowHeight is rendered 1`] = `
style="max-height: 200px;"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
style="max-height: 200px;"
>
<code
Expand Down Expand Up @@ -173,7 +173,7 @@ exports[`EuiCodeBlock props paddingSize l is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -190,7 +190,7 @@ exports[`EuiCodeBlock props paddingSize m is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingMedium"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -207,7 +207,7 @@ exports[`EuiCodeBlock props paddingSize none is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -224,7 +224,7 @@ exports[`EuiCodeBlock props paddingSize s is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingSmall"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -241,7 +241,7 @@ exports[`EuiCodeBlock props transparentBackground is rendered 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
class="euiCodeBlock__code"
Expand All @@ -258,7 +258,7 @@ exports[`EuiCodeBlock renders a code block 1`] = `
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
>
<pre
class="euiCodeBlock__pre euiCodeBlock__pre_whiteSpacePreWrap"
class="euiCodeBlock__pre euiCodeBlock__pre--whiteSpacePreWrap"
>
<code
aria-label="aria-label"
Expand Down
5 changes: 2 additions & 3 deletions src/components/code/_code_block.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,13 @@
height: 100%;
overflow: auto;
display: block;
white-space: pre-wrap;
}

.euiCodeBlock__pre_whiteSpacePre {
.euiCodeBlock__pre--whiteSpacePre {
white-space: pre;
}

.euiCodeBlock__pre_whiteSpacePreWrap {
.euiCodeBlock__pre--whiteSpacePreWrap {
white-space: pre-wrap;
}

Expand Down
10 changes: 5 additions & 5 deletions src/components/code/_code_block.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,9 +56,9 @@ interface Props {
paddingSize: PaddingSize;
transparentBackground: boolean;
/**
* specify how white-space inside the element is handled
* pre respects line breaks/white space but doesn't force them (doesn't wrap the line)
* pre-wrap respects respects line breaks/white space but does force them (wrap the line)
* Specify how `white-space` inside the element is handled.
* `pre` respects line breaks/white space but doesn't force them to wrap the line
* `pre-wrap` respects line breaks/white space but does force them to wrap the line when necessary.
*/
whiteSpace?: 'pre' | 'pre-wrap';
}
Expand Down Expand Up @@ -178,8 +178,8 @@ export class EuiCodeBlockImpl extends Component<Props, State> {
const codeClasses = classNames('euiCodeBlock__code', language);

const preClasses = classNames('euiCodeBlock__pre', {
euiCodeBlock__pre_whiteSpacePre: whiteSpace === 'pre',
euiCodeBlock__pre_whiteSpacePreWrap: whiteSpace === 'pre-wrap',
'euiCodeBlock__pre--whiteSpacePre': whiteSpace === 'pre',
'euiCodeBlock__pre--whiteSpacePreWrap': whiteSpace === 'pre-wrap',
});

const optionalStyles: CSSProperties = {};
Expand Down