@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.
- package/fesm2022/shival99-z-ui-components-z-accordion.mjs +41 -25
- package/fesm2022/shival99-z-ui-components-z-accordion.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-autocomplete.mjs +176 -97
- package/fesm2022/shival99-z-ui-components-z-autocomplete.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-avatar.mjs +71 -40
- package/fesm2022/shival99-z-ui-components-z-avatar.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-breadcrumb.mjs +26 -15
- package/fesm2022/shival99-z-ui-components-z-breadcrumb.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-button-group.mjs +33 -21
- package/fesm2022/shival99-z-ui-components-z-button-group.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-button.mjs +32 -19
- package/fesm2022/shival99-z-ui-components-z-button.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-calendar.mjs +289 -172
- package/fesm2022/shival99-z-ui-components-z-calendar.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-card.mjs +34 -24
- package/fesm2022/shival99-z-ui-components-z-card.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-chat.mjs +85 -47
- package/fesm2022/shival99-z-ui-components-z-chat.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-checkbox.mjs +56 -31
- package/fesm2022/shival99-z-ui-components-z-checkbox.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-code.mjs +29 -16
- package/fesm2022/shival99-z-ui-components-z-code.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-command.mjs +34 -19
- package/fesm2022/shival99-z-ui-components-z-command.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-drawer.mjs +310 -88
- package/fesm2022/shival99-z-ui-components-z-drawer.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs +32 -18
- package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-editor.mjs +118 -62
- package/fesm2022/shival99-z-ui-components-z-editor.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-empty.mjs +31 -17
- package/fesm2022/shival99-z-ui-components-z-empty.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-filter.mjs +81 -54
- package/fesm2022/shival99-z-ui-components-z-filter.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-gallery.mjs +240 -132
- package/fesm2022/shival99-z-ui-components-z-gallery.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-icon.mjs +39 -21
- package/fesm2022/shival99-z-ui-components-z-icon.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-input.mjs +173 -95
- package/fesm2022/shival99-z-ui-components-z-input.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-kanban.mjs +88 -47
- package/fesm2022/shival99-z-ui-components-z-kanban.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-loading.mjs +31 -19
- package/fesm2022/shival99-z-ui-components-z-loading.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-marquee.mjs +42 -23
- package/fesm2022/shival99-z-ui-components-z-marquee.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-media-player.mjs +87 -45
- package/fesm2022/shival99-z-ui-components-z-media-player.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-menu.mjs +126 -67
- package/fesm2022/shival99-z-ui-components-z-menu.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-metric-card.mjs +42 -23
- package/fesm2022/shival99-z-ui-components-z-metric-card.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-modal.mjs +144 -80
- package/fesm2022/shival99-z-ui-components-z-modal.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-pagination.mjs +45 -24
- package/fesm2022/shival99-z-ui-components-z-pagination.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-popover.mjs +90 -57
- package/fesm2022/shival99-z-ui-components-z-popover.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-qrcode.mjs +51 -29
- package/fesm2022/shival99-z-ui-components-z-qrcode.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-radio.mjs +36 -20
- package/fesm2022/shival99-z-ui-components-z-radio.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs +27 -15
- package/fesm2022/shival99-z-ui-components-z-scrollarea.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-select.mjs +239 -138
- package/fesm2022/shival99-z-ui-components-z-select.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-show-more.mjs +38 -21
- package/fesm2022/shival99-z-ui-components-z-show-more.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-skeleton-auto.mjs +42 -23
- package/fesm2022/shival99-z-ui-components-z-skeleton-auto.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-skeleton.mjs +35 -19
- package/fesm2022/shival99-z-ui-components-z-skeleton.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-steps.mjs +55 -31
- package/fesm2022/shival99-z-ui-components-z-steps.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-switch.mjs +60 -33
- package/fesm2022/shival99-z-ui-components-z-switch.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-table.mjs +10875 -0
- package/fesm2022/shival99-z-ui-components-z-table.mjs.map +1 -0
- package/fesm2022/shival99-z-ui-components-z-tabs.mjs +534 -0
- package/fesm2022/shival99-z-ui-components-z-tabs.mjs.map +1 -0
- package/fesm2022/shival99-z-ui-components-z-tags.mjs +72 -46
- package/fesm2022/shival99-z-ui-components-z-tags.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-timeline.mjs +254 -0
- package/fesm2022/shival99-z-ui-components-z-timeline.mjs.map +1 -0
- package/fesm2022/shival99-z-ui-components-z-toast.mjs +53 -31
- package/fesm2022/shival99-z-ui-components-z-toast.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-tooltip.mjs +133 -56
- package/fesm2022/shival99-z-ui-components-z-tooltip.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-upload.mjs +63 -36
- package/fesm2022/shival99-z-ui-components-z-upload.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-i18n.mjs +2 -0
- package/fesm2022/shival99-z-ui-i18n.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-pipes.mjs +18 -18
- package/fesm2022/shival99-z-ui-services.mjs +35 -31
- package/fesm2022/shival99-z-ui-services.mjs.map +1 -1
- package/package.json +16 -16
- package/types/shival99-z-ui-components-z-autocomplete.d.ts +2 -2
- package/types/shival99-z-ui-components-z-card.d.ts +1 -2
- package/types/shival99-z-ui-components-z-drawer.d.ts +20 -2
- package/types/shival99-z-ui-components-z-gallery.d.ts +1 -2
- package/types/shival99-z-ui-components-z-select.d.ts +2 -2
- package/types/shival99-z-ui-components-z-table.d.ts +2293 -0
- package/types/shival99-z-ui-components-z-tabs.d.ts +92 -0
- 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,
|
|
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: "
|
|
9
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
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: "
|
|
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,
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
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
|
-
},
|
|
105
|
-
|
|
106
|
-
|
|
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
|
-
}),
|
|
112
|
-
|
|
113
|
-
|
|
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: "
|
|
123
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
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: "
|
|
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 }] }],
|
|
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('',
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
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('',
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
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()),
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
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
|
-
}),
|
|
150
|
+
}), /* @ts-ignore */
|
|
151
|
+
...(ngDevMode ? [{ debugName: "panelClasses" }] : /* istanbul ignore next */ []));
|
|
120
152
|
fabClasses = computed(() => zChatFabVariants({
|
|
121
153
|
zOpen: this.zOpen(),
|
|
122
|
-
}),
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
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
|
-
},
|
|
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: "
|
|
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: "
|
|
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',
|