Docs›Componentes (Admin)›mad-attach-btn
Componentes (Admin)

mad-attach-btn

Botão compacto de anexo para toolbar.

Botao compacto de anexar arquivos (icone clip) com chips de preview. Ideal para toolbars de composer/reply de mensagens, comentarios, chats — onde nao se quer um dropzone grande. Reusa a mesma API de storage do <mad-multi-file-field>, entao form->save() persiste automaticamente.

Props

Prop Tipo Default Descricao
name string '' Nome do campo (obrigatorio)
accept string '*' MIME types ou extensoes: image/*,.pdf
multiple bool false Aceita varios arquivos (gera name[])
icon string 'paperclip' Icone Lucide do botao
max-files int 0 Maximo de arquivos (0 = ilimitado)
max-size int 0 Tamanho maximo por arquivo em KB (0 = ilimitado)
disabled bool false Desabilita o botao
storage string '' disk (filesystem) ou db (BLOB no banco)
folder string 'uploads' Diretorio destino (storage="disk")
mode string 'comma' comma (virgula) ou table (tabela relacionada)
model string '' Classe do model Eloquent (mode=table)
foreign-key string '' Coluna FK na tabela filha (mode=table)
path-column string '' Coluna do caminho/BLOB na tabela filha (mode=table)
name-column string '' Coluna do nome original (mode=table)
file-name string 'prefix' Modo do nome: prefix, unique, original, record
class string '' Classes CSS extras
attrs string '' Atributos HTML extras no input

Uso basico — anexo unico no disco

<mad-attach-btn name="anexo" storage="disk" folder="uploads/docs" />

Multiplos arquivos em toolbar de reply

<div class="mad-mail-reply-actions">
    <mad-btn type="submit" variant="primary" icon="send" size="sm">Enviar</mad-btn>
    <mad-attach-btn name="reply_anexos" multiple
        storage="disk" folder="uploads/messages" mode="table"
        model="SystemMessageAttachment" foreign-key="system_message_id"
        path-column="file_path" name-column="file_name"
        accept="*" :max-files="10" />
</div>

Modo virgula (caminhos numa unica coluna)

<mad-attach-btn name="anexos" multiple
    storage="disk" folder="uploads/comentarios" mode="comma"
    accept=".pdf,.doc,image/*" :max-files="5" />

$this->form->save($comentario);
// $comentario->anexos = 'uploads/comentarios/a.pdf,uploads/comentarios/b.jpg'

Restringir tipos e quantidade

<mad-attach-btn name="imagens" multiple
    accept="image/*" :max-files="3"
    storage="disk" folder="uploads/fotos" mode="comma" />

Icone customizado

<mad-attach-btn name="anexo" icon="image" accept="image/*"
    storage="disk" folder="uploads/imgs" />

Persistencia automatica via form->save()

O <mad-attach-btn> com storage se registra no MadFormRegistry como multi-file — exatamente como o <mad-multi-file-field>. Nao ha codigo extra no controller:

use Illuminate\Support\Facades\DB;

public function onSave(): MadResponse
{
    try {
        DB::connection('business')->transaction(function () {
            $msg = SystemMessage::findOrNew($this->registroId);
            $this->form->save($msg); // salva campos + anexos automaticamente
        });

        return (new MadResponse())
            ->toast('Enviado!', 'success')
            ->closeDrawer();
    } catch (\Throwable $e) {
        return MadMessage::error('Erro', $e->getMessage());
    }
}

Quando usar <mad-attach-btn> vs <mad-file-field> / <mad-multi-file-field>

Cenario Usar
Toolbar compacta (composer, reply, chat, comentario) <mad-attach-btn>
Botao discreto ao lado de Enviar/Salvar <mad-attach-btn>
Form principal com upload destacado, label e hint <mad-multi-file-field>
Dropzone grande com drag-and-drop visivel <mad-multi-file-field>
Upload unico com label e visualizacao de arquivo <mad-file-field>
Imagem com crop/camera <mad-image-field>

Resumindo: attach-btn e a versao "icone na toolbar". As outras tres sao campos de formulario com label e dropzone.

NUNCA fazer

{{-- ERRADO: input file nativo dentro de toolbar --}}
<button><i data-lucide="paperclip"></i></button>
<input type="file" name="anexo" multiple style="display:none">

{{-- CERTO --}}
<mad-attach-btn name="anexo" multiple storage="disk" folder="uploads" />

{{-- ERRADO: usar mad-multi-file-field grande dentro de uma toolbar de reply --}}
<div class="reply-actions">
    <mad-btn type="submit">Enviar</mad-btn>
    <mad-multi-file-field name="anexos" label="Anexos" storage="disk" folder="uploads" />
</div>

{{-- CERTO: attach-btn e compacto, cabe na toolbar --}}
<div class="reply-actions">
    <mad-btn type="submit">Enviar</mad-btn>
    <mad-attach-btn name="anexos" multiple storage="disk" folder="uploads" />
</div>

{{-- ERRADO: processar $_FILES manualmente --}}
move_uploaded_file($_FILES['anexo']['tmp_name'], $dest);

{{-- CERTO: declarar storage no Blade e deixar form->save() resolver --}}
<mad-attach-btn name="anexo" storage="disk" folder="uploads" />
$this->form->save($record);

{{-- ERRADO: esquecer storage — arquivo nao e persistido automaticamente --}}
<mad-attach-btn name="anexo" multiple />

{{-- CERTO --}}
<mad-attach-btn name="anexo" multiple storage="disk" folder="uploads" mode="comma" />

{{-- ERRADO: mode="table" sem model/foreign-key/path-column --}}
<mad-attach-btn name="anexos" multiple storage="disk" folder="uploads" mode="table" />

{{-- CERTO: modo tabela exige model + FK + colunas --}}
<mad-attach-btn name="anexos" multiple storage="disk" folder="uploads/msg" mode="table"
    model="SystemMessageAttachment" foreign-key="system_message_id"
    path-column="file_path" name-column="file_name" />