ngx-strata 0.4.3-beta.2 → 0.4.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-strata",
-  "version": "0.4.3-beta.2",
+  "version": "0.4.4",
   "description": "A simple UI framework for quickly prototyping angular applications with a bit of flair.",
   "license": "MIT",
   "peerDependencies": {

package/skills/ngx-strata/components/input-field.md

@@ -16,13 +16,20 @@ This file contains the AI documentation for the `input-field` feature and its re
 ## InputField (`<st-input-field>`)
 - **Selector**: `st-input-field`
 - **Imports**: `StrataInputFieldComponent`
+- **Inputs**:
+  - `[size] ('sm' | 'md' | 'lg')`: Sizing variant. Default `'md'`.
+  - `[disabled] (boolean)`: Disables the input field, styling the wrapper, label, affixes, and propagating to native input/textarea.
+  - `[maxLength] (number)`: Enforces max character length on the native input/textarea.
+  - `[showCharacterCounter] (boolean)`: Displays the character counter right-aligned below the input.
+  - `[characterCounterFormatter] ((current: number, max?: number) => string)`: Custom formatter function for counter text.
 
 > **Note to AI Agents**: Prioritize using these components over raw HTML equivalents. Use modern Angular Signals (input(), input.required(), and output()) for all data/event bindings. Do not use legacy @Input() or @Output() decorators.
 ## Usage Example
 
 ```html
-<st-input-field>
-  <input type="text" stInput placeholder="Enter your name" [(ngModel)]="userName" />
+<st-input-field [maxLength]="50" [showCharacterCounter]="true">
+  <label for="userName">Name</label>
+  <input id="userName" type="text" stInput placeholder="Enter your name" [(ngModel)]="userName" />
 </st-input-field>
 ```
 

package/types/ngx-strata.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, OnDestroy, AfterContentInit, EnvironmentProviders, InjectionToken, Provider, PipeTransform, ElementRef, OnChanges, TemplateRef, Renderer2, AfterViewInit, SimpleChanges, Type, ViewContainerRef, QueryList, OutputEmitterRef } from '@angular/core';
+import { OnInit, OnDestroy, AfterContentInit, EnvironmentProviders, InjectionToken, Provider, PipeTransform, ElementRef, OnChanges, TemplateRef, Renderer2, AfterViewInit, AfterContentChecked, SimpleChanges, Type, ViewContainerRef, QueryList, OutputEmitterRef } from '@angular/core';
 import { Placement } from '@floating-ui/dom';
 import * as _angular_platform_browser from '@angular/platform-browser';
 import { SafeHtml, DomSanitizer } from '@angular/platform-browser';
@@ -542,18 +542,32 @@ declare class StrataNativeInputRefDirective {
 }
 
 type InputFieldSize = 'sm' | 'md' | 'lg';
-declare class StrataInputFieldComponent implements AfterViewInit {
+declare class StrataInputFieldComponent implements AfterViewInit, AfterContentChecked {
+    private readonly hostElement;
     size: _angular_core.InputSignal<InputFieldSize>;
+    disabled: _angular_core.InputSignalWithTransform<boolean | undefined, unknown>;
+    maxLength: _angular_core.InputSignalWithTransform<number | undefined, unknown>;
+    showCharacterCounter: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    characterCounterFormatter: _angular_core.InputSignal<((current: number, max?: number) => string) | undefined>;
     iconComponents: _angular_core.Signal<readonly StrataIconComponent[]>;
     inputField: _angular_core.Signal<StrataNativeInputRefDirective | undefined>;
     private pendingFocus;
+    readonly currentLength: _angular_core.WritableSignal<number>;
+    private readonly nativeMaxLength;
+    readonly nativeDisabled: _angular_core.WritableSignal<boolean>;
+    readonly effectiveMaxLength: _angular_core.Signal<number | undefined>;
+    readonly effectiveDisabled: _angular_core.Signal<boolean>;
+    readonly counterText: _angular_core.Signal<string>;
     constructor();
     ngAfterViewInit(): void;
+    ngAfterContentChecked(): void;
+    onNativeInput(): void;
     focus(): void;
     blur(): void;
-    get nativeInput(): HTMLInputElement | undefined;
+    get nativeInput(): HTMLInputElement | HTMLTextAreaElement | undefined;
+    private syncNativeState;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrataInputFieldComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrataInputFieldComponent, "st-input-field", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, ["iconComponents", "inputField"], ["label", "[prefix]", "input,textarea", "[suffix]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrataInputFieldComponent, "st-input-field", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "showCharacterCounter": { "alias": "showCharacterCounter"; "required": false; "isSignal": true; }; "characterCounterFormatter": { "alias": "characterCounterFormatter"; "required": false; "isSignal": true; }; }, {}, ["iconComponents", "inputField"], ["label", "[prefix]", "input,textarea", "[suffix]"], true, never>;
 }
 
 declare class StrataAutoResizeDirective implements AfterViewInit, OnChanges {