@ryusei/code/src/js/extensions/Guide/IndentMarker.ts

<div align="center"> <a href="https://code.ryuseijs.com"> <img alt="RyuseiCode" src="https://code.ryuseijs.com/images/svg/logo.svg" width="70"> </a>

import { OffsetPosition, Position } from '@ryusei/code';
import { Marker } from '../../components/Range/Marker';
import { floor } from '../../utils';


/**
 * The class for rendering the indent guide.
 *
 * @since 0.1.0
 */
export class IndentMarker extends Marker {
  /**
   * Calculates boundaries for drawing the marker.
   * Because every indent size is same, this method uses the cache of the width for the better performance.
   *
   * @param anchor - An anchor position.
   *
   * @return An object with start and end boundaries.
   */
  protected calcBoundaries( anchor: Position ): { start: OffsetPosition, end: OffsetPosition } {
    const { indent } = this.Editor.options;
    const { Measure, Measure: { padding } } = this.Editor.Components;
    const width = Measure.measureWidth( indent, true );
    const top   = Measure.getTop( anchor[ 0 ] ) + padding.top;
    const left  = floor( anchor[ 1 ] / indent.length ) * width + padding.left;

    return {
      start: { top, left },
      end  : { top, left: left + width },
    };
  }
}