github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

Bumping EUI to version 67.1.8 (#141279)

Browse source 
* Updated EUI to version 67.1.2. Updated instaces of ButtonColor from EUI to EuiButtonColor.

* Updated to EuiCard instances that utilize the betaBadgeProps object to return an empty string instead of undefined when the label is unavailable

* Removed two instances of the deprecated internetExplorerOnly() mixin

* Updated two instances of the ButtonColor import to EuiButtonColor as is was renamed in PR #6150

* Updated snapshots in Jest Test Suite #1 to account for EuiButton and EuiCard Emotion conversions. Updated snapshots for EuiTooltip as it now contains the new EuiToolTipAnchor component that replaced the tooltip anchor styles

* Updated snapshots in Jest Test Suite #2 to account forEuiButton, EuiDescriptionList, EuiButtonIcon, and EuiBadge Emotion conversions.

* Updated snapshots in Jest Test Suite #3 to account for EuiDescriptionList, EuiButton, and EuiBadge Emotion conversions. Updated snapshots for EuiTooltip as if now contains the new EuiTooltipAnchor component that replaced the tooltop anchor styles

* Updated snapshots in Jest Test Suite #4 to account for EuiButton Emotion conversion.

* Updated snapshots in Jest Test Suite #5 to account for EuiButton Emotion conversion.

* Updated snapshots in Jest Test Suite #8 to account for EuiButtonIcon and EuiButton Emotion conversions. Updated snapshots for EuiTooltip as it now contains the new EuiTooltipAnchor component that replaced the tooltip anchor styles.

* Updated snapshots in Jest Test Suite #9 to account for EuiFlyout and EuiButton Emotion conversions.

* Updated snapshots in Jest Test Suite #10 to account for EuiButton, EuiBadge, EuiButtonIcon, and EuiCard Emotion conversions. Updated snapshots for EuiToolTtip as it now contains the new EuiTooltipAnchor component that replaced the tooltip anchor styles

* Updated instances of EuiButtonIconColor to use EuiButtonIconProps['color'] as it was removed in PR #6150

* Updated tests that target EuiButton to simulate click events to target a generic button to prevent undefined click event errors

* Updated snapshots in Jest Test Suite #1 to account for EuiButton and EuiCard Emotion conversions

* Added the EuiFlyout mixins and variables to Lens Sass file as EuiFlyout has been converted to Emotion and the Sass styles are no longer available in EUI

* Added the EuiCallOutTypes variable to Step Progress Sass file as EuiCallOut has been converted to Emotion and the Sass styles are no longer available in EUI

* Updated snapshots in Jest Test Suite #2 to account for recent Emotion conversions.
Updated snapshots in server_status.test.tsx to render EuiBadge before checking the snapshots to reduce the snapshot churn caused by Emotion.
Updated tests that target EuiButton to simulate click events to target a generic button to prevent undefined click event errors

* [CI] Auto-commit changed files from 'node scripts/precommit_hook.js --ref HEAD~1..HEAD --fix'

* Added imports for the added flyout mixin. Removed references to EuiCallOut mixin as the component has been converted to Emotion and is no longer available for use.

* Updated unit tests and snapshots in Jest Test Suite #10.
Updated snaphshots to account for EuiBadge, EuiDescriptionList, EuiFlyout, and EuiCard Emotion conversions. Updated snapshots for EuiTooltip as it now contains the new EuiTooltipAnchor component that replaced the tooltip anchor styles.
Updated tests that target EuiButton to simulate click events to target a generic button element to prevent undefined click event errors

* Updated unit tests in Jest Test Suite #11 that target EuiButton to simulate click events to target a generic button to prevent undefined click event errors

* Updated unit tests in Jest Test Suite #12 by updating tests that target EuiButton to simulate click events. Instead, these tests now target a generic button element to prevent undefined click event errors

* Updated unit tests in Jest Test Suite #1 by updating tests that target EuiButton to simulate click events. Instead, these tests now target a generic button element to prevent undefined click event errors

* Updated unit tests in Jest Test Suite #2 by updating tests that use EuiButton to simulate click events. Instead, these test have been updated to target a button element to prevent undefined click event errors.

* [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix'

* Updated reference to mixins Sass file.
Updated snapshots for Jest Test Suite #5 to account for EuiButton Emotion conversion. Updated unit tests that target EuiButton to simulate click events. These tests have been updated to target a button element to prevent undefined click event errors

* Updated unit tests in Jest Test Suites 3, 7, 8, 13, and 14.
Updated snapshot to account for EuiButton Emotion conversion.
Updated tests that target EuiButton to simulate click events. These tests now target a generic button element to prevent undefined click event errors.
Updated a few snapshots by adding .render() before checking the snapshot. This will prevent large snapshots coming from recent Emotion conversions

* Updated snapshots in Jest Test Suite #10 to account for the recent EuiButton Emotion conversion

* Updated unit tests in Jest Test Suite #2 by editing tests that target EuiButton to simulate click events. These tests now target a button element in order to prevent undefinde click event errors

* Updated snapshots in Jest Test Suite #10 to account for EuiButton and EuiDescriptionList Emotion conversions

* Updated test cases in Jest Test Suites 3, 7, and 8. Updated snapshots to account for EuiButton and EuiPagination Emotion conversions.
Updated tests that target EuiButton to simulate click events. These tests now target a button element to prevent undefined click errors

* Updated test cases in Jest Test Suite 14. Updated snapshots to account for EuiButton Emotion conversion. Opted to use .render() when updating a few snapshots to reduce the large length of snapshots caused by Emotion

* [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix'

* Revised a change to betaBadgeProps to ensure that the label is available. If not, the value for the badge with be set to undefined.

* Resolved two linting errors

* Resolved two linting errors

* Updated Jest unit tests in various suites.
Updated snapshots to account for EuiButton Emotion conversion. Updated snapshots for EuiTooltip as it now contains the new EuiTooltipAnchor component that replaced the tooltip anchor styles.

* Updated EuiFlyout in query_flyout.tsx to remove the onClick function from maskProps as it is no longer available. Updated this flyout to use ownFocus and not to close when the overlay mask is clicked.

* Removed the use of EuiButtonIconColor in favor of EuiButtonIconProps['color']

* [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix'

* Updated Cypress test looking for strict equality on EuiPaginationButton class names to match a substring of the Emotion generated class name

* Removed unneeded debugging code. Updated snapshots for various test suites to account for the recent EuiButton Emotion conversion

* Updated a few EuiButton, EuiButtonEmpty, and EuiText components that set the color as ghost. The ghost color mode has been deprecated as of PR #6150. These components now are wrapped in EuiThemeProvider with a dark colorMode to create the previous ghost color.

* Resolved  TS error with EuiCard betaBadgeProps

* [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix'

* Remove references to now-removed EuiFlyout CSS classes/vars

* Remove now-removed euiBadge className references

- Convert directly to EuiBadge instead of using CSS

- Remove confusing and now-possibly-irrelevant CSS badge overrides - left/right icons are now set via JSX and not via flex-direction

* Pre-emptively fix various euiOverlayMask CSS overrides

- this data attr isn't technically in yet but will be once https://github.com/elastic/eui/pull/6289 merges

- at the very least this isn't breaking any more than it currently already is!

* Update to v67.1.3

* v67.1.4

* Resolved test failing test case in Security/Manage/Blocklist. The test did not remove focus from the last combo box in the form, which didn't allow the disbaled attribute to be removed from the flyout submit button. I've updated the mock file for Blocklist to return focus to the first form element in the flyout to allow the disabled attribute to be removed.

* Updated snapshots to account for the recent EuiText Emotion conversion

* Fix Log's custom tooltips relying on EuiTooltip classNames that no longer exist

* Fix Vega vis custom tooltips relying on EuiTooltip classNames that no longer exist

- this one is trickier than Log's as it's not using React, so we need to use Emotion's Global to set a static className

* Convert remaining vega_vis.scss to Emotion

- as an example of how other global + non global styles could be handled in the future

* Fix references to removed `euiPaginationButton-isActive` className

- use aria-current attribute instead

* Added missing EuiFlyoutAnimation keyframes for EuiFlyout. This resolved test that failed because they used onAnimationEnd because the FlyoutAnimation could not be found.

* Reolved Jest Tests in suites 1 and 5. Updated snapshots to account for the recent EuiButton Emotion conversion. Updated snapshots for EuiToolTip as it now contains the new EuiToolTipAnchor component that replaced the tooltip anchor styles.

* iterate on rules_list.test.tsx

* bump eui to v67.1.5

* Updatde snapshots for jest test suites to account for the recent EuiButton, EuiOverlayMask, EuiTooltip, and EuiBadge Emotion conversions

* Resolved failing security test by updating the target element for CONNECTOR_TITLE. EuiCard has recently been converted to Emotion and the card title is no longer wrapper in a span.

* Resolved failing test case in Runtime Fields. The modify runtime field test was failing because the combobox responsbible for adding and updating scripts was not appearing. The textbox did not appear because the shared setFieldScript function targets and toggles the script textbox when opening the flyout. When a runtime field is being modified, the toggle is already active and using the shared function will trigger the toggle again (losing access to the script textbox).
Also resolved an issue that prevented the warning EuiCallout to appear when changing the type of a runtime field from its original type. Resolved this by adding an enter keypress at the end of setFieldType function to confirm the type selection, thus triggering the EuiCallout

* Resolved two tests that were failing in Lens. These test were failing because they were checking for equality in class names that no longer exist within EuiButtonGroup as it was recently converted to Emotion. These tests were updated to check for a substring of the new and longer class name

* Quick fix in test case failing because of misspelling in data-test-sub

* Updated snapshot for Jest test case as EuiButton as recently been converted to Emotion

* Removed console.log statement. Oops!

* Resolved a failing test case in Lens. They were failing because they were checking for equality in class names that no longer exist within EuiButtonGroup as it was recently converted to Emotion. These tests were updated to check for a substring of the new and longer class name.
Updated a Security test case by giving a target button the data-test-subj attribute for easier querying

* Removed reference to EuiFlyout mixin as it has been converted to Emotion. Updated the reference to an interal copy of EuiFlyout styles

* Corrected spelling error in EuiFlyout animation in Lens app

* Update EUI with latest backport

* Update button snapshots

* fix another button snapshot

* More snapshot fixes

* [EuiButton][Security] Fix button relying on now-removed `euiButton__text` CSS

- replace removed CSS with `eui-textTruncate` util instead

- combine/DRY out unnecessary span - was affecting min-width of truncation util

+ increase screenshot diff limit - this was smaller than updating the actual baseline screenshots for whatever reason (likely render diff between local and CI)

* Fix remaining Jest tests affected by Emotion conversions

- because Emotion creates its own wrapper, `.first()` can no longer be used - prefer `.last()` instead

* Fix Jest test affected by EuiButton Emotion conversion + removed modifier class

- targeting the native DOM node + filtering by disabled true/false gets us back to the 'correct' lengths

* Fix + improve flyout test

- `.last()` changes to account for EuiButton Emotion conversion is needed, but the last onClose assertion still fails due to us having modified inputs, and the confirm modal being displayed

- split test into two separate tests - one testing the onClose call, and the other testing the confirm modal

* derpin

* Skip rules_list Jest suite

* Update new EuiButton snapshot

* Upgraded EUI version to 67.1.7

* [EuiCard] Update snapshots

* [EuiPopover] Update snapshots

* [QA] Fix missing Vega warn/error message colors

;_;

* [CI] Auto-commit changed files from 'node scripts/generate codeowners'

* Fix Lens kbnToolbarButton regressions

- Caused by flattening of EUI button CSS specificity

- background-color was previously relying on isDisabled CSS specificity to override its #fff color

- `text` color modifier & `!important` is no longer needed and overrides Emotion CSS flatly

- isDisabled class is no longer needed - euiButton no longer sets `pointer-events: none` on disabled buttons (fixes tooltip bug in webkit as well)

* Backport EUI 67.1.8 fixes

* Update EuiCard snapshots

* Fix EuiModal form wrapper causing overflow issues

- see https://elastic.github.io/eui/#/layout/modal#forms-in-a-modal

* Workaround for `.kbnOverlayMountWrapper` mount point causing overflow issues

- not sure what all is using this modal service to be honest, but the wrapper is causing issues with the modal layout, this fixes overflow issues but will not fix any mask-image issues as a result

* more snapshot updates

* EuiButton - added textProps to EuiButton to prevent very long button names from spilling over outside of the container

* EuiButton - Update EuiButton related snapshots. Updated tests that target EuiButton directly to use a data-telementary-id for more specific element querying required by Emotion

* QA - Removed unnecessary comment in code

* Temporary fix for EuiCard[selectable][layout=horizontal] instances on security solutions' rule page

* Temporary fix for EuiCard[selectable][layout=horizontal] instances on osquery live query and canvas's datasource selector

* [CI] Auto-commit changed files from 'node scripts/precommit_hook.js --ref HEAD~1..HEAD --fix'

* Fix CSS specificity, where canvas's solutionToolbarButton's background-color now takes precedence over EuiButton's primary styles

* Removed update to search_marker_tooltip that removed the euiTooltip styles and replaced then with Emotion styling. Added EuiTooltip Sass styles for the component to rely on to test for a styling bug that is causing the tooltip and the tooltip arrow to be out of sync with each other.

* Lint Sass file

* Lint Sass file

* Removed overflow:hidden style from .vgaVis_view as it was causing euiScrollStyles not to present the scroll bars in Vega Vis

* Remove typo from EuiButton textProps object. 'className' should not have been included in the actual class name

* Revert tooltip Sass

This reverts commit 20e6ead571, a5cd2de901, and c605cbd7b9

* Fix Emotion tooltip arrows

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Constance Chen <constance.chen@elastic.co>
Co-authored-by: Chandler Prall <chandler.prall@elastic.co>
This commit is contained in:
Bree Hall 2022-11-07 16:45:50 -05:00 • committed by GitHub
parent 494aa9cc8e
commit 4e9f1c0d04
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
340 changed files with 6203 additions and 7133 deletions
Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -108,7 +108,7 @@
"@elastic/datemath": "5.0.3",
"@elastic/elasticsearch": "npm:@elastic/elasticsearch-canary@8.4.0-canary.1",
"@elastic/ems-client": "8.3.3",
"@elastic/eui": "64.0.5",
"@elastic/eui": "67.1.8",
"@elastic/filesaver": "1.1.2",
"@elastic/node-crypto": "1.2.1",
"@elastic/numeral": "^2.5.1",

4
packages/core/application/core-application-browser-internal/src/application_leave.tsx
View file

@ -5,7 +5,7 @@
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import type { ButtonColor } from '@elastic/eui';
import type { EuiButtonColor } from '@elastic/eui';
import {
AppLeaveActionType,
type AppLeaveActionFactory,
@ -20,7 +20,7 @@ const appLeaveActionFactory: AppLeaveActionFactory = {
title?: string,
callback?: () => void,
confirmButtonText?: string,
buttonColor?: ButtonColor
buttonColor?: EuiButtonColor
) {
return {
type: AppLeaveActionType.confirm,

6
packages/core/application/core-application-browser/src/app_leave.ts
View file

@ -6,7 +6,7 @@
* Side Public License, v 1.
*/
import type { ButtonColor } from '@elastic/eui';
import type { EuiButtonColor } from '@elastic/eui';
/**
* A handler that will be executed before leaving the application, either when
@ -61,7 +61,7 @@ export interface AppLeaveConfirmAction {
text: string;
title?: string;
confirmButtonText?: string;
buttonColor?: ButtonColor;
buttonColor?: EuiButtonColor;
callback?: () => void;
}
@ -95,7 +95,7 @@ export interface AppLeaveActionFactory {
title?: string,
callback?: () => void,
confirmButtonText?: string,
buttonColor?: ButtonColor
buttonColor?: EuiButtonColor
): AppLeaveConfirmAction;
/**

105
packages/core/apps/core-apps-browser-internal/src/status/components/__snapshots__/server_status.test.tsx.snap generated
View file

@ -1,100 +1,61 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`ServerStatus renders correctly for green state 2`] = `
<EuiBadge
<span
aria-label="Green"
color="success"
class="euiBadge emotion-euiBadge"
data-test-subj="serverStatusTitleBadge"
style="background-color: rgb(109, 204, 177); color: rgb(0, 0, 0);"
title="Green"
>
<EuiInnerText>
<span
class="euiBadge__content emotion-euiBadge__content"
>
<span
aria-label="Green"
className="euiBadge euiBadge--iconLeft"
data-test-subj="serverStatusTitleBadge"
style={
Object {
"backgroundColor": "#6dccb1",
"color": "#000",
}
}
title="Green"
class="euiBadge__text emotion-euiBadge__text"
>
<span
className="euiBadge__content"
>
<span
className="euiBadge__text"
>
Green
</span>
</span>
Green
</span>
</EuiInnerText>
</EuiBadge>
</span>
</span>
`;
exports[`ServerStatus renders correctly for red state 2`] = `
<EuiBadge
<span
aria-label="Red"
color="success"
class="euiBadge emotion-euiBadge"
data-test-subj="serverStatusTitleBadge"
style="background-color: rgb(109, 204, 177); color: rgb(0, 0, 0);"
title="Red"
>
<EuiInnerText>
<span
class="euiBadge__content emotion-euiBadge__content"
>
<span
aria-label="Red"
className="euiBadge euiBadge--iconLeft"
data-test-subj="serverStatusTitleBadge"
style={
Object {
"backgroundColor": "#6dccb1",
"color": "#000",
}
}
title="Red"
class="euiBadge__text emotion-euiBadge__text"
>
<span
className="euiBadge__content"
>
<span
className="euiBadge__text"
>
Red
</span>
</span>
Red
</span>
</EuiInnerText>
</EuiBadge>
</span>
</span>
`;
exports[`ServerStatus renders correctly for yellow state 2`] = `
<EuiBadge
<span
aria-label="Yellow"
color="success"
class="euiBadge emotion-euiBadge"
data-test-subj="serverStatusTitleBadge"
style="background-color: rgb(109, 204, 177); color: rgb(0, 0, 0);"
title="Yellow"
>
<EuiInnerText>
<span
class="euiBadge__content emotion-euiBadge__content"
>
<span
aria-label="Yellow"
className="euiBadge euiBadge--iconLeft"
data-test-subj="serverStatusTitleBadge"
style={
Object {
"backgroundColor": "#6dccb1",
"color": "#000",
}
}
title="Yellow"
class="euiBadge__text emotion-euiBadge__text"
>
<span
className="euiBadge__content"
>
<span
className="euiBadge__text"
>
Yellow
</span>
</span>
Yellow
</span>
</EuiInnerText>
</EuiBadge>
</span>
</span>
`;

6
packages/core/apps/core-apps-browser-internal/src/status/components/server_status.test.tsx
View file

@ -24,7 +24,7 @@ describe('ServerStatus', () => {
const status = getStatus();
const component = mount(<ServerStatus serverState={status} name="My Computer" />);
expect(component.find('EuiTitle').text()).toMatchInlineSnapshot(`"Kibana status is Green"`);
expect(component.find('EuiBadge')).toMatchSnapshot();
expect(component.find('EuiBadge').render()).toMatchSnapshot();
});
it('renders correctly for yellow state', () => {
@ -34,7 +34,7 @@ describe('ServerStatus', () => {
});
const component = mount(<ServerStatus serverState={status} name="My Computer" />);
expect(component.find('EuiTitle').text()).toMatchInlineSnapshot(`"Kibana status is Yellow"`);
expect(component.find('EuiBadge')).toMatchSnapshot();
expect(component.find('EuiBadge').render()).toMatchSnapshot();
});
it('renders correctly for red state', () => {
@ -44,7 +44,7 @@ describe('ServerStatus', () => {
});
const component = mount(<ServerStatus serverState={status} name="My Computer" />);
expect(component.find('EuiTitle').text()).toMatchInlineSnapshot(`"Kibana status is Red"`);
expect(component.find('EuiBadge')).toMatchSnapshot();
expect(component.find('EuiBadge').render()).toMatchSnapshot();
});
it('displays the correct `name`', () => {

10
packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/collapsible_nav.test.tsx.snap generated
View file

@ -136,7 +136,7 @@ Array [
aria-controls="generated-id"
aria-expanded="true"
aria-labelledby="generated-id"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiAccordion__iconButton-isOpen-arrowRight"
class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiButtonIcon-empty-text-hoverStyles-euiAccordion__iconButton-isOpen-arrowRight"
tabindex="-1"
type="button"
>
@ -261,7 +261,7 @@ Array [
aria-controls="generated-id"
aria-expanded="true"
aria-labelledby="generated-id"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiAccordion__iconButton-isOpen-arrowRight"
class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiButtonIcon-empty-text-hoverStyles-euiAccordion__iconButton-isOpen-arrowRight"
tabindex="-1"
type="button"
>
@ -393,7 +393,7 @@ Array [
aria-controls="generated-id"
aria-expanded="true"
aria-labelledby="generated-id"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiAccordion__iconButton-isOpen-arrowRight"
class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiButtonIcon-empty-text-hoverStyles-euiAccordion__iconButton-isOpen-arrowRight"
tabindex="-1"
type="button"
>
@ -508,7 +508,7 @@ Array [
aria-controls="generated-id"
aria-expanded="true"
aria-labelledby="generated-id"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiAccordion__iconButton-isOpen-arrowRight"
class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiButtonIcon-empty-text-hoverStyles-euiAccordion__iconButton-isOpen-arrowRight"
tabindex="-1"
type="button"
>
@ -606,7 +606,7 @@ Array [
aria-controls="generated-id"
aria-expanded="true"
aria-labelledby="generated-id"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiAccordion__iconButton-isOpen-arrowRight"
class="euiButtonIcon euiButtonIcon--xSmall euiAccordion__iconButton euiAccordion__iconButton-isOpen euiAccordion__iconButton--right emotion-euiButtonIcon-empty-text-hoverStyles-euiAccordion__iconButton-isOpen-arrowRight"
tabindex="-1"
type="button"
>

4
packages/core/chrome/core-chrome-browser-internal/src/ui/header/__snapshots__/header.test.tsx.snap generated
View file

@ -83,7 +83,7 @@ exports[`Header renders 1`] = `
aria-expanded="false"
aria-haspopup="true"
aria-label="Help menu"
class="euiButtonEmpty euiButtonEmpty--text euiHeaderSectionItemButton"
class="euiButtonEmpty euiHeaderSectionItemButton css-wvaqcf-empty-text"
type="button"
>
<span
@ -124,7 +124,7 @@ exports[`Header renders 1`] = `
aria-expanded="false"
aria-label="Toggle primary navigation"
aria-pressed="false"
class="euiButtonEmpty euiButtonEmpty--text euiHeaderSectionItemButton"
class="euiButtonEmpty euiHeaderSectionItemButton css-wvaqcf-empty-text"
data-test-subj="toggleNavButton"
type="button"
>

1
packages/core/fatal-errors/core-fatal-errors-browser-internal/src/__snapshots__/fatal_errors_screen.test.tsx.snap generated
View file

@ -21,6 +21,7 @@ exports[`FatalErrorsScreen rendering render matches snapshot 1`] = `
data-test-subj="clearSession"
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Clear your session"

1
packages/core/mount-utils/core-mount-utils-browser-internal/src/mount_wrapper.scss
View file

@ -2,4 +2,5 @@
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
}

156
packages/core/overlays/core-overlays-browser-internal/src/modal/__snapshots__/modal_service.test.tsx.snap generated
View file

@ -99,7 +99,7 @@ exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `
>
<button
aria-label="Closes this modal window"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
class="euiButtonIcon euiButtonIcon--xSmall euiModal__closeIcon emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span
@ -110,62 +110,58 @@ exports[`ModalService openConfirm() renders a mountpoint confirm message 2`] = `
/>
</button>
<div
class="euiModal__flex"
class="euiModalBody"
>
<div
class="euiModalBody"
class="euiModalBody__overflow"
>
<div
class="euiModalBody__overflow"
class="euiText emotion-euiText-m"
data-test-subj="confirmModalBodyText"
>
<div
class="euiText emotion-euiText-m"
data-test-subj="confirmModalBodyText"
class="kbnOverlayMountWrapper"
>
<div
class="kbnOverlayMountWrapper"
>
<span>
Modal content
</span>
</div>
<span>
Modal content
</span>
</div>
</div>
</div>
<div
class="euiModalFooter"
</div>
<div
class="euiModalFooter"
>
<button
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="confirmModalCancelButton"
type="button"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary"
data-test-subj="confirmModalCancelButton"
type="button"
<span
class="euiButtonContent euiButtonEmpty__content"
>
<span
class="euiButtonContent euiButtonEmpty__content"
class="euiButtonEmpty__text"
>
<span
class="euiButtonEmpty__text"
>
Cancel
</span>
Cancel
</span>
</button>
<button
class="euiButton euiButton--primary euiButton--fill"
data-test-subj="confirmModalConfirmButton"
type="button"
</span>
</button>
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="confirmModalConfirmButton"
type="button"
>
<span
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent euiButton__content"
class="eui-textTruncate"
>
<span
class="euiButton__text"
>
Confirm
</span>
Confirm
</span>
</button>
</div>
</span>
</button>
</div>
</div>
</div>
@ -307,7 +303,7 @@ exports[`ModalService openConfirm() renders a string confirm message 2`] = `
>
<button
aria-label="Closes this modal window"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
class="euiButtonIcon euiButtonIcon--xSmall euiModal__closeIcon emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span
@ -318,58 +314,54 @@ exports[`ModalService openConfirm() renders a string confirm message 2`] = `
/>
</button>
<div
class="euiModal__flex"
class="euiModalBody"
>
<div
class="euiModalBody"
class="euiModalBody__overflow"
>
<div
class="euiModalBody__overflow"
class="euiText emotion-euiText-m"
data-test-subj="confirmModalBodyText"
>
<div
class="euiText emotion-euiText-m"
data-test-subj="confirmModalBodyText"
>
<p>
Some message
</p>
</div>
<p>
Some message
</p>
</div>
</div>
<div
class="euiModalFooter"
</div>
<div
class="euiModalFooter"
>
<button
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="confirmModalCancelButton"
type="button"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary"
data-test-subj="confirmModalCancelButton"
type="button"
<span
class="euiButtonContent euiButtonEmpty__content"
>
<span
class="euiButtonContent euiButtonEmpty__content"
class="euiButtonEmpty__text"
>
<span
class="euiButtonEmpty__text"
>
Cancel
</span>
Cancel
</span>
</button>
<button
class="euiButton euiButton--primary euiButton--fill"
data-test-subj="confirmModalConfirmButton"
type="button"
</span>
</button>
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="confirmModalConfirmButton"
type="button"
>
<span
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent euiButton__content"
class="eui-textTruncate"
>
<span
class="euiButton__text"
>
Confirm
</span>
Confirm
</span>
</button>
</div>
</span>
</button>
</div>
</div>
</div>
@ -1078,7 +1070,7 @@ exports[`ModalService openModal() renders a modal to the DOM 2`] = `
>
<button
aria-label="Closes this modal window"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
class="euiButtonIcon euiButtonIcon--xSmall euiModal__closeIcon emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span
@ -1089,15 +1081,11 @@ exports[`ModalService openModal() renders a modal to the DOM 2`] = `
/>
</button>
<div
class="euiModal__flex"
class="kbnOverlayMountWrapper"
>
<div
class="kbnOverlayMountWrapper"
>
<span>
Modal content
</span>
</div>
<span>
Modal content
</span>
</div>
</div>
</div>

105
packages/home/sample_data_card/src/__snapshots__/sample_data_card.test.tsx.snap generated
View file

@ -2,14 +2,14 @@
exports[`SampleDataCard installed renders with app links 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard euiCard--leftAligned euiCard--hasBetaBadge emotion-euiPanel-grow-m-m-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard emotion-euiPanel-grow-m-m-plain-hasShadow-euiCard-left-vertical-hasBetaBadge"
data-test-subj="sampleDataSetCardsample-data-set"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<img
alt=""
@ -18,16 +18,20 @@ exports[`SampleDataCard installed renders with app links 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Sample Data Set
</span>
<span
class="emotion-euiCard__text-left"
>
Sample Data Set
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -36,10 +40,10 @@ exports[`SampleDataCard installed renders with app links 1`] = `
</div>
</div>
<span
class="euiCard__betaBadgeWrapper"
class="emotion-euiCard__betaBadgeAnchor"
>
<span
class="euiBetaBadge euiBetaBadge--hollow euiCard__betaBadge"
class="euiBetaBadge euiBetaBadge--hollow emotion-euiCard__betaBadge"
id="generated-idBetaBadge"
title="installed"
>
@ -47,7 +51,7 @@ exports[`SampleDataCard installed renders with app links 1`] = `
</span>
</span>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<div
class="euiFlexGroup euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
@ -57,7 +61,7 @@ exports[`SampleDataCard installed renders with app links 1`] = `
>
<button
aria-label="Remove Sample Data Set"
class="euiButtonEmpty euiButtonEmpty--danger euiButtonEmpty--flushLeft"
class="euiButtonEmpty euiButtonEmpty--flushLeft css-1v3a3p6-empty-danger"
data-test-subj="removeSampleDataSetsample-data-set"
type="button"
>
@ -85,22 +89,21 @@ exports[`SampleDataCard installed renders with app links 1`] = `
>
<button
aria-label="View Sample Data Set"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
type="button"
>
<span
class="euiButtonContent euiButtonContent--iconRight euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="arrowDown"
/>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>
<span
color="inherit"
data-euiicon-type="arrowDown"
/>
</span>
</button>
</div>
@ -113,14 +116,14 @@ exports[`SampleDataCard installed renders with app links 1`] = `
exports[`SampleDataCard installed renders without app links 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard euiCard--leftAligned euiCard--hasBetaBadge emotion-euiPanel-grow-m-m-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard emotion-euiPanel-grow-m-m-plain-hasShadow-euiCard-left-vertical-hasBetaBadge"
data-test-subj="sampleDataSetCardsample-data-set"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<img
alt=""
@ -129,16 +132,20 @@ exports[`SampleDataCard installed renders without app links 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Sample Data Set
</span>
<span
class="emotion-euiCard__text-left"
>
Sample Data Set
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -147,10 +154,10 @@ exports[`SampleDataCard installed renders without app links 1`] = `
</div>
</div>
<span
class="euiCard__betaBadgeWrapper"
class="emotion-euiCard__betaBadgeAnchor"
>
<span
class="euiBetaBadge euiBetaBadge--hollow euiCard__betaBadge"
class="euiBetaBadge euiBetaBadge--hollow emotion-euiCard__betaBadge"
id="generated-idBetaBadge"
title="installed"
>
@ -158,7 +165,7 @@ exports[`SampleDataCard installed renders without app links 1`] = `
</span>
</span>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<div
class="euiFlexGroup euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
@ -168,7 +175,7 @@ exports[`SampleDataCard installed renders without app links 1`] = `
>
<button
aria-label="Remove Sample Data Set"
class="euiButtonEmpty euiButtonEmpty--danger euiButtonEmpty--flushLeft"
class="euiButtonEmpty euiButtonEmpty--flushLeft css-1v3a3p6-empty-danger"
data-test-subj="removeSampleDataSetsample-data-set"
type="button"
>
@ -188,15 +195,15 @@ exports[`SampleDataCard installed renders without app links 1`] = `
>
<button
aria-label="View Sample Data Set"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="launchSampleDataSetsample-data-set"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>
@ -210,14 +217,14 @@ exports[`SampleDataCard installed renders without app links 1`] = `
exports[`SampleDataCard not installed renders 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard euiCard--leftAligned emotion-euiPanel-grow-m-m-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingMedium euiCard emotion-euiPanel-grow-m-m-plain-hasShadow-euiCard-left-vertical"
data-test-subj="sampleDataSetCardsample-data-set"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<img
alt=""
@ -226,16 +233,20 @@ exports[`SampleDataCard not installed renders 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Sample Data Set
</span>
<span
class="emotion-euiCard__text-left"
>
Sample Data Set
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -244,7 +255,7 @@ exports[`SampleDataCard not installed renders 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--justifyContentFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
@ -254,15 +265,15 @@ exports[`SampleDataCard not installed renders 1`] = `
>
<button
aria-label="Add Sample Data Set"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="addSampleDataSetsample-data-set"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Add data
</span>

8
packages/home/sample_data_card/src/footer/__snapshots__/disabled_footer.test.tsx.snap generated
View file

@ -8,20 +8,20 @@ exports[`install footer should render 1`] = `
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Add Data Set Name"
class="euiButton euiButton--primary euiButton-isDisabled"
class="euiButton emotion-euiButtonDisplay-m-isDisabled-m-base-disabled"
data-test-subj="addSampleDataSetdata-set-id"
disabled=""
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Add data
</span>

6
packages/home/sample_data_card/src/footer/__snapshots__/install_footer.test.tsx.snap generated
View file

@ -9,15 +9,15 @@ exports[`install footer should render 1`] = `
>
<button
aria-label="Add Data Set Name"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="addSampleDataSetdata-set-id"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Add data
</span>

8
packages/home/sample_data_card/src/footer/__snapshots__/remove_footer.test.tsx.snap generated
View file

@ -9,7 +9,7 @@ exports[`install footer should render 1`] = `
>
<button
aria-label="Remove Data Set Name"
class="euiButtonEmpty euiButtonEmpty--danger euiButtonEmpty--flushLeft"
class="euiButtonEmpty euiButtonEmpty--flushLeft css-1v3a3p6-empty-danger"
data-test-subj="removeSampleDataSetdata-set-id"
type="button"
>
@ -29,15 +29,15 @@ exports[`install footer should render 1`] = `
>
<button
aria-label="View Data Set Name"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="launchSampleDataSetdata-set-id"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>

36
packages/home/sample_data_card/src/footer/__snapshots__/view_button.test.tsx.snap generated
View file

@ -11,22 +11,21 @@ exports[`should render popover when appLinks is not empty 1`] = `
>
<button
aria-label="View Sample eCommerce orders"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
type="button"
>
<span
class="euiButtonContent euiButtonContent--iconRight euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="arrowDown"
/>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>
<span
color="inherit"
data-euiicon-type="arrowDown"
/>
</span>
</button>
</div>
@ -44,22 +43,21 @@ exports[`should render popover with ordered appLinks 1`] = `
>
<button
aria-label="View Sample eCommerce orders"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
type="button"
>
<span
class="euiButtonContent euiButtonContent--iconRight euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="arrowDown"
/>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>
<span
color="inherit"
data-euiicon-type="arrowDown"
/>
</span>
</button>
</div>
@ -69,15 +67,15 @@ exports[`should render popover with ordered appLinks 1`] = `
exports[`should render simple button when appLinks is empty 1`] = `
<button
aria-label="View Sample eCommerce orders"
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="launchSampleDataSetecommerce"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
View data
</span>

5
packages/home/sample_data_card/src/sample_data_card.component.tsx
View file

@ -35,9 +35,8 @@ export const SampleDataCard = ({
}: Props) => {
const { name: title, description, id } = sampleDataSet;
const betaBadgeProps = {
label: sampleDataSet.status === INSTALLED_STATUS ? INSTALLED_STATUS : null,
};
const betaBadgeProps =
sampleDataSet.status === INSTALLED_STATUS ? { label: INSTALLED_STATUS } : undefined;
const footer = <Footer {...{ sampleDataSet, onAction }} />;

4
packages/kbn-alerts/src/empty_page/__snapshots__/index.test.tsx.snap generated
View file

@ -18,9 +18,11 @@ exports[`EmptyPage component renders actions with descriptions 1`] = `
description="My Description"
footer={
<EuiButton
color="primary"
data-test-subj="empty-page-actions-action"
fill={true}
href="my/url/from/nowwhere"
size="m"
>
Do Something
</EuiButton>
@ -53,8 +55,10 @@ exports[`EmptyPage component renders actions without descriptions 1`] = `
}
>
<EuiButton
color="primary"
data-test-subj="empty-page-actions-action"
href="my/url/from/nowwhere"
size="m"
>
Do Something
</EuiButton>

10
packages/kbn-guided-onboarding/src/components/landing_page/__snapshots__/guide_card_footer.test.tsx.snap generated
View file

@ -16,9 +16,11 @@ exports[`guide card footer snapshots should render the footer when the guide has
className="eui-textCenter"
>
<EuiButton
color="primary"
data-test-subj="onboarding--guideCard--view--search"
fill={true}
onClick={[Function]}
size="m"
>
View guide
</EuiButton>
@ -31,9 +33,11 @@ exports[`guide card footer snapshots should render the footer when the guide has
className="eui-textCenter"
>
<EuiButton
color="primary"
data-test-subj="onboarding--guideCard--view--search"
fill={true}
onClick={[Function]}
size="m"
>
View guide
</EuiButton>
@ -69,9 +73,11 @@ exports[`guide card footer snapshots should render the footer when the guide is
className="eui-textCenter"
>
<EuiButton
color="primary"
data-test-subj="onboarding--guideCard--continue--search"
fill={true}
onClick={[Function]}
size="m"
>
Continue
</EuiButton>
@ -108,9 +114,11 @@ exports[`guide card footer snapshots should render the footer when the guide is
className="eui-textCenter"
>
<EuiButton
color="primary"
data-test-subj="onboarding--guideCard--continue--search"
fill={true}
onClick={[Function]}
size="m"
>
Continue
</EuiButton>
@ -123,9 +131,11 @@ exports[`guide card footer snapshots should render the footer when the guided on
className="eui-textCenter"
>
<EuiButton
color="primary"
data-test-subj="onboarding--guideCard--view--search"
fill={true}
onClick={[Function]}
size="m"
>
View guide
</EuiButton>

2
packages/kbn-guided-onboarding/src/components/landing_page/__snapshots__/observability_link_card.test.tsx.snap generated
View file

@ -12,9 +12,11 @@ exports[`observability link card snapshots should render link card for observabi
grow={false}
>
<EuiButton
color="primary"
data-test-subj="onboarding--linkCard--observability"
fill={true}
onClick={[Function]}
size="m"
>
View integrations
</EuiButton>

48
packages/kbn-securitysolution-exception-list-components/src/exception_item_card/meta/details_info/__snapshots__/details_info.test.tsx.snap generated
View file

@ -23,15 +23,15 @@ Object {
data-test-subj="MetaInfoDetailslastUpdate"
>
<span
class="euiBadge euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
style="background-color: rgb(211, 218, 230); color: rgb(0, 0, 0);"
title="Last update value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
<p>
Last update value
@ -60,14 +60,14 @@ Object {
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<span
class="euiBadge euiBadge--hollow euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
title="value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
value
</span>
@ -98,15 +98,15 @@ Object {
data-test-subj="MetaInfoDetailslastUpdate"
>
<span
class="euiBadge euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
style="background-color: rgb(211, 218, 230); color: rgb(0, 0, 0);"
title="Last update value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
<p>
Last update value
@ -135,14 +135,14 @@ Object {
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<span
class="euiBadge euiBadge--hollow euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
title="value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
value
</span>
@ -230,15 +230,15 @@ Object {
data-test-subj="MetaInfoDetailslastUpdate"
>
<span
class="euiBadge euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
style="background-color: rgb(211, 218, 230); color: rgb(0, 0, 0);"
title="last update"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
last update
</span>
@ -265,14 +265,14 @@ Object {
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<span
class="euiBadge euiBadge--hollow euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
title="value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
value
</span>
@ -303,15 +303,15 @@ Object {
data-test-subj="MetaInfoDetailslastUpdate"
>
<span
class="euiBadge euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
style="background-color: rgb(211, 218, 230); color: rgb(0, 0, 0);"
title="last update"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
last update
</span>
@ -338,14 +338,14 @@ Object {
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<span
class="euiBadge euiBadge--hollow euiBadge--iconLeft emotion-EuiInnerText"
class="euiBadge emotion-EuiInnerText"
title="value"
>
<span
class="euiBadge__content"
class="euiBadge__content emotion-euiBadge__content"
>
<span
class="euiBadge__text"
class="euiBadge__text emotion-euiBadge__text"
>
value
</span>

26
packages/kbn-securitysolution-exception-list-components/src/header_menu/__snapshots__/header_menu.test.tsx.snap generated
View file

@ -17,7 +17,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="ButtonIcon"
type="button"
>
@ -49,7 +49,7 @@ Object {
tabindex="0"
>
<div
class="emotion-euiPopoverArrow-bottom"
class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
data-popover-arrow="bottom"
style="left: 10px; top: 0px;"
/>
@ -127,7 +127,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="ButtonIcon"
type="button"
>
@ -213,7 +213,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="ButtonIcon"
type="button"
>
@ -242,7 +242,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="ButtonIcon"
type="button"
>
@ -328,7 +328,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>
@ -363,7 +363,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>
@ -455,7 +455,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>
@ -490,7 +490,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>
@ -582,7 +582,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty-isDisabled"
class="euiButtonEmpty css-1at5a38-empty-disabled"
data-test-subj="EmptyButton"
disabled=""
type="button"
@ -618,7 +618,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty-isDisabled"
class="euiButtonEmpty css-1at5a38-empty-disabled"
data-test-subj="EmptyButton"
disabled=""
type="button"
@ -711,7 +711,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>
@ -746,7 +746,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="EmptyButton"
type="button"
>

286
packages/kbn-securitysolution-exception-list-components/src/list_header/__snapshots__/list_header.test.tsx.snap generated
View file

@ -3,9 +3,7 @@
exports[`ExceptionListHeader should render edit modal 1`] = `
Object {
"asFragment": [Function],
"baseElement": <body
class="euiBody-hasOverlayMask"
>
"baseElement": <body>
<div>
<div
css="You have tried to stringify object returned from \`css\` function. It isn't supposed to be used directly (e.g. as value of the \`className\` prop), but rather handed to emotion so it can handle it (e.g. as value of \`css\` prop)."
@ -74,7 +72,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TitleEditIcon"
type="button"
>
@ -116,7 +114,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="DescriptionEditIcon"
type="button"
>
@ -176,15 +174,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -206,7 +204,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>
@ -231,7 +229,9 @@ Object {
</div>
</div>
<div
class="euiOverlayMask euiOverlayMask--aboveHeader"
class="euiOverlayMask"
data-euiportal="true"
data-relative-to-header="above"
>
<div
data-eui="EuiFocusTrap"
@ -243,7 +243,7 @@ Object {
>
<button
aria-label="Closes this modal window"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
class="euiButtonIcon euiButtonIcon--xSmall euiModal__closeIcon emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span
@ -254,136 +254,132 @@ Object {
/>
</button>
<div
class="euiModal__flex"
class="euiModalHeader"
>
<div
class="euiModalHeader"
class="euiModalHeader__title"
data-test-subj="editModalTitle"
>
<div
class="euiModalHeader__title"
data-test-subj="editModalTitle"
>
<h1>
Edit List Name
</h1>
</div>
<h1>
Edit List Name
</h1>
</div>
</div>
<div
class="euiModalBody"
>
<div
class="euiModalBody"
class="euiModalBody__overflow"
>
<div
class="euiModalBody__overflow"
<form
class="euiForm"
data-test-subj="editModalForm"
id="modalForm_generated-id"
>
<form
class="euiForm"
data-test-subj="editModalForm"
id="modalForm_generated-id"
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
class="euiFormRow__labelWrapper"
>
<label
aria-invalid="false"
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Name
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<div
class="euiFormRow__labelWrapper"
>
<label
aria-invalid="false"
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Name
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
class="euiFormControlLayout euiFormControlLayout--fullWidth"
>
<div
class="euiFormControlLayout euiFormControlLayout--fullWidth"
class="euiFormControlLayout__childrenWrapper"
>
<div
class="euiFormControlLayout__childrenWrapper"
>
<input
aria-invalid="false"
class="euiFieldText euiFieldText--fullWidth"
data-test-subj="editModalNameTextField"
id="generated-id"
name="name"
type="text"
value="List Name"
/>
</div>
<input
aria-invalid="false"
class="euiFieldText euiFieldText--fullWidth"
data-test-subj="editModalNameTextField"
id="generated-id"
name="name"
type="text"
value="List Name"
/>
</div>
</div>
</div>
</div>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
class="euiFormRow__labelWrapper"
>
<div
class="euiFormRow__labelWrapper"
<label
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
<label
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Description
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<textarea
class="euiTextArea euiTextArea--resizeVertical euiTextArea--fullWidth"
data-test-subj="editModalDescriptionTextField"
id="generated-id"
name="description"
rows="6"
>
List description
</textarea>
</div>
Description
</label>
</div>
</form>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<textarea
class="euiTextArea euiTextArea--resizeVertical euiTextArea--fullWidth"
data-test-subj="editModalDescriptionTextField"
id="generated-id"
name="description"
rows="6"
>
List description
</textarea>
</div>
</div>
</form>
</div>
<div
class="euiModalFooter"
</div>
<div
class="euiModalFooter"
>
<button
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="editModalCancelBtn"
type="button"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary"
data-test-subj="editModalCancelBtn"
type="button"
<span
class="euiButtonContent euiButtonEmpty__content"
>
<span
class="euiButtonContent euiButtonEmpty__content"
class="euiButtonEmpty__text"
>
<span
class="euiButtonEmpty__text"
>
Cancel
</span>
Cancel
</span>
</button>
<button
class="euiButton euiButton--primary euiButton--fill"
data-test-subj="editModalSaveBtn"
form="modalForm_generated-id"
type="submit"
</span>
</button>
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="editModalSaveBtn"
form="modalForm_generated-id"
type="submit"
>
<span
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent euiButton__content"
class="eui-textTruncate"
>
<span
class="euiButton__text"
>
Save
</span>
Save
</span>
</button>
</div>
</span>
</button>
</div>
</div>
</div>
@ -457,7 +453,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TitleEditIcon"
type="button"
>
@ -499,7 +495,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="DescriptionEditIcon"
type="button"
>
@ -559,15 +555,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -589,7 +585,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>
@ -739,7 +735,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TitleEditIcon"
type="button"
>
@ -781,7 +777,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="DescriptionEditIcon"
type="button"
>
@ -841,15 +837,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -871,7 +867,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>
@ -964,7 +960,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TitleEditIcon"
type="button"
>
@ -1006,7 +1002,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="DescriptionEditIcon"
type="button"
>
@ -1066,15 +1062,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -1096,7 +1092,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>
@ -1320,15 +1316,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -1350,7 +1346,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-disabled-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
disabled=""
type="button"
@ -1518,15 +1514,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -1548,7 +1544,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-disabled-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
disabled=""
type="button"
@ -1773,15 +1769,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -1803,7 +1799,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>
@ -1844,7 +1840,7 @@ Object {
tabindex="0"
>
<div
class="emotion-euiPopoverArrow-bottom"
class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
data-popover-arrow="bottom"
style="left: 10px; top: 0px;"
/>
@ -2051,15 +2047,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="RightSideMenuItemsManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -2081,7 +2077,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="RightSideMenuItemsMenuActionsButtonIcon"
type="button"
>

204
packages/kbn-securitysolution-exception-list-components/src/list_header/edit_modal/__snapshots__/edit_modal.test.tsx.snap generated
View file

@ -3,12 +3,12 @@
exports[`EditModal should render the title and description from listDetails 1`] = `
Object {
"asFragment": [Function],
"baseElement": <body
class="euiBody-hasOverlayMask"
>
"baseElement": <body>
<div />
<div
class="euiOverlayMask euiOverlayMask--aboveHeader"
class="euiOverlayMask"
data-euiportal="true"
data-relative-to-header="above"
>
<div
data-eui="EuiFocusTrap"
@ -20,7 +20,7 @@ Object {
>
<button
aria-label="Closes this modal window"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiModal__closeIcon"
class="euiButtonIcon euiButtonIcon--xSmall euiModal__closeIcon emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span
@ -31,136 +31,132 @@ Object {
/>
</button>
<div
class="euiModal__flex"
class="euiModalHeader"
>
<div
class="euiModalHeader"
class="euiModalHeader__title"
data-test-subj="editModalTitle"
>
<div
class="euiModalHeader__title"
data-test-subj="editModalTitle"
>
<h1>
Edit list name
</h1>
</div>
<h1>
Edit list name
</h1>
</div>
</div>
<div
class="euiModalBody"
>
<div
class="euiModalBody"
class="euiModalBody__overflow"
>
<div
class="euiModalBody__overflow"
<form
class="euiForm"
data-test-subj="editModalForm"
id="modalForm_generated-id"
>
<form
class="euiForm"
data-test-subj="editModalForm"
id="modalForm_generated-id"
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
class="euiFormRow__labelWrapper"
>
<label
aria-invalid="false"
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Name
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<div
class="euiFormRow__labelWrapper"
>
<label
aria-invalid="false"
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Name
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
class="euiFormControlLayout euiFormControlLayout--fullWidth"
>
<div
class="euiFormControlLayout euiFormControlLayout--fullWidth"
class="euiFormControlLayout__childrenWrapper"
>
<div
class="euiFormControlLayout__childrenWrapper"
>
<input
aria-invalid="false"
class="euiFieldText euiFieldText--fullWidth"
data-test-subj="editModalNameTextField"
id="generated-id"
name="name"
type="text"
value="list name"
/>
</div>
<input
aria-invalid="false"
class="euiFieldText euiFieldText--fullWidth"
data-test-subj="editModalNameTextField"
id="generated-id"
name="name"
type="text"
value="list name"
/>
</div>
</div>
</div>
</div>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
>
<div
class="euiFormRow euiFormRow--fullWidth euiFormRow--hasLabel"
id="generated-id-row"
class="euiFormRow__labelWrapper"
>
<div
class="euiFormRow__labelWrapper"
<label
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
<label
class="euiFormLabel euiFormRow__label"
for="generated-id"
id="generated-id-label"
>
Description
</label>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<textarea
class="euiTextArea euiTextArea--resizeVertical euiTextArea--fullWidth"
data-test-subj="editModalDescriptionTextField"
id="generated-id"
name="description"
rows="6"
>
list description
</textarea>
</div>
Description
</label>
</div>
</form>
</div>
<div
class="euiFormRow__fieldWrapper"
>
<textarea
class="euiTextArea euiTextArea--resizeVertical euiTextArea--fullWidth"
data-test-subj="editModalDescriptionTextField"
id="generated-id"
name="description"
rows="6"
>
list description
</textarea>
</div>
</div>
</form>
</div>
<div
class="euiModalFooter"
</div>
<div
class="euiModalFooter"
>
<button
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="editModalCancelBtn"
type="button"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary"
data-test-subj="editModalCancelBtn"
type="button"
<span
class="euiButtonContent euiButtonEmpty__content"
>
<span
class="euiButtonContent euiButtonEmpty__content"
class="euiButtonEmpty__text"
>
<span
class="euiButtonEmpty__text"
>
Cancel
</span>
Cancel
</span>
</button>
<button
class="euiButton euiButton--primary euiButton--fill"
data-test-subj="editModalSaveBtn"
form="modalForm_generated-id"
type="submit"
</span>
</button>
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="editModalSaveBtn"
form="modalForm_generated-id"
type="submit"
>
<span
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent euiButton__content"
class="eui-textTruncate"
>
<span
class="euiButton__text"
>
Save
</span>
Save
</span>
</button>
</div>
</span>
</button>
</div>
</div>
</div>

76
packages/kbn-securitysolution-exception-list-components/src/list_header/menu_items/__snapshots__/menu_items.test.tsx.snap generated
View file

@ -23,15 +23,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -53,7 +53,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -90,15 +90,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -120,7 +120,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -214,15 +214,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -244,7 +244,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -278,7 +278,7 @@ Object {
tabindex="0"
>
<div
class="emotion-euiPopoverArrow-bottom"
class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
data-popover-arrow="bottom"
style="left: 10px; top: 0px;"
/>
@ -361,15 +361,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -391,7 +391,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -486,7 +486,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="LinkedRulesMenuEmptyButton"
type="button"
>
@ -513,15 +513,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -543,7 +543,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -577,7 +577,7 @@ Object {
tabindex="0"
>
<div
class="emotion-euiPopoverArrow-bottom"
class="euiPopover__arrow emotion-euiPopoverArrow-bottom"
data-popover-arrow="bottom"
style="left: 10px; top: 0px;"
/>
@ -662,7 +662,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="LinkedRulesMenuEmptyButton"
type="button"
>
@ -689,15 +689,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -719,7 +719,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -814,7 +814,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="LinkedRulesMenuEmptyButton"
type="button"
>
@ -841,15 +841,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -871,7 +871,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>
@ -909,7 +909,7 @@ Object {
>
<button
aria-label="Header menu Button Empty"
class="euiButtonEmpty euiButtonEmpty--primary"
class="euiButtonEmpty css-9t7nyf-empty-primary"
data-test-subj="LinkedRulesMenuEmptyButton"
type="button"
>
@ -936,15 +936,15 @@ Object {
class="euiFlexItem"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
data-test-subj="ManageRulesButton"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Manage rules
</span>
@ -966,7 +966,7 @@ Object {
>
<button
aria-label="Header menu Button Icon"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="MenuActionsButtonIcon"
type="button"
>

4
packages/kbn-securitysolution-exception-list-components/src/text_with_edit/__snapshots__/text_with_edit.test.tsx.snap generated
View file

@ -117,7 +117,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TextWithEditTestEditIcon"
type="button"
>
@ -150,7 +150,7 @@ Object {
>
<button
aria-label="Edit Text List Header"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="TextWithEditTestEditIcon"
type="button"
>

36
packages/shared-ux/button/exit_full_screen/impl/src/__snapshots__/exit_full_screen_button.test.tsx.snap generated
View file

@ -54,7 +54,7 @@ exports[`<ExitFullScreenButton /> with kibana services is rendered 1`] = `
Object {
"insert": [Function],
"inserted": Object {
"4rqdyn-euiScreenReaderOnly": true,
"hus3oj-euiScreenReaderOnly": true,
},
"key": "css",
"nonce": undefined,
@ -69,7 +69,7 @@ exports[`<ExitFullScreenButton /> with kibana services is rendered 1`] = `
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
.emotion-euiScreenReaderOnly{position:absolute;inset-block-start:auto;inset-inline-start:-10000px;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>
<style
data-styled="active"
@ -92,7 +92,7 @@ exports[`<ExitFullScreenButton /> with kibana services is rendered 1`] = `
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
.emotion-euiScreenReaderOnly{position:absolute;inset-block-start:auto;inset-inline-start:-10000px;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>,
],
},
@ -102,18 +102,20 @@ exports[`<ExitFullScreenButton /> with kibana services is rendered 1`] = `
serialized={
Object {
"map": undefined,
"name": "4rqdyn-euiScreenReaderOnly",
"name": "hus3oj-euiScreenReaderOnly",
"next": undefined,
"styles": ";
// Take the element out of the layout
position: absolute;
// Keep it vertically inline
top: auto;
inset-block-start: auto;
// Chrome requires a left value, and Selenium (used by Kibana's FTR) requires an off-screen position for its .getVisibleText() to not register SR-only text
left: -10000px;
inset-inline-start: -10000px;
// The element must have a size (for some screen readers)
width: 1px;
height: 1px;
inline-size: 1px;
block-size: 1px;
// But reduce the visible size to nothing
clip: rect(0 0 0 0);
clip-path: inset(50%);
@ -255,7 +257,7 @@ exports[`<ExitFullScreenButton /> with manual services is rendered 1`] = `
Object {
"insert": [Function],
"inserted": Object {
"4rqdyn-euiScreenReaderOnly": true,
"hus3oj-euiScreenReaderOnly": true,
},
"key": "css",
"nonce": undefined,
@ -270,7 +272,7 @@ exports[`<ExitFullScreenButton /> with manual services is rendered 1`] = `
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
.emotion-euiScreenReaderOnly{position:absolute;inset-block-start:auto;inset-inline-start:-10000px;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>
<style
data-styled="active"
@ -289,7 +291,7 @@ exports[`<ExitFullScreenButton /> with manual services is rendered 1`] = `
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
.emotion-euiScreenReaderOnly{position:absolute;inset-block-start:auto;inset-inline-start:-10000px;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>,
],
},
@ -299,18 +301,20 @@ exports[`<ExitFullScreenButton /> with manual services is rendered 1`] = `
serialized={
Object {
"map": undefined,
"name": "4rqdyn-euiScreenReaderOnly",
"name": "hus3oj-euiScreenReaderOnly",
"next": undefined,
"styles": ";
// Take the element out of the layout
position: absolute;
// Keep it vertically inline
top: auto;
inset-block-start: auto;
// Chrome requires a left value, and Selenium (used by Kibana's FTR) requires an off-screen position for its .getVisibleText() to not register SR-only text
left: -10000px;
inset-inline-start: -10000px;
// The element must have a size (for some screen readers)
width: 1px;
height: 1px;
inline-size: 1px;
block-size: 1px;
// But reduce the visible size to nothing
clip: rect(0 0 0 0);
clip-path: inset(50%);

596
packages/shared-ux/button_toolbar/src/buttons/add_from_library/__snapshots__/add_from_library.test.tsx.snap generated
View file

@ -1,587 +1,23 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<ToolbarButton /> is rendered 1`] = `
<AddFromLibraryButton
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
intl="[object Object]"
type="button"
>
<PrimaryButton
iconType="folderOpen"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
label="Add from library"
<span
class="emotion-euiButtonDisplayContent"
>
<EuiButton
color="primary"
fill={true}
iconSide="left"
iconType="folderOpen"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
size="m"
<span
color="inherit"
data-euiicon-type="folderOpen"
/>
<span
class="eui-textTruncate"
>
<EuiButtonDisplay
baseClassName="euiButton"
color="primary"
disabled={false}
element="button"
fill={true}
iconSide="left"
iconType="folderOpen"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
isDisabled={false}
size="m"
type="button"
>
<button
className="euiButton euiButton--primary euiButton--fill"
disabled={false}
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
style={
Object {
"minWidth": undefined,
}
}
type="button"
>
<EuiButtonContentDeprecated
className="euiButton__content"
iconSide="left"
iconType="folderOpen"
textProps={
Object {
"className": "euiButton__text",
}
}
>
<span
className="euiButtonContent euiButton__content"
>
<EuiIcon
className="euiButtonContent__icon"
color="inherit"
size="m"
type="folderOpen"
>
<span
className="euiButtonContent__icon"
color="inherit"
data-euiicon-type="folderOpen"
size="m"
/>
</EuiIcon>
<span
className="euiButton__text"
>
Add from library
</span>
</span>
</EuiButtonContentDeprecated>
</button>
</EuiButtonDisplay>
</EuiButton>
</PrimaryButton>
</AddFromLibraryButton>
Add from library
</span>
</span>
</button>
`;

2
packages/shared-ux/button_toolbar/src/buttons/add_from_library/add_from_library.test.tsx
View file

@ -14,6 +14,6 @@ import { AddFromLibraryButton } from './add_from_library';
describe('<ToolbarButton />', () => {
test('is rendered', () => {
const component = mountWithIntl(<AddFromLibraryButton />);
expect(component).toMatchSnapshot();
expect(component.render()).toMatchSnapshot();
});
});

560
packages/shared-ux/button_toolbar/src/buttons/icon_button_group/__snapshots__/icon_button_group.test.tsx.snap generated
View file

@ -1,536 +1,42 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<IconButtonGroup /> is rendered 1`] = `
<IconButtonGroup
buttons={
Array [
Object {
"iconType": "visText",
"label": "Text",
"onClick": [MockFunction],
},
]
}
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
legend="Legend"
<fieldset
class="euiButtonGroup euiButtonGroup--medium euiButtonGroup--text"
>
<EuiButtonGroup
buttonSize="m"
isIconOnly={true}
legend="Legend"
onChange={[Function]}
options={
Array [
Object {
"aria-label": "Text",
"css": Array [
Object {
"&.euiButtonGroupButton": Object {
"&:first-of-type": Object {
"borderBottomLeftRadius": "6px !important",
"borderTopLeftRadius": "6px !important",
},
"&:last-of-type": Object {
"borderBottomRightRadius": "6px !important",
"borderTopRightRadius": "6px !important",
},
"backgroundColor": "#FFF",
"border": "1px solid #D3DAE6 !important",
},
},
],
"iconType": "visText",
"id": "generated-id0",
"label": "Text",
"onClick": [MockFunction],
"title": "Text",
},
]
}
type="multi"
<legend
class="emotion-euiScreenReaderOnly"
>
<fieldset
className="euiButtonGroup euiButtonGroup--medium euiButtonGroup--text"
disabled={false}
Legend
</legend>
<div
class="euiButtonGroup__buttons"
>
<button
aria-label="Text"
aria-pressed="false"
class="euiButtonGroupButton euiButtonGroupButton-isIconOnly css-1h0umek-base-text-EuiButtonGroupButton-EuiButtonGroup"
data-test-subj="generated-id0"
id="generated-id"
title="Text"
type="button"
>
<EuiScreenReaderOnly>
<legend
css="unknown styles"
key="null"
>
<Insertion
cache={
Object {
"insert": [Function],
"inserted": Object {
"4rqdyn-euiScreenReaderOnly": true,
"iuv015-EuiButtonGroup": true,
},
"key": "css",
"nonce": undefined,
"registered": Object {
"emotion-EuiButtonGroup": "&.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6 !important;&:first-of-type{border-top-left-radius:6px !important;border-bottom-left-radius:6px !important;}&:last-of-type{border-top-right-radius:6px !important;border-bottom-right-radius:6px !important;}};;label:EuiButtonGroup;",
},
"sheet": StyleSheet {
"_alreadyInsertedOrderInsensitiveRule": true,
"_insertTag": [Function],
"before": null,
"container": <head>
<style
data-emotion="css"
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup{}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6!important;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:first-of-type{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:last-of-type{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important;}
</style>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
</head>,
"ctr": 5,
"insertionPoint": undefined,
"isSpeedy": false,
"key": "css",
"nonce": undefined,
"prepend": undefined,
"tags": Array [
<style
data-emotion="css"
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup{}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6!important;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:first-of-type{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:last-of-type{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important;}
</style>,
],
},
}
}
isStringTag={true}
serialized={
Object {
"map": undefined,
"name": "4rqdyn-euiScreenReaderOnly",
"next": undefined,
"styles": ";
// Take the element out of the layout
position: absolute;
// Keep it vertically inline
top: auto;
// Chrome requires a left value, and Selenium (used by Kibana's FTR) requires an off-screen position for its .getVisibleText() to not register SR-only text
left: -10000px;
// The element must have a size (for some screen readers)
width: 1px;
height: 1px;
// But reduce the visible size to nothing
clip: rect(0 0 0 0);
clip-path: inset(50%);
// And ensure no overflows occur
overflow: hidden;
// Chrome requires the negative margin to not cause overflows of parent containers
margin: -1px;
;label:euiScreenReaderOnly;;;;",
"toString": [Function],
}
}
/>
<legend
className="emotion-euiScreenReaderOnly"
>
Legend
</legend>
</legend>
</EuiScreenReaderOnly>
<div
className="euiButtonGroup__buttons"
<span
class="euiButtonContent euiButton__content"
>
<EuiButtonGroupButton
aria-label="Text"
color="text"
css="unknown styles"
element="button"
iconType="visText"
id="generated-id0"
isDisabled={false}
isIconOnly={true}
key="0"
label="Text"
name="generated-id"
onChange={[Function]}
onClick={[MockFunction]}
size="m"
title="Text"
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="visText"
/>
<span
class="euiButton__text euiScreenReaderOnly"
data-text="Text"
>
<Insertion
cache={
Object {
"insert": [Function],
"inserted": Object {
"4rqdyn-euiScreenReaderOnly": true,
"iuv015-EuiButtonGroup": true,
},
"key": "css",
"nonce": undefined,
"registered": Object {
"emotion-EuiButtonGroup": "&.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6 !important;&:first-of-type{border-top-left-radius:6px !important;border-bottom-left-radius:6px !important;}&:last-of-type{border-top-right-radius:6px !important;border-bottom-right-radius:6px !important;}};;label:EuiButtonGroup;",
},
"sheet": StyleSheet {
"_alreadyInsertedOrderInsensitiveRule": true,
"_insertTag": [Function],
"before": null,
"container": <head>
<style
data-emotion="css"
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup{}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6!important;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:first-of-type{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:last-of-type{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important;}
</style>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
</head>,
"ctr": 5,
"insertionPoint": undefined,
"isSpeedy": false,
"key": "css",
"nonce": undefined,
"prepend": undefined,
"tags": Array [
<style
data-emotion="css"
data-s=""
>
.emotion-euiScreenReaderOnly{position:absolute;top:auto;left:-10000px;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;margin:-1px;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup{}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6!important;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:first-of-type{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-EuiButtonGroup.euiButtonGroupButton:last-of-type{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important;}
</style>,
],
},
}
}
isStringTag={false}
serialized={
Object {
"map": undefined,
"name": "iuv015-EuiButtonGroup",
"next": undefined,
"styles": "&.euiButtonGroupButton{background-color:#FFF;border:1px solid #D3DAE6 !important;&:first-of-type{border-top-left-radius:6px !important;border-bottom-left-radius:6px !important;}&:last-of-type{border-top-right-radius:6px !important;border-bottom-right-radius:6px !important;}};;label:EuiButtonGroup;",
"toString": [Function],
}
}
/>
<EuiButtonGroupButton
aria-label="Text"
className="emotion-EuiButtonGroup"
color="text"
element="button"
iconType="visText"
id="generated-id0"
isDisabled={false}
isIconOnly={true}
label="Text"
name="generated-id"
onChange={[Function]}
onClick={[MockFunction]}
size="m"
title="Text"
>
<EuiButtonDisplay
aria-label="Text"
baseClassName="euiButtonGroupButton"
className="euiButtonGroupButton-isIconOnly emotion-EuiButtonGroup"
color="text"
data-test-subj="generated-id0"
element="button"
fill={false}
iconType="visText"
id="generated-id"
isDisabled={false}
isSelected={false}
onClick={[MockFunction]}
size="m"
textProps={
Object {
"className": "euiScreenReaderOnly",
"data-text": "Text",
"ref": [Function],
}
}
title="Text"
type="button"
>
<button
aria-label="Text"
aria-pressed={false}
className="euiButtonGroupButton euiButtonGroupButton--text euiButtonGroupButton-isIconOnly emotion-EuiButtonGroup"
data-test-subj="generated-id0"
disabled={false}
id="generated-id"
onClick={[MockFunction]}
style={
Object {
"minWidth": undefined,
}
}
title="Text"
type="button"
>
<EuiButtonContentDeprecated
className="euiButton__content"
iconSide="left"
iconType="visText"
textProps={
Object {
"className": "euiButton__text euiScreenReaderOnly",
"data-text": "Text",
"ref": [Function],
}
}
>
<span
className="euiButtonContent euiButton__content"
>
<EuiIcon
className="euiButtonContent__icon"
color="inherit"
size="m"
type="visText"
>
<span
className="euiButtonContent__icon"
color="inherit"
data-euiicon-type="visText"
size="m"
/>
</EuiIcon>
<span
className="euiButton__text euiScreenReaderOnly"
data-text="Text"
>
Text
</span>
</span>
</EuiButtonContentDeprecated>
</button>
</EuiButtonDisplay>
</EuiButtonGroupButton>
</EuiButtonGroupButton>
</div>
</fieldset>
</EuiButtonGroup>
</IconButtonGroup>
Text
</span>
</span>
</button>
</div>
</fieldset>
`;

2
packages/shared-ux/button_toolbar/src/buttons/icon_button_group/icon_button_group.test.tsx
View file

@ -26,6 +26,6 @@ describe('<IconButtonGroup />', () => {
/>
);
expect(component).toMatchSnapshot();
expect(component.render()).toMatchSnapshot();
});
});

470
packages/shared-ux/button_toolbar/src/buttons/primary/__snapshots__/primary.test.tsx.snap generated
View file

@ -1,465 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<ToolbarButton /> is rendered 1`] = `
<PrimaryButton
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
label="test"
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
intl="[object Object]"
type="button"
>
<EuiButton
color="primary"
fill={true}
iconSide="left"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
size="m"
<span
class="emotion-euiButtonDisplayContent"
>
<EuiButtonDisplay
baseClassName="euiButton"
color="primary"
disabled={false}
element="button"
fill={true}
iconSide="left"
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
isDisabled={false}
size="m"
type="button"
<span
class="eui-textTruncate"
>
<button
className="euiButton euiButton--primary euiButton--fill"
disabled={false}
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
style={
Object {
"minWidth": undefined,
}
}
type="button"
>
<EuiButtonContentDeprecated
className="euiButton__content"
iconSide="left"
textProps={
Object {
"className": "euiButton__text",
}
}
>
<span
className="euiButtonContent euiButton__content"
>
<span
className="euiButton__text"
>
test
</span>
</span>
</EuiButtonContentDeprecated>
</button>
</EuiButtonDisplay>
</EuiButton>
</PrimaryButton>
test
</span>
</span>
</button>
`;

4
packages/shared-ux/button_toolbar/src/buttons/primary/primary.test.tsx
View file

@ -14,13 +14,13 @@ import { PrimaryButton } from './primary';
describe('<ToolbarButton />', () => {
test('is rendered', () => {
const component = mountWithIntl(<PrimaryButton label="test" />);
expect(component).toMatchSnapshot();
expect(component.render()).toMatchSnapshot();
});
test('it can be passed a functional onClick handler', () => {
const mockHandler = jest.fn();
const component = mountWithIntl(<PrimaryButton label="withOnClick" onClick={mockHandler} />);
component.simulate('click');
component.find('button').simulate('click');
expect(mockHandler).toHaveBeenCalled();
});
});

6
packages/shared-ux/button_toolbar/src/popover/__snapshots__/popover.test.tsx.snap generated
View file

@ -9,14 +9,14 @@ exports[`<ToolbarPopover /> is rendered 1`] = `
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
test
</span>

219
packages/shared-ux/button_toolbar/src/toolbar/__snapshots__/toolbar.test.tsx.snap generated
View file

@ -1,200 +1,33 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<Toolbar /> is rendered 1`] = `
<Toolbar
intl={
Object {
"defaultFormats": Object {},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"relative": Object {
"days": Object {
"units": "day",
},
"hours": Object {
"units": "hour",
},
"minutes": Object {
"units": "minute",
},
"months": Object {
"units": "month",
},
"seconds": Object {
"units": "second",
},
"years": Object {
"units": "year",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
<div
class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<EuiFlexGroup
gutterSize="s"
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<button
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="emotion-euiButtonDisplayContent"
>
<span
class="eui-textTruncate"
>
Create chart
</span>
</span>
</button>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<EuiFlexItem
grow={false}
>
<div
className="euiFlexItem euiFlexItem--flexGrowZero"
>
<PrimaryButton
label="Create chart"
onClick={[Function]}
>
<EuiButton
color="primary"
fill={true}
iconSide="left"
onClick={[Function]}
size="m"
>
<EuiButtonDisplay
baseClassName="euiButton"
color="primary"
disabled={false}
element="button"
fill={true}
iconSide="left"
isDisabled={false}
onClick={[Function]}
size="m"
type="button"
>
<button
className="euiButton euiButton--primary euiButton--fill"
disabled={false}
onClick={[Function]}
style={
Object {
"minWidth": undefined,
}
}
type="button"
>
<EuiButtonContentDeprecated
className="euiButton__content"
iconSide="left"
textProps={
Object {
"className": "euiButton__text",
}
}
>
<span
className="euiButtonContent euiButton__content"
>
<span
className="euiButton__text"
>
Create chart
</span>
</span>
</EuiButtonContentDeprecated>
</button>
</EuiButtonDisplay>
</EuiButton>
</PrimaryButton>
</div>
</EuiFlexItem>
<EuiFlexItem
grow={false}
>
<div
className="euiFlexItem euiFlexItem--flexGrowZero"
>
<EuiFlexGroup
alignItems="center"
gutterSize="xs"
responsive={false}
wrap={true}
>
<div
className="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
/>
</EuiFlexGroup>
</div>
</EuiFlexItem>
</div>
</EuiFlexGroup>
</Toolbar>
class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--wrap"
/>
</div>
</div>
`;

2
packages/shared-ux/button_toolbar/src/toolbar/toolbar.test.tsx
View file

@ -18,7 +18,7 @@ describe('<Toolbar />', () => {
const children = { primaryButton };
const component = mountWithIntl(<Toolbar children={children} />);
expect(component).toMatchSnapshot();
expect(component.render()).toMatchSnapshot();
});
test('onClick works as expected when the primary button is clicked', () => {

6
packages/shared-ux/card/no_data/impl/src/__snapshots__/no_data_card.component.test.tsx.snap generated
View file

@ -11,7 +11,9 @@ exports[`NoDataCardComponent props button 1`] = `
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Button
</EuiButton>
@ -40,7 +42,9 @@ exports[`NoDataCardComponent props href 1`] = `
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Add Elastic Agent
</EuiButton>
@ -70,7 +74,9 @@ exports[`NoDataCardComponent renders 1`] = `
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Add Elastic Agent
</EuiButton>

112
packages/shared-ux/card/no_data/impl/src/__snapshots__/no_data_card.test.tsx.snap generated
View file

@ -3,13 +3,13 @@
exports[`NoDataCard props button 1`] = `
<div>
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--isClickable emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<figure
class="euiImageWrapper emotion-euiImageWrapper-fullWidth"
@ -24,15 +24,15 @@ exports[`NoDataCard props button 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<a
aria-describedby="generated-idDescription"
class="euiCard__titleAnchor"
class="euiCard__titleAnchor emotion-euiCard__text-center-interactive"
href="/app/integrations/browse"
rel="noreferrer"
>
@ -42,9 +42,9 @@ exports[`NoDataCard props button 1`] = `
Card title
</span>
</a>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -53,17 +53,17 @@ exports[`NoDataCard props button 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Button
</span>
@ -77,13 +77,13 @@ exports[`NoDataCard props button 1`] = `
exports[`NoDataCard props extends EuiCardProps 1`] = `
<div>
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--isClickable custom_class emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard custom_class emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<figure
class="euiImageWrapper emotion-euiImageWrapper-fullWidth"
@ -98,15 +98,15 @@ exports[`NoDataCard props extends EuiCardProps 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<a
aria-describedby="generated-idDescription"
class="euiCard__titleAnchor"
class="euiCard__titleAnchor emotion-euiCard__text-center-interactive"
href="/app/integrations/browse"
rel="noreferrer"
>
@ -116,9 +116,9 @@ exports[`NoDataCard props extends EuiCardProps 1`] = `
Card title
</span>
</a>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -127,17 +127,17 @@ exports[`NoDataCard props extends EuiCardProps 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Button
</span>
@ -151,13 +151,13 @@ exports[`NoDataCard props extends EuiCardProps 1`] = `
exports[`NoDataCard props href 1`] = `
<div>
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--isClickable emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<figure
class="euiImageWrapper emotion-euiImageWrapper-fullWidth"
@ -172,15 +172,15 @@ exports[`NoDataCard props href 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<a
aria-describedby="generated-idDescription"
class="euiCard__titleAnchor"
class="euiCard__titleAnchor emotion-euiCard__text-center-interactive"
href="#"
rel="noreferrer"
>
@ -190,9 +190,9 @@ exports[`NoDataCard props href 1`] = `
Card title
</span>
</a>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -201,17 +201,17 @@ exports[`NoDataCard props href 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Button
</span>
@ -225,13 +225,13 @@ exports[`NoDataCard props href 1`] = `
exports[`NoDataCard props no access to Fleet 1`] = `
<div>
<div
class="euiPanel euiPanel--subdued euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard-isDisabled emotion-euiPanel-grow-m-l-subdued-EuiCard"
class="euiPanel euiPanel--subdued euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-subdued-EuiCard"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical-disabled"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<figure
class="euiImageWrapper emotion-euiImageWrapper-fullWidth"
@ -246,15 +246,15 @@ exports[`NoDataCard props no access to Fleet 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<button
aria-describedby=" generated-idDescription"
class="euiCard__titleButton"
class="euiCard__titleButton emotion-euiCard__text-center-disabled"
disabled=""
>
<span
@ -263,9 +263,9 @@ exports[`NoDataCard props no access to Fleet 1`] = `
Contact your administrator
</span>
</button>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -284,13 +284,13 @@ exports[`NoDataCard props no access to Fleet 1`] = `
exports[`NoDataCard renders 1`] = `
<div>
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--isClickable emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-EuiCard"
>
<div
class="euiCard__top"
class="euiCard__top emotion-euiCard__top-vertical"
>
<div
class="euiCard__image"
class="euiCard__image emotion-euiCard__image"
>
<figure
class="euiImageWrapper emotion-euiImageWrapper-fullWidth"
@ -305,15 +305,15 @@ exports[`NoDataCard renders 1`] = `
</div>
</div>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<a
aria-describedby="generated-idDescription"
class="euiCard__titleAnchor"
class="euiCard__titleAnchor emotion-euiCard__text-center-interactive"
href="/app/integrations/browse"
rel="noreferrer"
>
@ -323,9 +323,9 @@ exports[`NoDataCard renders 1`] = `
Card title
</span>
</a>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -334,17 +334,17 @@ exports[`NoDataCard renders 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Card title
</span>

43
packages/shared-ux/markdown/impl/__snapshots__/markdown.test.tsx.snap generated
View file

@ -12,11 +12,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
class="euiMarkdownEditorToolbar__buttons"
>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Bold"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -29,11 +29,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Italic"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -49,11 +49,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
class="euiMarkdownEditorToolbar__divider"
/>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Unordered list"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -66,11 +66,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Ordered list"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -83,11 +83,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Task list"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -103,11 +103,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
class="euiMarkdownEditorToolbar__divider"
/>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Quote"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -120,11 +120,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Code"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -137,11 +137,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Link"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -157,11 +157,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
class="euiMarkdownEditorToolbar__divider"
/>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Tooltip"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="euiMarkdownEditorToolbarButton"
type="button"
>
@ -175,7 +175,8 @@ exports[`shared ux markdown component renders for editor 1`] = `
</span>
</div>
<button
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small"
class="euiButtonEmpty euiButtonEmpty--small css-wvaqcf-empty-text"
data-test-subj="markdown_editor_preview_button"
type="button"
>
<span
@ -218,11 +219,11 @@ exports[`shared ux markdown component renders for editor 1`] = `
class="euiMarkdownEditorFooter__actions"
/>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Show markdown help"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--small euiMarkdownEditorFooter__helpButton"
class="euiButtonIcon euiButtonIcon--small euiMarkdownEditorFooter__helpButton emotion-euiButtonIcon-empty-text-hoverStyles"
type="button"
>
<span

3
packages/shared-ux/prompt/no_data_views/impl/src/no_data_views.test.tsx
View file

@ -10,7 +10,6 @@ import React from 'react';
import { ReactWrapper } from 'enzyme';
import { mountWithIntl } from '@kbn/test-jest-helpers';
import { EuiButton } from '@elastic/eui';
import { NoDataViewsPromptServices } from '@kbn/shared-ux-prompt-no-data-views-types';
import { getNoDataViewsPromptServicesMock } from '@kbn/shared-ux-prompt-no-data-views-mocks';
@ -36,7 +35,7 @@ describe('<NoDataViewsPromptTest />', () => {
const component = mount(<NoDataViewsPrompt onDataViewCreated={jest.fn()} />);
expect(services.openDataViewEditor).not.toHaveBeenCalled();
component.find(EuiButton).simulate('click');
component.find('button').simulate('click');
component.unmount();

2
src/dev/license_checker/config.ts
View file

@ -84,6 +84,6 @@ export const LICENSE_OVERRIDES = {
'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts
'@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint
'@elastic/ems-client@8.3.3': ['Elastic License 2.0'],
'@elastic/eui@64.0.5': ['SSPL-1.0 OR Elastic License 2.0'],
'@elastic/eui@67.1.8': ['SSPL-1.0 OR Elastic License 2.0'],
'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry
};

8
src/plugins/advanced_settings/public/management_app/_advanced_settings.scss
View file

@ -16,14 +16,6 @@
// Simulates a left side border without shifting content
box-shadow: -$euiSizeXS 0 $euiColorDanger;
}
@include internetExplorerOnly {
min-height: 1px;
&Row {
min-height: 1px;
}
}
}
.mgtAdvancedSettings__fieldTitleUnsavedIcon {

6
src/plugins/advanced_settings/public/management_app/components/form/form.tsx
View file

@ -195,7 +195,11 @@ export class Form extends PureComponent<FormProps> {
<KibanaThemeProvider theme$={this.props.theme}>
<EuiFlexGroup justifyContent="flexEnd" gutterSize="s">
<EuiFlexItem grow={false}>
<EuiButton size="s" onClick={() => window.location.reload()}>
<EuiButton
size="s"
onClick={() => window.location.reload()}
data-test-subj="windowReloadButton"
>
{i18n.translate('advancedSettings.form.requiresPageReloadToastButtonLabel', {
defaultMessage: 'Reload page',
})}

9
src/plugins/dashboard/public/application/listing/__snapshots__/dashboard_listing.test.tsx.snap generated
View file

@ -29,10 +29,12 @@ exports[`after fetch When given a title that matches multiple dashboards, filter
<EuiEmptyPrompt
actions={
<EuiButton
color="primary"
data-test-subj="newItemButton"
fill={true}
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
Create a dashboard
</EuiButton>
@ -122,10 +124,12 @@ exports[`after fetch initialFilter 1`] = `
<EuiEmptyPrompt
actions={
<EuiButton
color="primary"
data-test-subj="newItemButton"
fill={true}
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
Create a dashboard
</EuiButton>
@ -214,10 +218,12 @@ exports[`after fetch renders all table rows 1`] = `
<EuiEmptyPrompt
actions={
<EuiButton
color="primary"
data-test-subj="newItemButton"
fill={true}
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
Create a dashboard
</EuiButton>
@ -306,10 +312,12 @@ exports[`after fetch renders call to action when no dashboards exist 1`] = `
<EuiEmptyPrompt
actions={
<EuiButton
color="primary"
data-test-subj="newItemButton"
fill={true}
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
Create a dashboard
</EuiButton>
@ -426,6 +434,7 @@ exports[`after fetch renders call to action with continue when no dashboards exi
fill={true}
iconType="pencil"
onClick={[Function]}
size="m"
>
Continue editing
</EuiButton>

2
src/plugins/dashboard/public/application/top_nav/__snapshots__/clone_modal.test.js.snap generated
View file

@ -47,10 +47,12 @@ exports[`renders DashboardCloneModal 1`] = `
/>
</EuiButtonEmpty>
<EuiButton
color="primary"
data-test-subj="cloneConfirmButton"
fill={true}
isLoading={false}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Confirm Clone"

2
src/plugins/data/public/search/errors/timeout_error.test.tsx
View file

@ -32,7 +32,7 @@ describe('SearchTimeoutError', () => {
const component = mount(e.getErrorMessage(startMock.application));
expect(component.find('EuiButton').length).toBe(1);
component.find('EuiButton').simulate('click');
component.find('button[data-test-subj="searchTimeoutError"]').simulate('click');
expect(startMock.application.navigateToApp).toHaveBeenCalledWith('management', {
path: '/kibana/settings',
});

2
src/plugins/data/public/shard_failure_modal/__snapshots__/shard_failure_modal.test.tsx.snap generated
View file

@ -182,9 +182,11 @@ exports[`ShardFailureModal renders matching snapshot given valid properties 1`]
<Component />
</EuiCopy>
<EuiButton
color="primary"
data-test-subj="closeShardFailureModal"
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Close"

52
src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap generated
View file

@ -183,22 +183,17 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButton euiButton--primary euiButton--small"
class="euiButton emotion-euiButtonDisplay-s-s-base-primary"
type="button"
>
<span
class="euiButtonContent euiButtonContent--iconRight euiButton__content"
class="emotion-euiButtonDisplayContent"
>
Download CSV
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="arrowDown"
/>
<span
class="euiButton__text"
>
Download CSV
</span>
</span>
</button>
</div>
@ -235,7 +230,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--xSmall euiButtonEmpty--flushRight"
class="euiButtonEmpty euiButtonEmpty--xSmall euiButtonEmpty--flushRight css-9t7nyf-empty-primary"
type="button"
>
<span
@ -349,7 +344,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall"
class="euiButtonEmpty euiButtonEmpty--xSmall css-wvaqcf-empty-text"
data-test-subj="tablePaginationPopoverButton"
type="button"
>
@ -376,7 +371,7 @@ Array [
>
<nav
aria-label="Pagination for table: "
class="euiPagination"
class="euiPagination emotion-euiPagination-EuiPagination"
>
<span
aria-atomic="true"
@ -388,7 +383,7 @@ Array [
</span>
<button
aria-label="Previous page"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiPaginationArrowButton"
class="euiButtonIcon euiButtonIcon--xSmall euiPaginationArrowButton emotion-euiButtonIcon-empty-disabled-hoverStyles-euiPaginationArrowButton"
data-test-subj="pagination-button-previous"
disabled=""
type="button"
@ -402,7 +397,7 @@ Array [
</button>
<ul
aria-label="Pagination for table: "
class="euiPagination__list"
class="euiPagination__list emotion-euiPagination__list"
>
<li
class="euiPagination__item"
@ -411,7 +406,7 @@ Array [
aria-controls="__table_generated-id"
aria-current="true"
aria-label="Page 1 of 1"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiButtonEmpty-isDisabled euiPaginationButton euiPaginationButton-isActive"
class="euiButtonEmpty euiButtonEmpty--small euiPaginationButton css-7ubx5w-empty-disabled-euiPaginationButton-isActive"
data-test-subj="pagination-button-0"
disabled=""
type="button"
@ -430,7 +425,7 @@ Array [
</ul>
<button
aria-label="Next page"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiPaginationArrowButton"
class="euiButtonIcon euiButtonIcon--xSmall euiPaginationArrowButton emotion-euiButtonIcon-empty-disabled-hoverStyles-euiPaginationArrowButton"
data-test-subj="pagination-button-next"
disabled=""
type="button"
@ -493,7 +488,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small"
class="euiButtonEmpty euiButtonEmpty--small css-9t7nyf-empty-primary"
data-test-subj="inspectorTableChooser"
type="button"
>
@ -528,22 +523,17 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButton euiButton--primary euiButton--small"
class="euiButton emotion-euiButtonDisplay-s-s-base-primary"
type="button"
>
<span
class="euiButtonContent euiButtonContent--iconRight euiButton__content"
class="emotion-euiButtonDisplayContent"
>
Download CSV
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="arrowDown"
/>
<span
class="euiButton__text"
>
Download CSV
</span>
</span>
</button>
</div>
@ -580,7 +570,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--xSmall euiButtonEmpty--flushRight"
class="euiButtonEmpty euiButtonEmpty--xSmall euiButtonEmpty--flushRight css-9t7nyf-empty-primary"
type="button"
>
<span
@ -695,7 +685,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall"
class="euiButtonEmpty euiButtonEmpty--xSmall css-wvaqcf-empty-text"
data-test-subj="tablePaginationPopoverButton"
type="button"
>
@ -722,7 +712,7 @@ Array [
>
<nav
aria-label="Pagination for table: "
class="euiPagination"
class="euiPagination emotion-euiPagination-EuiPagination"
>
<span
aria-atomic="true"
@ -734,7 +724,7 @@ Array [
</span>
<button
aria-label="Previous page"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiPaginationArrowButton"
class="euiButtonIcon euiButtonIcon--xSmall euiPaginationArrowButton emotion-euiButtonIcon-empty-disabled-hoverStyles-euiPaginationArrowButton"
data-test-subj="pagination-button-previous"
disabled=""
type="button"
@ -748,7 +738,7 @@ Array [
</button>
<ul
aria-label="Pagination for table: "
class="euiPagination__list"
class="euiPagination__list emotion-euiPagination__list"
>
<li
class="euiPagination__item"
@ -757,7 +747,7 @@ Array [
aria-controls="__table_generated-id"
aria-current="true"
aria-label="Page 1 of 1"
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small euiButtonEmpty-isDisabled euiPaginationButton euiPaginationButton-isActive"
class="euiButtonEmpty euiButtonEmpty--small euiPaginationButton css-7ubx5w-empty-disabled-euiPaginationButton-isActive"
data-test-subj="pagination-button-0"
disabled=""
type="button"
@ -776,7 +766,7 @@ Array [
</ul>
<button
aria-label="Next page"
class="euiButtonIcon euiButtonIcon-isDisabled euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall euiPaginationArrowButton"
class="euiButtonIcon euiButtonIcon--xSmall euiPaginationArrowButton emotion-euiButtonIcon-empty-disabled-hoverStyles-euiPaginationArrowButton"
data-test-subj="pagination-button-next"
disabled=""
type="button"

3
src/plugins/data_view_field_editor/public/components/field_format_editor/editors/color/__snapshots__/color.test.tsx.snap generated
View file

@ -89,6 +89,7 @@ exports[`ColorFormatEditor should render multiple colors 1`] = `
size="m"
/>
<EuiButton
color="primary"
data-test-subj="colorEditorAddColor"
iconType="plusInCircle"
onClick={[Function]}
@ -188,6 +189,7 @@ exports[`ColorFormatEditor should render other type normally (range field) 1`] =
size="m"
/>
<EuiButton
color="primary"
data-test-subj="colorEditorAddColor"
iconType="plusInCircle"
onClick={[Function]}
@ -287,6 +289,7 @@ exports[`ColorFormatEditor should render string type normally (regex field) 1`]
size="m"
/>
<EuiButton
color="primary"
data-test-subj="colorEditorAddColor"
iconType="plusInCircle"
onClick={[Function]}

2
src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap generated
View file

@ -73,6 +73,7 @@ exports[`StaticLookupFormatEditor should render multiple lookup entries and unkn
size="m"
/>
<EuiButton
color="primary"
data-test-subj="staticLookupEditorAddEntry"
iconType="plusInCircle"
onClick={[Function]}
@ -182,6 +183,7 @@ exports[`StaticLookupFormatEditor should render normally 1`] = `
size="m"
/>
<EuiButton
color="primary"
data-test-subj="staticLookupEditorAddEntry"
iconType="plusInCircle"
onClick={[Function]}

2
src/plugins/data_view_management/public/components/edit_index_pattern/indexed_fields_table/components/table/__snapshots__/table.test.tsx.snap generated
View file

@ -68,8 +68,10 @@ exports[`Table render conflict summary modal 1`] = `
</EuiModalBody>
<EuiModalFooter>
<EuiButton
color="primary"
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Close"

4
src/plugins/data_view_management/public/components/edit_index_pattern/source_filters_table/components/add_filter/__snapshots__/add_filter.test.tsx.snap generated
View file

@ -15,9 +15,11 @@ exports[`AddFilter should ignore strings with just spaces 1`] = `
</EuiFlexItem>
<EuiFlexItem>
<EuiButton
color="primary"
data-test-subj="addFieldFilterButton"
isDisabled={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Add"
@ -44,9 +46,11 @@ exports[`AddFilter should render normally 1`] = `
</EuiFlexItem>
<EuiFlexItem>
<EuiButton
color="primary"
data-test-subj="addFieldFilterButton"
isDisabled={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Add"

2
src/plugins/discover/public/application/main/components/top_nav/__snapshots__/open_search_panel.test.tsx.snap generated
View file

@ -59,10 +59,12 @@ exports[`OpenSearchPanel render 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="manageSearchesBtn"
fill={true}
href="/app/management/kibana/objects?_a=(tab:search)"
onClick={[MockFunction]}
size="m"
>
<FormattedMessage
defaultMessage="Manage searches"

8
src/plugins/discover/public/components/discover_grid/build_copy_column_button.test.tsx
View file

@ -30,7 +30,7 @@ describe('Build a column button to copy to clipboard', () => {
</EuiButton>
);
wrapper.find(EuiButton).simulate('click');
wrapper.find('button').simulate('click');
expect(execCommandMock).toHaveBeenCalledWith('copy');
expect(warn).not.toHaveBeenCalled();
@ -60,7 +60,7 @@ describe('Build a column button to copy to clipboard', () => {
</EuiButton>
);
await wrapper.find(EuiButton).simulate('click');
await wrapper.find('button').simulate('click');
// first row out of 3 rows does not have a value
expect(navigator.clipboard.writeText).toHaveBeenCalledWith('"custom_extension"\n\njpg\ngif');
@ -83,7 +83,7 @@ describe('Build a column button to copy to clipboard', () => {
</EuiButton>
);
await wrapperSource.find(EuiButton).simulate('click');
await wrapperSource.find('button').simulate('click');
// first row out of 3 rows does not have a value
expect(navigator.clipboard.writeText).toHaveBeenNthCalledWith(
@ -111,7 +111,7 @@ describe('Build a column button to copy to clipboard', () => {
</EuiButton>
);
wrapper.find(EuiButton).simulate('click');
wrapper.find('button').simulate('click');
expect(execCommandMock).toHaveBeenCalledWith('copy');
expect(warn).toHaveBeenCalledWith('Unable to copy to clipboard.');

4
src/plugins/discover/public/components/discover_grid/get_render_cell_value.test.tsx
View file

@ -120,7 +120,7 @@ describe('Discover grid cell rendering', function () {
/>
);
expect(component.html()).toMatchInlineSnapshot(
`"<div class=\\"euiFlexGroup euiFlexGroup--directionRow\\"><div class=\\"euiFlexItem\\"><span class=\\"dscDiscoverGrid__cellPopoverValue eui-textBreakWord\\">100</span></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Close popover\\" data-test-subj=\\"docTableClosePopover\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div>"`
`"<div class=\\"euiFlexGroup euiFlexGroup--directionRow\\"><div class=\\"euiFlexItem\\"><span class=\\"dscDiscoverGrid__cellPopoverValue eui-textBreakWord\\">100</span></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonIcon euiButtonIcon--xSmall css-1q7ycil-euiButtonIcon-empty-primary-hoverStyles\\" type=\\"button\\" aria-label=\\"Close popover\\" data-test-subj=\\"docTableClosePopover\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div>"`
);
});
@ -146,7 +146,7 @@ describe('Discover grid cell rendering', function () {
/>
);
expect(component.html()).toMatchInlineSnapshot(
`"<div class=\\"euiFlexGroup euiFlexGroup--directionRow\\"><div class=\\"euiFlexItem\\"><span class=\\"dscDiscoverGrid__cellPopoverValue eui-textBreakWord\\">100</span></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall\\" type=\\"button\\" aria-label=\\"Close popover\\" data-test-subj=\\"docTableClosePopover\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div>"`
`"<div class=\\"euiFlexGroup euiFlexGroup--directionRow\\"><div class=\\"euiFlexItem\\"><span class=\\"dscDiscoverGrid__cellPopoverValue eui-textBreakWord\\">100</span></div><div class=\\"euiFlexItem euiFlexItem--flexGrowZero\\"><button class=\\"euiButtonIcon euiButtonIcon--xSmall css-1q7ycil-euiButtonIcon-empty-primary-hoverStyles\\" type=\\"button\\" aria-label=\\"Close popover\\" data-test-subj=\\"docTableClosePopover\\"><span data-euiicon-type=\\"cross\\" class=\\"euiButtonIcon__icon\\" aria-hidden=\\"true\\" color=\\"inherit\\"></span></button></div></div>"`
);
findTestSubject(component, 'docTableClosePopover').simulate('click');
expect(closePopoverMockFn).toHaveBeenCalledTimes(1);

2
src/plugins/discover/public/components/discover_tour/discover_tour.test.tsx
View file

@ -41,7 +41,7 @@ describe('Discover tour', () => {
expect(component.find(EuiTourStep)).toHaveLength(0);
// one step should become visible after the tour is triggered
component.find(`[data-test-subj="${buttonSubjToTestStart}"]`).at(0).simulate('click');
component.find(`button[data-test-subj="${buttonSubjToTestStart}"]`).at(0).simulate('click');
expect(component.find(EuiTourStep)).toHaveLength(5);
expect(

62
src/plugins/discover/public/components/doc_table/components/table_header/__snapshots__/table_header.test.tsx.snap generated
View file

@ -17,7 +17,7 @@ exports[`TableHeader with time column renders correctly 1`] = `
>
time
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<span
data-euiicon-type="clock"
@ -27,11 +27,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
</span>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Sort time descending"
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
class="euiButtonIcon euiButtonIcon--xSmall emotion-euiButtonIcon-empty-primary-hoverStyles"
data-test-subj="docTableHeaderFieldSort_time"
style="width: 12px; height: 12px;"
type="button"
@ -55,11 +55,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
>
first
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove first column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-first"
style="width: 12px; height: 12px;"
type="button"
@ -73,11 +73,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move first column to the right"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveRightHeader-first"
style="width: 12px; height: 12px;"
type="button"
@ -101,11 +101,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
>
middle
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove middle column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -119,11 +119,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move middle column to the left"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveLeftHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -137,11 +137,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move middle column to the right"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveRightHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -165,11 +165,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
>
last
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove last column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-last"
style="width: 12px; height: 12px;"
type="button"
@ -183,11 +183,11 @@ exports[`TableHeader with time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move last column to the left"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveLeftHeader-last"
style="width: 12px; height: 12px;"
type="button"
@ -222,11 +222,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
>
first
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove first column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-first"
style="width: 12px; height: 12px;"
type="button"
@ -240,11 +240,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move first column to the right"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveRightHeader-first"
style="width: 12px; height: 12px;"
type="button"
@ -268,11 +268,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
>
middle
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove middle column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -286,11 +286,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move middle column to the left"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveLeftHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -304,11 +304,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move middle column to the right"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveRightHeader-middle"
style="width: 12px; height: 12px;"
type="button"
@ -332,11 +332,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
>
last
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Remove last column"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableRemoveHeader-last"
style="width: 12px; height: 12px;"
type="button"
@ -350,11 +350,11 @@ exports[`TableHeader without time column renders correctly 1`] = `
</button>
</span>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
aria-label="Move last column to the left"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall kbnDocTableHeader__move"
class="euiButtonIcon euiButtonIcon--xSmall kbnDocTableHeader__move emotion-euiButtonIcon-empty-text-hoverStyles"
data-test-subj="docTableMoveLeftHeader-last"
style="width: 12px; height: 12px;"
type="button"

264
src/plugins/discover/public/components/doc_table/components/table_row/__snapshots__/table_cell.test.tsx.snap generated
View file

@ -34,32 +34,122 @@ exports[`Doc table cell component renders a cell with filter buttons if it is fi
display="inlineBlock"
position="bottom"
>
<span
className="euiToolTipAnchor"
<EuiToolTipAnchor
display="inlineBlock"
id="generated-id"
isVisible={false}
onBlur={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<button
aria-label="Filter for value"
className="kbnDocTableRowFilterButton"
data-test-subj="docTableCellFilter"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
<span
css="unknown styles"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<EuiIcon
color="primary"
size="s"
type="plusInCircle"
<Insertion
cache={
Object {
"insert": [Function],
"inserted": Object {
"jcaat8-euiToolTipAnchor-inlineBlock": true,
},
"key": "css",
"nonce": undefined,
"registered": Object {},
"sheet": StyleSheet {
"_alreadyInsertedOrderInsensitiveRule": true,
"_insertTag": [Function],
"before": null,
"container": <head>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock{display:inline-block;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock *[disabled]{pointer-events:none;}
</style>
</head>,
"ctr": 2,
"insertionPoint": undefined,
"isSpeedy": false,
"key": "css",
"nonce": undefined,
"prepend": undefined,
"tags": Array [
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock{display:inline-block;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock *[disabled]{pointer-events:none;}
</style>,
],
},
}
}
isStringTag={true}
serialized={
Object {
"map": undefined,
"name": "jcaat8-euiToolTipAnchor-inlineBlock",
"next": undefined,
"styles": "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;;;display:inline-block;label:inlineBlock;;;",
"toString": [Function],
}
}
/>
<span
className="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<span
color="primary"
data-euiicon-type="plusInCircle"
size="s"
/>
</EuiIcon>
</button>
</span>
<button
aria-label="Filter for value"
className="kbnDocTableRowFilterButton"
data-test-subj="docTableCellFilter"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
>
<EuiIcon
color="primary"
size="s"
type="plusInCircle"
>
<span
color="primary"
data-euiicon-type="plusInCircle"
size="s"
/>
</EuiIcon>
</button>
</span>
</span>
</EuiToolTipAnchor>
</EuiToolTip>
<EuiToolTip
className="kbnDocTableCell__filterButton"
@ -68,32 +158,122 @@ exports[`Doc table cell component renders a cell with filter buttons if it is fi
display="inlineBlock"
position="bottom"
>
<span
className="euiToolTipAnchor"
<EuiToolTipAnchor
display="inlineBlock"
id="generated-id"
isVisible={false}
onBlur={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<button
aria-label="Filter out value"
className="kbnDocTableRowFilterButton"
data-test-subj="docTableCellFilterNegate"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
<span
css="unknown styles"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<EuiIcon
color="primary"
size="s"
type="minusInCircle"
<Insertion
cache={
Object {
"insert": [Function],
"inserted": Object {
"jcaat8-euiToolTipAnchor-inlineBlock": true,
},
"key": "css",
"nonce": undefined,
"registered": Object {},
"sheet": StyleSheet {
"_alreadyInsertedOrderInsensitiveRule": true,
"_insertTag": [Function],
"before": null,
"container": <head>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock{display:inline-block;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock *[disabled]{pointer-events:none;}
</style>
</head>,
"ctr": 2,
"insertionPoint": undefined,
"isSpeedy": false,
"key": "css",
"nonce": undefined,
"prepend": undefined,
"tags": Array [
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock{display:inline-block;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-inlineBlock *[disabled]{pointer-events:none;}
</style>,
],
},
}
}
isStringTag={true}
serialized={
Object {
"map": undefined,
"name": "jcaat8-euiToolTipAnchor-inlineBlock",
"next": undefined,
"styles": "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;;;display:inline-block;label:inlineBlock;;;",
"toString": [Function],
}
}
/>
<span
className="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<span
color="primary"
data-euiicon-type="minusInCircle"
size="s"
/>
</EuiIcon>
</button>
</span>
<button
aria-label="Filter out value"
className="kbnDocTableRowFilterButton"
data-test-subj="docTableCellFilterNegate"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
>
<EuiIcon
color="primary"
size="s"
type="minusInCircle"
>
<span
color="primary"
data-euiicon-type="minusInCircle"
size="s"
/>
</EuiIcon>
</button>
</span>
</span>
</EuiToolTipAnchor>
</EuiToolTip>
</span>
</TableCellActions>

8
src/plugins/discover/public/components/field_name/__snapshots__/field_name.test.tsx.snap generated
View file

@ -23,7 +23,7 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero kbnDocViewer__fieldName eui-textBreakAll"
>
<span
class="euiToolTipAnchor eui-textBreakAll"
class="euiToolTipAnchor eui-textBreakAll emotion-euiToolTipAnchor-inlineBlock"
>
<span>
test.test.test
@ -57,7 +57,7 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero kbnDocViewer__fieldName eui-textBreakAll"
>
<span
class="euiToolTipAnchor eui-textBreakAll"
class="euiToolTipAnchor eui-textBreakAll emotion-euiToolTipAnchor-inlineBlock"
>
<span>
test.test.test
@ -91,7 +91,7 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero kbnDocViewer__fieldName eui-textBreakAll"
>
<span
class="euiToolTipAnchor eui-textBreakAll"
class="euiToolTipAnchor eui-textBreakAll emotion-euiToolTipAnchor-inlineBlock"
>
<span>
test
@ -125,7 +125,7 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero kbnDocViewer__fieldName eui-textBreakAll"
>
<span
class="euiToolTipAnchor eui-textBreakAll"
class="euiToolTipAnchor eui-textBreakAll emotion-euiToolTipAnchor-inlineBlock"
>
<span>
test.test.test

4
src/plugins/embeddable/public/lib/panel/panel_header/panel_actions/add_panel/tests/saved_object_finder_create_new.test.tsx
View file

@ -9,7 +9,7 @@
import React from 'react';
import { SavedObjectFinderCreateNew } from '../saved_object_finder_create_new';
import { shallow } from 'enzyme';
import { EuiButton, EuiContextMenuItem, EuiContextMenuPanel, EuiPopover } from '@elastic/eui';
import { EuiContextMenuItem, EuiContextMenuPanel, EuiPopover } from '@elastic/eui';
import { mountWithIntl } from '@kbn/test-jest-helpers';
describe('SavedObjectFinderCreateNew', () => {
@ -66,7 +66,7 @@ describe('SavedObjectFinderCreateNew', () => {
const component = mountWithIntl(<SavedObjectFinderCreateNew menuItems={items} />);
let popover = component.find(EuiPopover);
expect(popover.prop('isOpen')).toBe(false);
const button = component.find(EuiButton);
const button = component.find('button');
button.simulate('click');
popover = component.find(EuiPopover);
expect(popover.prop('isOpen')).toBe(true);

14
src/plugins/es_ui_shared/public/components/view_api_request_flyout/__snapshots__/view_api_request_flyout.test.tsx.snap generated
View file

@ -12,7 +12,7 @@ exports[`ViewApiRequestFlyout is rendered 1`] = `
type="button"
/>
<div
class="euiFlyoutHeader"
class="euiFlyoutHeader emotion-euiFlyoutHeader"
>
<h2
class="euiTitle emotion-euiTitle-m"
@ -22,10 +22,10 @@ exports[`ViewApiRequestFlyout is rendered 1`] = `
</h2>
</div>
<div
class="euiFlyoutBody"
class="euiFlyoutBody emotion-euiFlyoutBody"
>
<div
class="euiFlyoutBody__overflow"
class="euiFlyoutBody__overflow css-1fk8opf-noBanner"
tabindex="0"
>
<div
@ -50,10 +50,10 @@ exports[`ViewApiRequestFlyout is rendered 1`] = `
class="eui-textRight"
>
<span
class="euiToolTipAnchor"
class="euiToolTipAnchor emotion-euiToolTipAnchor-inlineBlock"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--xSmall euiButtonEmpty--flushRight"
class="euiButtonEmpty euiButtonEmpty--xSmall euiButtonEmpty--flushRight css-9t7nyf-empty-primary"
data-test-subj="apiRequestFlyoutCopyClipboardButton"
type="button"
>
@ -91,10 +91,10 @@ exports[`ViewApiRequestFlyout is rendered 1`] = `
</div>
</div>
<div
class="euiFlyoutFooter"
class="euiFlyoutFooter emotion-euiFlyoutFooter"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--flushLeft"
class="euiButtonEmpty euiButtonEmpty--flushLeft css-9t7nyf-empty-primary"
data-test-subj="apiRequestFlyoutClose"
type="button"
>

3
src/plugins/files/public/components/file_picker/file_picker.test.tsx
View file

@ -7,7 +7,6 @@
*/
import React from 'react';
import { EuiButtonEmpty } from '@elastic/eui';
import { act } from 'react-dom/test-utils';
import { registerTestBed } from '@kbn/test-jest-helpers';
@ -60,7 +59,7 @@ describe('FilePicker', () => {
actions: {
select: (n: number) =>
act(() => {
const file = testBed.find(testSubjects.fileGrid).childAt(n).find(EuiButtonEmpty);
const file = testBed.find(testSubjects.fileGrid).childAt(n).find('button').first();
file.simulate('click');
testBed.component.update();
}),

2
src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap generated
View file

@ -53,12 +53,14 @@ exports[`AddData render 1`] = `
}
>
<EuiButton
color="primary"
data-test-subj="homeAddData"
fill={true}
fullWidth={true}
href="/app/integrations/browse"
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Add integrations"

2
src/plugins/home/public/application/components/tutorial/__snapshots__/footer.test.js.snap generated
View file

@ -22,8 +22,10 @@ exports[`render 1`] = `
grow={false}
>
<EuiButton
color="primary"
fill={true}
href="/app/myapp"
size="m"
>
launch myapp
</EuiButton>

10
src/plugins/home/public/application/components/tutorial/__snapshots__/instruction_set.test.js.snap generated
View file

@ -191,8 +191,10 @@ exports[`statusCheckState checking status 1`] = `
size="s"
/>
<EuiButton
color="primary"
isLoading={true}
onClick={[Function]}
size="m"
>
custom btn label
</EuiButton>
@ -305,8 +307,10 @@ exports[`statusCheckState failed status check - error 1`] = `
size="s"
/>
<EuiButton
color="primary"
isLoading={false}
onClick={[Function]}
size="m"
>
custom btn label
</EuiButton>
@ -428,8 +432,10 @@ exports[`statusCheckState failed status check - no data 1`] = `
size="s"
/>
<EuiButton
color="primary"
isLoading={false}
onClick={[Function]}
size="m"
>
custom btn label
</EuiButton>
@ -551,8 +557,10 @@ exports[`statusCheckState initial state - no check has been attempted 1`] = `
size="s"
/>
<EuiButton
color="primary"
isLoading={true}
onClick={[Function]}
size="m"
>
custom btn label
</EuiButton>
@ -665,8 +673,10 @@ exports[`statusCheckState successful status check 1`] = `
size="s"
/>
<EuiButton
color="primary"
isLoading={false}
onClick={[Function]}
size="m"
>
custom btn label
</EuiButton>

14
src/plugins/home/public/application/components/tutorial/__snapshots__/saved_objects_installer.test.js.snap generated
View file

@ -25,15 +25,15 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<button
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="loadSavedObjects"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Load Kibana objects
</span>
@ -82,15 +82,15 @@ Array [
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<button
class="euiButton euiButton--primary"
class="euiButton emotion-euiButtonDisplay-m-m-base-primary"
data-test-subj="loadSavedObjects"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Load Kibana objects
</span>
@ -138,9 +138,11 @@ exports[`renders 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="loadSavedObjects"
isLoading={false}
onClick={[Function]}
size="m"
>
Load Kibana objects
</EuiButton>

2
src/plugins/input_control_vis/public/components/editor/__snapshots__/controls_tab.test.tsx.snap generated
View file

@ -171,10 +171,12 @@ exports[`renders ControlsTab 1`] = `
>
<EuiButton
aria-label="Add control"
color="primary"
data-test-subj="inputControlEditorAddBtn"
fill={true}
iconType="plusInCircle"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Add"

8
src/plugins/input_control_vis/public/components/vis/__snapshots__/input_control_vis.test.tsx.snap generated
View file

@ -44,10 +44,12 @@ exports[`Apply and Cancel change btns enabled when there are changes 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="inputControlSubmitBtn"
disabled={false}
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Apply changes"
@ -135,10 +137,12 @@ exports[`Clear btns enabled when there are values 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="inputControlSubmitBtn"
disabled={true}
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Apply changes"
@ -226,10 +230,12 @@ exports[`Renders list control 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="inputControlSubmitBtn"
disabled={true}
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Apply changes"
@ -324,10 +330,12 @@ exports[`Renders range control 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="inputControlSubmitBtn"
disabled={true}
fill={true}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Apply changes"

8
src/plugins/inspector/public/ui/__snapshots__/inspector_panel.test.tsx.snap generated
View file

@ -3,7 +3,7 @@
exports[`InspectorPanel should render as expected 1`] = `
Array [
<div
class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
class="euiFlyoutHeader emotion-euiFlyoutHeader-hasBorder"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
@ -28,7 +28,7 @@ Array [
class="euiPopover__anchor css-16vtueo-render"
>
<button
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--small"
class="euiButtonEmpty euiButtonEmpty--small css-9t7nyf-empty-primary"
data-test-subj="inspectorViewChooser"
type="button"
>
@ -53,10 +53,10 @@ Array [
</div>
</div>,
<div
class="euiFlyoutBody insInspectorPanel__flyoutBody"
class="euiFlyoutBody insInspectorPanel__flyoutBody emotion-euiFlyoutBody"
>
<div
class="euiFlyoutBody__overflow"
class="euiFlyoutBody__overflow css-1fk8opf-noBanner"
tabindex="0"
>
<div

6
src/plugins/interactive_setup/public/submit_error_callout.test.tsx
View file

@ -102,7 +102,9 @@ describe('SubmitErrorCallout', () => {
}
>
<EuiButton
color="primary"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Continue to Kibana"
@ -180,7 +182,9 @@ describe('SubmitErrorCallout', () => {
}
>
<EuiButton
color="primary"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Continue to Kibana"
@ -338,7 +342,9 @@ describe('SubmitErrorCallout', () => {
}
>
<EuiButton
color="primary"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Continue to Kibana"

116
src/plugins/kibana_react/public/code_editor/__snapshots__/code_editor.test.tsx.snap generated
View file

@ -163,24 +163,110 @@ exports[`<CodeEditor /> is rendered 1`] = `
display="block"
position="top"
>
<span
className="euiToolTipAnchor euiToolTipAnchor--displayBlock"
<EuiToolTipAnchor
display="block"
id="generated-id"
isVisible={false}
onBlur={[Function]}
onFocus={[Function]}
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<div
aria-label="Code Editor"
className="kibanaCodeEditor__keyboardHint"
data-test-subj="codeEditorHint"
id="1234"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
role="button"
tabIndex={0}
/>
</span>
<span
css="unknown styles"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<Insertion
cache={
Object {
"insert": [Function],
"inserted": Object {
"uuw4g3-euiToolTipAnchor-block": true,
},
"key": "css",
"nonce": undefined,
"registered": Object {},
"sheet": StyleSheet {
"_alreadyInsertedOrderInsensitiveRule": true,
"_insertTag": [Function],
"before": null,
"container": <head>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-block{display:block;}
</style>
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-block *[disabled]{pointer-events:none;}
</style>
<style
data-styled="active"
data-styled-version="5.1.0"
/>
</head>,
"ctr": 2,
"insertionPoint": undefined,
"isSpeedy": false,
"key": "css",
"nonce": undefined,
"prepend": undefined,
"tags": Array [
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-block{display:block;}
</style>,
<style
data-emotion="css"
data-s=""
>
.emotion-euiToolTipAnchor-block *[disabled]{pointer-events:none;}
</style>,
],
},
}
}
isStringTag={true}
serialized={
Object {
"map": undefined,
"name": "uuw4g3-euiToolTipAnchor-block",
"next": undefined,
"styles": "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;;;display:block;label:block;;;",
"toString": [Function],
}
}
/>
<span
className="euiToolTipAnchor emotion-euiToolTipAnchor-block"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<div
aria-label="Code Editor"
className="kibanaCodeEditor__keyboardHint"
data-test-subj="codeEditorHint"
id="1234"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
role="button"
tabIndex={0}
/>
</span>
</span>
</EuiToolTipAnchor>
</EuiToolTip>
<Component>
<mockMonacoEditor

2
src/plugins/kibana_react/public/page_template/__snapshots__/page_template.test.tsx.snap generated
View file

@ -370,7 +370,7 @@ exports[`KibanaPageTemplate render solutionNav 1`] = `
</nav>
<button
aria-label="Collapse side navigation"
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--small kbnPageTemplateSolutionNavCollapseButton"
class="euiButtonIcon euiButtonIcon--small kbnPageTemplateSolutionNavCollapseButton emotion-euiButtonIcon-empty-text-hoverStyles"
title="Collapse side navigation"
type="button"
>

30
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap generated
View file

@ -13,15 +13,12 @@ exports[`ElasticAgentCard props button 1`] = `
}
>
<EuiCard
betaBadgeProps={
Object {
"label": undefined,
}
}
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Button
</EuiButton>
@ -67,15 +64,12 @@ exports[`ElasticAgentCard props category 1`] = `
}
>
<EuiCard
betaBadgeProps={
Object {
"label": undefined,
}
}
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Add Elastic Agent
</EuiButton>
@ -121,15 +115,12 @@ exports[`ElasticAgentCard props href 1`] = `
}
>
<EuiCard
betaBadgeProps={
Object {
"label": undefined,
}
}
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Button
</EuiButton>
@ -183,7 +174,9 @@ exports[`ElasticAgentCard props recommended 1`] = `
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Add Elastic Agent
</EuiButton>
@ -229,15 +222,12 @@ exports[`ElasticAgentCard renders 1`] = `
}
>
<EuiCard
betaBadgeProps={
Object {
"label": undefined,
}
}
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<EuiButton
color="primary"
fill={true}
size="m"
>
Add Elastic Agent
</EuiButton>

80
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/no_data_card.test.tsx.snap generated
View file

@ -2,19 +2,23 @@
exports[`NoDataCard props button 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned emotion-euiPanel-grow-m-l-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-euiCard-center-vertical"
>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Card title
</span>
<span
class="emotion-euiCard__text-center"
>
Card title
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -23,17 +27,17 @@ exports[`NoDataCard props button 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Button
</span>
@ -45,26 +49,26 @@ exports[`NoDataCard props button 1`] = `
exports[`NoDataCard props href 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--isClickable emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-isClickable-euiCard-center-vertical"
>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
<a
aria-describedby="generated-idDescription"
class="euiCard__titleAnchor"
class="euiCard__titleAnchor emotion-euiCard__text-center-interactive"
href="#"
rel="noreferrer"
>
Card title
</a>
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -73,17 +77,17 @@ exports[`NoDataCard props href 1`] = `
</div>
</div>
<div
class="euiCard__footer"
class="emotion-euiCard__footer"
>
<button
class="euiButton euiButton--primary euiButton--fill"
class="euiButton emotion-euiButtonDisplay-m-m-fill-primary"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButton__text"
class="eui-textTruncate"
>
Button
</span>
@ -95,19 +99,23 @@ exports[`NoDataCard props href 1`] = `
exports[`NoDataCard props recommended 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned euiCard--hasBetaBadge emotion-euiPanel-grow-m-l-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-euiCard-center-vertical-hasBetaBadge"
>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Card title
</span>
<span
class="emotion-euiCard__text-center"
>
Card title
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>
@ -116,10 +124,10 @@ exports[`NoDataCard props recommended 1`] = `
</div>
</div>
<span
class="euiCard__betaBadgeWrapper"
class="emotion-euiCard__betaBadgeAnchor"
>
<span
class="euiBetaBadge euiBetaBadge--hollow euiCard__betaBadge"
class="euiBetaBadge euiBetaBadge--hollow emotion-euiCard__betaBadge"
id="generated-idBetaBadge"
title="Recommended"
>
@ -131,19 +139,23 @@ exports[`NoDataCard props recommended 1`] = `
exports[`NoDataCard renders 1`] = `
<div
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard euiCard--centerAligned emotion-euiPanel-grow-m-l-plain-hasShadow"
class="euiPanel euiPanel--plain euiPanel--paddingLarge euiCard emotion-euiPanel-grow-m-l-plain-hasShadow-euiCard-center-vertical"
>
<div
class="euiCard__content"
class="euiCard__content emotion-euiCard__content-vertical"
>
<span
<p
class="euiTitle euiCard__title emotion-euiTitle-s"
id="generated-idTitle"
>
Card title
</span>
<span
class="emotion-euiCard__text-center"
>
Card title
</span>
</p>
<div
class="euiText euiCard__description emotion-euiText-s"
class="euiText emotion-euiText-s-euiCard__description"
id="generated-idDescription"
>
<p>

2
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/elastic_agent_card.tsx
View file

@ -105,7 +105,7 @@ export const ElasticAgentCard: FunctionComponent<ElasticAgentCardProps> = ({
description={i18n.translate('kibana-react.noDataPage.elasticAgentCard.description', {
defaultMessage: `Use Elastic Agent for a simple, unified way to collect data from your machines.`,
})}
betaBadgeProps={{ label: recommended ? NO_DATA_RECOMMENDED : undefined }}
betaBadgeProps={recommended ? { label: NO_DATA_RECOMMENDED } : undefined}
footer={footer}
layout={layout as 'vertical' | undefined}
{...cardRest}

2
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx
View file

@ -33,7 +33,7 @@ export const NoDataCard: FunctionComponent<NoDataPageActions> = ({
description={i18n.translate('kibana-react.noDataPage.noDataCard.description', {
defaultMessage: `Proceed without collecting data`,
})}
betaBadgeProps={{ label: recommended ? NO_DATA_RECOMMENDED : undefined }}
betaBadgeProps={recommended ? { label: NO_DATA_RECOMMENDED } : undefined}
footer={footer}
layout={layout as 'vertical' | undefined}
{...cardRest}

17
src/plugins/kibana_react/public/toolbar_button/toolbar_button.scss
View file

@ -1,22 +1,17 @@
.kbnToolbarButton {
line-height: $euiButtonHeight; // Keeps alignment of text and chart icon
background-color: $euiColorEmptyShade;
// Override background color for non-disabled buttons
&:not(:disabled) {
background-color: $euiColorEmptyShade;
}
// todo: once issue https://github.com/elastic/eui/issues/4730 is merged, this code might be safe to remove
// Some toolbar buttons are just icons, but EuiButton comes with margin and min-width that need to be removed
min-width: 0;
border-width: $euiBorderWidthThin;
border-style: solid;
&[class*='--text'] {
// Lighten the border color for all states
border-color: $euiBorderColor !important; // sass-lint:disable-line no-important
}
&[class*='isDisabled'] {
// There is a popover `pointer-events: none` that messes with the not-allowed cursor
pointer-events: initial;
}
border-color: $euiBorderColor; // Lighten the border color for all states
.kbnToolbarButton__text > svg {
margin-top: -1px; // Just some weird alignment issue when icon is the child not the `iconType`

1
src/plugins/navigation/public/top_nav_menu/__snapshots__/top_nav_menu_item.test.tsx.snap generated
View file

@ -2,6 +2,7 @@
exports[`TopNavMenu Should render emphasized item which should be clickable 1`] = `
<EuiButton
color="primary"
fill={true}
iconSide="right"
iconType="beaker"

2
src/plugins/presentation_util/public/components/solution_toolbar/items/button.tsx
View file

@ -24,7 +24,7 @@ export const SolutionToolbarButton = ({ label, primary, className, ...rest }: Pr
{...rest}
size="m"
color={primary ? 'primary' : 'text'}
className={`solutionToolbarButton ${className}`}
className={`${primary ? '' : 'solutionToolbarButton'} ${className}`}
fill={primary}
>
{label}

3
src/plugins/presentation_util/public/components/solution_toolbar/items/popover.tsx
View file

@ -7,8 +7,7 @@
*/
import React, { useState } from 'react';
import { EuiPopover } from '@elastic/eui';
import { Props as EuiPopoverProps } from '@elastic/eui/src/components/popover/popover';
import { EuiPopover, EuiPopoverProps } from '@elastic/eui';
import { SolutionToolbarButton, Props as ButtonProps } from './button';

706
src/plugins/saved_objects/public/save_modal/__snapshots__/saved_object_save_modal.test.tsx.snap generated
View file

@ -6,94 +6,96 @@ exports[`SavedObjectSaveModal should render matching snapshot 1`] = `
data-test-subj="savedObjectSaveModal"
onClose={[Function]}
>
<form
className="euiModal__flex"
onSubmit={[Function]}
>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm
component="form"
id="generated-id_form"
onSubmit={[Function]}
>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
/>
</EuiButtonEmpty>
<EuiButton
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
isDisabled={false}
isLoading={false}
type="submit"
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
Save
</EuiButton>
</EuiModalFooter>
</form>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
<EuiButton
color="primary"
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
form="generated-id_form"
isDisabled={false}
isLoading={false}
size="m"
type="submit"
>
Save
</EuiButton>
</EuiModalFooter>
</EuiModal>
`;
@ -103,94 +105,96 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
data-test-subj="savedObjectSaveModal"
onClose={[Function]}
>
<form
className="euiModal__flex"
onSubmit={[Function]}
>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm
component="form"
id="generated-id_form"
onSubmit={[Function]}
>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
/>
</EuiButtonEmpty>
<EuiButton
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
isDisabled={true}
isLoading={false}
type="submit"
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
Save
</EuiButton>
</EuiModalFooter>
</form>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
<EuiButton
color="primary"
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
form="generated-id_form"
isDisabled={true}
isLoading={false}
size="m"
type="submit"
>
Save
</EuiButton>
</EuiModalFooter>
</EuiModal>
`;
@ -200,94 +204,96 @@ exports[`SavedObjectSaveModal should render matching snapshot when custom isVali
data-test-subj="savedObjectSaveModal"
onClose={[Function]}
>
<form
className="euiModal__flex"
onSubmit={[Function]}
>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm
component="form"
id="generated-id_form"
onSubmit={[Function]}
>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
/>
</EuiButtonEmpty>
<EuiButton
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
isDisabled={false}
isLoading={false}
type="submit"
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
Save
</EuiButton>
</EuiModalFooter>
</form>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
<EuiButton
color="primary"
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
form="generated-id_form"
isDisabled={false}
isLoading={false}
size="m"
type="submit"
>
Save
</EuiButton>
</EuiModalFooter>
</EuiModal>
`;
@ -297,107 +303,109 @@ exports[`SavedObjectSaveModal should render matching snapshot when given options
data-test-subj="savedObjectSaveModal"
onClose={[Function]}
>
<form
className="euiModal__flex"
onSubmit={[Function]}
>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
defaultMessage="Save {objectType}"
id="savedObjects.saveModal.saveTitle"
values={
Object {
"objectType": "visualization",
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm>
<EuiFlexGroup
gutterSize="m"
>
<EuiFlexItem>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
<div>
Hello! Main options
</div>
</EuiFlexItem>
<EuiFlexItem>
<div>
Hey there! Options on the right
</div>
</EuiFlexItem>
</EuiFlexGroup>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
<EuiForm
component="form"
id="generated-id_form"
onSubmit={[Function]}
>
<EuiFlexGroup
gutterSize="m"
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
<EuiButton
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
isDisabled={false}
isLoading={false}
type="submit"
>
Save
</EuiButton>
</EuiModalFooter>
</form>
<EuiFlexItem>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Title"
id="savedObjects.saveModal.titleLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiFieldText
autoFocus={true}
data-test-subj="savedObjectTitle"
fullWidth={true}
isInvalid={false}
onChange={[Function]}
value="Saved Object title"
/>
</EuiFormRow>
<EuiFormRow
describedByIds={Array []}
display="row"
fullWidth={true}
hasChildLabel={true}
hasEmptyLabelSpace={false}
label={
<FormattedMessage
defaultMessage="Description"
id="savedObjects.saveModal.descriptionLabel"
values={Object {}}
/>
}
labelType="label"
>
<EuiTextArea
data-test-subj="viewDescription"
onChange={[Function]}
value=""
/>
</EuiFormRow>
<div>
Hello! Main options
</div>
</EuiFlexItem>
<EuiFlexItem>
<div>
Hey there! Options on the right
</div>
</EuiFlexItem>
</EuiFlexGroup>
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty
data-test-subj="saveCancelButton"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Cancel"
id="savedObjects.saveModal.cancelButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
<EuiButton
color="primary"
data-test-subj="confirmSaveSavedObjectButton"
fill={true}
form="generated-id_form"
isDisabled={false}
isLoading={false}
size="m"
type="submit"
>
Save
</EuiButton>
</EuiModalFooter>
</EuiModal>
`;

65
src/plugins/saved_objects/public/save_modal/saved_object_save_modal.tsx
View file

@ -72,6 +72,8 @@ const generateId = htmlIdGenerator();
*/
export class SavedObjectSaveModal extends React.Component<Props, SaveModalState> {
private warning = React.createRef<HTMLDivElement>();
private formId = generateId('form');
public readonly state = {
title: this.props.title,
copyOnSave: Boolean(this.props.initialCopyOnSave),
@ -131,42 +133,40 @@ export class SavedObjectSaveModal extends React.Component<Props, SaveModalState>
className={`kbnSavedObjectSaveModal${hasColumns ? ' kbnSavedObjectsSaveModal--wide' : ''}`}
onClose={this.props.onClose}
>
<form onSubmit={this.onFormSubmit} className="euiModal__flex">
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
id="savedObjects.saveModal.saveTitle"
defaultMessage="Save {objectType}"
values={{ objectType: this.props.objectType }}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalHeader>
<EuiModalHeaderTitle>
<FormattedMessage
id="savedObjects.saveModal.saveTitle"
defaultMessage="Save {objectType}"
values={{ objectType: this.props.objectType }}
/>
</EuiModalHeaderTitle>
</EuiModalHeader>
<EuiModalBody>
{this.renderDuplicateTitleCallout(duplicateWarningId)}
<EuiModalBody>
{this.renderDuplicateTitleCallout(duplicateWarningId)}
<EuiForm>
{!this.props.showDescription && this.props.description && (
<EuiText size="s" color="subdued">
{this.props.description}
</EuiText>
)}
{formBody}
{this.renderCopyOnSave()}
</EuiForm>
</EuiModalBody>
<EuiForm component="form" onSubmit={this.onFormSubmit} id={this.formId}>
{!this.props.showDescription && this.props.description && (
<EuiText size="s" color="subdued">
{this.props.description}
</EuiText>
)}
{formBody}
{this.renderCopyOnSave()}
</EuiForm>
</EuiModalBody>
<EuiModalFooter>
<EuiButtonEmpty data-test-subj="saveCancelButton" onClick={this.props.onClose}>
<FormattedMessage
id="savedObjects.saveModal.cancelButtonLabel"
defaultMessage="Cancel"
/>
</EuiButtonEmpty>
<EuiModalFooter>
<EuiButtonEmpty data-test-subj="saveCancelButton" onClick={this.props.onClose}>
<FormattedMessage
id="savedObjects.saveModal.cancelButtonLabel"
defaultMessage="Cancel"
/>
</EuiButtonEmpty>
{this.renderConfirmButton()}
</EuiModalFooter>
</form>
{this.renderConfirmButton()}
</EuiModalFooter>
</EuiModal>
);
}
@ -278,6 +278,7 @@ export class SavedObjectSaveModal extends React.Component<Props, SaveModalState>
isLoading={isLoading}
isDisabled={title.length === 0 || !isValid}
type="submit"
form={this.formId}
>
{confirmLabel}
</EuiButton>

22
src/plugins/saved_objects_management/public/management_section/object_view/components/__snapshots__/header.test.tsx.snap generated
View file

@ -29,24 +29,19 @@ exports[`Intro component renders correctly 1`] = `
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<a
class="euiButton euiButton--primary euiButton--small"
class="euiButton emotion-euiButtonDisplay-s-s-base-primary"
data-test-subj="savedObjectEditViewInApp"
href="/some-url"
rel="noreferrer"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="eye"
/>
<span
class="euiButton__text"
>
View saved object
</span>
View saved object
</span>
</a>
</div>
@ -54,23 +49,18 @@ exports[`Intro component renders correctly 1`] = `
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<button
class="euiButton euiButton--danger euiButton--small"
class="euiButton emotion-euiButtonDisplay-s-s-base-danger"
data-test-subj="savedObjectEditDelete"
type="button"
>
<span
class="euiButtonContent euiButton__content"
class="emotion-euiButtonDisplayContent"
>
<span
class="euiButtonContent__icon"
color="inherit"
data-euiicon-type="trash"
/>
<span
class="euiButton__text"
>
Delete
</span>
Delete
</span>
</button>
</div>

2
src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap generated
View file

@ -142,6 +142,7 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="importSavedObjectsConfirmBtn"
fill={true}
isLoading={false}
@ -376,6 +377,7 @@ exports[`Flyout should render import step 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="importSavedObjectsImportBtn"
fill={true}
isDisabled={true}

10
src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap generated
View file

@ -32,6 +32,7 @@ exports[`Table prevents saved objects from being deleted 1`] = `
iconType="trash"
isDisabled={true}
onClick={[Function]}
size="m"
title="Unable to delete saved objects"
>
<FormattedMessage
@ -44,10 +45,12 @@ exports[`Table prevents saved objects from being deleted 1`] = `
anchorPosition="downCenter"
button={
<EuiButton
color="primary"
iconSide="right"
iconType="arrowDown"
isDisabled={false}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Export"
@ -100,9 +103,11 @@ exports[`Table prevents saved objects from being deleted 1`] = `
labelType="label"
>
<EuiButton
color="primary"
fill={true}
iconType="exportAction"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Export"
@ -268,6 +273,7 @@ exports[`Table should render normally 1`] = `
iconType="trash"
isDisabled={false}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Delete"
@ -279,10 +285,12 @@ exports[`Table should render normally 1`] = `
anchorPosition="downCenter"
button={
<EuiButton
color="primary"
iconSide="right"
iconType="arrowDown"
isDisabled={false}
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Export"
@ -335,9 +343,11 @@ exports[`Table should render normally 1`] = `
labelType="label"
>
<EuiButton
color="primary"
fill={true}
iconType="exportAction"
onClick={[Function]}
size="m"
>
<FormattedMessage
defaultMessage="Export"

6
src/plugins/saved_objects_management/public/management_section/objects_table/components/delete_confirm_modal.test.tsx
View file

@ -95,7 +95,7 @@ describe('DeleteConfirmModal', () => {
allowedTypes={allowedTypes}
/>
);
wrapper.find('EuiButton').simulate('click');
wrapper.find('button[data-test-subj="confirmModalConfirmButton"]').simulate('click');
expect(onConfirm).toHaveBeenCalledTimes(1);
expect(onCancel).not.toHaveBeenCalled();
@ -176,7 +176,9 @@ describe('DeleteConfirmModal', () => {
/>
);
expect(wrapper.find('EuiButton').getDOMNode()).toBeDisabled();
expect(
wrapper.find('button[data-test-subj="confirmModalConfirmButton"]').getDOMNode()
).toBeDisabled();
});
});

2
src/plugins/saved_objects_management/public/management_section/objects_table/components/export_modal.test.tsx
View file

@ -81,7 +81,7 @@ describe('ExportModal', () => {
onIncludeReferenceChange={onIncludeReferenceChange}
/>
);
wrapper.find('EuiButton').simulate('click');
wrapper.find('EuiButton button').simulate('click');
expect(onExport).toHaveBeenCalledTimes(1);
expect(onCancel).not.toHaveBeenCalled();

2
src/plugins/telemetry/public/components/__snapshots__/opt_in_banner.test.tsx.snap generated
View file

@ -29,6 +29,7 @@ exports[`OptInDetailsComponent renders as expected 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="enable"
onClick={[Function]}
size="s"
@ -44,6 +45,7 @@ exports[`OptInDetailsComponent renders as expected 1`] = `
grow={false}
>
<EuiButton
color="primary"
data-test-subj="disable"
onClick={[Function]}
size="s"

1
src/plugins/telemetry/public/components/__snapshots__/opted_in_notice_banner.test.tsx.snap generated
View file

@ -38,6 +38,7 @@ exports[`OptInDetailsComponent renders as expected 1`] = `
size="s"
/>
<EuiButton
color="primary"
onClick={[Function]}
size="s"
>

4
src/plugins/unified_field_list/public/components/field_visualize_button/field_visualize_button.test.tsx
View file

@ -77,7 +77,7 @@ describe('UnifiedFieldList <FieldVisualizeButton />', () => {
});
expect(wrapper!.text()).toBe('Visualize');
wrapper!.find(EuiButton).simulate('click');
wrapper!.find('a[data-test-subj="fieldVisualize-extension"]').simulate('click');
expect(mockExecuteAction).toHaveBeenCalledWith({
contextualFields,
@ -119,7 +119,7 @@ describe('UnifiedFieldList <FieldVisualizeButton />', () => {
);
expect(wrapper!.text()).toBe('Visualize');
wrapper!.find(EuiButton).simulate('click');
wrapper!.find('a[data-test-subj="fieldVisualize-geo.coordinates"]').simulate('click');
expect(mockExecuteAction).toHaveBeenCalledWith({
contextualFields: [],

1
src/plugins/unified_search/public/dataview_picker/change_dataview.tsx
View file

@ -171,6 +171,7 @@ export function ChangeDataView({
title={triggerLabel}
fullWidth={fullWidth}
disabled={isDisabled}
textProps={{ className: 'eui-textTruncate' }}
{...rest}
>
<>

2
src/plugins/unified_search/public/saved_query_management/saved_query_management_list.test.tsx
View file

@ -126,7 +126,7 @@ describe('Saved query management list component', () => {
component.find('[data-test-subj="saved-query-management-apply-changes-button"]').length
).toBeTruthy();
component
.find('[data-test-subj="saved-query-management-apply-changes-button"]')
.find('button[data-test-subj="saved-query-management-apply-changes-button"]')
.first()
.simulate('click');
expect(onLoadSpy).toBeCalled();

6
src/plugins/unified_search/public/search_bar/search_bar.test.tsx
View file

@ -292,8 +292,10 @@ describe('SearchBar', () => {
expect(component.find(EuiSuperUpdateButton).prop('isDisabled')).toBe(true);
expect(component.find(FilterItems).prop('readOnly')).toBe(true);
expect(component.find('[data-test-subj="showQueryBarMenu"]').at(0).getDOMNode()).toBeDisabled();
expect(component.find('[data-test-subj="addFilter"]').at(0).getDOMNode()).toBeDisabled();
expect(
component.find('button[data-test-subj="showQueryBarMenu"]').at(0).getDOMNode()
).toBeDisabled();
expect(component.find('button[data-test-subj="addFilter"]').at(0).getDOMNode()).toBeDisabled();
expect(component.find(DataViewPicker).prop('isDisabled')).toBe(true);

31
src/plugins/vis_types/vega/public/components/vega_vis.styles.tsx Normal file
View file

@ -0,0 +1,31 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import React from 'react';
import { css, Global } from '@emotion/react';
import { useEuiTheme, UseEuiTheme, euiScrollBarStyles } from '@elastic/eui';
import { vegaBaseViewStyles } from '../vega_view/vega_base_view.styles';
import { vegaVisTooltipStyles } from '../vega_view/vega_tooltip.styles';
// Styles for non-React DOM nodes that's easier to set at the Global level
export const GlobalVegaVisStyles = () => {
const euiTheme = useEuiTheme();
const baseViewStyles = vegaBaseViewStyles(euiTheme);
const tooltipStyles = vegaVisTooltipStyles(euiTheme);
return <Global styles={[tooltipStyles, baseViewStyles]} />;
};
export const wrapperStyles = (euiTheme: UseEuiTheme) => css`
${euiScrollBarStyles(euiTheme)}
display: flex;
flex: 1 1 0;
overflow: auto;
`;

23
src/plugins/vis_types/vega/public/components/vega_vis_component.tsx
View file

@ -7,7 +7,7 @@
*/
import React, { useEffect, useRef, useMemo, useCallback } from 'react';
import { EuiResizeObserver, EuiResizeObserverProps } from '@elastic/eui';
import { EuiResizeObserver, EuiResizeObserverProps, useEuiTheme } from '@elastic/eui';
import { throttle } from 'lodash';
import type { IInterpreterRenderHandlers, RenderMode } from '@kbn/expressions-plugin/common';
@ -15,7 +15,7 @@ import { createVegaVisualization } from '../vega_visualization';
import { VegaVisualizationDependencies } from '../plugin';
import { VegaParser } from '../data_model/vega_parser';
import './vega_vis.scss';
import { GlobalVegaVisStyles, wrapperStyles } from './vega_vis.styles';
interface VegaVisComponentProps {
deps: VegaVisualizationDependencies;
@ -84,13 +84,18 @@ export const VegaVisComponent = ({
[resizeChart]
);
const euiTheme = useEuiTheme();
return (
<EuiResizeObserver onResize={onContainerResize}>
{(resizeRef) => (
<div className="vgaVis__wrapper" ref={resizeRef}>
<div ref={chartDiv} />
</div>
)}
</EuiResizeObserver>
<>
<GlobalVegaVisStyles />
<EuiResizeObserver onResize={onContainerResize}>
{(resizeRef) => (
<div className="vgaVis__wrapper" css={wrapperStyles(euiTheme)} ref={resizeRef}>
<div ref={chartDiv} />
</div>
)}
</EuiResizeObserver>
</>
);
};

144
src/plugins/vis_types/vega/public/vega_view/vega_base_view.styles.ts Normal file
View file

@ -0,0 +1,144 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import { css } from '@emotion/react';
import {
UseEuiTheme,
logicalCSS,
mathWithUnits,
euiScrollBarStyles,
euiFontSize,
euiBackgroundColor,
} from '@elastic/eui';
// Note that these are globally-set styles, due to vega_base_view being vanilla JS/non-React
export const vegaBaseViewStyles = (euiThemeContext: UseEuiTheme) => {
const { euiTheme } = euiThemeContext;
return css`
.vgaVis {
display: flex;
flex: 1 1 100%;
position: relative;
// flex-direction determined by js
}
.vgaVis--autoresize {
${euiScrollBarStyles(euiThemeContext)};
${logicalCSS('max-width', '100%')}
${logicalCSS('max-height', '100%')}
overflow: auto;
}
.vgaVis__view {
z-index: 0;
flex: 1 1 100%;
display: block;
canvas {
display: block;
}
// BUG #23514: Make sure Vega doesn't display the controls in two places
.vega-bindings {
display: none !important;
}
}
.vgaVis__controls {
${euiFontSize(euiThemeContext, 's')}
display: flex;
&:not(:empty) {
// Adding a little bit of padding helps with the unnecessary scrollbars
${logicalCSS('padding-vertical', euiTheme.size.s)}
${logicalCSS('padding-horizontal', 0)}
}
&.vgaVis__controls--column {
flex-direction: column;
}
&.vgaVis__controls--row {
flex-direction: row;
> .vega-bind {
flex-grow: 1;
}
}
> .vega-bind {
.vega-bind-name {
display: inline-block;
${logicalCSS(
'width',
mathWithUnits(euiTheme.size.m, (x) => x * 10 - euiTheme.base)
)}
}
input[type='range'] {
${logicalCSS(
'width',
mathWithUnits(euiTheme.size.m, (x) => x * 10)
)}
display: inline-block;
vertical-align: middle;
}
label {
margin: 0;
${logicalCSS('margin-left', euiTheme.size.s)}
}
select {
${logicalCSS(
'max-width',
mathWithUnits(euiTheme.size.base, (x) => x * 10)
)}
}
.vega-bind-radio label {
${logicalCSS('margin-vertical', 0)}
${logicalCSS('margin-right', euiTheme.size.s)}
${logicalCSS('margin-left', euiTheme.size.xs)}
}
}
}
// Messages
.vgaVis__messages {
position: absolute;
${logicalCSS('top', 0)}
${logicalCSS('width', '100%')}
margin: auto;
opacity: 0.8;
z-index: 1;
list-style: none;
}
.vgaVis__message {
margin: ${euiTheme.size.s};
.vgaVis__messageCode {
white-space: pre-wrap;
padding: ${euiTheme.size.s};
}
}
.vgaVis__message--warn .vgaVis__messageCode {
background-color: ${euiBackgroundColor(euiThemeContext, 'warning')};
color: ${euiTheme.colors.warningText};
}
.vgaVis__message--err .vgaVis__messageCode {
background-color: ${euiBackgroundColor(euiThemeContext, 'danger')};
color: ${euiTheme.colors.dangerText};
}
`;
};

6
src/plugins/vis_types/vega/public/vega_view/vega_tooltip.js
View file

@ -57,11 +57,7 @@ export class TooltipHandler {
const el = document.createElement('div');
el.setAttribute('id', tooltipId);
['vgaVis__tooltip', 'euiToolTipPopover', 'euiToolTip', `euiToolTip--${this.position}`].forEach(
(className) => {
el.classList.add(className);
}
);
el.classList.add('vgaVis__tooltip', `vgaVis__tooltip--${this.position}`);
if (this.textTruncate) {
el.classList.add('vgaVis__tooltip--textTruncate');

102
src/plugins/vis_types/vega/public/vega_view/vega_tooltip.styles.ts Normal file
View file

@ -0,0 +1,102 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import { css } from '@emotion/react';
import {
UseEuiTheme,
logicalCSS,
logicalTextAlignCSS,
mathWithUnits,
euiTextTruncate,
euiBreakpoint,
} from '@elastic/eui';
// @ts-expect-error style types not defined
import { euiToolTipStyles } from '@elastic/eui/lib/components/tool_tip/tool_tip.styles';
// Style tooltip popup (gets created dynamically at the top level if dashboard has a Vega vis)
// Adapted from https://github.com/vega/vega-tooltip
export const vegaVisTooltipStyles = (euiThemeContext: UseEuiTheme) => {
const { euiTheme } = euiThemeContext;
// Merge EUI tooltip styles into ours
const euiStyles = euiToolTipStyles(euiThemeContext);
// Note that these are globally-set styles, due to vega_tooltip being vanilla JS/non-React
return css`
.vgaVis__tooltip {
${euiStyles.euiToolTip}
${logicalCSS('max-width', '100%')}
position: fixed;
h2 {
${logicalCSS('margin-bottom', euiTheme.size.s)}
}
&--textTruncate {
td {
${euiTextTruncate()}
}
}
td {
${logicalCSS('padding-vertical', euiTheme.size.xs)}
&.key {
${logicalCSS(
'max-width',
mathWithUnits(euiTheme.size.base, (x) => x * 10)
)}
color: ${euiTheme.colors.mediumShade};
${logicalTextAlignCSS('right')}
${logicalCSS('padding-right', euiTheme.size.xs)}
}
&.value {
${logicalCSS(
'max-width',
mathWithUnits(euiTheme.size.l, (x) => x * 10)
)}
${logicalTextAlignCSS('left')}
}
}
${euiBreakpoint(euiThemeContext, ['xs', 'm'])} {
td {
&.key {
${logicalCSS(
'max-width',
mathWithUnits(euiTheme.size.base, (x) => x * 6)
)}
}
&.value {
${logicalCSS(
'max-width',
mathWithUnits(euiTheme.size.base, (x) => x * 10)
)}
}
}
}
}
// Positions
.vgaVis__tooltip--left {
${euiStyles.left}
}
.vgaVis__tooltip--right {
${euiStyles.right}
}
.vgaVis__tooltip--top {
${euiStyles.top}
}
.vgaVis__tooltip--bottom {
${euiStyles.bottom}
}
`;
};

2
src/plugins/vis_types/vislib/public/vislib/components/legend/__snapshots__/legend.test.tsx.snap generated
View file

@ -2,4 +2,4 @@
exports[`VisLegend Component Legend closed should match the snapshot 1`] = `"<div class=\\"visLegend\\"><button type=\\"button\\" class=\\"visLegend__toggle kbn-resetFocusState\\" aria-label=\\"Toggle legend\\" aria-expanded=\\"false\\" aria-controls=\\"legendId\\" data-test-subj=\\"vislibToggleLegend\\" title=\\"Toggle legend\\"><span data-euiicon-type=\\"list\\" color=\\"text\\"></span></button></div>"`;
exports[`VisLegend Component Legend open should match the snapshot 1`] = `"<div class=\\"visLegend\\"><button type=\\"button\\" class=\\"visLegend__toggle kbn-resetFocusState visLegend__toggle--isOpen\\" aria-label=\\"Toggle legend\\" aria-expanded=\\"true\\" aria-controls=\\"legendId\\" data-test-subj=\\"vislibToggleLegend\\" title=\\"Toggle legend\\"><span data-euiicon-type=\\"list\\" color=\\"text\\"></span></button><ul class=\\"visLegend__list\\" id=\\"legendId\\"><li class=\\"visLegend__value\\"><div class=\\"euiPopover css-6tb1tw-euiPopover\\"><div class=\\"euiPopover__anchor css-zih94u-render\\"><button class=\\"euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall euiButtonEmpty--flushLeft visLegend__button\\" type=\\"button\\" data-label=\\"A\\" title=\\"A\\" aria-label=\\"A, toggle options\\" data-test-subj=\\"legend-A\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><span data-euiicon-type=\\"dot\\" color=\\"red\\" data-test-subj=\\"legendSelectedColor-red\\"></span><span class=\\"visLegend__valueTitle\\">A</span></span></span></button></div></div></li><li class=\\"visLegend__value\\"><div class=\\"euiPopover css-6tb1tw-euiPopover\\"><div class=\\"euiPopover__anchor css-zih94u-render\\"><button class=\\"euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall euiButtonEmpty--flushLeft visLegend__button\\" type=\\"button\\" data-label=\\"B\\" title=\\"B\\" aria-label=\\"B, toggle options\\" data-test-subj=\\"legend-B\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><span data-euiicon-type=\\"dot\\" color=\\"red\\" data-test-subj=\\"legendSelectedColor-red\\"></span><span class=\\"visLegend__valueTitle\\">B</span></span></span></button></div></div></li></ul></div>"`;
exports[`VisLegend Component Legend open should match the snapshot 1`] = `"<div class=\\"visLegend\\"><button type=\\"button\\" class=\\"visLegend__toggle kbn-resetFocusState visLegend__toggle--isOpen\\" aria-label=\\"Toggle legend\\" aria-expanded=\\"true\\" aria-controls=\\"legendId\\" data-test-subj=\\"vislibToggleLegend\\" title=\\"Toggle legend\\"><span data-euiicon-type=\\"list\\" color=\\"text\\"></span></button><ul class=\\"visLegend__list\\" id=\\"legendId\\"><li class=\\"visLegend__value\\"><div class=\\"euiPopover css-6tb1tw-euiPopover\\"><div class=\\"euiPopover__anchor css-zih94u-render\\"><button class=\\"euiButtonEmpty euiButtonEmpty--xSmall euiButtonEmpty--flushLeft visLegend__button css-wvaqcf-empty-text\\" type=\\"button\\" data-label=\\"A\\" title=\\"A\\" aria-label=\\"A, toggle options\\" data-test-subj=\\"legend-A\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><span data-euiicon-type=\\"dot\\" color=\\"red\\" data-test-subj=\\"legendSelectedColor-red\\"></span><span class=\\"visLegend__valueTitle\\">A</span></span></span></button></div></div></li><li class=\\"visLegend__value\\"><div class=\\"euiPopover css-6tb1tw-euiPopover\\"><div class=\\"euiPopover__anchor css-zih94u-render\\"><button class=\\"euiButtonEmpty euiButtonEmpty--xSmall euiButtonEmpty--flushLeft visLegend__button css-wvaqcf-empty-text\\" type=\\"button\\" data-label=\\"B\\" title=\\"B\\" aria-label=\\"B, toggle options\\" data-test-subj=\\"legend-B\\"><span class=\\"euiButtonContent euiButtonEmpty__content\\"><span class=\\"euiButtonEmpty__text\\"><span data-euiicon-type=\\"dot\\" color=\\"red\\" data-test-subj=\\"legendSelectedColor-red\\"></span><span class=\\"visLegend__valueTitle\\">B</span></span></span></button></div></div></li></ul></div>"`;

2
test/functional/apps/management/_runtime_fields.ts
View file

@ -62,7 +62,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.settings.filterField(fieldName);
await testSubjects.click('editFieldFormat');
await PageObjects.settings.setFieldType('Long');
await PageObjects.settings.setFieldScript('emit(6);');
await PageObjects.settings.setFieldScriptWithoutToggle('emit(6);');
await testSubjects.find('changeWarning');
await PageObjects.settings.clickSaveField();
await PageObjects.settings.confirmSave();

7
test/functional/page_objects/settings_page.ts
View file

@ -788,6 +788,7 @@ export class SettingsPageObject extends FtrService {
async setFieldType(type: string) {
this.log.debug('set type = ' + type);
await this.testSubjects.setValue('typeField', type);
await this.browser.pressKeys(this.browser.keys.ENTER);
}
async setFieldTypeComposite() {
@ -803,6 +804,12 @@ export class SettingsPageObject extends FtrService {
await this.monacoEditor.setCodeEditorValue(script);
}
async setFieldScriptWithoutToggle(script: string) {
this.log.debug('set script without toggle = ' + script);
await this.monacoEditor.waitCodeEditorReady('valueRow');
await this.monacoEditor.setCodeEditorValue(script);
}
async setCompositeScript(script: string) {
this.log.debug('set composite script = ' + script);
await this.monacoEditor.waitCodeEditorReady('scriptFieldRow');

Some files were not shown because too many files have changed in this diff Show more