From 145ce804d5b8ab22bfbb125bd963c99cae15d870 Mon Sep 17 00:00:00 2001
From: Marty Friedel <1491079+martyf@users.noreply.github.com>
Date: Tue, 11 Jul 2023 13:47:58 +1000
Subject: [PATCH 1/2] Change from dot syntax to named-key access

---
 src/Forms/JsDrivers/Alpine.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Forms/JsDrivers/Alpine.php b/src/Forms/JsDrivers/Alpine.php
index ddec16e4f09..57e52343896 100644
--- a/src/Forms/JsDrivers/Alpine.php
+++ b/src/Forms/JsDrivers/Alpine.php
@@ -85,7 +85,7 @@ protected function renderAlpineXData($xData, $alpineScope)
     protected function getAlpineXDataKey($fieldHandle, $alpineScope)
     {
         return is_string($alpineScope)
-            ? "{$alpineScope}.{$fieldHandle}"
+            ? "{$alpineScope}['{$fieldHandle}']"
             : $fieldHandle;
     }
 

From 2cdad140450fb9867392bdc7311f015b49e7e5f1 Mon Sep 17 00:00:00 2001
From: Marty Friedel <1491079+martyf@users.noreply.github.com>
Date: Tue, 11 Jul 2023 14:34:27 +1000
Subject: [PATCH 2/2] Update tests for named-access for scoped data

---
 tests/Tags/Form/FormCreateAlpineTest.php | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/tests/Tags/Form/FormCreateAlpineTest.php b/tests/Tags/Form/FormCreateAlpineTest.php
index e8e568059d4..2a0d6db5248 100644
--- a/tests/Tags/Form/FormCreateAlpineTest.php
+++ b/tests/Tags/Form/FormCreateAlpineTest.php
@@ -293,7 +293,7 @@ public function it_dynamically_renders_text_field_x_model()
         ];
 
         $this->assertFieldRendersHtml(['<input type="text" name="name" value="" x-model="name">'], $config, [], ['js' => 'alpine']);
-        $this->assertFieldRendersHtml(['<input type="text" name="name" value="" x-model="my_form.name">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="text" name="name" value="" x-model="my_form[\'name\']">'], $config, [], ['js' => 'alpine:my_form']);
     }
 
     /** @test */
@@ -307,7 +307,7 @@ public function it_dynamically_renders_textarea_field_x_model()
         ];
 
         $this->assertFieldRendersHtml(['<textarea name="comment" rows="5" x-model="comment"></textarea>'], $config, [], ['js' => 'alpine']);
-        $this->assertFieldRendersHtml(['<textarea name="comment" rows="5" x-model="my_form.comment"></textarea>'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<textarea name="comment" rows="5" x-model="my_form[\'comment\']"></textarea>'], $config, [], ['js' => 'alpine:my_form']);
     }
 
     /** @test */
@@ -329,9 +329,9 @@ public function it_dynamically_renders_checkboxes_field_x_model()
         $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="rat" x-model="fav_animals">'], $config, [], ['js' => 'alpine']);
         $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="armadillo" x-model="fav_animals">'], $config, [], ['js' => 'alpine']);
 
-        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="cat" x-model="my_form.fav_animals">'], $config, [], ['js' => 'alpine:my_form']);
-        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="rat" x-model="my_form.fav_animals">'], $config, [], ['js' => 'alpine:my_form']);
-        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="armadillo" x-model="my_form.fav_animals">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="cat" x-model="my_form[\'fav_animals\']">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="rat" x-model="my_form[\'fav_animals\']">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="checkbox" name="fav_animals[]" value="armadillo" x-model="my_form[\'fav_animals\']">'], $config, [], ['js' => 'alpine:my_form']);
     }
 
     /** @test */
@@ -353,9 +353,9 @@ public function it_dynamically_renders_radio_field_x_model()
         $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="rat" x-model="fav_animal">'], $config, [], ['js' => 'alpine']);
         $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="armadillo" x-model="fav_animal">'], $config, [], ['js' => 'alpine']);
 
-        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="cat" x-model="my_form.fav_animal">'], $config, [], ['js' => 'alpine:my_form']);
-        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="rat" x-model="my_form.fav_animal">'], $config, [], ['js' => 'alpine:my_form']);
-        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="armadillo" x-model="my_form.fav_animal">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="cat" x-model="my_form[\'fav_animal\']">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="rat" x-model="my_form[\'fav_animal\']">'], $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml(['<input type="radio" name="fav_animal" value="armadillo" x-model="my_form[\'fav_animal\']">'], $config, [], ['js' => 'alpine:my_form']);
     }
 
     /** @test */
@@ -385,7 +385,7 @@ public function it_dynamically_renders_select_field_x_model()
         $this->assertFieldRendersHtml($expected, $config, [], ['js' => 'alpine']);
 
         $expectedScoped = [
-            '<select name="favourite_animal" x-model="my_form.favourite_animal">',
+            '<select name="favourite_animal" x-model="my_form[\'favourite_animal\']">',
             '<option value>Please select...</option>',
             '<option value="cat">Cat</option>',
             '<option value="armadillo">Armadillo</option>',
@@ -409,7 +409,7 @@ public function it_dynamically_renders_asset_field_x_model()
         ];
 
         $this->assertFieldRendersHtml('<input type="file" name="cat_selfie" x-model="cat_selfie">', $config, [], ['js' => 'alpine']);
-        $this->assertFieldRendersHtml('<input type="file" name="cat_selfie" x-model="my_form.cat_selfie">', $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml('<input type="file" name="cat_selfie" x-model="my_form[\'cat_selfie\']">', $config, [], ['js' => 'alpine:my_form']);
     }
 
     /** @test */
@@ -423,7 +423,7 @@ public function it_dynamically_renders_field_with_fallback_to_default_partial_x_
         ];
 
         $this->assertFieldRendersHtml('<input type="text" name="custom" value="" x-model="custom">', $config, [], ['js' => 'alpine']);
-        $this->assertFieldRendersHtml('<input type="text" name="custom" value="" x-model="my_form.custom">', $config, [], ['js' => 'alpine:my_form']);
+        $this->assertFieldRendersHtml('<input type="text" name="custom" value="" x-model="my_form[\'custom\']">', $config, [], ['js' => 'alpine:my_form']);
     }
 
     private function jsonEncode($data)