{{--
=====================================================
Etebarit - by Gisoo Web Solutions
------------------------------------------------------
Gisoo.net
------------------------------------------------------
Copyright (c) 2026 Gisoo Web Solutions
=====================================================
This code is protected by copyright
=====================================================
File: copyable.blade.php
------------------------------------------------------
Use: A number an operator needs to paste elsewhere (card,
     IBAN, tracking code): always in ASCII digits, and one
     click puts it on the clipboard.
=====================================================
--}}

@props(['value', 'display' => null])

<button
    type="button"
    dir="ltr"
    {{ $attributes->class(['group inline-flex items-center gap-1.5 text-left font-bold transition hover:text-primary-600']) }}
    x-data="copyable(@js($value))"
    x-on:click.stop="copy()"
    title="{{ __('admin.actions.copy') }}"
>
    <span x-text="label">{{ $display ?? $value }}</span>

    <svg x-show="! copied" class="size-3.5 shrink-0 text-ink-faint transition group-hover:text-primary-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg>
    <svg x-show="copied" x-cloak class="size-3.5 shrink-0 text-green-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>
</button>