@heartlandone/vega 2.82.0 → 2.84.0

package/dist/collection/components/vega-rich-text-editor/extensions/languages/language-toolbar-button-renderer.js

@@ -2,30 +2,41 @@ import { methodPlaceholder } from 'vega-slimmer/core';
 import { VegaRTEToolbarButtonRenderer } from '../base-toolbar-button-renderer';
 /**
  * Toolbar button renderer for language selection in Vega Rich Text Editor.
+ *
+ * Each {@link HTMLVegaRichTextEditorElement} that uses a language extension receives its
+ * **own** instance of this renderer, registered in the per-host map inside
+ * {@link RTEDTORendererManager} via {@link VegaRTEExtension#prepareBeforeLoad}.  Because
+ * every editor has a dedicated renderer, all state (label DOM ref, selected language, and
+ * the language-change callback) is held in plain instance fields — no WeakMaps or shared
+ * singletons are required.
  */
 export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRenderer {
-  constructor(languageList, languageChangeCallback, selectedLanguage) {
+  constructor(languageList, languageChangeCallback, selectedLanguage = '') {
     super();
     this.languageList = [];
-    this.selectedLanguage = 'Select Language';
+    this.languageChangeCallback = null;
+    this.selectedLanguage = '';
     this.labelRef = null;
     /**
      * Handles the language selection event.
+     * Because each editor has its own renderer instance, the language-change callback
+     * is stored directly on this instance — no indirect context lookup is needed.
      *
      * @param {string} itemKey - The key of the selected language item.
      */
     this.handleDropdownClick = (itemKey) => {
       this.setSelectedLanguage(itemKey);
       if (typeof this.languageChangeCallback === 'function') {
-        this.languageChangeCallback(this.selectedLanguage);
+        this.languageChangeCallback(itemKey);
       }
     };
     this.languageList = languageList;
-    this.selectedLanguage = selectedLanguage;
     this.languageChangeCallback = languageChangeCallback;
+    this.selectedLanguage = selectedLanguage;
   }
   /**
-   * Public method to set the selected language.
+   * Updates the selected language and refreshes the button label text in-place,
+   * without requiring a full re-render of the toolbar.
    *
    * @param {string} language The language key to set as selected.
    */
@@ -55,7 +66,8 @@ export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRender
     ]);
   }
   /**
-   * Override to render the button label with custom behavior.
+   * Override to capture the rendered label element ref so that
+   * {@link setSelectedLanguage} can update the button text without a full re-render.
    *
    * @inheritDoc
    */
@@ -65,7 +77,9 @@ export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRender
       variant: 'font-field-label-sm',
       color: isDisabled ? 'text-disabled' : 'text-primary',
       // eslint-disable-next-line jsdoc/require-jsdoc
-      ref: (el) => (this.labelRef = el),
+      ref: (el) => {
+        this.labelRef = el;
+      },
     }, label);
   }
   /* istanbul ignore next */
@@ -84,7 +98,8 @@ export class RTELanguageToolbarButtonRenderer extends VegaRTEToolbarButtonRender
    * @returns {string} The label of the language, or the key if not found.
    */
   getLanguageLabelByKey(key) {
+    var _a;
     const language = this.getListItemByKey(this.languageList, key);
-    return language.label;
+    return (_a = language === null || language === void 0 ? void 0 : language.label) !== null && _a !== void 0 ? _a : 'Select Language';
   }
 }

package/dist/collection/components/vega-rich-text-editor/extensions/table/table-extension.js

@@ -129,10 +129,10 @@ export class VegaRTETableExtension extends VegaRTEExtension {
    *
    * @param {RTEExtensionContext} context - extension context
    */
-  initialExtension(context) {
+  initialExtensionAfterLoad(context) {
     this.tableSelection.init(context);
     const tableExtensionContext = Object.assign(Object.assign({}, context), { tableSelection: this.tableSelection });
-    super.initialExtension(tableExtensionContext);
+    super.initialExtensionAfterLoad(tableExtensionContext);
   }
   /**
    * @inheritDoc

package/dist/collection/components/vega-rich-text-editor/slimmers/controllers/extension-controller.js

@@ -46,6 +46,19 @@ export class RTEExtensionController extends VegaSlimmer {
       return this.selectionController.getSelectedNodes();
     };
   }
+  /**
+   * Prepares all registered extensions before the first render.
+   * This method is called during `componentWillLoad` so that extensions can perform
+   * host-specific setup (e.g. registering per-host toolbar button renderers) before
+   * Stencil renders the component for the first time.
+   */
+  prepareExtensionsBeforeLoad() {
+    if (this.extensions && this.host) {
+      for (const extension of this.extensions) {
+        extension.prepareBeforeLoad(this.host);
+      }
+    }
+  }
   /**
    * Initializes the extension context for all registered extensions.
    * This method is called when the component is connected and whenever the extensions property changes.
@@ -54,7 +67,7 @@ export class RTEExtensionController extends VegaSlimmer {
     if (this.extensions && this.host) {
       const extensionContext = this.generateExtensionContext();
       for (const extension of this.extensions) {
-        extension.initialExtension(extensionContext);
+        extension.initialExtensionAfterLoad(extensionContext);
       }
     }
   }
@@ -81,6 +94,7 @@ export class RTEExtensionController extends VegaSlimmer {
       }
     }
     if (!isArrayEqual(newValue, oldValue, false, (a, b) => a === b ? 0 : 1)) {
+      this.prepareExtensionsBeforeLoad();
       this.initialExtensionContext();
     }
   }
@@ -115,6 +129,9 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], RTEExtensionController.prototype, "selectionController", void 0);
+__decorate([
+  MapToComponentMethod('componentWillLoad')
+], RTEExtensionController.prototype, "prepareExtensionsBeforeLoad", null);
 __decorate([
   MapToComponentMethod('componentDidLoad')
 ], RTEExtensionController.prototype, "initialExtensionContext", null);

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/toolbar-renderer.js

@@ -70,7 +70,7 @@ export class ToolbarRenderer extends VegaSlimmer {
       const groupElement = group
         .map((item) => {
         const presetRenderer = this.getToolbarBtnRenderer(item);
-        const customRenderer = RTEDTORendererManager.getRTEToolbarButtonRenderer(item);
+        const customRenderer = RTEDTORendererManager.getRTEToolbarButtonRenderer(item, this.host);
         if (presetRenderer) {
           if (!presetRenderer.isHidden()) {
             totalVisibleCount++;

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/tools/image-toolbar-button-slimmer.js

@@ -14,7 +14,6 @@ import { VisualModeToolbarButtonSlimmer } from './visual-mode-toolbar-button-sli
 import { ModifyContentActionType } from '../../../dto/actions/modify-content-action.abstract';
 import { DomNodeSubjectObserverFactory } from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
 import { VegaClick, VegaDropdownClick } from '../../../../../helpers/event-manager/event-id/vega-event-id';
-import { tryGetDocument } from '../../../../../utils/try-get-document';
 export class ImageToolbarButtonSlimmer extends VisualModeToolbarButtonSlimmer {
   constructor() {
     super({
@@ -27,7 +26,6 @@ export class ImageToolbarButtonSlimmer extends VisualModeToolbarButtonSlimmer {
       await this.insertURLModalRef.modal('hide');
     };
     this.handleDropdownItemClick = async (payload) => {
-      const safeDocument = tryGetDocument();
       switch (payload.detail) {
         case 'upload':
           this.uploadInputRef.click();
@@ -36,7 +34,8 @@ export class ImageToolbarButtonSlimmer extends VisualModeToolbarButtonSlimmer {
           this.currentRange = this.selectionController.getCurrentRange();
           this.currentSelectedNodes = this.selectionController.getSelectedNodes();
           this.currentSelectedBlocks = this.selectionController.getSelectedBlocks();
-          safeDocument && safeDocument.body.append(this.insertURLModalRef);
+          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+          this.host.parentElement.append(this.insertURLModalRef);
           this.insertURLInputRef.value = '';
           await this.insertURLModalRef.modal('show');
           await this.insertURLInputRef.doFocus();
@@ -167,6 +166,9 @@ ImageToolbarButtonSlimmer.items = [
     label: 'Insert via URL',
   },
 ];
+__decorate([
+  MapToComponentField()
+], ImageToolbarButtonSlimmer.prototype, "host", void 0);
 __decorate([
   MapToComponentField()
 ], ImageToolbarButtonSlimmer.prototype, "insertImageController", void 0);

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/tools/text-styles-toolbar-button-slimmer.js

@@ -23,8 +23,9 @@ export class TextStylesToolbarButtonSlimmer extends VisualModeToolbarButtonSlimm
       tooltip: { text: 'Text Styles' },
     });
     this.handleDropdownItemClick = (payload) => {
+      var _a, _b;
       const selectedType = payload.detail;
-      const boldByDefault = TextStylesToolbarButtonSlimmer.items.find((item) => item.key === selectedType).bold;
+      const boldByDefault = (_b = (_a = TextStylesToolbarButtonSlimmer.allItems.find((item) => item.key === selectedType)) === null || _a === void 0 ? void 0 : _a.bold) !== null && _b !== void 0 ? _b : false;
       const selectedTextBlocks = this.selectionController
         .getSelectedBlocks()
         .filter((block) => block instanceof RTETextBlock);
@@ -53,7 +54,8 @@ export class TextStylesToolbarButtonSlimmer extends VisualModeToolbarButtonSlimm
       h("div", Object.assign({ slot: "items" }, super.preventLostFocus()), this.renderDropdownContent())));
   }
   renderDropdownContent() {
-    return (h(Fragment, null, TextStylesToolbarButtonSlimmer.items.map((item) => {
+    const visibleItems = TextStylesToolbarButtonSlimmer.allItems.filter((item) => this.textStyleItems.some((config) => config.key === item.key));
+    return (h(Fragment, null, visibleItems.map((item) => {
       const textStyleAnnotation = new TextStyleAnnotation(item.key);
       const boldAnnotation = new BoldAnnotation(item.bold);
       return (h("vega-dropdown-item", { key: item.key, itemKey: item.key },
@@ -91,7 +93,7 @@ export class TextStylesToolbarButtonSlimmer extends VisualModeToolbarButtonSlimm
     'text-size': textSize,
   });
 })();
-TextStylesToolbarButtonSlimmer.items = [
+TextStylesToolbarButtonSlimmer.allItems = [
   {
     key: 'title',
     label: 'Title',
@@ -116,6 +118,21 @@ TextStylesToolbarButtonSlimmer.items = [
     label: 'Heading 3',
     bold: true,
   },
+  {
+    key: 'heading-4',
+    label: 'Heading 4',
+    bold: true,
+  },
+  {
+    key: 'heading-5',
+    label: 'Heading 5',
+    bold: true,
+  },
+  {
+    key: 'heading-6',
+    label: 'Heading 6',
+    bold: true,
+  },
   {
     key: 'paragraph',
     label: 'Paragraph',
@@ -127,3 +144,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], TextStylesToolbarButtonSlimmer.prototype, "focusController", void 0);
+__decorate([
+  MapToComponentField()
+], TextStylesToolbarButtonSlimmer.prototype, "textStyleItems", void 0);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-editor.js

@@ -204,6 +204,26 @@ export class VegaRichTextEditor {
      * @vegaVersion 2.34.0
      */
     this.validationRules = [];
+    /**
+     * Specifies which text style items appear in the Text Styles toolbar dropdown.
+     *
+     * Use this to control which heading levels and text styles are available to users.
+     * For example, omit `{ key: 'heading-1' }` to prevent users from applying H1
+     * (which is typically reserved for the page title).
+     *
+     * Items are displayed in a fixed internal order regardless of the order in this array.
+     *
+     * @vegaVersion 2.83.0
+     * @defaultValue [{ key: 'title' }, { key: 'subtitle' }, { key: 'heading-1' }, { key: 'heading-2' }, { key: 'heading-3' }, { key: 'paragraph' }]
+     */
+    this.textStyleItems = [
+      { key: 'title' },
+      { key: 'subtitle' },
+      { key: 'heading-1' },
+      { key: 'heading-2' },
+      { key: 'heading-3' },
+      { key: 'paragraph' },
+    ];
     /**
      * Specifies the configuration for the rich text editor extensions.
      *
@@ -532,6 +552,33 @@ export class VegaRichTextEditor {
       },
       "defaultValue": "[]"
     },
+    "textStyleItems": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaRTETextStyleItem[]",
+        "resolved": "VegaRTETextStyleItem[]",
+        "references": {
+          "VegaRTETextStyleItem": {
+            "location": "import",
+            "path": "./interface"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.83.0"
+          }, {
+            "name": "defaultValue",
+            "text": "[{ key: 'title' }, { key: 'subtitle' }, { key: 'heading-1' }, { key: 'heading-2' }, { key: 'heading-3' }, { key: 'paragraph' }]"
+          }],
+        "text": "Specifies which text style items appear in the Text Styles toolbar dropdown.\n\nUse this to control which heading levels and text styles are available to users.\nFor example, omit `{ key: 'heading-1' }` to prevent users from applying H1\n(which is typically reserved for the page title).\n\nItems are displayed in a fixed internal order regardless of the order in this array."
+      },
+      "defaultValue": "[\n\t\t{ key: 'title' },\n\t\t{ key: 'subtitle' },\n\t\t{ key: 'heading-1' },\n\t\t{ key: 'heading-2' },\n\t\t{ key: 'heading-3' },\n\t\t{ key: 'paragraph' },\n\t]"
+    },
     "extensions": {
       "type": "unknown",
       "mutable": false,

package/dist/collection/components/vega-text/slimmers/renderers/vega-text-tooltip-renderer.js

@@ -12,10 +12,15 @@ export class VegaTextTooltipRenderer extends PageResizeObserverSlimmer {
   /**
    * The below method is e2e-test covered in
    * @see{module:vega-text-with-long-text-change-screen-size}
+   * @see{module:vega-text-restore-on-enlarge-screen-size}
    */
   constructor() {
     /* eslint-disable jsdoc/require-jsdoc*/
     super({
+      // Observe both the host (catches show/hide e.g. in vega-tab-group-panel, VD-8769)
+      // and document.body (catches viewport resize after truncation collapses host width).
+      // eslint-disable-next-line no-restricted-globals
+      target: /* istanbul ignore next */ () => [this.host, document.body],
       callback: /* istanbul ignore next */ () => {
         if (this.overflow === 'ellipsis') {
           if (this.tooltipRef) {
@@ -33,11 +38,52 @@ export class VegaTextTooltipRenderer extends PageResizeObserverSlimmer {
      */
     /* istanbul ignore next */
     this.handleTooltip = async () => {
+      // Skip when host has no layout (e.g. hidden inside an inactive vega-tab-group-panel);
+      // the observer will re-fire once the host becomes visible.
+      if (this.host.clientWidth === 0) {
+        return;
+      }
+      // VD-8855: Reset the inline `min-width` (previously pinned in px by `insertMinWidthStyle()`
+      // to work around the Safari wrap issue) back to `auto` BEFORE re-measuring overflow.
+      // Without this, a prior ResizeObserver callback that fired during an async container
+      // layout transition (e.g. `vega-calendar` mounting inside a `vega-modal` open animation,
+      // or a previously hidden `vega-tab-group-panel` becoming visible) could leave the host
+      // pinned to a transient narrow width and lock `vega-text` in a truncated state.
+      this.host.style.minWidth = 'auto';
       if (isTextWrapped(this.host)) {
         const tooltip = this.createTooltip();
         void tooltip.componentOnReady().then(() => {
           void this.updateTooltipDisplayText();
         });
+        // VD-8855: After truncating during what may have been a transient narrow layout,
+        // schedule one delayed re-measure (after layout settles) to verify whether the
+        // truncation is still warranted. If the parent has since expanded, the next
+        // `handleTooltip()` call will see no wrap and restore the full text.
+        // This breaks the self-reinforcing collapse where, once the host is pinned to a
+        // 1-character min-width, no further ResizeObserver event ever fires on it.
+        // eslint-disable-next-line no-restricted-globals
+        requestAnimationFrame(() => {
+          // eslint-disable-next-line no-restricted-globals
+          requestAnimationFrame(() => {
+            if (!this.host || !this.host.isConnected) {
+              return;
+            }
+            this.host.style.minWidth = 'auto';
+            if (this.tooltipRef) {
+              this.tooltipRef.innerText = this.content;
+            }
+            if (!isTextWrapped(this.host)) {
+              if (this.tooltipRef && this.tooltipRef.classList.contains('hydrated')) {
+                this.host.innerText = this.content;
+                this.tooltipRef.remove();
+                this.tooltipRef = null;
+              }
+            }
+            else if (this.tooltipRef) {
+              void this.updateTooltipDisplayText();
+            }
+          });
+        });
       }
       else {
         if (this.tooltipRef && this.tooltipRef.classList.contains('hydrated')) {
@@ -45,7 +91,6 @@ export class VegaTextTooltipRenderer extends PageResizeObserverSlimmer {
           this.tooltipRef.remove();
           this.tooltipRef = null;
         }
-        this.host.style.minWidth = 'auto';
       }
     };
     /**

package/dist/collection/components/vega-time-picker/slimmers/renderers/vega-time-picker-range-clear-button-renderer.js

@@ -21,17 +21,22 @@ export class VegaTimePickerRangeClearButtonRenderer extends VegaSlimmer {
   render() {
     return (h("div", { class: {
         'vega-time-picker-range-clear-icon': true,
-        'invisible': !this.isInvisible(),
+        'invisible': !this.shouldShowClearButton(),
       }, "aria-label": "clear input", role: "button", tabindex: !this.disabled ? 0 : -1, onClick: this.onClickClearIcon, onKeyDown: createEnterKeyHandlerToTriggerClick() },
       h("vega-icon", { icon: "close", class: "v-min-w-min vega-flex-shrink-0" })));
   }
   /**
-   * The function checks if the value is an array and if either of the elements in the array is truthy, returning true if so.
+   * Determines whether the range clear button should be visible. The button
+   * is shown only when the clear icon feature is enabled, the component is
+   * not disabled, and at least one end of the range value is non-empty.
    *
-   * @returns {boolean} a boolean value.
+   * @returns {boolean} `true` when the clear button should be visible.
    */
-  isInvisible() {
-    return (!this.disabled && Array.isArray(this.value) && (Boolean(this.value[0]) || Boolean(this.value[1])));
+  shouldShowClearButton() {
+    return (this.showClearIcon &&
+      !this.disabled &&
+      Array.isArray(this.value) &&
+      (Boolean(this.value[0]) || Boolean(this.value[1])));
   }
 }
 __decorate([
@@ -40,6 +45,9 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaTimePickerRangeClearButtonRenderer.prototype, "value", void 0);
+__decorate([
+  MapToComponentField()
+], VegaTimePickerRangeClearButtonRenderer.prototype, "showClearIcon", void 0);
 __decorate([
   MapToComponentField()
 ], VegaTimePickerRangeClearButtonRenderer.prototype, "valueController", void 0);

package/dist/collection/components/vega-time-picker/slimmers/renderers/vega-time-picker-single-input-renderer.js

@@ -41,7 +41,7 @@ export class VegaTimePickerSingleInputRenderer extends VegaSlimmer {
   /* istanbul ignore next */
   render() {
     return (h("div", { class: "time-picker-input" },
-      h("vega-input", { "prefix-icon": "clock-face", placeholder: this.getPlaceholder(), disabled: this.disabled, readOnly: this.readOnly, size: this.size, value: typeof this.value === 'string' ? this.value : '', ref: (ref) => {
+      h("vega-input", { "prefix-icon": "clock-face", placeholder: this.getPlaceholder(), disabled: this.disabled, readOnly: this.readOnly, size: this.size, value: typeof this.value === 'string' ? this.value : '', showClearIcon: this.showClearIcon, ref: (ref) => {
           this.timeInputRef = ref;
           this.handleVegaInputEvent(ref);
         } })));
@@ -104,3 +104,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaTimePickerSingleInputRenderer.prototype, "readOnly", void 0);
+__decorate([
+  MapToComponentField()
+], VegaTimePickerSingleInputRenderer.prototype, "showClearIcon", void 0);

package/dist/collection/components/vega-time-picker/vega-time-picker.js

@@ -169,6 +169,26 @@ export class VegaTimePicker {
      * @vegaVersion 2.79.0
      */
     this.readOnly = false;
+    /**
+     * Controls whether a clear (✕) icon button is displayed inside the time
+     * picker input when the field has a non-empty value.
+     *
+     * When `true`, clicking the clear icon resets the time picker value to an
+     * empty value (or `['', '']` in `range` mode) and emits a `vegaChange`
+     * event. Set to `false` to hide the clear icon (e.g., for time pickers
+     * where clearing is not desired).
+     *
+     * The clear icon is also hidden when the component is `disabled`.
+     *
+     * When the component is `readOnly`, the clear icon remains visible by
+     * design: read-only only suppresses manual keyboard text entry, while
+     * users can still update the value via the dropdown UI, so clearing the
+     * selected value is still a valid interaction.
+     *
+     * @default true
+     * @vegaVersion 2.84.0
+     */
+    this.showClearIcon = true;
     /**
      * Specifies the validation status of the time picker component.
      *
@@ -491,6 +511,30 @@ export class VegaTimePicker {
       "reflect": false,
       "defaultValue": "false"
     },
+    "showClearIcon": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "default",
+            "text": "true"
+          }, {
+            "name": "vegaVersion",
+            "text": "2.84.0"
+          }],
+        "text": "Controls whether a clear (\u2715) icon button is displayed inside the time\npicker input when the field has a non-empty value.\n\nWhen `true`, clicking the clear icon resets the time picker value to an\nempty value (or `['', '']` in `range` mode) and emits a `vegaChange`\nevent. Set to `false` to hide the clear icon (e.g., for time pickers\nwhere clearing is not desired).\n\nThe clear icon is also hidden when the component is `disabled`.\n\nWhen the component is `readOnly`, the clear icon remains visible by\ndesign: read-only only suppresses manual keyboard text entry, while\nusers can still update the value via the dropdown UI, so clearing the\nselected value is still a valid interaction."
+      },
+      "attribute": "show-clear-icon",
+      "reflect": false,
+      "defaultValue": "true"
+    },
     "isValid": {
       "type": "boolean",
       "mutable": true,

package/dist/collection/helpers/event-manager/event-id/component-event-id-map.js

@@ -1,7 +1,7 @@
-import { VegaExpand, VegaClick, VegaDropdownClick, VegaReset, VegaClose, VegaActionButtonClick, VegaChange, VegaEventClick, VegaDateDblClick, VegaMoreActionClick, VegaDateClick, VegaPageUpdate, VegaRemove, VegaCreate, VegaSearch, VegaMonthYearChange, VegaClear, VegaSelectionChange, VegaDropdownShow, VegaDropdownHide, VegaDropdownSearch, VegaSearchTrigger, VegaLabelButtonClick, VegaSelectFileChange, VegaRetry, VegaPreview, VegaFormSubmit, VegaFormReset, VegaValidate, VegaCancel, VegaNativeInputChange, VegaFocus, VegaBlur, VegaSuggestionItemClick, VegaPaste, VegaComplete, VegaCountryChange, VegaShow, VegaHide, VegaToggleStatus, VegaOpen, VegaStateUpdate, VegaGroupClick, VegaMenuClick, VegaActionClick, VegaPageSizeChange, VegaPopoverShow, VegaPopoverHide, VegaCurrentStepUpdate, VegaImageInserted, VegaSourceCodeChange, VegaSelectChange, VegaSelectAllChange, VegaRowClick, VegaRowExpand, VegaRowSelect, VegaRowSelectAll, } from './vega-event-id';
+import { VegaExpand, VegaClick, VegaDropdownClick, VegaReset, VegaDropdownSearch, VegaClose, VegaActionButtonClick, VegaChange, VegaEventClick, VegaDateDblClick, VegaMoreActionClick, VegaDateClick, VegaPageUpdate, VegaRemove, VegaCreate, VegaSearch, VegaMonthYearChange, VegaClear, VegaSelectionChange, VegaDropdownShow, VegaDropdownHide, VegaSearchTrigger, VegaLabelButtonClick, VegaSelectFileChange, VegaRetry, VegaPreview, VegaFormSubmit, VegaFormReset, VegaValidate, VegaCancel, VegaNativeInputChange, VegaFocus, VegaBlur, VegaSuggestionItemClick, VegaPaste, VegaComplete, VegaCountryChange, VegaShow, VegaHide, VegaToggleStatus, VegaOpen, VegaStateUpdate, VegaGroupClick, VegaMenuClick, VegaActionClick, VegaPageSizeChange, VegaPopoverShow, VegaPopoverHide, VegaCurrentStepUpdate, VegaImageInserted, VegaSourceCodeChange, VegaSelectChange, VegaSelectAllChange, VegaRowClick, VegaRowExpand, VegaRowSelect, VegaRowSelectAll, } from './vega-event-id';
 const entries = [
   ['vega-accordion', [VegaExpand]],
-  ['vega-app-header-button', [VegaClick, VegaDropdownClick, VegaReset]],
+  ['vega-app-header-button', [VegaClick, VegaDropdownClick, VegaReset, VegaDropdownSearch]],
   ['vega-banner', [VegaClose, VegaActionButtonClick]],
   ['vega-breadcrumb', [VegaClick]],
   ['vega-button', [VegaClick]],
@@ -16,6 +16,7 @@ const entries = [
   ['vega-code-block', [VegaChange, VegaRemove]],
   ['vega-color-picker', [VegaChange]],
   ['vega-color-swatch', [VegaClick]],
+  ['vega-color-swatch-picker', [VegaChange]],
   ['vega-combo-box', [VegaChange, VegaCreate, VegaSearch]],
   ['vega-date-picker', [VegaChange, VegaMonthYearChange]],
   ['vega-date-picker-calendar', [VegaClear, VegaMonthYearChange, VegaSelectionChange]],

package/dist/collection/helpers/rte-manager/dto-renderer-manager.js

@@ -7,6 +7,14 @@ class RTEDTORendererManager {
     this.RTE_DTO_RENDERER_MAP = new Map();
     // Register RTE Toolbar Button Renderers, mapping type strings to their respective renderer instances.
     this.RTE_TOOLBAR_BUTTON_RENDERER_MAP = new Map();
+    /**
+     * Per-host toolbar button renderer map.
+     * Stores a host-specific renderer map so that extensions that register during
+     * {@link VegaRTEExtension#prepareBeforeLoad} can provide isolated renderer instances
+     * for each {@link HTMLVegaRichTextEditorElement}.  At render time this map is checked
+     * first; the global singleton map is used as a fallback.
+     */
+    this.hostToolbarButtonRendererMap = new WeakMap();
   }
   /**
    * Registers a new RTE DTO renderer.
@@ -32,6 +40,24 @@ class RTEDTORendererManager {
   registerRTEToolbarButtonRenderer(type, RTEToolbarButtonRenderer) {
     this.RTE_TOOLBAR_BUTTON_RENDERER_MAP.set(type, RTEToolbarButtonRenderer);
   }
+  /**
+   * Registers a host-specific toolbar button renderer.
+   * The per-host renderer takes precedence over the global singleton when the host
+   * element is passed to {@link getRTEToolbarButtonRenderer}.
+   *
+   * @typedef HTMLVegaRichTextEditorElement - The rich text editor host element type.
+   * @param {HTMLVegaRichTextEditorElement} host - The rich text editor host element.
+   * @param {string} type - The type identifier for the toolbar button renderer.
+   * @param {VegaRTEToolbarButtonRenderer} renderer - The renderer instance to register for this host.
+   */
+  registerRTEToolbarButtonRendererForHost(host, type, renderer) {
+    let hostMap = this.hostToolbarButtonRendererMap.get(host);
+    if (!hostMap) {
+      hostMap = new Map();
+      this.hostToolbarButtonRendererMap.set(host, hostMap);
+    }
+    hostMap.set(type, renderer);
+  }
   /**
    * Retrieves the RTE renderer for a given type.
    *
@@ -43,12 +69,26 @@ class RTEDTORendererManager {
   }
   /**
    * Retrieves the RTE Toolbar Button Renderer for a given type.
+   * When a host element is provided the per-host map registered via
+   * {@link registerRTEToolbarButtonRendererForHost} is checked first; the global
+   * singleton map is used as a fallback so that extensions that do not override
+   * {@link VegaRTEExtension#prepareBeforeLoad} continue to work unchanged.
    *
+   * @typedef HTMLVegaRichTextEditorElement - The rich text editor host element type.
    * @param {string} type - The type identifier for the RTE Toolbar Button Renderer.
+   * @param {HTMLVegaRichTextEditorElement} [host] - Optional host element for per-host lookup.
    * @returns {Nullable<VegaRTEToolbarButtonRenderer>} - The renderer instance for the RTE Toolbar Button, or null if not found.
    */
-  getRTEToolbarButtonRenderer(type) {
-    return this.RTE_TOOLBAR_BUTTON_RENDERER_MAP.get(type);
+  getRTEToolbarButtonRenderer(type, host) {
+    var _a, _b;
+    if (host) {
+      const hostRenderer = (_a = this.hostToolbarButtonRendererMap
+        .get(host)) === null || _a === void 0 ? void 0 : _a.get(type);
+      if (hostRenderer) {
+        return hostRenderer;
+      }
+    }
+    return (_b = this.RTE_TOOLBAR_BUTTON_RENDERER_MAP.get(type)) !== null && _b !== void 0 ? _b : null;
   }
 }
 export default new RTEDTORendererManager();

package/dist/collection/helpers/slimmers/element-appender/body-positioned-wrapper/third-party-dialog-wrapper.js

@@ -0,0 +1,73 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { MapToComponentField as MapToSlimmerField } from 'vega-slimmer/core';
+import { findParent } from '../../../../utils/ui';
+import { BodyPositionedWrapper } from './body-positioned-wrapper.abstract';
+/**
+ * Appends the popover content box inside the nearest third-party dialog/modal (e.g. Bootstrap,
+ * MUI) so that their focus trap does not block focus on vega-popover content.
+ *
+ * Detection strategy:
+ * 1. Walk up from the target to find `dialog` or `[aria-modal="true"]`.
+ * 2. Skip Vega-owned elements (tag starts with `VEGA-`).
+ * 3. Locate the focus-trap root via `closest('[tabindex="-1"]')`.
+ */
+export class ThirdPartyDialogWrapper extends BodyPositionedWrapper {
+  /**
+   * Returns true when the target lives inside a third-party dialog.
+   *
+   * NOTE: Does NOT call super.canRetrieve() — must activate even when isScreenPosition=true
+   * (e.g. image editor popover) so the content box stays inside the focus-trap root.
+   *
+   * @returns {boolean} Whether the target is inside a third-party dialog.
+   */
+  canRetrieve() {
+    this.focusTrapRoot = this.findFocusTrapRoot(this.showConfig.target);
+    return !!this.focusTrapRoot;
+  }
+  /**
+   * Appends the popover content box inside the focus-trap root.
+   *
+   * @returns {HTMLElement} The focus-trap root element.
+   */
+  retrieve() {
+    const root = this.focusTrapRoot;
+    this.focusTrapRoot = null;
+    if (this.showConfig.appendableElement.parentElement !== root) {
+      root.append(this.showConfig.appendableElement);
+    }
+    return root;
+  }
+  /**
+   * Finds the focus-trap root of the nearest third-party dialog ancestor.
+   * Returns null if not inside a third-party dialog or if the dialog is Vega-owned.
+   *
+   * @param {Nullable<HTMLElement>} el - The element to start searching from.
+   * @returns {Nullable<HTMLElement>} The focus-trap root, or null.
+   */
+  findFocusTrapRoot(el) {
+    var _a;
+    const dialog = findParent(el, 'dialog, [aria-modal="true"]');
+    if (!dialog || this.isVegaOwned(dialog))
+      return null;
+    // closest() also matches the element itself — needed when [aria-modal] and [tabindex="-1"]
+    // are on the same node (e.g. Bootstrap 5 outer .modal div).
+    return (_a = dialog.closest('[tabindex="-1"]')) !== null && _a !== void 0 ? _a : dialog;
+  }
+  /**
+   * Returns true when the element is a Vega custom element (tag starts with `VEGA-`).
+   *
+   * @param {HTMLElement} el - The element to check.
+   * @returns {boolean} True if the element is Vega-owned.
+   */
+  isVegaOwned(el) {
+    return el.tagName.startsWith('VEGA-');
+  }
+}
+__decorate([
+  MapToSlimmerField()
+], ThirdPartyDialogWrapper.prototype, "showConfig", void 0);