upgrade nova 4 version

composer.json

@@ -9,7 +9,7 @@
   ],
   "license": "MIT",
   "require": {
-    "php": ">=7.1.0"
+    "php": "^7.3|^8.0"
   },
   "autoload": {
     "psr-4": {

dist/js/field.js.LICENSE.txt

@@ -0,0 +1,8 @@
+/*!
+ * The buffer module from node.js, for the browser.
+ *
+ * @author   Feross Aboukhadijeh <http://feross.org>
+ * @license  MIT
+ */
+
+/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */

dist/mix-manifest.json

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

nova.mix.js

@@ -0,0 +1,33 @@
+const mix = require('laravel-mix')
+const webpack = require('webpack')
+const path = require('path')
+
+class NovaExtension {
+    name() {
+        return 'nova-extension'
+    }
+
+    register(name) {
+        this.name = name
+    }
+
+    webpackConfig(webpackConfig) {
+        webpackConfig.externals = {
+            vue: 'Vue',
+        }
+
+        webpackConfig.resolve.alias = {
+            ...(webpackConfig.resolve.alias || {}),
+            'laravel-nova': path.join(
+                __dirname,
+                '../../vendor/laravel/nova/resources/js/mixins/packages.js'
+            ),
+        }
+
+        webpackConfig.output = {
+            uniqueName: this.name,
+        }
+    }
+}
+
+mix.extend('nova', new NovaExtension())

package.json

@@ -2,20 +2,29 @@
   "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",
+    "development": "mix",
+    "watch": "mix watch",
+    "watch-poll": "mix watch -- --watch-options-poll=1000",
+    "hot": "mix watch --hot",
     "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"
+    "production": "mix --production",
+    "nova:install": "npm --prefix='../../vendor/laravel/nova' ci"
   },
   "devDependencies": {
-    "cross-env": "^5.0.0",
-    "laravel-mix": "^1.0",
-    "laravel-nova": "^1.0"
+    "@vue/compiler-sfc": "^3.2.22",
+    "form-backend-validation": "^2.3.3",
+    "laravel-mix": "^6.0.41",
+    "laravel-nova": "^1.12.3",
+    "lodash": "^4.17.21",
+    "postcss": "^8.3.11",
+    "resolve-url-loader": "^5.0.0",
+    "sass": "^1.32.8",
+    "sass-loader": "10.*",
+    "vue-loader": "^17.0.1"
   },
   "dependencies": {
-    "axios": "^0.18.0",
-    "vue": "^2.5.0"
+    "axios": "^0.27.2",
+    "cross-env": "^7.0.3",
+    "vue": "^3.2.45"
   }
 }

resources/js/components/IndexField.vue

@@ -2,8 +2,8 @@
   <a
     href
     @click.prevent="onClick"
-    class="cursor-pointer text-70 hover:text-primary no-underline flex items-center"
-  >
+    class="cursor-pointer text-70 hover:text-primary-500 no-underline flex items-center v-popper--has-tooltip" 
+    :title="toolTipTitle ? toolTipTitle : '' ">
     <svg
       xmlns="http://www.w3.org/2000/svg"
       viewBox="0 0 24 24"
@@ -26,6 +26,12 @@ import axios from "axios";
 export default {
   props: ["resourceName", "field"],
 
+  data () {
+    return {
+        toolTipTitle : null,
+    };
+  },
+
   methods: {
     onClick() {
       axios
@@ -50,6 +56,7 @@ export default {
   },
 
   mounted() {
+    this.toolTipTitle = this.field.toolTipTitle || null;
     let parentElement = this.$el.parentElement;
     parentElement.classList.add("td-fit");
     parentElement.style.paddingRight = "0px";

resources/js/field.js

@@ -1,3 +1,4 @@
-Nova.booting((Vue, router) => {
-    Vue.component('index-duplicate-field', require('./components/IndexField'));
+import IndexField from './components/IndexField.vue';
+Nova.booting((app, store) => {
+    app.component('index-duplicate-field', IndexField);
 })

src/DuplicateField.php

@@ -72,4 +72,9 @@ public function relationsOverride(array $override)
     {
         return $this->withMeta(['relations_override' => $override]);
     }
+
+    public function toolTipTitle($toolTipTitle)
+    {
+        return $this->withMeta(['toolTipTitle' => $toolTipTitle]);
+    }
 }

webpack.mix.js

@@ -1,3 +1,19 @@
-let mix = require("laravel-mix");
+let mix = require('laravel-mix')
+const path = require('path')
+require('./nova.mix')
 
-mix.setPublicPath("dist").js("resources/js/field.js", "js");
+mix
+    .setPublicPath('dist')
+    .js('resources/js/field.js', 'js')
+    .vue({ version: 3 })
+    .nova('jackabox/nova-duplicate-field')
+    .alias({
+        '@': 'vendor/laravel/nova/resources/js/',
+    })
+    .webpackConfig({
+        resolve: {
+            alias: {
+                'laravel-nova': path.resolve(__dirname, './node_modules/laravel-nova/dist/index.js'),
+            },
+        },
+    });