# Stop Button Examples and Reference

### Default Stop Button

An example of a default stop button 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_stopbutton(
          id="my-stop-button",
          label="Default",
          n_clicks=0
      ),
      html_div(id="stop-button-output")
    ])

    callback!(app,
      Output("stop-button-output", "children"),
      [Input("my-stop-button", "n_clicks")]) do n_clicks
      return "The stop button has been clicked $n_clicks times."
    end

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

Default
The stop button has been clicked 0 times.

### Label

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

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_stopbutton(
      label="Label",
      labelPosition="top"
    )

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

Label

### Size

Adjust the size (width in pixels) of the stop button with `size`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_stopbutton(
      size=120,
    )

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

### Button Text

Set the text displayed in the button `buttonText`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_stopbutton(
      buttonText="text",
    )

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

### Disabled

Disable the button by setting `disabled=true`.

    using Dash
    using DashDaq

    app = dash()

    app.layout = daq_stopbutton(
      disabled=true,
    )

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

## StopButton 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.

`children` (Array of or a singular dash component, String or Real; optional): The children of the button.

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

`size` (Real; default `92`): The size (width) of the stop button in pixels.

`buttonText` (String; default `'Stop'`): Text displayed in the button.

`n_clicks` (Real; default `0`): Number of times the button was clicked.

`disabled` (Bool; optional): If true, button cannot be pressesd.

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

`label` (Dict; optional): Description to be displayed alongside the button. 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 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.