/*!
*
* Wijmo Library 5.20251.40
* https://developer.mescius.com/wijmo
*
* Copyright(c) MESCIUS inc. All rights reserved.
*
* Licensed under the End-User License Agreement For MESCIUS Wijmo Software.
* us.sales@mescius.com
* https://developer.mescius.com/wijmo/licensing
*
*/
/**
* {@module wijmo.knockout.input}
* KnockoutJS bindings for wijmo.input module
*/
/**
*
*/
export declare var ___keepComment: any;
import { WjBinding, WjContext } from 'wijmo/wijmo.knockout.base';
export declare class WjDropDownBinding extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link ComboBox} control.
*
* Use the {@link wjComboBox} binding to add {@link ComboBox} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a ComboBox control:</p>
* <div data-bind="wjComboBox: {
* itemsSource: countries,
* text: theCountry,
* isEditable: false,
* placeholder: 'country' }">
* </div>
*
* The wjComboBox binding supports all read-write properties and events of
* the {@link ComboBox} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - selectedIndex
* - selectedItem
* - selectedValue
*
*/
export declare class wjComboBox extends WjDropDownBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link AutoComplete} control.
*
* Use the {@link wjAutoComplete} binding to add {@link AutoComplete} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is an AutoComplete control:</p>
* <div data-bind="wjAutoComplete: {
* itemsSource: countries,
* text: theCountry,
* isEditable: false,
* placeholder: 'country' }">
* </div>
*
* The wjAutoComplete binding supports all read-write properties and events of
* the {@link AutoComplete} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - selectedIndex
* - selectedItem
* - selectedValue
*
*/
export declare class wjAutoComplete extends wjComboBox {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link Calendar} control.
*
* Use the {@link wjCalendar} binding to add {@link Calendar} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a Calendar control:</p>
* <div
* data-bind="wjCalendar: { value: theDate }">
* </div>
*
* The wjCalendar binding supports all read-write properties and events of
* the {@link Calendar} control. The following properties provide two-way binding mode:
*
*/
export declare class wjCalendar extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link ColorPicker} control.
*
* Use the {@link wjColorPicker} binding to add {@link ColorPicker} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a ColorPicker control:</p>
* <div
* data-bind="wjColorPicker: { value: theColor }">
* </div>
*
* The wjColorPicker binding supports all read-write properties and events of
* the {@link ColorPicker} control. The following properties provide two-way binding mode:
*
*/
export declare class wjColorPicker extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link ListBox} control.
*
* Use the {@link wjListBox} binding to add {@link ListBox} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a ListBox control:</p>
* <div data-bind="wjListBox: {
* itemsSource: countries,
* selectedItem: theCountry }">
* </div>
*
* The wjListBox binding supports all read-write properties and events of
* the {@link ListBox} control. The following properties provide two-way binding mode:
*
* - selectedIndex
* - selectedItem
* - selectedValue
*
*/
export declare class wjListBox extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link Menu} control.
*
* Use the {@link wjMenu} binding to add {@link Menu} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a Menu control used as a value picker:</p>
* <div data-bind="wjMenu: { value: tax, header: 'Tax' }">
* <span data-bind="wjMenuItem: { value: 0 }">Exempt</span>
* <span data-bind="wjMenuSeparator: {}"></span>
* <span data-bind="wjMenuItem: { value: .05 }">5%</span>
* <span data-bind="wjMenuItem: { value: .1 }">10%</span>
* <span data-bind="wjMenuItem: { value: .15 }">15%</span>
* </div>
*
* The wjMenu binding may contain the following child bindings: {@link wjMenuItem}, {@link wjMenuSeparator}.
*
* The wjMenu binding supports all read-write properties and events of
* the {@link Menu} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - selectedIndex
* - selectedItem
* - selectedValue
* - value
*
*/
export declare class wjMenu extends wjComboBox {
_getControlConstructor(): any;
_createWijmoContext(): WjContext;
_initialize(): void;
private _updateControlValue;
}
export declare class WjMenuContext extends WjContext {
_initControl(): void;
_childrenInitialized(): void;
_updateHeader(): void;
}
/**
* KnockoutJS binding for menu items.
*
* Use the {@link wjMenuItem} binding to add menu items to a {@link Menu} control.
* The {@link wjMenuItem} binding must be contained in a {@link wjMenu} binding.
* For example:
*
* <p>Here is a Menu control with four menu items:</p>
* <div data-bind="wjMenu: { value: tax, header: 'Tax' }">
* <span data-bind="wjMenuItem: { value: 0 }">Exempt</span>
* <span data-bind="wjMenuItem: { value: .05 }">5%</span>
* <span data-bind="wjMenuItem: { value: .1 }">10%</span>
* <span data-bind="wjMenuItem: { value: .15 }">15%</span>
* </div>
*
* The wjMenuItem binding supports the following attributes:
*
*
* - cmd
- Function to execute in the controller when the item is clicked.
* - cmdParam
- Parameter passed to the cmd function when the item is clicked.
* - value
- Value selected when the item is clicked (use either this or cmd).
*
*/
export declare class wjMenuItem extends WjBinding {
_getMetaDataId(): any;
_createWijmoContext(): WjContext;
_initialize(): void;
}
export declare class WjMenuItemContext extends WjContext {
_createControl(): any;
}
/**
* KnockoutJS binding for menu separators.
*
* The the {@link wjMenuSeparator} adds a non-selectable separator to a {@link Menu} control, and has no attributes.
* It must be contained in a {@link wjMenu} binding. For example:
*
* <p>Here is a Menu control with four menu items and one separator:</p>
* <div data-bind="wjMenu: { value: tax, header: 'Tax' }">
* <span data-bind="wjMenuItem: { value: 0 }">Exempt</span>
* <span data-bind="wjMenuSeparator: {}"></span>
* <span data-bind="wjMenuItem: { value: .05 }">5%</span>
* <span data-bind="wjMenuItem: { value: .1 }">10%</span>
* <span data-bind="wjMenuItem: { value: .15 }">15%</span>
* </div>
*/
export declare class wjMenuSeparator extends WjBinding {
_getMetaDataId(): any;
_initialize(): void;
_createControl(element: any): any;
}
/**
* KnockoutJS binding for context menus.
*
* Use the {@link wjContextMenu} binding to add context menus to elements
* on the page. The {@link wjContextMenu} binding is based on the {@link wjMenu};
* it displays a popup menu when the user performs a context menu
* request on an element (usually a right-click).
*
* The wjContextMenu binding is specified as a parameter added to the
* element that the context menu applies to. The parameter value is a
* CSS selector for the element that contains the menu. For example:
*
* <!-- paragraph with a context menu -->
*<p data-bind="wjContextMenu: { id: '#idMenu'}" >
* This paragraph has a context menu.</p>
*
*<!-- define the context menu (hidden and with an id) -->
* <div id="contextmenu" data-bind="wjMenu: { header: 'File', itemClicked: menuItemClicked}">
* <span data-bind="wjMenuItem: {}">New</span>
* <span data-bind="wjMenuItem: {}">open an existing file or folder</span>
* <span data-bind="wjMenuItem: {}">save the current file</span>
* <span data-bind="wjMenuSeparator: {}"></span>
* <span data-bind="wjMenuItem: {}">exit the application</span>
* </div>
*/
export declare class wjContextMenu extends WjBinding {
_getMetaDataId(): any;
_createControl(element: any): any;
_createWijmoContext(): WjContext;
}
export declare class WjContextMenuContext extends WjContext {
_initControl(): void;
}
/**
* KnockoutJS binding for the {@link InputDate} control.
*
* Use the {@link wjInputDate} binding to add {@link InputDate} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is an InputDate control:</p>
* <div data-bind="wjInputDate: {
* value: theDate,
* format: 'M/d/yyyy' }">
* </div>
*
* The wjInputDate binding supports all read-write properties and events of
* the {@link InputDate} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - value
*
*/
export declare class wjInputDate extends WjDropDownBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link InputDateTime} control.
*
* Use the {@link wjInputDateTime} binding to add {@link InputDateTime} controls to your
* KnockoutJS applications.
*
* The wjInputDateTime binding supports all read-write properties and events of
* the {@link InputDateTime} control.
*/
export declare class wjInputDateTime extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link InputNumber} control.
*
* Use the {@link wjInputNumber} binding to add {@link InputNumber} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is an InputNumber control:</p>
* <div data-bind="wjInputNumber: {
* value: theNumber,
* min: 0,
* max: 10,
* format: 'n0',
* placeholder: 'number between zero and ten' }">
* </div>
*
* The wjInputNumber binding supports all read-write properties and events of
* the {@link InputNumber} control. The following properties provide two-way binding mode:
*
*/
export declare class wjInputNumber extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link InputMask} control.
*
* Use the {@link wjInputMask} binding to add {@link InputMask} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is an InputMask control:</p>
* <div data-bind="wjInputMask: {
* mask: '99/99/99',
* promptChar: '*' }">
* </div>
*
* The wjInputMask binding supports all read-write properties and events of
* the {@link InputMask} control. The value property provides two-way binding mode.
*/
export declare class wjInputMask extends WjBinding {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link InputTime} control.
*
* Use the {@link wjInputTime} binding to add {@link InputTime} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is an InputTime control:</p>
* <div data-bind="wjInputTime: {
* min: new Date(2014, 8, 1, 9, 0),
* max: new Date(2014, 8, 1, 17, 0),
* step: 15,
* format: 'h:mm tt',
* value: theDate }">
* </div>
*
* The wjInputTime binding supports all read-write properties and events of
* the {@link InputTime} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - selectedIndex
* - selectedItem
* - selectedValue
* - value
*
*/
export declare class wjInputTime extends wjComboBox {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link InputColor} control.
*
* Use the {@link wjInputColor} binding to add {@link InputColor} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a InputColor control:</p>
* <div
* data-bind="wjInputColor: { value: theColor }">
* </div>
*
* The wjInputColor binding supports all read-write properties and events of
* the {@link InputColor} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - value
*
*/
export declare class wjInputColor extends WjDropDownBinding {
_getControlConstructor(): any;
}
export declare class WjCollectionViewBaseBinding extends WjBinding {
_createControl(element: any): any;
_createWijmoContext(): WjContext;
_getTemplate(): string;
}
export declare class WjCollectionViewContext extends WjContext {
private _localVM;
private _emptyCV;
init(element: any, valueAccessor: () => any, allBindings: any, viewModel: any, bindingContext: any): any;
update(element: any, valueAccessor: () => any, allBindings: any, viewModel: any, bindingContext: any): void;
private _subscribeToCV;
private _unsubscribeFromCV;
private _forceBindingsUpdate;
}
/**
* KnockoutJS binding for an {@link ICollectionView} pager element.
*
* Use the {@link wjCollectionViewPager} directive to add an element that allows users to
* navigate through the pages in a paged {@link ICollectionView}. For example:
*
* Here is a CollectionViewPager:</p>
* <div
* data-bind="wjCollectionViewPager: { cv: myCollectionView }">
* </div>
*
* The {@link wjCollectionViewPager} directive has a single attribute:
*
*
* - cv
- Reference to the paged {@link ICollectionView} object to navigate.
*
*/
export declare class wjCollectionViewPager extends WjCollectionViewBaseBinding {
_getMetaDataId(): any;
_getTemplate(): string;
}
/**
* KnockoutJS binding for an {@link ICollectionView} navigator element.
*
* Use the {@link wjCollectionViewNavigator} directive to add an element that allows users to
* navigate through the items in an {@link ICollectionView}. For example:
*
* Here is a CollectionViewNavigator:</p>
* <div
* data-bind="wjCollectionViewNavigator: { cv: myCollectionView }">
* </div>
*
* The {@link wjCollectionViewNavigator} directive has a single attribute:
*
*
* - cv
- Reference to the {@link ICollectionView} object to navigate.
*
*/
export declare class wjCollectionViewNavigator extends WjCollectionViewBaseBinding {
_getMetaDataId(): any;
_getTemplate(): string;
}
/**
* KnockoutJS binding for the {@link MultiSelect} control.
*
* Use the {@link wjMultiSelect} binding to add {@link MultiSelect} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a MultiSelect control:</p>
* <div data-bind="MultiSelect: {
* itemsSource: countries,
* isEditable: false,
* headerFormat: '{count} countries selected' }">
* </div>
*
* The wjMultiSelect binding supports all read-write properties and events of
* the {@link MultiSelect} control. The following properties provide two-way binding mode:
*
* - isDroppedDown
* - text
* - selectedIndex
* - selectedItem
* - selectedValue
*
*/
export declare class wjMultiSelect extends wjComboBox {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link MultiAutoComplete} control.
*
* Use the {@link wjMultiAutoComplete} binding to add {@link MultiAutoComplete} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a MultiAutoComplete control:</p>
* <div data-bind="MultiAutoComplete: {
* itemsSource: countries,
* maxSelectedItems: 4,}">
* </div>
*
* The wjMultiAutoComplete binding supports all read-write properties and events of
* the {@link MultiAutoComplete} control.
*/
export declare class wjMultiAutoComplete extends wjAutoComplete {
_getControlConstructor(): any;
}
/**
* KnockoutJS binding for the {@link Popup} control.
*
* Use the {@link wjPopup} binding to add {@link Popup} controls to your
* KnockoutJS applications. For example:
*
* <p>Here is a Popup control triggered by a button:</p>
* <button id="btn2" type="button">
* Click to show Popup
* </button>
* <div class="popover" data-bind="wjPopup: {
* control: popup,
* owner: '#btn2',
* showTrigger: 'Click',
* hideTrigger: 'Click'}"
* >
* <h3>
* Salutation
* </h3>
* <div class="popover-content">
* Hello {{firstName}} {{lastName}}
* </div>
* </div>
*/
export declare class wjPopup extends WjBinding {
_getControlConstructor(): any;
_createWijmoContext(): WjContext;
_initialize(): void;
}
export declare class WjPopupContext extends WjContext {
_initControl(): void;
_updateModal(convertedValue: any): void;
}