Custom Bard buttons can be added conditionally

resources/js/components/fieldtypes/bard/BardButtonsSettingFieldtype.vue

@@ -58,7 +58,28 @@ export default {
     methods: {
 
         initButtons() {
-            let available = addButtonHtml(availableButtons());
+            // Get all default buttons first
+            let available = availableButtons();
+
+            // Add custom buttons from a project or addon
+            this.$bard.buttonCallbacks.map(callback => {
+                // Since the developer uses the same callback to add buttons to the field itself, and for the
+                // button configurator, we need to make the button conditional when on the Bard fieldtype,
+                // but not here. Here we want to just show them all, so the user is able to toggle it.
+                const buttonFn = (button) => button;
+
+                let returned = callback(available, buttonFn);
+
+                // No return value means they intend to manipulate the
+                // buttons object manually. Just continue on.
+                if (!returned) return;
+
+                available = available.concat(
+                    Array.isArray(returned) ? returned : [returned]
+                );
+            })
+
+            available = addButtonHtml(available);
 
             let buttons = available.map(button => {
                 button.enabled = this.data.includes(button.name);

resources/js/components/fieldtypes/bard/BardFieldtype.vue

@@ -396,23 +396,31 @@ export default {
 
             // Get the configured buttons and swap them with corresponding objects
             let buttons = selectedButtons.map(button => {
-                return _.findWhere(availableButtons(), { name: button.toLowerCase() })
-                    || button;
+                return _.findWhere(availableButtons(), { name: button.toLowerCase() }) || button;
             });
 
             // Let addons add, remove, or control the position of buttons.
             this.$bard.buttonCallbacks.forEach(callback => {
-                let returned = callback(buttons);
+                // Since the developer uses the same callback to add buttons to the field itself, and for the
+                // button configurator, we need to make the button conditional when on the Bard fieldtype
+                // but not in the button configurator. So here we'll filter it out if it's not selected.
+                const buttonFn = (button) => selectedButtons.includes(button.name) ? button : null;
 
-                // No return value means they intend to manipulate the
-                // buttons object manually. Just continue on.
-                if (! returned) return;
+                const addedButtons = callback(buttons, buttonFn);
+
+                // No return value means either they literally returned nothing, with the intention
+                // of manipulating the buttons object manually. Or, they used the button() and
+                // the button was not configured in the field so it was stripped out.
+                if (! addedButtons) return;
 
                 buttons = buttons.concat(
-                    Array.isArray(returned) ? returned : [returned]
+                    Array.isArray(addedButtons) ? addedButtons : [addedButtons]
                 );
             });
 
+            // Remove any nulls. This could happen if a developer-added button was not specified in this field's buttons array.
+            buttons = buttons.filter(button => !!button);
+
             // Remove any non-objects. This would happen if you configure a button name that doesn't exist.
             buttons = buttons.filter(button => typeof button != 'string');