@@ -28,8 +28,8 @@ import Yoga.Block.Container.Style (colour)
2828import Yoga.Compiler.Types (Compiler)
2929import Yoga.Editor (getValue, mkEditor, setValue)
3030
31−type Props
32− = { initialCode ∷ String, height ∷ String, language ∷ String }
31+type Props =
32+ { initialCode ∷ String, height ∷ String, language ∷ String }
3333
3434mkCompileEditor ∷ ∀ r. { | Compiler r } -> Effect (ReactComponent Props)
3535mkCompileEditor { compileAndRun } = do
@@ -47,26 +47,19 @@ mkCompileEditor { compileAndRun } = do
4747 compileResult /\ modifyCompileResult <- useState Nothing
4848 let
4949 showEditor = updateActiveIndex 0
50−
5150 showResult = updateActiveIndex 1
52−
5351 reset = resetCompileResult *> showEditor
54−
5552 run = compile *> showResult
56−
5753 resetCompileResult = do
5854 setCompileResult Nothing
5955 for_ maybeEditor (setValue initialCode)
60−
6156 compileResultToString ∷ Maybe (Either Error (Either CompileResult RunResult)) -> String
6257 compileResultToString = case _ of
6358 Nothing -> ""
6459 Just (Right (Left cr)) -> cr.result <#> _.message # intercalate "/n"
6560 Just (Right (Right r)) -> r.stdout
6661 Just (Left e) -> message e
67−
6862 setCompileResult = modifyCompileResult <<< const
69−
7063 compile = do
7164 for_ maybeEditor \ed -> do
7265 setCompileResult Nothing
@@ -74,66 +67,57 @@ mkCompileEditor { compileAndRun } = do
7467 launchAff_ do
7568 res <- try $ compileAndRun { code }
7669 setCompileResult (Just res) # liftEffect
77−
7870 tabs ∷ JSX
7971 tabs =
8072 Block.segmented
8173 </> { activeIndex
8274 , updateActiveIndex
8375 , buttonContents:
84− twoOrMore
85− { id: "editor", value: "Editor" }
86− { id: "Result", value: "Result" }
87− []
76+ twoOrMore
77+ { id: "editor", value: "Editor" }
78+ { id: "Result", value: "Result" }
79+ []
8880 }
89−
9081 editorView ∷ JSX
9182 editorView = editor </> { onLoad, height, language }
92−
9383 buttons ∷ Array JSX -> JSX
9484 buttons = Y.el Block.cluster { justify: "flex-end", space: "var(--s-1)" }
95−
9685 button =
9786 Y.el motionButton
9887 <<< M.motion
9988 { transition: M.transition $ { duration: 0.2 }
10089 }
101−
10290 resetButton ∷ JSX
10391 resetButton =
10492 button
10593 { buttonType: BT.Generic, onClick: handler_ reset }
10694 [ R.text "Reset" ]
107−
10895 runButton ∷ JSX
10996 runButton =
11097 button
11198 { buttonType: BT.Primary, onClick: handler_ run }
11299 [ R.text "Run" ]
113−
114100 buttonControls ∷ Array JSX -> JSX
115101 buttonControls = Y.el motionBox $ M.motion { layout: M.layout true } {}
116−
117102 tabContainer ∷ Array JSX -> JSX
118103 tabContainer children =
119104 Y.styled R.div'
120105 { className: "tabby"
121106 , css:
122− E.css
123− { background: E.str colour.backgroundLayer4
124− , borderTop: E.str $ "1px solid " <> colour.interfaceBackgroundHighlight
125− , borderRadius: E.str "14px 14px 0 0"
126− , paddingLeft: E.var "--s-1"
127− , paddingRight: E.var "--s-1"
128− , paddingTop: E.str "0"
129− , paddingBottom: E.str "0"
130− , marginBottom: E.str "0"
131− , zIndex: E.str "0"
132− }
107+ E.css
108+ { background: E.str colour.backgroundLayer3
109+ , borderTop: E.str $ "1px solid " <> colour.interfaceBackgroundHighlight
110+ , borderRadius: E.str "14px 14px 0 0"
111+ , paddingLeft: E.var "--s-1"
112+ , paddingRight: E.var "--s-1"
113+ , paddingTop: E.str "0"
114+ , paddingBottom: E.str "0"
115+ , marginBottom: E.str "0"
116+ , zIndex: E.str "0"
117+ }
133118 }
134119 [ Y.el Block.centre { andText: true } children
135120 ]
136−
137121 terminal ∷ Array JSX -> JSX
138122 terminal =
139123 Y.el motionBox1
@@ -141,30 +125,26 @@ mkCompileEditor { compileAndRun } = do
141125 { layout: M.layout true
142126 }
143127 { css:
144− E.css
145− { background: E.str "rgb(42,42,59)"
146− , boxSizing: E.str "content-box"
147− , margin: E.str "0"
148− , minHeight: E.str "8em"
149− , padding: E.str "0"
150− , display: E.str "flex"
151− }
128+ E.css
129+ { background: E.str "rgb(42,42,59)"
130+ , boxSizing: E.str "content-box"
131+ , margin: E.str "0"
132+ , minHeight: E.str "8em"
133+ , padding: E.str "0"
134+ , display: E.str "flex"
135+ }
152136 }
153−
154137 container =
155138 Y.el motionBox1
156139 $ M.motion { layout: M.layout true }
157140 { css:
158− E.css
159− { background: E.str colour.backgroundLayer4
160− , borderBottom: E.str $ "1px solid " <> colour.interfaceBackgroundShadow
161− , borderRadius: E.str "0 0 14px 14px"
162− , paddingLeft: E.str "0"
163− , paddingRight: E.str "0"
164− , paddingTop: E.str "0"
165− , paddingBottom: E.var "--s-1"
166− , zIndex: E.str "0"
167− }
141+ E.css
142+ { background: E.str colour.backgroundLayer3
143+ , borderBottom: E.str $ "1px solid " <> colour.interfaceBackgroundShadow
144+ , borderRadius: E.str "0 0 14px 14px"
145+ , padding: E.str "0"
146+ , zIndex: E.str "0"
147+ }
168148 }
169149 pure
170150 $ Y.el Block.stack { space: E.str "0" }