💄 Replace Laravel Mix with Bud

assets/css/field.scss → assets/field.css

@@ -25,9 +25,7 @@
         }
 
         svg {
-          position: absolute;
-          top: 2px;
-          left: 2px;
+          @apply absolute top-[2px] left-[2px];
         }
       }
     }

bud.config.ts

@@ -0,0 +1,9 @@
+import type { Bud } from '@roots/bud'
+
+export default async (bud: Bud) => {
+  bud
+    .setPath('@src', 'assets')
+    .setPath('@dist', 'public')
+    .entry(['field.js', 'field.css'])
+    .hash()
+}

composer.json

@@ -14,7 +14,7 @@
     "php": ">=7.2"
   },
   "require-dev": {
-    "squizlabs/php_codesniffer": "^3.5"
+    "squizlabs/php_codesniffer": "^3.10"
   },
   "autoload": {
     "psr-4": {

package.json

@@ -2,19 +2,15 @@
   "name": "acf-editor-palette",
   "private": true,
   "scripts": {
-    "build": "npx mix",
-    "build:production": "npx mix --production",
-    "start": "npx mix watch"
-  },
-  "devDependencies": {
-    "autoprefixer": "^10.3.3",
-    "laravel-mix": "^6.0.28",
-    "postcss": "^8.3.6",
-    "sass": "^1.38.2",
-    "sass-loader": "^12.1.0",
-    "tailwindcss": "^2.2.9"
+    "build": "bud build"
   },
   "dependencies": {
     "tinycolor2": "^1.4.2"
+  },
+  "devDependencies": {
+    "@roots/bud": "^6.21.0",
+    "@roots/bud-postcss": "^6.21.0",
+    "@roots/bud-tailwindcss": "^6.21.0",
+    "tailwindcss": "^3.4.4"
   }
 }

plugin.php

@@ -4,7 +4,7 @@
  * Plugin Name: Advanced Custom Fields: Editor Palette Field
  * Plugin URI:  https://github.com/log1x/acf-editor-palette
  * Description: A Gutenberg-like editor palette color picker field for Advanced Custom Fields.
- * Version:     1.1.7
+ * Version:     1.1.8
  * Author:      Brandon Nifong
  * Author URI:  https://github.com/log1x
  */
@@ -13,7 +13,7 @@
 
 add_filter('after_setup_theme', new class
 {
-   /**
+    /**
      * The field label.
      *
      * @var string

public/entrypoints.json

@@ -0,0 +1,11 @@
+{
+  "field": {
+    "js": [
+      "js/runtime.b89547.js",
+      "js/field.563bb8.js"
+    ],
+    "css": [
+      "css/field.d1c65e.css"
+    ]
+  }
+}

public/manifest.json

@@ -0,0 +1,6 @@
+{
+  "field.css": "css/field.d1c65e.css",
+  "field.js": "js/field.563bb8.js",
+  "runtime.js": "js/runtime.b89547.js",
+  "entrypoints.json": "entrypoints.json"
+}

src/Concerns/Asset.php

@@ -5,19 +5,53 @@
 trait Asset
 {
     /**
-     * Resolve an asset URI from Laravel Mix's manifest.
-     *
-     * @param  string $asset
-     * @return string
+     * The manifest.
      */
-    public function asset($asset = null)
+    public array $manifest = [];
+
+    /**
+     * Retrieve the URI of an asset.
+     */
+    public function asset(?string $asset = null): string
+    {
+        $asset = $this->manifest($asset);
+
+        return $this->uri . $asset;
+    }
+
+    /**
+     * Retrieve the content of an asset.
+     */
+    public function inlineAsset(string $asset): ?string
     {
-        if (! file_exists($manifest = $this->path . 'mix-manifest.json')) {
-            return $this->uri . $asset;
+        $path = $this->path . $this->manifest($asset);
+
+        if (! file_exists($path)) {
+            return null;
+        }
+
+        return file_get_contents($path);
+    }
+
+    /**
+     * Retrieve the manifest.
+     */
+    public function manifest(?string $asset = null): array|string
+    {
+        if ($this->manifest) {
+            return $asset
+                ? $this->manifest[$asset]
+                : $this->manifest;
+        }
+
+        if (! file_exists($manifest = $this->path . 'manifest.json')) {
+            return [];
         }
 
-        $manifest = json_decode(file_get_contents($manifest), true);
+        $this->manifest = json_decode(file_get_contents($manifest), true);
 
-        return $this->uri . ($manifest[$asset] ?? $asset);
+        return $asset
+            ? $this->manifest[$asset]
+            : $this->manifest;
     }
 }

src/Concerns/Palette.php

@@ -7,7 +7,7 @@ trait Palette
     /**
      * Retrieve the editor color palette.
      *
-     * @param  string $color
+     * @param  string  $color
      * @return string[]
      */
     public function palette($color = null)
@@ -40,11 +40,11 @@ public function palette($color = null)
                 $value['slug'] => array_merge($value, [
                     'text' => sprintf('has-text-color has-%s-color', $value['slug']),
                     'background' => sprintf('has-background has-%s-background-color', $value['slug']),
-                ])
+                ]),
             ]);
         }
 
-        return ! empty($color) ? (
+        return ! empty($color) && is_string($color) ? (
             $colors[$color] ?? null
         ) : $colors;
     }