Merge branch 'chris--vx-demo-i' into chris--vx-demo-geo

airbnb · Jan 10, 2020 · 9a4d6e0 · 9a4d6e0
2 parents d97ea98 + 0908632
commit 9a4d6e0
Show file tree

Hide file tree

Showing 105 changed files with 5,195 additions and 5,075 deletions.
diff --git a/package.json b/package.json
@@ -18,7 +18,7 @@
   "private": true,
   "scripts": {
     "build": "yarn run babel && yarn run type:dts",
-    "build-one": "nimbus babel --clean --esm",
+    "build-one": "nimbus babel --clean",
     "babel": "yarn run babel:cjs && yarn run babel:esm",
     "babel:cjs": "nimbus babel --clean --workspaces=\"@vx/!(demo)\"",
     "babel:esm": "nimbus babel --clean --workspaces=\"@vx/!(demo)\" --esm",
@@ -32,6 +32,7 @@
     "setup": "yarn run build",
     "test": "yarn run jest",
     "type:dts": "nimbus typescript --build --reference-workspaces",
+    "type-one": "nimbus typescript --build",
     "docs": "yarn run docs:gen && node ./scripts/docs/index.js",
     "docs:gen": "lerna run docs",
     "prepare-release": "git checkout master && git pull --rebase origin master && yarn run docs && lerna updated",
@@ -73,6 +74,9 @@
   "workspaces": [
     "./packages/*"
   ],
+  "resolutions": {
+    "handlebars": "4.5.3"
+  },
   "nimbus": {
     "drivers": [
       "babel",

diff --git a/packages/vx-axis/src/axis/Axis.tsx b/packages/vx-axis/src/axis/Axis.tsx
@@ -149,7 +149,14 @@ export default function Axis<ScaleInput>({
             className={cx('vx-axis-tick', tickClassName)}
             transform={tickTransform}
           >
-            {!hideTicks && <Line from={tickFromPoint} to={tickToPoint} stroke={tickStroke} />}
+            {!hideTicks && (
+              <Line
+                from={tickFromPoint}
+                to={tickToPoint}
+                stroke={tickStroke}
+                strokeLinecap="square"
+              />
+            )}
             {tickComponent ? (
               tickComponent({
                 ...tickLabelPropsObj,

diff --git a/packages/vx-axis/src/types.ts b/packages/vx-axis/src/types.ts
@@ -80,9 +80,9 @@ export type GenericScale<ScaleInput> =
 interface ScaleNoRangeRound<ScaleInput> {
   (value: ScaleInput): ScaleOutput | [ScaleOutput, ScaleOutput]; // quantize scales return an array
   domain(): ScaleInput[] | [ScaleInput, ScaleInput];
-  domain(scaleInput: ScaleInput[] | [ScaleInput, ScaleInput]): this;
+  domain(scaleInput: ScaleInput[] | [ScaleInput, ScaleInput]): any; // we can't capture the copy of the type accurately
   range(): ScaleOutput[] | [ScaleOutput, ScaleOutput];
-  range(scaleOutput: ScaleOutput[] | [ScaleOutput, ScaleOutput]): this;
+  range(scaleOutput: ScaleOutput[] | [ScaleOutput, ScaleOutput]): any;
   ticks?: (count: number) => ScaleInput[] | [ScaleInput, ScaleInput];
   bandwidth?: () => number;
   round?: () => boolean;
@@ -93,7 +93,7 @@ interface ScaleNoRangeRound<ScaleInput> {
 // We cannot have optional methods AND overloads, so define a separate type for rangeRound
 interface ScaleWithRangeRound<ScaleInput> extends ScaleNoRangeRound<ScaleInput> {
   rangeRound(): ScaleOutput[] | [ScaleOutput, ScaleOutput];
-  rangeRound(scaleOutput: ScaleOutput[] | [ScaleOutput, ScaleOutput]): this;
+  rangeRound(scaleOutput: ScaleOutput[] | [ScaleOutput, ScaleOutput]): any;
 }
 
 export interface Point {

diff --git a/packages/vx-demo/package.json b/packages/vx-demo/package.json
@@ -16,6 +16,9 @@
   "author": "@hshoff",
   "license": "MIT",
   "dependencies": {
+    "@types/d3-array": "^2.0.0",
+    "@types/d3-scale-chromatic": "^1.3.1",
+    "@types/d3-time-format": "2.1.0",
     "@types/nprogress": "^0.2.0",
     "@types/prismjs": "^1.16.0",
     "@vx/annotation": "0.0.192",

diff --git a/packages/vx-demo/src/components/charts/VoronoiChart.js b/packages/vx-demo/src/components/charts/VoronoiChart.js
diff --git a/packages/vx-demo/src/components/gallery.js b/packages/vx-demo/src/components/gallery.js
@@ -6,42 +6,42 @@ import drawData from './util/drawData.ts';
 
 import Footer from './Footer.tsx';
 
-import Lines from './tiles/lines';
-import Bars from './tiles/bars';
-import Dots from './tiles/dots';
+import Lines from './tiles/Lines.tsx';
+import Bars from './tiles/Bars.tsx';
+import Dots from './tiles/Dots.tsx';
 import Patterns from './tiles/Patterns.tsx';
-import Gradients from './tiles/gradients';
-import Area from './tiles/area';
-import Stacked from './tiles/stacked';
+import Gradients from './tiles/Gradients.tsx';
+import Areas from './tiles/Areas.tsx';
+import StackedAreas from './tiles/Stacked-Areas.tsx';
 import MultiLine from './tiles/multiline';
-import Axis from './tiles/axis';
-import BarGroup from './tiles/bargroup';
-import BarGroupHorizontal from './tiles/bargrouphorizontal';
-import BarStack from './tiles/barstack';
-import BarStackHorizontal from './tiles/barstackhorizontal';
+import Axis from './tiles/Axis.tsx';
+import BarGroup from './tiles/BarGroup.tsx';
+import BarGroupHorizontal from './tiles/BarGroupHorizontal.tsx';
+import BarStack from './tiles/BarStack.tsx';
+import BarStackHorizontal from './tiles/BarStackHorizontal.tsx';
 import Heatmap from './tiles/heatmap';
 import LineRadial from './tiles/lineradial';
 import Pies from './tiles/pie';
-import Trees from './tiles/tree';
-import Cluster from './tiles/dendrogram';
-import Voronoi from './tiles/voronoi';
+import Trees from './tiles/Trees.tsx';
+import Dendrograms from './tiles/Dendrograms.tsx';
+import Voronoi from './tiles/Voronoi.tsx';
 import Legends from './tiles/legends';
-import StatsPlot from './tiles/statsplot';
+import StatsPlot from './tiles/Statsplot.tsx';
 import GeoMercator from './tiles/Geo-Mercator.tsx';
 import GeoCustom from './tiles/Geo-Custom.tsx';
 import Network from './tiles/Network.tsx';
-import Streamgraph from './tiles/streamgraph';
+import Streamgraph from './tiles/Streamgraph.tsx';
 import Pack from './tiles/Pack.tsx';
-import Treemap from './tiles/treemap';
+import Treemap from './tiles/Treemap.tsx';
 import Radar from './tiles/radar';
-import Responsive from './tiles/responsive';
+import Responsive from './tiles/Responsive.tsx';
 import DragI from './tiles/drag-i';
 import DragII from './tiles/drag-ii';
-import LinkTypes from './tiles/linkTypes';
+import LinkTypes from './tiles/LinkTypes.tsx';
 import Threshold from './tiles/threshold';
-import Chord from './tiles/chord';
-import Polygons from './tiles/polygons';
-import ZoomI from './tiles/zoom-i';
+import Chord from './tiles/Chord.tsx';
+import Polygons from './tiles/Polygons.tsx';
+import ZoomI from './tiles/Zoom-i.tsx';
 import BrushChart from './tiles/brush';
 
 const items = [
@@ -153,7 +153,7 @@ export default function() {
               <div className="image">
                 <ParentSize>
                   {({ width, height }) => (
-                    <Area
+                    <Areas
                       width={width}
                       height={height + detailsHeight}
                       margin={{
@@ -181,7 +181,7 @@ export default function() {
               <div className="image">
                 <ParentSize>
                   {({ width, height }) => (
-                    <Stacked
+                    <StackedAreas
                       width={width}
                       height={height + detailsHeight}
                       margin={{
@@ -430,7 +430,9 @@ export default function() {
             <div className="gallery-item" style={{ background: '#306c90' }}>
               <div className="image">
                 <ParentSize>
-                  {({ width, height }) => <Cluster width={width} height={height + detailsHeight} />}
+                  {({ width, height }) => (
+                    <Dendrograms width={width} height={height + detailsHeight} />
+                  )}
                 </ParentSize>
               </div>
               <div className="details" style={{ color: '#5dc26f' }}>