From db3366409f9a00f1ac19cb3c6d8db40e81ebd3cb Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Wed, 12 Nov 2025 16:14:36 -0500
Subject: [PATCH 1/2] wip

---
 resources/js/components/ui/Publish/Container.vue |  2 ++
 resources/js/components/ui/Publish/Field.vue     | 15 +++++++++------
 src/Http/View/Composers/JavascriptComposer.php   |  1 +
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/resources/js/components/ui/Publish/Container.vue b/resources/js/components/ui/Publish/Container.vue
index 1bb02fa2507..c8e5fbd3c68 100644
--- a/resources/js/components/ui/Publish/Container.vue
+++ b/resources/js/components/ui/Publish/Container.vue
@@ -80,6 +80,7 @@ const meta = ref(props.meta);
 const previews = ref({});
 const localizedFields = ref(props.modifiedFields || []);
 const components = ref([]);
+const direction = computed(() => Statamic.$config.get('sites').find(s => s.handle === props.site)?.direction || 'ltr');
 
 const visibleValues = computed(() => {
     const omittable = Object.keys(hiddenFields.value).filter(
@@ -221,6 +222,7 @@ const provided = {
     localizedFields,
     meta,
     site: toRef(() => props.site),
+    direction,
     errors: toRef(() => props.errors),
     readOnly: toRef(() => props.readOnly),
     previews,
diff --git a/resources/js/components/ui/Publish/Field.vue b/resources/js/components/ui/Publish/Field.vue
index 61ab39719ef..be3d6680bdc 100644
--- a/resources/js/components/ui/Publish/Field.vue
+++ b/resources/js/components/ui/Publish/Field.vue
@@ -43,6 +43,7 @@ const {
     hiddenFields,
     setHiddenField,
     container,
+    direction,
 } = injectContainerContext();
 const {
     fieldPathPrefix: injectedFieldPathPrefix,
@@ -242,12 +243,14 @@ const fieldtypeComponentEvents = computed(() => ({
             <div class="text-xs text-red-600" v-if="!fieldtypeComponentExists">
                 Component <code v-text="fieldtypeComponent"></code> does not exist.
             </div>
-            <Component
-                ref="fieldtype"
-                :is="fieldtypeComponent"
-                v-bind="fieldtypeComponentProps"
-                v-on="fieldtypeComponentEvents"
-            />
+            <div :dir="direction">
+                <Component
+                    ref="fieldtype"
+                    :is="fieldtypeComponent"
+                    v-bind="fieldtypeComponentProps"
+                    v-on="fieldtypeComponentEvents"
+                />
+            </div>
         </Field>
     </slot>
 </template>
diff --git a/src/Http/View/Composers/JavascriptComposer.php b/src/Http/View/Composers/JavascriptComposer.php
index 97affd4e7a9..72bda1dcf5b 100644
--- a/src/Http/View/Composers/JavascriptComposer.php
+++ b/src/Http/View/Composers/JavascriptComposer.php
@@ -89,6 +89,7 @@ protected function sites()
                 'name' => $site->name(),
                 'handle' => $site->handle(),
                 'lang' => $site->lang(),
+                'direction' => $site->direction(),
             ];
         })->values();
     }

From 1cc6d1b88c087b88ea9c213f237cadd3fcd6c380 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Wed, 12 Nov 2025 16:30:51 -0500
Subject: [PATCH 2/2] fall back to whats in the html

---
 resources/js/components/ui/Publish/Container.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/ui/Publish/Container.vue b/resources/js/components/ui/Publish/Container.vue
index c8e5fbd3c68..73539aa422e 100644
--- a/resources/js/components/ui/Publish/Container.vue
+++ b/resources/js/components/ui/Publish/Container.vue
@@ -80,7 +80,7 @@ const meta = ref(props.meta);
 const previews = ref({});
 const localizedFields = ref(props.modifiedFields || []);
 const components = ref([]);
-const direction = computed(() => Statamic.$config.get('sites').find(s => s.handle === props.site)?.direction || 'ltr');
+const direction = computed(() => Statamic.$config.get('sites').find(s => s.handle === props.site)?.direction ?? document.documentElement.dir ?? 'ltr');
 
 const visibleValues = computed(() => {
     const omittable = Object.keys(hiddenFields.value).filter(