From ff39bb495a1ac91830639bbaca7fbcfeb9cc3f24 Mon Sep 17 00:00:00 2001 From: boygirl Date: Tue, 9 May 2017 18:56:22 -0700 Subject: [PATCH 1/4] improve container --- src/victory-container/victory-container.js | 25 ++++++++----------- src/victory-portal/portal.js | 24 ++++++++++++------ src/victory-util/helpers.js | 6 +++-- .../victory-container.spec.js | 6 ++--- test/client/spec/victory-util/helpers.spec.js | 6 ++--- 5 files changed, 37 insertions(+), 30 deletions(-) diff --git a/src/victory-container/victory-container.js b/src/victory-container/victory-container.js index 29cb1f4..a16d454 100644 --- a/src/victory-container/victory-container.js +++ b/src/victory-container/victory-container.js @@ -89,31 +89,28 @@ export default class VictoryContainer extends React.Component { // Overridden in victory-core-native renderContainer(props, svgProps, style) { - const { title, desc, portalComponent, className, standalone } = props; + const { title, desc, portalComponent, className } = props; const children = this.getChildren(props); const parentProps = defaults({ style, className }, svgProps); - const groupComponent = props.groupComponent || ; - return standalone !== false ? - ( + return ( + - {title ? {title} : null} - {desc ? {desc} : null} {children} - {React.cloneElement(portalComponent, { ref: this.savePortalRef })} - ) : - React.cloneElement(groupComponent, parentProps, children); + {title ? {title} : null} + {desc ? {desc} : null} + {React.cloneElement(portalComponent, { ref: this.savePortalRef })} + + ); } render() { - const { width, height, responsive, events, standalone } = this.props; + const { width, height, responsive, events } = this.props; const style = responsive ? this.props.style : omit(this.props.style, ["height", "width"]); const svgProps = assign( { - width, height, - "aria-labelledby": standalone !== false ? "title desc" : undefined, - role: standalone !== false ? "img" : "presentation", - viewBox: responsive && standalone !== false ? `0 0 ${width} ${height}` : undefined + width, height, "aria-labelledby": "title desc", role: "img", + viewBox: responsive ? `0 0 ${width} ${height}` : undefined }, events ); diff --git a/src/victory-portal/portal.js b/src/victory-portal/portal.js index 5f67a39..6319d09 100644 --- a/src/victory-portal/portal.js +++ b/src/victory-portal/portal.js @@ -37,13 +37,23 @@ export default class Portal extends React.Component { // Overridden in victory-core-native render() { - return React.cloneElement( - this.props.groupComponent, - {}, - Object.keys(this.map).map((key) => { - const el = this.map[key]; - return el ? React.cloneElement(el, { key }) : el; - }) + // return React.cloneElement( + // this.props.groupComponent, + // {}, + // Object.keys(this.map).map((key) => { + // const el = this.map[key]; + // return el ? React.cloneElement(el, { key }) : el; + // }) + // ); + return ( + + + {Object.keys(this.map).map((key) => { + const el = this.map[key]; + return el ? React.cloneElement(el, { key }) : el; + })} + + ); } } diff --git a/src/victory-util/helpers.js b/src/victory-util/helpers.js index 3201fa3..798facb 100644 --- a/src/victory-util/helpers.js +++ b/src/victory-util/helpers.js @@ -14,7 +14,9 @@ export default { }; }, - getStyles(style, defaultStyles, height, width) { // eslint-disable-line max-params + getStyles(style, defaultStyles) { // eslint-disable-line max-params + const width = "100%"; + const height = "100%"; if (!style) { return defaults({ parent: { height, width } }, defaultStyles); } @@ -24,7 +26,7 @@ export default { const defaultLabels = defaultStyles && defaultStyles.labels || {}; const defaultData = defaultStyles && defaultStyles.data || {}; return { - parent: defaults({ height, width }, parent, defaultParent), + parent: defaults({}, parent, defaultParent, { width, height }), labels: defaults({}, labels, defaultLabels), data: defaults({}, data, defaultData) }; diff --git a/test/client/spec/victory-container/victory-container.spec.js b/test/client/spec/victory-container/victory-container.spec.js index 60aca00..eb33779 100644 --- a/test/client/spec/victory-container/victory-container.spec.js +++ b/test/client/spec/victory-container/victory-container.spec.js @@ -14,7 +14,7 @@ describe("components/victory-container", () => { const wrapper = shallow( ); - const output = wrapper.find("svg"); + const output = wrapper.find("svg").at(0); expect(output.prop("role")).to.contain("img"); }); @@ -40,7 +40,7 @@ describe("components/victory-container", () => { const wrapper = shallow( ); - const svg = wrapper.find("svg"); + const svg = wrapper.find("svg").at(0); const viewBoxValue = `0 0 ${width} ${height}`; expect(svg.prop("viewBox")).to.equal(viewBoxValue); @@ -51,7 +51,7 @@ describe("components/victory-container", () => { const wrapper = mount( ); - const svg = wrapper.find("svg"); + const svg = wrapper.find("svg").at(0); svg.simulate("click"); expect(clickHandler).called; }); diff --git a/test/client/spec/victory-util/helpers.spec.js b/test/client/spec/victory-util/helpers.spec.js index 0e98624..a308ae7 100644 --- a/test/client/spec/victory-util/helpers.spec.js +++ b/test/client/spec/victory-util/helpers.spec.js @@ -49,10 +49,8 @@ describe("helpers", () => { }; it("merges styles", () => { const style = { data: { fill: "red" }, labels: { fontSize: 12 } }; - const width = 500; - const height = 500; - const styles = Helpers.getStyles(style, defaultStyles, height, width); - expect(styles.parent).to.deep.equal({ border: "black", width: 500, height: 500 }); + const styles = Helpers.getStyles(style, defaultStyles); + expect(styles.parent).to.deep.equal({ border: "black", width: "100%", height: "100%" }); expect(styles.data).to.deep.equal({ fill: "red", stroke: "black" }); expect(styles.labels).to.deep.equal({ fontSize: 12, fontFamily: "Helvetica" }); }); From b51b0b55e595d7195051771ce9931c29c18ec154 Mon Sep 17 00:00:00 2001 From: boygirl Date: Tue, 9 May 2017 19:10:56 -0700 Subject: [PATCH 2/4] clean up --- src/victory-container/victory-container.js | 14 ++++++-------- src/victory-portal/portal.js | 8 -------- src/victory-util/helpers.js | 2 +- 3 files changed, 7 insertions(+), 17 deletions(-) diff --git a/src/victory-container/victory-container.js b/src/victory-container/victory-container.js index a16d454..b798165 100644 --- a/src/victory-container/victory-container.js +++ b/src/victory-container/victory-container.js @@ -18,7 +18,6 @@ export default class VictoryContainer extends React.Component { height: PropTypes.number, portalComponent: PropTypes.element, responsive: PropTypes.bool, - standalone: PropTypes.bool, style: PropTypes.object, theme: PropTypes.object, title: PropTypes.string, @@ -47,13 +46,12 @@ export default class VictoryContainer extends React.Component { } getChildContext() { - return this.props.standalone !== false ? - { - portalUpdate: this.portalUpdate, - portalRegister: this.portalRegister, - portalDeregister: this.portalDeregister, - getTimer: this.getTimer - } : {}; + return { + portalUpdate: this.portalUpdate, + portalRegister: this.portalRegister, + portalDeregister: this.portalDeregister, + getTimer: this.getTimer + }; } componentWillMount() { diff --git a/src/victory-portal/portal.js b/src/victory-portal/portal.js index 6319d09..1e75d87 100644 --- a/src/victory-portal/portal.js +++ b/src/victory-portal/portal.js @@ -37,14 +37,6 @@ export default class Portal extends React.Component { // Overridden in victory-core-native render() { - // return React.cloneElement( - // this.props.groupComponent, - // {}, - // Object.keys(this.map).map((key) => { - // const el = this.map[key]; - // return el ? React.cloneElement(el, { key }) : el; - // }) - // ); return ( diff --git a/src/victory-util/helpers.js b/src/victory-util/helpers.js index 798facb..d32cb38 100644 --- a/src/victory-util/helpers.js +++ b/src/victory-util/helpers.js @@ -14,7 +14,7 @@ export default { }; }, - getStyles(style, defaultStyles) { // eslint-disable-line max-params + getStyles(style, defaultStyles) { const width = "100%"; const height = "100%"; if (!style) { From b1d3f5caa536a8f4ee04b04ebbe83e1d570f9be0 Mon Sep 17 00:00:00 2001 From: boygirl Date: Tue, 9 May 2017 19:15:58 -0700 Subject: [PATCH 3/4] clean up portal --- src/victory-portal/portal.js | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/src/victory-portal/portal.js b/src/victory-portal/portal.js index 1e75d87..5f67a39 100644 --- a/src/victory-portal/portal.js +++ b/src/victory-portal/portal.js @@ -37,15 +37,13 @@ export default class Portal extends React.Component { // Overridden in victory-core-native render() { - return ( - - - {Object.keys(this.map).map((key) => { - const el = this.map[key]; - return el ? React.cloneElement(el, { key }) : el; - })} - - + return React.cloneElement( + this.props.groupComponent, + {}, + Object.keys(this.map).map((key) => { + const el = this.map[key]; + return el ? React.cloneElement(el, { key }) : el; + }) ); } } From a4136c3889b6cecfc145749cda4a1944f746fd33 Mon Sep 17 00:00:00 2001 From: boygirl Date: Wed, 10 May 2017 14:37:05 -0700 Subject: [PATCH 4/4] add renderInPortal prop to VictoryLabel --- src/victory-label/victory-label.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/victory-label/victory-label.js b/src/victory-label/victory-label.js index 49aa1e2..a500422 100644 --- a/src/victory-label/victory-label.js +++ b/src/victory-label/victory-label.js @@ -2,6 +2,7 @@ import React from "react"; import PropTypes from "prop-types"; import { PropTypes as CustomPropTypes, Helpers, Style, Log } from "../victory-util/index"; +import { default as VictoryPortal } from "../victory-portal/victory-portal"; import { assign, merge, isEqual } from "lodash"; const defaultStyles = { @@ -46,6 +47,7 @@ export default class VictoryLabel extends React.Component { CustomPropTypes.nonNegative, PropTypes.func ]), + renderInPortal: PropTypes.bool, style: PropTypes.oneOfType([ PropTypes.object, PropTypes.array @@ -243,6 +245,7 @@ export default class VictoryLabel extends React.Component { } render() { - return this.renderElements(this.props); + const label = this.renderElements(this.props); + return this.props.renderInPortal ? {label} : label; } }