@revolist/angular-datagrid
Version:
Angular DataGrid Spreadsheet component with native cell render support
71 lines • 11.2 kB
JavaScript
/**
* Angular Adapter Function:
* Handles the rendering and lifecycle of Angular components within StencilJS using updated Angular APIs.
*/
import { Injector, ApplicationRef, createComponent, EnvironmentInjector, inject } from '@angular/core';
function updateProps(el, newProps) {
if (!el.componentRef?.instance) {
return;
}
// Update both ways to ensure it works with different component implementations
el.componentRef.instance.props = newProps;
el.componentRef.setInput('props', newProps);
// Handle ngOnChanges if component implements it
if (el.componentRef.instance.ngOnChanges) {
const previousValue = el.componentRef.instance.props;
const simpleChanges = {
props: {
previousValue,
currentValue: newProps,
firstChange: previousValue === undefined,
isFirstChange: () => previousValue === undefined
}
};
el.componentRef.instance.ngOnChanges(simpleChanges);
}
// Force component to check for updates
el.componentRef.changeDetectorRef.markForCheck();
el.componentRef.changeDetectorRef.detectChanges();
}
export function TemplateConstructor(el, AngularComponent, initialProps = {}, injector, lastEl = null) {
if (!el) {
lastEl?.destroy?.(); // Destroy last component if element is null
return null;
}
if (!el.componentRef) {
const applicationRef = injector.get(ApplicationRef);
const environmentInjector = injector.get(EnvironmentInjector);
const componentRef = createComponent(AngularComponent, { environmentInjector });
applicationRef.attachView(componentRef.hostView);
componentRef.instance.props = initialProps;
componentRef.changeDetectorRef.detectChanges();
el.componentRef = componentRef; // Store the component reference
el.appendChild(componentRef.location.nativeElement);
}
else if (el.componentRef.instance) {
updateProps(el, initialProps);
}
// Function to update component props
const update = (newProps) => updateProps(el, newProps);
// Function to destroy the component
const destroy = () => {
el.componentRef?.destroy();
el.componentRef = undefined;
};
return { update, destroy };
}
// Function to create template for Angular component
export const Template = (AngularComponent, customProps, injector = inject(Injector)) => {
return (h, p, addition) => {
const props = customProps ? { ...customProps, ...p } : p;
props.addition = addition;
let lastEl = null;
return h('span', {
key: `${p.prop}-${p.rowIndex || 0}`,
ref: (el) => {
lastEl = TemplateConstructor(el, AngularComponent, props, injector, lastEl);
}
});
};
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmVuZGVyZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWRhdGFncmlkL3NyYy9saWIvcmVuZGVyZXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7OztHQUdHO0FBQ0gsT0FBTyxFQUFFLFFBQVEsRUFBc0IsY0FBYyxFQUFFLGVBQWUsRUFBRSxtQkFBbUIsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFZM0gsU0FBUyxXQUFXLENBQW1CLEVBQWtCLEVBQUUsUUFBVztJQUNwRSxJQUFJLENBQUMsRUFBRSxDQUFDLFlBQVksRUFBRSxRQUFRLEVBQUUsQ0FBQztRQUMvQixPQUFPO0lBQ1QsQ0FBQztJQUdELCtFQUErRTtJQUMvRSxFQUFFLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEdBQUcsUUFBUSxDQUFDO0lBQzFDLEVBQUUsQ0FBQyxZQUFZLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxRQUFRLENBQUMsQ0FBQztJQUU1QyxnREFBZ0Q7SUFDaEQsSUFBSSxFQUFFLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUN6QyxNQUFNLGFBQWEsR0FBRyxFQUFFLENBQUMsWUFBWSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUM7UUFDckQsTUFBTSxhQUFhLEdBQUc7WUFDcEIsS0FBSyxFQUFFO2dCQUNMLGFBQWE7Z0JBQ2IsWUFBWSxFQUFFLFFBQVE7Z0JBQ3RCLFdBQVcsRUFBRSxhQUFhLEtBQUssU0FBUztnQkFDeEMsYUFBYSxFQUFFLEdBQUcsRUFBRSxDQUFDLGFBQWEsS0FBSyxTQUFTO2FBQ2pEO1NBQ0YsQ0FBQztRQUNGLEVBQUUsQ0FBQyxZQUFZLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxhQUFhLENBQUMsQ0FBQztJQUN0RCxDQUFDO0lBRUQsdUNBQXVDO0lBQ3ZDLEVBQUUsQ0FBQyxZQUFZLENBQUMsaUJBQWlCLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDakQsRUFBRSxDQUFDLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQztBQUNwRCxDQUFDO0FBRUQsTUFBTSxVQUFVLG1CQUFtQixDQUNqQyxFQUF5QixFQUN6QixnQkFBMkIsRUFDM0IsZUFBa0IsRUFBTyxFQUN6QixRQUFrQixFQUNsQixTQUFzQyxJQUFJO0lBRTFDLElBQUksQ0FBQyxFQUFFLEVBQUUsQ0FBQztRQUNSLE1BQU0sRUFBRSxPQUFPLEVBQUUsRUFBRSxDQUFDLENBQUUsNENBQTRDO1FBQ2xFLE9BQU8sSUFBSSxDQUFDO0lBQ2QsQ0FBQztJQUVELElBQUksQ0FBQyxFQUFFLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDckIsTUFBTSxjQUFjLEdBQUcsUUFBUSxDQUFDLEdBQUcsQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUNwRCxNQUFNLG1CQUFtQixHQUFHLFFBQVEsQ0FBQyxHQUFHLENBQUMsbUJBQW1CLENBQUMsQ0FBQztRQUM5RCxNQUFNLFlBQVksR0FBRyxlQUFlLENBQUMsZ0JBQWdCLEVBQUUsRUFBRSxtQkFBbUIsRUFBRSxDQUFDLENBQUM7UUFDaEYsY0FBYyxDQUFDLFVBQVUsQ0FBQyxZQUFZLENBQUMsUUFBUSxDQUFDLENBQUM7UUFDakQsWUFBWSxDQUFDLFFBQVEsQ0FBQyxLQUFLLEdBQUcsWUFBWSxDQUFDO1FBQzNDLFlBQVksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUMvQyxFQUFFLENBQUMsWUFBWSxHQUFHLFlBQVksQ0FBQyxDQUFFLGdDQUFnQztRQUNqRSxFQUFFLENBQUMsV0FBVyxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsYUFBYSxDQUFDLENBQUM7SUFDdEQsQ0FBQztTQUFNLElBQUksRUFBRSxDQUFDLFlBQVksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNwQyxXQUFXLENBQUMsRUFBRSxFQUFFLFlBQVksQ0FBQyxDQUFDO0lBQ2hDLENBQUM7SUFFRCxxQ0FBcUM7SUFDckMsTUFBTSxNQUFNLEdBQUcsQ0FBQyxRQUFXLEVBQUUsRUFBRSxDQUFDLFdBQVcsQ0FBQyxFQUFFLEVBQUUsUUFBUSxDQUFDLENBQUM7SUFFMUQsb0NBQW9DO0lBQ3BDLE1BQU0sT0FBTyxHQUFHLEdBQUcsRUFBRTtRQUNuQixFQUFFLENBQUMsWUFBWSxFQUFFLE9BQU8sRUFBRSxDQUFDO1FBQzNCLEVBQUUsQ0FBQyxZQUFZLEdBQUcsU0FBUyxDQUFDO0lBQzlCLENBQUMsQ0FBQztJQUVGLE9BQU8sRUFBRSxNQUFNLEVBQUUsT0FBTyxFQUFFLENBQUM7QUFDN0IsQ0FBQztBQUVELG9EQUFvRDtBQUNwRCxNQUFNLENBQUMsTUFBTSxRQUFRLEdBQUcsQ0FDdEIsZ0JBQTJCLEVBQzNCLFdBQWlCLEVBQ2pCLFFBQVEsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLEVBQzNCLEVBQUU7SUFDRixPQUFPLENBQUMsQ0FBTSxFQUFFLENBQTZDLEVBQUUsUUFBYyxFQUFFLEVBQUU7UUFDL0UsTUFBTSxLQUFLLEdBQUcsV0FBVyxDQUFDLENBQUMsQ0FBQyxFQUFFLEdBQUcsV0FBVyxFQUFFLEdBQUcsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztRQUN6RCxLQUFLLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztRQUMxQixJQUFJLE1BQU0sR0FBa0MsSUFBSSxDQUFDO1FBQ2pELE9BQU8sQ0FBQyxDQUFDLE1BQU0sRUFBRTtZQUNmLEdBQUcsRUFBRSxHQUFHLENBQUMsQ0FBQyxJQUFJLElBQUksQ0FBQyxDQUFDLFFBQVEsSUFBSSxDQUFDLEVBQUU7WUFDbkMsR0FBRyxFQUFFLENBQUMsRUFBeUIsRUFBRSxFQUFFO2dCQUNqQyxNQUFNLEdBQUcsbUJBQW1CLENBQUMsRUFBRSxFQUFFLGdCQUFnQixFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsTUFBTSxDQUFDLENBQUM7WUFDOUUsQ0FBQztTQUNGLENBQUMsQ0FBQztJQUNMLENBQUMsQ0FBQztBQUNKLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQW5ndWxhciBBZGFwdGVyIEZ1bmN0aW9uOlxuICogSGFuZGxlcyB0aGUgcmVuZGVyaW5nIGFuZCBsaWZlY3ljbGUgb2YgQW5ndWxhciBjb21wb25lbnRzIHdpdGhpbiBTdGVuY2lsSlMgdXNpbmcgdXBkYXRlZCBBbmd1bGFyIEFQSXMuXG4gKi9cbmltcG9ydCB7IEluamVjdG9yLCBDb21wb25lbnRSZWYsIFR5cGUsIEFwcGxpY2F0aW9uUmVmLCBjcmVhdGVDb21wb25lbnQsIEVudmlyb25tZW50SW5qZWN0b3IsIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29sdW1uRGF0YVNjaGVtYU1vZGVsLCBDb2x1bW5UZW1wbGF0ZVByb3AgfSBmcm9tICdAcmV2b2xpc3QvcmV2b2dyaWQnO1xuXG5leHBvcnQgaW50ZXJmYWNlIEFuZ3VsYXJFbGVtZW50IGV4dGVuZHMgSFRNTEVsZW1lbnQge1xuICBjb21wb25lbnRSZWY/OiBDb21wb25lbnRSZWY8YW55PjsgIC8vIFJlZmVyZW5jZSB0byB0aGUgQW5ndWxhciBjb21wb25lbnRcbn1cblxuZXhwb3J0IGludGVyZmFjZSBSZW5kZXJlZENvbXBvbmVudDxUPiB7XG4gIHVwZGF0ZTogKG5ld1Byb3BzOiBUKSA9PiB2b2lkOyAgICAgLy8gRnVuY3Rpb24gdG8gdXBkYXRlIGNvbXBvbmVudCB3aXRoIG5ldyBwcm9wc1xuICBkZXN0cm95OiAoKSA9PiB2b2lkOyAgICAgICAgICAgICAgIC8vIEZ1bmN0aW9uIHRvIGRlc3Ryb3kgdGhlIGNvbXBvbmVudFxufVxuXG5mdW5jdGlvbiB1cGRhdGVQcm9wczxUIGV4dGVuZHMgb2JqZWN0PihlbDogQW5ndWxhckVsZW1lbnQsIG5ld1Byb3BzOiBUKSB7XG4gIGlmICghZWwuY29tcG9uZW50UmVmPy5pbnN0YW5jZSkge1xuICAgIHJldHVybjtcbiAgfVxuICBcbiAgXG4gIC8vIFVwZGF0ZSBib3RoIHdheXMgdG8gZW5zdXJlIGl0IHdvcmtzIHdpdGggZGlmZmVyZW50IGNvbXBvbmVudCBpbXBsZW1lbnRhdGlvbnNcbiAgZWwuY29tcG9uZW50UmVmLmluc3RhbmNlLnByb3BzID0gbmV3UHJvcHM7XG4gIGVsLmNvbXBvbmVudFJlZi5zZXRJbnB1dCgncHJvcHMnLCBuZXdQcm9wcyk7XG4gIFxuICAvLyBIYW5kbGUgbmdPbkNoYW5nZXMgaWYgY29tcG9uZW50IGltcGxlbWVudHMgaXRcbiAgaWYgKGVsLmNvbXBvbmVudFJlZi5pbnN0YW5jZS5uZ09uQ2hhbmdlcykge1xuICAgIGNvbnN0IHByZXZpb3VzVmFsdWUgPSBlbC5jb21wb25lbnRSZWYuaW5zdGFuY2UucHJvcHM7XG4gICAgY29uc3Qgc2ltcGxlQ2hhbmdlcyA9IHtcbiAgICAgIHByb3BzOiB7XG4gICAgICAgIHByZXZpb3VzVmFsdWUsXG4gICAgICAgIGN1cnJlbnRWYWx1ZTogbmV3UHJvcHMsXG4gICAgICAgIGZpcnN0Q2hhbmdlOiBwcmV2aW91c1ZhbHVlID09PSB1bmRlZmluZWQsXG4gICAgICAgIGlzRmlyc3RDaGFuZ2U6ICgpID0+IHByZXZpb3VzVmFsdWUgPT09IHVuZGVmaW5lZFxuICAgICAgfVxuICAgIH07XG4gICAgZWwuY29tcG9uZW50UmVmLmluc3RhbmNlLm5nT25DaGFuZ2VzKHNpbXBsZUNoYW5nZXMpO1xuICB9XG4gIFxuICAvLyBGb3JjZSBjb21wb25lbnQgdG8gY2hlY2sgZm9yIHVwZGF0ZXNcbiAgZWwuY29tcG9uZW50UmVmLmNoYW5nZURldGVjdG9yUmVmLm1hcmtGb3JDaGVjaygpO1xuICBlbC5jb21wb25lbnRSZWYuY2hhbmdlRGV0ZWN0b3JSZWYuZGV0ZWN0Q2hhbmdlcygpO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gVGVtcGxhdGVDb25zdHJ1Y3RvcjxUIGV4dGVuZHMgT2JqZWN0PihcbiAgZWw6IEFuZ3VsYXJFbGVtZW50IHwgbnVsbCxcbiAgQW5ndWxhckNvbXBvbmVudDogVHlwZTxhbnk+LFxuICBpbml0aWFsUHJvcHM6IFQgPSB7fSBhcyBULFxuICBpbmplY3RvcjogSW5qZWN0b3IsXG4gIGxhc3RFbDogUmVuZGVyZWRDb21wb25lbnQ8VD4gfCBudWxsID0gbnVsbCxcbik6IFJlbmRlcmVkQ29tcG9uZW50PFQ+IHwgbnVsbCB7XG4gIGlmICghZWwpIHtcbiAgICBsYXN0RWw/LmRlc3Ryb3k/LigpOyAgLy8gRGVzdHJveSBsYXN0IGNvbXBvbmVudCBpZiBlbGVtZW50IGlzIG51bGxcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIGlmICghZWwuY29tcG9uZW50UmVmKSB7XG4gICAgY29uc3QgYXBwbGljYXRpb25SZWYgPSBpbmplY3Rvci5nZXQoQXBwbGljYXRpb25SZWYpO1xuICAgIGNvbnN0IGVudmlyb25tZW50SW5qZWN0b3IgPSBpbmplY3Rvci5nZXQoRW52aXJvbm1lbnRJbmplY3Rvcik7XG4gICAgY29uc3QgY29tcG9uZW50UmVmID0gY3JlYXRlQ29tcG9uZW50KEFuZ3VsYXJDb21wb25lbnQsIHsgZW52aXJvbm1lbnRJbmplY3RvciB9KTtcbiAgICBhcHBsaWNhdGlvblJlZi5hdHRhY2hWaWV3KGNvbXBvbmVudFJlZi5ob3N0Vmlldyk7XG4gICAgY29tcG9uZW50UmVmLmluc3RhbmNlLnByb3BzID0gaW5pdGlhbFByb3BzO1xuICAgIGNvbXBvbmVudFJlZi5jaGFuZ2VEZXRlY3RvclJlZi5kZXRlY3RDaGFuZ2VzKCk7XG4gICAgZWwuY29tcG9uZW50UmVmID0gY29tcG9uZW50UmVmOyAgLy8gU3RvcmUgdGhlIGNvbXBvbmVudCByZWZlcmVuY2VcbiAgICBlbC5hcHBlbmRDaGlsZChjb21wb25lbnRSZWYubG9jYXRpb24ubmF0aXZlRWxlbWVudCk7XG4gIH0gZWxzZSBpZiAoZWwuY29tcG9uZW50UmVmLmluc3RhbmNlKSB7XG4gICAgdXBkYXRlUHJvcHMoZWwsIGluaXRpYWxQcm9wcyk7XG4gIH1cblxuICAvLyBGdW5jdGlvbiB0byB1cGRhdGUgY29tcG9uZW50IHByb3BzXG4gIGNvbnN0IHVwZGF0ZSA9IChuZXdQcm9wczogVCkgPT4gdXBkYXRlUHJvcHMoZWwsIG5ld1Byb3BzKTtcblxuICAvLyBGdW5jdGlvbiB0byBkZXN0cm95IHRoZSBjb21wb25lbnRcbiAgY29uc3QgZGVzdHJveSA9ICgpID0+IHtcbiAgICBlbC5jb21wb25lbnRSZWY/LmRlc3Ryb3koKTtcbiAgICBlbC5jb21wb25lbnRSZWYgPSB1bmRlZmluZWQ7XG4gIH07XG5cbiAgcmV0dXJuIHsgdXBkYXRlLCBkZXN0cm95IH07XG59XG5cbi8vIEZ1bmN0aW9uIHRvIGNyZWF0ZSB0ZW1wbGF0ZSBmb3IgQW5ndWxhciBjb21wb25lbnRcbmV4cG9ydCBjb25zdCBUZW1wbGF0ZSA9IChcbiAgQW5ndWxhckNvbXBvbmVudDogVHlwZTxhbnk+LFxuICBjdXN0b21Qcm9wcz86IGFueSxcbiAgaW5qZWN0b3IgPSBpbmplY3QoSW5qZWN0b3IpXG4pID0+IHtcbiAgcmV0dXJuIChoOiBhbnksIHA6IENvbHVtbkRhdGFTY2hlbWFNb2RlbCB8IENvbHVtblRlbXBsYXRlUHJvcCwgYWRkaXRpb24/OiBhbnkpID0+IHtcbiAgICBjb25zdCBwcm9wcyA9IGN1c3RvbVByb3BzID8geyAuLi5jdXN0b21Qcm9wcywgLi4ucCB9IDogcDtcbiAgICBwcm9wcy5hZGRpdGlvbiA9IGFkZGl0aW9uO1xuICAgIGxldCBsYXN0RWw6IFJlbmRlcmVkQ29tcG9uZW50PGFueT4gfCBudWxsID0gbnVsbDtcbiAgICByZXR1cm4gaCgnc3BhbicsIHtcbiAgICAgIGtleTogYCR7cC5wcm9wfS0ke3Aucm93SW5kZXggfHwgMH1gLFxuICAgICAgcmVmOiAoZWw6IEFuZ3VsYXJFbGVtZW50IHwgbnVsbCkgPT4ge1xuICAgICAgICBsYXN0RWwgPSBUZW1wbGF0ZUNvbnN0cnVjdG9yKGVsLCBBbmd1bGFyQ29tcG9uZW50LCBwcm9wcywgaW5qZWN0b3IsIGxhc3RFbCk7XG4gICAgICB9XG4gICAgfSk7XG4gIH07XG59O1xuIl19