import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
function DropdownDualMultiSelectLoadingComponent_ng_template_1_li_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li")(1, "div", 4);
    i0.ɵɵelement(2, "div", 5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div", 6);
    i0.ɵɵelement(4, "div", 5);
    i0.ɵɵelementEnd()();
} }
function DropdownDualMultiSelectLoadingComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "ul");
    i0.ɵɵtemplate(1, DropdownDualMultiSelectLoadingComponent_ng_template_1_li_1_Template, 5, 0, "li", 3);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngForOf", ctx_r0.items);
} }
function DropdownDualMultiSelectLoadingComponent_ng_template_3_li_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "li")(1, "div", 6);
    i0.ɵɵelement(2, "div", 5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div", 4);
    i0.ɵɵelement(4, "div", 5);
    i0.ɵɵelementEnd()();
} }
function DropdownDualMultiSelectLoadingComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "ul");
    i0.ɵɵtemplate(1, DropdownDualMultiSelectLoadingComponent_ng_template_3_li_1_Template, 5, 0, "li", 3);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngForOf", ctx_r0.items);
} }
export class DropdownDualMultiSelectLoadingComponent {
    set amount(numberOfItems) {
        this.items = new Array(numberOfItems);
    }
    static { this.ɵfac = function DropdownDualMultiSelectLoadingComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DropdownDualMultiSelectLoadingComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DropdownDualMultiSelectLoadingComponent, selectors: [["fusion-dropdown-dual-multi-select-loading"]], inputs: { position: "position", amount: "amount" }, decls: 5, vars: 1, consts: [["circleRight", ""], ["circleLeft", ""], [3, "ngTemplateOutlet"], [4, "ngFor", "ngForOf"], [1, "rect"], [1, "shine-overlay", 2, "animation-delay", "0s"], [1, "circle"]], template: function DropdownDualMultiSelectLoadingComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementContainer(0, 2);
            i0.ɵɵtemplate(1, DropdownDualMultiSelectLoadingComponent_ng_template_1_Template, 2, 1, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, DropdownDualMultiSelectLoadingComponent_ng_template_3_Template, 2, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
        } if (rf & 2) {
            const circleRight_r2 = i0.ɵɵreference(2);
            const circleLeft_r3 = i0.ɵɵreference(4);
            i0.ɵɵproperty("ngTemplateOutlet", ctx.position === "left" ? circleLeft_r3 : circleRight_r2);
        } }, dependencies: [i1.NgForOf, i1.NgTemplateOutlet], styles: ["[_nghost-%COMP%]   .circle[_ngcontent-%COMP%], [_nghost-%COMP%]   .rect[_ngcontent-%COMP%]{position:relative;overflow:hidden;background:var(--light-color-100, #F9FAFB);height:16px;border-radius:8px}[_nghost-%COMP%]   .circle[_ngcontent-%COMP%]{margin:0 4px;width:16px}[_nghost-%COMP%]   .rect[_ngcontent-%COMP%]{flex:1}[_nghost-%COMP%]   ul[_ngcontent-%COMP%]{flex:1;margin:18px 8px;padding:0;width:244px}[_nghost-%COMP%]   ul[_ngcontent-%COMP%] > li[_ngcontent-%COMP%]{display:flex;margin-bottom:16px}[_nghost-%COMP%]   .shine-overlay[_ngcontent-%COMP%]{position:absolute;inset:0;animation-duration:1.2s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:_ngcontent-%COMP%_shineAnimation;animation-timing-function:linear;background:#fff0;background:linear-gradient(to right,#fff0 8%,#fafafb 18%,#fff0 33%);background-size:1500px 100px}@keyframes _ngcontent-%COMP%_shineAnimation{0%{background-position:-750px 0}to{background-position:750px 0}}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DropdownDualMultiSelectLoadingComponent, [{
        type: Component,
        args: [{ selector: 'fusion-dropdown-dual-multi-select-loading', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngTemplateOutlet]=\"position === 'left' ? circleLeft : circleRight\"></ng-container>\n\n<ng-template #circleRight>\n    <ul>\n        <li *ngFor=\"let item of items\">\n            <div class=\"rect\">\n                <div class=\"shine-overlay\" style=\"animation-delay: 0s\"></div>\n            </div>\n            <div class=\"circle\">\n                <div class=\"shine-overlay\" style=\"animation-delay: 0s\"></div>\n            </div>\n        </li>\n    </ul>\n</ng-template>\n\n<ng-template #circleLeft>\n    <ul>\n        <li *ngFor=\"let item of items\">\n            <div class=\"circle\">\n                <div class=\"shine-overlay\" style=\"animation-delay: 0s\"></div>\n            </div>\n            <div class=\"rect\">\n                <div class=\"shine-overlay\" style=\"animation-delay: 0s\"></div>\n            </div>\n        </li>\n    </ul>\n</ng-template>\n", styles: [":host .circle,:host .rect{position:relative;overflow:hidden;background:var(--light-color-100, #F9FAFB);height:16px;border-radius:8px}:host .circle{margin:0 4px;width:16px}:host .rect{flex:1}:host ul{flex:1;margin:18px 8px;padding:0;width:244px}:host ul>li{display:flex;margin-bottom:16px}:host .shine-overlay{position:absolute;inset:0;animation-duration:1.2s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:shineAnimation;animation-timing-function:linear;background:#fff0;background:linear-gradient(to right,#fff0 8%,#fafafb 18%,#fff0 33%);background-size:1500px 100px}@keyframes shineAnimation{0%{background-position:-750px 0}to{background-position:750px 0}}\n"] }]
    }], null, { position: [{
            type: Input
        }], amount: [{
            type: Input
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DropdownDualMultiSelectLoadingComponent, { className: "DropdownDualMultiSelectLoadingComponent", filePath: "components/dropdown-dual-multi-select-loading/dropdown-dual-multi-select-loading.component.ts", lineNumber: 9 }); })();
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24tZHVhbC1tdWx0aS1zZWxlY3QtbG9hZGluZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9mdXNpb24tdWkvY29tcG9uZW50cy9kcm9wZG93bi1kdWFsLW11bHRpLXNlbGVjdC92Mi9jb21wb25lbnRzL2Ryb3Bkb3duLWR1YWwtbXVsdGktc2VsZWN0LWxvYWRpbmcvZHJvcGRvd24tZHVhbC1tdWx0aS1zZWxlY3QtbG9hZGluZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9mdXNpb24tdWkvY29tcG9uZW50cy9kcm9wZG93bi1kdWFsLW11bHRpLXNlbGVjdC92Mi9jb21wb25lbnRzL2Ryb3Bkb3duLWR1YWwtbXVsdGktc2VsZWN0LWxvYWRpbmcvZHJvcGRvd24tZHVhbC1tdWx0aS1zZWxlY3QtbG9hZGluZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBQyxNQUFNLGVBQWUsQ0FBQzs7OztJQ0s1RCxBQURKLDBCQUErQixhQUNUO0lBQ2QseUJBQTZEO0lBQ2pFLGlCQUFNO0lBQ04sOEJBQW9CO0lBQ2hCLHlCQUE2RDtJQUVyRSxBQURJLGlCQUFNLEVBQ0w7OztJQVJULDBCQUFJO0lBQ0Esb0dBQStCO0lBUW5DLGlCQUFLOzs7SUFSb0IsY0FBUTtJQUFSLHNDQUFROzs7SUFjekIsQUFESiwwQkFBK0IsYUFDUDtJQUNoQix5QkFBNkQ7SUFDakUsaUJBQU07SUFDTiw4QkFBa0I7SUFDZCx5QkFBNkQ7SUFFckUsQUFESSxpQkFBTSxFQUNMOzs7SUFSVCwwQkFBSTtJQUNBLG9HQUErQjtJQVFuQyxpQkFBSzs7O0lBUm9CLGNBQVE7SUFBUixzQ0FBUTs7QURUckMsTUFBTSxPQUFPLHVDQUF1QztJQUVoRCxJQUFhLE1BQU0sQ0FBQyxhQUFxQjtRQUNyQyxJQUFJLENBQUMsS0FBSyxHQUFHLElBQUksS0FBSyxDQUFDLGFBQWEsQ0FBQyxDQUFDO0lBQzFDLENBQUM7d0lBSlEsdUNBQXVDO29FQUF2Qyx1Q0FBdUM7WUNScEQsMkJBQWlHO1lBZWpHLEFBYkEseUlBQTBCLDRIQWFEOzs7O1lBZlgsMkZBQW1FOzs7aUZEUXBFLHVDQUF1QztjQU5uRCxTQUFTOzJCQUNJLDJDQUEyQyxtQkFHcEMsdUJBQXVCLENBQUMsTUFBTTtnQkFHdEMsUUFBUTtrQkFBaEIsS0FBSztZQUNPLE1BQU07a0JBQWxCLEtBQUs7O2tGQUZHLHVDQUF1QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgSW5wdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2Z1c2lvbi1kcm9wZG93bi1kdWFsLW11bHRpLXNlbGVjdC1sb2FkaW5nJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vZHJvcGRvd24tZHVhbC1tdWx0aS1zZWxlY3QtbG9hZGluZy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vZHJvcGRvd24tZHVhbC1tdWx0aS1zZWxlY3QtbG9hZGluZy5jb21wb25lbnQuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuZXhwb3J0IGNsYXNzIERyb3Bkb3duRHVhbE11bHRpU2VsZWN0TG9hZGluZ0NvbXBvbmVudCB7XG4gICAgQElucHV0KCkgcG9zaXRpb246ICdsZWZ0JyB8ICdyaWdodCc7XG4gICAgQElucHV0KCkgc2V0IGFtb3VudChudW1iZXJPZkl0ZW1zOiBudW1iZXIpIHtcbiAgICAgICAgdGhpcy5pdGVtcyA9IG5ldyBBcnJheShudW1iZXJPZkl0ZW1zKTtcbiAgICB9XG5cbiAgICBpdGVtczogQXJyYXk8bnVtYmVyPjtcbn1cbiIsIjxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwicG9zaXRpb24gPT09ICdsZWZ0JyA/IGNpcmNsZUxlZnQgOiBjaXJjbGVSaWdodFwiPjwvbmctY29udGFpbmVyPlxuXG48bmctdGVtcGxhdGUgI2NpcmNsZVJpZ2h0PlxuICAgIDx1bD5cbiAgICAgICAgPGxpICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCI+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwicmVjdFwiPlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzaGluZS1vdmVybGF5XCIgc3R5bGU9XCJhbmltYXRpb24tZGVsYXk6IDBzXCI+PC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJjaXJjbGVcIj5cbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwic2hpbmUtb3ZlcmxheVwiIHN0eWxlPVwiYW5pbWF0aW9uLWRlbGF5OiAwc1wiPjwvZGl2PlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvbGk+XG4gICAgPC91bD5cbjwvbmctdGVtcGxhdGU+XG5cbjxuZy10ZW1wbGF0ZSAjY2lyY2xlTGVmdD5cbiAgICA8dWw+XG4gICAgICAgIDxsaSAqbmdGb3I9XCJsZXQgaXRlbSBvZiBpdGVtc1wiPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImNpcmNsZVwiPlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzaGluZS1vdmVybGF5XCIgc3R5bGU9XCJhbmltYXRpb24tZGVsYXk6IDBzXCI+PC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJyZWN0XCI+XG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNoaW5lLW92ZXJsYXlcIiBzdHlsZT1cImFuaW1hdGlvbi1kZWxheTogMHNcIj48L2Rpdj5cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2xpPlxuICAgIDwvdWw+XG48L25nLXRlbXBsYXRlPlxuIl19