Merge branch 'craft-4' of https://github.com/verbb/vizy into craft-5

# Conflicts:
#	CHANGELOG.md
#	composer.json
#	src/web/assets/field/dist/assets/vizy-74cc0c71.js.map
#	src/web/assets/field/dist/assets/vizy-85275f53.js.map
#	src/web/assets/field/dist/assets/vizy-dae25c0e.js
#	src/web/assets/field/dist/assets/vizy-dae25c0e.js.gz
#	src/web/assets/field/dist/assets/vizy-dae25c0e.js.map
#	src/web/assets/field/dist/assets/vizy-dae25c0e.js.map.gz
#	src/web/assets/field/dist/manifest.json

CHANGELOG.md

@@ -41,6 +41,12 @@
 - Fix content changes being detected for nested fields when there are none. In addition, Vizy fields only listen for changes to their content when interacted with.
 - Fix field layout designer in settings not serializing changes correctly.
 
+## 2.1.22 - 2024-08-14
+
+### Fixed
+- Fix an issue with multiple Vizy editors with different formatting or table configs.
+- Fix buttons styles not working correctly.
+
 ## 2.1.21 - 2024-08-11
 
 ### Fixed

src/web/assets/field/dist/manifest.json

@@ -7,7 +7,11 @@
  "css": [
  "assets/vizy-e02a0e63.css"
  ],
+<<<<<<< HEAD
  "file": "assets/vizy-74cc0c71.js",
+=======
+ "file": "assets/vizy-dae25c0e.js",
+>>>>>>> 86b2235187ddd32a9bd1b583b463d7d8d7325ccf
  "isEntry": true,
  "src": "field/src/js/vizy.js"
  }

src/web/assets/field/src/js/components/input/MenuBar.vue

@@ -60,11 +60,11 @@ export default {
  if (button) {
  // Handle special-cases and sub-options. Maybe move to other components?
  if (button.name === 'formatting') {
- button.options = this.getEnabledOptions(button.options, this.getFormattingOptions());
+ button.enabledOptions = this.getEnabledOptions(button.options, this.getFormattingOptions());
  }
 
  if (button.name === 'table') {
- button.options = this.getEnabledOptions(button.options, this.getTableOptions());
+ button.enabledOptions = this.getEnabledOptions(button.options, this.getTableOptions());
  }
 
  buttons.push(button);

src/web/assets/field/src/js/components/input/MenuBarItem.vue

@@ -4,7 +4,7 @@
 
  <div v-if="hasDropdown()" class="vui-toolbar-dropdown-container" :class="'vui-toolbar-dropdown-' + name" style="display: none;">
  <div class="vui-toolbar-dropdown-wrap">
- <button v-for="(option, i) in options" :key="i" class="vui-toolbar-dropdown" :class="['vui-toolbar-dropdown-item-' + option.name, { 'active': optionActive(option) }]" @click.prevent="runAction(option.action)">
+ <button v-for="(option, i) in enabledOptions" :key="i" class="vui-toolbar-dropdown" :class="['vui-toolbar-dropdown-item-' + option.name, { 'active': optionActive(option) }]" @click.prevent="runAction(option.action)">
  {{ option.title }}
  </button>
  </div>
@@ -70,6 +70,11 @@ export default {
  type: Array,
  default: () => { return []; },
  },
+
+ enabledOptions: {
+ type: Array,
+ default: () => { return []; },
+ },
  },
 
  data() {