@truenas/ui-components 0.1.32 → 0.1.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truenas/ui-components",
-  "version": "0.1.32",
+  "version": "0.1.34",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"

package/types/truenas-ui-components.d.ts

@@ -3,6 +3,7 @@ import { ElementRef, OnDestroy, AfterViewInit, AfterContentInit, TemplateRef, Pr
 import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { ComponentHarness, BaseHarnessFilters, HarnessPredicate, HarnessLoader } from '@angular/cdk/testing';
 import { SafeHtml, SafeResourceUrl, DomSanitizer } from '@angular/platform-browser';
+import { ComponentFixture } from '@angular/core/testing';
 import { DataSource } from '@angular/cdk/collections';
 import * as i1 from '@angular/cdk/tree';
 import { CdkTree, FlatTreeControl, CdkTreeNode, CdkNestedTreeNode } from '@angular/cdk/tree';
@@ -12,7 +13,6 @@ import { Observable } from 'rxjs';
 import { Overlay } from '@angular/cdk/overlay';
 import { DialogConfig, DialogRef } from '@angular/cdk/dialog';
 import { ComponentType } from '@angular/cdk/portal';
-import { ComponentFixture } from '@angular/core/testing';
 
 declare class TnAutocompleteComponent<T = unknown> implements ControlValueAccessor {
     private readonly elementRef;
@@ -1614,6 +1614,85 @@ declare class TnSlideToggleComponent implements AfterViewInit, OnDestroy, Contro
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TnSlideToggleComponent, "tn-slide-toggle", never, { "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "testId": { "alias": "testId"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "change": "change"; "toggleChange": "toggleChange"; }, never, never, true, never>;
 }
 
+/**
+ * Harness for interacting with `tn-slide-toggle` in tests.
+ *
+ * @example
+ * ```typescript
+ * const toggle = await loader.getHarness(
+ *   TnSlideToggleHarness.with({ label: 'Enable notifications' })
+ * );
+ * await toggle.toggle();
+ * expect(await toggle.isChecked()).toBe(true);
+ * ```
+ */
+declare class TnSlideToggleHarness extends ComponentHarness {
+    static hostSelector: string;
+    private _input;
+    private _label;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a slide toggle
+     * with specific attributes.
+     */
+    static with(options?: SlideToggleHarnessFilters): HarnessPredicate<TnSlideToggleHarness>;
+    /**
+     * Gets the label text of the slide toggle.
+     *
+     * @example
+     * ```typescript
+     * expect(await toggle.getLabelText()).toBe('Enable notifications');
+     * ```
+     */
+    getLabelText(): Promise<string>;
+    /**
+     * Checks whether the slide toggle is currently checked.
+     *
+     * @example
+     * ```typescript
+     * expect(await toggle.isChecked()).toBe(false);
+     * ```
+     */
+    isChecked(): Promise<boolean>;
+    /**
+     * Checks whether the slide toggle is disabled.
+     */
+    isDisabled(): Promise<boolean>;
+    /**
+     * Checks whether the slide toggle is required.
+     */
+    isRequired(): Promise<boolean>;
+    /**
+     * Gets the test ID attribute value.
+     */
+    getTestId(): Promise<string | null>;
+    /**
+     * Toggles the slide toggle by clicking the input element.
+     *
+     * @example
+     * ```typescript
+     * await toggle.toggle();
+     * ```
+     */
+    toggle(): Promise<void>;
+    /**
+     * Checks the slide toggle. No-op if already checked.
+     */
+    check(): Promise<void>;
+    /**
+     * Unchecks the slide toggle. No-op if already unchecked.
+     */
+    uncheck(): Promise<void>;
+}
+/**
+ * Filters for finding `TnSlideToggleHarness` instances.
+ */
+interface SlideToggleHarnessFilters extends BaseHarnessFilters {
+    /** Filters by label text. Supports string or regex matching. */
+    label?: string | RegExp;
+    /** Filters by data-testid attribute. */
+    testId?: string;
+}
+
 declare class TnTabComponent implements AfterContentInit {
     label: _angular_core.InputSignal<string>;
     disabled: _angular_core.InputSignal<boolean>;
@@ -2075,6 +2154,141 @@ declare class TnMenuTriggerDirective {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TnMenuTriggerDirective, "[tnMenuTriggerFor]", ["tnMenuTrigger"], { "menu": { "alias": "tnMenuTriggerFor"; "required": true; "isSignal": true; }; "tnMenuPosition": { "alias": "tnMenuPosition"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Harness for interacting with `tn-menu` in tests.
+ *
+ * Menus render in a CDK overlay **outside** the component tree, so a regular
+ * `TestbedHarnessEnvironment.loader(fixture)` won't find them. Use
+ * `TnMenuTesting.rootLoader(fixture)` instead — it searches the entire document.
+ *
+ * ## Test Setup
+ *
+ * ```typescript
+ * import {
+ *   TnMenuHarness,
+ *   TnMenuTesting,
+ *   TnIconButtonHarness,
+ * } from '@truenas/ui-components';
+ *
+ * let loader: HarnessLoader;   // for components
+ * let rootLoader: HarnessLoader; // for overlays (menus, dialogs)
+ *
+ * beforeEach(() => {
+ *   spectator = createComponent();
+ *   loader = TestbedHarnessEnvironment.loader(spectator.fixture);
+ *   rootLoader = TnMenuTesting.rootLoader(spectator.fixture);
+ * });
+ * ```
+ *
+ * ## Opening a Menu
+ *
+ * Click the trigger element to open the menu before querying it:
+ *
+ * ```typescript
+ * // Via harness (if trigger is a tn-icon-button)
+ * const trigger = await loader.getHarness(
+ *   TnIconButtonHarness.with({ name: 'more_vert' })
+ * );
+ * await trigger.click();
+ *
+ * // Or via DOM
+ * spectator.click('[tnMenuTriggerFor]');
+ * ```
+ *
+ * ## Querying and Clicking Items
+ *
+ * ```typescript
+ * const menu = await rootLoader.getHarness(TnMenuHarness);
+ * expect(await menu.getItemLabels()).toEqual(['Edit', 'Delete']);
+ * await menu.clickItem({ label: 'Edit' });
+ * await menu.clickItem({ label: /del/i }); // regex match
+ * expect(await menu.isItemDisabled({ label: 'Delete' })).toBe(false);
+ * ```
+ */
+declare class TnMenuHarness extends ComponentHarness {
+    static hostSelector: string;
+    private _items;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a menu.
+     */
+    static with(options?: MenuHarnessFilters): HarnessPredicate<TnMenuHarness>;
+    /**
+     * Gets the labels of all menu items.
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * expect(await menu.getItemLabels()).toEqual(['Edit', 'Delete']);
+     * ```
+     */
+    getItemLabels(): Promise<string[]>;
+    /**
+     * Clicks a menu item by its label text.
+     *
+     * @param filter Object with `label` to match (string or RegExp).
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * await menu.clickItem({ label: 'Delete' });
+     * ```
+     */
+    clickItem(filter: {
+        label: string | RegExp;
+    }): Promise<void>;
+    /**
+     * Checks if a menu item is disabled.
+     *
+     * @param filter Object with `label` to match (string or RegExp).
+     * @returns Promise resolving to true if the item is disabled.
+     *
+     * @example
+     * ```typescript
+     * const menu = await rootLoader.getHarness(TnMenuHarness);
+     * expect(await menu.isItemDisabled({ label: 'Delete' })).toBe(true);
+     * ```
+     */
+    isItemDisabled(filter: {
+        label: string | RegExp;
+    }): Promise<boolean>;
+    /**
+     * Gets the number of menu items (excluding separators).
+     */
+    getItemCount(): Promise<number>;
+}
+/**
+ * A set of criteria that can be used to filter `TnMenuHarness` instances.
+ */
+interface MenuHarnessFilters extends BaseHarnessFilters {
+}
+
+/**
+ * Test utilities for TnMenu.
+ *
+ * Provides a document-root `HarnessLoader` that can find menus rendered
+ * in CDK overlays. Use this alongside `TnDialogTesting.rootLoader()` if
+ * your tests also open dialogs.
+ *
+ * @example
+ * ```typescript
+ * import { TnMenuTesting, TnMenuHarness } from '@truenas/ui-components';
+ *
+ * const rootLoader = TnMenuTesting.rootLoader(spectator.fixture);
+ *
+ * // Open the menu trigger, then query the overlay
+ * spectator.click('[tnMenuTriggerFor]');
+ * const menu = await rootLoader.getHarness(TnMenuHarness);
+ * await menu.clickItem({ label: 'Edit' });
+ * ```
+ */
+declare class TnMenuTesting {
+    /**
+     * Creates a `HarnessLoader` that searches the entire document,
+     * including CDK overlays where menus are rendered.
+     */
+    static rootLoader(fixture: ComponentFixture<unknown>): HarnessLoader;
+}
+
 declare enum ModifierKeys {
     COMMAND = "\u2318",
     CMD = "\u2318",
@@ -5039,5 +5253,5 @@ declare const TN_THEME_DEFINITIONS: readonly TnThemeDefinition[];
  */
 declare const THEME_MAP: Map<TnTheme, TnThemeDefinition>;
 
-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, TnMenuTriggerDirective, TnMonthViewComponent, TnMultiYearViewComponent, TnNestedTreeNodeComponent, TnParticleProgressBarComponent, TnProgressBarComponent, TnRadioComponent, TnSelectComponent, TnSelectHarness, TnSelectionListComponent, TnSidePanelActionDirective, TnSidePanelComponent, TnSidePanelHarness, TnSidePanelHeaderActionDirective, TnSlideToggleComponent, 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 type { AutocompleteHarnessFilters, BannerHarnessFilters, ButtonHarnessFilters, CalendarCell, CheckboxHarnessFilters, ChipColor, CreateFolderEvent, DateRange, DialogHarnessFilters, EmptyHarnessFilters, FilePickerCallbacks, FilePickerError, FilePickerMode, FileSystemItem, FormFieldHarnessFilters, IconButtonHarnessFilters, IconHarnessFilters, IconLibrary, IconLibraryType, IconResult, IconSize, IconSource, IconTestingMockOverrides, InputHarnessFilters, KeyCombination, LabelType, LucideIconOptions, MockIconRegistry, MockSpriteLoader, PathSegment, PlatformType, ProgressBarMode, ResolvedIcon, SelectHarnessFilters, ShortcutHandler, SidePanelHarnessFilters, SlideToggleColor, SpinnerMode, SpriteConfig, TabChangeEvent, TabHarnessFilters, TabPanelHarnessFilters, TabsHarnessFilters, TnBannerType, TnButtonToggleType, TnCardAction, TnCardControl, TnCardFooterLink, TnCardHeaderStatus, TnConfirmDialogData, TnDialogDefaults, TnDialogOpenTarget, TnDrawerMode, TnDrawerPosition, TnEmptySize, TnFlatTreeNode, TnMenuItem, TnSelectOption, TnSelectOptionGroup, TnSelectionChange, TnTableDataSource, TnThemeDefinition, TnToastCall, TnToastConfig, TooltipPosition, YearCell };
+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 type { AutocompleteHarnessFilters, BannerHarnessFilters, ButtonHarnessFilters, CalendarCell, CheckboxHarnessFilters, ChipColor, CreateFolderEvent, DateRange, DialogHarnessFilters, EmptyHarnessFilters, FilePickerCallbacks, FilePickerError, FilePickerMode, FileSystemItem, FormFieldHarnessFilters, IconButtonHarnessFilters, IconHarnessFilters, IconLibrary, IconLibraryType, IconResult, IconSize, IconSource, IconTestingMockOverrides, InputHarnessFilters, KeyCombination, LabelType, LucideIconOptions, MenuHarnessFilters, MockIconRegistry, MockSpriteLoader, PathSegment, PlatformType, ProgressBarMode, ResolvedIcon, SelectHarnessFilters, ShortcutHandler, SidePanelHarnessFilters, SlideToggleColor, SlideToggleHarnessFilters, SpinnerMode, SpriteConfig, TabChangeEvent, TabHarnessFilters, TabPanelHarnessFilters, TabsHarnessFilters, TnBannerType, TnButtonToggleType, TnCardAction, TnCardControl, TnCardFooterLink, TnCardHeaderStatus, TnConfirmDialogData, TnDialogDefaults, TnDialogOpenTarget, TnDrawerMode, TnDrawerPosition, TnEmptySize, TnFlatTreeNode, TnMenuItem, TnSelectOption, TnSelectOptionGroup, TnSelectionChange, TnTableDataSource, TnThemeDefinition, TnToastCall, TnToastConfig, TooltipPosition, YearCell };