cells align

app/javascript/submission_form/area.vue

@@ -168,6 +168,7 @@
     <div
       v-else-if="field.type === 'cells'"
       class="w-full flex items-center"
+      :class="{ 'justify-end': field.preferences?.align === 'right' }"
     >
       <div
         v-for="(char, index) in modelValue"

app/javascript/template_builder/field_settings.vue

@@ -27,7 +27,7 @@
     </label>
   </div>
   <div
-    v-if="['number'].includes(field.type)"
+    v-if="['number', 'cells'].includes(field.type)"
     class="py-1.5 px-1 relative"
     @click.stop
   >
@@ -36,7 +36,7 @@
       @change="[field.preferences ||= {}, field.preferences.align = $event.target.value, save()]"
     >
       <option
-        v-for="value in ['left', 'right', 'center']"
+        v-for="value in ['left', 'right', field.type === 'cells' ? null : 'center'].filter(Boolean)"
         :key="value"
         :selected="field.preferences?.align ? value === field.preferences.align : value === 'left'"
         :value="value"

app/views/submissions/_value.html.erb

@@ -50,7 +50,7 @@
     <% 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">
+    <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>

lib/submissions/generate_result_attachments.rb

@@ -382,7 +382,10 @@ module Submissions
           when ->(type) { type == 'cells' && !area['cell_w'].to_f.zero? }
             cell_width = area['cell_w'] * width
 
-            TextUtils.maybe_rtl_reverse(value).chars.each_with_index do |char, index|
+            chars = TextUtils.maybe_rtl_reverse(value).chars
+            chars = chars.reverse if field.dig('preferences', 'align') == 'right'
+
+            chars.each_with_index do |char, index|
               next if char.blank?
 
               text = HexaPDF::Layout::TextFragment.create(char, font:,
@@ -409,9 +412,15 @@ module Submissions
                 line_height = layouter.fit([text], cell_width, height).lines.first.height
               end
 
+              x =
+                if field.dig('preferences', 'align') == 'right'
+                  ((area['x'] + area['w']) * width) - (cell_width * (index + 1))
+                else
+                  (area['x'] * width) + (cell_width * index)
+                end
+
               cell_layouter.fit([text], cell_width, [line_height, area['h'] * height].max)
-                           .draw(canvas, ((area['x'] * width) + (cell_width * index)),
-                                 height - (area['y'] * height))
+                           .draw(canvas, x, height - (area['y'] * height))
             end
           else
             if field['type'] == 'date'