Class ToolbarWidgetGroup

src/aria/toolbar/toolbar-widget-group.ts:35–81

  providers: [{provide: TOOLBAR_WIDGET_GROUP, useExisting: ToolbarWidgetGroup}],
})
export class ToolbarWidgetGroup<V> {
  /** A reference to the host element. */
  private readonly _elementRef = inject(ElementRef);

  /** A reference to the host element. */
  readonly element = this._elementRef.nativeElement as HTMLElement;

  /** The parent Toolbar. */
  private readonly _toolbar = inject<Toolbar<V>>(Toolbar, {optional: true});

  /** The list of child widgets within the group. */
  private readonly _widgets = contentChildren(ToolbarWidget, {descendants: true});

  /** The parent Toolbar UIPattern. */
  private readonly _toolbarPattern = computed(() => this._toolbar?._pattern);

  /** Whether the widget group is disabled. */
  readonly disabled = input(false, {transform: booleanAttribute});

  /** The list of toolbar items within the group. */
  private readonly _itemPatterns = () => this._widgets().map(w => w._pattern);

  /** Whether the group allows multiple widgets to be selected. */
  readonly multi = input(false, {transform: booleanAttribute});

  /** The ToolbarWidgetGroup UIPattern. */
  readonly _pattern = new ToolbarWidgetGroupPattern<ToolbarWidgetPattern<V>, V>({
    ...this,
    items: this._itemPatterns,
    toolbar: this._toolbarPattern,
  });

  constructor() {
    // Check for any violations after the DOM has been updated.
    if (typeof ngDevMode === 'undefined' || ngDevMode) {
      afterRenderEffect({
        read: () => {
          const violations: string[] = [];
          if (!this._toolbar) {
            violations.push('ngToolbarWidgetGroup must be placed inside an ngToolbar container.');
          }
          reportViolations(violations, this.element);
        },
      });
    }
  }
}