@ruc-lib/drawer 3.1.0 → 3.2.0

package/fesm2020/ruc-lib-drawer.mjs

@@ -0,0 +1,525 @@
+import * as i0 from '@angular/core';
+import { Pipe, EventEmitter, ViewContainerRef, Component, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import * as i2 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i3 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i4 from '@angular/material/sidenav';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import * as i1 from '@angular/platform-browser';
+import { MatToolbarModule } from '@angular/material/toolbar';
+
+/**
+ * @Pipe SafeHtmlPipe
+ * @name safeHtml
+ * @description A pipe that bypasses Angular's built-in security and sanitizes HTML content,
+ * allowing it to be safely rendered in the DOM. Use with caution and only with trusted HTML sources.
+ */
+class SafeHtmlPipe {
+    /**
+     * @param sanitizer - An instance of DomSanitizer used to bypass security.
+     */
+    constructor(sanitizer) {
+        this.sanitizer = sanitizer;
+    }
+    /**
+     * Transforms a string containing HTML into a SafeHtml object that can be bound to [innerHTML].
+     * @param value - The HTML string to sanitize.
+     * @returns A SafeHtml object, which Angular trusts as safe HTML.
+     */
+    transform(value) {
+        if (value === null || value === undefined) {
+            return value;
+        }
+        return this.sanitizer.bypassSecurityTrustHtml(value);
+    }
+}
+SafeHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
+SafeHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: SafeHtmlPipe, name: "safeHtml" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SafeHtmlPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'safeHtml' }]
+        }], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; } });
+
+/**
+ * @Component RuclibDrawerComponent
+ * @description A highly configurable drawer component that can slide in from any of the four directions (left, right, top, bottom).
+ * It uses custom Angular animations for smooth transitions and supports theming.
+ */
+class RuclibDrawerComponent {
+    constructor(cdr) {
+        this.cdr = cdr;
+        /**
+         * Input data for configuring the drawer's appearance and behavior.
+         * @see RuclibDrawerInput interface for detailed properties.
+         */
+        this.rucInputData = {};
+        /**
+         * EventEmitter for various drawer events.
+         * Emits objects with `type` (e.g., 'openedStart', 'closedStart', 'openedChange', 'drawerToggle')
+         * and `opened` (boolean) and `position` (string) properties.
+         */
+        this.rucEvent = new EventEmitter();
+        /** Reference to the dynamically created component. */
+        this.dynamicComponentRef = null;
+        /**
+         * Current animation state of the drawer ('in' or 'out').
+         * @public
+         */
+        this.drawerAnimationState = 'out';
+        /**
+         * Current active position of the drawer.
+         * @public
+         * @default 'left'
+         */
+        this.currentDrawerPosition = 'left'; // Default
+        /**
+         * Stores the next position if the drawer is currently open and a new position is requested.
+         * Used to sequence close and open animations.
+         * @private
+         */
+        this.pendingDrawerPosition = null;
+        /**
+         * Flag to indicate if an animation is currently in progress to prevent rapid toggling.
+         * @public
+         */
+        this.isAnimating = false;
+        /**
+         * Effective animation duration for the drawer, derived from input or default.
+         * @public
+         * @default '300ms'
+         */
+        this.effectiveAnimationDuration = '300ms';
+        /**
+         * Mode of the drawer, primarily for determining backdrop behavior with custom animations.
+         * @public
+         * @default 'side'
+         */
+        this.matDrawerMode = 'side';
+        /**
+         * Actual position ('start' or 'end') used by Angular Material's MatDrawer if it were directly used.
+         * Retained for logical consistency in determining layout.
+         * @public
+         * @default 'start'
+         */
+        this.matActualPosition = 'start';
+        /**
+         * Flag indicating if the drawer is in a vertical layout (top/bottom).
+         * Helps determine if width or height should be 100%.
+         * @public
+         */
+        this.isVerticalLayout = false;
+        /**
+         * Effective dimension (width or height) of the drawer panel.
+         * @public
+         * @default '250px'
+         */
+        this.effectiveDrawerDimension = '250px';
+    }
+    /**
+     * Angular lifecycle hook that is called after data-bound properties of a directive are initialized.
+     */
+    ngOnInit() {
+        this.applyInputs();
+        this.drawerAnimationState = 'out';
+        this.loadDynamicContent();
+    }
+    /**
+     * Angular lifecycle hook that is called after Angular has fully initialized a component's view.
+     */
+    ngAfterViewInit() {
+        if (this.rucInputData.initialOpenedState && this.drawerAnimationState === 'out') {
+            // Defer state update to the next microtask queue.
+            // This helps avoid ExpressionChangedAfterItHasBeenCheckedError when initializing the drawer's open state.
+            Promise.resolve().then(() => this.setDrawerOpenState(true));
+        }
+    }
+    /**
+     * Angular lifecycle hook that is called when any data-bound property of a directive changes.
+     * @param changes - Object containing the changed properties.
+     */
+    ngOnChanges(changes) {
+        if (changes['rucInputData']) {
+            const previousRucInputData = changes['rucInputData'].previousValue || {};
+            const currentRucInputData = changes['rucInputData'].currentValue || {};
+            const oldPosition = previousRucInputData.drawerPosition ?? this.currentDrawerPosition;
+            const wasOpen = this.drawerAnimationState === 'in';
+            this.currentDrawerPosition = currentRucInputData.drawerPosition ?? 'left';
+            this.applyInputs();
+            const newPosition = this.currentDrawerPosition;
+            const shouldBeOpen = this.rucInputData.initialOpenedState ?? false;
+            if (wasOpen && oldPosition !== newPosition) {
+                this.pendingDrawerPosition = newPosition;
+                this.setDrawerOpenState(false);
+            }
+            else if (wasOpen !== shouldBeOpen) {
+                setTimeout(() => {
+                    this.setDrawerOpenState(shouldBeOpen);
+                });
+            }
+            else {
+                this.loadDynamicContent();
+            }
+            this.cdr.detectChanges();
+        }
+    }
+    /**
+     * Applies input data to component properties, calculating dimensions and positions.
+     * @private
+     */
+    applyInputs() {
+        this.matDrawerMode = this.rucInputData.mode ?? 'side';
+        this.effectiveAnimationDuration = this.rucInputData.animationDuration || '300ms';
+        const getDimension = (inputDimension, defaultDimension) => {
+            return (inputDimension && inputDimension.trim() !== '') ? inputDimension : defaultDimension;
+        };
+        switch (this.currentDrawerPosition) {
+            case 'right':
+                this.matActualPosition = 'end';
+                this.isVerticalLayout = false;
+                this.effectiveDrawerDimension = getDimension(this.rucInputData.drawerWidth, '250px');
+                break;
+            case 'top':
+                this.matActualPosition = 'start';
+                this.isVerticalLayout = true;
+                this.effectiveDrawerDimension = getDimension(this.rucInputData.drawerHeight, '200px');
+                break;
+            case 'bottom':
+                this.matActualPosition = 'end';
+                this.isVerticalLayout = true;
+                this.effectiveDrawerDimension = getDimension(this.rucInputData.drawerHeight, '200px');
+                break;
+            case 'left':
+            default:
+                this.matActualPosition = 'start';
+                this.isVerticalLayout = false;
+                this.effectiveDrawerDimension = getDimension(this.rucInputData.drawerWidth, '250px');
+                break;
+        }
+    }
+    /**
+     * Toggles the drawer's open/close state or switches to a new position.
+     * @param requestedPosition - The desired position to open the drawer from. If not provided, uses `currentDrawerPosition`.
+     */
+    toggleDrawer(requestedPosition) {
+        if (this.isAnimating && !this.pendingDrawerPosition) {
+            return;
+        }
+        const positionToToggle = requestedPosition || this.currentDrawerPosition;
+        const isDrawerOpen = this.drawerAnimationState === 'in';
+        const isSamePosition = this.currentDrawerPosition === positionToToggle;
+        if (isDrawerOpen) {
+            if (isSamePosition) {
+                this.setDrawerOpenState(false);
+            }
+            else {
+                this.pendingDrawerPosition = positionToToggle;
+                this.setDrawerOpenState(false);
+            }
+        }
+        else {
+            if (!isSamePosition) {
+                this.currentDrawerPosition = positionToToggle;
+                this.applyInputs();
+            }
+            this.setDrawerOpenState(true);
+        }
+    }
+    /**
+     * Sets the drawer's open state and triggers the animation.
+     * @param open - Boolean indicating whether to open (true) or close (false) the drawer.
+     * @private
+     */
+    setDrawerOpenState(open) {
+        if (this.isAnimating && !this.pendingDrawerPosition && open === (this.drawerAnimationState === 'in')) {
+            return;
+        }
+        this.isAnimating = true;
+        this.drawerAnimationState = open ? 'in' : 'out';
+        this.rucEvent.emit({
+            type: open ? 'openedStart' : 'closedStart',
+            opened: open,
+            position: this.currentDrawerPosition
+        });
+        this.cdr.detectChanges();
+    }
+    /**
+     * Callback for when a drawer animation finishes.
+     * Manages state transitions, especially when switching between open drawers.
+     * @param event - The Angular AnimationEvent.
+     */
+    onAnimationDone(event) {
+        if (event.element.classList.contains('dynamic-drawer')) {
+            if (event.toState === 'out') {
+                this.rucEvent.emit({ type: 'openedChange', opened: false, position: this.currentDrawerPosition });
+                this.rucEvent.emit({ type: 'drawerToggle', opened: false, position: this.currentDrawerPosition });
+                if (this.pendingDrawerPosition) {
+                    this.currentDrawerPosition = this.pendingDrawerPosition;
+                    this.pendingDrawerPosition = null;
+                    this.applyInputs();
+                    setTimeout(() => {
+                        this.setDrawerOpenState(true);
+                    });
+                    return;
+                }
+            }
+            else if (event.toState === 'in') {
+                this.rucEvent.emit({ type: 'openedChange', opened: true, position: this.currentDrawerPosition });
+                this.rucEvent.emit({ type: 'drawerToggle', opened: true, position: this.currentDrawerPosition });
+            }
+            this.isAnimating = false;
+            this.cdr.detectChanges();
+        }
+    }
+    /**
+     * Loads the dynamic component into the drawer if specified in rucInputData.
+     * Clears existing dynamic component if any.
+     * @private
+     */
+    loadDynamicContent() {
+        this.clearDynamicContent();
+        const componentType = this.rucInputData.content?.drawerContentComponent;
+        if (componentType && this.drawerComponentHost) {
+            this.dynamicComponentRef = this.drawerComponentHost.createComponent(componentType);
+            if (this.dynamicComponentRef.instance) {
+                this.dynamicComponentRef.changeDetectorRef.detectChanges();
+            }
+            if (this.rucInputData.drawerContentComponentData && this.dynamicComponentRef.instance) {
+                Object.keys(this.rucInputData.drawerContentComponentData).forEach(key => {
+                    if (key in this.dynamicComponentRef.instance) {
+                        this.dynamicComponentRef.instance[key] = this.rucInputData.drawerContentComponentData[key];
+                    }
+                });
+                this.dynamicComponentRef.changeDetectorRef.detectChanges();
+            }
+            this.cdr.detectChanges();
+        }
+    }
+    /**
+     * Getter for the current animation parameters to be passed to the animation triggers in the template.
+     * Includes the current animation state ('in' or 'out') and the effective duration.
+     */
+    get animationParams() {
+        return { value: this.drawerAnimationState, params: { duration: this.effectiveAnimationDuration } };
+    }
+    /**
+     * Getter for the backdrop animation parameters.
+     * Typically uses a faster duration than the main drawer animation.
+     */
+    get backdropAnimationParams() {
+        let durationMs = 0;
+        if (this.effectiveAnimationDuration.endsWith('ms')) {
+            durationMs = parseInt(this.effectiveAnimationDuration, 10);
+        }
+        else if (this.effectiveAnimationDuration.endsWith('s')) {
+            durationMs = parseFloat(this.effectiveAnimationDuration) * 1000;
+        }
+        else {
+            durationMs = parseInt(this.effectiveAnimationDuration, 10) || 300; // Fallback if format is unexpected
+        }
+        const backdropDurationValue = Math.floor(durationMs / 2); // Ensure integer for ms
+        const backdropDuration = backdropDurationValue > 0 ? `${backdropDurationValue}ms` : '150ms'; // Fallback if calculated duration is 0 or less
+        return { value: this.drawerAnimationState, params: { duration: backdropDuration } };
+    }
+    /**
+     * Generates an accessible label for the toggle button based on the drawer's state and position.
+     * @returns The ARIA label string for the toggle button.
+     */
+    getToggleButtonAriaLabel() {
+        const defaultOpen = `Open ${this.currentDrawerPosition} Drawer`;
+        const defaultClose = `Close ${this.currentDrawerPosition} Drawer`;
+        const openText = this.rucInputData.toggleButtonText?.open || defaultOpen;
+        const closeText = this.rucInputData.toggleButtonText?.close || defaultClose;
+        return this.drawerAnimationState === 'in' ? closeText : openText;
+    }
+    /**
+     * Handles clicks on the backdrop.
+     * Closes the drawer only if `disableClose` is not true.
+     * @public
+     */
+    handleBackdropClick() {
+        if (!(this.rucInputData.disableClose ?? false)) {
+            this.toggleDrawer(this.currentDrawerPosition);
+        }
+    }
+    /**
+     * Listens for Escape key presses on the document.
+     * Closes the drawer if it's open and `disableClose` is not true.
+     * @param event - The KeyboardEvent.
+     */
+    onKeydownHandler(event) {
+        if (this.drawerAnimationState === 'in' && !(this.rucInputData.disableClose ?? false)) {
+            this.toggleDrawer(this.currentDrawerPosition);
+        }
+    }
+    /**
+     * Clears any dynamically loaded component.
+     * @private
+     */
+    clearDynamicContent() {
+        if (this.drawerComponentHost) {
+            this.drawerComponentHost.clear();
+        }
+        if (this.dynamicComponentRef) {
+            this.dynamicComponentRef.destroy();
+            this.dynamicComponentRef = null;
+        }
+    }
+    /**
+     * Angular lifecycle hook that is called clear dynamic component content.
+     */
+    ngOnDestroy() {
+        this.clearDynamicContent();
+    }
+}
+RuclibDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+RuclibDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: RuclibDrawerComponent, selector: "uxp-ruclib-drawer", inputs: { rucInputData: "rucInputData", customTheme: "customTheme" }, outputs: { rucEvent: "rucEvent" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "drawerComponentHost", first: true, predicate: ["drawerComponentHost"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- \r\n  Custom Backdrop element.\r\n  Visible only when:\r\n  - rucInputData.mode is 'over'\r\n  - rucInputData.hasBackdrop is true (or undefined, defaulting to true)\r\n  - drawerAnimationState is 'in' (drawer is open or opening)\r\n  Animates using 'backdropFade' trigger.\r\n  Clicking the backdrop will toggle the drawer for the current position.\r\n  Background color can be customized via rucInputData.backdropBackgroundColor.\r\n-->\r\n<div class=\"custom-backdrop\"\r\n     *ngIf=\"rucInputData.mode === 'over' && (rucInputData.hasBackdrop ?? true) && drawerAnimationState === 'in'\"\r\n     [@backdropFade]=\"backdropAnimationParams\"\r\n     (click)=\"handleBackdropClick()\"\r\n     [style.background-color]=\"rucInputData.hasBackdrop ? rucInputData.backdropBackgroundColor : ''\">\r\n</div>\r\n\r\n<!-- \r\n  Custom Dynamic Drawer element.\r\n  This is the main panel that slides in and out.\r\n  - Applies CSS classes based on currentDrawerPosition and customTheme.\r\n  - Dynamically sets width and height based on drawer orientation and input data.\r\n  - Uses one of four animation triggers (slideInOutLeft, slideInOutRight, slideInOutTop, slideInOutBottom)\r\n    based on currentDrawerPosition. Only the active trigger runs its animation; others are set to an\r\n    instant 'out' state to prevent interference.\r\n  - Animation completion events are handled by onAnimationDone().\r\n-->\r\n\r\n<div class=\"main\">\r\n  <div class=\"dynamic-drawer\"\r\n      [ngClass]=\"'drawer-' + currentDrawerPosition + ' ' + (customTheme || '')\"\r\n      [style.width]=\"!isVerticalLayout ? effectiveDrawerDimension : '100%'\"\r\n      [style.height]=\"isVerticalLayout ? effectiveDrawerDimension : '100%'\"\r\n\r\n      [@slideInOutLeft]=\"currentDrawerPosition === 'left' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutLeft.done)=\"currentDrawerPosition === 'left' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutRight]=\"currentDrawerPosition === 'right' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutRight.done)=\"currentDrawerPosition === 'right' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutTop]=\"currentDrawerPosition === 'top' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutTop.done)=\"currentDrawerPosition === 'top' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutBottom]=\"currentDrawerPosition === 'bottom' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutBottom.done)=\"currentDrawerPosition === 'bottom' && onAnimationDone($event)\">\r\n\r\n    <!-- Wrapper for the content inside the drawer, handles padding and layout. -->\r\n    <div class=\"drawer-content-wrapper\">\r\n      <!-- Optional title for the drawer. -->\r\n      <h2 *ngIf=\"rucInputData.content?.drawerTitle\" class=\"ruclib-drawer-title\">\r\n        {{ rucInputData.content?.drawerTitle }}\r\n      </h2>\r\n      <!-- \r\n        Optional close button inside the drawer.\r\n        Toggles the drawer for the current position when clicked.\r\n        ARIA label provides accessibility.\r\n        Dimensions can be customized via rucInputData.closeButtonDimensions.\r\n      -->\r\n      <button *ngIf=\"rucInputData.showCloseIcon\"\r\n              mat-icon-button class=\"ruclib-drawer-close-button\"\r\n              (click)=\"toggleDrawer(currentDrawerPosition)\"\r\n              [attr.aria-label]=\"'Close ' + currentDrawerPosition + ' drawer'\"\r\n              [style.width]=\"rucInputData.closeButtonDimensions?.width\"\r\n              [style.height]=\"rucInputData.closeButtonDimensions?.height\">\r\n        <!-- Material icon for the close button. Size can be customized. -->\r\n        <mat-icon [style.font-size]=\"rucInputData.closeButtonDimensions?.iconSize\">close</mat-icon>\r\n      </button>\r\n      <!-- Main body content of the drawer. -->\r\n      <div class=\"ruclib-drawer-body\">\r\n        <!-- Host for dynamically injected component -->\r\n        <ng-template #drawerComponentHost></ng-template>\r\n        <!-- Fallback to HTML content if no component is provided -->\r\n        <div *ngIf=\"!rucInputData.content?.drawerContentComponent\" [innerHTML]=\"rucInputData.content?.drawerBody || '' | safeHtml\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- \r\n  Angular Material Drawer Container.\r\n  Acts as the main container for the drawer system, especially if 'side' or 'push' modes\r\n  were to be implemented with MatDrawer's native behavior. With custom fixed-position animations,\r\n  its primary role here is to host the mat-drawer-content.\r\n  - Applies 'vertical-layout' class if the drawer is top/bottom.\r\n  - MatDrawer's own backdrop is disabled as a custom one is used.\r\n-->\r\n<mat-drawer-container\r\n  class=\"ruclib-drawer-container\"\r\n  [class.vertical-layout]=\"isVerticalLayout\"\r\n  [hasBackdrop]=\"false\"> <!-- MatDrawer's backdrop is not used with custom animation -->\r\n  <mat-drawer-content class=\"ruclib-main-content\">\r\n    <button [disabled]=\"rucInputData.disableToggleButtonInMainContent\"\r\n            mat-raised-button\r\n            color=\"primary\"\r\n            title=\"Toggle Drawer\"\r\n            class=\"drawer-toggle-button\"\r\n            [style.width]=\"rucInputData.toggleButtonDimensions?.width\"\r\n            [style.height]=\"rucInputData.toggleButtonDimensions?.height\"\r\n            [style.padding]=\"rucInputData.toggleButtonDimensions?.padding\"\r\n            [style.font-size]=\"rucInputData.toggleButtonDimensions?.fontSize\"\r\n            (click)=\"toggleDrawer(currentDrawerPosition)\"\r\n            [attr.aria-label]=\"getToggleButtonAriaLabel()\"\r\n            [attr.aria-expanded]=\"drawerAnimationState === 'in'\">\r\n      <!-- Optional Material icon for the toggle button. Show only if no image URL is provided. -->\r\n      <mat-icon *ngIf=\"rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl\" [style.font-size]=\"rucInputData.toggleButtonDimensions?.iconSize\">{{ rucInputData.toggleButtonIcon }}</mat-icon>\r\n      <!-- Optional image for the toggle button. If present, it should fill the button. -->\r\n      <img *ngIf=\"rucInputData.toggleButtonImageUrl\"\r\n           [src]=\"rucInputData.toggleButtonImageUrl\"\r\n           [alt]=\"rucInputData.toggleButtonImageAlt || 'Toggle Drawer'\"\r\n           class=\"ruclib-drawer-toggle-image\"\r\n           [style.width]=\"rucInputData.toggleButtonDimensions?.width\"\r\n           [style.height]=\"rucInputData.toggleButtonDimensions?.height\"\r\n           [style.padding]=\"rucInputData.toggleButtonDimensions?.padding\">\r\n      <!-- Text for the toggle button. Show only if NO icon AND NO image URL is provided. -->\r\n      <span *ngIf=\"!rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl && (rucInputData.toggleButtonText?.open || rucInputData.toggleButtonText?.close)\">\r\n        {{ drawerAnimationState === 'in' ? (rucInputData.toggleButtonText?.close || 'Close') : (rucInputData.toggleButtonText?.open || 'Open') }}\r\n      </span>\r\n      <!-- Text for the toggle button when an icon (but NO image) IS also present. -->\r\n      <span *ngIf=\"rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl && (rucInputData.toggleButtonText?.open || rucInputData.toggleButtonText?.close)\" class=\"toggle-button-text-with-icon\">\r\n        {{ drawerAnimationState === 'in' ? (rucInputData.toggleButtonText?.close || 'Close') : (rucInputData.toggleButtonText?.open || 'Open') }}\r\n      </span>\r\n    </button>\r\n    <!-- Main application content area, rendered from HTML string via safeHtml pipe. -->\r\n    <div [innerHTML]=\"rucInputData.content?.mainBody || '' | safeHtml\"></div>\r\n  </mat-drawer-content>\r\n</mat-drawer-container>", styles: [".mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{position:absolute;border-radius:50%;pointer-events:none;transition:opacity,transform 0ms cubic-bezier(0,0,.2,1);transform:scale3d(0,0,0)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}textarea.cdk-textarea-autosize{resize:none}textarea.cdk-textarea-autosize-measuring{padding:2px 0!important;box-sizing:content-box!important;height:auto!important;overflow:hidden!important}textarea.cdk-textarea-autosize-measuring-firefox{padding:2px 0!important;box-sizing:content-box!important;height:0!important}@keyframes cdk-text-field-autofill-start{}@keyframes cdk-text-field-autofill-end{}.cdk-text-field-autofill-monitored:-webkit-autofill{animation:cdk-text-field-autofill-start 0s 1ms}.cdk-text-field-autofill-monitored:not(:-webkit-autofill){animation:cdk-text-field-autofill-end 0s 1ms}.mat-focus-indicator{position:relative}.mat-focus-indicator:before{inset:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-focus-indicator-display, none);border:var(--mat-focus-indicator-border-width, 3px) var(--mat-focus-indicator-border-style, solid) var(--mat-focus-indicator-border-color, transparent);border-radius:var(--mat-focus-indicator-border-radius, 4px)}.mat-focus-indicator:focus:before{content:\"\"}.cdk-high-contrast-active{--mat-focus-indicator-display: block}.mat-mdc-focus-indicator{position:relative}.mat-mdc-focus-indicator:before{inset:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-mdc-focus-indicator-display, none);border:var(--mat-mdc-focus-indicator-border-width, 3px) var(--mat-mdc-focus-indicator-border-style, solid) var(--mat-mdc-focus-indicator-border-color, transparent);border-radius:var(--mat-mdc-focus-indicator-border-radius, 4px)}.mat-mdc-focus-indicator:focus:before{content:\"\"}.cdk-high-contrast-active{--mat-mdc-focus-indicator-display: block}.main{font-size:16px;font-weight:400;line-height:24px;font-family:Roboto,sans-serif;letter-spacing:.03125em}.ruc-custom-theme{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-mdc-option{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal)}.ruc-custom-theme .mat-mdc-card-title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-headline6-font-size, 20px);line-height:var(--mdc-typography-headline6-line-height, 32px);font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:var(--mdc-typography-headline6-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:var(--mdc-typography-headline6-text-transform, none)}.ruc-custom-theme .mat-mdc-card-subtitle{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle2-font-size, 20px);line-height:var(--mdc-typography-subtitle2-line-height, 24px);font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle2-text-transform, none)}.ruc-custom-theme .mat-mdc-tooltip{--mdc-plain-tooltip-supporting-text-font: Roboto, sans-serif;--mdc-plain-tooltip-supporting-text-size: 12px;--mdc-plain-tooltip-supporting-text-weight: 400;--mdc-plain-tooltip-supporting-text-tracking: normal}.ruc-custom-theme .mat-mdc-form-field-infix{min-height:56px}.ruc-custom-theme .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:28px}.ruc-custom-theme .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -34.75px) scale(var(--mat-mdc-form-field-floating-label-scale, .75));transform:var(--mat-mdc-form-field-label-transform)}.ruc-custom-theme .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}.ruc-custom-theme .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:24px;padding-bottom:8px}.ruc-custom-theme .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}.ruc-custom-theme .mdc-text-field__input,.ruc-custom-theme .mdc-text-field__affix{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none)}.ruc-custom-theme .mdc-text-field--textarea .mdc-text-field__input{line-height:1.5rem}.ruc-custom-theme .mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field-subscript-wrapper,.ruc-custom-theme .mat-mdc-form-field-bottom-align:before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-caption-font-size, 12px);line-height:var(--mdc-typography-caption-line-height, 20px);font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:var(--mdc-typography-caption-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:var(--mdc-typography-caption-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field,.ruc-custom-theme .mat-mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(15px * var(--mat-mdc-form-field-floating-label-scale, .75))}.ruc-custom-theme .mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:15px}.ruc-custom-theme .mat-mdc-select-panel{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-select{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-autocomplete-panel{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-dialog-container{--mdc-dialog-subhead-font: Roboto, sans-serif;--mdc-dialog-subhead-line-height: 32px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 500;--mdc-dialog-subhead-tracking: normal;--mdc-dialog-supporting-text-font: Roboto, sans-serif;--mdc-dialog-supporting-text-line-height: 24px;--mdc-dialog-supporting-text-size: 15px;--mdc-dialog-supporting-text-weight: 400;--mdc-dialog-supporting-text-tracking: normal}.ruc-custom-theme .mat-mdc-chip{height:32px}.ruc-custom-theme .mat-mdc-standard-chip{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mat-mdc-slide-toggle{--mdc-switch-state-layer-size: 48px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio{padding:10px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{top:-10px;left:-10px;width:40px;height:40px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control{top:0;right:0;left:0;width:40px;height:40px}.ruc-custom-theme .mat-mdc-slider{--mdc-slider-label-label-text-font: Roboto, sans-serif;--mdc-slider-label-label-text-size: 20px;--mdc-slider-label-label-text-line-height: 24px;--mdc-slider-label-label-text-tracking: normal;--mdc-slider-label-label-text-weight: 500}.ruc-custom-theme .mat-mdc-menu-content{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-menu-content,.ruc-custom-theme .mat-mdc-menu-content .mat-mdc-menu-item .mdc-list-item__primary-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-list-base{--mdc-list-list-item-one-line-container-height: 48px;--mdc-list-list-item-two-line-container-height: 64px;--mdc-list-list-item-three-line-container-height: 88px}.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line{height:56px}.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines{height:72px}.ruc-custom-theme .mat-mdc-list-base{--mdc-list-list-item-label-text-font: Roboto, sans-serif;--mdc-list-list-item-label-text-line-height: 24px;--mdc-list-list-item-label-text-size: 15px;--mdc-list-list-item-label-text-tracking: normal;--mdc-list-list-item-label-text-weight: 400;--mdc-list-list-item-supporting-text-font: Roboto, sans-serif;--mdc-list-list-item-supporting-text-line-height: 20px;--mdc-list-list-item-supporting-text-size: 14px;--mdc-list-list-item-supporting-text-tracking: normal;--mdc-list-list-item-supporting-text-weight: 400;--mdc-list-list-item-trailing-supporting-text-font: Roboto, sans-serif;--mdc-list-list-item-trailing-supporting-text-line-height: 20px;--mdc-list-list-item-trailing-supporting-text-size: 12px;--mdc-list-list-item-trailing-supporting-text-tracking: normal;--mdc-list-list-item-trailing-supporting-text-weight: 400}.ruc-custom-theme .mdc-list-group__subheader{font-size:16px;font-weight:400;line-height:28px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-form-field-infix{min-height:40px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:20px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -26.75px) scale(var(--mat-mdc-form-field-floating-label-scale, .75));transform:var(--mat-mdc-form-field-label-transform)}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label{display:none}.ruc-custom-theme .mat-mdc-paginator-container{min-height:56px}.ruc-custom-theme .mat-mdc-paginator{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-caption-font-size, 12px);line-height:var(--mdc-typography-caption-line-height, 20px);font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:var(--mdc-typography-caption-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:var(--mdc-typography-caption-text-transform, none)}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-select-value{font-size:12px}.ruc-custom-theme .mat-mdc-tab-header .mdc-tab{height:48px}.ruc-custom-theme .mdc-tab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox{padding:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);margin:calc((var(--mdc-checkbox-touch-target-size, 40px) - 40px) / 2)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__background{top:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);left:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control{top:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);right:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);left:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);width:var(--mdc-checkbox-touch-target-size, 40px);height:var(--mdc-checkbox-touch-target-size, 40px)}@media all and (-ms-high-contrast: none){.ruc-custom-theme .mdc-checkbox .mdc-checkbox__focus-ring{display:none}}.ruc-custom-theme .mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mat-mdc-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-raised-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-unelevated-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-outlined-button.mat-mdc-button-base{height:36px}.ruc-custom-theme .mdc-button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base{width:48px;height:48px;padding:12px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__focus-ring{max-height:48px;max-width:48px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin:4px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%,-50%)}.ruc-custom-theme .mdc-fab--extended{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-snack-bar-container{--mdc-snackbar-supporting-text-font: Roboto, sans-serif;--mdc-snackbar-supporting-text-line-height: 20px;--mdc-snackbar-supporting-text-size: 14px;--mdc-snackbar-supporting-text-weight: 400}.ruc-custom-theme .mat-mdc-table .mdc-data-table__row{height:52px}.ruc-custom-theme .mat-mdc-table .mdc-data-table__pagination{min-height:52px}.ruc-custom-theme .mat-mdc-table .mdc-data-table__header-row{height:56px}.ruc-custom-theme .mdc-data-table__content,.ruc-custom-theme .mdc-data-table__cell{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mdc-data-table__header-cell{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle2-font-size, 20px);line-height:var(--mdc-typography-subtitle2-line-height, 24px);font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle2-text-transform, none)}.ruc-custom-theme .mat-badge{position:relative}.ruc-custom-theme .mat-badge.mat-badge{overflow:visible}.ruc-custom-theme .mat-badge-hidden .mat-badge-content{display:none}.ruc-custom-theme .mat-badge-content{position:absolute;text-align:center;display:inline-block;border-radius:50%;transition:transform .2s ease-in-out;transform:scale(.6);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none}.ruc-custom-theme .ng-animate-disabled .mat-badge-content,.ruc-custom-theme .mat-badge-content._mat-animation-noopable{transition:none}.ruc-custom-theme .mat-badge-content.mat-badge-active{transform:none}.ruc-custom-theme .mat-badge-small .mat-badge-content{width:16px;height:16px;line-height:16px}.ruc-custom-theme .mat-badge-small.mat-badge-above .mat-badge-content{top:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-below .mat-badge-content{bottom:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-before .mat-badge-content{left:-16px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-before .mat-badge-content{left:auto;right:-16px}.ruc-custom-theme .mat-badge-small.mat-badge-after .mat-badge-content{right:-16px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-after .mat-badge-content{right:auto;left:-16px}.ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-8px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-8px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-8px}.ruc-custom-theme .mat-badge-medium .mat-badge-content{width:22px;height:22px;line-height:22px}.ruc-custom-theme .mat-badge-medium.mat-badge-above .mat-badge-content{top:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-below .mat-badge-content{bottom:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-before .mat-badge-content{left:-22px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-before .mat-badge-content{left:auto;right:-22px}.ruc-custom-theme .mat-badge-medium.mat-badge-after .mat-badge-content{right:-22px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-after .mat-badge-content{right:auto;left:-22px}.ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-11px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-11px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-11px}.ruc-custom-theme .mat-badge-large .mat-badge-content{width:28px;height:28px;line-height:28px}.ruc-custom-theme .mat-badge-large.mat-badge-above .mat-badge-content{top:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-below .mat-badge-content{bottom:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-before .mat-badge-content{left:-28px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-before .mat-badge-content{left:auto;right:-28px}.ruc-custom-theme .mat-badge-large.mat-badge-after .mat-badge-content{right:-28px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-after .mat-badge-content{right:auto;left:-28px}.ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-14px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-14px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-14px}.ruc-custom-theme .mat-badge-content{font-weight:600;font-size:12px;font-family:Roboto,sans-serif}.ruc-custom-theme .mat-badge-small .mat-badge-content{font-size:9px}.ruc-custom-theme .mat-badge-large .mat-badge-content{font-size:24px}.ruc-custom-theme .mat-bottom-sheet-container{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-button-toggle-appearance-standard .mat-button-toggle-label-content{line-height:48px}.ruc-custom-theme .mat-button-toggle{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{width:40px;height:40px;padding:8px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin:0}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__touch{position:absolute;top:50%;height:40px;left:50%;width:40px;transform:translate(-50%,-50%)}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target{display:none}.ruc-custom-theme .mat-calendar{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-calendar-body{font-size:13px}.ruc-custom-theme .mat-calendar-body-label,.ruc-custom-theme .mat-calendar-period-button{font-size:20px;font-weight:500}.ruc-custom-theme .mat-calendar-table-header th{font-size:11px;font-weight:400}.ruc-custom-theme .mat-expansion-panel-header{height:48px}.ruc-custom-theme .mat-expansion-panel-header.mat-expanded{height:64px}.ruc-custom-theme .mat-expansion-panel-header{font-family:Roboto,sans-serif;font-size:15px;font-weight:400}.ruc-custom-theme .mat-expansion-panel-content{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-grid-tile-header,.ruc-custom-theme .mat-grid-tile-footer{font-size:14px}.ruc-custom-theme .mat-grid-tile-header .mat-line,.ruc-custom-theme .mat-grid-tile-footer .mat-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;box-sizing:border-box}.ruc-custom-theme .mat-grid-tile-header .mat-line:nth-child(n+2),.ruc-custom-theme .mat-grid-tile-footer .mat-line:nth-child(n+2){font-size:12px}.ruc-custom-theme .mat-horizontal-stepper-header{height:72px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header,.ruc-custom-theme .mat-vertical-stepper-header{padding:24px}.ruc-custom-theme .mat-stepper-vertical-line:before{top:-16px;bottom:-16px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:after,.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:before{top:36px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-stepper-horizontal-line{top:36px}.ruc-custom-theme .mat-stepper-vertical,.ruc-custom-theme .mat-stepper-horizontal{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-step-label{font-size:14px;font-weight:400}.ruc-custom-theme .mat-step-sub-label-error{font-weight:400}.ruc-custom-theme .mat-step-label-error{font-size:20px}.ruc-custom-theme .mat-step-label-selected{font-size:20px;font-weight:500}.ruc-custom-theme .mat-toolbar-multiple-rows{min-height:64px}.ruc-custom-theme .mat-toolbar-row,.ruc-custom-theme .mat-toolbar-single-row{height:64px}@media (max-width: 599px){.ruc-custom-theme .mat-toolbar-multiple-rows{min-height:56px}.ruc-custom-theme .mat-toolbar-row,.ruc-custom-theme .mat-toolbar-single-row{height:56px}}.ruc-custom-theme .mat-toolbar,.ruc-custom-theme .mat-toolbar h1,.ruc-custom-theme .mat-toolbar h2,.ruc-custom-theme .mat-toolbar h3,.ruc-custom-theme .mat-toolbar h4,.ruc-custom-theme .mat-toolbar h5,.ruc-custom-theme .mat-toolbar h6{font-size:20px;font-weight:500;line-height:32px;font-family:Roboto,sans-serif;letter-spacing:normal;margin:0}.ruc-custom-theme .mat-tree-node{min-height:48px}.ruc-custom-theme .mat-tree{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-tree-node,.ruc-custom-theme .mat-nested-tree-node{font-weight:400;font-size:14px}:host{display:block;position:relative;overflow:hidden}.custom-backdrop{position:absolute;inset:0;background-color:#000;z-index:999;visibility:hidden}.ruclib-drawer-container{width:100%;height:400px;border:1px solid #ccc;position:relative;overflow:hidden}.drawer-content-wrapper{padding:16px;position:relative;box-sizing:border-box;height:100%;display:flex;flex-direction:column}.ruclib-drawer-title{margin-top:0;margin-bottom:16px;font-size:1.5em;flex-shrink:0}.ruclib-drawer-close-button{position:absolute;top:8px;right:8px;padding:5px 0 0!important;flex-shrink:0}.ruclib-drawer-body{flex-grow:1;overflow-y:auto;word-break:break-word}.dynamic-drawer{background-color:var(--mat-sidenav-content-background-color, white);position:absolute;box-sizing:border-box;box-shadow:0 2px 10px #0003;z-index:1000;overflow:hidden}.dynamic-drawer.drawer-left{top:0;bottom:0;left:0}.dynamic-drawer.drawer-right{top:0;bottom:0;right:0}.dynamic-drawer.drawer-top{top:0;left:0;right:0}.dynamic-drawer.drawer-bottom{bottom:0;left:0;right:0}.dynamic-drawer.light-theme{background-color:#fff;color:#000000de}.dynamic-drawer.light-theme .ruclib-drawer-title{color:#000000de}.dynamic-drawer.light-theme .ruclib-drawer-close-button .mat-icon{color:#0000008a}.dynamic-drawer.dark-theme{background-color:#424242;color:#fff}.dynamic-drawer.dark-theme .ruclib-drawer-title,.dynamic-drawer.dark-theme .ruclib-drawer-close-button .mat-icon{color:#fff}.dynamic-drawer.custom-theme-one{background-color:#fff;color:#000000de}.dynamic-drawer.custom-theme-one .ruclib-drawer-title{color:#000000de}.dynamic-drawer.custom-theme-one .ruclib-drawer-close-button .mat-icon{color:#0000008a}.dynamic-drawer.custom-theme-two{background-color:#424242;color:#fff}.dynamic-drawer.custom-theme-two .ruclib-drawer-title,.dynamic-drawer.custom-theme-two .ruclib-drawer-close-button .mat-icon{color:#fff}.ruclib-drawer-toggle-image{object-fit:contain;display:block}.drawer-toggle-button{margin-bottom:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.ruclib-main-content{padding:16px;display:flex;flex-direction:column;align-items:flex-start}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i4.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], animations: [
+        trigger('backdropFade', [
+            state('out', style({ opacity: 0, visibility: 'hidden' })),
+            state('in', style({ opacity: 0.6, visibility: 'visible' })),
+            transition('out => in', animate('{{duration}} ease-in')),
+            transition('in => out', animate('{{duration}} ease-out')),
+        ]),
+        trigger('slideInOutLeft', [
+            state('out', style({ transform: 'translateX(-100%)', visibility: 'hidden' })),
+            state('in', style({ transform: 'translateX(0)', visibility: 'visible' })),
+            transition('out <=> in', animate('{{duration}} ease-in-out')),
+        ]),
+        trigger('slideInOutRight', [
+            state('out', style({ transform: 'translateX(100%)', visibility: 'hidden' })),
+            state('in', style({ transform: 'translateX(0)', visibility: 'visible' })),
+            transition('out <=> in', animate('{{duration}} ease-in-out')),
+        ]),
+        trigger('slideInOutTop', [
+            state('out', style({ transform: 'translateY(-100%)', visibility: 'hidden' })),
+            state('in', style({ transform: 'translateY(0%)', visibility: 'visible' })),
+            transition('out <=> in', animate('{{duration}} ease-in-out')),
+        ]),
+        trigger('slideInOutBottom', [
+            state('out', style({ transform: 'translateY(100%)', visibility: 'hidden' })),
+            state('in', style({ transform: 'translateY(0%)', visibility: 'visible' })),
+            transition('out <=> in', animate('{{duration}} ease-in-out')),
+        ])
+    ] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'uxp-ruclib-drawer', animations: [
+                        trigger('backdropFade', [
+                            state('out', style({ opacity: 0, visibility: 'hidden' })),
+                            state('in', style({ opacity: 0.6, visibility: 'visible' })),
+                            transition('out => in', animate('{{duration}} ease-in')),
+                            transition('in => out', animate('{{duration}} ease-out')),
+                        ]),
+                        trigger('slideInOutLeft', [
+                            state('out', style({ transform: 'translateX(-100%)', visibility: 'hidden' })),
+                            state('in', style({ transform: 'translateX(0)', visibility: 'visible' })),
+                            transition('out <=> in', animate('{{duration}} ease-in-out')),
+                        ]),
+                        trigger('slideInOutRight', [
+                            state('out', style({ transform: 'translateX(100%)', visibility: 'hidden' })),
+                            state('in', style({ transform: 'translateX(0)', visibility: 'visible' })),
+                            transition('out <=> in', animate('{{duration}} ease-in-out')),
+                        ]),
+                        trigger('slideInOutTop', [
+                            state('out', style({ transform: 'translateY(-100%)', visibility: 'hidden' })),
+                            state('in', style({ transform: 'translateY(0%)', visibility: 'visible' })),
+                            transition('out <=> in', animate('{{duration}} ease-in-out')),
+                        ]),
+                        trigger('slideInOutBottom', [
+                            state('out', style({ transform: 'translateY(100%)', visibility: 'hidden' })),
+                            state('in', style({ transform: 'translateY(0%)', visibility: 'visible' })),
+                            transition('out <=> in', animate('{{duration}} ease-in-out')),
+                        ])
+                    ], template: "<!-- \r\n  Custom Backdrop element.\r\n  Visible only when:\r\n  - rucInputData.mode is 'over'\r\n  - rucInputData.hasBackdrop is true (or undefined, defaulting to true)\r\n  - drawerAnimationState is 'in' (drawer is open or opening)\r\n  Animates using 'backdropFade' trigger.\r\n  Clicking the backdrop will toggle the drawer for the current position.\r\n  Background color can be customized via rucInputData.backdropBackgroundColor.\r\n-->\r\n<div class=\"custom-backdrop\"\r\n     *ngIf=\"rucInputData.mode === 'over' && (rucInputData.hasBackdrop ?? true) && drawerAnimationState === 'in'\"\r\n     [@backdropFade]=\"backdropAnimationParams\"\r\n     (click)=\"handleBackdropClick()\"\r\n     [style.background-color]=\"rucInputData.hasBackdrop ? rucInputData.backdropBackgroundColor : ''\">\r\n</div>\r\n\r\n<!-- \r\n  Custom Dynamic Drawer element.\r\n  This is the main panel that slides in and out.\r\n  - Applies CSS classes based on currentDrawerPosition and customTheme.\r\n  - Dynamically sets width and height based on drawer orientation and input data.\r\n  - Uses one of four animation triggers (slideInOutLeft, slideInOutRight, slideInOutTop, slideInOutBottom)\r\n    based on currentDrawerPosition. Only the active trigger runs its animation; others are set to an\r\n    instant 'out' state to prevent interference.\r\n  - Animation completion events are handled by onAnimationDone().\r\n-->\r\n\r\n<div class=\"main\">\r\n  <div class=\"dynamic-drawer\"\r\n      [ngClass]=\"'drawer-' + currentDrawerPosition + ' ' + (customTheme || '')\"\r\n      [style.width]=\"!isVerticalLayout ? effectiveDrawerDimension : '100%'\"\r\n      [style.height]=\"isVerticalLayout ? effectiveDrawerDimension : '100%'\"\r\n\r\n      [@slideInOutLeft]=\"currentDrawerPosition === 'left' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutLeft.done)=\"currentDrawerPosition === 'left' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutRight]=\"currentDrawerPosition === 'right' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutRight.done)=\"currentDrawerPosition === 'right' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutTop]=\"currentDrawerPosition === 'top' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutTop.done)=\"currentDrawerPosition === 'top' && onAnimationDone($event)\"\r\n\r\n      [@slideInOutBottom]=\"currentDrawerPosition === 'bottom' ? animationParams : {value: 'out', params: {duration: '0ms'}}\"\r\n      (@slideInOutBottom.done)=\"currentDrawerPosition === 'bottom' && onAnimationDone($event)\">\r\n\r\n    <!-- Wrapper for the content inside the drawer, handles padding and layout. -->\r\n    <div class=\"drawer-content-wrapper\">\r\n      <!-- Optional title for the drawer. -->\r\n      <h2 *ngIf=\"rucInputData.content?.drawerTitle\" class=\"ruclib-drawer-title\">\r\n        {{ rucInputData.content?.drawerTitle }}\r\n      </h2>\r\n      <!-- \r\n        Optional close button inside the drawer.\r\n        Toggles the drawer for the current position when clicked.\r\n        ARIA label provides accessibility.\r\n        Dimensions can be customized via rucInputData.closeButtonDimensions.\r\n      -->\r\n      <button *ngIf=\"rucInputData.showCloseIcon\"\r\n              mat-icon-button class=\"ruclib-drawer-close-button\"\r\n              (click)=\"toggleDrawer(currentDrawerPosition)\"\r\n              [attr.aria-label]=\"'Close ' + currentDrawerPosition + ' drawer'\"\r\n              [style.width]=\"rucInputData.closeButtonDimensions?.width\"\r\n              [style.height]=\"rucInputData.closeButtonDimensions?.height\">\r\n        <!-- Material icon for the close button. Size can be customized. -->\r\n        <mat-icon [style.font-size]=\"rucInputData.closeButtonDimensions?.iconSize\">close</mat-icon>\r\n      </button>\r\n      <!-- Main body content of the drawer. -->\r\n      <div class=\"ruclib-drawer-body\">\r\n        <!-- Host for dynamically injected component -->\r\n        <ng-template #drawerComponentHost></ng-template>\r\n        <!-- Fallback to HTML content if no component is provided -->\r\n        <div *ngIf=\"!rucInputData.content?.drawerContentComponent\" [innerHTML]=\"rucInputData.content?.drawerBody || '' | safeHtml\"></div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- \r\n  Angular Material Drawer Container.\r\n  Acts as the main container for the drawer system, especially if 'side' or 'push' modes\r\n  were to be implemented with MatDrawer's native behavior. With custom fixed-position animations,\r\n  its primary role here is to host the mat-drawer-content.\r\n  - Applies 'vertical-layout' class if the drawer is top/bottom.\r\n  - MatDrawer's own backdrop is disabled as a custom one is used.\r\n-->\r\n<mat-drawer-container\r\n  class=\"ruclib-drawer-container\"\r\n  [class.vertical-layout]=\"isVerticalLayout\"\r\n  [hasBackdrop]=\"false\"> <!-- MatDrawer's backdrop is not used with custom animation -->\r\n  <mat-drawer-content class=\"ruclib-main-content\">\r\n    <button [disabled]=\"rucInputData.disableToggleButtonInMainContent\"\r\n            mat-raised-button\r\n            color=\"primary\"\r\n            title=\"Toggle Drawer\"\r\n            class=\"drawer-toggle-button\"\r\n            [style.width]=\"rucInputData.toggleButtonDimensions?.width\"\r\n            [style.height]=\"rucInputData.toggleButtonDimensions?.height\"\r\n            [style.padding]=\"rucInputData.toggleButtonDimensions?.padding\"\r\n            [style.font-size]=\"rucInputData.toggleButtonDimensions?.fontSize\"\r\n            (click)=\"toggleDrawer(currentDrawerPosition)\"\r\n            [attr.aria-label]=\"getToggleButtonAriaLabel()\"\r\n            [attr.aria-expanded]=\"drawerAnimationState === 'in'\">\r\n      <!-- Optional Material icon for the toggle button. Show only if no image URL is provided. -->\r\n      <mat-icon *ngIf=\"rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl\" [style.font-size]=\"rucInputData.toggleButtonDimensions?.iconSize\">{{ rucInputData.toggleButtonIcon }}</mat-icon>\r\n      <!-- Optional image for the toggle button. If present, it should fill the button. -->\r\n      <img *ngIf=\"rucInputData.toggleButtonImageUrl\"\r\n           [src]=\"rucInputData.toggleButtonImageUrl\"\r\n           [alt]=\"rucInputData.toggleButtonImageAlt || 'Toggle Drawer'\"\r\n           class=\"ruclib-drawer-toggle-image\"\r\n           [style.width]=\"rucInputData.toggleButtonDimensions?.width\"\r\n           [style.height]=\"rucInputData.toggleButtonDimensions?.height\"\r\n           [style.padding]=\"rucInputData.toggleButtonDimensions?.padding\">\r\n      <!-- Text for the toggle button. Show only if NO icon AND NO image URL is provided. -->\r\n      <span *ngIf=\"!rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl && (rucInputData.toggleButtonText?.open || rucInputData.toggleButtonText?.close)\">\r\n        {{ drawerAnimationState === 'in' ? (rucInputData.toggleButtonText?.close || 'Close') : (rucInputData.toggleButtonText?.open || 'Open') }}\r\n      </span>\r\n      <!-- Text for the toggle button when an icon (but NO image) IS also present. -->\r\n      <span *ngIf=\"rucInputData.toggleButtonIcon && !rucInputData.toggleButtonImageUrl && (rucInputData.toggleButtonText?.open || rucInputData.toggleButtonText?.close)\" class=\"toggle-button-text-with-icon\">\r\n        {{ drawerAnimationState === 'in' ? (rucInputData.toggleButtonText?.close || 'Close') : (rucInputData.toggleButtonText?.open || 'Open') }}\r\n      </span>\r\n    </button>\r\n    <!-- Main application content area, rendered from HTML string via safeHtml pipe. -->\r\n    <div [innerHTML]=\"rucInputData.content?.mainBody || '' | safeHtml\"></div>\r\n  </mat-drawer-content>\r\n</mat-drawer-container>", styles: [".mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{position:absolute;border-radius:50%;pointer-events:none;transition:opacity,transform 0ms cubic-bezier(0,0,.2,1);transform:scale3d(0,0,0)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}textarea.cdk-textarea-autosize{resize:none}textarea.cdk-textarea-autosize-measuring{padding:2px 0!important;box-sizing:content-box!important;height:auto!important;overflow:hidden!important}textarea.cdk-textarea-autosize-measuring-firefox{padding:2px 0!important;box-sizing:content-box!important;height:0!important}@keyframes cdk-text-field-autofill-start{}@keyframes cdk-text-field-autofill-end{}.cdk-text-field-autofill-monitored:-webkit-autofill{animation:cdk-text-field-autofill-start 0s 1ms}.cdk-text-field-autofill-monitored:not(:-webkit-autofill){animation:cdk-text-field-autofill-end 0s 1ms}.mat-focus-indicator{position:relative}.mat-focus-indicator:before{inset:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-focus-indicator-display, none);border:var(--mat-focus-indicator-border-width, 3px) var(--mat-focus-indicator-border-style, solid) var(--mat-focus-indicator-border-color, transparent);border-radius:var(--mat-focus-indicator-border-radius, 4px)}.mat-focus-indicator:focus:before{content:\"\"}.cdk-high-contrast-active{--mat-focus-indicator-display: block}.mat-mdc-focus-indicator{position:relative}.mat-mdc-focus-indicator:before{inset:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-mdc-focus-indicator-display, none);border:var(--mat-mdc-focus-indicator-border-width, 3px) var(--mat-mdc-focus-indicator-border-style, solid) var(--mat-mdc-focus-indicator-border-color, transparent);border-radius:var(--mat-mdc-focus-indicator-border-radius, 4px)}.mat-mdc-focus-indicator:focus:before{content:\"\"}.cdk-high-contrast-active{--mat-mdc-focus-indicator-display: block}.main{font-size:16px;font-weight:400;line-height:24px;font-family:Roboto,sans-serif;letter-spacing:.03125em}.ruc-custom-theme{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-mdc-option{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal)}.ruc-custom-theme .mat-mdc-card-title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-headline6-font-size, 20px);line-height:var(--mdc-typography-headline6-line-height, 32px);font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:var(--mdc-typography-headline6-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:var(--mdc-typography-headline6-text-transform, none)}.ruc-custom-theme .mat-mdc-card-subtitle{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle2-font-size, 20px);line-height:var(--mdc-typography-subtitle2-line-height, 24px);font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle2-text-transform, none)}.ruc-custom-theme .mat-mdc-tooltip{--mdc-plain-tooltip-supporting-text-font: Roboto, sans-serif;--mdc-plain-tooltip-supporting-text-size: 12px;--mdc-plain-tooltip-supporting-text-weight: 400;--mdc-plain-tooltip-supporting-text-tracking: normal}.ruc-custom-theme .mat-mdc-form-field-infix{min-height:56px}.ruc-custom-theme .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:28px}.ruc-custom-theme .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -34.75px) scale(var(--mat-mdc-form-field-floating-label-scale, .75));transform:var(--mat-mdc-form-field-label-transform)}.ruc-custom-theme .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}.ruc-custom-theme .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:24px;padding-bottom:8px}.ruc-custom-theme .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}.ruc-custom-theme .mdc-text-field__input,.ruc-custom-theme .mdc-text-field__affix{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none)}.ruc-custom-theme .mdc-text-field--textarea .mdc-text-field__input{line-height:1.5rem}.ruc-custom-theme .mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field-subscript-wrapper,.ruc-custom-theme .mat-mdc-form-field-bottom-align:before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-caption-font-size, 12px);line-height:var(--mdc-typography-caption-line-height, 20px);font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:var(--mdc-typography-caption-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:var(--mdc-typography-caption-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field,.ruc-custom-theme .mat-mdc-floating-label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-form-field .mdc-text-field--outlined .mdc-floating-label--float-above{font-size:calc(15px * var(--mat-mdc-form-field-floating-label-scale, .75))}.ruc-custom-theme .mat-mdc-form-field .mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:15px}.ruc-custom-theme .mat-mdc-select-panel{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-select{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-autocomplete-panel{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-dialog-container{--mdc-dialog-subhead-font: Roboto, sans-serif;--mdc-dialog-subhead-line-height: 32px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 500;--mdc-dialog-subhead-tracking: normal;--mdc-dialog-supporting-text-font: Roboto, sans-serif;--mdc-dialog-supporting-text-line-height: 24px;--mdc-dialog-supporting-text-size: 15px;--mdc-dialog-supporting-text-weight: 400;--mdc-dialog-supporting-text-tracking: normal}.ruc-custom-theme .mat-mdc-chip{height:32px}.ruc-custom-theme .mat-mdc-standard-chip{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mat-mdc-slide-toggle{--mdc-switch-state-layer-size: 48px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio{padding:10px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{top:-10px;left:-10px;width:40px;height:40px}.ruc-custom-theme .mat-mdc-radio-button .mdc-radio .mdc-radio__native-control{top:0;right:0;left:0;width:40px;height:40px}.ruc-custom-theme .mat-mdc-slider{--mdc-slider-label-label-text-font: Roboto, sans-serif;--mdc-slider-label-label-text-size: 20px;--mdc-slider-label-label-text-line-height: 24px;--mdc-slider-label-label-text-tracking: normal;--mdc-slider-label-label-text-weight: 500}.ruc-custom-theme .mat-mdc-menu-content{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle1-font-size, 16px);line-height:var(--mdc-typography-subtitle1-line-height, 28px);font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle1-text-transform, none);line-height:24px}.ruc-custom-theme .mat-mdc-menu-content,.ruc-custom-theme .mat-mdc-menu-content .mat-mdc-menu-item .mdc-list-item__primary-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body1-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body1-font-size, 15px);line-height:var(--mdc-typography-body1-line-height, 24px);font-weight:var(--mdc-typography-body1-font-weight, 400);letter-spacing:var(--mdc-typography-body1-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-decoration:var(--mdc-typography-body1-text-decoration, inherit);text-transform:var(--mdc-typography-body1-text-transform, none)}.ruc-custom-theme .mat-mdc-list-base{--mdc-list-list-item-one-line-container-height: 48px;--mdc-list-list-item-two-line-container-height: 64px;--mdc-list-list-item-three-line-container-height: 88px}.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line{height:56px}.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines,.ruc-custom-theme .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines{height:72px}.ruc-custom-theme .mat-mdc-list-base{--mdc-list-list-item-label-text-font: Roboto, sans-serif;--mdc-list-list-item-label-text-line-height: 24px;--mdc-list-list-item-label-text-size: 15px;--mdc-list-list-item-label-text-tracking: normal;--mdc-list-list-item-label-text-weight: 400;--mdc-list-list-item-supporting-text-font: Roboto, sans-serif;--mdc-list-list-item-supporting-text-line-height: 20px;--mdc-list-list-item-supporting-text-size: 14px;--mdc-list-list-item-supporting-text-tracking: normal;--mdc-list-list-item-supporting-text-weight: 400;--mdc-list-list-item-trailing-supporting-text-font: Roboto, sans-serif;--mdc-list-list-item-trailing-supporting-text-line-height: 20px;--mdc-list-list-item-trailing-supporting-text-size: 12px;--mdc-list-list-item-trailing-supporting-text-tracking: normal;--mdc-list-list-item-trailing-supporting-text-weight: 400}.ruc-custom-theme .mdc-list-group__subheader{font-size:16px;font-weight:400;line-height:28px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-form-field-infix{min-height:40px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:20px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -26.75px) scale(var(--mat-mdc-form-field-floating-label-scale, .75));transform:var(--mat-mdc-form-field-label-transform)}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label{display:none}.ruc-custom-theme .mat-mdc-paginator-container{min-height:56px}.ruc-custom-theme .mat-mdc-paginator{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-caption-font-size, 12px);line-height:var(--mdc-typography-caption-line-height, 20px);font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:var(--mdc-typography-caption-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:var(--mdc-typography-caption-text-transform, none)}.ruc-custom-theme .mat-mdc-paginator .mat-mdc-select-value{font-size:12px}.ruc-custom-theme .mat-mdc-tab-header .mdc-tab{height:48px}.ruc-custom-theme .mdc-tab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox{padding:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);margin:calc((var(--mdc-checkbox-touch-target-size, 40px) - 40px) / 2)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__background{top:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);left:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2)}.ruc-custom-theme .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control{top:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);right:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);left:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);width:var(--mdc-checkbox-touch-target-size, 40px);height:var(--mdc-checkbox-touch-target-size, 40px)}@media all and (-ms-high-contrast: none){.ruc-custom-theme .mdc-checkbox .mdc-checkbox__focus-ring{display:none}}.ruc-custom-theme .mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mat-mdc-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-raised-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-unelevated-button.mat-mdc-button-base,.ruc-custom-theme .mat-mdc-outlined-button.mat-mdc-button-base{height:36px}.ruc-custom-theme .mdc-button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base{width:48px;height:48px;padding:12px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__focus-ring{max-height:48px;max-width:48px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin:4px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%,-50%)}.ruc-custom-theme .mdc-fab--extended{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 20px);line-height:var(--mdc-typography-button-line-height, 60px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.ruc-custom-theme .mat-mdc-snack-bar-container{--mdc-snackbar-supporting-text-font: Roboto, sans-serif;--mdc-snackbar-supporting-text-line-height: 20px;--mdc-snackbar-supporting-text-size: 14px;--mdc-snackbar-supporting-text-weight: 400}.ruc-custom-theme .mat-mdc-table .mdc-data-table__row{height:52px}.ruc-custom-theme .mat-mdc-table .mdc-data-table__pagination{min-height:52px}.ruc-custom-theme .mat-mdc-table .mdc-data-table__header-row{height:56px}.ruc-custom-theme .mdc-data-table__content,.ruc-custom-theme .mdc-data-table__cell{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.ruc-custom-theme .mdc-data-table__header-cell{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-subtitle2-font-size, 20px);line-height:var(--mdc-typography-subtitle2-line-height, 24px);font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, normal);-webkit-text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:var(--mdc-typography-subtitle2-text-transform, none)}.ruc-custom-theme .mat-badge{position:relative}.ruc-custom-theme .mat-badge.mat-badge{overflow:visible}.ruc-custom-theme .mat-badge-hidden .mat-badge-content{display:none}.ruc-custom-theme .mat-badge-content{position:absolute;text-align:center;display:inline-block;border-radius:50%;transition:transform .2s ease-in-out;transform:scale(.6);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none}.ruc-custom-theme .ng-animate-disabled .mat-badge-content,.ruc-custom-theme .mat-badge-content._mat-animation-noopable{transition:none}.ruc-custom-theme .mat-badge-content.mat-badge-active{transform:none}.ruc-custom-theme .mat-badge-small .mat-badge-content{width:16px;height:16px;line-height:16px}.ruc-custom-theme .mat-badge-small.mat-badge-above .mat-badge-content{top:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-below .mat-badge-content{bottom:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-before .mat-badge-content{left:-16px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-before .mat-badge-content{left:auto;right:-16px}.ruc-custom-theme .mat-badge-small.mat-badge-after .mat-badge-content{right:-16px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-after .mat-badge-content{right:auto;left:-16px}.ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-8px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-8px}.ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-8px}[dir=rtl] .ruc-custom-theme .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-8px}.ruc-custom-theme .mat-badge-medium .mat-badge-content{width:22px;height:22px;line-height:22px}.ruc-custom-theme .mat-badge-medium.mat-badge-above .mat-badge-content{top:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-below .mat-badge-content{bottom:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-before .mat-badge-content{left:-22px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-before .mat-badge-content{left:auto;right:-22px}.ruc-custom-theme .mat-badge-medium.mat-badge-after .mat-badge-content{right:-22px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-after .mat-badge-content{right:auto;left:-22px}.ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-11px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-11px}.ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-11px}[dir=rtl] .ruc-custom-theme .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-11px}.ruc-custom-theme .mat-badge-large .mat-badge-content{width:28px;height:28px;line-height:28px}.ruc-custom-theme .mat-badge-large.mat-badge-above .mat-badge-content{top:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-below .mat-badge-content{bottom:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-before .mat-badge-content{left:-28px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-before .mat-badge-content{left:auto;right:-28px}.ruc-custom-theme .mat-badge-large.mat-badge-after .mat-badge-content{right:-28px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-after .mat-badge-content{right:auto;left:-28px}.ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-14px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-14px}.ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-14px}[dir=rtl] .ruc-custom-theme .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-14px}.ruc-custom-theme .mat-badge-content{font-weight:600;font-size:12px;font-family:Roboto,sans-serif}.ruc-custom-theme .mat-badge-small .mat-badge-content{font-size:9px}.ruc-custom-theme .mat-badge-large .mat-badge-content{font-size:24px}.ruc-custom-theme .mat-bottom-sheet-container{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-button-toggle-appearance-standard .mat-button-toggle-label-content{line-height:48px}.ruc-custom-theme .mat-button-toggle{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{width:40px;height:40px;padding:8px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin:0}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base.mdc-icon-button--reduced-size .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mdc-icon-button__touch{position:absolute;top:50%;height:40px;left:50%;width:40px;transform:translate(-50%,-50%)}.ruc-custom-theme .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target{display:none}.ruc-custom-theme .mat-calendar{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-calendar-body{font-size:13px}.ruc-custom-theme .mat-calendar-body-label,.ruc-custom-theme .mat-calendar-period-button{font-size:20px;font-weight:500}.ruc-custom-theme .mat-calendar-table-header th{font-size:11px;font-weight:400}.ruc-custom-theme .mat-expansion-panel-header{height:48px}.ruc-custom-theme .mat-expansion-panel-header.mat-expanded{height:64px}.ruc-custom-theme .mat-expansion-panel-header{font-family:Roboto,sans-serif;font-size:15px;font-weight:400}.ruc-custom-theme .mat-expansion-panel-content{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto,sans-serif;letter-spacing:normal}.ruc-custom-theme .mat-grid-tile-header,.ruc-custom-theme .mat-grid-tile-footer{font-size:14px}.ruc-custom-theme .mat-grid-tile-header .mat-line,.ruc-custom-theme .mat-grid-tile-footer .mat-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;box-sizing:border-box}.ruc-custom-theme .mat-grid-tile-header .mat-line:nth-child(n+2),.ruc-custom-theme .mat-grid-tile-footer .mat-line:nth-child(n+2){font-size:12px}.ruc-custom-theme .mat-horizontal-stepper-header{height:72px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header,.ruc-custom-theme .mat-vertical-stepper-header{padding:24px}.ruc-custom-theme .mat-stepper-vertical-line:before{top:-16px;bottom:-16px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:after,.ruc-custom-theme .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:before{top:36px}.ruc-custom-theme .mat-stepper-label-position-bottom .mat-stepper-horizontal-line{top:36px}.ruc-custom-theme .mat-stepper-vertical,.ruc-custom-theme .mat-stepper-horizontal{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-step-label{font-size:14px;font-weight:400}.ruc-custom-theme .mat-step-sub-label-error{font-weight:400}.ruc-custom-theme .mat-step-label-error{font-size:20px}.ruc-custom-theme .mat-step-label-selected{font-size:20px;font-weight:500}.ruc-custom-theme .mat-toolbar-multiple-rows{min-height:64px}.ruc-custom-theme .mat-toolbar-row,.ruc-custom-theme .mat-toolbar-single-row{height:64px}@media (max-width: 599px){.ruc-custom-theme .mat-toolbar-multiple-rows{min-height:56px}.ruc-custom-theme .mat-toolbar-row,.ruc-custom-theme .mat-toolbar-single-row{height:56px}}.ruc-custom-theme .mat-toolbar,.ruc-custom-theme .mat-toolbar h1,.ruc-custom-theme .mat-toolbar h2,.ruc-custom-theme .mat-toolbar h3,.ruc-custom-theme .mat-toolbar h4,.ruc-custom-theme .mat-toolbar h5,.ruc-custom-theme .mat-toolbar h6{font-size:20px;font-weight:500;line-height:32px;font-family:Roboto,sans-serif;letter-spacing:normal;margin:0}.ruc-custom-theme .mat-tree-node{min-height:48px}.ruc-custom-theme .mat-tree{font-family:Roboto,sans-serif}.ruc-custom-theme .mat-tree-node,.ruc-custom-theme .mat-nested-tree-node{font-weight:400;font-size:14px}:host{display:block;position:relative;overflow:hidden}.custom-backdrop{position:absolute;inset:0;background-color:#000;z-index:999;visibility:hidden}.ruclib-drawer-container{width:100%;height:400px;border:1px solid #ccc;position:relative;overflow:hidden}.drawer-content-wrapper{padding:16px;position:relative;box-sizing:border-box;height:100%;display:flex;flex-direction:column}.ruclib-drawer-title{margin-top:0;margin-bottom:16px;font-size:1.5em;flex-shrink:0}.ruclib-drawer-close-button{position:absolute;top:8px;right:8px;padding:5px 0 0!important;flex-shrink:0}.ruclib-drawer-body{flex-grow:1;overflow-y:auto;word-break:break-word}.dynamic-drawer{background-color:var(--mat-sidenav-content-background-color, white);position:absolute;box-sizing:border-box;box-shadow:0 2px 10px #0003;z-index:1000;overflow:hidden}.dynamic-drawer.drawer-left{top:0;bottom:0;left:0}.dynamic-drawer.drawer-right{top:0;bottom:0;right:0}.dynamic-drawer.drawer-top{top:0;left:0;right:0}.dynamic-drawer.drawer-bottom{bottom:0;left:0;right:0}.dynamic-drawer.light-theme{background-color:#fff;color:#000000de}.dynamic-drawer.light-theme .ruclib-drawer-title{color:#000000de}.dynamic-drawer.light-theme .ruclib-drawer-close-button .mat-icon{color:#0000008a}.dynamic-drawer.dark-theme{background-color:#424242;color:#fff}.dynamic-drawer.dark-theme .ruclib-drawer-title,.dynamic-drawer.dark-theme .ruclib-drawer-close-button .mat-icon{color:#fff}.dynamic-drawer.custom-theme-one{background-color:#fff;color:#000000de}.dynamic-drawer.custom-theme-one .ruclib-drawer-title{color:#000000de}.dynamic-drawer.custom-theme-one .ruclib-drawer-close-button .mat-icon{color:#0000008a}.dynamic-drawer.custom-theme-two{background-color:#424242;color:#fff}.dynamic-drawer.custom-theme-two .ruclib-drawer-title,.dynamic-drawer.custom-theme-two .ruclib-drawer-close-button .mat-icon{color:#fff}.ruclib-drawer-toggle-image{object-fit:contain;display:block}.drawer-toggle-button{margin-bottom:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.ruclib-main-content{padding:16px;display:flex;flex-direction:column;align-items:flex-start}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { rucInputData: [{
+                type: Input
+            }], customTheme: [{
+                type: Input
+            }], rucEvent: [{
+                type: Output
+            }], drawerComponentHost: [{
+                type: ViewChild,
+                args: ['drawerComponentHost', { read: ViewContainerRef, static: true }]
+            }], onKeydownHandler: [{
+                type: HostListener,
+                args: ['document:keydown.escape', ['$event']]
+            }] } });
+
+class RuclibDrawerModule {
+}
+RuclibDrawerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+RuclibDrawerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerModule, declarations: [RuclibDrawerComponent,
+        SafeHtmlPipe], imports: [CommonModule,
+        MatButtonModule,
+        MatIconModule,
+        MatSidenavModule,
+        MatToolbarModule], exports: [RuclibDrawerComponent] });
+RuclibDrawerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerModule, imports: [CommonModule,
+        MatButtonModule,
+        MatIconModule,
+        MatSidenavModule,
+        MatToolbarModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: RuclibDrawerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        MatButtonModule,
+                        MatIconModule,
+                        MatSidenavModule,
+                        MatToolbarModule,
+                    ],
+                    declarations: [
+                        RuclibDrawerComponent,
+                        SafeHtmlPipe
+                    ],
+                    exports: [RuclibDrawerComponent],
+                }]
+        }] });
+
+const defaultValues = {
+    drawerPosition: 'left',
+    mode: 'over',
+    initialOpenedState: false,
+    drawerWidth: '300px',
+    drawerHeight: '250px',
+    content: {
+        drawerTitle: 'Drawer Title',
+        drawerBody: '<p>This is the <strong>body</strong> content of the drawer.</p><p>It can contain <em>HTML</em>.</p>',
+        drawerContentComponent: undefined,
+        mainBody: '<h2>Main Content Area</h2><p>This is where the main application content would go.</p>',
+    },
+    drawerContentComponentData: null,
+    disableToggleButtonInMainContent: false,
+    toggleButtonText: {
+        open: 'Open Drawer',
+        close: 'Close Drawer',
+    },
+    hasBackdrop: true,
+    backdropBackgroundColor: 'rgba(0, 0, 0, 0.6)',
+    showCloseIcon: true,
+    disableClose: false,
+    animationDuration: '300ms',
+    toggleButtonDimensions: {
+        width: 'auto',
+        height: '40px',
+        padding: '0 16px',
+        fontSize: '14px',
+        iconSize: '20px',
+    },
+    closeButtonDimensions: {
+        width: '40px',
+        height: '40px',
+        iconSize: '24px',
+    },
+};
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RuclibDrawerComponent, RuclibDrawerModule, defaultValues };
+//# sourceMappingURL=ruc-lib-drawer.mjs.map