Filament•2y ago•

3 replies

Hint Action - Copy value

I wanna add a hint action to a

Builder

Builder

field, which should copy the $state into the browser clipboard.

This is what I got so far:

->hintAction(Action::make('copyJson')
    ->label("Inhalt exportieren")
    ->icon('heroicon-m-clipboard')
    ->action(function (Get $get, $state) {
        dd(json_encode($state, JSON_PRETTY_PRINT));
    }),
),

->hintAction(Action::make('copyJson')
    ->label("Inhalt exportieren")
    ->icon('heroicon-m-clipboard')
    ->action(function (Get $get, $state) {
        dd(json_encode($state, JSON_PRETTY_PRINT));
    }),
),

This already show the button and on click it

dd

dd

's the json of the

Builder

Builder

field state. But how to copy the value to clipboard, instead of

dd

dd

ing? How can I call JS

  navigator.clipboard.writeText(copyText.value);

  navigator.clipboard.writeText(copyText.value);

?

Just to understand, what I wanna achieve: Later I will change it to

->hintAction(fn() => [
    Action::make('copyJson')
        ->label("Inhalt exportieren")
        ->icon('heroicon-m-clipboard')
        ->action(function (Get $get, $state) {
            ...
        }),
    Action::make('importJson')
        ->label("Inhalt importieren")
        ->icon('heroicon-m-arrow-down-on-square')
        ->form(fn($state) => [
            TextArea::make('copyJsonTextarea')
        ])
        ->action(function (Get $get, $state) {
            ...
        })
])

->hintAction(fn() => [
    Action::make('copyJson')
        ->label("Inhalt exportieren")
        ->icon('heroicon-m-clipboard')
        ->action(function (Get $get, $state) {
            ...
        }),
    Action::make('importJson')
        ->label("Inhalt importieren")
        ->icon('heroicon-m-arrow-down-on-square')
        ->form(fn($state) => [
            TextArea::make('copyJsonTextarea')
        ])
        ->action(function (Get $get, $state) {
            ...
        })
])

so that I can import/export the Builder value.

Solution

Try this plugin.
https://github.com/webbingbrasil/filament-copyactions

If you need a one off simple solution, you may take some inspiration from this trait from above package
https://github.com/webbingbrasil/filament-copyactions/blob/3.x/src%2FConcerns%2FHasCopyable.php

GitHub

GitHub - webbingbrasil/filament-copyactions: A easy-to-use copy act...

A easy-to-use copy actions for Filament Admin Pages, Tables and Form Fields. - webbingbrasil/filament-copyactions

GitHub

filament-copyactions/src/Concerns/HasCopyable.php at 3.x · webbingb...

A easy-to-use copy actions for Filament Admin Pages, Tables and Form Fields. - webbingbrasil/filament-copyactions

Jump to solution

Hint Action - Copy value

I wanna add a hint action to a

Builder

Builder

field, which should copy the $state into the browser clipboard.

This is what I got so far:

->hintAction(Action::make('copyJson')
    ->label("Inhalt exportieren")
    ->icon('heroicon-m-clipboard')
    ->action(function (Get $get, $state) {
        dd(json_encode($state, JSON_PRETTY_PRINT));
    }),
),

->hintAction(Action::make('copyJson')
    ->label("Inhalt exportieren")
    ->icon('heroicon-m-clipboard')
    ->action(function (Get $get, $state) {
        dd(json_encode($state, JSON_PRETTY_PRINT));
    }),
),

This already show the button and on click it

dd

dd

's the json of the

Builder

Builder

field state. But how to copy the value to clipboard, instead of

dd

dd

ing? How can I call JS

  navigator.clipboard.writeText(copyText.value);

  navigator.clipboard.writeText(copyText.value);

?

Just to understand, what I wanna achieve: Later I will change it to

->hintAction(fn() => [
    Action::make('copyJson')
        ->label("Inhalt exportieren")
        ->icon('heroicon-m-clipboard')
        ->action(function (Get $get, $state) {
            ...
        }),
    Action::make('importJson')
        ->label("Inhalt importieren")
        ->icon('heroicon-m-arrow-down-on-square')
        ->form(fn($state) => [
            TextArea::make('copyJsonTextarea')
        ])
        ->action(function (Get $get, $state) {
            ...
        })
])

->hintAction(fn() => [
    Action::make('copyJson')
        ->label("Inhalt exportieren")
        ->icon('heroicon-m-clipboard')
        ->action(function (Get $get, $state) {
            ...
        }),
    Action::make('importJson')
        ->label("Inhalt importieren")
        ->icon('heroicon-m-arrow-down-on-square')
        ->form(fn($state) => [
            TextArea::make('copyJsonTextarea')
        ])
        ->action(function (Get $get, $state) {
            ...
        })
])

so that I can import/export the Builder value.

Solution

GitHub

GitHub - webbingbrasil/filament-copyactions: A easy-to-use copy act...

A easy-to-use copy actions for Filament Admin Pages, Tables and Form Fields. - webbingbrasil/filament-copyactions

GitHub

filament-copyactions/src/Concerns/HasCopyable.php at 3.x · webbingb...

A easy-to-use copy actions for Filament Admin Pages, Tables and Form Fields. - webbingbrasil/filament-copyactions

Jump to solution

Hint Action - Copy value

Hint Action - Copy value

Similar Threads

Similar Threads

Similar Threads