diff --git a/src/elements/Container/Container.js b/src/elements/Container/Container.js index 29cc74c778..ea9cafe64d 100644 --- a/src/elements/Container/Container.js +++ b/src/elements/Container/Container.js @@ -15,7 +15,7 @@ import { /** * A container limits content to a maximum width. */ -function Container(props) { +const Container = React.forwardRef(function (props, ref) { const { children, className, content, fluid, text, textAlign } = props const classes = cx( 'ui', @@ -29,12 +29,13 @@ function Container(props) { const ElementType = getElementType(Container, props) return ( - + {childrenUtils.isNil(children) ? content : children} ) -} +}) +Container.displayName = 'Container' Container.propTypes = { /** An element type to render as (string or function). */ as: PropTypes.elementType, diff --git a/src/elements/Divider/Divider.js b/src/elements/Divider/Divider.js index b36c5325fc..2f2147c188 100644 --- a/src/elements/Divider/Divider.js +++ b/src/elements/Divider/Divider.js @@ -13,7 +13,7 @@ import { /** * A divider visually segments content into groups. */ -function Divider(props) { +const Divider = React.forwardRef(function (props, ref) { const { children, className, @@ -43,12 +43,13 @@ function Divider(props) { const ElementType = getElementType(Divider, props) return ( - + {childrenUtils.isNil(children) ? content : children} ) -} +}) +Divider.displayName = 'Divider' Divider.propTypes = { /** An element type to render as (string or function). */ as: PropTypes.elementType, diff --git a/src/elements/Loader/Loader.js b/src/elements/Loader/Loader.js index 1f1d5dd5cb..ed270fa6cd 100644 --- a/src/elements/Loader/Loader.js +++ b/src/elements/Loader/Loader.js @@ -16,7 +16,7 @@ import { * A loader alerts a user to wait for an activity to complete. * @see Dimmer */ -function Loader(props) { +const Loader = React.forwardRef(function (props, ref) { const { active, children, @@ -45,12 +45,13 @@ function Loader(props) { const ElementType = getElementType(Loader, props) return ( - + {childrenUtils.isNil(children) ? content : children} ) -} +}) +Loader.displayName = 'Loader' Loader.propTypes = { /** An element type to render as (string or function). */ as: PropTypes.elementType, diff --git a/src/elements/Rail/Rail.js b/src/elements/Rail/Rail.js index 90a69445fc..74ffc79607 100644 --- a/src/elements/Rail/Rail.js +++ b/src/elements/Rail/Rail.js @@ -16,7 +16,7 @@ import { /** * A rail is used to show accompanying content outside the boundaries of the main view of a site. */ -function Rail(props) { +const Rail = React.forwardRef(function (props, ref) { const { attached, children, @@ -44,12 +44,13 @@ function Rail(props) { const ElementType = getElementType(Rail, props) return ( - + {childrenUtils.isNil(children) ? content : children} ) -} +}) +Rail.displayName = 'Rail' Rail.propTypes = { /** An element type to render as (string or function). */ as: PropTypes.elementType, diff --git a/test/specs/elements/Container/Container-test.js b/test/specs/elements/Container/Container-test.js index a104b8ab3b..e205003588 100644 --- a/test/specs/elements/Container/Container-test.js +++ b/test/specs/elements/Container/Container-test.js @@ -5,6 +5,7 @@ import * as common from 'test/specs/commonTests' describe('Container', () => { common.isConformant(Container) + common.forwardsRef(Container) common.rendersChildren(Container) common.hasUIClassName(Container) diff --git a/test/specs/elements/Divider/Divider-test.js b/test/specs/elements/Divider/Divider-test.js index d76743e8e2..da288885f2 100644 --- a/test/specs/elements/Divider/Divider-test.js +++ b/test/specs/elements/Divider/Divider-test.js @@ -5,6 +5,7 @@ import * as common from 'test/specs/commonTests' describe('Divider', () => { common.isConformant(Divider) + common.forwardsRef(Divider) common.rendersChildren(Divider) common.hasUIClassName(Divider) diff --git a/test/specs/elements/Loader/Loader-test.js b/test/specs/elements/Loader/Loader-test.js index b13e0e7f4b..d8a53df34d 100644 --- a/test/specs/elements/Loader/Loader-test.js +++ b/test/specs/elements/Loader/Loader-test.js @@ -7,6 +7,7 @@ import * as common from 'test/specs/commonTests' describe('Loader', () => { common.isConformant(Loader) + common.forwardsRef(Loader) common.hasUIClassName(Loader) common.rendersChildren(Loader) diff --git a/test/specs/elements/Rail/Rail-test.js b/test/specs/elements/Rail/Rail-test.js index 56a1b9ac05..bff68d7ccf 100644 --- a/test/specs/elements/Rail/Rail-test.js +++ b/test/specs/elements/Rail/Rail-test.js @@ -9,6 +9,7 @@ const requiredProps = { position: 'left' } describe('Rail', () => { common.isConformant(Rail, { requiredProps }) + common.forwardsRef(Rail, { requiredProps }) common.hasUIClassName(Rail, { requiredProps }) common.rendersChildren(Rail, { requiredProps })