tgui-angular
Version:
🚀 Angular UI library for Telegram Web Apps with modern components and theming support | 💼 Author is open to work opportunities | 📧 Contact: a.blagovestnov@gmail.com | 💬 Telegram: @ablagovestnov
39 lines (38 loc) • 2.51 kB
TypeScript
import { TemplateRef } from '@angular/core';
import { PlatformService } from '../../../services/platform.service';
import * as i0 from "@angular/core";
/**
* Renders a text input field with enhanced styling and integration into a form structure.
* It automatically adapts typography and layout based on the platform, ensuring a consistent user experience across devices.
*/
export declare class InputComponent {
protected platformService: PlatformService;
private elementRef;
/** Input type (text, password, email, etc.) */
type: import("@angular/core").InputSignal<string>;
/** Header text displayed above the input */
header: import("@angular/core").InputSignal<string | null>;
/** Content to be displayed before the form input (can be string or TemplateRef) */
before: import("@angular/core").InputSignal<string | TemplateRef<any> | null>;
/** Content to be displayed after the form input (can be string or TemplateRef) */
after: import("@angular/core").InputSignal<string | TemplateRef<any> | null>;
/** Visual status of the input */
status: import("@angular/core").InputSignal<"error" | "default" | "focused">;
/** Whether the input is disabled */
disabled: import("@angular/core").InputSignal<boolean>;
/** Placeholder text */
placeholder: import("@angular/core").InputSignal<string>;
/** Input value */
value: import("@angular/core").InputSignal<string>;
/** Combines wrapper classes based on platform */
wrapperClasses: import("@angular/core").Signal<{
wrapper: boolean;
'wrapper--ios': boolean;
}>;
/** Handles input events */
onInput(event: Event): void;
/** Handles change events */
onChange(event: Event): void;
static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "tgui-input", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "before": { "alias": "before"; "required": false; "isSignal": true; }; "after": { "alias": "after"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}