diff --git a/docs/src/pages/gallery.js b/docs/src/pages/gallery.js index 28c193d2b..56b894a0a 100644 --- a/docs/src/pages/gallery.js +++ b/docs/src/pages/gallery.js @@ -77,7 +77,13 @@ const Divider = styled.hr` margin: 3rem 0; `; -const Gallery = ({ gallery, sidebarContent }) => { +const defaultProps = { + params : null +} + +const Gallery = (props) => { + props={...defaultProps, ...props} + let {gallery,sidebarContent} = props; const parseRaw = (str) => { const playground = "playground_norender"; const start = str.indexOf(playground) + playground.length; @@ -147,8 +153,4 @@ Gallery.propTypes = { sidebarContent: PropTypes.array, }; -Gallery.defaultProps = { - params: null, -}; - export default withRouteData(Gallery); diff --git a/docs/src/partials/gallery/preview.js b/docs/src/partials/gallery/preview.js index 90339adfc..a091fce1a 100644 --- a/docs/src/partials/gallery/preview.js +++ b/docs/src/partials/gallery/preview.js @@ -51,7 +51,7 @@ const Preview = (props) => { const executeCode = () => { const mountNode = ref; - const { scope, noRender, previewComponent } = props; + const { scope, noRender, previewComponent="div" } = props; const tempScope = []; Object.keys(scope).forEach((s) => tempScope.push(scope[s])); @@ -84,10 +84,6 @@ const Preview = (props) => { ); }; -Preview.defaultProps = { - previewComponent: "div", -}; - Preview.propTypes = { codeText: PropTypes.string.isRequired, context: PropTypes.object, diff --git a/docs/src/partials/sidebar/index.js b/docs/src/partials/sidebar/index.js index fe2cc1801..9ec282b6b 100644 --- a/docs/src/partials/sidebar/index.js +++ b/docs/src/partials/sidebar/index.js @@ -108,7 +108,7 @@ const getMatchTree = (link, filterTerm) => { return []; }; -const Sidebar = ({ className, content, onCloseClick }) => { +const Sidebar = ({ className="", content, onCloseClick }) => { const location = useLocation(); const [filteredResults, setFilteredResults] = useState(content); const [filterTerm, setFilterTerm] = useState(""); @@ -257,8 +257,4 @@ Sidebar.propTypes = { onCloseClick: PropTypes.func, }; -Sidebar.defaultProps = { - className: "", -}; - export default withRouteData(Sidebar); diff --git a/packages/victory-area/src/area.tsx b/packages/victory-area/src/area.tsx index 79d55cd14..3804c6373 100644 --- a/packages/victory-area/src/area.tsx +++ b/packages/victory-area/src/area.tsx @@ -99,15 +99,15 @@ export const Area: React.FC = (props) => { props = evaluateProps(props); const { ariaLabel, - role, - shapeRendering, + role="presentation", + shapeRendering="auto", className, polar, origin, data, - pathComponent, + pathComponent=, events, - groupComponent, + groupComponent=, clipPath, id, style, @@ -137,7 +137,7 @@ export const Area: React.FC = (props) => { }; const area = React.cloneElement( - pathComponent!, + pathComponent, assign( { key: `${id}-area`, @@ -153,7 +153,7 @@ export const Area: React.FC = (props) => { const line = renderLine ? React.cloneElement( - pathComponent!, + pathComponent, assign( { key: `${id}-area-stroke`, @@ -166,7 +166,7 @@ export const Area: React.FC = (props) => { : null; return renderLine - ? React.cloneElement(groupComponent!, userProps, [area, line]) + ? React.cloneElement(groupComponent, userProps, [area, line]) : area; }; @@ -177,13 +177,6 @@ Area.propTypes = { pathComponent: PropTypes.element, }; -Area.defaultProps = { - groupComponent: , - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export interface AreaProps extends VictoryCommonPrimitiveProps { horizontal?: VictoryCommonThemeProps["horizontal"]; groupComponent?: React.ReactElement; diff --git a/packages/victory-bar/src/bar.js b/packages/victory-bar/src/bar.js index ccc5e73cc..1374e88ab 100644 --- a/packages/victory-bar/src/bar.js +++ b/packages/victory-bar/src/bar.js @@ -41,9 +41,15 @@ const evaluateProps = (props) => { }); }; +const defaultProps = { + defaultBarWidth: 8, + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; // eslint-disable-next-line prefer-arrow-callback const Bar = forwardRef(function Bar(props, ref) { - props = evaluateProps(props); + props = evaluateProps({ ...defaultProps, ...props}); const { polar, origin, style, barWidth, cornerRadius } = props; const path = polar @@ -95,11 +101,4 @@ Bar.propTypes = { y0: PropTypes.number, }; -Bar.defaultProps = { - defaultBarWidth: 8, - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export default Bar; diff --git a/packages/victory-candlestick/src/candle.js b/packages/victory-candlestick/src/candle.js index 44b15b06f..d97f165a2 100644 --- a/packages/victory-candlestick/src/candle.js +++ b/packages/victory-candlestick/src/candle.js @@ -89,8 +89,16 @@ const evaluateProps = (props) => { }); }; +const defaultProps = { + groupComponent: , + lineComponent: , + rectComponent: , + role: "presentation", + shapeRendering: "auto", +}; + const Candle = (props) => { - props = evaluateProps(props); + props = evaluateProps({ ...defaultProps, ...props}); const { ariaLabel, events, @@ -147,12 +155,4 @@ Candle.propTypes = { x: PropTypes.number, }; -Candle.defaultProps = { - groupComponent: , - lineComponent: , - rectComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export default Candle; diff --git a/packages/victory-chart/src/victory-chart.tsx b/packages/victory-chart/src/victory-chart.tsx index c49f3cc50..2f0f9a09d 100644 --- a/packages/victory-chart/src/victory-chart.tsx +++ b/packages/victory-chart/src/victory-chart.tsx @@ -36,7 +36,24 @@ const fallbackProps = { padding: 50, }; +const defaultProps = { + backgroundComponent: , + containerComponent: , + defaultAxes: { + independent: , + dependent: , + }, + defaultPolarAxes: { + independent: , + dependent: , + }, + groupComponent: , + standalone: true, + theme: VictoryTheme.grayscale, +}; + const VictoryChartImpl: React.FC = (initialProps) => { + initialProps = {...defaultProps,...initialProps} const role = "chart"; const { getAnimationProps, setAnimationState, getProps } = Hooks.useAnimationState(); @@ -201,22 +218,6 @@ VictoryChartImpl.propTypes = { startAngle: PropTypes.number, }; -VictoryChartImpl.defaultProps = { - backgroundComponent: , - containerComponent: , - defaultAxes: { - independent: , - dependent: , - }, - defaultPolarAxes: { - independent: , - dependent: , - }, - groupComponent: , - standalone: true, - theme: VictoryTheme.grayscale, -}; - export const VictoryChart = React.memo(VictoryChartImpl, isEqual); VictoryChart.displayName = "VictoryChart"; diff --git a/packages/victory-core/src/victory-label/victory-label.tsx b/packages/victory-core/src/victory-label/victory-label.tsx index 4bf2b095a..48f3c3547 100644 --- a/packages/victory-core/src/victory-label/victory-label.tsx +++ b/packages/victory-core/src/victory-label/victory-label.tsx @@ -572,11 +572,20 @@ const renderLabel = (calculatedProps, tspanValues) => { return React.cloneElement(textComponent, textProps, tspans); }; +const defaultProps = { + backgroundComponent: , + groupComponent: , + direction: "inherit", + textComponent: , + tspanComponent: , + capHeight: 0.71, // Magic number from d3. + lineHeight: 1, +}; export const VictoryLabel: { role: string; defaultStyles: typeof defaultStyles; } & React.FC = (props) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); if (props.text === null || props.text === undefined) { return null; @@ -713,13 +722,3 @@ VictoryLabel.propTypes = { // @ts-expect-error Number is not assignable to string y: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), }; - -VictoryLabel.defaultProps = { - backgroundComponent: , - groupComponent: , - direction: "inherit", - textComponent: , - tspanComponent: , - capHeight: 0.71, // Magic number from d3. - lineHeight: 1, -}; diff --git a/packages/victory-core/src/victory-primitives/arc.tsx b/packages/victory-core/src/victory-primitives/arc.tsx index 214947279..8c2cf17a0 100644 --- a/packages/victory-core/src/victory-primitives/arc.tsx +++ b/packages/victory-core/src/victory-primitives/arc.tsx @@ -62,8 +62,14 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, desc, id, style, tabIndex }); }; +const defaultProps = { + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Arc = (props: ArcProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); return React.cloneElement(props.pathComponent!, { ...props.events, @@ -91,9 +97,3 @@ Arc.propTypes = { r: PropTypes.number, startAngle: PropTypes.number, }; - -Arc.defaultProps = { - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-core/src/victory-primitives/background.tsx b/packages/victory-core/src/victory-primitives/background.tsx index 5a9ece2ad..0b400f6e4 100644 --- a/packages/victory-core/src/victory-primitives/background.tsx +++ b/packages/victory-core/src/victory-primitives/background.tsx @@ -30,8 +30,15 @@ const evaluateProps = (props) => { return assign({}, props, { id }); }; +const defaultProps = { + circleComponent: , + rectComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Background = (props: BackgroundProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); return props.polar ? React.cloneElement(props.circleComponent!, { @@ -71,9 +78,3 @@ Background.propTypes = { y: PropTypes.number, }; -Background.defaultProps = { - circleComponent: , - rectComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-core/src/victory-primitives/border.tsx b/packages/victory-core/src/victory-primitives/border.tsx index a1bf37822..5d5662d2b 100644 --- a/packages/victory-core/src/victory-primitives/border.tsx +++ b/packages/victory-core/src/victory-primitives/border.tsx @@ -37,8 +37,14 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, desc, id, style, tabIndex }); }; +const defaultProps = { + rectComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Border = (props: BorderProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); return React.cloneElement(props.rectComponent!, { ...props.events, @@ -65,10 +71,4 @@ Border.propTypes = { width: PropTypes.number, x: PropTypes.number, y: PropTypes.number, -}; - -Border.defaultProps = { - rectComponent: , - role: "presentation", - shapeRendering: "auto", -}; +}; \ No newline at end of file diff --git a/packages/victory-core/src/victory-primitives/line-segment.tsx b/packages/victory-core/src/victory-primitives/line-segment.tsx index 7473799a8..6f3587132 100644 --- a/packages/victory-core/src/victory-primitives/line-segment.tsx +++ b/packages/victory-core/src/victory-primitives/line-segment.tsx @@ -38,8 +38,14 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, desc, id, style, tabIndex }); }; +const defaultProps = { + lineComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const LineSegment = (props: LineSegmentProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); return React.cloneElement(props.lineComponent!, { ...props.events, @@ -68,9 +74,3 @@ LineSegment.propTypes = { y1: PropTypes.number, y2: PropTypes.number, }; - -LineSegment.defaultProps = { - lineComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-core/src/victory-primitives/point.tsx b/packages/victory-core/src/victory-primitives/point.tsx index e68dcebb2..b9e0f6367 100644 --- a/packages/victory-core/src/victory-primitives/point.tsx +++ b/packages/victory-core/src/victory-primitives/point.tsx @@ -66,8 +66,14 @@ const evaluateProps = (props) => { }); }; +const defaultProps = { + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Point = (props: PointProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const userProps = UserProps.getSafeUserProps(props); return React.cloneElement(props.pathComponent!, { @@ -110,8 +116,3 @@ Point.propTypes = { y: PropTypes.number, }; -Point.defaultProps = { - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-core/src/victory-primitives/whisker.tsx b/packages/victory-core/src/victory-primitives/whisker.tsx index 35b251fb7..c41fa84e3 100644 --- a/packages/victory-core/src/victory-primitives/whisker.tsx +++ b/packages/victory-core/src/victory-primitives/whisker.tsx @@ -40,8 +40,15 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, desc, id, style, tabIndex }); }; +const defaultProps = { + groupComponent: , + lineComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Whisker = (props: WhiskerProps) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const { ariaLabel, groupComponent, @@ -107,10 +114,3 @@ Whisker.propTypes = { y2: PropTypes.number, }), }; - -Whisker.defaultProps = { - groupComponent: , - lineComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-errorbar/src/error-bar.tsx b/packages/victory-errorbar/src/error-bar.tsx index fc6734334..cdaf889c0 100644 --- a/packages/victory-errorbar/src/error-bar.tsx +++ b/packages/victory-errorbar/src/error-bar.tsx @@ -109,8 +109,15 @@ export interface ErrorProps { // eslint-disable-next-line @typescript-eslint/no-empty-interface interface ErrorBar extends EventsMixinClass {} +const defaultProps = { + groupComponent: , + lineComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const ErrorBar = (props: ErrorBarProps & typeof ErrorBar.default) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const { groupComponent } = props; const userProps = UserProps.getSafeUserProps(props); const { tabIndex, ariaLabel } = props; @@ -152,9 +159,3 @@ ErrorBar.propTypes = { y: PropTypes.number, }; -ErrorBar.defaultProps = { - groupComponent: , - lineComponent: , - role: "presentation", - shapeRendering: "auto", -}; diff --git a/packages/victory-group/src/victory-group.tsx b/packages/victory-group/src/victory-group.tsx index 063381dc9..2568afb21 100644 --- a/packages/victory-group/src/victory-group.tsx +++ b/packages/victory-group/src/victory-group.tsx @@ -54,11 +54,20 @@ export interface VictoryGroupProps displayName?: string; } +const defaultProps = { + containerComponent: , + groupComponent: , + samples: 50, + standalone: true, + theme: VictoryTheme.grayscale, +}; + const VictoryGroupBase: React.FC = (initialProps) => { // eslint-disable-next-line no-use-before-define const role = VictoryGroup?.role; const { getAnimationProps, setAnimationState, getProps } = Hooks.useAnimationState(); + initialProps = {...defaultProps,...initialProps} const props = getProps(initialProps); const modifiedProps = Helpers.modifyProps(props, fallbackProps, role); @@ -188,14 +197,6 @@ VictoryGroupBase.propTypes = { offset: PropTypes.number, }; -VictoryGroupBase.defaultProps = { - containerComponent: , - groupComponent: , - samples: 50, - sortOrder: "ascending", - standalone: true, - theme: VictoryTheme.grayscale, -}; const componentConfig: VictoryComponentConfiguration = { role: "group", diff --git a/packages/victory-line/src/curve.tsx b/packages/victory-line/src/curve.tsx index 81c0d3c5e..8ba97fcca 100644 --- a/packages/victory-line/src/curve.tsx +++ b/packages/victory-line/src/curve.tsx @@ -35,8 +35,14 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, id, style, tabIndex }); }; +const defaultProps = { + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; + export const Curve: React.FC = (props) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const userProps = UserProps.getSafeUserProps(props); const { polar, origin } = props; const lineFunction = LineHelpers.getLineFunction(props); @@ -71,11 +77,6 @@ Curve.propTypes = { polar: PropTypes.bool, }; -Curve.defaultProps = { - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; export interface CurveProps extends VictoryCommonPrimitiveProps { ariaLabel?: StringOrCallback; diff --git a/packages/victory-native/src/helpers/wrap-core-component.js b/packages/victory-native/src/helpers/wrap-core-component.js index 6d3f8f05b..48ffe8b0b 100644 --- a/packages/victory-native/src/helpers/wrap-core-component.js +++ b/packages/victory-native/src/helpers/wrap-core-component.js @@ -7,7 +7,11 @@ import React from "react"; * @returns {React.FC} WrappedComponent Wrapped component (passes props through) */ export const wrapCoreComponent = ({ Component, defaultProps }) => { - const WrappedComponent = (props) => ; + + const WrappedComponent = (props) => { + props={...defaultProps,...props}; + return + }; /** * Any static properties existing on Component class @@ -18,7 +22,6 @@ export const wrapCoreComponent = ({ Component, defaultProps }) => { WrappedComponent[prop] = Component[prop]; } } - WrappedComponent.defaultProps = defaultProps; return WrappedComponent; }; diff --git a/packages/victory-pie/src/slice.js b/packages/victory-pie/src/slice.js index 715c70e4e..da476a361 100644 --- a/packages/victory-pie/src/slice.js +++ b/packages/victory-pie/src/slice.js @@ -68,8 +68,15 @@ const evaluateProps = (props) => { }); }; +const defaultProps = { + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; + + const Slice = (props) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const defaultTransform = props.origin ? `translate(${props.origin.x}, ${props.origin.y})` : undefined; @@ -102,10 +109,4 @@ Slice.propTypes = { sliceStartAngle: PropTypes.oneOfType([PropTypes.number, PropTypes.func]), }; -Slice.defaultProps = { - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export default Slice; diff --git a/packages/victory-stack/src/victory-stack.tsx b/packages/victory-stack/src/victory-stack.tsx index d60c6c5e1..6c70806e5 100644 --- a/packages/victory-stack/src/victory-stack.tsx +++ b/packages/victory-stack/src/victory-stack.tsx @@ -52,9 +52,18 @@ export interface VictoryStackProps xOffset?: number; } +const defaultProps = { + containerComponent: , + groupComponent: , + standalone: true, + theme: VictoryTheme.grayscale, + fillInMissingData: true, +}; + const VictoryStackBase = (initialProps: VictoryStackProps) => { // eslint-disable-next-line no-use-before-define const { role } = VictoryStack; + initialProps = {...defaultProps,...initialProps} const { setAnimationState, getAnimationProps, getProps } = Hooks.useAnimationState(); @@ -226,14 +235,6 @@ VictoryStackBase.propTypes = { xOffset: PropTypes.number, }; -VictoryStackBase.defaultProps = { - containerComponent: , - groupComponent: , - standalone: true, - theme: VictoryTheme.grayscale, - fillInMissingData: true, -}; - const componentConfig: VictoryComponentConfiguration = { role: "stack", expectedComponents: [ diff --git a/packages/victory-tooltip/src/flyout.js b/packages/victory-tooltip/src/flyout.js index 72500b19a..bbd25fa98 100644 --- a/packages/victory-tooltip/src/flyout.js +++ b/packages/victory-tooltip/src/flyout.js @@ -85,8 +85,14 @@ const evaluateProps = (props) => { return assign({}, props, { id, style }); }; +const defaultProps = { + pathComponent: , + role: "presentation", + shapeRendering: "auto", +}; + const Flyout = (props) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const userProps = UserProps.getSafeUserProps(props); return React.cloneElement(props.pathComponent, { @@ -119,10 +125,4 @@ Flyout.propTypes = { y: PropTypes.number, }; -Flyout.defaultProps = { - pathComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export default Flyout; diff --git a/packages/victory-voronoi/src/voronoi.js b/packages/victory-voronoi/src/voronoi.js index c813ca727..519fe73fd 100644 --- a/packages/victory-voronoi/src/voronoi.js +++ b/packages/victory-voronoi/src/voronoi.js @@ -35,8 +35,17 @@ const evaluateProps = (props) => { return assign({}, props, { ariaLabel, id, size, style, tabIndex }); }; +const defaultProps = { + pathComponent: , + circleComponent: , + clipPathComponent: , + groupComponent: , + role: "presentation", + shapeRendering: "auto", +}; + const Voronoi = (props) => { - props = evaluateProps(props); + props = evaluateProps({...defaultProps,...props}); const { ariaLabel, @@ -105,13 +114,4 @@ Voronoi.propTypes = { y: PropTypes.number, }; -Voronoi.defaultProps = { - pathComponent: , - circleComponent: , - clipPathComponent: , - groupComponent: , - role: "presentation", - shapeRendering: "auto", -}; - export default Voronoi;