@kouji-ui/components 0.5.0 → 0.6.1

package/fesm2022/kouji-ui-components.mjs

@@ -6160,7 +6160,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
  */
 class KjFieldComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: KjFieldComponent, isStandalone: true, selector: "kj-field", host: { classAttribute: "kj-field" }, hostDirectives: [{ directive: i1.KjField, inputs: ["kjFieldOrientation", "kjFieldOrientation", "kjRequired", "kjRequired", "kjDisabled", "kjDisabled", "kjInvalid", "kjInvalid", "kjFieldId", "kjFieldId", "kjFieldLabelId", "kjFieldLabelId"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: KjFieldComponent, isStandalone: true, selector: "kj-field", host: { classAttribute: "kj-field" }, hostDirectives: [{ directive: i1.KjField, inputs: ["kjFieldOrientation", "kjFieldOrientation", "kjRequired", "kjRequired", "kjDisabled", "kjDisabled", "kjInvalid", "kjInvalid", "kjFieldId", "kjFieldId", "kjFieldLabelId", "kjFieldLabelId"] }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldComponent, decorators: [{
             type: Component,
@@ -6178,7 +6178,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         },
                     ], template: `<ng-content />`, encapsulation: ViewEncapsulation.None, host: {
                         class: 'kj-field',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
         }] });
 /**
  * Styled wrapper around `KjFieldLabel`.
@@ -6193,7 +6193,7 @@ class KjFieldLabelComponent {
          the field's controlId signal — the static analyzer can't see that. -->
     <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -->
     <label kjFieldLabel class="kj-field-label"><ng-content /></label>
-  `, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldLabel, selector: "[kjFieldLabel]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldLabel, selector: "[kjFieldLabel]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldLabelComponent, decorators: [{
             type: Component,
@@ -6204,7 +6204,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
     <label kjFieldLabel class="kj-field-label"><ng-content /></label>
   `, encapsulation: ViewEncapsulation.None, host: {
                         style: 'display: contents;',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
         }] });
 /**
  * Styled wrapper around `KjFieldHelp`.
@@ -6214,30 +6214,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
  */
 class KjFieldHelpComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldHelpComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: KjFieldHelpComponent, isStandalone: true, selector: "kj-field-help", host: { styleAttribute: "display: contents;" }, ngImport: i0, template: `<span kjFieldHelp class="kj-field-help"><ng-content /></span>`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldHelp, selector: "[kjFieldHelp]", inputs: ["kjFieldHelpId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: KjFieldHelpComponent, isStandalone: true, selector: "kj-field-help", host: { styleAttribute: "display: contents;" }, ngImport: i0, template: `<span kjFieldHelp class="kj-field-help"><ng-content /></span>`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldHelp, selector: "[kjFieldHelp]", inputs: ["kjFieldHelpId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldHelpComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kj-field-help', standalone: true, imports: [KjFieldHelp], template: `<span kjFieldHelp class="kj-field-help"><ng-content /></span>`, encapsulation: ViewEncapsulation.None, host: {
                         style: 'display: contents;',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
         }] });
 /**
  * Styled wrapper around `KjFieldError`.
+ *
+ * With `kjReserve`, the error line keeps its box while the field is valid
+ * (invisible, one text line tall) so errors appearing / disappearing never
+ * shift the form layout.
+ *
+ * @example
+ * ```html
+ * <kj-field-error kjReserve>Please enter a valid email.</kj-field-error>
+ * ```
  * @doc-category Library/Data input
  * @doc
  * @doc-name field
  */
 class KjFieldErrorComponent {
+    /** Keep the error line's box while valid, so showing it never moves the layout. */
+    kjReserve = input(false, { ...(ngDevMode ? { debugName: "kjReserve" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: KjFieldErrorComponent, isStandalone: true, selector: "kj-field-error", host: { styleAttribute: "display: contents;" }, ngImport: i0, template: `<span kjFieldError class="kj-field-error"><ng-content /></span>`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldError, selector: "[kjFieldError]", inputs: ["kjFieldErrorId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: KjFieldErrorComponent, isStandalone: true, selector: "kj-field-error", inputs: { kjReserve: { classPropertyName: "kjReserve", publicName: "kjReserve", isSignal: true, isRequired: false, transformFunction: null } }, host: { styleAttribute: "display: contents;" }, ngImport: i0, template: `<span kjFieldError [kjFieldErrorReserve]="kjReserve()" class="kj-field-error"><ng-content /></span>`, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldError, selector: "[kjFieldError]", inputs: ["kjFieldErrorId", "kjFieldErrorReserve"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldErrorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'kj-field-error', standalone: true, imports: [KjFieldError], template: `<span kjFieldError class="kj-field-error"><ng-content /></span>`, encapsulation: ViewEncapsulation.None, host: {
+            args: [{ selector: 'kj-field-error', standalone: true, imports: [KjFieldError], template: `<span kjFieldError [kjFieldErrorReserve]="kjReserve()" class="kj-field-error"><ng-content /></span>`, encapsulation: ViewEncapsulation.None, host: {
                         style: 'display: contents;',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
-        }] });
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
+        }], propDecorators: { kjReserve: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjReserve", required: false }] }] } });
 /**
  * Styled wrapper around `KjFieldGroup`. Lays out an input with optional
  * leading / trailing addons (icons, units, action buttons) as a single
@@ -6271,7 +6282,7 @@ class KjFieldGroupComponent {
         <ng-content select="[suffix]" />
       </span>
     </div>
-  `, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldGroup, selector: "[kjFieldGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"], dependencies: [{ kind: "directive", type: KjFieldGroup, selector: "[kjFieldGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjFieldGroupComponent, decorators: [{
             type: Component,
@@ -6289,7 +6300,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
     </div>
   `, encapsulation: ViewEncapsulation.None, host: {
                         style: 'display: contents;',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@layer kj.component{kj-field.kj-field{--kj-field-gap: var(--kj-space-xs);--kj-field-label-fg: var(--kj-fg-default);--kj-field-label-font: var(--kj-font-sans);--kj-field-label-font-size: var(--kj-text-sm);--kj-field-label-weight: 500;--kj-field-help-fg: var(--kj-fg-muted);--kj-field-help-font-size: var(--kj-text-xs);--kj-field-error-fg: var(--kj-fg-danger);--kj-field-error-font-size: var(--kj-text-xs);--kj-field-required-fg: var(--kj-fg-danger);--kj-field-disabled-opacity: .55;display:flex;flex-direction:column;gap:var(--kj-field-gap);width:100%}kj-field.kj-field[data-orientation=horizontal]{flex-direction:row;align-items:center;gap:var(--kj-space-md)}kj-field.kj-field[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-label{color:var(--kj-field-label-fg);font:var(--kj-field-label-weight) var(--kj-field-label-font-size) / 1.4 var(--kj-field-label-font)}.kj-field-label[data-required]:after{content:\" *\";color:var(--kj-field-required-fg)}.kj-field-label[data-invalid]{color:var(--kj-field-error-fg)}.kj-field-help{color:var(--kj-field-help-fg);font:var(--kj-field-help-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error{color:var(--kj-field-error-fg);font:var(--kj-field-error-font-size) / 1.4 var(--kj-font-sans)}.kj-field-error[data-reserve]{display:block;min-height:calc(var(--kj-field-error-font-size) * 1.4)}.kj-field-error[data-hidden]{visibility:hidden}.kj-field-group{--kj-field-group-bg: var(--kj-bg-field);--kj-field-group-fg: var(--kj-fg-default);--kj-field-group-border-color: var(--kj-border-default);--kj-field-group-radius: var(--kj-radius-field);--kj-field-group-addon-fg: var(--kj-fg-muted);--kj-field-group-addon-bg: var(--kj-bg-surface);--kj-field-group-padding-x: var(--kj-space-md);display:inline-flex;align-items:stretch;width:100%;background:var(--kj-field-group-bg);color:var(--kj-field-group-fg);border:var(--kj-border) solid var(--kj-field-group-border-color);border-radius:var(--kj-field-group-radius);overflow:hidden;transition:var(--kj-transition)}.kj-field-group:focus-within{border-color:var(--kj-border-focus, var(--kj-bg-primary));outline:2px solid var(--kj-bg-primary);outline-offset:-2px}.kj-field-group[data-invalid]{border-color:var(--kj-border-danger, var(--kj-fg-danger))}.kj-field-group[data-disabled]{opacity:var(--kj-field-disabled-opacity);cursor:not-allowed}.kj-field-group__prefix,.kj-field-group__suffix{display:inline-flex;align-items:center;padding:0 var(--kj-field-group-padding-x);color:var(--kj-field-group-addon-fg);background:var(--kj-field-group-addon-bg);font:var(--kj-text-sm) / 1 var(--kj-font-sans);white-space:nowrap}.kj-field-group__prefix:empty,.kj-field-group__suffix:empty{display:none}.kj-field-group__control{display:inline-flex;flex:1 1 auto;min-width:0}.kj-field-group__control>.kj-input,.kj-field-group__control>input,.kj-field-group__control>kj-input,.kj-field-group__control>kj-input>.kj-input{border:0;border-radius:0;width:100%}.kj-field-group__control>.kj-input:focus-visible,.kj-field-group__control>input:focus-visible{outline:none}}\n"] }]
         }] });
 
 /**
@@ -9623,7 +9634,7 @@ class KjInputMaskValidationExample {
         </kj-field-error>
       }
     </kj-field>
-  `, isInline: true, styles: [":host{display:block;max-width:400px}input[kjInputMask]{color:var(--kj-fg-default);border:1px solid var(--kj-border-default);border-radius:var(--kj-radius-field, .375rem);padding:var(--kj-space-sm) var(--kj-space-md);font:var(--kj-text-sm) / 1.4 var(--kj-font-sans);font-variant-numeric:tabular-nums;width:100%}input[kjInputMask]:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px;border-color:var(--kj-fg-primary)}input[kjInputMask][aria-invalid=true]{border-color:var(--kj-fg-danger, #ef4444)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: KjInputMask, selector: "input[kjInputMask]", inputs: ["kjMask", "kjMaskTokens", "kjMaskMode", "kjSlotChar", "kjDisabled", "kjAutoClear", "kjFormatHint"], outputs: ["kjComplete"], exportAs: ["kjInputMask"] }, { kind: "component", type: KjFieldComponent, selector: "kj-field" }, { kind: "component", type: KjFieldLabelComponent, selector: "kj-field-label" }, { kind: "component", type: KjFieldHelpComponent, selector: "kj-field-help" }, { kind: "component", type: KjFieldErrorComponent, selector: "kj-field-error" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
+  `, isInline: true, styles: [":host{display:block;max-width:400px}input[kjInputMask]{color:var(--kj-fg-default);border:1px solid var(--kj-border-default);border-radius:var(--kj-radius-field, .375rem);padding:var(--kj-space-sm) var(--kj-space-md);font:var(--kj-text-sm) / 1.4 var(--kj-font-sans);font-variant-numeric:tabular-nums;width:100%}input[kjInputMask]:focus-visible{outline:2px solid var(--kj-fg-primary);outline-offset:2px;border-color:var(--kj-fg-primary)}input[kjInputMask][aria-invalid=true]{border-color:var(--kj-fg-danger, #ef4444)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: KjInputMask, selector: "input[kjInputMask]", inputs: ["kjMask", "kjMaskTokens", "kjMaskMode", "kjSlotChar", "kjDisabled", "kjAutoClear", "kjFormatHint"], outputs: ["kjComplete"], exportAs: ["kjInputMask"] }, { kind: "component", type: KjFieldComponent, selector: "kj-field" }, { kind: "component", type: KjFieldLabelComponent, selector: "kj-field-label" }, { kind: "component", type: KjFieldHelpComponent, selector: "kj-field-help" }, { kind: "component", type: KjFieldErrorComponent, selector: "kj-field-error", inputs: ["kjReserve"] }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjInputMaskValidationExample, decorators: [{
             type: Component,
@@ -14753,6 +14764,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
             args: [{ selector: 'ng-template[kjCellTemplate]', standalone: true }]
         }], propDecorators: { kjCellTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjCellTemplate", required: true }] }] } });
 
+/**
+ * Registers the empty-state template for a `<kj-table>` — rendered when the
+ * table resolves to zero rows and is neither loading nor errored.
+ *
+ * Prefer this over the `[kjEmpty]` content slot: the template is instantiated
+ * only while the state is active, so avatars, buttons and injected services in
+ * the empty state cost nothing on a populated table.
+ *
+ * ```html
+ * <kj-table [kjData]="rows()" [kjColumns]="cols">
+ *   <ng-template kjEmptyTemplate>
+ *     <p>No users found.</p>
+ *     <kj-button kjSize="sm" (click)="add()">Add user</kj-button>
+ *   </ng-template>
+ * </kj-table>
+ * ```
+ *
+ * @doc-category Library/Data display
+ * @doc
+ * @doc-name table
+ */
+class KjTableEmptyTemplate {
+    /** @internal */
+    template = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableEmptyTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: KjTableEmptyTemplate, isStandalone: true, selector: "ng-template[kjEmptyTemplate]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableEmptyTemplate, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ng-template[kjEmptyTemplate]', standalone: true }]
+        }] });
+/**
+ * Registers the loading template for a `<kj-table>` — rendered while the
+ * resource is in flight or `[kjLoading]` is set, replacing the built-in
+ * "Loading…" text with a project-specific spinner or skeleton.
+ *
+ * On a *reload* (rows already on screen) the table shows its slim progress
+ * stripe instead and this template stays hidden, so the stale rows remain
+ * readable.
+ *
+ * ```html
+ * <kj-table [kjResource]="res" [kjColumns]="cols">
+ *   <ng-template kjLoadingTemplate>
+ *     <my-spinner />
+ *   </ng-template>
+ * </kj-table>
+ * ```
+ *
+ * @doc-category Library/Data display
+ * @doc
+ * @doc-name table
+ */
+class KjTableLoadingTemplate {
+    /** @internal */
+    template = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableLoadingTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: KjTableLoadingTemplate, isStandalone: true, selector: "ng-template[kjLoadingTemplate]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableLoadingTemplate, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ng-template[kjLoadingTemplate]', standalone: true }]
+        }] });
+/**
+ * Registers the error template for a `<kj-table>` — rendered when the bound
+ * `[kjResource]` rejects. Pair it with `reload()` for a retry affordance.
+ *
+ * ```html
+ * <kj-table [kjResource]="res" [kjColumns]="cols">
+ *   <ng-template kjErrorTemplate>
+ *     <p>Failed to load.</p>
+ *     <kj-button kjSize="sm" (click)="res.reload()">Try again</kj-button>
+ *   </ng-template>
+ * </kj-table>
+ * ```
+ *
+ * @doc-category Library/Data display
+ * @doc
+ * @doc-name table
+ */
+class KjTableErrorTemplate {
+    /** @internal */
+    template = inject(TemplateRef);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableErrorTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: KjTableErrorTemplate, isStandalone: true, selector: "ng-template[kjErrorTemplate]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableErrorTemplate, decorators: [{
+            type: Directive,
+            args: [{ selector: 'ng-template[kjErrorTemplate]', standalone: true }]
+        }] });
+
 /**
  * Inline text cell editor for `<kj-table>`. Renders the styled
  * `<kj-input>` component (which wraps the headless `kjInput` directive and
@@ -16203,7 +16304,10 @@ const BUILTIN_FILTERS = {
  *   the toolbar's export menu.
  *   @doc-file table.export.example.ts
  * @doc-example Empty and error [full]
- *   Project `[kjEmpty]` / `[kjError]` slots to override the defaults.
+ *   Override the defaults with `<ng-template kjEmptyTemplate>` /
+ *   `kjErrorTemplate` / `kjLoadingTemplate` (lazy — instantiated only while
+ *   that state is active). The older `[kjEmpty]` / `[kjError]` / `[kjLoading]`
+ *   projection slots still work and act as the fallback.
  *   @doc-file table.empty-and-error.example.ts
  * @doc-example Keyboard [full]
  *   Arrow / Home / End / Ctrl+Home/End / PageUp/Down / F2 / Enter / Esc /
@@ -16285,6 +16389,25 @@ class KjTableComponent {
     /** Custom cell templates declared as `ng-template[kjCellTemplate]` content. */
     cellTemplates = contentChildren(KjCellTemplateDirective, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "cellTemplates" }] : /* istanbul ignore next */ []));
+    // ── State templates ─────────────────────────────────────────────────────
+    // Declared as `ng-template[kj{Empty,Loading,Error}Template]` content. When
+    // present they win over the `[kjEmpty]` / `[kjLoading]` / `[kjError]`
+    // projection slots, which stay supported for simple static markup.
+    emptyTemplate = contentChild(KjTableEmptyTemplate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "emptyTemplate" }] : /* istanbul ignore next */ []));
+    loadingTemplate = contentChild(KjTableLoadingTemplate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "loadingTemplate" }] : /* istanbul ignore next */ []));
+    errorTemplate = contentChild(KjTableErrorTemplate, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorTemplate" }] : /* istanbul ignore next */ []));
+    /** Empty-state template, or `null` to fall back to the `[kjEmpty]` slot. */
+    emptyTpl = computed(() => this.emptyTemplate()?.template ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "emptyTpl" }] : /* istanbul ignore next */ []));
+    /** Loading template, or `null` to fall back to the `[kjLoading]` slot. */
+    loadingTpl = computed(() => this.loadingTemplate()?.template ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "loadingTpl" }] : /* istanbul ignore next */ []));
+    /** Error template, or `null` to fall back to the `[kjError]` slot. */
+    errorTpl = computed(() => this.errorTemplate()?.template ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorTpl" }] : /* istanbul ignore next */ []));
     /** Resolve the registered template for a cell's column, if any. */
     cellTpl(cell) {
         for (const t of this.cellTemplates()) {
@@ -16716,7 +16839,7 @@ class KjTableComponent {
         this.editingCell.set(null);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: KjTableComponent, isStandalone: true, selector: "kj-table", inputs: { kjResource: { classPropertyName: "kjResource", publicName: "kjResource", isSignal: true, isRequired: false, transformFunction: null }, kjDensity: { classPropertyName: "kjDensity", publicName: "kjDensity", isSignal: true, isRequired: false, transformFunction: null }, kjVariant: { classPropertyName: "kjVariant", publicName: "kjVariant", isSignal: true, isRequired: false, transformFunction: null }, kjLoading: { classPropertyName: "kjLoading", publicName: "kjLoading", isSignal: true, isRequired: false, transformFunction: null }, kjSelection: { classPropertyName: "kjSelection", publicName: "kjSelection", isSignal: true, isRequired: false, transformFunction: null }, kjSelectionMode: { classPropertyName: "kjSelectionMode", publicName: "kjSelectionMode", isSignal: true, isRequired: false, transformFunction: null }, kjShowSelectionColumn: { classPropertyName: "kjShowSelectionColumn", publicName: "kjShowSelectionColumn", isSignal: true, isRequired: false, transformFunction: null }, kjStorageKey: { classPropertyName: "kjStorageKey", publicName: "kjStorageKey", isSignal: true, isRequired: false, transformFunction: null }, kjStorageAdapter: { classPropertyName: "kjStorageAdapter", publicName: "kjStorageAdapter", isSignal: true, isRequired: false, transformFunction: null }, kjVirtual: { classPropertyName: "kjVirtual", publicName: "kjVirtual", isSignal: true, isRequired: false, transformFunction: null }, kjEstimatedRowSize: { classPropertyName: "kjEstimatedRowSize", publicName: "kjEstimatedRowSize", isSignal: true, isRequired: false, transformFunction: null }, kjEnableFilters: { classPropertyName: "kjEnableFilters", publicName: "kjEnableFilters", isSignal: true, isRequired: false, transformFunction: null }, kjEnableResize: { classPropertyName: "kjEnableResize", publicName: "kjEnableResize", isSignal: true, isRequired: false, transformFunction: null }, kjEnableRowPinning: { classPropertyName: "kjEnableRowPinning", publicName: "kjEnableRowPinning", isSignal: true, isRequired: false, transformFunction: null }, kjEditOnDoubleClick: { classPropertyName: "kjEditOnDoubleClick", publicName: "kjEditOnDoubleClick", isSignal: true, isRequired: false, transformFunction: null }, kjPageSize: { classPropertyName: "kjPageSize", publicName: "kjPageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { kjSelection: "kjSelectionChange", cellEdit: "cellEdit", stateChange: "stateChange", rowClick: "rowClick", rowDoubleClick: "rowDoubleClick" }, host: { properties: { "attr.data-density": "t.state.density()", "attr.data-variant": "kjVariant()", "attr.data-loading": "isLoading() ? \"\" : null", "attr.data-error": "hasError() ? \"\" : null" } }, queries: [{ propertyName: "kjRowExpansionTpl", first: true, predicate: ["kjRowExpansion"], descendants: true, isSignal: true }, { propertyName: "cellTemplates", predicate: KjCellTemplateDirective, isSignal: true }], hostDirectives: [{ directive: i1.KjTable, inputs: ["kjTable", "kjColumns", "kjTableData", "kjData", "kjGetRowId", "kjGetRowId"] }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: KjTableComponent, isStandalone: true, selector: "kj-table", inputs: { kjResource: { classPropertyName: "kjResource", publicName: "kjResource", isSignal: true, isRequired: false, transformFunction: null }, kjDensity: { classPropertyName: "kjDensity", publicName: "kjDensity", isSignal: true, isRequired: false, transformFunction: null }, kjVariant: { classPropertyName: "kjVariant", publicName: "kjVariant", isSignal: true, isRequired: false, transformFunction: null }, kjLoading: { classPropertyName: "kjLoading", publicName: "kjLoading", isSignal: true, isRequired: false, transformFunction: null }, kjSelection: { classPropertyName: "kjSelection", publicName: "kjSelection", isSignal: true, isRequired: false, transformFunction: null }, kjSelectionMode: { classPropertyName: "kjSelectionMode", publicName: "kjSelectionMode", isSignal: true, isRequired: false, transformFunction: null }, kjShowSelectionColumn: { classPropertyName: "kjShowSelectionColumn", publicName: "kjShowSelectionColumn", isSignal: true, isRequired: false, transformFunction: null }, kjStorageKey: { classPropertyName: "kjStorageKey", publicName: "kjStorageKey", isSignal: true, isRequired: false, transformFunction: null }, kjStorageAdapter: { classPropertyName: "kjStorageAdapter", publicName: "kjStorageAdapter", isSignal: true, isRequired: false, transformFunction: null }, kjVirtual: { classPropertyName: "kjVirtual", publicName: "kjVirtual", isSignal: true, isRequired: false, transformFunction: null }, kjEstimatedRowSize: { classPropertyName: "kjEstimatedRowSize", publicName: "kjEstimatedRowSize", isSignal: true, isRequired: false, transformFunction: null }, kjEnableFilters: { classPropertyName: "kjEnableFilters", publicName: "kjEnableFilters", isSignal: true, isRequired: false, transformFunction: null }, kjEnableResize: { classPropertyName: "kjEnableResize", publicName: "kjEnableResize", isSignal: true, isRequired: false, transformFunction: null }, kjEnableRowPinning: { classPropertyName: "kjEnableRowPinning", publicName: "kjEnableRowPinning", isSignal: true, isRequired: false, transformFunction: null }, kjEditOnDoubleClick: { classPropertyName: "kjEditOnDoubleClick", publicName: "kjEditOnDoubleClick", isSignal: true, isRequired: false, transformFunction: null }, kjPageSize: { classPropertyName: "kjPageSize", publicName: "kjPageSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { kjSelection: "kjSelectionChange", cellEdit: "cellEdit", stateChange: "stateChange", rowClick: "rowClick", rowDoubleClick: "rowDoubleClick" }, host: { properties: { "attr.data-density": "t.state.density()", "attr.data-variant": "kjVariant()", "attr.data-loading": "isLoading() ? \"\" : null", "attr.data-error": "hasError() ? \"\" : null", "attr.data-empty": "showEmpty() ? \"\" : null" } }, queries: [{ propertyName: "kjRowExpansionTpl", first: true, predicate: ["kjRowExpansion"], descendants: true, isSignal: true }, { propertyName: "cellTemplates", predicate: KjCellTemplateDirective, isSignal: true }, { propertyName: "emptyTemplate", first: true, predicate: KjTableEmptyTemplate, descendants: true, isSignal: true }, { propertyName: "loadingTemplate", first: true, predicate: KjTableLoadingTemplate, descendants: true, isSignal: true }, { propertyName: "errorTemplate", first: true, predicate: KjTableErrorTemplate, descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.KjTable, inputs: ["kjTable", "kjColumns", "kjTableData", "kjData", "kjGetRowId", "kjGetRowId"] }], ngImport: i0, template: `
     <div class="kj-table-wrapper">
       <!-- Toolbar projection: matches either an explicit [kjToolbar] marker
            OR the styled <kj-table-toolbar> element directly, so users don't
@@ -17030,12 +17153,20 @@ class KjTableComponent {
 
       @if (showEmpty()) {
         <div class="kj-table-empty" role="status">
-          <ng-content select="[kjEmpty]" />
+          @if (emptyTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjEmpty]" />
+          }
         </div>
       }
       @if (hasError()) {
         <div class="kj-table-error" role="alert">
-          <ng-content select="[kjError]" />
+          @if (errorTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjError]" />
+          }
         </div>
       }
       @if (isLoading()) {
@@ -17043,15 +17174,19 @@ class KjTableComponent {
              aria-live="polite"
              aria-busy="true"
              [attr.data-has-rows]="effectiveData().length > 0 ? '' : null">
-          <ng-content select="[kjLoading]">
-            <span class="kj-table-loading-fallback">Loading…</span>
-          </ng-content>
+          @if (loadingTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjLoading]">
+              <span class="kj-table-loading-fallback">Loading…</span>
+            </ng-content>
+          }
         </div>
       }
 
       <ng-content />
     </div>
-  `, isInline: true, styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0;font-family:var(--kj-font-sans);font-size:var(--kj-text-sm);--kj-table-row-height: 2.25rem}:host([data-density=\"compact\"]){--kj-table-row-height: 1.75rem}:host([data-density=\"comfortable\"]){--kj-table-row-height: 2.75rem}.kj-table-wrapper{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;position:relative}.kj-table-body{position:relative;overflow:auto;display:block;flex:1 1 auto;min-height:0;min-width:0}.kj-table-body thead th{position:sticky;top:0;z-index:2;background:var(--kj-table-header-bg, var(--kj-bg-surface))}.kj-table-body thead th[data-pin]{z-index:3}.kj-table-body>table{min-width:100%}:host th,:host td{height:var(--kj-table-row-height)}:host table{width:100%;border-collapse:collapse;background:var(--kj-bg-surface);color:var(--kj-fg-default)}:host th,:host td{text-align:left;padding:var(--kj-base-space-sm) var(--kj-base-space-md);border-bottom:1px solid var(--kj-border-default);position:relative}:host th{font-weight:600;background:var(--kj-bg-elevated)}:host th[aria-sort]{-webkit-user-select:none;user-select:none}.kj-table-sort-indicator{display:inline-flex;align-items:center;margin-inline-start:var(--kj-base-space-xs, .25rem);color:var(--kj-fg-subtle, var(--kj-fg-muted));transition:color var(--kj-transition);vertical-align:middle}:host th[data-sort=asc] .kj-table-sort-indicator,:host th[data-sort=desc] .kj-table-sort-indicator{color:var(--kj-fg-primary)}:host th[aria-sort]:hover .kj-table-sort-indicator,:host th[aria-sort]:focus-visible .kj-table-sort-indicator{color:var(--kj-fg-default)}:host([data-density=\"compact\"]) th,:host([data-density=\"compact\"]) td{padding:var(--kj-base-space-xs) var(--kj-base-space-sm)}:host([data-density=\"comfortable\"]) th,:host([data-density=\"comfortable\"]) td{padding:var(--kj-base-space-md) var(--kj-base-space-lg)}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td{background:var(--kj-bg-elevated)}:host([data-variant=\"clean\"]) th,:host([data-variant=\"clean\"]) td{border-bottom-color:transparent}:host td:focus-visible,:host th:focus-visible{outline:2px solid var(--kj-border-focus);outline-offset:-2px}:host td.kj-table-cell--editing{position:relative}:host td .kj-table-cell-ghost{visibility:hidden;white-space:pre;display:inline-block;pointer-events:none}:host td.kj-table-cell--editing ::ng-deep kj-text-editor,:host td.kj-table-cell--editing ::ng-deep kj-number-editor,:host td.kj-table-cell--editing ::ng-deep kj-select-editor,:host td.kj-table-cell--editing ::ng-deep kj-date-editor,:host td.kj-table-cell--editing ::ng-deep kj-boolean-editor{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;padding:inherit!important;background:var(--kj-bg-surface);z-index:1}:host td.kj-table-cell--editing ::ng-deep kj-input,:host td.kj-table-cell--editing ::ng-deep kj-number-input,:host td.kj-table-cell--editing ::ng-deep kj-select{display:flex!important;width:100%!important;min-width:0!important;box-sizing:border-box}:host td.kj-table-cell--editing ::ng-deep input,:host td.kj-table-cell--editing ::ng-deep .kj-select-trigger{width:100%!important;min-width:0!important;box-sizing:border-box}:host td .kj-table-editor-anchor{display:none}:host tr[data-selected] td{background:color-mix(in oklab,var(--kj-bg-primary, var(--kj-bg-accent, currentColor)) 12%,var(--kj-bg-surface))}:host tr[data-selected] td:first-child{box-shadow:inset 3px 0 0 0 var(--kj-bg-primary, var(--kj-fg-primary))}:host td[data-pin=left],:host th[data-pin=left]{position:sticky;left:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=right],:host th[data-pin=right]{position:sticky;right:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=left]:not(:has(+td[data-pin=left])),:host th[data-pin=left]:not(:has(+th[data-pin=left])){border-right:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:4px 0 6px -4px #00000040}:host tr>:not([data-pin=right])+td[data-pin=right],:host tr>:not([data-pin=right])+th[data-pin=right]{border-left:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:-4px 0 6px -4px #00000040}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td[data-pin]{background:var(--kj-bg-elevated)}.kj-table-resize-handle{position:absolute;top:25%;right:0;width:6px;height:50%;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;background:transparent;border-right:2px solid var(--kj-border-strong, var(--kj-border-default));transition:border-color var(--kj-transition),background var(--kj-transition),width var(--kj-transition)}.kj-table-resize-handle:hover,.kj-table-resize-handle:focus-visible{border-right-color:var(--kj-border-focus);background:color-mix(in srgb,var(--kj-border-focus) 20%,transparent);width:8px;outline:none}:host th[data-resizing] .kj-table-resize-handle{top:0;height:9999px;width:0;background:transparent;border-right:2px solid var(--kj-border-focus, var(--kj-bg-primary));transform:translate(var(--kj-resize-delta, 0px));pointer-events:none;z-index:3;transition:none}:host th.kj-table-select-cell,:host td.kj-table-select-cell{width:2.5rem;padding-inline:var(--kj-base-space-sm);text-align:center;vertical-align:middle}.kj-table-select-cell kj-checkbox{display:inline-flex;align-items:center;justify-content:center}.kj-table-filter-row>th{font-weight:400;background:var(--kj-bg-surface);border-top:1px solid var(--kj-border-muted, var(--kj-border-default))}.kj-table-filter-cell{padding-top:var(--kj-base-space-xs);padding-bottom:var(--kj-base-space-xs);vertical-align:middle}.kj-table-filter-cell .kj-table-filter-anchor+*,.kj-table-filter-cell kj-input,.kj-table-filter-cell kj-number-input,.kj-table-filter-cell kj-date-picker,.kj-table-filter-cell kj-select{width:100%}.kj-table-filter-anchor{display:block;width:100%}:host .kj-table-editor-anchor .kj-input,:host .kj-table-editor-anchor .kj-select{--kj-input-height: 1.75rem;--kj-input-font-size: var(--kj-text-xs);--kj-input-padding-x: var(--kj-base-space-sm);--kj-input-padding-y: 0;--kj-input-radius: var(--kj-radius-selector)}.kj-table-empty,.kj-table-error,.kj-table-loading{display:flex;align-items:center;justify-content:center;padding:var(--kj-base-space-lg);color:var(--kj-fg-muted)}.kj-table-loading{position:absolute;inset:0;background:color-mix(in srgb,var(--kj-bg-surface) 70%,transparent);pointer-events:none}.kj-table-loading[data-has-rows]{inset:0 0 auto;height:2px;background:var(--kj-bg-primary);padding:0;animation:kj-table-loading-pulse 1.4s ease-in-out infinite}.kj-table-loading[data-has-rows] .kj-table-loading-fallback,.kj-table-loading[data-has-rows] ::ng-deep [kjLoading]{display:none}@keyframes kj-table-loading-pulse{0%,to{opacity:.55}50%{opacity:1}}.kj-table-error{color:var(--kj-fg-error, var(--kj-fg-default))}.kj-table-loading-fallback{font-size:var(--kj-text-sm)}.kj-table-expansion-row>td{background:var(--kj-bg-elevated)}.kj-table-tbody-pinned[data-pin=top]>tr>td{background:var(--kj-bg-elevated);border-bottom:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 4px 6px -4px #00000040;position:sticky;top:0;z-index:2}.kj-table-tbody-pinned[data-pin=bottom]>tr>td{background:var(--kj-bg-elevated);border-top:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 -4px 6px -4px #00000040;position:sticky;bottom:0;z-index:2}.kj-table-group-toggle{display:inline-flex;align-items:center;gap:var(--kj-base-space-xs, .25rem);background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}.kj-table-group-toggle__chevron{display:inline-block;width:.75rem;font-family:var(--kj-font-mono);color:var(--kj-fg-muted);transition:transform var(--kj-transition)}.kj-table-group-toggle[aria-expanded=true] .kj-table-group-toggle__chevron{transform:rotate(90deg)}.kj-table-group-toggle__count{margin-inline-start:var(--kj-base-space-xs, .25rem);font-size:.75em;color:var(--kj-fg-muted);font-variant-numeric:tabular-nums}:host tbody tr[data-row-grouped] td{background:var(--kj-bg-elevated);font-weight:600}\n"], dependencies: [{ kind: "directive", type: KjTableHeader, selector: "[kjTableHeader]", inputs: ["kjHeader"] }, { kind: "directive", type: KjTableRow, selector: "[kjTableRow]", inputs: ["kjRow"] }, { kind: "directive", type: KjTableCell, selector: "[kjTableCell]", inputs: ["kjCell"] }, { kind: "directive", type: KjTableKeyboardNav, selector: "[kjTableKeyboardNav]" }, { kind: "directive", type: KjTableVirtual, selector: "[kjTableVirtual]", inputs: ["kjCount", "kjEstimateSize", "kjOverscan"], exportAs: ["kjTableVirtual"] }, { kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "component", type: KjCheckboxComponent, selector: "kj-checkbox", inputs: ["checked", "disabled", "indeterminate", "size"], outputs: ["checkedChange"] }, { kind: "directive", type: KjCellEditorOutlet, selector: "[kjCellEditorOutlet]", inputs: ["kjEditor", "kjValue", "kjMeta"], outputs: ["commit", "editCancel"] }, { kind: "directive", type: KjFilterCellOutlet, selector: "[kjFilterCell]", inputs: ["kjColumn", "kjFilter"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0;font-family:var(--kj-font-sans);font-size:var(--kj-text-sm);--kj-table-row-height: 2.25rem}:host([data-density=\"compact\"]){--kj-table-row-height: 1.75rem}:host([data-density=\"comfortable\"]){--kj-table-row-height: 2.75rem}.kj-table-wrapper{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;position:relative}.kj-table-body{position:relative;overflow:auto;display:block;flex:1 1 auto;min-height:0;min-width:0}.kj-table-body thead th{position:sticky;top:0;z-index:2;background:var(--kj-table-header-bg, var(--kj-bg-surface))}.kj-table-body thead th[data-pin]{z-index:3}.kj-table-body>table{min-width:100%}:host th,:host td{height:var(--kj-table-row-height)}:host table{width:100%;border-collapse:collapse;background:var(--kj-bg-surface);color:var(--kj-fg-default)}:host th,:host td{text-align:left;padding:var(--kj-base-space-sm) var(--kj-base-space-md);border-bottom:1px solid var(--kj-border-default);position:relative}:host th{font-weight:600;background:var(--kj-bg-elevated)}:host th[aria-sort]{-webkit-user-select:none;user-select:none}.kj-table-sort-indicator{display:inline-flex;align-items:center;margin-inline-start:var(--kj-base-space-xs, .25rem);color:var(--kj-fg-subtle, var(--kj-fg-muted));transition:color var(--kj-transition);vertical-align:middle}:host th[data-sort=asc] .kj-table-sort-indicator,:host th[data-sort=desc] .kj-table-sort-indicator{color:var(--kj-fg-primary)}:host th[aria-sort]:hover .kj-table-sort-indicator,:host th[aria-sort]:focus-visible .kj-table-sort-indicator{color:var(--kj-fg-default)}:host([data-density=\"compact\"]) th,:host([data-density=\"compact\"]) td{padding:var(--kj-base-space-xs) var(--kj-base-space-sm)}:host([data-density=\"comfortable\"]) th,:host([data-density=\"comfortable\"]) td{padding:var(--kj-base-space-md) var(--kj-base-space-lg)}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td{background:var(--kj-bg-elevated)}:host([data-variant=\"clean\"]) th,:host([data-variant=\"clean\"]) td{border-bottom-color:transparent}:host td:focus-visible,:host th:focus-visible{outline:2px solid var(--kj-border-focus);outline-offset:-2px}:host td.kj-table-cell--editing{position:relative}:host td .kj-table-cell-ghost{visibility:hidden;white-space:pre;display:inline-block;pointer-events:none}:host td.kj-table-cell--editing ::ng-deep kj-text-editor,:host td.kj-table-cell--editing ::ng-deep kj-number-editor,:host td.kj-table-cell--editing ::ng-deep kj-select-editor,:host td.kj-table-cell--editing ::ng-deep kj-date-editor,:host td.kj-table-cell--editing ::ng-deep kj-boolean-editor{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;padding:inherit!important;background:var(--kj-bg-surface);z-index:1}:host td.kj-table-cell--editing ::ng-deep kj-input,:host td.kj-table-cell--editing ::ng-deep kj-number-input,:host td.kj-table-cell--editing ::ng-deep kj-select{display:flex!important;width:100%!important;min-width:0!important;box-sizing:border-box}:host td.kj-table-cell--editing ::ng-deep input,:host td.kj-table-cell--editing ::ng-deep .kj-select-trigger{width:100%!important;min-width:0!important;box-sizing:border-box}:host td .kj-table-editor-anchor{display:none}:host tr[data-selected] td{background:color-mix(in oklab,var(--kj-bg-primary, var(--kj-bg-accent, currentColor)) 12%,var(--kj-bg-surface))}:host tr[data-selected] td:first-child{box-shadow:inset 3px 0 0 0 var(--kj-bg-primary, var(--kj-fg-primary))}:host td[data-pin=left],:host th[data-pin=left]{position:sticky;left:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=right],:host th[data-pin=right]{position:sticky;right:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=left]:not(:has(+td[data-pin=left])),:host th[data-pin=left]:not(:has(+th[data-pin=left])){border-right:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:4px 0 6px -4px #00000040}:host tr>:not([data-pin=right])+td[data-pin=right],:host tr>:not([data-pin=right])+th[data-pin=right]{border-left:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:-4px 0 6px -4px #00000040}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td[data-pin]{background:var(--kj-bg-elevated)}.kj-table-resize-handle{position:absolute;top:25%;right:0;width:6px;height:50%;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;background:transparent;border-right:2px solid var(--kj-border-strong, var(--kj-border-default));transition:border-color var(--kj-transition),background var(--kj-transition),width var(--kj-transition)}.kj-table-resize-handle:hover,.kj-table-resize-handle:focus-visible{border-right-color:var(--kj-border-focus);background:color-mix(in srgb,var(--kj-border-focus) 20%,transparent);width:8px;outline:none}:host th[data-resizing] .kj-table-resize-handle{top:0;height:9999px;width:0;background:transparent;border-right:2px solid var(--kj-border-focus, var(--kj-bg-primary));transform:translate(var(--kj-resize-delta, 0px));pointer-events:none;z-index:3;transition:none}:host th.kj-table-select-cell,:host td.kj-table-select-cell{width:2.5rem;padding-inline:var(--kj-base-space-sm);text-align:center;vertical-align:middle}.kj-table-select-cell kj-checkbox{display:inline-flex;align-items:center;justify-content:center}.kj-table-filter-row>th{font-weight:400;background:var(--kj-bg-surface);border-top:1px solid var(--kj-border-muted, var(--kj-border-default))}.kj-table-filter-cell{padding-top:var(--kj-base-space-xs);padding-bottom:var(--kj-base-space-xs);vertical-align:middle}.kj-table-filter-cell .kj-table-filter-anchor+*,.kj-table-filter-cell kj-input,.kj-table-filter-cell kj-number-input,.kj-table-filter-cell kj-date-picker,.kj-table-filter-cell kj-select{width:100%}.kj-table-filter-anchor{display:block;width:100%}:host .kj-table-editor-anchor .kj-input,:host .kj-table-editor-anchor .kj-select{--kj-input-height: 1.75rem;--kj-input-font-size: var(--kj-text-xs);--kj-input-padding-x: var(--kj-base-space-sm);--kj-input-padding-y: 0;--kj-input-radius: var(--kj-radius-selector)}.kj-table-empty,.kj-table-error,.kj-table-loading{display:flex;align-items:center;justify-content:center;padding:var(--kj-base-space-lg);color:var(--kj-fg-muted)}:host([data-empty]) .kj-table-body,:host([data-error]) .kj-table-body{flex:0 1 auto}.kj-table-empty,.kj-table-error{flex:1 1 auto;min-height:0}.kj-table-loading{position:absolute;inset:0;background:color-mix(in srgb,var(--kj-bg-surface) 70%,transparent);pointer-events:none}.kj-table-loading[data-has-rows]{inset:0 0 auto;height:2px;background:var(--kj-bg-primary);padding:0;animation:kj-table-loading-pulse 1.4s ease-in-out infinite}.kj-table-loading[data-has-rows] .kj-table-loading-fallback,.kj-table-loading[data-has-rows] ::ng-deep [kjLoading]{display:none}@keyframes kj-table-loading-pulse{0%,to{opacity:.55}50%{opacity:1}}.kj-table-error{color:var(--kj-fg-error, var(--kj-fg-default))}.kj-table-loading-fallback{font-size:var(--kj-text-sm)}.kj-table-expansion-row>td{background:var(--kj-bg-elevated)}.kj-table-tbody-pinned[data-pin=top]>tr>td{background:var(--kj-bg-elevated);border-bottom:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 4px 6px -4px #00000040;position:sticky;top:0;z-index:2}.kj-table-tbody-pinned[data-pin=bottom]>tr>td{background:var(--kj-bg-elevated);border-top:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 -4px 6px -4px #00000040;position:sticky;bottom:0;z-index:2}.kj-table-group-toggle{display:inline-flex;align-items:center;gap:var(--kj-base-space-xs, .25rem);background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}.kj-table-group-toggle__chevron{display:inline-block;width:.75rem;font-family:var(--kj-font-mono);color:var(--kj-fg-muted);transition:transform var(--kj-transition)}.kj-table-group-toggle[aria-expanded=true] .kj-table-group-toggle__chevron{transform:rotate(90deg)}.kj-table-group-toggle__count{margin-inline-start:var(--kj-base-space-xs, .25rem);font-size:.75em;color:var(--kj-fg-muted);font-variant-numeric:tabular-nums}:host tbody tr[data-row-grouped] td{background:var(--kj-bg-elevated);font-weight:600}\n"], dependencies: [{ kind: "directive", type: KjTableHeader, selector: "[kjTableHeader]", inputs: ["kjHeader"] }, { kind: "directive", type: KjTableRow, selector: "[kjTableRow]", inputs: ["kjRow"] }, { kind: "directive", type: KjTableCell, selector: "[kjTableCell]", inputs: ["kjCell"] }, { kind: "directive", type: KjTableKeyboardNav, selector: "[kjTableKeyboardNav]" }, { kind: "directive", type: KjTableVirtual, selector: "[kjTableVirtual]", inputs: ["kjCount", "kjEstimateSize", "kjOverscan"], exportAs: ["kjTableVirtual"] }, { kind: "directive", type: KjIconDirective, selector: "span[kjIcon], i[kjIcon]", inputs: ["kjIcon", "kjIconLabel", "kjIconColor", "kjIconSize"] }, { kind: "component", type: KjCheckboxComponent, selector: "kj-checkbox", inputs: ["checked", "disabled", "indeterminate", "size"], outputs: ["checkedChange"] }, { kind: "directive", type: KjCellEditorOutlet, selector: "[kjCellEditorOutlet]", inputs: ["kjEditor", "kjValue", "kjMeta"], outputs: ["commit", "editCancel"] }, { kind: "directive", type: KjFilterCellOutlet, selector: "[kjFilterCell]", inputs: ["kjColumn", "kjFilter"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: KjTableComponent, decorators: [{
             type: Component,
@@ -17080,6 +17215,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
                         '[attr.data-variant]': 'kjVariant()',
                         '[attr.data-loading]': 'isLoading() ? "" : null',
                         '[attr.data-error]': 'hasError() ? "" : null',
+                        // Drives the "state pane owns the leftover height" layout in table.css —
+                        // without it the body keeps `flex: 1` and shoves the empty pane to the
+                        // bottom of a height-constrained table instead of centering it.
+                        '[attr.data-empty]': 'showEmpty() ? "" : null',
                     }, template: `
     <div class="kj-table-wrapper">
       <!-- Toolbar projection: matches either an explicit [kjToolbar] marker
@@ -17394,12 +17533,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
 
       @if (showEmpty()) {
         <div class="kj-table-empty" role="status">
-          <ng-content select="[kjEmpty]" />
+          @if (emptyTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjEmpty]" />
+          }
         </div>
       }
       @if (hasError()) {
         <div class="kj-table-error" role="alert">
-          <ng-content select="[kjError]" />
+          @if (errorTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjError]" />
+          }
         </div>
       }
       @if (isLoading()) {
@@ -17407,16 +17554,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
              aria-live="polite"
              aria-busy="true"
              [attr.data-has-rows]="effectiveData().length > 0 ? '' : null">
-          <ng-content select="[kjLoading]">
-            <span class="kj-table-loading-fallback">Loading…</span>
-          </ng-content>
+          @if (loadingTpl(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" />
+          } @else {
+            <ng-content select="[kjLoading]">
+              <span class="kj-table-loading-fallback">Loading…</span>
+            </ng-content>
+          }
         </div>
       }
 
       <ng-content />
     </div>
-  `, encapsulation: ViewEncapsulation.Emulated, styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0;font-family:var(--kj-font-sans);font-size:var(--kj-text-sm);--kj-table-row-height: 2.25rem}:host([data-density=\"compact\"]){--kj-table-row-height: 1.75rem}:host([data-density=\"comfortable\"]){--kj-table-row-height: 2.75rem}.kj-table-wrapper{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;position:relative}.kj-table-body{position:relative;overflow:auto;display:block;flex:1 1 auto;min-height:0;min-width:0}.kj-table-body thead th{position:sticky;top:0;z-index:2;background:var(--kj-table-header-bg, var(--kj-bg-surface))}.kj-table-body thead th[data-pin]{z-index:3}.kj-table-body>table{min-width:100%}:host th,:host td{height:var(--kj-table-row-height)}:host table{width:100%;border-collapse:collapse;background:var(--kj-bg-surface);color:var(--kj-fg-default)}:host th,:host td{text-align:left;padding:var(--kj-base-space-sm) var(--kj-base-space-md);border-bottom:1px solid var(--kj-border-default);position:relative}:host th{font-weight:600;background:var(--kj-bg-elevated)}:host th[aria-sort]{-webkit-user-select:none;user-select:none}.kj-table-sort-indicator{display:inline-flex;align-items:center;margin-inline-start:var(--kj-base-space-xs, .25rem);color:var(--kj-fg-subtle, var(--kj-fg-muted));transition:color var(--kj-transition);vertical-align:middle}:host th[data-sort=asc] .kj-table-sort-indicator,:host th[data-sort=desc] .kj-table-sort-indicator{color:var(--kj-fg-primary)}:host th[aria-sort]:hover .kj-table-sort-indicator,:host th[aria-sort]:focus-visible .kj-table-sort-indicator{color:var(--kj-fg-default)}:host([data-density=\"compact\"]) th,:host([data-density=\"compact\"]) td{padding:var(--kj-base-space-xs) var(--kj-base-space-sm)}:host([data-density=\"comfortable\"]) th,:host([data-density=\"comfortable\"]) td{padding:var(--kj-base-space-md) var(--kj-base-space-lg)}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td{background:var(--kj-bg-elevated)}:host([data-variant=\"clean\"]) th,:host([data-variant=\"clean\"]) td{border-bottom-color:transparent}:host td:focus-visible,:host th:focus-visible{outline:2px solid var(--kj-border-focus);outline-offset:-2px}:host td.kj-table-cell--editing{position:relative}:host td .kj-table-cell-ghost{visibility:hidden;white-space:pre;display:inline-block;pointer-events:none}:host td.kj-table-cell--editing ::ng-deep kj-text-editor,:host td.kj-table-cell--editing ::ng-deep kj-number-editor,:host td.kj-table-cell--editing ::ng-deep kj-select-editor,:host td.kj-table-cell--editing ::ng-deep kj-date-editor,:host td.kj-table-cell--editing ::ng-deep kj-boolean-editor{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;padding:inherit!important;background:var(--kj-bg-surface);z-index:1}:host td.kj-table-cell--editing ::ng-deep kj-input,:host td.kj-table-cell--editing ::ng-deep kj-number-input,:host td.kj-table-cell--editing ::ng-deep kj-select{display:flex!important;width:100%!important;min-width:0!important;box-sizing:border-box}:host td.kj-table-cell--editing ::ng-deep input,:host td.kj-table-cell--editing ::ng-deep .kj-select-trigger{width:100%!important;min-width:0!important;box-sizing:border-box}:host td .kj-table-editor-anchor{display:none}:host tr[data-selected] td{background:color-mix(in oklab,var(--kj-bg-primary, var(--kj-bg-accent, currentColor)) 12%,var(--kj-bg-surface))}:host tr[data-selected] td:first-child{box-shadow:inset 3px 0 0 0 var(--kj-bg-primary, var(--kj-fg-primary))}:host td[data-pin=left],:host th[data-pin=left]{position:sticky;left:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=right],:host th[data-pin=right]{position:sticky;right:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=left]:not(:has(+td[data-pin=left])),:host th[data-pin=left]:not(:has(+th[data-pin=left])){border-right:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:4px 0 6px -4px #00000040}:host tr>:not([data-pin=right])+td[data-pin=right],:host tr>:not([data-pin=right])+th[data-pin=right]{border-left:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:-4px 0 6px -4px #00000040}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td[data-pin]{background:var(--kj-bg-elevated)}.kj-table-resize-handle{position:absolute;top:25%;right:0;width:6px;height:50%;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;background:transparent;border-right:2px solid var(--kj-border-strong, var(--kj-border-default));transition:border-color var(--kj-transition),background var(--kj-transition),width var(--kj-transition)}.kj-table-resize-handle:hover,.kj-table-resize-handle:focus-visible{border-right-color:var(--kj-border-focus);background:color-mix(in srgb,var(--kj-border-focus) 20%,transparent);width:8px;outline:none}:host th[data-resizing] .kj-table-resize-handle{top:0;height:9999px;width:0;background:transparent;border-right:2px solid var(--kj-border-focus, var(--kj-bg-primary));transform:translate(var(--kj-resize-delta, 0px));pointer-events:none;z-index:3;transition:none}:host th.kj-table-select-cell,:host td.kj-table-select-cell{width:2.5rem;padding-inline:var(--kj-base-space-sm);text-align:center;vertical-align:middle}.kj-table-select-cell kj-checkbox{display:inline-flex;align-items:center;justify-content:center}.kj-table-filter-row>th{font-weight:400;background:var(--kj-bg-surface);border-top:1px solid var(--kj-border-muted, var(--kj-border-default))}.kj-table-filter-cell{padding-top:var(--kj-base-space-xs);padding-bottom:var(--kj-base-space-xs);vertical-align:middle}.kj-table-filter-cell .kj-table-filter-anchor+*,.kj-table-filter-cell kj-input,.kj-table-filter-cell kj-number-input,.kj-table-filter-cell kj-date-picker,.kj-table-filter-cell kj-select{width:100%}.kj-table-filter-anchor{display:block;width:100%}:host .kj-table-editor-anchor .kj-input,:host .kj-table-editor-anchor .kj-select{--kj-input-height: 1.75rem;--kj-input-font-size: var(--kj-text-xs);--kj-input-padding-x: var(--kj-base-space-sm);--kj-input-padding-y: 0;--kj-input-radius: var(--kj-radius-selector)}.kj-table-empty,.kj-table-error,.kj-table-loading{display:flex;align-items:center;justify-content:center;padding:var(--kj-base-space-lg);color:var(--kj-fg-muted)}.kj-table-loading{position:absolute;inset:0;background:color-mix(in srgb,var(--kj-bg-surface) 70%,transparent);pointer-events:none}.kj-table-loading[data-has-rows]{inset:0 0 auto;height:2px;background:var(--kj-bg-primary);padding:0;animation:kj-table-loading-pulse 1.4s ease-in-out infinite}.kj-table-loading[data-has-rows] .kj-table-loading-fallback,.kj-table-loading[data-has-rows] ::ng-deep [kjLoading]{display:none}@keyframes kj-table-loading-pulse{0%,to{opacity:.55}50%{opacity:1}}.kj-table-error{color:var(--kj-fg-error, var(--kj-fg-default))}.kj-table-loading-fallback{font-size:var(--kj-text-sm)}.kj-table-expansion-row>td{background:var(--kj-bg-elevated)}.kj-table-tbody-pinned[data-pin=top]>tr>td{background:var(--kj-bg-elevated);border-bottom:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 4px 6px -4px #00000040;position:sticky;top:0;z-index:2}.kj-table-tbody-pinned[data-pin=bottom]>tr>td{background:var(--kj-bg-elevated);border-top:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 -4px 6px -4px #00000040;position:sticky;bottom:0;z-index:2}.kj-table-group-toggle{display:inline-flex;align-items:center;gap:var(--kj-base-space-xs, .25rem);background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}.kj-table-group-toggle__chevron{display:inline-block;width:.75rem;font-family:var(--kj-font-mono);color:var(--kj-fg-muted);transition:transform var(--kj-transition)}.kj-table-group-toggle[aria-expanded=true] .kj-table-group-toggle__chevron{transform:rotate(90deg)}.kj-table-group-toggle__count{margin-inline-start:var(--kj-base-space-xs, .25rem);font-size:.75em;color:var(--kj-fg-muted);font-variant-numeric:tabular-nums}:host tbody tr[data-row-grouped] td{background:var(--kj-bg-elevated);font-weight:600}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { kjResource: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjResource", required: false }] }], kjDensity: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjDensity", required: false }] }], kjVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjVariant", required: false }] }], kjLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjLoading", required: false }] }], kjSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSelection", required: false }] }, { type: i0.Output, args: ["kjSelectionChange"] }], kjSelectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSelectionMode", required: false }] }], kjShowSelectionColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjShowSelectionColumn", required: false }] }], kjStorageKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjStorageKey", required: false }] }], kjStorageAdapter: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjStorageAdapter", required: false }] }], kjVirtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjVirtual", required: false }] }], kjEstimatedRowSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEstimatedRowSize", required: false }] }], kjEnableFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableFilters", required: false }] }], kjEnableResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableResize", required: false }] }], kjEnableRowPinning: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableRowPinning", required: false }] }], kjEditOnDoubleClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEditOnDoubleClick", required: false }] }], kjPageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjPageSize", required: false }] }], kjRowExpansionTpl: [{ type: i0.ContentChild, args: ['kjRowExpansion', { isSignal: true }] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KjCellTemplateDirective), { isSignal: true }] }], cellEdit: [{ type: i0.Output, args: ["cellEdit"] }], stateChange: [{ type: i0.Output, args: ["stateChange"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowDoubleClick: [{ type: i0.Output, args: ["rowDoubleClick"] }] } });
+  `, encapsulation: ViewEncapsulation.Emulated, styles: [":host{display:flex;flex-direction:column;min-height:0;min-width:0;font-family:var(--kj-font-sans);font-size:var(--kj-text-sm);--kj-table-row-height: 2.25rem}:host([data-density=\"compact\"]){--kj-table-row-height: 1.75rem}:host([data-density=\"comfortable\"]){--kj-table-row-height: 2.75rem}.kj-table-wrapper{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;position:relative}.kj-table-body{position:relative;overflow:auto;display:block;flex:1 1 auto;min-height:0;min-width:0}.kj-table-body thead th{position:sticky;top:0;z-index:2;background:var(--kj-table-header-bg, var(--kj-bg-surface))}.kj-table-body thead th[data-pin]{z-index:3}.kj-table-body>table{min-width:100%}:host th,:host td{height:var(--kj-table-row-height)}:host table{width:100%;border-collapse:collapse;background:var(--kj-bg-surface);color:var(--kj-fg-default)}:host th,:host td{text-align:left;padding:var(--kj-base-space-sm) var(--kj-base-space-md);border-bottom:1px solid var(--kj-border-default);position:relative}:host th{font-weight:600;background:var(--kj-bg-elevated)}:host th[aria-sort]{-webkit-user-select:none;user-select:none}.kj-table-sort-indicator{display:inline-flex;align-items:center;margin-inline-start:var(--kj-base-space-xs, .25rem);color:var(--kj-fg-subtle, var(--kj-fg-muted));transition:color var(--kj-transition);vertical-align:middle}:host th[data-sort=asc] .kj-table-sort-indicator,:host th[data-sort=desc] .kj-table-sort-indicator{color:var(--kj-fg-primary)}:host th[aria-sort]:hover .kj-table-sort-indicator,:host th[aria-sort]:focus-visible .kj-table-sort-indicator{color:var(--kj-fg-default)}:host([data-density=\"compact\"]) th,:host([data-density=\"compact\"]) td{padding:var(--kj-base-space-xs) var(--kj-base-space-sm)}:host([data-density=\"comfortable\"]) th,:host([data-density=\"comfortable\"]) td{padding:var(--kj-base-space-md) var(--kj-base-space-lg)}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td{background:var(--kj-bg-elevated)}:host([data-variant=\"clean\"]) th,:host([data-variant=\"clean\"]) td{border-bottom-color:transparent}:host td:focus-visible,:host th:focus-visible{outline:2px solid var(--kj-border-focus);outline-offset:-2px}:host td.kj-table-cell--editing{position:relative}:host td .kj-table-cell-ghost{visibility:hidden;white-space:pre;display:inline-block;pointer-events:none}:host td.kj-table-cell--editing ::ng-deep kj-text-editor,:host td.kj-table-cell--editing ::ng-deep kj-number-editor,:host td.kj-table-cell--editing ::ng-deep kj-select-editor,:host td.kj-table-cell--editing ::ng-deep kj-date-editor,:host td.kj-table-cell--editing ::ng-deep kj-boolean-editor{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;padding:inherit!important;background:var(--kj-bg-surface);z-index:1}:host td.kj-table-cell--editing ::ng-deep kj-input,:host td.kj-table-cell--editing ::ng-deep kj-number-input,:host td.kj-table-cell--editing ::ng-deep kj-select{display:flex!important;width:100%!important;min-width:0!important;box-sizing:border-box}:host td.kj-table-cell--editing ::ng-deep input,:host td.kj-table-cell--editing ::ng-deep .kj-select-trigger{width:100%!important;min-width:0!important;box-sizing:border-box}:host td .kj-table-editor-anchor{display:none}:host tr[data-selected] td{background:color-mix(in oklab,var(--kj-bg-primary, var(--kj-bg-accent, currentColor)) 12%,var(--kj-bg-surface))}:host tr[data-selected] td:first-child{box-shadow:inset 3px 0 0 0 var(--kj-bg-primary, var(--kj-fg-primary))}:host td[data-pin=left],:host th[data-pin=left]{position:sticky;left:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=right],:host th[data-pin=right]{position:sticky;right:0;z-index:1;background:var(--kj-bg-surface)}:host td[data-pin=left]:not(:has(+td[data-pin=left])),:host th[data-pin=left]:not(:has(+th[data-pin=left])){border-right:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:4px 0 6px -4px #00000040}:host tr>:not([data-pin=right])+td[data-pin=right],:host tr>:not([data-pin=right])+th[data-pin=right]{border-left:1px solid var(--kj-border-strong, var(--kj-border-default));box-shadow:-4px 0 6px -4px #00000040}:host([data-variant=\"striped\"]) tbody tr:nth-child(2n) td[data-pin]{background:var(--kj-bg-elevated)}.kj-table-resize-handle{position:absolute;top:25%;right:0;width:6px;height:50%;cursor:col-resize;-webkit-user-select:none;user-select:none;touch-action:none;background:transparent;border-right:2px solid var(--kj-border-strong, var(--kj-border-default));transition:border-color var(--kj-transition),background var(--kj-transition),width var(--kj-transition)}.kj-table-resize-handle:hover,.kj-table-resize-handle:focus-visible{border-right-color:var(--kj-border-focus);background:color-mix(in srgb,var(--kj-border-focus) 20%,transparent);width:8px;outline:none}:host th[data-resizing] .kj-table-resize-handle{top:0;height:9999px;width:0;background:transparent;border-right:2px solid var(--kj-border-focus, var(--kj-bg-primary));transform:translate(var(--kj-resize-delta, 0px));pointer-events:none;z-index:3;transition:none}:host th.kj-table-select-cell,:host td.kj-table-select-cell{width:2.5rem;padding-inline:var(--kj-base-space-sm);text-align:center;vertical-align:middle}.kj-table-select-cell kj-checkbox{display:inline-flex;align-items:center;justify-content:center}.kj-table-filter-row>th{font-weight:400;background:var(--kj-bg-surface);border-top:1px solid var(--kj-border-muted, var(--kj-border-default))}.kj-table-filter-cell{padding-top:var(--kj-base-space-xs);padding-bottom:var(--kj-base-space-xs);vertical-align:middle}.kj-table-filter-cell .kj-table-filter-anchor+*,.kj-table-filter-cell kj-input,.kj-table-filter-cell kj-number-input,.kj-table-filter-cell kj-date-picker,.kj-table-filter-cell kj-select{width:100%}.kj-table-filter-anchor{display:block;width:100%}:host .kj-table-editor-anchor .kj-input,:host .kj-table-editor-anchor .kj-select{--kj-input-height: 1.75rem;--kj-input-font-size: var(--kj-text-xs);--kj-input-padding-x: var(--kj-base-space-sm);--kj-input-padding-y: 0;--kj-input-radius: var(--kj-radius-selector)}.kj-table-empty,.kj-table-error,.kj-table-loading{display:flex;align-items:center;justify-content:center;padding:var(--kj-base-space-lg);color:var(--kj-fg-muted)}:host([data-empty]) .kj-table-body,:host([data-error]) .kj-table-body{flex:0 1 auto}.kj-table-empty,.kj-table-error{flex:1 1 auto;min-height:0}.kj-table-loading{position:absolute;inset:0;background:color-mix(in srgb,var(--kj-bg-surface) 70%,transparent);pointer-events:none}.kj-table-loading[data-has-rows]{inset:0 0 auto;height:2px;background:var(--kj-bg-primary);padding:0;animation:kj-table-loading-pulse 1.4s ease-in-out infinite}.kj-table-loading[data-has-rows] .kj-table-loading-fallback,.kj-table-loading[data-has-rows] ::ng-deep [kjLoading]{display:none}@keyframes kj-table-loading-pulse{0%,to{opacity:.55}50%{opacity:1}}.kj-table-error{color:var(--kj-fg-error, var(--kj-fg-default))}.kj-table-loading-fallback{font-size:var(--kj-text-sm)}.kj-table-expansion-row>td{background:var(--kj-bg-elevated)}.kj-table-tbody-pinned[data-pin=top]>tr>td{background:var(--kj-bg-elevated);border-bottom:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 4px 6px -4px #00000040;position:sticky;top:0;z-index:2}.kj-table-tbody-pinned[data-pin=bottom]>tr>td{background:var(--kj-bg-elevated);border-top:2px solid var(--kj-border-primary, var(--kj-border-strong, var(--kj-border-default)));box-shadow:0 -4px 6px -4px #00000040;position:sticky;bottom:0;z-index:2}.kj-table-group-toggle{display:inline-flex;align-items:center;gap:var(--kj-base-space-xs, .25rem);background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}.kj-table-group-toggle__chevron{display:inline-block;width:.75rem;font-family:var(--kj-font-mono);color:var(--kj-fg-muted);transition:transform var(--kj-transition)}.kj-table-group-toggle[aria-expanded=true] .kj-table-group-toggle__chevron{transform:rotate(90deg)}.kj-table-group-toggle__count{margin-inline-start:var(--kj-base-space-xs, .25rem);font-size:.75em;color:var(--kj-fg-muted);font-variant-numeric:tabular-nums}:host tbody tr[data-row-grouped] td{background:var(--kj-bg-elevated);font-weight:600}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { kjResource: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjResource", required: false }] }], kjDensity: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjDensity", required: false }] }], kjVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjVariant", required: false }] }], kjLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjLoading", required: false }] }], kjSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSelection", required: false }] }, { type: i0.Output, args: ["kjSelectionChange"] }], kjSelectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjSelectionMode", required: false }] }], kjShowSelectionColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjShowSelectionColumn", required: false }] }], kjStorageKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjStorageKey", required: false }] }], kjStorageAdapter: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjStorageAdapter", required: false }] }], kjVirtual: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjVirtual", required: false }] }], kjEstimatedRowSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEstimatedRowSize", required: false }] }], kjEnableFilters: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableFilters", required: false }] }], kjEnableResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableResize", required: false }] }], kjEnableRowPinning: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEnableRowPinning", required: false }] }], kjEditOnDoubleClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjEditOnDoubleClick", required: false }] }], kjPageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "kjPageSize", required: false }] }], kjRowExpansionTpl: [{ type: i0.ContentChild, args: ['kjRowExpansion', { isSignal: true }] }], cellTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => KjCellTemplateDirective), { isSignal: true }] }], emptyTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KjTableEmptyTemplate), { isSignal: true }] }], loadingTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KjTableLoadingTemplate), { isSignal: true }] }], errorTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KjTableErrorTemplate), { isSignal: true }] }], cellEdit: [{ type: i0.Output, args: ["cellEdit"] }], stateChange: [{ type: i0.Output, args: ["stateChange"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }], rowDoubleClick: [{ type: i0.Output, args: ["rowDoubleClick"] }] } });
 // ── helpers ───────────────────────────────────────────────────────────────
 function cellMeta(col) {
     return col.columnDef.meta?.kj;
@@ -20506,5 +20657,5 @@ const KJ_COMPONENTS_VERSION = '0.0.1';
  * Generated bundle index. Do not edit.
  */
 
-export { KJ_COMPONENTS_VERSION, KJ_EDITOR_CONTRACT, KJ_FILTER_CONTEXT, KjAccordionComponent, KjAccordionContentComponent, KjAccordionItemComponent, KjAccordionTriggerComponent, KjActionSheet, KjActionSheetComponent, KjActionSheetRef, KjActionSheetService, KjAlertActionsComponent, KjAlertComponent, KjAlertDescriptionComponent, KjAlertDismissComponent, KjAlertIconComponent, KjAlertTitleComponent, KjAvatarComponent, KjAvatarGroupComponent, KjBadgeComponent, KjBooleanEditor, KjBreadcrumbComponent, KjBreadcrumbCurrentComponent, KjBreadcrumbEllipsisComponent, KjBreadcrumbItemComponent, KjBreadcrumbLinkComponent, KjBreadcrumbListComponent, KjBreadcrumbSeparatorComponent, KjBulkAction, KjButtonComponent, KjButtonGroupComponent, KjCalendarComponent, KjCardComponent, KjCardContentComponent, KjCardCoverComponent, KjCardFooterComponent, KjCardHeaderComponent, KjCardSubtitleComponent, KjCardTitleComponent, KjCarouselAutoplayComponent, KjCarouselComponent, KjCarouselIndicatorsComponent, KjCarouselNextComponent, KjCarouselPauseComponent, KjCarouselPreviousComponent, KjCarouselSlideComponent, KjCarouselViewportComponent, KjCascadeOptionComponent, KjCascadeSelectComponent, KjCascadeSubPanelComponent, KjCellEditorOutlet, KjCellTemplateDirective, KjChartComponent, KjChatAvatarComponent, KjChatBubbleComponent, KjChatComponent, KjChatFooterComponent, KjChatHeaderComponent, KjChatLogComponent, KjChatMessage, KjChatThread, KjCheckboxComponent, KjColorPickerComponent, KjComboboxComponent, KjComboboxEmptyComponent, KjComboboxLoadingComponent, KjComboboxOptionComponent, KjCommandEmptyComponent, KjCommandGroupComponent, KjCommandInputComponent, KjCommandItemComponent, KjCommandPaletteComponent, KjCommandPaletteFooter, KjCommandPaletteItemTemplate, KjCommandSeparatorComponent, KjConfirmPopupActionComponent, KjConfirmPopupActionsComponent, KjConfirmPopupCancelComponent, KjConfirmPopupComponent, KjConfirmPopupContentComponent, KjConfirmPopupMessageComponent, KjConfirmPopupTriggerComponent, KjDateEditor, KjDateFilter, KjDatePickerComponent, KjDateRangePresetsComponent, KjDatetimePickerComponent, KjDialogComponent, KjDirectionToggle, KjDividerComponent, KjDrawerComponent, KjDropdownMenuComponent, KjEditorComponent, KjEmptyStateActionsComponent, KjEmptyStateComponent, KjEmptyStateDescriptionComponent, KjEmptyStateIconComponent, KjEmptyStateTitleComponent, KjFieldComponent, KjFieldErrorComponent, KjFieldGroupComponent, KjFieldHelpComponent, KjFieldLabelComponent, KjFileUploadComponent, KjFilterCellOutlet, KjFormActionsComponent, KjFormComponent, KjFormSummaryComponent, KjIconGalleryExample, KjIconUsageExample, KjInputComponent, KjInputGroupAddonComponent, KjInputGroupComponent, KjInputMaskComponent, KjInputMaskCreditCardExample, KjInputMaskCustomTokensExample, KjInputMaskDateExample, KjInputMaskExample, KjInputMaskUsageExample, KjInputMaskValidationExample, KjInputOtpComponent, KjKbdComponent, KjLinkComponent, KjListComponent, KjListItemComponent, KjMenubarComponent, KjMenubarItemComponent, KjNumberEditor, KjNumberFilter, KjNumberInputComponent, KjOptionComponent, KjOverlayBadgeComponent, KjOverlayBadgeContentComponent, KjPaginationComponent, KjPaginationDefaultComponent, KjPaginationEllipsisComponent, KjPaginationFirstComponent, KjPaginationInfoComponent, KjPaginationItemComponent, KjPaginationLastComponent, KjPaginationNextComponent, KjPaginationPreviousComponent, KjPasswordInputComponent, KjPopoverComponent, KjProgressBarComponent, KjPromptInput, KjRadioComponent, KjRadioGroupComponent, KjRichTextEditorComponent, KjSelectComponent, KjSelectEditor, KjSelectFilter, KjSheetComponent, KjSkeletonComponent, KjSkipLinkComponent, KjSliderComponent, KjSpeedDialActionComponent, KjSpeedDialActionsComponent, KjSpeedDialComponent, KjSpeedDialTriggerComponent, KjSpinnerComponent, KjStepComponent, KjStepContentComponent, KjStepLabelComponent, KjStepperComponent, KjStepperNextComponent, KjStepperPreviousComponent, KjStepperResetComponent, KjTabComponent, KjTabListComponent, KjTabPanelComponent, KjTableComponent, KjTablePaginationComponent, KjTableSidePanelComponent, KjTableSidePanelContent, KjTableStatusBarComponent, KjTableToolbarComponent, KjTableVirtual, KjTabsComponent, KjTagComponent, KjTagListComponent, KjTagRemoveComponent, KjTextEditor, KjTextFilter, KjTextareaComponent, KjTimePickerComponent, KjToastCloseComponent, KjToastComponent, KjToastViewportComponent, KjToastWrapperComponent, KjToggleComponent, KjTooltipComponent, KjTreeSelectComponent, KjTreeSelectNodeComponent, LUCIDE_ICON_NAMES, bold, bulletList, codeBlock, copyToClipboard, defaultFeatures, downloadString, exportCsv, exportJson, heading, history, image, inlineCode, italic, link, markdownShortcuts, orderedList, provideLucideIcons, quote, renderMarkdown, strike, toTsv, underline };
+export { KJ_COMPONENTS_VERSION, KJ_EDITOR_CONTRACT, KJ_FILTER_CONTEXT, KjAccordionComponent, KjAccordionContentComponent, KjAccordionItemComponent, KjAccordionTriggerComponent, KjActionSheet, KjActionSheetComponent, KjActionSheetRef, KjActionSheetService, KjAlertActionsComponent, KjAlertComponent, KjAlertDescriptionComponent, KjAlertDismissComponent, KjAlertIconComponent, KjAlertTitleComponent, KjAvatarComponent, KjAvatarGroupComponent, KjBadgeComponent, KjBooleanEditor, KjBreadcrumbComponent, KjBreadcrumbCurrentComponent, KjBreadcrumbEllipsisComponent, KjBreadcrumbItemComponent, KjBreadcrumbLinkComponent, KjBreadcrumbListComponent, KjBreadcrumbSeparatorComponent, KjBulkAction, KjButtonComponent, KjButtonGroupComponent, KjCalendarComponent, KjCardComponent, KjCardContentComponent, KjCardCoverComponent, KjCardFooterComponent, KjCardHeaderComponent, KjCardSubtitleComponent, KjCardTitleComponent, KjCarouselAutoplayComponent, KjCarouselComponent, KjCarouselIndicatorsComponent, KjCarouselNextComponent, KjCarouselPauseComponent, KjCarouselPreviousComponent, KjCarouselSlideComponent, KjCarouselViewportComponent, KjCascadeOptionComponent, KjCascadeSelectComponent, KjCascadeSubPanelComponent, KjCellEditorOutlet, KjCellTemplateDirective, KjChartComponent, KjChatAvatarComponent, KjChatBubbleComponent, KjChatComponent, KjChatFooterComponent, KjChatHeaderComponent, KjChatLogComponent, KjChatMessage, KjChatThread, KjCheckboxComponent, KjColorPickerComponent, KjComboboxComponent, KjComboboxEmptyComponent, KjComboboxLoadingComponent, KjComboboxOptionComponent, KjCommandEmptyComponent, KjCommandGroupComponent, KjCommandInputComponent, KjCommandItemComponent, KjCommandPaletteComponent, KjCommandPaletteFooter, KjCommandPaletteItemTemplate, KjCommandSeparatorComponent, KjConfirmPopupActionComponent, KjConfirmPopupActionsComponent, KjConfirmPopupCancelComponent, KjConfirmPopupComponent, KjConfirmPopupContentComponent, KjConfirmPopupMessageComponent, KjConfirmPopupTriggerComponent, KjDateEditor, KjDateFilter, KjDatePickerComponent, KjDateRangePresetsComponent, KjDatetimePickerComponent, KjDialogComponent, KjDirectionToggle, KjDividerComponent, KjDrawerComponent, KjDropdownMenuComponent, KjEditorComponent, KjEmptyStateActionsComponent, KjEmptyStateComponent, KjEmptyStateDescriptionComponent, KjEmptyStateIconComponent, KjEmptyStateTitleComponent, KjFieldComponent, KjFieldErrorComponent, KjFieldGroupComponent, KjFieldHelpComponent, KjFieldLabelComponent, KjFileUploadComponent, KjFilterCellOutlet, KjFormActionsComponent, KjFormComponent, KjFormSummaryComponent, KjIconGalleryExample, KjIconUsageExample, KjInputComponent, KjInputGroupAddonComponent, KjInputGroupComponent, KjInputMaskComponent, KjInputMaskCreditCardExample, KjInputMaskCustomTokensExample, KjInputMaskDateExample, KjInputMaskExample, KjInputMaskUsageExample, KjInputMaskValidationExample, KjInputOtpComponent, KjKbdComponent, KjLinkComponent, KjListComponent, KjListItemComponent, KjMenubarComponent, KjMenubarItemComponent, KjNumberEditor, KjNumberFilter, KjNumberInputComponent, KjOptionComponent, KjOverlayBadgeComponent, KjOverlayBadgeContentComponent, KjPaginationComponent, KjPaginationDefaultComponent, KjPaginationEllipsisComponent, KjPaginationFirstComponent, KjPaginationInfoComponent, KjPaginationItemComponent, KjPaginationLastComponent, KjPaginationNextComponent, KjPaginationPreviousComponent, KjPasswordInputComponent, KjPopoverComponent, KjProgressBarComponent, KjPromptInput, KjRadioComponent, KjRadioGroupComponent, KjRichTextEditorComponent, KjSelectComponent, KjSelectEditor, KjSelectFilter, KjSheetComponent, KjSkeletonComponent, KjSkipLinkComponent, KjSliderComponent, KjSpeedDialActionComponent, KjSpeedDialActionsComponent, KjSpeedDialComponent, KjSpeedDialTriggerComponent, KjSpinnerComponent, KjStepComponent, KjStepContentComponent, KjStepLabelComponent, KjStepperComponent, KjStepperNextComponent, KjStepperPreviousComponent, KjStepperResetComponent, KjTabComponent, KjTabListComponent, KjTabPanelComponent, KjTableComponent, KjTableEmptyTemplate, KjTableErrorTemplate, KjTableLoadingTemplate, KjTablePaginationComponent, KjTableSidePanelComponent, KjTableSidePanelContent, KjTableStatusBarComponent, KjTableToolbarComponent, KjTableVirtual, KjTabsComponent, KjTagComponent, KjTagListComponent, KjTagRemoveComponent, KjTextEditor, KjTextFilter, KjTextareaComponent, KjTimePickerComponent, KjToastCloseComponent, KjToastComponent, KjToastViewportComponent, KjToastWrapperComponent, KjToggleComponent, KjTooltipComponent, KjTreeSelectComponent, KjTreeSelectNodeComponent, LUCIDE_ICON_NAMES, bold, bulletList, codeBlock, copyToClipboard, defaultFeatures, downloadString, exportCsv, exportJson, heading, history, image, inlineCode, italic, link, markdownShortcuts, orderedList, provideLucideIcons, quote, renderMarkdown, strike, toTsv, underline };
 //# sourceMappingURL=kouji-ui-components.mjs.map