docuseal/app/views/submissions/_value.html.erb

<% align = field.dig('preferences', 'align') %>
<% valign = field.dig('preferences', 'valign') %>
<% color = field.dig('preferences', 'color') %>
<% font = field.dig('preferences', 'font') %>
<% font_type = field.dig('preferences', 'font_type') %>
<% font_size_px = (field.dig('preferences', 'font_size').presence || Submissions::GenerateResultAttachments::FONT_SIZE).to_i * local_assigns.fetch(:font_scale) { 1000.0 / PdfUtils::US_LETTER_W } %>
<field-value dir="auto" class="flex absolute <%= 'font-courier' if font == 'Courier' %> <%= 'font-times' if font == 'Times' %> <%= 'font-bold' if font_type == 'bold' || font_type == 'bold_italic' %> <%= 'italic' if font_type == 'italic' || font_type == 'bold_italic' %> <%= align == 'right' ? 'text-right' : (align == 'center' ? 'text-center' : '') %>" style="<%= "color: #{color}; " if color.present? %>width: <%= area['w'] * 100 %>%; height: <%= area['h'] * 100 %>%; left: <%= area['x'] * 100 %>%; top: <%= area['y'] * 100 %>%; font-size: <%= fs = "clamp(1pt, #{font_size_px / 10}vw, #{font_size_px}px)" %>; line-height: calc(<%= fs %> * 1.3); font-size: <%= fs = "#{font_size_px / 10}cqmin" %>; line-height: calc(<%= fs %> * 1.3)">
  <% if field['type'] == 'signature' %>
    <% is_narrow = area['h']&.positive? && (area['w'].to_f / area['h']) > 6 %>
    <div class="flex justify-between w-full h-full gap-1 <%= is_narrow && (local_assigns[:with_signature_id] || field.dig('preferences', 'reason_field_uuid').present?) ? 'flex-row' : 'flex-col' %>">
      <div class="flex overflow-hidden <%= is_narrow && (local_assigns[:with_signature_id] || field.dig('preferences', 'reason_field_uuid').present?) ? 'w-1/2' : 'flex-grow' %>" style="min-height: 50%">
        <img class="object-contain mx-auto" src="<%= attachments_index[value].url %>">
      </div>
      <% if (local_assigns[:with_signature_id] || field.dig('preferences', 'reason_field_uuid').present?) && attachment = attachments_index[value] %>
        <div class="text-[1vw] lg:text-[0.55rem] lg:leading-[0.65rem] <%= is_narrow ? 'w-1/2' : 'w-full' %>">
          <div class="truncate uppercase">
            ID: <%= attachment.uuid %>
          </div>
          <% if local_assigns[:with_signature_id_reason] != false %>
            <div>
              <% reason_value = submitter.values[field.dig('preferences', 'reason_field_uuid')].presence %>
              <% if reason_value %><%= t('reason') %>: <% end %><%= reason_value || t('digitally_signed_by') %> <%= submitter.name %>
              <% if submitter.email %>
                &lt;<%= submitter.email %>&gt;
              <% end %>
            </div>
          <% end %>
          <div>
            <% timezone = local_assigns[:with_submitter_timezone] ? (submitter.timezone || local_assigns[:timezone]) : local_assigns[:timezone] %>
            <%= l(attachment.created_at.in_time_zone(timezone), format: :long, locale: local_assigns[:locale]) %> <%= TimeUtils.timezone_abbr(timezone, attachment.created_at) %>
          </div>
        </div>
      <% end %>
    </div>
  <% elsif field['type'].in?(['image', 'initials', 'stamp']) && attachments_index[value].image? %>
    <img class="object-contain mx-auto" src="<%= attachments_index[value].url %>" loading="lazy">
  <% elsif field['type'].in?(['file', 'payment', 'image']) %>
    <autosize-field></autosize-field>
    <div class="px-0.5 flex flex-col justify-center">
      <% Array.wrap(value).each do |val| %>
        <a target="_blank" href="<%= attachments_index[val].url %>">
          <%= svg_icon('paperclip', class: 'inline w-[1.6vw] h-[1.6vw] lg:w-4 lg:h-4') %>
          <%= attachments_index[val].filename %>
        </a>
      <% end %>
    </div>
  <% elsif field['type'] == 'checkbox' %>
    <div class="w-full flex items-center justify-center">
      <%= svg_icon('check', class: "aspect-square #{area['w'] > area['h'] ? '!w-auto !h-full' : '!w-full !h-auto'}") %>
    </div>
  <% elsif field['type'].in?(%w[multiple radio]) && area['option_uuid'] %>
    <% option = field['options']&.find { |o| o['uuid'] == area['option_uuid'] } %>
    <% option_name = option['value'].presence || "Option #{field['options'].index(option) + 1}" %>
    <% if option && Array.wrap(value).include?(option_name) %>
      <div class="w-full flex items-center justify-center">
        <%= svg_icon('check', class: "aspect-square #{area['w'] > area['h'] ? '!w-auto !h-full' : '!w-full !h-auto'}") %>
      </div>
    <% end %>
  <% elsif field['type'] == 'cells' && area['cell_w'].to_f > 0.0 %>
    <% cell_width = area['cell_w'] / area['w'] * 100 %>
    <div class="w-full flex items-center <%= 'justify-end' if align == 'right' %>">
      <% (0..(area['w'] / area['cell_w']).ceil).each do |index| %>
        <% if value[index] %>
          <div class="text-center flex-none" style="width: <%= cell_width %>%;"><%= value[index] %></div>
        <% end %>
      <% end %>
    </div>
  <% elsif field['type'] == 'date' %>
    <autosize-field></autosize-field>
    <div class="flex w-full px-0.5 <%= valign == 'top' ? 'items-start' : (valign == 'bottom' ? 'items-end' : 'items-center') %>">
      <% value = Time.current.in_time_zone(local_assigns[:timezone]).to_date.to_s if value == '{{date}}' %>
      <div class="w-full"><%= TimeUtils.format_date_string(value, field.dig('preferences', 'format'), local_assigns[:locale]) %></div>
    </div>
  <% elsif field['type'] == 'number' %>
    <autosize-field></autosize-field>
    <div class="flex w-full px-0.5 whitespace-nowrap <%= valign == 'top' ? 'items-start' : (valign == 'bottom' ? 'items-end' : 'items-center') %>">
      <div class="w-full"><%= NumberUtils.format_number(value, field.dig('preferences', 'format')) %></div>
    </div>
  <% else %>
    <autosize-field></autosize-field>
    <div class="flex w-full px-0.5 whitespace-pre-wrap <%= valign == 'top' ? 'items-start' : (valign == 'bottom' ? 'items-end' : 'items-center') %>">
      <div class="w-full"><%= Array.wrap(value).join(', ') %></div>
    </div>
  <% end %>
</field-value>