fix issue with relatable fields in nova 3.21+

dist/js/field.js.LICENSE.txt

@@ -0,0 +1,15 @@
+/*!
+ * Determine if an object is a Buffer
+ *
+ * @author   Feross Aboukhadijeh <https://feross.org>
+ * @license  MIT
+ */
+
+/**
+ * @license
+ * Lodash <https://lodash.com/>
+ * Copyright OpenJS Foundation and other contributors <https://openjsf.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */

dist/mix-manifest.json

@@ -1,3 +1,3 @@
 {
     "/js/field.js": "/js/field.js"
-}
+}

package.json

@@ -1,21 +1,22 @@
 {
     "private": true,
     "scripts": {
-        "dev": "npm run development",
-        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
-        "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
-        "watch-poll": "npm run watch -- --watch-poll",
-        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
-        "prod": "npm run production",
-        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
+        "development": "mix",
+        "watch": "mix watch",
+        "watch-poll": "mix watch -- --watch-options-poll=1000",
+        "hot": "mix watch --hot",
+        "production": "mix --production"
     },
     "devDependencies": {
-        "cross-env": "^5.0.0",
-        "laravel-mix": "^1.0",
-        "laravel-nova": "^1.0",
-        "logipar": "^0.4.0"
+        "cross-env": "^7.0.3",
+        "laravel-mix": "^6.0.11",
+        "laravel-nova": "^1.9.0",
+        "logipar": "^0.4.0",
+        "postcss": "^8.2.6",
+        "vue-loader": "^15.9.6",
+        "vue-template-compiler": "^2.6.12"
     },
     "dependencies": {
-        "vue": "^2.5.0"
+        "vue": "^2.6.12"
     }
 }

resources/js/components/FormField.vue

@@ -18,6 +18,7 @@
                 :via-resource="viaResource"
                 :via-resource-id="viaResourceId"
                 :via-relationship="viaRelationship"
+                :show-help-text="childField.helpText != null"
             />
 
         </div>

resources/js/field.js

@@ -1,3 +1,5 @@
+import FormField from './components/FormField'
+
 Nova.booting((Vue, router, store) => {
-    Vue.component('form-conditional-container', require('./components/FormField'))
+    Vue.component('form-conditional-container', FormField)
 })

src/HasConditionalContainer.php

@@ -25,6 +25,11 @@
 trait HasConditionalContainer
 {
 
+    public function hasRelatableField(NovaRequest $request, $attribute)
+    {
+        return $this->availableFields($request)->whereInstanceOf(RelatableField::class);
+    }
+
     /**
      * Get the panels that are available for the given detail request.
      *

webpack.mix.js

@@ -1,4 +1,3 @@
 const mix = require('laravel-mix')
 
-mix.setPublicPath('dist')
-    .js('resources/js/field.js', 'js')
+mix.setPublicPath('dist').vue().js('resources/js/field.js', 'js')