Py.Cafe

dash.mantine.components/

dash-copybutton-target_id-prop

CopyButton demo - copy text from another component

DocsPricing
  • app.py
  • requirements.txt
app.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
from dash import  Dash, Output, Input
import dash_mantine_components as dmc
from dash_iconify import DashIconify
import secrets

app = Dash()

app.layout = dmc.MantineProvider(
    dmc.Container([
        dmc.Title("CopyButton Demo", order=3, mb="md"),
        dmc.Button("Generate Key", id="generate-btn"),
        dmc.Group([
            dmc.Text(id="key-display"),
            dmc.CopyButton(
                target_id="key-display",
                children=DashIconify(icon="fa-regular:copy"),
                copiedChildren=DashIconify(icon="fa-regular:check-circle"),
                color="gray",
                copiedColor="teal",
                variant="outline",
                size="compact-md"
            ),
        ], mt="lg")
    ])
)


@app.callback(
    Output("key-display", "children"),
    Input("generate-btn", "n_clicks"),
)
def generate_key(_):
    return secrets.token_urlsafe(16)


if __name__ == "__main__":
    app.run(debug=True)