@truenas/ui-components 0.3.9 → 0.3.10

package/package.json

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

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

@@ -1054,6 +1054,17 @@ declare class TnButtonComponent implements AfterViewInit {
     variant: _angular_core.InputSignal<"filled" | "outline">;
     backgroundColor: _angular_core.InputSignal<string | undefined>;
     label: _angular_core.InputSignal<string>;
+    /**
+     * Optional icon rendered alongside the label. Accepts any name resolvable by
+     * `tn-icon` (sprite/registry/library). Use `iconPosition` to place it before
+     * or after the label.
+     */
+    icon: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Side of the label the `icon` sits on. `left` (default) renders the icon
+     * before the label; `right` renders it after. No effect when `icon` is unset.
+     */
+    iconPosition: _angular_core.InputSignal<"left" | "right">;
     disabled: _angular_core.InputSignal<boolean>;
     /**
      * Native `type` of the rendered `<button>`. Defaults to `button` so stray
@@ -1099,7 +1110,7 @@ declare class TnButtonComponent implements AfterViewInit {
     private innerRef;
     ngAfterViewInit(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TnButtonComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TnButtonComponent, "tn-button", never, { "primary": { "alias": "primary"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "testId": { "alias": "testId"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; "queryParams": { "alias": "queryParams"; "required": false; "isSignal": true; }; "fragment": { "alias": "fragment"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "onClick": "onClick"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TnButtonComponent, "tn-button", never, { "primary": { "alias": "primary"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "testId": { "alias": "testId"; "required": false; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; "queryParams": { "alias": "queryParams"; "required": false; "isSignal": true; }; "fragment": { "alias": "fragment"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "onClick": "onClick"; }, never, never, true, never>;
 }
 
 /**
@@ -1126,6 +1137,8 @@ declare class TnButtonHarness extends ComponentHarness {
      */
     static hostSelector: string;
     private _button;
+    private _label;
+    private _icon;
     /**
      * Gets a `HarnessPredicate` that can be used to search for a button
      * with specific attributes.
@@ -1156,6 +1169,27 @@ declare class TnButtonHarness extends ComponentHarness {
      * ```
      */
     getLabel(): Promise<string>;
+    /**
+     * Gets the `name` of the icon rendered inside the button, or `null` when the
+     * button has no icon.
+     *
+     * @example
+     * ```typescript
+     * const saveBtn = await loader.getHarness(TnButtonHarness.with({ label: 'Save' }));
+     * expect(await saveBtn.getIconName()).toBe('check');
+     * ```
+     */
+    getIconName(): Promise<string | null>;
+    /**
+     * Reports whether the button renders an icon.
+     *
+     * @example
+     * ```typescript
+     * const saveBtn = await loader.getHarness(TnButtonHarness.with({ label: 'Save' }));
+     * expect(await saveBtn.hasIcon()).toBe(true);
+     * ```
+     */
+    hasIcon(): Promise<boolean>;
     /**
      * Checks whether the button is disabled.
      *