# snk-grid ## Properties | Property | Attribute | Description | Type | Default | | ------------------------------- | ----------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | --------------------------------------- | | `actionsList` | -- | Lista de ações que devem ser usadas no botão "Mais opções" do `snk-taskbar`. | `Action[]` | `undefined` | | `autoFocus` | `auto-focus` | Define se a grade receberá o foco automaticamente ao ser carregada. | `boolean` | `true` | | `autoLoad` | `auto-load` | Define se os dados serão carregados automaticamente na inicialização do componente. | `boolean` | `undefined` | | `canEdit` | `can-edit` | Define se a edição de dados na grade está habilitada. | `boolean` | `true` | | `columnFilterDataSource` | -- | Define o data source para o filtro de colunas. | `IMultiSelectionListDataSource` | `new SnkMultiSelectionListDataSource()` | | `compact` | `compact` | Define se a grade deve ser exibida em modo compacto. | `boolean` | `undefined` | | `configName` | `config-name` | Nome usado para salvar e recuperar a configuração da grade. | `string` | `undefined` | | `disablePersonalizedFilter` | `disable-personalized-filter` | Desabilita a apresentação da opção de filtros personalizados na barra de filtros (chip de filtros) e no modal lateral de filtros (contêiner de filtros personalizados). | `boolean` | `undefined` | | `enableGridInsert` | `enable-grid-insert` | Habilita a inserção de registros diretamente na grade. | `boolean` | `false` | | `enableLockManagerLoadingComp` | `enable-lock-manager-loading-comp` | Define se o componente deve usar o LockManager para controle de carregamento da aplicação. | `boolean` | `false` | | `enableLockManagerTaskbarClick` | `enable-lock-manager-taskbar-click` | Ativa o gerenciamento de locks na grade pela Taskbar. | `boolean` | `false` | | `filterBarLegacyConfigName` | `filter-bar-legacy-config-name` | Chave da configuração legada da barra de filtros. | `string` | `undefined` | | `filterBarTitle` | `filter-bar-title` | Título que será apresentado na barra de filtros. | `string` | `undefined` | | `filterCustomConfig` | -- | | `SnkFilterItemConfig[]` | `undefined` | | `filterCustomConfigInterceptor` | -- | | `(config: SnkFilterItemConfig[]) => SnkFilterItemConfig[]` | `undefined` | | `gridHeaderCustomSlotId` | `grid-header-custom-slot-id` | Define o nome do slot para elementos customizados na `Taskbar` do cabeçalho da grade. | `string` | `'GRID_HEADER_CUSTOM_ELEMENTS'` | | `gridLegacyConfigName` | `grid-legacy-config-name` | Chave da configuração legada da grade. | `string` | `undefined` | | `isDetail` | `is-detail` | Determina se a grade está vinculada a um detalhe de outra tela. | `boolean` | `undefined` | | `messagesBuilder` | -- | Responsável por flexibilizar e padronizar o uso de mensagens nos blocos de construção. | `SnkMessageBuilder` | `undefined` | | `multipleEditionEnabled` | `multiple-edition-enabled` | Habilita a edição de múltiplos registros simultaneamente. | `boolean` | `true` | | `multipleSelection` | `multiple-selection` | Determina se a seleção de múltiplas linhas é permitida. | `boolean` | `undefined` | | `outlineMode` | `outline-mode` | Altera a aparência das bordas e sombras do componente. Se `false`, aplica o padrão de sombras (ideal para o elemento principal do layout). Se `true`, aplica um contorno (ideal para quando o componente está dentro de outro, como um painel ou pop-up). | `boolean` | `false` | | `paginationCounterMode` | `pagination-counter-mode` | Define o modo de exibição do contador de paginação. | `"auto" \| "hidden" \| "show"` | `'auto'` | | `presentationMode` | `presentation-mode` | Altera o modo de apresentação dos botões do `snk-taskbar`. | `PresentationMode.PRIMARY \| PresentationMode.SECONDARY \| PresentationMode.SINGLE_TASKBAR` | `PresentationMode.PRIMARY` | | `recordsValidator` | -- | Validador responsável por verificar a integridade dos dados de um registro. | `IRecordValidator` | `undefined` | | `resourceID` | `resource-i-d` | Identificador de recursos, como configurações e permissões de acesso. | `string` | `undefined` | | `selectionToastConfig` | -- | Configuração do toast de seleção da grade. | `ISelectionToastConfig` | `undefined` | | `statusResolver` | -- | Define a configuração de cores para a coluna de status. | `((data: object) => string) \| IStatusResolver` | `undefined` | | `strategyExporter` | `strategy-exporter` | Define o modo de exportação dos dados. | `"ClientSideExporterStrategy" \| "ServerSideExporterStrategy"` | `ExporterStrategy.SERVER_SIDE` | | `suppressCheckboxColumn` | `suppress-checkbox-column` | Informa se a coluna de checkbox deve ser suprimida. | `boolean` | `undefined` | | `suppressFilterColumn` | `suppress-filter-column` | Informa se a grade deve suprimir o filtro de coluna. | `boolean` | `false` | | `suppressHorizontalScroll` | `suppress-horizontal-scroll` | Define se a grade deve suprimir a barra de rolagem horizontal. | `boolean` | `false` | | `taskbarCustomContainerId` | `taskbar-custom-container-id` | Define o identificador do contêiner de elementos customizados da `Taskbar`. | `string` | `undefined` | | `taskbarManager` | -- | Gerenciador das barras de tarefas. Permite determinar botões específicos ou gerenciar o estado dos botões. | `TaskbarManager` | `undefined` | | `topTaskbarCustomSlotId` | `top-taskbar-custom-slot-id` | Define o nome do slot para elementos customizados na `Taskbar` principal do componente. | `string` | `'GRID_TASKBAR_CUSTOM_ELEMENTS'` | | `useEnterLikeTab` | `use-enter-like-tab` | Quando `true`, a tecla ENTER navega entre as células como a tecla TAB. | `boolean` | `false` | | `useSearchColumn` | `use-search-column` | Define se a grade deve exibir um buscador de colunas ao pressionar `Ctrl+F`. | `boolean` | `true` | ## Events | Event | Description | Type | | ----------------- | ------------------------------------------------------------ | --------------------- | | `actionClick` | Emitido ao clicar em um botão de ação ou item de menu. | `CustomEvent` | | `componentReady` | Emitido quando o componente estiver completamente carregado. | `CustomEvent` | | `gridDoubleClick` | Emitido ao realizar um duplo clique em uma linha da grade. | `CustomEvent` | ## Methods ### `addCustomEditor(fieldName: string, customEditor: ICustomEditor, detailContext?: string) => Promise` Registra um editor customizado para um campo da grade ou formulário. #### Returns Type: `Promise` Uma promessa que é resolvida quando o editor é registrado. --- ### `addCustomValueFormatter(columnName: string, customFormatter: ICustomFormatter) => Promise` Registra um formatador de valor customizado para uma coluna da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando o formatador é registrado. --- ### `addGridCustomRender(fieldName: string, customRender: ICustomRender, detailContext?: string) => Promise` Registra um renderizador customizado para uma coluna da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando o renderizador é registrado. --- ### `getFilterBar() => Promise` Retorna o elemento da barra de filtros da grade. #### Returns Type: `Promise` O elemento da barra de filtros. --- ### `hideConfig() => Promise` Fecha a janela de configurações da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando a janela de configuração é fechada. --- ### `refreshColumnFilterDataSource() => Promise` #### Returns Type: `Promise` --- ### `reloadConfig() => Promise` Recarrega a configuração da grade. #### Returns Type: `Promise` --- ### `reloadFilterBar() => Promise` Recarrega a barra de filtros da grade, buscando o estado do servidor. #### Returns Type: `Promise` Uma promessa que é resolvida quando a barra de filtros é recarregada. --- ### `removeCustomValueFormatter(columnName: string) => Promise` Remove um formatador de valor customizado de uma coluna da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando o formatador é removido. --- ### `setConfig(config: IGridConfig) => Promise` Define a configuração da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando a configuração é aplicada. --- ### `setFocus() => Promise` Atribui o foco para a grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando o foco é atribuído. --- ### `showConfig() => Promise` Exibe a janela de configurações da grade. #### Returns Type: `Promise` Uma promessa que é resolvida quando a janela de configuração é exibida. ## Dependencies ### Used by - [snk-crud](../snk-crud) - [snk-detail-view](../snk-crud/subcomponents/snk-detail-view) ### Depends on - [snk-filter-bar](../snk-filter-bar) - [snk-taskbar](../snk-taskbar) - [snk-grid-config](../snk-grid-config) - [snk-data-exporter](../snk-data-exporter) - [snk-actions-button](../snk-actions-button) - [taskbar-split-button](../snk-taskbar/elements/taskbar-split-button) - [taskbar-actions-button](../snk-taskbar/elements/taskbar-actions-button) ### Graph ```mermaid graph TD; snk-grid --> snk-filter-bar snk-grid --> snk-taskbar snk-grid --> snk-grid-config snk-grid --> snk-data-exporter snk-grid --> snk-actions-button snk-grid --> taskbar-split-button snk-grid --> taskbar-actions-button snk-filter-bar --> snk-filter-item snk-filter-bar --> snk-personalized-filter snk-filter-bar --> snk-filter-modal snk-filter-item --> snk-filter-detail snk-personalized-filter --> snk-filter-field-search snk-personalized-filter --> snk-filter-assistent-mode snk-personalized-filter --> snk-filter-advanced-mode snk-personalized-filter --> snk-simple-bar snk-filter-assistent-mode --> snk-expression-group snk-expression-group --> snk-expression-item snk-expression-group --> snk-expression-group snk-expression-item --> snk-filter-field-search snk-expression-item --> snk-filter-param-config snk-filter-modal --> snk-filter-modal-item snk-filter-modal --> snk-default-filter snk-taskbar --> snk-data-exporter snk-taskbar --> snk-actions-button snk-taskbar --> taskbar-split-button snk-taskbar --> taskbar-actions-button snk-data-exporter --> snk-exporter-email-sender snk-grid-config --> snk-select-box snk-crud --> snk-grid snk-detail-view --> snk-grid style snk-grid fill:#f9f,stroke:#333,stroke-width:4px ``` ----------------------------------------------