import marimo

__generated_with = "0.15.2"
app = marimo.App(width="medium")


@app.cell
def _():
    import marimo as mo
    import anywidget
    import traitlets
    return anywidget, mo, traitlets


@app.cell
def _(mo):
    mo.md(
        r"""
    # Marimo Copy Button

    Using [anywidget](https://anywidget.dev/).  
    Check out accompanying blog post on [LovelyData](https://www.lovelydata.cz/en/blog/marimo-copy-button/).
    """
    )
    return


@app.cell
def _(anywidget, traitlets):
    class CopyButton(anywidget.AnyWidget):
        value = traitlets.Any("").tag(sync=True)
        label = traitlets.Unicode("Copy to clipboard").tag(sync=True)
        _esm = """
        function render({ model, el }) {
            const button = document.createElement("button");
            const buttonText = model.get("label");
            button.innerText = buttonText;
            button.classList.add(
                "font-medium", "bg-primary", "text-primary-foreground",
                "hover:bg-primary/90", "shadow-xs", "border", 
                "border-primary", "h-7", "px-2", "rounded-md", "cursor-pointer")
            el.appendChild(button);

            // Add event listener to the button
            button.addEventListener("click", async () => {
                const valueToCopy = model.get('value');
                try {
                    await navigator.clipboard.writeText(valueToCopy);
                    button.innerText = 'Copied!';
                } catch (err) {
                    console.error('Failed to copy text:', err);
                    button.innerText = 'Error copying!';
                } finally {
                    setTimeout(() => {
                        button.innerText = buttonText;
                    }, 2000);
                }
            });
        }
        export default { render };
        """
    return (CopyButton,)


@app.cell
def _(mo):
    copy_area = mo.ui.text_area(label="**Write something smart...**")
    paste_area = mo.ui.text_area(label="**... and paste it here**")
    return copy_area, paste_area


@app.cell
def _(CopyButton, copy_area, mo, paste_area):
    mo.hstack(
        [
            mo.vstack([copy_area, CopyButton(value=copy_area.value, label="Copy to clipboard")]),
            paste_area
        ],
        widths="equal"
    )
    return


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