scriptable-testlab/src/mocks/ui/widgets/text.ts

A lightweight, efficient tool designed to manage and update scripts for Scriptable.

import {AbsWidgetText} from 'scriptable-abstract';

import {MockColor} from '../color';
import {MockFont} from '../font';

/**
 * Represents the text alignment options.
 */
type TextAlignment = 'left' | 'center' | 'right' | 'default';

/**
 * Represents the state of a widget text element.
 */
interface WidgetTextMockState {
  readonly text: string;
  readonly textColor: Color;
  readonly font: Font;
  readonly textOpacity: number;
  readonly lineLimit: number;
  readonly minimumScaleFactor: number;
  readonly shadowColor: Color;
  readonly shadowRadius: number;
  readonly shadowOffset: Readonly<Point>;
  readonly url: string;
  readonly alignment: TextAlignment;
}

/**
 * Default state for a new widget text element.
 */
const DEFAULT_STATE: WidgetTextMockState = {
  text: '',
  textColor: new MockColor('#000000'),
  font: MockFont.systemFont(12),
  textOpacity: 1.0,
  lineLimit: 0,
  minimumScaleFactor: 1.0,
  shadowColor: new MockColor('#000000'),
  shadowRadius: 0,
  shadowOffset: {x: 0, y: 0},
  url: '',
  alignment: 'default',
};

/**
 * Mock implementation of Scriptable's WidgetText.
 * Provides a text element for displaying text in widgets.
 */
export class MockWidgetText extends AbsWidgetText<WidgetTextMockState> {
  /**
   * Creates a new widget text element with the specified text.
   */
  constructor(text: string) {
    super({
      ...DEFAULT_STATE,
      text,
    });
  }

  /**
   * Creates a new widget text instance.
   */
  static create(text: string): WidgetText {
    return new MockWidgetText(text);
  }

  // Property accessors
  get text(): string {
    return this.state.text;
  }

  set text(value: string) {
    this.setState({text: value});
  }

  get textColor(): Color {
    return this.state.textColor;
  }

  set textColor(value: Color) {
    this.setState({textColor: value});
  }

  get font(): Font {
    return this.state.font;
  }

  set font(value: Font) {
    this.setState({font: value});
  }

  get textOpacity(): number {
    return this.state.textOpacity;
  }

  set textOpacity(value: number) {
    this.setState({textOpacity: value});
  }

  get lineLimit(): number {
    return this.state.lineLimit;
  }

  set lineLimit(value: number) {
    this.setState({lineLimit: value});
  }

  get minimumScaleFactor(): number {
    return this.state.minimumScaleFactor;
  }

  set minimumScaleFactor(value: number) {
    this.setState({minimumScaleFactor: value});
  }

  get shadowColor(): Color {
    return this.state.shadowColor;
  }

  set shadowColor(value: Color) {
    this.setState({shadowColor: value});
  }

  get shadowRadius(): number {
    return this.state.shadowRadius;
  }

  set shadowRadius(value: number) {
    this.setState({shadowRadius: value});
  }

  get shadowOffset(): Point {
    return {...this.state.shadowOffset};
  }

  set shadowOffset(value: Point) {
    this.setState({shadowOffset: {...value}});
  }

  get url(): string {
    return this.state.url;
  }

  set url(value: string) {
    this.setState({url: value});
  }

  // Text alignment methods
  leftAlignText(): void {
    this.setState({alignment: 'left'});
  }

  centerAlignText(): void {
    this.setState({alignment: 'center'});
  }

  rightAlignText(): void {
    this.setState({alignment: 'right'});
  }

  /**
   * Gets the current text alignment.
   * @returns The current text alignment value.
   */
  getAlignment(): TextAlignment {
    return this.state.alignment;
  }
}