/**
 * @fileoverview added by tsickle
 * Generated from: lib/layout/drawer/index.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import * as tslib_1 from "tslib";
import { Component, ViewChild, ViewContainerRef, ComponentFactoryResolver, ElementRef, ChangeDetectorRef, } from "@angular/core";
import { DefaultDrawerConfig, DrawerService, } from "../../service/drawer.service";
var DrawerComponent = /** @class */ (function () {
    function DrawerComponent(resolver, service, ref) {
        this.resolver = resolver;
        this.service = service;
        this.ref = ref;
        this.config = DefaultDrawerConfig;
        this.useAnimation = "yes";
        this.isOpened = false;
        this.hiddenDrawer = true;
        this.componentRefMap = new Map();
    }
    /**
     * @private
     * @param {?} component
     * @return {?}
     */
    DrawerComponent.prototype.createDynamicComponent = /**
     * @private
     * @param {?} component
     * @return {?}
     */
    function (component) {
        // 确保在调用之前目标组件已经在entryComponents中声明
        /** @type {?} */
        var factory = this.resolver.resolveComponentFactory(component);
        /** @type {?} */
        var componentRef = this.container.createComponent(factory);
        return componentRef;
    };
    /**
     * @private
     * @param {?} componentRef
     * @return {?}
     */
    DrawerComponent.prototype.destroyDynamicComponent = /**
     * @private
     * @param {?} componentRef
     * @return {?}
     */
    function (componentRef) {
        if (componentRef) {
            componentRef.destroy();
        }
    };
    /**
     * @private
     * @param {?} componentRef
     * @param {?=} data
     * @return {?}
     */
    DrawerComponent.prototype.setComponentData = /**
     * @private
     * @param {?} componentRef
     * @param {?=} data
     * @return {?}
     */
    function (componentRef, data) {
        if (data === void 0) { data = {}; }
        // 如果需要传递数据给动态组件，可以这样做
        if (componentRef) {
            Object.entries(data).forEach((/**
             * @param {?} __0
             * @return {?}
             */
            function (_a) {
                var _b = tslib_1.__read(_a, 2), key = _b[0], value = _b[1];
                componentRef.instance[key] = value;
            }));
        }
    };
    /**
     * @private
     * @param {?} componentRef
     * @param {?} selector
     * @return {?}
     */
    DrawerComponent.prototype.getSlotElement = /**
     * @private
     * @param {?} componentRef
     * @param {?} selector
     * @return {?}
     */
    function (componentRef, selector) {
        /** @type {?} */
        var componentEl = componentRef.location.nativeElement;
        return (/** @type {?} */ (componentEl.querySelector(selector)));
    };
    /**
     * @private
     * @param {?} slotEl
     * @param {?} containerEl
     * @return {?}
     */
    DrawerComponent.prototype.setSlotElement = /**
     * @private
     * @param {?} slotEl
     * @param {?} containerEl
     * @return {?}
     */
    function (slotEl, containerEl) {
        containerEl.innerHTML = "";
        if (slotEl) {
            containerEl.append(slotEl);
        }
    };
    /**
     * @param {?} cache
     * @return {?}
     */
    DrawerComponent.prototype.setCache = /**
     * @param {?} cache
     * @return {?}
     */
    function (cache) {
        this.setSlotElement(cache.toolbarEl, this.toolbarSlot.nativeElement);
        this.setSlotElement(cache.headerEl, this.headerSlot.nativeElement);
        this.setSlotElement(cache.topEl, this.topSlot.nativeElement);
        /** @type {?} */
        var drawerTop = cache.config.top ? cache.config.top + "px" : "";
        this.element.nativeElement.style.setProperty("--drawer-top", drawerTop);
        if (cache.config.mode === "inner") {
            this.content.nativeElement.insertBefore(this.header.nativeElement, this.content.nativeElement.firstChild);
            this.content.nativeElement.append(this.toolbarSlot.nativeElement);
        }
        else {
            this.drawer.nativeElement.insertBefore(this.header.nativeElement, this.drawer.nativeElement.firstChild);
            this.header.nativeElement.append(this.toolbarSlot.nativeElement);
        }
        this.config = cache.config;
        this.ref.markForCheck();
    };
    /**
     * @param {?} config
     * @return {?}
     */
    DrawerComponent.prototype.setConfig = /**
     * @param {?} config
     * @return {?}
     */
    function (config) {
        /** @type {?} */
        var caches = this.componentRefMap.get(this.service.cacheKey) || [];
        /** @type {?} */
        var cache = caches.slice(-1)[0];
        if (cache) {
            cache.config = tslib_1.__assign({}, cache.config, config);
            this.setCache(cache);
        }
    };
    /**
     * @template T
     * @param {?} component
     * @param {?} config
     * @param {?} data
     * @return {?}
     */
    DrawerComponent.prototype.show = /**
     * @template T
     * @param {?} component
     * @param {?} config
     * @param {?} data
     * @return {?}
     */
    function (component, config, data) {
        /** @type {?} */
        var showConfig = tslib_1.__assign({}, DefaultDrawerConfig, config);
        /** @type {?} */
        var componentRef = this.createDynamicComponent(component);
        /** @type {?} */
        var toolbarEl = this.getSlotElement(componentRef, "[drawer-toolbar]");
        /** @type {?} */
        var headerEl = this.getSlotElement(componentRef, "[drawer-header]");
        /** @type {?} */
        var topEl = this.getSlotElement(componentRef, "[drawer-top]");
        /** @type {?} */
        var cache = {
            config: showConfig,
            ref: componentRef,
            toolbarEl: toolbarEl,
            headerEl: headerEl,
            topEl: topEl,
        };
        /** @type {?} */
        var caches = this.componentRefMap.get(this.service.cacheKey) || [];
        this.componentRefMap.set(this.service.cacheKey, tslib_1.__spread(caches, [cache]));
        // 如果是第一个缓存，打开抽屉
        if (caches.length === 0) {
            this.toggleOpenStatus(true, true);
        }
        this.toggleCache(cache);
        this.setComponentData(componentRef, data);
        return componentRef.instance;
    };
    /**
     * @return {?}
     */
    DrawerComponent.prototype.hide = /**
     * @return {?}
     */
    function () {
        this.service.hide();
    };
    /**
     * @return {?}
     */
    DrawerComponent.prototype.back = /**
     * @return {?}
     */
    function () {
        this.deleteCache(this.service.cacheKey);
        // 如果有上一个缓存，设置为当前缓存，否则关闭抽屉
        /** @type {?} */
        var caches = this.componentRefMap.get(this.service.cacheKey) || [];
        /** @type {?} */
        var cache = caches.slice(-1)[0];
        if (cache) {
            this.toggleCache(cache);
        }
        else {
            this.toggleOpenStatus(false, true);
        }
    };
    /**
     * @private
     * @param {?} cacheKey
     * @return {?}
     */
    DrawerComponent.prototype.deleteCache = /**
     * @private
     * @param {?} cacheKey
     * @return {?}
     */
    function (cacheKey) {
        /** @type {?} */
        var caches = this.componentRefMap.get(cacheKey) || [];
        /** @type {?} */
        var cache = caches.slice(-1)[0];
        if (cache) {
            this.destroyDynamicComponent(cache.ref);
            caches.pop();
        }
        if (caches.length === 0) {
            this.componentRefMap.delete(cacheKey);
        }
    };
    /**
     * @private
     * @param {?} cache
     * @return {?}
     */
    DrawerComponent.prototype.toggleCache = /**
     * @private
     * @param {?} cache
     * @return {?}
     */
    function (cache) {
        this.componentRefMap.forEach((/**
         * @param {?} caches
         * @return {?}
         */
        function (caches) {
            caches.forEach((/**
             * @param {?} c
             * @return {?}
             */
            function (c) {
                c.ref.location.nativeElement.style.display = c === cache ? "" : "none";
            }));
        }));
        this.setCache(cache);
    };
    /**
     * @param {?} cacheKey
     * @return {?}
     */
    DrawerComponent.prototype.deleteAllCache = /**
     * @param {?} cacheKey
     * @return {?}
     */
    function (cacheKey) {
        var _this = this;
        /** @type {?} */
        var caches = this.componentRefMap.get(cacheKey) || [];
        caches.forEach((/**
         * @param {?} cache
         * @return {?}
         */
        function (cache) {
            _this.destroyDynamicComponent(cache.ref);
        }));
        this.componentRefMap.delete(cacheKey);
    };
    /**
     * @return {?}
     */
    DrawerComponent.prototype.onRouteChange = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var caches = this.componentRefMap.get(this.service.cacheKey) || [];
        /** @type {?} */
        var cache = caches.slice(-1)[0];
        if (cache) {
            this.toggleCache(cache);
            this.toggleOpenStatus(true);
        }
        else {
            this.toggleOpenStatus(false);
        }
        this.useAnimation = "no";
    };
    /**
     * @param {?} isOpen
     * @param {?=} useAnimation
     * @return {?}
     */
    DrawerComponent.prototype.toggleOpenStatus = /**
     * @param {?} isOpen
     * @param {?=} useAnimation
     * @return {?}
     */
    function (isOpen, useAnimation) {
        if (useAnimation === void 0) { useAnimation = false; }
        this.isOpened = isOpen;
        this.useAnimation = useAnimation ? "yes" : "no";
        this.hiddenDrawer = !isOpen && !useAnimation;
        this.ref.markForCheck();
    };
    /**
     * @return {?}
     */
    DrawerComponent.prototype.onAnimationEnd = /**
     * @return {?}
     */
    function () {
        if (!this.isOpened) {
            this.hiddenDrawer = true;
            this.ref.markForCheck();
        }
    };
    DrawerComponent.decorators = [
        { type: Component, args: [{
                    selector: "rs-drawer",
                    template: "<div #element id=\"rs-drawer-container\" class=\"rs-drawer-container\">\r\n  <div class=\"rs-drawer-content\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  <div\r\n    #drawer\r\n    class=\"rs-drawer\"\r\n    [attr.data-mode]=\"config.mode\"\r\n    [attr.data-opened]=\"isOpened ? 'yes' : 'no'\"\r\n    [attr.data-animation]=\"useAnimation\"\r\n    [hidden]=\"hiddenDrawer\"\r\n    (animationend)=\"onAnimationEnd()\"\r\n  >\r\n    <div class=\"drawer-header\" #header>\r\n      <button class=\"drawer-return-button\" (click)=\"hide()\">\r\n        <span class=\"drawer-sub-title\" *ngIf=\"config.subTitle\">\r\n          {{ config.subTitle }}\r\n        </span>\r\n      </button>\r\n      <div class=\"drawer-title\">{{ config.title }}</div>\r\n      <div class=\"drawer-header-slot\" #headerSlot></div>\r\n    </div>\r\n    <div class=\"drawer-top-slot\" #topSlot></div>\r\n    <div class=\"drawer-content-box\">\r\n      <div class=\"drawer-content\" #content>\r\n        <div class=\"drawer-content-container\">\r\n          <ng-template #dynamicComponentContainer></ng-template>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"drawer-toolbar-slot\" #toolbarSlot></div>\r\n  </div>\r\n</div>\r\n",
                    styles: [":host{display:block;height:100%}#rs-drawer-container{height:100%}.rs-drawer-container{height:100%;background-color:transparent;overflow:hidden;position:relative}.rs-drawer-container .rs-drawer-content{width:100%;height:100%;overflow:auto;margin-right:0!important}.rs-drawer-container .rs-drawer{width:100%;height:100%;border-left:none;background-color:transparent;overflow:visible;pointer-events:none;opacity:0;display:flex;flex-flow:column nowrap;position:absolute;z-index:2;top:0;left:100%}.rs-drawer-container .rs-drawer[data-opened=yes]{left:0;opacity:1}.rs-drawer-container .rs-drawer[data-animation=yes][data-opened=yes]{-webkit-animation:.5s ease-in-out drawer-open;animation:.5s ease-in-out drawer-open}@-webkit-keyframes drawer-open{from{left:100%;opacity:0}to{left:0;opacity:1}}@keyframes drawer-open{from{left:100%;opacity:0}to{left:0;opacity:1}}.rs-drawer-container .rs-drawer[data-animation=yes][data-opened=no]{-webkit-animation:.5s ease-in-out drawer-close;animation:.5s ease-in-out drawer-close}@-webkit-keyframes drawer-close{from{left:0;opacity:1}to{left:100%;opacity:0}}@keyframes drawer-close{from{left:0;opacity:1}to{left:100%;opacity:0}}.rs-drawer-container .rs-drawer[hidden]{display:none}.rs-drawer-container .rs-drawer .drawer-header{flex:none;display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;box-sizing:content-box;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button{flex:none;display:flex;flex-flow:row nowrap;align-items:center;padding:0;border:none;background-color:transparent;cursor:pointer}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button::before{content:url(\"data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDE4TDcuNTQ5ODYgMTJMMTIgNiIgc3Ryb2tlPSIjNkM3QzkwIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHBhdGggZD0iTTE3LjQyNyAxMi41QzE3LjcwMzEgMTIuNSAxNy45MjcgMTIuMjc2MSAxNy45MjcgMTJDMTcuOTI3IDExLjcyMzkgMTcuNzAzMSAxMS41IDE3LjQyNyAxMS41TDE3LjQyNyAxMi41Wk03LjM5ODkzIDEyLjVMMTcuNDI3IDEyLjVMMTcuNDI3IDExLjVMNy4zOTg5MyAxMS41TDcuMzk4OTMgMTIuNVoiIGZpbGw9IiM2QzdDOTAiLz4KPC9zdmc+Cg==\");width:24px;height:24px;margin-right:8px;transition:transform 125ms ease-in-out}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button:hover::before{transform:translateX(-2px)}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button .drawer-sub-title{margin-right:12px;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title{flex:none;min-height:14px;padding:0 12px;border-left:1px solid #bdc4ca;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title:empty{padding:0}.rs-drawer-container .rs-drawer .drawer-content-box{flex:auto;height:0;background-color:#f7fafb;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-content{height:100%;padding:0 20px;border:1px solid #ebedf0;border-radius:15px;background-color:#fff;display:flex;flex-flow:column nowrap}.rs-drawer-container .rs-drawer .drawer-content .drawer-content-container{flex:auto;overflow:hidden auto}.rs-drawer-container .rs-drawer .drawer-toolbar-slot{flex:none;height:32px;margin-left:auto;display:flex;flex-flow:row nowrap;justify-content:flex-end;align-items:center;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-toolbar-slot:empty{display:none}.rs-drawer-container .rs-drawer .drawer-top-slot{flex:none;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-top-slot:empty{height:var(--drawer-top,0);pointer-events:none}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header{height:46px;padding:0 12px 0 8px;background-color:#f7fafb}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header .drawer-sub-title,.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header .drawer-title{color:#1f3f5c;font-size:15px;font-weight:700;line-height:18px}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-content{padding-bottom:20px}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-content .drawer-content-container{margin-right:-20px;padding-right:20px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-top-slot:empty+.drawer-content-box{padding-top:calc((var(--drawer-top,0) + 1) * 16px)}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header{height:24px;padding:6px 0;border-bottom:1px solid #eaedf0}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-sub-title,.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-title{color:#44566c;font-size:12px;line-height:14px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-title{font-weight:700}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-content .drawer-content-container{margin-right:-20px;padding-right:20px;padding-left:8px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-toolbar-slot{width:100%;padding:16px 0;box-sizing:content-box;border-top:1px solid #eaedf0}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar]{display:flex;flex-flow:row nowrap;justify-content:flex-end;align-items:center;gap:12px}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button{display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;gap:6px;min-width:80px;height:32px;padding:0 12px;border:1px solid #adb5bd;border-radius:4px;background-color:#fff;cursor:pointer;color:#44566c;font-size:13px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button:hover{border-color:#6c7c90}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button:disabled{opacity:1!important;border-color:#6c7c9066;color:#44566c66;cursor:unset}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary{border:none;background-color:#1364b3;color:#fff}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary:hover{background-color:#176bca}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary:disabled{background-color:#1364b366}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button img{width:16px;height:16px}::ng-deep .rs-drawer-container .rs-drawer[data-mode=outer] .drawer-toolbar-slot [drawer-toolbar] button{height:26px;font-size:12px;line-height:14px}::ng-deep .rs-drawer-container .rs-drawer[data-mode=inner] .drawer-toolbar-slot [drawer-toolbar] button img{display:none}"]
                }] }
    ];
    /** @nocollapse */
    DrawerComponent.ctorParameters = function () { return [
        { type: ComponentFactoryResolver },
        { type: DrawerService },
        { type: ChangeDetectorRef }
    ]; };
    DrawerComponent.propDecorators = {
        element: [{ type: ViewChild, args: ["element", { static: false },] }],
        drawer: [{ type: ViewChild, args: ["drawer", { static: false },] }],
        header: [{ type: ViewChild, args: ["header", { static: false },] }],
        content: [{ type: ViewChild, args: ["content", { static: false },] }],
        toolbarSlot: [{ type: ViewChild, args: ["toolbarSlot", { static: false },] }],
        headerSlot: [{ type: ViewChild, args: ["headerSlot", { static: false },] }],
        topSlot: [{ type: ViewChild, args: ["topSlot", { static: false },] }],
        container: [{ type: ViewChild, args: ["dynamicComponentContainer", {
                        read: ViewContainerRef,
                        static: false,
                    },] }]
    };
    return DrawerComponent;
}());
export { DrawerComponent };
if (false) {
    /** @type {?} */
    DrawerComponent.prototype.element;
    /** @type {?} */
    DrawerComponent.prototype.drawer;
    /** @type {?} */
    DrawerComponent.prototype.header;
    /** @type {?} */
    DrawerComponent.prototype.content;
    /** @type {?} */
    DrawerComponent.prototype.toolbarSlot;
    /** @type {?} */
    DrawerComponent.prototype.headerSlot;
    /** @type {?} */
    DrawerComponent.prototype.topSlot;
    /**
     * @type {?}
     * @private
     */
    DrawerComponent.prototype.container;
    /** @type {?} */
    DrawerComponent.prototype.config;
    /** @type {?} */
    DrawerComponent.prototype.useAnimation;
    /** @type {?} */
    DrawerComponent.prototype.isOpened;
    /** @type {?} */
    DrawerComponent.prototype.hiddenDrawer;
    /**
     * @type {?}
     * @private
     */
    DrawerComponent.prototype.componentRefMap;
    /**
     * @type {?}
     * @private
     */
    DrawerComponent.prototype.resolver;
    /**
     * @type {?}
     * @private
     */
    DrawerComponent.prototype.service;
    /**
     * @type {?}
     * @private
     */
    DrawerComponent.prototype.ref;
}
//# sourceMappingURL=data:application/json;base64, 