dragonish_obsidian-heading-decorator/components/weight.ts

import { EditorView, WidgetType } from "@codemirror/view";
import { className, getPositionClassName } from "../common/data";

export class HeadingWidget extends WidgetType {
  readonly isLivePreviwMode: boolean;
  readonly content: string;
  readonly opacity: OpacityOptions;
  readonly position: PostionOptions;
  readonly level: number;

  constructor(
    isLivePreviwMode: boolean,
    content: string,
    opacity: OpacityOptions,
    position: PostionOptions,
    level: number
  ) {
    super();
    this.isLivePreviwMode = isLivePreviwMode;
    this.content = content;
    this.opacity = opacity;
    this.position = position;
    this.level = level;
  }

  toDOM(view: EditorView): HTMLElement {
    const headingClassName = this.isLivePreviwMode
      ? className.preview
      : className.source;

    const span = view.dom.createSpan({
      cls: [
        className.heading,
        headingClassName,
        getPositionClassName(this.position),
      ],
      text: this.content,
      attr: {
        "data-decorator-opacity": `${this.opacity}%`,
        "data-decorator-level": this.level.toString(),
      },
    });

    return span;
  }

  eq(widget: HeadingWidget): boolean {
    return (
      widget.isLivePreviwMode === this.isLivePreviwMode &&
      widget.content === this.content &&
      widget.opacity === this.opacity &&
      widget.position === this.position &&
      widget.level === this.level
    );
  }

  destroy(dom: HTMLElement): void {
    dom.remove();
  }
}