@php
    if($params->translate ?? false)
        {
            # test transform to test_en
            $params->server_side_name =  $params->server_side_name . '_' . form_locale();
        }
         # test[0][title] transform to test.0.title
         $transformedName = preg_replace('/\[(.*)\]/mU', '.$1', $params->name);

@endphp
@props([
 'label' =>  isset($params->label) && str_starts_with($params->label,'cms.') ? trans($params->label,locale: form_locale()) : $params->label ?? '',
 'name' =>  $params->name ?? '',
 'multi'=>  $params->multi??1,
 'server_side_name' =>  $params->server_side_name ?? '',
 'value' =>  $params->value ?? old($transformedName) ?? '',
 'required' =>  isset($params->required) ? 'required' : '',
 'info' =>  isset($params->info) && str_starts_with($params->info,'cms.') ? trans($params->info,locale: form_locale()) : $params->info ?? false,
 'hasError' => $errors->has($transformedName) ? 'is-invalid' : '',
 'type' => $params->type ?? '',
  "id" => $params->id,
  "action" => $params->action,
    "remove" => $params->remove,
  "files" => isset($params->files) && $params->files ? [$params->files] : [],
  "path" => $params->path ?? "",
])
<div class="row fv-row mb-7">
    <div class="col-md-2 text-md-end">
        <!--begin::Label-->
        <label class="fs-6 fw-semibold form-label mt-3">
            <span class="{{$required}}">{{$label}}</span>
            @if($info)
                <i class="fas fa-exclamation-circle ms-1 fs-7" data-bs-toggle="tooltip" title="{{$info}}"></i>
            @endif
        </label>
        <!--end::Label-->
    </div>
    <!--end::Label-->
    <!--begin::Col-->
    <div class="col-md-10">
        <!--begin::Dropzone-->
        <div class="dropzone dropzone-queue mb-2 dropzone_single_upload" id="{{$id}}"
             data-action="{{$action}}"
             data-remove="{{$remove}}"
             data-name="{{$name}}"
             data-multi="{{$multi}}"
             data-server_side_name="{{$server_side_name}}"
        >
            @foreach($files as $file)
                <span class="preview-file"
                      data-original="{{$file->original_name}}"
                      data-hash="{{$file->file_name}}"
                      data-path="{{$path}}"
                      data-size="{{$file->size}}"
                      data-url="{{asset("storage/$path/$file->file_name")}}"
                      data-file_name="{{$file->file_name}}"
                ></span>
            @endforeach
            <!--begin::Controls-->
            <div class="dropzone-panel mb-lg-0 mb-2" >
                <a class="dropzone-select btn btn-sm btn-primary me-2" >Əlavə et</a >
                <a class="dropzone-upload btn btn-sm btn-light-primary me-2" >Yüklə</a >
                <a class="dropzone-remove-all btn btn-sm btn-light-primary" >Sil</a >
            </div >
            <!--end::Controls-->

            <!--begin::Items-->
            <div class="dropzone-items wm-200px d-flex gap-6 flex-wrap position-relative" >
                <div class="dropzone-item d-flex flex-column" style="display: none"  >

                    <!--begin::File-->
                    <div class="dropzone-file"  >
                        <div class="dropzone-filename d-flex flex-column "  >
                            {{--                            <span data-dz-name >some_image_file_name.jpg</span >--}}
                            <img data-dz-thumbnail />
                            <strong class="mt-1 ms-auto dz-size"><span data-dz-size>340kb</span></strong>
                        </div>
                        <div class="dropzone-error" data-dz-errormessage></div>
                    </div>
                    <!--end::File-->
                    <!--begin::Progress-->
                    <div class="dropzone-progress w-100">
                        <div class="progress">
                            <div
                                    class="progress-bar bg-primary"
                                    role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" data-dz-uploadprogress>
                            </div>
                        </div>
                    </div>
                    <!--end::Progress-->
                    <!--begin::Toolbar-->
                    <div class="dropzone-toolbar">
                        <span class="dropzone-start"><i class="bi bi-play-fill fs-2x text-white"></i></span>
                        <span class="dropzone-cancel" data-dz-remove style="display: none;"><i class="bi bi-x fs-3 "></i></span>
                    </div>
                    <span class="dropzone-delete" data-dz-remove>
                        <i class="ki-duotone ki-trash-square fs-1 text-danger">
                            <i class="path1"></i>
                            <i class="path2"></i>
                            <i class="path3"></i>
                            <i class="path4"></i>
                            <i class="path5"></i>
                        </i>
                    </span>
                    <!--end::Toolbar-->
                </div>
            </div>
            <!--end::Items-->
        </div>
        <!--end::Dropzone-->
        <!--begin::Hint-->
        {{--        <span class="form-text text-muted" >Yalnız bir fayl yükləmək mümkündür.</span >--}}
        <!--end::Hint-->
    </div >
    <!--end::Col-->
</div >