@shival99/z-ui 2.0.7 → 2.0.9

package/types/shival99-z-ui-components-z-icon.d.ts

@@ -1,9 +1,10 @@
 import * as _angular_core from '@angular/core';
-import { EnvironmentProviders } from '@angular/core';
+import { Type, EnvironmentProviders } from '@angular/core';
 import { ClassValue } from 'clsx';
 import * as saxBoldIcons from '@ng-icons/iconsax/bold';
 import * as saxOutlineIcons from '@ng-icons/iconsax/outline';
 import * as lucideIcons from '@ng-icons/lucide';
+import * as animatedIcons from 'ng-animated-icons';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 
@@ -12,24 +13,46 @@ type ZSaxIcon = Extract<keyof typeof saxBoldIcons | keyof typeof saxOutlineIcons
 declare const Z_ICONS: {};
 type ZIcon = ZLucideIcon | ZSaxIcon;
 
+type ZIconAnimationTrigger = 'manual' | 'hover' | 'focus' | 'interaction' | 'always';
 declare class ZIconComponent {
     readonly class: _angular_core.InputSignal<ClassValue>;
     readonly zType: _angular_core.InputSignal<ZIcon | undefined>;
+    readonly zAnimatedType: _angular_core.InputSignal<("accessibility" | "activity" | "play" | "airplay" | "check" | "alarm-clock-check" | "clock" | "alarm-clock" | "alarm-clock-off" | "align-horizontal-space-around" | "align-vertical-space-around" | "anvil" | "archive" | "arrow-big-down-dash" | "arrow-big-down" | "arrow-big-left-dash" | "arrow-big-left" | "arrow-big-right-dash" | "arrow-big-right" | "arrow-big-up-dash" | "arrow-big-up" | "arrow-down-01" | "arrow-down-10" | "arrow-down-a-z" | "arrow-down" | "arrow-down-left" | "arrow-down-right" | "arrow-down-z-a" | "arrow-left" | "arrow-left-right" | "arrow-right" | "arrow-right-left" | "arrow-up-01" | "arrow-up-10" | "arrow-up-a-z" | "arrow-up" | "arrow-up-left" | "arrow-up-right" | "arrow-up-z-a" | "award" | "x" | "axe" | "axis-3d" | "badge-alert" | "badge-check" | "badge-question-mark" | "battery-charging" | "battery-full" | "battery" | "battery-low" | "battery-medium" | "battery-warning" | "bean-off" | "beer-off" | "bell" | "bell-off" | "bell-ring" | "between-horizontal-end" | "between-horizontal-start" | "between-vertical-end" | "between-vertical-start" | "binary" | "blend" | "blocks" | "bluetooth-off" | "bold" | "bolt" | "bone" | "book-a" | "book-audio" | "book-check" | "book-dashed" | "book-down" | "book-headphones" | "heart" | "book-heart" | "book" | "book-image" | "key" | "book-key" | "book-lock" | "book-marked" | "minus" | "book-minus" | "book-open-check" | "book-open-text" | "plus" | "book-plus" | "book-text" | "book-type" | "book-up-2" | "book-up" | "user" | "book-user" | "book-x" | "bookmark-check" | "bookmark" | "bookmark-minus" | "bookmark-plus" | "bookmark-x" | "bot" | "bot-off" | "boxes" | "cog" | "brain-cog" | "briefcase-business" | "briefcase-conveyor-belt" | "briefcase" | "briefcase-medical" | "brush-cleaning" | "brush" | "bug-off" | "calendar-check-2" | "calendar-check" | "calendar-cog" | "calendar-days" | "calendar-off" | "calendar-sync" | "camera-off" | "candy-off" | "captions-off" | "cast" | "cctv" | "chart-bar-decreasing" | "chart-bar" | "chart-bar-increasing" | "chart-column-decreasing" | "chart-column" | "chart-column-increasing" | "chart-gantt" | "chart-line" | "chart-no-axes-column-decreasing" | "chart-no-axes-column" | "chart-no-axes-column-increasing" | "chart-no-axes-combined" | "chart-no-axes-gantt" | "chart-pie" | "chart-scatter" | "chart-spline" | "check-check" | "cherry" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chevrons-down" | "chevrons-down-up" | "chevrons-left" | "chevrons-left-right" | "chevrons-right" | "chevrons-right-left" | "chevrons-up-down" | "chevrons-up" | "cigarette-off" | "circle-alert" | "circle-arrow-down" | "circle-arrow-left" | "circle-arrow-out-down-left" | "circle-arrow-out-down-right" | "circle-arrow-out-up-left" | "circle-arrow-out-up-right" | "circle-arrow-right" | "circle-arrow-up" | "circle-check-big" | "circle-check" | "circle-chevron-down" | "circle-chevron-left" | "circle-chevron-right" | "circle-chevron-up" | "circle-off" | "circle-parking-off" | "circle-plus" | "circle-question-mark" | "clapperboard" | "clipboard-check" | "clipboard" | "clipboard-list" | "pen" | "clipboard-pen" | "pen-line" | "clipboard-pen-line" | "clipboard-x" | "clock-10" | "clock-11" | "clock-12" | "clock-1" | "clock-2" | "clock-3" | "clock-4" | "clock-5" | "clock-6" | "clock-7" | "clock-8" | "clock-9" | "cloud-cog" | "download" | "cloud-download" | "cloud-moon" | "cloud-off" | "upload" | "cloud-upload" | "compass" | "contrast" | "copy-check" | "copy" | "cpu" | "crop" | "diamond-plus" | "dice-1" | "dice-2" | "dice-3" | "dice-4" | "dice-5" | "dice-6" | "diff" | "dna-off" | "droplet-off" | "drum" | "ear-off" | "eclipse" | "egg-off" | "expand" | "eye-off" | "file-chart-column" | "file-chart-column-increasing" | "file-chart-line" | "file-check-corner" | "file-check" | "file-cog" | "file-down" | "file-exclamation-point" | "file-minus" | "file-pen" | "file-pen-line" | "file-plus" | "file-question-mark" | "file-sliders" | "file-stack" | "terminal" | "file-terminal" | "file-up" | "fish-off" | "flag-off" | "flashlight-off" | "flask-conical-off" | "folder-check" | "folder-cog" | "folder-down" | "kanban" | "folder-kanban" | "folder-pen" | "folder-plus" | "folder-sync" | "folder-up" | "folder-x" | "frame" | "funnel-x" | "gallery-horizontal-end" | "gallery-horizontal" | "gallery-thumbnails" | "gallery-vertical-end" | "gallery-vertical" | "gauge" | "gavel" | "grid-2x2-check" | "grip-horizontal" | "grip" | "grip-vertical" | "hammer" | "hand-coins" | "hand-heart" | "hard-drive-download" | "hard-drive-upload" | "phone-off" | "headphone-off" | "heart-off" | "history" | "hop-off" | "house" | "wifi" | "house-wifi" | "image-down" | "image-off" | "image-up" | "images" | "infinity" | "key-round" | "key-square" | "keyboard" | "keyboard-off" | "landmark" | "layers" | "layout-dashboard" | "layout-grid" | "layout-panel-left" | "layout-panel-top" | "layout-template" | "lightbulb" | "lightbulb-off" | "link2-off" | "list-check" | "list-checks" | "list-restart" | "list-todo" | "loader-pinwheel" | "locate-off" | "log-out" | "mail-check" | "map-pin-check" | "map-pin-check-inside" | "pin-off" | "map-pin-off" | "maximize-2" | "maximize" | "megaphone-off" | "message-circle" | "message-circle-more" | "message-circle-off" | "message-circle-question-mark" | "message-circle-warning" | "message-square" | "message-square-more" | "message-square-off" | "mic-off" | "milk-off" | "minimize-2" | "minimize" | "monitor-check" | "monitor-cog" | "monitor-down" | "monitor-off" | "monitor-up" | "mouse-off" | "mouse-pointer-2" | "mouse-pointer" | "move-diagonal-2" | "move-diagonal" | "move-down" | "move-down-left" | "move-down-right" | "move-horizontal" | "move-left" | "move-right" | "move-up" | "move-up-left" | "move-up-right" | "move-vertical" | "navigation2-off" | "navigation-off" | "nfc" | "notebook-pen" | "nut-off" | "octagon-alert" | "orbit" | "package-check" | "paintbrush" | "panel-bottom-close" | "panel-bottom-open" | "panel-left-close" | "panel-left-open" | "panel-right-close" | "panel-right-open" | "panel-top-close" | "panel-top-open" | "paperclip" | "pen-off" | "pencil" | "pencil-line" | "pencil-off" | "pickaxe" | "plane" | "pointer-off" | "power-off" | "printer-check" | "rabbit" | "radar" | "radio" | "radio-tower" | "rainbow" | "redo-dot" | "redo" | "refresh-ccw-dot" | "refresh-ccw" | "refresh-cw" | "refresh-cw-off" | "rocket" | "rocking-chair" | "rotate-ccw" | "rotate-ccw-key" | "rotate-cw" | "route" | "route-off" | "rss" | "save-off" | "scan-text" | "scissors" | "search-check" | "search" | "send-horizontal" | "send" | "server-cog" | "server-off" | "settings" | "shield-alert" | "shield-check" | "shield-off" | "shield-plus" | "shield-question-mark" | "ship" | "ship-wheel" | "shopping-cart" | "shovel" | "shower-head" | "shrink" | "signal-high" | "signal" | "signal-low" | "signal-medium" | "signal-zero" | "signature" | "sliders-horizontal" | "sliders-vertical" | "smartphone-nfc" | "snowflake" | "sparkle" | "sparkles" | "speech" | "spell-check" | "square-arrow-down" | "square-arrow-down-left" | "square-arrow-down-right" | "square-arrow-left" | "square-arrow-out-down-left" | "square-arrow-out-down-right" | "square-arrow-out-up-left" | "square-arrow-out-up-right" | "square-arrow-right" | "square-arrow-up" | "square-arrow-up-left" | "square-arrow-up-right" | "square-chart-gantt" | "square-check-big" | "square-check" | "square-chevron-down" | "square-chevron-left" | "square-chevron-right" | "square-chevron-up" | "square-dashed-kanban" | "square-kanban" | "square-parking-off" | "square-pen" | "square-plus" | "square-scissors" | "square-stack" | "square-terminal" | "star" | "star-off" | "sun" | "sword" | "tag" | "telescope" | "text-align-center" | "text-cursor" | "text-cursor-input" | "text-search" | "thermometer" | "thumbs-down" | "thumbs-up" | "ticket-check" | "timer" | "timer-off" | "toggle-left" | "toggle-right" | "tornado" | "touchpad-off" | "trash-2" | "trash" | "triangle-alert" | "umbrella-off" | "undo-dot" | "undo" | "unfold-horizontal" | "unfold-vertical" | "unplug" | "user-check" | "user-cog" | "user-pen" | "user-round-check" | "user-round-cog" | "user-round" | "user-round-pen" | "vibrate" | "vibrate-off" | "video-off" | "volume-off" | "vote" | "waves" | "webhook-off" | "wheat-off" | "wifi-high" | "wifi-low" | "wifi-off" | "wifi-pen" | "wifi-zero" | "wine-off" | "zap-off") | undefined>;
+    readonly zAnimate: _angular_core.InputSignal<boolean>;
+    readonly zAnimationTrigger: _angular_core.InputSignal<ZIconAnimationTrigger>;
     readonly zSize: _angular_core.InputSignal<string | number | null | undefined>;
     readonly zStrokeWidth: _angular_core.InputSignal<number>;
     readonly zSvg: _angular_core.InputSignal<string>;
     protected readonly resolvedSvg: _angular_core.WritableSignal<string>;
+    protected readonly isHoverActive: _angular_core.WritableSignal<boolean>;
+    protected readonly isFocusActive: _angular_core.WritableSignal<boolean>;
+    protected readonly isTouchActive: _angular_core.WritableSignal<boolean>;
     protected readonly normalizedSize: _angular_core.Signal<string>;
     private readonly _svgFetchError;
     protected readonly zClasses: _angular_core.Signal<string>;
+    protected readonly animatedIcon: _angular_core.Signal<Type<unknown> | null>;
+    protected readonly animatedIconInputs: _angular_core.Signal<Record<string, unknown>>;
+    protected readonly shouldAnimate: _angular_core.Signal<boolean>;
     constructor();
     private _isRawSvg;
+    protected setHoverActive(isActive: boolean): void;
+    protected setFocusActive(isActive: boolean): void;
+    protected setTouchActive(isActive: boolean): void;
     private _isSvgPath;
     private _normalizeCustomSvg;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZIconComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZIconComponent, "z-icon, [z-icon]", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zStrokeWidth": { "alias": "zStrokeWidth"; "required": false; "isSignal": true; }; "zSvg": { "alias": "zSvg"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZIconComponent, "z-icon, [z-icon]", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zAnimatedType": { "alias": "zAnimatedType"; "required": false; "isSignal": true; }; "zAnimate": { "alias": "zAnimate"; "required": false; "isSignal": true; }; "zAnimationTrigger": { "alias": "zAnimationTrigger"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zStrokeWidth": { "alias": "zStrokeWidth"; "required": false; "isSignal": true; }; "zSvg": { "alias": "zSvg"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+type ZAnimatedIconExport = Extract<keyof typeof animatedIcons, `${string}Icon`>;
+type ZBrokenAnimatedIconExport = 'AudioLinesIcon';
+type ZSafeAnimatedIconExport = Exclude<ZAnimatedIconExport, ZBrokenAnimatedIconExport>;
+type ZStripIconSuffix<T extends string> = T extends `${infer Name}Icon` ? Name : T;
+type ZKebabCase<T extends string, Previous extends string = ''> = T extends `${infer Head}${infer Tail}` ? Tail extends Uncapitalize<Tail> ? Head extends `${number}` ? Previous extends '' | '-' | `${number}` ? `${Head}${ZKebabCase<Tail, Head>}` : `-${Head}${ZKebabCase<Tail, Head>}` : `${Lowercase<Head>}${ZKebabCase<Tail, Head>}` : `${Lowercase<Head>}-${ZKebabCase<Tail, '-'>}` : T;
+type ZAnimatedIconName = ZKebabCase<ZStripIconSuffix<ZSafeAnimatedIconExport>>;
+type ZAnimatedIcon = ZAnimatedIconName;
+declare const Z_ANIMATED_ICONS: Record<ZAnimatedIcon, Type<unknown>>;
+
 declare const zIconVariants: (props?: ({
     zSize?: string | number | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
@@ -37,5 +60,5 @@ type ZIconVariants = VariantProps<typeof zIconVariants>;
 
 declare function provideZIconLoader(): EnvironmentProviders;
 
-export { ZIconComponent, Z_ICONS, provideZIconLoader, zIconVariants };
-export type { ZIcon, ZIconVariants };
+export { ZIconComponent, Z_ANIMATED_ICONS, Z_ICONS, provideZIconLoader, zIconVariants };
+export type { ZAnimatedIcon, ZIcon, ZIconAnimationTrigger, ZIconVariants };

package/types/shival99-z-ui-components-z-menu.d.ts

@@ -181,6 +181,7 @@ declare class ZMenuV2Component {
     private readonly _isMobile$;
     readonly isMobile: _angular_core.Signal<boolean>;
     protected readonly mobileLogo: _angular_core.Signal<string>;
+    protected readonly effectiveTitle: _angular_core.Signal<string>;
     protected readonly avatarSrc: _angular_core.Signal<string>;
     protected readonly visibleUserActions: _angular_core.Signal<ZMenuUserAction[]>;
     private readonly _routerPath;

package/types/shival99-z-ui-components-z-modal.d.ts

@@ -33,6 +33,8 @@ declare class ZModalOptions<T, U> {
     zContent?: string | TemplateRef<T> | Type<T>;
     /** Custom CSS classes for the modal */
     class?: ClassValue;
+    /** Custom CSS classes for the modal body */
+    zBodyClass?: ClassValue;
     /** Data to be passed to the content component via Z_MODAL_DATA token */
     zData?: U;
     /**
@@ -170,6 +172,7 @@ declare class ZModalComponent<T, U> extends BasePortalOutlet implements OnDestro
     zAfterClose: _angular_core.OutputEmitterRef<void>;
     readonly zScrollbar: _angular_core.OutputEmitterRef<NgScrollbar>;
     readonly class: _angular_core.InputSignal<ClassValue>;
+    readonly zBodyClass: _angular_core.InputSignal<ClassValue>;
     readonly zVisible: _angular_core.ModelSignal<boolean>;
     readonly zTitle: _angular_core.InputSignal<string | TemplateRef<unknown> | undefined>;
     readonly zDescription: _angular_core.InputSignal<string | TemplateRef<unknown> | undefined>;
@@ -225,13 +228,18 @@ declare class ZModalComponent<T, U> extends BasePortalOutlet implements OnDestro
     protected readonly confirmIconColors: _angular_core.Signal<ZModalConfirmIconColors>;
     protected readonly effectiveTitle: _angular_core.Signal<string | TemplateRef<unknown> | undefined>;
     protected readonly effectiveDescription: _angular_core.Signal<string | TemplateRef<unknown> | undefined>;
+    protected readonly hasEffectiveDescription: _angular_core.Signal<boolean>;
+    protected readonly headerContentClasses: _angular_core.Signal<string>;
+    protected readonly effectiveBodyClass: _angular_core.Signal<ClassValue>;
+    protected readonly templateBodyClasses: _angular_core.Signal<string>;
+    protected readonly serviceBodyClasses: _angular_core.Signal<string>;
     protected readonly effectiveClosable: _angular_core.Signal<boolean>;
     protected readonly effectiveHideFooter: _angular_core.Signal<boolean | undefined>;
     protected readonly effectiveHideHeader: _angular_core.Signal<boolean | undefined>;
     protected readonly effectiveOkText: _angular_core.Signal<string | null | undefined>;
     protected readonly effectiveCancelText: _angular_core.Signal<string | null | undefined>;
     protected readonly effectiveOkDestructive: _angular_core.Signal<boolean | undefined>;
-    protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "link" | "default" | "primary" | "secondary" | "destructive" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | "subtle-primary" | "subtle-success" | "subtle-info" | "subtle-warning" | "subtle-destructive" | null | undefined>;
+    protected readonly effectiveTypeOk: _angular_core.Signal<"info" | "warning" | "error" | "default" | "primary" | "secondary" | "destructive" | "destructive-heartbeat" | "success" | "outline" | "outline-primary" | "outline-secondary" | "outline-success" | "outline-info" | "outline-warning" | "outline-error" | "outline-destructive" | "outline-shimmer" | "outline-success-secondary" | "outline-info-secondary" | "outline-warning-secondary" | "outline-error-secondary" | "outline-destructive-secondary" | "outline-primary-secondary" | "outline-primary-soft" | "outline-success-soft" | "outline-info-soft" | "outline-warning-soft" | "outline-error-soft" | "outline-destructive-soft" | "outline-primary-soft-border" | "outline-success-soft-border" | "outline-info-soft-border" | "outline-warning-soft-border" | "outline-error-soft-border" | "outline-destructive-soft-border" | "ghost" | "ghost-primary" | "ghost-success" | "ghost-info" | "ghost-warning" | "ghost-error" | "ghost-destructive" | "subtle" | "subtle-primary" | "subtle-success" | "subtle-info" | "subtle-warning" | "subtle-destructive" | "subtle-outline" | "subtle-primary-outline" | "subtle-success-outline" | "subtle-info-outline" | "subtle-warning-outline" | "subtle-destructive-outline" | "link" | null | undefined>;
     protected readonly effectiveOkDisabled: _angular_core.Signal<boolean | undefined>;
     protected readonly effectiveLoading: _angular_core.Signal<boolean>;
     protected readonly effectiveContentLoading: _angular_core.Signal<boolean>;
@@ -257,7 +265,7 @@ declare class ZModalComponent<T, U> extends BasePortalOutlet implements OnDestro
     private _clearCloseTimeout;
     private _disposeTemplateOverlay;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZModalComponent<any, any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZModalComponent<any, any>, "z-modal", ["zModal"], { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zVisible": { "alias": "zVisible"; "required": false; "isSignal": true; }; "zTitle": { "alias": "zTitle"; "required": false; "isSignal": true; }; "zDescription": { "alias": "zDescription"; "required": false; "isSignal": true; }; "zWidth": { "alias": "zWidth"; "required": false; "isSignal": true; }; "zClosable": { "alias": "zClosable"; "required": false; "isSignal": true; }; "zMaskClosable": { "alias": "zMaskClosable"; "required": false; "isSignal": true; }; "zHideHeader": { "alias": "zHideHeader"; "required": false; "isSignal": true; }; "zHideFooter": { "alias": "zHideFooter"; "required": false; "isSignal": true; }; "zOkText": { "alias": "zOkText"; "required": false; "isSignal": true; }; "zCancelText": { "alias": "zCancelText"; "required": false; "isSignal": true; }; "zOkDestructive": { "alias": "zOkDestructive"; "required": false; "isSignal": true; }; "zOkDisabled": { "alias": "zOkDisabled"; "required": false; "isSignal": true; }; "zLoading": { "alias": "zLoading"; "required": false; "isSignal": true; }; "zContentLoading": { "alias": "zContentLoading"; "required": false; "isSignal": true; }; "zSkeletonRows": { "alias": "zSkeletonRows"; "required": false; "isSignal": true; }; "zOverlay": { "alias": "zOverlay"; "required": false; "isSignal": true; }; }, { "zOk": "zOk"; "zCancel": "zCancel"; "zAfterClose": "zAfterClose"; "zScrollbar": "zScrollbar"; "zVisible": "zVisibleChange"; }, ["customHeader", "customContent", "customFooter"], ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZModalComponent<any, any>, "z-modal", ["zModal"], { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zBodyClass": { "alias": "zBodyClass"; "required": false; "isSignal": true; }; "zVisible": { "alias": "zVisible"; "required": false; "isSignal": true; }; "zTitle": { "alias": "zTitle"; "required": false; "isSignal": true; }; "zDescription": { "alias": "zDescription"; "required": false; "isSignal": true; }; "zWidth": { "alias": "zWidth"; "required": false; "isSignal": true; }; "zClosable": { "alias": "zClosable"; "required": false; "isSignal": true; }; "zMaskClosable": { "alias": "zMaskClosable"; "required": false; "isSignal": true; }; "zHideHeader": { "alias": "zHideHeader"; "required": false; "isSignal": true; }; "zHideFooter": { "alias": "zHideFooter"; "required": false; "isSignal": true; }; "zOkText": { "alias": "zOkText"; "required": false; "isSignal": true; }; "zCancelText": { "alias": "zCancelText"; "required": false; "isSignal": true; }; "zOkDestructive": { "alias": "zOkDestructive"; "required": false; "isSignal": true; }; "zOkDisabled": { "alias": "zOkDisabled"; "required": false; "isSignal": true; }; "zLoading": { "alias": "zLoading"; "required": false; "isSignal": true; }; "zContentLoading": { "alias": "zContentLoading"; "required": false; "isSignal": true; }; "zSkeletonRows": { "alias": "zSkeletonRows"; "required": false; "isSignal": true; }; "zOverlay": { "alias": "zOverlay"; "required": false; "isSignal": true; }; }, { "zOk": "zOk"; "zCancel": "zCancel"; "zAfterClose": "zAfterClose"; "zScrollbar": "zScrollbar"; "zVisible": "zVisibleChange"; }, ["customHeader", "customContent", "customFooter"], ["*"], true, never>;
 }
 
 declare class ZModalService {

package/types/shival99-z-ui-components-z-popover.d.ts

@@ -15,6 +15,7 @@ interface ZPopoverControl {
 }
 
 declare class ZPopoverComponent implements OnInit, OnDestroy {
+    private static readonly _openPopovers;
     private readonly _overlay;
     private readonly _overlayPositionBuilder;
     private readonly _renderer;
@@ -35,6 +36,7 @@ declare class ZPopoverComponent implements OnInit, OnDestroy {
     readonly zDisabled: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zOffset: _angular_core.InputSignal<number>;
     readonly zManualClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
+    readonly zOutsideClickClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zScrollClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zShowArrow: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     private _overlayRef;
@@ -63,16 +65,18 @@ declare class ZPopoverComponent implements OnInit, OnDestroy {
     private _delay;
     private _setupScrollClose;
     private _showPopover;
+    private _isNestedPopoverTarget;
     private _setupResizeObserver;
     private _setupPopoverHover;
     private _hidePopover;
     private _clearHideTimeout;
     private _cleanupListeners;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZPopoverComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZPopoverComponent, "z-popover", never, { "zContent": { "alias": "zContent"; "required": false; "isSignal": true; }; "zPosition": { "alias": "zPosition"; "required": false; "isSignal": true; }; "zTrigger": { "alias": "zTrigger"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zShowDelay": { "alias": "zShowDelay"; "required": false; "isSignal": true; }; "zHideDelay": { "alias": "zHideDelay"; "required": false; "isSignal": true; }; "zDisabled": { "alias": "zDisabled"; "required": false; "isSignal": true; }; "zOffset": { "alias": "zOffset"; "required": false; "isSignal": true; }; "zManualClose": { "alias": "zManualClose"; "required": false; "isSignal": true; }; "zScrollClose": { "alias": "zScrollClose"; "required": false; "isSignal": true; }; "zShowArrow": { "alias": "zShowArrow"; "required": false; "isSignal": true; }; }, { "zShow": "zShow"; "zHide": "zHide"; "zControl": "zControl"; }, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZPopoverComponent, "z-popover", never, { "zContent": { "alias": "zContent"; "required": false; "isSignal": true; }; "zPosition": { "alias": "zPosition"; "required": false; "isSignal": true; }; "zTrigger": { "alias": "zTrigger"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zShowDelay": { "alias": "zShowDelay"; "required": false; "isSignal": true; }; "zHideDelay": { "alias": "zHideDelay"; "required": false; "isSignal": true; }; "zDisabled": { "alias": "zDisabled"; "required": false; "isSignal": true; }; "zOffset": { "alias": "zOffset"; "required": false; "isSignal": true; }; "zManualClose": { "alias": "zManualClose"; "required": false; "isSignal": true; }; "zOutsideClickClose": { "alias": "zOutsideClickClose"; "required": false; "isSignal": true; }; "zScrollClose": { "alias": "zScrollClose"; "required": false; "isSignal": true; }; "zShowArrow": { "alias": "zShowArrow"; "required": false; "isSignal": true; }; }, { "zShow": "zShow"; "zHide": "zHide"; "zControl": "zControl"; }, never, ["*"], true, never>;
 }
 
 declare class ZPopoverDirective implements OnInit, OnDestroy {
+    private static readonly _openPopovers;
     readonly zContent: _angular_core.InputSignal<ZPopoverContent | null>;
     readonly zPosition: _angular_core.InputSignal<ZPopoverPosition>;
     readonly zTrigger: _angular_core.InputSignal<ZPopoverTrigger>;
@@ -81,9 +85,10 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     readonly zHideDelay: _angular_core.InputSignal<number>;
     readonly zDisabled: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zOffset: _angular_core.InputSignal<number>;
-    readonly zPopoverWidth: _angular_core.InputSignal<number | "trigger" | "auto">;
+    readonly zPopoverWidth: _angular_core.InputSignal<number | "auto" | "trigger">;
     readonly zTriggerRef: _angular_core.InputSignal<HTMLElement | ElementRef<HTMLElement> | null>;
     readonly zManualClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
+    readonly zOutsideClickClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zScrollClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zShowArrow: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zShow: _angular_core.OutputEmitterRef<void>;
@@ -118,6 +123,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     hideImmediate(): void;
     toggle(): void;
     isOpen(): boolean;
+    updatePosition(): void;
     private _createOverlay;
     private _getWidthConfig;
     private _getTriggerElement;
@@ -128,13 +134,14 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     private _setupScrollClose;
     private _delay;
     private _showPopover;
+    private _isNestedPopoverTarget;
     private _setupResizeObserver;
     private _setupPopoverHover;
     private _hidePopover;
     private _clearHideTimeout;
     private _cleanupListeners;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZPopoverDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ZPopoverDirective, "[z-popover]", ["zPopover"], { "zContent": { "alias": "zPopoverContent"; "required": false; "isSignal": true; }; "zPosition": { "alias": "zPosition"; "required": false; "isSignal": true; }; "zTrigger": { "alias": "zTrigger"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zShowDelay": { "alias": "zShowDelay"; "required": false; "isSignal": true; }; "zHideDelay": { "alias": "zHideDelay"; "required": false; "isSignal": true; }; "zDisabled": { "alias": "zDisabled"; "required": false; "isSignal": true; }; "zOffset": { "alias": "zOffset"; "required": false; "isSignal": true; }; "zPopoverWidth": { "alias": "zPopoverWidth"; "required": false; "isSignal": true; }; "zTriggerRef": { "alias": "zTriggerRef"; "required": false; "isSignal": true; }; "zManualClose": { "alias": "zManualClose"; "required": false; "isSignal": true; }; "zScrollClose": { "alias": "zScrollClose"; "required": false; "isSignal": true; }; "zShowArrow": { "alias": "zShowArrow"; "required": false; "isSignal": true; }; }, { "zShow": "zShow"; "zHide": "zHide"; "zHideStart": "zHideStart"; "zControl": "zControl"; "zPositionChange": "zPositionChange"; }, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ZPopoverDirective, "[z-popover]", ["zPopover"], { "zContent": { "alias": "zPopoverContent"; "required": false; "isSignal": true; }; "zPosition": { "alias": "zPosition"; "required": false; "isSignal": true; }; "zTrigger": { "alias": "zTrigger"; "required": false; "isSignal": true; }; "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zShowDelay": { "alias": "zShowDelay"; "required": false; "isSignal": true; }; "zHideDelay": { "alias": "zHideDelay"; "required": false; "isSignal": true; }; "zDisabled": { "alias": "zDisabled"; "required": false; "isSignal": true; }; "zOffset": { "alias": "zOffset"; "required": false; "isSignal": true; }; "zPopoverWidth": { "alias": "zPopoverWidth"; "required": false; "isSignal": true; }; "zTriggerRef": { "alias": "zTriggerRef"; "required": false; "isSignal": true; }; "zManualClose": { "alias": "zManualClose"; "required": false; "isSignal": true; }; "zOutsideClickClose": { "alias": "zOutsideClickClose"; "required": false; "isSignal": true; }; "zScrollClose": { "alias": "zScrollClose"; "required": false; "isSignal": true; }; "zShowArrow": { "alias": "zShowArrow"; "required": false; "isSignal": true; }; }, { "zShow": "zShow"; "zHide": "zHide"; "zHideStart": "zHideStart"; "zControl": "zControl"; "zPositionChange": "zPositionChange"; }, never, never, true, never>;
 }
 
 declare const zPopoverVariants: (props?: ({

package/types/shival99-z-ui-components-z-select.d.ts

@@ -315,7 +315,7 @@ declare class ZTagClassesPipe implements PipeTransform {
 
 declare const zSelectVariants: (props?: ({
     zSize?: "sm" | "default" | "lg" | null | undefined;
-    zStatus?: "default" | "open" | "error" | "disabled" | "readonly" | null | undefined;
+    zStatus?: "default" | "disabled" | "readonly" | "open" | "error" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const zSelectTagVariants: (props?: ({
     zSize?: "sm" | "default" | "lg" | null | undefined;

package/types/shival99-z-ui-components-z-table.d.ts

@@ -4,20 +4,19 @@ import * as _shival99_angular_virtual from '@shival99/angular-virtual';
 import * as _shival99_z_ui_components_z_input from '@shival99/z-ui/components/z-input';
 import { ZInputSize } from '@shival99/z-ui/components/z-input';
 import * as _angular_core from '@angular/core';
-import { TemplateRef, Type, AfterViewInit, ElementRef, OnDestroy, OnInit } from '@angular/core';
+import { TemplateRef, Type, AfterViewInit, ElementRef, OnInit } from '@angular/core';
 import { CdkDragDrop, CdkDragEnd } from '@angular/cdk/drag-drop';
 import { ConnectedPosition } from '@angular/cdk/overlay';
+import { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';
 import { ClassValue } from 'clsx';
 import { NgScrollbar } from 'ngx-scrollbar';
 import { ZAutocompleteType, ZAutocompleteOption } from '@shival99/z-ui/components/z-autocomplete';
 import { ZButtonVariants } from '@shival99/z-ui/components/z-button';
 import { ZIcon, ZIconVariants } from '@shival99/z-ui/components/z-icon';
-import * as _shival99_z_ui_components_z_select from '@shival99/z-ui/components/z-select';
-import { ZSelectOption } from '@shival99/z-ui/components/z-select';
+import { ZSelectOption, ZSelectConfig } from '@shival99/z-ui/components/z-select';
 import * as _shival99_z_ui_components_z_tooltip from '@shival99/z-ui/components/z-tooltip';
 import { ZTooltipConfig, ZTooltipContent } from '@shival99/z-ui/components/z-tooltip';
 import { ZExcelColumnConfig, ZExcelExportOptions } from '@shival99/z-ui/services';
-import * as _shival99_z_ui_components_z_table from '@shival99/z-ui/components/z-table';
 import { ZDateRange } from '@shival99/z-ui/components/z-calendar';
 import { ZDropdownMenuItem } from '@shival99/z-ui/components/z-dropdown-menu';
 
@@ -67,8 +66,34 @@ type ZTableCellContent<T> = string | number | TemplateRef<{
 type ZTableHeaderContent<T> = string | TemplateRef<unknown> | Type<unknown> | (() => string) | ((info: HeaderContext<T, unknown>) => string);
 /** Alias for ZTableColumnConfig — kept for backward compatibility */
 type ZTableColumn<T = unknown> = ZTableColumnConfig<T>;
-/** Available column filter input types */
-type ZTableFilterType = 'text' | 'number' | 'select' | 'multi-select' | 'date' | 'date-range' | 'range' | 'tags';
+/** Available column filter value input hints */
+type ZTableFilterValueType = 'text' | 'number';
+type ZTableFilterUi = 'basic' | 'advanced' | 'custom';
+type ZTableAdvancedFilterType = 'text' | 'number' | 'range' | 'date' | 'date-range' | 'time' | 'select' | 'multi-select' | 'tags';
+type ZTableFilterOptionSource = 'faceted' | 'table';
+/** Available column filter operators */
+type ZTableFilterOperator = 'contains' | 'notContains' | 'startsWith' | 'endsWith' | 'equals' | 'notEquals' | 'greaterThan' | 'greaterThanOrEqual' | 'lessThan' | 'lessThanOrEqual' | 'empty' | 'notEmpty';
+type ZTableFilterJoinOperator = 'and' | 'or';
+interface ZTableFilterCondition {
+    joinWithPrev?: ZTableFilterJoinOperator;
+    operator: ZTableFilterOperator;
+    value?: unknown;
+}
+interface ZTableDraftFilterCondition {
+    readonly id: string;
+    readonly joinWithPrev?: ZTableFilterJoinOperator;
+    operator: ZTableFilterOperator | null;
+    value?: unknown;
+}
+interface ZTableFilterConditionView extends ZTableDraftFilterCondition {
+    readonly inputType: 'text' | 'number';
+    readonly isJoinGroupStart: boolean;
+    readonly isValueLess: boolean;
+    readonly joinLabelKey: string;
+    readonly joinTone: 'and' | 'or';
+    readonly operatorOptions: ZSelectOption<ZTableFilterOperator>[];
+}
+type ZTableLegacyAdvancedFilterType = Exclude<ZTableAdvancedFilterType, 'text' | 'number'>;
 /** Available inline cell edit input types */
 type ZTableEditType = 'text' | 'number' | 'select' | 'date' | 'checkbox' | 'textarea' | 'toggle' | 'autocomplete';
 /**
@@ -92,11 +117,28 @@ type ZTableCustomFilterFn<T> = (row: Row<T>, columnId: string, filterValue: unkn
 interface ZTableFilterConfig<T = unknown> {
     enabled?: boolean;
     mode?: ZTableMode;
-    type?: ZTableFilterType;
+    valueType?: ZTableFilterValueType;
+    ui?: ZTableFilterUi;
+    advancedType?: ZTableAdvancedFilterType;
     options?: ZSelectOption[];
+    selectConfig?: Partial<ZSelectConfig<unknown>>;
+    optionSource?: ZTableFilterOptionSource;
     allowClear?: boolean;
+    label?: string;
     placeholder?: string;
     filterFn?: ZTableBuiltInFilterFn | ZTableCustomFilterFn<T>;
+    /**
+     * @deprecated Dùng `advancedType` thay thế.
+     */
+    type?: ZTableAdvancedFilterType;
+    /**
+     * @deprecated Dùng `advancedType` thay thế.
+     */
+    filterType?: ZTableAdvancedFilterType;
+    /**
+     * @deprecated Dùng `options` thay thế.
+     */
+    filterOptions?: ZSelectOption[];
 }
 type ZTableEditSize = 'sm' | 'default' | 'lg';
 interface ZTableEditConfig<T = unknown> {
@@ -150,29 +192,6 @@ interface ZTableEditConfig<T = unknown> {
     /** Allow typing custom values when no options match. Default: false */
     autocompleteAllowCustomValue?: boolean;
 }
-/** Minimal column info stored alongside saved config for cache invalidation */
-interface ZTableSavedColumnInfo {
-    id: string;
-    accessorKey?: string;
-}
-/**
- * Shape of the persisted table configuration (via ZCacheService).
- * Restored when a table with matching zKey re-mounts.
- * columnInfo is used to detect schema changes and invalidate stale caches.
- */
-interface ZTableSavedConfig {
-    columnOrder: string[];
-    columnSizing: Record<string, number>;
-    columnPinning: {
-        left?: string[];
-        right?: string[];
-    };
-    columnVisibility: Record<string, boolean>;
-    columnInfo: ZTableSavedColumnInfo[];
-    showHeaderFooterShadow: boolean;
-    showHorizontalBorder: boolean;
-    showVerticalBorder: boolean;
-}
 /**
  * Imperative control handle emitted via `zControl` output.
  * Allows parent components to programmatically manipulate table state
@@ -663,6 +682,10 @@ interface ZTableConfig<T> {
     /** Template rendered during loading state */
     loadingTemplate?: TemplateRef<void>;
     getRowCanExpand?: (row: Row<T>) => boolean;
+    /** Fixed table width. Defaults to the available width of the parent container. */
+    width?: string;
+    /** Fixed table height. Keeps the horizontal scrollbar at the bottom when the table has few rows. */
+    height?: string;
     maxHeight?: string;
     minHeight?: string;
     /** Debounce time (ms) for async state updates; defaults to Z_DEFAULT_DEBOUNCE_TIME */
@@ -876,6 +899,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly virtualRightSpacerWidth: _angular_core.Signal<number>;
     protected readonly renderedColumnCount: _angular_core.Signal<number>;
     protected readonly orderedLeafColumns: _angular_core.Signal<Column<T, unknown>[]>;
+    protected readonly hideableColumns: _angular_core.Signal<Column<T, unknown>[]>;
     protected readonly orderedHeaderGroups: _angular_core.Signal<{
         id: string;
         headers: _tanstack_angular_table.Header<T, unknown>[];
@@ -959,7 +983,10 @@ declare class ZTableComponent<T> implements AfterViewInit {
     hasRightPinnedColumns(): boolean;
     onTbodyScroll(event: Event): void;
     private _syncScrollLeft;
-    /** Handles sort click; auto-adds shiftKey for multi-sort when enabled */
+    /**
+     * @deprecated Header sort now lives in the column filter popover.
+     * Giữ tạm để các consumer/template cũ còn compile trong giai đoạn chuyển đổi.
+     */
     handleSort(event: Event, handler?: (event: unknown) => void): void;
     onColumnDrop(event: CdkDragDrop<string[]>): void;
     onRowDragStarted(): void;
@@ -982,6 +1009,9 @@ declare class ZTableComponent<T> implements AfterViewInit {
     onToggleColumnVisibility(columnId: string): void;
     onToggleColumnPin(columnId: string, position: 'left' | 'right'): void;
     handleColumnPin(columnId: string, position: 'left' | 'right' | false): void;
+    toggleColumnVisibility(columnId: string): void;
+    refreshColumnPopoverPositions(...popovers: ZPopoverDirective[]): void;
+    private _isColumnHiddenFromVisibilityMenu;
     moveColumnLeft(columnId: string): void;
     moveColumnRight(columnId: string): void;
     isFirstMovableColumn(columnId: string): boolean;
@@ -1013,35 +1043,85 @@ declare class ZTableComponent<T> implements AfterViewInit {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTableComponent<any>, "z-table", ["zTable"], { "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zConfig": { "alias": "zConfig"; "required": false; "isSignal": true; }; "zLoading": { "alias": "zLoading"; "required": false; "isSignal": true; }; "zKey": { "alias": "zKey"; "required": false; "isSignal": true; }; "zVariant": { "alias": "zVariant"; "required": false; "isSignal": true; }; }, { "zChange": "zChange"; "zControl": "zControl"; }, never, never, true, never>;
 }
 
-declare class ZTableFilterComponent<T> implements OnDestroy {
+declare class ZTableFilterComponent<T> {
     readonly zColumn: _angular_core.InputSignal<Column<unknown, unknown>>;
     readonly zTable: _angular_core.InputSignal<Table<T>>;
-    private _debounceTimeout;
-    private readonly _debounceMs;
     private readonly _columnDef;
-    readonly filterType: _angular_core.Signal<_shival99_z_ui_components_z_table.ZTableFilterType | undefined>;
-    readonly columnFilterValue: _angular_core.Signal<unknown>;
-    readonly minValue: _angular_core.Signal<number | "">;
-    readonly maxValue: _angular_core.Signal<number | "">;
-    readonly rangeMinValue: _angular_core.Signal<any>;
-    readonly rangeMaxValue: _angular_core.Signal<any>;
-    readonly dateValue: _angular_core.Signal<Date | null>;
-    readonly dateRangeValue: _angular_core.Signal<ZDateRange | null>;
-    readonly selectValue: _angular_core.Signal<{} | null>;
-    readonly multiSelectValue: _angular_core.Signal<any[]>;
-    readonly selectOptions: _angular_core.Signal<_shival99_z_ui_components_z_select.ZSelectOption<unknown>[] | {
+    private readonly _appliedFilterConditions;
+    private readonly _appliedLegacyFilterValue;
+    private readonly _appliedSortState;
+    protected readonly sortOptions: _angular_core.Signal<ZSelectOption<string>[]>;
+    protected readonly draftFilters: _angular_core.WritableSignal<ZTableDraftFilterCondition[]>;
+    protected readonly draftLegacyFilterValue: _angular_core.WritableSignal<unknown>;
+    protected readonly draftSortState: _angular_core.WritableSignal<false | "asc" | "desc">;
+    protected readonly columnFilterValue: _angular_core.Signal<unknown>;
+    protected readonly effectiveFilterValue: _angular_core.Signal<unknown>;
+    protected readonly sortState: _angular_core.Signal<false | _tanstack_angular_table.SortDirection>;
+    protected readonly effectiveSortState: _angular_core.Signal<false | _tanstack_angular_table.SortDirection>;
+    protected readonly canSort: _angular_core.Signal<boolean>;
+    protected readonly canFilter: _angular_core.Signal<boolean>;
+    protected readonly filterUi: _angular_core.Signal<ZTableFilterUi>;
+    protected readonly advancedType: _angular_core.Signal<ZTableAdvancedFilterType>;
+    protected readonly isAdvancedUi: _angular_core.Signal<boolean>;
+    protected readonly isBuilderMode: _angular_core.Signal<boolean>;
+    protected readonly legacyAdvancedType: _angular_core.Signal<ZTableLegacyAdvancedFilterType>;
+    protected readonly popoverContentClass: _angular_core.Signal<string>;
+    protected readonly popoverWidth: _angular_core.Signal<number>;
+    protected readonly sortLabelKey: _angular_core.Signal<string>;
+    protected readonly legacyFilterLabelKey: _angular_core.Signal<string>;
+    protected readonly filterConditions: _angular_core.Signal<ZTableFilterCondition[]>;
+    protected readonly filterConditionViews: _angular_core.Signal<ZTableFilterConditionView[]>;
+    protected readonly canAddFilterCondition: _angular_core.Signal<boolean>;
+    protected readonly filterBadgeCount: _angular_core.Signal<number>;
+    protected readonly hasFilterValue: _angular_core.Signal<boolean>;
+    protected readonly isActive: _angular_core.Signal<boolean>;
+    protected readonly draftSortValue: _angular_core.Signal<"asc" | "desc" | "none">;
+    protected readonly rangeMinValue: _angular_core.Signal<any>;
+    protected readonly rangeMaxValue: _angular_core.Signal<any>;
+    protected readonly dateValue: _angular_core.Signal<Date | null>;
+    protected readonly timeValue: _angular_core.Signal<Date | null>;
+    protected readonly dateRangeValue: _angular_core.Signal<ZDateRange | null>;
+    protected readonly selectValue: _angular_core.Signal<{} | null>;
+    protected readonly multiSelectValue: _angular_core.Signal<any[]>;
+    protected readonly selectOptions: _angular_core.Signal<{
         label: string;
-        value: string;
+        value: any;
     }[]>;
-    ngOnDestroy(): void;
+    protected readonly selectConfig: _angular_core.Signal<Partial<ZSelectConfig<unknown>>>;
+    syncDraft(): void;
+    toggleBasicSort(): void;
+    addDraftFilter(joinWithPrev: ZTableFilterJoinOperator): void;
+    removeDraftFilter(id: string): void;
+    updateFilterOperator(id: string, operator: ZTableFilterOperator | null): void;
+    updateFilterValue(id: string, value: unknown): void;
+    updateDraftSort(value: string | null): void;
+    resetFilters(): void;
+    applyFilters(): void;
     onMinChangeDebounced(value: string | number | null): void;
     onMaxChangeDebounced(value: string | number | null): void;
-    onTextChangeDebounced(value: string | number | null): void;
-    onSelectChange(value: unknown): void;
-    onMultiSelectChange(value: unknown[]): void;
     onDateChange(value: Date | null): void;
+    onTimeChange(value: Date | null): void;
     onDateRangeChange(value: ZDateRange | null): void;
-    private _debounce;
+    onSelectChange(value: unknown): void;
+    onMultiSelectChange(value: unknown[]): void;
+    private _normalizeFilterUi;
+    private _normalizeAdvancedType;
+    private _defaultLegacyFilterLabelKey;
+    private _normalizeFilterConditions;
+    private _isFilterCondition;
+    private _operatorDefinitions;
+    private _operatorOptions;
+    private _operatorOptionsForDraft;
+    private _conditionJoinTone;
+    private _withDraftId;
+    private _createDraftId;
+    private _isApplicableCondition;
+    private _isValueLessOperator;
+    private _applySortState;
+    private _normalizeSortState;
+    private _hasLegacyFilterValue;
+    private _normalizeLegacyFilterValue;
+    private _syncAppliedStateFromColumn;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZTableFilterComponent<any>, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTableFilterComponent<any>, "z-table-filter", never, { "zColumn": { "alias": "zColumn"; "required": true; "isSignal": true; }; "zTable": { "alias": "zTable"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -1063,7 +1143,7 @@ declare class ZTableActionsComponent<T = unknown> {
     readonly zConfig: _angular_core.InputSignal<ZTableActionColumnConfig<T>>;
     readonly zRow: _angular_core.InputSignal<T>;
     readonly zRowId: _angular_core.InputSignal<string>;
-    readonly zDropdownButtonSize: _angular_core.InputSignal<"sm" | "default" | "lg" | "xs" | "xl" | null | undefined>;
+    readonly zDropdownButtonSize: _angular_core.InputSignal<"default" | "sm" | "lg" | "xs" | "xl" | null | undefined>;
     readonly zActionClick: _angular_core.OutputEmitterRef<ZTableActionClickEvent<T>>;
     protected readonly allActions: _angular_core.Signal<ZTableActionItem<T>[]>;
     protected readonly shouldShowAsButtons: _angular_core.Signal<boolean>;
@@ -1213,4 +1293,4 @@ declare const findColumnConfig: <T>(columnId: string, columns: ZTableColumnConfi
 declare function columnConfigToColumnDef<T>(config: ZTableColumnConfig<T>): ColumnDef<T>;
 
 export { ZTableActionsComponent, ZTableComponent, ZTableEditCellComponent, ZTableFilterComponent, ZTableIconTextComponent, columnConfigToColumnDef, findColumnConfig, getBodyConfig, getFooterConfig, getHeaderConfig, isBodyConfig, isFooterConfig, isHeaderConfig };
-export type { ZTableActionBodyConfig, ZTableActionClickEvent, ZTableActionColumnConfig, ZTableActionItem, ZTableActionList, ZTableBulkActionClickEvent, ZTableBulkActionConfig, ZTableBulkActionContext, ZTableBulkActionHandlerContext, ZTableBulkActionItem, ZTableBulkActionList, ZTableBulkActionOptions, ZTableBulkActionViewItem, ZTableCellEditChange, ZTableCellEditEvent, ZTableChangeEvent, ZTableColumn, ZTableColumnConfig, ZTableConfig, ZTableControl, ZTableEditCellChangeEvent, ZTableEditConfig, ZTableEditSize, ZTableEditType, ZTableExcelExportConfig, ZTableExcelExportContext, ZTableExcelExportScope, ZTableFilterChangeEvent, ZTableFilterConfig, ZTableFilterType, ZTablePageChangeEvent, ZTablePaginationConfig, ZTableRowExpandEvent, ZTableRowSelectEvent, ZTableSavedConfig, ZTableSearchChangeEvent, ZTableSearchConfig, ZTableSortChangeEvent, ZTableSortConfig };
+export type { ZTableActionBodyConfig, ZTableActionClickEvent, ZTableActionColumnConfig, ZTableActionItem, ZTableActionList, ZTableAdvancedFilterType, ZTableBulkActionClickEvent, ZTableBulkActionConfig, ZTableBulkActionContext, ZTableBulkActionHandlerContext, ZTableBulkActionItem, ZTableBulkActionList, ZTableBulkActionOptions, ZTableBulkActionViewItem, ZTableCellEditChange, ZTableCellEditEvent, ZTableChangeEvent, ZTableColumn, ZTableColumnConfig, ZTableConfig, ZTableControl, ZTableEditCellChangeEvent, ZTableEditConfig, ZTableEditSize, ZTableEditType, ZTableExcelExportConfig, ZTableExcelExportContext, ZTableExcelExportScope, ZTableFilterChangeEvent, ZTableFilterCondition, ZTableFilterConfig, ZTableFilterJoinOperator, ZTableFilterOperator, ZTableFilterOptionSource, ZTableFilterUi, ZTableFilterValueType, ZTablePageChangeEvent, ZTablePaginationConfig, ZTableRowExpandEvent, ZTableRowSelectEvent, ZTableSearchChangeEvent, ZTableSearchConfig, ZTableSortChangeEvent, ZTableSortConfig };

package/types/shival99-z-ui-components-z-tabs.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { TemplateRef, AfterViewInit, OnDestroy, ElementRef } from '@angular/core';
+import { TemplateRef, OnInit, AfterViewInit, OnDestroy, ElementRef } from '@angular/core';
 import { ClassValue } from 'clsx';
 import { ZIcon } from '@shival99/z-ui/components/z-icon';
 import * as class_variance_authority_types from 'class-variance-authority/types';
@@ -20,11 +20,11 @@ interface ZTab {
     badge?: string | number;
     template?: TemplateRef<unknown>;
 }
-type ZTabsType = 'line' | 'enclosed' | 'enclosed-solid' | 'soft' | 'pill' | 'solid' | 'underline' | 'code-line';
+type ZTabsType = 'line' | 'default' | 'enclosed' | 'enclosed-solid' | 'soft' | 'pill' | 'solid' | 'underline' | 'underlined' | 'badge' | 'sharp' | 'vertical-sharp' | 'code-line';
 type ZTabsSize = 'sm' | 'default' | 'lg';
 type ZTabsOrientation = 'horizontal' | 'vertical';
 
-declare class ZTabsComponent implements AfterViewInit, OnDestroy {
+declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
     readonly tabPanels: _angular_core.Signal<readonly ZTabPanelDirective[]>;
     readonly tabsListContainer: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
     readonly tabButtons: _angular_core.Signal<readonly ElementRef<HTMLButtonElement>[]>;
@@ -37,6 +37,9 @@ declare class ZTabsComponent implements AfterViewInit, OnDestroy {
     readonly zDestroyInactive: _angular_core.InputSignal<boolean>;
     readonly zTabsOnly: _angular_core.InputSignal<boolean>;
     readonly zReloadable: _angular_core.InputSignal<boolean>;
+    readonly zEmitOnActiveClick: _angular_core.InputSignal<boolean>;
+    readonly zCache: _angular_core.InputSignal<boolean>;
+    readonly zCacheKey: _angular_core.InputSignal<string>;
     readonly activeTab: _angular_core.ModelSignal<string>;
     readonly zTabChange: _angular_core.OutputEmitterRef<string>;
     protected readonly loadedTabs: _angular_core.WritableSignal<Set<string>>;
@@ -44,7 +47,9 @@ declare class ZTabsComponent implements AfterViewInit, OnDestroy {
     protected readonly canScrollRight: _angular_core.WritableSignal<boolean>;
     protected readonly panelRenderStates: _angular_core.Signal<Map<string, boolean>>;
     private _resizeObserver?;
+    private readonly _cacheInstanceId;
     constructor();
+    ngOnInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     protected readonly tabsClasses: _angular_core.Signal<string>;
@@ -57,18 +62,21 @@ declare class ZTabsComponent implements AfterViewInit, OnDestroy {
     protected scrollRight(): void;
     protected onTabsScroll(): void;
     private _setupResizeObserver;
+    private _restoreActiveTabFromCache;
+    private _saveActiveTabToCache;
+    private _getCacheKey;
     protected scrollToActiveDropdownItem(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZTabsComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTabsComponent, "z-tabs", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zTabs": { "alias": "zTabs"; "required": true; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "zDestroyInactive": { "alias": "zDestroyInactive"; "required": false; "isSignal": true; }; "zTabsOnly": { "alias": "zTabsOnly"; "required": false; "isSignal": true; }; "zReloadable": { "alias": "zReloadable"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZTabsComponent, "z-tabs", never, { "class": { "alias": "class"; "required": false; "isSignal": true; }; "zTabs": { "alias": "zTabs"; "required": true; "isSignal": true; }; "zType": { "alias": "zType"; "required": false; "isSignal": true; }; "zSize": { "alias": "zSize"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zLazy": { "alias": "zLazy"; "required": false; "isSignal": true; }; "zDestroyInactive": { "alias": "zDestroyInactive"; "required": false; "isSignal": true; }; "zTabsOnly": { "alias": "zTabsOnly"; "required": false; "isSignal": true; }; "zReloadable": { "alias": "zReloadable"; "required": false; "isSignal": true; }; "zEmitOnActiveClick": { "alias": "zEmitOnActiveClick"; "required": false; "isSignal": true; }; "zCache": { "alias": "zCache"; "required": false; "isSignal": true; }; "zCacheKey": { "alias": "zCacheKey"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; "zTabChange": "zTabChange"; }, ["tabPanels"], never, true, never>;
 }
 
 declare const zTabsVariants: (props?: ({
-    zType?: "line" | "enclosed" | "enclosed-solid" | "soft" | "pill" | "solid" | "underline" | "code-line" | null | undefined;
+    zType?: "line" | "default" | "enclosed" | "enclosed-solid" | "soft" | "pill" | "solid" | "underline" | "underlined" | "badge" | "sharp" | "vertical-sharp" | "code-line" | null | undefined;
     zOrientation?: "horizontal" | "vertical" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const zTabItemVariants: (props?: ({
-    zType?: "line" | "enclosed" | "enclosed-solid" | "soft" | "pill" | "solid" | "underline" | "code-line" | null | undefined;
-    zSize?: "sm" | "default" | "lg" | null | undefined;
+    zType?: "line" | "default" | "enclosed" | "enclosed-solid" | "soft" | "pill" | "solid" | "underline" | "underlined" | "badge" | "sharp" | "vertical-sharp" | "code-line" | null | undefined;
+    zSize?: "default" | "sm" | "lg" | null | undefined;
     zOrientation?: "horizontal" | "vertical" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type ZTabsVariants = VariantProps<typeof zTabsVariants>;