# Precision Input Examples and Reference

### Default Precision Input

An example of a default precision input without any extra properties.

    using Dash
    using DashDaq

    external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]

    app = dash(external_stylesheets=external_stylesheets)

    app.layout =  html_div([
      daq_precisioninput(
          id="my-precision",
          label="Default",
          precision=4,
          value=1234
      ),
      html_div(id="precision-output")
    ])

    callback!(app,
      Output("precision-output", "children"),
      [Input("my-precision", "value")]) do value
      return "The current value is $value."
    end

    run_server(app, "0.0.0.0", debug=true)

Default
1
.
2
3
4
E
3
The current value is 1234.

### Label

Set the label and label position with `label` and `labelPosition`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_precisioninput(
      label="Label",
      labelPosition="top",
      precision=2,
      value=12
    )

    run_server(app, "0.0.0.0", debug=true)

Label
1
.
2
E
1

### Precision

The `precision` property is mandatory for this component. The `precision` property indicates the accuracy of the specified number.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_precisioninput(
        precision=2,
        value=125
    )

    run_server(app, "0.0.0.0", debug=true)

1
.
3
E
2

### Max and Min

Set the maximum and minimum value of the numeric input with `max` and `min`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_precisioninput(
      precision=2,
      value=15,
      max=20,
      min=10
    )

    run_server(app, "0.0.0.0", debug=true)

1
.
5
E
1

### Size

Set the length (in pixels) of the numeric input `size`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_precisioninput(
        size=120,
        precision=4,
        value=245
    )

    run_server(app, "0.0.0.0", debug=true)

2
.
4
5
E
2

### Disabled

Disable the precision input by setting `disabled=true`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_precisioninput(
      disabled=true,
      precision=4,
      value=9999
    )

    run_server(app, "0.0.0.0", debug=true)

9
.
9
9
9
E
3

## PrecisionInput Properties

> Our recommended IDE for writing Dash apps is Dash Enterprise's Data Science Workspaces, which has typeahead support for Dash Component Properties. Find out if your company is using Dash Enterprise.

`id` (String; optional): The ID used to identify this compnent in Dash callbacks.

`value` (Real; optional): The value of numeric input.

`size` (Real; optional): The size (length) of the numeric input in pixels.

`min` (Real; default `0`): The minimum value of the numeric input.

`max` (Real; default `Number.MAX_SAFE_INTEGER`): The maximum value of the numeric input.

`precision` (Real; default `2`): Number of significant figures.

`disabled` (Bool; optional): If true, numeric input cannot be changed.

`theme` (Dict; default `light`): Theme configuration to be set by a ThemeProvider.

`label` (Dict; optional): Description to be displayed alongside the scientific notation. To control styling, pass an object with label and style properties.

`label` is a String | Dict with keys:

- `label` (String; optional)

- `style` (Dict; optional)

`labelPosition` (a value equal to: 'top' or 'bottom'; default `'top'`): Where the numeric input label is positioned.

`className` (String; optional): Class to apply to the root component element.

`style` (Dict; optional): Style to apply to the root component element.

`persistence` (Bool | String | Real; optional): Used to allow user interactions in this component to be persisted when the component - or the page - is refreshed. If `persisted` is truthy and hasn't changed from its previous value, a `value` that the user has changed while using the app will keep that change, as long as the new `value` also matches what was given originally. Used in conjunction with `persistence_type`.

`persisted_props` (Array of values equal to: 'value'; default `['value']`): Properties whose user interactions will persist after refreshing the component or the page. Since only `value` is allowed this prop can normally be ignored.

`persistence_type` (a value equal to: 'local', 'session' or 'memory'; default `'local'`): Where persisted user changes will be stored: memory: only kept in memory, reset on page refresh. local: window.localStorage, data is kept after the browser quit. session: window.sessionStorage, data is cleared once the browser quit.