Enable prettier formatting for demos (#2962)

.prettierignore

@@ -23,4 +23,3 @@ tsconfig.*.json
 storybook-static
 public
 artifacts
-demo

demo/rn/src/screens/chart-screen.tsx

@@ -15,9 +15,8 @@ import viewStyles from "../styles/view-styles";
 import { getTransitionData } from "../data";
 
 export const ChartScreen: React.FC = () => {
-  const [transitionData, setTransitionData] = React.useState(
-    getTransitionData(),
-  );
+  const [transitionData, setTransitionData] =
+    React.useState(getTransitionData());
 
   React.useEffect(() => {
     const updateDataHandle = setInterval(() => {

demo/ts/components/accessibility-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { isNumber } from "lodash";
 import { VictoryGroup } from "victory-group";
@@ -87,7 +86,10 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
             data-testid="bar-accessibility-chart"
           >
             <h3 style={chartHeadingStyle}>Bar chart</h3>
-            <VictoryChart theme={VictoryTheme.clean} domainPadding={{ x: 40, y: 40 }}>
+            <VictoryChart
+              theme={VictoryTheme.clean}
+              domainPadding={{ x: 40, y: 40 }}
+            >
               <VictoryBar
                 data={accessibilityBarData}
                 dataComponent={
@@ -103,7 +105,10 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
           {/** BOXPLOT */}
           <div style={chartContainerStyle}>
             <h3 style={chartHeadingStyle}>BoxPlot</h3>
-            <VictoryChart theme={VictoryTheme.clean} domainPadding={{ x: 40, y: 40 }}>
+            <VictoryChart
+              theme={VictoryTheme.clean}
+              domainPadding={{ x: 40, y: 40 }}
+            >
               <VictoryBoxPlot
                 minLabels
                 maxLabels
@@ -186,7 +191,7 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
                     />
                   }
                 />
-                <VictoryArea 
+                <VictoryArea
                   style={{ data: { fill: "#77D1F3" } }}
                   data={accessibilityAreaData.b}
                   dataComponent={
@@ -202,11 +207,11 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
                   style={{ data: { fill: "#18BFFF" } }}
                   data={accessibilityAreaData.c}
                   dataComponent={
-                      <Area
+                    <Area
                       ariaLabel={({ data }) =>
                         `area chart stack ${data?.[0]._stack}`
-                    }
-                    tabIndex={20.2}
+                      }
+                      tabIndex={20.2}
                     />
                   }
                 />
@@ -229,7 +234,10 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
           {/** LINE */}
           <div style={chartContainerStyle}>
             <h3 style={chartHeadingStyle}>Line</h3>
-            <VictoryChart theme={VictoryTheme.clean} domain={{ x: [0, 6], y: [1, 7] }}>
+            <VictoryChart
+              theme={VictoryTheme.clean}
+              domain={{ x: [0, 6], y: [1, 7] }}
+            >
               <VictoryLine
                 data={accessibilityLineData}
                 labels={({ datum }) => datum.y}
@@ -280,7 +288,10 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
           {/** SCATTER */}
           <div style={chartContainerStyle}>
             <h3 style={chartHeadingStyle}>Scatter</h3>
-            <VictoryChart theme={VictoryTheme.clean} domain={{ x: [0, 6], y: [0, 8] }}>
+            <VictoryChart
+              theme={VictoryTheme.clean}
+              domain={{ x: [0, 6], y: [0, 8] }}
+            >
               <VictoryScatter
                 size={7}
                 data={accessibilityScatterData}
@@ -299,7 +310,7 @@ export default class VictoryAccessibilityDemo extends React.Component<any> {
           {/** VORONOI */}
           <div style={chartContainerStyle}>
             <h3 style={chartHeadingStyle}>Voronoi</h3>
-            <VictoryChart theme={VictoryTheme.clean} >
+            <VictoryChart theme={VictoryTheme.clean}>
               <VictoryVoronoi
                 data={accessibilityVoronoiData}
                 dataComponent={

demo/ts/components/animation-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { random, range } from "lodash";
 import { VictoryBar } from "victory-bar";

demo/ts/components/canvas-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 
 import { range, random } from "lodash";

demo/ts/components/create-container-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { round } from "lodash";
 import { VictoryChart } from "victory-chart";

demo/ts/components/draggable-demo.tsx

@@ -1,5 +1,3 @@
-
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryAxis } from "victory-axis";

demo/ts/components/events-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/external-events-demo.tsx

@@ -1,5 +1,3 @@
-
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/group-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/horizontal-demo.tsx

@@ -1,5 +1,3 @@
-
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/immutable-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { keys, random, range, round } from "lodash";
 import { fromJS } from "immutable";
@@ -104,7 +103,6 @@ export default class ImmutableDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         scatterData: this.getScatterData(),

demo/ts/components/primitives-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 
 import { VictoryAxis } from "victory-axis";

demo/ts/components/selection-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/victory-axis-demo.tsx

@@ -24,7 +24,6 @@ export default class VictoryAxisDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         tickValues: this.getTickValues(),

demo/ts/components/victory-box-plot-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryBoxPlot } from "victory-box-plot";

demo/ts/components/victory-brush-container-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryStack } from "victory-stack";

demo/ts/components/victory-brush-line-demo.tsx

@@ -1,6 +1,3 @@
-
-
-
 import React from "react";
 import { VictoryChart } from "victory-chart";
 import { VictoryAxis } from "victory-axis";

demo/ts/components/victory-chart-demo.tsx

@@ -79,7 +79,6 @@ class VictoryChartDemo extends React.Component<any, VictoryChartDemoState> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         scatterData: this.getScatterData(),

demo/ts/components/victory-cursor-container-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { random, range, round } from "lodash";
 import { VictoryChart } from "victory-chart";
@@ -38,7 +37,6 @@ class App extends React.Component<any, VictoryCursorContainerStateInterface> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryAxis } from "victory-axis";
 import { VictoryArea } from "victory-area";

demo/ts/components/victory-errorbar-demo.tsx

@@ -47,7 +47,6 @@ export default class VictoryErrorBarDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-histogram-demo.tsx

@@ -122,7 +122,6 @@ export default class App extends React.Component<{}, VictoryBarDemoState> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       const randomValue = random(300);
 

demo/ts/components/victory-label-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryLabel, VictoryTheme } from "victory-core";
 import { VictoryScatter, VictoryScatterProps } from "victory-scatter";

demo/ts/components/victory-pie-demo.tsx

@@ -58,7 +58,6 @@ export default class VictoryPieDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-polar-axis-demo.tsx

@@ -54,7 +54,6 @@ class App extends React.Component<any, VictoryPolarAxisState> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-scatter-demo.tsx

@@ -1,4 +1,3 @@
-
 import React, { useState } from "react";
 import PropTypes from "prop-types";
 import { random, range } from "lodash";
@@ -11,11 +10,7 @@ import {
 } from "victory-core";
 import bubbleData from "./bubble-data";
 import symbolData from "./symbol-data";
-import {
-  FaMoon,
-  FaFootballBall,
-  FaSun,
-} from "react-icons/fa";
+import { FaMoon, FaFootballBall, FaSun } from "react-icons/fa";
 
 type DataType = {
   x?: string | number;
@@ -122,7 +117,6 @@ const CustomCustomIconWithEvents = (props) => {
   );
 };
 
-
 class CatPoint extends React.Component<any, CatPointInterface> {
   static propTypes = {
     symbol: PropTypes.string,
@@ -178,7 +172,6 @@ export default class VictoryScatterDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: getData(),
@@ -229,8 +222,8 @@ export default class VictoryScatterDemo extends React.Component<
             data: {
               fill: ({ datum }) =>
                 datum.y > 0
-                  ? VictoryTheme.clean.palette?.colors?.red ?? "red"
-                  : VictoryTheme.clean.palette?.colors?.blue ?? "blue",
+                  ? (VictoryTheme.clean.palette?.colors?.red ?? "red")
+                  : (VictoryTheme.clean.palette?.colors?.blue ?? "blue"),
             },
           }}
           symbol={({ datum }) => (datum.y > 0 ? "triangleUp" : "triangleDown")}
@@ -332,20 +325,20 @@ export default class VictoryScatterDemo extends React.Component<
         {/* custom icons */}
         <VictoryScatter
           style={{
-            parent: style.parent
+            parent: style.parent,
           }}
           data={[
             { x: 1, y: 45 },
             { x: 2, y: 85 },
             { x: 3, y: 55 },
             { x: 4, y: 25 },
-            { x: 5, y: 65 }
+            { x: 5, y: 65 },
           ]}
           dataComponent={<CustomCustomIconWithEvents />}
         />
         <VictoryScatter
           style={{
-            parent: style.parent
+            parent: style.parent,
           }}
           dataComponent={<CustomSunIcon />}
           size={25}

demo/ts/components/victory-selection-container-demo.tsx

@@ -53,7 +53,6 @@ class VictorySelectionContainerDemo extends React.Component<any, any> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-voronoi-container-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { random, range } from "lodash";
 import { VictoryChart } from "victory-chart";
@@ -55,7 +54,6 @@ export default class VictoryVoronoiContainerDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-voronoi-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { VictoryVoronoi } from "victory-voronoi";
 import { VictoryTooltip } from "victory-tooltip";
@@ -38,7 +37,6 @@ class VoronoiDemo extends React.Component<any, VoronoiDemoStateProps> {
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

demo/ts/components/victory-zoom-container-demo.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { range, random, minBy, maxBy, last } from "lodash";
 import { VictoryChart } from "victory-chart";
@@ -170,7 +169,6 @@ export default class VictoryZoomContainerDemo extends React.Component<
   }
 
   componentDidMount() {
-
     this.setStateInterval = window.setInterval(() => {
       this.setState({
         data: this.getData(),

eslint.config.mjs

@@ -133,7 +133,6 @@ export default tseslint.config(
     files: ["**/demo/**/*.{ts,tsx}"],
     rules: {
       "no-magic-numbers": "off",
-      "prettier/prettier": "off",
       "react/no-multi-comp": "off",
       "@typescript-eslint/no-empty-object-type": "off",
     },