@shival99/z-ui 1.1.14 → 1.1.16
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/README.md +1 -1
- package/fesm2022/shival99-z-ui-components-z-calendar.mjs +13 -6
- package/fesm2022/shival99-z-ui-components-z-calendar.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs +4 -3
- package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-empty.mjs +2 -2
- package/fesm2022/shival99-z-ui-components-z-empty.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-table.mjs +860 -494
- package/fesm2022/shival99-z-ui-components-z-table.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-components-z-toast.mjs +1 -1
- package/fesm2022/shival99-z-ui-components-z-toast.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-i18n.mjs +4 -0
- package/fesm2022/shival99-z-ui-i18n.mjs.map +1 -1
- package/fesm2022/shival99-z-ui-services.mjs.map +1 -1
- package/package.json +2 -2
- package/types/shival99-z-ui-components-z-dropdown-menu.d.ts +2 -1
- package/types/shival99-z-ui-components-z-table.d.ts +106 -10
- package/types/shival99-z-ui-components-z-toast.d.ts +1 -1
|
@@ -12,6 +12,7 @@ class ZDropdownMenuComponent {
|
|
|
12
12
|
zIcon = input('lucideMenu', ...(ngDevMode ? [{ debugName: "zIcon" }] : []));
|
|
13
13
|
zButtonType = input('outline', ...(ngDevMode ? [{ debugName: "zButtonType" }] : []));
|
|
14
14
|
zPosition = input('bottom-right', ...(ngDevMode ? [{ debugName: "zPosition" }] : []));
|
|
15
|
+
zButtonSize = input('default', ...(ngDevMode ? [{ debugName: "zButtonSize" }] : []));
|
|
15
16
|
zOffset = input(4, ...(ngDevMode ? [{ debugName: "zOffset" }] : []));
|
|
16
17
|
zMinWidth = input(224, ...(ngDevMode ? [{ debugName: "zMinWidth" }] : []));
|
|
17
18
|
zMaxWidth = input(320, ...(ngDevMode ? [{ debugName: "zMaxWidth" }] : []));
|
|
@@ -40,12 +41,12 @@ class ZDropdownMenuComponent {
|
|
|
40
41
|
return this.zItems().filter(item => !item.hidden);
|
|
41
42
|
}
|
|
42
43
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZDropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
43
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZDropdownMenuComponent, isStandalone: true, selector: "z-dropdown-menu", inputs: { zItems: { classPropertyName: "zItems", publicName: "zItems", isSignal: true, isRequired: true, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zIcon: { classPropertyName: "zIcon", publicName: "zIcon", isSignal: true, isRequired: false, transformFunction: null }, zButtonType: { classPropertyName: "zButtonType", publicName: "zButtonType", 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 }, zMinWidth: { classPropertyName: "zMinWidth", publicName: "zMinWidth", isSignal: true, isRequired: false, transformFunction: null }, zMaxWidth: { classPropertyName: "zMaxWidth", publicName: "zMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnItemClick: "zOnItemClick" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Custom trigger template n\u1EBFu c\u00F3 -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n
|
|
44
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZDropdownMenuComponent, isStandalone: true, selector: "z-dropdown-menu", inputs: { zItems: { classPropertyName: "zItems", publicName: "zItems", isSignal: true, isRequired: true, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zIcon: { classPropertyName: "zIcon", publicName: "zIcon", isSignal: true, isRequired: false, transformFunction: null }, zButtonType: { classPropertyName: "zButtonType", publicName: "zButtonType", isSignal: true, isRequired: false, transformFunction: null }, zPosition: { classPropertyName: "zPosition", publicName: "zPosition", isSignal: true, isRequired: false, transformFunction: null }, zButtonSize: { classPropertyName: "zButtonSize", publicName: "zButtonSize", isSignal: true, isRequired: false, transformFunction: null }, zOffset: { classPropertyName: "zOffset", publicName: "zOffset", isSignal: true, isRequired: false, transformFunction: null }, zMinWidth: { classPropertyName: "zMinWidth", publicName: "zMinWidth", isSignal: true, isRequired: false, transformFunction: null }, zMaxWidth: { classPropertyName: "zMaxWidth", publicName: "zMaxWidth", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnItemClick: "zOnItemClick" }, queries: [{ propertyName: "triggerTemplate", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Custom trigger template n\u1EBFu c\u00F3 -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zSize]=\"zButtonSize()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zTypeIcon]=\"zIcon()!\"\n (zControl)=\"onControl($event)\">\n @if (zLabel()) {\n {{ zLabel() }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of getVisibleItems(); track $index) {\n <!-- Divider before -->\n @if (shouldShowDividerBefore(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition || 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon [zType]=\"subItem.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (shouldShowDividerAfter(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n", styles: [".z-dropdown-menu-content{min-width:inherit}\n"], dependencies: [{ kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zManualClose", "zScrollClose", "zShowArrow"], outputs: ["zShow", "zHide", "zHideStart", "zControl"], exportAs: ["zPopover"] }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTrigger", "zTooltipType", "zTooltipSize", "zClass", "zShowDelay", "zHideDelay", "zArrow", "zDisabled", "zOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
44
45
|
}
|
|
45
46
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZDropdownMenuComponent, decorators: [{
|
|
46
47
|
type: Component,
|
|
47
|
-
args: [{ selector: 'z-dropdown-menu', imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, NgTemplateOutlet, ZTooltipDirective], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Custom trigger template n\u1EBFu c\u00F3 -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n
|
|
48
|
-
}], propDecorators: { zItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "zItems", required: true }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIcon", required: false }] }], zButtonType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zButtonType", required: false }] }], zPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPosition", required: false }] }], zOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOffset", required: false }] }], zMinWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMinWidth", required: false }] }], zMaxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxWidth", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], triggerTemplate: [{ type: i0.ContentChild, args: ['trigger', { isSignal: true }] }], zOnItemClick: [{ type: i0.Output, args: ["zOnItemClick"] }] } });
|
|
48
|
+
args: [{ selector: 'z-dropdown-menu', imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, NgTemplateOutlet, ZTooltipDirective], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Custom trigger template n\u1EBFu c\u00F3 -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zSize]=\"zButtonSize()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zTypeIcon]=\"zIcon()!\"\n (zControl)=\"onControl($event)\">\n @if (zLabel()) {\n {{ zLabel() }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of getVisibleItems(); track $index) {\n <!-- Divider before -->\n @if (shouldShowDividerBefore(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition || 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon [zType]=\"subItem.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (shouldShowDividerAfter(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n", styles: [".z-dropdown-menu-content{min-width:inherit}\n"] }]
|
|
49
|
+
}], propDecorators: { zItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "zItems", required: true }] }], zLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "zLabel", required: false }] }], zIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIcon", required: false }] }], zButtonType: [{ type: i0.Input, args: [{ isSignal: true, alias: "zButtonType", required: false }] }], zPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "zPosition", required: false }] }], zButtonSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zButtonSize", required: false }] }], zOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "zOffset", required: false }] }], zMinWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMinWidth", required: false }] }], zMaxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMaxWidth", required: false }] }], zDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDisabled", required: false }] }], triggerTemplate: [{ type: i0.ContentChild, args: ['trigger', { isSignal: true }] }], zOnItemClick: [{ type: i0.Output, args: ["zOnItemClick"] }] } });
|
|
49
50
|
|
|
50
51
|
/**
|
|
51
52
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shival99-z-ui-components-z-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, contentChild, input, output, signal, TemplateRef } from '@angular/core';\nimport { ZButtonComponent } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n selector: 'z-dropdown-menu',\n imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, NgTemplateOutlet, ZTooltipDirective],\n standalone: true,\n templateUrl: './z-dropdown-menu.component.html',\n styleUrl: './z-dropdown-menu.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent {\n public readonly zItems = input.required<ZDropdownMenuItem[]>();\n public readonly zLabel = input<string>();\n public readonly zIcon = input<ZIcon>('lucideMenu');\n public readonly zButtonType = input<'primary' | 'secondary' | 'outline' | 'ghost'>('outline');\n public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n public readonly zOffset = input<number>(4);\n public readonly zMinWidth = input<number>(224);\n public readonly zMaxWidth = input<number>(320);\n public readonly zDisabled = input<boolean>(false);\n\n public readonly triggerTemplate = contentChild<TemplateRef<unknown>>('trigger');\n public readonly zOnItemClick = output<ZDropdownMenuItem>();\n protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } | null>(null);\n\n protected onItemClick(item: ZDropdownMenuItem): void {\n if (item.disabled) {\n return;\n }\n\n item.onClick?.();\n this.zOnItemClick.emit(item);\n this.popoverControl()?.closeImmediate();\n }\n\n protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n this.popoverControl.set(control);\n }\n\n protected shouldShowDividerBefore(item: ZDropdownMenuItem, index: number): boolean {\n return item.divide === 'before' && index > 0;\n }\n\n protected shouldShowDividerAfter(item: ZDropdownMenuItem, index: number): boolean {\n return item.divide === 'after' && index < this.zItems().length - 1;\n }\n\n protected getVisibleItems(): ZDropdownMenuItem[] {\n return this.zItems().filter(item => !item.hidden);\n }\n}\n","<!-- Custom trigger template nếu có -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n (zControl)=\"onControl($event)\">\n <z-icon [zType]=\"zIcon()!\" zSize=\"16\" class=\"mr-2\" />\n @if (zLabel()) {\n {{ zLabel() }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of getVisibleItems(); track $index) {\n <!-- Divider before -->\n @if (shouldShowDividerBefore(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition || 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon [zType]=\"subItem.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (shouldShowDividerAfter(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\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-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, contentChild, input, output, signal, TemplateRef } from '@angular/core';\nimport { ZButtonComponent, ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n selector: 'z-dropdown-menu',\n imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, NgTemplateOutlet, ZTooltipDirective],\n standalone: true,\n templateUrl: './z-dropdown-menu.component.html',\n styleUrl: './z-dropdown-menu.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent {\n public readonly zItems = input.required<ZDropdownMenuItem[]>();\n public readonly zLabel = input<string>();\n public readonly zIcon = input<ZIcon>('lucideMenu');\n public readonly zButtonType = input<'primary' | 'secondary' | 'outline' | 'ghost'>('outline');\n public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n public readonly zButtonSize = input<ZButtonVariants['zSize']>('default');\n public readonly zOffset = input<number>(4);\n public readonly zMinWidth = input<number>(224);\n public readonly zMaxWidth = input<number>(320);\n public readonly zDisabled = input<boolean>(false);\n\n public readonly triggerTemplate = contentChild<TemplateRef<unknown>>('trigger');\n public readonly zOnItemClick = output<ZDropdownMenuItem>();\n protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } | null>(null);\n\n protected onItemClick(item: ZDropdownMenuItem): void {\n if (item.disabled) {\n return;\n }\n\n item.onClick?.();\n this.zOnItemClick.emit(item);\n this.popoverControl()?.closeImmediate();\n }\n\n protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n this.popoverControl.set(control);\n }\n\n protected shouldShowDividerBefore(item: ZDropdownMenuItem, index: number): boolean {\n return item.divide === 'before' && index > 0;\n }\n\n protected shouldShowDividerAfter(item: ZDropdownMenuItem, index: number): boolean {\n return item.divide === 'after' && index < this.zItems().length - 1;\n }\n\n protected getVisibleItems(): ZDropdownMenuItem[] {\n return this.zItems().filter(item => !item.hidden);\n }\n}\n","<!-- Custom trigger template nếu có -->\n@if (triggerTemplate()) {\n <div\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zDisabled]=\"zDisabled()\"\n (zControl)=\"onControl($event)\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate()!\" />\n </div>\n} @else {\n <!-- Default button trigger -->\n <button\n z-button\n [zType]=\"zButtonType()\"\n [zSize]=\"zButtonSize()\"\n [zDisabled]=\"zDisabled()\"\n z-popover\n [zPopoverContent]=\"menuContent\"\n zTrigger=\"click\"\n [zPosition]=\"zPosition()\"\n [zOffset]=\"zOffset()\"\n [zTypeIcon]=\"zIcon()!\"\n (zControl)=\"onControl($event)\">\n @if (zLabel()) {\n {{ zLabel() }}\n }\n </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n @for (item of getVisibleItems(); track $index) {\n <!-- Divider before -->\n @if (shouldShowDividerBefore(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <!-- Menu item - check if has submenu -->\n @if (item.submenu && item.submenu.length > 0) {\n <!-- Menu item with nested submenu -->\n <button\n type=\"button\"\n z-popover\n [zPopoverContent]=\"submenuTemplate\"\n [zPosition]=\"item.submenuPosition || 'right'\"\n zTrigger=\"hover\"\n [zShowDelay]=\"200\"\n [zHideDelay]=\"100\"\n [zOffset]=\"6\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n </button>\n\n <!-- Submenu template -->\n <ng-template #submenuTemplate>\n <div\n class=\"p-1\"\n [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n @for (subItem of item.submenu; track subItem.label) {\n <!-- Nested divider before -->\n @if (subItem.divide === 'before') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n\n <button\n type=\"button\"\n [disabled]=\"subItem.disabled\"\n [class]=\"subItem.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(subItem)\">\n @if (subItem.icon) {\n <z-icon [zType]=\"subItem.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span\n class=\"truncate\"\n z-tooltip\n [zContent]=\"subItem.label\"\n [zShowDelay]=\"200\"\n zTrigger=\"hover\"\n zPosition=\"top\">\n {{ subItem.label }}\n </span>\n @if (subItem.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n {{ subItem.shortcut }}\n </span>\n }\n </button>\n\n <!-- Nested divider after -->\n @if (subItem.divide === 'after') {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n </ng-template>\n } @else {\n <!-- Regular menu item (no submenu) -->\n <button\n type=\"button\"\n [disabled]=\"item.disabled\"\n [class]=\"item.class\"\n class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n (click)=\"onItemClick(item)\">\n @if (item.icon) {\n <z-icon [zType]=\"item.icon\" zSize=\"14\" class=\"text-muted-foreground shrink-0\" />\n }\n <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n {{ item.label }}\n </span>\n @if (item.shortcut) {\n <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">{{ item.shortcut }}</span>\n }\n </button>\n }\n\n <!-- Divider after -->\n @if (shouldShowDividerAfter(item, $index)) {\n <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n }\n }\n </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -75,13 +75,13 @@ class ZEmptyComponent {
|
|
|
75
75
|
return this._translate.instant('i18n_z_ui_empty_no_data');
|
|
76
76
|
}, ...(ngDevMode ? [{ debugName: "displayMessage" }] : []));
|
|
77
77
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZEmptyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
78
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZEmptyComponent, isStandalone: true, selector: "z-empty", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zIcon: { classPropertyName: "zIcon", publicName: "zIcon", isSignal: true, isRequired: false, transformFunction: null }, zIconSize: { classPropertyName: "zIconSize", publicName: "zIconSize", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zMessage: { classPropertyName: "zMessage", publicName: "zMessage", isSignal: true, isRequired: false, transformFunction: null }, zDescription: { classPropertyName: "zDescription", publicName: "zDescription", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "z-empty" }, ngImport: i0, template: "<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div
|
|
78
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZEmptyComponent, isStandalone: true, selector: "z-empty", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zIcon: { classPropertyName: "zIcon", publicName: "zIcon", isSignal: true, isRequired: false, transformFunction: null }, zIconSize: { classPropertyName: "zIconSize", publicName: "zIconSize", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zMessage: { classPropertyName: "zMessage", publicName: "zMessage", isSignal: true, isRequired: false, transformFunction: null }, zDescription: { classPropertyName: "zDescription", publicName: "zDescription", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "z-empty" }, ngImport: i0, template: "<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
79
79
|
}
|
|
80
80
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZEmptyComponent, decorators: [{
|
|
81
81
|
type: Component,
|
|
82
82
|
args: [{ selector: 'z-empty', imports: [ZIconComponent, TranslatePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
83
83
|
class: 'z-empty',
|
|
84
|
-
}, template: "<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div
|
|
84
|
+
}, template: "<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div>\n" }]
|
|
85
85
|
}], propDecorators: { class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], zIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIcon", required: false }] }], zIconSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIconSize", required: false }] }], zSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "zSize", required: false }] }], zMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "zMessage", required: false }] }], zDescription: [{ type: i0.Input, args: [{ isSignal: true, alias: "zDescription", required: false }] }] } });
|
|
86
86
|
|
|
87
87
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shival99-z-ui-components-z-empty.mjs","sources":["../../../../libs/core-ui/components/z-empty/z-empty.variants.ts","../../../../libs/core-ui/components/z-empty/z-empty.component.ts","../../../../libs/core-ui/components/z-empty/z-empty.component.html","../../../../libs/core-ui/components/z-empty/shival99-z-ui-components-z-empty.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zEmptyContainerVariants = cva('col-span-full flex flex-col items-center justify-center', {\n variants: {\n zSize: {\n sm: 'py-8',\n default: 'py-12',\n lg: 'py-16',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyIconVariants = cva('text-muted-foreground/50', {\n variants: {\n zSize: {\n sm: 'mb-2',\n default: 'mb-4',\n lg: 'mb-6',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyMessageVariants = cva('text-muted-foreground', {\n variants: {\n zSize: {\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyDescriptionVariants = cva('text-muted-foreground/70 mt-1', {\n variants: {\n zSize: {\n sm: 'text-xs',\n default: 'text-xs',\n lg: 'text-sm',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZEmptyVariants = VariantProps<typeof zEmptyContainerVariants>;\n","import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation } from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport type { ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZTranslateService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport type { ZEmptyIconSize } from './z-empty.types';\nimport {\n zEmptyContainerVariants,\n zEmptyDescriptionVariants,\n zEmptyIconVariants,\n zEmptyMessageVariants,\n type ZEmptyVariants,\n} from './z-empty.variants';\n\n@Component({\n selector: 'z-empty',\n imports: [ZIconComponent, TranslatePipe],\n standalone: true,\n templateUrl: './z-empty.component.html',\n styleUrl: './z-empty.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-empty',\n },\n})\nexport class ZEmptyComponent {\n private readonly _translate = inject(ZTranslateService);\n\n public readonly class = input<ClassValue>('');\n public readonly zIcon = input<ZIcon>('lucidePackageOpen');\n public readonly zIconSize = input<ZEmptyIconSize>('40');\n public readonly zSize = input<ZEmptyVariants['zSize']>('default');\n public readonly zMessage = input<string>('');\n public readonly zDescription = input<string>('');\n\n protected readonly containerClasses = computed(() =>\n zMergeClasses(zEmptyContainerVariants({ zSize: this.zSize() }), this.class())\n );\n\n protected readonly iconClasses = computed(() => zEmptyIconVariants({ zSize: this.zSize() }));\n protected readonly messageClasses = computed(() => zEmptyMessageVariants({ zSize: this.zSize() }));\n protected readonly descriptionClasses = computed(() => zEmptyDescriptionVariants({ zSize: this.zSize() }));\n protected readonly displayMessage = computed(() => {\n const message = this.zMessage();\n if (message) {\n return message;\n }\n return this._translate.instant('i18n_z_ui_empty_no_data');\n });\n}\n","<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div
|
|
1
|
+
{"version":3,"file":"shival99-z-ui-components-z-empty.mjs","sources":["../../../../libs/core-ui/components/z-empty/z-empty.variants.ts","../../../../libs/core-ui/components/z-empty/z-empty.component.ts","../../../../libs/core-ui/components/z-empty/z-empty.component.html","../../../../libs/core-ui/components/z-empty/shival99-z-ui-components-z-empty.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\n\nexport const zEmptyContainerVariants = cva('col-span-full flex flex-col items-center justify-center', {\n variants: {\n zSize: {\n sm: 'py-8',\n default: 'py-12',\n lg: 'py-16',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyIconVariants = cva('text-muted-foreground/50', {\n variants: {\n zSize: {\n sm: 'mb-2',\n default: 'mb-4',\n lg: 'mb-6',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyMessageVariants = cva('text-muted-foreground', {\n variants: {\n zSize: {\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport const zEmptyDescriptionVariants = cva('text-muted-foreground/70 mt-1', {\n variants: {\n zSize: {\n sm: 'text-xs',\n default: 'text-xs',\n lg: 'text-sm',\n },\n },\n defaultVariants: {\n zSize: 'default',\n },\n});\n\nexport type ZEmptyVariants = VariantProps<typeof zEmptyContainerVariants>;\n","import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation } from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport type { ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZTranslateService } from '@shival99/z-ui/services';\nimport { zMergeClasses } from '@shival99/z-ui/utils';\nimport type { ClassValue } from 'clsx';\nimport type { ZEmptyIconSize } from './z-empty.types';\nimport {\n zEmptyContainerVariants,\n zEmptyDescriptionVariants,\n zEmptyIconVariants,\n zEmptyMessageVariants,\n type ZEmptyVariants,\n} from './z-empty.variants';\n\n@Component({\n selector: 'z-empty',\n imports: [ZIconComponent, TranslatePipe],\n standalone: true,\n templateUrl: './z-empty.component.html',\n styleUrl: './z-empty.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'z-empty',\n },\n})\nexport class ZEmptyComponent {\n private readonly _translate = inject(ZTranslateService);\n\n public readonly class = input<ClassValue>('');\n public readonly zIcon = input<ZIcon>('lucidePackageOpen');\n public readonly zIconSize = input<ZEmptyIconSize>('40');\n public readonly zSize = input<ZEmptyVariants['zSize']>('default');\n public readonly zMessage = input<string>('');\n public readonly zDescription = input<string>('');\n\n protected readonly containerClasses = computed(() =>\n zMergeClasses(zEmptyContainerVariants({ zSize: this.zSize() }), this.class())\n );\n\n protected readonly iconClasses = computed(() => zEmptyIconVariants({ zSize: this.zSize() }));\n protected readonly messageClasses = computed(() => zEmptyMessageVariants({ zSize: this.zSize() }));\n protected readonly descriptionClasses = computed(() => zEmptyDescriptionVariants({ zSize: this.zSize() }));\n protected readonly displayMessage = computed(() => {\n const message = this.zMessage();\n if (message) {\n return message;\n }\n return this._translate.instant('i18n_z_ui_empty_no_data');\n });\n}\n","<div [class]=\"containerClasses()\">\n <z-icon [zType]=\"zIcon()\" [zSize]=\"zIconSize()\" [class]=\"iconClasses()\" />\n <p [class]=\"messageClasses()\">{{ displayMessage() | translate }}</p>\n @if (zDescription()) {\n <p [class]=\"descriptionClasses()\">{{ zDescription() | translate }}</p>\n }\n <ng-content />\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|