diff --git a/src/components/StackGrid.js b/src/components/StackGrid.js index 1a4f469..6144c58 100644 --- a/src/components/StackGrid.js +++ b/src/components/StackGrid.js @@ -61,6 +61,7 @@ type Props = { children: React$Element; className?: string; style: Object; + gridRef?: Function; component: string; columnWidth: number | string; gutterWidth: number; @@ -92,18 +93,20 @@ type InlineState = { columnWidth: number; }; -type InlineProps = $All; +}; /* eslint-disable react/no-unused-prop-types */ const propTypes = { children: PropTypes.node, className: PropTypes.string, style: PropTypes.object, + gridRef: PropTypes.func, component: PropTypes.string, columnWidth: PropTypes.oneOfType([ PropTypes.number, @@ -250,8 +253,12 @@ export class GridInline extends Component { }; } - updateLayout(props: InlineProps): void { - this.setStateIfNeeded(this.doLayout(props)); + updateLayout(props: ?InlineProps): void { + if (!props) { + this.setStateIfNeeded(this.doLayout(this.props)); + } else { + this.setStateIfNeeded(this.doLayout(props)); + } } handleItemMounted = (item: GridItem) => { @@ -285,6 +292,10 @@ export class GridInline extends Component { } } + handleRef = () => { + this.props.refCallback(this); + }; + render() { const { /* eslint-disable no-unused-vars */ @@ -293,6 +304,7 @@ export class GridInline extends Component { columnWidth: rawColumnWidth, monitorImagesLoaded, enableSSR, + refCallback, /* eslint-enable no-unused-vars */ className, style, @@ -324,6 +336,7 @@ export class GridInline extends Component { transition: transition(['height'], rest.duration, easings.easeOut), height, }} + ref={this.handleRef} > {validChildren.map((child, i) => ( { + this.grid = grid; + + if (typeof this.props.gridRef === 'function') { + this.props.gridRef(this); + } + }; + render() { - sizeMe.enableSSRBehaviour = this.props.enableSSR; - return ; + const { + enableSSR, + gridRef, + ...rest + } = this.props; + + sizeMe.enableSSRBehaviour = enableSSR; + + return ( + + ); } } diff --git a/src/components/__tests__/StackGrid.spec.js b/src/components/__tests__/StackGrid.spec.js index 6d62fdd..aef3327 100644 --- a/src/components/__tests__/StackGrid.spec.js +++ b/src/components/__tests__/StackGrid.spec.js @@ -10,6 +10,7 @@ const mockProps = { height: 0, }, style: {}, + refCallback: () => {}, component: 'div', columnWidth: 150, gutterWidth: 5, @@ -30,7 +31,7 @@ const mockProps = { describe(' (GridInline)', () => { - it('Should not be render children', () => { + test('Should not be render children', () => { const wrapper = mount( ); @@ -39,7 +40,7 @@ describe(' (GridInline)', () => { }); - it('Should be pass the base props', () => { + test('Should be pass the base props', () => { const wrapper = mount( (GridInline)', () => { }); - it('Should be render with specify component', () => { + test('Should be render with specify component', () => { const wrapper = mount( (GridInline)', () => { }); - it('Should be render children', () => { + test('Should be render children', () => { const wrapper = mount(
ITEM 1
@@ -86,4 +87,22 @@ describe(' (GridInline)', () => { expect(wrapper.find('div.item').length).toBe(3); }); + + + test('Should be get grid ref', () => { + const callback = jest.fn(); + const wrapper = mount( + +
Foo
+
+ ); + + expect(callback.mock.calls.length).toBe(1); + expect(callback.mock.calls[0]).toEqual([ + wrapper.instance(), + ]); + }); });