@formulaxjs/editor 0.1.1 → 0.2.0

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.
@@ -4919,28 +4919,30 @@ var FormulaX = (() => {
4919
4919
 
4920
4920
  // ../kity-runtime/src/vendor/legacy-ui-utils.ts
4921
4921
  function createLegacyUiUtils() {
4922
- return {
4923
- ele: createElement,
4924
- getRectBox,
4925
- on(target, type, fn) {
4926
- addEvent(target, type, fn);
4927
- return this;
4928
- },
4929
- delegate(target, selector, type, fn) {
4930
- delegateEvent(target, selector, type, fn);
4931
- return this;
4932
- },
4933
- publish(topic, ...args) {
4934
- publish(topic, ...args);
4935
- },
4936
- subscribe,
4937
- getClassList
4938
- };
4922
+ return legacyUiUtils;
4939
4923
  }
4924
+ var legacyUiUtils;
4940
4925
  var init_legacy_ui_utils = __esm({
4941
4926
  "../kity-runtime/src/vendor/legacy-ui-utils.ts"() {
4942
4927
  "use strict";
4943
4928
  init_dom_utils();
4929
+ legacyUiUtils = {
4930
+ ele: createElement,
4931
+ getRectBox,
4932
+ on(target, type, fn) {
4933
+ addEvent(target, type, fn);
4934
+ return this;
4935
+ },
4936
+ delegate(target, selector, type, fn) {
4937
+ delegateEvent(target, selector, type, fn);
4938
+ return this;
4939
+ },
4940
+ publish(topic, ...args) {
4941
+ publish(topic, ...args);
4942
+ },
4943
+ subscribe,
4944
+ getClassList
4945
+ };
4944
4946
  }
4945
4947
  });
4946
4948
 
@@ -7357,18 +7359,18 @@ var FormulaX = (() => {
7357
7359
  this.addPoint(p0[0], p0[1]);
7358
7360
  this.addPoint(p3[0], p3[1]);
7359
7361
  for (i = 0; i <= 1; i++) {
7360
- let f = function(t3) {
7361
- return Math.pow(1 - t3, 3) * p0[i] + 3 * Math.pow(1 - t3, 2) * t3 * p1[i] + 3 * (1 - t3) * Math.pow(t3, 2) * p2[i] + Math.pow(t3, 3) * p3[i];
7362
+ let f = function(t) {
7363
+ return Math.pow(1 - t, 3) * p0[i] + 3 * Math.pow(1 - t, 2) * t * p1[i] + 3 * (1 - t) * Math.pow(t, 2) * p2[i] + Math.pow(t, 3) * p3[i];
7362
7364
  };
7363
7365
  let b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i];
7364
7366
  let a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i];
7365
7367
  let c = 3 * p1[i] - 3 * p0[i];
7366
7368
  if (a == 0) {
7367
7369
  if (b == 0) continue;
7368
- let t3 = -c / b;
7369
- if (0 < t3 && t3 < 1) {
7370
- if (i == 0) this.addX(f(t3));
7371
- if (i == 1) this.addY(f(t3));
7370
+ let t = -c / b;
7371
+ if (0 < t && t < 1) {
7372
+ if (i == 0) this.addX(f(t));
7373
+ if (i == 1) this.addY(f(t));
7372
7374
  }
7373
7375
  continue;
7374
7376
  }
@@ -14197,16 +14199,16 @@ var FormulaX = (() => {
14197
14199
  };
14198
14200
  _p[5] = {
14199
14201
  value: function() {
14200
- let t2 = true;
14202
+ let t = true;
14201
14203
  return {
14202
- ".": t2,
14203
- "{": t2,
14204
- "}": t2,
14205
- "[": t2,
14206
- "]": t2,
14207
- "(": t2,
14208
- ")": t2,
14209
- "|": t2
14204
+ ".": t,
14205
+ "{": t,
14206
+ "}": t,
14207
+ "[": t,
14208
+ "]": t,
14209
+ "(": t,
14210
+ ")": t,
14211
+ "|": t
14210
14212
  };
14211
14213
  }
14212
14214
  };
@@ -19969,85 +19971,24 @@ var FormulaX = (() => {
19969
19971
  DEFAULT_FORMULA_ATTRIBUTE: () => DEFAULT_FORMULA_ATTRIBUTE,
19970
19972
  DEFAULT_FORMULA_CLASS: () => DEFAULT_FORMULA_CLASS,
19971
19973
  FORMULA_FLAG_ATTRIBUTE: () => FORMULA_FLAG_ATTRIBUTE,
19972
- FormulaEditor: () => FormulaEditor,
19974
+ FormulaXEditor: () => FormulaXEditor,
19973
19975
  createFormulaElement: () => createFormulaElement,
19974
19976
  createFormulaMarkup: () => createFormulaMarkup,
19975
- editorStyles: () => editorStyles,
19977
+ createKityEditor: () => createKityEditor,
19976
19978
  ensureFormulaXModalStyles: () => ensureFormulaXModalStyles,
19979
+ ensureKityRuntime: () => ensureKityRuntime,
19977
19980
  escapeAttribute: () => escapeAttribute,
19978
19981
  escapeHtml: () => escapeHtml,
19979
19982
  findFormulaElement: () => findFormulaElement,
19980
19983
  formulaXModalStyles: () => formulaXModalStyles,
19981
19984
  getFormulaLatexFromElement: () => getFormulaLatexFromElement,
19982
19985
  isFormulaElement: () => isFormulaElement,
19983
- mountFormulaXKityEditor: () => mountFormulaXKityEditor,
19984
- renderInteractiveHtml: () => renderInteractiveHtml,
19986
+ mountFormulaXEditor: () => mountFormulaXEditor,
19987
+ mountKityEditor: () => mountKityEditor,
19985
19988
  replaceFormulaElement: () => replaceFormulaElement,
19986
- serializeSvgForInsertion: () => serializeSvgForInsertion,
19987
- t: () => t,
19988
- translations: () => translations
19989
+ serializeSvgForInsertion: () => serializeSvgForInsertion
19989
19990
  });
19990
19991
 
19991
- // src/dom-renderer.ts
19992
- var joinPath = (path) => path.join(".");
19993
- var renderInteractiveHtml = (doc2, activePath) => `
19994
- <div class="fx-editor-surface" data-role="surface">
19995
- ${renderChildren(doc2.body, [], activePath)}
19996
- </div>
19997
- `;
19998
- var renderChildren = (nodes, basePath, activePath) => {
19999
- const html = [];
20000
- for (let index = 0; index <= nodes.length; index += 1) {
20001
- const path = joinPath([...basePath, index]);
20002
- const isActive = path === joinPath(activePath);
20003
- html.push(
20004
- `<button class="fx-slot${isActive ? " is-active" : ""}" data-path="${path}" type="button" title="${path}"></button>`
20005
- );
20006
- if (index < nodes.length) {
20007
- html.push(renderNode(nodes[index], [...basePath, index], activePath));
20008
- }
20009
- }
20010
- return html.join("");
20011
- };
20012
- var renderNode = (node, path, activePath) => {
20013
- const pathValue = joinPath(path);
20014
- const isActive = (p) => joinPath(p) === joinPath(activePath);
20015
- switch (node.type) {
20016
- case "text":
20017
- return `<span class="fx-node fx-text" data-node-path="${pathValue}">${node.value}</span>`;
20018
- case "group":
20019
- return `<span class="fx-node fx-group" data-node-path="${pathValue}">${renderChildren(node.body, [...path, 0], activePath)}</span>`;
20020
- case "frac":
20021
- return `<span class="fx-node fx-frac" data-node-path="${pathValue}">
20022
- <span class="fx-frac-num${isActive([...path, 0]) ? " is-active" : ""}" data-path="${joinPath([...path, 0])}">${renderChildren(node.numerator, [...path, 0], activePath)}</span>
20023
- <span class="fx-frac-line"></span>
20024
- <span class="fx-frac-den${isActive([...path, 1]) ? " is-active" : ""}" data-path="${joinPath([...path, 1])}">${renderChildren(node.denominator, [...path, 1], activePath)}</span>
20025
- </span>`;
20026
- case "supsub":
20027
- return `<span class="fx-node fx-supsub" data-node-path="${pathValue}">
20028
- <span class="fx-supsub-base">${renderChildren(node.base, [...path, 0], activePath)}</span>
20029
- <span class="fx-supsub-stack">
20030
- <span class="fx-sup${isActive([...path, 1]) ? " is-active" : ""}" data-path="${joinPath([...path, 1])}">${renderChildren(node.sup ?? [], [...path, 1], activePath)}</span>
20031
- <span class="fx-sub${isActive([...path, 2]) ? " is-active" : ""}" data-path="${joinPath([...path, 2])}">${renderChildren(node.sub ?? [], [...path, 2], activePath)}</span>
20032
- </span>
20033
- </span>`;
20034
- case "sqrt":
20035
- return `<span class="fx-node fx-sqrt" data-node-path="${pathValue}">
20036
- <span class="fx-sqrt-symbol">\u221A</span>
20037
- <span class="fx-sqrt-body${isActive([...path, 0]) ? " is-active" : ""}" data-path="${joinPath([...path, 0])}">${renderChildren(node.value, [...path, 0], activePath)}</span>
20038
- </span>`;
20039
- case "fenced":
20040
- return `<span class="fx-node fx-fenced" data-node-path="${pathValue}">
20041
- <span class="fx-fence">${node.left}</span>
20042
- <span class="fx-fenced-body${isActive([...path, 0]) ? " is-active" : ""}" data-path="${joinPath([...path, 0])}">${renderChildren(node.body, [...path, 0], activePath)}</span>
20043
- <span class="fx-fence">${node.right}</span>
20044
- </span>`;
20045
- case "doc":
20046
- return renderChildren(node.body, [0], activePath);
20047
- }
20048
- throw new Error(`Unsupported node type: ${String(node.type)}`);
20049
- };
20050
-
20051
19992
  // ../core/src/ast.ts
20052
19993
  var text = (value) => ({ type: "text", value });
20053
19994
  var group = (body = []) => ({ type: "group", body });
@@ -20071,125 +20012,11 @@ var FormulaX = (() => {
20071
20012
  body
20072
20013
  });
20073
20014
 
20074
- // ../core/src/traversal.ts
20075
- var resolveContainer = (node, branch) => {
20076
- switch (node.type) {
20077
- case "doc":
20078
- case "group":
20079
- if (branch !== 0) throw new Error("Invalid branch");
20080
- return node.body;
20081
- case "frac":
20082
- if (branch === 0) return node.numerator;
20083
- if (branch === 1) return node.denominator;
20084
- break;
20085
- case "supsub":
20086
- if (branch === 0) return node.base;
20087
- if (branch === 1) return node.sup ?? (node.sup = []);
20088
- if (branch === 2) return node.sub ?? (node.sub = []);
20089
- break;
20090
- case "sqrt":
20091
- if (branch !== 0) throw new Error("Invalid branch");
20092
- return node.value;
20093
- case "fenced":
20094
- if (branch !== 0) throw new Error("Invalid branch");
20095
- return node.body;
20096
- default:
20097
- break;
20098
- }
20099
- throw new Error("Invalid branch");
20100
- };
20101
- var cloneDoc = (node) => structuredClone(node);
20102
- var resolveParent = (root2, path) => {
20103
- if (path.length === 0) {
20104
- return { container: root2.body, index: root2.body.length };
20105
- }
20106
- if (path.length === 1) {
20107
- return { container: root2.body, index: path[0] };
20108
- }
20109
- let current = root2.body[path[0]];
20110
- if (!current) {
20111
- return { container: root2.body, index: path[0] };
20112
- }
20113
- let container = root2.body;
20114
- for (let i2 = 1; i2 < path.length - 2; i2 += 2) {
20115
- const branch = path[i2];
20116
- const index = path[i2 + 1];
20117
- container = resolveContainer(current, branch);
20118
- current = container[index];
20119
- }
20120
- container = resolveContainer(current, path[path.length - 2]);
20121
- return {
20122
- container,
20123
- index: path[path.length - 1] ?? container.length
20124
- };
20125
- };
20126
- var insertAtPath = (root2, path, node) => {
20127
- const next = cloneDoc(root2);
20128
- const { container, index } = resolveParent(next, path);
20129
- container.splice(index, 0, node);
20130
- return next;
20131
- };
20132
- var removeAtPath = (root2, path) => {
20133
- const next = cloneDoc(root2);
20134
- const { container, index } = resolveParent(next, path);
20135
- if (index > 0) {
20136
- container.splice(index - 1, 1);
20137
- }
20138
- return next;
20139
- };
20140
-
20141
- // ../core/src/transaction.ts
20142
- var FormulaTransaction = class {
20143
- doc;
20144
- selection;
20145
- constructor(state) {
20146
- this.doc = structuredClone(state.doc);
20147
- this.selection = structuredClone(state.selection);
20148
- }
20149
- insert(node) {
20150
- this.doc = insertAtPath(this.doc, this.selection.focus, node);
20151
- this.selection = {
20152
- anchor: [...this.selection.focus],
20153
- focus: [...this.selection.focus.slice(0, -1), (this.selection.focus.at(-1) ?? 0) + 1]
20154
- };
20155
- return this;
20156
- }
20157
- deleteBackward() {
20158
- this.doc = removeAtPath(this.doc, this.selection.focus);
20159
- this.selection = {
20160
- anchor: [...this.selection.focus.slice(0, -1), Math.max((this.selection.focus.at(-1) ?? 0) - 1, 0)],
20161
- focus: [...this.selection.focus.slice(0, -1), Math.max((this.selection.focus.at(-1) ?? 0) - 1, 0)]
20162
- };
20163
- return this;
20164
- }
20165
- moveFocus(nextFocus) {
20166
- this.selection = {
20167
- anchor: [...nextFocus],
20168
- focus: [...nextFocus]
20169
- };
20170
- return this;
20171
- }
20172
- apply() {
20173
- return {
20174
- doc: this.doc,
20175
- selection: this.selection
20176
- };
20177
- }
20178
- };
20179
-
20180
20015
  // ../core/src/commands.ts
20181
- var insertText = (value) => (state) => new FormulaTransaction(state).insert(text(value)).apply();
20182
- var insertFraction = () => (state) => new FormulaTransaction(state).insert(frac([], [])).apply();
20183
- var insertSuperscript = () => (state) => new FormulaTransaction(state).insert(supsub([text("x")], [text("2")])).apply();
20184
- var insertSubscript = () => (state) => new FormulaTransaction(state).insert(supsub([text("x")], void 0, [text("i")])).apply();
20185
- var insertSqrt = () => (state) => new FormulaTransaction(state).insert(sqrt([])).apply();
20186
- var insertFenced = (left = "(", right = ")") => (state) => new FormulaTransaction(state).insert(fenced(left, right, [])).apply();
20187
- var backspace = () => (state) => new FormulaTransaction(state).deleteBackward().apply();
20188
20016
  var createEmptyState = () => ({
20189
20017
  doc: { type: "doc", body: [] },
20190
20018
  selection: { anchor: [0], focus: [0] }
20191
20019
  });
20192
- var applyCommand = (state, command) => command(state);
20193
20020
 
20194
20021
  // ../core/src/latex.ts
20195
20022
  var isAlpha = (char) => /[a-zA-Z]/.test(char);
@@ -20447,291 +20274,6 @@ var FormulaX = (() => {
20447
20274
  };
20448
20275
  var parseLatex = (input) => new LatexParser(input).parse();
20449
20276
 
20450
- // src/styles.ts
20451
- var editorStyles = `
20452
- @keyframes fx-blink {
20453
- 0%, 50% { opacity: 1; }
20454
- 51%, 100% { opacity: 0; }
20455
- }
20456
- .fx-editor {
20457
- border: 1px solid #d8d4c7;
20458
- border-radius: 2px;
20459
- background: #fffefb;
20460
- box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
20461
- padding: 24px 28px;
20462
- font-family: Cambria, 'Times New Roman', serif;
20463
- font-size: 25px;
20464
- line-height: 1.7;
20465
- min-height: 120px;
20466
- position: relative;
20467
- }
20468
- .fx-editor:focus-within {
20469
- border-color: #7bbb59;
20470
- box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 0 0 3px rgba(123, 187, 89, 0.18);
20471
- }
20472
- .fx-editor-surface {
20473
- display: flex;
20474
- flex-wrap: wrap;
20475
- align-items: baseline;
20476
- gap: 3px;
20477
- cursor: text;
20478
- }
20479
- .fx-node {
20480
- position: relative;
20481
- display: inline-flex;
20482
- align-items: center;
20483
- padding: 2px 3px;
20484
- border-radius: 2px;
20485
- transition: background 0.12s ease;
20486
- }
20487
- .fx-node:hover {
20488
- background: rgba(122, 186, 89, 0.12);
20489
- }
20490
- .fx-text {
20491
- color: #2b2925;
20492
- }
20493
- .fx-group {
20494
- background: rgba(243, 241, 230, 0.82);
20495
- border: 1px dashed #c8c0a8;
20496
- }
20497
- .fx-frac {
20498
- display: inline-flex;
20499
- flex-direction: column;
20500
- align-items: center;
20501
- vertical-align: middle;
20502
- padding: 0 5px;
20503
- }
20504
- .fx-frac-num, .fx-frac-den {
20505
- display: flex;
20506
- flex-wrap: wrap;
20507
- align-items: center;
20508
- justify-content: center;
20509
- padding: 3px 8px;
20510
- min-width: 24px;
20511
- min-height: 28px;
20512
- border-radius: 2px;
20513
- transition: all 0.15s ease;
20514
- }
20515
- .fx-frac-num {
20516
- border-bottom: 2px solid #2e2c29;
20517
- padding-bottom: 6px;
20518
- }
20519
- .fx-frac-den {
20520
- border-top: 2px solid #2e2c29;
20521
- padding-top: 6px;
20522
- }
20523
- .fx-frac-num:hover, .fx-frac-den:hover {
20524
- background: rgba(122, 186, 89, 0.1);
20525
- }
20526
- .fx-frac-num.is-active, .fx-frac-den.is-active {
20527
- background: rgba(122, 186, 89, 0.16);
20528
- box-shadow: inset 0 0 0 1px rgba(83, 184, 86, 0.5);
20529
- }
20530
- .fx-supsub {
20531
- display: inline-flex;
20532
- align-items: baseline;
20533
- gap: 0;
20534
- }
20535
- .fx-supsub-base {
20536
- display: inline-flex;
20537
- align-items: center;
20538
- padding: 0 2px;
20539
- }
20540
- .fx-supsub-stack {
20541
- display: inline-flex;
20542
- flex-direction: column;
20543
- align-items: flex-start;
20544
- font-size: 0.65em;
20545
- margin-left: 2px;
20546
- }
20547
- .fx-sup, .fx-sub {
20548
- display: flex;
20549
- align-items: center;
20550
- min-width: 16px;
20551
- min-height: 20px;
20552
- padding: 0 4px;
20553
- border-radius: 2px;
20554
- transition: all 0.15s ease;
20555
- }
20556
- .fx-sup {
20557
- vertical-align: super;
20558
- }
20559
- .fx-sub {
20560
- vertical-align: sub;
20561
- }
20562
- .fx-sup:hover, .fx-sub:hover {
20563
- background: rgba(122, 186, 89, 0.1);
20564
- }
20565
- .fx-sup.is-active, .fx-sub.is-active {
20566
- background: rgba(122, 186, 89, 0.16);
20567
- box-shadow: inset 0 0 0 1px rgba(83, 184, 86, 0.5);
20568
- }
20569
- .fx-sqrt {
20570
- display: inline-flex;
20571
- align-items: baseline;
20572
- }
20573
- .fx-sqrt-symbol {
20574
- font-size: 1.1em;
20575
- color: #2e2c29;
20576
- margin-right: 2px;
20577
- }
20578
- .fx-sqrt-body {
20579
- display: inline-flex;
20580
- align-items: center;
20581
- border-top: 2px solid #2e2c29;
20582
- padding: 4px 6px 0;
20583
- margin-left: 2px;
20584
- }
20585
- .fx-sqrt-body:hover {
20586
- background: rgba(122, 186, 89, 0.1);
20587
- }
20588
- .fx-sqrt-body.is-active {
20589
- background: rgba(122, 186, 89, 0.16);
20590
- }
20591
- .fx-fenced {
20592
- display: inline-flex;
20593
- align-items: center;
20594
- background: rgba(243, 241, 230, 0.78);
20595
- border-radius: 3px;
20596
- padding: 0 4px;
20597
- }
20598
- .fx-fence {
20599
- color: #59554d;
20600
- font-size: 1.2em;
20601
- padding: 0 2px;
20602
- }
20603
- .fx-fenced-body {
20604
- display: inline-flex;
20605
- align-items: center;
20606
- padding: 0 6px;
20607
- }
20608
- .fx-fenced-body:hover {
20609
- background: rgba(122, 186, 89, 0.1);
20610
- border-radius: 2px;
20611
- }
20612
- .fx-fenced-body.is-active {
20613
- background: rgba(122, 186, 89, 0.16);
20614
- border-radius: 2px;
20615
- }
20616
- .fx-slot {
20617
- width: 3px;
20618
- height: 1.2em;
20619
- border: none;
20620
- background: #53b856;
20621
- padding: 0;
20622
- margin: 0 1px;
20623
- cursor: text;
20624
- border-radius: 1px;
20625
- vertical-align: middle;
20626
- }
20627
- .fx-slot.is-active {
20628
- animation: fx-blink 1s infinite;
20629
- }
20630
- .fx-slot:hover {
20631
- background: #77c75b;
20632
- }
20633
- `;
20634
-
20635
- // src/editor.ts
20636
- var FormulaEditor = class {
20637
- state;
20638
- root;
20639
- onChange;
20640
- locale;
20641
- constructor(options) {
20642
- this.root = options.root;
20643
- this.state = options.initialState ?? createEmptyState();
20644
- this.onChange = options.onChange;
20645
- this.locale = options.locale ?? "en";
20646
- this.root.classList.add("fx-editor");
20647
- this.root.tabIndex = 0;
20648
- this.ensureStyles();
20649
- this.bindEvents();
20650
- this.render();
20651
- }
20652
- getState() {
20653
- return structuredClone(this.state);
20654
- }
20655
- getLocale() {
20656
- return this.locale;
20657
- }
20658
- setState(state) {
20659
- this.state = structuredClone(state);
20660
- this.render();
20661
- }
20662
- dispatch(command) {
20663
- this.state = applyCommand(this.state, command);
20664
- this.render();
20665
- this.onChange?.(this.getState());
20666
- }
20667
- ensureStyles() {
20668
- if (document.getElementById("fx-editor-styles")) return;
20669
- const style = document.createElement("style");
20670
- style.id = "fx-editor-styles";
20671
- style.textContent = editorStyles;
20672
- document.head.appendChild(style);
20673
- }
20674
- bindEvents() {
20675
- this.root.addEventListener("click", (event2) => {
20676
- const target = event2.target;
20677
- const pathValue = target.dataset.path;
20678
- if (pathValue === void 0) return;
20679
- const path = pathValue === "" ? [] : pathValue.split(".").map(Number);
20680
- this.moveSelection(path);
20681
- });
20682
- this.root.addEventListener("keydown", (event2) => {
20683
- if (event2.key === "Backspace") {
20684
- event2.preventDefault();
20685
- this.dispatch(backspace());
20686
- return;
20687
- }
20688
- if (event2.key === "/") {
20689
- event2.preventDefault();
20690
- this.dispatch(insertFraction());
20691
- return;
20692
- }
20693
- if (event2.key === "^") {
20694
- event2.preventDefault();
20695
- this.dispatch(insertSuperscript());
20696
- return;
20697
- }
20698
- if (event2.key === "_") {
20699
- event2.preventDefault();
20700
- this.dispatch(insertSubscript());
20701
- return;
20702
- }
20703
- if (event2.key === "r" && event2.ctrlKey) {
20704
- event2.preventDefault();
20705
- this.dispatch(insertSqrt());
20706
- return;
20707
- }
20708
- if (event2.key === "(") {
20709
- event2.preventDefault();
20710
- this.dispatch(insertFenced("(", ")"));
20711
- return;
20712
- }
20713
- if (event2.key.length === 1 && !event2.ctrlKey && !event2.metaKey) {
20714
- event2.preventDefault();
20715
- this.dispatch(insertText(event2.key));
20716
- }
20717
- });
20718
- }
20719
- moveSelection(path) {
20720
- this.state = {
20721
- ...this.state,
20722
- selection: {
20723
- anchor: [...path],
20724
- focus: [...path]
20725
- }
20726
- };
20727
- this.render();
20728
- this.onChange?.(this.getState());
20729
- }
20730
- render() {
20731
- this.root.innerHTML = renderInteractiveHtml(this.state.doc, this.state.selection.focus);
20732
- }
20733
- };
20734
-
20735
20277
  // ../kity-runtime/public/assets/images/toolbar/btn.png
20736
20278
  var btn_default = "./btn-5DANP6JY.png";
20737
20279
 
@@ -23270,19 +22812,19 @@ var FormulaX = (() => {
23270
22812
  return this;
23271
22813
  },
23272
22814
  _applyTransform() {
23273
- const t2 = this.transform;
22815
+ const t = this.transform;
23274
22816
  const result = [];
23275
- if (t2.translate) {
23276
- result.push(["translate(", t2.translate, ")"]);
22817
+ if (t.translate) {
22818
+ result.push(["translate(", t.translate, ")"]);
23277
22819
  }
23278
- if (t2.rotate) {
23279
- result.push(["rotate(", t2.rotate, ")"]);
22820
+ if (t.rotate) {
22821
+ result.push(["rotate(", t.rotate, ")"]);
23280
22822
  }
23281
- if (t2.scale) {
23282
- result.push(["scale(", t2.scale, ")"]);
22823
+ if (t.scale) {
22824
+ result.push(["scale(", t.scale, ")"]);
23283
22825
  }
23284
- if (t2.matrix) {
23285
- result.push(["matrix(", t2.matrix, ")"]);
22826
+ if (t.matrix) {
22827
+ result.push(["matrix(", t.matrix, ")"]);
23286
22828
  }
23287
22829
  this.node.setAttribute("transform", utils_default.flatten(result).join(" "));
23288
22830
  return this;
@@ -23291,8 +22833,8 @@ var FormulaX = (() => {
23291
22833
  this.transform.matrix = m;
23292
22834
  return this._applyTransform();
23293
22835
  },
23294
- setTranslate(t2) {
23295
- this.transform.translate = t2 !== null && [].slice.call(arguments) || null;
22836
+ setTranslate(t) {
22837
+ this.transform.translate = t !== null && [].slice.call(arguments) || null;
23296
22838
  return this._applyTransform();
23297
22839
  },
23298
22840
  setRotate(r) {
@@ -24186,7 +23728,7 @@ var FormulaX = (() => {
24186
23728
  var DEFAULT_EDITOR_HEIGHT = "auto";
24187
23729
  var KITY_STYLE_ID = "formulax-kity-editor-styles";
24188
23730
  var runtimePromise = null;
24189
- function resolveContainer2(el) {
23731
+ function resolveContainer(el) {
24190
23732
  if (typeof el === "string") {
24191
23733
  const element = document.querySelector(el);
24192
23734
  if (!(element instanceof HTMLElement)) {
@@ -24274,7 +23816,7 @@ var FormulaX = (() => {
24274
23816
  kity: runtimeWindow.kity,
24275
23817
  otherPosition: legacyOtherPosition,
24276
23818
  uiDef: legacyUiDef,
24277
- uiUtils: createLegacyUiUtils()
23819
+ uiUtils: legacyUiUtils
24278
23820
  };
24279
23821
  }
24280
23822
  async function ensureKityRuntime() {
@@ -24359,7 +23901,7 @@ var FormulaX = (() => {
24359
23901
  handlePromise;
24360
23902
  constructor(options) {
24361
23903
  const { el, ...editorOptions } = options;
24362
- this.container = resolveContainer2(el);
23904
+ this.container = resolveContainer(el);
24363
23905
  this.options = editorOptions;
24364
23906
  this.handlePromise = mountKityEditor(this.container, this.options);
24365
23907
  }
@@ -24737,7 +24279,7 @@ var FormulaX = (() => {
24737
24279
  style.textContent = formulaXModalStyles;
24738
24280
  doc2.head.appendChild(style);
24739
24281
  }
24740
- function mountFormulaXKityEditor(root2, options = {}) {
24282
+ function mountFormulaXEditor(root2, options = {}) {
24741
24283
  let destroyed = false;
24742
24284
  let latestLatex = options.initialLatex ?? "";
24743
24285
  let handle = null;
@@ -25146,83 +24688,6 @@ var FormulaX = (() => {
25146
24688
  function mergeInlineStyles2(...values) {
25147
24689
  return values.flatMap((value) => value?.split(";") ?? []).map((value) => value.trim()).filter(Boolean).join("; ");
25148
24690
  }
25149
-
25150
- // src/i18n.ts
25151
- var translations = {
25152
- en: {
25153
- equation: "Equation",
25154
- structures: "Structures",
25155
- symbols: "Symbols",
25156
- matrices: "Matrices",
25157
- templates: "Templates",
25158
- insert: "Insert",
25159
- greek: "Greek",
25160
- operators: "Operators",
25161
- relations: "Relations",
25162
- fraction: "Fraction",
25163
- superscript: "Superscript",
25164
- subscript: "Subscript",
25165
- squareRoot: "Square Root",
25166
- parentheses: "Parentheses",
25167
- plusMinus: "Plus Minus",
25168
- multiply: "Multiply",
25169
- divide: "Divide",
25170
- dot: "Dot",
25171
- union: "Union",
25172
- intersect: "Intersection",
25173
- lessOrEqual: "Less or Equal",
25174
- greaterOrEqual: "Greater or Equal",
25175
- notEqual: "Not Equal",
25176
- approximate: "Approximate",
25177
- infinity: "Infinity",
25178
- arrow: "Arrow",
25179
- limit: "Limit",
25180
- sine: "Sine",
25181
- logarithm: "Logarithm",
25182
- matrix: "Matrix",
25183
- summation: "Summation",
25184
- integral: "Integral",
25185
- placeholder: "WPS-inspired ribbon layout. Some tiles are placeholders for future SDK features."
25186
- },
25187
- zh: {
25188
- equation: "\u516C\u5F0F",
25189
- structures: "\u7ED3\u6784",
25190
- symbols: "\u7B26\u53F7",
25191
- matrices: "\u77E9\u9635",
25192
- templates: "\u6A21\u677F",
25193
- insert: "\u63D2\u5165",
25194
- greek: "\u5E0C\u814A\u5B57\u6BCD",
25195
- operators: "\u8FD0\u7B97\u7B26",
25196
- relations: "\u5173\u7CFB",
25197
- fraction: "\u5206\u6570",
25198
- superscript: "\u4E0A\u6807",
25199
- subscript: "\u4E0B\u6807",
25200
- squareRoot: "\u5E73\u65B9\u6839",
25201
- parentheses: "\u62EC\u53F7",
25202
- plusMinus: "\u52A0\u51CF",
25203
- multiply: "\u4E58",
25204
- divide: "\u9664",
25205
- dot: "\u70B9\u4E58",
25206
- union: "\u5E76\u96C6",
25207
- intersect: "\u4EA4\u96C6",
25208
- lessOrEqual: "\u5C0F\u4E8E\u7B49\u4E8E",
25209
- greaterOrEqual: "\u5927\u4E8E\u7B49\u4E8E",
25210
- notEqual: "\u4E0D\u7B49\u4E8E",
25211
- approximate: "\u7EA6\u7B49\u4E8E",
25212
- infinity: "\u65E0\u7A77",
25213
- arrow: "\u7BAD\u5934",
25214
- limit: "\u6781\u9650",
25215
- sine: "\u6B63\u5F26",
25216
- logarithm: "\u5BF9\u6570",
25217
- matrix: "\u77E9\u9635",
25218
- summation: "\u6C42\u548C",
25219
- integral: "\u79EF\u5206",
25220
- placeholder: "WPS \u98CE\u683C\u7684\u5DE5\u5177\u680F\u5E03\u5C40\u3002\u90E8\u5206\u6309\u94AE\u4ECD\u662F\u672A\u6765 SDK \u529F\u80FD\u7684\u5360\u4F4D\u9879\u3002"
25221
- }
25222
- };
25223
- function t(locale, key) {
25224
- return translations[locale][key] ?? translations.en[key];
25225
- }
25226
24691
  return __toCommonJS(index_exports);
25227
24692
  })();
25228
24693
  /*!