@lumino/widgets#LayoutItem TypeScript Examples

/**
   * Construct a dashboard layout.
   */
  constructor(options: DashboardLayout.IOptions) {
    super(options);

    const { widgetstore, outputTracker, width, height, mode, model } = options;

    this._items = new Map<string, LayoutItem>();
    this._widgetstore = widgetstore;
    this._outputTracker = outputTracker;

    this._width = width || 0;
    this._height = height || 0;

    this._canvas = DashboardLayout.makeCanvas(this._width, this._height);

    if (mode === 'free-edit') {
      this._canvas.classList.add(FREE_LAYOUT_CLASS);
    } else if (mode === 'grid-edit') {
      this._canvas.classList.add(TILED_LAYOUT_CLASS);
    }

    this._mode = mode;

    model.stateChanged.connect(this._handleModelChange, this);
  }

/**
   * A helper function to add a widget to the layout.
   *
   * @param widget - the widget to add.
   *
   * @param _pos - the desired size/position of the added widget.
   *
   * ### Notes
   * This method is called recursively to handle overlapping widgets and
   * shoudn't be called directly. If you want to add a widget, use the
   * .addWidget() method instead.
   */
  _addWidget(widget: DashboardWidget, _pos: Widgetstore.WidgetPosition): void {
    // Add the widget to the layout.
    const item = new LayoutItem(widget);
    this._items.set(widget.id, item);

    // Attach the widget to the parent.
    if (this.parent) {
      if (this._dashboard !== undefined) {
        widget.mode = this._dashboard.model.mode;
      } else {
        widget.mode = 'present';
      }
      this.attachWidget(widget);

      const { id, notebookId, cellId } = widget;

      const ignore = !this._signalChanges;

      widget.ready.connect(() => {
        this._updateWidget(widget, widget.pos, false);
        this.fixOverlaps(widget);
        this._outputTracker.add(widget);

        const change: IDashboardChange = {
          type: 'add',
          pos: widget.pos,
          widgetId: id,
          notebookId,
          cellId,
          ignore
        };

        this.signalChange(change);
        this.endBatch();
      });
    }
  }

// Map from widget ids to LayoutItems
  private _items: Map<string, LayoutItem>;

private _ghostCorner: LayoutItem;

private _ghostRow: LayoutItem;

private _ghostColumn: LayoutItem;