smart-webcomponents-angular/fesm2015/smart-webcomponents-angular-textbox.mjs.map

[](https://jqwidgets.com/license/)

{"version":3,"file":"smart-webcomponents-angular-textbox.mjs","sources":["../../textbox/src/smart.element.ts","../../textbox/src/smart.textbox.ts","../../textbox/src/smart.listitem.ts","../../textbox/src/smart.listitemsgroup.ts","../../textbox/src/smart.textbox.module.ts","../../textbox/src/smart-webcomponents-angular-textbox.ts"],"sourcesContent":["\ndeclare global {\n    interface Window {\n        Smart: any;\n}\n}\n\n\nimport { Directive, ElementRef, Input, Output, EventEmitter } from '@angular/core';\nimport { ElementRenderMode } from './../index';\n\n@Directive()\nexport class BaseElement {\n    constructor(ref: ElementRef) {\n        const that = this;\n        this.nativeElement = ref.nativeElement as any;\n\n        that.nativeElement.onAttached = () => {\n            that.onAttach.emit(that.nativeElement);\n        }\n\n        that.nativeElement.onDetached = () => {\n            that.onDetach.emit(that.nativeElement);\n        }\n    }\n\n    @Output() onCreate: EventEmitter<any> = new EventEmitter();\n    @Output() onReady: EventEmitter<any> = new EventEmitter();\n    @Output() onAttach: EventEmitter<any> = new EventEmitter();\n    @Output() onDetach: EventEmitter<any> = new EventEmitter();\n\n    public nativeElement: any;\n\n    public addEventListener(type: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions = false): void {\n        this.nativeElement.addEventListener(type, listener, options);\n\t}\n\n\tpublic removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions = false): void {\n\t\tthis.nativeElement.removeEventListener(type, listener, options);\n\t}\n\n\tpublic dispatchEvent(event: Event): boolean {\n\t\treturn this.nativeElement.dispatchEvent(event);\n\t}\n\n\tpublic blur(): void {\n\t\tthis.nativeElement.blur();\n\t}\n\n\tpublic click(): void {\n\t\tthis.nativeElement.click();\n\t}\n\n\tpublic focus(options?: FocusOptions): void {\n\t\tthis.nativeElement.focus(options);\n\t}\n\n/** @description Sets or gets the license.  */\n\t@Input()\n\tget license(): string {\n\t\treturn this.nativeElement ? this.nativeElement.license : undefined;\n\t}\n\tset license(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.license = value : undefined;\n\t}\n\t\n/** @description Sets or gets the language. Used in conjunction with the property messages.  */\n\t@Input()\n\tget locale(): string {\n\t\treturn this.nativeElement ? this.nativeElement.locale : undefined;\n\t}\n\tset locale(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.locale = value : undefined;\n\t}\n\n\t/** @description Callback used to customize the format of the messages that are returned from the Localization Module. */\n\t@Input()\n\tget localizeFormatFunction(): any {\n\t\treturn this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;\n\t}\n\tset localizeFormatFunction(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.localizeFormatFunction = value : undefined;\n\t}\n\n\t/** @description Sets or gets an object specifying strings used in the widget that can be localized. Used in conjunction with the property locale.  */\n\t@Input()\n\tget messages(): any {\n\t\treturn this.nativeElement ? this.nativeElement.messages : undefined;\n\t}\n\tset messages(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.messages = value : undefined;\n\t}\n\n\t/** @description Sets or gets the value indicating whether the element is aligned to support locales using right-to-left fonts. */\n\t@Input()\n\tget rightToLeft(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.rightToLeft : undefined;\n\t}\n\tset rightToLeft(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.rightToLeft = value : undefined;\n\t}\n\n\t/** @description Determines the theme. Theme defines the look of the element */\n\t@Input()\n\tget theme(): string {\n\t\treturn this.nativeElement ? this.nativeElement.theme : undefined;\n\t}\n\tset theme(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.theme = value : undefined;\n\t}\n}\n\nlet Smart: any;\nif (typeof window !== \"undefined\") {\n\tSmart = window.Smart;\n}\nexport { Smart };\n\n","import { TextBox } from './../index';\nimport { Animation, AutoComplete, TextBoxDisplayMode, DropDownOpenMode, DropDownPosition, EscKeyMode, EnterKeyBehavior, HorizontalScrollBarVisibility, ListItemMeasureMode, VerticalAlignment, VerticalScrollBarVisibility, ElementRenderMode} from './../index';\nimport { Component, Directive, AfterViewInit, ElementRef, Input, OnInit, OnChanges, OnDestroy, SimpleChanges, forwardRef, ChangeDetectionStrategy, Output, EventEmitter, QueryList, ContentChildren } from '@angular/core';\nimport { BaseElement, Smart } from './smart.element';\nexport { Animation, AutoComplete, TextBoxDisplayMode, DropDownOpenMode, DropDownPosition, EscKeyMode, EnterKeyBehavior, HorizontalScrollBarVisibility, ListItemMeasureMode, VerticalAlignment, VerticalScrollBarVisibility, ElementRenderMode} from './../index';\nexport { Smart } from './smart.element';\nexport { TextBox } from './../index';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\n\n\nimport { ListItemComponent } from './smart.listitem';\n\nimport { ListItemsGroupComponent } from './smart.listitemsgroup';\n\nconst CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => TextBoxComponent),\n    multi: true\n}\n\n@Directive({\n\texportAs: 'smart-text-box',\tselector: 'smart-text-box, [smart-text-box]',\n\tproviders: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR]\n\n})\n\nexport class TextBoxComponent extends BaseElement implements OnInit, AfterViewInit, OnDestroy, OnChanges, ControlValueAccessor {\n\n\tconstructor(ref: ElementRef<TextBox>) {\n\t\tsuper(ref);\n\t\tthis.nativeElement = ref.nativeElement as TextBox;\n\t}\n\n\tprivate eventHandlers: any[] = [];\n\n\tpublic declare nativeElement: TextBox;\n\t/** @description Creates the component on demand.\n\t * @param properties An optional object of properties, which will be added to the template binded ones.\n\t */\n\tpublic createComponent(properties = {}): any {\n    \tthis.nativeElement = <TextBox>document.createElement('smart-text-box');\n\t\tfor (let propertyName in properties) { \n \t\t\tthis.nativeElement[propertyName] = properties[propertyName];\n\t\t}\n\t\treturn this.nativeElement;\n\t}\n        /**\n        * @description\n        * The registered callback function called when a change event occurs on the form elements.\n        */\n       _onChange: (value: any) => void = () => {};\n        /**\n        * @description\n        * The registered callback function called when a blur event occurs on the form elements.\n        */\n       _onTouched: () => any = () => {};\n\n\n\t/** @description Controls the animation mode for the component. You can retrieve the current mode or assign a new one. Setting this property to 'none' will disable all animations. */\n\t@Input()\n\tget animation(): Animation | string {\n\t\treturn this.nativeElement ? this.nativeElement.animation : undefined;\n\t}\n\tset animation(value: Animation | string) {\n\t\tthis.nativeElement ? this.nativeElement.animation = value : undefined;\n\t}\n\n\t/** @description Specifies whether the text box should automatically receive keyboard focus when the page loads, allowing users to start typing immediately without clicking inside the box. */\n\t@Input()\n\tget autoFocus(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.autoFocus : undefined;\n\t}\n\tset autoFocus(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.autoFocus = value : undefined;\n\t}\n\n\t/** @description Specifies the autocomplete mode used to filter and display suggestions from the dataSource. The selected autocomplete mode determines how input text is matched against the available items, showing only those entries that meet the criteria—for example, items that start with, contain, or exactly match the user's input. This setting helps control the relevance and behavior of suggestion lists shown to the user while typing. */\n\t@Input()\n\tget autoComplete(): AutoComplete | string {\n\t\treturn this.nativeElement ? this.nativeElement.autoComplete : undefined;\n\t}\n\tset autoComplete(value: AutoComplete | string) {\n\t\tthis.nativeElement ? this.nativeElement.autoComplete = value : undefined;\n\t}\n\n\t/** @description Specifies the duration (in milliseconds) to wait after the user stops typing before displaying the dropdown with autocomplete suggestions. This delay helps control how quickly the matching results appear, improving performance and user experience by preventing unnecessary searches while the user is still typing. */\n\t@Input()\n\tget autoCompleteDelay(): number {\n\t\treturn this.nativeElement ? this.nativeElement.autoCompleteDelay : undefined;\n\t}\n\tset autoCompleteDelay(value: number) {\n\t\tthis.nativeElement ? this.nativeElement.autoCompleteDelay = value : undefined;\n\t}\n\n\t/** @description Specifies the data source that populates the ComboBox options. The dataSource property accepts multiple types:- 'Array of strings or numbers:' Each item will be displayed as both the label and value of a list item.- 'Array of objects:' Each object should contain properties—such as label (displayed text) and value (item value)—that define the corresponding list item’s display and value.- 'Callback function:' You can provide a function that returns an array of items in either of the above forms. This allows for dynamic or asynchronous data loading.This flexible approach lets you easily integrate static lists, complex objects, or data fetched from external sources into the ComboBox. */\n\t@Input()\n\tget dataSource(): any {\n\t\treturn this.nativeElement ? this.nativeElement.dataSource : undefined;\n\t}\n\tset dataSource(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.dataSource = value : undefined;\n\t}\n\n\t/** @description Determines whether the element is active and interactive (enabled) or inactive and unresponsive to user interactions (disabled). When set to \"disabled,\" the element cannot be focused, clicked, or edited by the user. */\n\t@Input()\n\tget disabled(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.disabled : undefined;\n\t}\n\tset disabled(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.disabled = value : undefined;\n\t}\n\n\t/** @description Specifies whether a visual indicator (such as a loading spinner or progress bar) will be displayed while filtering data or loading items from a remote source. This helps inform users that a background operation is in progress. */\n\t@Input()\n\tget displayLoadingIndicator(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.displayLoadingIndicator : undefined;\n\t}\n\tset displayLoadingIndicator(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.displayLoadingIndicator = value : undefined;\n\t}\n\n\t/** @description Sets or retrieves the displayMember property. The displayMember determines which property of each object in the data source collection (defined by the 'dataSource' property) will be used for display purposes in the user interface. By specifying the name of a property here, you control which value from each data source item is shown to users (e.g., displaying a \"name\" property from a list of user objects). */\n\t@Input()\n\tget displayMember(): string {\n\t\treturn this.nativeElement ? this.nativeElement.displayMember : undefined;\n\t}\n\tset displayMember(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.displayMember = value : undefined;\n\t}\n\n\t/** @description Specifies the visual presentation of characters within the input field, such as whether the characters are visible as plain text, masked (e.g., as password dots), or formatted in a particular style. This attribute controls how users see the inputted content while typing or reviewing their entries. */\n\t@Input()\n\tget displayMode(): TextBoxDisplayMode | string {\n\t\treturn this.nativeElement ? this.nativeElement.displayMode : undefined;\n\t}\n\tset displayMode(value: TextBoxDisplayMode | string) {\n\t\tthis.nativeElement ? this.nativeElement.displayMode = value : undefined;\n\t}\n\n\t/** @description Specifies the parent container to which the dropdown menu is appended in the DOM. By default, the dropdown is rendered within its original parent element. However, if an ancestor element has restricted overflow (e.g., 'overflow: hidden' or 'overflow: auto'), the dropdown may be clipped and not display correctly. To resolve this, you can set the dropDownAppendTo property to ''body'', the ID of a specific HTML element, or a direct reference to an HTML element. When set, the dropdown will be moved to the specified container in the DOM, ensuring it displays properly regardless of overflow constraints in its ancestors. To restore the dropdown to its original parent, reset this property to null. This feature is especially useful for ensuring that dropdowns are visible and functional in complex layouts where parent elements limit visibility due to CSS overflow properties. */\n\t@Input()\n\tget dropDownAppendTo(): any {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownAppendTo : undefined;\n\t}\n\tset dropDownAppendTo(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownAppendTo = value : undefined;\n\t}\n\n\t/** @description Specifies the height of the dropdown menu. By default, this property is set to an empty string, which means the dropdown's height will be determined by a CSS variable. To customize the dropdown's height directly, you can assign a specific value (e.g., \"200px\" or \"50%\") to this property. Otherwise, leaving it empty enables the component to use the height defined by the associated CSS variable. */\n\t@Input()\n\tget dropDownHeight(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownHeight : undefined;\n\t}\n\tset dropDownHeight(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownHeight = value : undefined;\n\t}\n\n\t/** @description Defines the maximum height for the dropdown menu. If no value is set (default is an empty string), the dropdown’s maximum height will be determined by a corresponding CSS variable instead. This allows for dynamic styling via CSS, while still providing the option to specify a fixed maximum height directly through this property. */\n\t@Input()\n\tget dropDownMaxHeight(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownMaxHeight : undefined;\n\t}\n\tset dropDownMaxHeight(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownMaxHeight = value : undefined;\n\t}\n\n\t/** @description Specifies the maximum width of the dropdown menu. By default, this property is set to an empty string, meaning that the dropdown's max-width is determined by a corresponding CSS variable. If a specific value (such as '300px' or '100%') is provided, it will override the CSS variable and directly set the maximum width of the dropdown. */\n\t@Input()\n\tget dropDownMaxWidth(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownMaxWidth : undefined;\n\t}\n\tset dropDownMaxWidth(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownMaxWidth = value : undefined;\n\t}\n\n\t/** @description Defines the minimum height of the dropdown menu. By default, this property is set to an empty string (\"\"), which means the minimum height is not explicitly specified in the component and will instead be determined by the value of a related CSS variable. If a specific value (such as \"200px\" or \"2rem\") is provided, it will override the CSS variable and set the minimum height of the dropdown directly. */\n\t@Input()\n\tget dropDownMinHeight(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownMinHeight : undefined;\n\t}\n\tset dropDownMinHeight(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownMinHeight = value : undefined;\n\t}\n\n\t/** @description Specifies the minimum width of the dropdown menu. By default, this property is set to an empty string, which means the dropdown's minimum width is determined by a corresponding CSS variable. If you provide a specific value (such as '200px' or '20rem'), it will override the CSS variable and set the dropdown's minimum width accordingly. */\n\t@Input()\n\tget dropDownMinWidth(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownMinWidth : undefined;\n\t}\n\tset dropDownMinWidth(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownMinWidth = value : undefined;\n\t}\n\n\t/** @description Specifies the direction or animation style in which the dropdown menu appears when activated (e.g., opens upwards, downwards, or with a fade effect). */\n\t@Input()\n\tget dropDownOpenMode(): DropDownOpenMode | string {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownOpenMode : undefined;\n\t}\n\tset dropDownOpenMode(value: DropDownOpenMode | string) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownOpenMode = value : undefined;\n\t}\n\n\t/** @description When this property is enabled, opening the element’s dropdown will create a transparent overlay that covers the entire area between the dropdown and the rest of the webpage. This overlay ensures that any clicks outside the dropdown are intercepted by the overlay itself, rather than interacting with underlying DOM elements. As a result, clicking outside the dropdown can be handled consistently—for example, to close the dropdown—without triggering unintended interactions elsewhere on the page. */\n\t@Input()\n\tget dropDownOverlay(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownOverlay : undefined;\n\t}\n\tset dropDownOverlay(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownOverlay = value : undefined;\n\t}\n\n\t/** @description Specifies the placeholder text that appears in the dropdown menu when there are no available items to display. This text provides guidance or context to users, indicating that the dropdown is currently empty. */\n\t@Input()\n\tget dropDownPlaceholder(): string {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownPlaceholder : undefined;\n\t}\n\tset dropDownPlaceholder(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownPlaceholder = value : undefined;\n\t}\n\n\t/** @description Specifies the alignment and placement of the dropdown menu relative to its trigger element when the dropdown is opened, allowing you to control where the menu appears on the screen (e.g., above, below, left, or right of the trigger). */\n\t@Input()\n\tget dropDownPosition(): DropDownPosition | string {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownPosition : undefined;\n\t}\n\tset dropDownPosition(value: DropDownPosition | string) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownPosition = value : undefined;\n\t}\n\n\t/** @description Specifies the width of the dropdown menu. By default, this property is set to an empty string (\"\"). When left empty, the dropdown's width is determined by a corresponding CSS variable, allowing for flexible styling through external or theme-based CSS. To explicitly set a custom width, provide a valid CSS width value (e.g., \"200px\", \"50%\"). */\n\t@Input()\n\tget dropDownWidth(): string | number {\n\t\treturn this.nativeElement ? this.nativeElement.dropDownWidth : undefined;\n\t}\n\tset dropDownWidth(value: string | number) {\n\t\tthis.nativeElement ? this.nativeElement.dropDownWidth = value : undefined;\n\t}\n\n\t/** @description Specifies how the element responds when the Escape key is pressed, such as closing a dialog, dismissing a modal, or performing a custom action. */\n\t@Input()\n\tget escKeyMode(): EscKeyMode | string {\n\t\treturn this.nativeElement ? this.nativeElement.escKeyMode : undefined;\n\t}\n\tset escKeyMode(value: EscKeyMode | string) {\n\t\tthis.nativeElement ? this.nativeElement.escKeyMode = value : undefined;\n\t}\n\n\t/** @description Defines how the \"Enter\" key functions within the application, such as whether it submits a form, inserts a new line, or triggers a specific action, depending on the context. */\n\t@Input()\n\tget enterKeyBehavior(): EnterKeyBehavior | string {\n\t\treturn this.nativeElement ? this.nativeElement.enterKeyBehavior : undefined;\n\t}\n\tset enterKeyBehavior(value: EnterKeyBehavior | string) {\n\t\tthis.nativeElement ? this.nativeElement.enterKeyBehavior = value : undefined;\n\t}\n\n\t/** @description Specifies the form element with which this element is associated, known as its \"form owner.\" The value of this attribute must be the ID of a  element present in the same document. This allows the element to be associated with a specific form, even if it is not nested directly within the form’s markup. */\n\t@Input()\n\tget form(): string {\n\t\treturn this.nativeElement ? this.nativeElement.form : undefined;\n\t}\n\tset form(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.form = value : undefined;\n\t}\n\n\t/** @description Provides supplemental helper text displayed beneath the element. This hint appears exclusively when the element is focused, offering contextual guidance to the user during interaction. */\n\t@Input()\n\tget hint(): any {\n\t\treturn this.nativeElement ? this.nativeElement.hint : undefined;\n\t}\n\tset hint(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.hint = value : undefined;\n\t}\n\n\t/** @description Controls whether the horizontal scroll bar within the dropdown menu is visible. This setting allows you to enable or disable horizontal scrolling for dropdown content that extends beyond the visible area. */\n\t@Input()\n\tget horizontalScrollBarVisibility(): HorizontalScrollBarVisibility | string {\n\t\treturn this.nativeElement ? this.nativeElement.horizontalScrollBarVisibility : undefined;\n\t}\n\tset horizontalScrollBarVisibility(value: HorizontalScrollBarVisibility | string) {\n\t\tthis.nativeElement ? this.nativeElement.horizontalScrollBarVisibility = value : undefined;\n\t}\n\n\t/** @description Represents the property key of a List item's object that specifies which value should be displayed in the input field when a ListItem is selected. This property is useful when you want to show a value other than the default label—such as a unique identifier or another attribute—within the input. By default, the item's label is shown. Use this option to customize the displayed value based on a different property from your data objects. */\n\t@Input()\n\tget inputMember(): string {\n\t\treturn this.nativeElement ? this.nativeElement.inputMember : undefined;\n\t}\n\tset inputMember(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.inputMember = value : undefined;\n\t}\n\n\t/** @description Defines the purpose of the input field and specifies the type of data expected, providing guidance to browsers and user agents for offering autofill suggestions. This property maps directly to the standard HTML autocomplete attribute, allowing developers to control whether and how a browser can automatically fill in the field based on the user's stored information. Possible values include generic options like 'on' and 'off', as well as more specific data types such as 'name', 'organization', 'email', 'street-address', and others, enabling enhanced user experience and data accuracy in forms. */\n\t@Input()\n\tget inputPurpose(): string {\n\t\treturn this.nativeElement ? this.nativeElement.inputPurpose : undefined;\n\t}\n\tset inputPurpose(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.inputPurpose = value : undefined;\n\t}\n\n\t/** @description Specifies the height (in pixels) for each list item when rendering the list.  This property is only applicable if list virtualization is enabled, as it allows the component to accurately calculate and display only the visible items for improved performance. */\n\t@Input()\n\tget itemHeight(): number | null {\n\t\treturn this.nativeElement ? this.nativeElement.itemHeight : undefined;\n\t}\n\tset itemHeight(value: number | null) {\n\t\tthis.nativeElement ? this.nativeElement.itemHeight = value : undefined;\n\t}\n\n\t/** @description Specifies the algorithm used to calculate the width of each item, determining how item widths are measured and displayed within the layout. This setting influences whether widths are fixed, dynamic, or adapt based on content or container size. */\n\t@Input()\n\tget itemMeasureMode(): ListItemMeasureMode | string {\n\t\treturn this.nativeElement ? this.nativeElement.itemMeasureMode : undefined;\n\t}\n\tset itemMeasureMode(value: ListItemMeasureMode | string) {\n\t\tthis.nativeElement ? this.nativeElement.itemMeasureMode = value : undefined;\n\t}\n\n\t/** @description A getter that retrieves and returns an array containing all the list item elements (e.g., '' elements) currently present within the dropdown menu. This allows easy access to all items displayed in the dropdown for further manipulation or inspection. */\n\t@Input()\n\tget items(): any {\n\t\treturn this.nativeElement ? this.nativeElement.items : undefined;\n\t}\n\tset items(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.items = value : undefined;\n\t}\n\n\t/** @description The itemTemplate property is a string specifying the id of an HTMLTemplateElement present in the DOM. This template is used to define and customize the structure and content of each item rendered within the list. By referencing the id of an HTMLTemplateElement, you can control how individual list items are displayed, allowing for flexible and reusable item layouts. */\n\t@Input()\n\tget itemTemplate(): any {\n\t\treturn this.nativeElement ? this.nativeElement.itemTemplate : undefined;\n\t}\n\tset itemTemplate(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.itemTemplate = value : undefined;\n\t}\n\n\t/** @description Displays a small text label positioned above the element, typically used to provide additional context or information about the element’s purpose. */\n\t@Input()\n\tget label(): string {\n\t\treturn this.nativeElement ? this.nativeElement.label : undefined;\n\t}\n\tset label(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.label = value : undefined;\n\t}\n\n\t/** @description Specifies the text that appears alongside the loading indicator when the loader is visible and positioned at either the top or bottom of the container. This text provides context or status information to users while the loading process is ongoing. */\n\t@Input()\n\tget loadingIndicatorPlaceholder(): string {\n\t\treturn this.nativeElement ? this.nativeElement.loadingIndicatorPlaceholder : undefined;\n\t}\n\tset loadingIndicatorPlaceholder(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.loadingIndicatorPlaceholder = value : undefined;\n\t}\n\n\t/** @description Specifies the screen location where the loading indicator will be displayed (e.g., top, bottom, center, etc.), allowing developers to control the visual placement of the loading element within the application's interface. */\n\t@Input()\n\tget loadingIndicatorPosition(): VerticalAlignment | string {\n\t\treturn this.nativeElement ? this.nativeElement.loadingIndicatorPosition : undefined;\n\t}\n\tset loadingIndicatorPosition(value: VerticalAlignment | string) {\n\t\tthis.nativeElement ? this.nativeElement.loadingIndicatorPosition = value : undefined;\n\t}\n\n\t/** @description Defines or retrieves the unlockKey, a unique code or token used to grant access to the product's features or functionality. */\n\t@Input()\n\tget unlockKey(): string {\n\t\treturn this.nativeElement ? this.nativeElement.unlockKey : undefined;\n\t}\n\tset unlockKey(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.unlockKey = value : undefined;\n\t}\n\n\t/** @description Sets or retrieves the current language for localization purposes. This property is used together with the messages property, which contains language-specific content or translations. Adjusting the language will determine which set of messages is displayed or utilized within the application. */\n\t@Input()\n\tget locale(): string {\n\t\treturn this.nativeElement ? this.nativeElement.locale : undefined;\n\t}\n\tset locale(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.locale = value : undefined;\n\t}\n\n\t/** @description A callback function that allows you to define a custom format for messages returned by the Localization Module. This enables you to modify or enhance the localized messages—such as adding prefixes, changing text structure, or injecting dynamic values—before they are displayed to the user. */\n\t@Input()\n\tget localizeFormatFunction(): any {\n\t\treturn this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;\n\t}\n\tset localizeFormatFunction(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.localizeFormatFunction = value : undefined;\n\t}\n\n\t/** @description Specifies or retrieves the maximum number of characters allowed for user input in a text field. This limits how many characters a user can type or paste into the field. */\n\t@Input()\n\tget maxLength(): number {\n\t\treturn this.nativeElement ? this.nativeElement.maxLength : undefined;\n\t}\n\tset maxLength(value: number) {\n\t\tthis.nativeElement ? this.nativeElement.maxLength = value : undefined;\n\t}\n\n\t/** @description Specifies or retrieves the minimum number of characters a user must type before the auto-complete feature is activated and suggestions are displayed. */\n\t@Input()\n\tget minLength(): number {\n\t\treturn this.nativeElement ? this.nativeElement.minLength : undefined;\n\t}\n\tset minLength(value: number) {\n\t\tthis.nativeElement ? this.nativeElement.minLength = value : undefined;\n\t}\n\n\t/** @description Defines or retrieves an object containing the set of strings (such as labels, tooltips, button text, and messages) used throughout the widget interface, allowing these strings to be localized for different languages. This property works together with the language property to ensure the widget’s text content is displayed in the appropriate language for users. */\n\t@Input()\n\tget messages(): any {\n\t\treturn this.nativeElement ? this.nativeElement.messages : undefined;\n\t}\n\tset messages(value: any) {\n\t\tthis.nativeElement ? this.nativeElement.messages = value : undefined;\n\t}\n\n\t/** @description Sets or retrieves the name attribute of the element. The name attribute specifies a key associated with the element's value when submitting HTML forms, enabling server-side identification and processing of submitted data. This is essential for form controls such as inputs, selects, and textareas. */\n\t@Input()\n\tget name(): string {\n\t\treturn this.nativeElement ? this.nativeElement.name : undefined;\n\t}\n\tset name(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.name = value : undefined;\n\t}\n\n\t/** @description Indicates whether the dropdown menu is currently expanded (open) and visible to the user, or collapsed (closed) and hidden from view. */\n\t@Input()\n\tget opened(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.opened : undefined;\n\t}\n\tset opened(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.opened = value : undefined;\n\t}\n\n\t/** @description Specifies the placeholder text that appears inside the input field when it is empty, providing guidance or an example of the expected input to the user. */\n\t@Input()\n\tget placeholder(): string {\n\t\treturn this.nativeElement ? this.nativeElement.placeholder : undefined;\n\t}\n\tset placeholder(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.placeholder = value : undefined;\n\t}\n\n\t/** @description Prevents any user interaction with the element, disabling actions such as clicking, focusing, hovering, or keyboard input. The element will not respond to any user events while this setting is applied. */\n\t@Input()\n\tget readonly(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.readonly : undefined;\n\t}\n\tset readonly(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.readonly = value : undefined;\n\t}\n\n\t/** @description Sets or retrieves a value that specifies whether the element’s content is aligned for right-to-left (RTL) text direction, supporting languages and locales such as Arabic or Hebrew. When enabled, the element’s layout and text flow will be adjusted to display content appropriately for RTL reading order. */\n\t@Input()\n\tget rightToLeft(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.rightToLeft : undefined;\n\t}\n\tset rightToLeft(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.rightToLeft = value : undefined;\n\t}\n\n\t/** @description Indicates that the input field is required, meaning the user must provide a value in this field before the form can be submitted successfully. If the input is left empty, the form submission will be blocked and the user will be prompted to complete the required information. */\n\t@Input()\n\tget required(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.required : undefined;\n\t}\n\tset required(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.required = value : undefined;\n\t}\n\n\t/** @description Defines the custom error message displayed to users when the input is marked as required but no value has been entered. If the required field is left empty, this message will be shown to prompt the user to provide the necessary input. */\n\t@Input()\n\tget requiredMessage(): string {\n\t\treturn this.nativeElement ? this.nativeElement.requiredMessage : undefined;\n\t}\n\tset requiredMessage(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.requiredMessage = value : undefined;\n\t}\n\n\t/** @description Specifies whether the entire content of the input field should automatically be highlighted (selected) when the input receives focus, allowing users to easily replace or copy the content. */\n\t@Input()\n\tget selectAllOnFocus(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.selectAllOnFocus : undefined;\n\t}\n\tset selectAllOnFocus(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.selectAllOnFocus = value : undefined;\n\t}\n\n\t/** @description Specifies the theme to be applied, which controls the overall appearance and visual style of the element, including colors, fonts, and other stylistic details. */\n\t@Input()\n\tget theme(): string {\n\t\treturn this.nativeElement ? this.nativeElement.theme : undefined;\n\t}\n\tset theme(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.theme = value : undefined;\n\t}\n\n\t/** @description If set to true, the element will be excluded from the tab order and cannot receive keyboard or programmatic focus. This means users will not be able to navigate to the element using the Tab key or set focus to it via scripts. */\n\t@Input()\n\tget unfocusable(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.unfocusable : undefined;\n\t}\n\tset unfocusable(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.unfocusable = value : undefined;\n\t}\n\n\t/** @description Sets a new value for the element or retrieves its current value, depending on how the method is used. Useful for reading or updating the content, input, or state of form elements such as text fields, checkboxes, or select menus. */\n\t@Input()\n\tget value(): string {\n\t\treturn this.nativeElement ? this.nativeElement.value : undefined;\n\t}\n\tset value(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.value = value : undefined;\n\t}\n\n\t/** @description Specifies which property of each item object represents its value. The valueMember setting is particularly useful when binding the ListBox to data from a JSON file as its dataSource and you need to designate a specific property in the JSON objects to be used as the item's value. This is similar to how groupMember works, but instead of grouping items, valueMember tells the ListBox which property to use for the underlying value of each list item. For example, if your JSON objects have an \"id\" property, setting valueMember to \"id\" will store the value of the \"id\" property for each item in the ListBox. */\n\t@Input()\n\tget valueMember(): string {\n\t\treturn this.nativeElement ? this.nativeElement.valueMember : undefined;\n\t}\n\tset valueMember(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.valueMember = value : undefined;\n\t}\n\n\t/** @description Controls whether the vertical scroll bar within the dropdown menu is visible. This property allows you to specify if users can scroll vertically to view additional dropdown options when the content overflows the visible area. */\n\t@Input()\n\tget verticalScrollBarVisibility(): VerticalScrollBarVisibility | string {\n\t\treturn this.nativeElement ? this.nativeElement.verticalScrollBarVisibility : undefined;\n\t}\n\tset verticalScrollBarVisibility(value: VerticalScrollBarVisibility | string) {\n\t\tthis.nativeElement ? this.nativeElement.verticalScrollBarVisibility = value : undefined;\n\t}\n\n\t/** @description This event is triggered whenever the value in the Text Box changes and is confirmed by the user. Specifically, it fires under two conditions:  1. When the user moves focus away from the Text Box (on blur).  2. When the user presses the 'Enter' key while the Text Box is focused.  This ensures that the event only occurs after the user has finished editing the text, rather than on every keystroke.\n\t*  @param event. The custom event. \tCustom event was created with: event.detail(\toldValue, \tvalue, \ttype)\n\t*   oldValue - The previous value before it was changed.\n\t*   value - The new value.\n\t*   type - The type of the event.\n\t*/\n\t@Output() onChange: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description This event is triggered each time a user releases a key (on the keyup event) within the TextBox, but only if the content of the TextBox has changed since the previous event.\n\t*  @param event. The custom event. \tCustom event was created with: event.detail(\toldValue, \tvalue)\n\t*   oldValue - The previous value before it was changed.\n\t*   value - The new value.\n\t*/\n\t@Output() onChanging: EventEmitter<CustomEvent> = new EventEmitter();\n\n\t/** @description Closes the drop-down menu associated with the input field. Note: The drop-down appears only when auto-complete functionality is enabled, allowing users to select from suggested options. \n\t*/\n    public close(): void {\n        if (this.nativeElement.isRendered) {\n            this.nativeElement.close();\n        }\n        else\n        {\n            this.nativeElement.whenRendered(() => {\n                this.nativeElement.close();\n            });\n        }\n    }\n\n\t/** @description Expands the drop-down menu, allowing users to view and select available options. This drop-down menu is displayed exclusively when the autocomplete feature is enabled, providing relevant suggestions based on user input. \n\t*/\n    public open(): void {\n        if (this.nativeElement.isRendered) {\n            this.nativeElement.open();\n        }\n        else\n        {\n            this.nativeElement.whenRendered(() => {\n                this.nativeElement.open();\n            });\n        }\n    }\n\n\t/** @description This method resets the input field to its original, initial value, effectively clearing any changes made by the user and restoring the input to its default state as set when the component or page first loaded. \n\t*/\n    public reset(): void {\n        if (this.nativeElement.isRendered) {\n            this.nativeElement.reset();\n        }\n        else\n        {\n            this.nativeElement.whenRendered(() => {\n                this.nativeElement.reset();\n            });\n        }\n    }\n\n\n\tget isRendered(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.isRendered : false;\n\t}\n\n\tngOnInit() {\n\t}\n\n    ngAfterViewInit() {\n      const that = this;\n\n      that.onCreate.emit(that.nativeElement);\n\n\t\tif (Smart) Smart.Render();\n\n\t\tthis.nativeElement.classList.add('smart-angular');\n\n\t\tif (this.nativeElement.whenRendered) this.nativeElement.whenRendered(() => { that.onReady.emit(that.nativeElement); });\n\t\tthis.listen();\n\t}\n\n\tngOnDestroy() {\n\t\tthis.unlisten();\n\t}\n\n\t_initialChange = true; \n\n\tget ngValue(): any {\n\t\tif (!this.nativeElement) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst value = this.nativeElement.value;\n\t\treturn value;\n\t}\n\n\tset ngValue(value: any) {\n\t\tif (this.nativeElement) {\n\t\t    this.writeValue(value);\n\t\t}\n\t}\n\n\twriteValue(value: any): void {\n        const that = this;\n        const normalizedValue = value == null ? '' : value;\n\n\t\tthat.nativeElement.whenRendered(() => {\n\t\t\tthat.value = normalizedValue;\n\t\t\tif (that._initialChange === false) {\n\t    \t\tthat._onChange(that.value);\n            }\n\t\t});\n\t}\n\n\tregisterOnChange(fn: any): void {\n\t\tthis._onChange = fn;\n\t}\n\n\tregisterOnTouched(fn: any): void {\n\t\tthis._onTouched = fn;\n\t}\n\n\tngOnChanges(changes: SimpleChanges) {\n\t\tif (this.nativeElement && this.nativeElement.isRendered) {\n\t\t\tfor (const propName in changes) {\n\t\t\t\tif (changes.hasOwnProperty(propName)) {\n\t\t\t\t\tthis.nativeElement[propName] = changes[propName].currentValue;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t/** @description Add event listeners. */\n\tprivate listen(): void {\n        const that = this;\n\t\tthat.eventHandlers['changeHandler'] = (event: CustomEvent) => { that.onChange.emit(event); }\n\t\tthat.nativeElement.addEventListener('change', that.eventHandlers['changeHandler']);\n\n\t\tthat.eventHandlers['changingHandler'] = (event: CustomEvent) => { that.onChanging.emit(event); }\n\t\tthat.nativeElement.addEventListener('changing', that.eventHandlers['changingHandler']);\n\n\n        that.eventHandlers['changeModelHandler'] = (event: Event) => {\n            that._initialChange = false;\n            that._onChange(that.nativeElement.value);\n        };\n        that.eventHandlers['blurModelHandler'] = (event: Event) => {\n            that._onTouched();\n        };\n        that.nativeElement.whenRendered(() => {\n            if (that.nativeElement.querySelector('input')) {\n                that.eventHandlers['keyupModelHandler'] = (event) => {\n                    setTimeout(() => { that.eventHandlers['changeModelHandler'](event); }, 50);\n                };\n\n                that.nativeElement.querySelector('input').addEventListener('keyup', that.eventHandlers['keyupModelHandler']);\n            }\n        });\n\t\tthat.nativeElement.addEventListener('change', that.eventHandlers['changeModelHandler']);\n\t\tthat.nativeElement.addEventListener('blur', that.eventHandlers['blurModelHandler']);\n\t}\n\n\t/** @description Remove event listeners. */\n\tprivate unlisten(): void {\n        const that = this;\n\t\tif (that.eventHandlers['changeHandler']) {\n\t\t\tthat.nativeElement.removeEventListener('change', that.eventHandlers['changeHandler']);\n\t\t}\n\n\t\tif (that.eventHandlers['changingHandler']) {\n\t\t\tthat.nativeElement.removeEventListener('changing', that.eventHandlers['changingHandler']);\n\t\t}\n\n\t\tif (that.eventHandlers['changeModelHandler']) {\n\t\t\tthat.nativeElement.removeEventListener('change', that.eventHandlers['changeModelHandler']);\n            if (that.nativeElement.querySelector('input')) {\n                  that.nativeElement.querySelector('input').removeEventListener('keyup', that.eventHandlers['keyupModelHandler']);\n            }\n\t\t}\n\t\tif (that.eventHandlers['blurModelHandler']) {\n\t\t\tthat.nativeElement.removeEventListener('blur', that.eventHandlers['blurModelHandler']);\n\t\t}\n\t}\n}\n","import { ListItem } from './../index';\nimport { ListItemDisplayMode, ElementRenderMode} from './../index';\nimport { Component, Directive, AfterViewInit, ElementRef, Input, OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';\nimport { BaseElement, Smart } from './smart.element';\nexport { ListItemDisplayMode, ElementRenderMode} from './../index';\nexport { Smart } from './smart.element';\nexport { ListItem } from './../index';\n\n\n@Directive({\n\texportAs: 'smart-list-item',\tselector: 'smart-list-item, [smart-list-item]'\n})\n\nexport class ListItemComponent extends BaseElement implements OnInit, AfterViewInit, OnDestroy, OnChanges {\n\tconstructor(ref: ElementRef<ListItem>) {\n\t\tsuper(ref);\n\t\tthis.nativeElement = ref.nativeElement as ListItem;\n\t}\n\n\tprivate eventHandlers: any[] = [];\n\n\tpublic declare nativeElement: ListItem;\n\t/** @description Creates the component on demand.\n\t * @param properties An optional object of properties, which will be added to the template binded ones.\n\t */\n\tpublic createComponent(properties = {}): any {\n    \tthis.nativeElement = <ListItem>document.createElement('smart-list-item');\n\t\tfor (let propertyName in properties) { \n \t\t\tthis.nativeElement[propertyName] = properties[propertyName];\n\t\t}\n\t\treturn this.nativeElement;\n\t}\n\t/** @description  */\n\t@Input()\n\tget alternationIndex(): number {\n\t\treturn this.nativeElement ? this.nativeElement.alternationIndex : undefined;\n\t}\n\tset alternationIndex(value: number) {\n\t\tthis.nativeElement ? this.nativeElement.alternationIndex = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget color(): string {\n\t\treturn this.nativeElement ? this.nativeElement.color : undefined;\n\t}\n\tset color(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.color = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget displayMode(): ListItemDisplayMode | string {\n\t\treturn this.nativeElement ? this.nativeElement.displayMode : undefined;\n\t}\n\tset displayMode(value: ListItemDisplayMode | string) {\n\t\tthis.nativeElement ? this.nativeElement.displayMode = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget grouped(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.grouped : undefined;\n\t}\n\tset grouped(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.grouped = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget selected(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.selected : undefined;\n\t}\n\tset selected(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.selected = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget value(): string {\n\t\treturn this.nativeElement ? this.nativeElement.value : undefined;\n\t}\n\tset value(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.value = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget label(): string {\n\t\treturn this.nativeElement ? this.nativeElement.label : undefined;\n\t}\n\tset label(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.label = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget details(): string {\n\t\treturn this.nativeElement ? this.nativeElement.details : undefined;\n\t}\n\tset details(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.details = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget group(): string {\n\t\treturn this.nativeElement ? this.nativeElement.group : undefined;\n\t}\n\tset group(value: string) {\n\t\tthis.nativeElement ? this.nativeElement.group = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget hidden(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.hidden : undefined;\n\t}\n\tset hidden(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.hidden = value : undefined;\n\t}\n\n\t/** @description  */\n\t@Input()\n\tget readonly(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.readonly : undefined;\n\t}\n\tset readonly(value: boolean) {\n\t\tthis.nativeElement ? this.nativeElement.readonly = value : undefined;\n\t}\n\n\n\tget isRendered(): boolean {\n\t\treturn this.nativeElement ? this.nativeElement.isRendered : false;\n\t}\n\n\tngOnInit() {\n\t}\n\n    ngAfterViewInit() {\n      const that = this;\n\n      that.onCreate.emit(that.nativeElement);\n\n\t\tthis.nativeElement.classList.add('smart-angular');\n\n\t\tif (this.nativeElement.whenRendered) this.nativeElement.whenRendered(() => { that.onReady.emit(that.nativeElement); });\n\t}\n\n\tngOnDestroy() {\t}\n\n\tngOnChanges(changes: SimpleChanges) {\n\t\tif (this.nativeElement && this.nativeElement.isRendered) {\n\t\t\tfor (const propName in changes) {\n\t\t\t\tif (changes.hasOwnProperty(propName)) {\n\t\t\t\t\tthis.nativeElement[propName] = changes[propName].currentValue;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n}\n","import { ListItemsGroup } from './../index';\nimport { ElementRenderMode} from './../index';\nimport { Component, Directive, AfterViewInit, ElementRef, Input, OnInit, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';\nimport { BaseElement, Smart } from './smart.element';\nexport { ElementRenderMode} from './../index';\nexport { Smart } from './smart.element';\nexport { ListItemsGroup } from './../index';\n\n\n@Directive({\n\texportAs: 'smart-list-items-group',\tselector: 'smart-list-items-group, [smart-list-items-group]'\n})\n\nexport class ListItemsGroupComponent extends BaseElement implements OnInit, AfterViewInit, OnDestroy, OnChanges {\n\tconstructor(ref: ElementRef<ListItemsGroup>) {\n\t\tsuper(ref);\n\t\tthis.nativeElement = ref.nativeElement as ListItemsGroup;\n\t}\n\n\tprivate eventHandlers: any[] = [];\n\n\tpublic de