@seniorsistemas/components-ai 2.4.1 → 2.5.0

package/fesm2022/seniorsistemas-components-ai.mjs

@@ -6956,8 +6956,8 @@ class DynamicFormComponent {
                 if (control) {
                     const shouldDisable = this.isFieldDisabled(field);
                     if (shouldDisable && control.enabled) {
-                        control.setValue(null, { emitEvent: false });
                         control.disable({ emitEvent: false });
+                        control.setValue(null);
                     }
                     else if (!shouldDisable && control.disabled && !field.disabled) {
                         control.enable({ emitEvent: false });
@@ -7551,6 +7551,142 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                 args: ['blur', ['$event']]
             }] } });
 
+const STORAGE_KEY = 'sia-layout-expanded';
+/**
+ * Directive that injects an expand/collapse toggle button into elements
+ * with the `.layout-main` class. The button is only visible on screens
+ * wider than 1400px (where the max-width constraint is active).
+ *
+ * When expanded, the element gets `max-width: 100%` removing the 1400px cap.
+ * The user preference is persisted in localStorage.
+ *
+ * Usage:
+ *   Just import the directive in your standalone component or module.
+ *   It auto-applies to any element with class `.layout-main`.
+ *
+ *   ```ts
+ *   imports: [LayoutExpandDirective]
+ *   ```
+ */
+class LayoutExpandDirective {
+    el;
+    renderer;
+    button = null;
+    styleEl = null;
+    expanded = false;
+    constructor(el, renderer) {
+        this.el = el;
+        this.renderer = renderer;
+    }
+    ngAfterViewInit() {
+        this.expanded = localStorage.getItem(STORAGE_KEY) === 'true';
+        this.injectStyles();
+        this.createButton();
+        this.applyState();
+    }
+    ngOnDestroy() {
+        this.button?.remove();
+        this.styleEl?.remove();
+    }
+    toggle() {
+        this.expanded = !this.expanded;
+        localStorage.setItem(STORAGE_KEY, String(this.expanded));
+        this.applyState();
+    }
+    applyState() {
+        const host = this.el.nativeElement;
+        if (this.expanded) {
+            this.renderer.addClass(host, 'layout-main--expanded');
+        }
+        else {
+            this.renderer.removeClass(host, 'layout-main--expanded');
+        }
+        if (this.button) {
+            const icon = this.button.querySelector('i');
+            if (icon) {
+                icon.className = this.expanded ? 'pi pi-window-minimize' : 'pi pi-window-maximize';
+            }
+            this.button.title = this.expanded ? 'Recolher layout' : 'Expandir layout';
+        }
+    }
+    createButton() {
+        const host = this.el.nativeElement;
+        this.button = this.renderer.createElement('button');
+        this.renderer.addClass(this.button, 'sia-layout-expand-btn');
+        this.renderer.setAttribute(this.button, 'type', 'button');
+        this.renderer.setAttribute(this.button, 'title', this.expanded ? 'Recolher layout' : 'Expandir layout');
+        this.renderer.setAttribute(this.button, 'aria-label', 'Expandir ou recolher layout');
+        const icon = this.renderer.createElement('i');
+        icon.className = this.expanded ? 'pi pi-window-minimize' : 'pi pi-window-maximize';
+        this.renderer.appendChild(this.button, icon);
+        this.renderer.listen(this.button, 'click', () => this.toggle());
+        this.renderer.appendChild(host, this.button);
+    }
+    injectStyles() {
+        const host = this.el.nativeElement;
+        // Ensure host is positioned for absolute child
+        const currentPosition = getComputedStyle(host).position;
+        if (currentPosition === 'static') {
+            this.renderer.setStyle(host, 'position', 'relative');
+        }
+        this.styleEl = this.renderer.createElement('style');
+        this.styleEl.textContent = `
+      .layout-main--expanded {
+        max-width: 100% !important;
+        transition: max-width 0.3s ease;
+      }
+
+      .sia-layout-expand-btn {
+        display: none;
+        position: absolute;
+        top: 0.75rem;
+        right: 0.75rem;
+        background: var(--p-surface-0, #ffffff);
+        border: 1px solid var(--p-surface-200, #e2e8f0);
+        border-radius: 6px;
+        padding: 0.5rem;
+        cursor: pointer;
+        color: var(--p-surface-600, #64748b);
+        font-size: 1rem;
+        line-height: 1;
+        transition: all 0.2s ease;
+        z-index: 10;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
+      }
+
+      .sia-layout-expand-btn:hover {
+        background: var(--p-surface-50, #f8fafc);
+        color: var(--p-primary-color, #3b82f6);
+        border-color: var(--p-primary-color, #3b82f6);
+        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
+      }
+
+      .sia-layout-expand-btn:active {
+        transform: scale(0.95);
+      }
+
+      @media (min-width: 1401px) {
+        .sia-layout-expand-btn {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
+    `;
+        this.renderer.appendChild(host, this.styleEl);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutExpandDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: LayoutExpandDirective, isStandalone: true, selector: ".layout-main", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayoutExpandDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '.layout-main',
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }] });
+
 class CpfPipe {
     maskService;
     constructor(maskService) {
@@ -8098,5 +8234,5 @@ const throttle = (func, limit) => {
  * Generated bundle index. Do not edit.
  */
 
-export { AngularComponentsModule, AuthService, BreadcrumbComponent, BulkDeleteDialogComponent, CnpjPipe, CookieService, CpfPipe, DEFAULT_LANGUAGE, DateFormatPipe, DocumentMaskDirective, DocumentPipe, DynamicFieldCheckboxComponent, DynamicFieldDateComponent, DynamicFieldDropdownComponent, DynamicFieldImageComponent, DynamicFieldLookupComponent, DynamicFieldMultiselectComponent, DynamicFieldNumberComponent, DynamicFieldTextComponent, DynamicFieldTextareaComponent, DynamicFieldTimeComponent, DynamicFieldWrapperComponent, DynamicFormComponent, EntityListBaseComponent, EntityService, ExportDialogComponent, FieldType, IassistIconComponent, KanbanBoardComponent, LoadingComponent, LocaleService, MaskService, MoneyMaskDirective, MoneyPipe, PermissionService, PhoneMaskDirective, PhonePipe, PostalCodeMaskDirective, PostalCodePipe, SUPPORTED_LANGUAGES, SeniorPreset, SeniorTokenService, StepsComponent, TRANSLATION_CONFIG, TableLoadingDirective, ThemeService, TranslatePipe, TranslationHelper, TranslationService, WebSocketService, apiInterceptor, createFilterString, createFilterTokens, debounce, deepClone, deepEqual, escapeFilterValue, getEnumQuery, getLabelValueRequest, getLanguageInfo, getProp, getSuggestionValue, getTypeInformation, isValidFilter, mapTokenLocaleToLanguage, mergeUnique, provideSeniorPrimeNG, resolveRefs, setProp, throttle };
+export { AngularComponentsModule, AuthService, BreadcrumbComponent, BulkDeleteDialogComponent, CnpjPipe, CookieService, CpfPipe, DEFAULT_LANGUAGE, DateFormatPipe, DocumentMaskDirective, DocumentPipe, DynamicFieldCheckboxComponent, DynamicFieldDateComponent, DynamicFieldDropdownComponent, DynamicFieldImageComponent, DynamicFieldLookupComponent, DynamicFieldMultiselectComponent, DynamicFieldNumberComponent, DynamicFieldTextComponent, DynamicFieldTextareaComponent, DynamicFieldTimeComponent, DynamicFieldWrapperComponent, DynamicFormComponent, EntityListBaseComponent, EntityService, ExportDialogComponent, FieldType, IassistIconComponent, KanbanBoardComponent, LayoutExpandDirective, LoadingComponent, LocaleService, MaskService, MoneyMaskDirective, MoneyPipe, PermissionService, PhoneMaskDirective, PhonePipe, PostalCodeMaskDirective, PostalCodePipe, SUPPORTED_LANGUAGES, SeniorPreset, SeniorTokenService, StepsComponent, TRANSLATION_CONFIG, TableLoadingDirective, ThemeService, TranslatePipe, TranslationHelper, TranslationService, WebSocketService, apiInterceptor, createFilterString, createFilterTokens, debounce, deepClone, deepEqual, escapeFilterValue, getEnumQuery, getLabelValueRequest, getLanguageInfo, getProp, getSuggestionValue, getTypeInformation, isValidFilter, mapTokenLocaleToLanguage, mergeUnique, provideSeniorPrimeNG, resolveRefs, setProp, throttle };
 //# sourceMappingURL=seniorsistemas-components-ai.mjs.map