@telcomdev/ui 0.0.5 → 0.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telcomdev/ui",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Librería UI reutilizable para los sistemas TelcomDev.",
   "keywords": [
     "angular",
@@ -14,6 +14,7 @@
     "icons",
     "input",
     "select",
+    "tabs",
     "data-table",
     "dialog",
     "virtual-scroll"

package/types/telcomdev-ui.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { OnChanges, OnDestroy, EventEmitter, SimpleChanges, InjectionToken, Type } from '@angular/core';
+import { OnChanges, OnDestroy, EventEmitter, SimpleChanges, InjectionToken, Type, TemplateRef, AfterContentInit } from '@angular/core';
 import { Observable } from 'rxjs';
 import { DialogRef } from '@angular/cdk/dialog';
 import * as _telcomdev_ui from '@telcomdev/ui';
@@ -247,6 +247,8 @@ declare class TdIcon {
 interface TdIconoDefinicion {
     path: string;
     viewBox?: string;
+    estilo?: 'relleno' | 'linea';
+    grosor?: number;
 }
 type TdIconoPersonalizado = Record<string, string | TdIconoDefinicion>;
 
@@ -366,10 +368,141 @@ declare const TD_ICONOS: {
     };
     pdf: {
         path: string;
+        estilo: "linea";
+        grosor: number;
+    };
+    save: {
+        path: string;
+    };
+    copy: {
+        path: string;
+    };
+    download: {
+        path: string;
+    };
+    upload: {
+        path: string;
+    };
+    print: {
+        path: string;
+    };
+    excel: {
+        path: string;
+        estilo: "linea";
+        grosor: number;
+    };
+    xml: {
+        path: string;
+        estilo: "linea";
+        grosor: number;
+    };
+    zip: {
+        path: string;
+        estilo: "linea";
+        grosor: number;
+    };
+    file: {
+        path: string;
+    };
+    image: {
+        path: string;
+    };
+    calendar: {
+        path: string;
+    };
+    clock: {
+        path: string;
+    };
+    history: {
+        path: string;
+    };
+    filter: {
+        path: string;
+    };
+    refresh: {
+        path: string;
+    };
+    sort: {
+        path: string;
+    };
+    more_vertical: {
+        path: string;
+    };
+    more_horizontal: {
+        path: string;
+    };
+    arrow_back: {
+        path: string;
+    };
+    arrow_forward: {
+        path: string;
+    };
+    login: {
+        path: string;
+    };
+    logout: {
+        path: string;
+    };
+    lock: {
+        path: string;
+    };
+    lock_open: {
+        path: string;
+    };
+    mail: {
+        path: string;
+    };
+    phone: {
+        path: string;
+    };
+    send: {
+        path: string;
+    };
+    location: {
+        path: string;
+    };
+    language: {
+        path: string;
+    };
+    info: {
+        path: string;
+    };
+    warning: {
+        path: string;
+    };
+    error: {
+        path: string;
+    };
+    check_circle: {
+        path: string;
+    };
+    cancel: {
+        path: string;
+    };
+    star: {
+        path: string;
+    };
+    favorite: {
+        path: string;
+    };
+    database: {
+        path: string;
+    };
+    cloud: {
+        path: string;
+    };
+    camera: {
+        path: string;
+    };
+    link: {
+        path: string;
+    };
+    external_link: {
+        path: string;
     };
 };
 type TdIconoNombre = keyof typeof TD_ICONOS;
-declare const TD_ICONOS_NOMBRES: readonly ("menu" | "search" | "close" | "home" | "dashboard" | "folder" | "settings" | "people" | "person" | "security" | "inventory" | "shopping_cart" | "receipt" | "assessment" | "description" | "business" | "chevron_left" | "chevron_right" | "sun" | "moon" | "alert" | "check" | "visibility" | "visibility_off" | "notifications" | "chevron_down" | "apps" | "help" | "add" | "edit" | "delete" | "toggle_on" | "toggle_off" | "inbox" | "pdf")[];
+declare const TD_ICONOS_NOMBRES: readonly ("error" | "info" | "link" | "menu" | "search" | "cancel" | "close" | "copy" | "home" | "dashboard" | "folder" | "settings" | "people" | "person" | "security" | "inventory" | "shopping_cart" | "receipt" | "assessment" | "description" | "business" | "chevron_left" | "chevron_right" | "sun" | "moon" | "alert" | "check" | "visibility" | "visibility_off" | "notifications" | "chevron_down" | "apps" | "help" | "add" | "edit" | "delete" | "toggle_on" | "toggle_off" | "inbox" | "pdf" | "save" | "download" | "upload" | "print" | "excel" | "xml" | "zip" | "file" | "image" | "calendar" | "clock" | "history" | "filter" | "refresh" | "sort" | "more_vertical" | "more_horizontal" | "arrow_back" | "arrow_forward" | "login" | "logout" | "lock" | "lock_open" | "mail" | "phone" | "send" | "location" | "language" | "warning" | "check_circle" | "star" | "favorite" | "database" | "cloud" | "camera" | "external_link")[];
 
 declare class TdInput implements ControlValueAccessor {
     private readonly cdr;
@@ -567,5 +700,55 @@ declare class TdSidebar {
     static ɵcmp: i0.ɵɵComponentDeclaration<TdSidebar, "td-sidebar", never, { "titulo": { "alias": "titulo"; "required": false; }; "subtitulo": { "alias": "subtitulo"; "required": false; }; "etiquetaNavegacion": { "alias": "etiquetaNavegacion"; "required": false; }; "logoUrl": { "alias": "logoUrl"; "required": false; }; "logoAlt": { "alias": "logoAlt"; "required": false; }; "textoCarga": { "alias": "textoCarga"; "required": false; }; "mensajeVacio": { "alias": "mensajeVacio"; "required": false; }; "error": { "alias": "error"; "required": false; }; "cargando": { "alias": "cargando"; "required": false; }; "oscuro": { "alias": "oscuro"; "required": false; }; "modoCerrado": { "alias": "modoCerrado"; "required": false; }; "abierto": { "alias": "abierto"; "required": false; }; "menu": { "alias": "menu"; "required": false; }; }, { "abiertoChange": "abiertoChange"; "seleccionar": "seleccionar"; }, never, never, true, never>;
 }
 
-export { TD_DIALOG_CONFIG, TD_DIALOG_DATA, TD_ICONOS, TD_ICONOS_NOMBRES, TdAlerta, TdAutocompleteSelect, TdDataTable, TdDialog, TdDialogActions, TdDialogClose, TdDialogPrimary, TdDialogRef, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdSelect, TdSidebar, TelcomdevUi };
-export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableTipoColumna, TdDataTableTono, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdSelectOption, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion };
+declare class TdTab {
+    readonly generatedId: string;
+    id: string;
+    label: string;
+    icon: string;
+    disabled: boolean;
+    badge: string | number | null;
+    content: TemplateRef<unknown>;
+    get resolvedId(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdTab, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdTab, "td-tab", never, { "id": { "alias": "id"; "required": false; }; "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "badge": { "alias": "badge"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+type TdTabsVariant = 'linea' | 'pastilla' | 'contenida';
+type TdTabsAlignment = 'inicio' | 'centro' | 'fin';
+declare class TdTabs implements AfterContentInit, OnDestroy {
+    private readonly cdr;
+    private tabsChange?;
+    private requestedIndex;
+    private tabQuery;
+    private tabButtons;
+    set selectedIndex(value: number);
+    get selectedIndex(): number;
+    variant: TdTabsVariant;
+    alignment: TdTabsAlignment;
+    stretch: boolean;
+    dark: boolean;
+    ariaLabel: string;
+    panelFocusable: boolean;
+    readonly selectedIndexChange: EventEmitter<number>;
+    readonly tabChange: EventEmitter<TdTab>;
+    protected tabs: readonly TdTab[];
+    protected activeIndex: number;
+    protected get activeTab(): TdTab | null;
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    protected select(index: number, focus?: boolean): void;
+    protected handleKeydown(event: KeyboardEvent): void;
+    protected tabId(tab: TdTab): string;
+    protected panelId(tab: TdTab): string;
+    private syncTabs;
+    private applyRequestedIndex;
+    private nextEnabledIndex;
+    private firstEnabledIndex;
+    private lastEnabledIndex;
+    private focusButton;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TdTabs, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TdTabs, "td-tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "alignment": { "alias": "alignment"; "required": false; }; "stretch": { "alias": "stretch"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "panelFocusable": { "alias": "panelFocusable"; "required": false; }; }, { "selectedIndexChange": "selectedIndexChange"; "tabChange": "tabChange"; }, ["tabQuery"], never, true, never>;
+}
+
+export { TD_DIALOG_CONFIG, TD_DIALOG_DATA, TD_ICONOS, TD_ICONOS_NOMBRES, TdAlerta, TdAutocompleteSelect, TdDataTable, TdDialog, TdDialogActions, TdDialogClose, TdDialogPrimary, TdDialogRef, TdFooter, TdHeader, TdIcon, TdIconoRegistry, TdInput, TdSelect, TdSidebar, TdTab, TdTabs, TelcomdevUi };
+export type { MenuSidebar, TdAlertaOpciones, TdAlertaTipo, TdDataTableAccion, TdDataTableAccionEvento, TdDataTableAlineacion, TdDataTableBoton, TdDataTableColumna, TdDataTableTipoColumna, TdDataTableTono, TdDialogConfig, TdDialogPanelData, TdDialogRefLike, TdDialogTamano, TdHeaderAccionPerfil, TdHeaderNotificacion, TdIconoDefinicion, TdIconoNombre, TdIconoPersonalizado, TdSelectOption, TdSelectScrollBehavior, TdSidebarModoCerrado, TdSidebarSeleccion, TdTabsAlignment, TdTabsVariant };