ngx-opalbytes-components 1.14.1 → 1.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-opalbytes-components",
-  "version": "1.14.1",
+  "version": "1.16.0",
   "peerDependencies": {
     "@angular/common": "^21.0.0",
     "@angular/core": "^21.0.0",

package/types/ngx-opalbytes-components.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { OnInit, EventEmitter, OnChanges, SimpleChanges, OnDestroy, ElementRef, ChangeDetectorRef, Signal, AfterViewInit, AfterContentInit, QueryList } from '@angular/core';
+import { OnInit, EventEmitter, OnChanges, SimpleChanges, OnDestroy, ElementRef, ChangeDetectorRef, Signal, AfterViewInit, AfterContentInit, QueryList, TemplateRef, WritableSignal } from '@angular/core';
 import { ControlValueAccessor, AbstractControl, FormControl } from '@angular/forms';
 import { MatDateRangeInput } from '@angular/material/datepicker';
 import { MatAutocompleteTrigger, MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
@@ -35,8 +35,9 @@ declare class CaoBaseButtonComponent implements OnInit {
     static ɵcmp: i0.ɵɵComponentDeclaration<CaoBaseButtonComponent, "cao-button", never, { "buttonText": { "alias": "buttonText"; "required": false; }; "isDarkMode": { "alias": "isDarkMode"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "btnClass": { "alias": "btnClass"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "trailingIcon": { "alias": "trailingIcon"; "required": false; }; "leadingIcon": { "alias": "leadingIcon"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "strokeWidthIcon": { "alias": "strokeWidthIcon"; "required": false; }; }, { "buttonClick": "buttonClick"; }, never, never, true, never>;
 }
 
+type CaoTypeInputs = 'text' | 'textarea' | 'number' | 'password' | 'date';
 declare class CaoBaseInput implements ControlValueAccessor {
-    type: string;
+    type: CaoTypeInputs;
     placeholder: string;
     inputClass: string;
     value: string | number | boolean | Date;
@@ -124,9 +125,12 @@ declare class CaoAutocompleteComponent implements OnInit, OnChanges, ControlValu
     isLucideOptionIcon?: boolean;
     autocompleteBgColor: string;
     strokeWidthIcon: number;
+    isDisabled: boolean;
     readonly itemSelected: EventEmitter<ICaoAutoCompleteOption>;
     readonly blurEvent: EventEmitter<void>;
     readonly focusEvent: EventEmitter<void>;
+    readonly leadingIconClick: EventEmitter<Event | MouseEvent>;
+    readonly trailingIconClick: EventEmitter<Event | MouseEvent>;
     autocompleteTrigger: MatAutocompleteTrigger;
     internalControl: FormControl<string | null>;
     filteredOptions$: Observable<ICaoAutoCompleteOption[]>;
@@ -142,17 +146,23 @@ declare class CaoAutocompleteComponent implements OnInit, OnChanges, ControlValu
     ngOnChanges(changes: SimpleChanges): void;
     onFocus(): void;
     onBlur(): void;
+    selectItem(option: ICaoAutoCompleteOption): void;
     onOptionSelected(event: MatAutocompleteSelectedEvent): void;
+    selectOption(option: ICaoAutoCompleteOption): void;
+    closePanel(): void;
+    clearSelection(): void;
+    onLeadingIconClick(event: MouseEvent | Event): void;
+    onTrailingIconClick(event: MouseEvent | Event): void;
     private filter;
     displayFn(option: ICaoAutoCompleteOption): string;
     get errorText(): string | null;
     get controlNameValue(): string;
     writeValue(value: ICaoAutoCompleteOption | string): void;
-    registerOnChange(fn: (value: ICaoAutoCompleteOption | string) => void): void;
+    registerOnChange(fn: (value: ICaoAutoCompleteOption | string | null) => void): void;
     registerOnTouched(fn: () => void): void;
     setInputHeight(height: string): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CaoAutocompleteComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CaoAutocompleteComponent, "cao-autocomplete", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "control": { "alias": "control"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "controlName": { "alias": "controlName"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "_leadingIcon": { "alias": "_leadingIcon"; "required": false; }; "_trailingIcon": { "alias": "_trailingIcon"; "required": false; }; "optionIcon": { "alias": "optionIcon"; "required": false; }; "optionIConColor": { "alias": "optionIConColor"; "required": false; }; "isLucideOptionIcon": { "alias": "isLucideOptionIcon"; "required": false; }; "autocompleteBgColor": { "alias": "autocompleteBgColor"; "required": false; }; "strokeWidthIcon": { "alias": "strokeWidthIcon"; "required": false; }; }, { "itemSelected": "itemSelected"; "blurEvent": "blurEvent"; "focusEvent": "focusEvent"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CaoAutocompleteComponent, "cao-autocomplete", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "control": { "alias": "control"; "required": false; }; "dataCy": { "alias": "dataCy"; "required": false; }; "controlName": { "alias": "controlName"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "iconColor": { "alias": "iconColor"; "required": false; }; "_leadingIcon": { "alias": "_leadingIcon"; "required": false; }; "_trailingIcon": { "alias": "_trailingIcon"; "required": false; }; "optionIcon": { "alias": "optionIcon"; "required": false; }; "optionIConColor": { "alias": "optionIConColor"; "required": false; }; "isLucideOptionIcon": { "alias": "isLucideOptionIcon"; "required": false; }; "autocompleteBgColor": { "alias": "autocompleteBgColor"; "required": false; }; "strokeWidthIcon": { "alias": "strokeWidthIcon"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; }, { "itemSelected": "itemSelected"; "blurEvent": "blurEvent"; "focusEvent": "focusEvent"; "leadingIconClick": "leadingIconClick"; "trailingIconClick": "trailingIconClick"; }, never, never, true, never>;
 }
 
 interface ICaoDropDownOption {
@@ -706,5 +716,73 @@ declare class StepperComponent implements AfterContentInit {
     static ɵcmp: i0.ɵɵComponentDeclaration<StepperComponent, "cao-stepper", never, { "title": { "alias": "title"; "required": false; }; }, { "maxReachedEvent": "maxReachedEvent"; }, ["steps"], ["*"], true, never>;
 }
 
-export { BaseAlert, BaseAlertService, BaseDialog, BaseDialogService, BaseFilterTablePaginatedService, BaseFilterTableService, BaseModal, BaseModalService, BasePaginationService, BaseTable, BaseTablePaginated, BaseTableService, BaseTimeRange, CaoAutocompleteComponent, CaoBaseButtonComponent, CaoBaseInput, CaoDropDownComponent, Footer, LinksButton, Paginator, StepComponent, StepperComponent, TablePaginatedService, TimePicker, getPtBrPaginatorIntlBasePaginated, getPtBrPaginatorIntlBaseTable };
-export type { AlertType, DialogType, IAlertConfig, ICaoAutoCompleteOption, ICaoDropDownOption, IColumnButton, IColumnConfig, IColumnPaginatedButton, IColumnPaginatedConfig, IDialogConfig, IModal, INavContent, INavLink, ITableConfig, ITablePaginatedConfig, ModalType, ModalTypeClass, ModalTypeSize };
+declare class CaoTabPanel {
+    label: string;
+    isLucideIcon: boolean;
+    trailingIcon: string | null;
+    leadingIcon: string | null;
+    isDisabled: boolean;
+    labelTemplate?: TemplateRef<unknown>;
+    lazyContent?: TemplateRef<unknown>;
+    content: TemplateRef<unknown>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CaoTabPanel, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CaoTabPanel, "cao-tab-panel", never, { "label": { "alias": "label"; "required": false; }; "isLucideIcon": { "alias": "isLucideIcon"; "required": false; }; "trailingIcon": { "alias": "trailingIcon"; "required": false; }; "leadingIcon": { "alias": "leadingIcon"; "required": false; }; "isDisabled": { "alias": "isDisabled"; "required": false; }; }, {}, ["labelTemplate", "lazyContent"], ["*"], true, never>;
+}
+
+interface ICaoTabChangeEvent {
+    previousIndex: number;
+    index: number;
+    tab: CaoTabPanel;
+}
+declare class CaoTabGroup implements AfterContentInit, OnDestroy {
+    get _hostStyles(): Record<string, string>;
+    set selectedIndex(val: number);
+    get selectedIndex(): number;
+    labelHeight: string;
+    labelPaddingX: string;
+    labelGap: string;
+    colorText: string;
+    colorActive: string;
+    colorHoverBg: string;
+    colorDisabled: string;
+    colorInkBar: string;
+    colorHeaderBorder: string;
+    inkBarHeight: string;
+    contentPaddingTop: string;
+    labelRadius: string;
+    animationDuration: string;
+    dynamicHeight: boolean;
+    labelAlign: 'start' | 'center' | 'end';
+    iconColorActive: string;
+    iconColorInactive: string;
+    strokeWidthIcon: number;
+    readonly selectedTabChange: EventEmitter<ICaoTabChangeEvent>;
+    readonly focusChange: EventEmitter<number>;
+    tabs: QueryList<CaoTabPanel>;
+    tabBtns: QueryList<ElementRef<HTMLButtonElement>>;
+    inkBar: ElementRef<HTMLElement>;
+    readonly activeIndex: WritableSignal<number>;
+    private activatedSet;
+    tabList: CaoTabPanel[];
+    private subs;
+    private isBrowser;
+    ngAfterContentInit(): void;
+    ngOnDestroy(): void;
+    selectTab(index: number): void;
+    get activeTab(): CaoTabPanel | null;
+    isActive(index: number): boolean;
+    wasActivated(index: number): boolean;
+    onTabClick(index: number): void;
+    onKeydown(event: KeyboardEvent, currentIndex: number): void;
+    onFocus(index: number): void;
+    private nextEnabled;
+    private selectIndex;
+    private focusTab;
+    scheduleInkBar(): void;
+    private updateInkBar;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CaoTabGroup, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CaoTabGroup, "cao-tab-group", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "labelHeight": { "alias": "labelHeight"; "required": false; }; "labelPaddingX": { "alias": "labelPaddingX"; "required": false; }; "labelGap": { "alias": "labelGap"; "required": false; }; "colorText": { "alias": "colorText"; "required": false; }; "colorActive": { "alias": "colorActive"; "required": false; }; "colorHoverBg": { "alias": "colorHoverBg"; "required": false; }; "colorDisabled": { "alias": "colorDisabled"; "required": false; }; "colorInkBar": { "alias": "colorInkBar"; "required": false; }; "colorHeaderBorder": { "alias": "colorHeaderBorder"; "required": false; }; "inkBarHeight": { "alias": "inkBarHeight"; "required": false; }; "contentPaddingTop": { "alias": "contentPaddingTop"; "required": false; }; "labelRadius": { "alias": "labelRadius"; "required": false; }; "animationDuration": { "alias": "animationDuration"; "required": false; }; "dynamicHeight": { "alias": "dynamicHeight"; "required": false; }; "labelAlign": { "alias": "labelAlign"; "required": false; }; "iconColorActive": { "alias": "iconColorActive"; "required": false; }; "iconColorInactive": { "alias": "iconColorInactive"; "required": false; }; "strokeWidthIcon": { "alias": "strokeWidthIcon"; "required": false; }; }, { "selectedTabChange": "selectedTabChange"; "focusChange": "focusChange"; }, ["tabs"], never, true, never>;
+}
+
+export { BaseAlert, BaseAlertService, BaseDialog, BaseDialogService, BaseFilterTablePaginatedService, BaseFilterTableService, BaseModal, BaseModalService, BasePaginationService, BaseTable, BaseTablePaginated, BaseTableService, BaseTimeRange, CaoAutocompleteComponent, CaoBaseButtonComponent, CaoBaseInput, CaoDropDownComponent, CaoTabGroup, CaoTabPanel, Footer, LinksButton, Paginator, StepComponent, StepperComponent, TablePaginatedService, TimePicker, getPtBrPaginatorIntlBasePaginated, getPtBrPaginatorIntlBaseTable };
+export type { AlertType, CaoTypeInputs, DialogType, IAlertConfig, ICaoAutoCompleteOption, ICaoDropDownOption, ICaoTabChangeEvent, IColumnButton, IColumnConfig, IColumnPaginatedButton, IColumnPaginatedConfig, IDialogConfig, IModal, INavContent, INavLink, ITableConfig, ITablePaginatedConfig, ModalType, ModalTypeClass, ModalTypeSize };