@opentiny/fluent-editor 3.25.4 → 4.0.0-alpha.1

package/es/modules/toolbar/better-picker.es.js

@@ -1,133 +1,31 @@
-import Quill from "quill";
-import { isNullOrUndefined } from "../../config/editor.utils.es.js";
-const SnowTheme = Quill.imports["themes/snow"];
-let optionsCounter = 0;
-function toggleAriaAttribute(element, attribute) {
-  element.setAttribute(
-    attribute,
-    element.getAttribute(attribute) !== "true"
-  );
-}
-class Picker {
-  constructor(select) {
-    this.select = select;
-    this.container = document.createElement("span");
-    this.buildPicker();
-    this.select.style.display = "none";
-    this.select.parentNode.insertBefore(this.container, this.select);
-    this.label.addEventListener("mousedown", (e) => {
-      this.togglePicker();
-      e.preventDefault();
-    });
-    this.label.addEventListener("keydown", (event) => {
-      switch (event.key) {
-        case "Enter":
-          this.togglePicker();
-          break;
-        case "Escape":
-          this.escape();
-          event.preventDefault();
-          break;
-        default:
-      }
-    });
-    this.select.addEventListener("change", this.update.bind(this));
-  }
-  togglePicker() {
-    this.container.classList.toggle("ql-expanded");
-    toggleAriaAttribute(this.label, "aria-expanded");
-    toggleAriaAttribute(this.options, "aria-hidden");
-  }
-  buildItem(option) {
-    const item = document.createElement("span");
-    item.tabIndex = 0;
-    item.setAttribute("role", "button");
-    item.classList.add("ql-picker-item");
-    if (option.hasAttribute("value")) {
-      item.setAttribute("data-value", option.getAttribute("value"));
-    }
-    if (option.textContent) {
-      item.setAttribute("data-label", option.textContent);
-    }
-    item.addEventListener("click", () => {
-      this.selectItem(item, true);
-    });
-    item.addEventListener("keydown", (event) => {
-      switch (event.key) {
-        case "Enter":
-          this.selectItem(item, true);
-          event.preventDefault();
-          break;
-        case "Escape":
-          this.escape();
-          event.preventDefault();
-          break;
-        default:
-      }
-    });
-    return item;
-  }
+import { EasyColorPicker } from "quill-easy-color";
+import FluentEditor from "../../core/fluent-editor.es.js";
+const OriginPicker = FluentEditor.import("ui/picker");
+class Picker extends OriginPicker {
   buildLabel() {
     const label = document.createElement("span");
     label.classList.add("ql-picker-label");
-    label.innerHTML = `
-      <svg viewbox="0 0 18 18">
-        <polygon class="ql-stroke" points="7 11 9 13 11 11 7 11"></polygon>
-        <polygon class="ql-stroke" points="7 7 9 5 11 7 7 7"></polygon>
-      </svg>
-    `;
+    label.innerHTML = `<i class="icon" />`;
     label.tabIndex = 0;
     label.setAttribute("role", "button");
     label.setAttribute("aria-expanded", "false");
     this.container.appendChild(label);
     return label;
   }
-  buildOptions() {
-    const options = document.createElement("span");
-    options.classList.add("ql-picker-options");
-    options.setAttribute("aria-hidden", "true");
-    options.tabIndex = -1;
-    options.id = `ql-picker-options-${optionsCounter}`;
-    optionsCounter += 1;
-    this.label.setAttribute("aria-controls", options.id);
-    this.options = options;
-    Array.from(this.select.options).forEach((option) => {
-      const item = this.buildItem(option);
-      options.appendChild(item);
-      if (option.selected === true) {
-        this.selectItem(item);
-      }
-    });
-    this.container.appendChild(options);
-  }
-  buildPicker() {
-    Array.from(this.select.attributes).forEach((item) => {
-      this.container.setAttribute(item.name, item.value);
-    });
-    this.container.classList.add("ql-picker");
-    this.label = this.buildLabel();
-    this.buildOptions();
-  }
-  escape() {
-    this.close();
-    setTimeout(() => this.label.focus(), 1);
-  }
-  close() {
-    this.container.classList.remove("ql-expanded");
-    this.label.setAttribute("aria-expanded", "false");
-    this.options.setAttribute("aria-hidden", "true");
+  buildItem(option) {
+    const item = super.buildItem(option);
+    const value = option.getAttribute("value");
+    item.style.setProperty("--value", value);
+    return item;
   }
   selectItem(item, trigger = false) {
     const selected = this.container.querySelector(".ql-selected");
-    if (item === selected) return;
-    if (!isNullOrUndefined(selected)) {
+    if (item === selected || item == null) return;
+    if (selected != null) {
       selected.classList.remove("ql-selected");
     }
-    if (isNullOrUndefined(item)) return;
     item.classList.add("ql-selected");
-    this.select.selectedIndex = Array.from(item.parentNode.children).indexOf(
-      item
-    );
+    this.select.selectedIndex = Array.from(item.parentNode.children).indexOf(item);
     if (item.hasAttribute("data-value")) {
       this.label.setAttribute("data-value", item.getAttribute("data-value"));
     } else {
@@ -139,169 +37,23 @@ class Picker {
       this.label.removeAttribute("data-label");
     }
     if (trigger) {
-      let ev;
-      if (typeof Event === "function") {
-        ev = new Event("change");
-      } else {
-        ev = document.createEvent("Event");
-        ev.initEvent("change", true, true);
-      }
-      this.select.dispatchEvent(ev);
+      this.select.dispatchEvent(new Event("change"));
       this.close();
     }
   }
-  update() {
-    let option;
-    if (this.select.selectedIndex > -1) {
-      const item = this.container.querySelector(".ql-picker-options").children[this.select.selectedIndex];
-      option = this.select.options[this.select.selectedIndex];
-      this.selectItem(item);
-    } else {
-      this.selectItem(null);
-    }
-    const isActive = !isNullOrUndefined(option) && option !== this.select.querySelector("option[selected]");
-    if (isActive) {
-      this.label.classList.add("ql-active");
-    } else {
-      this.label.classList.remove("ql-active");
-    }
-  }
 }
-class IconPicker extends Picker {
-  constructor(select, icons) {
-    super(select);
-    this.container.classList.add("ql-icon-picker");
-    Array.from(this.container.querySelectorAll(".ql-picker-item")).forEach(
-      (item) => {
-        item.innerHTML = icons[item.getAttribute("data-value") || ""];
-      }
-    );
-    this.defaultItem = this.container.querySelector(".ql-selected");
-    this.selectItem(this.defaultItem, null);
-  }
-  selectItem(target, trigger) {
-    super.selectItem(target, trigger);
-    const item = target || this.defaultItem;
-    if (this.label.innerHTML === item.innerHTML) return;
-    this.label.innerHTML = item.innerHTML;
-  }
-}
-class ColorPicker extends Picker {
-  constructor(select, label) {
-    super(select);
-    this.label.innerHTML = label;
-    this.container.classList.add("ql-color-picker");
-    Array.from(this.container.querySelectorAll(".ql-picker-item")).slice(0, 7).forEach((item) => {
-      item.classList.add("ql-primary");
-    });
+class ColorPicker extends EasyColorPicker {
+  constructor(select, label, options) {
+    super(select, label, options);
   }
   buildItem(option) {
     const item = super.buildItem(option);
-    item.style.backgroundColor = option.getAttribute("value") || "";
+    item.setAttribute("title", option.getAttribute("value"));
     return item;
   }
-  selectItem(item, trigger) {
-    super.selectItem(item, trigger);
-    const colorLabel = this.label.querySelector(".ql-color-label");
-    const value = item ? item.getAttribute("data-value") || "" : "";
-    if (colorLabel) {
-      if (colorLabel.tagName === "line") {
-        colorLabel.style.stroke = value;
-      } else {
-        colorLabel.style.fill = value;
-      }
-    }
-  }
 }
-Quill.register("ui/picker", Picker, true);
-Quill.register("ui/icon-picker", IconPicker, true);
-Quill.register("ui/color-picker", ColorPicker, true);
-const ALIGNS = [false, "center", "right"];
-const COLORS = [
-  "#000000",
-  "#e60000",
-  "#ff9900",
-  "#ffff00",
-  "#008a00",
-  "#0066cc",
-  "#9933ff",
-  "#ffffff",
-  "#facccc",
-  "#ffebcc",
-  "#ffffcc",
-  "#cce8cc",
-  "#cce0f5",
-  "#ebd6ff",
-  "#bbbbbb",
-  "#f06666",
-  "#ffc266",
-  "#ffff66",
-  "#66b966",
-  "#66a3e0",
-  "#c285ff",
-  "#888888",
-  "#a10000",
-  "#b26b00",
-  "#b2b200",
-  "#006100",
-  "#0047b2",
-  "#6b24b2",
-  "#444444",
-  "#5c0000",
-  "#663d00",
-  "#666600",
-  "#003700",
-  "#002966",
-  "#3d1466"
-];
-const FONTS = [false, "serif", "monospace"];
-const HEADERS = ["1", "2", "3", false];
-const SIZES = ["small", false, "large", "huge"];
-SnowTheme.prototype.buildPickers = function(selects, icons) {
-  this.pickers = Array.from(selects).map((select) => {
-    if (select.classList.contains("ql-align")) {
-      if (isNullOrUndefined(select.querySelector("option"))) {
-        fillSelect(select, ALIGNS);
-      }
-      return new IconPicker(select, icons.align);
-    }
-    if (select.classList.contains("ql-background") || select.classList.contains("ql-color")) {
-      const format = select.classList.contains("ql-background") ? "background" : "color";
-      if (isNullOrUndefined(select.querySelector("option"))) {
-        fillSelect(
-          select,
-          COLORS
-        );
-      }
-      return new ColorPicker(select, icons[format]);
-    }
-    if (isNullOrUndefined(select.querySelector("option"))) {
-      if (select.classList.contains("ql-font")) {
-        fillSelect(select, FONTS);
-      } else if (select.classList.contains("ql-header")) {
-        fillSelect(select, HEADERS);
-      } else if (select.classList.contains("ql-size")) {
-        fillSelect(select, SIZES);
-      }
-    }
-    return new Picker(select);
-  });
-  const update = () => {
-    this.pickers.forEach((picker) => {
-      picker.update();
-    });
-  };
-  this.quill.on(Quill.events.EDITOR_CHANGE, update);
+export {
+  ColorPicker,
+  Picker
 };
-function fillSelect(select, values, defaultValue = false) {
-  values.forEach((value) => {
-    const option = document.createElement("option");
-    if (value === defaultValue) {
-      option.setAttribute("selected", "selected");
-    } else {
-      option.setAttribute("value", value);
-    }
-    select.appendChild(option);
-  });
-}
 //# sourceMappingURL=better-picker.es.js.map

package/es/modules/toolbar/better-picker.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"better-picker.es.js","sources":["../../../../src/modules/toolbar/better-picker.ts"],"sourcesContent":["import Quill from 'quill'\r\nimport { isNullOrUndefined } from '../../config/editor.utils'\r\n\r\nconst SnowTheme = Quill.imports['themes/snow']\r\n\r\nlet optionsCounter = 0\r\n\r\nfunction toggleAriaAttribute(element, attribute) {\r\n  element.setAttribute(\r\n    attribute,\r\n    element.getAttribute(attribute) !== 'true',\r\n  )\r\n}\r\n\r\nclass Picker {\r\n  container: any\r\n  label: any\r\n  options: any\r\n  select: any\r\n  constructor(select) {\r\n    this.select = select\r\n    this.container = document.createElement('span')\r\n    this.buildPicker()\r\n    this.select.style.display = 'none'\r\n    this.select.parentNode.insertBefore(this.container, this.select)\r\n\r\n    this.label.addEventListener('mousedown', (e) => {\r\n      this.togglePicker()\r\n      e.preventDefault()\r\n    })\r\n    this.label.addEventListener('keydown', (event) => {\r\n      switch (event.key) {\r\n        case 'Enter':\r\n          this.togglePicker()\r\n          break\r\n        case 'Escape':\r\n          this.escape()\r\n          event.preventDefault()\r\n          break\r\n        default:\r\n      }\r\n    })\r\n    this.select.addEventListener('change', this.update.bind(this))\r\n  }\r\n\r\n  togglePicker() {\r\n    this.container.classList.toggle('ql-expanded')\r\n    // Toggle aria-expanded and aria-hidden to make the picker accessible\r\n    toggleAriaAttribute(this.label, 'aria-expanded')\r\n    toggleAriaAttribute(this.options, 'aria-hidden')\r\n  }\r\n\r\n  buildItem(option) {\r\n    const item = document.createElement('span')\r\n    item.tabIndex = 0\r\n    item.setAttribute('role', 'button')\r\n    item.classList.add('ql-picker-item')\r\n    if (option.hasAttribute('value')) {\r\n      item.setAttribute('data-value', option.getAttribute('value'))\r\n    }\r\n    if (option.textContent) {\r\n      item.setAttribute('data-label', option.textContent)\r\n    }\r\n    item.addEventListener('click', () => {\r\n      this.selectItem(item, true)\r\n    })\r\n    item.addEventListener('keydown', (event) => {\r\n      switch (event.key) {\r\n        case 'Enter':\r\n          this.selectItem(item, true)\r\n          event.preventDefault()\r\n          break\r\n        case 'Escape':\r\n          this.escape()\r\n          event.preventDefault()\r\n          break\r\n        default:\r\n      }\r\n    })\r\n\r\n    return item\r\n  }\r\n\r\n  buildLabel() {\r\n    const label = document.createElement('span')\r\n    label.classList.add('ql-picker-label')\r\n    label.innerHTML = `\r\n      <svg viewbox=\"0 0 18 18\">\r\n        <polygon class=\"ql-stroke\" points=\"7 11 9 13 11 11 7 11\"></polygon>\r\n        <polygon class=\"ql-stroke\" points=\"7 7 9 5 11 7 7 7\"></polygon>\r\n      </svg>\r\n    `\r\n    label.tabIndex = 0\r\n    label.setAttribute('role', 'button')\r\n    label.setAttribute('aria-expanded', 'false')\r\n    this.container.appendChild(label)\r\n    return label\r\n  }\r\n\r\n  buildOptions() {\r\n    const options = document.createElement('span')\r\n    options.classList.add('ql-picker-options')\r\n\r\n    // Don't want screen readers to read this until options are visible\r\n    options.setAttribute('aria-hidden', 'true')\r\n    options.tabIndex = -1\r\n\r\n    // Need a unique id for aria-controls\r\n    options.id = `ql-picker-options-${optionsCounter}`\r\n    optionsCounter += 1\r\n    this.label.setAttribute('aria-controls', options.id)\r\n\r\n    this.options = options\r\n\r\n    Array.from(this.select.options).forEach((option: any) => {\r\n      const item = this.buildItem(option)\r\n      options.appendChild(item)\r\n      if (option.selected === true) {\r\n        this.selectItem(item)\r\n      }\r\n    })\r\n    this.container.appendChild(options)\r\n  }\r\n\r\n  buildPicker() {\r\n    Array.from(this.select.attributes).forEach((item: any) => {\r\n      this.container.setAttribute(item.name, item.value)\r\n    })\r\n    this.container.classList.add('ql-picker')\r\n    this.label = this.buildLabel()\r\n    this.buildOptions()\r\n  }\r\n\r\n  escape() {\r\n    // Close menu and return focus to trigger label\r\n    this.close()\r\n    // Need setTimeout for accessibility to ensure that the browser executes\r\n    // focus on the next process thread and after any DOM content changes\r\n    setTimeout(() => this.label.focus(), 1)\r\n  }\r\n\r\n  close() {\r\n    this.container.classList.remove('ql-expanded')\r\n    this.label.setAttribute('aria-expanded', 'false')\r\n    this.options.setAttribute('aria-hidden', 'true')\r\n  }\r\n\r\n  selectItem(item, trigger = false) {\r\n    const selected = this.container.querySelector('.ql-selected')\r\n    if (item === selected) return\r\n    if (!isNullOrUndefined(selected)) {\r\n      selected.classList.remove('ql-selected')\r\n    }\r\n    if (isNullOrUndefined(item)) return\r\n    item.classList.add('ql-selected')\r\n    this.select.selectedIndex = Array.from(item.parentNode.children).indexOf(\r\n      item,\r\n    )\r\n    if (item.hasAttribute('data-value')) {\r\n      this.label.setAttribute('data-value', item.getAttribute('data-value'))\r\n    }\r\n    else {\r\n      this.label.removeAttribute('data-value')\r\n    }\r\n    if (item.hasAttribute('data-label')) {\r\n      this.label.setAttribute('data-label', item.getAttribute('data-label'))\r\n    }\r\n    else {\r\n      this.label.removeAttribute('data-label')\r\n    }\r\n    if (trigger) {\r\n      let ev\r\n      if (typeof Event === 'function') {\r\n        ev = new Event('change')\r\n      }\r\n      else {\r\n        ev = document.createEvent('Event')\r\n        ev.initEvent('change', true, true)\r\n      }\r\n      this.select.dispatchEvent(ev)\r\n      this.close()\r\n    }\r\n  }\r\n\r\n  update() {\r\n    let option\r\n    if (this.select.selectedIndex > -1) {\r\n      const item = this.container.querySelector('.ql-picker-options').children[\r\n        this.select.selectedIndex\r\n      ]\r\n      option = this.select.options[this.select.selectedIndex]\r\n      this.selectItem(item)\r\n    }\r\n    else {\r\n      this.selectItem(null)\r\n    }\r\n    const isActive\r\n      = !isNullOrUndefined(option)\r\n        && option !== this.select.querySelector('option[selected]')\r\n\r\n    if (isActive) {\r\n      this.label.classList.add('ql-active')\r\n    }\r\n    else {\r\n      this.label.classList.remove('ql-active')\r\n    }\r\n  }\r\n}\r\n\r\nclass IconPicker extends Picker {\r\n  defaultItem: any\r\n  constructor(select, icons) {\r\n    super(select)\r\n    this.container.classList.add('ql-icon-picker')\r\n    Array.from(this.container.querySelectorAll('.ql-picker-item')).forEach(\r\n      (item: any) => {\r\n        item.innerHTML = icons[item.getAttribute('data-value') || '']\r\n      },\r\n    )\r\n    this.defaultItem = this.container.querySelector('.ql-selected')\r\n    this.selectItem(this.defaultItem, null)\r\n  }\r\n\r\n  selectItem(target, trigger) {\r\n    super.selectItem(target, trigger)\r\n    const item = target || this.defaultItem\r\n    if (this.label.innerHTML === item.innerHTML) return\r\n    this.label.innerHTML = item.innerHTML\r\n  }\r\n}\r\n\r\nclass ColorPicker extends Picker {\r\n  constructor(select, label) {\r\n    super(select)\r\n    this.label.innerHTML = label\r\n    this.container.classList.add('ql-color-picker')\r\n    Array.from(this.container.querySelectorAll('.ql-picker-item'))\r\n      .slice(0, 7)\r\n      .forEach((item: any) => {\r\n        item.classList.add('ql-primary')\r\n      })\r\n  }\r\n\r\n  buildItem(option) {\r\n    const item = super.buildItem(option)\r\n    item.style.backgroundColor = option.getAttribute('value') || ''\r\n    return item\r\n  }\r\n\r\n  selectItem(item, trigger) {\r\n    super.selectItem(item, trigger)\r\n    const colorLabel = this.label.querySelector('.ql-color-label')\r\n    const value = item ? item.getAttribute('data-value') || '' : ''\r\n    if (colorLabel) {\r\n      if (colorLabel.tagName === 'line') {\r\n        colorLabel.style.stroke = value\r\n      }\r\n      else {\r\n        colorLabel.style.fill = value\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\nQuill.register('ui/picker', Picker, true)\r\nQuill.register('ui/icon-picker', IconPicker, true)\r\nQuill.register('ui/color-picker', ColorPicker, true)\r\n\r\nconst ALIGNS = [false, 'center', 'right']\r\n\r\nconst COLORS = [\r\n  '#000000',\r\n  '#e60000',\r\n  '#ff9900',\r\n  '#ffff00',\r\n  '#008a00',\r\n  '#0066cc',\r\n  '#9933ff',\r\n  '#ffffff',\r\n  '#facccc',\r\n  '#ffebcc',\r\n  '#ffffcc',\r\n  '#cce8cc',\r\n  '#cce0f5',\r\n  '#ebd6ff',\r\n  '#bbbbbb',\r\n  '#f06666',\r\n  '#ffc266',\r\n  '#ffff66',\r\n  '#66b966',\r\n  '#66a3e0',\r\n  '#c285ff',\r\n  '#888888',\r\n  '#a10000',\r\n  '#b26b00',\r\n  '#b2b200',\r\n  '#006100',\r\n  '#0047b2',\r\n  '#6b24b2',\r\n  '#444444',\r\n  '#5c0000',\r\n  '#663d00',\r\n  '#666600',\r\n  '#003700',\r\n  '#002966',\r\n  '#3d1466',\r\n]\r\n\r\nconst FONTS = [false, 'serif', 'monospace']\r\n\r\nconst HEADERS = ['1', '2', '3', false]\r\n\r\nconst SIZES = ['small', false, 'large', 'huge']\r\n\r\nSnowTheme.prototype.buildPickers = function (selects, icons) {\r\n  this.pickers = Array.from(selects).map((select: any) => {\r\n    if (select.classList.contains('ql-align')) {\r\n      if (isNullOrUndefined(select.querySelector('option'))) {\r\n        fillSelect(select, ALIGNS)\r\n      }\r\n      return new IconPicker(select, icons.align)\r\n    }\r\n    if (\r\n      select.classList.contains('ql-background')\r\n      || select.classList.contains('ql-color')\r\n    ) {\r\n      const format = select.classList.contains('ql-background')\r\n        ? 'background'\r\n        : 'color'\r\n      if (isNullOrUndefined(select.querySelector('option'))) {\r\n        fillSelect(\r\n          select,\r\n          COLORS,\r\n        )\r\n      }\r\n      return new ColorPicker(select, icons[format])\r\n    }\r\n    if (isNullOrUndefined(select.querySelector('option'))) {\r\n      if (select.classList.contains('ql-font')) {\r\n        fillSelect(select, FONTS)\r\n      }\r\n      else if (select.classList.contains('ql-header')) {\r\n        fillSelect(select, HEADERS)\r\n      }\r\n      else if (select.classList.contains('ql-size')) {\r\n        fillSelect(select, SIZES)\r\n      }\r\n    }\r\n    return new Picker(select)\r\n  })\r\n  const update = () => {\r\n    this.pickers.forEach((picker) => {\r\n      picker.update()\r\n    })\r\n  }\r\n  this.quill.on(Quill.events.EDITOR_CHANGE, update)\r\n}\r\n\r\nfunction fillSelect(select, values, defaultValue = false) {\r\n  values.forEach((value) => {\r\n    const option = document.createElement('option')\r\n    if (value === defaultValue) {\r\n      option.setAttribute('selected', 'selected')\r\n    }\r\n    else {\r\n      option.setAttribute('value', value)\r\n    }\r\n    select.appendChild(option)\r\n  })\r\n}\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"better-picker.es.js","sources":["../../../../src/modules/toolbar/better-picker.ts"],"sourcesContent":["import type TypePicker from 'quill/ui/picker'\r\nimport { EasyColorPicker } from 'quill-easy-color'\r\nimport FluentEditor from '../../core/fluent-editor'\r\n\r\nconst OriginPicker = FluentEditor.import('ui/picker') as typeof TypePicker\r\nexport class Picker extends OriginPicker {\r\n  buildLabel() {\r\n    const label = document.createElement('span')\r\n    label.classList.add('ql-picker-label')\r\n    label.innerHTML = `<i class=\"icon\" />`\r\n    label.tabIndex = 0\r\n    label.setAttribute('role', 'button')\r\n    label.setAttribute('aria-expanded', 'false')\r\n    this.container.appendChild(label)\r\n    return label\r\n  }\r\n\r\n  buildItem(option: HTMLOptionElement) {\r\n    const item = super.buildItem(option)\r\n    const value = option.getAttribute('value')\r\n    item.style.setProperty('--value', value)\r\n    return item\r\n  }\r\n\r\n  selectItem(item: HTMLElement | null, trigger = false) {\r\n    const selected = this.container.querySelector('.ql-selected')\r\n    if (item === selected || item == null) return\r\n    // move ql-selected clear after judge.\r\n    // ql-selected is the class for check mark in picker\r\n    if (selected != null) {\r\n      selected.classList.remove('ql-selected')\r\n    }\r\n    item.classList.add('ql-selected')\r\n    this.select.selectedIndex = Array.from(item.parentNode.children).indexOf(item)\r\n    if (item.hasAttribute('data-value')) {\r\n      this.label.setAttribute('data-value', item.getAttribute('data-value'))\r\n    }\r\n    else {\r\n      this.label.removeAttribute('data-value')\r\n    }\r\n    if (item.hasAttribute('data-label')) {\r\n      this.label.setAttribute('data-label', item.getAttribute('data-label'))\r\n    }\r\n    else {\r\n      this.label.removeAttribute('data-label')\r\n    }\r\n    if (trigger) {\r\n      this.select.dispatchEvent(new Event('change'))\r\n      this.close()\r\n    }\r\n  }\r\n}\r\n\r\nexport class ColorPicker extends EasyColorPicker {\r\n  static clearText: string\r\n  static customText: string\r\n\r\n  constructor(select: HTMLSelectElement, label: string, options: any) {\r\n    super(select, label, options)\r\n  }\r\n\r\n  buildItem(option: HTMLOptionElement) {\r\n    const item = super.buildItem(option)\r\n    item.setAttribute('title', option.getAttribute('value'))\r\n    return item\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAIA,MAAM,eAAe,aAAa,OAAO,WAAW;AAC7C,MAAM,eAAe,aAAa;AAAA,EACvC,aAAa;AACL,UAAA,QAAQ,SAAS,cAAc,MAAM;AACrC,UAAA,UAAU,IAAI,iBAAiB;AACrC,UAAM,YAAY;AAClB,UAAM,WAAW;AACX,UAAA,aAAa,QAAQ,QAAQ;AAC7B,UAAA,aAAa,iBAAiB,OAAO;AACtC,SAAA,UAAU,YAAY,KAAK;AACzB,WAAA;AAAA,EAAA;AAAA,EAGT,UAAU,QAA2B;AAC7B,UAAA,OAAO,MAAM,UAAU,MAAM;AAC7B,UAAA,QAAQ,OAAO,aAAa,OAAO;AACpC,SAAA,MAAM,YAAY,WAAW,KAAK;AAChC,WAAA;AAAA,EAAA;AAAA,EAGT,WAAW,MAA0B,UAAU,OAAO;AACpD,UAAM,WAAW,KAAK,UAAU,cAAc,cAAc;AACxD,QAAA,SAAS,YAAY,QAAQ,KAAM;AAGvC,QAAI,YAAY,MAAM;AACX,eAAA,UAAU,OAAO,aAAa;AAAA,IAAA;AAEpC,SAAA,UAAU,IAAI,aAAa;AAC3B,SAAA,OAAO,gBAAgB,MAAM,KAAK,KAAK,WAAW,QAAQ,EAAE,QAAQ,IAAI;AACzE,QAAA,KAAK,aAAa,YAAY,GAAG;AACnC,WAAK,MAAM,aAAa,cAAc,KAAK,aAAa,YAAY,CAAC;AAAA,IAAA,OAElE;AACE,WAAA,MAAM,gBAAgB,YAAY;AAAA,IAAA;AAErC,QAAA,KAAK,aAAa,YAAY,GAAG;AACnC,WAAK,MAAM,aAAa,cAAc,KAAK,aAAa,YAAY,CAAC;AAAA,IAAA,OAElE;AACE,WAAA,MAAM,gBAAgB,YAAY;AAAA,IAAA;AAEzC,QAAI,SAAS;AACX,WAAK,OAAO,cAAc,IAAI,MAAM,QAAQ,CAAC;AAC7C,WAAK,MAAM;AAAA,IAAA;AAAA,EACb;AAEJ;AAEO,MAAM,oBAAoB,gBAAgB;AAAA,EAI/C,YAAY,QAA2B,OAAe,SAAc;AAC5D,UAAA,QAAQ,OAAO,OAAO;AAAA,EAAA;AAAA,EAG9B,UAAU,QAA2B;AAC7B,UAAA,OAAO,MAAM,UAAU,MAAM;AACnC,SAAK,aAAa,SAAS,OAAO,aAAa,OAAO,CAAC;AAChD,WAAA;AAAA,EAAA;AAEX;"}

package/es/modules/toolbar/index.es.js

@@ -1,6 +1,5 @@
 import Quill from "quill";
 import { isNullOrUndefined } from "../../config/editor.utils.es.js";
-import "./better-picker.es.js";
 import { generateToolbarTip } from "./toolbar-tip.es.js";
 const Delta = Quill.import("delta");
 const Parchment = Quill.import("parchment");

package/es/modules/toolbar/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../../src/modules/toolbar/index.ts"],"sourcesContent":["import type TypeToolbar from 'quill/modules/toolbar'\r\nimport Quill from 'quill'\r\nimport { isNullOrUndefined } from '../../config/editor.utils'\r\nimport './better-picker'\r\n\r\nconst Delta = Quill.import('delta')\r\nconst Parchment = Quill.import('parchment')\r\nconst levels = ['error', 'warn', 'log', 'info'] as const\r\nlet level = 'warn' as const\r\n\r\nfunction debuglogger(method: typeof levels[number], ...args) {\r\n  if (levels.indexOf(method) <= levels.indexOf(level)) {\r\n    console[method](...args) // eslint-disable-line no-console\r\n  }\r\n}\r\n\r\nfunction namespace(ns) {\r\n  return levels.reduce((logger, method) => {\r\n    logger[method] = debuglogger.bind(console, method, ns)\r\n    return logger\r\n  }, {} as Record<typeof levels[number], (...args: any) => void>)\r\n}\r\n\r\nnamespace.level = (newLevel) => {\r\n  level = newLevel\r\n}\r\ndebuglogger.level = namespace.level\r\nconst debug = namespace('quill:toolbar')\r\n\r\nconst Toolbar = Quill.import('modules/toolbar') as typeof TypeToolbar\r\n// let oldClean = Toolbar.DEFAULTS.handlers.clean\r\n\r\nclass BetterToolbar extends Toolbar {\r\n  update(range) {\r\n    const formats = isNullOrUndefined(range) ? {} : this.quill.getFormat(range) as Record<string, any>\r\n    this.controls.forEach((pair) => {\r\n      const [format, input] = pair\r\n      if (input.tagName === 'SELECT') {\r\n        const select = input as HTMLSelectElement\r\n        let option\r\n        if (isNullOrUndefined(range)) {\r\n          option = null\r\n        }\r\n        else if (isNullOrUndefined(formats[format])) {\r\n          option = select.querySelector('option[selected]')\r\n        }\r\n        else if (!Array.isArray(formats[format])) {\r\n          let value = format === 'header' ? formats[format].value : formats[format]\r\n          if (typeof value === 'string') {\r\n            value = value.replace(/\"/g, '\\\\\"')\r\n          }\r\n          option = select.querySelector(`option[value=\"${value}\"]`)\r\n        }\r\n        if (isNullOrUndefined(option)) {\r\n          select.value = '' // TODO make configurable?\r\n          select.selectedIndex = -1\r\n        }\r\n        else {\r\n          option.selected = true\r\n        }\r\n      }\r\n      else if (isNullOrUndefined(range)) {\r\n        input.classList.remove('ql-active')\r\n      }\r\n      else if (input.hasAttribute('value')) {\r\n        // both being null should match (default values)\r\n        // '1' should match with 1 (headers)\r\n        let isActive\r\n          = formats[format] === input.getAttribute('value')\r\n            || (!isNullOrUndefined(formats[format])\r\n              && (formats[format].value === input.getAttribute('value')\r\n                || formats[format].toString() === input.getAttribute('value')))\r\n              || (isNullOrUndefined(formats[format]) && !input.getAttribute('value'))\r\n\r\n        if (!isActive) {\r\n          const checkFormat = formats[format]\r\n          if (checkFormat === 'checked' || checkFormat === 'unchecked') {\r\n            isActive = input.getAttribute('value') === 'check'\r\n          }\r\n        }\r\n\r\n        if (isActive) {\r\n          input.classList.add('ql-active')\r\n        }\r\n        else {\r\n          input.classList.remove('ql-active')\r\n        }\r\n      }\r\n      else {\r\n        if (!isNullOrUndefined(formats[format])) {\r\n          input.classList.add('ql-active')\r\n        }\r\n        else {\r\n          input.classList.remove('ql-active')\r\n        }\r\n      }\r\n    })\r\n  }\r\n\r\n  attach(input: HTMLElement) {\r\n    let format = Array.from(input.classList).find((className) => {\r\n      return className.indexOf('ql-') === 0\r\n    })\r\n    if (!format) return\r\n    format = format.slice('ql-'.length)\r\n\r\n    if (input.tagName === 'BUTTON') {\r\n      input.setAttribute('type', 'button')\r\n    }\r\n\r\n    if (this.handlers[format] == null && this.quill.scroll.query(format) == null) {\r\n      debug.warn('ignoring attaching to nonexistent format', format, input)\r\n      return\r\n    }\r\n\r\n    const eventName = input.tagName === 'SELECT' ? 'change' : 'click'\r\n    input.addEventListener(eventName, (e) => {\r\n      let value: boolean | string\r\n\r\n      if (input.tagName === 'SELECT') {\r\n        const select = input as HTMLSelectElement\r\n        if (select.selectedIndex < 0) return\r\n        const selected = select.options[select.selectedIndex]\r\n\r\n        if (selected.hasAttribute('selected')) {\r\n          value = false\r\n        }\r\n        else {\r\n          value = selected.value || false\r\n        }\r\n      }\r\n      else {\r\n        const button = input as HTMLButtonElement\r\n        if (button.classList.contains('ql-active')) {\r\n          value = false\r\n        }\r\n        else {\r\n          value = button.value || !button.hasAttribute('value')\r\n        }\r\n        e.preventDefault()\r\n      }\r\n\r\n      this.quill.focus({ preventScroll: format === 'screenshot' })\r\n      const [range] = this.quill.selection.getRange()\r\n      if (this.handlers[format] != null) {\r\n        // @ts-ignore\r\n        if (!isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === 'blockquote' || format === 'code-block' || format === 'list' || format === 'indent' || format === 'clean')) {\r\n          return\r\n        }\r\n        this.handlers[format].call(this, value)\r\n      }\r\n      else if (\r\n        // @ts-ignore\r\n        this.quill.scroll.query(format).prototype instanceof Parchment.EmbedBlot\r\n      ) {\r\n        value = prompt(`Enter ${format}`)\r\n        if (!value) return\r\n        this.quill.updateContents(\r\n          new Delta()\r\n            .retain(range.index)\r\n            .delete(range.length)\r\n            .insert({ [format]: value }),\r\n          Quill.sources.USER,\r\n        )\r\n      }\r\n      else {\r\n        // @ts-ignore\r\n        if (!isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === 'blockquote' || format === 'code-block' || format === 'list' || format === 'indent' || format === 'clean')) {\r\n          return\r\n        }\r\n        this.quill.format(format, value, Quill.sources.USER)\r\n      }\r\n\r\n      this.update(range)\r\n    })\r\n    this.controls.push([format, input])\r\n  }\r\n}\r\n\r\nexport default BetterToolbar\r\nexport * from './toolbar-tip'\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../../src/modules/toolbar/index.ts"],"sourcesContent":["import type TypeToolbar from 'quill/modules/toolbar'\r\nimport Quill from 'quill'\r\nimport { isNullOrUndefined } from '../../config/editor.utils'\r\n\r\nconst Delta = Quill.import('delta')\r\nconst Parchment = Quill.import('parchment')\r\nconst levels = ['error', 'warn', 'log', 'info'] as const\r\nlet level = 'warn' as const\r\n\r\nfunction debuglogger(method: typeof levels[number], ...args) {\r\n  if (levels.indexOf(method) <= levels.indexOf(level)) {\r\n    console[method](...args) // eslint-disable-line no-console\r\n  }\r\n}\r\n\r\nfunction namespace(ns) {\r\n  return levels.reduce((logger, method) => {\r\n    logger[method] = debuglogger.bind(console, method, ns)\r\n    return logger\r\n  }, {} as Record<typeof levels[number], (...args: any) => void>)\r\n}\r\n\r\nnamespace.level = (newLevel) => {\r\n  level = newLevel\r\n}\r\ndebuglogger.level = namespace.level\r\nconst debug = namespace('quill:toolbar')\r\n\r\nconst Toolbar = Quill.import('modules/toolbar') as typeof TypeToolbar\r\n\r\nclass BetterToolbar extends Toolbar {\r\n  update(range) {\r\n    const formats = isNullOrUndefined(range) ? {} : this.quill.getFormat(range) as Record<string, any>\r\n    this.controls.forEach((pair) => {\r\n      const [format, input] = pair\r\n      if (input.tagName === 'SELECT') {\r\n        const select = input as HTMLSelectElement\r\n        let option\r\n        if (isNullOrUndefined(range)) {\r\n          option = null\r\n        }\r\n        else if (isNullOrUndefined(formats[format])) {\r\n          option = select.querySelector('option[selected]')\r\n        }\r\n        else if (!Array.isArray(formats[format])) {\r\n          let value = format === 'header' ? formats[format].value : formats[format]\r\n          if (typeof value === 'string') {\r\n            value = value.replace(/\"/g, '\\\\\"')\r\n          }\r\n          option = select.querySelector(`option[value=\"${value}\"]`)\r\n        }\r\n        if (isNullOrUndefined(option)) {\r\n          select.value = '' // TODO make configurable?\r\n          select.selectedIndex = -1\r\n        }\r\n        else {\r\n          option.selected = true\r\n        }\r\n      }\r\n      else if (isNullOrUndefined(range)) {\r\n        input.classList.remove('ql-active')\r\n      }\r\n      else if (input.hasAttribute('value')) {\r\n        // both being null should match (default values)\r\n        // '1' should match with 1 (headers)\r\n        let isActive\r\n          = formats[format] === input.getAttribute('value')\r\n            || (!isNullOrUndefined(formats[format])\r\n              && (formats[format].value === input.getAttribute('value')\r\n                || formats[format].toString() === input.getAttribute('value')))\r\n              || (isNullOrUndefined(formats[format]) && !input.getAttribute('value'))\r\n\r\n        if (!isActive) {\r\n          const checkFormat = formats[format]\r\n          if (checkFormat === 'checked' || checkFormat === 'unchecked') {\r\n            isActive = input.getAttribute('value') === 'check'\r\n          }\r\n        }\r\n\r\n        if (isActive) {\r\n          input.classList.add('ql-active')\r\n        }\r\n        else {\r\n          input.classList.remove('ql-active')\r\n        }\r\n      }\r\n      else {\r\n        if (!isNullOrUndefined(formats[format])) {\r\n          input.classList.add('ql-active')\r\n        }\r\n        else {\r\n          input.classList.remove('ql-active')\r\n        }\r\n      }\r\n    })\r\n  }\r\n\r\n  attach(input: HTMLElement) {\r\n    let format = Array.from(input.classList).find((className) => {\r\n      return className.indexOf('ql-') === 0\r\n    })\r\n    if (!format) return\r\n    format = format.slice('ql-'.length)\r\n\r\n    if (input.tagName === 'BUTTON') {\r\n      input.setAttribute('type', 'button')\r\n    }\r\n\r\n    if (this.handlers[format] == null && this.quill.scroll.query(format) == null) {\r\n      debug.warn('ignoring attaching to nonexistent format', format, input)\r\n      return\r\n    }\r\n\r\n    const eventName = input.tagName === 'SELECT' ? 'change' : 'click'\r\n    input.addEventListener(eventName, (e) => {\r\n      let value: boolean | string\r\n\r\n      if (input.tagName === 'SELECT') {\r\n        const select = input as HTMLSelectElement\r\n        if (select.selectedIndex < 0) return\r\n        const selected = select.options[select.selectedIndex]\r\n\r\n        if (selected.hasAttribute('selected')) {\r\n          value = false\r\n        }\r\n        else {\r\n          value = selected.value || false\r\n        }\r\n      }\r\n      else {\r\n        const button = input as HTMLButtonElement\r\n        if (button.classList.contains('ql-active')) {\r\n          value = false\r\n        }\r\n        else {\r\n          value = button.value || !button.hasAttribute('value')\r\n        }\r\n        e.preventDefault()\r\n      }\r\n\r\n      this.quill.focus({ preventScroll: format === 'screenshot' })\r\n      const [range] = this.quill.selection.getRange()\r\n      if (this.handlers[format] != null) {\r\n        // @ts-ignore\r\n        if (!isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === 'blockquote' || format === 'code-block' || format === 'list' || format === 'indent' || format === 'clean')) {\r\n          return\r\n        }\r\n        this.handlers[format].call(this, value)\r\n      }\r\n      else if (\r\n        // @ts-ignore\r\n        this.quill.scroll.query(format).prototype instanceof Parchment.EmbedBlot\r\n      ) {\r\n        value = prompt(`Enter ${format}`)\r\n        if (!value) return\r\n        this.quill.updateContents(\r\n          new Delta()\r\n            .retain(range.index)\r\n            .delete(range.length)\r\n            .insert({ [format]: value }),\r\n          Quill.sources.USER,\r\n        )\r\n      }\r\n      else {\r\n        // @ts-ignore\r\n        if (!isNullOrUndefined(window.quillIsIntable) && window.quillIsIntable === true && (format === 'blockquote' || format === 'code-block' || format === 'list' || format === 'indent' || format === 'clean')) {\r\n          return\r\n        }\r\n        this.quill.format(format, value, Quill.sources.USER)\r\n      }\r\n\r\n      this.update(range)\r\n    })\r\n    this.controls.push([format, input])\r\n  }\r\n}\r\n\r\nexport default BetterToolbar\r\nexport * from './toolbar-tip'\r\n"],"names":[],"mappings":"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"}

package/es/modules/toolbar/toolbar-tip.es.js

@@ -1,4 +1,5 @@
 import "../../config/index.es.js";
+import { isString } from "../../utils/is.es.js";
 import { CHANGE_LANGUAGE_EVENT } from "../../config/editor.config.es.js";
 function generateToolbarTip(QuillToolbarTip) {
   return class extends QuillToolbarTip {
@@ -17,7 +18,39 @@ function generateToolbarTip(QuillToolbarTip) {
     resolveOptions(options) {
       const result = super.resolveOptions(options);
       if (!this.quill.lang) return result;
+      const shortKeyMap = {
+        "bold": "Ctrl + B",
+        "italic": "Ctrl + I",
+        "underline": "Ctrl + U",
+        "strike": "Ctrl + D",
+        "clean": "Ctrl + /",
+        "align-left": "Alt + L",
+        "align-center": "Alt + C",
+        "align-right": "Alt + R",
+        "align-justify": "Alt + J",
+        "indent-+1": "Ctrl + ]",
+        "indent--1": "Ctrl + [",
+        "script-sub": "Ctrl + ;",
+        "script-super": "Ctrl + '",
+        "code": "Ctrl + E",
+        "direction-rtl": "Ctrl + R",
+        "direction-ltr": "Ctrl + L",
+        "undo": "Ctrl + Z",
+        "redo": "Ctrl + shift + Z",
+        "color": "Ctrl + Alt + C",
+        "background": "Ctrl + Alt + B",
+        "link": "Ctrl + K"
+      };
+      const shortcutModule = this.quill.getModule("shortcut-key");
+      const getShortKey = (name) => {
+        if (!shortcutModule) return "";
+        const shortKey = shortKeyMap[name];
+        return shortKey ? `
+${shortKey}` : "";
+      };
       const btnTips = [
+        "color",
+        "background",
         "bold",
         "italic",
         "strike",
@@ -34,25 +67,23 @@ function generateToolbarTip(QuillToolbarTip) {
         "emoji",
         "video",
         "screenshot",
-        "better-table",
         "code-block",
         "formula",
         "format-painter",
-        "header-list"
+        "header-list",
+        "table-up"
       ].reduce((map, name) => {
-        map[name] = this.quill.getLangText(name);
+        map[name] = this.quill.getLangText(name) + getShortKey(name);
         return map;
       }, {});
       const selectTips = [
-        "color",
-        "background",
         "font",
         "size",
-        "lineheight"
+        "line-height"
       ].reduce((map, name) => {
         map[name] = {
           onShow: () => {
-            return this.quill.getLangText(name);
+            return this.quill.getLangText(name) + getShortKey(name);
           }
         };
         return map;
@@ -77,7 +108,7 @@ function generateToolbarTip(QuillToolbarTip) {
                 value = "normal";
               }
             }
-            return this.quill.getLangText(`${name}-${value}`);
+            return this.quill.getLangText(`${name}-${value}`) + getShortKey(`${name}-${value}`);
           }
         };
         return map;
@@ -92,11 +123,15 @@ function generateToolbarTip(QuillToolbarTip) {
           }
         }
       };
+      const inputTipTextMap = Object.entries(options.tipTextMap).reduce((pre, [key, value]) => {
+        pre[key] = isString(value) ? this.quill.getLangText(value) : value;
+        return pre;
+      }, {});
       return {
         ...result,
         tipTextMap: {
           ...textMap,
-          ...options.tipTextMap
+          ...inputTipTextMap
         }
       };
     }

package/es/modules/toolbar/toolbar-tip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toolbar-tip.es.js","sources":["../../../../src/modules/toolbar/toolbar-tip.ts"],"sourcesContent":["import type { Constructor } from '../../config/types'\r\nimport type FluentEditor from '../../fluent-editor'\r\nimport { CHANGE_LANGUAGE_EVENT } from '../../config'\r\n\r\nexport function generateToolbarTip(QuillToolbarTip: Constructor) {\r\n  return class extends QuillToolbarTip {\r\n    constructor(public quill: FluentEditor, options: Partial<Record<string, any>>) {\r\n      if (!options?.tipTextMap) {\r\n        options.tipTextMap = {}\r\n      }\r\n      super(quill, options)\r\n\r\n      this.quill.emitter.on(CHANGE_LANGUAGE_EVENT, () => {\r\n        this.destroyAllTips()\r\n        this.options = this.resolveOptions(options)\r\n        this.createToolbarTip()\r\n      })\r\n    }\r\n\r\n    resolveOptions(options: Partial<Record<string, any>>): Record<string, any> {\r\n      const result = super.resolveOptions(options)\r\n      if (!this.quill.lang) return result\r\n      const btnTips = [\r\n        'bold',\r\n        'italic',\r\n        'strike',\r\n        'underline',\r\n        'undo',\r\n        'redo',\r\n        'clean',\r\n        'link',\r\n        'divider',\r\n        'blockquote',\r\n        'code',\r\n        'image',\r\n        'file',\r\n        'emoji',\r\n        'video',\r\n        'screenshot',\r\n        'better-table',\r\n        'code-block',\r\n        'formula',\r\n        'format-painter',\r\n        'header-list',\r\n      ].reduce((map, name) => {\r\n        map[name] = this.quill.getLangText(name)\r\n        return map\r\n      }, {} as Record<string, string>)\r\n      const selectTips = [\r\n        'color',\r\n        'background',\r\n        'font',\r\n        'size',\r\n        'lineheight',\r\n      ].reduce((map, name) => {\r\n        map[name] = {\r\n          onShow: () => {\r\n            return this.quill.getLangText(name)\r\n          },\r\n        }\r\n        return map\r\n      }, {})\r\n      const valueControlTips = [\r\n        'list',\r\n        'align',\r\n        'script',\r\n        'indent',\r\n        'header',\r\n        'direction',\r\n      ].reduce((map, name) => {\r\n        map[name] = {\r\n          onShow: (target: HTMLElement, value: string) => {\r\n            if (name === 'direction') {\r\n              value = target.classList.contains('ql-active') ? 'rtl' : 'ltr'\r\n            }\r\n            if (!value) {\r\n              if (name === 'align') {\r\n                value = 'left'\r\n              }\r\n              else if (name === 'header') {\r\n                value = 'normal'\r\n              }\r\n            }\r\n            return this.quill.getLangText(`${name}-${value}`)\r\n          },\r\n        }\r\n        return map\r\n      }, {})\r\n      const textMap = {\r\n        ...btnTips,\r\n        ...valueControlTips,\r\n        ...selectTips,\r\n        fullscreen: {\r\n          onShow: () => {\r\n            return this.quill.getLangText(this.quill.isFullscreen ? 'exit-fullscreen' : 'fullscreen')\r\n          },\r\n        },\r\n      }\r\n      return {\r\n        ...result,\r\n        tipTextMap: {\r\n          ...textMap,\r\n          ...options.tipTextMap,\r\n        },\r\n      }\r\n    }\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAIO,SAAS,mBAAmB,iBAA8B;AAC/D,SAAO,cAAc,gBAAgB;AAAA,IACnC,YAAmB,OAAqB,SAAuC;AACzE,UAAA,EAAC,mCAAS,aAAY;AACxB,gBAAQ,aAAa,CAAC;AAAA,MAAA;AAExB,YAAM,OAAO,OAAO;AAJH,WAAA,QAAA;AAMjB,WAAK,MAAM,QAAQ,GAAG,uBAAuB,MAAM;AACjD,aAAK,eAAe;AACf,aAAA,UAAU,KAAK,eAAe,OAAO;AAC1C,aAAK,iBAAiB;AAAA,MAAA,CACvB;AAAA,IAAA;AAAA,IAGH,eAAe,SAA4D;AACnE,YAAA,SAAS,MAAM,eAAe,OAAO;AAC3C,UAAI,CAAC,KAAK,MAAM,KAAa,QAAA;AAC7B,YAAM,UAAU;AAAA,QACd;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA,EACA,OAAO,CAAC,KAAK,SAAS;AACtB,YAAI,IAAI,IAAI,KAAK,MAAM,YAAY,IAAI;AAChC,eAAA;AAAA,MACT,GAAG,EAA4B;AAC/B,YAAM,aAAa;AAAA,QACjB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA,EACA,OAAO,CAAC,KAAK,SAAS;AACtB,YAAI,IAAI,IAAI;AAAA,UACV,QAAQ,MAAM;AACL,mBAAA,KAAK,MAAM,YAAY,IAAI;AAAA,UAAA;AAAA,QAEtC;AACO,eAAA;AAAA,MACT,GAAG,EAAE;AACL,YAAM,mBAAmB;AAAA,QACvB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA,EACA,OAAO,CAAC,KAAK,SAAS;AACtB,YAAI,IAAI,IAAI;AAAA,UACV,QAAQ,CAAC,QAAqB,UAAkB;AAC9C,gBAAI,SAAS,aAAa;AACxB,sBAAQ,OAAO,UAAU,SAAS,WAAW,IAAI,QAAQ;AAAA,YAAA;AAE3D,gBAAI,CAAC,OAAO;AACV,kBAAI,SAAS,SAAS;AACZ,wBAAA;AAAA,cAAA,WAED,SAAS,UAAU;AAClB,wBAAA;AAAA,cAAA;AAAA,YACV;AAEF,mBAAO,KAAK,MAAM,YAAY,GAAG,IAAI,IAAI,KAAK,EAAE;AAAA,UAAA;AAAA,QAEpD;AACO,eAAA;AAAA,MACT,GAAG,EAAE;AACL,YAAM,UAAU;AAAA,QACd,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,YAAY;AAAA,UACV,QAAQ,MAAM;AACZ,mBAAO,KAAK,MAAM,YAAY,KAAK,MAAM,eAAe,oBAAoB,YAAY;AAAA,UAAA;AAAA,QAC1F;AAAA,MAEJ;AACO,aAAA;AAAA,QACL,GAAG;AAAA,QACH,YAAY;AAAA,UACV,GAAG;AAAA,UACH,GAAG,QAAQ;AAAA,QAAA;AAAA,MAEf;AAAA,IAAA;AAAA,EAEJ;AACF;"}
+{"version":3,"file":"toolbar-tip.es.js","sources":["../../../../src/modules/toolbar/toolbar-tip.ts"],"sourcesContent":["import type { Constructor } from '../../config/types'\r\nimport type FluentEditor from '../../fluent-editor'\r\nimport { CHANGE_LANGUAGE_EVENT } from '../../config'\r\nimport { isString } from '../../utils/is'\r\n\r\nexport function generateToolbarTip(QuillToolbarTip: Constructor) {\r\n  return class extends QuillToolbarTip {\r\n    constructor(public quill: FluentEditor, options: Partial<Record<string, any>>) {\r\n      if (!options?.tipTextMap) {\r\n        options.tipTextMap = {}\r\n      }\r\n      super(quill, options)\r\n\r\n      this.quill.emitter.on(CHANGE_LANGUAGE_EVENT, () => {\r\n        this.destroyAllTips()\r\n        this.options = this.resolveOptions(options)\r\n        this.createToolbarTip()\r\n      })\r\n    }\r\n\r\n    resolveOptions(options: Partial<Record<string, any>>): Record<string, any> {\r\n      const result = super.resolveOptions(options)\r\n      if (!this.quill.lang) return result\r\n      const shortKeyMap = {\r\n        'bold': 'Ctrl + B',\r\n        'italic': 'Ctrl + I',\r\n        'underline': 'Ctrl + U',\r\n        'strike': 'Ctrl + D',\r\n        'clean': 'Ctrl + /',\r\n        'align-left': 'Alt + L',\r\n        'align-center': 'Alt + C',\r\n        'align-right': 'Alt + R',\r\n        'align-justify': 'Alt + J',\r\n        'indent-+1': 'Ctrl + ]',\r\n        'indent--1': 'Ctrl + [',\r\n        'script-sub': 'Ctrl + ;',\r\n        'script-super': 'Ctrl + \\'',\r\n        'code': 'Ctrl + E',\r\n        'direction-rtl': 'Ctrl + R',\r\n        'direction-ltr': 'Ctrl + L',\r\n        'undo': 'Ctrl + Z',\r\n        'redo': 'Ctrl + shift + Z',\r\n        'color': 'Ctrl + Alt + C',\r\n        'background': 'Ctrl + Alt + B',\r\n        'link': 'Ctrl + K',\r\n      }\r\n      const shortcutModule = this.quill.getModule('shortcut-key')\r\n      const getShortKey = (name: string) => {\r\n        if (!shortcutModule) return ''\r\n        const shortKey = shortKeyMap[name]\r\n        return shortKey ? `\\n${shortKey}` : ''\r\n      }\r\n      const btnTips = [\r\n        'color',\r\n        'background',\r\n        'bold',\r\n        'italic',\r\n        'strike',\r\n        'underline',\r\n        'undo',\r\n        'redo',\r\n        'clean',\r\n        'link',\r\n        'divider',\r\n        'blockquote',\r\n        'code',\r\n        'image',\r\n        'file',\r\n        'emoji',\r\n        'video',\r\n        'screenshot',\r\n        'code-block',\r\n        'formula',\r\n        'format-painter',\r\n        'header-list',\r\n        'table-up',\r\n      ].reduce((map, name) => {\r\n        map[name] = this.quill.getLangText(name) + getShortKey(name)\r\n        return map\r\n      }, {} as Record<string, string>)\r\n      const selectTips = [\r\n        'font',\r\n        'size',\r\n        'line-height',\r\n      ].reduce((map, name) => {\r\n        map[name] = {\r\n          onShow: () => {\r\n            return this.quill.getLangText(name) + getShortKey(name)\r\n          },\r\n        }\r\n        return map\r\n      }, {})\r\n      const valueControlTips = [\r\n        'list',\r\n        'align',\r\n        'script',\r\n        'indent',\r\n        'header',\r\n        'direction',\r\n      ].reduce((map, name) => {\r\n        map[name] = {\r\n          onShow: (target: HTMLElement, value: string) => {\r\n            if (name === 'direction') {\r\n              value = target.classList.contains('ql-active') ? 'rtl' : 'ltr'\r\n            }\r\n            if (!value) {\r\n              if (name === 'align') {\r\n                value = 'left'\r\n              }\r\n              else if (name === 'header') {\r\n                value = 'normal'\r\n              }\r\n            }\r\n            return this.quill.getLangText(`${name}-${value}`) + getShortKey(`${name}-${value}`)\r\n          },\r\n        }\r\n        return map\r\n      }, {})\r\n      const textMap = {\r\n        ...btnTips,\r\n        ...valueControlTips,\r\n        ...selectTips,\r\n        fullscreen: {\r\n          onShow: () => {\r\n            return this.quill.getLangText(this.quill.isFullscreen ? 'exit-fullscreen' : 'fullscreen')\r\n          },\r\n        },\r\n      }\r\n      const inputTipTextMap = Object.entries(options.tipTextMap).reduce((pre, [key, value]) => {\r\n        pre[key] = isString(value) ? this.quill.getLangText(value) : value\r\n        return pre\r\n      }, {})\r\n      return {\r\n        ...result,\r\n        tipTextMap: {\r\n          ...textMap,\r\n          ...inputTipTextMap,\r\n        },\r\n      }\r\n    }\r\n  }\r\n}\r\n"],"names":[],"mappings":"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"}