fit-ui 2.5.4 → 2.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fit-ui",
-  "version": "2.5.4",
+  "version": "2.6.0",
   "title": "Fit.UI",
   "description": "Object Oriented framework for building rich User Interfaces",
   "main": "dist/Fit.UI.js",

package/types/index.d.ts

@@ -2836,6 +2836,15 @@ declare namespace Fit
 			*/
 			public RenameSelection(val:string, newTitle:string):void;
 			/**
+			* Clear input and display "Search.." placeholder when control receives focus.
+			If SearchModeOnFocus is enabled, InputEnabled will also be enabled. Disabling
+			SearchModeOnFocus does not disable InputEnabled.
+			* @function SearchModeOnFocus
+			* @param {boolean} [val=undefined] - If defined, True enables search mode on focus, False disables it.
+			* @returns boolean
+			*/
+			public SearchModeOnFocus(val?:boolean):boolean;
+			/**
 			* Get/set value indicating whether control allow user to toggle Selection Mode (Visual or Text).
 			* @function SelectionModeToggle
 			* @param {boolean} [val=undefined] - If defined, True enables toggle button, False disables it.
@@ -3776,9 +3785,10 @@ declare namespace Fit
 			Notice that this control type requires dimensions (Width/Height) to be specified in pixels.
 			* @function DesignMode
 			* @param {boolean} [val=undefined] - If defined, True enables Design Mode, False disables it.
+			* @param {Fit.Controls.InputTypeDefs.DesignModeConfig} [editorConfig=undefined] - If provided and DesignMode is enabled, configuration is applied when editor is created.
 			* @returns boolean
 			*/
-			public DesignMode(val?:boolean):boolean;
+			public DesignMode(val?:boolean, editorConfig?:Fit.Controls.InputTypeDefs.DesignModeConfig):boolean;
 			/**
 			* Create instance of Input control.
 			* @function Input
@@ -4082,6 +4092,398 @@ declare namespace Fit
 			public Render(toElement?:HTMLElement):void;
 		}
 		/**
+		* 
+		* @namespace [Fit.Controls.InputTypeDefs InputTypeDefs]
+		*/
+		namespace InputTypeDefs
+		{
+			// Functions defined by Fit.Controls.InputTypeDefs
+			/**
+			* Cancelable request event handler.
+			* @callback DesignModeTagsOnRequest
+			* @param {Fit.Controls.Input} sender - Instance of control.
+			* @param {Fit.Controls.InputTypeDefs.DesignModeTagsOnRequestEventHandlerArgs} eventArgs - Event arguments.
+			* @returns boolean | void
+			*/
+			type DesignModeTagsOnRequest = (sender:Fit.Controls.Input, eventArgs:Fit.Controls.InputTypeDefs.DesignModeTagsOnRequestEventHandlerArgs) => boolean | void;
+			/**
+			* Response event handler.
+			* @callback DesignModeTagsOnResponse
+			* @param {Fit.Controls.Input} sender - Instance of control.
+			* @param {Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseEventHandlerArgs} eventArgs - Event arguments.
+			*/
+			type DesignModeTagsOnResponse = (sender:Fit.Controls.Input, eventArgs:Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseEventHandlerArgs) => void;
+			/**
+			* Function producing JSON object representing tag to be inserted into editor.
+			Returning nothing or Null results in default tag being inserted into editor.
+			* @callback DesignModeTagsTagCreator
+			* @param {Fit.Controls.Input} sender - Instance of control.
+			* @param {Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorCallbackArgs} eventArgs - Event arguments.
+			* @returns Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorReturnType | null | void
+			*/
+			type DesignModeTagsTagCreator = (sender:Fit.Controls.Input, eventArgs:Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorCallbackArgs) => Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorReturnType | null | void;
+			/**
+			* Configuration for DesignMode.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfig DesignModeConfig]
+			*/
+			class DesignModeConfig
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfig
+				/**
+				* Information panel configuration.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeConfigInfoPanel} [InfoPanel=undefined]
+				*/
+				InfoPanel?:Fit.Controls.InputTypeDefs.DesignModeConfigInfoPanel;
+				/**
+				* Plugins configuration.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeConfigPlugins} [Plugins=undefined]
+				*/
+				Plugins?:Fit.Controls.InputTypeDefs.DesignModeConfigPlugins;
+				/**
+				* Tags configuration.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeConfigTags} [Tags=undefined]
+				*/
+				Tags?:Fit.Controls.InputTypeDefs.DesignModeConfigTags;
+				/**
+				* Toolbar configuration.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeConfigToolbar} [Toolbar=undefined]
+				*/
+				Toolbar?:Fit.Controls.InputTypeDefs.DesignModeConfigToolbar;
+			}
+			/**
+			* Information panel at the bottom of the editor.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfigInfoPanel DesignModeConfigInfoPanel]
+			*/
+			class DesignModeConfigInfoPanel
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfigInfoPanel
+				/**
+				* Text alignment - defaults to Center.
+				* @member {'Left' | 'Center' | 'Right'} [Alignment=undefined]
+				*/
+				Alignment?:'Left' | 'Center' | 'Right';
+				/**
+				* Text to display.
+				* @member {string} [Text=undefined]
+				*/
+				Text?:string;
+			}
+			/**
+			* Additional plugins enabled in DesignMode.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfigPlugins DesignModeConfigPlugins]
+			*/
+			class DesignModeConfigPlugins
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfigPlugins
+				/**
+				* Plugin(s) related to emoji support (defaults to False).
+				* @member {boolean} [Emojis=undefined]
+				*/
+				Emojis?:boolean;
+				/**
+				* Plugin(s) related to support for images (defaults to False).
+				* @member {Fit.Controls.InputTypeDefs.DesignModeConfigPluginsImagesConfig} [Images=undefined]
+				*/
+				Images?:Fit.Controls.InputTypeDefs.DesignModeConfigPluginsImagesConfig;
+			}
+			/**
+			* Configuration for image plugins.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfigPluginsImagesConfig DesignModeConfigPluginsImagesConfig]
+			*/
+			class DesignModeConfigPluginsImagesConfig
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfigPluginsImagesConfig
+				/**
+				* How to store and embed images. Base64 is persistent while blob (default) is temporary
+				and must be extracted from memory and uploaded/stored to be permanantly persisted.
+				References to blobs can be parsed from the HTML value produced by the editor.
+				* @member {'base64' | 'blob'} [EmbedType=undefined]
+				*/
+				EmbedType?:'base64' | 'blob';
+				/**
+				* Flag indicating whether to enable image plugins or not (defaults to False).
+				* @member {boolean} Enabled
+				*/
+				Enabled:boolean;
+				/**
+				* This option is in effect when EmbedType is blob.
+				Dispose images from blob storage (revoke blob URLs) added though image plugins when control is disposed.
+				If "UnreferencedOnly" is specified, the component using Fit.UI's input control will be responsible for
+				disposing referenced blobs. Failing to do so may cause a memory leak. Defaults to All.
+				* @member {'All' | 'UnreferencedOnly'} [RevokeBlobUrlsOnDispose=undefined]
+				*/
+				RevokeBlobUrlsOnDispose?:'All' | 'UnreferencedOnly';
+				/**
+				* This option is in effect when EmbedType is blob.
+				Dispose images from blob storage (revoke blob URLs) added through Value(..)
+				function when control is disposed. Basically ownership of these blobs are handed
+				over to the control for the duration of its life time.
+				These images are furthermore subject to the rule set in RevokeBlobUrlsOnDispose.
+				Defaults to False.
+				* @member {boolean} [RevokeExternalBlobUrlsOnDispose=undefined]
+				*/
+				RevokeExternalBlobUrlsOnDispose?:boolean;
+			}
+			/**
+			* Configuration for tags in DesignMode.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfigTags DesignModeConfigTags]
+			*/
+			class DesignModeConfigTags
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfigTags
+				/**
+				* Name of URL parameter receiving name of JSONP callback function (only for JSONP services).
+				* @member {string} [JsonpCallback=undefined]
+				*/
+				JsonpCallback?:string;
+				/**
+				* Number of milliseconds to allow JSONP request to wait for a response before aborting (only for JSONP services).
+				* @member {number} [JsonpTimeout=undefined]
+				*/
+				JsonpTimeout?:number;
+				/**
+				* Event handler invoked when tags are requested. Request may be canceled by returning False.
+				Function receives two arguments:
+				Sender (Fit.Controls.Input) and EventArgs object.
+				EventArgs object contains the following properties:
+				- Sender: Fit.Controls.Input instance
+				- Request: Fit.Http.JsonpRequest or Fit.Http.JsonRequest instance
+				- Query: Contains query information in its Marker and Query property.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeTagsOnRequest} [OnRequest=undefined]
+				*/
+				OnRequest?:Fit.Controls.InputTypeDefs.DesignModeTagsOnRequest;
+				/**
+				* Event handler invoked when tags data is received, allowing for data transformation.
+				Function receives two arguments:
+				Sender (Fit.Controls.Input) and EventArgs object.
+				EventArgs object contains the following properties:
+				- Sender: Fit.Controls.Input instance
+				- Request: Fit.Http.JsonpRequest or Fit.Http.JsonRequest instance
+				- Query: Contains query information in its Marker and Query property
+				- Tags: JSON tags array received from WebService.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeTagsOnResponse} [OnResponse=undefined]
+				*/
+				OnResponse?:Fit.Controls.InputTypeDefs.DesignModeTagsOnResponse;
+				/**
+				* URL to request data from. Endpoint receives the following payload:
+				{ Marker: "@", Query: "search" }
+				
+				Data is expected to be returned in the following format:
+				[
+				{ Value: "t-1", Title: "Tag 1", Icon: "images/img1.jpeg", Url: "show/1", Data: "..." },
+				{ Value: "t-2", Title: "Tag 2", Icon: "images/img2.jpeg", Url: "show/2", Data: "..." }, ...
+				]
+				
+				The Value and Title properties are required. The Icon property is optional and must specify the path to an image.
+				The Url property is optional and must specify a path to a related page/resource.
+				The Data property is optional and allows for additional data to be associated with the tag.
+				To hold multiple values, consider using a base64 encoded JSON object:
+				btoa(JSON.stringify({ creationDate: new Date(), active: true }))
+				
+				The data eventuelly results in a tag being added to the editor with the following format:
+				Tag name 1
+				The data-tag-data attribute is only declared if the corresponding Data property is defined in data.
+				* @member {string} QueryUrl
+				*/
+				QueryUrl:string;
+				/**
+				* Callback invoked when a tag is being inserted into editor, allowing
+				for customization to the title and attributes associated with the tag.
+				Function receives two arguments:
+				Sender (Fit.Controls.Input) and EventArgs object.
+				EventArgs object contains the following properties:
+				- Sender: Fit.Controls.Input instance
+				- QueryMarker: String containing query marker
+				- Tag: JSON tag received from WebService.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeTagsTagCreator} [TagCreator=undefined]
+				*/
+				TagCreator?:Fit.Controls.InputTypeDefs.DesignModeTagsTagCreator;
+				/**
+				* Markers triggering tags request and context menu.
+				* @member {{ Marker: string, MinimumCharacters?: number, DebounceQuery?: number }[]} Triggers
+				*/
+				Triggers:{ Marker: string, MinimumCharacters?: number, DebounceQuery?: number }[];
+			}
+			/**
+			* Toolbar buttons enabled in DesignMode.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeConfigToolbar DesignModeConfigToolbar]
+			*/
+			class DesignModeConfigToolbar
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeConfigToolbar
+				/**
+				* Enable emoji button (defaults to False).
+				* @member {boolean} [Emojis=undefined]
+				*/
+				Emojis?:boolean;
+				/**
+				* Enable text formatting (bold, italic, underline) (defaults to True).
+				* @member {boolean} [Formatting=undefined]
+				*/
+				Formatting?:boolean;
+				/**
+				* Enable image button (defaults to false).
+				* @member {boolean} [Images=undefined]
+				*/
+				Images?:boolean;
+				/**
+				* Enable text alignment (defaults to True).
+				* @member {boolean} [Justify=undefined]
+				*/
+				Justify?:boolean;
+				/**
+				* Enable links (defaults to True).
+				* @member {boolean} [Links=undefined]
+				*/
+				Links?:boolean;
+				/**
+				* Enable ordered and unordered lists with indentation (defaults to True).
+				* @member {boolean} [Lists=undefined]
+				*/
+				Lists?:boolean;
+			}
+			/**
+			* Request handler event arguments.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeTagsOnRequestEventHandlerArgs DesignModeTagsOnRequestEventHandlerArgs]
+			*/
+			class DesignModeTagsOnRequestEventHandlerArgs
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeTagsOnRequestEventHandlerArgs
+				/**
+				* Query information.
+				* @member {{ Marker: string, Query: string }} Query
+				*/
+				Query:{ Marker: string, Query: string };
+				/**
+				* Instance of JsonRequest or JsonpRequest.
+				* @member {Fit.Http.JsonRequest | Fit.Http.JsonpRequest} Request
+				*/
+				Request:Fit.Http.JsonRequest | Fit.Http.JsonpRequest;
+				/**
+				* Instance of control.
+				* @member {Fit.Controls.Input} Sender
+				*/
+				Sender:Fit.Controls.Input;
+			}
+			/**
+			* Response handler event arguments.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseEventHandlerArgs DesignModeTagsOnResponseEventHandlerArgs]
+			*/
+			class DesignModeTagsOnResponseEventHandlerArgs
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseEventHandlerArgs
+				/**
+				* Query information.
+				* @member {{ Marker: string, Query: string }} Query
+				*/
+				Query:{ Marker: string, Query: string };
+				/**
+				* Instance of JsonRequest or JsonpRequest.
+				* @member {Fit.Http.JsonRequest | Fit.Http.JsonpRequest} Request
+				*/
+				Request:Fit.Http.JsonRequest | Fit.Http.JsonpRequest;
+				/**
+				* Instance of control.
+				* @member {Fit.Controls.Input} Sender
+				*/
+				Sender:Fit.Controls.Input;
+				/**
+				* Tags received from WebService.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag[]} Tags
+				*/
+				Tags:Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag[];
+			}
+			/**
+			* JSON object representing tag.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag DesignModeTagsOnResponseJsonTag]
+			*/
+			class DesignModeTagsOnResponseJsonTag
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag
+				/**
+				* Optional data to associate with tag.
+				* @member {string} [Data=undefined]
+				*/
+				Data?:string;
+				/**
+				* Optional URL to icon/image.
+				* @member {string} [Icon=undefined]
+				*/
+				Icon?:string;
+				/**
+				* Title.
+				* @member {string} Title
+				*/
+				Title:string;
+				/**
+				* Optional URL to associate with tag.
+				* @member {string} [Url=undefined]
+				*/
+				Url?:string;
+				/**
+				* Unique value.
+				* @member {string} Value
+				*/
+				Value:string;
+			}
+			/**
+			* TagCreator event arguments.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorCallbackArgs DesignModeTagsTagCreatorCallbackArgs]
+			*/
+			class DesignModeTagsTagCreatorCallbackArgs
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorCallbackArgs
+				/**
+				* Query marker.
+				* @member {string} QueryMarker
+				*/
+				QueryMarker:string;
+				/**
+				* Instance of control.
+				* @member {Fit.Controls.Input} Sender
+				*/
+				Sender:Fit.Controls.Input;
+				/**
+				* Tag received from WebService.
+				* @member {Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag} Tag
+				*/
+				Tag:Fit.Controls.InputTypeDefs.DesignModeTagsOnResponseJsonTag;
+			}
+			/**
+			* JSON object representing tag to be inserted into editor.
+			* @class [Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorReturnType DesignModeTagsTagCreatorReturnType]
+			*/
+			class DesignModeTagsTagCreatorReturnType
+			{
+				// Properties defined by Fit.Controls.InputTypeDefs.DesignModeTagsTagCreatorReturnType
+				/**
+				* Optional tag data.
+				* @member {string} [Data=undefined]
+				*/
+				Data?:string;
+				/**
+				* Tag title.
+				* @member {string} Title
+				*/
+				Title:string;
+				/**
+				* Tag type (marker).
+				* @member {string} Type
+				*/
+				Type:string;
+				/**
+				* Optional tag URL.
+				* @member {string} [Url=undefined]
+				*/
+				Url?:string;
+				/**
+				* Tag value (ID).
+				* @member {string} Value
+				*/
+				Value:string;
+			}
+		}
+		/**
 		* Picker control which allows for entries
 		to be selected in the DropDown control.
 		* @class [Fit.Controls.ListView ListView]
@@ -6350,6 +6752,15 @@ declare namespace Fit
 			*/
 			public RenameSelection(val:string, newTitle:string):void;
 			/**
+			* Clear input and display "Search.." placeholder when control receives focus.
+			If SearchModeOnFocus is enabled, InputEnabled will also be enabled. Disabling
+			SearchModeOnFocus does not disable InputEnabled.
+			* @function SearchModeOnFocus
+			* @param {boolean} [val=undefined] - If defined, True enables search mode on focus, False disables it.
+			* @returns boolean
+			*/
+			public SearchModeOnFocus(val?:boolean):boolean;
+			/**
 			* Get/set value indicating whether control allow user to toggle Selection Mode (Visual or Text).
 			* @function SelectionModeToggle
 			* @param {boolean} [val=undefined] - If defined, True enables toggle button, False disables it.
@@ -10451,31 +10862,6 @@ declare namespace Fit
 			*/
 			namespace Input
 			{
-				/**
-				* Internal settings related to blob storage management in HTML Editor (Design Mode).
-				* @class [Fit._internal.Controls.Input.BlobManager BlobManager]
-				*/
-				class BlobManager
-				{
-					// Properties defined by Fit._internal.Controls.Input.BlobManager
-					/**
-					* Dispose images from blob storage (revoke blob URLs) added though image plugins when control is disposed.
-					If "UnreferencedOnly" is specified, the component using Fit.UI's input control will be responsible for
-					disposing referenced blobs. Failing to do so may cause a memory leak.
-					* @member {'All' | 'UnreferencedOnly'} RevokeBlobUrlsOnDispose
-					* @static
-					*/
-					static RevokeBlobUrlsOnDispose:'All' | 'UnreferencedOnly';
-					/**
-					* Dispose images from blob storage (revoke blob URLs) added through Value(..)
-					function when control is disposed. Basically ownership of these blobs are handed
-					over to the control for the duration of its life time.
-					These images are furthermore subject to the rule set in RevokeBlobUrlsOnDispose.
-					* @member {boolean} RevokeExternalBlobUrlsOnDispose
-					* @static
-					*/
-					static RevokeExternalBlobUrlsOnDispose:boolean;
-				}
 				/**
 				* Internal settings related to HTML Editor (Design Mode).
 				* @class [Fit._internal.Controls.Input.Editor Editor]
@@ -10484,23 +10870,11 @@ declare namespace Fit
 				{
 					// Properties defined by Fit._internal.Controls.Input.Editor
 					/**
-					* Additional plugins used with DesignMode.
-					* @member {('justify' | 'pastefromword' | 'resize' | 'base64image' | 'base64imagepaste' | 'dragresize')[]} Plugins
-					* @static
-					*/
-					static Plugins:('justify' | 'pastefromword' | 'resize' | 'base64image' | 'base64imagepaste' | 'dragresize')[];
-					/**
 					* Skin used with DesignMode - must be set before an editor is created and cannot be changed for each individual control.
 					* @member {'bootstrapck' | 'moono-lisa' | null} Skin
 					* @static
 					*/
 					static Skin:'bootstrapck' | 'moono-lisa' | null;
-					/**
-					* Toolbar buttons used with DesignMode - make sure necessary plugins are loaded (see Fit._internal.Controls.Input.EditorPlugins).
-					* @member {( { name: 'BasicFormatting', items: ('Bold' | 'Italic' | 'Underline')[] } | { name: 'Justify', items: ('JustifyLeft' | 'JustifyCenter' | 'JustifyRight')[] } | { name: 'Lists', items: ('NumberedList' | 'BulletedList' | 'Indent' | 'Outdent')[] } | { name: 'Links', items: ('Link' | 'Unlink')[] } | { name: 'Insert', items: ('base64image')[] } )[]} Toolbar
-					* @static
-					*/
-					static Toolbar:( { name: 'BasicFormatting', items: ('Bold' | 'Italic' | 'Underline')[] } | { name: 'Justify', items: ('JustifyLeft' | 'JustifyCenter' | 'JustifyRight')[] } | { name: 'Lists', items: ('NumberedList' | 'BulletedList' | 'Indent' | 'Outdent')[] } | { name: 'Links', items: ('Link' | 'Unlink')[] } | { name: 'Insert', items: ('base64image')[] } )[];
 				}
 			}
 		}
@@ -11130,6 +11504,11 @@ declare namespace Fit
 		{
 			// Functions defined by Fit.Http.JsonpRequest
 			/**
+			* Abort request.
+			* @function Abort
+			*/
+			public Abort():void;
+			/**
 			* Get/set name of URL parameter receiving the name of the JSONP callback function.
 			* @function Callback
 			* @param {string} [val=undefined] - If defined, changes the name of the URL parameter to specified value.