@truenas/ui-components 0.3.0 → 0.3.2

package/package.json

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

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

@@ -2155,6 +2155,144 @@ declare class TnChipComponent implements AfterViewInit, OnDestroy {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TnChipComponent, "tn-chip", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "testId": { "alias": "testId"; "required": false; "isSignal": true; }; }, { "onClose": "onClose"; "onClick": "onClick"; }, never, never, true, never>;
 }
 
+/**
+ * Harness for interacting with tn-chip in tests.
+ * Provides methods for reading chip state and simulating user interactions
+ * (selecting the chip and dismissing a closable chip).
+ *
+ * @example
+ * ```typescript
+ * // Find a chip by label and click it
+ * const chip = await loader.getHarness(TnChipHarness.with({ label: 'Active' }));
+ * await chip.click();
+ *
+ * // Dismiss a closable chip
+ * const filter = await loader.getHarness(TnChipHarness.with({ label: 'Has SSH Access' }));
+ * if (await filter.isClosable()) {
+ *   await filter.close();
+ * }
+ * ```
+ */
+declare class TnChipHarness extends ComponentHarness {
+    /**
+     * The selector for the host element of a `TnChipComponent` instance.
+     */
+    static hostSelector: string;
+    private _chip;
+    private _label;
+    private _icon;
+    private _closeButton;
+    /**
+     * Gets a `HarnessPredicate` that can be used to search for a chip
+     * with specific attributes.
+     *
+     * @param options Options for filtering which chip instances are considered a match.
+     * @returns A `HarnessPredicate` configured with the given options.
+     *
+     * @example
+     * ```typescript
+     * // Find chip by exact label
+     * const chip = await loader.getHarness(TnChipHarness.with({ label: 'Production' }));
+     *
+     * // Find chip with regex pattern
+     * const chip = await loader.getHarness(TnChipHarness.with({ label: /access/i }));
+     * ```
+     */
+    static with(options?: ChipHarnessFilters): HarnessPredicate<TnChipHarness>;
+    /**
+     * Gets the chip's label text.
+     *
+     * @returns Promise resolving to the chip's text content.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness);
+     * expect(await chip.getLabel()).toBe('Active');
+     * ```
+     */
+    getLabel(): Promise<string>;
+    /**
+     * Gets the chip's color variant (`primary`, `secondary`, or `accent`).
+     *
+     * @returns Promise resolving to the chip's color.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness);
+     * expect(await chip.getColor()).toBe('primary');
+     * ```
+     */
+    getColor(): Promise<ChipColor>;
+    /**
+     * Checks whether the chip is disabled.
+     *
+     * @returns Promise resolving to true if the chip is disabled.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness);
+     * expect(await chip.isDisabled()).toBe(false);
+     * ```
+     */
+    isDisabled(): Promise<boolean>;
+    /**
+     * Checks whether the chip renders a close (dismiss) button.
+     *
+     * @returns Promise resolving to true if the chip is closable.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness);
+     * expect(await chip.isClosable()).toBe(true);
+     * ```
+     */
+    isClosable(): Promise<boolean>;
+    /**
+     * Checks whether the chip renders a leading icon.
+     *
+     * @returns Promise resolving to true if the chip has an icon.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness);
+     * expect(await chip.hasIcon()).toBe(true);
+     * ```
+     */
+    hasIcon(): Promise<boolean>;
+    /**
+     * Clicks the chip body, triggering its `onClick` output.
+     *
+     * @returns Promise that resolves when the click action is complete.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness.with({ label: 'Active' }));
+     * await chip.click();
+     * ```
+     */
+    click(): Promise<void>;
+    /**
+     * Clicks the chip's close button, triggering its `onClose` output.
+     * Throws if the chip is not closable.
+     *
+     * @returns Promise that resolves when the close action is complete.
+     *
+     * @example
+     * ```typescript
+     * const chip = await loader.getHarness(TnChipHarness.with({ label: 'Has SSH Access' }));
+     * await chip.close();
+     * ```
+     */
+    close(): Promise<void>;
+}
+/**
+ * A set of criteria that can be used to filter a list of `TnChipHarness` instances.
+ */
+interface ChipHarnessFilters extends BaseHarnessFilters {
+    /** Filters by the chip's label text. Supports string or regex matching. */
+    label?: string | RegExp;
+}
+
 declare class TnCardHeaderDirective {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TnCardHeaderDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TnCardHeaderDirective, "[tnCardHeader]", never, {}, {}, never, never, true, never>;
@@ -4068,6 +4206,82 @@ interface FormFieldHarnessFilters extends BaseHarnessFilters {
     testId?: string;
 }
 
+/**
+ * Semantic grouping for a related set of form fields. Renders a native
+ * `<fieldset>` with an optional `<legend>` heading and help tooltip, and
+ * projects its content unchanged — it adds structure and a11y semantics, not
+ * layout for the fields themselves (compose `tn-form-field` inside it for that).
+ */
+declare class TnFormSectionComponent {
+    /**
+     * Heading rendered in the `<legend>`. Supports lightweight label markup
+     * (**bold**, *italic*, `code`); leave empty to omit the legend entirely.
+     */
+    heading: _angular_core.InputSignal<string>;
+    /** Optional help tooltip shown via an icon next to the heading. */
+    tooltip: _angular_core.InputSignal<string>;
+    /** Placement of the tooltip relative to its help icon. */
+    tooltipPosition: _angular_core.InputSignal<TooltipPosition>;
+    /** Test id applied to the host for harness/e2e selection. */
+    testId: _angular_core.InputSignal<TnTestIdValue>;
+    /**
+     * Stable id linking the fieldset to its heading via `aria-labelledby`. This
+     * names the group from the heading text alone — without it the legend's
+     * accessible name would also absorb the tooltip button's `aria-label`,
+     * announcing the whole tooltip sentence on every control in the group.
+     */
+    protected readonly headingId: string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TnFormSectionComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TnFormSectionComponent, "tn-form-section", never, { "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "tooltip": { "alias": "tooltip"; "required": false; "isSignal": true; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; "isSignal": true; }; "testId": { "alias": "testId"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Harness for interacting with `tn-form-section` in tests.
+ *
+ * Scope note: this covers the section's own surface (heading text, tooltip
+ * presence, projected text) only. Filling and reading the projected form
+ * controls is the consuming app's concern — drive those through their own
+ * control harnesses rather than this one.
+ *
+ * @example
+ * ```typescript
+ * const section = await loader.getHarness(
+ *   TnFormSectionHarness.with({ heading: 'Network Settings' })
+ * );
+ * expect(await section.hasTooltip()).toBe(true);
+ * ```
+ */
+declare class TnFormSectionHarness extends ComponentHarness {
+    /** The selector for the host element of a `TnFormSectionComponent` instance. */
+    static hostSelector: string;
+    /**
+     * Gets a `HarnessPredicate` to search for a form section by heading text.
+     *
+     * @param options Criteria for filtering which section instances match.
+     * @returns A `HarnessPredicate` configured with the given options.
+     */
+    static with(options?: FormSectionHarnessFilters): HarnessPredicate<TnFormSectionHarness>;
+    private legend;
+    private tooltipButton;
+    /**
+     * Heading text rendered in the legend (label markup rendered to plain text),
+     * or '' when no heading is set.
+     */
+    getHeadingText(): Promise<string>;
+    /** Whether the help tooltip icon is rendered. */
+    hasTooltip(): Promise<boolean>;
+    /** Full text content of the section (heading + projected content), trimmed. */
+    getText(): Promise<string>;
+}
+/**
+ * A set of criteria that can be used to filter a list of
+ * `TnFormSectionHarness` instances.
+ */
+interface FormSectionHarnessFilters extends BaseHarnessFilters {
+    /** Filters by legend heading text. Supports string or regex matching. */
+    heading?: string | RegExp;
+}
+
 /**
  * Harness for interacting with tn-select in tests.
  * Provides methods for querying select state, opening/closing the dropdown,
@@ -7845,5 +8059,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, LabelMarkupPipe, LabelTextPipe, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_FORM_FIELD_ERRORS, TN_TABLE_PAGER_DEFAULT_LABELS, TN_TABLE_PAGER_LABELS, TN_TEST_ATTR, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnButtonToggleGroupHarness, TnButtonToggleHarness, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCardHeaderDirective, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnConfirmDialogComponent, TnDateInputComponent, TnDateInputHarness, TnDateRangeInputComponent, TnDateRangeInputHarness, TnDetailRowDefDirective, 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, TnMenuItemComponent, 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, TnTableHarness, TnTablePagerComponent, TnTablePagerHarness, TnTabsComponent, TnTabsHarness, TnTestIdDirective, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, composeTestId, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, formatSize, kebabTestSegment, labelMarkupToHtml, labelMarkupToText, libIconMarker, parseLabelMarkup, parseSize, registerLucideIcons, scopeTestId, setupLucideIntegration, tnIconMarker, writeTestId };
-export type { AutocompleteHarnessFilters, BannerHarnessFilters, ButtonHarnessFilters, ButtonToggleHarnessFilters, CalendarCell, CheckboxHarnessFilters, ChipColor, CreateFolderEvent, DateInputHarnessFilters, DateRange, DateRangeInputHarnessFilters, DialogHarnessFilters, EmptyHarnessFilters, ExpansionPanelHarnessFilters, FilePickerCallbacks, FilePickerError, FilePickerMode, FileSystemItem, FormFieldHarnessFilters, IconButtonHarnessFilters, IconHarnessFilters, IconLibrary, IconLibraryType, IconResult, IconSize, IconSource, IconTestingMockOverrides, InputHarnessFilters, KeyCombination, LabelMarkupSegment, LabelMarkupSegmentType, LabelType, LucideIconOptions, MenuHarnessFilters, MockIconRegistry, MockSpriteLoader, PathSegment, PlatformType, ProgressBarMode, RadioHarnessFilters, ResolvedIcon, SelectHarnessFilters, ShortcutHandler, SidePanelHarnessFilters, SizeStandard, SlideToggleColor, SlideToggleHarnessFilters, SpinnerMode, SpriteConfig, SubscriptSizing, TabChangeEvent, TabHarnessFilters, TabPanelHarnessFilters, TabsHarnessFilters, TnAutocompleteOption, TnBannerType, TnButtonToggleType, TnCardAction, TnCardControl, TnCardFooterLink, TnCardHeaderStatus, TnConfirmDialogData, TnDialogDefaults, TnDialogOpenTarget, TnDrawerMode, TnDrawerPosition, TnEmptySize, TnFlatTreeNode, TnFormFieldErrorMessage, TnFormFieldErrorMessages, TnFormFieldErrorResolver, TnMenuItem, TnSelectOption, TnSelectOptionGroup, TnSelectionChange, TnSortEvent, TnTableDataProvider, TnTableDataSource, TnTableHarnessFilters, TnTablePagerHarnessFilters, TnTablePagerLabels, TnTablePagination, TnTestAttrName, TnTestIdValue, TnThemeDefinition, TnToastCall, TnToastConfig, TooltipPosition, YearCell };
+export { CommonShortcuts, DEFAULT_THEME, DiskIconComponent, DiskType, FileSizePipe, InputType, LIGHT_THEME, LabelMarkupPipe, LabelTextPipe, LinuxModifierKeys, LinuxShortcuts, ModifierKeys, QuickShortcuts, ShortcutBuilder, StripMntPrefixPipe, THEME_MAP, THEME_STORAGE_KEY, TN_FORM_FIELD_ERRORS, TN_TABLE_PAGER_DEFAULT_LABELS, TN_TABLE_PAGER_LABELS, TN_TEST_ATTR, TN_THEME_DEFINITIONS, TnAutocompleteComponent, TnAutocompleteHarness, TnBannerActionDirective, TnBannerComponent, TnBannerHarness, TnBrandedSpinnerComponent, TnButtonComponent, TnButtonHarness, TnButtonToggleComponent, TnButtonToggleGroupComponent, TnButtonToggleGroupHarness, TnButtonToggleHarness, TnCalendarComponent, TnCalendarHeaderComponent, TnCardComponent, TnCardHeaderDirective, TnCellDefDirective, TnCheckboxComponent, TnCheckboxHarness, TnCheckboxLabelDirective, TnChipComponent, TnChipHarness, TnConfirmDialogComponent, TnDateInputComponent, TnDateInputHarness, TnDateRangeInputComponent, TnDateRangeInputHarness, TnDetailRowDefDirective, TnDialog, TnDialogHarness, TnDialogShellComponent, TnDialogTesting, TnDividerComponent, TnDividerDirective, TnDrawerComponent, TnDrawerContainerComponent, TnDrawerContainerHarness, TnDrawerContentComponent, TnDrawerHarness, TnEmptyComponent, TnEmptyHarness, TnExpansionPanelComponent, TnExpansionPanelHarness, TnFilePickerComponent, TnFilePickerPopupComponent, TnFormFieldComponent, TnFormFieldHarness, TnFormSectionComponent, TnFormSectionHarness, 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, TnMenuItemComponent, 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, TnTableHarness, TnTablePagerComponent, TnTablePagerHarness, TnTabsComponent, TnTabsHarness, TnTestIdDirective, TnTheme, TnThemeService, TnTimeInputComponent, TnToastComponent, TnToastMock, TnToastPosition, TnToastRef, TnToastService, TnToastTesting, TnToastType, TnTooltipComponent, TnTooltipDirective, TnTreeComponent, TnTreeFlatDataSource, TnTreeFlattener, TnTreeNodeComponent, TnTreeNodeOutletDirective, TruncatePathPipe, WindowsModifierKeys, WindowsShortcuts, composeTestId, createLucideLibrary, createShortcut, defaultSpriteBasePath, defaultSpriteConfigPath, formatSize, kebabTestSegment, labelMarkupToHtml, labelMarkupToText, libIconMarker, parseLabelMarkup, parseSize, registerLucideIcons, scopeTestId, setupLucideIntegration, tnIconMarker, writeTestId };
+export type { AutocompleteHarnessFilters, BannerHarnessFilters, ButtonHarnessFilters, ButtonToggleHarnessFilters, CalendarCell, CheckboxHarnessFilters, ChipColor, ChipHarnessFilters, CreateFolderEvent, DateInputHarnessFilters, DateRange, DateRangeInputHarnessFilters, DialogHarnessFilters, EmptyHarnessFilters, ExpansionPanelHarnessFilters, FilePickerCallbacks, FilePickerError, FilePickerMode, FileSystemItem, FormFieldHarnessFilters, FormSectionHarnessFilters, IconButtonHarnessFilters, IconHarnessFilters, IconLibrary, IconLibraryType, IconResult, IconSize, IconSource, IconTestingMockOverrides, InputHarnessFilters, KeyCombination, LabelMarkupSegment, LabelMarkupSegmentType, LabelType, LucideIconOptions, MenuHarnessFilters, MockIconRegistry, MockSpriteLoader, PathSegment, PlatformType, ProgressBarMode, RadioHarnessFilters, ResolvedIcon, SelectHarnessFilters, ShortcutHandler, SidePanelHarnessFilters, SizeStandard, SlideToggleColor, SlideToggleHarnessFilters, SpinnerMode, SpriteConfig, SubscriptSizing, TabChangeEvent, TabHarnessFilters, TabPanelHarnessFilters, TabsHarnessFilters, TnAutocompleteOption, TnBannerType, TnButtonToggleType, TnCardAction, TnCardControl, TnCardFooterLink, TnCardHeaderStatus, TnConfirmDialogData, TnDialogDefaults, TnDialogOpenTarget, TnDrawerMode, TnDrawerPosition, TnEmptySize, TnFlatTreeNode, TnFormFieldErrorMessage, TnFormFieldErrorMessages, TnFormFieldErrorResolver, TnMenuItem, TnSelectOption, TnSelectOptionGroup, TnSelectionChange, TnSortEvent, TnTableDataProvider, TnTableDataSource, TnTableHarnessFilters, TnTablePagerHarnessFilters, TnTablePagerLabels, TnTablePagination, TnTestAttrName, TnTestIdValue, TnThemeDefinition, TnToastCall, TnToastConfig, TooltipPosition, YearCell };