@masterkeymaterial/ui 0.2.21 → 0.2.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@masterkeymaterial/ui",
-  "version": "0.2.21",
+  "version": "0.2.24",
   "description": "Biblioteca Angular de componentes UI e campos de formulario reutilizaveis para construir formularios dinamicos.",
   "keywords": [
     "angular",

package/types/masterkeymaterial-ui.d.ts

@@ -990,7 +990,7 @@ interface IOrdenacao {
 interface IPaginacao {
     paginaAtual: number;
     totalItens: number;
-    totalagrupado: number;
+    totalAgrupado: number;
 }
 interface IGridConfigActions {
     inmenu?: boolean;
@@ -1022,21 +1022,56 @@ interface IActionsLineConfig extends IGridBaseActions {
     headerClasse?: string;
 }
 interface IGridConfig<T> {
+    colunas: IColuna<T>[];
+    primarykey?: string;
+    nameEntity?: string;
+    actionsLine?: IGridConfigActions[];
+    actionsLineConfig?: Partial<IActionsLineConfig>;
+    showActionsLine?: boolean;
+    actionsTop?: IGridConfigActions[];
+    actionsTopConfig?: Partial<IGridBaseActions>;
+    showActionsTop?: boolean;
+    InativeRule?: (linha: any) => boolean;
+    SelectionDisabledRule?: (linha: any) => boolean;
+    backgroundHue?: (linha: any) => number;
+    filterSearchIcon?: string;
+    filterBarStartCollapsed?: boolean;
+    paginations?: IKV[];
+    paginationSize?: number;
+    showControlBar?: boolean;
+    showSearch?: boolean;
+    showFilterBar?: boolean;
+    showGridMenu?: boolean;
+    showInfoBar?: boolean;
+    showMenuIcon?: boolean;
+    showPagination?: boolean;
+    hasVerticalLine?: boolean;
+    hasSeletor?: boolean;
+    hasGrid?: boolean;
+    minLineHeight?: string;
+    isCompacted?: boolean;
+    selectionMode?: 'single' | 'multiple' | 'none';
+    startSelected?: any[];
+    onSelected?: (linha: any, selecionados: any[]) => Promise<void> | void;
+    onUnselected?: (linha: any, selecionados: any[]) => Promise<void> | void;
+    onSelectionChanged?: (linha: any, selecionados: any[]) => Promise<void> | void;
+    hasError?: boolean;
+    isLoaded?: boolean;
+    timeRequest?: number;
+    lastGridEventAPI?: IGridEventAPI<T>;
+}
+declare const GRID_CONFIG_DEFAULTS: {
+    primarykey: string;
+    nameEntity: string | undefined;
     actionsTop: IGridConfigActions[];
     actionsTopConfig: IGridBaseActions;
     actionsLine: IGridConfigActions[];
     actionsLineConfig: IActionsLineConfig;
-    InativeRule: (linha: any) => boolean;
-    SelectionDisabledRule?: (linha: any) => boolean;
-    colunas: IColuna<T>[];
+    InativeRule: (_: any) => boolean;
     filterSearchIcon: string;
     filterBarStartCollapsed: boolean;
-    screen: Signal<ScreenMode>;
-    itensPorPagina: Signal<number>;
-    lastGridEventAPI?: IGridEventAPI<T>;
-    nameEntity: string | undefined;
     paginations: IKV[];
-    primarykey: string;
+    paginationSize: number;
     showControlBar: boolean;
     showSearch: boolean;
     showFilterBar: boolean;
@@ -1046,21 +1081,15 @@ interface IGridConfig<T> {
     showActionsLine: boolean;
     showActionsTop: boolean;
     showPagination: boolean;
-    timeRequest?: number;
-    onSelected?: (linha: any, selecionados: any[]) => Promise<void> | void;
-    onUnselected?: (linha: any, selecionados: any[]) => Promise<void> | void;
-    onSelectionChanged?: (linha: any, selecionados: any[]) => Promise<void> | void;
-    startSelected?: any[];
-    selectionMode: 'single' | 'multiple' | 'none';
+    selectionMode: "single" | "multiple" | "none";
     hasError: boolean;
     hasVerticalLine: boolean;
     hasSeletor: boolean;
     hasGrid: boolean;
-    minLineHeight?: string;
-    isCompacted?: boolean;
+    minLineHeight: string;
+    isCompacted: boolean;
     isLoaded: boolean;
-    backgroundHue?: (linha: any) => number;
-}
+};
 interface IGridParam<T> {
     coluna: IColuna<T>;
     colunas: IColuna<T>[];
@@ -1139,6 +1168,10 @@ declare class MkGrid {
     hasSeletor: _angular_core.ModelSignal<boolean>;
     todosSelecionados: _angular_core.WritableSignal<boolean>;
     isSelectingAll: _angular_core.WritableSignal<boolean>;
+    pageSizeOptions: _angular_core.WritableSignal<IKV[] | undefined>;
+    private windowWidth;
+    private _resizeListener;
+    currentDevice: _angular_core.Signal<"Mobile" | "Desktop">;
     devMode: boolean;
     maxActionsInLine: number;
     eHost: ElementRef<any>;
@@ -1149,9 +1182,40 @@ declare class MkGrid {
     protected gridId: string;
     protected ordenacoesSignal: _angular_core.WritableSignal<IOrdenacao[]>;
     protected paginacaoSignal: _angular_core.WritableSignal<IPaginacao>;
+    protected cfg: _angular_core.Signal<{
+        primarykey: string;
+        nameEntity: string | undefined;
+        actionsTop: IGridConfigActions[];
+        actionsTopConfig: IGridBaseActions;
+        actionsLine: IGridConfigActions[];
+        actionsLineConfig: IActionsLineConfig;
+        InativeRule: (_: any) => boolean;
+        filterSearchIcon: string;
+        filterBarStartCollapsed: boolean;
+        paginations: IKV[];
+        paginationSize: number;
+        showControlBar: boolean;
+        showSearch: boolean;
+        showFilterBar: boolean;
+        showGridMenu: boolean;
+        showInfoBar: boolean;
+        showMenuIcon: boolean;
+        showActionsLine: boolean;
+        showActionsTop: boolean;
+        showPagination: boolean;
+        selectionMode: "single" | "multiple" | "none";
+        hasError: boolean;
+        hasVerticalLine: boolean;
+        hasSeletor: boolean;
+        hasGrid: boolean;
+        minLineHeight: string;
+        isCompacted: boolean;
+        isLoaded: boolean;
+    } & IGridConfig<any>>;
     performance: _angular_core.Signal<string>;
-    itensPorPagina: _angular_core.Signal<number>;
     constructor();
+    paginationSize: _angular_core.ModelSignal<number | undefined>;
+    paginationComputedSize: _angular_core.Signal<number>;
     ngOnInit(): void;
     ngOnDestroy(): void;
     ngAfterViewInit(): void;
@@ -1211,7 +1275,7 @@ declare class MkGrid {
     onResizeStart(event: MouseEvent, coluna: IColunaComLargura): void;
     onDoubleClickControls(event: Event, coluna: IColunaComLargura): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkGrid, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkGrid, "lib-mk-grid", never, { "lista": { "alias": "lista"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": true; "isSignal": true; }; "filtro": { "alias": "filtro"; "required": false; "isSignal": true; }; "minLineHeight": { "alias": "minLineHeight"; "required": false; "isSignal": true; }; "isCompacted": { "alias": "isCompacted"; "required": false; "isSignal": true; }; "hasGrid": { "alias": "hasGrid"; "required": false; "isSignal": true; }; "hasVerticalLine": { "alias": "hasVerticalLine"; "required": false; "isSignal": true; }; "hasSeletor": { "alias": "hasSeletor"; "required": false; "isSignal": true; }; }, { "minLineHeight": "minLineHeightChange"; "isCompacted": "isCompactedChange"; "hasGrid": "hasGridChange"; "hasVerticalLine": "hasVerticalLineChange"; "hasSeletor": "hasSeletorChange"; }, never, ["*", "[mkGridError]", "[mkGridLoading]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkGrid, "lib-mk-grid", never, { "lista": { "alias": "lista"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": true; "isSignal": true; }; "filtro": { "alias": "filtro"; "required": false; "isSignal": true; }; "minLineHeight": { "alias": "minLineHeight"; "required": false; "isSignal": true; }; "isCompacted": { "alias": "isCompacted"; "required": false; "isSignal": true; }; "hasGrid": { "alias": "hasGrid"; "required": false; "isSignal": true; }; "hasVerticalLine": { "alias": "hasVerticalLine"; "required": false; "isSignal": true; }; "hasSeletor": { "alias": "hasSeletor"; "required": false; "isSignal": true; }; "paginationSize": { "alias": "paginationSize"; "required": false; "isSignal": true; }; }, { "minLineHeight": "minLineHeightChange"; "isCompacted": "isCompactedChange"; "hasGrid": "hasGridChange"; "hasVerticalLine": "hasVerticalLineChange"; "hasSeletor": "hasSeletorChange"; "paginationSize": "paginationSizeChange"; }, never, ["*", "[mkGridError]", "[mkGridLoading]"], true, never>;
 }
 
 declare class GridCell {
@@ -1222,5 +1286,5 @@ declare class GridCell {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridCell, "lib-grid-cell", never, {}, {}, never, never, true, never>;
 }
 
-export { BaseFieldsForm, BaseFieldsValues, CampoDe, FieldsGeneric, FiltroDe, FormAction, FormFilter, FormNoAction, FormatedValues, Formulario, GRID_PARAMS_TOKEN, GridCell, IField, IGridFilterType, IRegraTipo, LibUtil, MkGrid, PAGINATION_OPTIONS, Regra, ScreenMode, SingleValues, UiButton, UiCheckBox, UiChip, UiDropZone, UiFileList, UiListErrors, UiLoading, UiMenu, UiProcurar, UiProgress, UiSelect, UiSlide };
+export { BaseFieldsForm, BaseFieldsValues, CampoDe, FieldsGeneric, FiltroDe, FormAction, FormFilter, FormNoAction, FormatedValues, Formulario, GRID_CONFIG_DEFAULTS, GRID_PARAMS_TOKEN, GridCell, IField, IGridFilterType, IRegraTipo, LibUtil, MkGrid, PAGINATION_OPTIONS, Regra, ScreenMode, SingleValues, UiButton, UiCheckBox, UiChip, UiDropZone, UiFileList, UiListErrors, UiLoading, UiMenu, UiProcurar, UiProgress, UiSelect, UiSlide };
 export type { IActionClickEvent, IActionsDone, IActionsLineConfig, IClassOf, IColuna, IColunaImage, IDadosDaLinha, IDisplayValue, IDropOutput, IDropType, IDropZoneEvent, IFaseCampos, IFaseCamposAgrupados, IFases, IFieldComponent, IFields, IFileMetadata, IFilterFields, IFormatter, IGridBaseActions, IGridCellComponentConfig, IGridConfig, IGridConfigActions, IGridEventAPI, IGridFilter, IGridParam, IKV, IKV_ext, IMkCellService, IModeShowEntidade, IOptionValue, IOrdenacao, IPaginacao, IRegra, ISaveTasks, ITipoBotao, ITiposTema, IUiProgressMode, IUtilFormatters, MapeamentoItem };

package/README.md

@@ -1,137 +0,0 @@
-# @masterkeymaterial/ui
-
-Guia de instalacao para consumidores da biblioteca.
-
-## Instalacao
-
-```bash
-npm install @masterkeymaterial/ui
-```
-
-## Pre-requisitos
-
-Projeto consumidor com:
-
-```json
-{
-  "@angular/common": "^21.2.0",
-  "@angular/core": "^21.2.0",
-  "@angular/platform-browser": "^21.2.0"
-}
-```
-
-## Verificacao Rapida
-
-Depois da instalacao:
-
-```bash
-npm ls @masterkeymaterial/ui
-```
-
-## MkGrid (uso rapido)
-
-O componente `MkGrid` ja esta disponivel na superficie publica da lib junto com os tipos de configuracao.
-
-Exemplo minimo:
-
-```ts
-import { Component, computed, signal } from '@angular/core';
-import { IGridConfig, IGridFilterType, MkGrid, ScreenMode } from '@masterkeymaterial/ui';
-
-interface IPessoa {
-  id: number;
-  nome: string;
-  email: string;
-}
-
-@Component({
-  selector: 'app-grid-demo',
-  standalone: true,
-  imports: [MkGrid],
-  template: `<lib-mk-grid [lista]="dados()" [config]="config()"></lib-mk-grid>`
-})
-export class GridDemoComponent {
-  dados = signal<IPessoa[]>([
-    { id: 1, nome: 'Ana', email: 'ana@mk.com' },
-    { id: 2, nome: 'Bruno', email: 'bruno@mk.com' },
-  ]);
-
-  itensPorPagina = signal(10);
-  isSelected = signal(false);
-  screen = computed(() => ScreenMode.Desktop);
-
-  config = signal<IGridConfig<IPessoa>>({
-    actionsTop: [],
-    actionsTopConfig: {
-      menuDisplay: 'Acoes',
-      menuIcon: 'more_vert',
-      showMenuIcon: true,
-      width: '120px',
-      widthMax: '120px',
-      widthMin: '80px',
-      aloneAlwaysOutside: false,
-    },
-    actionsLine: [],
-    actionsLineConfig: {
-      menuDisplay: 'Mais',
-      menuIcon: 'more_vert',
-      showMenuIcon: true,
-      width: '120px',
-      widthMax: '120px',
-      widthMin: '80px',
-      aloneAlwaysOutside: false,
-      headerDisplayMore: 'Acoes',
-    },
-    InativeRule: () => false,
-    colunas: [
-      { prop: 'nome', titulo: 'Nome', sortable: true },
-      { prop: 'email', titulo: 'E-mail', sortable: true },
-    ],
-    filterSearchIcon: 'search',
-    filterBarStartCollapsed: false,
-    screen: this.screen,
-    itensPorPagina: this.itensPorPagina,
-    nameEntity: 'Pessoa',
-    paginations: [
-      { k: 10, v: '10' },
-      { k: 25, v: '25' },
-    ],
-    primarykey: 'id',
-    showControlBar: true,
-    showSearch: true,
-    showFilterBar: true,
-    showGridMenu: true,
-    showInfoBar: true,
-    showMenuIcon: true,
-    showActionsLine: false,
-    showActionsTop: false,
-    showPagination: true,
-    isSelected: this.isSelected,
-    selectionMode: 'none',
-    hasError: false,
-    hasVerticalLine: true,
-    hasSeletor: false,
-    hasGrid: true,
-    isLoaded: true,
-  });
-}
-```
-
-Guia completo de uso e customizacao:
-
-- `docs/08-mk-grid-guia-consumidor.md`
-
-## Teste local do MkGrid
-
-Para validar o consumo da lib em runtime dentro deste workspace:
-
-```bash
-npm run build:lib
-npx ng serve mk-grid-demo
-```
-
-O app de teste esta em `projects/mk-grid-demo` e renderiza o `MkGrid` com dados mockados para validar comportamento de DI e interacoes basicas.
-
-## Licenca
-
-MIT