@archbase/template 3.0.6 → 3.0.7

package/dist/template/src/ArchbaseLookupDataTemplate.d.ts

@@ -0,0 +1,48 @@
+import { default as React } from 'react';
+import { ArchbaseLookupDataTemplateProps, ArchbaseLookupDataTemplateRef } from './ArchbaseLookupDataTemplate.types';
+/**
+ * Implementação interna do ArchbaseLookupDataTemplate
+ */
+declare function ArchbaseLookupDataTemplateImpl<T extends object, ID = string>(props: ArchbaseLookupDataTemplateProps<T, ID>, ref: React.ForwardedRef<ArchbaseLookupDataTemplateRef<T>>): import("react/jsx-runtime").JSX.Element;
+/**
+ * ArchbaseLookupDataTemplate - Template de lookup/pesquisa com grid de dados
+ *
+ * @example
+ * // Seleção única com loadData
+ * <ArchbaseLookupDataTemplate<VeiculoDto>
+ *   opened={opened}
+ *   title="Selecionar Veículo"
+ *   selectionMode="single"
+ *   loadData={loadVeiculos}
+ *   idField="id"
+ *   displayField="placa"
+ *   onSelect={handleSelect}
+ *   onClose={() => setOpened(false)}
+ * >
+ *   <Columns>
+ *     <ArchbaseDataGridColumn dataField="placa" header="Placa" size={120} />
+ *   </Columns>
+ * </ArchbaseLookupDataTemplate>
+ *
+ * @example
+ * // Seleção múltipla com DataSource externo
+ * <ArchbaseLookupDataTemplate<ProdutoDto>
+ *   opened={opened}
+ *   title="Selecionar Produtos"
+ *   selectionMode="multiple"
+ *   dataSource={dsProducts}
+ *   maxSelections={10}
+ *   idField="id"
+ *   displayField="nome"
+ *   onSelectMultiple={handleSelectMultiple}
+ *   onClose={() => setOpened(false)}
+ * >
+ *   <Columns>
+ *     <ArchbaseDataGridColumn dataField="nome" header="Nome" size={200} />
+ *   </Columns>
+ * </ArchbaseLookupDataTemplate>
+ */
+export declare const ArchbaseLookupDataTemplate: <T extends object, ID = string>(props: ArchbaseLookupDataTemplateProps<T, ID> & {
+    ref?: React.ForwardedRef<ArchbaseLookupDataTemplateRef<T>>;
+}) => ReturnType<typeof ArchbaseLookupDataTemplateImpl>;
+export {};

package/dist/template/src/ArchbaseLookupDataTemplate.types.d.ts

@@ -0,0 +1,164 @@
+import { ReactNode } from 'react';
+import { ArchbaseDataSource } from '../../data/src';
+import { FilterOptions, ArchbaseQueryFilterDelegator } from '../../advanced/src';
+import { ArchbaseTemplateSecurityProps } from './ArchbaseTemplateCommonTypes';
+/**
+ * Modo de seleção do lookup
+ */
+export type LookupSelectionMode = 'single' | 'multiple';
+/**
+ * Labels customizáveis do componente
+ */
+export interface LookupLabels {
+    okButton?: string;
+    cancelButton?: string;
+    clearButton?: string;
+    selectedLabel?: string;
+    doubleClickHint?: string;
+    noItemSelected?: string;
+    itemsSelected?: string;
+}
+/**
+ * Props principais do ArchbaseLookupDataTemplate
+ */
+export interface ArchbaseLookupDataTemplateProps<T extends object, ID = string> extends ArchbaseTemplateSecurityProps {
+    /** Estado de abertura do modal */
+    opened: boolean;
+    /** Título do modal */
+    title: string;
+    /** Colunas do grid (children: <Columns><ArchbaseDataGridColumn /></Columns>) */
+    children: ReactNode;
+    /** Callback quando o modal é fechado */
+    onClose: () => void;
+    /** Campo usado como ID único */
+    idField: keyof T;
+    /** Campo principal para exibir no resumo do item selecionado */
+    displayField: keyof T;
+    /** Modo de seleção: 'single' (padrão) ou 'multiple' */
+    selectionMode?: LookupSelectionMode;
+    /** Callback quando um item é selecionado (seleção única) */
+    onSelect?: (item: T) => void;
+    /** Callback quando múltiplos itens são selecionados (seleção múltipla) */
+    onSelectMultiple?: (items: T[]) => void;
+    /** Itens pré-selecionados (para inicialização ou edição) */
+    initialSelectedItems?: T[];
+    /** Seleção por duplo clique (apenas single). Default: true */
+    selectOnDoubleClick?: boolean;
+    /** Callback antes de confirmar a seleção (retornar false cancela) */
+    onBeforeConfirm?: (items: T[]) => boolean | Promise<boolean>;
+    /** Callback após confirmar a seleção */
+    onAfterConfirm?: (items: T[]) => void;
+    /**
+     * DataSource externo (quando fornecido, o componente não cria um interno)
+     * Suporta tanto V1 quanto V2 automaticamente
+     */
+    dataSource?: ArchbaseDataSource<T, ID>;
+    /**
+     * Função para carregar dados (usada quando dataSource não é fornecido)
+     * @param searchValue - Valor de busca
+     * @param searchFields - Campos para busca
+     * @returns Promise com array de registros
+     */
+    loadData?: (searchValue?: string, searchFields?: string) => Promise<T[]>;
+    /** Campos para busca (separados por vírgula) */
+    searchFields?: string;
+    /** Tamanho da página para paginação. Default: 100 */
+    pageSize?: number;
+    /** Campo secundário para exibir no resumo (opcional) */
+    displaySubField?: keyof T;
+    /** Função customizada para renderizar o item selecionado */
+    renderSelectedItem?: (item: T) => ReactNode;
+    /** Função customizada para renderizar a lista de itens selecionados (múltipla seleção) */
+    renderSelectedItems?: (items: T[]) => ReactNode;
+    /** Ícone do título */
+    icon?: ReactNode;
+    /** Tamanho do modal. Default: '70%' */
+    modalSize?: string | number;
+    /** Altura do modal. Default: '600px' */
+    modalHeight?: string | number;
+    /** Altura do grid. Default: 400 */
+    gridHeight?: number;
+    /** Altura das linhas do grid. Default: 52 */
+    rowHeight?: number;
+    /** Cor de fundo do indicador de seleção. Default: 'blue.0' */
+    selectionIndicatorColor?: string;
+    /** Exibir indicador de seleção. Default: true */
+    showSelectionIndicator?: boolean;
+    /** Máximo de itens selecionáveis. Default: undefined (sem limite) */
+    maxSelections?: number;
+    /** Exibir contador de seleção. Default: true */
+    showSelectionCount?: boolean;
+    /** Permitir desmarcar todos. Default: true */
+    allowClearAll?: boolean;
+    /** Tipo de filtro: 'none' | 'simple' | 'advanced'. Default: 'simple' */
+    filterType?: 'none' | 'simple' | 'advanced';
+    /** Opções do filtro avançado (quando filterType='advanced') */
+    filterOptions?: FilterOptions;
+    /** Delegador de persistência de filtros */
+    filterPersistenceDelegator?: ArchbaseQueryFilterDelegator;
+    /** Campos de filtro para o QueryBuilder */
+    filterFields?: ReactNode;
+    /** Indicador de carregamento externo */
+    isLoading?: boolean;
+    /** Indicador de erro */
+    isError?: boolean;
+    /** Mensagem de erro */
+    error?: string;
+    /** Função para limpar erro */
+    clearError?: () => void;
+    /** Tempo para auto-fechar alerta de erro (ms). Default: 15000 */
+    autoCloseAlertError?: number;
+    /** Callback quando ocorre erro ao carregar dados */
+    onError?: (error: any) => void;
+    /** Ações customizadas na toolbar */
+    userActions?: ReactNode;
+    /** Labels customizáveis */
+    labels?: LookupLabels;
+    /** Variante de estilo */
+    variant?: string;
+}
+/**
+ * Interface para os métodos expostos via ref do ArchbaseLookupDataTemplate
+ */
+export interface ArchbaseLookupDataTemplateRef<T = any> {
+    /**
+     * Obtém os itens atualmente selecionados
+     */
+    getSelectedItems: () => T[];
+    /**
+     * Obtém um único item selecionado (para modo single)
+     */
+    getSelectedItem: () => T | null;
+    /**
+     * Limpa toda a seleção
+     */
+    clearSelection: () => void;
+    /**
+     * Seleciona itens programaticamente
+     */
+    selectItems: (items: T[]) => void;
+    /**
+     * Seleciona um único item programaticamente
+     */
+    selectItem: (item: T) => void;
+    /**
+     * Remove um item da seleção
+     */
+    deselectItem: (item: T) => void;
+    /**
+     * Atualiza/recarrega os dados do grid
+     */
+    refreshData: () => void;
+    /**
+     * Obtém o DataSource interno/externo
+     */
+    getDataSource: () => ArchbaseDataSource<T, any> | null;
+    /**
+     * Confirma a seleção (equivalente a clicar OK)
+     */
+    confirmSelection: () => Promise<void>;
+    /**
+     * Cancela a seleção (equivalente a clicar Cancelar)
+     */
+    cancelSelection: () => void;
+}

package/dist/template/src/hooks/index.d.ts

@@ -1 +1,2 @@
 export * from './useOptionalTemplateSecurity';
+export * from './useArchbaseLookup';

package/dist/template/src/hooks/useArchbaseLookup.d.ts

@@ -0,0 +1,124 @@
+/**
+ * Opções para configurar o hook useArchbaseLookup
+ */
+export interface UseArchbaseLookupOptions<T> {
+    /**
+     * Callback executado quando um item é selecionado (modo single)
+     * Chamado antes de fechar o modal
+     */
+    onSelect?: (item: T) => void;
+    /**
+     * Callback executado quando múltiplos itens são selecionados (modo multiple)
+     * Chamado antes de fechar o modal
+     */
+    onSelectMultiple?: (items: T[]) => void;
+    /**
+     * Item inicial selecionado (para pré-selecionar um valor)
+     */
+    initialValue?: T | null;
+    /**
+     * Itens iniciais selecionados (para modo múltipla seleção)
+     */
+    initialValues?: T[];
+    /**
+     * Modo de seleção: 'single' ou 'multiple'
+     * Default: 'single'
+     */
+    selectionMode?: 'single' | 'multiple';
+    /**
+     * Se true, fecha o modal automaticamente após seleção
+     * Default: true
+     */
+    autoClose?: boolean;
+    /**
+     * Callback executado quando o modal é aberto
+     */
+    onOpen?: () => void;
+    /**
+     * Callback executado quando o modal é fechado
+     */
+    onClose?: () => void;
+}
+/**
+ * Props para passar diretamente ao ArchbaseLookupDataTemplate
+ * Facilita a integração via spread: {...lookup.lookupProps}
+ */
+export interface LookupTemplateProps<T> {
+    opened: boolean;
+    onClose: () => void;
+    onSelect: (item: T) => void;
+    onSelectMultiple: (items: T[]) => void;
+    selectionMode: 'single' | 'multiple';
+    initialSelectedItems?: T[];
+}
+/**
+ * Retorno do hook useArchbaseLookup
+ */
+export interface UseArchbaseLookupReturn<T> {
+    /** Indica se o modal está aberto */
+    opened: boolean;
+    /** Item selecionado (modo single) */
+    selectedItem: T | null;
+    /** Itens selecionados (modo multiple) */
+    selectedItems: T[];
+    /** Abre o modal de lookup */
+    open: () => void;
+    /** Fecha o modal de lookup */
+    close: () => void;
+    /** Limpa a seleção atual */
+    clear: () => void;
+    /** Define um item selecionado programaticamente */
+    setSelectedItem: (item: T | null) => void;
+    /** Define múltiplos itens selecionados programaticamente */
+    setSelectedItems: (items: T[]) => void;
+    /** Handler para seleção única (usado internamente pelo modal) */
+    handleSelect: (item: T) => void;
+    /** Handler para seleção múltipla (usado internamente pelo modal) */
+    handleSelectMultiple: (items: T[]) => void;
+    /** Handler para fechar o modal (usado internamente pelo modal) */
+    handleClose: () => void;
+    /**
+     * Props para passar diretamente ao ArchbaseLookupDataTemplate
+     * Uso: <ArchbaseLookupDataTemplate {...lookup.lookupProps} ... />
+     */
+    lookupProps: LookupTemplateProps<T>;
+}
+/**
+ * Hook para gerenciar estado de lookup e integrar com editores
+ *
+ * @example Uso básico com seleção única
+ * ```tsx
+ * function MeuFormulario() {
+ *   const lookup = useArchbaseLookup<VeiculoDto>({
+ *     onSelect: (veiculo) => {
+ *       dataSource.setFieldValue('veiculo', veiculo)
+ *     }
+ *   })
+ *
+ *   return (
+ *     <>
+ *       <ArchbaseLookupEdit
+ *         onActionSearchExecute={lookup.open}
+ *         // ...
+ *       />
+ *       <ArchbaseLookupDataTemplate
+ *         {...lookup.lookupProps}
+ *         title="Selecionar Veículo"
+ *         // ...
+ *       />
+ *     </>
+ *   )
+ * }
+ * ```
+ *
+ * @example Uso com seleção múltipla
+ * ```tsx
+ * const lookup = useArchbaseLookup<ProdutoDto>({
+ *   selectionMode: 'multiple',
+ *   onSelectMultiple: (produtos) => {
+ *     setProdutosSelecionados(produtos)
+ *   }
+ * })
+ * ```
+ */
+export declare function useArchbaseLookup<T>(options?: UseArchbaseLookupOptions<T>): UseArchbaseLookupReturn<T>;

package/dist/template/src/index.d.ts

@@ -6,6 +6,8 @@ export * from './ArchbaseMasonryTemplate';
 export * from './ArchbasePanelTemplate';
 export * from './ArchbaseSpaceTemplate';
 export * from './ArchbaseSearchTemplate';
+export * from './ArchbaseLookupDataTemplate';
+export * from './ArchbaseLookupDataTemplate.types';
 export * from './ArchbaseTemplateCommonTypes';
 export * from './ArchbaseTemplateState';
 export * from './ArchbaseStateValues';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@archbase/template",
-  "version": "3.0.6",
+  "version": "3.0.7",
   "description": "Template components for Archbase React v3 - High-level templates and layouts",
   "author": "Edson Martins <edsonmartins2005@gmail.com>",
   "license": "MIT",
@@ -13,35 +13,34 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
       "require": "./dist/index.js"
-    },
-    "./dist/index.css": "./dist/index.css"
+    }
   },
   "files": [
     "dist",
     "README.md"
   ],
   "peerDependencies": {
-    "@mantine/core": "8.3.12",
-    "@mantine/dates": "8.3.12",
-    "@mantine/hooks": "8.3.12",
-    "@mantine/modals": "8.3.12",
+    "@mantine/core": "8.3.14",
+    "@mantine/dates": "8.3.14",
+    "@mantine/hooks": "8.3.14",
+    "@mantine/modals": "8.3.14",
     "@tabler/icons-react": "^3.26.0",
     "react": "^18.3.0 || ^19.2.0",
     "react-dom": "^18.3.0 || ^19.2.0"
   },
   "dependencies": {
-    "@archbase/advanced": "3.0.6",
-    "@archbase/components": "3.0.6",
-    "@archbase/core": "3.0.6",
-    "@archbase/data": "3.0.6",
-    "@archbase/layout": "3.0.6",
-    "@archbase/security": "3.0.6",
-    "@archbase/security-ui": "3.0.6",
     "@rehooks/component-size": "^1.0.3",
     "dayjs": "^1.11.13",
     "i18next": "^25.3.1",
     "lodash": "^4.17.21",
-    "react-i18next": "^15.1.2"
+    "react-i18next": "^15.1.2",
+    "@archbase/advanced": "3.0.7",
+    "@archbase/components": "3.0.7",
+    "@archbase/core": "3.0.7",
+    "@archbase/data": "3.0.7",
+    "@archbase/layout": "3.0.7",
+    "@archbase/security": "3.0.7",
+    "@archbase/security-ui": "3.0.7"
   },
   "devDependencies": {
     "@types/react": "^19.0.6",