@updevs/components 1.0.0-alpha.1 → 1.0.0-alpha.100
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -24
- package/assets/styles/_bootstrap-components.scss +55 -0
- package/assets/styles/_bootstrap-config.scss +7 -0
- package/assets/styles/_bootstrap-override.scss +78 -0
- package/assets/styles/_config.scss +9 -0
- package/assets/styles/_core.scss +80 -0
- package/assets/styles/_debug.scss +49 -0
- package/assets/styles/_mixins.scss +2 -0
- package/assets/styles/_props.scss +91 -0
- package/assets/styles/_seven-columns.scss +73 -0
- package/assets/styles/_updevs.scss +25 -0
- package/assets/styles/_utilities-marketing.scss +209 -0
- package/assets/styles/_utilities.scss +133 -0
- package/assets/styles/_variables-dark.scss +19 -0
- package/assets/styles/_variables.scss +1003 -0
- package/assets/styles/fonts/_webfonts.scss +15 -0
- package/assets/styles/helpers/_index.scss +143 -0
- package/assets/styles/layout/_animations.scss +62 -0
- package/assets/styles/layout/_core.scss +62 -0
- package/assets/styles/layout/_dark.scss +77 -0
- package/assets/styles/layout/_footer.scss +12 -0
- package/assets/styles/layout/_navbar.scss +392 -0
- package/assets/styles/layout/_page.scss +170 -0
- package/assets/styles/layout/_root.scss +64 -0
- package/assets/styles/marketing/_browser.scss +67 -0
- package/assets/styles/marketing/_core.scss +8 -0
- package/assets/styles/marketing/_filters.scss +0 -0
- package/assets/styles/marketing/_hero.scss +70 -0
- package/assets/styles/marketing/_pricing.scss +111 -0
- package/assets/styles/marketing/_sections.scss +124 -0
- package/assets/styles/marketing/_shape.scss +31 -0
- package/assets/styles/mixins/_functions.scss +96 -0
- package/assets/styles/mixins/_mixins.scss +68 -0
- package/assets/styles/ui/_accordion.scss +178 -0
- package/assets/styles/ui/_alerts.scss +101 -0
- package/assets/styles/ui/_avatars.scss +145 -0
- package/assets/styles/ui/_badges.scss +113 -0
- package/assets/styles/ui/_breadcrumbs.scss +50 -0
- package/assets/styles/ui/_button-group.scss +16 -0
- package/assets/styles/ui/_buttons.scss +261 -0
- package/assets/styles/ui/_calendars.scss +104 -0
- package/assets/styles/ui/_cards.scss +595 -0
- package/assets/styles/ui/_carousel.scss +68 -0
- package/assets/styles/ui/_charts.scss +61 -0
- package/assets/styles/ui/_chat.scss +38 -0
- package/assets/styles/ui/_chips.scss +0 -0
- package/assets/styles/ui/_close.scss +60 -0
- package/assets/styles/ui/_datagrid.scss +17 -0
- package/assets/styles/ui/_dropdowns.scss +120 -0
- package/assets/styles/ui/_empty.scss +60 -0
- package/assets/styles/ui/_flags.scss +31 -0
- package/assets/styles/ui/_forms.scss +250 -0
- package/assets/styles/ui/_grid.scss +115 -0
- package/assets/styles/ui/_icons.scss +72 -0
- package/assets/styles/ui/_images.scss +19 -0
- package/assets/styles/ui/_legend.scss +12 -0
- package/assets/styles/ui/_lists.scss +123 -0
- package/assets/styles/ui/_loaders.scss +72 -0
- package/assets/styles/ui/_login.scss +3 -0
- package/assets/styles/ui/_markdown.scss +53 -0
- package/assets/styles/ui/_modals.scss +67 -0
- package/assets/styles/ui/_nav.scss +106 -0
- package/assets/styles/ui/_offcanvas.scss +17 -0
- package/assets/styles/ui/_pagination.scss +58 -0
- package/assets/styles/ui/_payments.scss +28 -0
- package/assets/styles/ui/_placeholder.scss +9 -0
- package/assets/styles/ui/_popovers.scss +2 -0
- package/assets/styles/ui/_progress.scss +107 -0
- package/assets/styles/ui/_ribbons.scss +157 -0
- package/assets/styles/ui/_segmented.scss +101 -0
- package/assets/styles/ui/_signature.scss +15 -0
- package/assets/styles/ui/_social.scss +52 -0
- package/assets/styles/ui/_stars.scss +13 -0
- package/assets/styles/ui/_status.scss +163 -0
- package/assets/styles/ui/_steps.scss +156 -0
- package/assets/styles/ui/_switch-icon.scss +211 -0
- package/assets/styles/ui/_tables.scss +176 -0
- package/assets/styles/ui/_tags.scss +57 -0
- package/assets/styles/ui/_timeline.scss +61 -0
- package/assets/styles/ui/_toasts.scss +18 -0
- package/assets/styles/ui/_toolbar.scss +10 -0
- package/assets/styles/ui/_tracking.scss +29 -0
- package/assets/styles/ui/_type.scss +330 -0
- package/assets/styles/ui/forms/_form-check.scss +91 -0
- package/assets/styles/ui/forms/_form-colorinput.scss +54 -0
- package/assets/styles/ui/forms/_form-custom.scss +28 -0
- package/assets/styles/ui/forms/_form-icon.scss +35 -0
- package/assets/styles/ui/forms/_form-imagecheck.scss +105 -0
- package/assets/styles/ui/forms/_form-selectgroup.scss +153 -0
- package/assets/styles/ui/forms/_validation.scss +13 -0
- package/assets/styles/ui/typo/_hr.scss +76 -0
- package/assets/styles/utils/_background.scss +15 -0
- package/assets/styles/utils/_colors.scss +101 -0
- package/assets/styles/utils/_opacity.scss +7 -0
- package/assets/styles/utils/_scroll.scss +45 -0
- package/assets/styles/utils/_shadow.scss +17 -0
- package/assets/styles/utils/_sizing.scss +10 -0
- package/assets/styles/utils/_text.scss +14 -0
- package/assets/styles/vendor/_apexcharts.scss +52 -0
- package/assets/styles/vendor/_coloris.scss +72 -0
- package/assets/styles/vendor/_dropzone.scss +27 -0
- package/assets/styles/vendor/_fslightbox.scss +13 -0
- package/assets/styles/vendor/_jsvectormap.scss +47 -0
- package/assets/styles/vendor/_litepicker.scss +69 -0
- package/assets/styles/vendor/_nouislider.scss +49 -0
- package/assets/styles/vendor/_plyr.scss +3 -0
- package/assets/styles/vendor/_stars-rating.scss +22 -0
- package/assets/styles/vendor/_tom-select.scss +81 -0
- package/assets/styles/vendor/_turbo.scss +3 -0
- package/assets/styles/vendor/_typed.scss +4 -0
- package/assets/styles/vendor/_wysiwyg.scss +46 -0
- package/fesm2022/updevs-components-badge.mjs +89 -0
- package/fesm2022/updevs-components-badge.mjs.map +1 -0
- package/fesm2022/updevs-components-button.mjs +193 -0
- package/fesm2022/updevs-components-button.mjs.map +1 -0
- package/fesm2022/updevs-components-calendar.mjs +582 -0
- package/fesm2022/updevs-components-calendar.mjs.map +1 -0
- package/fesm2022/updevs-components-card.mjs +242 -0
- package/fesm2022/updevs-components-card.mjs.map +1 -0
- package/fesm2022/updevs-components-drag-and-drop.mjs +185 -0
- package/fesm2022/updevs-components-drag-and-drop.mjs.map +1 -0
- package/fesm2022/updevs-components-dropdown.mjs +247 -0
- package/fesm2022/updevs-components-dropdown.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-abstractions.mjs +106 -0
- package/fesm2022/updevs-components-form-controls-abstractions.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-checkbox.mjs +99 -0
- package/fesm2022/updevs-components-form-controls-checkbox.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-date-picker.mjs +175 -0
- package/fesm2022/updevs-components-form-controls-date-picker.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-file-upload.mjs +272 -0
- package/fesm2022/updevs-components-form-controls-file-upload.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-input.mjs +281 -0
- package/fesm2022/updevs-components-form-controls-input.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-radio.mjs +98 -0
- package/fesm2022/updevs-components-form-controls-radio.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-select.mjs +600 -0
- package/fesm2022/updevs-components-form-controls-select.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-textarea.mjs +79 -0
- package/fesm2022/updevs-components-form-controls-textarea.mjs.map +1 -0
- package/fesm2022/updevs-components-form-controls-time-picker.mjs +345 -0
- package/fesm2022/updevs-components-form-controls-time-picker.mjs.map +1 -0
- package/fesm2022/updevs-components-form.mjs +562 -0
- package/fesm2022/updevs-components-form.mjs.map +1 -0
- package/fesm2022/updevs-components-layout.mjs +1054 -0
- package/fesm2022/updevs-components-layout.mjs.map +1 -0
- package/fesm2022/updevs-components-link.mjs +79 -0
- package/fesm2022/updevs-components-link.mjs.map +1 -0
- package/fesm2022/updevs-components-list.mjs +215 -0
- package/fesm2022/updevs-components-list.mjs.map +1 -0
- package/fesm2022/updevs-components-modal.mjs +505 -0
- package/fesm2022/updevs-components-modal.mjs.map +1 -0
- package/fesm2022/updevs-components-paginator.mjs +160 -0
- package/fesm2022/updevs-components-paginator.mjs.map +1 -0
- package/fesm2022/updevs-components-popover.mjs +215 -0
- package/fesm2022/updevs-components-popover.mjs.map +1 -0
- package/fesm2022/updevs-components-pricing.mjs +130 -0
- package/fesm2022/updevs-components-pricing.mjs.map +1 -0
- package/fesm2022/updevs-components-table.mjs +2060 -0
- package/fesm2022/updevs-components-table.mjs.map +1 -0
- package/fesm2022/updevs-components.mjs +33 -0
- package/fesm2022/updevs-components.mjs.map +1 -0
- package/package.json +127 -14
- package/types/updevs-components-badge.d.ts +44 -0
- package/types/updevs-components-button.d.ts +75 -0
- package/types/updevs-components-calendar.d.ts +175 -0
- package/types/updevs-components-card.d.ts +92 -0
- package/types/updevs-components-drag-and-drop.d.ts +74 -0
- package/types/updevs-components-dropdown.d.ts +124 -0
- package/types/updevs-components-form-controls-abstractions.d.ts +49 -0
- package/types/updevs-components-form-controls-checkbox.d.ts +33 -0
- package/types/updevs-components-form-controls-date-picker.d.ts +80 -0
- package/types/updevs-components-form-controls-file-upload.d.ts +69 -0
- package/types/updevs-components-form-controls-input.d.ts +95 -0
- package/types/updevs-components-form-controls-radio.d.ts +32 -0
- package/types/updevs-components-form-controls-select.d.ts +200 -0
- package/types/updevs-components-form-controls-textarea.d.ts +31 -0
- package/types/updevs-components-form-controls-time-picker.d.ts +164 -0
- package/types/updevs-components-form.d.ts +356 -0
- package/types/updevs-components-layout.d.ts +490 -0
- package/types/updevs-components-link.d.ts +34 -0
- package/types/updevs-components-list.d.ts +107 -0
- package/types/updevs-components-modal.d.ts +155 -0
- package/types/updevs-components-paginator.d.ts +58 -0
- package/types/updevs-components-popover.d.ts +63 -0
- package/types/updevs-components-pricing.d.ts +91 -0
- package/types/updevs-components-table.d.ts +619 -0
- package/types/updevs-components.d.ts +44 -0
- package/CHANGELOG.md +0 -8
- package/ng-package.json +0 -7
- package/src/lib/components.component.spec.ts +0 -23
- package/src/lib/components.component.ts +0 -14
- package/src/lib/components.module.ts +0 -17
- package/src/lib/components.service.spec.ts +0 -16
- package/src/lib/components.service.ts +0 -9
- package/src/public-api.ts +0 -7
- package/tsconfig.lib.json +0 -14
- package/tsconfig.lib.prod.json +0 -10
- package/tsconfig.spec.json +0 -14
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"updevs-components-list.mjs","sources":["../../../../libs/components/list/src/models/list-item.model.ts","../../../../libs/components/list/src/list.component.ts","../../../../libs/components/list/src/list.component.html","../../../../libs/components/list/src/upd-list.module.ts","../../../../libs/components/list/src/updevs-components-list.ts"],"sourcesContent":["import { IconModel } from '@updevs/icons';\nimport { BgColorStyleType } from '@updevs/sdk/types';\n\nimport { ListItem } from './list-item';\nimport { BadgePositionType } from './badge-position.type';\n\nexport class ListItemModel implements ListItem {\n id?: any;\n text?: string;\n description?: string;\n icon?: IconModel;\n isChecked?: boolean;\n isSwitch?: boolean;\n hasCheckbox?: boolean;\n isDisabled?: boolean;\n isActive?: boolean;\n leftBoxText?: string;\n leftBoxImage?: string;\n leftBoxHtml?: string;\n badgeColor?: BgColorStyleType;\n badgeText?: string;\n badgePosition?: BadgePositionType;\n children?: ListItemModel[];\n get hasLeftBox(): boolean {\n return !!this.leftBoxImage\n || !!this.leftBoxText\n || !!this.badgeColor\n || this.hasCheckbox === true\n || !!this.icon\n || !!this.leftBoxHtml;\n }\n get hasLeftBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left';\n }\n get hasBottomRightBadge(): boolean {\n return !!this.badgeColor && this.badgePosition === 'left-box-bottom-right';\n }\n\n constructor(init?: ListItem) {\n Object.assign(this, init);\n }\n}\n","import {\n Component,\n HostBinding,\n Input,\n Renderer2,\n ElementRef,\n OnInit,\n RendererStyleFlags2,\n ViewEncapsulation,\n Output,\n EventEmitter,\n OnChanges,\n SimpleChanges, inject\n} from '@angular/core';\n\nimport { ListItem } from './models/list-item';\nimport { ListItemModel } from './models/list-item.model';\n\n@Component({\n standalone: false,\n selector: 'upd-list',\n templateUrl: './list.component.html',\n styleUrls: ['./list.component.scss'],\n encapsulation: ViewEncapsulation.None\n})\nexport class ListComponent implements OnInit, OnChanges {\n @HostBinding('class') localWrapperClasses = '';\n\n /**\n * List items.\n * If provided, the single will be considered static.\n */\n @Input() items?: ListItem[];\n /**\n * Whether the content should overflow or not.\n */\n @Input() shouldOverflow = false;\n /**\n * Whether the list will fit the layout of the container.\n * If set to false, the list's round borders will be visible. It'll have a detached behavior.\n */\n @Input() isFlush = true;\n @Input() isVisible = true;\n @Input() isHoverable = false;\n @Input() shouldDisplayItemsCounter = false;\n @Input() wrapperClasses = '';\n /**\n * Maximum height of the component.\n * Note: The unit should also be provided, i.e.: 350px, 35rem, etc.\n */\n @Input() maxHeight?: string;\n\n @Output() readonly checkboxChanged = new EventEmitter<ListItem>();\n @Output() readonly selectedItem = new EventEmitter<ListItem>();\n\n listItems: ListItemModel[] = [];\n currentSelection: ListItem[] = [];\n\n private localBackupItems: ListItem[] = [];\n\n private readonly renderer = inject(Renderer2);\n private readonly elementRef = inject(ElementRef);\n\n ngOnInit(): void {\n this.setupStyle();\n this.updateWrapperClasses();\n this.setupItems();\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n this.setupStyle();\n this.updateWrapperClasses();\n\n if (!!changes['items']) {\n this.setupItems();\n }\n }\n\n onCheckboxChange(item: ListItem, isChecked: boolean): void {\n item.isChecked = isChecked;\n this.checkboxChanged.emit(item);\n }\n\n onSelectItem(evt: any, item: ListItem): void {\n evt.stopPropagation();\n this.selectedItem.emit(item);\n }\n\n trackByItemId(index: number, item: ListItem): any {\n return item.id ?? index;\n }\n\n private setupItems(): void {\n const tempItems: ListItemModel[] = [];\n\n this.items?.forEach(it => {\n const parent = new ListItemModel(it);\n\n if ((it.children?.length || 0) > 0) {\n parent.children = [];\n it.children?.forEach(child => parent.children!.push(new ListItemModel(child)));\n }\n\n tempItems.push(parent);\n });\n\n this.listItems = [...tempItems];\n }\n\n private setupStyle(): void {\n if (!!this.maxHeight) {\n this.renderer.setStyle(this.elementRef.nativeElement, 'max-height', this.maxHeight, RendererStyleFlags2.Important);\n }\n }\n\n private updateWrapperClasses(): void {\n this.localWrapperClasses = 'list-group' + ` ${this.wrapperClasses}`;\n\n if (this.isFlush) {\n this.localWrapperClasses += ' list-group-flush';\n }\n\n if (this.isHoverable) {\n this.localWrapperClasses += ' list-group-hoverable';\n }\n\n if (this.shouldOverflow) {\n this.localWrapperClasses += ' overflow-auto';\n }\n\n if (!this.isVisible) {\n this.localWrapperClasses += ' list-hidden';\n }\n }\n}\n","<ng-container *transloco=\"let t; prefix: 'UpDevs.List'\">\n @for (item of listItems; track trackByItemId($index, item)) {\n @if ((item.children?.length || 0) > 0) {\n <div class=\"list-group-header sticky-top\">{{ item.text }}</div>\n @for (child of item.children; track child) {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:child}\"></ng-container>\n }\n } @else {\n <ng-container [ngTemplateOutlet]=\"listItemTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n }\n } @empty {\n <div class=\"list-group-item\">\n <upd-icon tablerIcon=\"alert-triangle\" wrapperClasses=\"text-yellow\"></upd-icon>\n {{ t('NoRecordsFound') }}\n </div>\n }\n\n @if (shouldDisplayItemsCounter && listItems.length > 0) {\n <div class=\"list-items-counter bg-muted text-muted-fg\">\n {{ listItems.length }} {{ t(listItems.length === 1 ? 'Item' : 'Items') }}\n </div>\n }\n</ng-container>\n\n<ng-template #listItemTpl let-item=\"item\">\n <div class=\"list-group-item\" [class.list-group-item-action]=\"!item.hasLeftBox\" [class.active]=\"item.isActive\"\n [class.disabled]=\"item.isDisabled\" (click)=\"onSelectItem($event, item)\">\n @if (!item.hasLeftBox) {\n <span>{{ item.text }}</span>\n } @else {\n <div class=\"row\">\n <ng-container [ngTemplateOutlet]=\"leftBoxTpl\" [ngTemplateOutletContext]=\"{item:item}\"></ng-container>\n <div class=\"col text-truncate align-content-center\">\n @if (!!item.text) {\n <div class=\"text-body d-block\">{{ item.text }}</div>\n }\n @if (!!item.description) {\n <div class=\"text-muted text-truncate mt-n1\">{{ item.description }}</div>\n }\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n<ng-template #leftBoxTpl let-item=\"item\">\n <div class=\"col-auto\">\n @if (!!item.icon) {\n <upd-icon [model]=\"item.icon\"></upd-icon>\n } @else if (item.hasCheckbox) {\n <upd-checkbox (changed)=\"onCheckboxChange(item, $event)\" [isChecked]=\"item.isChecked || false\"\n [isSwitch]=\"item.isSwitch || false\"></upd-checkbox>\n <!-- [wrapperClasses]=\"'dropdown-item' + (item.isDisabled ? ' disabled' : '') +(item.isActive ? ' active' : '')\"-->\n\n } @else if (item.hasLeftBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n } @else if (!!item.leftBoxImage || !!item.leftBoxText) {\n <a href=\"#\"> <!-- TODO: change. -->\n <span class=\"avatar\" style=\"background-image: url({{item.leftBoxImage}})\">{{ item.leftBoxText }}\n @if (item.hasBottomRightBadge) {\n <span class=\"badge bg-{{item.badgeColor}} ms-auto\">{{ item.badgeText }}</span>\n }\n </span>\n </a>\n } @else if (!!item.leftBoxHtml) {\n <div [innerHTML]=\"item.leftBoxHtml\"></div>\n }\n </div>\n</ng-template>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TranslocoService, TranslocoModule } from '@jsverse/transloco';\nimport { UpdCheckboxModule } from '@updevs/components/form-controls/checkbox';\nimport { UpdIconsModule } from '@updevs/icons';\n\nimport * as en from './assets/i18n/en.json';\nimport * as pt from './assets/i18n/pt.json';\nimport { ListComponent } from './list.component';\n\n@NgModule({\n imports: [\n CommonModule,\n TranslocoModule,\n UpdCheckboxModule,\n UpdIconsModule\n ],\n declarations: [\n ListComponent\n ],\n exports: [\n ListComponent\n ]\n})\nexport class UpdListModule {\n constructor(translocoService: TranslocoService) {\n translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });\n translocoService.setTranslation(en, 'en');\n translocoService.setTranslation(pt, 'pt');\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i2","en","pt","i1"],"mappings":"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"}
|
|
@@ -0,0 +1,505 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, Directive, viewChild, ElementRef, inject, Renderer2, HostBinding, Component, ApplicationRef, ViewContainerRef, Injectable, signal, NgModule } from '@angular/core';
|
|
3
|
+
import { BaseComponent, LayoutService, ScrollbarService, Utils, DynamicComponentLoaderService, OverlayService, ButtonModel, UpdCoreLayoutModule } from '@updevs/sdk/layout';
|
|
4
|
+
import * as i1 from '@angular/common';
|
|
5
|
+
import { NgComponentOutlet, DOCUMENT, CommonModule } from '@angular/common';
|
|
6
|
+
import { TextService } from '@updevs/sdk';
|
|
7
|
+
import * as i2 from '@updevs/components/button';
|
|
8
|
+
import { UpdButtonModule } from '@updevs/components/button';
|
|
9
|
+
import * as i3 from '@updevs/icons';
|
|
10
|
+
import { UpdIconsModule } from '@updevs/icons';
|
|
11
|
+
import * as i1$1 from '@jsverse/transloco';
|
|
12
|
+
import { TranslocoDirective } from '@jsverse/transloco';
|
|
13
|
+
import { Subject } from 'rxjs';
|
|
14
|
+
import * as i3$1 from '@updevs/sdk/messages';
|
|
15
|
+
import { MessageTypeEnum, UpdMessagesModule } from '@updevs/sdk/messages';
|
|
16
|
+
|
|
17
|
+
class BaseModal {
|
|
18
|
+
constructor() {
|
|
19
|
+
this.modalRef = input.required(...(ngDevMode ? [{ debugName: "modalRef" }] : []));
|
|
20
|
+
this.data = input.required(...(ngDevMode ? [{ debugName: "data" }] : []));
|
|
21
|
+
}
|
|
22
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: BaseModal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
23
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.4", type: BaseModal, isStandalone: false, inputs: { modalRef: { classPropertyName: "modalRef", publicName: "modalRef", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
|
|
24
|
+
}
|
|
25
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: BaseModal, decorators: [{
|
|
26
|
+
type: Directive,
|
|
27
|
+
args: [{ standalone: false }]
|
|
28
|
+
}], propDecorators: { modalRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "modalRef", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }] } });
|
|
29
|
+
|
|
30
|
+
class ModalConfigModel {
|
|
31
|
+
constructor(init) {
|
|
32
|
+
this.size = 'regular';
|
|
33
|
+
this.isVerticallyCentered = true;
|
|
34
|
+
this.isScrollable = false;
|
|
35
|
+
this.showCancelButton = false;
|
|
36
|
+
this.showCloseButton = true;
|
|
37
|
+
this.isTextCentered = true;
|
|
38
|
+
this.shouldDismissOnEsc = false;
|
|
39
|
+
this.shouldDismissOnOutsideClick = false;
|
|
40
|
+
this.isAlert = false;
|
|
41
|
+
this.titleIconPosition = 'top';
|
|
42
|
+
this.footerLayout = 'default';
|
|
43
|
+
this.actionButtons = [];
|
|
44
|
+
if (!!init) {
|
|
45
|
+
Object.assign(this, init);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
let containerId = 1;
|
|
51
|
+
class ModalContainerComponent extends BaseComponent {
|
|
52
|
+
constructor() {
|
|
53
|
+
super(...arguments);
|
|
54
|
+
this.id = `modal-${containerId++}`;
|
|
55
|
+
this.hostClass = ['modal', 'modal-blur', 'fade'];
|
|
56
|
+
this.role = 'dialog';
|
|
57
|
+
this.ariaHidden = true;
|
|
58
|
+
this.ariaModal = false;
|
|
59
|
+
this.tabIndex = -1;
|
|
60
|
+
this.dialog = viewChild.required('dialog', { read: ElementRef });
|
|
61
|
+
this.content = viewChild.required('content', { read: ElementRef });
|
|
62
|
+
this.bodyContentOutlet = viewChild(NgComponentOutlet, ...(ngDevMode ? [{ debugName: "bodyContentOutlet" }] : []));
|
|
63
|
+
this.size = 'regular';
|
|
64
|
+
this.isVerticallyCentered = true;
|
|
65
|
+
this.isScrollable = false;
|
|
66
|
+
this.showCloseButton = true;
|
|
67
|
+
this.showCancelButton = false;
|
|
68
|
+
this.isTextCentered = true;
|
|
69
|
+
this.shouldDismissOnEsc = false;
|
|
70
|
+
this.shouldDismissOnOutsideClick = false;
|
|
71
|
+
this.isAlert = false;
|
|
72
|
+
this.titleIconPosition = 'top';
|
|
73
|
+
this.footerLayout = 'default';
|
|
74
|
+
this.actionButtons = [];
|
|
75
|
+
this.openClass = 'modal-open';
|
|
76
|
+
this.textService = inject(TextService);
|
|
77
|
+
this.elementRef = inject(ElementRef);
|
|
78
|
+
this.layoutService = inject(LayoutService);
|
|
79
|
+
this.scrollbarService = inject(ScrollbarService);
|
|
80
|
+
this.renderer = inject(Renderer2);
|
|
81
|
+
this.document = inject(DOCUMENT);
|
|
82
|
+
this.clickCallback = (evt) => {
|
|
83
|
+
if (evt.target === this.element) {
|
|
84
|
+
this.close();
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
this.escCallback = (evt) => {
|
|
88
|
+
if (evt.key === 'Escape') {
|
|
89
|
+
this.close();
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
get classes() {
|
|
94
|
+
return [
|
|
95
|
+
'modal-dialog',
|
|
96
|
+
this.isVerticallyCentered ? 'modal-dialog-centered' : '',
|
|
97
|
+
this.isScrollable ? 'modal-dialog-scrollable' : '',
|
|
98
|
+
this.sizeClass
|
|
99
|
+
];
|
|
100
|
+
}
|
|
101
|
+
get titleText() {
|
|
102
|
+
return this.textService.getText(this.title);
|
|
103
|
+
}
|
|
104
|
+
get bodyText() {
|
|
105
|
+
return this.textService.getText(this.body);
|
|
106
|
+
}
|
|
107
|
+
get statusColorClass() {
|
|
108
|
+
return `bg-${this.statusColor}`;
|
|
109
|
+
}
|
|
110
|
+
get sizeClass() {
|
|
111
|
+
let cls = '';
|
|
112
|
+
switch (this.size) {
|
|
113
|
+
case 'small':
|
|
114
|
+
cls = 'modal-sm';
|
|
115
|
+
break;
|
|
116
|
+
case 'large':
|
|
117
|
+
cls = 'modal-lg';
|
|
118
|
+
break;
|
|
119
|
+
case 'extra-large':
|
|
120
|
+
cls = 'modal-xl';
|
|
121
|
+
break;
|
|
122
|
+
}
|
|
123
|
+
return cls;
|
|
124
|
+
}
|
|
125
|
+
get element() {
|
|
126
|
+
return this.elementRef.nativeElement;
|
|
127
|
+
}
|
|
128
|
+
prepareToShow(config) {
|
|
129
|
+
this.setupConfig(config);
|
|
130
|
+
this.scrollbarService.hide();
|
|
131
|
+
this.layoutService.addBodyClasses(this.openClass);
|
|
132
|
+
this.adjustDialog();
|
|
133
|
+
this.setupActionButtons();
|
|
134
|
+
}
|
|
135
|
+
show() {
|
|
136
|
+
this.setupListeners();
|
|
137
|
+
this.styleDisplay = 'block';
|
|
138
|
+
this.ariaHidden = false;
|
|
139
|
+
this.ariaModal = true;
|
|
140
|
+
this.element.scrollTop = 0;
|
|
141
|
+
this.dialog().nativeElement.scrollTop = 0;
|
|
142
|
+
Utils.reflow(this.element);
|
|
143
|
+
const transitionSub = Utils.executeAfterTransition(this.element).subscribe(() => {
|
|
144
|
+
this.element.classList.add('show');
|
|
145
|
+
this.content().nativeElement.focus();
|
|
146
|
+
});
|
|
147
|
+
this.addSubscriptions(transitionSub);
|
|
148
|
+
}
|
|
149
|
+
close(result) {
|
|
150
|
+
const transitionSub = Utils.executeAfterTransition(this.element).subscribe(() => {
|
|
151
|
+
this.styleDisplay = undefined;
|
|
152
|
+
this.ariaHidden = true;
|
|
153
|
+
this.ariaModal = false;
|
|
154
|
+
if (!!this.afterClose) {
|
|
155
|
+
this.afterClose(result);
|
|
156
|
+
}
|
|
157
|
+
this.overlay.hide();
|
|
158
|
+
this.layoutService.removeBodyClasses(this.openClass);
|
|
159
|
+
this.modalContainerRef.destroy();
|
|
160
|
+
});
|
|
161
|
+
this.element.classList.remove('show');
|
|
162
|
+
this.addSubscriptions(transitionSub);
|
|
163
|
+
}
|
|
164
|
+
buttonClick(event, btn) {
|
|
165
|
+
if (!!btn.clickFunction) {
|
|
166
|
+
btn.clickFunction({ event, data: btn });
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
getBodyInstance() {
|
|
170
|
+
return this.bodyContentOutlet()?.['_componentRef'].instance;
|
|
171
|
+
}
|
|
172
|
+
adjustDialog() {
|
|
173
|
+
const isModalOverflowing = this.element.scrollHeight > this.document.documentElement.clientHeight;
|
|
174
|
+
const scrollbarWidth = this.scrollbarService.getWidth();
|
|
175
|
+
const isBodyOverflowing = scrollbarWidth > 0;
|
|
176
|
+
if (isBodyOverflowing && !isModalOverflowing) {
|
|
177
|
+
this.renderer.setStyle(this.element, 'paddingRight', `${scrollbarWidth}px`);
|
|
178
|
+
}
|
|
179
|
+
if (!isBodyOverflowing && isModalOverflowing) {
|
|
180
|
+
this.renderer.setStyle(this.element, 'paddingLeft', `${scrollbarWidth}px`);
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
setupConfig(config) {
|
|
184
|
+
if (!config) {
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
const configModel = new ModalConfigModel(config);
|
|
188
|
+
this.size = configModel.size;
|
|
189
|
+
this.isVerticallyCentered = configModel.isVerticallyCentered;
|
|
190
|
+
this.isScrollable = configModel.isScrollable;
|
|
191
|
+
this.showCancelButton = configModel.showCancelButton;
|
|
192
|
+
this.showCloseButton = configModel.showCloseButton;
|
|
193
|
+
this.shouldDismissOnEsc = configModel.shouldDismissOnEsc;
|
|
194
|
+
this.shouldDismissOnOutsideClick = configModel.shouldDismissOnOutsideClick;
|
|
195
|
+
this.isAlert = configModel.isAlert;
|
|
196
|
+
this.isTextCentered = configModel.isTextCentered;
|
|
197
|
+
this.statusColor = configModel.statusColor;
|
|
198
|
+
this.headerTemplateRef = configModel.headerTemplateRef;
|
|
199
|
+
this.footerTemplateRef = configModel.footerTemplateRef;
|
|
200
|
+
this.bodyTemplateRef = configModel.bodyTemplateRef;
|
|
201
|
+
this.bodyContentType = configModel.bodyContentType;
|
|
202
|
+
this.body = configModel.body;
|
|
203
|
+
this.title = configModel.title;
|
|
204
|
+
this.titleIcon = configModel.titleIcon;
|
|
205
|
+
this.titleIconPosition = configModel.titleIconPosition;
|
|
206
|
+
this.footerLayout = configModel.footerLayout;
|
|
207
|
+
this.actionButtons = configModel.actionButtons;
|
|
208
|
+
this.data = configModel.data;
|
|
209
|
+
}
|
|
210
|
+
setupActionButtons() {
|
|
211
|
+
this.actionButtons.forEach(btn => {
|
|
212
|
+
const fnBackup = btn.clickFunction;
|
|
213
|
+
btn.clickFunction = event => {
|
|
214
|
+
event.data = this;
|
|
215
|
+
fnBackup(event);
|
|
216
|
+
};
|
|
217
|
+
});
|
|
218
|
+
}
|
|
219
|
+
setupListeners() {
|
|
220
|
+
if (this.shouldDismissOnOutsideClick) {
|
|
221
|
+
this.element.addEventListener('click', this.clickCallback);
|
|
222
|
+
}
|
|
223
|
+
if (this.shouldDismissOnEsc) {
|
|
224
|
+
this.element.addEventListener('keydown', this.escCallback);
|
|
225
|
+
}
|
|
226
|
+
}
|
|
227
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
228
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.4", type: ModalContainerComponent, isStandalone: false, selector: "upd-modal-container", host: { properties: { "id": "this.id", "class": "this.hostClass", "attr.role": "this.role", "aria-hidden": "this.ariaHidden", "aria-modal": "this.ariaModal", "tabindex": "this.tabIndex", "style.display": "this.styleDisplay" } }, viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "bodyContentOutlet", first: true, predicate: NgComponentOutlet, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.Modal'\">\n <div [ngClass]=\"classes\" #dialog>\n <div class=\"modal-content\" tabindex=\"-1\" #content>\n @if (!!contentType) {\n <ng-container [ngComponentOutlet]=\"contentType\" [ngComponentOutletInputs]=\"{modalRef: this, data: data}\"></ng-container>\n } @else {\n @if (!isAlert && (!!titleText || !!headerTemplateRef)) {\n <div class=\"modal-header\">\n @if (!!headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"headerTemplateRef\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n <h5 class=\"modal-title\">{{ titleText }}</h5>\n @if (showCloseButton) {\n <ng-container [ngTemplateOutlet]=\"closeBtnTpl\"></ng-container>\n }\n }\n </div>\n } @else if (showCloseButton) {\n <ng-container [ngTemplateOutlet]=\"closeBtnTpl\"></ng-container>\n }\n\n <div class=\"modal-body py-4\" [class.text-center]=\"isTextCentered || isAlert\">\n @if (isAlert && !!titleText) {\n <div class=\"d-flex justify-content-center align-content-start\"\n [class.flex-row]=\"titleIconPosition === 'left' || titleIconPosition === 'right'\"\n [class.flex-column]=\"titleIconPosition === 'top' || titleIconPosition === 'bottom'\">\n @if (!!titleIcon && (titleIconPosition === 'top' || titleIconPosition === 'left')) {\n <upd-icon [model]=\"titleIcon\" [class.me-2]=\"titleIconPosition === 'left'\"\n [class.mb-2]=\"titleIconPosition === 'top'\"></upd-icon>\n }\n\n <span class=\"align-self-center fs-3 fw-bold\" [class.mb-3]=\"!!titleIcon && titleIconPosition === 'top'\">\n {{ titleText }}\n </span>\n\n @if (!!titleIcon && (titleIconPosition === 'bottom' || titleIconPosition === 'right')) {\n <upd-icon [model]=\"titleIcon\" [class.ms-2]=\"titleIconPosition === 'right'\"\n [class.mb-2]=\"titleIconPosition === 'bottom'\"></upd-icon>\n }\n </div>\n }\n\n @if (!!bodyTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"bodyTemplateRef!\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else if (!!bodyContentType) {\n <ng-container [ngComponentOutlet]=\"bodyContentType\" [ngComponentOutletInputs]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n <div [innerHTML]=\"bodyText\" [class.text-secondary]=\"isAlert\"></div>\n }\n </div>\n\n @if (!!statusColor) {\n <div class=\"modal-status\" [style.position]=\"'relative'\" [ngClass]=\"statusColorClass\"></div>\n }\n\n @if (showCancelButton || actionButtons.length > 0 || !!footerTemplateRef) {\n <div class=\"modal-footer\">\n @if (!!footerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"footerTemplateRef\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n @switch (footerLayout) {\n @case ('full-width') {\n <div class=\"w-100\">\n <div class=\"row\">\n @if (showCancelButton) {\n <div class=\"col\">\n <upd-button class=\"w-100\" [isNavigationLink]=\"true\" (clicked)=\"close()\">\n {{ t('Cancel') }}\n </upd-button>\n </div>\n }\n\n @for (btn of actionButtons; track btn) {\n <div class=\"col\">\n <upd-button class=\"w-100\" [model]=\"btn\"></upd-button>\n </div>\n }\n </div>\n </div>\n }\n @case ('centered') {\n <div class=\"d-flex justify-content-center w-100\">\n <ng-container [ngTemplateOutlet]=\"buttonsTpl\"></ng-container>\n </div>\n }\n @default {\n <ng-container [ngTemplateOutlet]=\"buttonsTpl\"></ng-container>\n }\n }\n }\n </div>\n }\n }\n </div>\n </div>\n\n <ng-template #closeBtnTpl>\n <upd-button (clicked)=\"close()\" [shouldIgnoreBtnClass]=\"true\" customClasses=\"btn-close\"></upd-button>\n </ng-template>\n\n <ng-template #buttonsTpl>\n @if (showCancelButton) {\n <upd-button colorStyle=\"secondary\" [isLink]=\"true\" (clicked)=\"close()\">\n {{ t('Cancel') }}\n </upd-button>\n }\n\n @for (btn of actionButtons; track btn) {\n <upd-button [model]=\"btn\" (clicked)=\"buttonClick($event, btn)\"></upd-button>\n }\n </ng-template>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ButtonComponent, selector: "upd-button", inputs: ["model", "text", "brandColorStyle", "customClasses", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "isLink", "shouldIgnoreBtnClass", "iconModel", "iconPosition", "isDisabled", "isActive", "badgeConfig", "colorStyle", "size", "title", "stopPropagation"], outputs: ["clicked"] }, { kind: "component", type: i3.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "colorClass", "removeDefaultClasses", "customClasses", "tablerIcon", "tablerIconWeight", "tablerIconType", "tablerIconSize", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }] }); }
|
|
229
|
+
}
|
|
230
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalContainerComponent, decorators: [{
|
|
231
|
+
type: Component,
|
|
232
|
+
args: [{ standalone: false, selector: 'upd-modal-container', template: "<ng-container *transloco=\"let t; prefix: 'UpDevs.Modal'\">\n <div [ngClass]=\"classes\" #dialog>\n <div class=\"modal-content\" tabindex=\"-1\" #content>\n @if (!!contentType) {\n <ng-container [ngComponentOutlet]=\"contentType\" [ngComponentOutletInputs]=\"{modalRef: this, data: data}\"></ng-container>\n } @else {\n @if (!isAlert && (!!titleText || !!headerTemplateRef)) {\n <div class=\"modal-header\">\n @if (!!headerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"headerTemplateRef\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n <h5 class=\"modal-title\">{{ titleText }}</h5>\n @if (showCloseButton) {\n <ng-container [ngTemplateOutlet]=\"closeBtnTpl\"></ng-container>\n }\n }\n </div>\n } @else if (showCloseButton) {\n <ng-container [ngTemplateOutlet]=\"closeBtnTpl\"></ng-container>\n }\n\n <div class=\"modal-body py-4\" [class.text-center]=\"isTextCentered || isAlert\">\n @if (isAlert && !!titleText) {\n <div class=\"d-flex justify-content-center align-content-start\"\n [class.flex-row]=\"titleIconPosition === 'left' || titleIconPosition === 'right'\"\n [class.flex-column]=\"titleIconPosition === 'top' || titleIconPosition === 'bottom'\">\n @if (!!titleIcon && (titleIconPosition === 'top' || titleIconPosition === 'left')) {\n <upd-icon [model]=\"titleIcon\" [class.me-2]=\"titleIconPosition === 'left'\"\n [class.mb-2]=\"titleIconPosition === 'top'\"></upd-icon>\n }\n\n <span class=\"align-self-center fs-3 fw-bold\" [class.mb-3]=\"!!titleIcon && titleIconPosition === 'top'\">\n {{ titleText }}\n </span>\n\n @if (!!titleIcon && (titleIconPosition === 'bottom' || titleIconPosition === 'right')) {\n <upd-icon [model]=\"titleIcon\" [class.ms-2]=\"titleIconPosition === 'right'\"\n [class.mb-2]=\"titleIconPosition === 'bottom'\"></upd-icon>\n }\n </div>\n }\n\n @if (!!bodyTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"bodyTemplateRef!\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else if (!!bodyContentType) {\n <ng-container [ngComponentOutlet]=\"bodyContentType\" [ngComponentOutletInputs]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n <div [innerHTML]=\"bodyText\" [class.text-secondary]=\"isAlert\"></div>\n }\n </div>\n\n @if (!!statusColor) {\n <div class=\"modal-status\" [style.position]=\"'relative'\" [ngClass]=\"statusColorClass\"></div>\n }\n\n @if (showCancelButton || actionButtons.length > 0 || !!footerTemplateRef) {\n <div class=\"modal-footer\">\n @if (!!footerTemplateRef) {\n <ng-container [ngTemplateOutlet]=\"footerTemplateRef\" [ngTemplateOutletContext]=\"{modalRef: this, data: data}\">\n </ng-container>\n } @else {\n @switch (footerLayout) {\n @case ('full-width') {\n <div class=\"w-100\">\n <div class=\"row\">\n @if (showCancelButton) {\n <div class=\"col\">\n <upd-button class=\"w-100\" [isNavigationLink]=\"true\" (clicked)=\"close()\">\n {{ t('Cancel') }}\n </upd-button>\n </div>\n }\n\n @for (btn of actionButtons; track btn) {\n <div class=\"col\">\n <upd-button class=\"w-100\" [model]=\"btn\"></upd-button>\n </div>\n }\n </div>\n </div>\n }\n @case ('centered') {\n <div class=\"d-flex justify-content-center w-100\">\n <ng-container [ngTemplateOutlet]=\"buttonsTpl\"></ng-container>\n </div>\n }\n @default {\n <ng-container [ngTemplateOutlet]=\"buttonsTpl\"></ng-container>\n }\n }\n }\n </div>\n }\n }\n </div>\n </div>\n\n <ng-template #closeBtnTpl>\n <upd-button (clicked)=\"close()\" [shouldIgnoreBtnClass]=\"true\" customClasses=\"btn-close\"></upd-button>\n </ng-template>\n\n <ng-template #buttonsTpl>\n @if (showCancelButton) {\n <upd-button colorStyle=\"secondary\" [isLink]=\"true\" (clicked)=\"close()\">\n {{ t('Cancel') }}\n </upd-button>\n }\n\n @for (btn of actionButtons; track btn) {\n <upd-button [model]=\"btn\" (clicked)=\"buttonClick($event, btn)\"></upd-button>\n }\n </ng-template>\n</ng-container>\n" }]
|
|
233
|
+
}], propDecorators: { id: [{
|
|
234
|
+
type: HostBinding,
|
|
235
|
+
args: ['id']
|
|
236
|
+
}], hostClass: [{
|
|
237
|
+
type: HostBinding,
|
|
238
|
+
args: ['class']
|
|
239
|
+
}], role: [{
|
|
240
|
+
type: HostBinding,
|
|
241
|
+
args: ['attr.role']
|
|
242
|
+
}], ariaHidden: [{
|
|
243
|
+
type: HostBinding,
|
|
244
|
+
args: ['aria-hidden']
|
|
245
|
+
}], ariaModal: [{
|
|
246
|
+
type: HostBinding,
|
|
247
|
+
args: ['aria-modal']
|
|
248
|
+
}], tabIndex: [{
|
|
249
|
+
type: HostBinding,
|
|
250
|
+
args: ['tabindex']
|
|
251
|
+
}], styleDisplay: [{
|
|
252
|
+
type: HostBinding,
|
|
253
|
+
args: ['style.display']
|
|
254
|
+
}], dialog: [{ type: i0.ViewChild, args: ['dialog', { ...{ read: ElementRef }, isSignal: true }] }], content: [{ type: i0.ViewChild, args: ['content', { ...{ read: ElementRef }, isSignal: true }] }], bodyContentOutlet: [{ type: i0.ViewChild, args: [i0.forwardRef(() => NgComponentOutlet), { isSignal: true }] }] } });
|
|
255
|
+
|
|
256
|
+
class ModalService {
|
|
257
|
+
constructor() {
|
|
258
|
+
this.dynamicComponentLoaderService = inject(DynamicComponentLoaderService);
|
|
259
|
+
this.overlayService = inject(OverlayService);
|
|
260
|
+
this.applicationRef = inject(ApplicationRef);
|
|
261
|
+
}
|
|
262
|
+
open(contentType, config, rootElement, shouldDisposeOnClick = false, shouldDisposeOnEsc = false) {
|
|
263
|
+
const viewContainerRef = this.applicationRef.components[0].injector.get(ViewContainerRef);
|
|
264
|
+
const modalContainerRef = this.dynamicComponentLoaderService.load(ModalContainerComponent, viewContainerRef);
|
|
265
|
+
const overlay = this.overlayService.create({ rootElement, customClasses: ['modal-backdrop'] });
|
|
266
|
+
modalContainerRef.instance.prepareToShow(config);
|
|
267
|
+
modalContainerRef.instance.modalContainerRef = modalContainerRef;
|
|
268
|
+
modalContainerRef.instance.overlay = overlay;
|
|
269
|
+
modalContainerRef.instance.contentType = contentType;
|
|
270
|
+
modalContainerRef.instance.shouldDismissOnOutsideClick = config?.shouldDismissOnOutsideClick || shouldDisposeOnClick;
|
|
271
|
+
modalContainerRef.instance.shouldDismissOnEsc = config?.shouldDismissOnEsc || shouldDisposeOnEsc;
|
|
272
|
+
overlay.show().subscribe(() => modalContainerRef.instance.show());
|
|
273
|
+
return modalContainerRef.instance;
|
|
274
|
+
}
|
|
275
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
276
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalService }); }
|
|
277
|
+
}
|
|
278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalService, decorators: [{
|
|
279
|
+
type: Injectable
|
|
280
|
+
}] });
|
|
281
|
+
|
|
282
|
+
class ModalAlertService {
|
|
283
|
+
constructor() {
|
|
284
|
+
this.modalService = inject(ModalService);
|
|
285
|
+
this.defaultIconModel = { tablerIconWeight: 'medium-light', tablerIconSize: 48 };
|
|
286
|
+
}
|
|
287
|
+
showWarning(message, title, actionButtons = []) {
|
|
288
|
+
return this.open(message, title || { text: 'UpDevs.ModalAlert.WarningTitle', isTranslated: false }, 'alert-triangle', 'text-warning', 'warning', actionButtons);
|
|
289
|
+
}
|
|
290
|
+
showError(message, title, actionButtons = []) {
|
|
291
|
+
return this.open(message, title || { text: 'UpDevs.ModalAlert.ErrorTitle', isTranslated: false }, 'exclamation-circle', 'text-danger', 'danger', actionButtons);
|
|
292
|
+
}
|
|
293
|
+
showInfo(message, title, actionButtons = []) {
|
|
294
|
+
return this.open(message, title || { text: 'UpDevs.ModalAlert.InfoTitle', isTranslated: false }, 'info-circle', 'text-info', 'info', actionButtons);
|
|
295
|
+
}
|
|
296
|
+
showSuccess(message, title, actionButtons = []) {
|
|
297
|
+
return this.open(message, title || { text: 'UpDevs.ModalAlert.SuccessTitle', isTranslated: false }, 'circle-check', 'text-success', 'success', actionButtons);
|
|
298
|
+
}
|
|
299
|
+
showConfirm(message, title, actionButtons = []) {
|
|
300
|
+
// eslint-disable-next-line prefer-const
|
|
301
|
+
let modalRef;
|
|
302
|
+
const statusColor = 'indigo';
|
|
303
|
+
const result = new Subject();
|
|
304
|
+
if (actionButtons.length < 1) {
|
|
305
|
+
actionButtons = [
|
|
306
|
+
new ButtonModel({
|
|
307
|
+
text: signal({ text: 'UpDevs.ModalAlert.ConfirmNo', isTranslated: false }),
|
|
308
|
+
isOutline: signal(true),
|
|
309
|
+
clickFunction: () => {
|
|
310
|
+
result.next(false);
|
|
311
|
+
modalRef.close();
|
|
312
|
+
}
|
|
313
|
+
}),
|
|
314
|
+
new ButtonModel({
|
|
315
|
+
text: signal({ text: 'UpDevs.ModalAlert.ConfirmYes', isTranslated: false }),
|
|
316
|
+
colorStyle: signal(statusColor),
|
|
317
|
+
clickFunction: () => {
|
|
318
|
+
result.next(true);
|
|
319
|
+
modalRef.close();
|
|
320
|
+
}
|
|
321
|
+
})
|
|
322
|
+
];
|
|
323
|
+
}
|
|
324
|
+
modalRef = this.open(message, title || { text: 'UpDevs.ModalAlert.ConfirmationTitle', isTranslated: false }, 'checklist', 'text-indigo', statusColor, actionButtons, 'full-width');
|
|
325
|
+
return result;
|
|
326
|
+
}
|
|
327
|
+
showCustom(message, title, titleIcon, titleIconPosition, statusColor, actionButtons = [], size = 'small', footerLayout = 'default') {
|
|
328
|
+
return this.modalService.open(undefined, {
|
|
329
|
+
isAlert: true,
|
|
330
|
+
title,
|
|
331
|
+
titleIcon,
|
|
332
|
+
titleIconPosition,
|
|
333
|
+
size,
|
|
334
|
+
body: message,
|
|
335
|
+
statusColor,
|
|
336
|
+
footerLayout,
|
|
337
|
+
actionButtons
|
|
338
|
+
});
|
|
339
|
+
}
|
|
340
|
+
open(message, title, titleIconType, titleIconColorClass, statusColor, actionButtons, footerLayout = 'default') {
|
|
341
|
+
// eslint-disable-next-line prefer-const
|
|
342
|
+
let modalRef;
|
|
343
|
+
const titleIcon = {
|
|
344
|
+
...this.defaultIconModel,
|
|
345
|
+
tablerIcon: titleIconType,
|
|
346
|
+
colorClass: titleIconColorClass
|
|
347
|
+
};
|
|
348
|
+
if (actionButtons.length < 1) {
|
|
349
|
+
actionButtons.push(new ButtonModel({
|
|
350
|
+
text: signal({ text: 'UpDevs.ModalAlert.OkButtonTitle', isTranslated: false }),
|
|
351
|
+
colorStyle: signal(statusColor),
|
|
352
|
+
clickFunction: () => modalRef.close()
|
|
353
|
+
}));
|
|
354
|
+
}
|
|
355
|
+
modalRef = this.modalService.open(undefined, {
|
|
356
|
+
isAlert: true,
|
|
357
|
+
title,
|
|
358
|
+
titleIcon,
|
|
359
|
+
titleIconPosition: 'top',
|
|
360
|
+
size: 'small',
|
|
361
|
+
body: message,
|
|
362
|
+
statusColor,
|
|
363
|
+
footerLayout,
|
|
364
|
+
actionButtons,
|
|
365
|
+
showCloseButton: false
|
|
366
|
+
});
|
|
367
|
+
return modalRef;
|
|
368
|
+
}
|
|
369
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalAlertService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
370
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalAlertService }); }
|
|
371
|
+
}
|
|
372
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: ModalAlertService, decorators: [{
|
|
373
|
+
type: Injectable
|
|
374
|
+
}] });
|
|
375
|
+
|
|
376
|
+
var UpDevs$1 = {
|
|
377
|
+
Modal: {
|
|
378
|
+
Cancel: "Cancel"
|
|
379
|
+
},
|
|
380
|
+
ModalAlert: {
|
|
381
|
+
OkButtonTitle: "Ok",
|
|
382
|
+
ConfirmYes: "Yes",
|
|
383
|
+
ConfirmNo: "No",
|
|
384
|
+
WarningTitle: "Warning",
|
|
385
|
+
ErrorTitle: "Error",
|
|
386
|
+
InfoTitle: "Information",
|
|
387
|
+
SuccessTitle: "Success",
|
|
388
|
+
ConfirmationTitle: "Confirm"
|
|
389
|
+
}
|
|
390
|
+
};
|
|
391
|
+
var en = {
|
|
392
|
+
UpDevs: UpDevs$1
|
|
393
|
+
};
|
|
394
|
+
|
|
395
|
+
var en$1 = /*#__PURE__*/Object.freeze({
|
|
396
|
+
__proto__: null,
|
|
397
|
+
UpDevs: UpDevs$1,
|
|
398
|
+
default: en
|
|
399
|
+
});
|
|
400
|
+
|
|
401
|
+
var UpDevs = {
|
|
402
|
+
Modal: {
|
|
403
|
+
Cancel: "Cancelar"
|
|
404
|
+
},
|
|
405
|
+
ModalAlert: {
|
|
406
|
+
OkButtonTitle: "Ok",
|
|
407
|
+
ConfirmYes: "Sim",
|
|
408
|
+
ConfirmNo: "Não",
|
|
409
|
+
WarningTitle: "Alerta",
|
|
410
|
+
ErrorTitle: "Erro",
|
|
411
|
+
InfoTitle: "Informação",
|
|
412
|
+
SuccessTitle: "Sucesso",
|
|
413
|
+
ConfirmationTitle: "Confirme"
|
|
414
|
+
}
|
|
415
|
+
};
|
|
416
|
+
var pt = {
|
|
417
|
+
UpDevs: UpDevs
|
|
418
|
+
};
|
|
419
|
+
|
|
420
|
+
var pt$1 = /*#__PURE__*/Object.freeze({
|
|
421
|
+
__proto__: null,
|
|
422
|
+
UpDevs: UpDevs,
|
|
423
|
+
default: pt
|
|
424
|
+
});
|
|
425
|
+
|
|
426
|
+
class UpdModalModule {
|
|
427
|
+
constructor(translocoService, modalAlertService, messagesService) {
|
|
428
|
+
translocoService.setFallbackLangForMissingTranslation({ fallbackLang: 'en' });
|
|
429
|
+
translocoService.setTranslation(en$1, 'en');
|
|
430
|
+
translocoService.setTranslation(pt$1, 'pt');
|
|
431
|
+
this.setupMessagesService(modalAlertService, messagesService);
|
|
432
|
+
}
|
|
433
|
+
setupMessagesService(modalAlertService, messagesService) {
|
|
434
|
+
messagesService.onNewMessage.subscribe(msg => {
|
|
435
|
+
if (msg.isModal) {
|
|
436
|
+
if (!!msg.onShown) {
|
|
437
|
+
msg.onShown();
|
|
438
|
+
}
|
|
439
|
+
let modalRef;
|
|
440
|
+
switch (msg.type) {
|
|
441
|
+
case MessageTypeEnum.Warning:
|
|
442
|
+
modalRef = modalAlertService.showWarning(msg.message, msg.title);
|
|
443
|
+
break;
|
|
444
|
+
case MessageTypeEnum.Info:
|
|
445
|
+
modalRef = modalAlertService.showInfo(msg.message, msg.title);
|
|
446
|
+
break;
|
|
447
|
+
case MessageTypeEnum.Error:
|
|
448
|
+
modalRef = modalAlertService.showError(msg.message, msg.title);
|
|
449
|
+
break;
|
|
450
|
+
case MessageTypeEnum.Success:
|
|
451
|
+
modalRef = modalAlertService.showSuccess(msg.message, msg.title);
|
|
452
|
+
break;
|
|
453
|
+
case MessageTypeEnum.Confirm:
|
|
454
|
+
modalAlertService.showConfirm(msg.message, msg.title);
|
|
455
|
+
break;
|
|
456
|
+
}
|
|
457
|
+
if (!!modalRef && !!msg.onHidden) {
|
|
458
|
+
modalRef.afterClose = msg.onHidden;
|
|
459
|
+
}
|
|
460
|
+
}
|
|
461
|
+
});
|
|
462
|
+
}
|
|
463
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: UpdModalModule, deps: [{ token: i1$1.TranslocoService }, { token: ModalAlertService }, { token: i3$1.MessagesService }], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
464
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.4", ngImport: i0, type: UpdModalModule, declarations: [ModalContainerComponent], imports: [CommonModule,
|
|
465
|
+
UpdCoreLayoutModule,
|
|
466
|
+
UpdButtonModule,
|
|
467
|
+
UpdIconsModule,
|
|
468
|
+
UpdMessagesModule,
|
|
469
|
+
TranslocoDirective] }); }
|
|
470
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: UpdModalModule, providers: [
|
|
471
|
+
ModalService,
|
|
472
|
+
ModalAlertService
|
|
473
|
+
], imports: [CommonModule,
|
|
474
|
+
UpdCoreLayoutModule,
|
|
475
|
+
UpdButtonModule,
|
|
476
|
+
UpdIconsModule,
|
|
477
|
+
UpdMessagesModule] }); }
|
|
478
|
+
}
|
|
479
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.4", ngImport: i0, type: UpdModalModule, decorators: [{
|
|
480
|
+
type: NgModule,
|
|
481
|
+
args: [{
|
|
482
|
+
imports: [
|
|
483
|
+
CommonModule,
|
|
484
|
+
UpdCoreLayoutModule,
|
|
485
|
+
UpdButtonModule,
|
|
486
|
+
UpdIconsModule,
|
|
487
|
+
UpdMessagesModule,
|
|
488
|
+
TranslocoDirective
|
|
489
|
+
],
|
|
490
|
+
declarations: [
|
|
491
|
+
ModalContainerComponent
|
|
492
|
+
],
|
|
493
|
+
providers: [
|
|
494
|
+
ModalService,
|
|
495
|
+
ModalAlertService
|
|
496
|
+
]
|
|
497
|
+
}]
|
|
498
|
+
}], ctorParameters: () => [{ type: i1$1.TranslocoService }, { type: ModalAlertService }, { type: i3$1.MessagesService }] });
|
|
499
|
+
|
|
500
|
+
/**
|
|
501
|
+
* Generated bundle index. Do not edit.
|
|
502
|
+
*/
|
|
503
|
+
|
|
504
|
+
export { BaseModal, ModalAlertService, ModalService, UpdModalModule };
|
|
505
|
+
//# sourceMappingURL=updevs-components-modal.mjs.map
|