Skip to main content

Menu Modal

This section describes the BfmMenuModalComponent component.

Usage

You must import the BfmMenuModalComponent and provide it to [ModalService] to open the modal.

info

Modals are not components. They must be used with the [ModalService] to be opened.

To a better understanding, check the Modals documentation.

menu-modal.component.ts
import { BfmMenuModalComponent } from '@celerofinancas/ui-user-kit';
import { ModalService } from "@celerofinancas/ui-modals";
import { Component, inject } from '@angular/core';

@Component({
standalone: true,
selector: 'example-component',
templateUrl: './example.component.html',
})
export class ExampleComponent {
/**
* Modal service for handling modals
*/
private modalService = inject(ModalService);

/**
* Open the modal
*/
public openModal(): void {
this.modalService.open(BfmMenuModalComponent, {
title: 'title',
id: DASHBOARD_ACTIONS.importOfx,
trackingModel: TRACKING_MODELS.actionModalImportOfx,
imageSrc: 'image_source',
visible$: of(true),
isEmpty: false,
});
};
}

Inputs

The BfmMenuModalComponent modalRef has the following inputs:

[title]

Menu Item title

TypeDefault
string''

[id]

Id used for testing

TypeDefault
DASHBOARD_ACTIONSnull

[trackingModel]

Action tracking model

TypeDefault
TRACKING_MODELS of @celerofinancas/service-utilsnull

[imageSrc]

Item image source

TypeDefault
string''

[isEmpty]

Whether is empty

TypeDefault
booleanfalse

Events

The BfmMenuModalComponent modalRef has the following Events:

[visible$]

Whether is visible

TypeDefault
Observable of booleanboolean