{{ title }}
\n {{ message }}
\n {{ payload?.finishedLabel || 'Saved' }}
\n \n \n\n","import { Component, Inject, OnInit } from '@angular/core';\nimport { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';\n\n@Component({\n selector: 'metron-success-snack-bar',\n templateUrl: './success-snack-bar.component.html',\n styleUrls: ['./success-snack-bar.component.scss'],\n standalone: false\n})\nexport class SuccessSnackBarComponent implements OnInit {\n constructor(\n @Inject(MAT_SNACK_BAR_DATA) public data: any,\n private snackBarRef: MatSnackBarRef\n @for (file of form?.get('files')?.value; track file.id; let i = $index) {\n \n close\n \n
\n \n \n }\n \n\n","export class MimeType {\n static readonly PPTX =\n 'application/vnd.openxmlformats-officedocument.presentationml.presentation';\n\n static readonly CSV = 'text/csv';\n static readonly JPG = 'image/jpg';\n static readonly JPEG = 'image/jpeg';\n static readonly PNG = 'image/png';\n static readonly BMP = 'image/bmp';\n static readonly GIF = 'image/gif';\n static readonly WEBP = 'image/webp';\n static readonly SVG = 'image/svg+xml';\n\n static readonly VIDEO_MOV = 'video/quicktime';\n static readonly VIDEO_AVI = 'video/x-msvideo';\n static readonly VIDEO_MP4 = 'video/mp4';\n static readonly VIDEO_MPEG = 'video/mpeg';\n static readonly VIDEO_OGG = 'video/ogg';\n static readonly VIDEO_WEBM = 'video/webm';\n\n static readonly APPLICATION_PDF = 'application/pdf';\n static readonly APPLICATION_ZIP = 'application/zip';\n static readonly APPLICATION_JSON = 'application/json';\n static readonly APPLICATION_SQLITE = 'application/vnd.sqlite3';\n static readonly DOCUMENT_WORD = 'application/msword';\n static readonly DOCUMENT_WORD_OPEN_XML =\n 'application/vnd.openxmlformats-officedocument.wordprocessingml.document';\n static readonly DOCUMENT_EXCEL = 'application/vnd.ms-excel';\n static readonly DOCUMENT_EXCEL_WITH_MACRO =\n 'application/vnd.ms-excel.sheet.macroenabled.12';\n static readonly DOCUMENT_EXCEL_OPEN_XML =\n 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';\n static readonly DOCUMENT_POWERPOINT = 'application/vnd.ms-powerpoint';\n static readonly DOCUMENT_POWERPOINT_OPEN_XML =\n 'application/vnd.openxmlformats-officedocument.presentationml.presentation';\n\n static readonly DOCUMENT_APPLE_PAGES = '.pages';\n static readonly DOCUMENT_APPLE_NUMBERS = '.numbers';\n static readonly DOCUMENT_APPLE_KEYNOTE = '.keynote';\n\n static imageMimeTypes = [\n MimeType.JPG,\n MimeType.JPEG,\n MimeType.PNG,\n MimeType.BMP,\n MimeType.WEBP,\n MimeType.SVG,\n ];\n\n static videoMimeTypes = [\n MimeType.VIDEO_MOV,\n MimeType.VIDEO_AVI,\n MimeType.VIDEO_MP4,\n MimeType.VIDEO_MPEG,\n MimeType.VIDEO_OGG,\n MimeType.VIDEO_WEBM,\n ];\n\n static documentMimeTypes = [\n MimeType.CSV,\n MimeType.APPLICATION_JSON,\n MimeType.APPLICATION_PDF,\n MimeType.DOCUMENT_WORD,\n MimeType.DOCUMENT_WORD_OPEN_XML,\n MimeType.DOCUMENT_EXCEL_OPEN_XML,\n MimeType.DOCUMENT_EXCEL,\n MimeType.DOCUMENT_POWERPOINT,\n MimeType.DOCUMENT_POWERPOINT_OPEN_XML,\n MimeType.DOCUMENT_APPLE_PAGES,\n MimeType.DOCUMENT_APPLE_NUMBERS,\n MimeType.DOCUMENT_APPLE_KEYNOTE,\n MimeType.DOCUMENT_EXCEL_WITH_MACRO,\n ];\n\n static officeMimeTypes = [\n MimeType.DOCUMENT_WORD,\n MimeType.DOCUMENT_WORD_OPEN_XML,\n MimeType.DOCUMENT_EXCEL_OPEN_XML,\n MimeType.DOCUMENT_EXCEL,\n MimeType.DOCUMENT_POWERPOINT,\n MimeType.DOCUMENT_POWERPOINT_OPEN_XML,\n MimeType.DOCUMENT_EXCEL_WITH_MACRO,\n ];\n\n static isImage(mimeType: string): boolean {\n return MimeType.imageMimeTypes.includes(mimeType);\n }\n\n static isDocument(mimeType: string): boolean {\n return MimeType.documentMimeTypes.includes(mimeType);\n }\n\n static getValuesWithExt(): Map\n \n
\n \n
\n \n {{ file.type ? (file.type | geoGetFileMimeTypeClass) : 'draft'}}\n\n
\n \n \n {{ (file?.size * (fileList?.[i]?.uploadingProgress / 100) | filesizeFormat) }}\n / {{ file.size | filesizeFormat }}\n
\n {{ file.name }}
\n\n \n {{ file.lastModified | date: 'dd MMM, yyyy' }}\n at {{ file.lastModified | date: 'hh:mm' }}・\n {{ file.size | filesizeFormat }}\n
\n \n \n
\n \n
\n\n\n {{ dialogData?.file?.name }}\n
\n\n\n \n
\n\n \n \n \n \n
\n \n \n \n \n
\n \n \n {{ file?.modified | date }}\n \n \n {{ file?.description }}\n \n
\n \n \n\n\n\n {{ file?.name || '' }}\n
\n \n \n \n More info\n \n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n \n \n
\n \n \n \n \n
\n\n \n \n \n \n
\n \n \n \n
\n \n \n \n \n {{ file?.description }}\n
\n \n {{ file?.name || fileName || '' }}\n
\n \n
\n \n \n \n {{ (file?.createdAt || file?.lastModifiedDat || file?.modified) | date: 'dd MMMM, yyyy \\'at\\' HH:mm' }}\n
\n \n {{ file?.size || 0 | filesizeFormat }}
\n \n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n\n\n\n \n \n
\n\n \n \n \n \n
\n \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n\n","import {Component, Input, OnInit} from '@angular/core';\n\n@Component({\n selector: 'metron-content-loader',\n templateUrl: './content-loader.component.html',\n styleUrls: ['./content-loader.component.scss'],\n standalone: false\n})\nexport class ContentLoaderComponent implements OnInit {\n @Input() backgroundClass: string;\n @Input() text: string;\n @Input() height: string;\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","\n
\n","import { Component, Input, OnInit } from '@angular/core';\n\n@Component({\n selector: 'geo-skeleton',\n templateUrl: './skeleton.component.html',\n styleUrls: ['./skeleton.component.scss'],\n standalone: false\n})\nexport class SkeletonComponent implements OnInit {\n\n @Input() variant: string;\n @Input() height: string;\n @Input() width: string;\n @Input() backgroundColor: string;\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","\n","import {\n Component,\n OnInit,\n ChangeDetectionStrategy,\n Inject,\n} from '@angular/core';\nimport { MAT_DIALOG_DATA } from '@angular/material/dialog';\n\nexport interface InformativeDialogData {\n title: string;\n subtitle: string;\n text: string;\n showClose: boolean;\n buttonType?: string;\n primaryButtonText?: string;\n secondaryButtonText?: string;\n}\n\n@Component({\n selector: 'geo-informative-dialog',\n templateUrl: './informative-dialog.component.html',\n styleUrls: ['./informative-dialog.component.scss'],\n standalone: false\n})\nexport class InformativeDialogComponent implements OnInit {\n data: InformativeDialogData;\n constructor(\n @Inject(MAT_DIALOG_DATA)\n readonly dialogData: InformativeDialogData\n ) {}\n\n ngOnInit(): void {\n this.data = this.dialogData;\n }\n}\n","\n
\n{{text}}
\n \n
\n{{data?.title}}
\n{{data?.subtitle}}
\n \n close\n
\n\n {{data?.text}}\n
\n\n
\n{{data?.title}}
\n{{data?.subtitle}}
\n \n \n
\n\n {{ labelText }} \n 0\">\n info\n \n
\n\n \n {{ item[dropdownSettings.labelKey ?? 'itemName'] }}\n \n × \n
\n \n \n \n +{{ items.length - dropdownSettings.badgeShowLimit }}\n \n
\n \n
\n \n \n \n \n
\n \n \n \n
\n\n\n \n
\n","import { FileItem } from './file-item.model';\n\nexport class FileUploadSettings {\n readonly disabled: boolean;\n readonly fileInfo: FileItem;\n readonly editMode: boolean;\n readonly isMultipleFileUpload: boolean;\n readonly fileDetails: boolean;\n readonly showIcon: boolean;\n readonly iconClass: string;\n readonly showButton: boolean;\n readonly buttonIconClass: string;\n readonly buttonText: string;\n readonly objectFit: string;\n readonly formClass: string;\n readonly shape: string;\n readonly height: string;\n readonly width: string;\n readonly borderColor: string;\n readonly title: string;\n readonly description: string;\n readonly accept: string;\n readonly lightbox: boolean;\n readonly maxFileSize: number;\n}\n","// Pipes\nexport * from './models/basic-chart-series.model';\nexport * from './models/treemap-series.model';\nexport * from './models/chart-draggable-settings.model';\nexport * from './models/chart-tooltip-settings.model';\nexport * from './models/select-input.model';\nexport * from './models/select-input-settings.model';\nexport * from './models/file-upload-settings.model';\nexport * from './models/file-upload-pending.model';\n","import {\n AfterViewInit,\n Directive,\n HostBinding,\n Input,\n OnChanges,\n SimpleChanges,\n} from '@angular/core';\n\n@Directive({\n selector: '[geoBackgroundImage]',\n standalone: false\n})\nexport class BackgroundImageDirective implements AfterViewInit, OnChanges {\n @HostBinding('style.backgroundImage') backgroundImage: string;\n\n @Input() geoBackgroundImage: string;\n\n constructor() {}\n\n ngAfterViewInit(): void {\n this.setBackgroundImage();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if (changes['geoBackgroundImage']) {\n this.setBackgroundImage();\n }\n }\n\n setBackgroundImage(): void {\n if (!this.geoBackgroundImage) {\n this.backgroundImage = 'none';\n return;\n }\n this.backgroundImage = 'url(' + this.geoBackgroundImage + ')';\n }\n}\n","import { NgModule } from '@angular/core';\n\nimport { MatAutocompleteModule } from '@angular/material/autocomplete';\nimport { MatBadgeModule } from '@angular/material/badge';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatButtonToggleModule } from '@angular/material/button-toggle';\nimport { MatCardModule } from '@angular/material/card';\nimport { MatCheckboxModule } from '@angular/material/checkbox';\nimport { MatChipsModule } from '@angular/material/chips';\nimport { MatNativeDateModule, MatRippleModule } from '@angular/material/core';\nimport { MatDatepickerModule } from '@angular/material/datepicker';\nimport {\n MatDialogModule,\n MAT_DIALOG_DEFAULT_OPTIONS,\n} from '@angular/material/dialog';\nimport { MatExpansionModule } from '@angular/material/expansion';\nimport { MatGridListModule } from '@angular/material/grid-list';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatListModule } from '@angular/material/list';\nimport { MatPaginatorModule } from '@angular/material/paginator';\nimport { MatProgressBarModule } from '@angular/material/progress-bar';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\nimport { MatRadioModule } from '@angular/material/radio';\nimport { MatSelectModule } from '@angular/material/select';\nimport { MatSidenavModule } from '@angular/material/sidenav';\nimport { MatSlideToggleModule } from '@angular/material/slide-toggle';\nimport { MatSliderModule } from '@angular/material/slider';\nimport { MatSnackBarModule } from '@angular/material/snack-bar';\nimport { MatSortModule } from '@angular/material/sort';\nimport { MatStepperModule } from '@angular/material/stepper';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatTabsModule } from '@angular/material/tabs';\nimport { MatToolbarModule } from '@angular/material/toolbar';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { DragDropModule } from '@angular/cdk/drag-drop';\nimport { ScrollingModule } from '@angular/cdk/scrolling';\nimport { MatMenuModule } from '@angular/material/menu';\nimport { ClipboardModule } from '@angular/cdk/clipboard';\n\n@NgModule({\n imports: [\n MatInputModule,\n MatCardModule,\n MatButtonModule,\n MatListModule,\n MatSidenavModule,\n MatIconModule,\n MatToolbarModule,\n MatProgressSpinnerModule,\n MatSnackBarModule,\n MatTableModule,\n MatPaginatorModule,\n MatSortModule,\n MatChipsModule,\n MatSelectModule,\n MatDialogModule,\n MatTabsModule,\n MatDatepickerModule,\n MatNativeDateModule,\n MatStepperModule,\n MatGridListModule,\n MatCheckboxModule,\n MatButtonToggleModule,\n MatProgressBarModule,\n MatSliderModule,\n MatSlideToggleModule,\n MatExpansionModule,\n DragDropModule,\n MatTooltipModule,\n MatRadioModule,\n MatAutocompleteModule,\n MatBadgeModule,\n ScrollingModule,\n MatRippleModule,\n ClipboardModule,\n ],\n exports: [\n MatInputModule,\n MatCardModule,\n MatButtonModule,\n MatSidenavModule,\n MatListModule,\n MatIconModule,\n MatToolbarModule,\n MatProgressSpinnerModule,\n MatSnackBarModule,\n MatTableModule,\n MatPaginatorModule,\n MatSortModule,\n MatChipsModule,\n MatSelectModule,\n MatDialogModule,\n MatTabsModule,\n MatDatepickerModule,\n MatNativeDateModule,\n MatStepperModule,\n MatGridListModule,\n MatCheckboxModule,\n MatButtonToggleModule,\n MatProgressBarModule,\n MatSliderModule,\n MatSlideToggleModule,\n MatExpansionModule,\n DragDropModule,\n MatTooltipModule,\n MatRadioModule,\n MatAutocompleteModule,\n MatBadgeModule,\n ScrollingModule,\n MatRippleModule,\n MatMenuModule,\n ClipboardModule,\n ],\n providers: [\n {\n provide: MAT_DIALOG_DEFAULT_OPTIONS,\n useValue: { disableClose: true, hasBackdrop: true },\n },\n ],\n})\nexport class MaterialModule {}\n","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'metron-divider',\n templateUrl: './divider.component.html',\n styleUrls: ['./divider.component.css'],\n standalone: false\n})\nexport class DividerComponent {\n @Input() text: string;\n}\n","\n\n {{text}}\n
\n","import { Component, Input, OnInit } from '@angular/core';\n\n@Component({\n selector: 'metron-avatar',\n templateUrl: './avatar.component.html',\n styleUrl: './avatar.component.scss',\n standalone: false\n})\nexport class AvatarComponent implements OnInit{\n @Input() imageSrc: string | null = null;\n @Input() name: string | null = null;\n @Input() size: 'xs' | 's' | 'm' | 'l' = 'm';\n @Input() tooltipEnabled = true;\n @Input() tooltipPosition: 'above' | 'below' | 'left' | 'right' = 'above';\n @Input() disabled = false;\n backgroundColor: string;\n\n ngOnInit(): void {\n if (!this.imageSrc) {\n this.backgroundColor = this.getBackgroundColor();\n }\n }\n\n get avatarSize(): string {\n switch (this.size) {\n case 'xs': return 'avatar-xs';\n case 's': return 'avatar-s';\n case 'm': return 'avatar-m';\n case 'l': return 'avatar-l';\n default: return 'avatar-m';\n }\n }\n\n getInitial(): string {\n if (!this.name) {\n return '';\n }\n return this.name.charAt(0).toUpperCase();\n }\n\n getBackgroundColor(): string {\n const colorIndex = this.hashString(this.name) % 9 + 1;\n return `var(--color-data-0${colorIndex}-default)`;\n }\n\n // Method to generate a CSS class for the background color\n get backgroundColorClass(): string {\n const colorIndex = this.hashString(this.name) % 9 + 1;\n return `bg-color-data-0${colorIndex}`;\n }\n\n // Hash function to create a deterministic index from the name\n hashString(str: string): number {\n let hash = 0;\n for (let i = 0; i < str.length; i++) {\n hash = (hash * 31 + str.charCodeAt(i)) >>> 0;\n }\n return Math.abs(hash);\n }\n\n // Construct the class string dynamically\n get avatarClasses(): string {\n let classes = this.avatarSize;\n if (this.disabled) {\n classes += ' disabled';\n }\n if (this.backgroundColorClass) {\n classes += ` ${this.backgroundColorClass}`;\n }\n return classes.trim();\n }\n}\n","\n \n \n ![]()
\n \n \n \n
\n","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'metron-avatar-icon',\n templateUrl: './avatar-icon.component.html',\n styleUrl: './avatar-icon.component.scss',\n standalone: false\n})\nexport class AvatarIconComponent {\n @Input() title: string | null = null;\n @Input() iconClass: string | null = null;\n @Input() size: 'xs' | 's' | 'm' | 'l' = 'm';\n @Input() tooltipEnabled = true;\n @Input() disabled = false;\n @Input() tooltipPosition: 'above' | 'below' | 'left' | 'right' = 'above';\n\n get avatarSize(): string {\n switch (this.size) {\n case 'xs': return 'avatar-xs';\n case 's': return 'avatar-s';\n case 'm': return 'avatar-m';\n case 'l': return 'avatar-l';\n default: return 'avatar-m';\n }\n }\n\n // Construct the class string dynamically\n get avatarClasses(): string {\n let classes = this.avatarSize; // Use the avatarSize getter here\n if (this.disabled) {\n classes += ' disabled';\n }\n return classes.trim();\n }\n}\n","{{ getInitial() }}
\n \n {{iconClass}}\n
\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n selector: 'metron-banner-message',\n templateUrl: './banner-message.component.html',\n styleUrl: './banner-message.component.scss',\n standalone: false\n})\nexport class BannerMessageComponent {\n @Input() type?: 'info' | 'success' | 'warning' | 'danger';\n @Input() title?: string;\n @Input() message!: string;\n @Input() iconName?: string;\n @Input() showCloseButton = false;\n @Input() actionButtonLabel?: string;\n @Input() enableBackground = false;\n @Input() showIcon = true;\n\n @Output() actionButtonClick = new EventEmitter\n \n \n\n\n \n \n \n \n \n
\n\n","import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'metron-avatar-logo',\n templateUrl: './avatar-logo.component.html',\n styleUrl: './avatar-logo.component.scss',\n standalone: false\n})\nexport class AvatarLogoComponent {\n @Input() imageSrc: string | null = null;\n @Input() title: string | null = null;\n @Input() iconClass: string | null = null;\n @Input() size: 'xs' | 's' | 'm' | 'l' = 'm';\n @Input() tooltipEnabled = true;\n @Input() disabled = false;\n @Input() tooltipPosition: 'above' | 'below' | 'left' | 'right' = 'above';\n\n get avatarSize(): string {\n switch (this.size) {\n case 'xs': return 'avatar-xs';\n case 's': return 'avatar-s';\n case 'm': return 'avatar-m';\n case 'l': return 'avatar-l';\n default: return 'avatar-m';\n }\n }\n\n // Construct the class string dynamically\n get avatarClasses(): string {\n let classes = this.avatarSize; // Use the avatarSize getter here\n if (this.disabled) {\n classes += ' disabled';\n }\n return classes.trim();\n }\n}\n"," 0\" class=\"extra-avatar\" [ngClass]=\"avatarSizeClass\" [matMenuTriggerFor]=\"extraAvatarsMenu\">\n +{{ extraAvatarsCount }}\n
\n \n \n ![]()
\n
\n","import { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { MatMenu } from '@angular/material/menu';\n\n@Component({\n selector: 'metron-filter',\n templateUrl: './filter.component.html',\n styleUrl: './filter.component.scss',\n standalone: false\n})\nexport class FilterComponent {\n @Input() activeFilters = 0;\n @Input() disabled = false;\n @Input() useMenu = false;\n @Input() useDrawer = false;\n @Input() filterMenu: MatMenu;\n @Output() toggleFilters = new EventEmitter