import { PoLanguageService } from '../../services/po-language/po-language.service'; import { PoMenuFilter } from './po-menu-filter/po-menu-filter.interface'; import { PoMenuItem } from './po-menu-item.interface'; import { PoMenuGlobalService } from './services/po-menu-global.service'; import { PoMenuService } from './services/po-menu.service'; export declare const poMenuLiteralsDefault: { en: { itemNotFound: string; emptyLabelError: string; close: string; open: string; }; es: { itemNotFound: string; emptyLabelError: string; close: string; open: string; }; pt: { itemNotFound: string; emptyLabelError: string; close: string; open: string; }; ru: { itemNotFound: string; emptyLabelError: string; close: string; open: string; }; }; /** * @description * * Este é um componente de menu lateral que é utilizado para navegação nas páginas de uma aplicação. * * O componente po-menu recebe uma lista de objetos do tipo `MenuItem` com as informações dos itens de menu como * textos, links para redirecionamento, ações, até 4 níveis de menu e ícones para o primeiro nível de menu. * * #### Tokens customizáveis * * É possível alterar o estilo do componente usando os seguintes tokens (CSS): * * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization). * * | Propriedade | Descrição | Valor Padrão | * |----------------------------------------|-------------------------------------------------------|-------------------------------------------------| * | **Default Values** | | | * | `--border-radius` | Contém o valor do raio dos cantos do elemento  | `var(--border-radius-md)` | * | `--border-color` | Cor da borda | `var(--color-neutral-light-20)` | * | `--background-color` | Cor de background | `Var(----color-neutral-light-05)` | * | **Menu Footer** | | | * | `--color` | Cor principla do menu footer | `var(--color-action-default)` | * | `--font-size` | Tamanho da fonte | `var(--font-size-default)` | * | `--line-height` | Tamanho da label | `var(--line-height-md)` | * | `--outline-color-focused` | Cor do outline do estado de focus | `var(--color-action-focus)` | * | `--font-weight-lvl0` | Peso da fonte | `var(--font-weight-bold)` | * | **po-menu-item** | | | * | `--font-family` | Família tipográfica usada | `var(--font-family-theme)` | * | `--font-size` | Tamanho da fonte | `var(--font-size-default)` | * | `--line-height` | Tamanho da label | `var(--line-height-md)` | * | `--border-radius` | Contém o valor do raio dos cantos do elemento  | `var(--border-radius-md)` | * | `--color` | Cor principal do item | `var(--color-action-default)` | * | `--background-color` | Cor do background | `transparent` | * | **Hover** | | | * | `--color-hover` | Cor principal no estado hover | `var(--color-brand-01-darkest)` | * | `--background-color-hover` | Cor de background no estado hover | `var(--color-brand-01-lighter)` | * | **Focused** | | | * | `--outline-color-focused` | Cor do outline do estado de focus | `var(--color-action-focus)` | * | **Pressed** | | | * | `--background-color-pressed`   | Cor de background no estado de pressionado  | `var(--color-brand-01-light)` | * | **Actived** | | | * | `--background-color-actived` | Cor de background no estado actived | `var(--color-brand-01-darkest)` | * | `--color-actived` | Cor principal no estado actived | `var(--color-brand-01-lighter)` | * | **Font** | | | * | `--font-weight-lvl0` | Peso da fonte bold | `var(--font-weight-bold)` | * | `--font-weight-lvl1` | Peso da fonte | `var(--font-weight-normal)` | * *
*/ export declare abstract class PoMenuBaseComponent { menuGlobalService: PoMenuGlobalService; menuService: PoMenuService; languageService: PoLanguageService; allowIcons: boolean; allowCollapseMenu: boolean; allowCollapseHover: boolean; filteredItems: any; filterService: PoMenuFilter; readonly literals: any; private _collapsed; private _componentsSize; private _initialComponentsSize; private _filter; private _searchTreeItems; private _level; private readonly _maxLevel; private _menus; private _params; private _service; private _logoLink; private _menuId; /** * @optional * * @description * * Expande e Colapsa (retrai) o menu automaticamente. * * @default `false` */ automaticToggle: boolean; /** * @optional * * @description * * Evento emitido toda vez que o estado do menu muda, enviando `true` quando expandido e `false` quando colapsado. * * ```html * * ``` */ toggleChange: import("@angular/core").OutputEmitterRef; /** * @optional * * @description * * Colapsa (retrai) o menu e caso receba o valor `false` expande o menu. * * > Utilize esta propriedade para iniciar o menu colapsado. * * > Ao utilizar os métodos [`colapse`](documentation/po-menu#colapseMethod), [`expand`](documentation/po-menu#expandMethod) e * [`toggle`](documentation/po-menu#toggleMethod) o valor desta propriedade não é alterado. * * **Importante:** * * > O menu será colapsado/expandido apenas se todos os itens de menu tiverem valor nas propriedades `icon` e `shortLabel`. * * @default `false` */ set collapsed(collapsed: boolean); get collapsed(): boolean; /** * @optional * * @description * * Define o tamanho dos componentes de formulário no menu: * - `small`: aplica a medida small de cada componente (disponível apenas para acessibilidade AA). * - `medium`: aplica a medida medium de cada componente. * * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido. * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme). * * @default `medium` */ set componentsSize(value: string); get componentsSize(): string; /** Lista dos itens do menu. Se o valor estiver indefinido ou inválido, será inicializado como um array vazio. */ set menus(menus: Array); get menus(): Array; get maxLevel(): number; /** * @optional * * @description * * Habilita um campo para pesquisa no menu. * A pesquisa é realizada em todos os níveis do menu e busca apenas pelos itens que contém uma ação e/ou link definidos, * ou também, pode ser realizada através de um serviço definido na propriedade `p-service`. * * > O campo de pesquisa é desabilitado se o menu estiver colapsado. * * @default `false` */ set filter(filter: boolean); get filter(): boolean; /** * @optional * * @description * * Quando ativado, a pesquisa também retornará itens agrupadores além dos itens que contêm uma ação e/ou link definidos. * Isso pode ser útil quando se deseja encontrar rapidamente categorias ou seções do menu. * * > É necessário que a propriedade `p-filter` esteja habilitada. * * @default `false` */ set searchTreeItems(searchTreeItems: boolean); get searchTreeItems(): boolean; /** * @optional * * @description * * Nesta propriedade deve ser informada a URL do serviço em que será utilizado para realizar o filtro de itens do * menu quando realizar uma busca. Caso haja a necessidade de customização, pode ser informado um * serviço implementando a interface `PoMenuFilter`. * * Caso utilizada uma URL, o serviço deve retornar os dados conforme o * [Guia de implementação de APIs](https://po-ui.io/guides/api) do PO UI. * * Quando utilizada uma URL de serviço, será realizado um *GET* na URL informada, passando o valor digitado * no parâmetro `search`, veja exemplo: * * > O filtro no serviço será realizado caso contenha no mínimo três caracteres no campo de busca, por exemplo `tot`. * * ``` * * * * Requisição: GET /api/v1/fnd/menu?search=contas * ``` * * > É necessário que propriedade `p-filter` esteja habilitada. */ set service(value: string | PoMenuFilter); get service(): string | PoMenuFilter; /** * @optional * * @description * * Deve ser informado um objeto que deseja-se utilizar na requisição de filtro dos itens de menu. * * Caso utilizado um serviço customizado, implementando a interface `PoMenuFilter`, o valor desta propriedade * será passado como parâmetro, na função `getFilteredData`. * * Quando utilizada uma URL de serviço, será realizado um *GET* na URL informada, passando os valores informados * nesta propriedade em conjunto com o parâmetro `search`, veja exemplo: * * ``` * * * * Requisição: GET /api/v1/fnd/menu?search=contas&company=1&user=297767512 * ``` */ set params(value: any); get params(): any; /** * @optional * * @description * * Caminho para a logomarca, que será exibida quando o componente estiver expandido, localizada na parte superior. * * > **Importante:** * - Caso esta propriedade estiver indefinida ou inválida o espaço para logomarca será removido. * - Como boa prática, indica-se utilizar imagens com até `24px` de altura e `224px` de largura, * caso ultrapassar esses valores a imagem será readequada no espaço disponível. */ logo?: string; set menuid(id: string); get menuid(): string; /** * @optional * * @description * * Define o texto alternativo para a logomarca. * * > **Importante** * > Caso esta propriedade não seja definida o texto padrão será "Logomarca início". * * @default `Logomarca início` */ logoAlt?: string; /** * @optional * * @description * * Caminho para a logomarca, que será exibida quando o componente estiver colapsado, localizada na parte superior. * * > **Importante:** * - Caso esta propriedade estiver indefinida ou inválida passa a assumir o valor informado na propriedade `p-logo` e na ausência desta o * espaço para logomarca será removido. * - Como boa prática, indica-se utilizar imagens com até `48px` de altura e `48px` de largura, * caso ultrapassar esses valores a imagem será readequada no espaço disponível. * - Caso não informar um valor, esta propriedade passa a assumir o valor informado na propriedade `p-logo`. */ shortLogo: string; onlyMenuItem: boolean; /** * @optional * * @description * Define o link para a rota ao clicar no logo do menu. * * - Se o valor for uma string, define a rota para o link informado. * - Se for `false`, o logo não terá link associado. * - Se for `true`, o logo terá a rota padrão `./`. * * @default `true` */ set logoLink(value: boolean | string); get logoLink(): boolean | string; constructor(menuGlobalService: PoMenuGlobalService, menuService: PoMenuService, languageService: PoLanguageService); protected onThemeChange(): void; protected setMenuExtraProperties(): void; protected setMenuItemProperties(menuItem: PoMenuItem): void; protected validateMenus(menus: any): void; protected setMenuType(menuItem: PoMenuItem): string; private configService; private processSubItems; private removeBadgeAlert; private setMenuBadgeAlert; private validateMenu; private applySizeBasedOnA11y; protected abstract checkActiveMenuByUrl(urlRouter: any): any; protected abstract checkingRouterChildrenFragments(): any; protected abstract validateCollapseClass(): any; }