chore: migrate oxlint & oxfmt (#15464)

#### PR Dependency Tree * **PR #15464** 👈 This tree was auto-generated by [Charcoal](https://github.com/danerwilliams/charcoal)  ## Summary by CodeRabbit * **Chores** * Replaced the project’s formatting and linting workflow with Oxfmt and Oxlint. * Added shared formatting and linting configuration, editor integration, and updated automated checks. * Updated generated files, scripts, and lint guidance to use the new tooling. * **Style** * Reformatted templates, source code, examples, and configuration files for consistent readability. * No user-facing functionality or rendering behavior changed.
2026-09-06 00:41:39 +08:00 · 2026-08-10 23:51:28 +08:00
parent 749c83cd8e
commit 0c7b20dc18
292 changed files with 3372 additions and 2866 deletions
@@ -53,19 +53,25 @@ export class CaptionedBlockComponent<
      })}
    >
      ${content}
-      ${this.useCaptionEditor
-        ? html`<block-caption-editor
-            ${ref(this._captionEditorRef)}
-          ></block-caption-editor>`
-        : nothing}
-      ${this.selectedStyle === SelectedStyle.Background
-        ? html`<affine-block-selection
-            .selected=${watch(this.selected$)}
-          ></affine-block-selection>`
-        : null}
-      ${this.useZeroWidth && !this.store.readonly
-        ? html`<block-zero-width .block=${this}></block-zero-width>`
-        : nothing}
+      ${
+        this.useCaptionEditor
+          ? html`<block-caption-editor
+              ${ref(this._captionEditorRef)}
+            ></block-caption-editor>`
+          : nothing
+      }
+      ${
+        this.selectedStyle === SelectedStyle.Background
+          ? html`<affine-block-selection
+              .selected=${watch(this.selected$)}
+            ></affine-block-selection>`
+          : null
+      }
+      ${
+        this.useZeroWidth && !this.store.readonly
+          ? html`<block-zero-width .block=${this}></block-zero-width>`
+          : nothing
+      }
    </div>`;
  }

@@ -126,19 +126,23 @@ export class CitationCard extends SignalWatcher(WithDisposable(LitElement)) {
        @dblclick=${this.onDoubleClickCallback}
      >
        <div class="citation-header">
-          ${this.icon
-            ? html`<div class="citation-icon">
-                ${this._IconTemplate(this.icon)}
-              </div>`
-            : nothing}
+          ${
+            this.icon
+              ? html`<div class="citation-icon">
+                  ${this._IconTemplate(this.icon)}
+                </div>`
+              : nothing
+          }
          <div class="citation-title">${this.citationTitle}</div>
          <div class=${citationIdentifierClasses}>
            ${this.citationIdentifier}
          </div>
        </div>
-        ${this.citationContent
-          ? html`<div class="citation-content">${this.citationContent}</div>`
-          : nothing}
+        ${
+          this.citationContent
+            ? html`<div class="citation-content">${this.citationContent}</div>`
+            : nothing
+        }
      </div>
    `;
  }
@@ -250,9 +250,11 @@ export const menuButtonItems = {
      }
      const data: MenuButtonData = {
        content: () => html`
-          ${config.checked.value
-            ? CheckBoxCheckSolidIcon({ style: `color:#1E96EB` })
-            : CheckBoxUnIcon()}
+          ${
+            config.checked.value
+              ? CheckBoxCheckSolidIcon({ style: `color:#1E96EB` })
+              : CheckBoxUnIcon()
+          }
          <div class="affine-menu-action-text">
            ${config.label?.() ?? config.name}
          </div>
@@ -24,11 +24,13 @@ export const menuGroupItems = {
        ${items}
      </div>`;
    }
-    const result: TemplateResult = html` ${index === 0
-        ? ''
-        : html` <div
-            style="height: 0.5px;background-color: var(--affine-divider-color);margin: 4px 0"
-          ></div>`}
+    const result: TemplateResult = html` ${
+        index === 0
+          ? ''
+          : html` <div
+              style="height: 0.5px;background-color: var(--affine-divider-color);margin: 4px 0"
+            ></div>`
+      }
      <div style="display: flex;flex-direction: column;gap:4px">${items}</div>`;
    return result;
  },
@@ -165,9 +165,11 @@ export class MenuComponent
    return html`
      ${this.renderTitle()} ${this.renderSearch()}
      <div class="affine-menu-body">
-        ${result.length === 0 && this.menu.enableSearch
-          ? html` <div class="no-results">No Results</div>`
-          : ''}
+        ${
+          result.length === 0 && this.menu.enableSearch
+            ? html` <div class="no-results">No Results</div>`
+            : ''
+        }
        ${result}
      </div>
    `;
@@ -213,35 +215,39 @@ export class MenuComponent
        style="display:flex;align-items:center;gap: 4px;padding:3px 4px 3px 2px"
        @mouseenter="${() => this.menu.closeSubMenu()}"
      >
-        ${title.onBack
-          ? html` <div
-              @click="${() => {
-                const result = title.onBack?.(this.menu);
-                if (result !== false) {
-                  this.menu.close();
-                }
-              }}"
-              class="dv-icon-20 dv-hover dv-pd-2 dv-round-4"
-              style="display:flex;"
-            >
-              ${ArrowLeftBigIcon()}
-            </div>`
-          : nothing}
+        ${
+          title.onBack
+            ? html` <div
+                @click="${() => {
+                  const result = title.onBack?.(this.menu);
+                  if (result !== false) {
+                    this.menu.close();
+                  }
+                }}"
+                class="dv-icon-20 dv-hover dv-pd-2 dv-round-4"
+                style="display:flex;"
+              >
+                ${ArrowLeftBigIcon()}
+              </div>`
+            : nothing
+        }
        <div
          style="flex:1;font-weight:500;font-size: 14px;line-height: 22px;color: var(--affine-text-primary-color)"
        >
          ${title.text}
        </div>
        ${title.postfix?.()}
-        ${title.onClose
-          ? html` <div
-              @click="${title.onClose}"
-              class="dv-icon-20 dv-hover dv-pd-2 dv-round-4"
-              style="display:flex;"
-            >
-              ${CloseIcon()}
-            </div>`
-          : nothing}
+        ${
+          title.onClose
+            ? html` <div
+                @click="${title.onClose}"
+                class="dv-icon-20 dv-hover dv-pd-2 dv-round-4"
+                style="display:flex;"
+              >
+                ${CloseIcon()}
+              </div>`
+            : nothing
+        }
      </div>
    `;
  }
@@ -323,21 +329,23 @@ export class MobileMenuComponent
        @mouseenter="${() => this.menu.closeSubMenu()}"
      >
        <div style="width: 50px;flex-shrink: 0;margin-left: 10px;">
-          ${title?.onBack
-            ? html` <div
-                @click="${() => {
-                  title.onBack?.(this.menu);
-                  this.menu.close();
-                }}"
-                style="
+          ${
+            title?.onBack
+              ? html` <div
+                  @click="${() => {
+                    title.onBack?.(this.menu);
+                    this.menu.close();
+                  }}"
+                  style="
                display:flex;
                font-size: 24px;
                align-items:center;
 "
-              >
-                ${ArrowLeftSmallIcon()}
-              </div>`
-            : nothing}
+                >
+                  ${ArrowLeftSmallIcon()}
+                </div>`
+              : nothing
+          }
        </div>
        <div
          style="
@@ -149,7 +149,7 @@ export class Menu {

  renderItems(items: MenuConfig[]) {
    const result = [];
-    // oxlint-disable-next-line @typescript-eslint/prefer-for-of
+    // oxlint-disable-next-line typescript/prefer-for-of
    for (let i = 0; i < items.length; i++) {
      const item = items[i];
      const template = item(this, result.length);
@@ -178,18 +178,20 @@ export class DatePicker extends WithDisposable(LitElement) {
            </div>`
        )}
      </div>
-      ${this.onClear
-        ? html`<div class="date-picker-footer">
-            <button
-              tabindex="0"
-              aria-label="clear"
-              class="footer-button interactive"
-              @click=${() => this.onClear?.()}
-            >
-              Clear
-            </button>
-          </div>`
-        : nothing}`;
+      ${
+        this.onClear
+          ? html`<div class="date-picker-footer">
+              <button
+                tabindex="0"
+                aria-label="clear"
+                class="footer-button interactive"
+                @click=${() => this.onClear?.()}
+              >
+                Clear
+              </button>
+            </div>`
+          : nothing
+      }`;
  }

  /** Week header */
@@ -40,9 +40,8 @@ export const LoadingIcon = ({
      stroke="${strokeColor}"
      stroke-width="4"
      stroke-linecap="round"
-      stroke-dasharray="${2 * Math.PI * 8 * progress} ${2 *
-      Math.PI *
-      8 *
-      (1 - progress)}"
+      stroke-dasharray="${2 * Math.PI * 8 * progress} ${
+        2 * Math.PI * 8 * (1 - progress)
+      }"
    />
  </svg>`;
@@ -40,7 +40,7 @@ export interface PeekViewService {
   * @returns A promise that resolves when the peek view is closed.
   */
  peek(
-    // oxlint-disable-next-line @typescript-eslint/unified-signatures
+    // oxlint-disable-next-line typescript/unified-signatures
    element: { target: HTMLElement; template?: TemplateResult },
    options?: PeekOptions
  ): Promise<void>;
@@ -161,8 +161,9 @@ export class SizeDropdownMenu extends SignalWatcher(
            .labelHeight="${'20px'}"
            .iconContainerWidth="${icon ? 'unset' : '65px'}"
          >
-            ${icon ??
-            html`<span class="label">${format?.(size) ?? size}</span>`}
+            ${
+              icon ?? html`<span class="label">${format?.(size) ?? size}</span>`
+            }
            ${EditorChevronDown}
          </editor-icon-button>
        `}
@@ -151,9 +151,11 @@ export class Slider extends WithDisposable(LitElement) {
      <div class="drag-handle"></div>
      <div class="bottom-line"></div>
      <div class="slider-selected-overlay"></div>
-      ${this.tooltip
-        ? html`<affine-tooltip .offset=${8}>${this.tooltip}</affine-tooltip>`
-        : nothing}
+      ${
+        this.tooltip
+          ? html`<affine-tooltip .offset=${8}>${this.tooltip}</affine-tooltip>`
+          : nothing
+      }
    </div>`;
  }
 }
@@ -83,9 +83,11 @@ export function renderActions(
                ?disabled=${item.disabled}
                @click=${item.action ? item.action : () => action?.(item)}
              >
-                ${item.icon}${item.label
-                  ? html`<span class="label">${item.label}</span>`
-                  : nothing}
+                ${item.icon}${
+                  item.label
+                    ? html`<span class="label">${item.label}</span>`
+                    : nothing
+                }
              </editor-menu-action>
            `
        )
@@ -237,13 +237,15 @@ export class Tooltip extends LitElement {
        ${unsafeCSS(this.style.cssText)}
      }

-      ${this.allowInteractive
-        ? css``
-        : css`
-            :host {
-              pointer-events: none;
-            }
-          `}
+      ${
+        this.allowInteractive
+          ? css``
+          : css`
+              :host {
+                pointer-events: none;
+              }
+            `
+      }

      ${this.tooltipStyle}
    `;