F
Filament•2y ago
Abi

TextInput field copyable using hintAction

How can I make the TextInput copyable using a hintAction?
9 Replies
Abi
AbiOP•2y ago
So far I have the following 
TextInput::make('uuid')
 ->disabled()
 ->hintAction(fn(Get $get) => Action::make('Copy')->icon('heroicon-s-clipboard'))
TextInput::make('uuid')
 ->disabled()
 ->hintAction(fn(Get $get) => Action::make('Copy')->icon('heroicon-s-clipboard'))
Patrick Boivin
Patrick Boivin•2y ago
Mark Chaney
Mark Chaney•2y ago
@.abishek did you end up getting this working? I have a similar need. havent jumped into it yet. Figured i would see if anyone else had solved it first
Abi
AbiOP•2y ago
Not yet, had to move to other priorities, wasn't super critical, so just added to backlog. Let me know if you get this working
Flo
Flo•2y ago
TextInput::make($name)
            ->extraAttributes(function ($state) {
                return [
                    'x-on:click' => 'window.navigator.clipboard.writeText("'.$state.'"); $tooltip("Copied to clipboard", { timeout: 1500 });',
                ];
            })
            ->suffixAction(
                Action::make('copy')
                    ->icon('heroicon-m-clipboard')
            );
TextInput::make($name)
            ->extraAttributes(function ($state) {
                return [
                    'x-on:click' => 'window.navigator.clipboard.writeText("'.$state.'"); $tooltip("Copied to clipboard", { timeout: 1500 });',
                ];
            })
            ->suffixAction(
                Action::make('copy')
                    ->icon('heroicon-m-clipboard')
            );
` Not ideal since a server call is made and the tooltip displays over the entire input, but it's a good start and it works!
Abi
AbiOP•2y ago
@Flo this doesn't work. the quotes get escaped and cause an alpine/js error
Flo
Flo•2y ago
Does your "$state" contain quotes?
Abi
AbiOP•2y ago
its a string @Flo finally figured out a simpler way to do this
Abi
AbiOP•2y ago
https://twitter.com/shakeofabiomen/status/1706261501617606914
Abishek R Srikaanth (@shakeofabiomen)
If you ever wanted to implement copy to clipboard functionality as an action on your @filament forms, here is a simple way to do it. #laravel #php #filament #Tips
From Abishek R Srikaanth (@shakeofabiomen)
Twitter

Did you find this page helpful?