<div class="currency-field cfa-stack-sm">
  <label class="label block" for="form_component_preview_test_model_my_number">My Number</label>
  <p id="form_component_preview_test_model_my_number_help" class="help_text">
    pick a number
  </p>
  <div class="relative max-w-sm">
    <span class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-cfa-med font-bold text-text-body-secondary">
      $
    </span>
    <input class="w-full !pl-cfa-xl" inputmode="decimal" placeholder="0.00" x-data="" x-mask:dynamic="$money" x-init="$el.form?.addEventListener('formdata', (e) => { e.formData.set($el.name, $el.value.replace(/[^0-9.]/g, '')) }); $el.dispatchEvent(new Event('input'))" aria-required="true" aria-describedby="form_component_preview_test_model_my_number_help" min="0" type="text" name="form_component_preview_test_model[my_number]" id="form_component_preview_test_model_my_number" />
  </div>
</div>