@ones-editor/editor 2.1.7-beta.35 → 2.1.7-beta.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -39,12 +39,13 @@ export default abstract class CommandBar extends TypedEmitter<CommandBarEvents>
39
39
  private handleItemMouseLeave;
40
40
  protected handleItemClick: (event: MouseEvent | TouchEvent) => void;
41
41
  private showSubCommandBar;
42
+ getSubBarCreateOptions(item: CommandItem): CommandBarOptions;
42
43
  isInCommandBar(target: EventTarget | null): boolean;
43
44
  createCommandItem(item: CommandItem): CommandItemElement;
44
45
  getItemById(id: string): CommandItem;
45
46
  getSelectedItem(): CommandItem | null;
46
47
  protected getItemElementId(elem: CommandItemElement): string;
47
- protected getItemElementById(id: string): CommandItemElement;
48
+ getItemElementById(id: string): CommandItemElement;
48
49
  protected getParentCommandItemElement(target: EventTarget | null): CommandItemElement | null;
49
50
  protected createCommandBarContent(items: CommandItem[]): HTMLElement;
50
51
  handleWheel: (e: WheelEvent) => void;
@@ -7,6 +7,7 @@ export default class FixedToolbar extends CommandBar {
7
7
  protected initCommandBarElement(elem: HTMLElement): void;
8
8
  protected initItemElement(item: CommandItem, elem: CommandItemElement): void;
9
9
  close(): void;
10
+ getSubBarCreateOptions: (item: CommandItem) => CommandBarOptions;
10
11
  getSubBarOptions: (item: CommandItem) => ManualShowCommandBarOptions;
11
12
  destroy(): void;
12
13
  protected getCommandBarRoot(): HTMLElement | null;
package/dist/index.js CHANGED
@@ -913,6 +913,9 @@ div.tippy-box button {
913
913
  --separator-color: #e8e8e8;
914
914
  --warn-color: #fdf4f4;
915
915
  }
916
+ .editor-command-bar.toolbar .command-item.hidden, .editor-command-bar.menu .command-item.hidden {
917
+ display: none;
918
+ }
916
919
  .editor-command-bar.fixed.toolbar {
917
920
  box-shadow: none;
918
921
  }
@@ -8179,6 +8182,9 @@ div.editor-root.compact.no-heading-collapse.no-block-menu > .editor-content {
8179
8182
  .editor-command-bar.toolbar[data-fixed-toolbar-id=main-toolbar] .command-item[data-button-id=paragraph] .toolbar-item-name-container {
8180
8183
  flex-grow: 1;
8181
8184
  flex-shrink: 0;
8185
+ }
8186
+ [data-command-bar-id=main-toolbar-more-menu] .editor-command-bar.toolbar .command-item.hidden, [data-command-bar-id=main-toolbar-more-menu] .editor-command-bar.menu .command-item.hidden {
8187
+ display: flex;
8182
8188
  }`)),document.head.appendChild(t)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
8183
8189
  var __defProp = Object.defineProperty;
8184
8190
  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -8914,7 +8920,7 @@ var __publicField = (obj, key, value) => {
8914
8920
  return ResizeObserverSPI2;
8915
8921
  }();
8916
8922
  var observers = typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : new MapShim();
8917
- var ResizeObserver = function() {
8923
+ var ResizeObserver$1 = function() {
8918
8924
  function ResizeObserver2(callback) {
8919
8925
  if (!(this instanceof ResizeObserver2)) {
8920
8926
  throw new TypeError("Cannot call a class as a function.");
@@ -8933,7 +8939,7 @@ var __publicField = (obj, key, value) => {
8933
8939
  "unobserve",
8934
8940
  "disconnect"
8935
8941
  ].forEach(function(method) {
8936
- ResizeObserver.prototype[method] = function() {
8942
+ ResizeObserver$1.prototype[method] = function() {
8937
8943
  var _a;
8938
8944
  return (_a = observers.get(this))[method].apply(_a, arguments);
8939
8945
  };
@@ -8942,7 +8948,7 @@ var __publicField = (obj, key, value) => {
8942
8948
  if (typeof global$1.ResizeObserver !== "undefined") {
8943
8949
  return global$1.ResizeObserver;
8944
8950
  }
8945
- return ResizeObserver;
8951
+ return ResizeObserver$1;
8946
8952
  }();
8947
8953
  class AssertError extends Error {
8948
8954
  constructor(message) {
@@ -10408,9 +10414,9 @@ var __publicField = (obj, key, value) => {
10408
10414
  const fontStyle = style2.getPropertyValue("font-style");
10409
10415
  const fontVariant = style2.getPropertyValue("font-variant");
10410
10416
  const fontWeight = style2.getPropertyValue("font-weight");
10411
- const fontSize = style2.getPropertyValue("font-size");
10417
+ const fontSize2 = style2.getPropertyValue("font-size");
10412
10418
  const fontFamily = style2.getPropertyValue("font-family");
10413
- elementFont = `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize} ${fontFamily}`.replace(/ +/g, " ").trim();
10419
+ elementFont = `${fontStyle} ${fontVariant} ${fontWeight} ${fontSize2} ${fontFamily}`.replace(/ +/g, " ").trim();
10414
10420
  return elementFont;
10415
10421
  }
10416
10422
  function getTextWidth(text2, font) {
@@ -10833,13 +10839,13 @@ var __publicField = (obj, key, value) => {
10833
10839
  function replaceAllCaseInsensitive(str, find, replace) {
10834
10840
  return str.replace(new RegExp(escapeRegExp(find), "gi"), replace);
10835
10841
  }
10836
- function overflowText(text2, fontSize, maxwidth) {
10842
+ function overflowText(text2, fontSize2, maxwidth) {
10837
10843
  const canvas = document.createElement("canvas");
10838
10844
  const ctx = canvas.getContext("2d");
10839
10845
  if (!ctx) {
10840
10846
  return null;
10841
10847
  }
10842
- ctx.font = String(fontSize);
10848
+ ctx.font = String(fontSize2);
10843
10849
  const metrics = ctx.measureText(text2);
10844
10850
  if (metrics.width > maxwidth) {
10845
10851
  let i = 0;
@@ -14320,8 +14326,8 @@ var __publicField = (obj, key, value) => {
14320
14326
  } else if (lineHeightStyle.endsWith("pt")) {
14321
14327
  lineHeight = parseFloat(lineHeightStyle) * 4 / 3;
14322
14328
  } else if (lineHeightStyle === "em") {
14323
- const fontSize = parseFloat(style2.getPropertyValue("font-size"));
14324
- lineHeight = fontSize * parseFloat(lineHeightStyle);
14329
+ const fontSize2 = parseFloat(style2.getPropertyValue("font-size"));
14330
+ lineHeight = fontSize2 * parseFloat(lineHeightStyle);
14325
14331
  } else {
14326
14332
  lineHeight = parseFloat(style2.getPropertyValue("font-size")) * 1.2;
14327
14333
  }
@@ -25163,6 +25169,9 @@ var __publicField = (obj, key, value) => {
25163
25169
  if (key === "inline-style-background-color") {
25164
25170
  newStyles.backgroundColor = value;
25165
25171
  }
25172
+ if (key === "inline-style-font-size") {
25173
+ newStyles.fontSize = value;
25174
+ }
25166
25175
  }
25167
25176
  });
25168
25177
  return { classes, attributes: newAttributes, styles: newStyles };
@@ -40311,9 +40320,11 @@ ${codeText}
40311
40320
  if (!elem) {
40312
40321
  return;
40313
40322
  }
40314
- const subBar = _CommandBar.createSubCommandBar(item, (_d = this.closeable) != null ? _d : this, subMenuId ? {
40315
- id: subMenuId
40316
- } : {});
40323
+ const createOptions = {
40324
+ id: subMenuId,
40325
+ ...this.getSubBarCreateOptions(item)
40326
+ };
40327
+ const subBar = _CommandBar.createSubCommandBar(item, (_d = this.closeable) != null ? _d : this, createOptions);
40317
40328
  this.subBar = subBar;
40318
40329
  this.subBar.on("click", (bar2, item2, elem2) => {
40319
40330
  this.emit("click", bar2, item2, elem2);
@@ -40336,6 +40347,11 @@ ${codeText}
40336
40347
  this.subBar.manualShow(elem, this.getSubBarOptions(item));
40337
40348
  addClass(elem, "active");
40338
40349
  }
40350
+ getSubBarCreateOptions(item) {
40351
+ return {
40352
+ id: item.childrenMenuId
40353
+ };
40354
+ }
40339
40355
  isInCommandBar(target) {
40340
40356
  if (!target || !(target instanceof Node)) {
40341
40357
  return false;
@@ -40470,6 +40486,9 @@ ${codeText}
40470
40486
  if (item.element && item.setCloseable) {
40471
40487
  item.setCloseable((_a = this.closeable) != null ? _a : this);
40472
40488
  }
40489
+ if (item.hidden) {
40490
+ addClass(elem, "hidden");
40491
+ }
40473
40492
  });
40474
40493
  if (this.options.footer) {
40475
40494
  const footerElem = createElement("div", ["menu-item", "editor-command-bar", "footer"], null);
@@ -41100,6 +41119,12 @@ ${codeText}
41100
41119
  }
41101
41120
  return true;
41102
41121
  });
41122
+ __publicField(this, "getSubBarCreateOptions", (item) => {
41123
+ const options = {
41124
+ autoClose: true
41125
+ };
41126
+ return options;
41127
+ });
41103
41128
  __publicField(this, "getSubBarOptions", (item) => {
41104
41129
  var _a;
41105
41130
  const options = {
@@ -72275,6 +72300,104 @@ ${codeText}
72275
72300
  }
72276
72301
  }
72277
72302
  }
72303
+ function getColorValue(html, tagPrefix) {
72304
+ const colorIndex = html.indexOf(tagPrefix);
72305
+ if (colorIndex < 0) {
72306
+ return -1;
72307
+ }
72308
+ const endIndex = html.indexOf(">", colorIndex);
72309
+ if (endIndex < 0) {
72310
+ return -1;
72311
+ }
72312
+ const colorValue = html.substring(colorIndex + tagPrefix.length, endIndex);
72313
+ return parseInt(colorValue, 10);
72314
+ }
72315
+ function getColorIndexFromHtml(html, tagPrefix) {
72316
+ const startIndex = getColorValue(html, `<${tagPrefix}`);
72317
+ if (startIndex !== -1) {
72318
+ return {
72319
+ start: true,
72320
+ color: startIndex
72321
+ };
72322
+ }
72323
+ const endIndex = getColorValue(html, `</${tagPrefix}`);
72324
+ if (endIndex !== -1) {
72325
+ return {
72326
+ start: false,
72327
+ color: endIndex
72328
+ };
72329
+ }
72330
+ return {
72331
+ start: false,
72332
+ color: -1
72333
+ };
72334
+ }
72335
+ function applyColorTagToText(htm, attributes) {
72336
+ const html = htm.toLowerCase();
72337
+ {
72338
+ const { start, color } = getColorIndexFromHtml(html, "color-");
72339
+ if (color !== -1) {
72340
+ if (start) {
72341
+ attributes[`style-color-${color}`] = true;
72342
+ } else {
72343
+ delete attributes[`style-color-${color}`];
72344
+ }
72345
+ }
72346
+ }
72347
+ {
72348
+ const { start, color } = getColorIndexFromHtml(html, "background-color-");
72349
+ if (color !== -1) {
72350
+ if (start) {
72351
+ attributes[`style-bg-color-${color}`] = true;
72352
+ } else {
72353
+ delete attributes[`style-bg-color-${color}`];
72354
+ }
72355
+ }
72356
+ }
72357
+ }
72358
+ function getFontSizeValue(html, tagPrefix) {
72359
+ const sizeIndex = html.indexOf(tagPrefix);
72360
+ if (sizeIndex < 0) {
72361
+ return -1;
72362
+ }
72363
+ const endIndex = html.indexOf(">", sizeIndex);
72364
+ if (endIndex < 0) {
72365
+ return -1;
72366
+ }
72367
+ const sizeValue = html.substring(sizeIndex + tagPrefix.length, endIndex);
72368
+ return parseInt(sizeValue, 10);
72369
+ }
72370
+ function getFontSizeIndexFromHtml(html, tagPrefix) {
72371
+ const startIndex = getFontSizeValue(html, `<${tagPrefix}`);
72372
+ if (startIndex !== -1) {
72373
+ return {
72374
+ start: true,
72375
+ size: startIndex
72376
+ };
72377
+ }
72378
+ const endIndex = getFontSizeValue(html, `</${tagPrefix}`);
72379
+ if (endIndex !== -1) {
72380
+ return {
72381
+ start: false,
72382
+ size: endIndex
72383
+ };
72384
+ }
72385
+ return {
72386
+ start: false,
72387
+ size: -1
72388
+ };
72389
+ }
72390
+ function applyFontSizeTagToText(htm, attributes) {
72391
+ const html = htm.toLowerCase();
72392
+ const { start, size } = getFontSizeIndexFromHtml(html, "font-size-");
72393
+ if (size !== -1) {
72394
+ if (start) {
72395
+ attributes["inline-style-font-size"] = `${size}px`;
72396
+ } else {
72397
+ delete attributes["inline-style-font-size"];
72398
+ }
72399
+ }
72400
+ }
72278
72401
  const logger$M = getLogger("token-to-text");
72279
72402
  function tokensToText(tokens, attributes, options) {
72280
72403
  const ops = tokens.map((token) => {
@@ -72310,6 +72433,9 @@ ${codeText}
72310
72433
  if (token.type === "html") {
72311
72434
  const html = token.text;
72312
72435
  applyHtmlToText(html, attributes);
72436
+ applyColorTagToText(html, attributes);
72437
+ applyFontSizeTagToText(html, attributes);
72438
+ return [];
72313
72439
  }
72314
72440
  if (token.type === "br") {
72315
72441
  return [{
@@ -74085,6 +74211,142 @@ ${docStr}
74085
74211
  }
74086
74212
  });
74087
74213
  }
74214
+ const COLORS = [
74215
+ "#e52727",
74216
+ "#eb6414",
74217
+ "#f0a100",
74218
+ "#24b47e",
74219
+ "#0064ff",
74220
+ "#9678d3",
74221
+ "#909090"
74222
+ ];
74223
+ const BACKGROUND_COLORS = [
74224
+ "#fad4d4",
74225
+ "#fbe0d0",
74226
+ "#fceccc",
74227
+ "#d3f0e5",
74228
+ "#d6e9fa",
74229
+ "#eae4f6",
74230
+ "#EDEFF2",
74231
+ "#FA9287",
74232
+ "#FF9F6B",
74233
+ "#FFBD59",
74234
+ "#60D1A4",
74235
+ "#7AAFFF",
74236
+ "#BC9BFA",
74237
+ "#BEBFC2",
74238
+ "#DFE1E5"
74239
+ ];
74240
+ function toCssColor(color) {
74241
+ if (color.startsWith("#")) {
74242
+ return color;
74243
+ }
74244
+ if (color.startsWith("rgba")) {
74245
+ const values = color.substring(5, color.length - 1).split(",");
74246
+ if (values.length === 4) {
74247
+ return `#${parseInt(values[0], 10).toString(16).padStart(2, "0")}${parseInt(values[1], 10).toString(16).padStart(2, "0")}${parseInt(values[2], 10).toString(16).padStart(2, "0")}`;
74248
+ }
74249
+ }
74250
+ if (color.startsWith("rgb")) {
74251
+ const values = color.substring(4, color.length - 1).split(",");
74252
+ if (values.length === 3) {
74253
+ return `#${parseInt(values[0], 10).toString(16).padStart(2, "0")}${parseInt(values[1], 10).toString(16).padStart(2, "0")}${parseInt(values[2], 10).toString(16).padStart(2, "0")}`;
74254
+ }
74255
+ }
74256
+ return color;
74257
+ }
74258
+ function getDistance(color1, color2) {
74259
+ const c1 = color1.substring(1);
74260
+ const c2 = color2.substring(1);
74261
+ const r1 = parseInt(c1.substring(0, 2), 16);
74262
+ const g1 = parseInt(c1.substring(2, 4), 16);
74263
+ const b1 = parseInt(c1.substring(4, 6), 16);
74264
+ const r2 = parseInt(c2.substring(0, 2), 16);
74265
+ const g2 = parseInt(c2.substring(2, 4), 16);
74266
+ const b2 = parseInt(c2.substring(4, 6), 16);
74267
+ return Math.sqrt((r1 - r2) ** 2 + (g1 - g2) ** 2 + (b1 - b2) ** 2);
74268
+ }
74269
+ function getColorIndex(colors, color) {
74270
+ let minDistance = Number.MAX_SAFE_INTEGER;
74271
+ let index2 = -1;
74272
+ for (let i = 0; i < colors.length; i += 1) {
74273
+ const distance = getDistance(colors[i], color);
74274
+ if (distance < minDistance) {
74275
+ minDistance = distance;
74276
+ index2 = i;
74277
+ }
74278
+ }
74279
+ return index2;
74280
+ }
74281
+ function textColor(ts) {
74282
+ ts.addRule("figcaption", {
74283
+ filter: (node) => {
74284
+ if (node.nodeName !== "SPAN") {
74285
+ return false;
74286
+ }
74287
+ const span = node;
74288
+ const style2 = span.style;
74289
+ if (!style2) {
74290
+ return false;
74291
+ }
74292
+ if (style2.color || style2.backgroundColor) {
74293
+ return true;
74294
+ }
74295
+ return false;
74296
+ },
74297
+ replacement: (content, node, options) => {
74298
+ const span = node;
74299
+ const style2 = span.style;
74300
+ const color = toCssColor(style2.color);
74301
+ const backgroundColor = toCssColor(style2.backgroundColor);
74302
+ const prefixes = [];
74303
+ const suffixes = [];
74304
+ if (color) {
74305
+ const colorIndex = getColorIndex(COLORS, color);
74306
+ prefixes.push(`<color-${colorIndex}>`);
74307
+ suffixes.push(`</color-${colorIndex}>`);
74308
+ }
74309
+ if (backgroundColor) {
74310
+ const backgroundColorIndex = getColorIndex(BACKGROUND_COLORS, backgroundColor);
74311
+ prefixes.push(`<background-color-${backgroundColorIndex}>`);
74312
+ suffixes.push(`</background-color-${backgroundColorIndex}>`);
74313
+ }
74314
+ let ret = content;
74315
+ prefixes.forEach((prefix, index2) => {
74316
+ ret = `${prefix}${ret}${suffixes[index2]}`;
74317
+ });
74318
+ return ret;
74319
+ }
74320
+ });
74321
+ }
74322
+ function fontSize(ts) {
74323
+ ts.addRule("figcaption", {
74324
+ filter: (node) => {
74325
+ if (node.nodeName !== "SPAN") {
74326
+ return false;
74327
+ }
74328
+ const span = node;
74329
+ const style2 = span.style;
74330
+ if (!style2) {
74331
+ return false;
74332
+ }
74333
+ if (style2.fontSize) {
74334
+ return true;
74335
+ }
74336
+ return false;
74337
+ },
74338
+ replacement: (content, node, options) => {
74339
+ const span = node;
74340
+ const style2 = span.style;
74341
+ const fontSize2 = style2.fontSize;
74342
+ if (fontSize2) {
74343
+ const fontSizeValue = fontSize2.replace("px", "");
74344
+ return `<font-size-${fontSizeValue}>${content}</font-size-${fontSizeValue}>`;
74345
+ }
74346
+ return content;
74347
+ }
74348
+ });
74349
+ }
74088
74350
  const logger$K = getLogger("html-to-doc");
74089
74351
  const turndownService = new TurndownService();
74090
74352
  turndownService.use(codeListToCode);
@@ -74098,6 +74360,8 @@ ${docStr}
74098
74360
  turndownService.use(turndownPluginGfm.gfm);
74099
74361
  turndownService.use(underline);
74100
74362
  turndownService.use(figcaptionToTextBlock);
74363
+ turndownService.use(textColor);
74364
+ turndownService.use(fontSize);
74101
74365
  function htmlToBlocks$1(html, options) {
74102
74366
  const subDoc = processedHtmlToDocByMarkdown(html, options);
74103
74367
  if (!subDoc) {
@@ -87628,12 +87892,12 @@ ${data2.flowchartText}
87628
87892
  return void 0;
87629
87893
  return fonts[0].trim();
87630
87894
  }
87631
- function textObjectToTextRun(obj, fontSize) {
87895
+ function textObjectToTextRun(obj, fontSize2) {
87632
87896
  var _a;
87633
87897
  let style2;
87634
87898
  style2 = obj.inlineCode ? "InlineCode" : void 0;
87635
87899
  style2 = obj.link ? "Hyperlink" : style2;
87636
- const sizeOfFont = obj.size || fontSize;
87900
+ const sizeOfFont = obj.size || fontSize2;
87637
87901
  const size = sizeOfFont != null ? Math.floor(sizeOfFont * 1.5 + 0.5) : void 0;
87638
87902
  obj.text = (_a = obj.text) == null ? void 0 : _a.replace(/\x00/g, " ");
87639
87903
  return new docx.TextRun({
@@ -87652,11 +87916,11 @@ ${data2.flowchartText}
87652
87916
  highlight: styleBackgroundColorToHighlight(obj.highlight)
87653
87917
  });
87654
87918
  }
87655
- function textObjectToHyperLink(obj, fontSize) {
87919
+ function textObjectToHyperLink(obj, fontSize2) {
87656
87920
  if (obj.link) {
87657
87921
  obj.link = obj.link.replace(/\x00/g, " ");
87658
87922
  return new docx.ExternalHyperlink({
87659
- children: [textObjectToTextRun(obj, fontSize)],
87923
+ children: [textObjectToTextRun(obj, fontSize2)],
87660
87924
  link: obj.link
87661
87925
  });
87662
87926
  }
@@ -88065,11 +88329,11 @@ ${data2.flowchartText}
88065
88329
  async paragraphsFromBlockTexts(obj) {
88066
88330
  if (obj.texts == null)
88067
88331
  return void 0;
88068
- const fontSize = getFontSizeByHeadingLevel(this.defaultFontSize, obj.heading);
88332
+ const fontSize2 = getFontSizeByHeadingLevel(this.defaultFontSize, obj.heading);
88069
88333
  const ret = [];
88070
88334
  for (const text2 of obj.texts) {
88071
88335
  if (text2.link) {
88072
- const link2 = textObjectToHyperLink(text2, fontSize);
88336
+ const link2 = textObjectToHyperLink(text2, fontSize2);
88073
88337
  if (link2) {
88074
88338
  ret.push(link2);
88075
88339
  }
@@ -88094,7 +88358,7 @@ ${data2.flowchartText}
88094
88358
  ret.push(ir);
88095
88359
  continue;
88096
88360
  }
88097
- ret.push(textObjectToTextRun(text2, fontSize));
88361
+ ret.push(textObjectToTextRun(text2, fontSize2));
88098
88362
  }
88099
88363
  return ret;
88100
88364
  }
@@ -88739,7 +89003,7 @@ ${data2.flowchartText}
88739
89003
  }
88740
89004
  class SeparatorItem {
88741
89005
  constructor() {
88742
- __publicField(this, "id", `separator-${Date.now()}`);
89006
+ __publicField(this, "id", `separator-${genId()}`);
88743
89007
  __publicField(this, "type", "separator");
88744
89008
  __publicField(this, "name", "");
88745
89009
  }
@@ -88922,6 +89186,120 @@ ${data2.flowchartText}
88922
89186
  }
88923
89187
  }
88924
89188
  }
89189
+ class MoreItem {
89190
+ constructor(editor) {
89191
+ __publicField(this, "name", i18n$1.t("commands.more"));
89192
+ __publicField(this, "id", "more");
89193
+ __publicField(this, "manualShowChildren", true);
89194
+ __publicField(this, "childrenPlacement", "bottom-start");
89195
+ __publicField(this, "children", []);
89196
+ __publicField(this, "hidden");
89197
+ __publicField(this, "fixedToolbar");
89198
+ __publicField(this, "observer");
89199
+ __publicField(this, "icon", MoreIcon$1);
89200
+ __publicField(this, "childrenType", "toolbar");
89201
+ __publicField(this, "childrenMenuId", "main-toolbar-more-menu");
89202
+ setTimeout(() => {
89203
+ var _a;
89204
+ this.fixedToolbar = (_a = editor.findCustom("main-toolbar-fixed-toolbar")) == null ? void 0 : _a.toolbar;
89205
+ if (this.fixedToolbar) {
89206
+ const content = this.fixedToolbar.content;
89207
+ const toolbar2 = content.closest(".editor-command-bar-root");
89208
+ this.observer = new ResizeObserver(() => {
89209
+ this.updateItems();
89210
+ });
89211
+ this.observer.observe(toolbar2);
89212
+ editor.addCustom("main-toolbar-more-item", () => this);
89213
+ }
89214
+ });
89215
+ }
89216
+ destroy() {
89217
+ var _a;
89218
+ (_a = this.observer) == null ? void 0 : _a.disconnect();
89219
+ }
89220
+ onClick(editor, item) {
89221
+ var _a;
89222
+ const subBar = (_a = this.fixedToolbar) == null ? void 0 : _a.subBar;
89223
+ if (subBar) {
89224
+ subBar.options.autoClose = true;
89225
+ }
89226
+ }
89227
+ updateItems() {
89228
+ const toolbar2 = this.fixedToolbar;
89229
+ if (!toolbar2) {
89230
+ return;
89231
+ }
89232
+ const items = toolbar2.items;
89233
+ const moreIndex = items.findIndex((item) => item === this);
89234
+ if (moreIndex === -1) {
89235
+ return;
89236
+ }
89237
+ const content = toolbar2.content;
89238
+ const toolbarRoot = content.closest(".editor-command-bar-root");
89239
+ const toolbarRect = toolbarRoot.getBoundingClientRect();
89240
+ const toolbarRight = toolbarRect.right;
89241
+ items.forEach((item) => {
89242
+ const elem = toolbar2.getItemElementById(item.id);
89243
+ if (item === this) {
89244
+ addClass(elem, "hidden");
89245
+ } else {
89246
+ removeClass(elem, "hidden");
89247
+ }
89248
+ });
89249
+ const positions = /* @__PURE__ */ new Map();
89250
+ items.forEach((item) => {
89251
+ const elem = toolbar2.getItemElementById(item.id);
89252
+ positions.set(item.id, elem.getBoundingClientRect().right);
89253
+ });
89254
+ const lastItem = moreIndex === items.length - 1 ? items[items.length - 2] : items[items.length - 1];
89255
+ const lastElem = toolbar2.getItemElementById(lastItem.id);
89256
+ if (lastElem.getBoundingClientRect().right <= toolbarRight) {
89257
+ this.hidden = true;
89258
+ items.forEach((item) => {
89259
+ if (item === this) {
89260
+ return;
89261
+ }
89262
+ item.hidden = false;
89263
+ });
89264
+ toolbar2.updateItems(items);
89265
+ return;
89266
+ }
89267
+ let fixedWidth = 0;
89268
+ const last = items[items.length - 1];
89269
+ if (last !== this) {
89270
+ const elem = toolbar2.getItemElementById(last.id);
89271
+ const lastRight = elem.getBoundingClientRect().right;
89272
+ const prevItem = items[moreIndex - 1];
89273
+ const prevElem = toolbar2.getItemElementById(prevItem.id);
89274
+ const prevRight = prevElem.getBoundingClientRect().right;
89275
+ fixedWidth = lastRight - prevRight;
89276
+ }
89277
+ const moreWidth = 24;
89278
+ const maxRight = toolbarRight - moreWidth - fixedWidth - 10;
89279
+ const moreItems = [];
89280
+ items.forEach((item, index2) => {
89281
+ if (item === this) {
89282
+ return;
89283
+ }
89284
+ const right = positions.get(item.id);
89285
+ if (!right) {
89286
+ return;
89287
+ }
89288
+ const isFixedItem = index2 > moreIndex;
89289
+ if (isFixedItem) {
89290
+ item.hidden = false;
89291
+ return;
89292
+ }
89293
+ item.hidden = right > maxRight;
89294
+ if (item.hidden) {
89295
+ moreItems.push(item);
89296
+ }
89297
+ });
89298
+ this.hidden = moreItems.length === 0;
89299
+ this.children = moreItems;
89300
+ toolbar2.updateItems(items);
89301
+ }
89302
+ }
88925
89303
  function getToolbarDefaultItems(editor) {
88926
89304
  return [
88927
89305
  new UndoItem(),
@@ -88953,7 +89331,8 @@ ${data2.flowchartText}
88953
89331
  new InsertItem(editor),
88954
89332
  new SeparatorItem(),
88955
89333
  new FindReplaceItem(),
88956
- new CommentItem()
89334
+ new CommentItem(),
89335
+ new MoreItem(editor)
88957
89336
  ];
88958
89337
  }
88959
89338
  const zhCN = {
@@ -89032,6 +89411,11 @@ ${data2.flowchartText}
89032
89411
  this.toolbar.addListener("click", this.handleClick);
89033
89412
  this.editor.addListener("selectionChanged", this.handleSelectionChanged);
89034
89413
  this.updateState();
89414
+ editor.addCustom("main-toolbar-fixed-toolbar", () => ({
89415
+ toolbar: this.toolbar,
89416
+ destroy: () => {
89417
+ }
89418
+ }));
89035
89419
  }
89036
89420
  destroy() {
89037
89421
  this.toolbar.destroy();
@@ -89268,7 +89652,7 @@ ${data2.flowchartText}
89268
89652
  }
89269
89653
  }
89270
89654
  });
89271
- editor.version = "2.1.7-beta.35";
89655
+ editor.version = "2.1.7-beta.38";
89272
89656
  return editor;
89273
89657
  }
89274
89658
  function isDoc(doc2) {
@@ -89382,7 +89766,7 @@ ${data2.flowchartText}
89382
89766
  }
89383
89767
  }
89384
89768
  OnesEditorToolbar.register(editor);
89385
- editor.version = "2.1.7-beta.35";
89769
+ editor.version = "2.1.7-beta.38";
89386
89770
  return editor;
89387
89771
  }
89388
89772
  async function showDocVersions(editor, options, serverUrl) {
@@ -135247,6 +135631,7 @@ ${data2.flowchartText}
135247
135631
  exports2.MobileCommandHandler = MobileCommandHandler;
135248
135632
  exports2.MobileLinkProvider = MobileLinkProvider;
135249
135633
  exports2.MobileTableCommandProvider = MobileTableCommandProvider;
135634
+ exports2.MoreItem = MoreItem;
135250
135635
  exports2.OnesEditorAutoSuggest = OnesEditorAutoSuggest;
135251
135636
  exports2.OnesEditorCustomDataWrapper = OnesEditorCustomDataWrapper;
135252
135637
  exports2.OnesEditorExclusiveBlock = OnesEditorExclusiveBlock;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ones-editor/editor",
3
- "version": "2.1.7-beta.35",
3
+ "version": "2.1.7-beta.38",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "types": "./dist/index.d.ts",