quantified.uncertainty/squiggle
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Hides inputs

Browse Source
This commit is contained in:
Roman Galochkin 2020-02-27 10:43:37 +03:00
parent 1af461a7d3
commit de882523bb
2 changed files with 99 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
src/components/DistBuilder.re
View File

@ -66,7 +66,7 @@ module FieldNumber = {
module FieldFloat = { module FieldFloat = {
[@react.component] [@react.component]
let make = (~field, ~label) => { let make = (~field, ~label, ~className=Css.style([])) => {
<Form.Field <Form.Field
field field
render={({handleChange, error, value, validate}) => render={({handleChange, error, value, validate}) =>
@ -78,6 +78,7 @@ module FieldFloat = {
(); ();
}} }}
onBlur={_ => validate()} onBlur={_ => validate()}
className
/> />
</Antd.Form.Item> </Antd.Form.Item>
} }
@ -110,6 +111,20 @@ module Styles = {
let form = style([backgroundColor(hex("eee")), padding(em(1.))]); let form = style([backgroundColor(hex("eee")), padding(em(1.))]);
let dist = style([padding(em(1.))]); let dist = style([padding(em(1.))]);
let spacer = style([marginTop(em(1.))]); let spacer = style([marginTop(em(1.))]);
let groupA =
style([
selector(
".ant-input-number-input",
[backgroundColor(hex("fff7db"))],
),
]);
let groupB =
style([
selector(
".ant-input-number-input",
[backgroundColor(hex("eaf4ff"))],
),
]);
}; };
module DemoDist = { module DemoDist = {
@ -150,7 +165,7 @@ let make = () => {
~onSubmit=({state}) => {None}, ~onSubmit=({state}) => {None},
~initialState={ ~initialState={
guesstimatorString: "mm(5 to 20, floor(normal(20,2)), [.5, .5])", guesstimatorString: "mm(5 to 20, floor(normal(20,2)), [.5, .5])",
domainType: "Complete", domainType: "LeftLimited",
xPoint: 50.0, xPoint: 50.0,
xPoint2: 60.0, xPoint2: 60.0,
excludingProbabilityMass2: 0.5, excludingProbabilityMass2: 0.5,
@ -296,31 +311,57 @@ let make = () => {
} }
/> />
</Col> </Col>
<Col span=4> {<>
<FieldFloat field=FormConfig.XPoint label="X-point" /> <Col span=4>
</Col> <FieldFloat
<Col span=4> field=FormConfig.XPoint
<FieldFloat label="X-point"
field=FormConfig.ExcludingProbabilityMass className=Styles.groupA
label="Excluding Probability Mass" />
/> </Col>
</Col> <Col span=4>
<Col span=4> <FieldFloat
<FieldFloat field=FormConfig.XPoint2 label="X-point (2)" /> field=FormConfig.ExcludingProbabilityMass
</Col> label="Excluding Probability Mass"
<Col span=4> className=Styles.groupA
<FieldFloat />
field=FormConfig.ExcludingProbabilityMass2 </Col>
label="Excluding Probability Mass (2)" </>
/> |> E.showIf(
</Col> E.L.contains(
reform.state.values.domainType,
["LeftLimited", "RightLimited", "LeftAndRightLimited"],
),
)}
{<>
<Col span=4>
<FieldFloat
field=FormConfig.XPoint2
label="X-point (2)"
className=Styles.groupB
/>
</Col>
<Col span=4>
<FieldFloat
field=FormConfig.ExcludingProbabilityMass2
label="Excluding Probability Mass (2)"
className=Styles.groupB
/>
</Col>
</>
|> E.showIf(
E.L.contains(
reform.state.values.domainType,
["LeftAndRightLimited"],
),
)}
</Row> </Row>
<Row _type=`flex className=Styles.rows> <Row _type=`flex className=Styles.rows>
<Col span=4> <Col span=4>
<Form.Field <Form.Field
field=FormConfig.UnitType field=FormConfig.UnitType
render={({handleChange, value}) => render={({handleChange, value}) =>
<Antd.Form.Item label={"Zero Type" |> E.ste}> <Antd.Form.Item label={"Unit Type" |> E.ste}>
<Antd.Select value onChange={e => e |> handleChange}> <Antd.Select value onChange={e => e |> handleChange}>
<Antd.Select.Option value="UnspecifiedDistribution"> <Antd.Select.Option value="UnspecifiedDistribution">
{"Unspecified Distribution" |> E.ste} {"Unspecified Distribution" |> E.ste}
@ -337,7 +378,7 @@ let make = () => {
<Form.Field <Form.Field
field=FormConfig.Zero field=FormConfig.Zero
render={({handleChange, value}) => render={({handleChange, value}) =>
<Antd.Form.Item label={"Zero" |> E.ste}> <Antd.Form.Item label={"Zero Point" |> E.ste}>
<Antd_DatePicker <Antd_DatePicker
value value
onChange={e => { onChange={e => {
@ -350,9 +391,41 @@ let make = () => {
/> />
</Col> </Col>
<Col span=4> <Col span=4>
<FieldFloat <Form.Field
field=FormConfig.ExcludingProbabilityMass field=FormConfig.Unit
label="Excluding Probability Mass" render={({handleChange, value}) =>
<Antd.Form.Item label={"Unit" |> E.ste}>
<Antd.Select value onChange={e => e |> handleChange}>
<Antd.Select.Option value="days">
{"Days" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="hours">
{"Hours" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="milliseconds">
{"Milliseconds" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="minutes">
{"Minutes" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="months">
{"Months" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="quarters">
{"Quarters" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="seconds">
{"Seconds" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="weeks">
{"Weeks" |> E.ste}
</Antd.Select.Option>
<Antd.Select.Option value="years">
{"Years" |> E.ste}
</Antd.Select.Option>
</Antd.Select>
</Antd.Form.Item>
}
/> />
</Col> </Col>
</Row> </Row>

1
src/utility/E.re
View File

@ -299,3 +299,4 @@ module JsArray = {
}; };
let ste = React.string; let ste = React.string;
let showIf = (cond, comp) => cond ? comp : ReasonReact.null;