@shival99/z-ui 2.1.32 → 2.2.0

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.
Files changed (104) hide show
  1. package/fesm2022/shival99-z-ui-components-z-accordion.mjs +41 -25
  2. package/fesm2022/shival99-z-ui-components-z-accordion.mjs.map +1 -1
  3. package/fesm2022/shival99-z-ui-components-z-autocomplete.mjs +176 -97
  4. package/fesm2022/shival99-z-ui-components-z-autocomplete.mjs.map +1 -1
  5. package/fesm2022/shival99-z-ui-components-z-avatar.mjs +71 -40
  6. package/fesm2022/shival99-z-ui-components-z-avatar.mjs.map +1 -1
  7. package/fesm2022/shival99-z-ui-components-z-breadcrumb.mjs +26 -15
  8. package/fesm2022/shival99-z-ui-components-z-breadcrumb.mjs.map +1 -1
  9. package/fesm2022/shival99-z-ui-components-z-button-group.mjs +33 -21
  10. package/fesm2022/shival99-z-ui-components-z-button-group.mjs.map +1 -1
  11. package/fesm2022/shival99-z-ui-components-z-button.mjs +32 -19
  12. package/fesm2022/shival99-z-ui-components-z-button.mjs.map +1 -1
  13. package/fesm2022/shival99-z-ui-components-z-calendar.mjs +289 -172
  14. package/fesm2022/shival99-z-ui-components-z-calendar.mjs.map +1 -1
  15. package/fesm2022/shival99-z-ui-components-z-card.mjs +34 -24
  16. package/fesm2022/shival99-z-ui-components-z-card.mjs.map +1 -1
  17. package/fesm2022/shival99-z-ui-components-z-chat.mjs +85 -47
  18. package/fesm2022/shival99-z-ui-components-z-chat.mjs.map +1 -1
  19. package/fesm2022/shival99-z-ui-components-z-checkbox.mjs +56 -31
  20. package/fesm2022/shival99-z-ui-components-z-checkbox.mjs.map +1 -1
  21. package/fesm2022/shival99-z-ui-components-z-code.mjs +29 -16
  22. package/fesm2022/shival99-z-ui-components-z-code.mjs.map +1 -1
  23. package/fesm2022/shival99-z-ui-components-z-command.mjs +34 -19
  24. package/fesm2022/shival99-z-ui-components-z-command.mjs.map +1 -1
  25. package/fesm2022/shival99-z-ui-components-z-drawer.mjs +310 -88
  26. package/fesm2022/shival99-z-ui-components-z-drawer.mjs.map +1 -1
  27. package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs +32 -18
  28. package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs.map +1 -1
  29. package/fesm2022/shival99-z-ui-components-z-editor.mjs +118 -62
  30. package/fesm2022/shival99-z-ui-components-z-editor.mjs.map +1 -1
  31. package/fesm2022/shival99-z-ui-components-z-empty.mjs +31 -17
  32. package/fesm2022/shival99-z-ui-components-z-empty.mjs.map +1 -1
  33. package/fesm2022/shival99-z-ui-components-z-filter.mjs +81 -54
  34. package/fesm2022/shival99-z-ui-components-z-filter.mjs.map +1 -1
  35. package/fesm2022/shival99-z-ui-components-z-gallery.mjs +240 -132
  36. package/fesm2022/shival99-z-ui-components-z-gallery.mjs.map +1 -1
  37. package/fesm2022/shival99-z-ui-components-z-icon.mjs +39 -21
  38. package/fesm2022/shival99-z-ui-components-z-icon.mjs.map +1 -1
  39. package/fesm2022/shival99-z-ui-components-z-input.mjs +173 -95
  40. package/fesm2022/shival99-z-ui-components-z-input.mjs.map +1 -1
  41. package/fesm2022/shival99-z-ui-components-z-kanban.mjs +88 -47
  42. package/fesm2022/shival99-z-ui-components-z-kanban.mjs.map +1 -1
  43. package/fesm2022/shival99-z-ui-components-z-loading.mjs +31 -19
  44. package/fesm2022/shival99-z-ui-components-z-loading.mjs.map +1 -1
  45. package/fesm2022/shival99-z-ui-components-z-marquee.mjs +42 -23
  46. package/fesm2022/shival99-z-ui-components-z-marquee.mjs.map +1 -1
  47. package/fesm2022/shival99-z-ui-components-z-media-player.mjs +87 -45
  48. package/fesm2022/shival99-z-ui-components-z-media-player.mjs.map +1 -1
  49. package/fesm2022/shival99-z-ui-components-z-menu.mjs +126 -67
  50. package/fesm2022/shival99-z-ui-components-z-menu.mjs.map +1 -1
  51. package/fesm2022/shival99-z-ui-components-z-metric-card.mjs +42 -23
  52. package/fesm2022/shival99-z-ui-components-z-metric-card.mjs.map +1 -1
  53. package/fesm2022/shival99-z-ui-components-z-modal.mjs +144 -80
  54. package/fesm2022/shival99-z-ui-components-z-modal.mjs.map +1 -1
  55. package/fesm2022/shival99-z-ui-components-z-pagination.mjs +45 -24
  56. package/fesm2022/shival99-z-ui-components-z-pagination.mjs.map +1 -1
  57. package/fesm2022/shival99-z-ui-components-z-popover.mjs +90 -57
  58. package/fesm2022/shival99-z-ui-components-z-popover.mjs.map +1 -1
  59. package/fesm2022/shival99-z-ui-components-z-qrcode.mjs +51 -29
  60. package/fesm2022/shival99-z-ui-components-z-qrcode.mjs.map +1 -1
  61. package/fesm2022/shival99-z-ui-components-z-radio.mjs +36 -20
  62. package/fesm2022/shival99-z-ui-components-z-radio.mjs.map +1 -1
  63. package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs +27 -15
  64. package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs.map +1 -1
  65. package/fesm2022/shival99-z-ui-components-z-select.mjs +239 -138
  66. package/fesm2022/shival99-z-ui-components-z-select.mjs.map +1 -1
  67. package/fesm2022/shival99-z-ui-components-z-show-more.mjs +38 -21
  68. package/fesm2022/shival99-z-ui-components-z-show-more.mjs.map +1 -1
  69. package/fesm2022/shival99-z-ui-components-z-skeleton-auto.mjs +42 -23
  70. package/fesm2022/shival99-z-ui-components-z-skeleton-auto.mjs.map +1 -1
  71. package/fesm2022/shival99-z-ui-components-z-skeleton.mjs +35 -19
  72. package/fesm2022/shival99-z-ui-components-z-skeleton.mjs.map +1 -1
  73. package/fesm2022/shival99-z-ui-components-z-steps.mjs +55 -31
  74. package/fesm2022/shival99-z-ui-components-z-steps.mjs.map +1 -1
  75. package/fesm2022/shival99-z-ui-components-z-switch.mjs +60 -33
  76. package/fesm2022/shival99-z-ui-components-z-switch.mjs.map +1 -1
  77. package/fesm2022/shival99-z-ui-components-z-table.mjs +10875 -0
  78. package/fesm2022/shival99-z-ui-components-z-table.mjs.map +1 -0
  79. package/fesm2022/shival99-z-ui-components-z-tabs.mjs +534 -0
  80. package/fesm2022/shival99-z-ui-components-z-tabs.mjs.map +1 -0
  81. package/fesm2022/shival99-z-ui-components-z-tags.mjs +72 -46
  82. package/fesm2022/shival99-z-ui-components-z-tags.mjs.map +1 -1
  83. package/fesm2022/shival99-z-ui-components-z-timeline.mjs +254 -0
  84. package/fesm2022/shival99-z-ui-components-z-timeline.mjs.map +1 -0
  85. package/fesm2022/shival99-z-ui-components-z-toast.mjs +53 -31
  86. package/fesm2022/shival99-z-ui-components-z-toast.mjs.map +1 -1
  87. package/fesm2022/shival99-z-ui-components-z-tooltip.mjs +133 -56
  88. package/fesm2022/shival99-z-ui-components-z-tooltip.mjs.map +1 -1
  89. package/fesm2022/shival99-z-ui-components-z-upload.mjs +63 -36
  90. package/fesm2022/shival99-z-ui-components-z-upload.mjs.map +1 -1
  91. package/fesm2022/shival99-z-ui-i18n.mjs +2 -0
  92. package/fesm2022/shival99-z-ui-i18n.mjs.map +1 -1
  93. package/fesm2022/shival99-z-ui-pipes.mjs +18 -18
  94. package/fesm2022/shival99-z-ui-services.mjs +35 -31
  95. package/fesm2022/shival99-z-ui-services.mjs.map +1 -1
  96. package/package.json +16 -16
  97. package/types/shival99-z-ui-components-z-autocomplete.d.ts +2 -2
  98. package/types/shival99-z-ui-components-z-card.d.ts +1 -2
  99. package/types/shival99-z-ui-components-z-drawer.d.ts +20 -2
  100. package/types/shival99-z-ui-components-z-gallery.d.ts +1 -2
  101. package/types/shival99-z-ui-components-z-select.d.ts +2 -2
  102. package/types/shival99-z-ui-components-z-table.d.ts +2293 -0
  103. package/types/shival99-z-ui-components-z-tabs.d.ts +92 -0
  104. package/types/shival99-z-ui-components-z-timeline.d.ts +71 -0
@@ -1,14 +1,14 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Directive, contentChild, output, input, model, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
2
+ import { Directive, contentChild, input, model, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
3
3
  import { ZIconComponent } from '@shival99/z-ui/components/z-icon';
4
4
  import { zTransform, zMergeClasses } from '@shival99/z-ui/utils';
5
5
  import { cva } from 'class-variance-authority';
6
6
 
7
7
  class ZCardTitleDirective {
8
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.9", type: ZCardTitleDirective, isStandalone: true, selector: "[zCardTitle], [z-card-title]", ngImport: i0 });
8
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZCardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: ZCardTitleDirective, isStandalone: true, selector: "[zCardTitle], [z-card-title]", ngImport: i0 });
10
10
  }
11
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCardTitleDirective, decorators: [{
11
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZCardTitleDirective, decorators: [{
12
12
  type: Directive,
13
13
  args: [{
14
14
  selector: '[zCardTitle], [z-card-title]',
@@ -87,47 +87,57 @@ const zCardContentVariants = cva([''], {
87
87
  });
88
88
 
89
89
  class ZCardComponent {
90
- _customTitle = contentChild(ZCardTitleDirective, ...(ngDevMode ? [{ debugName: "_customTitle" }] : []));
91
- _customTitleContent = contentChild('zCardTitle', ...(ngDevMode ? [{ debugName: "_customTitleContent" }] : []));
92
- zCollapsedChange = output();
93
- class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
94
- zTitle = input('', ...(ngDevMode ? [{ debugName: "zTitle" }] : []));
95
- zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
96
- zCollapsible = input(false, { ...(ngDevMode ? { debugName: "zCollapsible" } : {}), transform: zTransform });
97
- zHiddenIcon = input(false, { ...(ngDevMode ? { debugName: "zHiddenIcon" } : {}), transform: zTransform });
98
- zCollapsed = model(false, ...(ngDevMode ? [{ debugName: "zCollapsed" }] : []));
90
+ _customTitle = contentChild(ZCardTitleDirective, /* @ts-ignore */
91
+ ...(ngDevMode ? [{ debugName: "_customTitle" }] : /* istanbul ignore next */ []));
92
+ _customTitleContent = contentChild('zCardTitle', /* @ts-ignore */
93
+ ...(ngDevMode ? [{ debugName: "_customTitleContent" }] : /* istanbul ignore next */ []));
94
+ class = input('', /* @ts-ignore */
95
+ ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
96
+ zTitle = input('', /* @ts-ignore */
97
+ ...(ngDevMode ? [{ debugName: "zTitle" }] : /* istanbul ignore next */ []));
98
+ zSize = input('default', /* @ts-ignore */
99
+ ...(ngDevMode ? [{ debugName: "zSize" }] : /* istanbul ignore next */ []));
100
+ zCollapsible = input(false, { ...(ngDevMode ? { debugName: "zCollapsible" } : /* istanbul ignore next */ {}), transform: zTransform });
101
+ zHiddenIcon = input(false, { ...(ngDevMode ? { debugName: "zHiddenIcon" } : /* istanbul ignore next */ {}), transform: zTransform });
102
+ zCollapsed = model(false, /* @ts-ignore */
103
+ ...(ngDevMode ? [{ debugName: "zCollapsed" }] : /* istanbul ignore next */ []));
99
104
  isCollapsed = computed(() => {
100
105
  if (!this.zCollapsible()) {
101
106
  return false;
102
107
  }
103
108
  return this.zCollapsed();
104
- }, ...(ngDevMode ? [{ debugName: "isCollapsed" }] : []));
105
- hasCustomTitle = computed(() => !!this._customTitle() || !!this._customTitleContent(), ...(ngDevMode ? [{ debugName: "hasCustomTitle" }] : []));
106
- hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()), ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
109
+ }, /* @ts-ignore */
110
+ ...(ngDevMode ? [{ debugName: "isCollapsed" }] : /* istanbul ignore next */ []));
111
+ hasCustomTitle = computed(() => !!this._customTitle() || !!this._customTitleContent(), /* @ts-ignore */
112
+ ...(ngDevMode ? [{ debugName: "hasCustomTitle" }] : /* istanbul ignore next */ []));
113
+ hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()), /* @ts-ignore */
114
+ ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
107
115
  headerClasses = computed(() => zCardHeaderVariants({
108
116
  zSize: this.zSize(),
109
117
  zCollapsible: this.zCollapsible(),
110
118
  zCollapsed: this.isCollapsed(),
111
- }), ...(ngDevMode ? [{ debugName: "headerClasses" }] : []));
112
- titleClasses = computed(() => zCardTitleVariants({ zSize: this.zSize(), zCollapsible: this.zCollapsible() }), ...(ngDevMode ? [{ debugName: "titleClasses" }] : []));
113
- contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }), ...(ngDevMode ? [{ debugName: "contentClasses" }] : []));
119
+ }), /* @ts-ignore */
120
+ ...(ngDevMode ? [{ debugName: "headerClasses" }] : /* istanbul ignore next */ []));
121
+ titleClasses = computed(() => zCardTitleVariants({ zSize: this.zSize(), zCollapsible: this.zCollapsible() }), /* @ts-ignore */
122
+ ...(ngDevMode ? [{ debugName: "titleClasses" }] : /* istanbul ignore next */ []));
123
+ contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }), /* @ts-ignore */
124
+ ...(ngDevMode ? [{ debugName: "contentClasses" }] : /* istanbul ignore next */ []));
114
125
  onHeaderClick() {
115
126
  if (!this.zCollapsible()) {
116
127
  return;
117
128
  }
118
129
  const newState = !this.zCollapsed();
119
130
  this.zCollapsed.set(newState);
120
- this.zCollapsedChange.emit(newState);
121
131
  }
122
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
123
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZCardComponent, isStandalone: true, selector: "z-card", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zCollapsible: { classPropertyName: "zCollapsible", publicName: "zCollapsible", isSignal: true, isRequired: false, transformFunction: null }, zHiddenIcon: { classPropertyName: "zHiddenIcon", publicName: "zHiddenIcon", isSignal: true, isRequired: false, transformFunction: null }, zCollapsed: { classPropertyName: "zCollapsed", publicName: "zCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zCollapsedChange: "zCollapsedChange", zCollapsed: "zCollapsedChange" }, host: { properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "_customTitle", first: true, predicate: ZCardTitleDirective, descendants: true, isSignal: true }, { propertyName: "_customTitleContent", first: true, predicate: ["zCardTitle"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (zTitle() || zCollapsible() || hasCustomTitle()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible() && !zHiddenIcon()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n", styles: [".z-card-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-card-content.z-card-content-open{grid-template-rows:1fr}.z-card-content>.z-card-content-inner{overflow:hidden;min-height:0}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
132
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
133
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: ZCardComponent, isStandalone: true, selector: "z-card", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zCollapsible: { classPropertyName: "zCollapsible", publicName: "zCollapsible", isSignal: true, isRequired: false, transformFunction: null }, zHiddenIcon: { classPropertyName: "zHiddenIcon", publicName: "zHiddenIcon", isSignal: true, isRequired: false, transformFunction: null }, zCollapsed: { classPropertyName: "zCollapsed", publicName: "zCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zCollapsed: "zCollapsedChange" }, host: { properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "_customTitle", first: true, predicate: ZCardTitleDirective, descendants: true, isSignal: true }, { propertyName: "_customTitleContent", first: true, predicate: ["zCardTitle"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (zTitle() || zCollapsible() || hasCustomTitle()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible() && !zHiddenIcon()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n", styles: [".z-card-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-card-content.z-card-content-open{grid-template-rows:1fr}.z-card-content>.z-card-content-inner{overflow:hidden;min-height:0}\n"], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
124
134
  }
125
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZCardComponent, decorators: [{
135
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZCardComponent, decorators: [{
126
136
  type: Component,
127
137
  args: [{ selector: 'z-card', imports: [ZIconComponent], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
128
138
  '[class]': 'hostClasses()',
129
139
  }, template: "@if (zTitle() || zCollapsible() || hasCustomTitle()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible() && !zHiddenIcon()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n", styles: [".z-card-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease-out}.z-card-content.z-card-content-open{grid-template-rows:1fr}.z-card-content>.z-card-content-inner{overflow:hidden;min-height:0}\n"] }]
130
- }], propDecorators: { _customTitle: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ZCardTitleDirective), { isSignal: true }] }], _customTitleContent: [{ type: i0.ContentChild, args: ['zCardTitle', { isSignal: true }] }], zCollapsedChange: [{ type: i0.Output, args: ["zCollapsedChange"] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTitle", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zCollapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsible", required: false }] }], zHiddenIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zHiddenIcon", required: false }] }], zCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsed", required: false }] }, { type: i0.Output, args: ["zCollapsedChange"] }] } });
140
+ }], propDecorators: { _customTitle: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ZCardTitleDirective), { isSignal: true }] }], _customTitleContent: [{ type: i0.ContentChild, args: ['zCardTitle', { isSignal: true }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "zTitle", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zCollapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsible", required: false }] }], zHiddenIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zHiddenIcon", required: false }] }], zCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "zCollapsed", required: false }] }, { type: i0.Output, args: ["zCollapsedChange"] }] } });
131
141
 
132
142
  /**
133
143
  * Generated bundle index. Do not edit.
@@ -1 +1 @@
1
- {"version":3,"file":"shival99-z-ui-components-z-card.mjs","sources":["../../../../libs/core-ui/components/z-card/directives/z-card-title.directive.ts","../../../../libs/core-ui/components/z-card/z-card.variants.ts","../../../../libs/core-ui/components/z-card/z-card.component.ts","../../../../libs/core-ui/components/z-card/z-card.component.html","../../../../libs/core-ui/components/z-card/shival99-z-ui-components-z-card.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[zCardTitle], [z-card-title]',\n standalone: true,\n})\nexport class ZCardTitleDirective {}\n","import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zCardVariants = cva(\n [\n 'block w-full',\n 'rounded-[0.375rem] border border-border',\n 'bg-card text-card-foreground',\n 'shadow-card',\n 'transition-shadow duration-200',\n ],\n {\n variants: {\n zSize: {\n sm: '',\n default: '',\n lg: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n }\n);\n\nexport const zCardHeaderVariants = cva(['flex items-center justify-between', 'transition-colors duration-200 w-full'], {\n variants: {\n zSize: {\n sm: 'px-3 py-2',\n default: 'px-4 py-3',\n lg: 'px-5 py-4',\n },\n zCollapsible: {\n true: 'cursor-pointer select-none hover:bg-muted/50',\n false: '',\n },\n zCollapsed: {\n true: 'border-b !border-transparent',\n false: 'border-b !border-border',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n zCollapsed: false,\n },\n});\n\nexport const zCardTitleVariants = cva(['font-medium text-foreground w-full'], {\n variants: {\n zSize: {\n sm: 'text-sm',\n default: 'text-base',\n lg: 'text-lg',\n },\n zCollapsible: {\n true: '[&_*]:select-none',\n false: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n },\n});\n\nexport const zCardContentVariants = cva([''], {\n variants: {\n zSize: {\n sm: 'p-3',\n default: 'p-4',\n lg: 'p-5',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZCardVariants = VariantProps<typeof zCardVariants>;\nexport type ZCardHeaderVariants = VariantProps<typeof zCardHeaderVariants>;\nexport type ZCardTitleVariants = VariantProps<typeof zCardTitleVariants>;\nexport type ZCardContentVariants = VariantProps<typeof zCardContentVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n ElementRef,\n input,\n model,\n output,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZCardTitleDirective } from './directives/z-card-title.directive';\nimport type { ZCardSize } from './z-card.types';\nimport { zCardContentVariants, zCardHeaderVariants, zCardTitleVariants, zCardVariants } from './z-card.variants';\n\n@Component({\n selector: 'z-card',\n imports: [ZIconComponent],\n standalone: true,\n templateUrl: './z-card.component.html',\n styleUrl: './z-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'hostClasses()',\n },\n})\nexport class ZCardComponent {\n private readonly _customTitle = contentChild(ZCardTitleDirective);\n private readonly _customTitleContent = contentChild<ElementRef>('zCardTitle');\n\n public readonly zCollapsedChange = output<boolean>();\n\n public readonly class = input<ClassValue>('');\n public readonly zTitle = input<string>('');\n public readonly zSize = input<ZCardSize>('default');\n public readonly zCollapsible = input(false, { transform: zTransform });\n public readonly zHiddenIcon = input(false, { transform: zTransform });\n public readonly zCollapsed = model<boolean>(false);\n\n protected readonly isCollapsed = computed(() => {\n if (!this.zCollapsible()) {\n return false;\n }\n return this.zCollapsed();\n });\n\n protected readonly hasCustomTitle = computed(() => !!this._customTitle() || !!this._customTitleContent());\n protected readonly hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()));\n protected readonly headerClasses = computed(() =>\n zCardHeaderVariants({\n zSize: this.zSize(),\n zCollapsible: this.zCollapsible(),\n zCollapsed: this.isCollapsed(),\n })\n );\n\n protected readonly titleClasses = computed(() =>\n zCardTitleVariants({ zSize: this.zSize(), zCollapsible: this.zCollapsible() })\n );\n\n protected readonly contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }));\n\n protected onHeaderClick(): void {\n if (!this.zCollapsible()) {\n return;\n }\n\n const newState = !this.zCollapsed();\n this.zCollapsed.set(newState);\n this.zCollapsedChange.emit(newState);\n }\n}\n","@if (zTitle() || zCollapsible() || hasCustomTitle()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible() && !zHiddenIcon()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"shival99-z-ui-components-z-card.mjs","sources":["../../../../libs/core-ui/components/z-card/directives/z-card-title.directive.ts","../../../../libs/core-ui/components/z-card/z-card.variants.ts","../../../../libs/core-ui/components/z-card/z-card.component.ts","../../../../libs/core-ui/components/z-card/z-card.component.html","../../../../libs/core-ui/components/z-card/shival99-z-ui-components-z-card.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[zCardTitle], [z-card-title]',\n standalone: true,\n})\nexport class ZCardTitleDirective {}\n","import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zCardVariants = cva(\n [\n 'block w-full',\n 'rounded-[0.375rem] border border-border',\n 'bg-card text-card-foreground',\n 'shadow-card',\n 'transition-shadow duration-200',\n ],\n {\n variants: {\n zSize: {\n sm: '',\n default: '',\n lg: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n }\n);\n\nexport const zCardHeaderVariants = cva(['flex items-center justify-between', 'transition-colors duration-200 w-full'], {\n variants: {\n zSize: {\n sm: 'px-3 py-2',\n default: 'px-4 py-3',\n lg: 'px-5 py-4',\n },\n zCollapsible: {\n true: 'cursor-pointer select-none hover:bg-muted/50',\n false: '',\n },\n zCollapsed: {\n true: 'border-b !border-transparent',\n false: 'border-b !border-border',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n zCollapsed: false,\n },\n});\n\nexport const zCardTitleVariants = cva(['font-medium text-foreground w-full'], {\n variants: {\n zSize: {\n sm: 'text-sm',\n default: 'text-base',\n lg: 'text-lg',\n },\n zCollapsible: {\n true: '[&_*]:select-none',\n false: '',\n },\n },\n defaultVariants: {\n zSize: 'default',\n zCollapsible: false,\n },\n});\n\nexport const zCardContentVariants = cva([''], {\n variants: {\n zSize: {\n sm: 'p-3',\n default: 'p-4',\n lg: 'p-5',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZCardVariants = VariantProps<typeof zCardVariants>;\nexport type ZCardHeaderVariants = VariantProps<typeof zCardHeaderVariants>;\nexport type ZCardTitleVariants = VariantProps<typeof zCardTitleVariants>;\nexport type ZCardContentVariants = VariantProps<typeof zCardContentVariants>;\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n ElementRef,\n input,\n model,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { zMergeClasses, zTransform } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport { ZCardTitleDirective } from './directives/z-card-title.directive';\nimport type { ZCardSize } from './z-card.types';\nimport { zCardContentVariants, zCardHeaderVariants, zCardTitleVariants, zCardVariants } from './z-card.variants';\n\n@Component({\n selector: 'z-card',\n imports: [ZIconComponent],\n standalone: true,\n templateUrl: './z-card.component.html',\n styleUrl: './z-card.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[class]': 'hostClasses()',\n },\n})\nexport class ZCardComponent {\n private readonly _customTitle = contentChild(ZCardTitleDirective);\n private readonly _customTitleContent = contentChild<ElementRef>('zCardTitle');\n\n public readonly class = input<ClassValue>('');\n public readonly zTitle = input<string>('');\n public readonly zSize = input<ZCardSize>('default');\n public readonly zCollapsible = input(false, { transform: zTransform });\n public readonly zHiddenIcon = input(false, { transform: zTransform });\n public readonly zCollapsed = model<boolean>(false);\n\n protected readonly isCollapsed = computed(() => {\n if (!this.zCollapsible()) {\n return false;\n }\n return this.zCollapsed();\n });\n\n protected readonly hasCustomTitle = computed(() => !!this._customTitle() || !!this._customTitleContent());\n protected readonly hostClasses = computed(() => zMergeClasses(zCardVariants({ zSize: this.zSize() }), this.class()));\n protected readonly headerClasses = computed(() =>\n zCardHeaderVariants({\n zSize: this.zSize(),\n zCollapsible: this.zCollapsible(),\n zCollapsed: this.isCollapsed(),\n })\n );\n\n protected readonly titleClasses = computed(() =>\n zCardTitleVariants({ zSize: this.zSize(), zCollapsible: this.zCollapsible() })\n );\n\n protected readonly contentClasses = computed(() => zCardContentVariants({ zSize: this.zSize() }));\n\n protected onHeaderClick(): void {\n if (!this.zCollapsible()) {\n return;\n }\n\n const newState = !this.zCollapsed();\n this.zCollapsed.set(newState);\n }\n}\n","@if (zTitle() || zCollapsible() || hasCustomTitle()) {\n <div\n [class]=\"headerClasses()\"\n (click)=\"onHeaderClick()\"\n (keydown.enter)=\"onHeaderClick()\"\n (keydown.space)=\"onHeaderClick()\"\n [tabindex]=\"zCollapsible() ? 0 : -1\"\n [attr.role]=\"zCollapsible() ? 'button' : null\"\n [attr.aria-expanded]=\"zCollapsible() ? !isCollapsed() : null\">\n <span [class]=\"titleClasses()\">\n <ng-content select=\"[zCardTitle]\" />\n @if (!hasCustomTitle()) {\n {{ zTitle() }}\n }\n </span>\n @if (zCollapsible() && !zHiddenIcon()) {\n <z-icon\n zType=\"lucideChevronDown\"\n zSize=\"16\"\n class=\"text-muted-foreground shrink-0 transition-transform duration-200\"\n [class.rotate-180]=\"!isCollapsed()\" />\n }\n <ng-content select=\"[zCardExtra]\" />\n </div>\n}\n\n<div class=\"z-card-content\" [class.z-card-content-open]=\"!isCollapsed()\">\n <div class=\"z-card-content-inner\">\n <div [class]=\"contentClasses()\">\n <ng-content />\n </div>\n </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -68,66 +68,104 @@ const DEFAULT_SUGGESTIONS = [
68
68
  { label: 'i18n_z_ui_chat_ai_suggestion_3', prompt: 'Generate a concise PR summary', icon: 'lucideGitPullRequest' },
69
69
  ];
70
70
  class ZChatComponent {
71
- class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
72
- zOpen = model(false, ...(ngDevMode ? [{ debugName: "zOpen" }] : []));
73
- zMessages = model([], ...(ngDevMode ? [{ debugName: "zMessages" }] : []));
74
- zTitle = input('i18n_z_ui_chat_ai_title', ...(ngDevMode ? [{ debugName: "zTitle" }] : []));
75
- zSubtitle = input('i18n_z_ui_chat_ai_subtitle', ...(ngDevMode ? [{ debugName: "zSubtitle" }] : []));
76
- zPlaceholder = input('i18n_z_ui_chat_ai_placeholder', ...(ngDevMode ? [{ debugName: "zPlaceholder" }] : []));
77
- zPosition = input('bottom-right', ...(ngDevMode ? [{ debugName: "zPosition" }] : []));
78
- zOffset = input({}, ...(ngDevMode ? [{ debugName: "zOffset" }] : []));
79
- zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
80
- zSuggestions = input(DEFAULT_SUGGESTIONS, ...(ngDevMode ? [{ debugName: "zSuggestions" }] : []));
81
- zShowSuggestions = input(true, { ...(ngDevMode ? { debugName: "zShowSuggestions" } : {}), transform: zTransform });
82
- zShowPulse = input(true, { ...(ngDevMode ? { debugName: "zShowPulse" } : {}), transform: zTransform });
83
- zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : {}), transform: zTransform });
84
- zLoading = input(false, { ...(ngDevMode ? { debugName: "zLoading" } : {}), transform: zTransform });
85
- zAllowAttachments = input(true, { ...(ngDevMode ? { debugName: "zAllowAttachments" } : {}), transform: zTransform });
86
- zAcceptedFiles = input('image/*,.pdf,.doc,.docx,.txt,.csv,.xlsx', ...(ngDevMode ? [{ debugName: "zAcceptedFiles" }] : []));
87
- zAutoReply = input(true, { ...(ngDevMode ? { debugName: "zAutoReply" } : {}), transform: zTransform });
88
- zAutoReplyDelay = input(1200, ...(ngDevMode ? [{ debugName: "zAutoReplyDelay" }] : []));
89
- zFabIcon = input('lucideMessageSquareDot', ...(ngDevMode ? [{ debugName: "zFabIcon" }] : []));
90
- zBotIcon = input('lucideBot', ...(ngDevMode ? [{ debugName: "zBotIcon" }] : []));
91
- zSendIcon = input('lucideArrowUp', ...(ngDevMode ? [{ debugName: "zSendIcon" }] : []));
71
+ class = input('', /* @ts-ignore */
72
+ ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
73
+ zOpen = model(false, /* @ts-ignore */
74
+ ...(ngDevMode ? [{ debugName: "zOpen" }] : /* istanbul ignore next */ []));
75
+ zMessages = model([], /* @ts-ignore */
76
+ ...(ngDevMode ? [{ debugName: "zMessages" }] : /* istanbul ignore next */ []));
77
+ zTitle = input('i18n_z_ui_chat_ai_title', /* @ts-ignore */
78
+ ...(ngDevMode ? [{ debugName: "zTitle" }] : /* istanbul ignore next */ []));
79
+ zSubtitle = input('i18n_z_ui_chat_ai_subtitle', /* @ts-ignore */
80
+ ...(ngDevMode ? [{ debugName: "zSubtitle" }] : /* istanbul ignore next */ []));
81
+ zPlaceholder = input('i18n_z_ui_chat_ai_placeholder', /* @ts-ignore */
82
+ ...(ngDevMode ? [{ debugName: "zPlaceholder" }] : /* istanbul ignore next */ []));
83
+ zPosition = input('bottom-right', /* @ts-ignore */
84
+ ...(ngDevMode ? [{ debugName: "zPosition" }] : /* istanbul ignore next */ []));
85
+ zOffset = input({}, /* @ts-ignore */
86
+ ...(ngDevMode ? [{ debugName: "zOffset" }] : /* istanbul ignore next */ []));
87
+ zSize = input('default', /* @ts-ignore */
88
+ ...(ngDevMode ? [{ debugName: "zSize" }] : /* istanbul ignore next */ []));
89
+ zSuggestions = input(DEFAULT_SUGGESTIONS, /* @ts-ignore */
90
+ ...(ngDevMode ? [{ debugName: "zSuggestions" }] : /* istanbul ignore next */ []));
91
+ zShowSuggestions = input(true, { ...(ngDevMode ? { debugName: "zShowSuggestions" } : /* istanbul ignore next */ {}), transform: zTransform });
92
+ zShowPulse = input(true, { ...(ngDevMode ? { debugName: "zShowPulse" } : /* istanbul ignore next */ {}), transform: zTransform });
93
+ zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : /* istanbul ignore next */ {}), transform: zTransform });
94
+ zLoading = input(false, { ...(ngDevMode ? { debugName: "zLoading" } : /* istanbul ignore next */ {}), transform: zTransform });
95
+ zAllowAttachments = input(true, { ...(ngDevMode ? { debugName: "zAllowAttachments" } : /* istanbul ignore next */ {}), transform: zTransform });
96
+ zAcceptedFiles = input('image/*,.pdf,.doc,.docx,.txt,.csv,.xlsx', /* @ts-ignore */
97
+ ...(ngDevMode ? [{ debugName: "zAcceptedFiles" }] : /* istanbul ignore next */ []));
98
+ zAutoReply = input(true, { ...(ngDevMode ? { debugName: "zAutoReply" } : /* istanbul ignore next */ {}), transform: zTransform });
99
+ zAutoReplyDelay = input(1200, /* @ts-ignore */
100
+ ...(ngDevMode ? [{ debugName: "zAutoReplyDelay" }] : /* istanbul ignore next */ []));
101
+ zFabIcon = input('lucideMessageSquareDot', /* @ts-ignore */
102
+ ...(ngDevMode ? [{ debugName: "zFabIcon" }] : /* istanbul ignore next */ []));
103
+ zBotIcon = input('lucideBot', /* @ts-ignore */
104
+ ...(ngDevMode ? [{ debugName: "zBotIcon" }] : /* istanbul ignore next */ []));
105
+ zSendIcon = input('lucideArrowUp', /* @ts-ignore */
106
+ ...(ngDevMode ? [{ debugName: "zSendIcon" }] : /* istanbul ignore next */ []));
92
107
  zSend = output();
93
108
  zResponse = output();
94
109
  zToggle = output();
95
110
  zClear = output();
96
- draftMessage = signal('', ...(ngDevMode ? [{ debugName: "draftMessage" }] : []));
97
- showRipple = signal(false, ...(ngDevMode ? [{ debugName: "showRipple" }] : []));
98
- attachments = signal([], ...(ngDevMode ? [{ debugName: "attachments" }] : []));
99
- isComposerExpanded = signal(false, ...(ngDevMode ? [{ debugName: "isComposerExpanded" }] : []));
100
- isComposerOverflowing = signal(false, ...(ngDevMode ? [{ debugName: "isComposerOverflowing" }] : []));
101
- isPreviewVisible = signal(false, ...(ngDevMode ? [{ debugName: "isPreviewVisible" }] : []));
102
- previewImage = signal(null, ...(ngDevMode ? [{ debugName: "previewImage" }] : []));
103
- _mockTyping = signal(false, ...(ngDevMode ? [{ debugName: "_mockTyping" }] : []));
104
- _messagesScrollbarRef = viewChild('messagesScrollbar', ...(ngDevMode ? [{ debugName: "_messagesScrollbarRef" }] : []));
105
- _chatInputRef = viewChild('chatInput', ...(ngDevMode ? [{ debugName: "_chatInputRef" }] : []));
106
- _fileInputRef = viewChild('fileInput', ...(ngDevMode ? [{ debugName: "_fileInputRef" }] : []));
111
+ draftMessage = signal('', /* @ts-ignore */
112
+ ...(ngDevMode ? [{ debugName: "draftMessage" }] : /* istanbul ignore next */ []));
113
+ showRipple = signal(false, /* @ts-ignore */
114
+ ...(ngDevMode ? [{ debugName: "showRipple" }] : /* istanbul ignore next */ []));
115
+ attachments = signal([], /* @ts-ignore */
116
+ ...(ngDevMode ? [{ debugName: "attachments" }] : /* istanbul ignore next */ []));
117
+ isComposerExpanded = signal(false, /* @ts-ignore */
118
+ ...(ngDevMode ? [{ debugName: "isComposerExpanded" }] : /* istanbul ignore next */ []));
119
+ isComposerOverflowing = signal(false, /* @ts-ignore */
120
+ ...(ngDevMode ? [{ debugName: "isComposerOverflowing" }] : /* istanbul ignore next */ []));
121
+ isPreviewVisible = signal(false, /* @ts-ignore */
122
+ ...(ngDevMode ? [{ debugName: "isPreviewVisible" }] : /* istanbul ignore next */ []));
123
+ previewImage = signal(null, /* @ts-ignore */
124
+ ...(ngDevMode ? [{ debugName: "previewImage" }] : /* istanbul ignore next */ []));
125
+ _mockTyping = signal(false, /* @ts-ignore */
126
+ ...(ngDevMode ? [{ debugName: "_mockTyping" }] : /* istanbul ignore next */ []));
127
+ _messagesScrollbarRef = viewChild('messagesScrollbar', /* @ts-ignore */
128
+ ...(ngDevMode ? [{ debugName: "_messagesScrollbarRef" }] : /* istanbul ignore next */ []));
129
+ _chatInputRef = viewChild('chatInput', /* @ts-ignore */
130
+ ...(ngDevMode ? [{ debugName: "_chatInputRef" }] : /* istanbul ignore next */ []));
131
+ _fileInputRef = viewChild('fileInput', /* @ts-ignore */
132
+ ...(ngDevMode ? [{ debugName: "_fileInputRef" }] : /* istanbul ignore next */ []));
107
133
  _mockReplyTimer = null;
108
134
  _rippleTimer = null;
109
135
  _scrollTimer = null;
110
- wrapperClasses = computed(() => zMergeClasses(zChatWrapperVariants({ zPosition: this.zPosition() }), this.class()), ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : []));
111
- wrapperTop = computed(() => this._resolveOffsetValue('top'), ...(ngDevMode ? [{ debugName: "wrapperTop" }] : []));
112
- wrapperRight = computed(() => this._resolveOffsetValue('right'), ...(ngDevMode ? [{ debugName: "wrapperRight" }] : []));
113
- wrapperBottom = computed(() => this._resolveOffsetValue('bottom'), ...(ngDevMode ? [{ debugName: "wrapperBottom" }] : []));
114
- wrapperLeft = computed(() => this._resolveOffsetValue('left'), ...(ngDevMode ? [{ debugName: "wrapperLeft" }] : []));
136
+ wrapperClasses = computed(() => zMergeClasses(zChatWrapperVariants({ zPosition: this.zPosition() }), this.class()), /* @ts-ignore */
137
+ ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : /* istanbul ignore next */ []));
138
+ wrapperTop = computed(() => this._resolveOffsetValue('top'), /* @ts-ignore */
139
+ ...(ngDevMode ? [{ debugName: "wrapperTop" }] : /* istanbul ignore next */ []));
140
+ wrapperRight = computed(() => this._resolveOffsetValue('right'), /* @ts-ignore */
141
+ ...(ngDevMode ? [{ debugName: "wrapperRight" }] : /* istanbul ignore next */ []));
142
+ wrapperBottom = computed(() => this._resolveOffsetValue('bottom'), /* @ts-ignore */
143
+ ...(ngDevMode ? [{ debugName: "wrapperBottom" }] : /* istanbul ignore next */ []));
144
+ wrapperLeft = computed(() => this._resolveOffsetValue('left'), /* @ts-ignore */
145
+ ...(ngDevMode ? [{ debugName: "wrapperLeft" }] : /* istanbul ignore next */ []));
115
146
  panelClasses = computed(() => zChatPanelVariants({
116
147
  zPosition: this.zPosition(),
117
148
  zSize: this.zSize(),
118
149
  zOpen: this.zOpen(),
119
- }), ...(ngDevMode ? [{ debugName: "panelClasses" }] : []));
150
+ }), /* @ts-ignore */
151
+ ...(ngDevMode ? [{ debugName: "panelClasses" }] : /* istanbul ignore next */ []));
120
152
  fabClasses = computed(() => zChatFabVariants({
121
153
  zOpen: this.zOpen(),
122
- }), ...(ngDevMode ? [{ debugName: "fabClasses" }] : []));
123
- isTyping = computed(() => this.zLoading() || this._mockTyping(), ...(ngDevMode ? [{ debugName: "isTyping" }] : []));
124
- canSend = computed(() => (!!this.draftMessage().trim() || this.attachments().length > 0) && !this.zDisabled() && !this.isTyping(), ...(ngDevMode ? [{ debugName: "canSend" }] : []));
125
- hasMessages = computed(() => this.zMessages().length > 0, ...(ngDevMode ? [{ debugName: "hasMessages" }] : []));
126
- showEmptyState = computed(() => !this.hasMessages() && this.zShowSuggestions(), ...(ngDevMode ? [{ debugName: "showEmptyState" }] : []));
154
+ }), /* @ts-ignore */
155
+ ...(ngDevMode ? [{ debugName: "fabClasses" }] : /* istanbul ignore next */ []));
156
+ isTyping = computed(() => this.zLoading() || this._mockTyping(), /* @ts-ignore */
157
+ ...(ngDevMode ? [{ debugName: "isTyping" }] : /* istanbul ignore next */ []));
158
+ canSend = computed(() => (!!this.draftMessage().trim() || this.attachments().length > 0) && !this.zDisabled() && !this.isTyping(), /* @ts-ignore */
159
+ ...(ngDevMode ? [{ debugName: "canSend" }] : /* istanbul ignore next */ []));
160
+ hasMessages = computed(() => this.zMessages().length > 0, /* @ts-ignore */
161
+ ...(ngDevMode ? [{ debugName: "hasMessages" }] : /* istanbul ignore next */ []));
162
+ showEmptyState = computed(() => !this.hasMessages() && this.zShowSuggestions(), /* @ts-ignore */
163
+ ...(ngDevMode ? [{ debugName: "showEmptyState" }] : /* istanbul ignore next */ []));
127
164
  previewImageSizeLabel = computed(() => {
128
165
  const preview = this.previewImage();
129
166
  return preview ? this.formatFileSize(preview.size) : '';
130
- }, ...(ngDevMode ? [{ debugName: "previewImageSizeLabel" }] : []));
167
+ }, /* @ts-ignore */
168
+ ...(ngDevMode ? [{ debugName: "previewImageSizeLabel" }] : /* istanbul ignore next */ []));
131
169
  ngOnDestroy() {
132
170
  if (this._mockReplyTimer) {
133
171
  clearTimeout(this._mockReplyTimer);
@@ -421,10 +459,10 @@ class ZChatComponent {
421
459
  : { top: null, right: '1.5rem', bottom: '1.25rem', left: null };
422
460
  return defaults[side];
423
461
  }
424
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
425
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZChatComponent, isStandalone: true, selector: "z-chat", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zOpen: { classPropertyName: "zOpen", publicName: "zOpen", isSignal: true, isRequired: false, transformFunction: null }, zMessages: { classPropertyName: "zMessages", publicName: "zMessages", isSignal: true, isRequired: false, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: false, transformFunction: null }, zSubtitle: { classPropertyName: "zSubtitle", publicName: "zSubtitle", isSignal: true, isRequired: false, transformFunction: null }, zPlaceholder: { classPropertyName: "zPlaceholder", publicName: "zPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zPosition: { classPropertyName: "zPosition", publicName: "zPosition", isSignal: true, isRequired: false, transformFunction: null }, zOffset: { classPropertyName: "zOffset", publicName: "zOffset", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zSuggestions: { classPropertyName: "zSuggestions", publicName: "zSuggestions", isSignal: true, isRequired: false, transformFunction: null }, zShowSuggestions: { classPropertyName: "zShowSuggestions", publicName: "zShowSuggestions", isSignal: true, isRequired: false, transformFunction: null }, zShowPulse: { classPropertyName: "zShowPulse", publicName: "zShowPulse", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zLoading: { classPropertyName: "zLoading", publicName: "zLoading", isSignal: true, isRequired: false, transformFunction: null }, zAllowAttachments: { classPropertyName: "zAllowAttachments", publicName: "zAllowAttachments", isSignal: true, isRequired: false, transformFunction: null }, zAcceptedFiles: { classPropertyName: "zAcceptedFiles", publicName: "zAcceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, zAutoReply: { classPropertyName: "zAutoReply", publicName: "zAutoReply", isSignal: true, isRequired: false, transformFunction: null }, zAutoReplyDelay: { classPropertyName: "zAutoReplyDelay", publicName: "zAutoReplyDelay", isSignal: true, isRequired: false, transformFunction: null }, zFabIcon: { classPropertyName: "zFabIcon", publicName: "zFabIcon", isSignal: true, isRequired: false, transformFunction: null }, zBotIcon: { classPropertyName: "zBotIcon", publicName: "zBotIcon", isSignal: true, isRequired: false, transformFunction: null }, zSendIcon: { classPropertyName: "zSendIcon", publicName: "zSendIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOpen: "zOpenChange", zMessages: "zMessagesChange", zSend: "zSend", zResponse: "zResponse", zToggle: "zToggle", zClear: "zClear" }, host: { listeners: { "document:keydown.escape": "onEscapeKey()" }, classAttribute: "z-chat block" }, viewQueries: [{ propertyName: "_messagesScrollbarRef", first: true, predicate: ["messagesScrollbar"], descendants: true, isSignal: true }, { propertyName: "_chatInputRef", first: true, predicate: ["chatInput"], descendants: true, isSignal: true }, { propertyName: "_fileInputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], exportAs: ["zChat"], ngImport: i0, template: "<div\n [class]=\"wrapperClasses()\"\n [style.top]=\"wrapperTop()\"\n [style.right]=\"wrapperRight()\"\n [style.bottom]=\"wrapperBottom()\"\n [style.left]=\"wrapperLeft()\">\n <div class=\"relative\">\n <section class=\"z-chat-panel-shell\" [class]=\"panelClasses()\">\n <header class=\"from-primary/95 to-primary/75 text-primary-foreground bg-gradient-to-r px-4 py-3.5\">\n <div class=\"flex items-start justify-between gap-3\">\n <div class=\"min-w-0\">\n <div class=\"flex items-center gap-2\">\n <span\n class=\"bg-primary-foreground/15 relative inline-flex size-8 shrink-0 items-center justify-center rounded-full\">\n <z-icon [zType]=\"zBotIcon()\" zSize=\"16\" class=\"text-primary-foreground\" />\n <span\n class=\"ring-primary inline-block size-2.5 rounded-full bg-emerald-300 ring-2\"\n style=\"position: absolute; right: -0.0625rem; bottom: -0.0625rem\"></span>\n </span>\n <h3 class=\"truncate text-sm font-semibold\">{{ zTitle() | translate }}</h3>\n </div>\n </div>\n <div class=\"flex items-center gap-1\">\n <button\n type=\"button\"\n class=\"text-primary-foreground/90 hover:bg-primary-foreground/15 inline-flex size-8 cursor-pointer items-center justify-center rounded-md transition\"\n (click)=\"clearMessages()\"\n title=\"{{ 'i18n_z_ui_chat_ai_new_chat' | translate }}\">\n <z-icon zType=\"lucideRefreshCcw\" zSize=\"17\" />\n </button>\n <button\n type=\"button\"\n class=\"text-primary-foreground/90 hover:bg-primary-foreground/15 inline-flex size-8 cursor-pointer items-center justify-center rounded-md transition\"\n (click)=\"close()\"\n title=\"{{ 'i18n_z_ui_chat_ai_close' | translate }}\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"18\" />\n </button>\n </div>\n </div>\n </header>\n\n <div class=\"z-chat-lower-shell\">\n <ng-scrollbar\n #messagesScrollbar\n (afterInit)=\"onMessagesScrollbarInit()\"\n class=\"z-chat-scrollbar z-chat-content-surface flex-1 overflow-x-hidden\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <div class=\"z-chat-messages\">\n @if (hasMessages()) {\n @for (item of zMessages(); track item.id) {\n <div\n class=\"z-chat-message z-chat-message--enter\"\n [class.justify-end]=\"item.role === 'user'\"\n [class.justify-start]=\"item.role === 'assistant'\">\n <div\n class=\"z-chat-message-bubble max-w-[88%] min-w-0 rounded-2xl px-3 py-2.5 text-sm leading-5 [overflow-wrap:anywhere] break-all shadow-xs\"\n [class.bg-primary]=\"item.role === 'user'\"\n [class.text-primary-foreground]=\"item.role === 'user'\"\n [class.rounded-br-md]=\"item.role === 'user'\"\n [class.bg-background]=\"item.role === 'assistant'\"\n [class.border-border/60]=\"item.role === 'assistant'\"\n [class.text-foreground]=\"item.role === 'assistant'\"\n [class.rounded-bl-md]=\"item.role === 'assistant'\"\n [class.border]=\"item.role === 'assistant'\">\n @if (item.files && item.files.length > 0) {\n <div class=\"mb-2 flex flex-col gap-1.5\">\n @for (file of item.files; track file.id) {\n <div\n class=\"flex items-center gap-2 rounded-[0.5rem] px-2 py-1.5 text-xs\"\n [class.bg-white/15]=\"item.role === 'user'\"\n [class.bg-muted/40]=\"item.role === 'assistant'\">\n @if (isImageAttachment(file) && file.previewUrl) {\n <img\n [src]=\"file.previewUrl\"\n [alt]=\"file.name\"\n class=\"size-8 cursor-pointer rounded-[0.5rem] object-cover\"\n (click)=\"openImagePreview(file)\"\n title=\"Click to preview\" />\n } @else {\n <span\n class=\"bg-background/80 text-muted-foreground inline-flex size-8 items-center justify-center rounded-[0.5rem]\"\n [class.bg-white/20]=\"item.role === 'user'\"\n [class.text-white]=\"item.role === 'user'\">\n <z-icon zType=\"lucideFileText\" zSize=\"14\" />\n </span>\n }\n <div class=\"min-w-0 flex-1\">\n <p class=\"truncate text-[0.6875rem] font-medium\">{{ file.name }}</p>\n <p class=\"truncate text-[0.625rem] opacity-80\">{{ formatFileSize(file.size) }}</p>\n </div>\n </div>\n }\n </div>\n }\n {{ item.content }}\n </div>\n </div>\n }\n } @else if (showEmptyState()) {\n <div class=\"flex h-full min-h-60 flex-col items-center justify-center px-2 text-center\">\n <div\n class=\"from-primary/20 to-primary/5 mb-3 inline-flex size-14 items-center justify-center rounded-full bg-gradient-to-br\">\n <z-icon zType=\"lucideBot\" zSize=\"28\" class=\"text-primary\" />\n </div>\n <h4 class=\"text-foreground text-sm font-semibold\">{{ 'i18n_z_ui_chat_ai_empty_title' | translate }}</h4>\n <p class=\"text-muted-foreground mt-1 text-xs\">{{ 'i18n_z_ui_chat_ai_empty_desc' | translate }}</p>\n\n @if (zSuggestions().length > 0) {\n <div class=\"mt-4 flex w-full flex-col gap-2\">\n @for (item of zSuggestions(); track item.label) {\n <button\n type=\"button\"\n class=\"z-chat-suggestion-item bg-background/95 hover:bg-background border-border/60 text-foreground flex w-full cursor-pointer items-center gap-2 rounded-xl border px-3 py-2 text-left text-xs transition hover:shadow-sm\"\n [style.animation-delay.ms]=\"$index * 70\"\n (click)=\"onSuggestionSelect(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon!\" zSize=\"14\" class=\"text-primary shrink-0\" />\n }\n <span class=\"line-clamp-2\">{{ item.label | translate }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n\n @if (isTyping()) {\n <div class=\"z-chat-message z-chat-message--enter justify-start\">\n <div class=\"bg-background border-border/60 rounded-2xl rounded-bl-md border px-3 py-2\">\n <div class=\"flex items-center gap-1\">\n <span class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"></span>\n <span\n class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"\n style=\"animation-delay: 0.15s\"></span>\n <span\n class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"\n style=\"animation-delay: 0.3s\"></span>\n </div>\n </div>\n </div>\n }\n </div>\n </ng-scrollbar>\n\n <footer class=\"z-chat-footer-surface p-3\">\n @if (attachments().length > 0) {\n <div class=\"mb-2 flex max-h-32 flex-col gap-2 overflow-y-auto pr-1\">\n @for (file of attachments(); track file.id) {\n <div\n class=\"bg-muted/45 border-border/55 relative flex w-full items-center gap-2 rounded-[0.5rem] border px-2 py-1.5\">\n @if (isImageAttachment(file) && file.previewUrl) {\n <img\n [src]=\"file.previewUrl\"\n [alt]=\"file.name\"\n class=\"size-8 shrink-0 cursor-pointer rounded-[0.5rem] object-cover\"\n (click)=\"openImagePreview(file)\"\n title=\"Click to preview\" />\n } @else {\n <span\n class=\"bg-background text-muted-foreground inline-flex size-8 shrink-0 items-center justify-center rounded-[0.5rem]\">\n <z-icon zType=\"lucideFileText\" zSize=\"14\" />\n </span>\n }\n <div class=\"min-w-0 flex-1\">\n <p class=\"truncate text-[0.6875rem] font-medium\">{{ file.name }}</p>\n <p class=\"text-muted-foreground truncate text-[0.625rem]\">{{ formatFileSize(file.size) }}</p>\n </div>\n <button\n type=\"button\"\n class=\"bg-background/80 hover:bg-background text-muted-foreground inline-flex size-5 cursor-pointer items-center justify-center rounded-full transition\"\n (click)=\"removeAttachment(file.id)\">\n <z-icon zType=\"lucideX\" zSize=\"12\" />\n </button>\n </div>\n }\n </div>\n }\n\n <div class=\"z-chat-composer-shell\">\n <div class=\"z-chat-composer-main\" [class.z-chat-composer__field--overflow]=\"isComposerOverflowing()\">\n <textarea\n #chatInput\n class=\"z-chat-composer-textarea\"\n [placeholder]=\"zPlaceholder() | translate\"\n [disabled]=\"zDisabled()\"\n [ngModel]=\"draftMessage()\"\n (ngModelChange)=\"draftMessage.set($event)\"\n (input)=\"onTextareaInput($event)\"\n (paste)=\"onTextareaPaste($event)\"\n (keydown)=\"onInputKeydown($event)\"\n rows=\"3\"></textarea>\n </div>\n\n <div class=\"z-chat-composer-toolbar\">\n <div class=\"z-chat-composer-toolbar-left\">\n @if (zAllowAttachments()) {\n <input\n #fileInput\n type=\"file\"\n class=\"hidden\"\n [attr.accept]=\"zAcceptedFiles()\"\n multiple\n (change)=\"onFileChange($event)\" />\n <button\n type=\"button\"\n class=\"z-chat-composer-tool-btn\"\n [disabled]=\"zDisabled()\"\n (click)=\"onClickAttach()\"\n title=\"{{ 'i18n_z_ui_chat_ai_attach' | translate }}\">\n <z-icon zType=\"lucidePlus\" zSize=\"18\" />\n </button>\n }\n </div>\n\n <div class=\"z-chat-composer-toolbar-right\">\n <button\n type=\"button\"\n class=\"z-chat-composer-send-btn\"\n [disabled]=\"!canSend()\"\n (click)=\"onSendMessage()\"\n title=\"{{ 'i18n_z_ui_chat_ai_send' | translate }}\">\n <z-icon\n [zType]=\"isTyping() ? 'lucideLoaderCircle' : zSendIcon()\"\n zSize=\"16\"\n [class]=\"isTyping() ? 'animate-spin' : ''\" />\n </button>\n </div>\n </div>\n </div>\n </footer>\n </div>\n\n <z-modal\n [zVisible]=\"isPreviewVisible()\"\n [zTitle]=\"previewImage()?.name\"\n [zDescription]=\"previewImageSizeLabel()\"\n zWidth=\"min(92vw, 720px)\"\n [zHideFooter]=\"true\"\n [zMaskClosable]=\"true\"\n zOverlay=\"blur\"\n (zCancel)=\"closeImagePreview()\">\n <div class=\"z-chat-preview-modal-body\">\n <img [src]=\"previewImage()?.url\" [alt]=\"previewImage()?.name\" class=\"z-chat-preview-image\" />\n </div>\n </z-modal>\n </section>\n\n <button\n type=\"button\"\n class=\"pointer-events-auto cursor-pointer\"\n [class]=\"fabClasses()\"\n (click)=\"onToggle()\"\n [attr.aria-expanded]=\"zOpen()\"\n [attr.aria-label]=\"'i18n_z_ui_chat_ai_toggle' | translate\"\n title=\"{{ 'i18n_z_ui_chat_ai_toggle' | translate }}\">\n @if (zShowPulse() && !zOpen()) {\n <span class=\"bg-primary/30 absolute inset-0 animate-ping rounded-full\"></span>\n }\n\n @if (showRipple()) {\n <span class=\"bg-primary-foreground/30 absolute inset-0 animate-ping rounded-full\"></span>\n }\n\n <z-icon\n [zType]=\"zOpen() ? 'lucideX' : zFabIcon()\"\n zSize=\"24\"\n class=\"relative z-1 transition-transform duration-200\"\n [class.rotate-180]=\"zOpen()\" />\n </button>\n </div>\n</div>\n", styles: [".z-chat textarea{scrollbar-width:thin}.z-chat-panel-shell{box-shadow:0 0 28px #00000024!important}:is(.dark,[data-theme=dark]) .z-chat-panel-shell{box-shadow:0 0 28px #00000057!important}.z-chat-composer__field--overflow:after{position:absolute;right:0;bottom:0;left:0;height:1rem;pointer-events:none;content:\"\";background:linear-gradient(to top,var(--background) 22%,transparent)}.z-chat-composer-shell{position:relative;display:flex;width:100%;flex-direction:column;border:1px solid color-mix(in oklab,var(--border) 82%,transparent);border-radius:1rem;background:linear-gradient(180deg,color-mix(in oklab,var(--card) 98%,var(--background) 2%),color-mix(in oklab,var(--card) 92%,var(--background) 8%));box-shadow:0 6px 18px #00000014;transition:box-shadow .2s ease}.z-chat-composer-shell:focus-within{box-shadow:0 6px 18px #00000014}:is(.dark,[data-theme=dark]) .z-chat-composer-shell{border-color:var(--border);background:linear-gradient(180deg,color-mix(in oklab,var(--card) 96%,var(--background) 4%),color-mix(in oklab,var(--card) 88%,var(--background) 12%));box-shadow:0 10px 24px #00000057}.z-chat-composer-main{position:relative;overflow:hidden;padding:.7rem .35rem .45rem .85rem}.z-chat-composer-textarea{width:100%;height:4.125rem;max-height:4.125rem;border:none;background:transparent;resize:none;overflow-x:hidden;font-size:.875rem;line-height:1.4rem;color:var(--foreground);outline:none;padding-right:.2rem;scrollbar-width:thin;overflow-wrap:anywhere;word-break:break-word}.z-chat-composer-textarea::placeholder{color:var(--muted-foreground)}.z-chat-composer-textarea::-webkit-scrollbar{width:.375rem}.z-chat-composer-textarea::-webkit-scrollbar-track{background:transparent}.z-chat-composer-textarea::-webkit-scrollbar-thumb{border-radius:62.4375rem;background:#64748b73}:is(.dark,[data-theme=dark]) .z-chat-composer-textarea::-webkit-scrollbar-thumb{background:#94a3b88c}.z-chat-composer-toolbar{display:flex;align-items:center;justify-content:space-between;border-top:.0625rem solid rgba(219,219,219,.6);padding:.55rem .7rem .65rem}:is(.dark,[data-theme=dark]) .z-chat-composer-toolbar{border-top-color:#00000038}.z-chat-composer-toolbar-left,.z-chat-composer-toolbar-right{display:flex;align-items:center}.z-chat-composer-tool-btn{display:inline-flex;height:1.75rem;width:1.75rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.6rem;border:none;background:transparent;color:#374151;transition:background-color .2s ease}.z-chat-composer-tool-btn:hover{background:#0000000f}:is(.dark,[data-theme=dark]) .z-chat-composer-tool-btn{color:#e5e7ebe6}:is(.dark,[data-theme=dark]) .z-chat-composer-tool-btn:hover{background:#ffffff1a}.z-chat-composer-tool-btn:disabled{cursor:not-allowed;opacity:.5}.z-chat-composer-send-btn{display:inline-flex;height:2rem;width:2rem;cursor:pointer;align-items:center;justify-content:center;border-radius:62.4375rem;border:1px solid rgba(0,0,0,.1);background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 8px #0000002e,inset 0 1px #ffffff2e;transition:transform .15s ease,opacity .2s ease,box-shadow .2s ease}.z-chat-composer-send-btn:hover{transform:translateY(-.0625rem);box-shadow:0 4px 12px #00000038,inset 0 1px #ffffff38}.z-chat-composer-send-btn:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}.z-chat-scrollbar{contain:layout}.z-chat-content-surface{background:var(--card)}.z-chat-lower-shell{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;background:var(--card);color:var(--card-foreground);border:1px solid transparent;border-top:0;border-bottom-right-radius:1rem;border-bottom-left-radius:1rem}:is(.dark,[data-theme=dark]) .z-chat-lower-shell{border-color:var(--border);border-top:0}.z-chat-footer-surface{background:transparent;border-top:.0625rem solid color-mix(in oklab,var(--border) 70%,transparent)}:is(.dark,[data-theme=dark]) .z-chat-footer-surface{background:transparent;border-top-color:var(--border)}.z-chat-messages{min-height:100%;overflow-x:hidden;padding:.875rem .75rem;contain:content}.z-chat-message{display:flex;margin:.5rem 0;padding:0 2px;transform-origin:bottom center;contain:layout style}.z-chat-message-bubble{transform:translateZ(0);backface-visibility:hidden}.z-chat-message--enter{animation:z-chat-message-push-in .3s ease-out;will-change:transform,opacity}.z-chat-suggestion-item{animation:z-chat-suggestion-reveal .28s ease-out both;will-change:transform,opacity}.z-chat-preview-modal-body{display:flex;align-items:center;justify-content:center;max-height:min(70vh,40rem);padding:.25rem}.z-chat-preview-image{max-width:100%;max-height:min(66vh,37.5rem);border-radius:.5rem;object-fit:contain}@keyframes z-chat-message-push-in{0%{opacity:0;transform:translateY(.9375rem) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes z-chat-suggestion-reveal{0%{opacity:0;transform:translateY(.5rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: ZModalComponent, selector: "z-modal", inputs: ["class", "zBodyClass", "zVisible", "zTitle", "zDescription", "zWidth", "zClosable", "zMaskClosable", "zDisableShadow", "zHeaderBorder", "zFooterBorder", "zHideHeader", "zHideFooter", "zOkText", "zCancelText", "zOkDestructive", "zOkDisabled", "zLoading", "zContentLoading", "zSkeletonRows", "zOverlay"], outputs: ["zOk", "zCancel", "zAfterClose", "zScrollbar", "zVisibleChange"], exportAs: ["zModal"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
462
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
463
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: ZChatComponent, isStandalone: true, selector: "z-chat", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zOpen: { classPropertyName: "zOpen", publicName: "zOpen", isSignal: true, isRequired: false, transformFunction: null }, zMessages: { classPropertyName: "zMessages", publicName: "zMessages", isSignal: true, isRequired: false, transformFunction: null }, zTitle: { classPropertyName: "zTitle", publicName: "zTitle", isSignal: true, isRequired: false, transformFunction: null }, zSubtitle: { classPropertyName: "zSubtitle", publicName: "zSubtitle", isSignal: true, isRequired: false, transformFunction: null }, zPlaceholder: { classPropertyName: "zPlaceholder", publicName: "zPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zPosition: { classPropertyName: "zPosition", publicName: "zPosition", isSignal: true, isRequired: false, transformFunction: null }, zOffset: { classPropertyName: "zOffset", publicName: "zOffset", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zSuggestions: { classPropertyName: "zSuggestions", publicName: "zSuggestions", isSignal: true, isRequired: false, transformFunction: null }, zShowSuggestions: { classPropertyName: "zShowSuggestions", publicName: "zShowSuggestions", isSignal: true, isRequired: false, transformFunction: null }, zShowPulse: { classPropertyName: "zShowPulse", publicName: "zShowPulse", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zLoading: { classPropertyName: "zLoading", publicName: "zLoading", isSignal: true, isRequired: false, transformFunction: null }, zAllowAttachments: { classPropertyName: "zAllowAttachments", publicName: "zAllowAttachments", isSignal: true, isRequired: false, transformFunction: null }, zAcceptedFiles: { classPropertyName: "zAcceptedFiles", publicName: "zAcceptedFiles", isSignal: true, isRequired: false, transformFunction: null }, zAutoReply: { classPropertyName: "zAutoReply", publicName: "zAutoReply", isSignal: true, isRequired: false, transformFunction: null }, zAutoReplyDelay: { classPropertyName: "zAutoReplyDelay", publicName: "zAutoReplyDelay", isSignal: true, isRequired: false, transformFunction: null }, zFabIcon: { classPropertyName: "zFabIcon", publicName: "zFabIcon", isSignal: true, isRequired: false, transformFunction: null }, zBotIcon: { classPropertyName: "zBotIcon", publicName: "zBotIcon", isSignal: true, isRequired: false, transformFunction: null }, zSendIcon: { classPropertyName: "zSendIcon", publicName: "zSendIcon", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOpen: "zOpenChange", zMessages: "zMessagesChange", zSend: "zSend", zResponse: "zResponse", zToggle: "zToggle", zClear: "zClear" }, host: { listeners: { "document:keydown.escape": "onEscapeKey()" }, classAttribute: "z-chat block" }, viewQueries: [{ propertyName: "_messagesScrollbarRef", first: true, predicate: ["messagesScrollbar"], descendants: true, isSignal: true }, { propertyName: "_chatInputRef", first: true, predicate: ["chatInput"], descendants: true, isSignal: true }, { propertyName: "_fileInputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], exportAs: ["zChat"], ngImport: i0, template: "<div\n [class]=\"wrapperClasses()\"\n [style.top]=\"wrapperTop()\"\n [style.right]=\"wrapperRight()\"\n [style.bottom]=\"wrapperBottom()\"\n [style.left]=\"wrapperLeft()\">\n <div class=\"relative\">\n <section class=\"z-chat-panel-shell\" [class]=\"panelClasses()\">\n <header class=\"from-primary/95 to-primary/75 text-primary-foreground bg-gradient-to-r px-4 py-3.5\">\n <div class=\"flex items-start justify-between gap-3\">\n <div class=\"min-w-0\">\n <div class=\"flex items-center gap-2\">\n <span\n class=\"bg-primary-foreground/15 relative inline-flex size-8 shrink-0 items-center justify-center rounded-full\">\n <z-icon [zType]=\"zBotIcon()\" zSize=\"16\" class=\"text-primary-foreground\" />\n <span\n class=\"ring-primary inline-block size-2.5 rounded-full bg-emerald-300 ring-2\"\n style=\"position: absolute; right: -0.0625rem; bottom: -0.0625rem\"></span>\n </span>\n <h3 class=\"truncate text-sm font-semibold\">{{ zTitle() | translate }}</h3>\n </div>\n </div>\n <div class=\"flex items-center gap-1\">\n <button\n type=\"button\"\n class=\"text-primary-foreground/90 hover:bg-primary-foreground/15 inline-flex size-8 cursor-pointer items-center justify-center rounded-md transition\"\n (click)=\"clearMessages()\"\n title=\"{{ 'i18n_z_ui_chat_ai_new_chat' | translate }}\">\n <z-icon zType=\"lucideRefreshCcw\" zSize=\"17\" />\n </button>\n <button\n type=\"button\"\n class=\"text-primary-foreground/90 hover:bg-primary-foreground/15 inline-flex size-8 cursor-pointer items-center justify-center rounded-md transition\"\n (click)=\"close()\"\n title=\"{{ 'i18n_z_ui_chat_ai_close' | translate }}\">\n <z-icon zType=\"lucideChevronDown\" zSize=\"18\" />\n </button>\n </div>\n </div>\n </header>\n\n <div class=\"z-chat-lower-shell\">\n <ng-scrollbar\n #messagesScrollbar\n (afterInit)=\"onMessagesScrollbarInit()\"\n class=\"z-chat-scrollbar z-chat-content-surface flex-1 overflow-x-hidden\"\n track=\"vertical\"\n orientation=\"vertical\"\n appearance=\"compact\"\n visibility=\"hover\">\n <div class=\"z-chat-messages\">\n @if (hasMessages()) {\n @for (item of zMessages(); track item.id) {\n <div\n class=\"z-chat-message z-chat-message--enter\"\n [class.justify-end]=\"item.role === 'user'\"\n [class.justify-start]=\"item.role === 'assistant'\">\n <div\n class=\"z-chat-message-bubble max-w-[88%] min-w-0 rounded-2xl px-3 py-2.5 text-sm leading-5 [overflow-wrap:anywhere] break-all shadow-xs\"\n [class.bg-primary]=\"item.role === 'user'\"\n [class.text-primary-foreground]=\"item.role === 'user'\"\n [class.rounded-br-md]=\"item.role === 'user'\"\n [class.bg-background]=\"item.role === 'assistant'\"\n [class.border-border/60]=\"item.role === 'assistant'\"\n [class.text-foreground]=\"item.role === 'assistant'\"\n [class.rounded-bl-md]=\"item.role === 'assistant'\"\n [class.border]=\"item.role === 'assistant'\">\n @if (item.files && item.files.length > 0) {\n <div class=\"mb-2 flex flex-col gap-1.5\">\n @for (file of item.files; track file.id) {\n <div\n class=\"flex items-center gap-2 rounded-[0.5rem] px-2 py-1.5 text-xs\"\n [class.bg-white/15]=\"item.role === 'user'\"\n [class.bg-muted/40]=\"item.role === 'assistant'\">\n @if (isImageAttachment(file) && file.previewUrl) {\n <img\n [src]=\"file.previewUrl\"\n [alt]=\"file.name\"\n class=\"size-8 cursor-pointer rounded-[0.5rem] object-cover\"\n (click)=\"openImagePreview(file)\"\n title=\"Click to preview\" />\n } @else {\n <span\n class=\"bg-background/80 text-muted-foreground inline-flex size-8 items-center justify-center rounded-[0.5rem]\"\n [class.bg-white/20]=\"item.role === 'user'\"\n [class.text-white]=\"item.role === 'user'\">\n <z-icon zType=\"lucideFileText\" zSize=\"14\" />\n </span>\n }\n <div class=\"min-w-0 flex-1\">\n <p class=\"truncate text-[0.6875rem] font-medium\">{{ file.name }}</p>\n <p class=\"truncate text-[0.625rem] opacity-80\">{{ formatFileSize(file.size) }}</p>\n </div>\n </div>\n }\n </div>\n }\n {{ item.content }}\n </div>\n </div>\n }\n } @else if (showEmptyState()) {\n <div class=\"flex h-full min-h-60 flex-col items-center justify-center px-2 text-center\">\n <div\n class=\"from-primary/20 to-primary/5 mb-3 inline-flex size-14 items-center justify-center rounded-full bg-gradient-to-br\">\n <z-icon zType=\"lucideBot\" zSize=\"28\" class=\"text-primary\" />\n </div>\n <h4 class=\"text-foreground text-sm font-semibold\">{{ 'i18n_z_ui_chat_ai_empty_title' | translate }}</h4>\n <p class=\"text-muted-foreground mt-1 text-xs\">{{ 'i18n_z_ui_chat_ai_empty_desc' | translate }}</p>\n\n @if (zSuggestions().length > 0) {\n <div class=\"mt-4 flex w-full flex-col gap-2\">\n @for (item of zSuggestions(); track item.label) {\n <button\n type=\"button\"\n class=\"z-chat-suggestion-item bg-background/95 hover:bg-background border-border/60 text-foreground flex w-full cursor-pointer items-center gap-2 rounded-xl border px-3 py-2 text-left text-xs transition hover:shadow-sm\"\n [style.animation-delay.ms]=\"$index * 70\"\n (click)=\"onSuggestionSelect(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon!\" zSize=\"14\" class=\"text-primary shrink-0\" />\n }\n <span class=\"line-clamp-2\">{{ item.label | translate }}</span>\n </button>\n }\n </div>\n }\n </div>\n }\n\n @if (isTyping()) {\n <div class=\"z-chat-message z-chat-message--enter justify-start\">\n <div class=\"bg-background border-border/60 rounded-2xl rounded-bl-md border px-3 py-2\">\n <div class=\"flex items-center gap-1\">\n <span class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"></span>\n <span\n class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"\n style=\"animation-delay: 0.15s\"></span>\n <span\n class=\"bg-muted-foreground/60 inline-block size-1.5 animate-bounce rounded-full\"\n style=\"animation-delay: 0.3s\"></span>\n </div>\n </div>\n </div>\n }\n </div>\n </ng-scrollbar>\n\n <footer class=\"z-chat-footer-surface p-3\">\n @if (attachments().length > 0) {\n <div class=\"mb-2 flex max-h-32 flex-col gap-2 overflow-y-auto pr-1\">\n @for (file of attachments(); track file.id) {\n <div\n class=\"bg-muted/45 border-border/55 relative flex w-full items-center gap-2 rounded-[0.5rem] border px-2 py-1.5\">\n @if (isImageAttachment(file) && file.previewUrl) {\n <img\n [src]=\"file.previewUrl\"\n [alt]=\"file.name\"\n class=\"size-8 shrink-0 cursor-pointer rounded-[0.5rem] object-cover\"\n (click)=\"openImagePreview(file)\"\n title=\"Click to preview\" />\n } @else {\n <span\n class=\"bg-background text-muted-foreground inline-flex size-8 shrink-0 items-center justify-center rounded-[0.5rem]\">\n <z-icon zType=\"lucideFileText\" zSize=\"14\" />\n </span>\n }\n <div class=\"min-w-0 flex-1\">\n <p class=\"truncate text-[0.6875rem] font-medium\">{{ file.name }}</p>\n <p class=\"text-muted-foreground truncate text-[0.625rem]\">{{ formatFileSize(file.size) }}</p>\n </div>\n <button\n type=\"button\"\n class=\"bg-background/80 hover:bg-background text-muted-foreground inline-flex size-5 cursor-pointer items-center justify-center rounded-full transition\"\n (click)=\"removeAttachment(file.id)\">\n <z-icon zType=\"lucideX\" zSize=\"12\" />\n </button>\n </div>\n }\n </div>\n }\n\n <div class=\"z-chat-composer-shell\">\n <div class=\"z-chat-composer-main\" [class.z-chat-composer__field--overflow]=\"isComposerOverflowing()\">\n <textarea\n #chatInput\n class=\"z-chat-composer-textarea\"\n [placeholder]=\"zPlaceholder() | translate\"\n [disabled]=\"zDisabled()\"\n [ngModel]=\"draftMessage()\"\n (ngModelChange)=\"draftMessage.set($event)\"\n (input)=\"onTextareaInput($event)\"\n (paste)=\"onTextareaPaste($event)\"\n (keydown)=\"onInputKeydown($event)\"\n rows=\"3\"></textarea>\n </div>\n\n <div class=\"z-chat-composer-toolbar\">\n <div class=\"z-chat-composer-toolbar-left\">\n @if (zAllowAttachments()) {\n <input\n #fileInput\n type=\"file\"\n class=\"hidden\"\n [attr.accept]=\"zAcceptedFiles()\"\n multiple\n (change)=\"onFileChange($event)\" />\n <button\n type=\"button\"\n class=\"z-chat-composer-tool-btn\"\n [disabled]=\"zDisabled()\"\n (click)=\"onClickAttach()\"\n title=\"{{ 'i18n_z_ui_chat_ai_attach' | translate }}\">\n <z-icon zType=\"lucidePlus\" zSize=\"18\" />\n </button>\n }\n </div>\n\n <div class=\"z-chat-composer-toolbar-right\">\n <button\n type=\"button\"\n class=\"z-chat-composer-send-btn\"\n [disabled]=\"!canSend()\"\n (click)=\"onSendMessage()\"\n title=\"{{ 'i18n_z_ui_chat_ai_send' | translate }}\">\n <z-icon\n [zType]=\"isTyping() ? 'lucideLoaderCircle' : zSendIcon()\"\n zSize=\"16\"\n [class]=\"isTyping() ? 'animate-spin' : ''\" />\n </button>\n </div>\n </div>\n </div>\n </footer>\n </div>\n\n <z-modal\n [zVisible]=\"isPreviewVisible()\"\n [zTitle]=\"previewImage()?.name\"\n [zDescription]=\"previewImageSizeLabel()\"\n zWidth=\"min(92vw, 720px)\"\n [zHideFooter]=\"true\"\n [zMaskClosable]=\"true\"\n zOverlay=\"blur\"\n (zCancel)=\"closeImagePreview()\">\n <div class=\"z-chat-preview-modal-body\">\n <img [src]=\"previewImage()?.url\" [alt]=\"previewImage()?.name\" class=\"z-chat-preview-image\" />\n </div>\n </z-modal>\n </section>\n\n <button\n type=\"button\"\n class=\"pointer-events-auto cursor-pointer\"\n [class]=\"fabClasses()\"\n (click)=\"onToggle()\"\n [attr.aria-expanded]=\"zOpen()\"\n [attr.aria-label]=\"'i18n_z_ui_chat_ai_toggle' | translate\"\n title=\"{{ 'i18n_z_ui_chat_ai_toggle' | translate }}\">\n @if (zShowPulse() && !zOpen()) {\n <span class=\"bg-primary/30 absolute inset-0 animate-ping rounded-full\"></span>\n }\n\n @if (showRipple()) {\n <span class=\"bg-primary-foreground/30 absolute inset-0 animate-ping rounded-full\"></span>\n }\n\n <z-icon\n [zType]=\"zOpen() ? 'lucideX' : zFabIcon()\"\n zSize=\"24\"\n class=\"relative z-1 transition-transform duration-200\"\n [class.rotate-180]=\"zOpen()\" />\n </button>\n </div>\n</div>\n", styles: [".z-chat textarea{scrollbar-width:thin}.z-chat-panel-shell{box-shadow:0 0 28px #00000024!important}:is(.dark,[data-theme=dark]) .z-chat-panel-shell{box-shadow:0 0 28px #00000057!important}.z-chat-composer__field--overflow:after{position:absolute;right:0;bottom:0;left:0;height:1rem;pointer-events:none;content:\"\";background:linear-gradient(to top,var(--background) 22%,transparent)}.z-chat-composer-shell{position:relative;display:flex;width:100%;flex-direction:column;border:1px solid color-mix(in oklab,var(--border) 82%,transparent);border-radius:1rem;background:linear-gradient(180deg,color-mix(in oklab,var(--card) 98%,var(--background) 2%),color-mix(in oklab,var(--card) 92%,var(--background) 8%));box-shadow:0 6px 18px #00000014;transition:box-shadow .2s ease}.z-chat-composer-shell:focus-within{box-shadow:0 6px 18px #00000014}:is(.dark,[data-theme=dark]) .z-chat-composer-shell{border-color:var(--border);background:linear-gradient(180deg,color-mix(in oklab,var(--card) 96%,var(--background) 4%),color-mix(in oklab,var(--card) 88%,var(--background) 12%));box-shadow:0 10px 24px #00000057}.z-chat-composer-main{position:relative;overflow:hidden;padding:.7rem .35rem .45rem .85rem}.z-chat-composer-textarea{width:100%;height:4.125rem;max-height:4.125rem;border:none;background:transparent;resize:none;overflow-x:hidden;font-size:.875rem;line-height:1.4rem;color:var(--foreground);outline:none;padding-right:.2rem;scrollbar-width:thin;overflow-wrap:anywhere;word-break:break-word}.z-chat-composer-textarea::placeholder{color:var(--muted-foreground)}.z-chat-composer-textarea::-webkit-scrollbar{width:.375rem}.z-chat-composer-textarea::-webkit-scrollbar-track{background:transparent}.z-chat-composer-textarea::-webkit-scrollbar-thumb{border-radius:62.4375rem;background:#64748b73}:is(.dark,[data-theme=dark]) .z-chat-composer-textarea::-webkit-scrollbar-thumb{background:#94a3b88c}.z-chat-composer-toolbar{display:flex;align-items:center;justify-content:space-between;border-top:.0625rem solid rgba(219,219,219,.6);padding:.55rem .7rem .65rem}:is(.dark,[data-theme=dark]) .z-chat-composer-toolbar{border-top-color:#00000038}.z-chat-composer-toolbar-left,.z-chat-composer-toolbar-right{display:flex;align-items:center}.z-chat-composer-tool-btn{display:inline-flex;height:1.75rem;width:1.75rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.6rem;border:none;background:transparent;color:#374151;transition:background-color .2s ease}.z-chat-composer-tool-btn:hover{background:#0000000f}:is(.dark,[data-theme=dark]) .z-chat-composer-tool-btn{color:#e5e7ebe6}:is(.dark,[data-theme=dark]) .z-chat-composer-tool-btn:hover{background:#ffffff1a}.z-chat-composer-tool-btn:disabled{cursor:not-allowed;opacity:.5}.z-chat-composer-send-btn{display:inline-flex;height:2rem;width:2rem;cursor:pointer;align-items:center;justify-content:center;border-radius:62.4375rem;border:1px solid rgba(0,0,0,.1);background:var(--primary);color:var(--primary-foreground);box-shadow:0 2px 8px #0000002e,inset 0 1px #ffffff2e;transition:transform .15s ease,opacity .2s ease,box-shadow .2s ease}.z-chat-composer-send-btn:hover{transform:translateY(-.0625rem);box-shadow:0 4px 12px #00000038,inset 0 1px #ffffff38}.z-chat-composer-send-btn:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}.z-chat-scrollbar{contain:layout}.z-chat-content-surface{background:var(--card)}.z-chat-lower-shell{display:flex;min-height:0;flex:1;flex-direction:column;overflow:hidden;background:var(--card);color:var(--card-foreground);border:1px solid transparent;border-top:0;border-bottom-right-radius:1rem;border-bottom-left-radius:1rem}:is(.dark,[data-theme=dark]) .z-chat-lower-shell{border-color:var(--border);border-top:0}.z-chat-footer-surface{background:transparent;border-top:.0625rem solid color-mix(in oklab,var(--border) 70%,transparent)}:is(.dark,[data-theme=dark]) .z-chat-footer-surface{background:transparent;border-top-color:var(--border)}.z-chat-messages{min-height:100%;overflow-x:hidden;padding:.875rem .75rem;contain:content}.z-chat-message{display:flex;margin:.5rem 0;padding:0 2px;transform-origin:bottom center;contain:layout style}.z-chat-message-bubble{transform:translateZ(0);backface-visibility:hidden}.z-chat-message--enter{animation:z-chat-message-push-in .3s ease-out;will-change:transform,opacity}.z-chat-suggestion-item{animation:z-chat-suggestion-reveal .28s ease-out both;will-change:transform,opacity}.z-chat-preview-modal-body{display:flex;align-items:center;justify-content:center;max-height:min(70vh,40rem);padding:.25rem}.z-chat-preview-image{max-width:100%;max-height:min(66vh,37.5rem);border-radius:.5rem;object-fit:contain}@keyframes z-chat-message-push-in{0%{opacity:0;transform:translateY(.9375rem) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes z-chat-suggestion-reveal{0%{opacity:0;transform:translateY(.5rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: ZModalComponent, selector: "z-modal", inputs: ["class", "zBodyClass", "zVisible", "zTitle", "zDescription", "zWidth", "zClosable", "zMaskClosable", "zDisableShadow", "zHeaderBorder", "zFooterBorder", "zHideHeader", "zHideFooter", "zOkText", "zCancelText", "zOkDestructive", "zOkDisabled", "zLoading", "zContentLoading", "zSkeletonRows", "zOverlay"], outputs: ["zOk", "zCancel", "zAfterClose", "zScrollbar", "zVisibleChange"], exportAs: ["zModal"] }, { kind: "component", type: NgScrollbar, selector: "ng-scrollbar:not([externalViewport]), [ngScrollbar]", exportAs: ["ngScrollbar"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
426
464
  }
427
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZChatComponent, decorators: [{
465
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZChatComponent, decorators: [{
428
466
  type: Component,
429
467
  args: [{ selector: 'z-chat', imports: [FormsModule, TranslatePipe, ZIconComponent, ZModalComponent, NgScrollbar], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
430
468
  class: 'z-chat block',