From 6d6a967d497b88b1516bfe7fa3ca9866c3bbe2a5 Mon Sep 17 00:00:00 2001 From: CJ Cenizal Date: Thu, 22 Mar 2018 10:46:39 -0700 Subject: [PATCH] Revert inline prop. --- CHANGELOG.md | 5 ----- .../views/filter_group/filter_group_example.js | 6 +++--- src-docs/src/views/flex/flex_example.js | 6 +++--- src-docs/src/views/spacer/spacer_example.js | 6 +++--- src-docs/src/views/tool_tip/tool_tip.js | 4 ---- src-docs/src/views/tool_tip/tool_tip_example.js | 16 ++++++++++++++++ .../tool_tip/__snapshots__/icon_tip.test.js.snap | 8 ++++---- .../tool_tip/__snapshots__/tool_tip.test.js.snap | 4 ++-- src/components/tool_tip/tool_tip.js | 12 ++---------- 9 files changed, 33 insertions(+), 34 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index df23b9e196ac..991149b980db 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,11 +6,6 @@ - Added a `buttonColor` prop to `EuiConfirmModal` ([#546](https://github.com/elastic/eui/pull/546)) - Added 'baseline' as option to `EuiFlexGroup`'s `alignItems` prop ([#546](https://github.com/elastic/eui/pull/546)) -**Breaking changes** - -- `EuiToolTip` now defaults to using a `div` instead of a `span` to wrap the anchor. Specify -`inline={true}` to use a `span`. ([#564](https://github.com/elastic/eui/pull/564)) - # [`0.0.33`](https://github.com/elastic/eui/tree/v0.0.33) - Added initial sorting option to `EuiInMemoryTable` ([#547](https://github.com/elastic/eui/pull/547)) diff --git a/src-docs/src/views/filter_group/filter_group_example.js b/src-docs/src/views/filter_group/filter_group_example.js index 0ed02c74fc9a..c9593f0d2343 100644 --- a/src-docs/src/views/filter_group/filter_group_example.js +++ b/src-docs/src/views/filter_group/filter_group_example.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import { renderToHtml } from '../../services'; @@ -22,7 +22,7 @@ const filterGroupHtml = renderToHtml(FilterGroup); export const FilterGroupExample = { title: 'Filter Group', intro: ( -
+ -
+ ), sections: [{ source: [{ diff --git a/src-docs/src/views/flex/flex_example.js b/src-docs/src/views/flex/flex_example.js index 55fb0f587d72..4ef788352ffe 100644 --- a/src-docs/src/views/flex/flex_example.js +++ b/src-docs/src/views/flex/flex_example.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import { renderToHtml } from '../../services'; @@ -72,7 +72,7 @@ const flexGroupResonsiveHtml = renderToHtml(FlexGroupResponsive); export const FlexExample = { title: 'Flex', intro: ( -
+ -
+ ), sections: [{ title: 'FlexGroup is for a single row layout', diff --git a/src-docs/src/views/spacer/spacer_example.js b/src-docs/src/views/spacer/spacer_example.js index 5ea4a6fb689f..7793716d2429 100644 --- a/src-docs/src/views/spacer/spacer_example.js +++ b/src-docs/src/views/spacer/spacer_example.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import { renderToHtml } from '../../services'; @@ -20,7 +20,7 @@ const spacerHtml = renderToHtml(Spacer); export const SpacerExample = { title: 'Spacer', intro: ( -
+ -
+ ), sections: [{ source: [{ diff --git a/src-docs/src/views/tool_tip/tool_tip.js b/src-docs/src/views/tool_tip/tool_tip.js index 0be8243d6c09..58f4fbff5041 100644 --- a/src-docs/src/views/tool_tip/tool_tip.js +++ b/src-docs/src/views/tool_tip/tool_tip.js @@ -16,7 +16,6 @@ export default () => (

This tooltip appears on the{' '} @@ -27,7 +26,6 @@ export default () => (

This tooltip appears on the{' '} (

This tooltip appears on the{' '} @@ -51,7 +48,6 @@ export default () => (

This tooltip appears on the bottom of this icon:{' '} diff --git a/src-docs/src/views/tool_tip/tool_tip_example.js b/src-docs/src/views/tool_tip/tool_tip_example.js index 82db91b9dcd8..e804f803ddb6 100644 --- a/src-docs/src/views/tool_tip/tool_tip_example.js +++ b/src-docs/src/views/tool_tip/tool_tip_example.js @@ -7,9 +7,11 @@ import { } from '../../components'; import { + EuiCallOut, EuiCode, EuiToolTip, EuiIconTip, + EuiSpacer, } from '../../../../src/components'; import ToolTip from './tool_tip'; @@ -22,6 +24,20 @@ const infoTipHtml = renderToHtml(IconTip); export const ToolTipExample = { title: 'ToolTip', + intro: ( + + +

+ EuiToolTip wraps its children in a span element, so if you pass in a block-level child + (e.g. a div) the resulting DOM will be in violation of the HTML5 spec. +

+ + + + + ), sections: [{ source: [{ type: GuideSectionTypes.JS, diff --git a/src/components/tool_tip/__snapshots__/icon_tip.test.js.snap b/src/components/tool_tip/__snapshots__/icon_tip.test.js.snap index e4740c9b9e99..4567c32c117e 100644 --- a/src/components/tool_tip/__snapshots__/icon_tip.test.js.snap +++ b/src/components/tool_tip/__snapshots__/icon_tip.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`EuiIconTip is rendered 1`] = ` -
-
+ `; exports[`EuiIconTip props type is rendered as the icon 1`] = ` -
-
+ `; diff --git a/src/components/tool_tip/__snapshots__/tool_tip.test.js.snap b/src/components/tool_tip/__snapshots__/tool_tip.test.js.snap index ed0eba056922..c6a5cdf0d993 100644 --- a/src/components/tool_tip/__snapshots__/tool_tip.test.js.snap +++ b/src/components/tool_tip/__snapshots__/tool_tip.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`EuiToolTip is rendered 1`] = ` -
-
+ `; diff --git a/src/components/tool_tip/tool_tip.js b/src/components/tool_tip/tool_tip.js index 364b31fd3717..6b5e7a9dd44b 100644 --- a/src/components/tool_tip/tool_tip.js +++ b/src/components/tool_tip/tool_tip.js @@ -90,7 +90,6 @@ export class EuiToolTip extends Component { className, content, title, - inline, ...rest } = this.props; @@ -119,10 +118,8 @@ export class EuiToolTip extends Component { ); } - const AnchorElement = inline ? 'span' : 'div'; - const anchor = ( - this.anchor = anchor} className="euiToolTipAnchor" > @@ -133,7 +130,7 @@ export class EuiToolTip extends Component { onMouseOver: this.showToolTip, onMouseOut: this.onMouseOut })} - + ); return ( @@ -174,11 +171,6 @@ EuiToolTip.propTypes = { * Unless you provide one, this will be randomly generated. */ id: PropTypes.string, - - /** - * Use span instead of div. - */ - inline: PropTypes.bool, }; EuiToolTip.defaultProps = {