input.upload.php

<?php

$attributes = $Field->getFieldInputAttributes(array(
    'grid-margin' => $Field->getInputMargin(),
    'grid-width' => $Field->getInputWidth(),
    'class' => 'field-input field-input--' . $Field->type . ' input-frame with-button',
));
print '<span';
foreach ($attributes as $attributeName => $attributeValue) if ($attributeValue !== null) print ' ' . $attributeName . '="' . $attributeValue . '"';
print '>';

print $Field->v();

print '</span>';

$attributes = $Field->getButtonAttributes(array(
    'type' => 'button',
    'disabled' => $Field->disabled ? '' : null,
    'class' => 'button-1 button--upload',
    'id' => $Field->id('-button'),
    'tabindex' => '-1',
));
print '<button';
foreach ($attributes as $attributeName => $attributeValue) if ($attributeValue !== null) print ' ' . $attributeName . '="' . $attributeValue . '"';
print '><i class="las la-cloud-upload-alt"></i></button>';

$attributes = $Field->getInputAttributes(array(
    'grid-margin' => -$Field->getInputWidth(),
    'grid-width' => $Field->getInputWidth(),
    'type' => 'file',
    'placeholder' => strval($Field->placeholder) !== '' ? htmlspecialchars($Field->placeholder) : null,
    'required' => $Field->required ? '' : null,
    'readonly' => $Field->readonly ? '' : null,
    'disabled' => $Field->disabled ? '' : null,
    'class' => 'input--upload',
    'id' => $Field->id('-input'),
));
print '<input';
foreach ($attributes as $attributeName => $attributeValue) if ($attributeValue !== null) print ' ' . $attributeName . '="' . $attributeValue . '"';
print '>';

?>

<script>
cmsRequire(['form/script/input.upload'], init => init(document.getElementById(<?=$Field->jId('-input')?>)));
</script>