@unipin/angular-applet 18.9.7 → 21.0.1

package/fesm2022/unipin-angular-applet-containers.mjs

@@ -0,0 +1,472 @@
+import * as i0 from '@angular/core';
+import { inject, ViewContainerRef, DestroyRef, input, reflectComponentType, Directive, InjectionToken, forwardRef, signal, ChangeDetectionStrategy, Component, HostListener, booleanAttribute, output, computed } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import * as i1$1 from '@angular/router';
+import { Router, ActivatedRoute, NavigationEnd, RouterLink, RouterLinkActive } from '@angular/router';
+import { isObservable, firstValueFrom, filter, distinctUntilChanged } from 'rxjs';
+import * as i1 from '@unipin/angular-applet/auth';
+import { PermissionService } from '@unipin/angular-applet/auth';
+import { NgIcon, provideIcons } from '@ng-icons/core';
+import { matSettingsRound, matChevronRightRound, matCloseRound } from '@ng-icons/material-icons/round';
+import { UpButtonDirective } from '@unipin/angular-applet/buttons';
+import * as i2 from 'angular-split';
+import { AngularSplitModule } from 'angular-split';
+import { up } from '@unipin/angular-applet/common';
+
+class UpLazyRouteDirective {
+    constructor() {
+        this.router = inject(Router);
+        this.vcr = inject(ViewContainerRef);
+        this.route = inject(ActivatedRoute);
+        this.destroyRef = inject(DestroyRef);
+        /**
+         * Accepts a route config object containing `loadComponent`.
+         */
+        this.loadRoute = input.required(...(ngDevMode ? [{ debugName: "loadRoute" }] : []));
+    }
+    /**
+     * Lifecycle hook that is called after the directive's data-bound properties have been initialized.
+     * Dynamically loads the component using the `loadComponent` method and creates it within the directive's view container.
+     */
+    ngOnInit() {
+        if (!this.loadRoute().loadComponent)
+            return;
+        const result = this.loadRoute().loadComponent();
+        const load = isObservable(result) ? firstValueFrom(result) : Promise.resolve(result);
+        load.then((m) => {
+            const cmp = m.default ?? m;
+            const cr = this.vcr.createComponent(cmp);
+            const mirror = reflectComponentType(cmp);
+            this.setInput(cr, mirror);
+            this.router.events.pipe(filter((e) => e instanceof NavigationEnd), distinctUntilChanged((prev, curr) => {
+                return prev.urlAfterRedirects.split('#')[0] === curr.urlAfterRedirects.split('#')[0];
+            }), takeUntilDestroyed(this.destroyRef))
+                .subscribe({
+                next: () => this.setInput(cr, mirror)
+            });
+        });
+    }
+    /**
+     * Method to manually set Input to the child component, because component created by ViewContainerRef won't accept the input from route param directly.
+     * @param { ComponentRef<any> } cr
+     */
+    setInput(cr, mirror) {
+        const params = this.route.firstChild?.snapshot.params ?? {};
+        if (Object.keys(params).length === 0) {
+            return;
+        }
+        for (const key of Object.keys(params)) {
+            if (key in cr.instance) {
+                cr.setInput(key, params[key]);
+                continue;
+            }
+            if (mirror) {
+                const match = mirror.inputs.find((i) => i.templateName === key);
+                if (match) {
+                    cr.setInput(match.templateName, params[key]);
+                }
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpLazyRouteDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.0", type: UpLazyRouteDirective, isStandalone: true, selector: "[upLoadRoute]", inputs: { loadRoute: { classPropertyName: "loadRoute", publicName: "loadRoute", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["upLoadRoute"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpLazyRouteDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    exportAs: 'upLoadRoute',
+                    selector: '[upLoadRoute]'
+                }]
+        }], propDecorators: { loadRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadRoute", required: true }] }] } });
+
+const APPLET_CONFIG = new InjectionToken('APPLET_CONFIG');
+function provideAppletConfig(config) {
+    return {
+        provide: APPLET_CONFIG,
+        useValue: config
+    };
+}
+
+/**
+ * Redirects the user to their first accessible menu route based on permissions.
+ * @returns {RedirectFunction} The first allowed route
+ */
+function redirectToFirstMenu() {
+    const { has } = inject(PermissionService);
+    const { containers } = inject(() => forwardRef(() => APPLET_CONFIG));
+    const firstMenu = containers.find(({ permissions }) => {
+        if (!permissions)
+            return true;
+        const { codes, aggregator } = permissions;
+        return codes[aggregator === 'AND' ? 'every' : 'some']((code) => has(code));
+    });
+    return firstMenu?.path ?? containers[0].path;
+}
+
+class AppletContainerComponent {
+    constructor(permissionService) {
+        this.permissionService = permissionService;
+        this.config = inject(APPLET_CONFIG);
+        /**
+         * A flag variable that used to control sidebar. When set the the value to true, the component will open the sidebar.
+         * when set the value to false, the component will close the sidebar.
+         * @type {boolean}
+         */
+        this.isExpanded = signal(false, ...(ngDevMode ? [{ debugName: "isExpanded" }] : []));
+        /**
+         * A flag variable for indicates whether the sidebar menu is active or not in mobile view.
+         * When set false the sidebar menu will be hidden
+         * @type {boolean[]}
+         */
+        this.isMenuActive = signal(false, ...(ngDevMode ? [{ debugName: "isMenuActive" }] : []));
+        /**
+         * A flag variable that used to control sidebar menu. When set value to true, the component will hide the sidebar menu.
+         * When set false, the component will show the sidebar menu.
+         * @type {boolean[]}
+         */
+        this.isHidden = signal(Array(this.config.containers.length).fill(true), ...(ngDevMode ? [{ debugName: "isHidden" }] : []));
+        this.isHidden.set(this.config.containers.map(({ permissions }) => {
+            if (!permissions)
+                return false;
+            if (permissions.aggregator === 'AND') {
+                return !permissions.codes.every((code) => this.permissionService.has(code));
+            }
+            return !permissions.codes.some((code) => this.permissionService.has(code));
+        }));
+    }
+    /**
+     * When the method is called, it will change the value of isExpanded to its opposite value.
+     * If isExpanded is currently true, it will be set to false, and if it is currently false, it will be set to true.
+     * This method is typically used to toggle the visibility of a side navigation menu.
+     */
+    toggleSidenav() {
+        this.isExpanded.update((v) => !v);
+    }
+    /**
+     * Handles menu selection by dispatching a custom event.
+     * This method is called when a sidebar menu item is selected.
+     * It dispatches a custom 'menuEvent' with detail indicating the menu is inactive.
+     * This event is typically used to close the sidebar menu.
+     */
+    selectMenu() {
+        dispatchEvent(new CustomEvent('menuEvent', {
+            detail: {
+                isActive: false
+            }
+        }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: AppletContainerComponent, deps: [{ token: i1.PermissionService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: AppletContainerComponent, isStandalone: true, selector: "up-applet-container", host: { classAttribute: "flex size-full" }, providers: [
+            provideIcons({
+                matChevronRightRound,
+                matSettingsRound
+            })
+        ], ngImport: i0, template: "<nav \n    class=\"shrink-0 h-full group flex flex-col transition-all ease-in-out border-r border-border max-md:w-0 max-md:z-10 max-md:absolute [&.expanded]:w-60\"\n    [class.show]=\"isMenuActive()\"\n    [class.expanded]=\"isExpanded()\"\n>\n    <div class=\"shrink-0 p-2 border-b border-border flex items-center gap-2 relative\">\n        <img \n            class=\"rounded size-9 shrink-0\" \n            [alt]=\"config.name\"\n            [src]=\"config.icon\" \n        />\n\n        <div class=\"hidden group-[.expanded]:flex grow flex-col gap-0.5 select-none\">\n            <div class=\"font-medium line-clamp-1 text-sm\">{{ config.name }}</div>\n            \n            <div class=\"text-muted-foreground font-medium text-xs\">\n                v{{ config.version }}\n            </div>\n        </div>\n\n        <button \n            upButton\n            size=\"icon\"\n            variant=\"outline\"\n            class=\"rounded-full absolute -right-5\"\n            (click)=\"toggleSidenav()\"\n        >\n            <ng-icon \n                size=\"18\" \n                name=\"matChevronRightRound\" \n                class=\"group-[.expanded]:rotate-180 transition-all ease-in-out\"\n            />\n        </button>\n    </div>\n\n    <div class=\"grow overflow-y-auto p-2 flex flex-col gap-1\">\n        @for (c of config.containers; track $index) {\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [routerLink]=\"c.path\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon \n                    size=\"18\" \n                    [name]=\"c.icon\" \n                />\n                \n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">\n                    {{ c.label }}\n                </span>\n            </a>\n        }\n    </div>\n\n    @if (config.enabledSetting) {\n        <div class=\"shrink-0 p-2 border-t border-border\">\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLink=\"setting\" \n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon size=\"18\" name=\"matSettingsRound\" />\n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">Setting</span>\n            </a>\n        </div>\n    }\n</nav>\n\n<div class=\"grow overflow-y-auto overflow-x-hidden\">\n    <ng-content />\n</div>\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: UpButtonDirective, selector: "[upButton]", inputs: ["size", "variant", "class"], exportAs: ["upButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: AppletContainerComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'up-applet-container', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'flex size-full'
+                    }, imports: [
+                        NgIcon,
+                        RouterLink,
+                        RouterLinkActive,
+                        UpButtonDirective,
+                    ], providers: [
+                        provideIcons({
+                            matChevronRightRound,
+                            matSettingsRound
+                        })
+                    ], template: "<nav \n    class=\"shrink-0 h-full group flex flex-col transition-all ease-in-out border-r border-border max-md:w-0 max-md:z-10 max-md:absolute [&.expanded]:w-60\"\n    [class.show]=\"isMenuActive()\"\n    [class.expanded]=\"isExpanded()\"\n>\n    <div class=\"shrink-0 p-2 border-b border-border flex items-center gap-2 relative\">\n        <img \n            class=\"rounded size-9 shrink-0\" \n            [alt]=\"config.name\"\n            [src]=\"config.icon\" \n        />\n\n        <div class=\"hidden group-[.expanded]:flex grow flex-col gap-0.5 select-none\">\n            <div class=\"font-medium line-clamp-1 text-sm\">{{ config.name }}</div>\n            \n            <div class=\"text-muted-foreground font-medium text-xs\">\n                v{{ config.version }}\n            </div>\n        </div>\n\n        <button \n            upButton\n            size=\"icon\"\n            variant=\"outline\"\n            class=\"rounded-full absolute -right-5\"\n            (click)=\"toggleSidenav()\"\n        >\n            <ng-icon \n                size=\"18\" \n                name=\"matChevronRightRound\" \n                class=\"group-[.expanded]:rotate-180 transition-all ease-in-out\"\n            />\n        </button>\n    </div>\n\n    <div class=\"grow overflow-y-auto p-2 flex flex-col gap-1\">\n        @for (c of config.containers; track $index) {\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [routerLink]=\"c.path\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon \n                    size=\"18\" \n                    [name]=\"c.icon\" \n                />\n                \n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">\n                    {{ c.label }}\n                </span>\n            </a>\n        }\n    </div>\n\n    @if (config.enabledSetting) {\n        <div class=\"shrink-0 p-2 border-t border-border\">\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLink=\"setting\" \n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon size=\"18\" name=\"matSettingsRound\" />\n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">Setting</span>\n            </a>\n        </div>\n    }\n</nav>\n\n<div class=\"grow overflow-y-auto overflow-x-hidden\">\n    <ng-content />\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1.PermissionService }] });
+
+class UpColumnContainerComponent {
+    constructor(router, destroyRef, activeRoute) {
+        this.router = router;
+        this.destroyRef = destroyRef;
+        this.activeRoute = activeRoute;
+        /**
+         * An array of objects representing the columns, each containing a visibility flag and the associated route.
+         * @type {{ visible: boolean, route: Route }[]}
+         * @default {[]}
+         */
+        this.areas = signal([], ...(ngDevMode ? [{ debugName: "areas" }] : []));
+        /**
+         * The default size for the split area: 100 means it will be full width, and 50 means it will be divided in half.
+         * This can be resizable with minimum width 20%
+         */
+        this.colSize = signal(window.innerWidth <= 768 ? 100 : 50, ...(ngDevMode ? [{ debugName: "colSize" }] : []));
+        /**
+       * An object to keep track of the position of opened areas based on their route paths.
+       * @type {{ [key: string]: number }}
+       * @default {{}}
+       */
+        this.openedArea = {};
+    }
+    /**
+     * Lifecycle hook called after the component has been initialized.
+     * Subscribes to router events, initializes columns based on the initial route, and sets up the first visible column.
+     */
+    ngOnInit() {
+        this.checkScreen();
+        this.router.events.pipe(filter((e) => e instanceof NavigationEnd), takeUntilDestroyed(this.destroyRef)).subscribe({
+            next: () => this.navigate()
+        });
+        const url = this.activeRoute.firstChild?.routeConfig?.path;
+        const routeList = this.activeRoute.snapshot.routeConfig._loadedRoutes;
+        if (routeList?.length) {
+            this.next(routeList[0]);
+            for (let i = 1; i < routeList.length; i++) {
+                if (url?.startsWith(routeList[i].path)) {
+                    this.next(routeList[i]);
+                }
+            }
+        }
+    }
+    /**
+     * Event listener for the window resize event. Adjusts the default size of the split area based on the screen width.
+     */
+    checkScreen() {
+        this.colSize.set(window.innerWidth <= 768 ? 100 : 50);
+    }
+    /**
+     * Handles router navigation events and adjusts the display of columns accordingly.
+     */
+    navigate() {
+        const route = this.activeRoute.firstChild.routeConfig;
+        const pos = this.openedArea[`r-${route.path}`];
+        if (pos <= this.areas().length) {
+            this.previous(pos);
+            return;
+        }
+        this.next(route);
+    }
+    /**
+     * Adds a new column to the container and updates visibility based on the route navigation.
+     * @param {Route} route - Contain next route.
+     */
+    next(route) {
+        this.areas.update((areas) => {
+            if (this.colSize() === 100 &&
+                areas.length >= 1) {
+                areas[areas.length - 1].visible = false;
+            }
+            else if (areas.length >= 2) {
+                areas[areas.length - 2].visible = false;
+            }
+            const newAreas = [
+                ...areas,
+                { visible: true, route }
+            ];
+            this.openedArea[`r-${route.path}`] = newAreas.length;
+            return newAreas;
+        });
+    }
+    /**
+     * Removes columns from the container based on the route navigation.
+     * @param {number} pos - Contain position of the last active area index.
+     */
+    previous(pos) {
+        this.areas.update((areas) => {
+            const newAreas = areas.slice(0, pos);
+            if (this.colSize() === 100 && newAreas.length) {
+                newAreas[newAreas.length - 1].visible = true;
+                return newAreas;
+            }
+            if (newAreas.length === 1)
+                newAreas[0].visible = true;
+            else if (newAreas.length >= 2) {
+                newAreas[pos - 1].visible = true;
+                newAreas[pos - 2].visible = true;
+            }
+            return newAreas;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpColumnContainerComponent, deps: [{ token: i1$1.Router }, { token: i0.DestroyRef }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: UpColumnContainerComponent, isStandalone: true, selector: "up-column-container", host: { listeners: { "window:resize": "checkScreen()" }, classAttribute: "block size-full" }, ngImport: i0, template: `
+    <as-split 
+      unit="percent" 
+      [gutterSize]="5" 
+      [useTransition]="true"
+    >
+      @for (a of areas(); track $index) {
+        <as-split-area
+          class="border-start"
+          [minSize]="20"
+          [size]="colSize()"
+          [visible]="a.visible"
+          [maxSize]="$index === areas().length - 1? 80 : null"
+        >
+          <ng-container 
+            upLoadRoute
+            [loadRoute]="a.route" 
+          />
+        </as-split-area>
+      }
+    </as-split>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: AngularSplitModule }, { kind: "component", type: i2.SplitComponent, selector: "as-split", inputs: ["gutterSize", "gutterStep", "disabled", "gutterClickDeltaPx", "direction", "dir", "unit", "gutterAriaLabel", "restrictMove", "useTransition", "gutterDblClickDuration"], outputs: ["gutterClick", "gutterDblClick", "dragStart", "dragEnd", "transitionEnd"], exportAs: ["asSplit"] }, { kind: "component", type: i2.SplitAreaComponent, selector: "as-split-area", inputs: ["size", "minSize", "maxSize", "lockSize", "visible"], exportAs: ["asSplitArea"] }, { kind: "directive", type: UpLazyRouteDirective, selector: "[upLoadRoute]", inputs: ["loadRoute"], exportAs: ["upLoadRoute"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpColumnContainerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'up-column-container',
+                    host: {
+                        class: 'block size-full',
+                    },
+                    imports: [
+                        AngularSplitModule,
+                        UpLazyRouteDirective
+                    ],
+                    template: `
+    <as-split 
+      unit="percent" 
+      [gutterSize]="5" 
+      [useTransition]="true"
+    >
+      @for (a of areas(); track $index) {
+        <as-split-area
+          class="border-start"
+          [minSize]="20"
+          [size]="colSize()"
+          [visible]="a.visible"
+          [maxSize]="$index === areas().length - 1? 80 : null"
+        >
+          <ng-container 
+            upLoadRoute
+            [loadRoute]="a.route" 
+          />
+        </as-split-area>
+      }
+    </as-split>
+  `,
+                }]
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i0.DestroyRef }, { type: i1$1.ActivatedRoute }], propDecorators: { checkScreen: [{
+                type: HostListener,
+                args: ['window:resize']
+            }] } });
+
+class UpContentContainerComponent {
+    constructor() {
+        /**
+         * The title text displayed in the header.
+         * If the text is too long, it will be truncated with an ellipsis.
+         * @type {Signal<string>}
+         * @default ''
+         */
+        this.header = input('', ...(ngDevMode ? [{ debugName: "header" }] : []));
+        /**
+         * Disables the close/back button when set to true.
+         * When disabled, the close button will not be shown in the header.
+         * @type {Signal<boolean>}
+         * @default false
+         */
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        /**
+         * Hides the close/back button when set to true.
+         * When hidden, the close button will not be shown in the header.
+         * @type {Signal<boolean>}
+         * @default false
+         */
+        this.hideCloseButton = input(false, ...(ngDevMode ? [{ debugName: "hideCloseButton", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        /**
+         * Event emitted when the user clicks the close button.
+         * Typically used to handle closing a modal or navigating back.
+         * @type {OutputEmitterRef<void>}
+         */
+        this.closed = output();
+        this._headerClass = computed(() => {
+            return up('shrink-0 flex items-center py-2 gap-6 border-b border-[#e0e0e0]', this.hideCloseButton() ? 'px-4' : 'pr-4 pl-1');
+        }, ...(ngDevMode ? [{ debugName: "_headerClass" }] : []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpContentContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: UpContentContainerComponent, isStandalone: true, selector: "up-content-container", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideCloseButton: { classPropertyName: "hideCloseButton", publicName: "hideCloseButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { classAttribute: "flex flex-col size-full" }, providers: [
+            provideIcons({ matCloseRound }),
+        ], ngImport: i0, template: `
+    <div [class]="_headerClass()">
+      <div class="grow flex items-center gap-1">
+        @if (!this.hideCloseButton()) {
+          <button
+            upButton
+            size="icon"
+            tabindex="-1"
+            variant="ghost"
+            class="shrink-0 rounded-full"
+            [disabled]="disabled()"
+            (click)="closed.emit()"
+          >
+            <ng-icon size="20" name="matCloseRound" />
+          </button>
+        }
+
+        <h3 class="grow select-none line-clamp-1 font-semibold text-lg">
+          {{ header() }}
+        </h3>
+      </div>
+
+      <div class="shrink-0">
+        <ng-content select="[actions]" />
+      </div>
+    </div>
+
+    <div class="grow overflow-auto">
+      <ng-content />
+    </div>
+  `, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "directive", type: UpButtonDirective, selector: "[upButton]", inputs: ["size", "variant", "class"], exportAs: ["upButton"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: UpContentContainerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'up-content-container',
+                    host: {
+                        class: 'flex flex-col size-full'
+                    },
+                    imports: [
+                        NgIcon,
+                        UpButtonDirective
+                    ],
+                    providers: [
+                        provideIcons({ matCloseRound }),
+                    ],
+                    template: `
+    <div [class]="_headerClass()">
+      <div class="grow flex items-center gap-1">
+        @if (!this.hideCloseButton()) {
+          <button
+            upButton
+            size="icon"
+            tabindex="-1"
+            variant="ghost"
+            class="shrink-0 rounded-full"
+            [disabled]="disabled()"
+            (click)="closed.emit()"
+          >
+            <ng-icon size="20" name="matCloseRound" />
+          </button>
+        }
+
+        <h3 class="grow select-none line-clamp-1 font-semibold text-lg">
+          {{ header() }}
+        </h3>
+      </div>
+
+      <div class="shrink-0">
+        <ng-content select="[actions]" />
+      </div>
+    </div>
+
+    <div class="grow overflow-auto">
+      <ng-content />
+    </div>
+  `
+                }]
+        }], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], hideCloseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideCloseButton", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { APPLET_CONFIG, AppletContainerComponent, UpColumnContainerComponent, UpContentContainerComponent, UpLazyRouteDirective, provideAppletConfig, redirectToFirstMenu };
+//# sourceMappingURL=unipin-angular-applet-containers.mjs.map

package/fesm2022/unipin-angular-applet-containers.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"unipin-angular-applet-containers.mjs","sources":["../../../projects/unipin-angular/containers/column-container/directives/lazy-route.directive.ts","../../../projects/unipin-angular/containers/applet-container/utils/provide-applet-config/provide-applet-config.util.ts","../../../projects/unipin-angular/containers/applet-container/utils/redirect-to-first-menu/redirect-to-first-menu.util.ts","../../../projects/unipin-angular/containers/applet-container/components/applet-container.component.ts","../../../projects/unipin-angular/containers/applet-container/components/applet-container.component.html","../../../projects/unipin-angular/containers/column-container/column-container.component.ts","../../../projects/unipin-angular/containers/content-container/content-container.component.ts","../../../projects/unipin-angular/containers/unipin-angular-applet-containers.ts"],"sourcesContent":["import { ComponentRef, Directive, OnInit, ViewContainerRef, inject, DestroyRef, input, reflectComponentType, ComponentMirror } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ActivatedRoute, NavigationEnd, Router, Route } from '@angular/router';\nimport { distinctUntilChanged, filter, isObservable, firstValueFrom } from 'rxjs';\n\n@Directive({\n  standalone: true,\n  exportAs: 'upLoadRoute',\n  selector: '[upLoadRoute]'\n})\nexport class UpLazyRouteDirective implements OnInit {\n  \n  protected readonly router = inject(Router);\n  protected readonly vcr = inject(ViewContainerRef);\n  protected readonly route = inject(ActivatedRoute);\n  protected readonly destroyRef = inject(DestroyRef);\n\n  /**\n   * Accepts a route config object containing `loadComponent`.\n   */\n  public readonly loadRoute = input.required<Pick<Route, 'loadComponent'>>();\n\n  /**\n   * Lifecycle hook that is called after the directive's data-bound properties have been initialized.\n   * Dynamically loads the component using the `loadComponent` method and creates it within the directive's view container.\n   */\n  public ngOnInit(): void{\n    if (!this.loadRoute().loadComponent) return;\n\n    const result = this.loadRoute().loadComponent!();\n    const load = isObservable(result)? firstValueFrom(result) : Promise.resolve(result);\n\n    load.then(\n      (m: any) => {\n        const cmp = m.default?? m;\n        \n        const cr = this.vcr.createComponent(cmp);\n        const mirror = reflectComponentType(cmp);\n        \n        this.setInput(cr, mirror);\n        this.router.events.pipe(\n          filter(\n            (e): e is NavigationEnd => e instanceof NavigationEnd\n          ),\n          distinctUntilChanged(\n            (prev, curr) => {\n              return prev.urlAfterRedirects.split('#')[0] === curr.urlAfterRedirects.split('#')[0];\n            }\n          ),\n          takeUntilDestroyed(this.destroyRef)\n        )\n        .subscribe({\n          next: () => this.setInput(cr, mirror)\n        });\n      }\n    );\n  }\n\n  /**\n   * Method to manually set Input to the child component, because component created by ViewContainerRef won't accept the input from route param directly.\n   * @param { ComponentRef<any> } cr\n   */\n  protected setInput(cr: ComponentRef<any>, mirror: ComponentMirror<unknown> | null): void{\n    const params = this.route.firstChild?.snapshot.params ?? {};\n\n    if (Object.keys(params).length === 0) {\n      return;\n    }\n\n    for (const key of Object.keys(params)) {\n      if (key in cr.instance) {\n        cr.setInput(key, params[key]);\n        continue;\n      }\n\n      if (mirror) {\n        const match = mirror.inputs.find(\n          (i) => i.templateName === key\n        );\n        \n        if (match) {\n          cr.setInput(match.templateName, params[key]);\n        }\n      }\n    }\n  }\n}\n","import { InjectionToken, Provider } from '@angular/core';\nimport { AppletConfig } from '../../types/applet-config.type';\n\nexport const APPLET_CONFIG = new InjectionToken<AppletConfig>('APPLET_CONFIG');\n\nexport function provideAppletConfig(config: AppletConfig): Provider{\n  \n  return { \n    provide: APPLET_CONFIG, \n    useValue: config \n  };\n}\n","import { forwardRef, inject } from '@angular/core';\nimport { RedirectFunction } from '@angular/router';\nimport { PermissionService } from '@unipin/angular-applet/auth';\nimport { AppletConfig } from '../../types/applet-config.type';\nimport { APPLET_CONFIG } from '../provide-applet-config/provide-applet-config.util';\n\n/**\n * Redirects the user to their first accessible menu route based on permissions.\n * @returns {RedirectFunction} The first allowed route\n */\nexport function redirectToFirstMenu(): ReturnType<RedirectFunction>{\n  \n  const { has } = inject(PermissionService);\n  const { containers } = inject<AppletConfig>(\n    () => forwardRef(() => APPLET_CONFIG)\n  );\n\n  const firstMenu = containers.find(\n    ({ permissions }) => {\n      if (!permissions) return true;\n\n      const { codes, aggregator } = permissions;\n      return codes[aggregator === 'AND'? 'every' : 'some']((code) => has(code));\n    }\n  );\n  return firstMenu?.path?? containers[0].path;\n}\n","import { ChangeDetectionStrategy, Component, inject, signal } from '@angular/core';\nimport { RouterLink, RouterLinkActive } from '@angular/router';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matChevronRightRound, matSettingsRound } from '@ng-icons/material-icons/round';\nimport { PermissionService } from '@unipin/angular-applet/auth';\nimport { UpButtonDirective } from '@unipin/angular-applet/buttons';\nimport { AppletConfig } from '../types/applet-config.type';\nimport { APPLET_CONFIG } from '../utils/provide-applet-config/provide-applet-config.util';\n\n@Component({\n  standalone: true,\n  selector: 'up-applet-container',\n  templateUrl: './applet-container.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'flex size-full'\n  },\n  imports: [\n    NgIcon,\n    RouterLink,\n    RouterLinkActive,\n    UpButtonDirective,\n  ],\n  providers: [\n    provideIcons(\n      { \n        matChevronRightRound, \n        matSettingsRound \n      }\n    )\n  ]\n})\nexport class AppletContainerComponent {\n\n  public readonly config: AppletConfig = inject<AppletConfig>(APPLET_CONFIG);  \n\n  /**\n   * A flag variable that used to control sidebar. When set the the value to true, the component will open the sidebar.\n   * when set the value to false, the component will close the sidebar.\n   * @type {boolean}\n   */\n  public readonly isExpanded = signal<boolean>(false);\n\n  /**\n   * A flag variable for indicates whether the sidebar menu is active or not in mobile view.\n   * When set false the sidebar menu will be hidden\n   * @type {boolean[]}\n   */\n  public readonly isMenuActive = signal<boolean>(false);\n\n  /**\n   * A flag variable that used to control sidebar menu. When set value to true, the component will hide the sidebar menu.\n   * When set false, the component will show the sidebar menu.\n   * @type {boolean[]}\n   */\n  public readonly isHidden = signal<boolean[]>(Array(this.config.containers.length).fill(true));\n\n  constructor(\n    protected readonly permissionService: PermissionService\n  ) {\n    this.isHidden.set(\n      this.config.containers.map(\n        ({ permissions }) => {\n          if (!permissions) return false;\n          \n          if (permissions.aggregator === 'AND') {\n            return !permissions.codes.every((code) => this.permissionService.has(code));\n          }\n          return !permissions.codes.some((code) => this.permissionService.has(code));\n        }\n      )\n    );\n  }\n\n  /**\n   * When the method is called, it will change the value of isExpanded to its opposite value. \n   * If isExpanded is currently true, it will be set to false, and if it is currently false, it will be set to true. \n   * This method is typically used to toggle the visibility of a side navigation menu.\n   */\n  public toggleSidenav(): void{\n    this.isExpanded.update((v) => !v);\n  }\n\n  /**\n   * Handles menu selection by dispatching a custom event.\n   * This method is called when a sidebar menu item is selected.\n   * It dispatches a custom 'menuEvent' with detail indicating the menu is inactive.\n   * This event is typically used to close the sidebar menu.\n   */\n  public selectMenu(): void{\n    dispatchEvent(\n      new CustomEvent(\n        'menuEvent', \n        { \n          detail: { \n            isActive: false \n          } \n        }\n      )\n    );\n  }\n}\n","<nav \n    class=\"shrink-0 h-full group flex flex-col transition-all ease-in-out border-r border-border max-md:w-0 max-md:z-10 max-md:absolute [&.expanded]:w-60\"\n    [class.show]=\"isMenuActive()\"\n    [class.expanded]=\"isExpanded()\"\n>\n    <div class=\"shrink-0 p-2 border-b border-border flex items-center gap-2 relative\">\n        <img \n            class=\"rounded size-9 shrink-0\" \n            [alt]=\"config.name\"\n            [src]=\"config.icon\" \n        />\n\n        <div class=\"hidden group-[.expanded]:flex grow flex-col gap-0.5 select-none\">\n            <div class=\"font-medium line-clamp-1 text-sm\">{{ config.name }}</div>\n            \n            <div class=\"text-muted-foreground font-medium text-xs\">\n                v{{ config.version }}\n            </div>\n        </div>\n\n        <button \n            upButton\n            size=\"icon\"\n            variant=\"outline\"\n            class=\"rounded-full absolute -right-5\"\n            (click)=\"toggleSidenav()\"\n        >\n            <ng-icon \n                size=\"18\" \n                name=\"matChevronRightRound\" \n                class=\"group-[.expanded]:rotate-180 transition-all ease-in-out\"\n            />\n        </button>\n    </div>\n\n    <div class=\"grow overflow-y-auto p-2 flex flex-col gap-1\">\n        @for (c of config.containers; track $index) {\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [routerLink]=\"c.path\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon \n                    size=\"18\" \n                    [name]=\"c.icon\" \n                />\n                \n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">\n                    {{ c.label }}\n                </span>\n            </a>\n        }\n    </div>\n\n    @if (config.enabledSetting) {\n        <div class=\"shrink-0 p-2 border-t border-border\">\n            <a \n                upButton\n                variant=\"ghost\"\n                routerLink=\"setting\" \n                routerLinkActive=\"font-medium\"\n                class=\"group-[.expanded]:w-full group-[.expanded]:justify-start\"\n                [size]=\"!isExpanded()? 'icon' : 'default'\"\n                (click)=\"selectMenu()\"\n            >\n                <ng-icon size=\"18\" name=\"matSettingsRound\" />\n                <span class=\"line-clamp-1 hidden group-[.expanded]:block\">Setting</span>\n            </a>\n        </div>\n    }\n</nav>\n\n<div class=\"grow overflow-y-auto overflow-x-hidden\">\n    <ng-content />\n</div>\n","import { Component, HostListener, DestroyRef, signal, OnInit } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ActivatedRoute, NavigationEnd, Route, Router } from '@angular/router';\nimport { filter } from 'rxjs';\nimport { AngularSplitModule } from 'angular-split';\nimport { UpLazyRouteDirective } from './directives/lazy-route.directive';\n\n@Component({\n  standalone: true,\n  selector: 'up-column-container',\n  host: {\n    class: 'block size-full',\n  },\n  imports: [\n    AngularSplitModule, \n    UpLazyRouteDirective\n  ],\n  template: `\n    <as-split \n      unit=\"percent\" \n      [gutterSize]=\"5\" \n      [useTransition]=\"true\"\n    >\n      @for (a of areas(); track $index) {\n        <as-split-area\n          class=\"border-start\"\n          [minSize]=\"20\"\n          [size]=\"colSize()\"\n          [visible]=\"a.visible\"\n          [maxSize]=\"$index === areas().length - 1? 80 : null\"\n        >\n          <ng-container \n            upLoadRoute\n            [loadRoute]=\"a.route\" \n          />\n        </as-split-area>\n      }\n    </as-split>\n  `,\n})\nexport class UpColumnContainerComponent implements OnInit {\n  \n  /**\n   * An array of objects representing the columns, each containing a visibility flag and the associated route.\n   * @type {{ visible: boolean, route: Route }[]}\n   * @default {[]}\n   */\n  public readonly areas = signal<{ visible: boolean; route: Pick<Route, 'loadComponent'> }[]>([]);\n\n  /**\n   * The default size for the split area: 100 means it will be full width, and 50 means it will be divided in half.\n   * This can be resizable with minimum width 20%\n   */\n  public readonly colSize = signal<number>(window.innerWidth <= 768? 100 : 50);\n\n    /**\n   * An object to keep track of the position of opened areas based on their route paths.\n   * @type {{ [key: string]: number }}\n   * @default {{}}\n   */\n  protected readonly openedArea: Record<string, number> = {};\n\n  constructor(\n    protected readonly router: Router,\n    protected readonly destroyRef: DestroyRef,\n    protected readonly activeRoute: ActivatedRoute\n  ){ }\n\n  /**\n   * Lifecycle hook called after the component has been initialized.\n   * Subscribes to router events, initializes columns based on the initial route, and sets up the first visible column.\n   */\n  public ngOnInit(): void{\n    this.checkScreen();\n\n    this.router.events.pipe(\n      filter(\n        (e): e is NavigationEnd => e instanceof NavigationEnd\n      ),\n      takeUntilDestroyed(this.destroyRef)\n    ).subscribe({\n      next: () => this.navigate()\n    });\n\n    const url: string | undefined = this.activeRoute.firstChild?.routeConfig?.path;\n    const routeList: Route[] =(this.activeRoute.snapshot.routeConfig as any)._loadedRoutes;\n\n    if (routeList?.length) {\n      this.next(routeList[0]);\n\n      for (let i = 1; i < routeList.length; i++) {\n        if (\n          url?.startsWith(\n            routeList[i].path as string\n          )\n        ) {\n          this.next(routeList[i]);\n        }\n      }\n    }\n  }\n\n  /**\n   * Event listener for the window resize event. Adjusts the default size of the split area based on the screen width.\n   */\n  @HostListener('window:resize')\n  public checkScreen(): void{\n    this.colSize.set(window.innerWidth <= 768? 100 : 50);\n  }\n\n  /**\n   * Handles router navigation events and adjusts the display of columns accordingly.\n   */\n  protected navigate(): void{\n    const route: Route = this.activeRoute.firstChild!.routeConfig!;\n    const pos = this.openedArea[`r-${ route.path }`];\n\n    if (pos <= this.areas().length) {\n      this.previous(pos);\n      return;\n    }\n    this.next(route);\n  }\n\n  /**\n   * Adds a new column to the container and updates visibility based on the route navigation.\n   * @param {Route} route - Contain next route.\n   */\n  protected next(route: Route): void{\n    this.areas.update(\n      (areas) => {\n        if (\n          this.colSize() === 100 &&\n          areas.length >= 1\n        ) {\n          areas[areas.length - 1].visible = false;\n        } else if (areas.length >= 2) {\n          areas[areas.length - 2].visible = false;\n        }\n\n        const newAreas = [\n          ...areas,\n          { visible: true, route }\n        ];\n\n        this.openedArea[`r-${ route.path }`] = newAreas.length;\n        return newAreas;\n      }\n    );\n  }\n\n  /**\n   * Removes columns from the container based on the route navigation.\n   * @param {number} pos - Contain position of the last active area index.\n   */\n  protected previous(pos: number): void{\n    this.areas.update(\n      (areas) => {\n        const newAreas = areas.slice(0, pos);\n\n        if (this.colSize() === 100 && newAreas.length) {\n          newAreas[newAreas.length - 1].visible = true;\n          return newAreas;\n        }\n\n        if (newAreas.length === 1) newAreas[0].visible = true;\n        else if (newAreas.length >= 2) {\n          newAreas[pos - 1].visible = true;\n          newAreas[pos - 2].visible = true;\n        }\n        return newAreas;\n      }\n    );\n  }\n}\n","import { Component, input, booleanAttribute, computed, output } from '@angular/core';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matCloseRound } from '@ng-icons/material-icons/round';\nimport { up } from '@unipin/angular-applet/common';\nimport { UpButtonDirective } from '@unipin/angular-applet/buttons';\n\n@Component({\n  standalone: true,\n  selector: 'up-content-container',\n  host: {\n    class: 'flex flex-col size-full'\n  },\n  imports: [\n    NgIcon,\n    UpButtonDirective\n  ],\n  providers: [\n    provideIcons({ matCloseRound }),\n  ],\n  template: `\n    <div [class]=\"_headerClass()\">\n      <div class=\"grow flex items-center gap-1\">\n        @if (!this.hideCloseButton()) {\n          <button\n            upButton\n            size=\"icon\"\n            tabindex=\"-1\"\n            variant=\"ghost\"\n            class=\"shrink-0 rounded-full\"\n            [disabled]=\"disabled()\"\n            (click)=\"closed.emit()\"\n          >\n            <ng-icon size=\"20\" name=\"matCloseRound\" />\n          </button>\n        }\n\n        <h3 class=\"grow select-none line-clamp-1 font-semibold text-lg\">\n          {{ header() }}\n        </h3>\n      </div>\n\n      <div class=\"shrink-0\">\n        <ng-content select=\"[actions]\" />\n      </div>\n    </div>\n\n    <div class=\"grow overflow-auto\">\n      <ng-content />\n    </div>\n  `\n})\nexport class UpContentContainerComponent {\n\n  /**\n   * The title text displayed in the header.\n   * If the text is too long, it will be truncated with an ellipsis.\n   * @type {Signal<string>}\n   * @default ''\n   */\n  public readonly header = input<string>('');\n\n  /**\n   * Disables the close/back button when set to true.\n   * When disabled, the close button will not be shown in the header.\n   * @type {Signal<boolean>}\n   * @default false\n   */\n  public readonly disabled = input(false, { transform: booleanAttribute });\n\n  /**\n   * Hides the close/back button when set to true.\n   * When hidden, the close button will not be shown in the header.\n   * @type {Signal<boolean>}\n   * @default false\n   */\n  public readonly hideCloseButton = input(false, { transform: booleanAttribute });\n\n  /**\n   * Event emitted when the user clicks the close button.\n   * Typically used to handle closing a modal or navigating back.\n   * @type {OutputEmitterRef<void>}\n   */\n  public readonly closed = output<void>();\n\n  protected readonly _headerClass = computed(\n    () => {\n      return up(\n        'shrink-0 flex items-center py-2 gap-6 border-b border-[#e0e0e0]',\n        this.hideCloseButton()? 'px-4' : 'pr-4 pl-1'\n      );\n    }\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}