fix(nc-gui): disable currency field if its readonly and checkbox field tab focus issue

packages/nc-gui/components/cell/Checkbox.vue

@@ -90,6 +90,7 @@ useSelectedCellKeyupListener(active, (e) => {
       'w-full justify-center': !isForm && !isGallery && !isExpandedFormOpen,
       'nc-cell-hover-show': !vModel && !readOnly,
       'opacity-0': readOnly && !vModel,
+      'pointer-events-none': readOnly,
     }"
     :style="{
       height:
@@ -98,6 +99,7 @@ useSelectedCellKeyupListener(active, (e) => {
     tabindex="0"
     @click="onClick(false, $event)"
     @keydown.enter.stop="onClick(true, $event)"
+    :tabindex="readOnly ? -1 : 0"
   >
     <div
       class="flex items-center"

packages/nc-gui/components/cell/Currency.vue

@@ -10,6 +10,7 @@ import {
   inject,
   parseProp,
   useVModel,
+  ReadonlyInj,
 } from '#imports'
 
 interface Props {
@@ -28,6 +29,8 @@ const editEnabled = inject(EditModeInj)!
 
 const isEditColumn = inject(EditColumnInj, ref(false))
 
+const readOnly = inject(ReadonlyInj, ref(false))
+
 const _vModel = useVModel(props, 'modelValue', emit)
 
 const vModel = computed({
@@ -87,7 +90,7 @@ onMounted(() => {
 
 <template>
   <input
-    v-if="editEnabled"
+    v-if="!readOnly && editEnabled"
     :ref="focus"
     v-model="vModel"
     type="number"
@@ -105,10 +108,12 @@ onMounted(() => {
     @contextmenu.stop
   />
 
-  <span v-else-if="vModel === null && showNull" class="nc-null uppercase">{{ $t('general.null') }}</span>
+  <span v-else-if="vModel === null && showNull" class="nc-null uppercase" :class="isExpandedFormOpen ? 'px-2' : 'px-0'">{{
+    $t('general.null')
+  }}</span>
 
   <!-- only show the numeric value as previously string value was accepted -->
-  <span v-else-if="!isNaN(vModel)">{{ currency }}</span>
+  <span v-else-if="!isNaN(vModel)" :class="isExpandedFormOpen ? 'px-2' : 'px-0'">{{ currency }}</span>
 
   <!-- possibly unexpected string / null with showNull == false  -->
   <span v-else />