@sankhyalabs/ezui 5.21.4 → 5.22.0-dev.10

package/dist/types/components.d.ts

@@ -11,17 +11,22 @@ import { SlotBuilder } from "./components/ez-list/ez-list";
 import { IPosition } from "./components/ez-badge/interfaces/IPosition";
 import { IBreadcrumbItem } from "./components/ez-breadcrumb/ez-breadcrumb";
 import { CardItem } from "./components/ez-card-item/ez-card-item";
+import { ChartAxis, ChartType } from "./components/ez-chart/interfaces";
+import { ChartSerie, SerieClickEvent } from "./components/ez-chart/interfaces/ChartSerie";
 import { CheckMode } from "./components/ez-check/CheckMode";
 import { IEzCheckBoxListPosition, IOption, ISearchArgument } from "./components/ez-combo-box/ez-combo-box";
-import { DataUnit, WaitingChange } from "@sankhyalabs/core";
+import { ICustomEditor } from "./utils/customEditor/interfaces/ICustomEditor";
+import { IFormViewField } from "./components/ez-form-view/interfaces";
+import { DataUnit, Record, WaitingChange } from "@sankhyalabs/core";
 import { DialogType } from "./components/ez-dialog/DialogType";
 import { IDropdownItem, IDropdownSubAction } from "./components/ez-dropdown/structure/DropdownItem";
 import { IFieldConfig, IFormConfig, IRecordValidator } from "./utils/form/interfaces";
 import { FormItems } from "./components/ez-form-view/structure";
-import { IFormViewField } from "./components/ez-form-view/interfaces/IFormViewField";
+import { IFormViewField as IFormViewField1 } from "./components/ez-form-view/interfaces/IFormViewField";
 import { EzGridColumn, EzGridColumnConfig, EzGridColumStateEvent, IGridConfig, IStatusResolver, StatusResolverFunction } from "./components/ez-grid/controller/EzGridController";
-import { ISelection, ISelectionToastConfig } from "./components/ez-grid/interfaces";
+import { ICustomFormatter, ISelection, ISelectionToastConfig } from "./components/ez-grid/interfaces";
 import { IMultiSelectionListDataSource } from "./components/ez-multi-selection-list/interfaces/IMultiSelectionListDataSource";
+import { ICustomRender } from "./utils/customRender/interfaces/ICustomRender";
 import { IGuideItem } from "./components/ez-guide-navigator/interfaces";
 import { ListGroup, ListItem, SlotBuilder as SlotBuilder1, TListMode } from "./components/ez-list/ez-list";
 import { THeightMode } from "./components/ez-modal/ez-modal";
@@ -32,6 +37,7 @@ import { Radio } from "./components/ez-radio-button/ez-radio-button";
 import { EzScrollDirection } from "./components/ez-scroller/EzScrollDirection";
 import { IOption as IOption1, ISearchArgument as ISearchArgument1 } from "./components/ez-search/ez-search";
 import { IEzCheckBoxListPosition as IEzCheckBoxListPosition1 } from "./components/ez-combo-box/ez-combo-box";
+import { ModeMenuEnum, SizeMenuEnum, TypeMenuEnum } from "./components/ez-sidebar-navigator/interfaces";
 import { Tab } from "./components/ez-tabselector/ez-tabselector";
 import { IStyled } from "./components/ez-text-edit/ez-text-edit";
 import { TFocusOptions as TFocusOptions1 } from "./components/ez-text-input/ez-text-input";
@@ -242,6 +248,44 @@ export namespace Components {
          */
         "item": CardItem;
     }
+    interface EzChart {
+        /**
+          * Define o sub titulo a ser apresentado no gráfico
+         */
+        "chartSubTitle": string;
+        /**
+          * Define o titulo a ser apresentado no gráfico
+         */
+        "chartTitle": string;
+        /**
+          * Define a altura do gráfico
+         */
+        "height": number;
+        /**
+          * Define se a legenda do gráfico deve ser apresentada ou não.
+         */
+        "legendEnabled": boolean;
+        /**
+          * Define as series a serem apresentadas no gráfico
+         */
+        "series": ChartSerie | Array<ChartSerie>;
+        /**
+          * Define o tipo de gráfico apresentado pelo componente
+         */
+        "type": ChartType;
+        /**
+          * Define uma largura do gráfico
+         */
+        "width": number;
+        /**
+          * Definições do eixo X do gráfico
+         */
+        "xAxis": ChartAxis | Array<ChartAxis>;
+        /**
+          * Definições do eixo Y do gráfico
+         */
+        "yAxis": ChartAxis | Array<ChartAxis>;
+    }
     interface EzCheck {
         /**
           * Define o modo compacto com espaçamento menor entre label e o input
@@ -447,6 +491,44 @@ export namespace Components {
          */
         "value": IOption | string;
     }
+    interface EzCustomFormInput {
+        /**
+          * Builder original do FormView que será chamado caso o custom não retorne nenhum valor.
+         */
+        "builderFallback": (field: IFormViewField) => HTMLElement;
+        /**
+          * Instância do editor customizado.
+         */
+        "customEditor": ICustomEditor;
+        /**
+          * Define de qual contexto o editor está sendo acionado.
+         */
+        "detailContext": string;
+        /**
+          * Campo que o elemento customizado representa.
+         */
+        "formViewField": IFormViewField;
+        /**
+          * Retorna se o conteúdo é inválido.
+         */
+        "isInvalid": () => Promise<boolean>;
+        /**
+          * Define os registros da linha selecionada.
+         */
+        "selectedRecord": Record;
+        /**
+          * Remove o foco do campo.
+         */
+        "setBlur": () => Promise<void>;
+        /**
+          * Aplica foco no campo.
+         */
+        "setFocus": () => Promise<void>;
+        /**
+          * Valores dos campos do formulário.
+         */
+        "value": any;
+    }
     interface EzDateInput {
         /**
           * Se false deixa de exibir a mensagem de erro dentro do campo.
@@ -654,6 +736,10 @@ export namespace Components {
         "value": string;
     }
     interface EzForm {
+        /**
+          * Registra um editor customizado para campos da grade e formulário.
+         */
+        "addCustomEditor": (fieldName: string, customEditor: ICustomEditor, detailContext?: string) => Promise<void>;
         /**
           * Configuração do formulário.
          */
@@ -666,20 +752,40 @@ export namespace Components {
           * Determina o campo que deve ficar em evidência.
          */
         "fieldToFocus": string;
+        /**
+          * Define se os campos que serão apresentados são todos estáticos. Quando verdadeira, ocorrerá no DataBinder o bind dos campos com o DataUnit.
+         */
+        "onlyStaticFields": boolean;
         /**
           * Define um validador responsável pela integridade dos registros.
          */
         "recordsValidator": IRecordValidator;
+        /**
+          * Altera/adiciona uma propriedade nos metadados do campo.
+         */
+        "setFieldProp": (fieldName: string, propName: string, value: any) => Promise<void>;
         /**
           * Realiza validação no conteúdo de todos os campos.
          */
         "validate": () => Promise<void>;
     }
     interface EzFormView {
+        /**
+          * Registra um editor customizado para campos da grade e formulário.
+         */
+        "addCustomEditor": (fieldName: string, customEditor: ICustomEditor, detailContext?: string) => Promise<void>;
         /**
           * Define a lista de metadados usada para criar os campos de user interface.
          */
-        "fields": Array<IFormViewField>;
+        "fields": Array<IFormViewField1>;
+        /**
+          * Define os registros da linha selecionada.
+         */
+        "selectedRecord": Record;
+        /**
+          * Altera/adiciona uma propriedade nos metados do campo.
+         */
+        "setFieldProp": (fieldName: string, propName: string, value: any) => Promise<void>;
         "showUp": () => Promise<void>;
     }
     interface EzGrid {
@@ -687,6 +793,22 @@ export namespace Components {
           * Adiciona item de menu nas colunas.
          */
         "addColumnMenuItem": (label: string, name: string, action: Function, icon: HTMLElement | string) => Promise<void>;
+        /**
+          * Registra um editor customizado para campos da grade e formulário.
+         */
+        "addCustomEditor": (fieldName: string, customEditor: ICustomEditor, detailContext?: string) => Promise<void>;
+        /**
+          * Registra um formatador de valores para uma coluna da grid.
+         */
+        "addCustomValueFormatter": (columnName: string, customFormatter: ICustomFormatter) => Promise<void>;
+        /**
+          * Registra um render customizado para colunas da grid.
+         */
+        "addGridCustomRender": (fieldName: string, customRender: ICustomRender, detailContext?: string) => Promise<void>;
+        /**
+          * Define se a grid será focada ao ser carregada.
+         */
+        "autoFocus"?: boolean;
         /**
           * Define se a edição está habilitada na grid.
          */
@@ -715,6 +837,10 @@ export namespace Components {
           * Obtém o estado atual das colunas.
          */
         "getColumnsState": () => Promise<Array<EzGridColumn>>;
+        /**
+          * Retorna o formatador customizado da coluna caso exista.
+         */
+        "getCustomValueFormatter": (columnName: string) => Promise<ICustomFormatter | undefined>;
         /**
           * Obtém as linhas selecionadas.
          */
@@ -735,6 +861,14 @@ export namespace Components {
           * Define um validador responsável pela integridade dos registros.
          */
         "recordsValidator": IRecordValidator;
+        /**
+          * Atualiza linhas da grade.
+         */
+        "refreshSelectedRows": () => Promise<void>;
+        /**
+          * Remove o formatador de valores de uma coluna da grid.
+         */
+        "removeCustomValueFormatter": (columnName: string) => Promise<void>;
         /**
           * Configuração da seleção de grade no toast.
          */
@@ -915,6 +1049,10 @@ export namespace Components {
           * Define se o modal será fechado ao clicar fora do conteúdo.
          */
         "closeOutsideClick": boolean;
+        /**
+          * Define se o modal será fechado se o mouse sair para fora do conteúdo.
+         */
+        "closeOutsideLeave"?: boolean;
         /**
           * Ativa o modo Full, permitindo que o Modal expanda-se verticalmente e ocupe todo o espaço disponível.
          */
@@ -957,6 +1095,10 @@ export namespace Components {
           * Define o estado do botão de confirmação.
          */
         "okButtonStatus": "HIDDEN"|"ENABLED"|"DISABLED";
+        /**
+          * Define a visibilidade do botão de fechar.
+         */
+        "showCloseButton"?: boolean;
         /**
           * Define se o cabeçalho será mostrado.
          */
@@ -1217,6 +1359,48 @@ export namespace Components {
     }
     interface EzSidebarButton {
     }
+    interface EzSidebarNavigator {
+        /**
+          * Método para fixar/desafixar o menu, emitindo o evento ezChangeMode.
+         */
+        "changeModeMenu": () => Promise<void>;
+        /**
+          * Método para fechar o menu automaticamente após uma ação, fluxo, etc.
+         */
+        "closeSidebar": () => Promise<void>;
+        /**
+          * Define se terá responsividade, Controle deverá ser pelo CSS.
+         */
+        "isResponsive": boolean;
+        /**
+          * Define se o menu será do tipo FIXED ou FLOAT.
+         */
+        "mode": ModeMenuEnum;
+        /**
+          * Método para abrir o menu automaticamente após uma ação, fluxo, etc.
+         */
+        "openSidebar": () => Promise<void>;
+        /**
+          * Define se o botão de "Recolher Menu" será exibido
+         */
+        "showCollapseMenu": boolean;
+        /**
+          * Define se o botão de "Fixar Menu" será exibido
+         */
+        "showFixedButton": boolean;
+        /**
+          * Define o tamanho do menu (small, medium, large).
+         */
+        "size": SizeMenuEnum;
+        /**
+          * Define o título do Sidebar Navigator
+         */
+        "titleMenu": string;
+        /**
+          * Define o tipo do menu (float, fixed ou dynamic (livre)).
+         */
+        "type": TypeMenuEnum;
+    }
     interface EzSkeleton {
         /**
           * Animation type
@@ -1328,6 +1512,7 @@ export namespace Components {
         "rebuildLayout": () => Promise<void>;
     }
     interface EzTabselector {
+        "goToTab": (tabIndex: number, silent?: boolean) => Promise<void>;
         /**
           * Define o index da aba selecionada.
          */
@@ -1687,6 +1872,10 @@ export interface EzCardItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLEzCardItemElement;
 }
+export interface EzChartCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLEzChartElement;
+}
 export interface EzCheckCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLEzCheckElement;
@@ -1783,6 +1972,10 @@ export interface EzSidebarButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLEzSidebarButtonElement;
 }
+export interface EzSidebarNavigatorCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLEzSidebarNavigatorElement;
+}
 export interface EzSplitButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLEzSplitButtonElement;
@@ -1874,6 +2067,12 @@ declare global {
         prototype: HTMLEzCardItemElement;
         new (): HTMLEzCardItemElement;
     };
+    interface HTMLEzChartElement extends Components.EzChart, HTMLStencilElement {
+    }
+    var HTMLEzChartElement: {
+        prototype: HTMLEzChartElement;
+        new (): HTMLEzChartElement;
+    };
     interface HTMLEzCheckElement extends Components.EzCheck, HTMLStencilElement {
     }
     var HTMLEzCheckElement: {
@@ -1898,6 +2097,12 @@ declare global {
         prototype: HTMLEzComboBoxElement;
         new (): HTMLEzComboBoxElement;
     };
+    interface HTMLEzCustomFormInputElement extends Components.EzCustomFormInput, HTMLStencilElement {
+    }
+    var HTMLEzCustomFormInputElement: {
+        prototype: HTMLEzCustomFormInputElement;
+        new (): HTMLEzCustomFormInputElement;
+    };
     interface HTMLEzDateInputElement extends Components.EzDateInput, HTMLStencilElement {
     }
     var HTMLEzDateInputElement: {
@@ -2036,6 +2241,12 @@ declare global {
         prototype: HTMLEzSidebarButtonElement;
         new (): HTMLEzSidebarButtonElement;
     };
+    interface HTMLEzSidebarNavigatorElement extends Components.EzSidebarNavigator, HTMLStencilElement {
+    }
+    var HTMLEzSidebarNavigatorElement: {
+        prototype: HTMLEzSidebarNavigatorElement;
+        new (): HTMLEzSidebarNavigatorElement;
+    };
     interface HTMLEzSkeletonElement extends Components.EzSkeleton, HTMLStencilElement {
     }
     var HTMLEzSkeletonElement: {
@@ -2136,10 +2347,12 @@ declare global {
         "ez-button": HTMLEzButtonElement;
         "ez-calendar": HTMLEzCalendarElement;
         "ez-card-item": HTMLEzCardItemElement;
+        "ez-chart": HTMLEzChartElement;
         "ez-check": HTMLEzCheckElement;
         "ez-chip": HTMLEzChipElement;
         "ez-collapsible-box": HTMLEzCollapsibleBoxElement;
         "ez-combo-box": HTMLEzComboBoxElement;
+        "ez-custom-form-input": HTMLEzCustomFormInputElement;
         "ez-date-input": HTMLEzDateInputElement;
         "ez-date-time-input": HTMLEzDateTimeInputElement;
         "ez-dialog": HTMLEzDialogElement;
@@ -2163,6 +2376,7 @@ declare global {
         "ez-scroller": HTMLEzScrollerElement;
         "ez-search": HTMLEzSearchElement;
         "ez-sidebar-button": HTMLEzSidebarButtonElement;
+        "ez-sidebar-navigator": HTMLEzSidebarNavigatorElement;
         "ez-skeleton": HTMLEzSkeletonElement;
         "ez-split-button": HTMLEzSplitButtonElement;
         "ez-split-item": HTMLEzSplitItemElement;
@@ -2375,6 +2589,48 @@ declare namespace LocalJSX {
          */
         "onEzClick"?: (event: EzCardItemCustomEvent<CardItem>) => void;
     }
+    interface EzChart {
+        /**
+          * Define o sub titulo a ser apresentado no gráfico
+         */
+        "chartSubTitle"?: string;
+        /**
+          * Define o titulo a ser apresentado no gráfico
+         */
+        "chartTitle"?: string;
+        /**
+          * Define a altura do gráfico
+         */
+        "height"?: number;
+        /**
+          * Define se a legenda do gráfico deve ser apresentada ou não.
+         */
+        "legendEnabled"?: boolean;
+        /**
+          * Evento emitido quando ocorre um click em uma serie do gráfico
+         */
+        "onEzSerieClick"?: (event: EzChartCustomEvent<SerieClickEvent>) => void;
+        /**
+          * Define as series a serem apresentadas no gráfico
+         */
+        "series"?: ChartSerie | Array<ChartSerie>;
+        /**
+          * Define o tipo de gráfico apresentado pelo componente
+         */
+        "type"?: ChartType;
+        /**
+          * Define uma largura do gráfico
+         */
+        "width"?: number;
+        /**
+          * Definições do eixo X do gráfico
+         */
+        "xAxis"?: ChartAxis | Array<ChartAxis>;
+        /**
+          * Definições do eixo Y do gráfico
+         */
+        "yAxis"?: ChartAxis | Array<ChartAxis>;
+    }
     interface EzCheck {
         /**
           * Define o modo compacto com espaçamento menor entre label e o input
@@ -2571,6 +2827,32 @@ declare namespace LocalJSX {
          */
         "value"?: IOption | string;
     }
+    interface EzCustomFormInput {
+        /**
+          * Builder original do FormView que será chamado caso o custom não retorne nenhum valor.
+         */
+        "builderFallback"?: (field: IFormViewField) => HTMLElement;
+        /**
+          * Instância do editor customizado.
+         */
+        "customEditor"?: ICustomEditor;
+        /**
+          * Define de qual contexto o editor está sendo acionado.
+         */
+        "detailContext"?: string;
+        /**
+          * Campo que o elemento customizado representa.
+         */
+        "formViewField"?: IFormViewField;
+        /**
+          * Define os registros da linha selecionada.
+         */
+        "selectedRecord"?: Record;
+        /**
+          * Valores dos campos do formulário.
+         */
+        "value"?: any;
+    }
     interface EzDateInput {
         /**
           * Se false deixa de exibir a mensagem de erro dentro do campo.
@@ -2820,6 +3102,10 @@ declare namespace LocalJSX {
           * Responsável por notificar quando ocorrer a renderização de itens do formulário.
          */
         "onFormItemsReady"?: (event: EzFormCustomEvent<FormItems>) => void;
+        /**
+          * Define se os campos que serão apresentados são todos estáticos. Quando verdadeira, ocorrerá no DataBinder o bind dos campos com o DataUnit.
+         */
+        "onlyStaticFields"?: boolean;
         /**
           * Define um validador responsável pela integridade dos registros.
          */
@@ -2829,7 +3115,7 @@ declare namespace LocalJSX {
         /**
           * Define a lista de metadados usada para criar os campos de user interface.
          */
-        "fields"?: Array<IFormViewField>;
+        "fields"?: Array<IFormViewField1>;
         /**
           * Evento emitido quando o componente foi totalmente carregado na DOM.
          */
@@ -2838,8 +3124,16 @@ declare namespace LocalJSX {
           * Responsável por notificar quando ocorrer a renderização de itens do formulário.
          */
         "onFormItemsReady"?: (event: EzFormViewCustomEvent<FormItems>) => void;
+        /**
+          * Define os registros da linha selecionada.
+         */
+        "selectedRecord"?: Record;
     }
     interface EzGrid {
+        /**
+          * Define se a grid será focada ao ser carregada.
+         */
+        "autoFocus"?: boolean;
         /**
           * Define se a edição está habilitada na grid.
          */
@@ -2974,6 +3268,10 @@ declare namespace LocalJSX {
           * Emitido quando acontece a alteração de um item do checkbox.
          */
         "onEzCheckChange"?: (event: EzListCustomEvent<ListItem>) => void;
+        /**
+          * Emitido quando ocorre um duplo clique em um item da lista.
+         */
+        "onEzDoubleClick"?: (event: EzListCustomEvent<ListItem>) => void;
         /**
           * Emitido sempre que um item da lista for selecionado.
          */
@@ -2998,6 +3296,10 @@ declare namespace LocalJSX {
           * Define se o modal será fechado ao clicar fora do conteúdo.
          */
         "closeOutsideClick"?: boolean;
+        /**
+          * Define se o modal será fechado se o mouse sair para fora do conteúdo.
+         */
+        "closeOutsideLeave"?: boolean;
         /**
           * Ativa o modo Full, permitindo que o Modal expanda-se verticalmente e ocupe todo o espaço disponível.
          */
@@ -3056,6 +3358,10 @@ declare namespace LocalJSX {
           * Representa a interação com o usuário. OK - Quando o botão é acionado CANCEL - Quando o botão de cancelar é acionado CLOSE - Quando o botão de fechar é acionado. LOAD - Quando o modal é carregado (eventualmente pode ser usado para dar foco a um elemento específico)
          */
         "onEzModalAction"?: (event: EzModalContainerCustomEvent<string>) => void;
+        /**
+          * Define a visibilidade do botão de fechar.
+         */
+        "showCloseButton"?: boolean;
         /**
           * Define se o cabeçalho será mostrado.
          */
@@ -3309,6 +3615,40 @@ declare namespace LocalJSX {
          */
         "onEzClick"?: (event: EzSidebarButtonCustomEvent<void>) => void;
     }
+    interface EzSidebarNavigator {
+        /**
+          * Define se terá responsividade, Controle deverá ser pelo CSS.
+         */
+        "isResponsive"?: boolean;
+        /**
+          * Define se o menu será do tipo FIXED ou FLOAT.
+         */
+        "mode"?: ModeMenuEnum;
+        /**
+          * Evento emitido sempre que o modo (FLOAT ou FIXED) do menu for alterado..
+         */
+        "onEzChangeMode"?: (event: EzSidebarNavigatorCustomEvent<ModeMenuEnum>) => void;
+        /**
+          * Define se o botão de "Recolher Menu" será exibido
+         */
+        "showCollapseMenu"?: boolean;
+        /**
+          * Define se o botão de "Fixar Menu" será exibido
+         */
+        "showFixedButton"?: boolean;
+        /**
+          * Define o tamanho do menu (small, medium, large).
+         */
+        "size"?: SizeMenuEnum;
+        /**
+          * Define o título do Sidebar Navigator
+         */
+        "titleMenu"?: string;
+        /**
+          * Define o tipo do menu (float, fixed ou dynamic (livre)).
+         */
+        "type"?: TypeMenuEnum;
+    }
     interface EzSkeleton {
         /**
           * Animation type
@@ -3704,10 +4044,12 @@ declare namespace LocalJSX {
         "ez-button": EzButton;
         "ez-calendar": EzCalendar;
         "ez-card-item": EzCardItem;
+        "ez-chart": EzChart;
         "ez-check": EzCheck;
         "ez-chip": EzChip;
         "ez-collapsible-box": EzCollapsibleBox;
         "ez-combo-box": EzComboBox;
+        "ez-custom-form-input": EzCustomFormInput;
         "ez-date-input": EzDateInput;
         "ez-date-time-input": EzDateTimeInput;
         "ez-dialog": EzDialog;
@@ -3731,6 +4073,7 @@ declare namespace LocalJSX {
         "ez-scroller": EzScroller;
         "ez-search": EzSearch;
         "ez-sidebar-button": EzSidebarButton;
+        "ez-sidebar-navigator": EzSidebarNavigator;
         "ez-skeleton": EzSkeleton;
         "ez-split-button": EzSplitButton;
         "ez-split-item": EzSplitItem;
@@ -3761,10 +4104,12 @@ declare module "@stencil/core" {
             "ez-button": LocalJSX.EzButton & JSXBase.HTMLAttributes<HTMLEzButtonElement>;
             "ez-calendar": LocalJSX.EzCalendar & JSXBase.HTMLAttributes<HTMLEzCalendarElement>;
             "ez-card-item": LocalJSX.EzCardItem & JSXBase.HTMLAttributes<HTMLEzCardItemElement>;
+            "ez-chart": LocalJSX.EzChart & JSXBase.HTMLAttributes<HTMLEzChartElement>;
             "ez-check": LocalJSX.EzCheck & JSXBase.HTMLAttributes<HTMLEzCheckElement>;
             "ez-chip": LocalJSX.EzChip & JSXBase.HTMLAttributes<HTMLEzChipElement>;
             "ez-collapsible-box": LocalJSX.EzCollapsibleBox & JSXBase.HTMLAttributes<HTMLEzCollapsibleBoxElement>;
             "ez-combo-box": LocalJSX.EzComboBox & JSXBase.HTMLAttributes<HTMLEzComboBoxElement>;
+            "ez-custom-form-input": LocalJSX.EzCustomFormInput & JSXBase.HTMLAttributes<HTMLEzCustomFormInputElement>;
             "ez-date-input": LocalJSX.EzDateInput & JSXBase.HTMLAttributes<HTMLEzDateInputElement>;
             "ez-date-time-input": LocalJSX.EzDateTimeInput & JSXBase.HTMLAttributes<HTMLEzDateTimeInputElement>;
             "ez-dialog": LocalJSX.EzDialog & JSXBase.HTMLAttributes<HTMLEzDialogElement>;
@@ -3788,6 +4133,7 @@ declare module "@stencil/core" {
             "ez-scroller": LocalJSX.EzScroller & JSXBase.HTMLAttributes<HTMLEzScrollerElement>;
             "ez-search": LocalJSX.EzSearch & JSXBase.HTMLAttributes<HTMLEzSearchElement>;
             "ez-sidebar-button": LocalJSX.EzSidebarButton & JSXBase.HTMLAttributes<HTMLEzSidebarButtonElement>;
+            "ez-sidebar-navigator": LocalJSX.EzSidebarNavigator & JSXBase.HTMLAttributes<HTMLEzSidebarNavigatorElement>;
             "ez-skeleton": LocalJSX.EzSkeleton & JSXBase.HTMLAttributes<HTMLEzSkeletonElement>;
             "ez-split-button": LocalJSX.EzSplitButton & JSXBase.HTMLAttributes<HTMLEzSplitButtonElement>;
             "ez-split-item": LocalJSX.EzSplitItem & JSXBase.HTMLAttributes<HTMLEzSplitItemElement>;

package/dist/types/utils/customEditor/interfaces/ICustomEditor.d.ts

@@ -0,0 +1,31 @@
+import { Record } from "@sankhyalabs/core";
+import { IOption, ISearchArgument } from "../../../components/ez-combo-box/ez-combo-box";
+export interface EditorMetadata {
+  label: string;
+  hidden: boolean;
+  userInterface: string;
+  options: {
+    [key: string]: any;
+  }[];
+  props?: Map<string, any>;
+  optionLoader?: (argument: ISearchArgument) => Promise<Array<IOption>> | Array<IOption> | IOption;
+}
+export declare enum CustomEditorSource {
+  GRID = "GRID",
+  FORM = "FORM"
+}
+export interface ICustomEditorParams {
+  value: any;
+  name: string;
+  currentEditor: HTMLElement;
+  editorMetadata: EditorMetadata;
+  record: Record;
+  source: CustomEditorSource;
+  setValue?: (value: any) => void;
+  getValue?: () => any;
+  charPress?: string | null;
+  detailContext?: string;
+}
+export interface ICustomEditor {
+  getEditorElement(params: ICustomEditorParams): HTMLElement | string | undefined;
+}

package/dist/types/utils/customEditor/interfaces/ICustomEditorInfo.d.ts

@@ -0,0 +1,5 @@
+import { ICustomEditor } from "./ICustomEditor";
+export interface ICustomEditorInfo {
+  detailContext?: string;
+  customEditor: ICustomEditor;
+}

package/dist/types/utils/customRender/interfaces/ICustomRender.d.ts

@@ -0,0 +1,29 @@
+import { IOption, ISearchArgument } from "../../../components/ez-combo-box/ez-combo-box";
+export interface RenderMetadata {
+  label: string;
+  hidden: boolean;
+  userInterface: string;
+  options: {
+    [key: string]: any;
+  }[];
+  props?: Map<string, any>;
+  optionLoader?: (argument: ISearchArgument) => Promise<Array<IOption>> | Array<IOption> | IOption;
+}
+export declare enum CustomRenderSource {
+  GRID = "GRID",
+  FORM = "FORM"
+}
+export interface ICustomRenderParams {
+  value: any;
+  name: string;
+  charPress: string | null;
+  currentRender: HTMLElement;
+  renderMetadata: RenderMetadata;
+  source: CustomRenderSource;
+  detailContext?: string;
+  setValue?: (value: any) => void;
+  getValue?: () => any;
+}
+export interface ICustomRender {
+  getRenderElement(params: ICustomRenderParams): HTMLElement | string | undefined;
+}

package/dist/types/utils/customRender/interfaces/ICustomRenderInfo.d.ts

@@ -0,0 +1,5 @@
+import { ICustomRender } from "./ICustomRender";
+export interface ICustomRenderInfo {
+  customRender: ICustomRender;
+  detailContext?: string;
+}