diff --git a/common/changes/office-ui-fabric-react/fix-focuszone-props_2018-03-21-22-25.json b/common/changes/office-ui-fabric-react/fix-focuszone-props_2018-03-21-22-25.json new file mode 100644 index 0000000000000..8f978b2f51c84 --- /dev/null +++ b/common/changes/office-ui-fabric-react/fix-focuszone-props_2018-03-21-22-25.json @@ -0,0 +1,11 @@ +{ + "changes": [ + { + "packageName": "office-ui-fabric-react", + "comment": "FocusZone: Align props to HTMLElement to be consistent", + "type": "patch" + } + ], + "packageName": "office-ui-fabric-react", + "email": "joschect@microsoft.com" +} \ No newline at end of file diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx index 87258f4196e0d..6823e02c0e7b1 100644 --- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx +++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx @@ -10,7 +10,7 @@ import { EventGroup, KeyCodes, css, - divProperties, + htmlElementProperties, elementContains, getDocument, getId, @@ -123,7 +123,7 @@ export class FocusZone extends BaseComponent implements IFo public render() { const { rootProps, ariaDescribedBy, ariaLabelledBy, className } = this.props; - const divProps = getNativeProps(this.props, divProperties); + const divProps = getNativeProps(this.props, htmlElementProperties); const Tag = this.props.elementType || 'div'; @@ -134,7 +134,10 @@ export class FocusZone extends BaseComponent implements IFo ...divProps } { - ...rootProps + // root props has been deprecated and should get removed. + // it needs to be marked as "any" since root props expects a div element, but really Tag can + // be any native element so typescript rightly flags this as a problem. + ...rootProps as any } className={ css('ms-FocusZone', className) } ref={ this._root }