From 4c1daab09f058b1df65d3e30d15faee9a6b113d6 Mon Sep 17 00:00:00 2001 From: Sam Nolan Date: Fri, 1 Apr 2022 13:16:06 +1100 Subject: [PATCH] Add padding, remove undefined and fix CI --- packages/components/package.json | 3 +- packages/components/src/CodeEditor.tsx | 2 +- packages/components/src/SquiggleEditor.tsx | 23 +- .../components/src/SquigglePlayground.tsx | 72 +- packages/components/tsconfig.json | 3 +- yarn.lock | 1329 +---------------- 6 files changed, 74 insertions(+), 1358 deletions(-) diff --git a/packages/components/package.json b/packages/components/package.json index 31bb44c9..a3ab4c66 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -2,7 +2,6 @@ "name": "@quri/squiggle-components", "version": "0.1.6", "dependencies": { - "@emotion/react": "^11.8.2", "@quri/squiggle-lang": "0.2.2", "@testing-library/jest-dom": "^5.16.3", "@testing-library/react": "^12.1.2", @@ -16,6 +15,7 @@ "cross-env": "^7.0.3", "lodash": "^4.17.21", "react": "^17.0.2", + "react-ace": "^9.5.0", "react-dom": "^17.0.2", "react-scripts": "5.0.0", "react-vega": "^7.4.4", @@ -70,6 +70,7 @@ "@storybook/node-logger": "^6.4.18", "@storybook/preset-create-react-app": "^4.0.0", "@storybook/react": "^6.4.18", + "@types/styled-components": "^5.1.24", "@types/webpack": "^5.28.0", "prettier": "^2.6.0", "react-codejar": "^1.1.2", diff --git a/packages/components/src/CodeEditor.tsx b/packages/components/src/CodeEditor.tsx index 94cf990f..e7a85c86 100644 --- a/packages/components/src/CodeEditor.tsx +++ b/packages/components/src/CodeEditor.tsx @@ -16,8 +16,8 @@ export let CodeEditor : FC = (props) => - { + { this.setState({ expression: e }); }} - style={{ - borderRadius: "6px", - width: "530px", - border: "1px solid grey", - fontFamily: "'Source Code Pro', monospace", - fontSize: "14px", - fontWeight: "400", - letterSpacing: "normal", - lineHeight: "20px", - padding: "10px", - tabSize: "4", - }} - highlight={highlight} - lineNumbers={false} + oneLine={true} /> } -let rows = css` - >.antCol:firstChild { - paddingLeft: 0.25em; - paddingRight: 0.125em; - } - >.antCol:lastChild { - paddingLeft: 0.125em; - paddingRight: 0.25em; - } - >.antCol:not(:lastChild):not(:lastChild) { - paddingLeft: 0.125em; - paddingRight: 0.125em; - } - ` - -let parent = css` - .antImportNumber { - width: 100%; - } - - .anticon { - verticalAlign: "zero"; - } - ` -var form = css` - backgroundColor: #eee; - padding: 1em; - ` -var dist = css` - padding: 1em; - ` - -var spacer = css` - marginTop: 1em; - ` - -var groupA = css` - .antInputNumberInputs { - backgroundColor: #fff7db; - } - ` - -var groupB = css` - .antInputNumberInput { - backgroundColor: #eaf4ff; - } - ` - -var Styles = { - rows: rows, - parent: parent, - form: form, - dist: dist, - spacer: spacer, - groupA: groupA, - groupB: groupB -}; - interface Props { initialSquiggleString : string } @@ -95,8 +36,7 @@ let SquigglePlayground : FC = (props) => { let [squiggleString, setSquiggleString] = useState(props.initialSquiggleString) let [sampleCount, setSampleCount] = useState(1000) let [outputXYPoints, setOutputXYPoints] = useState(1000) - let [pointDistLength, setPointDistLength] = useState(undefined) - let [kernelWidth, setKernelWidth] = useState(undefined) + let [pointDistLength, setPointDistLength] = useState(1000) let [diagramStart, setDiagramStart] = useState(0) let [diagramStop, setDiagramStop] = useState(10) let [diagramCount, setDiagramCount] = useState(20) @@ -116,11 +56,11 @@ let SquigglePlayground : FC = (props) => {
- + - + = (props) => { label="Downsample To" /> - -