diff --git a/packages/components/src/SquiggleChart.tsx b/packages/components/src/SquiggleChart.tsx deleted file mode 100644 index 7b0b3e43..00000000 --- a/packages/components/src/SquiggleChart.tsx +++ /dev/null @@ -1,413 +0,0 @@ -import * as React from "react"; -import _ from "lodash"; -import type { Spec } from "vega"; -import { run } from "@quri/squiggle-lang"; -import type { - DistPlus, - SamplingInputs, - exportEnv, - exportDistribution, -} from "@quri/squiggle-lang"; -import { createClassFromSpec } from "react-vega"; -import * as chartSpecification from "./spec-distributions.json"; -import * as percentilesSpec from "./spec-percentiles.json"; -import { NumberShower } from "./NumberShower"; -import styled from "styled-components"; -import { CONTINUOUS_TO_DISCRETE_SCALES } from "vega-lite/build/src/scale"; - -let SquiggleVegaChart = createClassFromSpec({ - spec: chartSpecification as Spec, -}); - -let SquigglePercentilesChart = createClassFromSpec({ - spec: percentilesSpec as Spec, -}); - -export interface SquiggleChartProps { - /** The input string for squiggle */ - squiggleString?: string; - - /** If the output requires monte carlo sampling, the amount of samples */ - sampleCount?: number; - /** The amount of points returned to draw the distribution */ - outputXYPoints?: number; - kernelWidth?: number; - pointDistLength?: number; - /** If the result is a function, where the function starts */ - diagramStart?: number; - /** If the result is a function, where the function ends */ - diagramStop?: number; - /** If the result is a function, how many points along the function it samples */ - diagramCount?: number; - /** variables declared before this expression */ - environment?: exportEnv; - /** When the environment changes */ - onEnvChange?(env: exportEnv): void; - /** CSS width of the element */ - width?: number; - height?: number; -} - -const Error = styled.div` - border: 1px solid #792e2e; - background: #eee2e2; - padding: 0.4em 0.8em; -`; - -const ShowError: React.FC<{ heading: string; children: React.ReactNode }> = ({ - heading = "Error", - children, -}) => { - return ( - -

{heading}

- {children} -
- ); -}; - -export const DistPlusChart: React.FC<{ - distPlus: DistPlus; - width: number; - height: number; -}> = ({ distPlus, width, height }) => { - let shape = distPlus.pointSetDist; - if (shape.tag === "Continuous") { - let xyShape = shape.value.xyShape; - let totalY = xyShape.ys.reduce((a, b) => a + b); - let total = 0; - let cdf = xyShape.ys.map((y) => { - total += y; - return total / totalY; - }); - let values = _.zip(cdf, xyShape.xs, xyShape.ys).map(([c, x, y]) => ({ - cdf: (c * 100).toFixed(2) + "%", - x: x, - y: y, - })); - - return ( - - ); - } else if (shape.tag === "Discrete") { - let xyShape = shape.value.xyShape; - let totalY = xyShape.ys.reduce((a, b) => a + b); - let total = 0; - let cdf = xyShape.ys.map((y) => { - total += y; - return total / totalY; - }); - let values = _.zip(cdf, xyShape.xs, xyShape.ys).map(([c, x, y]) => ({ - cdf: (c * 100).toFixed(2) + "%", - x: x, - y: y, - })); - - return ; - } else if (shape.tag === "Mixed") { - let discreteShape = shape.value.discrete.xyShape; - let totalDiscrete = discreteShape.ys.reduce((a, b) => a + b); - - let discretePoints = _.zip(discreteShape.xs, discreteShape.ys); - let continuousShape = shape.value.continuous.xyShape; - let continuousPoints = _.zip(continuousShape.xs, continuousShape.ys); - - interface labeledPoint { - x: number; - y: number; - type: "discrete" | "continuous"; - } - - let markedDisPoints: labeledPoint[] = discretePoints.map(([x, y]) => ({ - x: x, - y: y, - type: "discrete", - })); - let markedConPoints: labeledPoint[] = continuousPoints.map(([x, y]) => ({ - x: x, - y: y, - type: "continuous", - })); - - let sortedPoints = _.sortBy(markedDisPoints.concat(markedConPoints), "x"); - - let totalContinuous = 1 - totalDiscrete; - let totalY = continuousShape.ys.reduce((a: number, b: number) => a + b); - - let total = 0; - let cdf = sortedPoints.map((point: labeledPoint) => { - if (point.type === "discrete") { - total += point.y; - return total; - } else if (point.type === "continuous") { - total += (point.y / totalY) * totalContinuous; - return total; - } - }); - - interface cdfLabeledPoint { - cdf: string; - x: number; - y: number; - type: "discrete" | "continuous"; - } - let cdfLabeledPoint: cdfLabeledPoint[] = _.zipWith( - cdf, - sortedPoints, - (c: number, point: labeledPoint) => ({ - ...point, - cdf: (c * 100).toFixed(2) + "%", - }) - ); - let continuousValues = cdfLabeledPoint.filter( - (x) => x.type === "continuous" - ); - let discreteValues = cdfLabeledPoint.filter((x) => x.type === "discrete"); - - return ( - - ); - } -}; - -const _rangeByCount = (start, stop, count) => { - const step = (stop - start) / (count - 1); - const items = _.range(start, stop, step); - const result = items.concat([stop]); - return result; -}; - -type distPlusFn = ( - a: number -) => { tag: "Ok"; value: DistPlus } | { tag: "Error"; value: string }; - -// This could really use a line in the location of the signal. I couldn't get it to work. -// https://vega.github.io/vega/docs/signals/#handlers - -export const FunctionChart: React.FC<{ - distPlusFn: distPlusFn; - diagramStart: number; - diagramStop: number; - diagramCount: number; -}> = ({ distPlusFn, diagramStart, diagramStop, diagramCount }) => { - let [mouseOverlay, setMouseOverlay] = React.useState(NaN); - function handleHover(...args) { - setMouseOverlay(args[1]); - } - function handleOut(...args) { - setMouseOverlay(NaN); - } - const signalListeners = { mousemove: handleHover, mouseout: handleOut }; - let percentileArray = [ - 0.01, 0.05, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.95, 0.99, - ]; - let mouseItem = distPlusFn(mouseOverlay); - let showChart = - mouseItem.tag === "Ok" ? ( - - ) : ( - <> - ); - let data1 = _rangeByCount(diagramStart, diagramStop, diagramCount); - let valueData = data1 - .map((x) => { - let result = distPlusFn(x); - if (result.tag === "Ok") { - return { x: x, value: result.value }; - } else return null; - }) - .filter((x) => x !== null) - .map(({ x, value }) => { - let percentiles = getPercentiles(percentileArray, value); - return { - x: x, - p1: percentiles[0], - p5: percentiles[1], - p10: percentiles[2], - p20: percentiles[3], - p30: percentiles[4], - p40: percentiles[5], - p50: percentiles[6], - p60: percentiles[7], - p70: percentiles[8], - p80: percentiles[9], - p90: percentiles[10], - p95: percentiles[11], - p99: percentiles[12], - }; - }); - - let errorData = data1 - .map((x) => { - let result = distPlusFn(x); - if (result.tag === "Error") { - return { x: x, error: result.value }; - } else return null; - }) - .filter((x) => x !== null); - let error2 = _.groupBy(errorData, (x) => x.error); - return ( - <> - - {showChart} - {_.keysIn(error2).map((k) => ( - - {`Values: [${error2[k].map((r) => r.x.toFixed(2)).join(",")}]`} - - ))} - - ); -}; - -export const SquiggleChart: React.FC = ({ - squiggleString = "", - sampleCount = 1000, - outputXYPoints = 1000, - kernelWidth, - pointDistLength = 1000, - diagramStart = 0, - diagramStop = 10, - diagramCount = 20, - environment = [], - onEnvChange = () => {}, - width = 500, - height = 60, -}: SquiggleChartProps) => { - let samplingInputs: SamplingInputs = { - sampleCount: sampleCount, - outputXYPoints: outputXYPoints, - kernelWidth: kernelWidth, - pointDistLength: pointDistLength, - }; - - let result = run(squiggleString, samplingInputs, environment); - if (result.tag === "Ok") { - let environment = result.value.environment; - let exports = result.value.exports; - onEnvChange(environment); - let chartResults = exports.map((chartResult: exportDistribution) => { - if (chartResult["NAME"] === "Float") { - return ; - } else if (chartResult["NAME"] === "DistPlus") { - return ( - - ); - } else if (chartResult.NAME === "Function") { - return ( - - ); - } - }); - return <>{chartResults}; - } else if (result.tag === "Error") { - // At this point, we came across an error. What was our error? - return {result.value}; - } -}; - -function getPercentiles(percentiles: number[], t: DistPlus) { - if (t.pointSetDist.tag === "Discrete") { - let total = 0; - let maxX = _.max(t.pointSetDist.value.xyShape.xs); - let bounds = percentiles.map((_) => maxX); - _.zipWith( - t.pointSetDist.value.xyShape.xs, - t.pointSetDist.value.xyShape.ys, - (x, y) => { - total += y; - percentiles.forEach((v, i) => { - if (total > v && bounds[i] === maxX) { - bounds[i] = x; - } - }); - } - ); - return bounds; - } else if (t.pointSetDist.tag === "Continuous") { - let total = 0; - let maxX = _.max(t.pointSetDist.value.xyShape.xs); - let totalY = _.sum(t.pointSetDist.value.xyShape.ys); - let bounds = percentiles.map((_) => maxX); - _.zipWith( - t.pointSetDist.value.xyShape.xs, - t.pointSetDist.value.xyShape.ys, - (x, y) => { - total += y / totalY; - percentiles.forEach((v, i) => { - if (total > v && bounds[i] === maxX) { - bounds[i] = x; - } - }); - } - ); - return bounds; - } else if (t.pointSetDist.tag === "Mixed") { - let discreteShape = t.pointSetDist.value.discrete.xyShape; - let totalDiscrete = discreteShape.ys.reduce((a, b) => a + b); - - let discretePoints = _.zip(discreteShape.xs, discreteShape.ys); - let continuousShape = t.pointSetDist.value.continuous.xyShape; - let continuousPoints = _.zip(continuousShape.xs, continuousShape.ys); - - interface labeledPoint { - x: number; - y: number; - type: "discrete" | "continuous"; - } - - let markedDisPoints: labeledPoint[] = discretePoints.map(([x, y]) => ({ - x: x, - y: y, - type: "discrete", - })); - let markedConPoints: labeledPoint[] = continuousPoints.map(([x, y]) => ({ - x: x, - y: y, - type: "continuous", - })); - - let sortedPoints = _.sortBy(markedDisPoints.concat(markedConPoints), "x"); - - let totalContinuous = 1 - totalDiscrete; - let totalY = continuousShape.ys.reduce((a: number, b: number) => a + b); - - let total = 0; - let maxX = _.max(sortedPoints.map((x) => x.x)); - let bounds = percentiles.map((_) => maxX); - sortedPoints.map((point: labeledPoint) => { - if (point.type === "discrete") { - total += point.y; - } else if (point.type === "continuous") { - total += (point.y / totalY) * totalContinuous; - } - percentiles.forEach((v, i) => { - if (total > v && bounds[i] === maxX) { - bounds[i] = total; - } - }); - return total; - }); - return bounds; - } -} diff --git a/packages/components/src/CodeEditor.tsx b/packages/components/src/components/CodeEditor.tsx similarity index 100% rename from packages/components/src/CodeEditor.tsx rename to packages/components/src/components/CodeEditor.tsx diff --git a/packages/components/src/components/DistPlusChart.tsx b/packages/components/src/components/DistPlusChart.tsx new file mode 100644 index 00000000..02f2fabd --- /dev/null +++ b/packages/components/src/components/DistPlusChart.tsx @@ -0,0 +1,124 @@ +import * as React from "react"; +import _ from "lodash"; +import type { Spec } from "vega"; +import type { + DistPlus, +} from "@quri/squiggle-lang"; +import { createClassFromSpec } from "react-vega"; +import * as chartSpecification from "../vega-specs/spec-distributions.json"; + +let SquiggleVegaChart = createClassFromSpec({ + spec: chartSpecification as Spec, +}); + +export const DistPlusChart: React.FC<{ + distPlus: DistPlus; + width: number; + height: number; +}> = ({ distPlus, width, height }) => { + let shape = distPlus.pointSetDist; + if (shape.tag === "Continuous") { + let xyShape = shape.value.xyShape; + let totalY = xyShape.ys.reduce((a, b) => a + b); + let total = 0; + let cdf = xyShape.ys.map((y) => { + total += y; + return total / totalY; + }); + let values = _.zip(cdf, xyShape.xs, xyShape.ys).map(([c, x, y]) => ({ + cdf: (c * 100).toFixed(2) + "%", + x: x, + y: y, + })); + + return ( + + ); + } else if (shape.tag === "Discrete") { + let xyShape = shape.value.xyShape; + let totalY = xyShape.ys.reduce((a, b) => a + b); + let total = 0; + let cdf = xyShape.ys.map((y) => { + total += y; + return total / totalY; + }); + let values = _.zip(cdf, xyShape.xs, xyShape.ys).map(([c, x, y]) => ({ + cdf: (c * 100).toFixed(2) + "%", + x: x, + y: y, + })); + + return ; + } else if (shape.tag === "Mixed") { + let discreteShape = shape.value.discrete.xyShape; + let totalDiscrete = discreteShape.ys.reduce((a, b) => a + b); + + let discretePoints = _.zip(discreteShape.xs, discreteShape.ys); + let continuousShape = shape.value.continuous.xyShape; + let continuousPoints = _.zip(continuousShape.xs, continuousShape.ys); + + interface labeledPoint { + x: number; + y: number; + type: "discrete" | "continuous"; + } + + let markedDisPoints: labeledPoint[] = discretePoints.map(([x, y]) => ({ + x: x, + y: y, + type: "discrete", + })); + let markedConPoints: labeledPoint[] = continuousPoints.map(([x, y]) => ({ + x: x, + y: y, + type: "continuous", + })); + + let sortedPoints = _.sortBy(markedDisPoints.concat(markedConPoints), "x"); + + let totalContinuous = 1 - totalDiscrete; + let totalY = continuousShape.ys.reduce((a: number, b: number) => a + b); + + let total = 0; + let cdf = sortedPoints.map((point: labeledPoint) => { + if (point.type === "discrete") { + total += point.y; + return total; + } else if (point.type === "continuous") { + total += (point.y / totalY) * totalContinuous; + return total; + } + }); + + interface cdfLabeledPoint { + cdf: string; + x: number; + y: number; + type: "discrete" | "continuous"; + } + let cdfLabeledPoint: cdfLabeledPoint[] = _.zipWith( + cdf, + sortedPoints, + (c: number, point: labeledPoint) => ({ + ...point, + cdf: (c * 100).toFixed(2) + "%", + }) + ); + let continuousValues = cdfLabeledPoint.filter( + (x) => x.type === "continuous" + ); + let discreteValues = cdfLabeledPoint.filter((x) => x.type === "discrete"); + + return ( + + ); + } +}; \ No newline at end of file diff --git a/packages/components/src/components/Error.tsx b/packages/components/src/components/Error.tsx new file mode 100644 index 00000000..4f5236ae --- /dev/null +++ b/packages/components/src/components/Error.tsx @@ -0,0 +1,20 @@ +import * as React from "react"; +import styled from "styled-components"; + +const ShowError = styled.div` + border: 1px solid #792e2e; + background: #eee2e2; + padding: 0.4em 0.8em; +`; + +export const Error: React.FC<{ heading: string; children: React.ReactNode }> = ({ + heading = "Error", + children, +}) => { + return ( + +

{heading}

+ {children} +
+ ); +}; diff --git a/packages/components/src/components/FunctionChart.tsx b/packages/components/src/components/FunctionChart.tsx new file mode 100644 index 00000000..7625b2da --- /dev/null +++ b/packages/components/src/components/FunctionChart.tsx @@ -0,0 +1,188 @@ +import * as React from "react"; +import _ from "lodash"; +import type { Spec } from "vega"; +import type { DistPlus } from "@quri/squiggle-lang"; +import { createClassFromSpec } from "react-vega"; +import * as percentilesSpec from "../vega-specs/spec-percentiles.json"; +import { DistPlusChart } from "./DistPlusChart"; +import { Error } from "./Error"; + +let SquigglePercentilesChart = createClassFromSpec({ + spec: percentilesSpec as Spec, +}); + +type distPlusFn = ( + a: number +) => { tag: "Ok"; value: DistPlus } | { tag: "Error"; value: string }; + +const _rangeByCount = (start, stop, count) => { + const step = (stop - start) / (count - 1); + const items = _.range(start, stop, step); + const result = items.concat([stop]); + return result; +}; + +export const FunctionChart: React.FC<{ + distPlusFn: distPlusFn; + diagramStart: number; + diagramStop: number; + diagramCount: number; +}> = ({ distPlusFn, diagramStart, diagramStop, diagramCount }) => { + let [mouseOverlay, setMouseOverlay] = React.useState(NaN); + function handleHover(...args) { + setMouseOverlay(args[1]); + } + function handleOut(...args) { + setMouseOverlay(NaN); + } + const signalListeners = { mousemove: handleHover, mouseout: handleOut }; + let percentileArray = [ + 0.01, 0.05, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.95, 0.99, + ]; + let mouseItem = distPlusFn(mouseOverlay); + let showChart = + mouseItem.tag === "Ok" ? ( + + ) : ( + <> + ); + let data1 = _rangeByCount(diagramStart, diagramStop, diagramCount); + let valueData = data1 + .map((x) => { + let result = distPlusFn(x); + if (result.tag === "Ok") { + return { x: x, value: result.value }; + } else return null; + }) + .filter((x) => x !== null) + .map(({ x, value }) => { + let percentiles = getPercentiles(percentileArray, value); + return { + x: x, + p1: percentiles[0], + p5: percentiles[1], + p10: percentiles[2], + p20: percentiles[3], + p30: percentiles[4], + p40: percentiles[5], + p50: percentiles[6], + p60: percentiles[7], + p70: percentiles[8], + p80: percentiles[9], + p90: percentiles[10], + p95: percentiles[11], + p99: percentiles[12], + }; + }); + + let errorData = data1 + .map((x) => { + let result = distPlusFn(x); + if (result.tag === "Error") { + return { x: x, error: result.value }; + } else return null; + }) + .filter((x) => x !== null); + let error2 = _.groupBy(errorData, (x) => x.error); + return ( + <> + + {showChart} + {_.keysIn(error2).map((k) => ( + + {`Values: [${error2[k].map((r) => r.x.toFixed(2)).join(",")}]`} + + ))} + + ); +}; + +function getPercentiles(percentiles: number[], t: DistPlus) { + if (t.pointSetDist.tag === "Discrete") { + let total = 0; + let maxX = _.max(t.pointSetDist.value.xyShape.xs); + let bounds = percentiles.map((_) => maxX); + _.zipWith( + t.pointSetDist.value.xyShape.xs, + t.pointSetDist.value.xyShape.ys, + (x, y) => { + total += y; + percentiles.forEach((v, i) => { + if (total > v && bounds[i] === maxX) { + bounds[i] = x; + } + }); + } + ); + return bounds; + } else if (t.pointSetDist.tag === "Continuous") { + let total = 0; + let maxX = _.max(t.pointSetDist.value.xyShape.xs); + let totalY = _.sum(t.pointSetDist.value.xyShape.ys); + let bounds = percentiles.map((_) => maxX); + _.zipWith( + t.pointSetDist.value.xyShape.xs, + t.pointSetDist.value.xyShape.ys, + (x, y) => { + total += y / totalY; + percentiles.forEach((v, i) => { + if (total > v && bounds[i] === maxX) { + bounds[i] = x; + } + }); + } + ); + return bounds; + } else if (t.pointSetDist.tag === "Mixed") { + let discreteShape = t.pointSetDist.value.discrete.xyShape; + let totalDiscrete = discreteShape.ys.reduce((a, b) => a + b); + + let discretePoints = _.zip(discreteShape.xs, discreteShape.ys); + let continuousShape = t.pointSetDist.value.continuous.xyShape; + let continuousPoints = _.zip(continuousShape.xs, continuousShape.ys); + + interface labeledPoint { + x: number; + y: number; + type: "discrete" | "continuous"; + } + + let markedDisPoints: labeledPoint[] = discretePoints.map(([x, y]) => ({ + x: x, + y: y, + type: "discrete", + })); + let markedConPoints: labeledPoint[] = continuousPoints.map(([x, y]) => ({ + x: x, + y: y, + type: "continuous", + })); + + let sortedPoints = _.sortBy(markedDisPoints.concat(markedConPoints), "x"); + + let totalContinuous = 1 - totalDiscrete; + let totalY = continuousShape.ys.reduce((a: number, b: number) => a + b); + + let total = 0; + let maxX = _.max(sortedPoints.map((x) => x.x)); + let bounds = percentiles.map((_) => maxX); + sortedPoints.map((point: labeledPoint) => { + if (point.type === "discrete") { + total += point.y; + } else if (point.type === "continuous") { + total += (point.y / totalY) * totalContinuous; + } + percentiles.forEach((v, i) => { + if (total > v && bounds[i] === maxX) { + bounds[i] = total; + } + }); + return total; + }); + return bounds; + } +} diff --git a/packages/components/src/NumberShower.tsx b/packages/components/src/components/NumberShower.tsx similarity index 100% rename from packages/components/src/NumberShower.tsx rename to packages/components/src/components/NumberShower.tsx diff --git a/packages/components/src/components/SquiggleChart.tsx b/packages/components/src/components/SquiggleChart.tsx new file mode 100644 index 00000000..f5dc5667 --- /dev/null +++ b/packages/components/src/components/SquiggleChart.tsx @@ -0,0 +1,91 @@ +import * as React from "react"; +import _ from "lodash"; +import { run } from "@quri/squiggle-lang"; +import type { + SamplingInputs, + exportEnv, + exportDistribution, +} from "@quri/squiggle-lang"; +import { NumberShower } from "./NumberShower"; +import { DistPlusChart } from "./DistPlusChart"; +import { FunctionChart } from "./FunctionChart"; +import { Error } from "./Error"; + +export interface SquiggleChartProps { + /** The input string for squiggle */ + squiggleString?: string; + /** If the output requires monte carlo sampling, the amount of samples */ + sampleCount?: number; + /** The amount of points returned to draw the distribution */ + outputXYPoints?: number; + kernelWidth?: number; + pointDistLength?: number; + /** If the result is a function, where the function starts */ + diagramStart?: number; + /** If the result is a function, where the function ends */ + diagramStop?: number; + /** If the result is a function, how many points along the function it samples */ + diagramCount?: number; + /** variables declared before this expression */ + environment?: exportEnv; + /** When the environment changes */ + onEnvChange?(env: exportEnv): void; + /** CSS width of the element */ + width?: number; + height?: number; +} + +export const SquiggleChart: React.FC = ({ + squiggleString = "", + sampleCount = 1000, + outputXYPoints = 1000, + kernelWidth, + pointDistLength = 1000, + diagramStart = 0, + diagramStop = 10, + diagramCount = 20, + environment = [], + onEnvChange = () => {}, + width = 500, + height = 60, +}: SquiggleChartProps) => { + let samplingInputs: SamplingInputs = { + sampleCount: sampleCount, + outputXYPoints: outputXYPoints, + kernelWidth: kernelWidth, + pointDistLength: pointDistLength, + }; + + let result = run(squiggleString, samplingInputs, environment); + if (result.tag === "Ok") { + let environment = result.value.environment; + let exports = result.value.exports; + onEnvChange(environment); + let chartResults = exports.map((chartResult: exportDistribution) => { + if (chartResult["NAME"] === "Float") { + return ; + } else if (chartResult["NAME"] === "DistPlus") { + return ( + + ); + } else if (chartResult.NAME === "Function") { + return ( + + ); + } + }); + return <>{chartResults}; + } else if (result.tag === "Error") { + // At this point, we came across an error. What was our error? + return {result.value}; + } +}; diff --git a/packages/components/src/SquiggleEditor.tsx b/packages/components/src/components/SquiggleEditor.tsx similarity index 100% rename from packages/components/src/SquiggleEditor.tsx rename to packages/components/src/components/SquiggleEditor.tsx diff --git a/packages/components/src/SquigglePlayground.tsx b/packages/components/src/components/SquigglePlayground.tsx similarity index 100% rename from packages/components/src/SquigglePlayground.tsx rename to packages/components/src/components/SquigglePlayground.tsx diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts index 48aa2b16..c16e5ac7 100644 --- a/packages/components/src/index.ts +++ b/packages/components/src/index.ts @@ -1,6 +1,6 @@ -export { SquiggleChart } from "./SquiggleChart"; -export { SquiggleEditor, renderSquiggleEditorToDom } from "./SquiggleEditor"; +export { SquiggleChart } from "./components/SquiggleChart"; +export { SquiggleEditor, renderSquiggleEditorToDom } from "./components/SquiggleEditor"; import SquigglePlayground, { renderSquigglePlaygroundToDom, -} from "./SquigglePlayground"; +} from "./components/SquigglePlayground"; export { SquigglePlayground, renderSquigglePlaygroundToDom }; diff --git a/packages/components/src/stories/NumberShower.stories.mdx b/packages/components/src/stories/NumberShower.stories.mdx index 5f040be5..fd9f39d1 100644 --- a/packages/components/src/stories/NumberShower.stories.mdx +++ b/packages/components/src/stories/NumberShower.stories.mdx @@ -1,4 +1,4 @@ -import { NumberShower } from "../NumberShower"; +import { NumberShower } from "../components/NumberShower"; import { Canvas, Meta, Story, Props } from "@storybook/addon-docs"; diff --git a/packages/components/src/stories/SquiggleChart.stories.mdx b/packages/components/src/stories/SquiggleChart.stories.mdx index 94273232..9c4799e1 100644 --- a/packages/components/src/stories/SquiggleChart.stories.mdx +++ b/packages/components/src/stories/SquiggleChart.stories.mdx @@ -1,4 +1,4 @@ -import { SquiggleChart } from "../SquiggleChart"; +import { SquiggleChart } from "../components/SquiggleChart"; import { Canvas, Meta, Story, Props } from "@storybook/addon-docs"; diff --git a/packages/components/src/stories/SquiggleEditor.stories.mdx b/packages/components/src/stories/SquiggleEditor.stories.mdx index 9c86d4b6..3ae37bb3 100644 --- a/packages/components/src/stories/SquiggleEditor.stories.mdx +++ b/packages/components/src/stories/SquiggleEditor.stories.mdx @@ -1,4 +1,4 @@ -import { SquiggleEditor } from "../SquiggleEditor"; +import { SquiggleEditor } from "../components/SquiggleEditor"; import { Canvas, Meta, Story, Props } from "@storybook/addon-docs"; diff --git a/packages/components/src/stories/SquigglePlayground.stories.mdx b/packages/components/src/stories/SquigglePlayground.stories.mdx index 2964dadc..5aa20ba8 100644 --- a/packages/components/src/stories/SquigglePlayground.stories.mdx +++ b/packages/components/src/stories/SquigglePlayground.stories.mdx @@ -1,4 +1,4 @@ -import SquigglePlayground from "../SquigglePlayground"; +import SquigglePlayground from "../components/SquigglePlayground"; import { Canvas, Meta, Story, Props } from "@storybook/addon-docs"; diff --git a/packages/components/src/spec-distributions.json b/packages/components/src/vega-specs/spec-distributions.json similarity index 100% rename from packages/components/src/spec-distributions.json rename to packages/components/src/vega-specs/spec-distributions.json diff --git a/packages/components/src/spec-percentiles.json b/packages/components/src/vega-specs/spec-percentiles.json similarity index 100% rename from packages/components/src/spec-percentiles.json rename to packages/components/src/vega-specs/spec-percentiles.json diff --git a/packages/components/tsconfig.json b/packages/components/tsconfig.json index 571a0de7..5152fc9b 100644 --- a/packages/components/tsconfig.json +++ b/packages/components/tsconfig.json @@ -16,7 +16,7 @@ "declaration": true, "sourceMap": true }, - "files": ["src/spec-distributions.json", "src/spec-percentiles.json"], + "files": ["src/vega-specs/spec-distributions.json", "src/vega-specs/spec-percentiles.json"], "target": "ES6", "include": ["src/**/*", "src/*"], "exclude": ["node_modules", "**/*.spec.ts", "webpack.config.js"],