From 1c2afbd09193d2cad49dd52f469f88d2f6febb93 Mon Sep 17 00:00:00 2001 From: Humberto Morera Date: Thu, 20 Nov 2025 18:14:57 -0600 Subject: [PATCH 001/180] feat(primeng): migrate to PrimeNG 20 - component and API updates Major migration from PrimeNG 17.18.11 to PrimeNG 20 with breaking changes: Component Migrations: - Calendar -> DatePicker (module, component, templates) - Dropdown -> Select (module, component, event types) - TabView -> Tabs (module, component, activeIndex -> value) - Sidebar -> Drawer (component and templates) - OverlayPanel -> Popover (component, templates, ViewChild types) - InputSwitch -> ToggleSwitch - InputTextarea -> Textarea - Messages -> Message - AccordionTab -> AccordionPanel with AccordionHeader API and Event Updates: - TabsChangeEvent no longer exported (use inline { index: number }) - SelectChangeEvent replaces DropdownChangeEvent - ConfirmDialog: accept()/reject() -> ConfirmationService.onAccept()/close() - SelectItem import path: primeng/api/selectitem -> primeng/api Property and Attribute Changes: - p-tabs: activeIndex -> value - p-popover: dismissible -> dismissable - p-checkbox/p-radioButton: removed label attribute (use separate - +
+ + +
diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.spec.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.spec.ts index a0547a85177f..f0415e71a78a 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.spec.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.spec.ts @@ -6,7 +6,7 @@ import { FormsModule } from '@angular/forms'; import { ButtonModule } from 'primeng/button'; import { DialogModule } from 'primeng/dialog'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { SkeletonModule } from 'primeng/skeleton'; import { DotMessageService } from '@dotcms/data-access'; @@ -26,7 +26,7 @@ describe('DotEditContentSidebarWorkflowComponent', () => { SkeletonModule, ButtonModule, DialogModule, - DropdownModule, + SelectModule, FormsModule ], providers: [ diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts index 1cf4a22a5db4..5697e5d71027 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/components/dot-edit-content-sidebar-workflow/dot-edit-content-sidebar-workflow.component.ts @@ -4,7 +4,7 @@ import { FormsModule } from '@angular/forms'; import { SelectItem } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; import { DialogModule } from 'primeng/dialog'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { SkeletonModule } from 'primeng/skeleton'; import { DotCMSWorkflowAction } from '@dotcms/dotcms-models'; @@ -35,7 +35,7 @@ const DEFAULT_WORKFLOW_SELECTION: WorkflowSelection = { SkeletonModule, ButtonModule, DialogModule, - DropdownModule, + SelectModule, FormsModule ], templateUrl: './dot-edit-content-sidebar-workflow.component.html', diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html index d706bf71b0d3..d25280135171 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.html @@ -7,15 +7,15 @@ @let referencePagesCount = $store.information.relatedContent(); diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.spec.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.spec.ts index b8f0d6040a59..bb54a46af108 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.spec.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.spec.ts @@ -15,7 +15,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { ConfirmationService, MessageService } from 'primeng/api'; import { DialogService } from 'primeng/dynamicdialog'; -import { TabView, TabViewModule } from 'primeng/tabview'; +import { TabView } from 'primeng/tabs'; import { DotContentletService, @@ -61,7 +61,7 @@ describe('DotEditContentSidebarComponent', () => { MockComponent(DotEditContentSidebarWorkflowComponent) ], imports: [ - TabViewModule, + TabsModule, DotEditContentSidebarActivitiesComponent, DotEditContentSidebarHistoryComponent ], // I need the real components to be rendered in the p-template="content" diff --git a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.ts b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.ts index 48a664bab11b..874bd1123339 100644 --- a/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.ts +++ b/core-web/libs/edit-content/src/lib/components/dot-edit-content-sidebar/dot-edit-content-sidebar.component.ts @@ -12,8 +12,8 @@ import { ConfirmationService } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; import { ConfirmDialogModule } from 'primeng/confirmdialog'; import { DialogModule } from 'primeng/dialog'; -import { DropdownModule } from 'primeng/dropdown'; -import { TabViewChangeEvent, TabViewModule } from 'primeng/tabview'; +import { SelectModule } from 'primeng/select'; +import { TabsModule } from 'primeng/tabs'; import { DotCopyButtonComponent, DotMessagePipe } from '@dotcms/ui'; @@ -45,13 +45,13 @@ import { DotEditContentStore } from '../../store/edit-content.store'; DotMessagePipe, DotEditContentSidebarInformationComponent, DotEditContentSidebarWorkflowComponent, - TabViewModule, + TabsModule, TabViewInsertDirective, DotEditContentSidebarSectionComponent, DotCopyButtonComponent, ConfirmDialogModule, DialogModule, - DropdownModule, + SelectModule, ButtonModule, DotEditContentSidebarLocalesComponent, DotEditContentSidebarActivitiesComponent, @@ -141,7 +141,7 @@ export class DotEditContentSidebarComponent { * Handles the active index change event from the sidebar tabs. * @param $event - The event object containing the active index. */ - onActiveIndexChange($event: TabViewChangeEvent) { + onActiveIndexChange($event: { index: number }) { const { index } = $event; this.$store.setActiveSidebarTab(index); } diff --git a/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.spec.ts b/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.spec.ts index 284a49c35f67..2959c02976da 100644 --- a/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.spec.ts +++ b/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.spec.ts @@ -3,7 +3,7 @@ import { byTestId, createComponentFactory, Spectator } from '@ngneat/spectator/j import { ChangeDetectionStrategy, Component, NO_ERRORS_SCHEMA } from '@angular/core'; import { fakeAsync, tick } from '@angular/core/testing'; -import { TabViewModule } from 'primeng/tabview'; +import { TabsModule } from 'primeng/tabs'; import { TabViewInsertDirective } from './tab-view-insert.directive'; @@ -20,7 +20,7 @@ import { TabViewInsertDirective } from './tab-view-insert.directive';
Append Content
`, - imports: [TabViewModule, TabViewInsertDirective], + imports: [TabsModule, TabViewInsertDirective], changeDetection: ChangeDetectionStrategy.OnPush }) class TestComponent {} @@ -29,7 +29,7 @@ describe('TabViewInsertDirective', () => { let spectator: Spectator; const createComponent = createComponentFactory({ component: TestComponent, - imports: [TabViewModule, TabViewInsertDirective], + imports: [TabsModule, TabViewInsertDirective], schemas: [NO_ERRORS_SCHEMA] }); diff --git a/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.ts b/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.ts index 904290bf3efc..10a5bf5c4b78 100644 --- a/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.ts +++ b/core-web/libs/edit-content/src/lib/directives/tab-view-insert/tab-view-insert.directive.ts @@ -8,7 +8,7 @@ import { ViewContainerRef } from '@angular/core'; -import { TabView } from 'primeng/tabview'; +import { Tabs } from 'primeng/tabs'; @Directive({ selector: '[dotTabViewAppend]' @@ -19,11 +19,11 @@ export class TabViewInsertDirective implements AfterViewInit { #viewContainer = inject(ViewContainerRef); #renderer = inject(Renderer2); - #tabView = inject(TabView, { optional: true }); + #tabView = inject(Tabs, { optional: true }); ngAfterViewInit() { if (!this.#tabView) { - console.warn('TabViewAppendDirective is for use with PrimeNG TabView'); + console.warn('TabViewAppendDirective is for use with PrimeNG Tabs'); return; } diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/components/calendar-field/calendar-field.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/components/calendar-field/calendar-field.component.html index 9515e6e18b00..74cd0d28a8f9 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/components/calendar-field/calendar-field.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/components/calendar-field/calendar-field.component.html @@ -2,7 +2,7 @@ @let hasError = $hasError(); @let fieldTypeConfig = $fieldTypeConfig(); - { ); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.showClear).toBe(true); expect(calendar.placeholder).toBe('Never expires'); @@ -285,7 +285,7 @@ describe('DotEditContentCalendarFieldComponent', () => { ); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.showClear).toBe(false); expect(calendar.placeholder).toBe(''); }); @@ -318,7 +318,7 @@ describe('DotEditContentCalendarFieldComponent', () => { control.disable(); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.disabled).toBe(true); }); @@ -348,7 +348,7 @@ describe('DotEditContentCalendarFieldComponent', () => { control.enable(); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.disabled).toBe(false); }); }); @@ -376,7 +376,7 @@ describe('DotEditContentCalendarFieldComponent', () => { ); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.showTime).toBe(true); expect(calendar.timeOnly).toBe(false); expect(calendar.icon).toBe('pi pi-calendar'); @@ -404,7 +404,7 @@ describe('DotEditContentCalendarFieldComponent', () => { ); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.showTime).toBe(false); expect(calendar.timeOnly).toBe(false); expect(calendar.icon).toBe('pi pi-calendar'); @@ -432,7 +432,7 @@ describe('DotEditContentCalendarFieldComponent', () => { ); spectator.detectChanges(); - const calendar = spectator.query(Calendar); + const calendar = spectator.query(DatePicker); expect(calendar.showTime).toBe(true); expect(calendar.timeOnly).toBe(true); expect(calendar.icon).toBe('pi pi-clock'); @@ -653,7 +653,7 @@ describe('DotEditContentCalendarFieldComponent', () => { spectator.detectChanges(); const selectedDate = new Date('2024-01-15T10:30:00'); - spectator.triggerEventHandler(Calendar, 'onSelect', selectedDate); + spectator.triggerEventHandler(DatePicker, 'onSelect', selectedDate); expect(calendarUtils.extractDateComponents).toHaveBeenCalledWith(selectedDate); expect(calendarUtils.createUtcDateAtMidnight).toHaveBeenCalledWith(2024, 0, 15); @@ -682,7 +682,7 @@ describe('DotEditContentCalendarFieldComponent', () => { spectator.detectChanges(); const selectedDate = new Date('2024-01-15T10:30:00'); - spectator.triggerEventHandler(Calendar, 'onSelect', selectedDate); + spectator.triggerEventHandler(DatePicker, 'onSelect', selectedDate); expect(calendarUtils.extractDateComponents).toHaveBeenCalledWith(selectedDate); expect(calendarUtils.convertServerTimeToUtc).toHaveBeenCalled(); diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/dot-edit-content-calendar-field.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/dot-edit-content-calendar-field.component.ts index 1e9aca711e6f..ebade7c0565e 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/dot-edit-content-calendar-field.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-calendar-field/dot-edit-content-calendar-field.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core'; import { ControlContainer, ReactiveFormsModule } from '@angular/forms'; -import { CalendarModule } from 'primeng/calendar'; +import { DatePickerModule } from 'primeng/datepicker'; import { DotCMSContentType, @@ -44,7 +44,7 @@ import { BaseWrapperField } from '../shared/base-wrapper-field'; @Component({ selector: 'dot-edit-content-calendar-field', imports: [ - CalendarModule, + DatePickerModule, ReactiveFormsModule, DotMessagePipe, DotCardFieldComponent, diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-checkbox-field/dot-edit-content-checkbox-field.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-checkbox-field/dot-edit-content-checkbox-field.component.html index e619911ff632..edf53184d9bc 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-checkbox-field/dot-edit-content-checkbox-field.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-checkbox-field/dot-edit-content-checkbox-field.component.html @@ -11,15 +11,21 @@
@for (option of $options(); track $index) { - +
+ + @if (option.label) { + + } +
}
diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-radio-field/dot-edit-content-radio-field.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-radio-field/dot-edit-content-radio-field.component.html index 178801e46b0d..5eb98fb97355 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-radio-field/dot-edit-content-radio-field.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-radio-field/dot-edit-content-radio-field.component.html @@ -12,14 +12,20 @@
@for (option of options; track $index) { - +
+ + @if (option.label) { + + } +
}
diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/header/header.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/header/header.component.ts index c916a130d82d..6c2c40111e2b 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/header/header.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/header/header.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; import { FormsModule } from '@angular/forms'; -import { InputSwitchModule } from 'primeng/inputswitch'; +import { ToggleSwitchModule } from 'primeng/toggleswitch'; import { DotMessagePipe } from '@dotcms/ui'; @@ -10,7 +10,7 @@ import { SearchComponent } from '../search/search.component'; @Component({ selector: 'dot-relationship-header', - imports: [DotMessagePipe, SearchComponent, InputSwitchModule, FormsModule], + imports: [DotMessagePipe, SearchComponent, ToggleSwitchModule, FormsModule], templateUrl: './header.component.html', changeDetection: ChangeDetectionStrategy.OnPush, styleUrl: './header.component.scss' diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.html index a158392ea90e..7051182bf1bb 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.html @@ -1,7 +1,7 @@ - {{ languageControl.value | language }} - + @let error = store.error(); @if (error) { diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.ts index a15e44387911..e2a825ccf2e2 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/components/language-field/language-field.component.ts @@ -13,7 +13,7 @@ import { ReactiveFormsModule } from '@angular/forms'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { DotLanguage } from '@dotcms/dotcms-models'; import { DotMessagePipe } from '@dotcms/ui'; @@ -31,7 +31,7 @@ import { LanguagePipe } from '../../../../../../../../pipes/language.pipe'; */ @Component({ selector: 'dot-language-field', - imports: [DropdownModule, ReactiveFormsModule, LanguagePipe, DotMessagePipe], + imports: [SelectModule, ReactiveFormsModule, LanguagePipe, DotMessagePipe], providers: [ LanguageFieldStore, { diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.html index ae45c32a1eae..890e7f1b2f1c 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.html @@ -23,7 +23,7 @@ [text]="true" /> - +
@@ -51,5 +51,5 @@ severity="primary" />
-
+ diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.spec.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.spec.ts index 4c3c4eaf863c..84cb743fbf32 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.spec.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.spec.ts @@ -12,10 +12,10 @@ import { import { ButtonModule } from 'primeng/button'; import { ChipModule } from 'primeng/chip'; -import { DropdownModule } from 'primeng/dropdown'; import { InputGroupModule } from 'primeng/inputgroup'; import { InputTextModule } from 'primeng/inputtext'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; +import { PopoverModule } from 'primeng/popover'; +import { SelectModule } from 'primeng/select'; import { DotLanguagesService, DotMessageService } from '@dotcms/data-access'; import { DotMessagePipe } from '@dotcms/ui'; @@ -128,10 +128,10 @@ describe('SearchComponent', () => { imports: [ ReactiveFormsModule, ButtonModule, - DropdownModule, + SelectModule, InputGroupModule, InputTextModule, - OverlayPanelModule, + PopoverModule, ChipModule, MockLanguageFieldComponent, MockSiteFieldComponent diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.ts index 708a3c69067c..f0278972da8e 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/components/search/search.component.ts @@ -4,11 +4,11 @@ import { FormBuilder, ReactiveFormsModule } from '@angular/forms'; import { ButtonModule } from 'primeng/button'; import { ChipModule } from 'primeng/chip'; -import { DropdownModule } from 'primeng/dropdown'; import { InputGroupModule } from 'primeng/inputgroup'; import { InputGroupAddonModule } from 'primeng/inputgroupaddon'; import { InputTextModule } from 'primeng/inputtext'; -import { OverlayPanel, OverlayPanelModule } from 'primeng/overlaypanel'; +import { Popover, PopoverModule } from 'primeng/popover'; +import { SelectModule } from 'primeng/select'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; @@ -43,9 +43,9 @@ interface ActiveFilter { InputTextModule, ButtonModule, InputGroupModule, - OverlayPanelModule, + PopoverModule, DotMessagePipe, - DropdownModule, + SelectModule, ReactiveFormsModule, LanguageFieldComponent, SiteFieldComponent, @@ -57,9 +57,9 @@ interface ActiveFilter { }) export class SearchComponent { /** - * Reference to the OverlayPanel component used for advanced search options. + * Reference to the Popover component used for advanced search options. */ - $overlayPanel = viewChild.required(OverlayPanel); + $overlayPanel = viewChild.required(Popover); /** * Reference to the language field component to access its store. diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/dot-select-existing-content.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/dot-select-existing-content.component.ts index bf30fc0d0888..e6a28066afc4 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/dot-select-existing-content.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/dot-select-existing-content.component.ts @@ -20,7 +20,7 @@ import { InputGroupModule } from 'primeng/inputgroup'; import { InputIconModule } from 'primeng/inputicon'; import { InputTextModule } from 'primeng/inputtext'; import { MenuModule } from 'primeng/menu'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; +import { PopoverModule } from 'primeng/popover'; import { TableModule } from 'primeng/table'; import { DotCMSContentlet } from '@dotcms/dotcms-models'; @@ -53,7 +53,7 @@ const STATIC_COLUMNS = 6; InputIconModule, InputTextModule, InputGroupModule, - OverlayPanelModule, + PopoverModule, ContentletStatusPipe, LanguagePipe, DatePipe, diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.spec.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.spec.ts index d65f2851a62e..5fa64323dc41 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.spec.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.spec.ts @@ -3,7 +3,7 @@ import { Observable, of, throwError } from 'rxjs'; import { TestBed, fakeAsync, tick } from '@angular/core/testing'; -import { InputSwitchChangeEvent } from 'primeng/inputswitch'; +import { ToggleSwitchChangeEvent } from 'primeng/toggleswitch'; import { delay } from 'rxjs/operators'; @@ -201,7 +201,7 @@ describe('ExistingContentStore', () => { expect(store.pagination().currentPage).toBe(2); // Toggle to selected view - const event = { checked: true } as InputSwitchChangeEvent; + const event = { checked: true } as ToggleSwitchChangeEvent; store.changeViewMode(event); expect(store.isSelectedView()).toBe(true); expect(store.viewMode()).toBe('selected'); @@ -227,12 +227,12 @@ describe('ExistingContentStore', () => { expect(store.pagination().currentPage).toBe(3); // Toggle to selected view - store.changeViewMode({ checked: true } as InputSwitchChangeEvent); + store.changeViewMode({ checked: true } as ToggleSwitchChangeEvent); expect(store.isSelectedView()).toBe(true); expect(store.pagination().currentPage).toBe(1); // reset // Toggle back to all view - store.changeViewMode({ checked: false } as InputSwitchChangeEvent); + store.changeViewMode({ checked: false } as ToggleSwitchChangeEvent); expect(store.isSelectedView()).toBe(false); // pagination should be restored to previousPagination (page 3) expect(store.pagination().currentPage).toBe(3); @@ -243,19 +243,19 @@ describe('ExistingContentStore', () => { // Move to page 2 store.nextPage(); // Toggle to selected view - store.changeViewMode({ checked: true } as InputSwitchChangeEvent); + store.changeViewMode({ checked: true } as ToggleSwitchChangeEvent); // Move to page 1 in selected view (already at 1) expect(store.pagination().currentPage).toBe(1); // Toggle back to all view - store.changeViewMode({ checked: false } as InputSwitchChangeEvent); + store.changeViewMode({ checked: false } as ToggleSwitchChangeEvent); expect(store.pagination().currentPage).toBe(2); // Move to page 3 store.setOffset({ first: 100 } as import('primeng/table').TablePageEvent); // Toggle to selected view again - store.changeViewMode({ checked: true } as InputSwitchChangeEvent); + store.changeViewMode({ checked: true } as ToggleSwitchChangeEvent); expect(store.pagination().currentPage).toBe(1); // Toggle back to all view - store.changeViewMode({ checked: false } as InputSwitchChangeEvent); + store.changeViewMode({ checked: false } as ToggleSwitchChangeEvent); expect(store.pagination().currentPage).toBe(3); }); @@ -269,7 +269,7 @@ describe('ExistingContentStore', () => { store.setSelectionItems([selectedItem]); // Toggle to show only selected items - const event = { checked: true } as InputSwitchChangeEvent; + const event = { checked: true } as ToggleSwitchChangeEvent; store.changeViewMode(event); // Should filter to show only the selected item @@ -282,7 +282,7 @@ describe('ExistingContentStore', () => { selectionMode: 'multiple', selectedItemsIds: [] }); - const event = { checked: true } as InputSwitchChangeEvent; + const event = { checked: true } as ToggleSwitchChangeEvent; store.changeViewMode(event); expect(store.filteredData()).toEqual([]); }); @@ -293,7 +293,7 @@ describe('ExistingContentStore', () => { selectionMode: 'multiple', selectedItemsIds: [mockData.contentlets[0].inode] }); - const event = { checked: true } as InputSwitchChangeEvent; + const event = { checked: true } as ToggleSwitchChangeEvent; store.changeViewMode(event); expect(store.filteredData()).toEqual([mockData.contentlets[0]]); }); diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.ts index f5d498468563..f9154e590547 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-relationship-field/components/dot-select-existing-content/store/existing-content.store.ts @@ -5,8 +5,8 @@ import { pipe } from 'rxjs'; import { computed, inject } from '@angular/core'; -import { InputSwitchChangeEvent } from 'primeng/inputswitch'; import { TablePageEvent } from 'primeng/table'; +import { ToggleSwitchChangeEvent } from 'primeng/toggleswitch'; import { filter, switchMap, tap } from 'rxjs/operators'; @@ -241,7 +241,7 @@ export const ExistingContentStore = signalStore( * Changes the view mode between all and selected items. * @param event The event containing the checked property. */ - changeViewMode: (event: InputSwitchChangeEvent) => { + changeViewMode: (event: ToggleSwitchChangeEvent) => { const viewMode = event.checked ? ViewMode.selected : ViewMode.all; const isSelectedView = viewMode === ViewMode.selected; diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-select-field/dot-edit-content-select-field.component.html b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-select-field/dot-edit-content-select-field.component.html index 926151f4cd13..b1d790c92cdf 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-select-field/dot-edit-content-select-field.component.html +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-select-field/dot-edit-content-select-field.component.html @@ -9,7 +9,7 @@ } -
-
- { host: MockFormComponent, imports: [ ReactiveFormsModule, - DropdownModule, + SelectModule, NoopAnimationsModule, ConfirmDialogModule, DotMessagePipe diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-wysiwyg-field/dot-edit-content-wysiwyg-field.component.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-wysiwyg-field/dot-edit-content-wysiwyg-field.component.ts index f3688f414dad..e53ef32e56d1 100644 --- a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-wysiwyg-field/dot-edit-content-wysiwyg-field.component.ts +++ b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-wysiwyg-field/dot-edit-content-wysiwyg-field.component.ts @@ -15,7 +15,7 @@ import { FormsModule, ReactiveFormsModule, ControlContainer } from '@angular/for import { ConfirmationService } from 'primeng/api'; import { ConfirmDialogModule } from 'primeng/confirmdialog'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { DotMessageService } from '@dotcms/data-access'; import { DotCMSContentlet, DotCMSContentTypeField } from '@dotcms/dotcms-models'; @@ -49,7 +49,7 @@ import { imports: [ FormsModule, ReactiveFormsModule, - DropdownModule, + SelectModule, DotWysiwygTinymceComponent, DotEditContentMonacoEditorControlComponent, MonacoEditorModule, diff --git a/core-web/libs/edit-content/src/lib/models/dot-edit-content-field.enum.ts b/core-web/libs/edit-content/src/lib/models/dot-edit-content-field.enum.ts index 2cb41c98790f..8c49038a3989 100644 --- a/core-web/libs/edit-content/src/lib/models/dot-edit-content-field.enum.ts +++ b/core-web/libs/edit-content/src/lib/models/dot-edit-content-field.enum.ts @@ -1,5 +1,5 @@ /** - * Represents the selectable data types (Dropdown, Radio button) for a DotCMS content field. + * Represents the selectable data types (Select, Radio button) for a DotCMS content field. */ export enum DotEditContentFieldSingleSelectableDataType { BOOL = 'BOOL', diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.html b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.html index 21822256dd4a..cbada90f33e2 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.html +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.html @@ -5,7 +5,7 @@
- @if (showCustomDatePicker) { - { describe('onChangeTimeRange', () => { it('should emit time range when time range is selected', () => { const changeFiltersSpy = jest.spyOn(spectator.component.changeFilters, 'emit'); - spectator.triggerEventHandler(Dropdown, 'onChange', { + spectator.triggerEventHandler(Select, 'onChange', { value: TIME_RANGE_OPTIONS.last7days, originalEvent: createFakeEvent('change') }); @@ -194,7 +192,7 @@ describe('DotAnalyticsDashboardFiltersComponent', () => { it('should not emit when time range is a custom date range', () => { const changeFiltersSpy = jest.spyOn(spectator.component.changeFilters, 'emit'); - spectator.triggerEventHandler(Dropdown, 'onChange', { + spectator.triggerEventHandler(Select, 'onChange', { value: TIME_RANGE_OPTIONS.custom, originalEvent: createFakeEvent('change') }); diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.ts b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.ts index fd760ccb081e..704bce1601ad 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.ts +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/components/dot-analytics-dashboard-filters/dot-analytics-dashboard-filters.component.ts @@ -14,8 +14,8 @@ import { import { FormsModule } from '@angular/forms'; import { Params } from '@angular/router'; -import { CalendarModule } from 'primeng/calendar'; -import { DropdownModule, DropdownChangeEvent } from 'primeng/dropdown'; +import { DatePickerModule } from 'primeng/datepicker'; +import { SelectModule, SelectChangeEvent } from 'primeng/select'; import { DotMessageService } from '@dotcms/data-access'; import { @@ -35,7 +35,7 @@ import { isValidCustomDateRange } from '../../utils/dot-analytics.utils'; */ @Component({ selector: 'dot-analytics-dashboard-filters', - imports: [CalendarModule, DropdownModule, FormsModule, DotMessagePipe], + imports: [DatePickerModule, SelectModule, FormsModule, DotMessagePipe], templateUrl: './dot-analytics-dashboard-filters.component.html', styleUrls: ['./dot-analytics-dashboard-filters.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush @@ -72,7 +72,7 @@ export class DotAnalyticsDashboardFiltersComponent { } /** Handle change time range */ - onChangeTimeRange(event: DropdownChangeEvent): void { + onChangeTimeRange(event: SelectChangeEvent): void { if (event.value === TIME_RANGE_OPTIONS.custom) { return; } diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.html b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.html index 24b4b8ecf6b9..6f3e09e0b9ea 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.html +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.html @@ -1,7 +1,7 @@
@if ($showMessage()) { - +
@@ -22,7 +22,7 @@
-
+ } diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.spec.ts b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.spec.ts index 5482cd3f37b1..c99cce13c7d8 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.spec.ts +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.spec.ts @@ -9,7 +9,7 @@ import { MockComponent } from 'ng-mocks'; import { ActivatedRoute, Router } from '@angular/router'; -import { MessagesModule } from 'primeng/messages'; +import { MessageModule } from 'primeng/message'; import { DotLocalstorageService, DotMessageService } from '@dotcms/data-access'; import { @@ -46,7 +46,7 @@ describe('DotAnalyticsDashboardComponent', () => { const createComponent = createRoutingFactory({ component: DotAnalyticsDashboardComponent, - imports: [MessagesModule, DotMessagePipe], + imports: [MessageModule, DotMessagePipe], declarations: [ MockComponent(DotAnalyticsDashboardChartComponent), MockComponent(DotAnalyticsDashboardFiltersComponent), diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.ts b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.ts index 59693e02b7c3..4b05594135ea 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.ts +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-dashboard/dot-analytics-dashboard.component.ts @@ -5,7 +5,7 @@ import { toSignal } from '@angular/core/rxjs-interop'; import { ActivatedRoute, ParamMap, Params, Router } from '@angular/router'; import { ButtonModule } from 'primeng/button'; -import { MessagesModule } from 'primeng/messages'; +import { MessageModule } from 'primeng/message'; import { DotLocalstorageService } from '@dotcms/data-access'; import { @@ -32,7 +32,7 @@ import { getProperQueryParamsFromUrl } from './utils/state-from-url'; selector: 'lib-dot-analytics-dashboard', imports: [ ButtonModule, - MessagesModule, + MessageModule, DotAnalyticsDashboardMetricsComponent, DotAnalyticsDashboardChartComponent, DotAnalyticsDashboardTableComponent, diff --git a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-search/dot-analytics-search.component.ts b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-search/dot-analytics-search.component.ts index 173766fcee58..35305dd37285 100644 --- a/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-search/dot-analytics-search.component.ts +++ b/core-web/libs/portlets/dot-analytics/portlet/src/lib/dot-analytics-search/dot-analytics-search.component.ts @@ -5,7 +5,7 @@ import { FormsModule } from '@angular/forms'; import { ButtonDirective } from 'primeng/button'; import { DialogModule } from 'primeng/dialog'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { SplitterModule } from 'primeng/splitter'; import { TooltipModule } from 'primeng/tooltip'; @@ -23,7 +23,7 @@ import { ANALYTICS_MONACO_EDITOR_OPTIONS, ANALYTICS_RESULTS_MONACO_EDITOR_OPTION MonacoEditorModule, FormsModule, SplitterModule, - DropdownModule, + SelectModule, DotEmptyContainerComponent, TooltipModule, DialogModule diff --git a/core-web/libs/portlets/dot-content-drive/portlet/src/lib/components/dialogs/dot-content-drive-dialog-folder/dot-content-drive-dialog-folder.component.html b/core-web/libs/portlets/dot-content-drive/portlet/src/lib/components/dialogs/dot-content-drive-dialog-folder/dot-content-drive-dialog-folder.component.html index 10a84cc9337d..25884f434b86 100644 --- a/core-web/libs/portlets/dot-content-drive/portlet/src/lib/components/dialogs/dot-content-drive-dialog-folder/dot-content-drive-dialog-folder.component.html +++ b/core-web/libs/portlets/dot-content-drive/portlet/src/lib/components/dialogs/dot-content-drive-dialog-folder/dot-content-drive-dialog-folder.component.html @@ -1,7 +1,8 @@ - - + + + + {{ 'content-drive.dialog.folder.general.header' | dm }} +
-
- + + + + {{ 'content-drive.dialog.folder.advanced.header' | dm }} +
- {{ 'content-drive.dialog.folder.field.show-on-menu' | dm }} -
-
-
+ + - +
- + formControlName="endDate">
- +
- +
@@ -65,7 +75,7 @@ }
- +
- + - + diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.spec.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.spec.ts index 78ded65e955c..30afd97bc0ea 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.spec.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.spec.ts @@ -3,7 +3,7 @@ import { createComponentFactory } from '@ngneat/spectator/jest'; import { MockComponent } from 'ng-mocks'; import { of, throwError } from 'rxjs'; -import { Sidebar } from 'primeng/sidebar'; +import { Sidebar } from 'primeng/drawer'; import { BlockEditorModule, DotBlockEditorComponent } from '@dotcms/block-editor'; import { diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.ts index 7de9c437b132..dfa371cc6b79 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/components/dot-block-editor-sidebar/dot-block-editor-sidebar.component.ts @@ -6,7 +6,7 @@ import { FormsModule } from '@angular/forms'; import { ButtonModule } from 'primeng/button'; import { ConfirmDialogModule } from 'primeng/confirmdialog'; -import { SidebarModule } from 'primeng/sidebar'; +import { DrawerModule } from 'primeng/drawer'; import { map, take } from 'rxjs/operators'; @@ -40,7 +40,7 @@ export const INLINE_EDIT_BLOCK_EDITOR_EVENT = 'edit-block-editor'; imports: [ FormsModule, BlockEditorModule, - SidebarModule, + DrawerModule, DotMessagePipe, ButtonModule, ConfirmDialogModule diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.html index 242745cddbf3..2723c144c7ec 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.html @@ -1,6 +1,6 @@ @if ($shellProps()?.canRead) { @if ($toggleLockOptions()?.showBanner && $showBanner()) { - +
@@ -33,7 +33,7 @@ (click)="onCloseMessage()" />
- + } diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.ts index d3dcfc5df4c7..598d559ef4a9 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/dot-ema-shell/dot-ema-shell.component.ts @@ -6,7 +6,7 @@ import { ActivatedRoute, Params, Router, RouterModule } from '@angular/router'; import { ConfirmationService, MessageService } from 'primeng/api'; import { ConfirmDialogModule } from 'primeng/confirmdialog'; import { DialogService } from 'primeng/dynamicdialog'; -import { MessagesModule } from 'primeng/messages'; +import { MessageModule } from 'primeng/message'; import { ToastModule } from 'primeng/toast'; import { @@ -83,7 +83,7 @@ import { DotEmaDialogComponent, DotInfoPageComponent, DotNotLicenseComponent, - MessagesModule, + MessageModule, DotMessagePipe ] }) diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.html index 455845efe7d4..54d9b8f94e29 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.html @@ -1,4 +1,4 @@ - + - + diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.ts index 27c28caa8abb..f199839611aa 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-favorite-selector/dot-favorite-selector.component.ts @@ -5,7 +5,7 @@ import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop'; import { FormsModule } from '@angular/forms'; import { Listbox, ListboxModule } from 'primeng/listbox'; -import { OverlayPanel, OverlayPanelModule } from 'primeng/overlaypanel'; +import { Popover, PopoverModule } from 'primeng/popover'; import { debounceTime, finalize, switchMap } from 'rxjs/operators'; @@ -36,7 +36,7 @@ const CONTENT_TYPE_CATEGORIES = [ @Component({ selector: 'dot-favorite-selector', - imports: [FormsModule, ListboxModule, DotMessagePipe, OverlayPanelModule], + imports: [FormsModule, ListboxModule, DotMessagePipe, PopoverModule], templateUrl: './dot-favorite-selector.component.html', styleUrls: ['./dot-favorite-selector.component.scss'] }) @@ -48,8 +48,8 @@ const CONTENT_TYPE_CATEGORIES = [ * debouncing, and persists selections using the favorites service. */ export class DotFavoriteSelectorComponent implements OnInit { - /** Reference to the overlay panel instance controlling visibility. */ - $overlayPanel = viewChild.required(OverlayPanel); + /** Reference to the popover instance controlling visibility. */ + $overlayPanel = viewChild.required(Popover); /** Reference to the PrimeNG Listbox to manage its built-in filter. */ $listbox = viewChild.required(Listbox); readonly #store = inject(DotPaletteListStore); diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-uve-palette-list/dot-uve-palette-list.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-uve-palette-list/dot-uve-palette-list.component.ts index 3c457f2dd11d..7b18cb08b2aa 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-uve-palette-list/dot-uve-palette-list.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/components/dot-uve-palette-list/dot-uve-palette-list.component.ts @@ -22,8 +22,8 @@ import { IconFieldModule } from 'primeng/iconfield'; import { InputIconModule } from 'primeng/inputicon'; import { InputTextModule } from 'primeng/inputtext'; import { MenuModule } from 'primeng/menu'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; import { PaginatorModule, PaginatorState } from 'primeng/paginator'; +import { PopoverModule } from 'primeng/popover'; import { SkeletonModule } from 'primeng/skeleton'; import { debounceTime, distinctUntilChanged } from 'rxjs/operators'; @@ -76,7 +76,7 @@ import { DotUVEPaletteContenttypeComponent } from '../dot-uve-palette-contenttyp MenuModule, PaginatorModule, SkeletonModule, - OverlayPanelModule, + PopoverModule, DotFavoriteSelectorComponent, DotMessagePipe, ContextMenuModule diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.html index e475c439b37e..d9632e76f1e2 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.html @@ -1,5 +1,5 @@ - - + +
@@ -13,8 +13,8 @@ [languageId]="$languageId()" [pagePath]="$pagePath()" /> } - - + +
@@ -26,8 +26,8 @@ [languageId]="$languageId()" [pagePath]="$pagePath()" /> } - - + +
@@ -39,5 +39,5 @@ [languageId]="$languageId()" [pagePath]="$pagePath()" /> } - - + + diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.spec.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.spec.ts index 41ede9802216..d4df340b7500 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.spec.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.spec.ts @@ -4,7 +4,7 @@ import { MockComponent, ngMocks } from 'ng-mocks'; import { Component, DebugElement } from '@angular/core'; import { By } from '@angular/platform-browser'; -import { TabView } from 'primeng/tabview'; +import { TabView } from 'primeng/tabs'; import { DotUvePaletteListComponent } from './components/dot-uve-palette-list/dot-uve-palette-list.component'; import { DotUvePaletteComponent } from './dot-uve-palette.component'; @@ -19,7 +19,7 @@ function triggerTabChange( index: number ): void { const tabViewDebugElement: DebugElement = spectator.debugElement.query(By.directive(TabView)); - const tabViewComponent: TabView = tabViewDebugElement?.componentInstance; + const tabViewComponent: Tabs = tabViewDebugElement?.componentInstance; if (tabViewComponent && tabViewComponent.activeIndexChange) { tabViewComponent.activeIndexChange.emit(index); diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.ts index 65ae614815cc..873efecb0afc 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-palette/dot-uve-palette.component.ts @@ -1,6 +1,6 @@ import { ChangeDetectionStrategy, Component, input, signal } from '@angular/core'; -import { TabViewModule } from 'primeng/tabview'; +import { TabsModule } from 'primeng/tabs'; import { TooltipModule } from 'primeng/tooltip'; import { DEFAULT_VARIANT_ID } from '@dotcms/dotcms-models'; @@ -10,7 +10,7 @@ import { DotUVEPaletteListTypes } from './models'; @Component({ selector: 'dot-uve-palette', - imports: [TabViewModule, DotUvePaletteListComponent, TooltipModule], + imports: [TabsModule, DotUvePaletteListComponent, TooltipModule], templateUrl: './dot-uve-palette.component.html', styleUrl: './dot-uve-palette.component.scss', changeDetection: ChangeDetectionStrategy.OnPush diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.html index 3ce23ee34f32..cd17b5e6e3f4 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.html @@ -6,7 +6,7 @@ pButton icon="pi pi-globe" data-testId="language-button"> - + - + diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.ts index 877709707e2c..a89c61a73053 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-language-selector/edit-ema-language-selector.component.ts @@ -14,7 +14,7 @@ import { import { ButtonModule } from 'primeng/button'; import { Listbox, ListboxChangeEvent, ListboxModule } from 'primeng/listbox'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; +import { PopoverModule } from 'primeng/popover'; import { map } from 'rxjs/operators'; @@ -23,7 +23,7 @@ import { DotLanguage } from '@dotcms/dotcms-models'; @Component({ selector: 'dot-edit-ema-language-selector', - imports: [OverlayPanelModule, ListboxModule, ButtonModule, AsyncPipe, NgClass], + imports: [PopoverModule, ListboxModule, ButtonModule, AsyncPipe, NgClass], templateUrl: './edit-ema-language-selector.component.html', styleUrls: ['./edit-ema-language-selector.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.html index 4b562c66f6cf..2e8af5c7df61 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.html @@ -18,7 +18,7 @@ dotAvatar> } - + } - + diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.ts b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.ts index 1154922ad68c..768c290a158d 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.ts +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/components/edit-ema-persona-selector/edit-ema-persona-selector.component.ts @@ -20,8 +20,8 @@ import { ButtonModule } from 'primeng/button'; import { ChipModule } from 'primeng/chip'; import { ConfirmDialogModule } from 'primeng/confirmdialog'; import { Listbox, ListboxModule } from 'primeng/listbox'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; import { PaginatorModule } from 'primeng/paginator'; +import { PopoverModule } from 'primeng/popover'; import { catchError } from 'rxjs/operators'; @@ -43,7 +43,7 @@ interface PersonaSelector { NgClass, ButtonModule, AvatarModule, - OverlayPanelModule, + PopoverModule, DotAvatarDirective, DotMessagePipe, ListboxModule, diff --git a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/dot-uve-toolbar.component.html b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/dot-uve-toolbar.component.html index 4efe40b4efe5..535c7daceae5 100644 --- a/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/dot-uve-toolbar.component.html +++ b/core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/dot-uve-toolbar/dot-uve-toolbar.component.html @@ -32,7 +32,7 @@ icon="pi pi-copy" styleClass="p-button-text p-button-sm p-button-rounded" data-testId="uve-toolbar-copy-url"> - +
@for (url of $pageURLS(); track url.value) {
@@ -49,7 +49,7 @@
}
-
+ - @if ($showActions()) {
- - + { DotContentComparePreviewFieldComponent, DotContentCompareBlockEditorComponent, TableModule, - DropdownModule, + SelectModule, SelectButtonModule, DotDiffPipe, DotMessagePipe, @@ -340,7 +340,7 @@ describe('DotContentCompareTableComponent', () => { ).toEqual('edit.content.sidebar.history.menu.current'); }); it('should show dropdown', () => { - const dropdown: Dropdown = de.query(By.css('p-dropdown')).componentInstance; + const dropdown: Select = de.query(By.css('p-dropdown')).componentInstance; expect(dropdown.options).toEqual(dotContentCompareTableDataMock.versions); }); it('should show selectButton', () => { @@ -481,7 +481,7 @@ describe('DotContentCompareTableComponent', () => { describe('events', () => { it('should emit changeVersion', () => { jest.spyOn(hostComponent.changeVersion, 'emit'); - const dropdown: Dropdown = de.query(By.css('p-dropdown')).componentInstance; + const dropdown: Select = de.query(By.css('p-dropdown')).componentInstance; dropdown.onChange.emit({ value: 'test', originalEvent: createFakeEvent('click') }); expect(hostComponent.changeVersion.emit).toHaveBeenCalledWith('test'); diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.ts b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.ts index 3fbe01163fe8..b4b6920a5496 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-content-compare/components/dot-content-compare-table/dot-content-compare-table.component.ts @@ -3,7 +3,7 @@ import { Component, EventEmitter, Input, Output, inject, input } from '@angular/ import { FormsModule } from '@angular/forms'; import { ButtonModule } from 'primeng/button'; -import { DropdownModule } from 'primeng/dropdown'; +import { SelectModule } from 'primeng/select'; import { SelectButtonModule } from 'primeng/selectbutton'; import { TableModule } from 'primeng/table'; @@ -23,7 +23,7 @@ import { DotContentComparePreviewFieldComponent } from '../fields/dot-content-co CommonModule, FormsModule, TableModule, - DropdownModule, + SelectModule, SelectButtonModule, ButtonModule, DotMessagePipe, diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.html b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.html index 624443a296ff..edcf2eec1867 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.html +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.html @@ -2,7 +2,7 @@
} -
} - + diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.spec.ts b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.spec.ts index 21a7f4cb3057..28978d5c30d0 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.spec.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.spec.ts @@ -8,7 +8,7 @@ import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { RouterTestingModule } from '@angular/router/testing'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; +import { PopoverModule } from 'primeng/popover'; import { DotCurrentUserService, DotDevicesService, DotMessageService } from '@dotcms/data-access'; import { CoreWebService, CoreWebServiceMock } from '@dotcms/dotcms-js'; @@ -61,7 +61,7 @@ describe('DotDeviceSelectorSeoComponent', () => { imports: [ DotDeviceSelectorSeoComponent, HttpClientTestingModule, - OverlayPanelModule, + PopoverModule, NoopAnimationsModule, RouterTestingModule ], @@ -198,7 +198,7 @@ describe('DotDeviceSelectorSeoComponent', () => { }); it('should emit hideOverlayPanel event when onHideDeviceSelector is called', () => { - jest.spyOn(component.hideOverlayPanel, 'emit'); + jest.spyOn(component.hidePopover, 'emit'); component.onHideDeviceSelector(); expect(component.hideOverlayPanel.emit).toHaveBeenCalled(); }); diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.stories.ts b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.stories.ts index 49bba263028a..2d7aea600959 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.stories.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.stories.ts @@ -10,9 +10,9 @@ import { ActivatedRoute } from '@angular/router'; import { ButtonModule } from 'primeng/button'; import { DividerModule } from 'primeng/divider'; -import { DropdownModule } from 'primeng/dropdown'; -import { OverlayPanelModule } from 'primeng/overlaypanel'; import { PanelModule } from 'primeng/panel'; +import { PopoverModule } from 'primeng/popover'; +import { SelectModule } from 'primeng/select'; import { DotCurrentUserService, DotDevicesService, DotMessageService } from '@dotcms/data-access'; import { CoreWebService, CoreWebServiceMock } from '@dotcms/dotcms-js'; @@ -45,11 +45,11 @@ const meta: Meta = { moduleMetadata({ imports: [ CommonModule, - DropdownModule, + SelectModule, FormsModule, DotIconModule, ButtonModule, - OverlayPanelModule, + PopoverModule, PanelModule, DividerModule, DotMessagePipe, diff --git a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.ts b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.ts index d044bad1dc32..dd7ebab40ee9 100644 --- a/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.ts +++ b/core-web/libs/portlets/edit-ema/ui/src/lib/dot-device-selector-seo/dot-device-selector-seo.component.ts @@ -16,9 +16,9 @@ import { RouterLink } from '@angular/router'; import { ButtonModule } from 'primeng/button'; import { DividerModule } from 'primeng/divider'; -import { DropdownModule } from 'primeng/dropdown'; -import { OverlayPanel, OverlayPanelModule } from 'primeng/overlaypanel'; import { PanelModule } from 'primeng/panel'; +import { Popover, PopoverModule } from 'primeng/popover'; +import { SelectModule } from 'primeng/select'; import { filter, map, mergeMap, take, toArray } from 'rxjs/operators'; @@ -36,10 +36,10 @@ import { WINDOW } from '@dotcms/utils'; @Component({ imports: [ CommonModule, - DropdownModule, + SelectModule, FormsModule, ButtonModule, - OverlayPanelModule, + PopoverModule, PanelModule, DividerModule, DotMessagePipe, @@ -69,7 +69,7 @@ export class DotDeviceSelectorSeoComponent implements OnInit { @Output() selected = new EventEmitter(); @Output() changeSeoMedia = new EventEmitter(); @Output() hideOverlayPanel = new EventEmitter(); - @ViewChild('deviceSelector') overlayPanel: OverlayPanel; + @ViewChild('deviceSelector') overlayPanel: Popover; previewUrl: string; protected linkToAddDevice = '/c/content'; diff --git a/core-web/libs/template-builder/project.json b/core-web/libs/template-builder/project.json index 790807c30f97..07054e4fffaa 100644 --- a/core-web/libs/template-builder/project.json +++ b/core-web/libs/template-builder/project.json @@ -32,7 +32,6 @@ "apps/dotcms-ui/src/assets/material-icons.css", "node_modules/primeicons/primeicons.css", "node_modules/primeflex/primeflex.css", - "node_modules/primeng/resources/primeng.min.css", "node_modules/gridstack/dist/gridstack.min.css" ] }, @@ -55,7 +54,6 @@ }, "styles": [ "libs/dotcms-scss/angular/styles.scss", - "node_modules/primeng/resources/primeng.min.css", "node_modules/primeicons/primeicons.css", "node_modules/primeflex/primeflex.css", "apps/dotcms-ui/src/assets/material-icons.css", diff --git a/core-web/libs/template-builder/src/lib/components/template-builder/components/dot-layout-properties/dot-layout-properties.component.html b/core-web/libs/template-builder/src/lib/components/template-builder/components/dot-layout-properties/dot-layout-properties.component.html index eb4137a14305..068efd53a3d7 100644 --- a/core-web/libs/template-builder/src/lib/components/template-builder/components/dot-layout-properties/dot-layout-properties.component.html +++ b/core-web/libs/template-builder/src/lib/components/template-builder/components/dot-layout-properties/dot-layout-properties.component.html @@ -1,4 +1,4 @@ -
- + - -
-
- } +
+ @for ( + containerContent of getcontainerStructures.controls; + track containerContent; + let i = $index + ) { + +
+ + +
+
+ } +
diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-code/dot-container-code.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-code/dot-container-code.component.ts index 065c3a37a458..831d0ea06888 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-code/dot-container-code.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-code/dot-container-code.component.ts @@ -98,17 +98,22 @@ export class DotContentEditorComponent implements OnInit, OnChanges { /** * If the index is null or 0, prevent the default action and stop propagation. Otherwise, update the active tab index * and push the container content - * @param {MouseEvent} e - MouseEvent - The event object that was triggered by the click. + * @param {any} event - The change event object containing the value. * @param {number} [index=null] - number = null * @returns false */ - public handleTabClick(e: MouseEvent, index: number = null): boolean { - if (index === null || index === 0) { - e.preventDefault(); - e.stopPropagation(); + public handleTabClick(event: any, index: number = null): boolean { + const tabIndex = index !== null ? index : (event?.value ?? 0); + if (tabIndex === 0) { + if (event?.preventDefault) { + event.preventDefault(); + } + if (event?.stopPropagation) { + event.stopPropagation(); + } } else { - this.updateActiveTabIndex(index); - this.focusCurrentEditor(index); + this.updateActiveTabIndex(tabIndex); + this.focusCurrentEditor(tabIndex); } return false; diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-create.component.html b/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-create.component.html index 34679ab25bbe..34a88cdd9e4f 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-create.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-containers/dot-container-create/dot-container-create.component.html @@ -1,35 +1,37 @@
- - - + + + {{ 'message.containers.tab.properties' | dm }} - - - - - - @if (containerId) { - - + + @if (containerId) { + {{ 'message.containers.tab.permissions' | dm }} - - + + } + @if (containerId) { + + {{ 'message.containers.tab.history' | dm }} + + } + + + + + + @if (containerId) { + - - - } - @if (containerId) { - - - {{ 'message.containers.tab.history' | dm }} - - + + } + @if (containerId) { + - - - } + + } +
diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.html b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.html index 684a0ad77fde..ee2f4d3af551 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.html @@ -1,11 +1,12 @@ - paginatorService.paginationPerPage ? 'paginator' : '' " - [header]="'modes.Add-Form' | dm" + (visibleChange)="shutdown.emit($event)" #dialog>
- + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.ts index 07956f1d45f2..8bb51641620a 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-edit-page/content/components/dot-form-selector/dot-form-selector.component.ts @@ -12,19 +12,21 @@ import { import { LazyLoadEvent } from 'primeng/api'; import { ButtonModule } from 'primeng/button'; +import { DialogModule, Dialog } from 'primeng/dialog'; import { Table, TableModule } from 'primeng/table'; import { take } from 'rxjs/operators'; + import { PaginatorService } from '@dotcms/data-access'; import { DotCMSContentType } from '@dotcms/dotcms-models'; -import { DotDialogComponent, DotMessagePipe } from '@dotcms/ui'; +import { DotMessagePipe } from '@dotcms/ui'; @Component({ selector: 'dot-form-selector', templateUrl: './dot-form-selector.component.html', styleUrls: ['./dot-form-selector.component.scss'], - imports: [TableModule, DotDialogComponent, ButtonModule, DotMessagePipe], + imports: [TableModule, DialogModule, ButtonModule, DotMessagePipe], providers: [PaginatorService] }) export class DotFormSelectorComponent implements OnInit, OnChanges { @@ -38,7 +40,7 @@ export class DotFormSelectorComponent implements OnInit, OnChanges { @ViewChild('datatable', { static: true }) datatable: Table; - @ViewChild('dialog', { static: true }) dotDialog: DotDialogComponent; + @ViewChild('dialog', { static: true }) dotDialog: Dialog; items: DotCMSContentType[]; contentMinHeight: string; @@ -50,13 +52,12 @@ export class DotFormSelectorComponent implements OnInit, OnChanges { ngOnChanges(changes: SimpleChanges) { setTimeout(() => { if (changes.show.currentValue) { + // container is already the native element + const dialogElement = this.dotDialog.container as HTMLElement; + const tableElement = dialogElement?.querySelector('.p-datatable'); this.contentMinHeight = - this.paginatorService.totalRecords > this.paginatorService.paginationPerPage - ? `${ - this.dotDialog.dialog.nativeElement - .querySelector('.p-datatable') - .getBoundingClientRect().height - }px` + this.paginatorService.totalRecords > this.paginatorService.paginationPerPage && tableElement + ? `${tableElement.getBoundingClientRect().height}px` : ''; this.datatable.tableViewChild.nativeElement.querySelector('button')?.focus(); } diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-templates/dot-template-create-edit/dot-template-builder/dot-template-builder.component.html b/core-web/apps/dotcms-ui/src/app/portlets/dot-templates/dot-template-create-edit/dot-template-builder/dot-template-builder.component.html index 606556c19f1a..67c291ffe893 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-templates/dot-template-create-edit/dot-template-builder/dot-template-builder.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-templates/dot-template-create-edit/dot-template-builder/dot-template-builder.component.html @@ -1,9 +1,17 @@ - - - + + + {{ item.type === 'advanced' ? ('code' | dm) : ('design' | dm) }} - - + + + {{ 'Permissions' | dm }} + + + {{ 'History' | dm }} + + + + @switch (item.type) { @case ('advanced') { } } -
- - - - {{ 'Permissions' | dm }} - - + + - - - - - {{ 'History' | dm }} - - + + - - + + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-drop-zone/content-type-fields-drop-zone.component.html b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-drop-zone/content-type-fields-drop-zone.component.html index 5ffbeaaf2c21..fc4fe9643c20 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-drop-zone/content-type-fields-drop-zone.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-drop-zone/content-type-fields-drop-zone.component.html @@ -25,80 +25,101 @@ - - - - + [modal]="true" + [style]="{ width: '45rem' }" + (visibleChange)="removeFieldsWithoutId()"> + + + {{ 'contenttypes.dropzone.tab.overview' | dm }} - - @if ( - currentFieldType?.clazz === - 'com.dotcms.contenttype.model.field.ImmutableWysiwygField' - ) { - + + @if (!!currentField?.id && isFieldWithSettings) { + + {{ 'Settings' | dm }} + } -
- + + {{ 'contenttypes.dropzone.tab.variables' | dm }} + + + + @if ( - !!currentField?.id && currentFieldType?.clazz === - 'com.dotcms.contenttype.model.field.ImmutableWysiwygField' + 'com.dotcms.contenttype.model.field.ImmutableWysiwygField' ) { - + } -
- - @if (!!currentField?.id && isFieldWithSettings) { - - - {{ 'Settings' | dm }} - - @switch (this.currentFieldType?.clazz) { - @case ('com.dotcms.contenttype.model.field.ImmutableStoryBlockField') { - +
+ + @if ( + !!currentField?.id && + currentFieldType?.clazz === + 'com.dotcms.contenttype.model.field.ImmutableWysiwygField' + ) { + } - @case ('com.dotcms.contenttype.model.field.ImmutableBinaryField') { - +
+ + @if (!!currentField?.id && isFieldWithSettings) { + + @switch (this.currentFieldType?.clazz) { + @case ('com.dotcms.contenttype.model.field.ImmutableStoryBlockField') { + + } + @case ('com.dotcms.contenttype.model.field.ImmutableBinaryField') { + + } } - } -
- } - - - - {{ 'contenttypes.dropzone.tab.variables' | dm }} - - + + } + - - + +
-
+ @if (dialogActions && !hideButtons) { + + @if (dialogActions.cancel) { + + } + @if (dialogActions.accept) { + + } + + } + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-properties-form/field-properties/values-property/values-property.component.html b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-properties-form/field-properties/values-property/values-property.component.html index d27c9a424965..fcb4ecb13afc 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-properties-form/field-properties/values-property/values-property.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/components/fields/content-type-fields-properties-form/field-properties/values-property/values-property.component.html @@ -1,4 +1,4 @@ -
+
- - - + + + {{ 'contenttypes.tab.fields.header' | dm }} - -
-
- -
-
- - -
-
-
- @if (contentType) { - - + + @if (contentType) { + {{ 'contenttypes.tab.relationship.header' | dm }} - - + + } + @if (contentType && showPermissionsTab | async) { + + {{ 'contenttypes.tab.permissions.header' | dm }} + + } + @if (contentType) { + + {{ 'contenttypes.tab.publisher.push.history.header' | dm }} + + } + + + +
+
+ +
+
+ + +
+
+
+ @if (contentType) { + - - - } - @if (contentType && showPermissionsTab | async) { - - - {{ 'contenttypes.tab.permissions.header' | dm }} - - + + } + @if (contentType && showPermissionsTab | async) { + - - - } - @if (contentType) { - - - {{ 'contenttypes.tab.publisher.push.history.header' | dm }} - - + + } + @if (contentType) { + - - - } + + } +
@if (addToMenuContentType) { } - + [header]="templateInfo.header" + [modal]="true" + [closable]="dialogCloseable" + [style]="{ width: '50rem' }" + (visibleChange)="onDialogHide()"> @if (show) { } - + + @if (dialogActions?.cancel) { + + } + @if (dialogActions?.accept) { + + } + + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.component.ts index 7eb71cfaf0ba..b2b1a8ca8cc5 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.component.ts @@ -303,7 +303,10 @@ export class DotContentTypesEditComponent implements OnInit, OnDestroy { } }, cancel: { - label: 'Cancel' + label: 'Cancel', + action: () => { + this.onDialogHide(); + } } }; } diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.module.ts b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.module.ts index 453472688d0b..1ef7457ec7e7 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.module.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-edit/dot-content-types-edit.module.ts @@ -28,7 +28,6 @@ import { DotApiLinkComponent, DotAutofocusDirective, DotCopyButtonComponent, - DotDialogComponent, DotFieldRequiredDirective, DotFieldValidationMessageComponent, DotIconComponent, @@ -131,7 +130,6 @@ import { DotFeatureFlagResolver } from '../resolvers/dot-feature-flag-resolver.s DotContentTypeFieldsVariablesComponent, RouterModule.forChild(dotContentTypesEditRoutes), DotCopyLinkComponent, - DotDialogComponent, DotDirectivesModule, DotSafeHtmlPipe, DotSecondaryToolbarComponent, diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.html b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.html index 02ca2a29b13e..985d76c56256 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.html @@ -1,9 +1,9 @@ - + [modal]="true" + [style]="{ width: '592px' }" + (visibleChange)="close()">
- + @if (dialogActions) { + + @if (dialogActions.cancel) { + + } + @if (dialogActions.accept) { + + } + + } + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.ts index 3ed23e0e2de5..88d40858a094 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-add-to-menu/dot-add-to-menu.component.ts @@ -6,9 +6,11 @@ import { ElementRef, EventEmitter, Input, + OnChanges, OnDestroy, OnInit, Output, + SimpleChanges, ViewChild, inject } from '@angular/core'; @@ -19,6 +21,8 @@ import { Validators } from '@angular/forms'; +import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; import { InputTextModule } from 'primeng/inputtext'; import { RadioButtonModule } from 'primeng/radiobutton'; import { SelectModule } from 'primeng/select'; @@ -29,7 +33,6 @@ import { DotMessageService } from '@dotcms/data-access'; import { DotCMSContentType, DotDialogActions, DotMenu } from '@dotcms/dotcms-models'; import { DotAutofocusDirective, - DotDialogComponent, DotFieldRequiredDirective, DotFieldValidationMessageComponent, DotMessagePipe @@ -47,17 +50,18 @@ import { DotMenuService } from '../../../../../api/services/dot-menu.service'; imports: [ CommonModule, ReactiveFormsModule, + DialogModule, + ButtonModule, SelectModule, InputTextModule, RadioButtonModule, DotAutofocusDirective, - DotDialogComponent, DotFieldValidationMessageComponent, DotFieldRequiredDirective, DotMessagePipe ] }) -export class DotAddToMenuComponent implements OnInit, OnDestroy { +export class DotAddToMenuComponent implements OnInit, OnDestroy, OnChanges { fb = inject(UntypedFormBuilder); private dotMessageService = inject(DotMessageService); private dotMenuService = inject(DotMenuService); @@ -89,6 +93,15 @@ export class DotAddToMenuComponent implements OnInit, OnDestroy { ); } + ngOnChanges(changes: SimpleChanges): void { + if (changes.contentType) { + this.dialogShow = !!this.contentType; + if (this.contentType) { + this.initForm(); + } + } + } + ngOnDestroy(): void { this.destroy$.next(true); this.destroy$.complete(); @@ -100,6 +113,7 @@ export class DotAddToMenuComponent implements OnInit, OnDestroy { */ close(): void { this.cancel.emit(true); + this.dialogShow = false; } /** diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.html b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.html index d3cf000e046e..d736d9131733 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.html @@ -1,11 +1,10 @@ - + [modal]="true" + [style]="{ width: '600px' }" + styleClass="no-overflow" + (visibleChange)="closeDialog()">
@@ -59,4 +58,24 @@ formControlName="host">
-
+ @if (dialogActions$ | async; as actions) { + + @if (actions.cancel) { + + } + @if (actions.accept) { + + } + + } + diff --git a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.ts index 780998fc2476..e09145c9ea2d 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/shared/dot-content-types-listing/components/dot-content-type-copy-dialog/dot-content-type-copy-dialog.component.ts @@ -21,6 +21,8 @@ import { Validators } from '@angular/forms'; +import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; import { InputTextModule } from 'primeng/inputtext'; import { map } from 'rxjs/operators'; @@ -29,7 +31,6 @@ import { DotMessageService } from '@dotcms/data-access'; import { DotCopyContentTypeDialogFormFields, DotDialogActions } from '@dotcms/dotcms-models'; import { DotAutofocusDirective, - DotDialogComponent, DotFieldRequiredDirective, DotFieldValidationMessageComponent, DotMessagePipe, @@ -48,9 +49,10 @@ import { DotCMSAssetDialogCopyFields } from '../../dot-content-type.store'; imports: [ CommonModule, ReactiveFormsModule, + DialogModule, + ButtonModule, InputTextModule, DotFieldValidationMessageComponent, - DotDialogComponent, DotMdIconSelectorComponent, DotSiteSelectorFieldComponent, DotAutofocusDirective, diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-action-button/dot-action-button.component.html b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-action-button/dot-action-button.component.html index 172f5b8d7219..84571985af44 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-action-button/dot-action-button.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-action-button/dot-action-button.component.html @@ -7,7 +7,7 @@ [disabled]="disabled" [icon]="icon" data-testid="dot-action-button" - styleClass="p-button-rounded"> + class="p-button-rounded"> @if (label) {

diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.html b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.html index f436b483f5b0..de76a304344f 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.html @@ -1,8 +1,9 @@ - + [modal]="true" + [style]="{ width: '50rem' }" + (visibleChange)="close()"> @if (showDialog) {

{{ errorMessage }} } - + + @if (dialogActions?.cancel) { + + } + @if (dialogActions?.accept) { + + } + + diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.ts index 2ada9f319eb4..695cc2286635 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-download-bundle-dialog/dot-download-bundle-dialog.component.ts @@ -10,6 +10,8 @@ import { } from '@angular/forms'; import { SelectItem } from 'primeng/api'; +import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; import { SelectModule } from 'primeng/select'; import { SelectButtonModule } from 'primeng/selectbutton'; @@ -21,7 +23,7 @@ import { DotPushPublishFiltersService } from '@dotcms/data-access'; import { DotDialogActions } from '@dotcms/dotcms-models'; -import { DotDialogComponent, DotFieldRequiredDirective, DotMessagePipe } from '@dotcms/ui'; +import { DotFieldRequiredDirective, DotMessagePipe } from '@dotcms/ui'; import { getDownloadLink } from '@dotcms/utils'; import { DotDownloadBundleDialogService } from '../../../../api/services/dot-download-bundle-dialog/dot-download-bundle-dialog.service'; @@ -40,9 +42,10 @@ const DOWNLOAD_URL = '/api/bundle/_generate'; imports: [ FormsModule, ReactiveFormsModule, + DialogModule, + ButtonModule, SelectModule, SelectButtonModule, - DotDialogComponent, DotFieldRequiredDirective, DotMessagePipe ], diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.html b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.html index cf0d7210eed2..33fd6f5f7e02 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.html @@ -1,9 +1,9 @@ - + [modal]="true" + [style]="{ width: '34.25rem' }" + (visibleChange)="close()">

{{ 'generate.secure.password.description' | dm }}

{{ revealBtnLabel }} - + @if (dialogActions) { + + @if (dialogActions.cancel) { + + } + @if (dialogActions.accept) { + + } + + } + diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.ts index ecd17cba1f41..749fb1ca33bb 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-generate-secure-password/dot-generate-secure-password.component.ts @@ -3,18 +3,19 @@ import { Subject } from 'rxjs'; import { Component, OnDestroy, OnInit, inject } from '@angular/core'; import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; import { takeUntil } from 'rxjs/operators'; import { DotGenerateSecurePasswordService, DotMessageService } from '@dotcms/data-access'; import { DotDialogActions } from '@dotcms/dotcms-models'; -import { DotClipboardUtil, DotDialogComponent, DotMessagePipe } from '@dotcms/ui'; +import { DotClipboardUtil, DotMessagePipe } from '@dotcms/ui'; @Component({ selector: 'dot-generate-secure-password', templateUrl: './dot-generate-secure-password.component.html', styleUrls: ['./dot-generate-secure-password.component.scss'], - imports: [ButtonModule, DotDialogComponent, DotMessagePipe], + imports: [ButtonModule, DialogModule, DotMessagePipe], providers: [DotClipboardUtil] }) export class DotGenerateSecurePasswordComponent implements OnInit, OnDestroy { diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.html b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.html index 906d10f208a8..1b481a8a74b4 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.html @@ -1,9 +1,9 @@ - + [modal]="true" + [style]="{ width: '50rem' }" + (visibleChange)="close()"> @if (eventData) { {{ errorMessage }} } - + + @if (dialogActions?.cancel && !eventData?.customCode) { + + } + @if (dialogActions?.accept && !eventData?.customCode) { + + } + + diff --git a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.ts index e30469e612db..f4d9a4b2b8e3 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/_common/dot-push-publish-dialog/dot-push-publish-dialog.component.ts @@ -3,7 +3,9 @@ import { Subject } from 'rxjs'; import { Component, EventEmitter, OnDestroy, OnInit, Output, inject } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { ButtonModule } from 'primeng/button'; import { DatePickerModule } from 'primeng/datepicker'; +import { DialogModule } from 'primeng/dialog'; import { SelectModule } from 'primeng/select'; import { SelectButtonModule } from 'primeng/selectbutton'; @@ -21,7 +23,6 @@ import { DotPushPublishData, DotPushPublishDialogData } from '@dotcms/dotcms-models'; -import { DotDialogComponent } from '@dotcms/ui'; import { DotPushPublishFormComponent } from '../forms/dot-push-publish-form/dot-push-publish-form.component'; @@ -33,9 +34,10 @@ import { DotPushPublishFormComponent } from '../forms/dot-push-publish-form/dot- FormsModule, ReactiveFormsModule, DatePickerModule, + DialogModule, SelectModule, SelectButtonModule, - DotDialogComponent, + ButtonModule, DotPushPublishFormComponent ], providers: [DotPushPublishFiltersService] @@ -51,6 +53,7 @@ export class DotPushPublishDialogComponent implements OnInit, OnDestroy { formData: DotPushPublishData; formValid = false; errorMessage = null; + isSaving = false; @Output() cancel = new EventEmitter(); @@ -78,6 +81,7 @@ export class DotPushPublishDialogComponent implements OnInit, OnDestroy { this.dialogShow = false; this.eventData = null; this.errorMessage = null; + this.isSaving = false; } /** @@ -87,6 +91,7 @@ export class DotPushPublishDialogComponent implements OnInit, OnDestroy { */ submitPushAction(): void { if (this.formValid) { + this.isSaving = true; this.pushPublishService .pushPublishContent( this.eventData.assetIdentifier, @@ -95,6 +100,7 @@ export class DotPushPublishDialogComponent implements OnInit, OnDestroy { ) .pipe(takeUntil(this.destroy$)) .subscribe((result: DotAjaxActionResponseView) => { + this.isSaving = false; if (!result?.errors) { this.close(); } else { diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.html b/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.html index d6dde89a6815..0fa5963e0dbf 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.html @@ -1,14 +1,33 @@ @if (visible) { - + [modal]="true" + [style]="{ width: '500px' }" + appendTo="body" + (visibleChange)="closeDialog()"> - + @if (dialogActions) { + + @if (dialogActions.cancel) { + + } + @if (dialogActions.accept) { + + } + + } + } diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.ts index 2ff1417a7e23..4d7d23cedf01 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-add-persona-dialog/dot-add-persona-dialog.component.ts @@ -1,5 +1,8 @@ import { Component, EventEmitter, Input, OnInit, Output, ViewChild, inject } from '@angular/core'; +import { ButtonModule } from 'primeng/button'; +import { DialogModule } from 'primeng/dialog'; + import { take } from 'rxjs/operators'; import { @@ -8,7 +11,7 @@ import { DotWorkflowActionsFireService } from '@dotcms/data-access'; import { DotDialogActions, DotPersona } from '@dotcms/dotcms-models'; -import { DotDialogComponent, DotMessagePipe } from '@dotcms/ui'; +import { DotMessagePipe } from '@dotcms/ui'; import { DotCreatePersonaFormComponent } from './dot-create-persona-form/dot-create-persona-form.component'; @@ -18,7 +21,7 @@ const PERSONA_CONTENT_TYPE = 'persona'; selector: 'dot-add-persona-dialog', templateUrl: './dot-add-persona-dialog.component.html', styleUrls: ['./dot-add-persona-dialog.component.scss'], - imports: [DotDialogComponent, DotCreatePersonaFormComponent, DotMessagePipe] + imports: [DialogModule, ButtonModule, DotCreatePersonaFormComponent, DotMessagePipe] }) export class DotAddPersonaDialogComponent implements OnInit { private dotMessageService = inject(DotMessageService); diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-crumbtrail/dot-crumbtrail.component.html b/core-web/apps/dotcms-ui/src/app/view/components/dot-crumbtrail/dot-crumbtrail.component.html index 4a8d49fbeb27..30fb29d4bfed 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-crumbtrail/dot-crumbtrail.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-crumbtrail/dot-crumbtrail.component.html @@ -1,7 +1,7 @@ @let collapsedBreadcrumbs = $collapsedBreadcrumbs(); @let lastBreadcrumb = $lastBreadcrumb(); -
+
diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.html b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.html index 1b2189feaa8b..683491f3d1e5 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.html @@ -1,11 +1,11 @@ - - + diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.scss b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.scss index 277b3f439309..9d1f6826c75d 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.scss +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.scss @@ -1,2 +1,6 @@ @use "variables" as *; @import "mixins"; + +::ng-deep .dot-iframe-dialog .p-dialog-header { + background-color: #f1f3f4; +} diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.ts index b8fe6eeddf65..98c003ab962e 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-iframe-dialog/dot-iframe-dialog.component.ts @@ -9,9 +9,8 @@ import { ViewChild } from '@angular/core'; -import { filter } from 'rxjs/operators'; +import { DialogModule, Dialog } from 'primeng/dialog'; -import { DotDialogComponent } from '@dotcms/ui'; import { IframeComponent } from '../_common/iframe/iframe-component/iframe.component'; @@ -19,11 +18,11 @@ import { IframeComponent } from '../_common/iframe/iframe-component/iframe.compo selector: 'dot-iframe-dialog', templateUrl: './dot-iframe-dialog.component.html', styleUrls: ['./dot-iframe-dialog.component.scss'], - imports: [DotDialogComponent, IframeComponent] + imports: [DialogModule, IframeComponent] }) export class DotIframeDialogComponent implements OnChanges, OnInit { @ViewChild('dialog', { static: true }) - dotDialog: DotDialogComponent; + dotDialog: Dialog; @Input() url: string; @@ -51,13 +50,8 @@ export class DotIframeDialogComponent implements OnChanges, OnInit { show: boolean; ngOnInit() { - if (this.beforeClose.observers.length) { - this.dotDialog.beforeClose - .pipe(filter(() => this.show)) - .subscribe((event: { close: () => void }) => { - this.beforeClose.emit(event); - }); - } + // Note: PrimeNG Dialog doesn't have beforeClose event like dot-dialog + // The beforeClose logic would need to be handled differently if needed } ngOnChanges(changes: SimpleChanges) { @@ -80,7 +74,7 @@ export class DotIframeDialogComponent implements OnChanges, OnInit { this.keyWasDown.emit($event); if ($event.key === 'Escape') { - this.dotDialog.close(); + this.show = false; } } diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.html b/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.html index 7a55b57084dd..f59ba3ab5d51 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.html +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.html @@ -1,10 +1,11 @@ @for (message of messages; track message) { - + [modal]="true" + [style]="{ width: message.width || '500px', height: message.height || '400px' }" + (visibleChange)="onVisibilityChange(message, $event)" + #dialog> @if (message.body) {
} @@ -16,5 +17,5 @@ >
} - + } diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.ts b/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.ts index 47c735211675..e73d3154d8cc 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-large-message-display/dot-large-message-display.component.ts @@ -10,10 +10,11 @@ import { inject } from '@angular/core'; +import { DialogModule, Dialog } from 'primeng/dialog'; + import { filter, takeUntil } from 'rxjs/operators'; import { DotcmsEventsService } from '@dotcms/dotcms-js'; -import { DotDialogComponent } from '@dotcms/ui'; import { DotParseHtmlService } from '../../../api/services/dot-parse-html/dot-parse-html.service'; @@ -33,26 +34,35 @@ interface DotLargeMessageDisplayParams { selector: 'dot-large-message-display', templateUrl: './dot-large-message-display.component.html', styleUrls: ['./dot-large-message-display.component.scss'], - imports: [DotDialogComponent], + imports: [DialogModule], providers: [DotParseHtmlService] }) export class DotLargeMessageDisplayComponent implements OnInit, OnDestroy, AfterViewInit { private dotcmsEventsService = inject(DotcmsEventsService); private dotParseHtmlService = inject(DotParseHtmlService); - @ViewChildren(DotDialogComponent) dialogs: QueryList; + @ViewChildren(Dialog) dialogs: QueryList; messages: DotLargeMessageDisplayParams[] = []; + messageVisibility: Map = new Map(); private destroy$: Subject = new Subject(); private recentlyDialogAdded: boolean; + getMessageVisibility(message: DotLargeMessageDisplayParams): boolean { + return this.messageVisibility.get(message) ?? false; + } + + setMessageVisibility(message: DotLargeMessageDisplayParams, visible: boolean): void { + this.messageVisibility.set(message, visible); + } + ngAfterViewInit() { this.dialogs.changes .pipe( takeUntil(this.destroy$), filter(() => this.recentlyDialogAdded) ) - .subscribe((dialogs: QueryList) => { + .subscribe((dialogs: QueryList) => { this.createContent(dialogs.last, this.messages[this.messages.length - 1]); this.recentlyDialogAdded = false; }); @@ -64,6 +74,7 @@ export class DotLargeMessageDisplayComponent implements OnInit, OnDestroy, After .subscribe((content: DotLargeMessageDisplayParams) => { this.recentlyDialogAdded = true; this.messages.push(content); + this.messageVisibility.set(content, !!content.title); }); } @@ -79,17 +90,29 @@ export class DotLargeMessageDisplayComponent implements OnInit, OnDestroy, After * @memberof DotLargeMessageDisplayComponent */ close(messageToRemove: DotLargeMessageDisplayParams) { + this.messageVisibility.delete(messageToRemove); this.messages.splice(this.messages.indexOf(messageToRemove), 1); } + onVisibilityChange(message: DotLargeMessageDisplayParams, visible: boolean): void { + this.setMessageVisibility(message, visible); + if (!visible) { + this.close(message); + } + } + private createContent( - dialogComponent: DotDialogComponent, + dialogComponent: Dialog, content: DotLargeMessageDisplayParams ): void { - const target = dialogComponent.dialog.nativeElement.querySelector('.dialog-message__body'); - this.dotParseHtmlService.parse(content.body, target, true); - if (content.script) { - this.dotParseHtmlService.parse(``, target, false); + // Access the dialog container element - container is already the native element + const dialogElement = dialogComponent.container as HTMLElement; + const target = dialogElement?.querySelector('.dialog-message__body') as HTMLElement; + if (target) { + this.dotParseHtmlService.parse(content.body, target, true); + if (content.script) { + this.dotParseHtmlService.parse(``, target, false); + } } } diff --git a/core-web/apps/dotcms-ui/src/app/view/components/dot-portlet-base/dot-portlet-base.stories.ts b/core-web/apps/dotcms-ui/src/app/view/components/dot-portlet-base/dot-portlet-base.stories.ts index 0cd18e07527b..8b6a622c4caf 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/dot-portlet-base/dot-portlet-base.stories.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/dot-portlet-base/dot-portlet-base.stories.ts @@ -180,7 +180,9 @@ const ExtraActionsTemplate = ` - + diff --git a/core-web/apps/dotcms-ui/src/app/view/components/main-core-legacy/main-core-legacy-component.ts b/core-web/apps/dotcms-ui/src/app/view/components/main-core-legacy/main-core-legacy-component.ts index d34a55ea3b97..548308cda0c4 100644 --- a/core-web/apps/dotcms-ui/src/app/view/components/main-core-legacy/main-core-legacy-component.ts +++ b/core-web/apps/dotcms-ui/src/app/view/components/main-core-legacy/main-core-legacy-component.ts @@ -1,10 +1,11 @@ import { Component, ViewEncapsulation } from '@angular/core'; +import { RouterOutlet } from '@angular/router'; @Component({ encapsulation: ViewEncapsulation.None, providers: [], selector: 'dot-main-core-component', template: '', - standalone: false + imports: [RouterOutlet] }) export class MainCoreLegacyComponent {} diff --git a/core-web/apps/dotcms-ui/src/main.ts b/core-web/apps/dotcms-ui/src/main.ts index f1436078b43c..61697ddb6fde 100644 --- a/core-web/apps/dotcms-ui/src/main.ts +++ b/core-web/apps/dotcms-ui/src/main.ts @@ -1,18 +1,15 @@ -import { enableProdMode, importProvidersFrom } from '@angular/core'; +import { enableProdMode } from '@angular/core'; import { bootstrapApplication } from '@angular/platform-browser'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { defineCustomElements } from '@dotcms/dotcms-webcomponents/loader'; import { AppComponent } from './app/app.component'; -import { AppModule } from './app/app.module'; +import { appConfig } from './app/app.config'; import { environment } from './environments/environment'; if (environment.production) { enableProdMode(); } -bootstrapApplication(AppComponent, { - providers: [importProvidersFrom(AppModule, BrowserAnimationsModule)] -}); +bootstrapApplication(AppComponent, appConfig); defineCustomElements(); diff --git a/core-web/apps/dotcms-ui/src/stories/dotcms/form/DotCMSForms.stories.ts b/core-web/apps/dotcms-ui/src/stories/dotcms/form/DotCMSForms.stories.ts index c18b025fe77a..9ecdad7f99d3 100644 --- a/core-web/apps/dotcms-ui/src/stories/dotcms/form/DotCMSForms.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/dotcms/form/DotCMSForms.stories.ts @@ -279,7 +279,9 @@ const HorizontalTemplate = ` optionLabel="name" >
- +
@@ -311,7 +313,9 @@ const HorizontalTemplate = ` [options]="options" >
- + `; diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/button/Button.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/button/Button.stories.ts index 34e467167845..3676e97159d7 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/button/Button.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/button/Button.stories.ts @@ -73,7 +73,7 @@ export const Default: Story = { [iconPos]="iconPos" [disabled]="disabled" [label]="label" - [styleClass]="classes"> + [class]="classes"> ` }; } diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/button/templates.ts b/core-web/apps/dotcms-ui/src/stories/primeng/button/templates.ts index 3538f96657f2..f1b102fd3ee3 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/button/templates.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/button/templates.ts @@ -1,126 +1,159 @@ export const MainTemplate = `
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- - - - - + + + + +
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
@@ -128,176 +161,183 @@ export const MainTemplate = `
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
+ pButton> + Button + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
+ pButton> + Button + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
@@ -305,243 +345,263 @@ export const MainTemplate = `
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
- - + + + pButton> + Button + + - + disabled="true"> + + Button + +
+ pButton> + Button + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
+ pButton> + Button + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
- + + pButton> + + Button + + pButton> + Button + + + disabled="true"> + + Button + + disabled="true"> + Button +
`; @@ -549,43 +609,49 @@ export const MainTemplate = ` export const IconOnlyTemplate = `
- - + +
- + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
@@ -593,52 +659,54 @@ export const IconOnlyTemplate = `
- + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
@@ -646,79 +714,81 @@ export const IconOnlyTemplate = `
- + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
+ pButton> + + + disabled="true"> + +
`; diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/data/DataView.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/data/DataView.stories.ts index b087c28bcd98..d7a58cb0dac3 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/data/DataView.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/data/DataView.stories.ts @@ -53,7 +53,7 @@ const meta: Meta = { @for(item of products; track item.id){
-
+
@@ -87,7 +87,7 @@ export const Grid: Story = {
@for(item of products; track item.id){
-
+
diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/data/Table.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/data/Table.stories.ts index b5f9f602a039..21e728ac962a 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/data/Table.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/data/Table.stories.ts @@ -160,7 +160,9 @@ const PrimaryTemplate = ` {{car.brand}} {{car.color}} - + diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/form/Checkbox.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/form/Checkbox.stories.ts index 2a9e92090c09..e25af21c5d7f 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/form/Checkbox.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/form/Checkbox.stories.ts @@ -35,7 +35,7 @@ const meta: Meta = { moduleMetadata({ imports: [CheckboxModule, BrowserAnimationsModule, FormsModule, NgFor] }), - componentWrapperDecorator((story) => `
${story}
`) + componentWrapperDecorator((story) => `
${story}
`) ], args: { cities: [...cities], diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/form/InputGroup.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/form/InputGroup.stories.ts index 9b245317fa2c..4f7b0e724264 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/form/InputGroup.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/form/InputGroup.stories.ts @@ -47,7 +47,9 @@ const InputGroupTemplate = `
- +
@@ -55,15 +57,21 @@ const InputGroupTemplate = `
- +
- + - +
diff --git a/core-web/apps/dotcms-ui/src/stories/primeng/form/InputText.stories.ts b/core-web/apps/dotcms-ui/src/stories/primeng/form/InputText.stories.ts index 0a14e956a42a..d6d266e2a18c 100644 --- a/core-web/apps/dotcms-ui/src/stories/primeng/form/InputText.stories.ts +++ b/core-web/apps/dotcms-ui/src/stories/primeng/form/InputText.stories.ts @@ -5,13 +5,13 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { InputText, InputTextModule } from 'primeng/inputtext'; import { PasswordModule } from 'primeng/password'; -const InputTextTemplate = `
-
+const InputTextTemplate = `
+
Enter your username to reset your password.
-
+
@@ -19,7 +19,7 @@ const InputTextTemplate = `
Enter your username to reset your password.
-
+
@@ -28,7 +28,7 @@ const InputTextTemplate = `
Enter your username to reset your password.
-
+
/> Please enter a valid username
-
+

Small

-
-
+
+
Enter your username to reset your password.
-
+
@@ -67,7 +67,7 @@ const InputTextTemplate = `
Enter your username to reset your password.
-
+
@@ -76,7 +76,7 @@ const InputTextTemplate = `
Enter your username to reset your password.
-
+
/> Please enter a valid username
-
+
-
+
+
You can resize this text area
-
+
Please enter a valid text
-
+
@@ -59,8 +59,8 @@ export const Basic: Story = { }; const InputTextAreaTemplateAutoRezise = ` -
-
+
+
You can resize this text area
-
+
Please enter a valid text
-
+
@@ -59,7 +59,7 @@ export const Basic: Story = { }; const InputTextAreaTemplateAutoRezise = ` -
+
- - {{ field.hint }} - - } - @case ('GENERATED_STRING') { - - - } - @case ('BOOL') { -
- - -
- - - {{ field.hint }} - - } - @case ('SELECT') { - + [label]="field.label" + [disabled]="!$appConfigured()" + pButton + type="button"> - + + {{ field.hint }} + + } + @case ('STRING') { + + + + + {{ field.hint }} + + } + @case ('GENERATED_STRING') { + + + } + @case ('BOOL') { +
+ - - {{ field.hint }} - - } + [inputId]="field.name" + [formControlName]="field.name" + [value]="field.value" + [binary]="true"> + +
+ + + {{ field.hint }} + } -
- } -
+ @case ('SELECT') { + + + + + {{ field.hint }} + + } + } +
+ } diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-configuration-detail/dot-apps-configuration-detail-form/dot-apps-configuration-detail-form.component.ts b/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-configuration-detail/dot-apps-configuration-detail-form/dot-apps-configuration-detail-form.component.ts index 411087d01169..8e996af938be 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-configuration-detail/dot-apps-configuration-detail-form/dot-apps-configuration-detail-form.component.ts +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-configuration-detail/dot-apps-configuration-detail-form/dot-apps-configuration-detail-form.component.ts @@ -76,6 +76,7 @@ export class DotAppsConfigurationDetailFormComponent implements OnInit, OnDestro private isDestroyed = false; constructor() { + // TODO: (migration) this is not working, but is not working in demo either effect(() => { const formFields = this.$formFields(); const formContainer = this.$formContainer(); diff --git a/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-import-export-dialog/dot-apps-import-export-dialog.component.html b/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-import-export-dialog/dot-apps-import-export-dialog.component.html index ace634a1ac11..1d03ea411e0f 100644 --- a/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-import-export-dialog/dot-apps-import-export-dialog.component.html +++ b/core-web/apps/dotcms-ui/src/app/portlets/dot-apps/dot-apps-import-export-dialog/dot-apps-import-export-dialog.component.html @@ -7,14 +7,13 @@ styleClass="p-fluid" appendTo="body" (visibleChange)="closeExportDialog()"> -
+ @switch (action) { @case ('Export') {
{{ 'Password' | dm }} -
-