@truenas/ui-components 0.1.35 → 0.1.37

package/fesm2022/truenas-ui-components.mjs

@@ -2836,6 +2836,139 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
             args: [{ selector: 'tn-expansion-panel', standalone: true, imports: [CommonModule], animations: [expandCollapseAnimation], template: "<div [ngClass]=\"classes()\">\n  <button class=\"tn-expansion-panel__header\"\n          [disabled]=\"disabled()\"\n          [attr.aria-expanded]=\"effectiveExpanded()\"\n          [attr.aria-controls]=\"contentId\"\n          [attr.aria-disabled]=\"disabled()\"\n          (click)=\"toggle()\">\n    @if (title()) {\n      <div class=\"tn-expansion-panel__title\">\n        {{ title() }}\n      </div>\n    }\n    <ng-content select=\"[slot=title]\" />\n\n    <div class=\"tn-expansion-panel__indicator\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n        <path d=\"m6 9 6 6 6-6\"/>\n      </svg>\n    </div>\n  </button>\n\n  <div class=\"tn-expansion-panel__content\"\n       [id]=\"contentId\"\n       [attr.aria-hidden]=\"!effectiveExpanded()\"\n       [@expandCollapse]=\"effectiveExpanded() ? 'expanded' : 'collapsed'\">\n    <ng-content />\n  </div>\n</div>", styles: [".tn-expansion-panel{border-radius:8px;transition:box-shadow .3s ease;overflow:hidden}.tn-expansion-panel--elevation-none{box-shadow:none}.tn-expansion-panel--elevation-low{box-shadow:0 1px 3px #0000001a}.tn-expansion-panel--elevation-medium{box-shadow:0 4px 6px #0000001a}.tn-expansion-panel--elevation-high{box-shadow:0 10px 15px #0000001a}.tn-expansion-panel--bordered{border:1px solid var(--tn-lines, #e5e7eb)}.tn-expansion-panel--background{background-color:var(--tn-bg2, #ffffff)}.tn-expansion-panel--disabled{opacity:.6;cursor:not-allowed}.tn-expansion-panel--disabled .tn-expansion-panel__header{cursor:not-allowed}.tn-expansion-panel--expanded .tn-expansion-panel__indicator svg{transform:rotate(180deg)}.tn-expansion-panel--padding-small .tn-expansion-panel__header{padding:12px 16px}.tn-expansion-panel--padding-small .tn-expansion-panel__content{padding:0 16px 16px}.tn-expansion-panel--padding-medium .tn-expansion-panel__header{padding:16px 24px}.tn-expansion-panel--padding-medium .tn-expansion-panel__content{padding:0 24px 24px}.tn-expansion-panel--padding-large .tn-expansion-panel__header{padding:24px 32px}.tn-expansion-panel--padding-large .tn-expansion-panel__content{padding:0 32px 32px}.tn-expansion-panel--title-header .tn-expansion-panel__title{font-size:1.125rem;font-weight:600;color:var(--tn-fg1, #1f2937)}.tn-expansion-panel--title-header .tn-expansion-panel__indicator{color:var(--tn-fg1, #1f2937)}.tn-expansion-panel--title-body .tn-expansion-panel__title{font-size:1rem;font-weight:400;color:var(--tn-fg1, #1f2937)}.tn-expansion-panel--title-body .tn-expansion-panel__indicator{color:var(--tn-fg1, #1f2937)}.tn-expansion-panel--title-link .tn-expansion-panel__title{font-size:1rem;font-weight:400;color:var(--tn-primary, #3b82f6);text-decoration:none}.tn-expansion-panel--title-link .tn-expansion-panel__indicator{color:var(--tn-primary, #3b82f6)}.tn-expansion-panel--title-link .tn-expansion-panel__header:hover:not(:disabled) .tn-expansion-panel__title{text-decoration:underline}.tn-expansion-panel--title-link .tn-expansion-panel__header:focus .tn-expansion-panel__title{text-decoration:underline}.tn-expansion-panel__header{width:100%;background:none;border:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-family:inherit;text-align:left;transition:background-color .2s ease}.tn-expansion-panel--bordered .tn-expansion-panel__header,.tn-expansion-panel--bordered.tn-expansion-panel--expanded .tn-expansion-panel__header{border-bottom:1px solid var(--tn-lines, #e5e7eb)}.tn-expansion-panel__header:hover:not(:disabled){background-color:var(--tn-alt-bg1, rgba(0, 0, 0, .05))}.tn-expansion-panel__header:focus{outline:2px solid var(--tn-primary, #3b82f6);outline-offset:-2px}.tn-expansion-panel__header:disabled{cursor:not-allowed}.tn-expansion-panel__title{margin:0;line-height:1.5;flex:1;transition:text-decoration .2s ease}.tn-expansion-panel__indicator{display:flex;align-items:center;justify-content:center;margin-left:16px;transition:transform .2s ease,color .2s ease}.tn-expansion-panel__indicator svg{transition:transform .2s ease}.tn-expansion-panel__content{overflow:hidden}.tn-expansion-panel__content:not(.tn-expansion-panel--expanded){border-bottom:none}\n"] }]
         }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], elevation: [{ type: i0.Input, args: [{ isSignal: true, alias: "elevation", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], background: [{ type: i0.Input, args: [{ isSignal: true, alias: "background", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], titleStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleStyle", required: false }] }], expandedChange: [{ type: i0.Output, args: ["expandedChange"] }], toggleEvent: [{ type: i0.Output, args: ["toggleEvent"] }] } });
 
+/**
+ * Harness for interacting with `tn-expansion-panel` in tests.
+ * Provides methods for expanding, collapsing, and querying panel state.
+ *
+ * @example
+ * ```typescript
+ * // Find and expand a panel
+ * const panel = await loader.getHarness(TnExpansionPanelHarness.with({ title: 'Settings' }));
+ * await panel.expand();
+ * expect(await panel.isExpanded()).toBe(true);
+ *
+ * // Collapse a panel
+ * await panel.collapse();
+ * expect(await panel.isExpanded()).toBe(false);
+ * ```
+ */
+class TnExpansionPanelHarness extends ComponentHarness {
+    /**
+     * The selector for the host element of a `TnExpansionPanelComponent` instance.
+     */
+    static hostSelector = 'tn-expansion-panel';
+    _header = this.locatorFor('.tn-expansion-panel__header');
+    _title = this.locatorForOptional('.tn-expansion-panel__title');
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for an expansion panel
+     * with specific attributes.
+     *
+     * @param options Options for filtering which panel instances are considered a match.
+     * @returns A `HarnessPredicate` configured with the given options.
+     *
+     * @example
+     * ```typescript
+     * // Find by title text
+     * const panel = await loader.getHarness(TnExpansionPanelHarness.with({ title: 'Settings' }));
+     *
+     * // Find by title regex
+     * const panel = await loader.getHarness(TnExpansionPanelHarness.with({ title: /settings/i }));
+     * ```
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(TnExpansionPanelHarness, options)
+            .addOption('title', options.title, (harness, title) => HarnessPredicate.stringMatches(harness.getTitle(), title));
+    }
+    /**
+     * Gets the expansion panel title text.
+     *
+     * @returns Promise resolving to the title text, or empty string if no title.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * expect(await panel.getTitle()).toBe('Settings');
+     * ```
+     */
+    async getTitle() {
+        const title = await this._title();
+        return title ? (await title.text()).trim() : '';
+    }
+    /**
+     * Checks whether the expansion panel is currently expanded.
+     *
+     * @returns Promise resolving to true if the panel is expanded.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * expect(await panel.isExpanded()).toBe(false);
+     * ```
+     */
+    async isExpanded() {
+        const header = await this._header();
+        return (await header.getAttribute('aria-expanded')) === 'true';
+    }
+    /**
+     * Checks whether the expansion panel is disabled.
+     *
+     * @returns Promise resolving to true if the panel is disabled.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * expect(await panel.isDisabled()).toBe(false);
+     * ```
+     */
+    async isDisabled() {
+        const header = await this._header();
+        return (await header.getProperty('disabled')) ?? false;
+    }
+    /**
+     * Toggles the expansion panel by clicking the header.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * await panel.toggle();
+     * ```
+     */
+    async toggle() {
+        const header = await this._header();
+        await header.click();
+    }
+    /**
+     * Expands the panel. No-op if already expanded.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * await panel.expand();
+     * expect(await panel.isExpanded()).toBe(true);
+     * ```
+     */
+    async expand() {
+        if (!(await this.isExpanded())) {
+            await this.toggle();
+        }
+    }
+    /**
+     * Collapses the panel. No-op if already collapsed.
+     *
+     * @example
+     * ```typescript
+     * const panel = await loader.getHarness(TnExpansionPanelHarness);
+     * await panel.collapse();
+     * expect(await panel.isExpanded()).toBe(false);
+     * ```
+     */
+    async collapse() {
+        if (await this.isExpanded()) {
+            await this.toggle();
+        }
+    }
+}
+
 /**
  * Directive to mark content for projection into the checkbox label area.
  * Use when the label needs rich content (links, icons, etc.) instead of plain text.
@@ -3242,6 +3375,133 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     ], template: "<div [ngClass]=\"classes()\">\n  <label class=\"tn-radio__label\" [for]=\"id\">\n    <input\n      #radioEl\n      type=\"radio\"\n      class=\"tn-radio__input\"\n      [id]=\"id\"\n      [name]=\"name()\"\n      [value]=\"value()\"\n      [checked]=\"checked\"\n      [disabled]=\"isDisabled()\"\n      [required]=\"required()\"\n      [attr.data-testid]=\"testId()\"\n      [attr.aria-describedby]=\"error() ? id + '-error' : null\"\n      [attr.aria-invalid]=\"error() ? 'true' : null\"\n      (change)=\"onRadioChange($event)\"\n    />\n    <span class=\"tn-radio__checkmark\"></span>\n    <span class=\"tn-radio__text\">{{ label() }}</span>\n  </label>\n\n  @if (error()) {\n    <div\n      class=\"tn-radio__error\"\n      role=\"alert\"\n      aria-live=\"polite\"\n      [id]=\"id + '-error'\"\n    >\n      {{ error() }}\n    </div>\n  }\n</div>", styles: [".tn-radio{display:inline-block;margin-bottom:.5rem}.tn-radio__label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;gap:.5rem}.tn-radio__label:hover .tn-radio__checkmark{border-color:var(--tn-primary, #007cba)}.tn-radio__input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.tn-radio__input:focus+.tn-radio__checkmark{outline:2px solid var(--tn-primary, #007cba);outline-offset:2px}.tn-radio__input:checked+.tn-radio__checkmark{border-color:var(--tn-primary, #007cba);background-color:var(--tn-primary, #007cba)}.tn-radio__input:checked+.tn-radio__checkmark:after{display:block}.tn-radio__input:disabled+.tn-radio__checkmark{border-color:var(--tn-lines, #e5e7eb);background-color:var(--tn-alt-bg1, #f8f9fa);cursor:not-allowed}.tn-radio__checkmark{position:relative;height:18px;width:18px;border:2px solid var(--tn-lines, #e5e7eb);border-radius:50%;background-color:transparent;transition:all .2s ease;flex-shrink:0}.tn-radio__checkmark:after{content:\"\";position:absolute;display:none;top:50%;left:50%;width:8px;height:8px;border-radius:50%;background-color:#fff;transform:translate(-50%,-50%)}.tn-radio__text{color:var(--tn-fg1, #000000);font-size:14px;line-height:1.4}.tn-radio__error{margin-top:.25rem;font-size:12px;color:var(--tn-red, #dc3545)}.tn-radio--disabled .tn-radio__label{cursor:not-allowed;opacity:.6}.tn-radio--disabled .tn-radio__text{color:var(--tn-fg2, #6c757d)}.tn-radio--error .tn-radio__checkmark{border-color:var(--tn-red, #dc3545)}\n"] }]
         }], propDecorators: { radioEl: [{ type: i0.ViewChild, args: ['radioEl', { isSignal: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], testId: [{ type: i0.Input, args: [{ isSignal: true, alias: "testId", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], change: [{ type: i0.Output, args: ["change"] }] } });
 
+/**
+ * Harness for interacting with `tn-radio` in tests.
+ * Provides methods for selecting and querying radio button state.
+ *
+ * @example
+ * ```typescript
+ * // Find and select a radio button
+ * const radio = await loader.getHarness(TnRadioHarness.with({ label: 'Option A' }));
+ * await radio.check();
+ * expect(await radio.isChecked()).toBe(true);
+ *
+ * // Find by testId
+ * const option = await loader.getHarness(TnRadioHarness.with({ testId: 'color-red' }));
+ * ```
+ */
+class TnRadioHarness extends ComponentHarness {
+    /**
+     * The selector for the host element of a `TnRadioComponent` instance.
+     */
+    static hostSelector = 'tn-radio';
+    _input = this.locatorFor('.tn-radio__input');
+    _label = this.locatorFor('.tn-radio__label');
+    _text = this.locatorFor('.tn-radio__text');
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a radio button
+     * with specific attributes.
+     *
+     * @param options Options for filtering which radio instances are considered a match.
+     * @returns A `HarnessPredicate` configured with the given options.
+     *
+     * @example
+     * ```typescript
+     * // Find by label text
+     * const radio = await loader.getHarness(TnRadioHarness.with({ label: 'Option A' }));
+     *
+     * // Find by label regex
+     * const radio = await loader.getHarness(TnRadioHarness.with({ label: /option/i }));
+     *
+     * // Find by testId
+     * const radio = await loader.getHarness(TnRadioHarness.with({ testId: 'my-radio' }));
+     * ```
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(TnRadioHarness, options)
+            .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabelText(), label))
+            .addOption('testId', options.testId, async (harness, testId) => {
+            return (await harness.getTestId()) === testId;
+        });
+    }
+    /**
+     * Gets the radio button label text content.
+     *
+     * @returns Promise resolving to the label text.
+     *
+     * @example
+     * ```typescript
+     * const radio = await loader.getHarness(TnRadioHarness);
+     * expect(await radio.getLabelText()).toBe('Option A');
+     * ```
+     */
+    async getLabelText() {
+        const text = await this._text();
+        return (await text.text()).trim();
+    }
+    /**
+     * Checks whether the radio button is currently checked.
+     *
+     * @returns Promise resolving to true if the radio button is checked.
+     *
+     * @example
+     * ```typescript
+     * const radio = await loader.getHarness(TnRadioHarness);
+     * expect(await radio.isChecked()).toBe(false);
+     * ```
+     */
+    async isChecked() {
+        const input = await this._input();
+        return (await input.getProperty('checked')) ?? false;
+    }
+    /**
+     * Checks whether the radio button is disabled.
+     *
+     * @returns Promise resolving to true if the radio button is disabled.
+     *
+     * @example
+     * ```typescript
+     * const radio = await loader.getHarness(TnRadioHarness);
+     * expect(await radio.isDisabled()).toBe(false);
+     * ```
+     */
+    async isDisabled() {
+        const input = await this._input();
+        return (await input.getProperty('disabled')) ?? false;
+    }
+    /**
+     * Gets the test ID attribute value.
+     *
+     * @returns Promise resolving to the test ID string, or null.
+     *
+     * @example
+     * ```typescript
+     * const radio = await loader.getHarness(TnRadioHarness);
+     * expect(await radio.getTestId()).toBe('color-red');
+     * ```
+     */
+    async getTestId() {
+        const input = await this._input();
+        return input.getAttribute('data-testid');
+    }
+    /**
+     * Selects the radio button by clicking the label. No-op if already checked.
+     *
+     * @example
+     * ```typescript
+     * const radio = await loader.getHarness(TnRadioHarness);
+     * await radio.check();
+     * expect(await radio.isChecked()).toBe(true);
+     * ```
+     */
+    async check() {
+        if (!(await this.isChecked())) {
+            const label = await this._label();
+            await label.click();
+        }
+    }
+}
+
 /**
  * Harness for interacting with `tn-slide-toggle` in tests.
  *
@@ -5934,7 +6194,7 @@ class TnTreeComponent extends CdkTree {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TnTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: TnTreeComponent, isStandalone: true, selector: "tn-tree", host: { attributes: { "role": "tree" }, classAttribute: "tn-tree" }, providers: [
             { provide: CdkTree, useExisting: TnTreeComponent }
-        ], exportAs: ["tnTree"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkTreeNodeOutlet />", styles: [":host{display:block;width:100%}.tn-tree{width:100%;background-color:var(--tn-bg1);border:1px solid var(--tn-lines);border-radius:6px;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CdkTreeModule }, { kind: "directive", type: i1$3.CdkTreeNodeOutlet, selector: "[cdkTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+        ], exportAs: ["tnTree"], usesInheritance: true, ngImport: i0, template: "<ng-container cdkTreeNodeOutlet />", styles: [":host{display:block;width:100%}.tn-tree{width:100%;background-color:var(--tn-bg1);border:1px solid var(--tn-lines);border-radius:6px;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CdkTreeModule }, { kind: "directive", type: i1$3.CdkTreeNodeOutlet, selector: "[cdkTreeNodeOutlet]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: TnTreeComponent, decorators: [{
             type: Component,
@@ -5943,7 +6203,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     ], host: {
                         'class': 'tn-tree',
                         'role': 'tree'
-                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<ng-container cdkTreeNodeOutlet />", styles: [":host{display:block;width:100%}.tn-tree{width:100%;background-color:var(--tn-bg1);border:1px solid var(--tn-lines);border-radius:6px;overflow:hidden}\n"] }]
+                    }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container cdkTreeNodeOutlet />", styles: [":host{display:block;width:100%}.tn-tree{width:100%;background-color:var(--tn-bg1);border:1px solid var(--tn-lines);border-radius:6px;overflow:hidden}\n"] }]
         }], ctorParameters: () => [] });
 
 class TnTreeNodeComponent extends CdkTreeNode {
@@ -8918,6 +9178,195 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                     }, template: "<div class=\"tn-button-toggle-group\"\n     [attr.role]=\"multiple() ? 'group' : 'radiogroup'\"\n     [attr.aria-label]=\"ariaLabel()\"\n     [attr.aria-labelledby]=\"ariaLabelledby()\">\n  <ng-content />\n</div>\n", styles: [".tn-button-toggle-group{display:inline-flex;align-items:stretch;border-radius:6px;box-shadow:0 1px 2px #0000000d}\n"] }]
         }], ctorParameters: () => [], propDecorators: { buttonToggles: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => TnButtonToggleComponent), { ...{ descendants: true }, isSignal: true }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], change: [{ type: i0.Output, args: ["change"] }] } });
 
+/**
+ * Harness for interacting with `tn-button-toggle` in tests.
+ * Provides methods for toggling, checking, unchecking, and querying toggle state.
+ *
+ * @example
+ * ```typescript
+ * // Find and check a button toggle
+ * const toggle = await loader.getHarness(TnButtonToggleHarness.with({ label: 'Bold' }));
+ * await toggle.check();
+ * expect(await toggle.isChecked()).toBe(true);
+ *
+ * // Toggle state
+ * await toggle.toggle();
+ * expect(await toggle.isChecked()).toBe(false);
+ * ```
+ */
+class TnButtonToggleHarness extends ComponentHarness {
+    /**
+     * The selector for the host element of a `TnButtonToggleComponent` instance.
+     */
+    static hostSelector = 'tn-button-toggle';
+    _button = this.locatorFor('.tn-button-toggle__button');
+    _label = this.locatorFor('.tn-button-toggle__label');
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a button toggle
+     * with specific attributes.
+     *
+     * @param options Options for filtering which toggle instances are considered a match.
+     * @returns A `HarnessPredicate` configured with the given options.
+     *
+     * @example
+     * ```typescript
+     * // Find by label text
+     * const toggle = await loader.getHarness(TnButtonToggleHarness.with({ label: 'Bold' }));
+     *
+     * // Find by label regex
+     * const toggle = await loader.getHarness(TnButtonToggleHarness.with({ label: /bold/i }));
+     * ```
+     */
+    static with(options = {}) {
+        return new HarnessPredicate(TnButtonToggleHarness, options)
+            .addOption('label', options.label, (harness, label) => HarnessPredicate.stringMatches(harness.getLabelText(), label));
+    }
+    /**
+     * Gets the button toggle label text content.
+     *
+     * @returns Promise resolving to the label text.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * expect(await toggle.getLabelText()).toBe('Bold');
+     * ```
+     */
+    async getLabelText() {
+        const label = await this._label();
+        return (await label.text()).trim();
+    }
+    /**
+     * Checks whether the button toggle is currently checked.
+     *
+     * @returns Promise resolving to true if the toggle is checked.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * expect(await toggle.isChecked()).toBe(false);
+     * ```
+     */
+    async isChecked() {
+        const button = await this._button();
+        return (await button.getAttribute('aria-pressed')) === 'true';
+    }
+    /**
+     * Checks whether the button toggle is disabled.
+     *
+     * @returns Promise resolving to true if the toggle is disabled.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * expect(await toggle.isDisabled()).toBe(false);
+     * ```
+     */
+    async isDisabled() {
+        const button = await this._button();
+        return (await button.getProperty('disabled')) ?? false;
+    }
+    /**
+     * Toggles the button toggle by clicking it.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * await toggle.toggle();
+     * ```
+     */
+    async toggle() {
+        const button = await this._button();
+        await button.click();
+    }
+    /**
+     * Checks the button toggle. No-op if already checked.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * await toggle.check();
+     * expect(await toggle.isChecked()).toBe(true);
+     * ```
+     */
+    async check() {
+        if (!(await this.isChecked())) {
+            await this.toggle();
+        }
+    }
+    /**
+     * Unchecks the button toggle. No-op if already unchecked.
+     *
+     * @example
+     * ```typescript
+     * const toggle = await loader.getHarness(TnButtonToggleHarness);
+     * await toggle.uncheck();
+     * expect(await toggle.isChecked()).toBe(false);
+     * ```
+     */
+    async uncheck() {
+        if (await this.isChecked()) {
+            await this.toggle();
+        }
+    }
+}
+/**
+ * Harness for interacting with `tn-button-toggle-group` in tests.
+ * Provides methods for querying the group's toggles and finding checked toggles.
+ *
+ * @example
+ * ```typescript
+ * const group = await loader.getHarness(TnButtonToggleGroupHarness);
+ * const toggles = await group.getToggles();
+ * expect(toggles.length).toBe(3);
+ *
+ * const checked = await group.getCheckedToggle();
+ * expect(await checked?.getLabelText()).toBe('Option A');
+ * ```
+ */
+class TnButtonToggleGroupHarness extends ComponentHarness {
+    /**
+     * The selector for the host element of a `TnButtonToggleGroupComponent` instance.
+     */
+    static hostSelector = 'tn-button-toggle-group';
+    /**
+     * Gets all toggle harnesses within this group.
+     *
+     * @returns Promise resolving to an array of `TnButtonToggleHarness` instances.
+     *
+     * @example
+     * ```typescript
+     * const group = await loader.getHarness(TnButtonToggleGroupHarness);
+     * const toggles = await group.getToggles();
+     * expect(toggles.length).toBe(3);
+     * ```
+     */
+    async getToggles() {
+        return this.locatorForAll(TnButtonToggleHarness)();
+    }
+    /**
+     * Gets the currently checked toggle, or null if none is checked.
+     *
+     * @returns Promise resolving to the checked `TnButtonToggleHarness`, or null.
+     *
+     * @example
+     * ```typescript
+     * const group = await loader.getHarness(TnButtonToggleGroupHarness);
+     * const checked = await group.getCheckedToggle();
+     * expect(await checked?.getLabelText()).toBe('Option A');
+     * ```
+     */
+    async getCheckedToggle() {
+        const toggles = await this.getToggles();
+        for (const toggle of toggles) {
+            if (await toggle.isChecked()) {
+                return toggle;
+            }
+        }
+        return null;
+    }
+}
+
 class TnTooltipComponent {
     message = input('', ...(ngDevMode ? [{ debugName: "message" }] : []));
     id = input('', ...(ngDevMode ? [{ debugName: "id" }] : []));
@@ -11647,5 +12096,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CommonShortcuts, DEFAULT_THEME, DiskIconComponent, DiskType, FileSizePipe, InputType, LIGHT_THEME, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnConfirmDialogComponent, TnDateInputComponent, TnDateRangeInputComponent, TnDialog, TnDialogHarness, TnDialogShellComponent, TnDialogTesting, TnDividerComponent, TnDividerDirective, TnDrawerComponent, TnDrawerContainerComponent, TnDrawerContainerHarness, TnDrawerContentComponent, TnDrawerHarness, TnEmptyComponent, TnEmptyHarness, TnExpansionPanelComponent, TnFilePickerComponent, TnFilePickerPopupComponent, TnFormFieldComponent, TnFormFieldHarness, TnHeaderCellDefDirective, TnIconButtonComponent, TnIconButtonHarness, TnIconComponent, TnIconHarness, TnIconRegistryService, TnIconTesting, TnInputComponent, TnInputDirective, TnInputHarness, TnKeyboardShortcutComponent, TnKeyboardShortcutService, TnListAvatarDirective, TnListComponent, TnListIconDirective, TnListItemComponent, TnListItemLineDirective, TnListItemPrimaryDirective, TnListItemSecondaryDirective, TnListItemTitleDirective, TnListItemTrailingDirective, TnListOptionComponent, TnListSubheaderComponent, TnMenuActivateHoverDirective, TnMenuComponent, TnMenuHarness, TnMenuTesting, TnMenuTriggerDirective, TnMonthViewComponent, TnMultiYearViewComponent, TnNestedTreeNodeComponent, TnParticleProgressBarComponent, TnProgressBarComponent, TnRadioComponent, TnSelectComponent, TnSelectHarness, TnSelectionListComponent, TnSidePanelActionDirective, TnSidePanelComponent, TnSidePanelHarness, TnSidePanelHeaderActionDirective, TnSlideToggleComponent, TnSlideToggleHarness, TnSliderComponent, TnSliderThumbDirective, TnSliderWithLabelDirective, TnSpinnerComponent, TnSpriteLoaderService, TnStepComponent, TnStepperComponent, TnTabComponent, TnTabHarness, TnTabPanelComponent, TnTabPanelHarness, TnTableColumnDirective, TnTableComponent, TnTabsComponent, TnTabsHarness, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, libIconMarker, registerLucideIcons, setupLucideIntegration, tnIconMarker };
+export { CommonShortcuts, DEFAULT_THEME, DiskIconComponent, DiskType, FileSizePipe, InputType, LIGHT_THEME, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnButtonToggleGroupHarness, TnButtonToggleHarness, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnConfirmDialogComponent, TnDateInputComponent, TnDateRangeInputComponent, TnDialog, TnDialogHarness, TnDialogShellComponent, TnDialogTesting, TnDividerComponent, TnDividerDirective, TnDrawerComponent, TnDrawerContainerComponent, TnDrawerContainerHarness, TnDrawerContentComponent, TnDrawerHarness, TnEmptyComponent, TnEmptyHarness, TnExpansionPanelComponent, TnExpansionPanelHarness, TnFilePickerComponent, TnFilePickerPopupComponent, TnFormFieldComponent, TnFormFieldHarness, TnHeaderCellDefDirective, TnIconButtonComponent, TnIconButtonHarness, TnIconComponent, TnIconHarness, TnIconRegistryService, TnIconTesting, TnInputComponent, TnInputDirective, TnInputHarness, TnKeyboardShortcutComponent, TnKeyboardShortcutService, TnListAvatarDirective, TnListComponent, TnListIconDirective, TnListItemComponent, TnListItemLineDirective, TnListItemPrimaryDirective, TnListItemSecondaryDirective, TnListItemTitleDirective, TnListItemTrailingDirective, TnListOptionComponent, TnListSubheaderComponent, TnMenuActivateHoverDirective, TnMenuComponent, TnMenuHarness, TnMenuTesting, TnMenuTriggerDirective, TnMonthViewComponent, TnMultiYearViewComponent, TnNestedTreeNodeComponent, TnParticleProgressBarComponent, TnProgressBarComponent, TnRadioComponent, TnRadioHarness, TnSelectComponent, TnSelectHarness, TnSelectionListComponent, TnSidePanelActionDirective, TnSidePanelComponent, TnSidePanelHarness, TnSidePanelHeaderActionDirective, TnSlideToggleComponent, TnSlideToggleHarness, TnSliderComponent, TnSliderThumbDirective, TnSliderWithLabelDirective, TnSpinnerComponent, TnSpriteLoaderService, TnStepComponent, TnStepperComponent, TnTabComponent, TnTabHarness, TnTabPanelComponent, TnTabPanelHarness, TnTableColumnDirective, TnTableComponent, TnTabsComponent, TnTabsHarness, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, libIconMarker, registerLucideIcons, setupLucideIntegration, tnIconMarker };
 //# sourceMappingURL=truenas-ui-components.mjs.map