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 = '') {
    super();
    this.languageList = [];
    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(itemKey);
      }
    };
    this.languageList = languageList;
    this.languageChangeCallback = languageChangeCallback;
    this.selectedLanguage = selectedLanguage;
  }
  /**
   * 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.
   */
  setSelectedLanguage(language) {
    this.selectedLanguage = language;
    if (this.labelRef) {
      this.labelRef.textContent = this.getLanguageLabelByKey(language);
    }
  }
  /**
   * The source edit mode does not affect the language button visibility.
   *
   * @returns {boolean} True if the button is hidden, false otherwise.
   */
  isHidden() {
    return false;
  }
  /**
   * @inheritDoc
   */
  render(createElement, editorContext) {
    return this.renderDropdown(createElement, editorContext, { source: this.languageList }, [
      this.renderButton(createElement, editorContext, {
        label: this.getLanguageLabelByKey(this.selectedLanguage),
        showArrowIcon: true,
      }),
    ]);
  }
  /**
   * Override to capture the rendered label element ref so that
   * {@link setSelectedLanguage} can update the button text without a full re-render.
   *
   * @inheritDoc
   */
  renderButtonLabel(h, editorContext, label) {
    const isDisabled = this.isDisabled(editorContext);
    return h('vega-font', {
      variant: 'font-field-label-sm',
      color: isDisabled ? 'text-disabled' : 'text-primary',
      // eslint-disable-next-line jsdoc/require-jsdoc
      ref: (el) => {
        this.labelRef = el;
      },
    }, label);
  }
  /* istanbul ignore next */
  /**
   * Handles the button click event. No need this method for language button.
   *
   * @param {VegaRTEToolbarRenderContext} editorContext - The render context for the editor.
   */
  handleButtonClick(editorContext) {
    methodPlaceholder(editorContext);
  }
  /**
   * Gets the label of a language by its key.
   *
   * @param {string} key The language key to look up.
   * @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 (_a = language === null || language === void 0 ? void 0 : language.label) !== null && _a !== void 0 ? _a : 'Select Language';
  }
}
