@ckeditor/ckeditor5-ui 41.2.0 → 41.3.0-alpha.1

package/dist/types/focuscycler.d.ts

@@ -0,0 +1,245 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/focuscycler
+ */
+import { type ArrayOrItem, type FocusTracker, type KeystrokeHandler } from '@ckeditor/ckeditor5-utils';
+import type View from './view.js';
+import type ViewCollection from './viewcollection.js';
+declare const FocusCycler_base: {
+    new (): import("@ckeditor/ckeditor5-utils").Emitter;
+    prototype: import("@ckeditor/ckeditor5-utils").Emitter;
+};
+/**
+ * A utility class that helps cycling over {@link module:ui/focuscycler~FocusableView focusable views} in a
+ * {@link module:ui/viewcollection~ViewCollection} when the focus is tracked by the
+ * {@link module:utils/focustracker~FocusTracker} instance. It helps implementing keyboard
+ * navigation in HTML forms, toolbars, lists and the like.
+ *
+ * To work properly it requires:
+ * * a collection of focusable (HTML `tabindex` attribute) views that implement the `focus()` method,
+ * * an associated focus tracker to determine which view is focused.
+ *
+ * A simple cycler setup can look like this:
+ *
+ * ```ts
+ * const focusables = new ViewCollection<FocusableView>();
+ * const focusTracker = new FocusTracker();
+ *
+ * // Add focusable views to the focus tracker.
+ * focusTracker.add( ... );
+ * ```
+ *
+ * Then, the cycler can be used manually:
+ *
+ * ```ts
+ * const cycler = new FocusCycler( { focusables, focusTracker } );
+ *
+ * // Will focus the first focusable view in #focusables.
+ * cycler.focusFirst();
+ *
+ * // Will log the next focusable item in #focusables.
+ * console.log( cycler.next );
+ * ```
+ *
+ * Alternatively, it can work side by side with the {@link module:utils/keystrokehandler~KeystrokeHandler}:
+ *
+ * ```ts
+ * const keystrokeHandler = new KeystrokeHandler();
+ *
+ * // Activate the keystroke handler.
+ * keystrokeHandler.listenTo( sourceOfEvents );
+ *
+ * const cycler = new FocusCycler( {
+ * 	focusables, focusTracker, keystrokeHandler,
+ * 	actions: {
+ * 		// When arrowup of arrowleft is detected by the #keystrokeHandler,
+ * 		// focusPrevious() will be called on the cycler.
+ * 		focusPrevious: [ 'arrowup', 'arrowleft' ],
+ * 	}
+ * } );
+ * ```
+ *
+ * Check out the {@glink framework/deep-dive/ui/focus-tracking "Deep dive into focus tracking"} guide to learn more.
+ */
+export default class FocusCycler extends FocusCycler_base {
+    /**
+     * A {@link module:ui/focuscycler~FocusableView focusable views} collection that the cycler operates on.
+     */
+    readonly focusables: ViewCollection<FocusableView>;
+    /**
+     * A focus tracker instance that the cycler uses to determine the current focus
+     * state in {@link #focusables}.
+     */
+    readonly focusTracker: FocusTracker;
+    /**
+     * An instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}
+     * which can respond to certain keystrokes and cycle the focus.
+     */
+    readonly keystrokeHandler?: KeystrokeHandler;
+    /**
+     * Actions that the cycler can take when a keystroke is pressed. Requires
+     * `options.keystrokeHandler` to be passed and working. When an action is
+     * performed, `preventDefault` and `stopPropagation` will be called on the event
+     * the keystroke fired in the DOM.
+     *
+     * ```ts
+     * actions: {
+     * 	// Will call #focusPrevious() when arrowleft or arrowup is pressed.
+     * 	focusPrevious: [ 'arrowleft', 'arrowup' ],
+     *
+     * 	// Will call #focusNext() when arrowdown is pressed.
+     * 	focusNext: 'arrowdown'
+     * }
+     * ```
+     */
+    readonly actions?: FocusCyclerActions;
+    /**
+     * Creates an instance of the focus cycler utility.
+     *
+     * @param options Configuration options.
+     */
+    constructor(options: {
+        focusables: ViewCollection<FocusableView>;
+        focusTracker: FocusTracker;
+        keystrokeHandler?: KeystrokeHandler;
+        actions?: FocusCyclerActions;
+    });
+    /**
+     * Returns the first focusable view in {@link #focusables}.
+     * Returns `null` if there is none.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    get first(): FocusableView | null;
+    /**
+     * Returns the last focusable view in {@link #focusables}.
+     * Returns `null` if there is none.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    get last(): FocusableView | null;
+    /**
+     * Returns the next focusable view in {@link #focusables} based on {@link #current}.
+     * Returns `null` if there is none.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    get next(): FocusableView | null;
+    /**
+     * Returns the previous focusable view in {@link #focusables} based on {@link #current}.
+     * Returns `null` if there is none.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    get previous(): FocusableView | null;
+    /**
+     * An index of the view in the {@link #focusables} which is focused according
+     * to {@link #focusTracker}. Returns `null` when there is no such view.
+     */
+    get current(): number | null;
+    /**
+     * Focuses the {@link #first} item in {@link #focusables}.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    focusFirst(): void;
+    /**
+     * Focuses the {@link #last} item in {@link #focusables}.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    focusLast(): void;
+    /**
+     * Focuses the {@link #next} item in {@link #focusables}.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    focusNext(): void;
+    /**
+     * Focuses the {@link #previous} item in {@link #focusables}.
+     *
+     * **Note**: Hidden views (e.g. with `display: none`) are ignored.
+     */
+    focusPrevious(): void;
+    /**
+     * Focuses the given view if it exists.
+     *
+     * @param view The view to be focused
+     * @param direction The direction of the focus if the view has focusable children.
+     * @returns
+     */
+    private _focus;
+    /**
+     * Returns the next or previous focusable view in {@link #focusables} with respect
+     * to {@link #current}.
+     *
+     * @param step Either `1` for checking forward from {@link #current} or `-1` for checking backwards.
+     */
+    private _getDomFocusableItem;
+}
+/**
+ * A {@link module:ui/view~View} that can be focused (e.g. has `focus()` method).
+ */
+export type FocusableView = View & {
+    /**
+     * Focuses the view.
+     *
+     * @param direction This optional parameter helps improve the UX by providing additional information about the direction the focus moved
+     * (e.g. in a complex view or a form). It is useful for views that host multiple focusable children (e.g. lists, toolbars):
+     * * `1` indicates that the focus moved forward and, in most cases, the first child of the focused view should get focused,
+     * * `-1` indicates that the focus moved backwards, and the last focusable child should get focused
+     *
+     * See {@link module:ui/focuscycler~FocusCycler#event:forwardCycle} and {@link module:ui/focuscycler~FocusCycler#event:backwardCycle}
+     * to learn more.
+     */
+    focus(direction?: 1 | -1): void;
+};
+/**
+ * A {@link module:ui/view~View} that hosts one or more of focusable children being managed by a {@link module:ui/focuscycler~FocusCycler}
+ * instance exposed under `focusCycler` property.
+ */
+export type ViewWithFocusCycler = FocusableView & {
+    focusCycler: FocusCycler;
+};
+export interface FocusCyclerActions {
+    focusFirst?: ArrayOrItem<string>;
+    focusLast?: ArrayOrItem<string>;
+    focusNext?: ArrayOrItem<string>;
+    focusPrevious?: ArrayOrItem<string>;
+}
+/**
+ * Fired when the focus cycler is about to move the focus from the last focusable item
+ * to the first one.
+ *
+ * @eventName ~FocusCycler#forwardCycle
+ */
+export type FocusCyclerForwardCycleEvent = {
+    name: 'forwardCycle';
+    args: [];
+};
+/**
+ * Fired when the focus cycler is about to move the focus from the first focusable item
+ * to the last one.
+ *
+ * @eventName ~FocusCycler#backwardCycle
+ */
+export type FocusCyclerBackwardCycleEvent = {
+    name: 'backwardCycle';
+    args: [];
+};
+/**
+ * Checks whether a view is {@link ~FocusableView}.
+ *
+ * @param view A view to be checked.
+ */
+export declare function isFocusable(view: View): view is FocusableView;
+/**
+ * Checks whether a view is an instance of {@link ~ViewWithFocusCycler}.
+ *
+ * @param view A view to be checked.
+ */
+export declare function isViewWithFocusCycler(view: View): view is ViewWithFocusCycler;
+export {};

package/dist/types/formheader/formheaderview.d.ts

@@ -0,0 +1,59 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/formheader/formheaderview
+ */
+import View from '../view.js';
+import type ViewCollection from '../viewcollection.js';
+import IconView from '../icon/iconview.js';
+import type { Locale } from '@ckeditor/ckeditor5-utils';
+import '../../theme/components/formheader/formheader.css';
+/**
+ * The class component representing a form header view. It should be used in more advanced forms to
+ * describe the main purpose of the form.
+ *
+ * By default the component contains a bolded label view that has to be set. The label is usually a short (at most 3-word) string.
+ * The component can also be extended by any other elements, like: icons, dropdowns, etc.
+ *
+ * It is used i.a.
+ * by {@link module:table/tablecellproperties/ui/tablecellpropertiesview~TableCellPropertiesView}
+ * and {@link module:special-characters/ui/specialcharactersnavigationview~SpecialCharactersNavigationView}.
+ *
+ * The latter is an example, where the component has been extended by {@link module:ui/dropdown/dropdownview~DropdownView} view.
+ */
+export default class FormHeaderView extends View {
+    /**
+     * A collection of header items.
+     */
+    readonly children: ViewCollection;
+    /**
+     * The label of the header.
+     *
+     * @observable
+     */
+    label: string;
+    /**
+     * An additional CSS class added to the {@link #element}.
+     *
+     * @observable
+     */
+    class: string | null;
+    /**
+     * The icon view instance. Defined only if icon was passed in the constructor's options.
+     */
+    readonly iconView?: IconView;
+    /**
+     * Creates an instance of the form header class.
+     *
+     * @param locale The locale instance.
+     * @param options.label A label.
+     * @param options.class An additional class.
+     */
+    constructor(locale: Locale | undefined, options?: {
+        label?: string | null;
+        class?: string | null;
+        icon?: string | null;
+    });
+}

package/dist/types/highlightedtext/highlightedtextview.d.ts

@@ -0,0 +1,38 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/highlightedtext/highlightedtextview
+ */
+import View from '../view.js';
+import '../../theme/components/highlightedtext/highlightedtext.css';
+/**
+ * A class representing a view that displays a text which subset can be highlighted using the
+ * {@link #highlightText} method.
+ */
+export default class HighlightedTextView extends View {
+    /**
+     * The text that can be highlighted using the {@link #highlightText} method.
+     *
+     * **Note:** When this property changes, the previous highlighting is removed.
+     *
+     * @observable
+     */
+    text: string | undefined;
+    /**
+     * @inheritDoc
+     */
+    constructor();
+    /**
+     * Highlights view's {@link #text} according to the specified `RegExp`. If the passed RegExp is `null`, the
+     * highlighting is removed
+     *
+     * @param regExp
+     */
+    highlightText(regExp: RegExp | null): void;
+    /**
+     * Updates element's `innerHTML` with the passed content.
+     */
+    private _updateInnerHTML;
+}

package/dist/types/icon/iconview.d.ts

@@ -0,0 +1,88 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/icon/iconview
+ */
+import View from '../view.js';
+import '../../theme/components/icon/icon.css';
+/**
+ * The icon view class.
+ */
+export default class IconView extends View {
+    /**
+     * The SVG source of the icon.
+     *
+     * The user must provide the entire XML string, not just the path. See the
+     * {@glink framework/architecture/ui-library#setting-label-icon-and-tooltip UI library} guide for details.
+     *
+     * @observable
+     */
+    content: string | undefined;
+    /**
+     * This attribute specifies the boundaries to which the
+     * icon content should stretch.
+     *
+     * @observable
+     * @default '0 0 20 20'
+     */
+    viewBox: string;
+    /**
+     * The fill color of the child `path.ck-icon__fill`.
+     *
+     * @observable
+     * @default ''
+     */
+    fillColor: string;
+    /**
+     * When set true (default), all parts of the icon inherit the fill color from the CSS `color` property of the
+     * icon's DOM parent.
+     *
+     * This effectively makes the icon monochromatic and allows it to change its fill color dynamically, for instance,
+     * when a {@link module:ui/button/buttonview~ButtonView} displays an icon and it switches between different states
+     * (pushed, hovered, etc.) the icon will follow along.
+     *
+     * **Note**: For the monochromatic icon to render properly, it must be made up of shapes that can be filled
+     * with color instead of, for instance, paths with strokes. Be sure to use the *outline stroke* tool
+     * (the name could be different in your vector graphics editor) before exporting your icon. Also, remove any
+     * excess `fill="..."` attributes that could break the color inheritance.
+     *
+     * **Note**: If you want to preserve the original look of your icon and disable dynamic color inheritance,
+     * set this flag to `false`.
+     *
+     * @observable
+     * @default true
+     */
+    isColorInherited: boolean;
+    /**
+     * Controls whether the icon is visible.
+     *
+     * @observable
+     * @default true
+     */
+    isVisible: boolean;
+    /**
+     * A list of presentational attributes that can be set on the `<svg>` element and should be preserved
+     * when the icon {@link module:ui/icon/iconview~IconView#content content} is loaded.
+     *
+     * See the [specification](https://www.w3.org/TR/SVG/styling.html#TermPresentationAttribute) to learn more.
+     */
+    private static presentationalAttributeNames;
+    /**
+     * @inheritDoc
+     */
+    constructor();
+    /**
+     * @inheritDoc
+     */
+    render(): void;
+    /**
+     * Updates the {@link #element} with the value of {@link #content}.
+     */
+    private _updateXMLContent;
+    /**
+     * Fills all child `path.ck-icon__fill` with the `#fillColor`.
+     */
+    private _colorFillPaths;
+}

package/dist/types/iframe/iframeview.d.ts

@@ -0,0 +1,50 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/iframe/iframeview
+ */
+import View from '../view.js';
+import type { Locale } from '@ckeditor/ckeditor5-utils';
+/**
+ * The iframe view class.
+ *
+ * ```ts
+ * const iframe = new IframeView();
+ *
+ * iframe.render();
+ * document.body.appendChild( iframe.element );
+ *
+ * iframe.on( 'loaded', () => {
+ * 	console.log( 'The iframe has loaded', iframe.element.contentWindow );
+ * } );
+ *
+ * iframe.element.src = 'https://ckeditor.com';
+ * ```
+ */
+export default class IframeView extends View<HTMLIFrameElement> {
+    /**
+     * Creates a new instance of the iframe view.
+     *
+     * @param locale The locale instance.
+     */
+    constructor(locale?: Locale);
+    /**
+     * Renders the iframe's {@link #element} and returns a `Promise` for asynchronous
+     * child `contentDocument` loading process.
+     *
+     * @returns A promise which resolves once the iframe `contentDocument` has
+     * been {@link #event:loaded}.
+     */
+    render(): Promise<unknown>;
+}
+/**
+ * Fired when the DOM iframe's `contentDocument` finished loading.
+ *
+ * @eventName ~IframeView#loaded
+ */
+export type IframeViewLoadedEvent = {
+    name: 'loaded';
+    args: [];
+};

package/dist/types/index.d.ts

@@ -0,0 +1,74 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui
+ */
+export { default as View, type UIViewRenderEvent } from './view.js';
+export { default as clickOutsideHandler } from './bindings/clickoutsidehandler.js';
+export { default as injectCssTransitionDisabler } from './bindings/injectcsstransitiondisabler.js';
+export { default as CssTransitionDisablerMixin, type ViewWithCssTransitionDisabler } from './bindings/csstransitiondisablermixin.js';
+export { default as submitHandler } from './bindings/submithandler.js';
+export { default as addKeyboardHandlingForGrid } from './bindings/addkeyboardhandlingforgrid.js';
+export { default as AccessibilityHelp } from './editorui/accessibilityhelp/accessibilityhelp.js';
+export { default as BodyCollection } from './editorui/bodycollection.js';
+export { type ButtonExecuteEvent } from './button/button.js';
+export type { default as ButtonLabel } from './button/buttonlabel.js';
+export { default as ButtonView } from './button/buttonview.js';
+export { default as ButtonLabelView } from './button/buttonlabelview.js';
+export { default as SwitchButtonView } from './button/switchbuttonview.js';
+export { default as CollapsibleView } from './collapsible/collapsibleview.js';
+export * from './colorgrid/utils.js';
+export { default as ColorGridView, type ColorDefinition } from './colorgrid/colorgridview.js';
+export { default as ColorTileView } from './colorgrid/colortileview.js';
+export { default as ColorPickerView } from './colorpicker/colorpickerview.js';
+export type { ColorPickerConfig, ColorPickerViewConfig, ColorPickerOutputFormat } from './colorpicker/utils.js';
+export { default as ColorSelectorView, type ColorSelectorExecuteEvent, type ColorSelectorColorPickerCancelEvent, type ColorSelectorColorPickerShowEvent } from './colorselector/colorselectorview.js';
+export { default as ComponentFactory } from './componentfactory.js';
+export { default as Dialog } from './dialog/dialog.js';
+export { default as DialogView, DialogViewPosition, type DialogViewMoveToEvent } from './dialog/dialogview.js';
+export { default as DropdownView } from './dropdown/dropdownview.js';
+export { default as DropdownPanelView } from './dropdown/dropdownpanelview.js';
+export { default as DropdownButtonView } from './dropdown/button/dropdownbuttonview.js';
+export { default as SplitButtonView } from './dropdown/button/splitbuttonview.js';
+export * from './dropdown/utils.js';
+export { default as EditorUI, type EditorUIReadyEvent, type EditorUIUpdateEvent } from './editorui/editorui.js';
+export { default as EditorUIView } from './editorui/editoruiview.js';
+export { default as BoxedEditorUIView } from './editorui/boxed/boxededitoruiview.js';
+export { default as InlineEditableUIView } from './editableui/inline/inlineeditableuiview.js';
+export { default as FormHeaderView } from './formheader/formheaderview.js';
+export { default as FocusCycler, type FocusableView, type ViewWithFocusCycler, type FocusCyclerForwardCycleEvent, type FocusCyclerBackwardCycleEvent, isViewWithFocusCycler, isFocusable } from './focuscycler.js';
+export { default as IconView } from './icon/iconview.js';
+export { default as InputView } from './input/inputview.js';
+export { default as InputTextView } from './inputtext/inputtextview.js';
+export { default as InputNumberView } from './inputnumber/inputnumberview.js';
+export { default as TextareaView, type TextareaViewUpdateEvent } from './textarea/textareaview.js';
+export { default as IframeView } from './iframe/iframeview.js';
+export { default as LabelView } from './label/labelview.js';
+export { type LabeledFieldViewCreator, default as LabeledFieldView } from './labeledfield/labeledfieldview.js';
+export * from './labeledfield/utils.js';
+export { default as ListItemGroupView } from './list/listitemgroupview.js';
+export { default as ListItemView } from './list/listitemview.js';
+export { default as ListView } from './list/listview.js';
+export { default as Notification } from './notification/notification.js';
+export { default as ViewModel } from './model.js';
+export { default as BalloonPanelView } from './panel/balloon/balloonpanelview.js';
+export { default as ContextualBalloon } from './panel/balloon/contextualballoon.js';
+export { default as StickyPanelView } from './panel/sticky/stickypanelview.js';
+export { default as AutocompleteView, type AutocompleteViewConfig, type AutocompleteResultsView } from './autocomplete/autocompleteview.js';
+export { default as SearchTextView, type SearchTextViewSearchEvent, type SearchTextViewConfig } from './search/text/searchtextview.js';
+export { default as SearchInfoView } from './search/searchinfoview.js';
+export type { default as FilteredView, FilteredViewExecuteEvent } from './search/filteredview.js';
+export { default as HighlightedTextView } from './highlightedtext/highlightedtextview.js';
+export { default as TooltipManager } from './tooltipmanager.js';
+export { default as Template, type TemplateDefinition } from './template.js';
+export { default as SpinnerView } from './spinner/spinnerview.js';
+export { default as ToolbarView } from './toolbar/toolbarview.js';
+export { default as ToolbarLineBreakView } from './toolbar/toolbarlinebreakview.js';
+export { default as ToolbarSeparatorView } from './toolbar/toolbarseparatorview.js';
+export { default as normalizeToolbarConfig } from './toolbar/normalizetoolbarconfig.js';
+export { default as BalloonToolbar, type BalloonToolbarShowEvent } from './toolbar/balloon/balloontoolbar.js';
+export { default as BlockToolbar } from './toolbar/block/blocktoolbar.js';
+export { default as ViewCollection } from './viewcollection.js';
+import './augmentation.js';

package/dist/types/input/inputbase.d.ts

@@ -0,0 +1,107 @@
+/**
+ * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module ui/input/inputbase
+ */
+import View from '../view.js';
+import { FocusTracker, type Locale } from '@ckeditor/ckeditor5-utils';
+/**
+ * The base input view class.
+ */
+export default abstract class InputBase<TElement extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement> extends View<TElement> {
+    /**
+     * Stores information about the editor UI focus and propagates it so various plugins and components
+     * are unified as a focus group.
+     */
+    readonly focusTracker: FocusTracker;
+    /**
+     * The value of the input.
+     *
+     * @observable
+     */
+    value: string | undefined;
+    /**
+     * The `id` attribute of the input (i.e. to pair with a `<label>` element).
+     *
+     * @observable
+     */
+    id: string | undefined;
+    /**
+     * The `placeholder` attribute of the input.
+     *
+     * @observable
+     */
+    placeholder: string | undefined;
+    /**
+     * Controls whether the input view is in read-only mode.
+     *
+     * @observable
+     */
+    isReadOnly: boolean;
+    /**
+     * Set to `true` when the field has some error. Usually controlled via
+     * {@link module:ui/labeledinput/labeledinputview~LabeledInputView#errorText}.
+     *
+     * @observable
+     */
+    hasError: boolean;
+    /**
+     * The `id` of the element describing this field, e.g. when it has
+     * some error; it helps screen readers read the error text.
+     *
+     * @observable
+     */
+    ariaDescribedById: string | undefined;
+    /**
+     * An observable flag set to `true` when the input is currently focused by the user.
+     * Set to `false` otherwise.
+     *
+     * @readonly
+     * @observable
+     * @default false
+     */
+    isFocused: boolean;
+    /**
+     * An observable flag set to `true` when the input contains no text, i.e.
+     * when {@link #value} is `''`, `null`, or `false`.
+     *
+     * @readonly
+     * @observable
+     * @default true
+     */
+    isEmpty: boolean;
+    /**
+     * @inheritDoc
+     */
+    constructor(locale?: Locale);
+    /**
+     * @inheritDoc
+     */
+    render(): void;
+    /**
+     * @inheritDoc
+     */
+    destroy(): void;
+    /**
+     * Moves the focus to the input and selects the value.
+     */
+    select(): void;
+    /**
+     * Focuses the input.
+     */
+    focus(): void;
+    /**
+     * Resets the value of the input
+     */
+    reset(): void;
+    /**
+     * Updates the {@link #isEmpty} property value on demand.
+     */
+    protected _updateIsEmpty(): void;
+    /**
+     * Sets the `value` property of the {@link #element DOM element} on demand.
+     */
+    private _setDomElementValue;
+}