@shival99/z-ui 2.1.6 → 2.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shival99/z-ui",
3
- "version": "2.1.6",
3
+ "version": "2.1.8",
4
4
  "description": "Z-UI: Modern Angular UI Component Library - A comprehensive, high-performance design system built with Angular 20+, featuring 40+ customizable components with dark mode, accessibility, and enterprise-ready features.",
5
5
  "keywords": [
6
6
  "angular",
@@ -46,6 +46,7 @@
46
46
  "@ng-icons/core": ">=33.0.0",
47
47
  "@ng-icons/iconsax": ">=33.0.0",
48
48
  "@ng-icons/lucide": ">=33.0.0",
49
+ "@ng-icons/phosphor-icons": ">=33.0.0",
49
50
  "@ngx-translate/core": ">=17.0.0",
50
51
  "@shival99/angular-virtual": ">=4.0.10",
51
52
  "@shival99/ngx-sonner": ">=3.0.0",
@@ -73,9 +74,9 @@
73
74
  "rxjs": ">=7.8.0",
74
75
  "tailwind-merge": ">=3.0.0",
75
76
  "xlsx": "^0.18.5",
76
- "@tiptap/extension-bubble-menu": "3.24.0",
77
- "@tiptap/extension-text-style": "3.24.0",
78
- "@tiptap/pm": "^3.24.0",
77
+ "@tiptap/extension-bubble-menu": ">=3.0.0",
78
+ "@tiptap/extension-text-style": ">=3.0.0",
79
+ "@tiptap/pm": ">=3.0.0",
79
80
  "tiptap-extension-resize-image": "^1.4.0"
80
81
  },
81
82
  "peerDependenciesMeta": {
@@ -7,12 +7,16 @@ import { VariantProps } from 'class-variance-authority';
7
7
  declare class ZButtonGroupItemDirective {
8
8
  private readonly _group;
9
9
  private readonly _index;
10
+ /** Optional stable key. When set, takes precedence over index for active state. */
11
+ readonly zValue: _angular_core.InputSignal<string | undefined>;
12
+ /** The value used to match against the group's active state: zValue if provided, otherwise the index. */
13
+ private readonly _value;
10
14
  readonly isActive: _angular_core.Signal<boolean>;
11
15
  readonly index: _angular_core.Signal<number>;
12
16
  _setIndex(index: number): void;
13
17
  protected onClick(): void;
14
18
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZButtonGroupItemDirective, never>;
15
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ZButtonGroupItemDirective, "[z-button-group-item]", ["zButtonGroupItem"], {}, {}, never, never, true, never>;
19
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ZButtonGroupItemDirective, "[z-button-group-item]", ["zButtonGroupItem"], { "zValue": { "alias": "zValue"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
16
20
  }
17
21
 
18
22
  declare class ZButtonGroupSeparatorComponent {
@@ -23,24 +27,24 @@ declare class ZButtonGroupSeparatorComponent {
23
27
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZButtonGroupSeparatorComponent, "z-button-group-separator", ["zButtonGroupSeparator"], { "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
24
28
  }
25
29
 
30
+ type ZButtonGroupValue = string | number;
26
31
  interface ZButtonGroupHost {
27
- _selectItem(index: number): void;
28
- _isItemActive(index: number): boolean;
32
+ _selectItem(value: ZButtonGroupValue): void;
33
+ _isItemActive(value: ZButtonGroupValue): boolean;
29
34
  }
30
35
  declare const Z_BUTTON_GROUP: InjectionToken<ZButtonGroupHost>;
31
36
 
32
37
  declare class ZButtonGroupComponent implements ZButtonGroupHost {
33
38
  readonly zClass: _angular_core.InputSignal<ClassValue>;
34
39
  readonly zOrientation: _angular_core.InputSignal<"horizontal" | "vertical" | null | undefined>;
35
- readonly zActive: _angular_core.ModelSignal<number | null>;
36
- readonly zActiveChange: _angular_core.OutputEmitterRef<number | null>;
40
+ readonly zActive: _angular_core.ModelSignal<ZButtonGroupValue | null>;
37
41
  private readonly _items;
38
42
  protected readonly zClasses: _angular_core.Signal<string>;
39
43
  constructor();
40
- _selectItem(index: number): void;
41
- _isItemActive(index: number): boolean;
44
+ _selectItem(value: ZButtonGroupValue): void;
45
+ _isItemActive(value: ZButtonGroupValue): boolean;
42
46
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<ZButtonGroupComponent, never>;
43
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZButtonGroupComponent, "z-button-group", ["zButtonGroup"], { "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zActive": { "alias": "zActive"; "required": false; "isSignal": true; }; }, { "zActive": "zActiveChange"; "zActiveChange": "zActiveChange"; }, ["_items"], ["*"], true, never>;
47
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<ZButtonGroupComponent, "z-button-group", ["zButtonGroup"], { "zClass": { "alias": "zClass"; "required": false; "isSignal": true; }; "zOrientation": { "alias": "zOrientation"; "required": false; "isSignal": true; }; "zActive": { "alias": "zActive"; "required": false; "isSignal": true; }; }, { "zActive": "zActiveChange"; }, ["_items"], ["*"], true, never>;
44
48
  }
45
49
 
46
50
  declare const zButtonGroupVariants: (props?: ({
@@ -188,7 +188,7 @@ declare class ZGalleryComponent implements AfterViewInit {
188
188
  protected readonly headerControlHeight: _angular_core.Signal<"1.75rem" | "2rem" | "2.5rem" | "2.25rem">;
189
189
  protected readonly skeletonMediaHeight: _angular_core.Signal<"9rem" | "14rem" | "11rem">;
190
190
  protected readonly toggleIconSize: _angular_core.Signal<"14" | "16" | "20" | "18">;
191
- protected readonly searchInputSize: _angular_core.Signal<"default" | "sm" | "lg">;
191
+ protected readonly searchInputSize: _angular_core.Signal<"sm" | "default" | "lg">;
192
192
  protected readonly filteredFiles: _angular_core.Signal<ZGalleryFile[]>;
193
193
  protected readonly selectedIds: _angular_core.Signal<Set<string>>;
194
194
  protected readonly isAllSelected: _angular_core.Signal<boolean>;
@@ -382,16 +382,16 @@ declare const isPreviewable: (file: ZGalleryFile) => boolean;
382
382
  declare const isImage: (file: ZGalleryFile) => boolean;
383
383
 
384
384
  declare const zGalleryVariants: (props?: ({
385
- zSize?: "default" | "sm" | "lg" | null | undefined;
385
+ zSize?: "sm" | "default" | "lg" | null | undefined;
386
386
  } & class_variance_authority_types.ClassProp) | undefined) => string;
387
387
  type ZGalleryVariants = VariantProps<typeof zGalleryVariants>;
388
388
  declare const zGalleryItemVariants: (props?: ({
389
389
  zMode?: "grid" | "list" | null | undefined;
390
- zSize?: "default" | "sm" | "lg" | null | undefined;
390
+ zSize?: "sm" | "default" | "lg" | null | undefined;
391
391
  } & class_variance_authority_types.ClassProp) | undefined) => string;
392
392
  type ZGalleryItemVariants = VariantProps<typeof zGalleryItemVariants>;
393
393
  declare const zGalleryFileIconVariants: (props?: ({
394
- zSize?: "default" | "sm" | "lg" | null | undefined;
394
+ zSize?: "sm" | "default" | "lg" | null | undefined;
395
395
  zMode?: "grid" | "list" | null | undefined;
396
396
  } & class_variance_authority_types.ClassProp) | undefined) => string;
397
397
  type ZGalleryFileIconVariants = VariantProps<typeof zGalleryFileIconVariants>;
@@ -1,23 +1,48 @@
1
1
  import * as _angular_core from '@angular/core';
2
2
  import { Type, EnvironmentProviders } from '@angular/core';
3
3
  import { ClassValue } from 'clsx';
4
+ import * as hugeIcons from '@hugeicons/core-free-icons';
4
5
  import * as saxBoldIcons from '@ng-icons/iconsax/bold';
5
6
  import * as saxOutlineIcons from '@ng-icons/iconsax/outline';
6
7
  import * as lucideIcons from '@ng-icons/lucide';
8
+ import * as phosphorBoldIcons from '@ng-icons/phosphor-icons/bold';
9
+ import * as phosphorDuotoneIcons from '@ng-icons/phosphor-icons/duotone';
10
+ import * as phosphorFillIcons from '@ng-icons/phosphor-icons/fill';
11
+ import * as phosphorLightIcons from '@ng-icons/phosphor-icons/light';
12
+ import * as phosphorRegularIcons from '@ng-icons/phosphor-icons/regular';
13
+ import * as phosphorThinIcons from '@ng-icons/phosphor-icons/thin';
7
14
  import * as animatedIcons from 'ng-animated-icons';
8
15
  import * as class_variance_authority_types from 'class-variance-authority/types';
9
16
  import { VariantProps } from 'class-variance-authority';
10
17
 
11
18
  type ZLucideIcon = Extract<keyof typeof lucideIcons, `lucide${string}`>;
12
19
  type ZSaxIcon = Extract<keyof typeof saxBoldIcons | keyof typeof saxOutlineIcons, `sax${string}`>;
20
+ type ZPhosphorIcon = Extract<keyof typeof phosphorRegularIcons | keyof typeof phosphorBoldIcons | keyof typeof phosphorFillIcons | keyof typeof phosphorLightIcons | keyof typeof phosphorThinIcons | keyof typeof phosphorDuotoneIcons, `phosphor${string}`>;
21
+ /**
22
+ * HugeIcons exports are PascalCase with an `Icon` suffix (e.g. `HeartIcon`,
23
+ * `Home01Icon`). We re-expose them with a `huge` prefix to stay consistent
24
+ * with the other families (e.g. `hugeHeart`, `hugeHome01`).
25
+ */
26
+ type ZHugeIcon = {
27
+ [K in keyof typeof hugeIcons as K extends `${infer Name}Icon` ? `huge${Name}` : never]: true;
28
+ } extends infer M ? Extract<keyof M, `huge${string}`> : never;
29
+ /**
30
+ * Brand/logo icons served at runtime from theSVG (thesvg.org). These are
31
+ * loaded dynamically by slug, so unlike the other families there is no
32
+ * generated union to validate against — any `brand`-prefixed name is accepted.
33
+ * The PascalCase part maps to the CDN slug, and an optional Color/Light/Dark/
34
+ * Wordmark suffix selects the variant (default `mono`, which uses currentColor).
35
+ * Examples: `brandGithub`, `brandSlackWordmark`, `brandFigmaColor`.
36
+ */
37
+ type ZBrandIcon = `brand${string}`;
13
38
  declare const Z_ICONS: {};
14
- type ZIcon = ZLucideIcon | ZSaxIcon;
39
+ type ZIcon = ZLucideIcon | ZSaxIcon | ZPhosphorIcon | ZHugeIcon | ZBrandIcon;
15
40
 
16
41
  type ZIconAnimationTrigger = 'manual' | 'hover' | 'focus' | 'interaction' | 'always';
17
42
  declare class ZIconComponent {
18
43
  readonly class: _angular_core.InputSignal<ClassValue>;
19
44
  readonly zType: _angular_core.InputSignal<ZIcon | undefined>;
20
- 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>;
45
+ readonly zAnimatedType: _angular_core.InputSignal<("accessibility" | "activity" | "play" | "airplay" | "clock" | "alarm-clock" | "check" | "alarm-clock-check" | "alarm-clock-off" | "align-horizontal-space-around" | "align-vertical-space-around" | "anvil" | "archive" | "arrow-big-down" | "arrow-big-down-dash" | "arrow-big-left" | "arrow-big-left-dash" | "arrow-big-right" | "arrow-big-right-dash" | "arrow-big-up" | "arrow-big-up-dash" | "arrow-down" | "arrow-down-01" | "arrow-down-10" | "arrow-down-a-z" | "arrow-down-left" | "arrow-down-right" | "arrow-down-z-a" | "arrow-left" | "arrow-left-right" | "arrow-right" | "arrow-right-left" | "arrow-up" | "arrow-up-01" | "arrow-up-10" | "arrow-up-a-z" | "arrow-up-left" | "arrow-up-right" | "arrow-up-z-a" | "award" | "x" | "axe" | "axis-3d" | "badge-alert" | "badge-check" | "badge-question-mark" | "battery" | "battery-charging" | "battery-full" | "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" | "book-a" | "book-audio" | "book-check" | "book-dashed" | "book-down" | "book-headphones" | "heart" | "book-heart" | "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" | "book-up-2" | "user" | "book-user" | "book-x" | "bookmark" | "bookmark-check" | "bookmark-minus" | "bookmark-plus" | "bookmark-x" | "bot" | "bot-off" | "boxes" | "cog" | "brain-cog" | "briefcase" | "briefcase-business" | "briefcase-conveyor-belt" | "briefcase-medical" | "brush" | "brush-cleaning" | "bug-off" | "calendar-check" | "calendar-check-2" | "calendar-cog" | "calendar-days" | "calendar-off" | "calendar-sync" | "camera-off" | "candy-off" | "captions-off" | "cast" | "cctv" | "chart-bar" | "chart-bar-decreasing" | "chart-bar-increasing" | "chart-column" | "chart-column-decreasing" | "chart-column-increasing" | "chart-gantt" | "chart-line" | "chart-no-axes-column" | "chart-no-axes-column-decreasing" | "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" | "chevrons-up-down" | "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" | "circle-check-big" | "circle-chevron-down" | "circle-chevron-left" | "circle-chevron-right" | "circle-chevron-up" | "circle-off" | "circle-parking-off" | "circle-plus" | "circle-question-mark" | "clapperboard" | "clipboard" | "clipboard-check" | "clipboard-list" | "pen" | "clipboard-pen" | "pen-line" | "clipboard-pen-line" | "clipboard-x" | "clock-1" | "clock-10" | "clock-11" | "clock-12" | "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" | "copy-check" | "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" | "file-check-corner" | "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" | "gallery-horizontal-end" | "gallery-thumbnails" | "gallery-vertical" | "gallery-vertical-end" | "gauge" | "gavel" | "grid-2x2-check" | "grip" | "grip-horizontal" | "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" | "maximize-2" | "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" | "minimize-2" | "monitor-check" | "monitor-cog" | "monitor-down" | "monitor-off" | "monitor-up" | "mouse-off" | "mouse-pointer" | "mouse-pointer-2" | "move-diagonal" | "move-diagonal-2" | "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" | "redo-dot" | "refresh-ccw" | "refresh-ccw-dot" | "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" | "search-check" | "send" | "send-horizontal" | "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" | "signal-high" | "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" | "square-check-big" | "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" | "trash-2" | "triangle-alert" | "umbrella-off" | "undo" | "undo-dot" | "unfold-horizontal" | "unfold-vertical" | "unplug" | "user-check" | "user-cog" | "user-pen" | "user-round" | "user-round-check" | "user-round-cog" | "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>;
21
46
  readonly zAnimate: _angular_core.InputSignal<boolean>;
22
47
  readonly zAnimationTrigger: _angular_core.InputSignal<ZIconAnimationTrigger>;
23
48
  readonly zSize: _angular_core.InputSignal<string | number | null | undefined>;
@@ -25,6 +25,7 @@ interface ZMenuItem {
25
25
  menuTemplateWidth?: number;
26
26
  renderChildren?: boolean;
27
27
  renderExpanded?: boolean;
28
+ groupLabel?: string;
28
29
  }
29
30
  type ZMenuV2Item = Omit<ZMenuItem, 'children' | 'menuTemplate' | 'menuTemplateWidth' | 'renderChildren' | 'renderExpanded'> & {
30
31
  children?: ZMenuV2Item[];
@@ -55,13 +55,13 @@ declare class ZRadioComponent implements ControlValueAccessor {
55
55
  }
56
56
 
57
57
  declare const zRadioVariants: (props?: ({
58
- zSize?: "default" | "sm" | "lg" | null | undefined;
58
+ zSize?: "sm" | "default" | "lg" | null | undefined;
59
59
  } & class_variance_authority_types.ClassProp) | undefined) => string;
60
60
  declare const zRadioIndicatorVariants: (props?: ({
61
- zSize?: "default" | "sm" | "lg" | null | undefined;
61
+ zSize?: "sm" | "default" | "lg" | null | undefined;
62
62
  } & class_variance_authority_types.ClassProp) | undefined) => string;
63
63
  declare const zRadioLabelVariants: (props?: ({
64
- zSize?: "default" | "sm" | "lg" | null | undefined;
64
+ zSize?: "sm" | "default" | "lg" | null | undefined;
65
65
  } & class_variance_authority_types.ClassProp) | undefined) => string;
66
66
  type ZRadioVariants = VariantProps<typeof zRadioVariants>;
67
67
 
@@ -1082,9 +1082,12 @@ declare class ZTableComponent<T> implements AfterViewInit {
1082
1082
  private _contentRowMenuOutsideTimer;
1083
1083
  private _contentRowMenuOutsideCleanup;
1084
1084
  private _cellInteractionOutsideCleanup;
1085
+ private _pinnedRowHeightsFrame;
1086
+ private _virtualSpacerWidthFrame;
1085
1087
  private readonly _activeColumnVisibilityPopover;
1086
1088
  private _hasInitializedColumnPinning;
1087
1089
  private _initializedGroupingSchemaKey;
1090
+ private _initializedPaginationSchemaKey;
1088
1091
  private _isFitColumnScheduled;
1089
1092
  private _skipNextConfigSave;
1090
1093
  /** Merged loading state from both zLoading input and config.loading */
@@ -1134,6 +1137,12 @@ declare class ZTableComponent<T> implements AfterViewInit {
1134
1137
  rowId: string;
1135
1138
  columnId: string;
1136
1139
  } | null>;
1140
+ private _cellDragArmed;
1141
+ private _isCellDragging;
1142
+ private _cellDragStart;
1143
+ private _cellDragCleanup;
1144
+ /** Pointer must move at least this many px before an armed press becomes a range drag. */
1145
+ private static readonly _cellDragThreshold;
1137
1146
  protected readonly cellMenu: _angular_core.WritableSignal<{
1138
1147
  rowId: string;
1139
1148
  columnId: string;
@@ -1180,8 +1189,16 @@ declare class ZTableComponent<T> implements AfterViewInit {
1180
1189
  protected readonly hasScrollLeft: _angular_core.WritableSignal<boolean>;
1181
1190
  /** True when table has right-pinned columns and body isn't scrolled to the end */
1182
1191
  protected readonly hasScrollRight: _angular_core.WritableSignal<boolean>;
1192
+ /** True khi top-pinned rows đang đè lên nội dung body đã scroll qua đầu */
1193
+ protected readonly hasScrollTop: _angular_core.WritableSignal<boolean>;
1194
+ /** True khi bottom-pinned rows đang đè lên nội dung body còn scroll xuống được */
1195
+ protected readonly hasScrollBottom: _angular_core.WritableSignal<boolean>;
1183
1196
  /** Maps row IDs to measured DOM heights for pinned row offset calculations */
1184
1197
  protected readonly pinnedRowHeights: _angular_core.WritableSignal<Record<string, number>>;
1198
+ protected readonly virtualMeasuredLeftSpacerWidth: _angular_core.WritableSignal<number>;
1199
+ protected readonly virtualMeasuredRightSpacerWidth: _angular_core.WritableSignal<number>;
1200
+ private readonly _virtualMeasuredLeftSpacerSourceWidth;
1201
+ private readonly _virtualMeasuredRightSpacerSourceWidth;
1185
1202
  protected readonly defaultBulkActions: _angular_core.Signal<ZTableBulkActionItem<T>[]>;
1186
1203
  /** Bumped to force recomputation of pinned column IDs after programmatic pin changes */
1187
1204
  private readonly _columnPinVersion;
@@ -1290,6 +1307,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
1290
1307
  * nhầm cho row đang nằm ở giữa bảng.
1291
1308
  */
1292
1309
  protected readonly renderedBodyRows: _angular_core.Signal<Row<T>[]>;
1310
+ protected readonly bodyRowSpanRows: _angular_core.Signal<Row<T>[]>;
1293
1311
  protected readonly virtualGroupedFlatItems: _angular_core.Signal<ZVirtualFlatItem<T>[]>;
1294
1312
  protected _getVirtualGroupHeader(item: ZVirtualFlatItem<T> | undefined): ZTableGroupRowItem | null;
1295
1313
  protected _isVirtualGroupChild(item: ZVirtualFlatItem<T> | undefined): boolean;
@@ -1333,15 +1351,17 @@ declare class ZTableComponent<T> implements AfterViewInit {
1333
1351
  protected readonly rightLeafColumns: _angular_core.Signal<Column<T, unknown>[]>;
1334
1352
  protected readonly hasComplexColumnLayout: _angular_core.Signal<boolean>;
1335
1353
  protected readonly canUseVirtualColumns: _angular_core.Signal<boolean>;
1336
- protected readonly columnVirtualizer: _shival99_angular_virtual.AngularVirtualizer<HTMLDivElement, Element>;
1354
+ protected readonly columnVirtualizer: _shival99_angular_virtual.AngularVirtualizer<HTMLElement, Element>;
1337
1355
  protected readonly virtualCenterColumnItems: _angular_core.Signal<_shival99_angular_virtual.VirtualItem[]>;
1338
1356
  protected readonly virtualCenterColumns: _angular_core.Signal<Column<T, unknown>[]>;
1339
1357
  protected readonly virtualCenterColumnVisibilityMap: _angular_core.Signal<Record<string, boolean>>;
1340
1358
  protected readonly firstVirtualCenterColumnId: _angular_core.Signal<string>;
1341
1359
  protected readonly lastVirtualCenterColumnId: _angular_core.Signal<string>;
1342
1360
  protected readonly virtualLeftSpacerWidth: _angular_core.Signal<number>;
1361
+ protected readonly virtualRenderedLeftSpacerWidth: _angular_core.Signal<number>;
1343
1362
  protected readonly virtualCenterTotalWidth: _angular_core.Signal<number>;
1344
1363
  protected readonly virtualRightSpacerWidth: _angular_core.Signal<number>;
1364
+ protected readonly virtualRenderedRightSpacerWidth: _angular_core.Signal<number>;
1345
1365
  protected readonly renderedColumnCount: _angular_core.Signal<number>;
1346
1366
  protected readonly renderedNativeColumnWidth: _angular_core.Signal<number>;
1347
1367
  protected readonly renderedTableWidth: _angular_core.Signal<number>;
@@ -1375,6 +1395,12 @@ declare class ZTableComponent<T> implements AfterViewInit {
1375
1395
  protected readonly skeletonRowCount: _angular_core.Signal<number>;
1376
1396
  protected readonly skeletonRows: _angular_core.Signal<number[]>;
1377
1397
  protected readonly dynamicGroupRows: _angular_core.Signal<Row<T>[][]>;
1398
+ /** Pinned top rows rendered separately from the virtualizer loop in virtual scroll mode. */
1399
+ protected readonly virtualPinnedTopRows: _angular_core.Signal<Row<T>[]>;
1400
+ protected readonly virtualPinnedTopHeight: _angular_core.Signal<number>;
1401
+ /** Pinned bottom rows rendered separately from the virtualizer loop in virtual scroll mode. */
1402
+ protected readonly virtualPinnedBottomRows: _angular_core.Signal<Row<T>[]>;
1403
+ protected readonly virtualPinnedBottomHeight: _angular_core.Signal<number>;
1378
1404
  protected readonly dynamicGroupHeights: _angular_core.Signal<any[]>;
1379
1405
  protected readonly columnSizing: _angular_core.Signal<ColumnSizingState>;
1380
1406
  protected readonly columnSizingInfo: _angular_core.Signal<_tanstack_angular_table.ColumnSizingInfoState>;
@@ -1393,8 +1419,9 @@ declare class ZTableComponent<T> implements AfterViewInit {
1393
1419
  private readonly _virtualItemKeys;
1394
1420
  /** Estimate height learned from rendered rows (dynamicSize); falls back to `virtual.size`. Reduces layout shift. */
1395
1421
  private _dynamicEstimateHeight;
1422
+ protected readonly effectiveDynamicRowSizing: _angular_core.Signal<boolean>;
1396
1423
  /** Virtualizer instance — operates on groups rather than individual rows */
1397
- protected readonly virtualizer: _shival99_angular_virtual.AngularVirtualizer<HTMLDivElement, Element>;
1424
+ protected readonly virtualizer: _shival99_angular_virtual.AngularVirtualizer<HTMLElement, Element>;
1398
1425
  private readonly _measureVirtualItems;
1399
1426
  /** Learn estimate height from measured rows (reads the measurement cache, no reflow). Locks once. */
1400
1427
  private _learnDynamicEstimate;
@@ -1430,6 +1457,12 @@ declare class ZTableComponent<T> implements AfterViewInit {
1430
1457
  private _emitFilterChangeDebounced;
1431
1458
  private _checkScrollState;
1432
1459
  private _refreshPinnedRowHeights;
1460
+ private _schedulePinnedRowHeightsRefresh;
1461
+ private _cancelPinnedRowHeightsRefresh;
1462
+ private _refreshVirtualSpacerWidths;
1463
+ private _setVirtualMeasuredSpacerWidths;
1464
+ private _scheduleVirtualSpacerWidthRefresh;
1465
+ private _cancelVirtualSpacerWidthRefresh;
1433
1466
  private _checkVerticalScroll;
1434
1467
  private _checkLastRowTouchesBottom;
1435
1468
  private _getTbodyViewportElement;
@@ -1444,6 +1477,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
1444
1477
  private _reconcileColumnSizing;
1445
1478
  private _checkHorizontalScroll;
1446
1479
  private _updateScrollShadowState;
1480
+ private _updateVerticalScrollShadowState;
1447
1481
  hasRightPinnedColumns(): boolean;
1448
1482
  onTbodyScroll(event: Event): void;
1449
1483
  private _syncScrollLeft;
@@ -1470,6 +1504,8 @@ declare class ZTableComponent<T> implements AfterViewInit {
1470
1504
  protected clearCellMenu(): void;
1471
1505
  protected clearContentRowMenu(): void;
1472
1506
  protected onCellPointerDown(event: PointerEvent, row: Row<T>, columnId: string): void;
1507
+ /** Arms a range-drag on cell pointerdown and starts document-level move/up tracking to confirm it. */
1508
+ private _armCellDrag;
1473
1509
  protected onCellPointerEnter(event: PointerEvent, row: Row<T>, columnId: string): void;
1474
1510
  protected openCellMenu(event: MouseEvent, row: Row<T>, columnId: string): void;
1475
1511
  protected openContentRowMenu(event: MouseEvent, row: Row<T>, columnId?: string): void;
@@ -57,7 +57,7 @@ declare class ZToastComponent {
57
57
  private readonly _themeService;
58
58
  private readonly _config;
59
59
  readonly class: _angular_core.InputSignal<ClassValue>;
60
- readonly zVariant: _angular_core.InputSignal<"default" | "success" | "error" | "warning" | "info" | null | undefined>;
60
+ readonly zVariant: _angular_core.InputSignal<"success" | "error" | "warning" | "info" | "default" | null | undefined>;
61
61
  readonly zTheme: _angular_core.InputSignal<ZToastTheme | undefined>;
62
62
  readonly zPosition: _angular_core.InputSignal<ZToastPosition | undefined>;
63
63
  readonly zRichColors: _angular_core.InputSignal<boolean | undefined>;
@@ -152,7 +152,7 @@ declare class ZToastService implements OnDestroy {
152
152
  }
153
153
 
154
154
  declare const zToastVariants: (props?: ({
155
- zVariant?: "default" | "success" | "error" | "warning" | "info" | null | undefined;
155
+ zVariant?: "success" | "error" | "warning" | "info" | "default" | null | undefined;
156
156
  } & class_variance_authority_types.ClassProp) | undefined) => string;
157
157
  type ZToastVariants = VariantProps<typeof zToastVariants>;
158
158