From e969bb71934c138021b6124da67819087a79e614 Mon Sep 17 00:00:00 2001
From: Abdelrahman Awad <me@awad.dev>
Date: Sun, 2 Mar 2025 11:28:00 +0200
Subject: [PATCH] fix: use true as contenteditable value on firefox

---
 .changeset/sharp-badgers-see.md                          | 5 +++++
 packages/core/src/useDateTimeField/useDateTimeSegment.ts | 5 ++++-
 packages/core/src/utils/platform.ts                      | 4 ++++
 3 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/sharp-badgers-see.md

diff --git a/.changeset/sharp-badgers-see.md b/.changeset/sharp-badgers-see.md
new file mode 100644
index 00000000..13e271dd
--- /dev/null
+++ b/.changeset/sharp-badgers-see.md
@@ -0,0 +1,5 @@
+---
+'@formwerk/core': patch
+---
+
+fix: use true as contenteditable value on firefox
diff --git a/packages/core/src/useDateTimeField/useDateTimeSegment.ts b/packages/core/src/useDateTimeField/useDateTimeSegment.ts
index 1e87f19e..85ec850b 100644
--- a/packages/core/src/useDateTimeField/useDateTimeSegment.ts
+++ b/packages/core/src/useDateTimeField/useDateTimeSegment.ts
@@ -7,6 +7,7 @@ import { blockEvent } from '../utils/events';
 import { DateTimeSegmentType } from './types';
 import { isEditableSegmentType } from './constants';
 import { createDisabledContext } from '../helpers/createDisabledContext';
+import { isFirefox } from '../utils/platform';
 
 export interface DateTimeSegmentProps {
   /**
@@ -178,10 +179,12 @@ export function useDateTimeSegment(_props: Reactivify<DateTimeSegmentProps>) {
   };
 
   const segmentProps = computed(() => {
+    const ceValue = isFirefox() ? 'true' : 'plaintext-only';
+
     const domProps: DateTimeSegmentDomProps = {
       id,
       tabindex: isNonEditable() ? -1 : 0,
-      contenteditable: isNonEditable() ? undefined : 'plaintext-only',
+      contenteditable: isNonEditable() ? undefined : ceValue,
       'aria-disabled': isDisabled.value,
       'data-segment-type': toValue(props.type),
       'aria-label': isNonEditable() ? undefined : toValue(props.type),
diff --git a/packages/core/src/utils/platform.ts b/packages/core/src/utils/platform.ts
index a7d7d8c8..bf6384a5 100644
--- a/packages/core/src/utils/platform.ts
+++ b/packages/core/src/utils/platform.ts
@@ -13,3 +13,7 @@ export function isMac() {
 
   return macRE.test(platform);
 }
+
+export function isFirefox() {
+  return /Firefox/i.test(navigator.userAgent);
+}