@taiga-ui/cdk
Version:
Base library for creating Angular components and applications using Taiga UI principles regarding of actual visual appearance
124 lines (117 loc) • 6.1 kB
JavaScript
import * as i0 from '@angular/core';
import { inject, INJECTOR, Injector, Injectable, input, Directive, viewChild } from '@angular/core';
import { outputFromObservable, toObservable } from '@angular/core/rxjs-interop';
import { tuiIfMap } from '@taiga-ui/cdk/observables';
import { PolymorpheusComponent, POLYMORPHEUS_CONTEXT, PolymorpheusTemplate } from '@taiga-ui/polymorpheus';
import { Observable, ignoreElements, endWith, share } from 'rxjs';
import { tuiProvide } from '@taiga-ui/cdk/utils/di';
import { tuiGenerateId } from '@taiga-ui/cdk/utils/miscellaneous';
import { TuiVCR } from '@taiga-ui/cdk/directives/vcr';
class TuiPortal {
// eslint-disable-next-line @angular-eslint/prefer-inject
constructor(service) {
this.service = service;
this.injector = inject(INJECTOR);
}
open(content, options = {}) {
return new Observable(($implicit) => this.add(new PolymorpheusComponent(this.component, Injector.create({
parent: this.injector,
providers: [
{
provide: POLYMORPHEUS_CONTEXT,
useValue: {
...this.options,
...options,
content,
$implicit,
createdAt: Date.now(),
id: tuiGenerateId(),
completeWith: (v) => {
$implicit.next(v);
$implicit.complete();
},
},
},
],
}))));
}
add(component) {
const ref = this.service.add(component);
return () => ref.destroy();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortal, deps: "invalid", target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortal }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortal, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: undefined }] });
function tuiAsPortal(portal) {
return tuiProvide(TuiPortal, portal);
}
class TuiPortalDirective extends PolymorpheusTemplate {
constructor() {
super(...arguments);
this.service = inject((TuiPortal));
this.options = input({});
this.open = input(false);
this.openChange = outputFromObservable(toObservable(this.open).pipe(tuiIfMap(() => this.service
.open(this, this.options())
.pipe(ignoreElements(), endWith(false))), share()));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortalDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.25", type: TuiPortalDirective, isStandalone: true, inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openChange: "openChange" }, usesInheritance: true, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortalDirective, decorators: [{
type: Directive
}] });
class TuiPortalService {
attach(host) {
this.host = host;
}
add(content, context) {
if (!this.host) {
throw new TuiNoHostException();
}
return content instanceof PolymorpheusComponent
? this.host.addComponent(content)
: this.host.addTemplate(content, context);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortalService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortalService, decorators: [{
type: Injectable
}] });
class TuiNoHostException extends Error {
constructor() {
super(ngDevMode
? 'Portals cannot be used without TuiPortals component; perhaps you forgot to wrap your application with tui-root.'
: '');
}
}
class TuiPortals {
constructor() {
this.injector = inject(INJECTOR);
this.anchor = viewChild.required(TuiVCR);
inject(TuiPortalService).attach(this);
}
addComponent(component) {
const injector = component.createInjector(this.injector);
const ref = this.anchor().vcr.createComponent(component.component, { injector });
ref.changeDetectorRef.detectChanges();
return ref;
}
addTemplate(templateRef, context) {
return this.anchor().vcr.createEmbeddedView(templateRef, context);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortals, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.25", type: TuiPortals, isStandalone: true, viewQueries: [{ propertyName: "anchor", first: true, predicate: TuiVCR, descendants: true, isSignal: true }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TuiPortals, decorators: [{
type: Directive
}], ctorParameters: () => [] });
/**
* Generated bundle index. Do not edit.
*/
export { TuiNoHostException, TuiPortal, TuiPortalDirective, TuiPortalService, TuiPortals, tuiAsPortal };
//# sourceMappingURL=taiga-ui-cdk-portals.mjs.map