diff --git a/src-docs/src/views/bottom_bar/bottom_bar.js b/src-docs/src/views/bottom_bar/bottom_bar.js index 6986c5e20d4..c0317d4e97e 100644 --- a/src-docs/src/views/bottom_bar/bottom_bar.js +++ b/src-docs/src/views/bottom_bar/bottom_bar.js @@ -25,12 +25,12 @@ export default () => { - + Help - + Add user @@ -39,7 +39,7 @@ export default () => { - + Discard diff --git a/src-docs/src/views/bottom_bar/bottom_bar_displacement.js b/src-docs/src/views/bottom_bar/bottom_bar_displacement.js index 496b532e52c..1fa7a564bc7 100644 --- a/src-docs/src/views/bottom_bar/bottom_bar_displacement.js +++ b/src-docs/src/views/bottom_bar/bottom_bar_displacement.js @@ -46,7 +46,7 @@ export default () => { setToggleIdSelected(null)} - color="ghost" + color="text" size="s" iconType="cross" > diff --git a/src-docs/src/views/bottom_bar/playground.js b/src-docs/src/views/bottom_bar/playground.js index 5ae1af1f7c3..48af0b9ccf1 100644 --- a/src-docs/src/views/bottom_bar/playground.js +++ b/src-docs/src/views/bottom_bar/playground.js @@ -10,7 +10,7 @@ export const bottomBarConfig = () => { propsToUse.children = { type: PropTypes.ReactNode, - value: 'Save', + value: 'Save', }; propsToUse.position = { diff --git a/src-docs/src/views/button/button_example.js b/src-docs/src/views/button/button_example.js index 11d91c6dc0b..b1ac7a0a221 100644 --- a/src-docs/src/views/button/button_example.js +++ b/src-docs/src/views/button/button_example.js @@ -12,6 +12,11 @@ import { EuiCallOut, EuiLink, EuiText, + EuiFlexGroup, + EuiFlexItem, + EuiCard, + EuiPanel, + EuiSpacer, } from '../../../../src/components'; import { EuiButtonGroupOptionProps } from '!!prop-loader!../../../../src/components/button/button_group/button_group'; @@ -256,6 +261,81 @@ export const ButtonExample = { ), sections: [ { + text: ( + <> + + + + + + Primary action + + + } + title="EuiButton" + titleSize="xs" + /> + + + + + Secondary action + + + } + title="EuiButton" + titleSize="xs" + /> + + + + + Tertiary action + + + } + title="EuiButtonEmpty" + titleSize="xs" + /> + + + + + + + + } + title="EuiButtonIcon" + titleSize="xs" + /> + + + + ), + }, + { + title: 'Basic button', source: [ { type: GuideSectionTypes.JS, @@ -624,8 +704,7 @@ export const ButtonExample = { demoPanelProps: { color: 'subdued' }, }, { - title: 'Ghost', - ghostBackground: true, + title: 'Ghost vs. dark mode', source: [ { type: GuideSectionTypes.JS, @@ -634,19 +713,24 @@ export const ButtonExample = { ], text: (

- For buttons on dark color backgrounds, you can pass{' '} - {'color="ghost"'} to any of the - button components on this page. These should be used extremely rarely, - and are only for placing buttons on top of dark or image-based - backgrounds. A good example of their use is in the{' '} + For buttons on dark color backgrounds, it is recommended to wrap the + entire area in{' '} + + {''} + {' '} + to invert all colors to dark mode. The legacy{' '} + {'color="ghost"'} now uses this + method and is set for deprecation. An example usage of inverted + buttons is in combination with{' '} EuiBottomBar {' '} - component. + which already wraps its children in dark mode.

), snippet: buttonGhostSnippet, demo: , + demoPanelProps: { paddingSize: 'none' }, }, ], guidelines: , diff --git a/src-docs/src/views/button/button_ghost.js b/src-docs/src/views/button/button_ghost.js index 1dac3cc8b23..60b0eadbbba 100644 --- a/src-docs/src/views/button/button_ghost.js +++ b/src-docs/src/views/button/button_ghost.js @@ -6,7 +6,9 @@ import { EuiButtonIcon, EuiFlexGroup, EuiFlexItem, + EuiPanel, } from '../../../../src/components'; +import { EuiThemeProvider } from '../../../../src/services'; export default () => { const [toggle0On, setToggle0On] = useState(false); @@ -16,63 +18,67 @@ export default () => { }; return ( - - - {}}> - Ghost - - + + + + + {}}> + Ghost + + - - {}} - > - Filled - - + + {}} + > + Filled + + - - {}}> - small - - + + {}}> + small + + - - {}} - aria-label="Your account" - /> - + + {}} + aria-label="Your account" + /> + - - - Loading… - - + + + Loading… + + - - - Loading… - - + + + Loading… + + - - - Toggle me - - - + + + Toggle me + + + + + ); }; diff --git a/src-docs/src/views/scroll/utility_classes_overflow.js b/src-docs/src/views/scroll/full_height.tsx similarity index 53% rename from src-docs/src/views/scroll/utility_classes_overflow.js rename to src-docs/src/views/scroll/full_height.tsx index be119b65f5f..d0376e1208a 100644 --- a/src-docs/src/views/scroll/utility_classes_overflow.js +++ b/src-docs/src/views/scroll/full_height.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useContext } from 'react'; import { EuiText, @@ -7,13 +7,18 @@ import { EuiFlexItem, EuiFlexGroup, } from '../../../../src'; -import { UtilityClassesSection } from '../utility_classes/utility_classes_section'; +import { ThemeContext } from '../../components/with_theme'; +import { ThemeExample } from '../theme/_components/_theme_example'; export default () => { + const themeContext = useContext(ThemeContext); + const currentLanguage = themeContext.themeLanguage; + const showSass = currentLanguage.includes('sass'); + return ( <> - @@ -22,19 +27,7 @@ export default () => { parents dimensions. Use it to stretch each nested element until the one that applies scroll.

-

- It applies{' '} - height: 100%; overflow: hidden;{' '} - but also adds flex: 1 1 auto;{' '} - for uses within flex{' '} - containers. -

-
-
Sass mixins
-
- @include euiFullHeight; -
-
+

Works on both flex and non-flex elements.

} example={ @@ -48,7 +41,7 @@ export default () => { @@ -67,7 +60,7 @@ export default () => { @@ -90,15 +83,66 @@ export default () => { className="eui-fullHeight" responsive={false}> + className="eui-yScroll" tabIndex={0} role="region" aria-label=""/> + className="eui-yScroll" tabIndex={0} role="region" aria-label=""/> `} /> + + {!showSass && ( + {'euiFullHeight()'}} + type="function" + description={ + <> +

+ Emotion mixin for adding full height scrolling to a container or + flex child. +

+

+ It applies{' '} + + height: 100%; overflow: hidden; + {' '} + but also adds flex: 1 1 auto;{' '} + for use within flex containers. +

+ + } + snippet="${euiFullHeight()}" + snippetLanguage="emotion" + /> + )} + + {showSass && ( + {'@include euiFullHeight'}} + type="mixin" + description={ + <> +

+ Sass mixin for adding full height scrolling to a container or + flex child. +

+

+ It applies{' '} + + height: 100%; overflow: hidden; + {' '} + but also adds flex: 1 1 auto;{' '} + for uses within flex{' '} + containers. +

+ + } + snippet="@include euiFullHeight;" + snippetLanguage="sass" + /> + )} ); }; diff --git a/src-docs/src/views/scroll/scroll_example.js b/src-docs/src/views/scroll/scroll_example.js index 9ac8eadc3a5..e03db71f831 100644 --- a/src-docs/src/views/scroll/scroll_example.js +++ b/src-docs/src/views/scroll/scroll_example.js @@ -9,9 +9,9 @@ import { } from '../../../../src'; import ScrollBar from './scroll'; -import Utilities from './utility_classes_overflow'; import ScrollX from './scroll_x'; import ScrollY from './scroll_y'; +import FullHeight from './full_height'; export const ScrollExample = { title: 'Scroll', @@ -101,11 +101,7 @@ export const ScrollExample = { title: 'Full height layout', color: 'subdued', wrapText: false, - text: ( - <> - - - ), + text: , }, ], }; diff --git a/src-docs/src/views/scroll/scroll_x.tsx b/src-docs/src/views/scroll/scroll_x.tsx index 349914f6e48..e932a402dfd 100644 --- a/src-docs/src/views/scroll/scroll_x.tsx +++ b/src-docs/src/views/scroll/scroll_x.tsx @@ -84,7 +84,7 @@ export default () => {

To mask the top and bottom of the scrolled content, indicating visually that there is more content below, pass in true to the - second paremeter mask. + second parameter mask.

{"useEuiOverflowScroll('x', true);"} diff --git a/src-docs/src/views/scroll/scroll_y.tsx b/src-docs/src/views/scroll/scroll_y.tsx index 4942934e67b..c022aabfed9 100644 --- a/src-docs/src/views/scroll/scroll_y.tsx +++ b/src-docs/src/views/scroll/scroll_y.tsx @@ -60,7 +60,7 @@ export default () => {

To mask the top and bottom of the scrolled content, indicating visually that there is more content below, pass in true to the - second paremeter mask. + second parameter mask.

{"useEuiOverflowScroll('y', true);"} diff --git a/src-docs/src/views/theme/color/contrast.tsx b/src-docs/src/views/theme/color/contrast.tsx index e4e9216ce96..5d533f949bb 100644 --- a/src-docs/src/views/theme/color/contrast.tsx +++ b/src-docs/src/views/theme/color/contrast.tsx @@ -338,10 +338,10 @@ export default () => { { <> @@ -157,7 +157,7 @@ export default () => { setJsonFlyoutIsOpen(true)} - color="ghost" + color="text" > View theme JSON diff --git a/src/components/accessibility/skip_link/__snapshots__/skip_link.test.tsx.snap b/src/components/accessibility/skip_link/__snapshots__/skip_link.test.tsx.snap index a6951307e41..10f6e9e4a4e 100644 --- a/src/components/accessibility/skip_link/__snapshots__/skip_link.test.tsx.snap +++ b/src/components/accessibility/skip_link/__snapshots__/skip_link.test.tsx.snap @@ -3,16 +3,16 @@ exports[`EuiSkipLink is rendered 1`] = ` Skip @@ -22,82 +22,62 @@ exports[`EuiSkipLink is rendered 1`] = ` exports[`EuiSkipLink props onClick is rendered 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; exports[`EuiSkipLink props position absolute is rendered 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; exports[`EuiSkipLink props position fixed is rendered 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; exports[`EuiSkipLink props position static is rendered 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; exports[`EuiSkipLink props tabIndex is rendered 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; diff --git a/src/components/accessibility/skip_link/skip_link.test.tsx b/src/components/accessibility/skip_link/skip_link.test.tsx index c8dd6c7d026..19c7f3161ec 100644 --- a/src/components/accessibility/skip_link/skip_link.test.tsx +++ b/src/components/accessibility/skip_link/skip_link.test.tsx @@ -37,7 +37,7 @@ describe('EuiSkipLink', () => { ); const preventDefault = jest.fn(); - component.find('EuiButton').simulate('click', { preventDefault }); + component.find('a').simulate('click', { preventDefault }); expect(preventDefault).toHaveBeenCalled(); expect(focusSpy).toHaveBeenCalled(); @@ -50,11 +50,11 @@ describe('EuiSkipLink', () => { const component = mount( ); - component.find('EuiButton').simulate('click'); + component.find('a').simulate('click'); expect(scrollSpy).not.toHaveBeenCalled(); mockElement.getBoundingClientRect = () => ({ top: 1000 } as any); - component.find('EuiButton').simulate('click'); + component.find('a').simulate('click'); expect(scrollSpy).toHaveBeenCalled(); }); }); diff --git a/src/components/accordion/__snapshots__/accordion.test.tsx.snap b/src/components/accordion/__snapshots__/accordion.test.tsx.snap index c837f863ea6..a54c39cd561 100644 --- a/src/components/accordion/__snapshots__/accordion.test.tsx.snap +++ b/src/components/accordion/__snapshots__/accordion.test.tsx.snap @@ -11,7 +11,7 @@ exports[`EuiAccordion behavior closes when clicked twice 1`] = ` aria-controls="20" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -65,7 +65,7 @@ exports[`EuiAccordion behavior does not open when isDisabled 1`] = ` aria-controls="18" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-lc7o8f-empty-disabled-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" disabled="" tabindex="-1" type="button" @@ -121,7 +121,7 @@ exports[`EuiAccordion behavior opens when clicked once 1`] = ` aria-controls="17" aria-expanded="true" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen emotion-euiAccordion__iconButton-isOpen" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen css-1o4u7sp-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton-isOpen" tabindex="-1" type="button" > @@ -175,7 +175,7 @@ exports[`EuiAccordion behavior opens when div is clicked if element is a div 1`] aria-controls="19" aria-expanded="true" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen emotion-euiAccordion__iconButton-isOpen" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen css-1o4u7sp-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton-isOpen" tabindex="-1" type="button" > @@ -231,7 +231,7 @@ exports[`EuiAccordion is rendered 1`] = ` aria-controls="0" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -281,7 +281,7 @@ exports[`EuiAccordion isDisabled is rendered 1`] = ` aria-controls="16" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-lc7o8f-empty-disabled-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" disabled="" tabindex="-1" type="button" @@ -379,7 +379,7 @@ exports[`EuiAccordion props arrowDisplay right is rendered 1`] = ` aria-controls="8" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton--right emotion-euiAccordion__iconButton-arrowRight" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton--right css-1f2dcop-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton-arrowRight" tabindex="-1" type="button" > @@ -419,7 +419,7 @@ exports[`EuiAccordion props arrowProps is rendered 1`] = ` aria-expanded="false" aria-label="aria-label" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton testClass1 testClass2 emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton testClass1 testClass2 css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" data-test-subj="test subject string" tabindex="-1" type="button" @@ -470,7 +470,7 @@ exports[`EuiAccordion props buttonContent is rendered 1`] = ` aria-controls="3" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -524,7 +524,7 @@ exports[`EuiAccordion props buttonContentClassName is rendered 1`] = ` aria-controls="2" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -574,7 +574,7 @@ exports[`EuiAccordion props buttonElement is rendered 1`] = ` aria-controls="5" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="0" type="button" > @@ -623,7 +623,7 @@ exports[`EuiAccordion props buttonProps is rendered 1`] = ` aria-controls="4" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -675,7 +675,7 @@ exports[`EuiAccordion props element is rendered 1`] = ` aria-controls="1" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="0" type="button" > @@ -724,7 +724,7 @@ exports[`EuiAccordion props extraAction is rendered 1`] = ` aria-controls="6" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -781,7 +781,7 @@ exports[`EuiAccordion props forceState closed is rendered 1`] = ` aria-controls="11" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -835,7 +835,7 @@ exports[`EuiAccordion props forceState open is rendered 1`] = ` aria-controls="12" aria-expanded="true" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen emotion-euiAccordion__iconButton-isOpen" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen css-1o4u7sp-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton-isOpen" tabindex="-1" type="button" > @@ -889,7 +889,7 @@ exports[`EuiAccordion props initialIsOpen is rendered 1`] = ` aria-controls="7" aria-expanded="true" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen emotion-euiAccordion__iconButton-isOpen" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen css-1o4u7sp-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton-isOpen" tabindex="-1" type="button" > @@ -943,7 +943,7 @@ exports[`EuiAccordion props isLoading is rendered 1`] = ` aria-controls="14" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > @@ -1002,7 +1002,7 @@ exports[`EuiAccordion props isLoadingMessage is rendered 1`] = ` aria-controls="15" aria-expanded="false" aria-labelledby="generated-id" - class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton emotion-euiAccordion__iconButton" + class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton css-1r6f2je-empty-text-hoverStyles-EuiButtonIcon-euiAccordion__iconButton" tabindex="-1" type="button" > diff --git a/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap b/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap index a3a0367eb51..5d6158faa98 100644 --- a/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap +++ b/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap @@ -13,7 +13,7 @@ exports[`CollapsedItemActions render 1`] = ` > `; exports[`EuiButton props color danger is rendered 1`] = ` `; exports[`EuiButton props color ghost is rendered 1`] = ` `; exports[`EuiButton props color primary is rendered 1`] = ` `; exports[`EuiButton props color success is rendered 1`] = ` `; exports[`EuiButton props color text is rendered 1`] = ` `; exports[`EuiButton props color warning is rendered 1`] = ` `; exports[`EuiButton props contentProps is rendered 1`] = ` `; exports[`EuiButton props fullWidth is rendered 1`] = ` `; exports[`EuiButton props href secures the rel attribute when the target is _blank 1`] = ` - - + class="emotion-euiButtonDisplayContent" + /> `; exports[`EuiButton props iconSide left is rendered 1`] = ` `; exports[`EuiButton props isDisabled is rendered 1`] = ` `; exports[`EuiButton props isDisabled renders a button even when href is defined 1`] = ` `; exports[`EuiButton props isDisabled renders if passed as disabled 1`] = ` `; exports[`EuiButton props isLoading is rendered 1`] = ` `; @@ -326,92 +268,71 @@ exports[`EuiButton props isLoading is rendered 1`] = ` exports[`EuiButton props isSelected is rendered as false 1`] = ` `; exports[`EuiButton props isSelected is rendered as true 1`] = ` `; exports[`EuiButton props minWidth is rendered 1`] = ` `; exports[`EuiButton props size m is rendered 1`] = ` `; exports[`EuiButton props size s is rendered 1`] = ` `; exports[`EuiButton props textProps is rendered 1`] = ` `; +exports[`EuiButtonEmpty props color accent is rendered 1`] = ` + +`; + exports[`EuiButtonEmpty props color danger is rendered 1`] = ` - - -`; - -exports[`EuiButtonGroup button props color ghost is rendered for multi 1`] = ` -

- - test - -
- - - -
-
-`; - -exports[`EuiButtonGroup button props color ghost is rendered for single 1`] = ` -
- - test - -
- - - @@ -432,27 +530,118 @@ console.log(some);" > @@ -525,7 +714,7 @@ exports[`EuiCodeBlock props overflowHeight is rendered 1`] = ` >