Enumeration IconMode

Example

export class IconModeExamplePanel extends PanelPlugin {
  connections: any[];
  static descriptor() {
    const d = new Descriptor();
    d.id = 'com.docs.IconModeExample';
    d.name = 'IconMode Example';
    d.defaultDockState = DockState.Detached;
    d.defaultSize = new Size(350, 200);
    return d;
  }
  constructor(pluginSystem: Editor.PluginSystem, descriptor?: Descriptor) {
    super(pluginSystem, descriptor);
    this.connections = [];
  }
  createWidget(parent: Widget): Widget {
    const root = new Widget(parent);
    const layout = new BoxLayout();
    layout.setDirection(Direction.TopToBottom);
    layout.spacing = 8;
    root.layout = layout;

    const title = new Label(root);
    title.text = 'IconMode Demo';
    layout.addWidget(title);

    const statusLabel = new Label(root);
    statusLabel.text = 'Current: MonoChrome';
    layout.addWidget(statusLabel);

    // IconMode controls icon rendering style on PushButton:
    //   MonoChrome — applies theme tinting to the icon
    //   Regular    — preserves the icon's original colors
    const monoBtn = new PushButton(root);
    monoBtn.text = 'Set MonoChrome';
    layout.addWidget(monoBtn);

    const regularBtn = new PushButton(root);
    regularBtn.text = 'Set Regular';
    layout.addWidget(regularBtn);

    // Apply MonoChrome mode (default theme-tinted rendering)
    monoBtn.setIconMode(IconMode.MonoChrome);

    this.connections.push(
      monoBtn.onClick.connect(() => {
        monoBtn.setIconMode(IconMode.MonoChrome);
        regularBtn.setIconMode(IconMode.MonoChrome);
        statusLabel.text = 'Current: MonoChrome';
      })
    );

    this.connections.push(
      regularBtn.onClick.connect(() => {
        monoBtn.setIconMode(IconMode.Regular);
        regularBtn.setIconMode(IconMode.Regular);
        statusLabel.text = 'Current: Regular';
      })
    );

    return root;
  }
  deinit(): void {
    this.connections.forEach((c: any) => c?.disconnect());
    this.connections = [];
  }
}
Copy