@simple-table/angular 4.2.2 → 4.2.4

package/dist/fesm2022/simple-table-angular.mjs

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
-import { reflectComponentType, createComponent, EventEmitter, inject, ElementRef, ApplicationRef, EnvironmentInjector, Output, Input, Component, makeEnvironmentProviders } from '@angular/core';
+import { reflectComponentType, createComponent, inject, TemplateRef, Input, Directive, ElementRef, EventEmitter, ApplicationRef, EnvironmentInjector, Injector, NgZone, ContentChildren, Output, ChangeDetectionStrategy, Component, NgModule, makeEnvironmentProviders } from '@angular/core';
 import { collectHeaderAccessors, asRows, SimpleTableVanilla, headersStructurallyEqual, rowsShallowUnchanged } from 'simple-table-core';
 export { PIVOT_ACCESSOR_PREFIX, PIVOT_BLANK_LABEL, PIVOT_IS_TOTAL_KEY, asRows, buildPivotAccessor, buildPivotRowTotalAccessor, pivotRows } from 'simple-table-core';
 
-const ST_RENDERER_GENERATION = Symbol.for("simple-table.rendererGeneration");
+const ST_RENDERER_GENERATION$1 = Symbol.for("simple-table.rendererGeneration");
 /** Declared `@Input` / `input()` names for a component type (template + prop). */
 function declaredInputNames(component) {
     const mirror = reflectComponentType(component);
@@ -36,16 +36,17 @@ function applyComponentProps(componentRef, props) {
     }
     componentRef.changeDetectorRef.detectChanges();
 }
-function mountAngularComponent(component, props, appRef, injector, registry, host) {
+function mountAngularComponent(component, props, options, host) {
     const el = host ?? document.createElement("div");
     const componentRef = createComponent(component, {
-        environmentInjector: injector,
+        environmentInjector: options.envInjector,
+        elementInjector: options.elementInjector,
         hostElement: el,
     });
     applyComponentProps(componentRef, props);
-    appRef.attachView(componentRef.hostView);
-    registry?.register(el, () => {
-        appRef.detachView(componentRef.hostView);
+    options.appRef.attachView(componentRef.hostView);
+    options.registry?.register(el, () => {
+        options.appRef.detachView(componentRef.hostView);
         componentRef.destroy();
     });
     return { host: el, componentRef };
@@ -63,14 +64,20 @@ function mountAngularComponent(component, props, appRef, injector, registry, hos
  * Pass an optional {@link MountRegistry} so core's `onRendererHostDiscard` can
  * destroy the ComponentRef (including any CDK Overlay / floating UI) when the
  * host is discarded. The table adapter always supplies a registry; the public
- * helper used for one-shot static slots (e.g. `tableEmptyStateRenderer`) may omit it.
- *
- * These are injected automatically when the consumer uses
- * `provideSimpleTable()` in their application providers.
+ * helper used for one-shot static slots may omit it. Pass `elementInjector` so
+ * dynamically created components see providers on ancestors of `<simple-table>`.
+ * `ApplicationRef` and `EnvironmentInjector` come from Angular's injector;
+ * `provideSimpleTable()` is optional.
  */
-function wrapAngularRenderer(component, appRef, injector, registry) {
+function wrapAngularRenderer(component, appRef, injector, registry, elementInjector) {
+    const options = {
+        appRef,
+        envInjector: injector,
+        registry,
+        elementInjector,
+    };
     return (props) => {
-        return mountAngularComponent(component, props, appRef, injector, registry).host;
+        return mountAngularComponent(component, props, options).host;
     };
 }
 /**
@@ -79,15 +86,16 @@ function wrapAngularRenderer(component, appRef, injector, registry) {
  * and wiping local state. Mirrors Vue's {@link wrapVueHeaderRenderer} /
  * React's wrapReactHeaderRenderer.
  */
-function wrapAngularHeaderRenderer(component, appRef, injector, registry) {
+function wrapAngularHeaderRenderer(component, options) {
+    const registry = options.registry;
     let host = null;
     let componentRef = null;
     return (props) => {
-        if (host && componentRef && registry.isRegistered(host)) {
+        if (host && componentRef && registry?.isRegistered(host)) {
             applyComponentProps(componentRef, props);
             return host;
         }
-        const mounted = mountAngularComponent(component, props, appRef, injector, registry);
+        const mounted = mountAngularComponent(component, props, options);
         host = mounted.host;
         componentRef = mounted.componentRef;
         return host;
@@ -100,14 +108,18 @@ function wrapAngularHeaderRenderer(component, appRef, injector, registry) {
  * For `kind: "header"`, also reuses a single mount host so sort/filter
  * refreshes preserve Angular component state.
  */
-function wrapCachedAngularRenderer(component, appRef, injector, registry, accessor, kind) {
+function wrapCachedAngularRenderer(component, options, accessor, kind) {
+    const registry = options.registry;
+    if (!registry) {
+        throw new Error("wrapCachedAngularRenderer requires a MountRegistry");
+    }
     const cache = kind === "cell" ? registry.cellRendererCache : registry.headerRendererCache;
     const existing = cache.get(accessor);
     if (existing) {
         if (kind === "cell" && existing.component !== component) {
             existing.component = component;
-            const current = existing.wrapped[ST_RENDERER_GENERATION];
-            existing.wrapped[ST_RENDERER_GENERATION] =
+            const current = existing.wrapped[ST_RENDERER_GENERATION$1];
+            existing.wrapped[ST_RENDERER_GENERATION$1] =
                 (typeof current === "number" ? current : 0) + 1;
         }
         else {
@@ -127,7 +139,7 @@ function wrapCachedAngularRenderer(component, appRef, injector, registry, access
                 applyComponentProps(componentRef, props);
                 return host;
             }
-            const mounted = mountAngularComponent(slot.component, props, appRef, injector, registry);
+            const mounted = mountAngularComponent(slot.component, props, options);
             host = mounted.host;
             componentRef = mounted.componentRef;
             return host;
@@ -137,10 +149,10 @@ function wrapCachedAngularRenderer(component, appRef, injector, registry, access
         return wrapped;
     }
     const wrapped = (props) => {
-        return mountAngularComponent(slot.component, props, appRef, injector, registry).host;
+        return mountAngularComponent(slot.component, props, options).host;
     };
     slot.wrapped = wrapped;
-    wrapped[ST_RENDERER_GENERATION] = 0;
+    wrapped[ST_RENDERER_GENERATION$1] = 0;
     cache.set(accessor, slot);
     return wrapped;
 }
@@ -148,21 +160,155 @@ function wrapCachedAngularRenderer(component, appRef, injector, registry, access
  * Column-editor row renderer: one host per `accessor` so popout list rebuilds
  * update in place instead of remounting Angular state (mirrors Vue/React).
  */
-function wrapAngularColumnEditorRowRenderer(component, appRef, injector, registry) {
+function wrapAngularColumnEditorRowRenderer(component, options) {
+    const registry = options.registry;
     const mounts = new Map();
     return (props) => {
         const key = String(props.accessor);
         const existing = mounts.get(key);
-        if (existing && registry.isRegistered(existing.host)) {
+        if (existing && registry?.isRegistered(existing.host)) {
             applyComponentProps(existing.componentRef, props);
             return existing.host;
         }
-        const mounted = mountAngularComponent(component, props, appRef, injector, registry);
+        const mounted = mountAngularComponent(component, props, options);
         mounts.set(key, mounted);
         return mounted.host;
     };
 }
 
+const ST_RENDERER_GENERATION = Symbol.for("simple-table.rendererGeneration");
+function applyTemplateContext(view, next) {
+    const ctx = view.context;
+    for (const key of Object.keys(ctx)) {
+        if (!(key in next)) {
+            delete ctx[key];
+        }
+    }
+    Object.assign(ctx, next);
+    view.detectChanges();
+}
+function mountEmbeddedView(template, context, options) {
+    const host = document.createElement("div");
+    const view = (options.elementInjector
+        ? template.createEmbeddedView(context, options.elementInjector)
+        : template.createEmbeddedView(context));
+    view.detectChanges();
+    options.appRef.attachView(view);
+    for (const node of view.rootNodes) {
+        host.appendChild(node);
+    }
+    options.registry?.register(host, () => {
+        options.appRef.detachView(view);
+        view.destroy();
+    });
+    return { host, view };
+}
+/**
+ * Turns an `ng-template` into a core renderer: create the view, attach it so
+ * clicks and bindings work, and tear it down when the table discards the host.
+ */
+function wrapAngularTemplate(template, options, mapContext) {
+    return (props) => {
+        return mountEmbeddedView(template, mapContext(props), options).host;
+    };
+}
+/**
+ * Stable wrapper per column accessor so rebuilds do not swap renderer identity.
+ * Header views update in place when the same template is still mounted.
+ */
+function wrapCachedAngularTemplate(template, options, accessor, kind, mapContext) {
+    const registry = options.registry;
+    if (!registry) {
+        throw new Error("wrapCachedAngularTemplate requires a MountRegistry");
+    }
+    const cache = kind === "cell" ? registry.cellTemplateCache : registry.headerTemplateCache;
+    const existing = cache.get(accessor);
+    if (existing) {
+        if (kind === "cell" && existing.component !== template) {
+            existing.component = template;
+            const current = existing.wrapped[ST_RENDERER_GENERATION];
+            existing.wrapped[ST_RENDERER_GENERATION] =
+                (typeof current === "number" ? current : 0) + 1;
+        }
+        else {
+            existing.component = template;
+        }
+        return existing.wrapped;
+    }
+    const slot = {
+        component: template,
+        wrapped: null,
+    };
+    if (kind === "header") {
+        let host = null;
+        let view = null;
+        let mountedTemplate = null;
+        const wrapped = (props) => {
+            const ctx = mapContext(props);
+            if (host &&
+                view &&
+                registry.isRegistered(host) &&
+                mountedTemplate === slot.component) {
+                applyTemplateContext(view, ctx);
+                return host;
+            }
+            const mounted = mountEmbeddedView(slot.component, ctx, options);
+            host = mounted.host;
+            view = mounted.view;
+            mountedTemplate = slot.component;
+            return host;
+        };
+        slot.wrapped = wrapped;
+        cache.set(accessor, slot);
+        return wrapped;
+    }
+    const wrapped = (props) => {
+        return mountEmbeddedView(slot.component, mapContext(props), options).host;
+    };
+    slot.wrapped = wrapped;
+    wrapped[ST_RENDERER_GENERATION] = 0;
+    cache.set(accessor, slot);
+    return wrapped;
+}
+function cellTemplateContext(props) {
+    const record = props;
+    return {
+        $implicit: record.row,
+        ...record,
+    };
+}
+function headerTemplateContext(props) {
+    const record = props;
+    return {
+        $implicit: record.header,
+        ...record,
+    };
+}
+function footerTemplateContext(props) {
+    const record = props;
+    return {
+        $implicit: record.currentPage,
+        ...record,
+    };
+}
+function loadingTemplateContext(props) {
+    const record = props;
+    return {
+        $implicit: record.parentRow,
+        ...record,
+    };
+}
+function errorTemplateContext(props) {
+    const record = props;
+    return {
+        $implicit: record.error,
+        ...record,
+    };
+}
+function emptyTemplateContext(_props) {
+    return {};
+}
+
 /** Resolve column definitions. */
 function resolveAngularColumns(config) {
     const headers = config.columns;
@@ -171,9 +317,46 @@ function resolveAngularColumns(config) {
     }
     return headers;
 }
-function buildVanillaConfig(config, registry, appRef, injector) {
+function resolveTableEmptyState(value, wrap, registry) {
+    if (value === null) {
+        if (registry.tableEmptyStateMount) {
+            registry.disposeHost(registry.tableEmptyStateMount.host);
+            registry.tableEmptyStateMount = null;
+        }
+        return null;
+    }
+    if (value.ɵcmp) {
+        return () => {
+            const existing = registry.tableEmptyStateMount;
+            if (existing &&
+                existing.component === value &&
+                registry.isRegistered(existing.host)) {
+                return existing.host;
+            }
+            if (existing) {
+                registry.disposeHost(existing.host);
+                registry.tableEmptyStateMount = null;
+            }
+            const host = wrap(value)({});
+            registry.tableEmptyStateMount = { component: value, host };
+            return host;
+        };
+    }
+    if (registry.tableEmptyStateMount) {
+        registry.disposeHost(registry.tableEmptyStateMount.host);
+        registry.tableEmptyStateMount = null;
+    }
+    return value;
+}
+function buildVanillaConfig(config, registry, appRef, injector, elementInjector, slots) {
     const { columns: _columns, rows, footerRenderer, emptyStateRenderer, errorStateRenderer, loadingStateRenderer, tableEmptyStateRenderer, headerDropdown, columnEditorConfig, icons, rowButtons, onColumnOrderChange, onColumnWidthChange, onHeaderEdit, onColumnSelect, enableColumnEditor, enableColumnEditorInitOpen, enablePagination, onTableReady, hoverRowBackground, oddColumnBackground, oddEvenRowBackground, ...rest } = config;
-    const wrap = (component) => wrapAngularRenderer(component, appRef, injector, registry);
+    const mountOptions = {
+        appRef,
+        envInjector: injector,
+        registry,
+        elementInjector,
+    };
+    const wrap = (component) => wrapAngularRenderer(component, appRef, injector, registry, elementInjector);
     function transformIcons(iconsConfig) {
         const result = {};
         for (const [key, value] of Object.entries(iconsConfig)) {
@@ -199,7 +382,7 @@ function buildVanillaConfig(config, registry, appRef, injector) {
             ...cfgRest,
             ...(rowRenderer
                 ? {
-                    rowRenderer: wrapAngularColumnEditorRowRenderer(rowRenderer, appRef, injector, registry),
+                    rowRenderer: wrapAngularColumnEditorRowRenderer(rowRenderer, mountOptions),
                 }
                 : {}),
             ...(customRenderer ? { customRenderer: wrap(customRenderer) } : {}),
@@ -209,17 +392,25 @@ function buildVanillaConfig(config, registry, appRef, injector) {
         const { cellRenderer, headerRenderer, children, nestedTable, ...headerRest } = header;
         const accessor = String(header.accessor);
         const transformed = { ...headerRest };
-        if (cellRenderer) {
+        const cellTemplate = slots?.cellTemplates?.get(accessor);
+        if (cellTemplate) {
+            transformed.cellRenderer = wrapCachedAngularTemplate(cellTemplate, mountOptions, accessor, "cell", cellTemplateContext);
+        }
+        else if (cellRenderer) {
             if (cellRenderer.ɵcmp) {
-                transformed.cellRenderer = wrapCachedAngularRenderer(cellRenderer, appRef, injector, registry, accessor, "cell");
+                transformed.cellRenderer = wrapCachedAngularRenderer(cellRenderer, mountOptions, accessor, "cell");
             }
             else {
                 transformed.cellRenderer = cellRenderer;
             }
         }
-        if (headerRenderer) {
+        const headerTemplate = slots?.headerTemplates?.get(accessor);
+        if (headerTemplate) {
+            transformed.headerRenderer = wrapCachedAngularTemplate(headerTemplate, mountOptions, accessor, "header", headerTemplateContext);
+        }
+        else if (headerRenderer) {
             if (headerRenderer.ɵcmp) {
-                transformed.headerRenderer = wrapCachedAngularRenderer(headerRenderer, appRef, injector, registry, accessor, "header");
+                transformed.headerRenderer = wrapCachedAngularRenderer(headerRenderer, mountOptions, accessor, "header");
             }
             else {
                 transformed.headerRenderer = headerRenderer;
@@ -229,7 +420,7 @@ function buildVanillaConfig(config, registry, appRef, injector) {
             transformed.children = children.map(transformHeader);
         if (nestedTable) {
             const nestedFull = { ...nestedTable, rows: [] };
-            transformed.nestedTable = buildVanillaConfig(nestedFull, registry, appRef, injector);
+            transformed.nestedTable = buildVanillaConfig(nestedFull, registry, appRef, injector, elementInjector);
         }
         return transformed;
     }
@@ -266,7 +457,10 @@ function buildVanillaConfig(config, registry, appRef, injector) {
     if (onColumnSelect) {
         vanillaConfig.onColumnSelect = (header) => onColumnSelect(header);
     }
-    if (footerRenderer !== undefined) {
+    if (slots?.footerTemplate) {
+        vanillaConfig.footerRenderer = wrapAngularTemplate(slots.footerTemplate, mountOptions, footerTemplateContext);
+    }
+    else if (footerRenderer !== undefined) {
         if (footerRenderer.ɵcmp) {
             vanillaConfig.footerRenderer = wrap(footerRenderer);
         }
@@ -282,7 +476,10 @@ function buildVanillaConfig(config, registry, appRef, injector) {
             vanillaConfig.emptyStateRenderer = emptyStateRenderer;
         }
     }
-    if (errorStateRenderer !== undefined) {
+    if (slots?.errorTemplate) {
+        vanillaConfig.errorStateRenderer = wrapAngularTemplate(slots.errorTemplate, mountOptions, errorTemplateContext);
+    }
+    else if (errorStateRenderer !== undefined) {
         if (errorStateRenderer.ɵcmp) {
             vanillaConfig.errorStateRenderer = wrap(errorStateRenderer);
         }
@@ -290,7 +487,10 @@ function buildVanillaConfig(config, registry, appRef, injector) {
             vanillaConfig.errorStateRenderer = errorStateRenderer;
         }
     }
-    if (loadingStateRenderer !== undefined) {
+    if (slots?.loadingTemplate) {
+        vanillaConfig.loadingStateRenderer = wrapAngularTemplate(slots.loadingTemplate, mountOptions, loadingTemplateContext);
+    }
+    else if (loadingStateRenderer !== undefined) {
         if (loadingStateRenderer.ɵcmp) {
             vanillaConfig.loadingStateRenderer = wrap(loadingStateRenderer);
         }
@@ -298,8 +498,12 @@ function buildVanillaConfig(config, registry, appRef, injector) {
             vanillaConfig.loadingStateRenderer = loadingStateRenderer;
         }
     }
-    if (tableEmptyStateRenderer !== undefined) {
-        vanillaConfig.tableEmptyStateRenderer = tableEmptyStateRenderer;
+    if (slots?.emptyTemplate) {
+        const renderEmpty = wrapAngularTemplate(slots.emptyTemplate, mountOptions, emptyTemplateContext);
+        vanillaConfig.tableEmptyStateRenderer = () => renderEmpty({});
+    }
+    else if (tableEmptyStateRenderer !== undefined) {
+        vanillaConfig.tableEmptyStateRenderer = resolveTableEmptyState(tableEmptyStateRenderer, wrap, registry);
     }
     if (headerDropdown !== undefined) {
         vanillaConfig.headerDropdown = wrap(headerDropdown);
@@ -327,6 +531,10 @@ class MountRegistry {
         this.nextId = 0;
         this.cellRendererCache = new Map();
         this.headerRendererCache = new Map();
+        this.cellTemplateCache = new Map();
+        this.headerTemplateCache = new Map();
+        /** One-shot `tableEmptyStateRenderer` component mount, reused across config rebuilds. */
+        this.tableEmptyStateMount = null;
         this.disposeHost = (host) => {
             if (typeof host.getAttribute !== "function")
                 return;
@@ -364,19 +572,25 @@ class MountRegistry {
     clear() {
         this.cellRendererCache.clear();
         this.headerRendererCache.clear();
+        this.cellTemplateCache.clear();
+        this.headerTemplateCache.clear();
+        this.tableEmptyStateMount = null;
         for (const dispose of this.entries.values()) {
             dispose();
         }
         this.entries.clear();
     }
     pruneRendererCaches(liveAccessors) {
-        for (const key of this.cellRendererCache.keys()) {
-            if (!liveAccessors.has(key))
-                this.cellRendererCache.delete(key);
-        }
-        for (const key of this.headerRendererCache.keys()) {
-            if (!liveAccessors.has(key))
-                this.headerRendererCache.delete(key);
+        for (const cache of [
+            this.cellRendererCache,
+            this.headerRendererCache,
+            this.cellTemplateCache,
+            this.headerTemplateCache,
+        ]) {
+            for (const key of cache.keys()) {
+                if (!liveAccessors.has(key))
+                    cache.delete(key);
+            }
         }
     }
     get size() {
@@ -384,6 +598,150 @@ class MountRegistry {
     }
 }
 
+/**
+ * Page-template cell for a column, matched by `accessor`.
+ * Context: `$implicit` is `row`; also `value`, `formattedValue`, and the rest of
+ * the core cell renderer props.
+ */
+class StCellDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StCellDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StCellDirective, isStandalone: true, selector: "ng-template[stCell]", inputs: { stCell: "stCell" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StCellDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stCell]",
+                    standalone: true,
+                }]
+        }], propDecorators: { stCell: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+/**
+ * Page-template header for a column, matched by `accessor`.
+ * Context: `$implicit` is `header`; also `components` (sort/filter icons).
+ */
+class StHeaderDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StHeaderDirective, isStandalone: true, selector: "ng-template[stHeader]", inputs: { stHeader: "stHeader" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StHeaderDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stHeader]",
+                    standalone: true,
+                }]
+        }], propDecorators: { stHeader: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+/** Whole-table empty UI. Shown when there are no rows. */
+class StEmptyDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StEmptyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StEmptyDirective, isStandalone: true, selector: "ng-template[stEmpty]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StEmptyDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stEmpty]",
+                    standalone: true,
+                }]
+        }] });
+/** Pagination / custom footer. Context matches core footer renderer props. */
+class StFooterDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StFooterDirective, isStandalone: true, selector: "ng-template[stFooter]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StFooterDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stFooter]",
+                    standalone: true,
+                }]
+        }] });
+/** Nested-group loading row (not the table-level skeleton `isLoading` flag). */
+class StLoadingDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StLoadingDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StLoadingDirective, isStandalone: true, selector: "ng-template[stLoading]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StLoadingDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stLoading]",
+                    standalone: true,
+                }]
+        }] });
+/** Nested-group error row. */
+class StErrorDirective {
+    constructor() {
+        this.templateRef = inject(TemplateRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StErrorDirective, isStandalone: true, selector: "ng-template[stError]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StErrorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "ng-template[stError]",
+                    standalone: true,
+                }]
+        }] });
+/**
+ * Opt-in: put a core-built DOM node (sort icon, filter icon, …) into the host.
+ * Clones the node so the table can still own the original.
+ */
+class StDomSlotDirective {
+    constructor() {
+        this.host = inject(ElementRef);
+    }
+    ngOnChanges() {
+        this.sync();
+    }
+    ngOnDestroy() {
+        this.host.nativeElement.replaceChildren();
+    }
+    sync() {
+        const el = this.host.nativeElement;
+        el.replaceChildren();
+        const slot = this.stDomSlot;
+        if (slot == null)
+            return;
+        if (typeof slot === "string") {
+            el.textContent = slot;
+            return;
+        }
+        if (slot instanceof Node) {
+            el.appendChild(slot.cloneNode(true));
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StDomSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.27", type: StDomSlotDirective, isStandalone: true, selector: "[stDomSlot]", inputs: { stDomSlot: "stDomSlot" }, usesOnChanges: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: StDomSlotDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: "[stDomSlot]",
+                    standalone: true,
+                }]
+        }], propDecorators: { stDomSlot: [{
+                type: Input
+            }] } });
+
 /**
  * SimpleTable — Angular adapter for simple-table-core.
  *
@@ -393,18 +751,44 @@ class MountRegistry {
  * Prefer typed `rows` / `columns` (`AngularColumnDef<MyRow>`). For a typed
  * imperative handle, use `@ViewChild(SimpleTableComponent) table!: SimpleTableComponent<MyRow>`
  * or listen to `(tableReady)`.
+ *
+ * Page templates (`stCell`, `stEmpty`, …) and `(sortChange)`-style outputs are
+ * the native Angular API. Import `SimpleTableImports` on the page. `class` on
+ * this host styles the wrapper; `[className]` styles the inner grid root.
  */
 class SimpleTableComponent {
     constructor() {
         /** Emits the TableAPI once the table has mounted. */
         this.tableReady = new EventEmitter();
+        this.cellClick = new EventEmitter();
+        this.cellEdit = new EventEmitter();
+        this.sortChange = new EventEmitter();
+        this.filterChange = new EventEmitter();
+        this.rowSelectionChange = new EventEmitter();
+        this.rowGroupExpand = new EventEmitter();
+        this.columnOrderChange = new EventEmitter();
+        this.columnVisibilityChange = new EventEmitter();
+        this.columnWidthChange = new EventEmitter();
+        this.pageChange = new EventEmitter();
+        this.loadMore = new EventEmitter();
+        this.headerEdit = new EventEmitter();
+        this.columnSelect = new EventEmitter();
+        this.pivotChange = new EventEmitter();
         this.instance = null;
         this.registry = new MountRegistry();
+        this.syncedSlotsKey = "";
         this.wasLoading = false;
         this.didInitialAutoSize = false;
+        this.slotUnsub = [];
         this.hostEl = inject((ElementRef));
         this.appRef = inject(ApplicationRef);
         this.envInjector = inject(EnvironmentInjector);
+        this.elementInjector = inject(Injector);
+        this.ngZone = inject(NgZone);
+    }
+    // Run table event callbacks in Angular's zone so the page template updates.
+    inZone(work) {
+        return this.ngZone.run(work);
     }
     maybeRefitAutoSizeColumns(leftLoading) {
         if (!this.instance)
@@ -420,29 +804,71 @@ class SimpleTableComponent {
             this.instance.refitAutoSizeColumns?.();
         }
     }
-    ngOnInit() {
+    collectSlots() {
+        const cellTemplates = new Map();
+        for (const slot of this.cellSlots ?? []) {
+            cellTemplates.set(slot.stCell, slot.templateRef);
+        }
+        const headerTemplates = new Map();
+        for (const slot of this.headerSlots ?? []) {
+            headerTemplates.set(slot.stHeader, slot.templateRef);
+        }
+        return {
+            cellTemplates,
+            headerTemplates,
+            emptyTemplate: this.emptySlots?.last?.templateRef,
+            footerTemplate: this.footerSlots?.last?.templateRef,
+            loadingTemplate: this.loadingSlots?.last?.templateRef,
+            errorTemplate: this.errorSlots?.last?.templateRef,
+        };
+    }
+    slotsFingerprint(slots) {
+        const cells = [...(slots.cellTemplates?.keys() ?? [])].sort().join(",");
+        const headers = [...(slots.headerTemplates?.keys() ?? [])].sort().join(",");
+        return [
+            `c:${cells}`,
+            `h:${headers}`,
+            `e:${slots.emptyTemplate ? 1 : 0}`,
+            `f:${slots.footerTemplate ? 1 : 0}`,
+            `l:${slots.loadingTemplate ? 1 : 0}`,
+            `r:${slots.errorTemplate ? 1 : 0}`,
+        ].join("|");
+    }
+    buildConfig() {
+        const props = this.getProps();
+        const slots = this.collectSlots();
+        return {
+            props,
+            slots,
+            slotsKey: this.slotsFingerprint(slots),
+            fullConfig: buildVanillaConfig(props, this.registry, this.appRef, this.envInjector, this.elementInjector, slots),
+        };
+    }
+    mountTable() {
         const container = this.hostEl.nativeElement.querySelector("div");
         if (!container)
             return;
-        const props = this.getProps();
-        this.instance = new SimpleTableVanilla(container, buildVanillaConfig(props, this.registry, this.appRef, this.envInjector));
+        const { props, slotsKey, fullConfig } = this.buildConfig();
+        this.instance = new SimpleTableVanilla(container, fullConfig);
         this.instance.mount();
         this.syncedDefaultHeaders = resolveAngularColumns(props);
         this.syncedRows = props.rows;
+        this.syncedSlotsKey = slotsKey;
         this.wasLoading = Boolean(props.isLoading);
         this.maybeRefitAutoSizeColumns(false);
         this.tableReady.emit(this.instance.getAPI());
     }
-    ngOnChanges() {
+    applyConfig() {
         if (!this.instance)
             return;
-        const props = this.getProps();
-        const fullConfig = buildVanillaConfig(props, this.registry, this.appRef, this.envInjector);
+        const { props, slotsKey, fullConfig } = this.buildConfig();
         const patch = { ...fullConfig };
         const resolvedColumns = resolveAngularColumns(props);
         const headersUnchanged = headersStructurallyEqual(this.syncedDefaultHeaders, resolvedColumns);
         this.syncedDefaultHeaders = resolvedColumns;
-        if (headersUnchanged) {
+        const slotsChanged = slotsKey !== this.syncedSlotsKey;
+        this.syncedSlotsKey = slotsKey;
+        if (headersUnchanged && !slotsChanged) {
             delete patch.columns;
         }
         const rowsUnchanged = rowsShallowUnchanged(this.syncedRows, props.rows, props.getRowId);
@@ -456,7 +882,27 @@ class SimpleTableComponent {
         this.instance.update(patch);
         this.maybeRefitAutoSizeColumns(leftLoading);
     }
+    ngAfterContentInit() {
+        this.mountTable();
+        const lists = [
+            this.cellSlots,
+            this.headerSlots,
+            this.emptySlots,
+            this.footerSlots,
+            this.loadingSlots,
+            this.errorSlots,
+        ];
+        for (const list of lists) {
+            this.slotUnsub.push(list.changes.subscribe(() => this.applyConfig()));
+        }
+    }
+    ngOnChanges() {
+        this.applyConfig();
+    }
     ngOnDestroy() {
+        for (const sub of this.slotUnsub)
+            sub.unsubscribe();
+        this.slotUnsub = [];
         this.instance?.destroy();
         this.instance = null;
         this.syncedDefaultHeaders = undefined;
@@ -487,38 +933,26 @@ class SimpleTableComponent {
             props.headerDropdown = this.headerDropdown;
         if (this.columnEditorConfig !== undefined)
             props.columnEditorConfig = this.columnEditorConfig;
-        if (this.onCellClick !== undefined)
-            props.onCellClick = this.onCellClick;
-        if (this.onCellEdit !== undefined)
-            props.onCellEdit = this.onCellEdit;
-        if (this.onSortChange !== undefined)
-            props.onSortChange = this.onSortChange;
-        if (this.onFilterChange !== undefined)
-            props.onFilterChange = this.onFilterChange;
-        if (this.onRowSelectionChange !== undefined)
-            props.onRowSelectionChange = this.onRowSelectionChange;
-        if (this.onRowGroupExpand !== undefined)
-            props.onRowGroupExpand = this.onRowGroupExpand;
-        if (this.onColumnOrderChange !== undefined)
-            props.onColumnOrderChange = this.onColumnOrderChange;
-        if (this.onColumnVisibilityChange !== undefined)
-            props.onColumnVisibilityChange = this.onColumnVisibilityChange;
-        if (this.onColumnWidthChange !== undefined)
-            props.onColumnWidthChange = this.onColumnWidthChange;
-        if (this.onPageChange !== undefined)
-            props.onPageChange = this.onPageChange;
-        if (this.onLoadMore !== undefined)
-            props.onLoadMore = this.onLoadMore;
+        if (this.onNextPage !== undefined)
+            props.onNextPage = this.onNextPage;
         if (this.onTableReady !== undefined)
             props.onTableReady = this.onTableReady;
         if (this.rowGrouping !== undefined)
             props.rowGrouping = this.rowGrouping;
+        if (this.canExpandRowGroup !== undefined)
+            props.canExpandRowGroup = this.canExpandRowGroup;
+        if (this.enableStickyParents !== undefined)
+            props.enableStickyParents = this.enableStickyParents;
         if (this.pivot !== undefined)
             props.pivot = this.pivot;
-        if (this.onPivotChange !== undefined)
-            props.onPivotChange = this.onPivotChange;
         if (this.enableRowSelection !== undefined)
             props.enableRowSelection = this.enableRowSelection;
+        if (this.rowSelectionMode !== undefined)
+            props.rowSelectionMode = this.rowSelectionMode;
+        if (this.selectRowOnClick !== undefined)
+            props.selectRowOnClick = this.selectRowOnClick;
+        if (this.showRowSelectionColumn !== undefined)
+            props.showRowSelectionColumn = this.showRowSelectionColumn;
         if (this.theme !== undefined)
             props.theme = this.theme;
         if (this.quickFilter !== undefined)
@@ -527,6 +961,8 @@ class SimpleTableComponent {
             props.isLoading = this.isLoading;
         if (this.getRowId !== undefined)
             props.getRowId = this.getRowId;
+        if (this.getRowClass !== undefined)
+            props.getRowClass = this.getRowClass;
         if (this.enablePagination !== undefined)
             props.enablePagination = this.enablePagination;
         if (this.rowsPerPage !== undefined)
@@ -559,8 +995,6 @@ class SimpleTableComponent {
             props.selectableColumns = this.selectableColumns;
         if (this.enableHeaderEditing !== undefined)
             props.enableHeaderEditing = this.enableHeaderEditing;
-        if (this.onHeaderEdit !== undefined)
-            props.onHeaderEdit = this.onHeaderEdit;
         if (this.customTheme !== undefined)
             props.customTheme = this.customTheme;
         if (this.icons !== undefined)
@@ -575,8 +1009,18 @@ class SimpleTableComponent {
             props.rowButtons = this.rowButtons;
         if (this.hideFooter !== undefined)
             props.hideFooter = this.hideFooter;
+        if (this.hideHeader !== undefined)
+            props.hideHeader = this.hideHeader;
+        if (this.footerRenderKey !== undefined)
+            props.footerRenderKey = this.footerRenderKey;
         if (this.footerPosition !== undefined)
             props.footerPosition = this.footerPosition;
+        if (this.className !== undefined)
+            props.className = this.className;
+        if (this.copyHeadersToClipboard !== undefined)
+            props.copyHeadersToClipboard = this.copyHeadersToClipboard;
+        if (this.includeHeadersInCSVExport !== undefined)
+            props.includeHeadersInCSVExport = this.includeHeadersInCSVExport;
         if (this.initialSortColumn !== undefined)
             props.initialSortColumn = this.initialSortColumn;
         if (this.initialSortDirection !== undefined)
@@ -587,28 +1031,138 @@ class SimpleTableComponent {
             props.autoExpandColumns = this.autoExpandColumns;
         if (this.animations !== undefined)
             props.animations = this.animations;
+        if (this.cellUpdateFlash !== undefined)
+            props.cellUpdateFlash = this.cellUpdateFlash;
         if (this.enableVirtualization !== undefined)
             props.enableVirtualization = this.enableVirtualization;
         if (this.hoverRowBackground !== undefined)
             props.hoverRowBackground = this.hoverRowBackground;
-        if (this.hoverRowBackground !== undefined)
-            props.hoverRowBackground = this.hoverRowBackground;
-        if (this.oddColumnBackground !== undefined)
-            props.oddColumnBackground = this.oddColumnBackground;
         if (this.oddColumnBackground !== undefined)
             props.oddColumnBackground = this.oddColumnBackground;
         if (this.oddEvenRowBackground !== undefined)
             props.oddEvenRowBackground = this.oddEvenRowBackground;
-        if (this.oddEvenRowBackground !== undefined)
-            props.oddEvenRowBackground = this.oddEvenRowBackground;
+        if (this.onCellClick || this.cellClick.observed) {
+            props.onCellClick = (event) => {
+                this.inZone(() => {
+                    this.onCellClick?.(event);
+                    this.cellClick.emit(event);
+                });
+            };
+        }
+        if (this.onCellEdit || this.cellEdit.observed) {
+            props.onCellEdit = (event) => {
+                this.inZone(() => {
+                    this.onCellEdit?.(event);
+                    this.cellEdit.emit(event);
+                });
+            };
+        }
+        if (this.onSortChange || this.sortChange.observed) {
+            props.onSortChange = (sort) => {
+                this.inZone(() => {
+                    this.onSortChange?.(sort);
+                    this.sortChange.emit(sort);
+                });
+            };
+        }
+        if (this.onFilterChange || this.filterChange.observed) {
+            props.onFilterChange = (filters) => {
+                this.inZone(() => {
+                    this.onFilterChange?.(filters);
+                    this.filterChange.emit(filters);
+                });
+            };
+        }
+        if (this.onRowSelectionChange || this.rowSelectionChange.observed) {
+            props.onRowSelectionChange = (event) => {
+                this.inZone(() => {
+                    this.onRowSelectionChange?.(event);
+                    this.rowSelectionChange.emit(event);
+                });
+            };
+        }
+        if (this.onRowGroupExpand || this.rowGroupExpand.observed) {
+            props.onRowGroupExpand = (event) => {
+                return this.inZone(() => {
+                    const result = this.onRowGroupExpand?.(event);
+                    this.rowGroupExpand.emit(event);
+                    return result;
+                });
+            };
+        }
+        if (this.onColumnOrderChange || this.columnOrderChange.observed) {
+            props.onColumnOrderChange = (headers) => {
+                this.inZone(() => {
+                    this.onColumnOrderChange?.(headers);
+                    this.columnOrderChange.emit(headers);
+                });
+            };
+        }
+        if (this.onColumnVisibilityChange || this.columnVisibilityChange.observed) {
+            props.onColumnVisibilityChange = (state) => {
+                this.inZone(() => {
+                    this.onColumnVisibilityChange?.(state);
+                    this.columnVisibilityChange.emit(state);
+                });
+            };
+        }
+        if (this.onColumnWidthChange || this.columnWidthChange.observed) {
+            props.onColumnWidthChange = (headers) => {
+                this.inZone(() => {
+                    this.onColumnWidthChange?.(headers);
+                    this.columnWidthChange.emit(headers);
+                });
+            };
+        }
+        if (this.onPageChange || this.pageChange.observed) {
+            props.onPageChange = (page) => {
+                return this.inZone(() => {
+                    const result = this.onPageChange?.(page);
+                    this.pageChange.emit(page);
+                    return result;
+                });
+            };
+        }
+        if (this.onLoadMore || this.loadMore.observed) {
+            props.onLoadMore = () => {
+                this.inZone(() => {
+                    this.onLoadMore?.();
+                    this.loadMore.emit();
+                });
+            };
+        }
+        if (this.onHeaderEdit || this.headerEdit.observed) {
+            props.onHeaderEdit = (header, newLabel) => {
+                this.inZone(() => {
+                    this.onHeaderEdit?.(header, newLabel);
+                    this.headerEdit.emit({ header, newLabel });
+                });
+            };
+        }
+        if (this.onColumnSelect || this.columnSelect.observed) {
+            props.onColumnSelect = (header) => {
+                this.inZone(() => {
+                    this.onColumnSelect?.(header);
+                    this.columnSelect.emit(header);
+                });
+            };
+        }
+        if (this.onPivotChange || this.pivotChange.observed) {
+            props.onPivotChange = (pivot) => {
+                this.inZone(() => {
+                    this.onPivotChange?.(pivot);
+                    this.pivotChange.emit(pivot);
+                });
+            };
+        }
         return props;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.27", type: SimpleTableComponent, isStandalone: true, selector: "simple-table", inputs: { rows: "rows", columns: "columns", footerRenderer: "footerRenderer", loadingStateRenderer: "loadingStateRenderer", errorStateRenderer: "errorStateRenderer", emptyStateRenderer: "emptyStateRenderer", tableEmptyStateRenderer: "tableEmptyStateRenderer", headerDropdown: "headerDropdown", columnEditorConfig: "columnEditorConfig", onCellClick: "onCellClick", onCellEdit: "onCellEdit", onSortChange: "onSortChange", onFilterChange: "onFilterChange", onRowSelectionChange: "onRowSelectionChange", onRowGroupExpand: "onRowGroupExpand", onColumnOrderChange: "onColumnOrderChange", onColumnVisibilityChange: "onColumnVisibilityChange", onColumnWidthChange: "onColumnWidthChange", onPageChange: "onPageChange", onLoadMore: "onLoadMore", onTableReady: "onTableReady", rowGrouping: "rowGrouping", pivot: "pivot", onPivotChange: "onPivotChange", enableRowSelection: "enableRowSelection", theme: "theme", quickFilter: "quickFilter", isLoading: "isLoading", getRowId: "getRowId", enablePagination: "enablePagination", rowsPerPage: "rowsPerPage", serverSidePagination: "serverSidePagination", totalRowCount: "totalRowCount", height: "height", maxHeight: "maxHeight", scrollParent: "scrollParent", infiniteScrollThreshold: "infiniteScrollThreshold", columnResizing: "columnResizing", columnReordering: "columnReordering", enableColumnEditor: "enableColumnEditor", enableColumnEditorInitOpen: "enableColumnEditorInitOpen", enablePivotPanel: "enablePivotPanel", selectableCells: "selectableCells", selectableColumns: "selectableColumns", enableHeaderEditing: "enableHeaderEditing", onHeaderEdit: "onHeaderEdit", customTheme: "customTheme", icons: "icons", externalFilterHandling: "externalFilterHandling", externalSortHandling: "externalSortHandling", columnBorders: "columnBorders", rowButtons: "rowButtons", hideFooter: "hideFooter", footerPosition: "footerPosition", initialSortColumn: "initialSortColumn", initialSortDirection: "initialSortDirection", expandAll: "expandAll", autoExpandColumns: "autoExpandColumns", animations: "animations", enableVirtualization: "enableVirtualization", hoverRowBackground: "hoverRowBackground", oddColumnBackground: "oddColumnBackground", oddEvenRowBackground: "oddEvenRowBackground" }, outputs: { tableReady: "tableReady" }, usesOnChanges: true, ngImport: i0, template: `<div #host></div>`, isInline: true, styles: [":host{display:block}\n"] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.27", type: SimpleTableComponent, isStandalone: true, selector: "simple-table", inputs: { rows: "rows", columns: "columns", footerRenderer: "footerRenderer", loadingStateRenderer: "loadingStateRenderer", errorStateRenderer: "errorStateRenderer", emptyStateRenderer: "emptyStateRenderer", tableEmptyStateRenderer: "tableEmptyStateRenderer", headerDropdown: "headerDropdown", columnEditorConfig: "columnEditorConfig", onCellClick: "onCellClick", onCellEdit: "onCellEdit", onSortChange: "onSortChange", onFilterChange: "onFilterChange", onRowSelectionChange: "onRowSelectionChange", onRowGroupExpand: "onRowGroupExpand", onColumnOrderChange: "onColumnOrderChange", onColumnVisibilityChange: "onColumnVisibilityChange", onColumnWidthChange: "onColumnWidthChange", onPageChange: "onPageChange", onNextPage: "onNextPage", onLoadMore: "onLoadMore", onTableReady: "onTableReady", rowGrouping: "rowGrouping", canExpandRowGroup: "canExpandRowGroup", enableStickyParents: "enableStickyParents", pivot: "pivot", onPivotChange: "onPivotChange", enableRowSelection: "enableRowSelection", rowSelectionMode: "rowSelectionMode", selectRowOnClick: "selectRowOnClick", showRowSelectionColumn: "showRowSelectionColumn", theme: "theme", quickFilter: "quickFilter", isLoading: "isLoading", getRowId: "getRowId", getRowClass: "getRowClass", enablePagination: "enablePagination", rowsPerPage: "rowsPerPage", serverSidePagination: "serverSidePagination", totalRowCount: "totalRowCount", height: "height", maxHeight: "maxHeight", scrollParent: "scrollParent", infiniteScrollThreshold: "infiniteScrollThreshold", columnResizing: "columnResizing", columnReordering: "columnReordering", enableColumnEditor: "enableColumnEditor", enableColumnEditorInitOpen: "enableColumnEditorInitOpen", enablePivotPanel: "enablePivotPanel", selectableCells: "selectableCells", selectableColumns: "selectableColumns", enableHeaderEditing: "enableHeaderEditing", onHeaderEdit: "onHeaderEdit", onColumnSelect: "onColumnSelect", customTheme: "customTheme", icons: "icons", externalFilterHandling: "externalFilterHandling", externalSortHandling: "externalSortHandling", columnBorders: "columnBorders", rowButtons: "rowButtons", hideFooter: "hideFooter", hideHeader: "hideHeader", footerRenderKey: "footerRenderKey", footerPosition: "footerPosition", className: "className", copyHeadersToClipboard: "copyHeadersToClipboard", includeHeadersInCSVExport: "includeHeadersInCSVExport", initialSortColumn: "initialSortColumn", initialSortDirection: "initialSortDirection", expandAll: "expandAll", autoExpandColumns: "autoExpandColumns", animations: "animations", cellUpdateFlash: "cellUpdateFlash", enableVirtualization: "enableVirtualization", hoverRowBackground: "hoverRowBackground", oddColumnBackground: "oddColumnBackground", oddEvenRowBackground: "oddEvenRowBackground" }, outputs: { tableReady: "tableReady", cellClick: "cellClick", cellEdit: "cellEdit", sortChange: "sortChange", filterChange: "filterChange", rowSelectionChange: "rowSelectionChange", rowGroupExpand: "rowGroupExpand", columnOrderChange: "columnOrderChange", columnVisibilityChange: "columnVisibilityChange", columnWidthChange: "columnWidthChange", pageChange: "pageChange", loadMore: "loadMore", headerEdit: "headerEdit", columnSelect: "columnSelect", pivotChange: "pivotChange" }, queries: [{ propertyName: "cellSlots", predicate: StCellDirective }, { propertyName: "headerSlots", predicate: StHeaderDirective }, { propertyName: "emptySlots", predicate: StEmptyDirective }, { propertyName: "footerSlots", predicate: StFooterDirective }, { propertyName: "loadingSlots", predicate: StLoadingDirective }, { propertyName: "errorSlots", predicate: StErrorDirective }], usesOnChanges: true, ngImport: i0, template: `<div #host></div><ng-content />`, isInline: true, styles: [":host{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: "simple-table", standalone: true, template: `<div #host></div>`, styles: [":host{display:block}\n"] }]
+            args: [{ selector: "simple-table", standalone: true, template: `<div #host></div><ng-content />`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}\n"] }]
         }], propDecorators: { rows: [{
                 type: Input,
                 args: [{ required: true }]
@@ -648,18 +1202,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], onPageChange: [{
                 type: Input
+            }], onNextPage: [{
+                type: Input
             }], onLoadMore: [{
                 type: Input
             }], onTableReady: [{
                 type: Input
             }], rowGrouping: [{
                 type: Input
+            }], canExpandRowGroup: [{
+                type: Input
+            }], enableStickyParents: [{
+                type: Input
             }], pivot: [{
                 type: Input
             }], onPivotChange: [{
                 type: Input
             }], enableRowSelection: [{
                 type: Input
+            }], rowSelectionMode: [{
+                type: Input
+            }], selectRowOnClick: [{
+                type: Input
+            }], showRowSelectionColumn: [{
+                type: Input
             }], theme: [{
                 type: Input
             }], quickFilter: [{
@@ -668,6 +1234,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], getRowId: [{
                 type: Input
+            }], getRowClass: [{
+                type: Input
             }], enablePagination: [{
                 type: Input
             }], rowsPerPage: [{
@@ -702,6 +1270,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], onHeaderEdit: [{
                 type: Input
+            }], onColumnSelect: [{
+                type: Input
             }], customTheme: [{
                 type: Input
             }], icons: [{
@@ -716,8 +1286,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], hideFooter: [{
                 type: Input
+            }], hideHeader: [{
+                type: Input
+            }], footerRenderKey: [{
+                type: Input
             }], footerPosition: [{
                 type: Input
+            }], className: [{
+                type: Input
+            }], copyHeadersToClipboard: [{
+                type: Input
+            }], includeHeadersInCSVExport: [{
+                type: Input
             }], initialSortColumn: [{
                 type: Input
             }], initialSortDirection: [{
@@ -728,6 +1308,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], animations: [{
                 type: Input
+            }], cellUpdateFlash: [{
+                type: Input
             }], enableVirtualization: [{
                 type: Input
             }], hoverRowBackground: [{
@@ -738,36 +1320,116 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImpo
                 type: Input
             }], tableReady: [{
                 type: Output
+            }], cellClick: [{
+                type: Output
+            }], cellEdit: [{
+                type: Output
+            }], sortChange: [{
+                type: Output
+            }], filterChange: [{
+                type: Output
+            }], rowSelectionChange: [{
+                type: Output
+            }], rowGroupExpand: [{
+                type: Output
+            }], columnOrderChange: [{
+                type: Output
+            }], columnVisibilityChange: [{
+                type: Output
+            }], columnWidthChange: [{
+                type: Output
+            }], pageChange: [{
+                type: Output
+            }], loadMore: [{
+                type: Output
+            }], headerEdit: [{
+                type: Output
+            }], columnSelect: [{
+                type: Output
+            }], pivotChange: [{
+                type: Output
+            }], cellSlots: [{
+                type: ContentChildren,
+                args: [StCellDirective]
+            }], headerSlots: [{
+                type: ContentChildren,
+                args: [StHeaderDirective]
+            }], emptySlots: [{
+                type: ContentChildren,
+                args: [StEmptyDirective]
+            }], footerSlots: [{
+                type: ContentChildren,
+                args: [StFooterDirective]
+            }], loadingSlots: [{
+                type: ContentChildren,
+                args: [StLoadingDirective]
+            }], errorSlots: [{
+                type: ContentChildren,
+                args: [StErrorDirective]
             }] } });
 
+const ST_STANDALONE = [
+    SimpleTableComponent,
+    StCellDirective,
+    StHeaderDirective,
+    StEmptyDirective,
+    StFooterDirective,
+    StLoadingDirective,
+    StErrorDirective,
+    StDomSlotDirective,
+];
+/**
+ * One import for a page that uses `<simple-table>` plus `stCell` / `stEmpty` /
+ * `(sortChange)` and the other template directives.
+ *
+ * ```ts
+ * @Component({
+ *   standalone: true,
+ *   imports: [SimpleTableImports],
+ * })
+ * ```
+ */
+class SimpleTableImports {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableImports, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableImports, imports: [SimpleTableComponent,
+            StCellDirective,
+            StHeaderDirective,
+            StEmptyDirective,
+            StFooterDirective,
+            StLoadingDirective,
+            StErrorDirective,
+            StDomSlotDirective], exports: [SimpleTableComponent,
+            StCellDirective,
+            StHeaderDirective,
+            StEmptyDirective,
+            StFooterDirective,
+            StLoadingDirective,
+            StErrorDirective,
+            StDomSlotDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableImports }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.27", ngImport: i0, type: SimpleTableImports, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...ST_STANDALONE],
+                    exports: [...ST_STANDALONE],
+                }]
+        }] });
+
 /**
- * Call this in your application's `providers` array (or `bootstrapApplication`
- * providers) to register the dependencies that simple-table-angular's renderer
- * bridge needs — specifically `ApplicationRef` and `EnvironmentInjector`.
+ * Optional. Angular already provides `ApplicationRef` and `EnvironmentInjector`.
+ * The table does not require this in `bootstrapApplication` / `providers`.
  *
- * These are already provided by Angular's platform by default, so in practice
- * this function is a no-op placeholder that serves as a clear signal to
- * consumers that the adapter has been correctly wired up. If future versions
- * need custom providers they will be added here without breaking the call site.
+ * Kept so existing apps that call it keep compiling. Future versions may add
+ * real providers here without changing the call site.
  *
  * @example
- * // main.ts
  * bootstrapApplication(AppComponent, {
  *   providers: [provideSimpleTable()],
  * });
- *
- * @example
- * // app.module.ts
- * @NgModule({ providers: [provideSimpleTable()] })
- * export class AppModule {}
  */
 function provideSimpleTable() {
-    return makeEnvironmentProviders([
-    // ApplicationRef and EnvironmentInjector are part of Angular's core platform
-    // and are available without any additional registration.
-    // This factory is intentionally empty — it exists for API symmetry with
-    // other Angular ecosystem libraries and to allow non-breaking additions later.
-    ]);
+    return makeEnvironmentProviders([]);
 }
 
 // Component
@@ -776,5 +1438,5 @@ function provideSimpleTable() {
  * Generated bundle index. Do not edit.
  */
 
-export { SimpleTableComponent, provideSimpleTable, wrapAngularRenderer };
+export { SimpleTableComponent, SimpleTableImports, StCellDirective, StDomSlotDirective, StEmptyDirective, StErrorDirective, StFooterDirective, StHeaderDirective, StLoadingDirective, provideSimpleTable, wrapAngularRenderer };
 //# sourceMappingURL=simple-table-angular.mjs.map