Skip to content

Commit

Permalink
Use smaller and compressed varients of buttons and form components (#231
Browse files Browse the repository at this point in the history 
)

* Use EuiSmallButton

Signed-off-by: Miki <[email protected]>

* Use EuiSmallButtonEmpty

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedFormRow

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedField*

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedSelect and EuiCompressedSuperSelect

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedRadio and EuiCompressedRadioGroup

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedEuiTextArea

Signed-off-by: Miki <[email protected]>

* Use EuiCompressedComboBox

Signed-off-by: Miki <[email protected]>

* Use EuiSmallFilterButton

Signed-off-by: Miki <[email protected]>

* Update snapshots and tests

Signed-off-by: Miki <[email protected]>

---------

Signed-off-by: Miki <[email protected]>
(cherry picked from commit a5066a9)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
  • Loading branch information
@github-actions @SuZhou-Joe
github-actions[bot] authored and SuZhou-Joe committed Aug 20, 2024
1 parent 314af7e commit 3ebc8f3
Show file tree
Hide file tree
Showing 51 changed files with 510 additions and 488 deletions.
10 changes: 5 additions & 5 deletions public/pages/Channels/Channels.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@

import {
EuiBasicTable,
EuiButton,
EuiSmallButton,
EuiEmptyPrompt,
EuiHealth,
EuiHorizontalRule,
Expand Down Expand Up @@ -238,9 +238,9 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
},
{
component: (
<EuiButton fill href={`#${ROUTES.CREATE_CHANNEL}`}>
<EuiSmallButton fill href={`#${ROUTES.CREATE_CHANNEL}`}>
Create channel
</EuiButton>
</EuiSmallButton>
),
},
]}
Expand Down Expand Up @@ -269,9 +269,9 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
title={<h2>No channels to display</h2>}
body="To send or receive notifications, you will need to create a notification channel."
actions={
<EuiButton href={`#${ROUTES.CREATE_CHANNEL}`}>
<EuiSmallButton href={`#${ROUTES.CREATE_CHANNEL}`}>
Create channel
</EuiButton>
</EuiSmallButton>
}
/>
}
Expand Down
8 changes: 4 additions & 4 deletions public/pages/Channels/__tests__/__snapshots__/ChannelActions.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ exports[`<ChannelActions/> spec clicks in the popover 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down Expand Up @@ -48,7 +48,7 @@ exports[`<ChannelActions/> spec renders the action button disabled by default 1`
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down Expand Up @@ -87,7 +87,7 @@ exports[`<ChannelActions/> spec renders the popover 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down Expand Up @@ -127,7 +127,7 @@ exports[`<ChannelActions/> spec renders the popover with multiple selected chann
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down
10 changes: 5 additions & 5 deletions public/pages/Channels/__tests__/__snapshots__/ChannelControls.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,13 @@ exports[`<ChannelControls /> spec renders the component 1`] = `
class="euiFlexItem"
>
<div
class="euiFormControlLayout euiFormControlLayout--fullWidth"
class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--compressed"
>
<div
class="euiFormControlLayout__childrenWrapper"
>
<input
class="euiFieldSearch euiFieldSearch--fullWidth"
class="euiFieldSearch euiFieldSearch--fullWidth euiFieldSearch--compressed"
placeholder="Search"
type="search"
/>
Expand All @@ -26,7 +26,7 @@ exports[`<ChannelControls /> spec renders the component 1`] = `
>
<svg
aria-hidden="true"
class="euiIcon euiIcon--medium euiIcon-isLoading euiFormControlLayoutCustomIcon__icon"
class="euiIcon euiIcon--small euiIcon-isLoading euiFormControlLayoutCustomIcon__icon"
focusable="false"
height="16"
role="img"
Expand Down Expand Up @@ -56,7 +56,7 @@ exports[`<ChannelControls /> spec renders the component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
type="button"
>
<span
Expand Down Expand Up @@ -98,7 +98,7 @@ exports[`<ChannelControls /> spec renders the component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
type="button"
>
<span
Expand Down
6 changes: 3 additions & 3 deletions public/pages/Channels/__tests__/__snapshots__/ChannelDetailsActions.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ exports[`<ChannelDetailsActions /> spec clicks buttons in popover 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down Expand Up @@ -48,7 +48,7 @@ exports[`<ChannelDetailsActions /> spec opens popover 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down Expand Up @@ -88,7 +88,7 @@ exports[`<ChannelDetailsActions /> spec renders the component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
type="button"
>
<span
Expand Down
16 changes: 8 additions & 8 deletions public/pages/Channels/__tests__/__snapshots__/Channels.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButton euiButton--primary euiButton-isDisabled"
class="euiButton euiButton--primary euiButton--small euiButton-isDisabled"
disabled=""
type="button"
>
Expand Down Expand Up @@ -79,7 +79,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<a
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
href="#/create-channel"
rel="noreferrer"
>
Expand Down Expand Up @@ -112,13 +112,13 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiFlexItem"
>
<div
class="euiFormControlLayout euiFormControlLayout--fullWidth"
class="euiFormControlLayout euiFormControlLayout--fullWidth euiFormControlLayout--compressed"
>
<div
class="euiFormControlLayout__childrenWrapper"
>
<input
class="euiFieldSearch euiFieldSearch--fullWidth"
class="euiFieldSearch euiFieldSearch--fullWidth euiFieldSearch--compressed"
placeholder="Search"
type="search"
/>
Expand All @@ -130,7 +130,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
>
<svg
aria-hidden="true"
class="euiIcon euiIcon--medium euiIcon-isLoading euiFormControlLayoutCustomIcon__icon"
class="euiIcon euiIcon--small euiIcon-isLoading euiFormControlLayoutCustomIcon__icon"
focusable="false"
height="16"
role="img"
Expand Down Expand Up @@ -160,7 +160,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
type="button"
>
<span
Expand Down Expand Up @@ -202,7 +202,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiPopover__anchor"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiFilterButton euiFilterButton--hasIcon euiFilterButton--noGrow"
type="button"
>
<span
Expand Down Expand Up @@ -511,7 +511,7 @@ exports[`<Channels/> spec renders the empty component 1`] = `
class="euiSpacer euiSpacer--l"
/>
<a
class="euiButton euiButton--primary"
class="euiButton euiButton--primary euiButton--small"
href="#/create-channel"
rel="noreferrer"
>
Expand Down
73 changes: 40 additions & 33 deletions public/pages/Channels/__tests__/__snapshots__/DetailsListModal.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -166,7 +166,7 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
class="euiModalFooter"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
type="button"
>
<span
Expand Down Expand Up @@ -397,7 +397,7 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
class="euiModalFooter"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
type="button"
>
<span
Expand Down Expand Up @@ -560,7 +560,7 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
class="euiModalFooter"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
type="button"
>
<span
Expand Down Expand Up @@ -723,7 +723,7 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
class="euiModalFooter"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
type="button"
>
<span
Expand Down Expand Up @@ -874,7 +874,7 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
class="euiModalFooter"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton euiButton--primary euiButton--small euiButton--fill"
type="button"
>
<span
Expand Down Expand Up @@ -1135,52 +1135,59 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
className="euiModalFooter"
>
<EuiButton
<EuiSmallButton
fill={true}
onClick={[MockFunction]}
>
<EuiButtonDisplay
baseClassName="euiButton"
disabled={false}
element="button"
<EuiButton
fill={true}
isDisabled={false}
onClick={[MockFunction]}
type="button"
size="s"
>
<button
className="euiButton euiButton--primary euiButton--fill"
<EuiButtonDisplay
baseClassName="euiButton"
disabled={false}
element="button"
fill={true}
isDisabled={false}
onClick={[MockFunction]}
style={
Object {
"minWidth": undefined,
}
}
size="s"
type="button"
>
<EuiButtonContent
className="euiButton__content"
iconSide="left"
textProps={
<button
className="euiButton euiButton--primary euiButton--small euiButton--fill"
disabled={false}
onClick={[MockFunction]}
style={
Object {
"className": "euiButton__text",
"minWidth": undefined,
}
}
type="button"
>
<span
className="euiButtonContent euiButton__content"
<EuiButtonContent
className="euiButton__content"
iconSide="left"
textProps={
Object {
"className": "euiButton__text",
}
}
>
<span
className="euiButton__text"
className="euiButtonContent euiButton__content"
>
Close
<span
className="euiButton__text"
>
Close
</span>
</span>
</span>
</EuiButtonContent>
</button>
</EuiButtonDisplay>
</EuiButton>
</EuiButtonContent>
</button>
</EuiButtonDisplay>
</EuiButton>
</EuiSmallButton>
</div>
</EuiModalFooter>
</div>
Expand Down
Loading

0 comments on commit 3ebc8f3

Please sign in to comment.