diff --git a/packages/nc-gui/components/cell/Email.vue b/packages/nc-gui/components/cell/Email.vue
index d4a4976574..b6b4b82bed 100644
--- a/packages/nc-gui/components/cell/Email.vue
+++ b/packages/nc-gui/components/cell/Email.vue
@@ -100,6 +100,7 @@ watch(
class="py-1 text-sm underline hover:opacity-75 inline-block"
:href="`mailto:${vModel}`"
target="_blank"
+ :tabindex="readOnly ? -1 : 0"
>
diff --git a/packages/nc-gui/components/cell/PhoneNumber.vue b/packages/nc-gui/components/cell/PhoneNumber.vue
index 5778524f82..0290cb6068 100644
--- a/packages/nc-gui/components/cell/PhoneNumber.vue
+++ b/packages/nc-gui/components/cell/PhoneNumber.vue
@@ -90,6 +90,7 @@ watch(
:href="`tel:${vModel}`"
target="_blank"
rel="noopener noreferrer"
+ :tabindex="readOnly ? -1 : 0"
>
diff --git a/packages/nc-gui/components/cell/Rating.vue b/packages/nc-gui/components/cell/Rating.vue
index bff031b272..d044d3214f 100644
--- a/packages/nc-gui/components/cell/Rating.vue
+++ b/packages/nc-gui/components/cell/Rating.vue
@@ -76,6 +76,7 @@ watch(rateDomRef, () => {
v-model:value="vModel"
:disabled="readOnly"
:count="ratingMeta.max"
+ :class="readOnly ? 'pointer-events-none' : ''"
:style="`color: ${ratingMeta.color}; padding: ${isExpandedFormOpen ? '0px 8px' : '0px 5px'};`"
@keydown="onKeyPress"
>
diff --git a/packages/nc-gui/components/cell/RichText.vue b/packages/nc-gui/components/cell/RichText.vue
index d5680bbf68..fa4be15456 100644
--- a/packages/nc-gui/components/cell/RichText.vue
+++ b/packages/nc-gui/components/cell/RichText.vue
@@ -8,7 +8,7 @@ import { generateJSON } from '@tiptap/html'
import Underline from '@tiptap/extension-underline'
import { TaskItem } from '@/helpers/dbTiptapExtensions/task-item'
import { Link } from '@/helpers/dbTiptapExtensions/links'
-import { IsExpandedFormOpenInj, RowHeightInj } from '#imports'
+import { IsExpandedFormOpenInj, RowHeightInj, ReadonlyInj } from '#imports'
const props = defineProps<{
value?: string | null
@@ -24,6 +24,8 @@ const isExpandedFormOpen = inject(IsExpandedFormOpenInj, ref(false))!
const rowHeight = inject(RowHeightInj, ref(1 as const))
+const readOnlyCell = inject(ReadonlyInj, ref(false))
+
const turndownService = new TurndownService({})
turndownService.addRule('lineBreak', {
@@ -174,7 +176,7 @@ watch(editorDom, () => {
'nc-rich-text-embed flex flex-col pl-1 w-full': !fullMode,
'readonly': readOnly,
}"
- tabindex="0"
+ :tabindex="readOnlyCell ? -1 : 0"
>
{
@@ -133,6 +134,7 @@ watch(
class="py-1 z-3 w-full h-full text-center !no-underline hover:opacity-75"
:to="url"
:target="cellUrlOptions?.behavior === 'replace' ? undefined : '_blank'"
+ :tabindex="readOnly ? -1 : 0"
>