From fde75d4bc3e52b1fa720fe4f75239b41044016a7 Mon Sep 17 00:00:00 2001
From: Quinn Dougherty <quinnd@riseup.net>
Date: Thu, 28 Apr 2022 17:54:43 -0400
Subject: [PATCH] No antd and everything compiles

Value: [1e-3 to 3e-2]
---
 packages/components/package.json              |  3 +--
 .../src/components/SquigglePlayground.tsx     | 26 ++++++++++++++-----
 yarn.lock                                     |  2 +-
 3 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/packages/components/package.json b/packages/components/package.json
index 218747b9..4a71a150 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -3,9 +3,8 @@
   "version": "0.2.13",
   "license": "MIT",
   "dependencies": {
-    "antd": "^4.20.1",
     "react-ace": "10.1.0",
-    "@quri/squiggle-lang": "^0.2.6",
+    "@quri/squiggle-lang": "^0.2.7",
     "react-dom": "^18.1.0",
     "vega": "^5.22.1",
     "vega-embed": "^6.20.6",
diff --git a/packages/components/src/components/SquigglePlayground.tsx b/packages/components/src/components/SquigglePlayground.tsx
index 93e8e9c6..30833ae7 100644
--- a/packages/components/src/components/SquigglePlayground.tsx
+++ b/packages/components/src/components/SquigglePlayground.tsx
@@ -1,11 +1,11 @@
 import _ from "lodash";
-import React, { FC, useState } from "react";
+import React, { FC, ReactElement, useState } from "react";
 import ReactDOM from "react-dom";
 import { SquiggleChart } from "./SquiggleChart";
 import CodeEditor from "./CodeEditor";
-import { Form, Input, Row, Col } from "antd";
+// import { Form, Input, Row, Col } from "antd";
 import styled from "styled-components";
-import "antd/dist/antd.css";
+// import "antd/dist/antd.css";
 
 interface FieldFloatProps {
   label: string;
@@ -14,10 +14,19 @@ interface FieldFloatProps {
   onChange: (value: number) => void;
 }
 
+const Input = styled.input``
+
+const FormItem = (props: {label:string, children:ReactElement}) => (
+  <div>
+    <label>{props.label}</label>
+    {props.children}
+    </div>
+)
+
 function FieldFloat(Props: FieldFloatProps) {
   let [contents, setContents] = useState(Props.value + "");
   return (
-    <Form.Item label={Props.label}>
+    <FormItem label={Props.label}>
       <Input
         value={contents}
         className={Props.className ? Props.className : ""}
@@ -29,7 +38,7 @@ function FieldFloat(Props: FieldFloatProps) {
           }
         }}
       />
-    </Form.Item>
+    </FormItem>
   );
 }
 
@@ -65,6 +74,9 @@ const Display = styled.div<TitleProps>`
   max-height: ${(props) => props.maxHeight}px;
 `;
 
+const Row = styled.div``
+const Col = styled.div``
+
 let SquigglePlayground: FC<Props> = ({
   initialSquiggleString = "",
   height = 300,
@@ -79,7 +91,7 @@ let SquigglePlayground: FC<Props> = ({
   return (
     <ShowBox height={height}>
       <Row>
-        <Col span={12}>
+        <Col>
           <CodeEditor
             value={squiggleString}
             onChange={setSquiggleString}
@@ -88,7 +100,7 @@ let SquigglePlayground: FC<Props> = ({
             height={height - 3}
           />
         </Col>
-        <Col span={12}>
+        <Col>
           <Display maxHeight={height - 3}>
             <SquiggleChart
               squiggleString={squiggleString}
diff --git a/yarn.lock b/yarn.lock
index cbd03955..bf2d7be9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5005,7 +5005,7 @@ ansi-to-html@^0.6.11:
   dependencies:
     entities "^2.0.0"
 
-antd@^4.20.0, antd@^4.20.1:
+antd@^4.20.0:
   version "4.20.1"
   resolved "https://registry.yarnpkg.com/antd/-/antd-4.20.1.tgz#6cd5a406c7172d61a5d0693ea52ee908650cf674"
   integrity sha512-asKxOV0a6AijqonbcXkO08/q+XvqS/HmGfaRIS6ZH1ALR3FS2q+kTW52rJZO9rfoOb/ldPhEBVSWiNrbiB+uCQ==