@ng-doc/app 15.0.0-beta.32 → 15.0.0-beta.34

package/esm2020/components/playground/playground-demo/playground-demo.component.mjs

@@ -0,0 +1,117 @@
+import { __decorate, __metadata } from "tslib";
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Injector, Input, ViewChild, ViewContainerRef, } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+import { NgDocRootPage } from '@ng-doc/app/classes/root-page';
+import { getPlaygroundDemoToken } from '@ng-doc/app/helpers/provide-playground-demo';
+import { buildPlaygroundDemoTemplate } from '@ng-doc/core/helpers/build-playground-demo-template';
+import { formatHtml } from '@ng-doc/core/helpers/format-html';
+import { objectKeys } from '@ng-doc/core/helpers/object-keys';
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
+import { of, Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import * as i0 from "@angular/core";
+import * as i1 from "@ng-doc/app/classes/root-page";
+import * as i2 from "@ng-doc/app/components/demo-displayer";
+import * as i3 from "@angular/common";
+let NgDocPlaygroundDemoComponent = class NgDocPlaygroundDemoComponent {
+    constructor(rootPage, injector) {
+        this.rootPage = rootPage;
+        this.injector = injector;
+        this.id = '';
+        this.selector = '';
+        this.recreateDemo = false;
+        this.code = of('');
+        this.unsubscribe$ = new Subject();
+    }
+    ngOnChanges({ form, id }) {
+        if (form && id) {
+            this.unsubscribe$.next();
+            const demoInjector = getPlaygroundDemoToken(this.id);
+            if (demoInjector) {
+                const demos = this.injector.get(demoInjector, []);
+                this.playgroundDemo = demos.find((demo) => demo.selector === this.selector);
+            }
+            this.updateDemo();
+            this.form?.valueChanges
+                .pipe(takeUntil(this.unsubscribe$), untilDestroyed(this))
+                .subscribe((data) => this.updateDemo(data));
+        }
+    }
+    updateDemo(data) {
+        if (this.recreateDemo || !this.demoRef) {
+            this.renderDemo();
+        }
+        if (data) {
+            Object.assign(this.demoRef?.instance.playground ?? {}, data.properties);
+            Object.assign(this.demoRef?.instance.content ?? {}, data.content);
+            this.demoRef?.instance?.viewContainerRef?.injector.get(ChangeDetectorRef)?.markForCheck();
+        }
+        this.updateCodeView();
+    }
+    renderDemo() {
+        if (this.playgroundDemo) {
+            this.demoRef?.destroy();
+            if (this.playgroundDemo) {
+                this.demoRef = this.demoOutlet?.createComponent(this.playgroundDemo);
+            }
+            this.demoRef?.changeDetectorRef.markForCheck();
+        }
+    }
+    updateCodeView() {
+        const template = buildPlaygroundDemoTemplate(this.configuration?.template ?? '', this.selector, this.getActiveContent(), this.getActiveInputs());
+        this.code = formatHtml(template);
+    }
+    getActiveContent() {
+        const formData = this.form?.controls.content.value ?? {};
+        return objectKeys(formData).reduce((result, key) => {
+            result[key] = formData[key] ? this.configuration?.content?.[key].template ?? '' : '';
+            return result;
+        }, {});
+    }
+    getActiveInputs() {
+        const formData = this.form?.controls.properties.value ?? {};
+        return objectKeys(formData).reduce((result, key) => {
+            const property = this.properties?.[key];
+            if (property) {
+                const value = formData[key];
+                const isString = typeof value === 'string';
+                const inputValue = isString ? `'${value}'` : `${JSON.stringify(value)}`;
+                if ((property.default ?? '') !== inputValue) {
+                    result[property.name] = inputValue;
+                }
+            }
+            return result;
+        }, {});
+    }
+    ngOnDestroy() {
+        this.unsubscribe$.next();
+        this.unsubscribe$.complete();
+    }
+};
+NgDocPlaygroundDemoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundDemoComponent, deps: [{ token: i1.NgDocRootPage }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+NgDocPlaygroundDemoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: NgDocPlaygroundDemoComponent, selector: "ng-doc-playground-demo", inputs: { id: "id", selector: "selector", configuration: "configuration", properties: "properties", recreateDemo: "recreateDemo", form: "form" }, viewQueries: [{ propertyName: "demoOutlet", first: true, predicate: ["demoOutlet"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-doc-demo-displayer [code]=\"(code | async) ?? ''\" [border]=\"false\" language=\"html\">\n\t<ng-container #demoOutlet></ng-container>\n</ng-doc-demo-displayer>\n", styles: [":host{display:block;border:var(--ng-doc-demo-displayer-border);border-radius:var(--ng-doc-demo-displayer-border-radius);overflow:hidden}:host:not(:last-child){border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}:host:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}\n"], dependencies: [{ kind: "component", type: i2.NgDocDemoDisplayerComponent, selector: "ng-doc-demo-displayer", inputs: ["codeContent", "code", "language", "container", "border", "expanded"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+NgDocPlaygroundDemoComponent = __decorate([
+    UntilDestroy(),
+    __metadata("design:paramtypes", [NgDocRootPage, Injector])
+], NgDocPlaygroundDemoComponent);
+export { NgDocPlaygroundDemoComponent };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundDemoComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-doc-playground-demo', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-doc-demo-displayer [code]=\"(code | async) ?? ''\" [border]=\"false\" language=\"html\">\n\t<ng-container #demoOutlet></ng-container>\n</ng-doc-demo-displayer>\n", styles: [":host{display:block;border:var(--ng-doc-demo-displayer-border);border-radius:var(--ng-doc-demo-displayer-border-radius);overflow:hidden}:host:not(:last-child){border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}:host:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.NgDocRootPage }, { type: i0.Injector }]; }, propDecorators: { id: [{
+                type: Input
+            }], selector: [{
+                type: Input
+            }], configuration: [{
+                type: Input
+            }], properties: [{
+                type: Input
+            }], recreateDemo: [{
+                type: Input
+            }], form: [{
+                type: Input
+            }], demoOutlet: [{
+                type: ViewChild,
+                args: ['demoOutlet', { static: true, read: ViewContainerRef }]
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC1kZW1vLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYXBwL2NvbXBvbmVudHMvcGxheWdyb3VuZC9wbGF5Z3JvdW5kLWRlbW8vcGxheWdyb3VuZC1kZW1vLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYXBwL2NvbXBvbmVudHMvcGxheWdyb3VuZC9wbGF5Z3JvdW5kLWRlbW8vcGxheWdyb3VuZC1kZW1vLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQ04sdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixTQUFTLEVBR1QsUUFBUSxFQUNSLEtBQUssRUFLTCxTQUFTLEVBQ1QsZ0JBQWdCLEdBQ2hCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBQyxTQUFTLEVBQUMsTUFBTSxnQkFBZ0IsQ0FBQztBQUN6QyxPQUFPLEVBQUMsYUFBYSxFQUFDLE1BQU0sK0JBQStCLENBQUM7QUFDNUQsT0FBTyxFQUFDLHNCQUFzQixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFFbkYsT0FBTyxFQUFDLDJCQUEyQixFQUFDLE1BQU0scURBQXFELENBQUM7QUFDaEcsT0FBTyxFQUFDLFVBQVUsRUFBQyxNQUFNLGtDQUFrQyxDQUFDO0FBQzVELE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUc1RCxPQUFPLEVBQUMsWUFBWSxFQUFFLGNBQWMsRUFBQyxNQUFNLHVCQUF1QixDQUFDO0FBQ25FLE9BQU8sRUFBYSxFQUFFLEVBQUUsT0FBTyxFQUFDLE1BQU0sTUFBTSxDQUFDO0FBQzdDLE9BQU8sRUFBQyxTQUFTLEVBQUMsTUFBTSxnQkFBZ0IsQ0FBQzs7Ozs7QUFZbEMsSUFBTSw0QkFBNEIsR0FBbEMsTUFBTSw0QkFBNEI7SUErQnhDLFlBQTZCLFFBQXVCLEVBQW1CLFFBQWtCO1FBQTVELGFBQVEsR0FBUixRQUFRLENBQWU7UUFBbUIsYUFBUSxHQUFSLFFBQVEsQ0FBVTtRQTNCekYsT0FBRSxHQUFXLEVBQUUsQ0FBQztRQUdoQixhQUFRLEdBQVcsRUFBRSxDQUFDO1FBU3RCLGlCQUFZLEdBQVksS0FBSyxDQUFDO1FBVTlCLFNBQUksR0FBdUIsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBR2pCLGlCQUFZLEdBQWtCLElBQUksT0FBTyxFQUFRLENBQUM7SUFFeUIsQ0FBQztJQUU3RixXQUFXLENBQUMsRUFBQyxJQUFJLEVBQUUsRUFBRSxFQUFnQjtRQUNwQyxJQUFJLElBQUksSUFBSSxFQUFFLEVBQUU7WUFDZixJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksRUFBRSxDQUFDO1lBRXpCLE1BQU0sWUFBWSxHQUFrRSxzQkFBc0IsQ0FDekcsSUFBSSxDQUFDLEVBQUUsQ0FDUCxDQUFDO1lBRUYsSUFBSSxZQUFZLEVBQUU7Z0JBQ2pCLE1BQU0sS0FBSyxHQUFzQyxJQUFJLENBQUMsUUFBUSxDQUFDLEdBQUcsQ0FBQyxZQUFZLEVBQUUsRUFBRSxDQUFDLENBQUM7Z0JBQ3JGLElBQUksQ0FBQyxjQUFjLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLElBQWdDLEVBQUUsRUFBRSxDQUFDLElBQUksQ0FBQyxRQUFRLEtBQUssSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO2FBQ3hHO1lBRUQsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1lBRWxCLElBQUksQ0FBQyxJQUFJLEVBQUUsWUFBWTtpQkFDckIsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLEVBQUUsY0FBYyxDQUFDLElBQUksQ0FBQyxDQUFDO2lCQUN4RCxTQUFTLENBQUMsQ0FBQyxJQUE2QyxFQUFFLEVBQUUsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7U0FDdEY7SUFDRixDQUFDO0lBRU8sVUFBVSxDQUFDLElBQThDO1FBQ2hFLElBQUksSUFBSSxDQUFDLFlBQVksSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDdkMsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1NBQ2xCO1FBRUQsSUFBSSxJQUFJLEVBQUU7WUFDVCxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsUUFBUSxDQUFDLFVBQVUsSUFBSSxFQUFFLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDO1lBQ3hFLE1BQU0sQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLE9BQU8sRUFBRSxRQUFRLENBQUMsT0FBTyxJQUFJLEVBQUUsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7WUFDbEUsSUFBSSxDQUFDLE9BQU8sRUFBRSxRQUFRLEVBQUUsZ0JBQWdCLEVBQUUsUUFBUSxDQUFDLEdBQUcsQ0FBQyxpQkFBaUIsQ0FBQyxFQUFFLFlBQVksRUFBRSxDQUFDO1NBQzFGO1FBRUQsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFTyxVQUFVO1FBQ2pCLElBQUksSUFBSSxDQUFDLGNBQWMsRUFBRTtZQUN4QixJQUFJLENBQUMsT0FBTyxFQUFFLE9BQU8sRUFBRSxDQUFDO1lBRXhCLElBQUksSUFBSSxDQUFDLGNBQWMsRUFBRTtnQkFDeEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsVUFBVSxFQUFFLGVBQWUsQ0FDOUMsSUFBSSxDQUFDLGNBQXNELENBQzNELENBQUM7YUFDRjtZQUVELElBQUksQ0FBQyxPQUFPLEVBQUUsaUJBQWlCLENBQUMsWUFBWSxFQUFFLENBQUM7U0FDL0M7SUFDRixDQUFDO0lBRU8sY0FBYztRQUNyQixNQUFNLFFBQVEsR0FBVywyQkFBMkIsQ0FDbkQsSUFBSSxDQUFDLGFBQWEsRUFBRSxRQUFRLElBQUksRUFBRSxFQUNsQyxJQUFJLENBQUMsUUFBUSxFQUNiLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxFQUN2QixJQUFJLENBQUMsZUFBZSxFQUFFLENBQ3RCLENBQUM7UUFFRixJQUFJLENBQUMsSUFBSSxHQUFHLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUNsQyxDQUFDO0lBRU8sZ0JBQWdCO1FBQ3ZCLE1BQU0sUUFBUSxHQUE2QixJQUFJLENBQUMsSUFBSSxFQUFFLFFBQVEsQ0FBQyxPQUFPLENBQUMsS0FBaUMsSUFBSSxFQUFFLENBQUM7UUFFL0csT0FBTyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsTUFBOEIsRUFBRSxHQUFXLEVBQUUsRUFBRTtZQUNsRixNQUFNLENBQUMsR0FBRyxDQUFDLEdBQUcsUUFBUSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsYUFBYSxFQUFFLE9BQU8sRUFBRSxDQUFDLEdBQUcsQ0FBQyxDQUFDLFFBQVEsSUFBSSxFQUFFLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztZQUVyRixPQUFPLE1BQU0sQ0FBQztRQUNmLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQztJQUNSLENBQUM7SUFFTyxlQUFlO1FBQ3RCLE1BQU0sUUFBUSxHQUNaLElBQUksQ0FBQyxJQUFJLEVBQUUsUUFBUSxDQUFDLFVBQVUsQ0FBQyxLQUE2QyxJQUFJLEVBQUUsQ0FBQztRQUVyRixPQUFPLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxNQUE4QixFQUFFLEdBQVcsRUFBRSxFQUFFO1lBQ2xGLE1BQU0sUUFBUSxHQUF3QyxJQUFJLENBQUMsVUFBVSxFQUFFLENBQUMsR0FBRyxDQUFDLENBQUM7WUFFN0UsSUFBSSxRQUFRLEVBQUU7Z0JBQ2IsTUFBTSxLQUFLLEdBQXdCLFFBQVEsQ0FBQyxHQUFHLENBQUMsQ0FBQztnQkFDakQsTUFBTSxRQUFRLEdBQVksT0FBTyxLQUFLLEtBQUssUUFBUSxDQUFDO2dCQUNwRCxNQUFNLFVBQVUsR0FBVyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksS0FBSyxHQUFHLENBQUMsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUFDO2dCQUVoRixJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sSUFBSSxFQUFFLENBQUMsS0FBSyxVQUFVLEVBQUU7b0JBQzVDLE1BQU0sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEdBQUcsVUFBVSxDQUFDO2lCQUNuQzthQUNEO1lBRUQsT0FBTyxNQUFNLENBQUM7UUFDZixDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFDUixDQUFDO0lBRUQsV0FBVztRQUNWLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDekIsSUFBSSxDQUFDLFlBQVksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUM5QixDQUFDOzt5SEEvSFcsNEJBQTRCOzZHQUE1Qiw0QkFBNEIscVNBcUJNLGdCQUFnQixnRUMzRC9ELHVLQUdBO0FEbUNhLDRCQUE0QjtJQUR4QyxZQUFZLEVBQUU7cUNBZ0N5QixhQUFhLEVBQTZCLFFBQVE7R0EvQjdFLDRCQUE0QixDQWdJeEM7U0FoSVksNEJBQTRCOzJGQUE1Qiw0QkFBNEI7a0JBUHhDLFNBQVM7K0JBQ0Msd0JBQXdCLG1CQUdqQix1QkFBdUIsQ0FBQyxNQUFNOzJIQU8vQyxFQUFFO3NCQURELEtBQUs7Z0JBSU4sUUFBUTtzQkFEUCxLQUFLO2dCQUlOLGFBQWE7c0JBRFosS0FBSztnQkFJTixVQUFVO3NCQURULEtBQUs7Z0JBSU4sWUFBWTtzQkFEWCxLQUFLO2dCQUlOLElBQUk7c0JBREgsS0FBSztnQkFJTixVQUFVO3NCQURULFNBQVM7dUJBQUMsWUFBWSxFQUFFLEVBQUMsTUFBTSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsZ0JBQWdCLEVBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuXHRDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcblx0Q2hhbmdlRGV0ZWN0b3JSZWYsXG5cdENvbXBvbmVudCxcblx0Q29tcG9uZW50UmVmLFxuXHRJbmplY3Rpb25Ub2tlbixcblx0SW5qZWN0b3IsXG5cdElucHV0LFxuXHRPbkNoYW5nZXMsXG5cdE9uRGVzdHJveSxcblx0U2ltcGxlQ2hhbmdlcyxcblx0VHlwZSxcblx0Vmlld0NoaWxkLFxuXHRWaWV3Q29udGFpbmVyUmVmLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7Rm9ybUdyb3VwfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQge05nRG9jUm9vdFBhZ2V9IGZyb20gJ0BuZy1kb2MvYXBwL2NsYXNzZXMvcm9vdC1wYWdlJztcbmltcG9ydCB7Z2V0UGxheWdyb3VuZERlbW9Ub2tlbn0gZnJvbSAnQG5nLWRvYy9hcHAvaGVscGVycy9wcm92aWRlLXBsYXlncm91bmQtZGVtbyc7XG5pbXBvcnQge05nRG9jRm9ybVBhcnRpYWxWYWx1ZX0gZnJvbSAnQG5nLWRvYy9hcHAvdHlwZXMnO1xuaW1wb3J0IHtidWlsZFBsYXlncm91bmREZW1vVGVtcGxhdGV9IGZyb20gJ0BuZy1kb2MvY29yZS9oZWxwZXJzL2J1aWxkLXBsYXlncm91bmQtZGVtby10ZW1wbGF0ZSc7XG5pbXBvcnQge2Zvcm1hdEh0bWx9IGZyb20gJ0BuZy1kb2MvY29yZS9oZWxwZXJzL2Zvcm1hdC1odG1sJztcbmltcG9ydCB7b2JqZWN0S2V5c30gZnJvbSAnQG5nLWRvYy9jb3JlL2hlbHBlcnMvb2JqZWN0LWtleXMnO1xuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRDb25maWcsIE5nRG9jUGxheWdyb3VuZFByb3BlcnRpZXMsIE5nRG9jUGxheWdyb3VuZFByb3BlcnR5fSBmcm9tICdAbmctZG9jL2NvcmUvaW50ZXJmYWNlcyc7XG5pbXBvcnQge05nRG9jRXh0cmFjdGVkVmFsdWV9IGZyb20gJ0BuZy1kb2MvY29yZS90eXBlcyc7XG5pbXBvcnQge1VudGlsRGVzdHJveSwgdW50aWxEZXN0cm95ZWR9IGZyb20gJ0BuZ25lYXQvdW50aWwtZGVzdHJveSc7XG5pbXBvcnQge09ic2VydmFibGUsIG9mLCBTdWJqZWN0fSBmcm9tICdyeGpzJztcbmltcG9ydCB7dGFrZVVudGlsfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5cbmltcG9ydCB7TmdEb2NCYXNlUGxheWdyb3VuZH0gZnJvbSAnLi4vYmFzZS1wbGF5Z3JvdW5kJztcbmltcG9ydCB7TmdEb2NQbGF5Z3JvdW5kRm9ybX0gZnJvbSAnLi4vcGxheWdyb3VuZC1mb3JtJztcblxuQENvbXBvbmVudCh7XG5cdHNlbGVjdG9yOiAnbmctZG9jLXBsYXlncm91bmQtZGVtbycsXG5cdHRlbXBsYXRlVXJsOiAnLi9wbGF5Z3JvdW5kLWRlbW8uY29tcG9uZW50Lmh0bWwnLFxuXHRzdHlsZVVybHM6IFsnLi9wbGF5Z3JvdW5kLWRlbW8uY29tcG9uZW50LnNjc3MnXSxcblx0Y2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuQFVudGlsRGVzdHJveSgpXG5leHBvcnQgY2xhc3MgTmdEb2NQbGF5Z3JvdW5kRGVtb0NvbXBvbmVudDxUIGV4dGVuZHMgTmdEb2NQbGF5Z3JvdW5kUHJvcGVydGllcyA9IE5nRG9jUGxheWdyb3VuZFByb3BlcnRpZXM+XG5cdGltcGxlbWVudHMgT25DaGFuZ2VzLCBPbkRlc3Ryb3lcbntcblx0QElucHV0KClcblx0aWQ6IHN0cmluZyA9ICcnO1xuXG5cdEBJbnB1dCgpXG5cdHNlbGVjdG9yOiBzdHJpbmcgPSAnJztcblxuXHRASW5wdXQoKVxuXHRjb25maWd1cmF0aW9uPzogTmdEb2NQbGF5Z3JvdW5kQ29uZmlnO1xuXG5cdEBJbnB1dCgpXG5cdHByb3BlcnRpZXM/OiBUO1xuXG5cdEBJbnB1dCgpXG5cdHJlY3JlYXRlRGVtbzogYm9vbGVhbiA9IGZhbHNlO1xuXG5cdEBJbnB1dCgpXG5cdGZvcm0hOiBGb3JtR3JvdXA8TmdEb2NQbGF5Z3JvdW5kRm9ybT47XG5cblx0QFZpZXdDaGlsZCgnZGVtb091dGxldCcsIHtzdGF0aWM6IHRydWUsIHJlYWQ6IFZpZXdDb250YWluZXJSZWZ9KVxuXHRkZW1vT3V0bGV0PzogVmlld0NvbnRhaW5lclJlZjtcblxuXHRwbGF5Z3JvdW5kRGVtbz86IHR5cGVvZiBOZ0RvY0Jhc2VQbGF5Z3JvdW5kO1xuXG5cdGNvZGU6IE9ic2VydmFibGU8c3RyaW5nPiA9IG9mKCcnKTtcblxuXHRwcml2YXRlIGRlbW9SZWY/OiBDb21wb25lbnRSZWY8TmdEb2NCYXNlUGxheWdyb3VuZD47XG5cdHByaXZhdGUgcmVhZG9ubHkgdW5zdWJzY3JpYmUkOiBTdWJqZWN0PHZvaWQ+ID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcblxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIHJlYWRvbmx5IHJvb3RQYWdlOiBOZ0RvY1Jvb3RQYWdlLCBwcml2YXRlIHJlYWRvbmx5IGluamVjdG9yOiBJbmplY3Rvcikge31cblxuXHRuZ09uQ2hhbmdlcyh7Zm9ybSwgaWR9OiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG5cdFx0aWYgKGZvcm0gJiYgaWQpIHtcblx0XHRcdHRoaXMudW5zdWJzY3JpYmUkLm5leHQoKTtcblxuXHRcdFx0Y29uc3QgZGVtb0luamVjdG9yOiBJbmplY3Rpb25Ub2tlbjxBcnJheTx0eXBlb2YgTmdEb2NCYXNlUGxheWdyb3VuZD4+IHwgdW5kZWZpbmVkID0gZ2V0UGxheWdyb3VuZERlbW9Ub2tlbihcblx0XHRcdFx0dGhpcy5pZCxcblx0XHRcdCk7XG5cblx0XHRcdGlmIChkZW1vSW5qZWN0b3IpIHtcblx0XHRcdFx0Y29uc3QgZGVtb3M6IEFycmF5PHR5cGVvZiBOZ0RvY0Jhc2VQbGF5Z3JvdW5kPiA9IHRoaXMuaW5qZWN0b3IuZ2V0KGRlbW9JbmplY3RvciwgW10pO1xuXHRcdFx0XHR0aGlzLnBsYXlncm91bmREZW1vID0gZGVtb3MuZmluZCgoZGVtbzogdHlwZW9mIE5nRG9jQmFzZVBsYXlncm91bmQpID0+IGRlbW8uc2VsZWN0b3IgPT09IHRoaXMuc2VsZWN0b3IpO1xuXHRcdFx0fVxuXG5cdFx0XHR0aGlzLnVwZGF0ZURlbW8oKTtcblxuXHRcdFx0dGhpcy5mb3JtPy52YWx1ZUNoYW5nZXNcblx0XHRcdFx0LnBpcGUodGFrZVVudGlsKHRoaXMudW5zdWJzY3JpYmUkKSwgdW50aWxEZXN0cm95ZWQodGhpcykpXG5cdFx0XHRcdC5zdWJzY3JpYmUoKGRhdGE6IE5nRG9jRm9ybVBhcnRpYWxWYWx1ZTx0eXBlb2YgdGhpcy5mb3JtPikgPT4gdGhpcy51cGRhdGVEZW1vKGRhdGEpKTtcblx0XHR9XG5cdH1cblxuXHRwcml2YXRlIHVwZGF0ZURlbW8oZGF0YT86IE5nRG9jRm9ybVBhcnRpYWxWYWx1ZTx0eXBlb2YgdGhpcy5mb3JtPik6IHZvaWQge1xuXHRcdGlmICh0aGlzLnJlY3JlYXRlRGVtbyB8fCAhdGhpcy5kZW1vUmVmKSB7XG5cdFx0XHR0aGlzLnJlbmRlckRlbW8oKTtcblx0XHR9XG5cblx0XHRpZiAoZGF0YSkge1xuXHRcdFx0T2JqZWN0LmFzc2lnbih0aGlzLmRlbW9SZWY/Lmluc3RhbmNlLnBsYXlncm91bmQgPz8ge30sIGRhdGEucHJvcGVydGllcyk7XG5cdFx0XHRPYmplY3QuYXNzaWduKHRoaXMuZGVtb1JlZj8uaW5zdGFuY2UuY29udGVudCA/PyB7fSwgZGF0YS5jb250ZW50KTtcblx0XHRcdHRoaXMuZGVtb1JlZj8uaW5zdGFuY2U/LnZpZXdDb250YWluZXJSZWY/LmluamVjdG9yLmdldChDaGFuZ2VEZXRlY3RvclJlZik/Lm1hcmtGb3JDaGVjaygpO1xuXHRcdH1cblxuXHRcdHRoaXMudXBkYXRlQ29kZVZpZXcoKTtcblx0fVxuXG5cdHByaXZhdGUgcmVuZGVyRGVtbygpOiB2b2lkIHtcblx0XHRpZiAodGhpcy5wbGF5Z3JvdW5kRGVtbykge1xuXHRcdFx0dGhpcy5kZW1vUmVmPy5kZXN0cm95KCk7XG5cblx0XHRcdGlmICh0aGlzLnBsYXlncm91bmREZW1vKSB7XG5cdFx0XHRcdHRoaXMuZGVtb1JlZiA9IHRoaXMuZGVtb091dGxldD8uY3JlYXRlQ29tcG9uZW50KFxuXHRcdFx0XHRcdHRoaXMucGxheWdyb3VuZERlbW8gYXMgdW5rbm93biBhcyBUeXBlPE5nRG9jQmFzZVBsYXlncm91bmQ+LFxuXHRcdFx0XHQpO1xuXHRcdFx0fVxuXG5cdFx0XHR0aGlzLmRlbW9SZWY/LmNoYW5nZURldGVjdG9yUmVmLm1hcmtGb3JDaGVjaygpO1xuXHRcdH1cblx0fVxuXG5cdHByaXZhdGUgdXBkYXRlQ29kZVZpZXcoKTogdm9pZCB7XG5cdFx0Y29uc3QgdGVtcGxhdGU6IHN0cmluZyA9IGJ1aWxkUGxheWdyb3VuZERlbW9UZW1wbGF0ZShcblx0XHRcdHRoaXMuY29uZmlndXJhdGlvbj8udGVtcGxhdGUgPz8gJycsXG5cdFx0XHR0aGlzLnNlbGVjdG9yLFxuXHRcdFx0dGhpcy5nZXRBY3RpdmVDb250ZW50KCksXG5cdFx0XHR0aGlzLmdldEFjdGl2ZUlucHV0cygpLFxuXHRcdCk7XG5cblx0XHR0aGlzLmNvZGUgPSBmb3JtYXRIdG1sKHRlbXBsYXRlKTtcblx0fVxuXG5cdHByaXZhdGUgZ2V0QWN0aXZlQ29udGVudCgpOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+IHtcblx0XHRjb25zdCBmb3JtRGF0YTogUmVjb3JkPHN0cmluZywgYm9vbGVhbj4gPSAodGhpcy5mb3JtPy5jb250cm9scy5jb250ZW50LnZhbHVlIGFzIFJlY29yZDxzdHJpbmcsIGJvb2xlYW4+KSA/PyB7fTtcblxuXHRcdHJldHVybiBvYmplY3RLZXlzKGZvcm1EYXRhKS5yZWR1Y2UoKHJlc3VsdDogUmVjb3JkPHN0cmluZywgc3RyaW5nPiwga2V5OiBzdHJpbmcpID0+IHtcblx0XHRcdHJlc3VsdFtrZXldID0gZm9ybURhdGFba2V5XSA/IHRoaXMuY29uZmlndXJhdGlvbj8uY29udGVudD8uW2tleV0udGVtcGxhdGUgPz8gJycgOiAnJztcblxuXHRcdFx0cmV0dXJuIHJlc3VsdDtcblx0XHR9LCB7fSk7XG5cdH1cblxuXHRwcml2YXRlIGdldEFjdGl2ZUlucHV0cygpOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+IHtcblx0XHRjb25zdCBmb3JtRGF0YTogUmVjb3JkPHN0cmluZywgTmdEb2NFeHRyYWN0ZWRWYWx1ZT4gPVxuXHRcdFx0KHRoaXMuZm9ybT8uY29udHJvbHMucHJvcGVydGllcy52YWx1ZSBhcyBSZWNvcmQ8c3RyaW5nLCBOZ0RvY0V4dHJhY3RlZFZhbHVlPikgPz8ge307XG5cblx0XHRyZXR1cm4gb2JqZWN0S2V5cyhmb3JtRGF0YSkucmVkdWNlKChyZXN1bHQ6IFJlY29yZDxzdHJpbmcsIHN0cmluZz4sIGtleTogc3RyaW5nKSA9PiB7XG5cdFx0XHRjb25zdCBwcm9wZXJ0eTogTmdEb2NQbGF5Z3JvdW5kUHJvcGVydHkgfCB1bmRlZmluZWQgPSB0aGlzLnByb3BlcnRpZXM/LltrZXldO1xuXG5cdFx0XHRpZiAocHJvcGVydHkpIHtcblx0XHRcdFx0Y29uc3QgdmFsdWU6IE5nRG9jRXh0cmFjdGVkVmFsdWUgPSBmb3JtRGF0YVtrZXldO1xuXHRcdFx0XHRjb25zdCBpc1N0cmluZzogYm9vbGVhbiA9IHR5cGVvZiB2YWx1ZSA9PT0gJ3N0cmluZyc7XG5cdFx0XHRcdGNvbnN0IGlucHV0VmFsdWU6IHN0cmluZyA9IGlzU3RyaW5nID8gYCcke3ZhbHVlfSdgIDogYCR7SlNPTi5zdHJpbmdpZnkodmFsdWUpfWA7XG5cblx0XHRcdFx0aWYgKChwcm9wZXJ0eS5kZWZhdWx0ID8/ICcnKSAhPT0gaW5wdXRWYWx1ZSkge1xuXHRcdFx0XHRcdHJlc3VsdFtwcm9wZXJ0eS5uYW1lXSA9IGlucHV0VmFsdWU7XG5cdFx0XHRcdH1cblx0XHRcdH1cblxuXHRcdFx0cmV0dXJuIHJlc3VsdDtcblx0XHR9LCB7fSk7XG5cdH1cblxuXHRuZ09uRGVzdHJveSgpOiB2b2lkIHtcblx0XHR0aGlzLnVuc3Vic2NyaWJlJC5uZXh0KCk7XG5cdFx0dGhpcy51bnN1YnNjcmliZSQuY29tcGxldGUoKTtcblx0fVxufVxuIiwiPG5nLWRvYy1kZW1vLWRpc3BsYXllciBbY29kZV09XCIoY29kZSB8IGFzeW5jKSA/PyAnJ1wiIFtib3JkZXJdPVwiZmFsc2VcIiBsYW5ndWFnZT1cImh0bWxcIj5cblx0PG5nLWNvbnRhaW5lciAjZGVtb091dGxldD48L25nLWNvbnRhaW5lcj5cbjwvbmctZG9jLWRlbW8tZGlzcGxheWVyPlxuIl19

package/esm2020/components/playground/playground-form.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC1mb3JtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9hcHAvY29tcG9uZW50cy9wbGF5Z3JvdW5kL3BsYXlncm91bmQtZm9ybS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtGb3JtQ29udHJvbCwgRm9ybUdyb3VwfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQge05nRG9jRXh0cmFjdGVkVmFsdWV9IGZyb20gJ0BuZy1kb2MvY29yZS90eXBlcyc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTmdEb2NQbGF5Z3JvdW5kRm9ybSB7XG5cdHByb3BlcnRpZXM6IEZvcm1Hcm91cDxSZWNvcmQ8c3RyaW5nLCBGb3JtQ29udHJvbDxOZ0RvY0V4dHJhY3RlZFZhbHVlPj4+O1xuXHRjb250ZW50OiBGb3JtR3JvdXA8UmVjb3JkPHN0cmluZywgRm9ybUNvbnRyb2w8Ym9vbGVhbj4+Pjtcbn1cbiJdfQ==

package/esm2020/components/playground/playground-properties/playground-properties.component.mjs

@@ -0,0 +1,42 @@
+import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+import { pluck } from 'rxjs/operators';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/cdk/layout";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@ng-doc/ui-kit";
+import * as i5 from "../playground-property/playground-property.component";
+export class NgDocPlaygroundPropertiesComponent {
+    constructor(breakpointObserver) {
+        this.breakpointObserver = breakpointObserver;
+        this.recreateDemo = false;
+        this.recreateDemoChange = new EventEmitter();
+        this.resetForm = new EventEmitter();
+        this.breakpoints = [Breakpoints.XSmall];
+        this.observer = this.breakpointObserver.observe(this.breakpoints).pipe(pluck('matches'));
+    }
+    getFormControl(controlType, key) {
+        return this.form.get(controlType)?.get(key);
+    }
+}
+NgDocPlaygroundPropertiesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundPropertiesComponent, deps: [{ token: i1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
+NgDocPlaygroundPropertiesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: NgDocPlaygroundPropertiesComponent, selector: "ng-doc-playground-properties", inputs: { form: "form", properties: "properties", dynamicContent: "dynamicContent", recreateDemo: "recreateDemo" }, outputs: { recreateDemoChange: "recreateDemoChange", resetForm: "resetForm" }, ngImport: i0, template: "<div class=\"ng-doc-playground-properties-wrapper\" [class.vertical]=\"observer | async\">\n\t<div class=\"ng-doc-playground-demos\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"ng-doc-playground-properties\">\n\t\t<div class=\"ng-doc-playground-header\">\n\t\t\t<h4 ng-doc-text>Playground</h4>\n\t\t\t<button ng-doc-button color=\"red\" (click)=\"resetForm.emit()\">Reset</button>\n\t\t</div>\n\t\t<div class=\"ng-doc-playground-setting\">\n\t\t\t<ng-doc-checkbox [(ngModel)]=\"recreateDemo\" (ngModelChange)=\"recreateDemoChange.emit($event)\">\n\t\t\t\t<span\n\t\t\t\t\tng-doc-text\n\t\t\t\t\t[ngDocTooltip]=\"'Recreates demo everytime\\none of the input has changed'\"\n\t\t\t\t\t[positions]=\"['bottom-right', 'left-center']\"\n\t\t\t\t>\n\t\t\t\t\tRecreate\n\t\t\t\t\t<ng-doc-icon icon=\"info\" ngDocTextRight></ng-doc-icon>\n\t\t\t\t</span>\n\t\t\t</ng-doc-checkbox>\n\t\t</div>\n\t\t<div class=\"ng-doc-playground-divider\"></div>\n\t\t<ng-container *ngIf=\"(properties | keyvalue)?.length\">\n\t\t\t<h5 class=\"ng-doc-title\" ng-doc-text>Settings</h5>\n\t\t\t<ng-doc-playground-property\n\t\t\t\t*ngFor=\"let property of properties | keyvalue\"\n\t\t\t\t[name]=\"property.value.name\"\n\t\t\t\t[property]=\"property.value\"\n\t\t\t\t[control]=\"getFormControl('properties', property.key)\"\n\t\t\t>\n\t\t\t</ng-doc-playground-property>\n\t\t</ng-container>\n\n\t\t<ng-container *ngIf=\"(dynamicContent | keyvalue)?.length\">\n\t\t\t<h5 class=\"ng-doc-title\" ng-doc-text>Content</h5>\n\t\t\t<ng-doc-playground-property\n\t\t\t\t*ngFor=\"let content of dynamicContent | keyvalue\"\n\t\t\t\t[name]=\"content.value.label\"\n\t\t\t\t[property]=\"content.value\"\n\t\t\t\t[control]=\"getFormControl('content', content.key)\"\n\t\t\t>\n\t\t\t</ng-doc-playground-property>\n\t\t</ng-container>\n\t</div>\n</div>\n", styles: [":host .ng-doc-playground-properties-wrapper{position:relative;display:flex}:host .ng-doc-playground-properties-wrapper.vertical{flex-direction:column}:host .ng-doc-playground-properties-wrapper.vertical .ng-doc-playground-demos{margin-right:0;margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper.vertical .ng-doc-playground-properties{width:100%}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-demos{display:flex;flex-direction:column;width:100%;overflow:hidden;margin-right:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties{flex-shrink:0;width:300px;padding:calc(var(--ng-doc-base-gutter) * 2) calc(var(--ng-doc-base-gutter) * 3);background-color:var(--ng-doc-base-1);border-radius:var(--ng-doc-base-gutter)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties ng-doc-playground-property:not(:last-child){margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-controls{display:flex;justify-content:flex-end}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-header{display:flex;align-items:center;justify-content:space-between;height:40px;margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-header h4{margin:0}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-setting{display:flex;flex-direction:column}:host .ng-doc-playground-properties-wrapper .ng-doc-title{margin-top:0;margin-bottom:calc(var(--ng-doc-base-gutter) + var(--ng-doc-base-gutter) / 2)}:host .ng-doc-playground-divider{margin:calc(var(--ng-doc-base-gutter) * 2) 0;height:1px;background-color:var(--ng-doc-base-2)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgDocTooltipDirective, selector: "[ngDocTooltip]", inputs: ["ngDocTooltip", "delay", "displayOrigin", "pointerOrigin", "positions", "canOpen", "panelClass", "minHeight", "maxHeight", "height", "minWidth", "maxWidth", "width"], outputs: ["beforeOpen", "afterOpen", "beforeClose", "afterClose"], exportAs: ["ngDocTooltip"] }, { kind: "component", type: i4.NgDocIconComponent, selector: "ng-doc-icon", inputs: ["icon", "size"] }, { kind: "component", type: i4.NgDocTextComponent, selector: "[ng-doc-text]", inputs: ["size", "color", "align", "absoluteContent"] }, { kind: "directive", type: i4.NgDocTextRightDirective, selector: "[ngDocTextRight]" }, { kind: "component", type: i4.NgDocCheckboxComponent, selector: "ng-doc-checkbox", inputs: ["color"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgDocButtonComponent, selector: "button[ng-doc-button], a[ng-doc-button], button[ng-doc-button-flat], a[ng-doc-button-flat], button[ng-doc-button-text], a[ng-doc-button-text]", inputs: ["size", "color", "rounded"] }, { kind: "component", type: i5.NgDocPlaygroundPropertyComponent, selector: "ng-doc-playground-property", inputs: ["name", "property", "control"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundPropertiesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-doc-playground-properties', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ng-doc-playground-properties-wrapper\" [class.vertical]=\"observer | async\">\n\t<div class=\"ng-doc-playground-demos\">\n\t\t<ng-content></ng-content>\n\t</div>\n\t<div class=\"ng-doc-playground-properties\">\n\t\t<div class=\"ng-doc-playground-header\">\n\t\t\t<h4 ng-doc-text>Playground</h4>\n\t\t\t<button ng-doc-button color=\"red\" (click)=\"resetForm.emit()\">Reset</button>\n\t\t</div>\n\t\t<div class=\"ng-doc-playground-setting\">\n\t\t\t<ng-doc-checkbox [(ngModel)]=\"recreateDemo\" (ngModelChange)=\"recreateDemoChange.emit($event)\">\n\t\t\t\t<span\n\t\t\t\t\tng-doc-text\n\t\t\t\t\t[ngDocTooltip]=\"'Recreates demo everytime\\none of the input has changed'\"\n\t\t\t\t\t[positions]=\"['bottom-right', 'left-center']\"\n\t\t\t\t>\n\t\t\t\t\tRecreate\n\t\t\t\t\t<ng-doc-icon icon=\"info\" ngDocTextRight></ng-doc-icon>\n\t\t\t\t</span>\n\t\t\t</ng-doc-checkbox>\n\t\t</div>\n\t\t<div class=\"ng-doc-playground-divider\"></div>\n\t\t<ng-container *ngIf=\"(properties | keyvalue)?.length\">\n\t\t\t<h5 class=\"ng-doc-title\" ng-doc-text>Settings</h5>\n\t\t\t<ng-doc-playground-property\n\t\t\t\t*ngFor=\"let property of properties | keyvalue\"\n\t\t\t\t[name]=\"property.value.name\"\n\t\t\t\t[property]=\"property.value\"\n\t\t\t\t[control]=\"getFormControl('properties', property.key)\"\n\t\t\t>\n\t\t\t</ng-doc-playground-property>\n\t\t</ng-container>\n\n\t\t<ng-container *ngIf=\"(dynamicContent | keyvalue)?.length\">\n\t\t\t<h5 class=\"ng-doc-title\" ng-doc-text>Content</h5>\n\t\t\t<ng-doc-playground-property\n\t\t\t\t*ngFor=\"let content of dynamicContent | keyvalue\"\n\t\t\t\t[name]=\"content.value.label\"\n\t\t\t\t[property]=\"content.value\"\n\t\t\t\t[control]=\"getFormControl('content', content.key)\"\n\t\t\t>\n\t\t\t</ng-doc-playground-property>\n\t\t</ng-container>\n\t</div>\n</div>\n", styles: [":host .ng-doc-playground-properties-wrapper{position:relative;display:flex}:host .ng-doc-playground-properties-wrapper.vertical{flex-direction:column}:host .ng-doc-playground-properties-wrapper.vertical .ng-doc-playground-demos{margin-right:0;margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper.vertical .ng-doc-playground-properties{width:100%}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-demos{display:flex;flex-direction:column;width:100%;overflow:hidden;margin-right:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties{flex-shrink:0;width:300px;padding:calc(var(--ng-doc-base-gutter) * 2) calc(var(--ng-doc-base-gutter) * 3);background-color:var(--ng-doc-base-1);border-radius:var(--ng-doc-base-gutter)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties ng-doc-playground-property:not(:last-child){margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-controls{display:flex;justify-content:flex-end}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-header{display:flex;align-items:center;justify-content:space-between;height:40px;margin-bottom:calc(var(--ng-doc-base-gutter) * 2)}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-header h4{margin:0}:host .ng-doc-playground-properties-wrapper .ng-doc-playground-properties .ng-doc-playground-setting{display:flex;flex-direction:column}:host .ng-doc-playground-properties-wrapper .ng-doc-title{margin-top:0;margin-bottom:calc(var(--ng-doc-base-gutter) + var(--ng-doc-base-gutter) / 2)}:host .ng-doc-playground-divider{margin:calc(var(--ng-doc-base-gutter) * 2) 0;height:1px;background-color:var(--ng-doc-base-2)}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.BreakpointObserver }]; }, propDecorators: { form: [{
+                type: Input
+            }], properties: [{
+                type: Input
+            }], dynamicContent: [{
+                type: Input
+            }], recreateDemo: [{
+                type: Input
+            }], recreateDemoChange: [{
+                type: Output
+            }], resetForm: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC1wcm9wZXJ0aWVzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYXBwL2NvbXBvbmVudHMvcGxheWdyb3VuZC9wbGF5Z3JvdW5kLXByb3BlcnRpZXMvcGxheWdyb3VuZC1wcm9wZXJ0aWVzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYXBwL2NvbXBvbmVudHMvcGxheWdyb3VuZC9wbGF5Z3JvdW5kLXByb3BlcnRpZXMvcGxheWdyb3VuZC1wcm9wZXJ0aWVzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxrQkFBa0IsRUFBRSxXQUFXLEVBQUMsTUFBTSxxQkFBcUIsQ0FBQztBQUNwRSxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQzlGLE9BQU8sRUFBYyxTQUFTLEVBQUMsTUFBTSxnQkFBZ0IsQ0FBQztBQUd0RCxPQUFPLEVBQUMsS0FBSyxFQUFDLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFVckMsTUFBTSxPQUFPLGtDQUFrQztJQXlCOUMsWUFBK0Isa0JBQXNDO1FBQXRDLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFYckUsaUJBQVksR0FBWSxLQUFLLENBQUM7UUFHOUIsdUJBQWtCLEdBQTBCLElBQUksWUFBWSxFQUFXLENBQUM7UUFHeEUsY0FBUyxHQUF1QixJQUFJLFlBQVksRUFBUSxDQUFDO1FBRWhELGdCQUFXLEdBQWEsQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDN0MsYUFBUSxHQUF3QixJQUFJLENBQUMsa0JBQWtCLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUM7SUFFMUMsQ0FBQztJQUV6RSxjQUFjLENBQUMsV0FBNEMsRUFBRSxHQUFXO1FBQ3ZFLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFDLEVBQUUsR0FBRyxDQUFDLEdBQUcsQ0FBZ0IsQ0FBQztJQUM1RCxDQUFDOzsrSEE3Qlcsa0NBQWtDO21IQUFsQyxrQ0FBa0MsdVFDZi9DLHN5REE2Q0E7MkZEOUJhLGtDQUFrQztrQkFOOUMsU0FBUzsrQkFDQyw4QkFBOEIsbUJBR3ZCLHVCQUF1QixDQUFDLE1BQU07eUdBTy9DLElBQUk7c0JBREgsS0FBSztnQkFJTixVQUFVO3NCQURULEtBQUs7Z0JBSU4sY0FBYztzQkFEYixLQUFLO2dCQUlOLFlBQVk7c0JBRFgsS0FBSztnQkFJTixrQkFBa0I7c0JBRGpCLE1BQU07Z0JBSVAsU0FBUztzQkFEUixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtCcmVha3BvaW50T2JzZXJ2ZXIsIEJyZWFrcG9pbnRzfSBmcm9tICdAYW5ndWxhci9jZGsvbGF5b3V0JztcbmltcG9ydCB7Q2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7Rm9ybUNvbnRyb2wsIEZvcm1Hcm91cH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRDb250ZW50LCBOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzfSBmcm9tICdAbmctZG9jL2NvcmUvaW50ZXJmYWNlcyc7XG5pbXBvcnQge09ic2VydmFibGV9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHtwbHVja30gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuXG5pbXBvcnQge05nRG9jUGxheWdyb3VuZEZvcm19IGZyb20gJy4uL3BsYXlncm91bmQtZm9ybSc7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogJ25nLWRvYy1wbGF5Z3JvdW5kLXByb3BlcnRpZXMnLFxuXHR0ZW1wbGF0ZVVybDogJy4vcGxheWdyb3VuZC1wcm9wZXJ0aWVzLmNvbXBvbmVudC5odG1sJyxcblx0c3R5bGVVcmxzOiBbJy4vcGxheWdyb3VuZC1wcm9wZXJ0aWVzLmNvbXBvbmVudC5zY3NzJ10sXG5cdGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzQ29tcG9uZW50PFxuXHRQIGV4dGVuZHMgTmdEb2NQbGF5Z3JvdW5kUHJvcGVydGllcyxcblx0QyBleHRlbmRzIFJlY29yZDxzdHJpbmcsIE5nRG9jUGxheWdyb3VuZENvbnRlbnQ+LFxuPiB7XG5cdEBJbnB1dCgpXG5cdGZvcm0hOiBGb3JtR3JvdXA8TmdEb2NQbGF5Z3JvdW5kRm9ybT47XG5cblx0QElucHV0KClcblx0cHJvcGVydGllcz86IFA7XG5cblx0QElucHV0KClcblx0ZHluYW1pY0NvbnRlbnQ/OiBDO1xuXG5cdEBJbnB1dCgpXG5cdHJlY3JlYXRlRGVtbzogYm9vbGVhbiA9IGZhbHNlO1xuXG5cdEBPdXRwdXQoKVxuXHRyZWNyZWF0ZURlbW9DaGFuZ2U6IEV2ZW50RW1pdHRlcjxib29sZWFuPiA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuXHRAT3V0cHV0KClcblx0cmVzZXRGb3JtOiBFdmVudEVtaXR0ZXI8dm9pZD4gPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG5cblx0cmVhZG9ubHkgYnJlYWtwb2ludHM6IHN0cmluZ1tdID0gW0JyZWFrcG9pbnRzLlhTbWFsbF07XG5cdHJlYWRvbmx5IG9ic2VydmVyOiBPYnNlcnZhYmxlPGJvb2xlYW4+ID0gdGhpcy5icmVha3BvaW50T2JzZXJ2ZXIub2JzZXJ2ZSh0aGlzLmJyZWFrcG9pbnRzKS5waXBlKHBsdWNrKCdtYXRjaGVzJykpO1xuXG5cdGNvbnN0cnVjdG9yKHByb3RlY3RlZCByZWFkb25seSBicmVha3BvaW50T2JzZXJ2ZXI6IEJyZWFrcG9pbnRPYnNlcnZlcikge31cblxuXHRnZXRGb3JtQ29udHJvbChjb250cm9sVHlwZToga2V5b2YgdHlwZW9mIHRoaXMuZm9ybS5jb250cm9scywga2V5OiBzdHJpbmcpOiBGb3JtQ29udHJvbCB7XG5cdFx0cmV0dXJuIHRoaXMuZm9ybS5nZXQoY29udHJvbFR5cGUpPy5nZXQoa2V5KSBhcyBGb3JtQ29udHJvbDtcblx0fVxufVxuIiwiPGRpdiBjbGFzcz1cIm5nLWRvYy1wbGF5Z3JvdW5kLXByb3BlcnRpZXMtd3JhcHBlclwiIFtjbGFzcy52ZXJ0aWNhbF09XCJvYnNlcnZlciB8IGFzeW5jXCI+XG5cdDxkaXYgY2xhc3M9XCJuZy1kb2MtcGxheWdyb3VuZC1kZW1vc1wiPlxuXHRcdDxuZy1jb250ZW50PjwvbmctY29udGVudD5cblx0PC9kaXY+XG5cdDxkaXYgY2xhc3M9XCJuZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0aWVzXCI+XG5cdFx0PGRpdiBjbGFzcz1cIm5nLWRvYy1wbGF5Z3JvdW5kLWhlYWRlclwiPlxuXHRcdFx0PGg0IG5nLWRvYy10ZXh0PlBsYXlncm91bmQ8L2g0PlxuXHRcdFx0PGJ1dHRvbiBuZy1kb2MtYnV0dG9uIGNvbG9yPVwicmVkXCIgKGNsaWNrKT1cInJlc2V0Rm9ybS5lbWl0KClcIj5SZXNldDwvYnV0dG9uPlxuXHRcdDwvZGl2PlxuXHRcdDxkaXYgY2xhc3M9XCJuZy1kb2MtcGxheWdyb3VuZC1zZXR0aW5nXCI+XG5cdFx0XHQ8bmctZG9jLWNoZWNrYm94IFsobmdNb2RlbCldPVwicmVjcmVhdGVEZW1vXCIgKG5nTW9kZWxDaGFuZ2UpPVwicmVjcmVhdGVEZW1vQ2hhbmdlLmVtaXQoJGV2ZW50KVwiPlxuXHRcdFx0XHQ8c3BhblxuXHRcdFx0XHRcdG5nLWRvYy10ZXh0XG5cdFx0XHRcdFx0W25nRG9jVG9vbHRpcF09XCInUmVjcmVhdGVzIGRlbW8gZXZlcnl0aW1lXFxub25lIG9mIHRoZSBpbnB1dCBoYXMgY2hhbmdlZCdcIlxuXHRcdFx0XHRcdFtwb3NpdGlvbnNdPVwiWydib3R0b20tcmlnaHQnLCAnbGVmdC1jZW50ZXInXVwiXG5cdFx0XHRcdD5cblx0XHRcdFx0XHRSZWNyZWF0ZVxuXHRcdFx0XHRcdDxuZy1kb2MtaWNvbiBpY29uPVwiaW5mb1wiIG5nRG9jVGV4dFJpZ2h0PjwvbmctZG9jLWljb24+XG5cdFx0XHRcdDwvc3Bhbj5cblx0XHRcdDwvbmctZG9jLWNoZWNrYm94PlxuXHRcdDwvZGl2PlxuXHRcdDxkaXYgY2xhc3M9XCJuZy1kb2MtcGxheWdyb3VuZC1kaXZpZGVyXCI+PC9kaXY+XG5cdFx0PG5nLWNvbnRhaW5lciAqbmdJZj1cIihwcm9wZXJ0aWVzIHwga2V5dmFsdWUpPy5sZW5ndGhcIj5cblx0XHRcdDxoNSBjbGFzcz1cIm5nLWRvYy10aXRsZVwiIG5nLWRvYy10ZXh0PlNldHRpbmdzPC9oNT5cblx0XHRcdDxuZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0eVxuXHRcdFx0XHQqbmdGb3I9XCJsZXQgcHJvcGVydHkgb2YgcHJvcGVydGllcyB8IGtleXZhbHVlXCJcblx0XHRcdFx0W25hbWVdPVwicHJvcGVydHkudmFsdWUubmFtZVwiXG5cdFx0XHRcdFtwcm9wZXJ0eV09XCJwcm9wZXJ0eS52YWx1ZVwiXG5cdFx0XHRcdFtjb250cm9sXT1cImdldEZvcm1Db250cm9sKCdwcm9wZXJ0aWVzJywgcHJvcGVydHkua2V5KVwiXG5cdFx0XHQ+XG5cdFx0XHQ8L25nLWRvYy1wbGF5Z3JvdW5kLXByb3BlcnR5PlxuXHRcdDwvbmctY29udGFpbmVyPlxuXG5cdFx0PG5nLWNvbnRhaW5lciAqbmdJZj1cIihkeW5hbWljQ29udGVudCB8IGtleXZhbHVlKT8ubGVuZ3RoXCI+XG5cdFx0XHQ8aDUgY2xhc3M9XCJuZy1kb2MtdGl0bGVcIiBuZy1kb2MtdGV4dD5Db250ZW50PC9oNT5cblx0XHRcdDxuZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0eVxuXHRcdFx0XHQqbmdGb3I9XCJsZXQgY29udGVudCBvZiBkeW5hbWljQ29udGVudCB8IGtleXZhbHVlXCJcblx0XHRcdFx0W25hbWVdPVwiY29udGVudC52YWx1ZS5sYWJlbFwiXG5cdFx0XHRcdFtwcm9wZXJ0eV09XCJjb250ZW50LnZhbHVlXCJcblx0XHRcdFx0W2NvbnRyb2xdPVwiZ2V0Rm9ybUNvbnRyb2woJ2NvbnRlbnQnLCBjb250ZW50LmtleSlcIlxuXHRcdFx0PlxuXHRcdFx0PC9uZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0eT5cblx0XHQ8L25nLWNvbnRhaW5lcj5cblx0PC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/esm2020/components/playground/playground-property/playground-property.component.mjs

@@ -0,0 +1,89 @@
+import { ChangeDetectionStrategy, Component, HostBinding, Injector, Input, isDevMode, ViewChild, ViewContainerRef, } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { isPlaygroundProperty } from '@ng-doc/app/helpers/is-playground-property';
+import { getTokenForType } from '@ng-doc/app/helpers/provide-type-control';
+import { extractValueOrThrow } from '@ng-doc/core/helpers/extract-value';
+import * as i0 from "@angular/core";
+import * as i1 from "@ng-doc/ui-kit";
+export class NgDocPlaygroundPropertyComponent {
+    constructor(injector) {
+        this.injector = injector;
+        this.name = '';
+    }
+    ngOnChanges({ property, control }) {
+        if (property && this.property) {
+            this.propertyControl?.destroy();
+            this.propertyControl = undefined;
+            const type = isPlaygroundProperty(this.property) ? this.property.type : 'boolean';
+            const typeControl = this.getControlForType(type) ??
+                this.getControlForTypeAlias(isPlaygroundProperty(this.property) ? this.property.options : undefined);
+            if (typeControl && this.propertyOutlet) {
+                this.propertyControl = this.propertyOutlet.createComponent(typeControl.control);
+                this.propertyControl.instance.name = this.name;
+                this.propertyControl.instance.description = this.tooltipContent;
+                this.propertyControl.instance.options = isPlaygroundProperty(this.property)
+                    ? this.property.options
+                    : undefined;
+                this.propertyControl.instance.default = isPlaygroundProperty(this.property)
+                    ? this.property.default
+                    : undefined;
+                this.propertyControl.instance.writeValue(this.control?.value);
+                this.option = typeControl.options;
+            }
+            else if (isDevMode()) {
+                console.warn(`NgDocPlayground didn't find the control for the @Input "${this.name}", the type "${type}" was not recognized'`);
+            }
+        }
+        if (control) {
+            this.control?.registerOnChange((value) => this.propertyControl?.instance?.writeValue(value));
+            this.propertyControl?.instance.registerOnChange((value) => this.control?.setValue(value));
+            this.propertyControl?.instance.registerOnTouched(() => this.control?.markAsTouched());
+        }
+    }
+    get hasPropertyControl() {
+        return !!this.propertyControl;
+    }
+    get tooltipContent() {
+        return this.property && isPlaygroundProperty(this.property) ? this.property.description ?? '' : '';
+    }
+    getControlForType(type) {
+        const token = getTokenForType(type);
+        return token ? this.injector.get(token) : undefined;
+    }
+    getControlForTypeAlias(options) {
+        if (options && options.length) {
+            let optionsIsValid = true;
+            try {
+                // checking that all values are extractable
+                options.forEach((item) => extractValueOrThrow(item));
+            }
+            catch {
+                optionsIsValid = false;
+            }
+            if (optionsIsValid) {
+                const token = getTokenForType('NgDocTypeAlias');
+                return token ? this.injector.get(token) : undefined;
+            }
+        }
+        return undefined;
+    }
+}
+NgDocPlaygroundPropertyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundPropertyComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+NgDocPlaygroundPropertyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: NgDocPlaygroundPropertyComponent, selector: "ng-doc-playground-property", inputs: { name: "name", property: "property", control: "control" }, host: { properties: { "attr.data-has-property-control": "this.hasPropertyControl" } }, viewQueries: [{ propertyName: "propertyOutlet", first: true, predicate: ["propertyOutlet"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: "<label [ng-doc-label]=\"option?.hideLabel ? '' : labelContent\">\n\t<ng-template #labelContent>\n\t\t<span\n\t\t\t[ngDocTooltip]=\"tooltipContent\"\n\t\t\t[canOpen]=\"!!tooltipContent\"\n\t\t\t[positions]=\"['left-center', 'top-right', 'bottom-right']\"\n\t\t\t>{{ name }}</span\n\t\t>\n\t</ng-template>\n\t<ng-container #propertyOutlet></ng-container>\n</label>\n", styles: [":host{display:block}:host[data-has-property-control=false]{display:none}\n"], dependencies: [{ kind: "component", type: i1.NgDocLabelComponent, selector: "label[ng-doc-label]", inputs: ["ng-doc-label", "align"] }, { kind: "directive", type: i1.NgDocTooltipDirective, selector: "[ngDocTooltip]", inputs: ["ngDocTooltip", "delay", "displayOrigin", "pointerOrigin", "positions", "canOpen", "panelClass", "minHeight", "maxHeight", "height", "minWidth", "maxWidth", "width"], outputs: ["beforeOpen", "afterOpen", "beforeClose", "afterClose"], exportAs: ["ngDocTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundPropertyComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-doc-playground-property', changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [ng-doc-label]=\"option?.hideLabel ? '' : labelContent\">\n\t<ng-template #labelContent>\n\t\t<span\n\t\t\t[ngDocTooltip]=\"tooltipContent\"\n\t\t\t[canOpen]=\"!!tooltipContent\"\n\t\t\t[positions]=\"['left-center', 'top-right', 'bottom-right']\"\n\t\t\t>{{ name }}</span\n\t\t>\n\t</ng-template>\n\t<ng-container #propertyOutlet></ng-container>\n</label>\n", styles: [":host{display:block}:host[data-has-property-control=false]{display:none}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { name: [{
+                type: Input
+            }], property: [{
+                type: Input
+            }], control: [{
+                type: Input
+            }], propertyOutlet: [{
+                type: ViewChild,
+                args: ['propertyOutlet', { read: ViewContainerRef, static: true }]
+            }], hasPropertyControl: [{
+                type: HostBinding,
+                args: ['attr.data-has-property-control']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC1wcm9wZXJ0eS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC1wcm9wZXJ0eS9wbGF5Z3JvdW5kLXByb3BlcnR5LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvYXBwL2NvbXBvbmVudHMvcGxheWdyb3VuZC9wbGF5Z3JvdW5kLXByb3BlcnR5L3BsYXlncm91bmQtcHJvcGVydHkuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNOLHVCQUF1QixFQUN2QixTQUFTLEVBRVQsV0FBVyxFQUVYLFFBQVEsRUFDUixLQUFLLEVBQ0wsU0FBUyxFQUdULFNBQVMsRUFDVCxnQkFBZ0IsR0FDaEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLFdBQVcsRUFBQyxNQUFNLGdCQUFnQixDQUFDO0FBQzNDLE9BQU8sRUFBQyxvQkFBb0IsRUFBQyxNQUFNLDRDQUE0QyxDQUFDO0FBQ2hGLE9BQU8sRUFBQyxlQUFlLEVBQUMsTUFBTSwwQ0FBMEMsQ0FBQztBQUV6RSxPQUFPLEVBQUMsbUJBQW1CLEVBQUMsTUFBTSxvQ0FBb0MsQ0FBQzs7O0FBU3ZFLE1BQU0sT0FBTyxnQ0FBZ0M7SUFpQjVDLFlBQTZCLFFBQWtCO1FBQWxCLGFBQVEsR0FBUixRQUFRLENBQVU7UUFmL0MsU0FBSSxHQUFXLEVBQUUsQ0FBQztJQWVnQyxDQUFDO0lBRW5ELFdBQVcsQ0FBQyxFQUFDLFFBQVEsRUFBRSxPQUFPLEVBQWdCO1FBQzdDLElBQUksUUFBUSxJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDOUIsSUFBSSxDQUFDLGVBQWUsRUFBRSxPQUFPLEVBQUUsQ0FBQztZQUNoQyxJQUFJLENBQUMsZUFBZSxHQUFHLFNBQVMsQ0FBQztZQUVqQyxNQUFNLElBQUksR0FB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cmF0ZWd5LFxuXHRDb21wb25lbnQsXG5cdENvbXBvbmVudFJlZixcblx0SG9zdEJpbmRpbmcsXG5cdEluamVjdGlvblRva2VuLFxuXHRJbmplY3Rvcixcblx0SW5wdXQsXG5cdGlzRGV2TW9kZSxcblx0T25DaGFuZ2VzLFxuXHRTaW1wbGVDaGFuZ2VzLFxuXHRWaWV3Q2hpbGQsXG5cdFZpZXdDb250YWluZXJSZWYsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtGb3JtQ29udHJvbH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHtpc1BsYXlncm91bmRQcm9wZXJ0eX0gZnJvbSAnQG5nLWRvYy9hcHAvaGVscGVycy9pcy1wbGF5Z3JvdW5kLXByb3BlcnR5JztcbmltcG9ydCB7Z2V0VG9rZW5Gb3JUeXBlfSBmcm9tICdAbmctZG9jL2FwcC9oZWxwZXJzL3Byb3ZpZGUtdHlwZS1jb250cm9sJztcbmltcG9ydCB7TmdEb2NQcm92aWRlZFR5cGVDb250cm9sLCBOZ0RvY1R5cGVDb250cm9sLCBOZ0RvY1R5cGVDb250cm9sUHJvdmlkZXJPcHRpb25zfSBmcm9tICdAbmctZG9jL2FwcC9pbnRlcmZhY2VzJztcbmltcG9ydCB7ZXh0cmFjdFZhbHVlT3JUaHJvd30gZnJvbSAnQG5nLWRvYy9jb3JlL2hlbHBlcnMvZXh0cmFjdC12YWx1ZSc7XG5pbXBvcnQge05nRG9jUGxheWdyb3VuZENvbnRlbnQsIE5nRG9jUGxheWdyb3VuZFByb3BlcnR5fSBmcm9tICdAbmctZG9jL2NvcmUvaW50ZXJmYWNlcyc7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogJ25nLWRvYy1wbGF5Z3JvdW5kLXByb3BlcnR5Jyxcblx0dGVtcGxhdGVVcmw6ICcuL3BsYXlncm91bmQtcHJvcGVydHkuY29tcG9uZW50Lmh0bWwnLFxuXHRzdHlsZVVybHM6IFsnLi9wbGF5Z3JvdW5kLXByb3BlcnR5LmNvbXBvbmVudC5zY3NzJ10sXG5cdGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBOZ0RvY1BsYXlncm91bmRQcm9wZXJ0eUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG5cdEBJbnB1dCgpXG5cdG5hbWU6IHN0cmluZyA9ICcnO1xuXG5cdEBJbnB1dCgpXG5cdHByb3BlcnR5PzogTmdEb2NQbGF5Z3JvdW5kUHJvcGVydHkgfCBOZ0RvY1BsYXlncm91bmRDb250ZW50O1xuXG5cdEBJbnB1dCgpXG5cdGNvbnRyb2w/OiBGb3JtQ29udHJvbDtcblxuXHRAVmlld0NoaWxkKCdwcm9wZXJ0eU91dGxldCcsIHtyZWFkOiBWaWV3Q29udGFpbmVyUmVmLCBzdGF0aWM6IHRydWV9KVxuXHRwcm9wZXJ0eU91dGxldD86IFZpZXdDb250YWluZXJSZWY7XG5cblx0b3B0aW9uPzogTmdEb2NUeXBlQ29udHJvbFByb3ZpZGVyT3B0aW9ucztcblxuXHRwcml2YXRlIHByb3BlcnR5Q29udHJvbD86IENvbXBvbmVudFJlZjxOZ0RvY1R5cGVDb250cm9sPjtcblxuXHRjb25zdHJ1Y3Rvcihwcml2YXRlIHJlYWRvbmx5IGluamVjdG9yOiBJbmplY3Rvcikge31cblxuXHRuZ09uQ2hhbmdlcyh7cHJvcGVydHksIGNvbnRyb2x9OiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG5cdFx0aWYgKHByb3BlcnR5ICYmIHRoaXMucHJvcGVydHkpIHtcblx0XHRcdHRoaXMucHJvcGVydHlDb250cm9sPy5kZXN0cm95KCk7XG5cdFx0XHR0aGlzLnByb3BlcnR5Q29udHJvbCA9IHVuZGVmaW5lZDtcblxuXHRcdFx0Y29uc3QgdHlwZTogc3RyaW5nID0gaXNQbGF5Z3JvdW5kUHJvcGVydHkodGhpcy5wcm9wZXJ0eSkgPyB0aGlzLnByb3BlcnR5LnR5cGUgOiAnYm9vbGVhbic7XG5cdFx0XHRjb25zdCB0eXBlQ29udHJvbDogTmdEb2NQcm92aWRlZFR5cGVDb250cm9sIHwgdW5kZWZpbmVkID1cblx0XHRcdFx0dGhpcy5nZXRDb250cm9sRm9yVHlwZSh0eXBlKSA/P1xuXHRcdFx0XHR0aGlzLmdldENvbnRyb2xGb3JUeXBlQWxpYXMoaXNQbGF5Z3JvdW5kUHJvcGVydHkodGhpcy5wcm9wZXJ0eSkgPyB0aGlzLnByb3BlcnR5Lm9wdGlvbnMgOiB1bmRlZmluZWQpO1xuXG5cdFx0XHRpZiAodHlwZUNvbnRyb2wgJiYgdGhpcy5wcm9wZXJ0eU91dGxldCkge1xuXHRcdFx0XHR0aGlzLnByb3BlcnR5Q29udHJvbCA9IHRoaXMucHJvcGVydHlPdXRsZXQuY3JlYXRlQ29tcG9uZW50KHR5cGVDb250cm9sLmNvbnRyb2wpO1xuXHRcdFx0XHR0aGlzLnByb3BlcnR5Q29udHJvbC5pbnN0YW5jZS5uYW1lID0gdGhpcy5uYW1lO1xuXHRcdFx0XHR0aGlzLnByb3BlcnR5Q29udHJvbC5pbnN0YW5jZS5kZXNjcmlwdGlvbiA9IHRoaXMudG9vbHRpcENvbnRlbnQ7XG5cdFx0XHRcdHRoaXMucHJvcGVydHlDb250cm9sLmluc3RhbmNlLm9wdGlvbnMgPSBpc1BsYXlncm91bmRQcm9wZXJ0eSh0aGlzLnByb3BlcnR5KVxuXHRcdFx0XHRcdD8gdGhpcy5wcm9wZXJ0eS5vcHRpb25zXG5cdFx0XHRcdFx0OiB1bmRlZmluZWQ7XG5cdFx0XHRcdHRoaXMucHJvcGVydHlDb250cm9sLmluc3RhbmNlLmRlZmF1bHQgPSBpc1BsYXlncm91bmRQcm9wZXJ0eSh0aGlzLnByb3BlcnR5KVxuXHRcdFx0XHRcdD8gdGhpcy5wcm9wZXJ0eS5kZWZhdWx0XG5cdFx0XHRcdFx0OiB1bmRlZmluZWQ7XG5cdFx0XHRcdHRoaXMucHJvcGVydHlDb250cm9sLmluc3RhbmNlLndyaXRlVmFsdWUodGhpcy5jb250cm9sPy52YWx1ZSk7XG5cblx0XHRcdFx0dGhpcy5vcHRpb24gPSB0eXBlQ29udHJvbC5vcHRpb25zO1xuXHRcdFx0fSBlbHNlIGlmIChpc0Rldk1vZGUoKSkge1xuXHRcdFx0XHRjb25zb2xlLndhcm4oXG5cdFx0XHRcdFx0YE5nRG9jUGxheWdyb3VuZCBkaWRuJ3QgZmluZCB0aGUgY29udHJvbCBmb3IgdGhlIEBJbnB1dCBcIiR7dGhpcy5uYW1lfVwiLCB0aGUgdHlwZSBcIiR7dHlwZX1cIiB3YXMgbm90IHJlY29nbml6ZWQnYCxcblx0XHRcdFx0KTtcblx0XHRcdH1cblx0XHR9XG5cblx0XHRpZiAoY29udHJvbCkge1xuXHRcdFx0dGhpcy5jb250cm9sPy5yZWdpc3Rlck9uQ2hhbmdlKCh2YWx1ZTogc3RyaW5nKSA9PiB0aGlzLnByb3BlcnR5Q29udHJvbD8uaW5zdGFuY2U/LndyaXRlVmFsdWUodmFsdWUpKTtcblx0XHRcdHRoaXMucHJvcGVydHlDb250cm9sPy5pbnN0YW5jZS5yZWdpc3Rlck9uQ2hhbmdlKCh2YWx1ZTogdW5rbm93bikgPT4gdGhpcy5jb250cm9sPy5zZXRWYWx1ZSh2YWx1ZSkpO1xuXHRcdFx0dGhpcy5wcm9wZXJ0eUNvbnRyb2w/Lmluc3RhbmNlLnJlZ2lzdGVyT25Ub3VjaGVkKCgpID0+IHRoaXMuY29udHJvbD8ubWFya0FzVG91Y2hlZCgpKTtcblx0XHR9XG5cdH1cblxuXHRASG9zdEJpbmRpbmcoJ2F0dHIuZGF0YS1oYXMtcHJvcGVydHktY29udHJvbCcpXG5cdGdldCBoYXNQcm9wZXJ0eUNvbnRyb2woKTogYm9vbGVhbiB7XG5cdFx0cmV0dXJuICEhdGhpcy5wcm9wZXJ0eUNvbnRyb2w7XG5cdH1cblxuXHRnZXQgdG9vbHRpcENvbnRlbnQoKTogc3RyaW5nIHtcblx0XHRyZXR1cm4gdGhpcy5wcm9wZXJ0eSAmJiBpc1BsYXlncm91bmRQcm9wZXJ0eSh0aGlzLnByb3BlcnR5KSA/IHRoaXMucHJvcGVydHkuZGVzY3JpcHRpb24gPz8gJycgOiAnJztcblx0fVxuXG5cdHByaXZhdGUgZ2V0Q29udHJvbEZvclR5cGUodHlwZTogc3RyaW5nKTogTmdEb2NQcm92aWRlZFR5cGVDb250cm9sIHwgdW5kZWZpbmVkIHtcblx0XHRjb25zdCB0b2tlbjogSW5qZWN0aW9uVG9rZW48TmdEb2NQcm92aWRlZFR5cGVDb250cm9sPiB8IHVuZGVmaW5lZCA9IGdldFRva2VuRm9yVHlwZSh0eXBlKTtcblxuXHRcdHJldHVybiB0b2tlbiA/IHRoaXMuaW5qZWN0b3IuZ2V0KHRva2VuKSA6IHVuZGVmaW5lZDtcblx0fVxuXG5cdHByaXZhdGUgZ2V0Q29udHJvbEZvclR5cGVBbGlhcyhvcHRpb25zPzogc3RyaW5nW10pOiBOZ0RvY1Byb3ZpZGVkVHlwZUNvbnRyb2wgfCB1bmRlZmluZWQge1xuXHRcdGlmIChvcHRpb25zICYmIG9wdGlvbnMubGVuZ3RoKSB7XG5cdFx0XHRsZXQgb3B0aW9uc0lzVmFsaWQ6IGJvb2xlYW4gPSB0cnVlO1xuXG5cdFx0XHR0cnkge1xuXHRcdFx0XHQvLyBjaGVja2luZyB0aGF0IGFsbCB2YWx1ZXMgYXJlIGV4dHJhY3RhYmxlXG5cdFx0XHRcdG9wdGlvbnMuZm9yRWFjaCgoaXRlbTogc3RyaW5nKSA9PiBleHRyYWN0VmFsdWVPclRocm93KGl0ZW0pKTtcblx0XHRcdH0gY2F0Y2gge1xuXHRcdFx0XHRvcHRpb25zSXNWYWxpZCA9IGZhbHNlO1xuXHRcdFx0fVxuXG5cdFx0XHRpZiAob3B0aW9uc0lzVmFsaWQpIHtcblx0XHRcdFx0Y29uc3QgdG9rZW46IEluamVjdGlvblRva2VuPE5nRG9jUHJvdmlkZWRUeXBlQ29udHJvbD4gfCB1bmRlZmluZWQgPSBnZXRUb2tlbkZvclR5cGUoJ05nRG9jVHlwZUFsaWFzJyk7XG5cblx0XHRcdFx0cmV0dXJuIHRva2VuID8gdGhpcy5pbmplY3Rvci5nZXQodG9rZW4pIDogdW5kZWZpbmVkO1xuXHRcdFx0fVxuXHRcdH1cblxuXHRcdHJldHVybiB1bmRlZmluZWQ7XG5cdH1cbn1cbiIsIjxsYWJlbCBbbmctZG9jLWxhYmVsXT1cIm9wdGlvbj8uaGlkZUxhYmVsID8gJycgOiBsYWJlbENvbnRlbnRcIj5cblx0PG5nLXRlbXBsYXRlICNsYWJlbENvbnRlbnQ+XG5cdFx0PHNwYW5cblx0XHRcdFtuZ0RvY1Rvb2x0aXBdPVwidG9vbHRpcENvbnRlbnRcIlxuXHRcdFx0W2Nhbk9wZW5dPVwiISF0b29sdGlwQ29udGVudFwiXG5cdFx0XHRbcG9zaXRpb25zXT1cIlsnbGVmdC1jZW50ZXInLCAndG9wLXJpZ2h0JywgJ2JvdHRvbS1yaWdodCddXCJcblx0XHRcdD57eyBuYW1lIH19PC9zcGFuXG5cdFx0PlxuXHQ8L25nLXRlbXBsYXRlPlxuXHQ8bmctY29udGFpbmVyICNwcm9wZXJ0eU91dGxldD48L25nLWNvbnRhaW5lcj5cbjwvbGFiZWw+XG4iXX0=

package/esm2020/components/playground/playground.component.mjs

@@ -1,20 +1,22 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
-import { NgDocRootPage } from '@ng-doc/app/classes';
-import { extractValue, objectKeys } from '@ng-doc/core';
+import { NgDocRootPage } from '@ng-doc/app/classes/root-page';
+import { extractValue } from '@ng-doc/core/helpers/extract-value';
+import { objectKeys } from '@ng-doc/core/helpers/object-keys';
 import * as i0 from "@angular/core";
-import * as i1 from "@ng-doc/app/classes";
+import * as i1 from "@ng-doc/app/classes/root-page";
 import * as i2 from "@angular/forms";
 import * as i3 from "@angular/common";
-import * as i4 from "@ng-doc/app/components/playground-demo";
-import * as i5 from "@ng-doc/app/components/playground-properties";
+import * as i4 from "./playground-properties/playground-properties.component";
+import * as i5 from "./playground-demo/playground-demo.component";
 import * as i6 from "@ng-doc/ui-kit";
 export class NgDocPlaygroundComponent {
     constructor(rootPage, formBuilder) {
         this.rootPage = rootPage;
         this.formBuilder = formBuilder;
+        this.id = '';
         this.selectors = [];
-        this.reinitializeDemo = false;
+        this.recreateDemo = false;
     }
     ngOnInit() {
         const propertiesForm = this.formBuilder.group(this.getPropertiesFormValues());
@@ -23,10 +25,9 @@ export class NgDocPlaygroundComponent {
             properties: propertiesForm,
             content: contentForm,
         });
-        console.log(this.rootPage.playground, this.id, this.properties);
     }
     get configuration() {
-        return this.id && this.rootPage.playground ? this.rootPage.playground[this.id] : undefined;
+        return this.rootPage.dependencies?.playgrounds?.[this.id];
     }
     getPropertiesFormValues() {
         return objectKeys(this.properties ?? {}).reduce((controls, key) => {
@@ -37,12 +38,13 @@ export class NgDocPlaygroundComponent {
         }, {});
     }
     getContentFormValues() {
-        return objectKeys(this.configuration?.dynamicContent ?? {}).reduce((controls, key) => {
-            if (this.configuration?.dynamicContent) {
+        return objectKeys(this.configuration?.content ?? {}).reduce((controls, key) => {
+            if (this.configuration?.content) {
                 controls[key] = false;
             }
             return controls;
         }, {});
+        return {};
     }
     resetForm() {
         this.formGroup?.reset({
@@ -52,9 +54,9 @@ export class NgDocPlaygroundComponent {
     }
 }
 NgDocPlaygroundComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundComponent, deps: [{ token: i1.NgDocRootPage }, { token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-NgDocPlaygroundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: NgDocPlaygroundComponent, selector: "ng-doc-playground", ngImport: i0, template: "<ng-container *ngIf=\"configuration\">\n\t<ng-doc-playground-properties [form]=\"formGroup\" [properties]=\"properties\"\n\t\t\t\t\t\t\t\t  [dynamicContent]=\"configuration.dynamicContent\"\n\t\t\t\t\t\t\t\t  [(reinitializeDemo)]=\"reinitializeDemo\"\n\t\t\t\t\t\t\t\t  (resetForm)=\"resetForm()\">\n\t\t<ng-doc-playground-demo *ngFor=\"let selector of (configuration.selectors ?? selectors) | asArray\"\n\t\t\t\t\t\t\t\t[target]=\"configuration.target\"\n\t\t\t\t\t\t\t\t[selector]=\"selector\"\n\t\t\t\t\t\t\t\t[template]=\"configuration.template\"\n\t\t\t\t\t\t\t\t[properties]=\"properties\"\n\t\t\t\t\t\t\t\t[data]=\"configuration.data\"\n\t\t\t\t\t\t\t\t[dynamicContent]=\"configuration.dynamicContent\"\n\t\t\t\t\t\t\t\t[reinitializeDemo]=\"reinitializeDemo\"\n\t\t\t\t\t\t\t\t[form]=\"formGroup\">\n\t\t</ng-doc-playground-demo>\n\t</ng-doc-playground-properties>\n</ng-container>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.NgDocPlaygroundDemoComponent, selector: "ng-doc-playground-demo", inputs: ["target", "selector", "template", "properties", "dynamicContent", "data", "reinitializeDemo", "form"] }, { kind: "component", type: i5.NgDocPlaygroundPropertiesComponent, selector: "ng-doc-playground-properties", inputs: ["form", "properties", "dynamicContent", "reinitializeDemo"], outputs: ["reinitializeDemoChange", "resetForm"] }, { kind: "pipe", type: i6.NgDocAsArrayPipe, name: "asArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+NgDocPlaygroundComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: NgDocPlaygroundComponent, selector: "ng-doc-playground", ngImport: i0, template: "<ng-container *ngIf=\"configuration\">\n\t<ng-doc-playground-properties\n\t\t[form]=\"formGroup\"\n\t\t[properties]=\"properties\"\n\t\t[dynamicContent]=\"configuration.content\"\n\t\t[(recreateDemo)]=\"recreateDemo\"\n\t\t(resetForm)=\"resetForm()\"\n\t>\n\t\t<ng-doc-playground-demo\n\t\t\t*ngFor=\"let selector of configuration.selectors ?? selectors | asArray\"\n\t\t\t[id]=\"id\"\n\t\t\t[selector]=\"selector\"\n\t\t\t[properties]=\"properties\"\n\t\t\t[configuration]=\"configuration\"\n\t\t\t[recreateDemo]=\"recreateDemo\"\n\t\t\t[form]=\"formGroup\"\n\t\t>\n\t\t</ng-doc-playground-demo>\n\t</ng-doc-playground-properties>\n</ng-container>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.NgDocPlaygroundPropertiesComponent, selector: "ng-doc-playground-properties", inputs: ["form", "properties", "dynamicContent", "recreateDemo"], outputs: ["recreateDemoChange", "resetForm"] }, { kind: "component", type: i5.NgDocPlaygroundDemoComponent, selector: "ng-doc-playground-demo", inputs: ["id", "selector", "configuration", "properties", "recreateDemo", "form"] }, { kind: "pipe", type: i6.NgDocAsArrayPipe, name: "asArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ng-doc-playground', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"configuration\">\n\t<ng-doc-playground-properties [form]=\"formGroup\" [properties]=\"properties\"\n\t\t\t\t\t\t\t\t  [dynamicContent]=\"configuration.dynamicContent\"\n\t\t\t\t\t\t\t\t  [(reinitializeDemo)]=\"reinitializeDemo\"\n\t\t\t\t\t\t\t\t  (resetForm)=\"resetForm()\">\n\t\t<ng-doc-playground-demo *ngFor=\"let selector of (configuration.selectors ?? selectors) | asArray\"\n\t\t\t\t\t\t\t\t[target]=\"configuration.target\"\n\t\t\t\t\t\t\t\t[selector]=\"selector\"\n\t\t\t\t\t\t\t\t[template]=\"configuration.template\"\n\t\t\t\t\t\t\t\t[properties]=\"properties\"\n\t\t\t\t\t\t\t\t[data]=\"configuration.data\"\n\t\t\t\t\t\t\t\t[dynamicContent]=\"configuration.dynamicContent\"\n\t\t\t\t\t\t\t\t[reinitializeDemo]=\"reinitializeDemo\"\n\t\t\t\t\t\t\t\t[form]=\"formGroup\">\n\t\t</ng-doc-playground-demo>\n\t</ng-doc-playground-properties>\n</ng-container>\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'ng-doc-playground', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"configuration\">\n\t<ng-doc-playground-properties\n\t\t[form]=\"formGroup\"\n\t\t[properties]=\"properties\"\n\t\t[dynamicContent]=\"configuration.content\"\n\t\t[(recreateDemo)]=\"recreateDemo\"\n\t\t(resetForm)=\"resetForm()\"\n\t>\n\t\t<ng-doc-playground-demo\n\t\t\t*ngFor=\"let selector of configuration.selectors ?? selectors | asArray\"\n\t\t\t[id]=\"id\"\n\t\t\t[selector]=\"selector\"\n\t\t\t[properties]=\"properties\"\n\t\t\t[configuration]=\"configuration\"\n\t\t\t[recreateDemo]=\"recreateDemo\"\n\t\t\t[form]=\"formGroup\"\n\t\t>\n\t\t</ng-doc-playground-demo>\n\t</ng-doc-playground-properties>\n</ng-container>\n", styles: [":host{display:block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.NgDocRootPage }, { type: i2.FormBuilder }]; } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFTLE1BQU0sZUFBZSxDQUFDO0FBQ3pFLE9BQU8sRUFBQyxXQUFXLEVBQVksTUFBTSxnQkFBZ0IsQ0FBQztBQUN0RCxPQUFPLEVBQUMsYUFBYSxFQUFDLE1BQU0scUJBQXFCLENBQUM7QUFFbEQsT0FBTyxFQUFDLFlBQVksRUFBdUIsVUFBVSxFQUFDLE1BQU0sY0FBYyxDQUFDOzs7Ozs7OztBQVEzRSxNQUFNLE9BQU8sd0JBQXdCO0lBU3BDLFlBQTZCLFFBQXVCLEVBQW1CLFdBQXdCO1FBQWxFLGFBQVEsR0FBUixRQUFRLENBQWU7UUFBbUIsZ0JBQVcsR0FBWCxXQUFXLENBQWE7UUFML0YsY0FBUyxHQUFhLEVBQUUsQ0FBQztRQUd6QixxQkFBZ0IsR0FBWSxLQUFLLENBQUM7SUFFZ0UsQ0FBQztJQUVuRyxRQUFRO1FBQ1AsTUFBTSxjQUFjLEdBQWMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLHVCQUF1QixFQUFFLENBQUMsQ0FBQztRQUN6RixNQUFNLFdBQVcsR0FBYyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsb0JBQW9CLEVBQUUsQ0FBQyxDQUFDO1FBRW5GLElBQUksQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUM7WUFDdkMsVUFBVSxFQUFFLGNBQWM7WUFDMUIsT0FBTyxFQUFFLFdBQVc7U0FDcEIsQ0FBQyxDQUFDO1FBRUgsT0FBTyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLFVBQVUsRUFBRSxJQUFJLENBQUMsRUFBRSxFQUFFLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUNqRSxDQUFDO0lBRUQsSUFBSSxhQUFhO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLEVBQUUsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUM7SUFDNUYsQ0FBQztJQUVPLHVCQUF1QjtRQUM5QixPQUFPLFVBQVUsQ0FBQyxJQUFJLENBQUMsVUFBVSxJQUFJLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLFFBQXdDLEVBQUUsR0FBTSxFQUFFLEVBQUU7WUFDcEcsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO2dCQUNwQixRQUFRLENBQUMsR0FBRyxDQUFDLEdBQUcsWUFBWSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsR0FBRyxDQUFDLEVBQUUsT0FBTyxJQUFJLFdBQVcsQ0FBQyxDQUFDO2FBQzNFO1lBRUQsT0FBTyxRQUFRLENBQUM7UUFDakIsQ0FBQyxFQUFFLEVBQW9DLENBQUMsQ0FBQztJQUMxQyxDQUFDO0lBRU8sb0JBQW9CO1FBQzNCLE9BQU8sVUFBVSxDQUFDLElBQUksQ0FBQyxhQUFhLEVBQUUsY0FBYyxJQUFJLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FDakUsQ0FBQyxRQUFpQyxFQUFFLEdBQVcsRUFBRSxFQUFFO1lBQ2xELElBQUksSUFBSSxDQUFDLGFBQWEsRUFBRSxjQUFjLEVBQUU7Z0JBQ3ZDLFFBQVEsQ0FBQyxHQUFHLENBQUMsR0FBRyxLQUFLLENBQUM7YUFDdEI7WUFFRCxPQUFPLFFBQVEsQ0FBQztRQUNqQixDQUFDLEVBQ0QsRUFBOEIsQ0FDOUIsQ0FBQztJQUNILENBQUM7SUFFRCxTQUFTO1FBQ1IsSUFBSSxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUM7WUFDckIsVUFBVSxFQUFFLElBQUksQ0FBQyx1QkFBdUIsRUFBRTtZQUMxQyxPQUFPLEVBQUUsSUFBSSxDQUFDLG9CQUFvQixFQUFFO1NBQ3BDLENBQUMsQ0FBQztJQUNKLENBQUM7O3FIQXZEVyx3QkFBd0I7eUdBQXhCLHdCQUF3Qix5RENackMsNDNCQWlCQTsyRkRMYSx3QkFBd0I7a0JBTnBDLFNBQVM7K0JBQ0MsbUJBQW1CLG1CQUdaLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIE9uSW5pdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0Zvcm1CdWlsZGVyLCBGb3JtR3JvdXB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7TmdEb2NSb290UGFnZX0gZnJvbSAnQG5nLWRvYy9hcHAvY2xhc3Nlcyc7XG5pbXBvcnQge05nRG9jUGxheWdyb3VuZENvbmZpZywgTmdEb2NQbGF5Z3JvdW5kUHJvcGVydGllc30gZnJvbSAnQG5nLWRvYy9jb3JlJztcbmltcG9ydCB7ZXh0cmFjdFZhbHVlLCBOZ0RvY0V4dHJhY3RlZFZhbHVlLCBvYmplY3RLZXlzfSBmcm9tICdAbmctZG9jL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6ICduZy1kb2MtcGxheWdyb3VuZCcsXG5cdHRlbXBsYXRlVXJsOiAnLi9wbGF5Z3JvdW5kLmNvbXBvbmVudC5odG1sJyxcblx0c3R5bGVVcmxzOiBbJy4vcGxheWdyb3VuZC5jb21wb25lbnQuc2NzcyddLFxuXHRjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgTmdEb2NQbGF5Z3JvdW5kQ29tcG9uZW50PFQgZXh0ZW5kcyBOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzID0gTmdEb2NQbGF5Z3JvdW5kUHJvcGVydGllcz5cblx0aW1wbGVtZW50cyBPbkluaXRcbntcblx0aWQ/OiBzdHJpbmc7XG5cdHNlbGVjdG9yczogc3RyaW5nW10gPSBbXTtcblx0cHJvcGVydGllcz86IFQ7XG5cdGZvcm1Hcm91cD86IEZvcm1Hcm91cDtcblx0cmVpbml0aWFsaXplRGVtbzogYm9vbGVhbiA9IGZhbHNlO1xuXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgcm9vdFBhZ2U6IE5nRG9jUm9vdFBhZ2UsIHByaXZhdGUgcmVhZG9ubHkgZm9ybUJ1aWxkZXI6IEZvcm1CdWlsZGVyKSB7fVxuXG5cdG5nT25Jbml0KCk6IHZvaWQge1xuXHRcdGNvbnN0IHByb3BlcnRpZXNGb3JtOiBGb3JtR3JvdXAgPSB0aGlzLmZvcm1CdWlsZGVyLmdyb3VwKHRoaXMuZ2V0UHJvcGVydGllc0Zvcm1WYWx1ZXMoKSk7XG5cdFx0Y29uc3QgY29udGVudEZvcm06IEZvcm1Hcm91cCA9IHRoaXMuZm9ybUJ1aWxkZXIuZ3JvdXAodGhpcy5nZXRDb250ZW50Rm9ybVZhbHVlcygpKTtcblxuXHRcdHRoaXMuZm9ybUdyb3VwID0gdGhpcy5mb3JtQnVpbGRlci5ncm91cCh7XG5cdFx0XHRwcm9wZXJ0aWVzOiBwcm9wZXJ0aWVzRm9ybSxcblx0XHRcdGNvbnRlbnQ6IGNvbnRlbnRGb3JtLFxuXHRcdH0pO1xuXG5cdFx0Y29uc29sZS5sb2codGhpcy5yb290UGFnZS5wbGF5Z3JvdW5kLCB0aGlzLmlkLCB0aGlzLnByb3BlcnRpZXMpO1xuXHR9XG5cblx0Z2V0IGNvbmZpZ3VyYXRpb24oKTogTmdEb2NQbGF5Z3JvdW5kQ29uZmlnIHwgdW5kZWZpbmVkIHtcblx0XHRyZXR1cm4gdGhpcy5pZCAmJiB0aGlzLnJvb3RQYWdlLnBsYXlncm91bmQgPyB0aGlzLnJvb3RQYWdlLnBsYXlncm91bmRbdGhpcy5pZF0gOiB1bmRlZmluZWQ7XG5cdH1cblxuXHRwcml2YXRlIGdldFByb3BlcnRpZXNGb3JtVmFsdWVzPEsgZXh0ZW5kcyBrZXlvZiBUPigpOiBSZWNvcmQ8SywgTmdEb2NFeHRyYWN0ZWRWYWx1ZT4ge1xuXHRcdHJldHVybiBvYmplY3RLZXlzKHRoaXMucHJvcGVydGllcyA/PyB7fSkucmVkdWNlKChjb250cm9sczogUmVjb3JkPEssIE5nRG9jRXh0cmFjdGVkVmFsdWU+LCBrZXk6IEspID0+IHtcblx0XHRcdGlmICh0aGlzLnByb3BlcnRpZXMpIHtcblx0XHRcdFx0Y29udHJvbHNba2V5XSA9IGV4dHJhY3RWYWx1ZSh0aGlzLnByb3BlcnRpZXNba2V5XT8uZGVmYXVsdCA/PyAndW5kZWZpbmVkJyk7XG5cdFx0XHR9XG5cblx0XHRcdHJldHVybiBjb250cm9scztcblx0XHR9LCB7fSBhcyBSZWNvcmQ8SywgTmdEb2NFeHRyYWN0ZWRWYWx1ZT4pO1xuXHR9XG5cblx0cHJpdmF0ZSBnZXRDb250ZW50Rm9ybVZhbHVlcygpOiBSZWNvcmQ8c3RyaW5nLCBib29sZWFuPiB7XG5cdFx0cmV0dXJuIG9iamVjdEtleXModGhpcy5jb25maWd1cmF0aW9uPy5keW5hbWljQ29udGVudCA/PyB7fSkucmVkdWNlKFxuXHRcdFx0KGNvbnRyb2xzOiBSZWNvcmQ8c3RyaW5nLCBib29sZWFuPiwga2V5OiBzdHJpbmcpID0+IHtcblx0XHRcdFx0aWYgKHRoaXMuY29uZmlndXJhdGlvbj8uZHluYW1pY0NvbnRlbnQpIHtcblx0XHRcdFx0XHRjb250cm9sc1trZXldID0gZmFsc2U7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHRyZXR1cm4gY29udHJvbHM7XG5cdFx0XHR9LFxuXHRcdFx0e30gYXMgUmVjb3JkPGtleW9mIFQsIGJvb2xlYW4+LFxuXHRcdCk7XG5cdH1cblxuXHRyZXNldEZvcm0oKTogdm9pZCB7XG5cdFx0dGhpcy5mb3JtR3JvdXA/LnJlc2V0KHtcblx0XHRcdHByb3BlcnRpZXM6IHRoaXMuZ2V0UHJvcGVydGllc0Zvcm1WYWx1ZXMoKSxcblx0XHRcdGNvbnRlbnQ6IHRoaXMuZ2V0Q29udGVudEZvcm1WYWx1ZXMoKSxcblx0XHR9KTtcblx0fVxufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdJZj1cImNvbmZpZ3VyYXRpb25cIj5cblx0PG5nLWRvYy1wbGF5Z3JvdW5kLXByb3BlcnRpZXMgW2Zvcm1dPVwiZm9ybUdyb3VwXCIgW3Byb3BlcnRpZXNdPVwicHJvcGVydGllc1wiXG5cdFx0XHRcdFx0XHRcdFx0ICBbZHluYW1pY0NvbnRlbnRdPVwiY29uZmlndXJhdGlvbi5keW5hbWljQ29udGVudFwiXG5cdFx0XHRcdFx0XHRcdFx0ICBbKHJlaW5pdGlhbGl6ZURlbW8pXT1cInJlaW5pdGlhbGl6ZURlbW9cIlxuXHRcdFx0XHRcdFx0XHRcdCAgKHJlc2V0Rm9ybSk9XCJyZXNldEZvcm0oKVwiPlxuXHRcdDxuZy1kb2MtcGxheWdyb3VuZC1kZW1vICpuZ0Zvcj1cImxldCBzZWxlY3RvciBvZiAoY29uZmlndXJhdGlvbi5zZWxlY3RvcnMgPz8gc2VsZWN0b3JzKSB8IGFzQXJyYXlcIlxuXHRcdFx0XHRcdFx0XHRcdFt0YXJnZXRdPVwiY29uZmlndXJhdGlvbi50YXJnZXRcIlxuXHRcdFx0XHRcdFx0XHRcdFtzZWxlY3Rvcl09XCJzZWxlY3RvclwiXG5cdFx0XHRcdFx0XHRcdFx0W3RlbXBsYXRlXT1cImNvbmZpZ3VyYXRpb24udGVtcGxhdGVcIlxuXHRcdFx0XHRcdFx0XHRcdFtwcm9wZXJ0aWVzXT1cInByb3BlcnRpZXNcIlxuXHRcdFx0XHRcdFx0XHRcdFtkYXRhXT1cImNvbmZpZ3VyYXRpb24uZGF0YVwiXG5cdFx0XHRcdFx0XHRcdFx0W2R5bmFtaWNDb250ZW50XT1cImNvbmZpZ3VyYXRpb24uZHluYW1pY0NvbnRlbnRcIlxuXHRcdFx0XHRcdFx0XHRcdFtyZWluaXRpYWxpemVEZW1vXT1cInJlaW5pdGlhbGl6ZURlbW9cIlxuXHRcdFx0XHRcdFx0XHRcdFtmb3JtXT1cImZvcm1Hcm91cFwiPlxuXHRcdDwvbmctZG9jLXBsYXlncm91bmQtZGVtbz5cblx0PC9uZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0aWVzPlxuPC9uZy1jb250YWluZXI+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFTLE1BQU0sZUFBZSxDQUFDO0FBQ3pFLE9BQU8sRUFBQyxXQUFXLEVBQVksTUFBTSxnQkFBZ0IsQ0FBQztBQUN0RCxPQUFPLEVBQUMsYUFBYSxFQUFDLE1BQU0sK0JBQStCLENBQUM7QUFDNUQsT0FBTyxFQUFDLFlBQVksRUFBQyxNQUFNLG9DQUFvQyxDQUFDO0FBQ2hFLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQzs7Ozs7Ozs7QUFZNUQsTUFBTSxPQUFPLHdCQUF3QjtJQVNwQyxZQUE2QixRQUF1QixFQUFtQixXQUF3QjtRQUFsRSxhQUFRLEdBQVIsUUFBUSxDQUFlO1FBQW1CLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBTi9GLE9BQUUsR0FBVyxFQUFFLENBQUM7UUFDaEIsY0FBUyxHQUFhLEVBQUUsQ0FBQztRQUd6QixpQkFBWSxHQUFZLEtBQUssQ0FBQztJQUVvRSxDQUFDO0lBRW5HLFFBQVE7UUFDUCxNQUFNLGNBQWMsR0FBYyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsdUJBQXVCLEVBQUUsQ0FBQyxDQUFDO1FBQ3pGLE1BQU0sV0FBVyxHQUFjLElBQUksQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxvQkFBb0IsRUFBRSxDQUFDLENBQUM7UUFFbkYsSUFBSSxDQUFDLFNBQVMsR0FBRyxJQUFJLENBQUMsV0FBVyxDQUFDLEtBQUssQ0FBQztZQUN2QyxVQUFVLEVBQUUsY0FBYztZQUMxQixPQUFPLEVBQUUsV0FBVztTQUNwQixDQUFDLENBQUM7SUFDSixDQUFDO0lBRUQsSUFBSSxhQUFhO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQyxZQUFZLEVBQUUsV0FBVyxFQUFFLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQzNELENBQUM7SUFFTyx1QkFBdUI7UUFDOUIsT0FBTyxVQUFVLENBQUMsSUFBSSxDQUFDLFVBQVUsSUFBSSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxRQUF3QyxFQUFFLEdBQU0sRUFBRSxFQUFFO1lBQ3BHLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtnQkFDcEIsUUFBUSxDQUFDLEdBQUcsQ0FBQyxHQUFHLFlBQVksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEdBQUcsQ0FBQyxFQUFFLE9BQU8sSUFBSSxXQUFXLENBQUMsQ0FBQzthQUMzRTtZQUVELE9BQU8sUUFBUSxDQUFDO1FBQ2pCLENBQUMsRUFBRSxFQUFvQyxDQUFDLENBQUM7SUFDMUMsQ0FBQztJQUVPLG9CQUFvQjtRQUMzQixPQUFPLFVBQVUsQ0FBQyxJQUFJLENBQUMsYUFBYSxFQUFFLE9BQU8sSUFBSSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQzFELENBQUMsUUFBaUMsRUFBRSxHQUFXLEVBQUUsRUFBRTtZQUNsRCxJQUFJLElBQUksQ0FBQyxhQUFhLEVBQUUsT0FBTyxFQUFFO2dCQUNoQyxRQUFRLENBQUMsR0FBRyxDQUFDLEdBQUcsS0FBSyxDQUFDO2FBQ3RCO1lBRUQsT0FBTyxRQUFRLENBQUM7UUFDakIsQ0FBQyxFQUNELEVBQThCLENBQzlCLENBQUM7UUFDRixPQUFPLEVBQUUsQ0FBQztJQUNYLENBQUM7SUFFRCxTQUFTO1FBQ1IsSUFBSSxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUM7WUFDckIsVUFBVSxFQUFFLElBQUksQ0FBQyx1QkFBdUIsRUFBRTtZQUMxQyxPQUFPLEVBQUUsSUFBSSxDQUFDLG9CQUFvQixFQUFFO1NBQ3BDLENBQUMsQ0FBQztJQUNKLENBQUM7O3FIQXREVyx3QkFBd0I7eUdBQXhCLHdCQUF3Qix5RENoQnJDLDRvQkFvQkE7MkZESmEsd0JBQXdCO2tCQU5wQyxTQUFTOytCQUNDLG1CQUFtQixtQkFHWix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBPbkluaXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtGb3JtQnVpbGRlciwgRm9ybUdyb3VwfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQge05nRG9jUm9vdFBhZ2V9IGZyb20gJ0BuZy1kb2MvYXBwL2NsYXNzZXMvcm9vdC1wYWdlJztcbmltcG9ydCB7ZXh0cmFjdFZhbHVlfSBmcm9tICdAbmctZG9jL2NvcmUvaGVscGVycy9leHRyYWN0LXZhbHVlJztcbmltcG9ydCB7b2JqZWN0S2V5c30gZnJvbSAnQG5nLWRvYy9jb3JlL2hlbHBlcnMvb2JqZWN0LWtleXMnO1xuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRDb25maWcsIE5nRG9jUGxheWdyb3VuZFByb3BlcnRpZXN9IGZyb20gJ0BuZy1kb2MvY29yZS9pbnRlcmZhY2VzJztcbmltcG9ydCB7TmdEb2NFeHRyYWN0ZWRWYWx1ZX0gZnJvbSAnQG5nLWRvYy9jb3JlL3R5cGVzJztcblxuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRGb3JtfSBmcm9tICcuL3BsYXlncm91bmQtZm9ybSc7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogJ25nLWRvYy1wbGF5Z3JvdW5kJyxcblx0dGVtcGxhdGVVcmw6ICcuL3BsYXlncm91bmQuY29tcG9uZW50Lmh0bWwnLFxuXHRzdHlsZVVybHM6IFsnLi9wbGF5Z3JvdW5kLmNvbXBvbmVudC5zY3NzJ10sXG5cdGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxufSlcbmV4cG9ydCBjbGFzcyBOZ0RvY1BsYXlncm91bmRDb21wb25lbnQ8VCBleHRlbmRzIE5nRG9jUGxheWdyb3VuZFByb3BlcnRpZXMgPSBOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzPlxuXHRpbXBsZW1lbnRzIE9uSW5pdFxue1xuXHRpZDogc3RyaW5nID0gJyc7XG5cdHNlbGVjdG9yczogc3RyaW5nW10gPSBbXTtcblx0cHJvcGVydGllcz86IFQ7XG5cdGZvcm1Hcm91cCE6IEZvcm1Hcm91cDxOZ0RvY1BsYXlncm91bmRGb3JtPjtcblx0cmVjcmVhdGVEZW1vOiBib29sZWFuID0gZmFsc2U7XG5cblx0Y29uc3RydWN0b3IocHJpdmF0ZSByZWFkb25seSByb290UGFnZTogTmdEb2NSb290UGFnZSwgcHJpdmF0ZSByZWFkb25seSBmb3JtQnVpbGRlcjogRm9ybUJ1aWxkZXIpIHt9XG5cblx0bmdPbkluaXQoKTogdm9pZCB7XG5cdFx0Y29uc3QgcHJvcGVydGllc0Zvcm06IEZvcm1Hcm91cCA9IHRoaXMuZm9ybUJ1aWxkZXIuZ3JvdXAodGhpcy5nZXRQcm9wZXJ0aWVzRm9ybVZhbHVlcygpKTtcblx0XHRjb25zdCBjb250ZW50Rm9ybTogRm9ybUdyb3VwID0gdGhpcy5mb3JtQnVpbGRlci5ncm91cCh0aGlzLmdldENvbnRlbnRGb3JtVmFsdWVzKCkpO1xuXG5cdFx0dGhpcy5mb3JtR3JvdXAgPSB0aGlzLmZvcm1CdWlsZGVyLmdyb3VwKHtcblx0XHRcdHByb3BlcnRpZXM6IHByb3BlcnRpZXNGb3JtLFxuXHRcdFx0Y29udGVudDogY29udGVudEZvcm0sXG5cdFx0fSk7XG5cdH1cblxuXHRnZXQgY29uZmlndXJhdGlvbigpOiBOZ0RvY1BsYXlncm91bmRDb25maWcgfCB1bmRlZmluZWQge1xuXHRcdHJldHVybiB0aGlzLnJvb3RQYWdlLmRlcGVuZGVuY2llcz8ucGxheWdyb3VuZHM/Llt0aGlzLmlkXTtcblx0fVxuXG5cdHByaXZhdGUgZ2V0UHJvcGVydGllc0Zvcm1WYWx1ZXM8SyBleHRlbmRzIGtleW9mIFQ+KCk6IFJlY29yZDxLLCBOZ0RvY0V4dHJhY3RlZFZhbHVlPiB7XG5cdFx0cmV0dXJuIG9iamVjdEtleXModGhpcy5wcm9wZXJ0aWVzID8/IHt9KS5yZWR1Y2UoKGNvbnRyb2xzOiBSZWNvcmQ8SywgTmdEb2NFeHRyYWN0ZWRWYWx1ZT4sIGtleTogSykgPT4ge1xuXHRcdFx0aWYgKHRoaXMucHJvcGVydGllcykge1xuXHRcdFx0XHRjb250cm9sc1trZXldID0gZXh0cmFjdFZhbHVlKHRoaXMucHJvcGVydGllc1trZXldPy5kZWZhdWx0ID8/ICd1bmRlZmluZWQnKTtcblx0XHRcdH1cblxuXHRcdFx0cmV0dXJuIGNvbnRyb2xzO1xuXHRcdH0sIHt9IGFzIFJlY29yZDxLLCBOZ0RvY0V4dHJhY3RlZFZhbHVlPik7XG5cdH1cblxuXHRwcml2YXRlIGdldENvbnRlbnRGb3JtVmFsdWVzKCk6IFJlY29yZDxzdHJpbmcsIGJvb2xlYW4+IHtcblx0XHRyZXR1cm4gb2JqZWN0S2V5cyh0aGlzLmNvbmZpZ3VyYXRpb24/LmNvbnRlbnQgPz8ge30pLnJlZHVjZShcblx0XHRcdChjb250cm9sczogUmVjb3JkPHN0cmluZywgYm9vbGVhbj4sIGtleTogc3RyaW5nKSA9PiB7XG5cdFx0XHRcdGlmICh0aGlzLmNvbmZpZ3VyYXRpb24/LmNvbnRlbnQpIHtcblx0XHRcdFx0XHRjb250cm9sc1trZXldID0gZmFsc2U7XG5cdFx0XHRcdH1cblxuXHRcdFx0XHRyZXR1cm4gY29udHJvbHM7XG5cdFx0XHR9LFxuXHRcdFx0e30gYXMgUmVjb3JkPGtleW9mIFQsIGJvb2xlYW4+LFxuXHRcdCk7XG5cdFx0cmV0dXJuIHt9O1xuXHR9XG5cblx0cmVzZXRGb3JtKCk6IHZvaWQge1xuXHRcdHRoaXMuZm9ybUdyb3VwPy5yZXNldCh7XG5cdFx0XHRwcm9wZXJ0aWVzOiB0aGlzLmdldFByb3BlcnRpZXNGb3JtVmFsdWVzKCksXG5cdFx0XHRjb250ZW50OiB0aGlzLmdldENvbnRlbnRGb3JtVmFsdWVzKCksXG5cdFx0fSk7XG5cdH1cbn1cbiIsIjxuZy1jb250YWluZXIgKm5nSWY9XCJjb25maWd1cmF0aW9uXCI+XG5cdDxuZy1kb2MtcGxheWdyb3VuZC1wcm9wZXJ0aWVzXG5cdFx0W2Zvcm1dPVwiZm9ybUdyb3VwXCJcblx0XHRbcHJvcGVydGllc109XCJwcm9wZXJ0aWVzXCJcblx0XHRbZHluYW1pY0NvbnRlbnRdPVwiY29uZmlndXJhdGlvbi5jb250ZW50XCJcblx0XHRbKHJlY3JlYXRlRGVtbyldPVwicmVjcmVhdGVEZW1vXCJcblx0XHQocmVzZXRGb3JtKT1cInJlc2V0Rm9ybSgpXCJcblx0PlxuXHRcdDxuZy1kb2MtcGxheWdyb3VuZC1kZW1vXG5cdFx0XHQqbmdGb3I9XCJsZXQgc2VsZWN0b3Igb2YgY29uZmlndXJhdGlvbi5zZWxlY3RvcnMgPz8gc2VsZWN0b3JzIHwgYXNBcnJheVwiXG5cdFx0XHRbaWRdPVwiaWRcIlxuXHRcdFx0W3NlbGVjdG9yXT1cInNlbGVjdG9yXCJcblx0XHRcdFtwcm9wZXJ0aWVzXT1cInByb3BlcnRpZXNcIlxuXHRcdFx0W2NvbmZpZ3VyYXRpb25dPVwiY29uZmlndXJhdGlvblwiXG5cdFx0XHRbcmVjcmVhdGVEZW1vXT1cInJlY3JlYXRlRGVtb1wiXG5cdFx0XHRbZm9ybV09XCJmb3JtR3JvdXBcIlxuXHRcdD5cblx0XHQ8L25nLWRvYy1wbGF5Z3JvdW5kLWRlbW8+XG5cdDwvbmctZG9jLXBsYXlncm91bmQtcHJvcGVydGllcz5cbjwvbmctY29udGFpbmVyPlxuIl19

package/esm2020/components/playground/playground.module.mjs

@@ -1,36 +1,79 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
-import { NgDocPlaygroundDemoModule } from '@ng-doc/app/components/playground-demo';
-import { NgDocPlaygroundPropertiesModule } from '@ng-doc/app/components/playground-properties';
-import { NgDocAsArrayModule } from '@ng-doc/ui-kit';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { NgDocDemoDisplayerModule } from '@ng-doc/app/components/demo-displayer';
+import { NgDocAsArrayModule, NgDocButtonIconModule, NgDocButtonModule, NgDocCheckboxModule, NgDocIconModule, NgDocLabelModule, NgDocTextModule, NgDocTooltipModule, } from '@ng-doc/ui-kit';
+import { PolymorpheusModule } from '@tinkoff/ng-polymorpheus';
 import { NgDocPlaygroundComponent } from './playground.component';
+import { NgDocPlaygroundDemoComponent } from './playground-demo/playground-demo.component';
+import { NgDocPlaygroundPropertiesComponent } from './playground-properties/playground-properties.component';
+import { NgDocPlaygroundPropertyComponent } from './playground-property/playground-property.component';
 import * as i0 from "@angular/core";
 export class NgDocPlaygroundModule {
 }
 NgDocPlaygroundModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgDocPlaygroundModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundModule, declarations: [NgDocPlaygroundComponent], imports: [CommonModule,
+NgDocPlaygroundModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundModule, declarations: [NgDocPlaygroundComponent,
+        NgDocPlaygroundPropertyComponent,
+        NgDocPlaygroundPropertiesComponent,
+        NgDocPlaygroundDemoComponent], imports: [CommonModule,
         ReactiveFormsModule,
+        NgDocLabelModule,
+        NgDocTooltipModule,
+        PolymorpheusModule,
         NgDocAsArrayModule,
-        NgDocPlaygroundDemoModule,
-        NgDocPlaygroundPropertiesModule], exports: [NgDocPlaygroundComponent] });
+        NgDocButtonIconModule,
+        NgDocIconModule,
+        NgDocTextModule,
+        NgDocCheckboxModule,
+        FormsModule,
+        NgDocButtonModule,
+        NgDocDemoDisplayerModule], exports: [NgDocPlaygroundComponent,
+        NgDocPlaygroundPropertyComponent,
+        NgDocPlaygroundPropertiesComponent,
+        NgDocPlaygroundDemoComponent] });
 NgDocPlaygroundModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundModule, imports: [CommonModule,
         ReactiveFormsModule,
+        NgDocLabelModule,
+        NgDocTooltipModule,
+        PolymorpheusModule,
         NgDocAsArrayModule,
-        NgDocPlaygroundDemoModule,
-        NgDocPlaygroundPropertiesModule] });
+        NgDocButtonIconModule,
+        NgDocIconModule,
+        NgDocTextModule,
+        NgDocCheckboxModule,
+        FormsModule,
+        NgDocButtonModule,
+        NgDocDemoDisplayerModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: NgDocPlaygroundModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [NgDocPlaygroundComponent],
+                    declarations: [
+                        NgDocPlaygroundComponent,
+                        NgDocPlaygroundPropertyComponent,
+                        NgDocPlaygroundPropertiesComponent,
+                        NgDocPlaygroundDemoComponent,
+                    ],
                     imports: [
                         CommonModule,
                         ReactiveFormsModule,
+                        NgDocLabelModule,
+                        NgDocTooltipModule,
+                        PolymorpheusModule,
                         NgDocAsArrayModule,
-                        NgDocPlaygroundDemoModule,
-                        NgDocPlaygroundPropertiesModule,
+                        NgDocButtonIconModule,
+                        NgDocIconModule,
+                        NgDocTextModule,
+                        NgDocCheckboxModule,
+                        FormsModule,
+                        NgDocButtonModule,
+                        NgDocDemoDisplayerModule,
+                    ],
+                    exports: [
+                        NgDocPlaygroundComponent,
+                        NgDocPlaygroundPropertyComponent,
+                        NgDocPlaygroundPropertiesComponent,
+                        NgDocPlaygroundDemoComponent,
                     ],
-                    exports: [NgDocPlaygroundComponent],
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFlBQVksRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQzdDLE9BQU8sRUFBQyxRQUFRLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDdkMsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFDLHlCQUF5QixFQUFDLE1BQU0sd0NBQXdDLENBQUM7QUFDakYsT0FBTyxFQUFDLCtCQUErQixFQUFDLE1BQU0sOENBQThDLENBQUM7QUFDN0YsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7QUFFbEQsT0FBTyxFQUFDLHdCQUF3QixFQUFDLE1BQU0sd0JBQXdCLENBQUM7O0FBYWhFLE1BQU0sT0FBTyxxQkFBcUI7O2tIQUFyQixxQkFBcUI7bUhBQXJCLHFCQUFxQixpQkFWbEIsd0JBQXdCLGFBRXRDLFlBQVk7UUFDWixtQkFBbUI7UUFDbkIsa0JBQWtCO1FBQ2xCLHlCQUF5QjtRQUN6QiwrQkFBK0IsYUFFdEIsd0JBQXdCO21IQUV0QixxQkFBcUIsWUFSaEMsWUFBWTtRQUNaLG1CQUFtQjtRQUNuQixrQkFBa0I7UUFDbEIseUJBQXlCO1FBQ3pCLCtCQUErQjsyRkFJcEIscUJBQXFCO2tCQVhqQyxRQUFRO21CQUFDO29CQUNULFlBQVksRUFBRSxDQUFDLHdCQUF3QixDQUFDO29CQUN4QyxPQUFPLEVBQUU7d0JBQ1IsWUFBWTt3QkFDWixtQkFBbUI7d0JBQ25CLGtCQUFrQjt3QkFDbEIseUJBQXlCO3dCQUN6QiwrQkFBK0I7cUJBQy9CO29CQUNELE9BQU8sRUFBRSxDQUFDLHdCQUF3QixDQUFDO2lCQUNuQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tbW9uTW9kdWxlfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtOZ01vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1JlYWN0aXZlRm9ybXNNb2R1bGV9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7TmdEb2NQbGF5Z3JvdW5kRGVtb01vZHVsZX0gZnJvbSAnQG5nLWRvYy9hcHAvY29tcG9uZW50cy9wbGF5Z3JvdW5kLWRlbW8nO1xuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzTW9kdWxlfSBmcm9tICdAbmctZG9jL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQtcHJvcGVydGllcyc7XG5pbXBvcnQge05nRG9jQXNBcnJheU1vZHVsZX0gZnJvbSAnQG5nLWRvYy91aS1raXQnO1xuXG5pbXBvcnQge05nRG9jUGxheWdyb3VuZENvbXBvbmVudH0gZnJvbSAnLi9wbGF5Z3JvdW5kLmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG5cdGRlY2xhcmF0aW9uczogW05nRG9jUGxheWdyb3VuZENvbXBvbmVudF0sXG5cdGltcG9ydHM6IFtcblx0XHRDb21tb25Nb2R1bGUsXG5cdFx0UmVhY3RpdmVGb3Jtc01vZHVsZSxcblx0XHROZ0RvY0FzQXJyYXlNb2R1bGUsXG5cdFx0TmdEb2NQbGF5Z3JvdW5kRGVtb01vZHVsZSxcblx0XHROZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzTW9kdWxlLFxuXHRdLFxuXHRleHBvcnRzOiBbTmdEb2NQbGF5Z3JvdW5kQ29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgTmdEb2NQbGF5Z3JvdW5kTW9kdWxlIHt9XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGxheWdyb3VuZC5tb2R1bGUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2FwcC9jb21wb25lbnRzL3BsYXlncm91bmQvcGxheWdyb3VuZC5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFlBQVksRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQzdDLE9BQU8sRUFBQyxRQUFRLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDdkMsT0FBTyxFQUFDLFdBQVcsRUFBRSxtQkFBbUIsRUFBQyxNQUFNLGdCQUFnQixDQUFDO0FBQ2hFLE9BQU8sRUFBQyx3QkFBd0IsRUFBQyxNQUFNLHVDQUF1QyxDQUFDO0FBQy9FLE9BQU8sRUFDTixrQkFBa0IsRUFDbEIscUJBQXFCLEVBQ3JCLGlCQUFpQixFQUNqQixtQkFBbUIsRUFDbkIsZUFBZSxFQUNmLGdCQUFnQixFQUNoQixlQUFlLEVBQ2Ysa0JBQWtCLEdBQ2xCLE1BQU0sZ0JBQWdCLENBQUM7QUFDeEIsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sMEJBQTBCLENBQUM7QUFFNUQsT0FBTyxFQUFDLHdCQUF3QixFQUFDLE1BQU0sd0JBQXdCLENBQUM7QUFDaEUsT0FBTyxFQUFDLDRCQUE0QixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFDekYsT0FBTyxFQUFDLGtDQUFrQyxFQUFDLE1BQU0seURBQXlELENBQUM7QUFDM0csT0FBTyxFQUFDLGdDQUFnQyxFQUFDLE1BQU0scURBQXFELENBQUM7O0FBK0JyRyxNQUFNLE9BQU8scUJBQXFCOztrSEFBckIscUJBQXFCO21IQUFyQixxQkFBcUIsaUJBM0JoQyx3QkFBd0I7UUFDeEIsZ0NBQWdDO1FBQ2hDLGtDQUFrQztRQUNsQyw0QkFBNEIsYUFHNUIsWUFBWTtRQUNaLG1CQUFtQjtRQUNuQixnQkFBZ0I7UUFDaEIsa0JBQWtCO1FBQ2xCLGtCQUFrQjtRQUNsQixrQkFBa0I7UUFDbEIscUJBQXFCO1FBQ3JCLGVBQWU7UUFDZixlQUFlO1FBQ2YsbUJBQW1CO1FBQ25CLFdBQVc7UUFDWCxpQkFBaUI7UUFDakIsd0JBQXdCLGFBR3hCLHdCQUF3QjtRQUN4QixnQ0FBZ0M7UUFDaEMsa0NBQWtDO1FBQ2xDLDRCQUE0QjttSEFHakIscUJBQXFCLFlBckJoQyxZQUFZO1FBQ1osbUJBQW1CO1FBQ25CLGdCQUFnQjtRQUNoQixrQkFBa0I7UUFDbEIsa0JBQWtCO1FBQ2xCLGtCQUFrQjtRQUNsQixxQkFBcUI7UUFDckIsZUFBZTtRQUNmLGVBQWU7UUFDZixtQkFBbUI7UUFDbkIsV0FBVztRQUNYLGlCQUFpQjtRQUNqQix3QkFBd0I7MkZBU2IscUJBQXFCO2tCQTdCakMsUUFBUTttQkFBQztvQkFDVCxZQUFZLEVBQUU7d0JBQ2Isd0JBQXdCO3dCQUN4QixnQ0FBZ0M7d0JBQ2hDLGtDQUFrQzt3QkFDbEMsNEJBQTRCO3FCQUM1QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1IsWUFBWTt3QkFDWixtQkFBbUI7d0JBQ25CLGdCQUFnQjt3QkFDaEIsa0JBQWtCO3dCQUNsQixrQkFBa0I7d0JBQ2xCLGtCQUFrQjt3QkFDbEIscUJBQXFCO3dCQUNyQixlQUFlO3dCQUNmLGVBQWU7d0JBQ2YsbUJBQW1CO3dCQUNuQixXQUFXO3dCQUNYLGlCQUFpQjt3QkFDakIsd0JBQXdCO3FCQUN4QjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1Isd0JBQXdCO3dCQUN4QixnQ0FBZ0M7d0JBQ2hDLGtDQUFrQzt3QkFDbEMsNEJBQTRCO3FCQUM1QjtpQkFDRCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tbW9uTW9kdWxlfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtOZ01vZHVsZX0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0Zvcm1zTW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQge05nRG9jRGVtb0Rpc3BsYXllck1vZHVsZX0gZnJvbSAnQG5nLWRvYy9hcHAvY29tcG9uZW50cy9kZW1vLWRpc3BsYXllcic7XG5pbXBvcnQge1xuXHROZ0RvY0FzQXJyYXlNb2R1bGUsXG5cdE5nRG9jQnV0dG9uSWNvbk1vZHVsZSxcblx0TmdEb2NCdXR0b25Nb2R1bGUsXG5cdE5nRG9jQ2hlY2tib3hNb2R1bGUsXG5cdE5nRG9jSWNvbk1vZHVsZSxcblx0TmdEb2NMYWJlbE1vZHVsZSxcblx0TmdEb2NUZXh0TW9kdWxlLFxuXHROZ0RvY1Rvb2x0aXBNb2R1bGUsXG59IGZyb20gJ0BuZy1kb2MvdWkta2l0JztcbmltcG9ydCB7UG9seW1vcnBoZXVzTW9kdWxlfSBmcm9tICdAdGlua29mZi9uZy1wb2x5bW9ycGhldXMnO1xuXG5pbXBvcnQge05nRG9jUGxheWdyb3VuZENvbXBvbmVudH0gZnJvbSAnLi9wbGF5Z3JvdW5kLmNvbXBvbmVudCc7XG5pbXBvcnQge05nRG9jUGxheWdyb3VuZERlbW9Db21wb25lbnR9IGZyb20gJy4vcGxheWdyb3VuZC1kZW1vL3BsYXlncm91bmQtZGVtby5jb21wb25lbnQnO1xuaW1wb3J0IHtOZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzQ29tcG9uZW50fSBmcm9tICcuL3BsYXlncm91bmQtcHJvcGVydGllcy9wbGF5Z3JvdW5kLXByb3BlcnRpZXMuY29tcG9uZW50JztcbmltcG9ydCB7TmdEb2NQbGF5Z3JvdW5kUHJvcGVydHlDb21wb25lbnR9IGZyb20gJy4vcGxheWdyb3VuZC1wcm9wZXJ0eS9wbGF5Z3JvdW5kLXByb3BlcnR5LmNvbXBvbmVudCc7XG5cbkBOZ01vZHVsZSh7XG5cdGRlY2xhcmF0aW9uczogW1xuXHRcdE5nRG9jUGxheWdyb3VuZENvbXBvbmVudCxcblx0XHROZ0RvY1BsYXlncm91bmRQcm9wZXJ0eUNvbXBvbmVudCxcblx0XHROZ0RvY1BsYXlncm91bmRQcm9wZXJ0aWVzQ29tcG9uZW50LFxuXHRcdE5nRG9jUGxheWdyb3VuZERlbW9Db21wb25lbnQsXG5cdF0sXG5cdGltcG9ydHM6IFtcblx0XHRDb21tb25Nb2R1bGUsXG5cdFx0UmVhY3RpdmVGb3Jtc01vZHVsZSxcblx0XHROZ0RvY0xhYmVsTW9kdWxlLFxuXHRcdE5nRG9jVG9vbHRpcE1vZHVsZSxcblx0XHRQb2x5bW9ycGhldXNNb2R1bGUsXG5cdFx0TmdEb2NBc0FycmF5TW9kdWxlLFxuXHRcdE5nRG9jQnV0dG9uSWNvbk1vZHVsZSxcblx0XHROZ0RvY0ljb25Nb2R1bGUsXG5cdFx0TmdEb2NUZXh0TW9kdWxlLFxuXHRcdE5nRG9jQ2hlY2tib3hNb2R1bGUsXG5cdFx0Rm9ybXNNb2R1bGUsXG5cdFx0TmdEb2NCdXR0b25Nb2R1bGUsXG5cdFx0TmdEb2NEZW1vRGlzcGxheWVyTW9kdWxlLFxuXHRdLFxuXHRleHBvcnRzOiBbXG5cdFx0TmdEb2NQbGF5Z3JvdW5kQ29tcG9uZW50LFxuXHRcdE5nRG9jUGxheWdyb3VuZFByb3BlcnR5Q29tcG9uZW50LFxuXHRcdE5nRG9jUGxheWdyb3VuZFByb3BlcnRpZXNDb21wb25lbnQsXG5cdFx0TmdEb2NQbGF5Z3JvdW5kRGVtb0NvbXBvbmVudCxcblx0XSxcbn0pXG5leHBvcnQgY2xhc3MgTmdEb2NQbGF5Z3JvdW5kTW9kdWxlIHt9XG4iXX0=