@tedi-design-system/angular 9.0.0-rc.13 → 9.0.0-rc.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/angular",
-  "version": "9.0.0-rc.13",
+  "version": "9.0.0-rc.14",
   "license": "MIT",
   "type": "module",
   "main": "community.mjs",

package/tedi/index.d.ts

@@ -6454,8 +6454,14 @@ interface FormFieldControl<T = unknown> {
      */
     readOnly?: Signal<boolean>;
     /**
-     * Set to `false` by controls that never take a clear button — a textarea, per
-     * the design. The field then skips its button whatever `clearable` says.
+     * Width in pixels of the control's own vertical scrollbar, 0 when it has none.
+     * Reported by controls that reach under the field's additions — a textarea —
+     * so the field can move them clear of the scrollbar.
+     */
+    scrollbarWidth?: Signal<number>;
+    /**
+     * Set to `false` by controls that never take a clear button. The field then
+     * skips its button whatever `clearable` says.
      */
     readonly clearButton?: false;
 }
@@ -7150,7 +7156,7 @@ declare class FormFieldComponent implements FieldContext {
     /**
      * Whether the field shows a clear button once the control holds a value. The
      * single source of truth for every control inside it — date and time fields
-     * read it too instead of declaring their own input. A textarea never gets one.
+     * read it too instead of declaring their own input.
      * @default true
      */
     clearable: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -7190,6 +7196,7 @@ declare class FormFieldComponent implements FieldContext {
      */
     readonly renderClearButton: _angular_core.Signal<boolean>;
     readonly ownsSurface: _angular_core.Signal<boolean>;
+    readonly controlScrollbarWidth: _angular_core.Signal<string>;
     readonly disabled: _angular_core.Signal<boolean>;
     readonly invalid: _angular_core.Signal<boolean>;
     readonly valid: _angular_core.Signal<boolean>;
@@ -7209,6 +7216,10 @@ declare class FormFieldComponent implements FieldContext {
     readonly resolvedIcon: _angular_core.Signal<FormFieldIcon | undefined>;
     readonly iconSize: _angular_core.Signal<IconSize>;
     readonly showClearButton: _angular_core.Signal<boolean>;
+    /**
+     * Focus goes back to the control: the button hides once the value is gone, so
+     * it would otherwise drop to the page.
+     */
     clear(): void;
     /**
      * The box padding and the layout wrappers around the control are outside its
@@ -8533,7 +8544,7 @@ declare class TextFieldComponent implements OnInit, ControlValueAccessor, FormFi
 }
 
 type TextareaSize = Exclude<InputSize, "large">;
-declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFieldControl {
+declare class TextareaComponent implements OnInit, OnDestroy, ControlValueAccessor, FormFieldControl {
     private el;
     private renderer;
     private readonly fieldContext;
@@ -8574,18 +8585,19 @@ declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFie
      * Number of rows the field rests at, and the fewest it can ever show. With no
      * `height` set this is what sizes the textarea, so it is the input to reach
      * for when a field needs to be taller or shorter — in every mode, not just
-     * while `autoGrow` is on.
+     * while `autoGrow` is on. Values below 1 are treated as 1. It never rests
+     * below the native `rows` (2 by default), so set `rows="1"` for a single-row
+     * field.
      *
      * @default 3
      */
     minRows: _angular_core.InputSignal<number>;
     /**
      * Most rows the field shows before it starts scrolling. Caps `autoGrow`'s
-     * growth and how far the resize grip can be dragged.
-     *
-     * @default 12
+     * growth and how far the resize grip can be dragged. Unset, neither has a
+     * row limit.
      */
-    maxRows: _angular_core.InputSignal<number>;
+    maxRows: _angular_core.InputSignal<number | undefined>;
     /**
      * Exact resting height (e.g. `'7.5rem'`, `200` → `200px`), for the rare field
      * that has to match something other than a whole number of rows. Prefer
@@ -8605,25 +8617,39 @@ declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFie
     readonly paintsSurface: _angular_core.Signal<boolean>;
     readonly valid: _angular_core.Signal<boolean>;
     readonly heightStyle: _angular_core.Signal<string | null>;
+    readonly resolvedMinRows: _angular_core.Signal<number>;
     /**
      * `minRows` is the resting height as much as it is the floor: with no `height`
      * the textarea has nothing else to size to, so the floor is what it settles
      * at. That makes it the one number a consumer has to change.
      */
     readonly minHeightStyle: _angular_core.Signal<string>;
-    readonly maxHeightStyle: _angular_core.Signal<string>;
+    readonly maxHeightStyle: _angular_core.Signal<string | null>;
     readonly readOnlyAttribute: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly readOnlyProperty: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly readOnly: _angular_core.Signal<boolean>;
-    /** Textareas take no clear button, even inside a `clearable` form field. */
-    readonly clearButton = false;
+    /**
+     * Disables the textarea from a parent template. Combined with the
+     * reactive-forms disabled state and any input-group state, so a wrapping
+     * `tedi-form-field` sees it too.
+     */
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
     readonly disabled: _angular_core.Signal<boolean>;
     private readonly derived;
     readonly describedBy: _tedi_design_system_angular_tedi.ControlDescribedBy;
     readonly touched: _angular_core.Signal<boolean>;
     readonly dirty: _angular_core.Signal<boolean>;
     readonly invalid: _angular_core.Signal<boolean>;
+    /**
+     * The textarea reaches under a wrapping field's clear button and icon, so a
+     * classic scrollbar would land beneath them. Reported so the field can move
+     * them clear of it; overlay scrollbars take no room and stay at 0.
+     */
+    readonly scrollbarWidth: _angular_core.WritableSignal<number>;
+    private resizeObserver;
     ngOnInit(): void;
+    ngOnDestroy(): void;
+    private measureScrollbarWidth;
     setDescribedBy(ids: string[]): void;
     private formDisabled;
     private onChange;
@@ -8639,7 +8665,7 @@ declare class TextareaComponent implements OnInit, ControlValueAccessor, FormFie
     focus(): void;
     reset(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TextareaComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "textarea[tedi-textarea]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "autoGrow": { "alias": "autoGrow"; "required": false; "isSignal": true; }; "minRows": { "alias": "minRows"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "readOnlyAttribute": { "alias": "readonly"; "required": false; "isSignal": true; }; "readOnlyProperty": { "alias": "readOnly"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TextareaComponent, "textarea[tedi-textarea]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "invalidInput": { "alias": "invalid"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "autoGrow": { "alias": "autoGrow"; "required": false; "isSignal": true; }; "minRows": { "alias": "minRows"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "readOnlyAttribute": { "alias": "readonly"; "required": false; "isSignal": true; }; "readOnlyProperty": { "alias": "readOnly"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
 }
 
 type TimePickerVariant = "scroll" | "slots" | "dropdown";