@masterteam/components 0.0.88 → 0.0.89
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/assets/common.css +1 -1
- package/fesm2022/masterteam-components-client-page-menu.mjs +18 -3
- package/fesm2022/masterteam-components-client-page-menu.mjs.map +1 -1
- package/fesm2022/masterteam-components-client-page.mjs +36 -4
- package/fesm2022/masterteam-components-client-page.mjs.map +1 -1
- package/fesm2022/masterteam-components-sidebar.mjs +2 -2
- package/fesm2022/masterteam-components-sidebar.mjs.map +1 -1
- package/fesm2022/masterteam-components-topbar.mjs +2 -2
- package/fesm2022/masterteam-components-topbar.mjs.map +1 -1
- package/fesm2022/masterteam-components-upload-field.mjs +27 -4
- package/fesm2022/masterteam-components-upload-field.mjs.map +1 -1
- package/package.json +1 -1
- package/types/masterteam-components-client-page-menu.d.ts +4 -1
- package/types/masterteam-components-client-page.d.ts +13 -1
- package/types/masterteam-components-topbar.d.ts +1 -1
- package/types/masterteam-components-upload-field.d.ts +2 -1
|
@@ -21,11 +21,11 @@ class Sidebar {
|
|
|
21
21
|
this.expandedChange.emit(this.expanded());
|
|
22
22
|
}
|
|
23
23
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Sidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Sidebar, isStandalone: true, selector: "mt-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, iconsColor: { classPropertyName: "iconsColor", publicName: "iconsColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: Tooltip, selector: "[mtTooltip]" }] });
|
|
24
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Sidebar, isStandalone: true, selector: "mt-sidebar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, iconsColor: { classPropertyName: "iconsColor", publicName: "iconsColor", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4 h-full\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "directive", type: Tooltip, selector: "[mtTooltip]" }] });
|
|
25
25
|
}
|
|
26
26
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Sidebar, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
|
-
args: [{ selector: 'mt-sidebar', standalone: true, imports: [RouterLinkActive, RouterLink, Icon, Tooltip], template: "<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n" }]
|
|
28
|
+
args: [{ selector: 'mt-sidebar', standalone: true, imports: [RouterLinkActive, RouterLink, Icon, Tooltip], template: "<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4 h-full\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n" }]
|
|
29
29
|
}], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], logo: [{ type: i0.Input, args: [{ isSignal: true, alias: "logo", required: false }] }], logoLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoLink", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitle", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], bgImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgImage", required: false }] }], bgRepeat: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgRepeat", required: false }] }], iconsColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconsColor", required: false }] }], expandedChange: [{ type: i0.Output, args: ["expandedChange"] }] } });
|
|
30
30
|
|
|
31
31
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masterteam-components-sidebar.mjs","sources":["../../../../packages/masterteam/components/sidebar/sidebar.ts","../../../../packages/masterteam/components/sidebar/sidebar.html","../../../../packages/masterteam/components/sidebar/masterteam-components-sidebar.ts"],"sourcesContent":["import {\r\n booleanAttribute,\r\n Component,\r\n input,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Icon, MTIcon } from '@masterteam/icons';\r\nimport { RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\n\r\nexport interface SidebarItem {\r\n id: string | number;\r\n title: string;\r\n icon?: MTIcon;\r\n routerLink?: any[] | string;\r\n}\r\n\r\n@Component({\r\n selector: 'mt-sidebar',\r\n standalone: true,\r\n imports: [RouterLinkActive, RouterLink, Icon, Tooltip],\r\n templateUrl: './sidebar.html',\r\n})\r\nexport class Sidebar {\r\n items = input<SidebarItem[]>([]);\r\n\r\n logo = input<string>();\r\n logoLink = input<string | any[]>();\r\n title = input<string>();\r\n subTitle = input<string>();\r\n\r\n bgColor = input<string>();\r\n bgImage = input<string>();\r\n bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n iconsColor = input<string>('var(--p-text-color)');\r\n\r\n expanded = signal(false);\r\n expandedChange = output<boolean>();\r\n\r\n toggleSidebar(): void {\r\n this.expanded.update((v) => !v);\r\n this.expandedChange.emit(this.expanded());\r\n }\r\n}\r\n","<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"masterteam-components-sidebar.mjs","sources":["../../../../packages/masterteam/components/sidebar/sidebar.ts","../../../../packages/masterteam/components/sidebar/sidebar.html","../../../../packages/masterteam/components/sidebar/masterteam-components-sidebar.ts"],"sourcesContent":["import {\r\n booleanAttribute,\r\n Component,\r\n input,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { Icon, MTIcon } from '@masterteam/icons';\r\nimport { RouterLink, RouterLinkActive } from '@angular/router';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\n\r\nexport interface SidebarItem {\r\n id: string | number;\r\n title: string;\r\n icon?: MTIcon;\r\n routerLink?: any[] | string;\r\n}\r\n\r\n@Component({\r\n selector: 'mt-sidebar',\r\n standalone: true,\r\n imports: [RouterLinkActive, RouterLink, Icon, Tooltip],\r\n templateUrl: './sidebar.html',\r\n})\r\nexport class Sidebar {\r\n items = input<SidebarItem[]>([]);\r\n\r\n logo = input<string>();\r\n logoLink = input<string | any[]>();\r\n title = input<string>();\r\n subTitle = input<string>();\r\n\r\n bgColor = input<string>();\r\n bgImage = input<string>();\r\n bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n iconsColor = input<string>('var(--p-text-color)');\r\n\r\n expanded = signal(false);\r\n expandedChange = output<boolean>();\r\n\r\n toggleSidebar(): void {\r\n this.expanded.update((v) => !v);\r\n this.expandedChange.emit(this.expanded());\r\n }\r\n}\r\n","<div\r\n class=\"flex flex-col bg-surface-200 dark:bg-surface-800 h-full overflow-clip border-e-1 border-surface-300 transition-all duration-300 ease-in-out\"\r\n [style.width]=\"expanded() ? '16rem' : '4rem'\"\r\n>\r\n <div\r\n class=\"flex flex-col gap-3 px-2 py-4 h-full\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat-y]=\"bgRepeat()\"\r\n >\r\n <!-- Toggle Button & Branding -->\r\n <div class=\"flex items-center gap-2\">\r\n <button\r\n type=\"button\"\r\n size=\"large\"\r\n class=\"flex items-center justify-center w-[47px] h-[40px] hover:bg-surface-100 dark:hover:bg-surface-900 transition-colors rounded-xl cursor-pointer shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n (click)=\"toggleSidebar()\"\r\n >\r\n <mt-icon icon=\"editor.align-justify\" class=\"text-lg\" />\r\n </button>\r\n\r\n @if (expanded() && (logo() || title())) {\r\n <div class=\"flex items-center gap-2 overflow-hidden\">\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-8 shrink-0\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div\r\n class=\"h-6 w-[1px] bg-current opacity-30 shrink-0\"\r\n [style.color]=\"iconsColor()\"\r\n ></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div\r\n class=\"flex flex-col gap-0.5 min-w-0\"\r\n [style.color]=\"iconsColor()\"\r\n >\r\n <span class=\"text-sm font-semibold truncate\">{{ title() }}</span>\r\n @if (subTitle()) {\r\n <span class=\"text-xs opacity-70 truncate\">{{\r\n subTitle()\r\n }}</span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n @for (item of items(); track item.id) {\r\n <a\r\n [routerLink]=\"item.routerLink\"\r\n routerLinkActive=\"bg-primary-50 dark:bg-primary-900\"\r\n #rla=\"routerLinkActive\"\r\n class=\"flex items-center gap-3 h-[47px] min-w-[47px] dark:hover:bg-surface-900 hover:bg-primary-50 transition-colors rounded-xl overflow-hidden\"\r\n [class.justify-center]=\"!expanded()\"\r\n [class.px-3]=\"expanded()\"\r\n mtTooltip=\"{{ item.title }}\"\r\n [style.color]=\"rla.isActive ? 'var(--p-primary-500)' : iconsColor()\"\r\n >\r\n <mt-icon [icon]=\"item.icon\" class=\"shrink-0\" />\r\n @if (expanded()) {\r\n <span class=\"whitespace-nowrap text-sm font-medium\">\r\n {{ item.title }}\r\n </span>\r\n }\r\n </a>\r\n }\r\n </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -13,11 +13,11 @@ class Topbar {
|
|
|
13
13
|
subTitle = input(...(ngDevMode ? [undefined, { debugName: "subTitle" }] : []));
|
|
14
14
|
showBranding = input(true, { ...(ngDevMode ? { debugName: "showBranding" } : {}), transform: booleanAttribute });
|
|
15
15
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Topbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Topbar, isStandalone: true, selector: "mt-topbar", inputs: { logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showBranding: { classPropertyName: "showBranding", publicName: "showBranding", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
16
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: Topbar, isStandalone: true, selector: "mt-topbar", inputs: { logo: { classPropertyName: "logo", publicName: "logo", isSignal: true, isRequired: false, transformFunction: null }, logoLink: { classPropertyName: "logoLink", publicName: "logoLink", isSignal: true, isRequired: false, transformFunction: null }, bgColor: { classPropertyName: "bgColor", publicName: "bgColor", isSignal: true, isRequired: false, transformFunction: null }, bgImage: { classPropertyName: "bgImage", publicName: "bgImage", isSignal: true, isRequired: false, transformFunction: null }, bgRepeat: { classPropertyName: "bgRepeat", publicName: "bgRepeat", isSignal: true, isRequired: false, transformFunction: null }, textColor: { classPropertyName: "textColor", publicName: "textColor", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showBranding: { classPropertyName: "showBranding", publicName: "showBranding", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n <ng-content select=\"[start]\"></ng-content>\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
17
17
|
}
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: Topbar, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
|
-
args: [{ selector: 'mt-topbar', standalone: true, imports: [RouterLink], template: "<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n" }]
|
|
20
|
+
args: [{ selector: 'mt-topbar', standalone: true, imports: [RouterLink], template: "<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n <ng-content select=\"[start]\"></ng-content>\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n" }]
|
|
21
21
|
}], propDecorators: { logo: [{ type: i0.Input, args: [{ isSignal: true, alias: "logo", required: false }] }], logoLink: [{ type: i0.Input, args: [{ isSignal: true, alias: "logoLink", required: false }] }], bgColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgColor", required: false }] }], bgImage: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgImage", required: false }] }], bgRepeat: [{ type: i0.Input, args: [{ isSignal: true, alias: "bgRepeat", required: false }] }], textColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "textColor", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], subTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subTitle", required: false }] }], showBranding: [{ type: i0.Input, args: [{ isSignal: true, alias: "showBranding", required: false }] }] } });
|
|
22
22
|
|
|
23
23
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masterteam-components-topbar.mjs","sources":["../../../../packages/masterteam/components/topbar/topbar.ts","../../../../packages/masterteam/components/topbar/topbar.html","../../../../packages/masterteam/components/topbar/masterteam-components-topbar.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\n\r\n@Component({\r\n selector: 'mt-topbar',\r\n standalone: true,\r\n imports: [RouterLink],\r\n templateUrl: './topbar.html',\r\n})\r\nexport class Topbar {\r\n logo = input<string>();\r\n logoLink = input<string | any[]>();\r\n bgColor = input<string>('var(--p-primary-color)');\r\n bgImage = input<string>();\r\n bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n textColor = input<string>('var(--p-primary-contrast-color)');\r\n title = input<string>();\r\n subTitle = input<string>();\r\n showBranding = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n}\r\n","<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"masterteam-components-topbar.mjs","sources":["../../../../packages/masterteam/components/topbar/topbar.ts","../../../../packages/masterteam/components/topbar/topbar.html","../../../../packages/masterteam/components/topbar/masterteam-components-topbar.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core';\r\nimport { RouterLink } from '@angular/router';\r\n\r\n@Component({\r\n selector: 'mt-topbar',\r\n standalone: true,\r\n imports: [RouterLink],\r\n templateUrl: './topbar.html',\r\n})\r\nexport class Topbar {\r\n logo = input<string>();\r\n logoLink = input<string | any[]>();\r\n bgColor = input<string>('var(--p-primary-color)');\r\n bgImage = input<string>();\r\n bgRepeat = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n textColor = input<string>('var(--p-primary-contrast-color)');\r\n title = input<string>();\r\n subTitle = input<string>();\r\n showBranding = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n}\r\n","<div\r\n class=\"w-full flex justify-between align-center bg-primary p-4 h-[var(--header-height)]\"\r\n [style.backgroundColor]=\"bgColor()\"\r\n [style.backgroundImage]=\"bgImage() ? 'url(' + bgImage() + ')' : null\"\r\n [class.bg-no-repeat]=\"!bgRepeat()\"\r\n [class.bg-repeat]=\"bgRepeat()\"\r\n>\r\n <div class=\"flex gap-4 items-center\" [style.color]=\"textColor()\">\r\n @if (showBranding()) {\r\n @if (logo()) {\r\n <img\r\n [src]=\"logo()\"\r\n alt=\"Logo\"\r\n class=\"h-full\"\r\n [routerLink]=\"logoLink()\"\r\n [class.cursor-pointer]=\"logoLink()\"\r\n />\r\n }\r\n @if (logo() && (title() || subTitle())) {\r\n <div class=\"h-3/4 w-[1px] bg-current\"></div>\r\n }\r\n @if (title() || subTitle()) {\r\n <div class=\"flex flex-col gap-1\">\r\n <h2 class=\"text-md font-semibold product-name\">\r\n {{ title() }}\r\n </h2>\r\n <span class=\"text-sm font-semibold product-tagline\">{{\r\n subTitle()\r\n }}</span>\r\n </div>\r\n }\r\n }\r\n <ng-content select=\"[start]\"></ng-content>\r\n </div>\r\n <div class=\"flex gap-2 items-center\">\r\n <ng-content select=\"[actions]\"></ng-content>\r\n </div>\r\n</div>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MASa,MAAM,CAAA;IACjB,IAAI,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IACtB,QAAQ,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,UAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAkB;AAClC,IAAA,OAAO,GAAG,KAAK,CAAS,wBAAwB,mDAAC;IACjD,OAAO,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IACzB,QAAQ,GAAG,KAAK,CAAmB,KAAK,qDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAC1E,IAAA,SAAS,GAAG,KAAK,CAAS,iCAAiC,qDAAC;IAC5D,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IACvB,QAAQ,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,UAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;IAC1B,YAAY,GAAG,KAAK,CAAmB,IAAI,yDAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;uGATlE,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAN,MAAM,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECTnB,syCAsCA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDhCY,UAAU,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,aAAA,EAAA,UAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,YAAA,EAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAGT,MAAM,EAAA,UAAA,EAAA,CAAA;kBANlB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,UAAA,EACT,IAAI,EAAA,OAAA,EACP,CAAC,UAAU,CAAC,EAAA,QAAA,EAAA,syCAAA,EAAA;;;AENvB;;AAEG;;;;"}
|
|
@@ -3,7 +3,7 @@ import { inject, ChangeDetectorRef, Pipe, input, output, model, computed, Compon
|
|
|
3
3
|
import { Button } from '@masterteam/components/button';
|
|
4
4
|
import { distinctUntilChanged, filter, switchMap, map, catchError, finalize, tap } from 'rxjs/operators';
|
|
5
5
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
6
|
-
import { Subscription, BehaviorSubject, of, finalize as finalize$1, catchError as catchError$1, throwError
|
|
6
|
+
import { Subscription, BehaviorSubject, of, take, finalize as finalize$1, catchError as catchError$1, throwError } from 'rxjs';
|
|
7
7
|
import { HttpClient, HttpContext } from '@angular/common/http';
|
|
8
8
|
import { Avatar } from '@masterteam/components/avatar';
|
|
9
9
|
import * as i1 from '@jsverse/transloco';
|
|
@@ -236,7 +236,30 @@ class UploadField {
|
|
|
236
236
|
}
|
|
237
237
|
}
|
|
238
238
|
writeValue(value) {
|
|
239
|
-
|
|
239
|
+
if (value && typeof value === 'string') {
|
|
240
|
+
// Value is a string (file ID), fetch metadata
|
|
241
|
+
this.fetchMetadata(value);
|
|
242
|
+
}
|
|
243
|
+
else {
|
|
244
|
+
this.value.set(value);
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
fetchMetadata(fileId) {
|
|
248
|
+
this.loading.set(true);
|
|
249
|
+
const metadataUrl = `${this.endPoint()}/${fileId}/metaData`;
|
|
250
|
+
this.httpClient
|
|
251
|
+
.get(metadataUrl, {
|
|
252
|
+
context: this.context(),
|
|
253
|
+
})
|
|
254
|
+
.pipe(take(1), finalize$1(() => this.loading.set(false)), catchError$1((error) => {
|
|
255
|
+
console.error('Failed to fetch file metadata:', error);
|
|
256
|
+
// Set minimal value with just the ID so download might still work
|
|
257
|
+
this.value.set({ fileName: fileId, id: fileId });
|
|
258
|
+
return throwError(() => error);
|
|
259
|
+
}))
|
|
260
|
+
.subscribe((response) => {
|
|
261
|
+
this.value.set(response.data);
|
|
262
|
+
});
|
|
240
263
|
}
|
|
241
264
|
registerOnChange(fn) {
|
|
242
265
|
this.onModelChange = fn;
|
|
@@ -385,7 +408,7 @@ class UploadField {
|
|
|
385
408
|
}
|
|
386
409
|
}
|
|
387
410
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: UploadField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
388
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: UploadField, isStandalone: true, selector: "mt-upload-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, endPoint: { classPropertyName: "endPoint", publicName: "endPoint", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userImgClass: { classPropertyName: "userImgClass", publicName: "userImgClass", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, isDragging: { classPropertyName: "isDragging", publicName: "isDragging", isSignal: true, isRequired: false, transformFunction: null }, fileSizeLimit: { classPropertyName: "fileSizeLimit", publicName: "fileSizeLimit", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isDragging: "isDraggingChange", onChange: "onChange" }, ngImport: i0, template: "<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n", dependencies: [{ kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "component", type: UploadUserPreview, selector: "mt-upload-user-preview", inputs: ["value", "imgPath", "context", "loading", "uploadProgress", "isDragging", "disabled", "readonly", "size", "userImgClass"], outputs: ["onUploadInputClicked", "ondDownloadFile", "onDeleteFile", "onDragOver", "onDragLeave", "onDrop", "disabledChange"] }, { kind: "component", type: UploadFilePreview, selector: "mt-upload-file-preview", inputs: ["value", "imgPath", "context", "loading", "uploadProgress", "disabled", "readonly", "size"], outputs: ["onUploadInputClicked", "ondDownloadFile", "onDeleteFile", "disabledChange"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
|
|
411
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: UploadField, isStandalone: true, selector: "mt-upload-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, endPoint: { classPropertyName: "endPoint", publicName: "endPoint", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, userImgClass: { classPropertyName: "userImgClass", publicName: "userImgClass", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, isDragging: { classPropertyName: "isDragging", publicName: "isDragging", isSignal: true, isRequired: false, transformFunction: null }, fileSizeLimit: { classPropertyName: "fileSizeLimit", publicName: "fileSizeLimit", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isDragging: "isDraggingChange", onChange: "onChange" }, ngImport: i0, template: "<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value() && !loading()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n", dependencies: [{ kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "component", type: UploadUserPreview, selector: "mt-upload-user-preview", inputs: ["value", "imgPath", "context", "loading", "uploadProgress", "isDragging", "disabled", "readonly", "size", "userImgClass"], outputs: ["onUploadInputClicked", "ondDownloadFile", "onDeleteFile", "onDragOver", "onDragLeave", "onDrop", "disabledChange"] }, { kind: "component", type: UploadFilePreview, selector: "mt-upload-file-preview", inputs: ["value", "imgPath", "context", "loading", "uploadProgress", "disabled", "readonly", "size"], outputs: ["onUploadInputClicked", "ondDownloadFile", "onDeleteFile", "disabledChange"] }, { kind: "component", type: FieldValidation, selector: "mt-field-validation", inputs: ["control", "touched"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1.TranslocoPipe, name: "transloco" }] });
|
|
389
412
|
}
|
|
390
413
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: UploadField, decorators: [{
|
|
391
414
|
type: Component,
|
|
@@ -397,7 +420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
|
|
|
397
420
|
Card,
|
|
398
421
|
Button,
|
|
399
422
|
TranslocoModule,
|
|
400
|
-
], template: "<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n" }]
|
|
423
|
+
], template: "<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value() && !loading()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n" }]
|
|
401
424
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], endPoint: [{ type: i0.Input, args: [{ isSignal: true, alias: "endPoint", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], userImgClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "userImgClass", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], isDragging: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDragging", required: false }] }, { type: i0.Output, args: ["isDraggingChange"] }], fileSizeLimit: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileSizeLimit", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], onChange: [{ type: i0.Output, args: ["onChange"] }] } });
|
|
402
425
|
|
|
403
426
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masterteam-components-upload-field.mjs","sources":["../../../../packages/masterteam/components/upload-field/secure-image.pipe.ts","../../../../packages/masterteam/components/upload-field/upload-file-preview/upload-file-preview.ts","../../../../packages/masterteam/components/upload-field/upload-file-preview/upload-file-preview.html","../../../../packages/masterteam/components/upload-field/upload-user-preview/upload-user-preview.ts","../../../../packages/masterteam/components/upload-field/upload-user-preview/upload-user-preview.html","../../../../packages/masterteam/components/upload-field/upload-field.ts","../../../../packages/masterteam/components/upload-field/upload-field.html","../../../../packages/masterteam/components/upload-field/masterteam-components-upload-field.ts"],"sourcesContent":["import {\r\n filter,\r\n switchMap,\r\n map,\r\n catchError,\r\n tap,\r\n distinctUntilChanged,\r\n finalize,\r\n} from 'rxjs/operators';\r\nimport { DomSanitizer, SafeUrl } from '@angular/platform-browser';\r\nimport { Subscription, BehaviorSubject, of } from 'rxjs';\r\nimport {\r\n Pipe,\r\n PipeTransform,\r\n OnDestroy,\r\n ChangeDetectorRef,\r\n inject,\r\n} from '@angular/core';\r\nimport { HttpClient, HttpContext, HttpResponse } from '@angular/common/http';\r\n@Pipe({\r\n name: 'secureImage',\r\n pure: false,\r\n standalone: true,\r\n})\r\nexport class SecureImagePipe implements PipeTransform, OnDestroy {\r\n httpClient = inject(HttpClient);\r\n domSanitizer = inject(DomSanitizer);\r\n cdr = inject(ChangeDetectorRef);\r\n constructor() {\r\n this.setUpSubscription();\r\n }\r\n ngOnDestroy(): void {\r\n this.subscription.unsubscribe();\r\n }\r\n private subscription = new Subscription();\r\n private latestValue!: string | SafeUrl;\r\n private transformValue = new BehaviorSubject<string>('');\r\n private loading = true;\r\n private context: HttpContext | undefined;\r\n private wrapUrl = true;\r\n private useEndpoint = false;\r\n private endPoint = '';\r\n private sanitize = true;\r\n\r\n transform(\r\n imagePath: string,\r\n wrapUrlOrContext?: boolean | HttpContext,\r\n contextOrEndpoint?: HttpContext | string,\r\n endPoint: string = 'uploader/',\r\n ): string {\r\n const hasExtraArgs = arguments.length > 1;\r\n const isWrapFlag = typeof wrapUrlOrContext === 'boolean';\r\n\r\n this.context = undefined;\r\n this.wrapUrl = true;\r\n this.useEndpoint = false;\r\n this.endPoint = '';\r\n this.sanitize = true;\r\n\r\n if (!hasExtraArgs || isWrapFlag) {\r\n // Backward compatible mode: (imagePath, wrapUrl?, context?, endPoint?)\r\n this.wrapUrl = isWrapFlag ? wrapUrlOrContext : false;\r\n this.useEndpoint = true;\r\n this.endPoint = endPoint;\r\n if (contextOrEndpoint instanceof HttpContext) {\r\n this.context = contextOrEndpoint;\r\n } else if (typeof contextOrEndpoint === 'string') {\r\n this.endPoint = contextOrEndpoint;\r\n }\r\n this.sanitize = false;\r\n } else {\r\n // Components mode: (imagePath, context)\r\n this.context = wrapUrlOrContext as HttpContext | undefined;\r\n this.wrapUrl = true;\r\n this.useEndpoint = false;\r\n this.endPoint = '';\r\n this.sanitize = true;\r\n }\r\n\r\n const fullPath = this.useEndpoint\r\n ? imagePath\r\n ? this.endPoint + imagePath\r\n : ''\r\n : imagePath;\r\n this.transformValue.next(fullPath);\r\n\r\n if (this.loading || !this.latestValue) {\r\n return '';\r\n }\r\n\r\n if (!this.useEndpoint || this.wrapUrl) {\r\n return this.latestValue as string;\r\n }\r\n\r\n return `url('${this.latestValue}')`;\r\n }\r\n\r\n private setUpSubscription(): void {\r\n const transformSubscription = this.transformValue\r\n .asObservable()\r\n .pipe(\r\n distinctUntilChanged(),\r\n filter((v): v is string => !!v && !v.includes('null')),\r\n switchMap((imagePath: string) => {\r\n this.latestValue = '';\r\n this.loading = true;\r\n return this.httpClient\r\n .get(imagePath, {\r\n observe: 'response',\r\n responseType: 'blob',\r\n context: this.context,\r\n })\r\n .pipe(\r\n map((response: HttpResponse<any>) =>\r\n URL.createObjectURL(response.body),\r\n ),\r\n map((unsafeBlobUrl: string) =>\r\n this.sanitize\r\n ? this.domSanitizer.bypassSecurityTrustUrl(unsafeBlobUrl)\r\n : unsafeBlobUrl,\r\n ),\r\n filter((blobUrl) => blobUrl !== this.latestValue),\r\n catchError(() => of('')),\r\n finalize(() => (this.loading = false)),\r\n );\r\n }),\r\n tap((imagePath: string | SafeUrl) => {\r\n this.latestValue = imagePath;\r\n this.cdr.markForCheck();\r\n }),\r\n )\r\n .subscribe();\r\n this.subscription.add(transformSubscription);\r\n }\r\n}\r\n","import {\r\n Component,\r\n computed,\r\n input,\r\n model,\r\n OnInit,\r\n output,\r\n} from '@angular/core';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { SecureImagePipe } from '../secure-image.pipe';\r\nimport { Avatar } from '@masterteam/components/avatar';\r\nimport { HttpContext } from '@angular/common/http';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\n\r\n@Component({\r\n selector: 'mt-upload-file-preview',\r\n standalone: true,\r\n imports: [SecureImagePipe, Button, Avatar, TranslocoModule, Tooltip],\r\n templateUrl: './upload-file-preview.html',\r\n styleUrl: './upload-file-preview.scss',\r\n})\r\nexport class UploadFilePreview implements OnInit {\r\n value = input<any | null>(null);\r\n imgPath = input<any | undefined>();\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n loading = input<boolean>(false);\r\n uploadProgress = input<number>(0);\r\n onUploadInputClicked = output<any>();\r\n ondDownloadFile = output<any>();\r\n onDeleteFile = output<any>();\r\n readonly disabled = model<boolean>(false);\r\n readonly readonly = input<boolean>(false);\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n isImag = computed(() => {\r\n return this.value()?.contentType?.startsWith('image/');\r\n });\r\n ngOnInit(): void {\r\n if (this.readonly()) {\r\n this.disabled.set(true);\r\n }\r\n }\r\n defaultIcon = computed(() => {\r\n switch (this.value()?.extension) {\r\n case '.pdf':\r\n return 'file.file-06';\r\n case '.docx':\r\n case '.doc':\r\n return 'file.file-06';\r\n case '.xlsx':\r\n case '.xls':\r\n return 'file.file-06';\r\n default:\r\n return 'image.image-03';\r\n }\r\n });\r\n}\r\n","<div class=\"flex items-center justify-between gap-2 w-full p-2 overflow-hidden\">\r\n <div class=\"flex gap-2 items-center flex-1 min-w-0 overflow-hidden\">\r\n <mt-avatar\r\n [size]=\"size()\"\r\n [shape]=\"'square'\"\r\n [image]=\"\r\n isImag() && imgPath() ? (imgPath() | secureImage: context()) : ''\r\n \"\r\n [icon]=\"defaultIcon()\"\r\n styleClass=\"text-2xl!\"\r\n >\r\n </mt-avatar>\r\n\r\n <span class=\"truncate\" [mtTooltip]=\"value().name\" tooltipPosition=\"top\">\r\n {{ value().name }}\r\n </span>\r\n </div>\r\n <div class=\"flex items-center justify-center shrink-0\">\r\n @if (!disabled() && !!value() && !loading()) {\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.download-01\"\r\n [tooltip]=\"'components.upload.download' | transloco\"\r\n (onClick)=\"ondDownloadFile.emit(value())\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </mt-button>\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.trash-01\"\r\n [tooltip]=\"'components.upload.delete' | transloco\"\r\n severity=\"danger\"\r\n (onClick)=\"onDeleteFile.emit(true)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </mt-button>\r\n }\r\n </div>\r\n</div>\r\n","import { SecureImagePipe } from '../secure-image.pipe';\r\nimport { Icon } from '@masterteam/icons';\r\nimport { Component, input, model, OnInit, output, signal } from '@angular/core';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { Avatar } from '@masterteam/components/avatar';\r\nimport { HttpContext } from '@angular/common/http';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\n\r\n@Component({\r\n selector: 'mt-upload-user-preview',\r\n standalone: true,\r\n imports: [Icon, SecureImagePipe, Button, Icon, Avatar, TranslocoModule],\r\n templateUrl: './upload-user-preview.html',\r\n styleUrl: './upload-user-preview.css',\r\n})\r\nexport class UploadUserPreview implements OnInit {\r\n value = input<any | null>(null);\r\n imgPath = input<any | undefined>();\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n loading = input<boolean>(false);\r\n uploadProgress = input<number>(0);\r\n isDragging = input<boolean>(false);\r\n defaultIcon = signal<string>('image.image-03');\r\n onUploadInputClicked = output<any>();\r\n ondDownloadFile = output<any>();\r\n onDeleteFile = output<any>();\r\n onDragOver = output<any>();\r\n onDragLeave = output<any>();\r\n onDrop = output<any>();\r\n readonly disabled = model<boolean>(false);\r\n readonly readonly = input<boolean>(false);\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n readonly userImgClass = input<string>('');\r\n OnUploadInputClicked(): void {\r\n if (!this.imgPath() && !this.loading() && !this.disabled()) {\r\n this.onUploadInputClicked.emit(true);\r\n }\r\n }\r\n ngOnInit(): void {\r\n if (this.readonly()) {\r\n this.disabled.set(true);\r\n }\r\n }\r\n OnDragOver(event: DragEvent): void {\r\n this.onDragOver.emit(event);\r\n }\r\n OnDragLeave(event: DragEvent): void {\r\n this.onDragLeave.emit(event);\r\n }\r\n\r\n OnDrop(event: DragEvent): void {\r\n this.onDrop.emit(event);\r\n }\r\n}\r\n","<div\r\n class=\"rounded-full p-1 w-fit\"\r\n [style.background]=\"\r\n 'conic-gradient(var(--p-primary-300) ' +\r\n uploadProgress() +\r\n '%, transparent ' +\r\n uploadProgress() +\r\n '%)'\r\n \"\r\n>\r\n <div\r\n class=\"relative rounded-full w-fit border-2 border-dashed border-gray-300 bg-white\"\r\n [class.opacity-50]=\"isDragging()\"\r\n >\r\n <mt-avatar\r\n [size]=\"size()\"\r\n [image]=\"imgPath() ? (imgPath() | secureImage: context()) : ''\"\r\n [icon]=\"defaultIcon()\"\r\n [styleClass]=\"userImgClass()\"\r\n >\r\n </mt-avatar>\r\n\r\n @if (!loading()) {\r\n <div\r\n class=\"absolute inset-0 flex items-center justify-center rounded-full bg-surface-400/50 opacity-0 hover:opacity-100 transition-opacity\"\r\n [class]=\"!imgPath() && !disabled() ? 'cursor-pointer' : ''\"\r\n (click)=\"OnUploadInputClicked()\"\r\n (dragover)=\"OnDragOver($event)\"\r\n (dragleave)=\"OnDragLeave($event)\"\r\n (drop)=\"OnDrop($event)\"\r\n >\r\n @if (!disabled() && !!imgPath()) {\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.download-01\"\r\n [tooltip]=\"'components.upload.download' | transloco\"\r\n (onClick)=\"ondDownloadFile.emit(value())\"\r\n >\r\n </mt-button>\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.trash-01\"\r\n [tooltip]=\"'components.upload.delete' | transloco\"\r\n severity=\"danger\"\r\n (onClick)=\"onDeleteFile.emit(true)\"\r\n >\r\n </mt-button>\r\n }\r\n @if (!imgPath() && !disabled()) {\r\n <mt-icon\r\n icon=\"general.upload-01\"\r\n class=\"text-primary-400 text-xl\"\r\n ></mt-icon>\r\n }\r\n </div>\r\n } @else if (loading()) {\r\n <div\r\n class=\"absolute inset-0 flex items-center justify-center rounded-full bg-surface-400/50\"\r\n >\r\n @if (uploadProgress() === 100) {\r\n <mt-icon\r\n icon=\"general.check\"\r\n class=\"text-primary-400 text-2xl\"\r\n ></mt-icon>\r\n } @else {\r\n <small class=\"text-primary-300 font-bold text-lg\">{{\r\n uploadProgress() + \"%\"\r\n }}</small>\r\n }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n","import { UploadFilePreview } from './upload-file-preview/upload-file-preview';\r\nimport { UploadUserPreview } from './upload-user-preview/upload-user-preview';\r\nimport {\r\n Component,\r\n computed,\r\n inject,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NgControl, Validators } from '@angular/forms';\r\nimport { HttpClient, HttpContext } from '@angular/common/http';\r\nimport { Icon } from '@masterteam/icons';\r\nimport { catchError, finalize, take, throwError } from 'rxjs';\r\nimport { FieldValidation } from '@masterteam/components/field-validation';\r\nimport { Card } from '@masterteam/components/card';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\n\r\n@Component({\r\n selector: 'mt-upload-field',\r\n standalone: true,\r\n imports: [\r\n Icon,\r\n UploadUserPreview,\r\n UploadFilePreview,\r\n FieldValidation,\r\n Card,\r\n Button,\r\n TranslocoModule,\r\n ],\r\n templateUrl: './upload-field.html',\r\n})\r\nexport class UploadField implements ControlValueAccessor {\r\n readonly label = input<string>();\r\n readonly title = input<string>('Upload File');\r\n readonly description = input<string>('Click or drop a file to upload');\r\n readonly endPoint = input<string>('uploader');\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n readonly userImgClass = input<string | undefined>(\r\n 'w-25! h-25! text-4xl! text-gray-400!',\r\n );\r\n readonly shape = input<'circle' | 'field' | 'card'>('field');\r\n readonly accept = input<string | undefined>('.pdf,.doc,.docx,.xlsx,image/*');\r\n readonly isDragging = model<boolean>(false);\r\n readonly fileSizeLimit = input<number | undefined>();\r\n readonly = input<boolean>(false);\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n\r\n onChange = output<any>();\r\n requiredValidator = Validators.required;\r\n value = signal<any | null>(null);\r\n disabled = signal<boolean>(false);\r\n uploadProgress = signal<number>(0);\r\n httpClient = inject(HttpClient);\r\n loading = signal<boolean>(false);\r\n onTouched: () => void = () => {};\r\n onModelChange: (value: any[]) => void = () => {};\r\n public ngControl = inject(NgControl, { self: true });\r\n imgPath = computed(() => {\r\n if (this.value()?.fileName) {\r\n return this.value()?.fileName\r\n ? this.endPoint() + '/' + this.value().fileName\r\n : '';\r\n } else {\r\n return undefined;\r\n }\r\n });\r\n\r\n constructor() {\r\n if (this.ngControl) {\r\n this.ngControl.valueAccessor = this;\r\n }\r\n }\r\n\r\n writeValue(value: any[]) {\r\n this.value.set(value);\r\n }\r\n\r\n registerOnChange(fn: any) {\r\n this.onModelChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: any) {\r\n this.onTouched = fn;\r\n }\r\n\r\n setDisabledState(disabled: boolean) {\r\n this.disabled.set(disabled);\r\n }\r\n\r\n onAdd(item: any) {\r\n console.log('onAdd', item);\r\n if (!this.disabled()) {\r\n this.value.set(item);\r\n this.onModelChange(this.value() ?? null);\r\n this.onChange.emit(this.value());\r\n }\r\n }\r\n\r\n onDelete() {\r\n if (!this.disabled()) {\r\n console.log('onDelete');\r\n this.value.set(null);\r\n this.onModelChange(this.value() ?? null);\r\n this.onChange.emit(this.value());\r\n }\r\n }\r\n\r\n onFileSelect(event: any) {\r\n console.log('event', event);\r\n if (event.target.files.length) {\r\n this.value.set(null);\r\n const files: FileList = event.target.files;\r\n this.prepareImage(files);\r\n }\r\n }\r\n\r\n prepareImage(files: FileList) {\r\n this.ngControl.control?.setErrors({ uploading: true });\r\n\r\n if (files.length) {\r\n if (this.shape() === 'circle' && !files[0]?.type.startsWith('image/')) {\r\n this.ngControl.control?.setErrors({ invalidFileType: true });\r\n return;\r\n }\r\n this.uploadFile(files[0]);\r\n }\r\n }\r\n\r\n uploadFile(file: File) {\r\n this.loading.set(true);\r\n this.uploadProgress.set(10);\r\n\r\n const formData = new FormData();\r\n formData.append('file', file);\r\n\r\n this.httpClient\r\n .post<any>(this.endPoint(), formData, {\r\n // 1. Crucial options to report upload progress\r\n reportProgress: true,\r\n observe: 'events',\r\n context: this.context(),\r\n })\r\n .pipe(\r\n finalize(() => {\r\n setTimeout(() => {\r\n this.uploadProgress.set(0);\r\n this.loading.set(false);\r\n }, 700);\r\n }),\r\n catchError(() => {\r\n this.uploadProgress.set(0); // Reset on error\r\n return throwError(() => new Error('Upload failed'));\r\n }),\r\n )\r\n .subscribe((event: any) => {\r\n console.log('event', event);\r\n\r\n if (!event?.body) {\r\n if (event.total) {\r\n const percentDone = Math.round((100 * event.loaded) / event.total);\r\n this.uploadProgress.set(percentDone);\r\n console.log(`Upload Progress: ${percentDone}%`);\r\n }\r\n } else {\r\n this.uploadProgress.set(100);\r\n this.handleUploadDone({ ...event.body?.data, size: file.size });\r\n console.log('Upload Complete', event.body);\r\n }\r\n });\r\n }\r\n\r\n handleUploadDone(file: any) {\r\n if (file) {\r\n this.onAdd(file);\r\n if (this.fileSizeLimit() && file.size > this.fileSizeLimit()!) {\r\n this.ngControl.control?.setErrors({ fileSizeLimited: true });\r\n } else {\r\n this.ngControl.control?.setErrors(null);\r\n }\r\n console.log('this.ngControl.control', this.ngControl.control);\r\n }\r\n\r\n console.log('handleUploadDone', this.value());\r\n }\r\n\r\n downloadFile(value: any) {\r\n const downloadFileName = value?.name;\r\n const mimeType = value?.contentType;\r\n const storedFileName = value?.fileName;\r\n\r\n if (!storedFileName || !mimeType || !downloadFileName) {\r\n console.error('File metadata is incomplete. Cannot download.');\r\n return;\r\n }\r\n\r\n this.httpClient\r\n .get(this.imgPath()!, {\r\n responseType: 'blob',\r\n context: this.context(),\r\n })\r\n .pipe(take(1))\r\n .subscribe((res: Blob) => {\r\n const blob = new Blob([res], { type: mimeType });\r\n\r\n const data = window.URL.createObjectURL(blob);\r\n const link = document.createElement('a');\r\n link.href = data;\r\n\r\n link.download = downloadFileName;\r\n\r\n link.click();\r\n\r\n window.URL.revokeObjectURL(data);\r\n });\r\n }\r\n onDragOver(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n if (!this.disabled()) {\r\n this.isDragging.set(true);\r\n }\r\n }\r\n onDragLeave(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.isDragging.set(false);\r\n }\r\n\r\n onDrop(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.isDragging.set(false);\r\n\r\n if (this.disabled()) {\r\n return;\r\n }\r\n\r\n const files = event.dataTransfer?.files;\r\n if (files && files.length > 0) {\r\n const fileEvent = {\r\n target: {\r\n files: files,\r\n },\r\n } as unknown as Event;\r\n this.onFileSelect(fileEvent);\r\n }\r\n }\r\n}\r\n","<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["finalize","catchError"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"masterteam-components-upload-field.mjs","sources":["../../../../packages/masterteam/components/upload-field/secure-image.pipe.ts","../../../../packages/masterteam/components/upload-field/upload-file-preview/upload-file-preview.ts","../../../../packages/masterteam/components/upload-field/upload-file-preview/upload-file-preview.html","../../../../packages/masterteam/components/upload-field/upload-user-preview/upload-user-preview.ts","../../../../packages/masterteam/components/upload-field/upload-user-preview/upload-user-preview.html","../../../../packages/masterteam/components/upload-field/upload-field.ts","../../../../packages/masterteam/components/upload-field/upload-field.html","../../../../packages/masterteam/components/upload-field/masterteam-components-upload-field.ts"],"sourcesContent":["import {\r\n filter,\r\n switchMap,\r\n map,\r\n catchError,\r\n tap,\r\n distinctUntilChanged,\r\n finalize,\r\n} from 'rxjs/operators';\r\nimport { DomSanitizer, SafeUrl } from '@angular/platform-browser';\r\nimport { Subscription, BehaviorSubject, of } from 'rxjs';\r\nimport {\r\n Pipe,\r\n PipeTransform,\r\n OnDestroy,\r\n ChangeDetectorRef,\r\n inject,\r\n} from '@angular/core';\r\nimport { HttpClient, HttpContext, HttpResponse } from '@angular/common/http';\r\n@Pipe({\r\n name: 'secureImage',\r\n pure: false,\r\n standalone: true,\r\n})\r\nexport class SecureImagePipe implements PipeTransform, OnDestroy {\r\n httpClient = inject(HttpClient);\r\n domSanitizer = inject(DomSanitizer);\r\n cdr = inject(ChangeDetectorRef);\r\n constructor() {\r\n this.setUpSubscription();\r\n }\r\n ngOnDestroy(): void {\r\n this.subscription.unsubscribe();\r\n }\r\n private subscription = new Subscription();\r\n private latestValue!: string | SafeUrl;\r\n private transformValue = new BehaviorSubject<string>('');\r\n private loading = true;\r\n private context: HttpContext | undefined;\r\n private wrapUrl = true;\r\n private useEndpoint = false;\r\n private endPoint = '';\r\n private sanitize = true;\r\n\r\n transform(\r\n imagePath: string,\r\n wrapUrlOrContext?: boolean | HttpContext,\r\n contextOrEndpoint?: HttpContext | string,\r\n endPoint: string = 'uploader/',\r\n ): string {\r\n const hasExtraArgs = arguments.length > 1;\r\n const isWrapFlag = typeof wrapUrlOrContext === 'boolean';\r\n\r\n this.context = undefined;\r\n this.wrapUrl = true;\r\n this.useEndpoint = false;\r\n this.endPoint = '';\r\n this.sanitize = true;\r\n\r\n if (!hasExtraArgs || isWrapFlag) {\r\n // Backward compatible mode: (imagePath, wrapUrl?, context?, endPoint?)\r\n this.wrapUrl = isWrapFlag ? wrapUrlOrContext : false;\r\n this.useEndpoint = true;\r\n this.endPoint = endPoint;\r\n if (contextOrEndpoint instanceof HttpContext) {\r\n this.context = contextOrEndpoint;\r\n } else if (typeof contextOrEndpoint === 'string') {\r\n this.endPoint = contextOrEndpoint;\r\n }\r\n this.sanitize = false;\r\n } else {\r\n // Components mode: (imagePath, context)\r\n this.context = wrapUrlOrContext as HttpContext | undefined;\r\n this.wrapUrl = true;\r\n this.useEndpoint = false;\r\n this.endPoint = '';\r\n this.sanitize = true;\r\n }\r\n\r\n const fullPath = this.useEndpoint\r\n ? imagePath\r\n ? this.endPoint + imagePath\r\n : ''\r\n : imagePath;\r\n this.transformValue.next(fullPath);\r\n\r\n if (this.loading || !this.latestValue) {\r\n return '';\r\n }\r\n\r\n if (!this.useEndpoint || this.wrapUrl) {\r\n return this.latestValue as string;\r\n }\r\n\r\n return `url('${this.latestValue}')`;\r\n }\r\n\r\n private setUpSubscription(): void {\r\n const transformSubscription = this.transformValue\r\n .asObservable()\r\n .pipe(\r\n distinctUntilChanged(),\r\n filter((v): v is string => !!v && !v.includes('null')),\r\n switchMap((imagePath: string) => {\r\n this.latestValue = '';\r\n this.loading = true;\r\n return this.httpClient\r\n .get(imagePath, {\r\n observe: 'response',\r\n responseType: 'blob',\r\n context: this.context,\r\n })\r\n .pipe(\r\n map((response: HttpResponse<any>) =>\r\n URL.createObjectURL(response.body),\r\n ),\r\n map((unsafeBlobUrl: string) =>\r\n this.sanitize\r\n ? this.domSanitizer.bypassSecurityTrustUrl(unsafeBlobUrl)\r\n : unsafeBlobUrl,\r\n ),\r\n filter((blobUrl) => blobUrl !== this.latestValue),\r\n catchError(() => of('')),\r\n finalize(() => (this.loading = false)),\r\n );\r\n }),\r\n tap((imagePath: string | SafeUrl) => {\r\n this.latestValue = imagePath;\r\n this.cdr.markForCheck();\r\n }),\r\n )\r\n .subscribe();\r\n this.subscription.add(transformSubscription);\r\n }\r\n}\r\n","import {\r\n Component,\r\n computed,\r\n input,\r\n model,\r\n OnInit,\r\n output,\r\n} from '@angular/core';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { SecureImagePipe } from '../secure-image.pipe';\r\nimport { Avatar } from '@masterteam/components/avatar';\r\nimport { HttpContext } from '@angular/common/http';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\nimport { Tooltip } from '@masterteam/components/tooltip';\r\n\r\n@Component({\r\n selector: 'mt-upload-file-preview',\r\n standalone: true,\r\n imports: [SecureImagePipe, Button, Avatar, TranslocoModule, Tooltip],\r\n templateUrl: './upload-file-preview.html',\r\n styleUrl: './upload-file-preview.scss',\r\n})\r\nexport class UploadFilePreview implements OnInit {\r\n value = input<any | null>(null);\r\n imgPath = input<any | undefined>();\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n loading = input<boolean>(false);\r\n uploadProgress = input<number>(0);\r\n onUploadInputClicked = output<any>();\r\n ondDownloadFile = output<any>();\r\n onDeleteFile = output<any>();\r\n readonly disabled = model<boolean>(false);\r\n readonly readonly = input<boolean>(false);\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n isImag = computed(() => {\r\n return this.value()?.contentType?.startsWith('image/');\r\n });\r\n ngOnInit(): void {\r\n if (this.readonly()) {\r\n this.disabled.set(true);\r\n }\r\n }\r\n defaultIcon = computed(() => {\r\n switch (this.value()?.extension) {\r\n case '.pdf':\r\n return 'file.file-06';\r\n case '.docx':\r\n case '.doc':\r\n return 'file.file-06';\r\n case '.xlsx':\r\n case '.xls':\r\n return 'file.file-06';\r\n default:\r\n return 'image.image-03';\r\n }\r\n });\r\n}\r\n","<div class=\"flex items-center justify-between gap-2 w-full p-2 overflow-hidden\">\r\n <div class=\"flex gap-2 items-center flex-1 min-w-0 overflow-hidden\">\r\n <mt-avatar\r\n [size]=\"size()\"\r\n [shape]=\"'square'\"\r\n [image]=\"\r\n isImag() && imgPath() ? (imgPath() | secureImage: context()) : ''\r\n \"\r\n [icon]=\"defaultIcon()\"\r\n styleClass=\"text-2xl!\"\r\n >\r\n </mt-avatar>\r\n\r\n <span class=\"truncate\" [mtTooltip]=\"value().name\" tooltipPosition=\"top\">\r\n {{ value().name }}\r\n </span>\r\n </div>\r\n <div class=\"flex items-center justify-center shrink-0\">\r\n @if (!disabled() && !!value() && !loading()) {\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.download-01\"\r\n [tooltip]=\"'components.upload.download' | transloco\"\r\n (onClick)=\"ondDownloadFile.emit(value())\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </mt-button>\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.trash-01\"\r\n [tooltip]=\"'components.upload.delete' | transloco\"\r\n severity=\"danger\"\r\n (onClick)=\"onDeleteFile.emit(true)\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n </mt-button>\r\n }\r\n </div>\r\n</div>\r\n","import { SecureImagePipe } from '../secure-image.pipe';\r\nimport { Icon } from '@masterteam/icons';\r\nimport { Component, input, model, OnInit, output, signal } from '@angular/core';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { Avatar } from '@masterteam/components/avatar';\r\nimport { HttpContext } from '@angular/common/http';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\n\r\n@Component({\r\n selector: 'mt-upload-user-preview',\r\n standalone: true,\r\n imports: [Icon, SecureImagePipe, Button, Icon, Avatar, TranslocoModule],\r\n templateUrl: './upload-user-preview.html',\r\n styleUrl: './upload-user-preview.css',\r\n})\r\nexport class UploadUserPreview implements OnInit {\r\n value = input<any | null>(null);\r\n imgPath = input<any | undefined>();\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n loading = input<boolean>(false);\r\n uploadProgress = input<number>(0);\r\n isDragging = input<boolean>(false);\r\n defaultIcon = signal<string>('image.image-03');\r\n onUploadInputClicked = output<any>();\r\n ondDownloadFile = output<any>();\r\n onDeleteFile = output<any>();\r\n onDragOver = output<any>();\r\n onDragLeave = output<any>();\r\n onDrop = output<any>();\r\n readonly disabled = model<boolean>(false);\r\n readonly readonly = input<boolean>(false);\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n readonly userImgClass = input<string>('');\r\n OnUploadInputClicked(): void {\r\n if (!this.imgPath() && !this.loading() && !this.disabled()) {\r\n this.onUploadInputClicked.emit(true);\r\n }\r\n }\r\n ngOnInit(): void {\r\n if (this.readonly()) {\r\n this.disabled.set(true);\r\n }\r\n }\r\n OnDragOver(event: DragEvent): void {\r\n this.onDragOver.emit(event);\r\n }\r\n OnDragLeave(event: DragEvent): void {\r\n this.onDragLeave.emit(event);\r\n }\r\n\r\n OnDrop(event: DragEvent): void {\r\n this.onDrop.emit(event);\r\n }\r\n}\r\n","<div\r\n class=\"rounded-full p-1 w-fit\"\r\n [style.background]=\"\r\n 'conic-gradient(var(--p-primary-300) ' +\r\n uploadProgress() +\r\n '%, transparent ' +\r\n uploadProgress() +\r\n '%)'\r\n \"\r\n>\r\n <div\r\n class=\"relative rounded-full w-fit border-2 border-dashed border-gray-300 bg-white\"\r\n [class.opacity-50]=\"isDragging()\"\r\n >\r\n <mt-avatar\r\n [size]=\"size()\"\r\n [image]=\"imgPath() ? (imgPath() | secureImage: context()) : ''\"\r\n [icon]=\"defaultIcon()\"\r\n [styleClass]=\"userImgClass()\"\r\n >\r\n </mt-avatar>\r\n\r\n @if (!loading()) {\r\n <div\r\n class=\"absolute inset-0 flex items-center justify-center rounded-full bg-surface-400/50 opacity-0 hover:opacity-100 transition-opacity\"\r\n [class]=\"!imgPath() && !disabled() ? 'cursor-pointer' : ''\"\r\n (click)=\"OnUploadInputClicked()\"\r\n (dragover)=\"OnDragOver($event)\"\r\n (dragleave)=\"OnDragLeave($event)\"\r\n (drop)=\"OnDrop($event)\"\r\n >\r\n @if (!disabled() && !!imgPath()) {\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.download-01\"\r\n [tooltip]=\"'components.upload.download' | transloco\"\r\n (onClick)=\"ondDownloadFile.emit(value())\"\r\n >\r\n </mt-button>\r\n <mt-button\r\n variant=\"text\"\r\n icon=\"general.trash-01\"\r\n [tooltip]=\"'components.upload.delete' | transloco\"\r\n severity=\"danger\"\r\n (onClick)=\"onDeleteFile.emit(true)\"\r\n >\r\n </mt-button>\r\n }\r\n @if (!imgPath() && !disabled()) {\r\n <mt-icon\r\n icon=\"general.upload-01\"\r\n class=\"text-primary-400 text-xl\"\r\n ></mt-icon>\r\n }\r\n </div>\r\n } @else if (loading()) {\r\n <div\r\n class=\"absolute inset-0 flex items-center justify-center rounded-full bg-surface-400/50\"\r\n >\r\n @if (uploadProgress() === 100) {\r\n <mt-icon\r\n icon=\"general.check\"\r\n class=\"text-primary-400 text-2xl\"\r\n ></mt-icon>\r\n } @else {\r\n <small class=\"text-primary-300 font-bold text-lg\">{{\r\n uploadProgress() + \"%\"\r\n }}</small>\r\n }\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n","import { UploadFilePreview } from './upload-file-preview/upload-file-preview';\r\nimport { UploadUserPreview } from './upload-user-preview/upload-user-preview';\r\nimport {\r\n Component,\r\n computed,\r\n inject,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NgControl, Validators } from '@angular/forms';\r\nimport { HttpClient, HttpContext } from '@angular/common/http';\r\nimport { Icon } from '@masterteam/icons';\r\nimport { catchError, finalize, take, throwError } from 'rxjs';\r\nimport { FieldValidation } from '@masterteam/components/field-validation';\r\nimport { Card } from '@masterteam/components/card';\r\nimport { Button } from '@masterteam/components/button';\r\nimport { TranslocoModule } from '@jsverse/transloco';\r\n\r\ninterface FileMetadata {\r\n id: string;\r\n name: string;\r\n contentType: string;\r\n extension: string;\r\n fileName: string;\r\n size?: number;\r\n}\r\n\r\ninterface MetadataResponse {\r\n data: FileMetadata;\r\n}\r\n\r\n@Component({\r\n selector: 'mt-upload-field',\r\n standalone: true,\r\n imports: [\r\n Icon,\r\n UploadUserPreview,\r\n UploadFilePreview,\r\n FieldValidation,\r\n Card,\r\n Button,\r\n TranslocoModule,\r\n ],\r\n templateUrl: './upload-field.html',\r\n})\r\nexport class UploadField implements ControlValueAccessor {\r\n readonly label = input<string>();\r\n readonly title = input<string>('Upload File');\r\n readonly description = input<string>('Click or drop a file to upload');\r\n readonly endPoint = input<string>('uploader');\r\n readonly size = input<'normal' | 'large' | 'xlarge' | undefined>();\r\n readonly userImgClass = input<string | undefined>(\r\n 'w-25! h-25! text-4xl! text-gray-400!',\r\n );\r\n readonly shape = input<'circle' | 'field' | 'card'>('field');\r\n readonly accept = input<string | undefined>('.pdf,.doc,.docx,.xlsx,image/*');\r\n readonly isDragging = model<boolean>(false);\r\n readonly fileSizeLimit = input<number | undefined>();\r\n readonly = input<boolean>(false);\r\n readonly context = input<HttpContext | undefined>(undefined);\r\n\r\n onChange = output<any>();\r\n requiredValidator = Validators.required;\r\n value = signal<any | null>(null);\r\n disabled = signal<boolean>(false);\r\n uploadProgress = signal<number>(0);\r\n httpClient = inject(HttpClient);\r\n loading = signal<boolean>(false);\r\n onTouched: () => void = () => {};\r\n onModelChange: (value: any[]) => void = () => {};\r\n public ngControl = inject(NgControl, { self: true });\r\n imgPath = computed(() => {\r\n if (this.value()?.fileName) {\r\n return this.value()?.fileName\r\n ? this.endPoint() + '/' + this.value().fileName\r\n : '';\r\n } else {\r\n return undefined;\r\n }\r\n });\r\n\r\n constructor() {\r\n if (this.ngControl) {\r\n this.ngControl.valueAccessor = this;\r\n }\r\n }\r\n\r\n writeValue(value: any) {\r\n if (value && typeof value === 'string') {\r\n // Value is a string (file ID), fetch metadata\r\n this.fetchMetadata(value);\r\n } else {\r\n this.value.set(value);\r\n }\r\n }\r\n\r\n private fetchMetadata(fileId: string): void {\r\n this.loading.set(true);\r\n const metadataUrl = `${this.endPoint()}/${fileId}/metaData`;\r\n\r\n this.httpClient\r\n .get<MetadataResponse>(metadataUrl, {\r\n context: this.context(),\r\n })\r\n .pipe(\r\n take(1),\r\n finalize(() => this.loading.set(false)),\r\n catchError((error) => {\r\n console.error('Failed to fetch file metadata:', error);\r\n // Set minimal value with just the ID so download might still work\r\n this.value.set({ fileName: fileId, id: fileId });\r\n return throwError(() => error);\r\n }),\r\n )\r\n .subscribe((response) => {\r\n this.value.set(response.data);\r\n });\r\n }\r\n\r\n registerOnChange(fn: any) {\r\n this.onModelChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: any) {\r\n this.onTouched = fn;\r\n }\r\n\r\n setDisabledState(disabled: boolean) {\r\n this.disabled.set(disabled);\r\n }\r\n\r\n onAdd(item: any) {\r\n console.log('onAdd', item);\r\n if (!this.disabled()) {\r\n this.value.set(item);\r\n this.onModelChange(this.value() ?? null);\r\n this.onChange.emit(this.value());\r\n }\r\n }\r\n\r\n onDelete() {\r\n if (!this.disabled()) {\r\n console.log('onDelete');\r\n this.value.set(null);\r\n this.onModelChange(this.value() ?? null);\r\n this.onChange.emit(this.value());\r\n }\r\n }\r\n\r\n onFileSelect(event: any) {\r\n console.log('event', event);\r\n if (event.target.files.length) {\r\n this.value.set(null);\r\n const files: FileList = event.target.files;\r\n this.prepareImage(files);\r\n }\r\n }\r\n\r\n prepareImage(files: FileList) {\r\n this.ngControl.control?.setErrors({ uploading: true });\r\n\r\n if (files.length) {\r\n if (this.shape() === 'circle' && !files[0]?.type.startsWith('image/')) {\r\n this.ngControl.control?.setErrors({ invalidFileType: true });\r\n return;\r\n }\r\n this.uploadFile(files[0]);\r\n }\r\n }\r\n\r\n uploadFile(file: File) {\r\n this.loading.set(true);\r\n this.uploadProgress.set(10);\r\n\r\n const formData = new FormData();\r\n formData.append('file', file);\r\n\r\n this.httpClient\r\n .post<any>(this.endPoint(), formData, {\r\n // 1. Crucial options to report upload progress\r\n reportProgress: true,\r\n observe: 'events',\r\n context: this.context(),\r\n })\r\n .pipe(\r\n finalize(() => {\r\n setTimeout(() => {\r\n this.uploadProgress.set(0);\r\n this.loading.set(false);\r\n }, 700);\r\n }),\r\n catchError(() => {\r\n this.uploadProgress.set(0); // Reset on error\r\n return throwError(() => new Error('Upload failed'));\r\n }),\r\n )\r\n .subscribe((event: any) => {\r\n console.log('event', event);\r\n\r\n if (!event?.body) {\r\n if (event.total) {\r\n const percentDone = Math.round((100 * event.loaded) / event.total);\r\n this.uploadProgress.set(percentDone);\r\n console.log(`Upload Progress: ${percentDone}%`);\r\n }\r\n } else {\r\n this.uploadProgress.set(100);\r\n this.handleUploadDone({ ...event.body?.data, size: file.size });\r\n console.log('Upload Complete', event.body);\r\n }\r\n });\r\n }\r\n\r\n handleUploadDone(file: any) {\r\n if (file) {\r\n this.onAdd(file);\r\n if (this.fileSizeLimit() && file.size > this.fileSizeLimit()!) {\r\n this.ngControl.control?.setErrors({ fileSizeLimited: true });\r\n } else {\r\n this.ngControl.control?.setErrors(null);\r\n }\r\n console.log('this.ngControl.control', this.ngControl.control);\r\n }\r\n\r\n console.log('handleUploadDone', this.value());\r\n }\r\n\r\n downloadFile(value: any) {\r\n const downloadFileName = value?.name;\r\n const mimeType = value?.contentType;\r\n const storedFileName = value?.fileName;\r\n\r\n if (!storedFileName || !mimeType || !downloadFileName) {\r\n console.error('File metadata is incomplete. Cannot download.');\r\n return;\r\n }\r\n\r\n this.httpClient\r\n .get(this.imgPath()!, {\r\n responseType: 'blob',\r\n context: this.context(),\r\n })\r\n .pipe(take(1))\r\n .subscribe((res: Blob) => {\r\n const blob = new Blob([res], { type: mimeType });\r\n\r\n const data = window.URL.createObjectURL(blob);\r\n const link = document.createElement('a');\r\n link.href = data;\r\n\r\n link.download = downloadFileName;\r\n\r\n link.click();\r\n\r\n window.URL.revokeObjectURL(data);\r\n });\r\n }\r\n onDragOver(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n if (!this.disabled()) {\r\n this.isDragging.set(true);\r\n }\r\n }\r\n onDragLeave(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.isDragging.set(false);\r\n }\r\n\r\n onDrop(event: DragEvent): void {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n this.isDragging.set(false);\r\n\r\n if (this.disabled()) {\r\n return;\r\n }\r\n\r\n const files = event.dataTransfer?.files;\r\n if (files && files.length > 0) {\r\n const fileEvent = {\r\n target: {\r\n files: files,\r\n },\r\n } as unknown as Event;\r\n this.onFileSelect(fileEvent);\r\n }\r\n }\r\n}\r\n","<input\r\n #uploadInput\r\n type=\"file\"\r\n name=\"file[]\"\r\n (change)=\"onFileSelect($event)\"\r\n style=\"display: none\"\r\n [accept]=\"shape() === 'circle' ? 'image/*' : accept()\"\r\n/>\r\n\r\n@if (shape() === \"circle\") {\r\n <div class=\"flex flex-col items-center gap-2 w-full\">\r\n <div class=\"flex\">\r\n <div class=\"flex flex-col items-center\">\r\n <mt-upload-user-preview\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [size]=\"size()\"\r\n [context]=\"context()\"\r\n [userImgClass]=\"userImgClass()\"\r\n [isDragging]=\"isDragging()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n (onDragOver)=\"onDragOver($event)\"\r\n (onDragLeave)=\"onDragLeave($event)\"\r\n (onDrop)=\"onDrop($event)\"\r\n ></mt-upload-user-preview>\r\n @if (label()) {\r\n <label\r\n [class.required]=\"\r\n ngControl?.control?.hasValidator(requiredValidator)\r\n \"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n} @else if (shape() === \"card\") {\r\n <mt-card\r\n headless\r\n class=\"border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n >\r\n <div class=\"content flex flex-col gap-5 items-center text-center\">\r\n @if (!value() && !loading()) {\r\n <div class=\"flex flex-col gap-1\">\r\n @if (title()) {\r\n <div class=\"title text-lg font-semibold\">\r\n {{ title() }}\r\n </div>\r\n }\r\n @if (description()) {\r\n <div\r\n class=\"description text-sm text-muted-foreground secondary text-surface-500\"\r\n >\r\n {{ description() }}\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <mt-button\r\n [size]=\"'small'\"\r\n [label]=\"'components.upload.upload' | transloco\"\r\n [icon]=\"'general.upload-01'\"\r\n (onClick)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [disabled]=\"disabled() || loading() || readonly()\"\r\n />\r\n }\r\n }\r\n </div>\r\n </mt-card>\r\n} @else {\r\n <div class=\"flex flex-col items-start gap-2 w-full\">\r\n @if (label()) {\r\n <label\r\n [class.required]=\"ngControl?.control?.hasValidator(requiredValidator)\"\r\n [for]=\"ngControl?.name || label()\"\r\n >{{ label() }}</label\r\n >\r\n }\r\n\r\n <div\r\n class=\"w-full flex gap-3 items-center justify-center border-2 border-dashed border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50\"\r\n [class]=\"this.disabled() ? 'bg-gray-50' : ''\"\r\n (click)=\"\r\n !this.loading() && !this.disabled() && !this.readonly()\r\n ? uploadInput.click()\r\n : ''\r\n \"\r\n [class.border-blue-500]=\"isDragging()\"\r\n [class.bg-blue-50]=\"isDragging()\"\r\n (dragover)=\"onDragOver($event)\"\r\n (dragleave)=\"onDragLeave($event)\"\r\n (drop)=\"onDrop($event)\"\r\n >\r\n @if (value()) {\r\n <mt-upload-file-preview\r\n style=\"width: 100%\"\r\n [value]=\"value()\"\r\n [imgPath]=\"imgPath()\"\r\n [disabled]=\"disabled()\"\r\n [readonly]=\"readonly()\"\r\n [loading]=\"loading()\"\r\n [context]=\"context()\"\r\n [uploadProgress]=\"uploadProgress()\"\r\n (onUploadInputClicked)=\"uploadInput.click()\"\r\n (ondDownloadFile)=\"downloadFile($event)\"\r\n (onDeleteFile)=\"onDelete()\"\r\n />\r\n } @else {\r\n @if (loading()) {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <p class=\"text-lg text-gray-500\">\r\n {{\r\n (\"components.upload.uploading\" | transloco) +\r\n uploadProgress() +\r\n \"%\"\r\n }}\r\n </p>\r\n </div>\r\n } @else {\r\n <div class=\"w-full flex gap-3 items-center justify-center p-3\">\r\n <mt-icon icon=\"general.upload-01\" />\r\n <p class=\"text-lg text-gray-500\">\r\n {{ \"components.upload.clickOrDrop\" | transloco }}\r\n </p>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n<mt-field-validation [control]=\"ngControl?.control\"></mt-field-validation>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["finalize","catchError"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -11,13 +11,16 @@ interface ClientPageMenuItem {
|
|
|
11
11
|
declare class ClientPageMenu {
|
|
12
12
|
/** List of menu items to display */
|
|
13
13
|
readonly menuItems: _angular_core.InputSignal<ClientPageMenuItem[]>;
|
|
14
|
+
/** Whether menu items are loading */
|
|
15
|
+
readonly loading: _angular_core.InputSignal<boolean>;
|
|
14
16
|
/** Currently selected menu item */
|
|
15
17
|
readonly selectedItem: _angular_core.InputSignal<ClientPageMenuItem | null>;
|
|
16
18
|
/** Emitted when a menu item is clicked */
|
|
17
19
|
readonly menuItemClick: _angular_core.OutputEmitterRef<ClientPageMenuItem>;
|
|
18
20
|
selectItem(item: ClientPageMenuItem): void;
|
|
21
|
+
getAvatarStyle(color: string): Record<string, string>;
|
|
19
22
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ClientPageMenu, never>;
|
|
20
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClientPageMenu, "mt-client-page-menu", never, { "menuItems": { "alias": "menuItems"; "required": false; "isSignal": true; }; "selectedItem": { "alias": "selectedItem"; "required": false; "isSignal": true; }; }, { "menuItemClick": "menuItemClick"; }, never, never, true, never>;
|
|
23
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ClientPageMenu, "mt-client-page-menu", never, { "menuItems": { "alias": "menuItems"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "selectedItem": { "alias": "selectedItem"; "required": false; "isSignal": true; }; }, { "menuItemClick": "menuItemClick"; }, never, never, true, never>;
|
|
21
24
|
}
|
|
22
25
|
|
|
23
26
|
export { ClientPageMenu };
|