From 2df9fc7774e47d776aec9ee2839ac1e451220a37 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 09:15:45 +0100 Subject: [PATCH 1/8] Add jquery typeahead not fully documented --- types/jquery-typeahead/index.d.ts | 240 +++++++++++++++++++++++++++ types/jquery-typeahead/tsconfig.json | 23 +++ types/jquery-typeahead/tslint.json | 79 +++++++++ 3 files changed, 342 insertions(+) create mode 100644 types/jquery-typeahead/index.d.ts create mode 100644 types/jquery-typeahead/tsconfig.json create mode 100644 types/jquery-typeahead/tslint.json diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts new file mode 100644 index 0000000000..9c0cd641eb --- /dev/null +++ b/types/jquery-typeahead/index.d.ts @@ -0,0 +1,240 @@ +// Type definitions for jquery-typeahead +// Project: https://github.com/running-coder/jquery-typeahead +// Definitions by: Hamid Mayeli +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.3 + +/// + +interface JQuery { + typeahead(options: RunningCoder.Typeahead.Options): JQuery; +} + +interface JQueryStatic { + typeahead(options: RunningCoder.Typeahead.Options): JQuery; +} + +declare namespace RunningCoder.Typeahead { + interface Options { + /** + * The jQuery input selector is only required if the Typeahead was initialized without a jQuery object. + * In that case, if no input is found, the Typeahead is dropped. + */ + input?: string, + + /** + * The number of characters typed inside the search input before searching for results. + * It is possible to set this option to 0 and combine it with `searchOnFocus: true` to display a set of results by default. + * + * @default 2 + */ + minLength?: number, + + /** + * The maximum number of characters typed inside the input to perform a search. + * + * @default false + */ + maxLength?: false | number, + + /** + * The maximum number of search results that will appear inside the list. Set 0 to display ALL search results. + * It is possible to combine `maxItem` with `maxItemPerGroup` to get different results. + * + * @default 8 + */ + maxItem?: false | number, + + /** + * By default, the typeahead will only load once the source data. + * Although you can change this behavior and request the data to be re-loaded on every "input" event (similar to keypress). - [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-user_v1) + * * Note that you can modify the Ajax request to send the query with `{{query}}` modifier. + * + * @default false + */ + dynamic?: boolean, + + /** + * If `dynamic: true`, the delay (in milliseconds) will add a timer to prevent from sending a request on every key typed. + * Instead the request(s) will be sent once the delay expires. + * + * @default 300 + */ + delay?: number, + + /** + * Takes the default order in which the data was given. + * If `"asc"` or `"desc"` is set, they results will re-order based on display key. + */ + order?: "asc" | "desc", + + /** + * `false` The position of the matched query can be anywhere inside the result string + * + * `true` The query can only be match if the result string starts by the query characters. + * + * @default false + */ + offset?: boolean, + + /** + * A suggestion text will appear if there is an item inside the result list that starts by the user query. + * Also pressing the right arrow at the end of the search input text will autocomplete the query with the suggested hint and call `callback.onClickBefore` with the selected item. + * + * @default false + */ + hint?: boolean | CssObject, + + /** + * If enabled, the query and search results will ignore accents (`ãàáäâẽèéëêìíïîõòóöôùúüûñç`) and display every matches regardless of the punctuation. Ex: `é = e`, `À = a`, etc. + * It is possible to set a custom accent object, by simply setting `from` and `to` keys + * * Using this option on large data sets (10,000+ items) might impact your search performances. + * + * @default false + */ + accent?: boolean | any, + searchOnFocus?: boolean, + debug?: boolean, + backdrop?: boolean | CssObject, + correlativeTemplate?: boolean, + emptyTemplate?: string | ((query?: string) => string | JQuery), + source?: Source | Source[] | SourceTable, + callback?: Callback, + blurOnTab?: boolean, + highlight?: "any" | boolean, // Added "any" to highlight any word in the template, by default true will only highlight display keys + multiselect?: MultiSelectSettings, // Multiselect configuration object, see documentation for all options + group?: boolean | string | GroupSetting, // Improved feature, boolean,string,object(key, template (string, function)) + groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any), // New feature, order groups "asc", "desc", Array, Function + maxItemPerGroup?: number, // Maximum number of result per Group + dropdownFilter?: boolean | "string" | DropdownFilterItem[], // Take group options string and create a dropdown filter + dynamicFilter?: false | DynamicFilterItem[], // Filter the typeahead results based on dynamic value, Ex: Players based on TeamID + backdropOnFocus?: true, // Display the backdrop option as the Typeahead input is :focused + cache?: boolean | "localStorage" | "sessionStorage", // Improved option, true OR 'localStorage' OR 'sessionStorage' + ttl?: number, // Cache time to live in ms + compression?: boolean, // Requires LZString library + resultContainer?: "string" | JQuery | false, // List the results inside any container string or jQuery object + generateOnLoad?: boolean, // Forces the source to be generated on page load even if the input is not focused! + mustSelectItem?: boolean, // The submit function only gets called if an item is selected + href?: string | ((item?: any) => string), // String or Function to format the url for right-click & open in new tab on link results + display?: string[], // Allows search in multiple item keys ["display1", "display2"] + template?: string | ((query?: string, item?: any) => string), // Display template of each of the result list + templateValue?: string, // Set the input value template when an item is clicked + groupTemplate?: null, // Set a custom template for the groups + cancelButton?: boolean, // If text is detected in the input, a cancel button will be available to reset the input (pressing ESC also cancels) + loadingAnimation?: true, // Display a loading animation when typeahead is doing request / searching for results + filter?: boolean | ((item?: any, displayKey?: string) => boolean), // Set to false or function to bypass Typeahead filtering. WARNING: accent, correlativeTemplate, offset & matcher will not be interpreted + matcher?: ((item?: any, displayKey?: string) => boolean), // Add an extra filtering function after the typeahead functions + selector?: Selector + } + + interface Source { + minLength?: number, + maxLength?: false | number, + dynamic?: boolean, + filter?: boolean | ((item?: any, displayKey?: string) => boolean), + matcher?: ((item?: any, displayKey?: string) => boolean), + cache?: boolean | "localStorage" | "sessionStorage", + compression?: boolean, + ttl?: number, + data?: any[] | (() => any[]), + template?: string | ((query?: string, item?: any) => string), + display?: string | string[], + ajax?: AJaxSettings | ((query?: string) => AJaxSettings) + } + + interface AJaxSettings extends JQueryAjaxSettings { + path?: string, + done?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void, + fail?: (jqXHR?: JQueryXHR, textStatus?: string, errorThrown?: any) => void, + always?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void, + then?: (jqXHR?: JQueryXHR, textStatus?: string) => void + } + + interface SourceTable { + [key: string]: Source + } + + interface CssObject { + [key: string]: string + } + + interface DynamicFilterItem { + selector: string + key: string, + } + + interface DropdownFilterItem { + key: string, + template: string | ((item: any) => string), + value: string, + all: string + } + + interface GroupSetting { + key: string, + template: string | ((item: any) => string) + } + + interface MultiSelectSettings { + limit?: number, + limitTemplate?: string | ((query?: string) => any), + matchOn?: string | any[], + cancelOnBackspace?: boolean, + href?: string | ((item?: any) => any), + data?: any[] | (() => any[] | any), + callback?: MultiSelectSettingsCallback + } + + interface MultiSelectSettingsCallback { + onClick?: (node?: JQuery, item?: any, event?: JQueryEventObject) => any; + onCancel?: (node?: JQuery, item?: any, event?: JQueryEventObject) => any; + } + + interface Callback { + onInit?: (node?: JQuery) => void, + onNavigateBefore?: (node?: JQuery, query?: string, event?: JQueryEventObject) => void, + onNavigateAfter?: (node?: JQuery, lis?: JQuery, a?: JQuery, item?: any, query?: string, event?: JQueryEventObject) => void, + onClickAfter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onResult?: (node?: JQuery, query?: string, result?: any, resultCount?: number) => void, + onMouseEnter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onMouseLeave?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onClick?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onSubmit?: (node?: JQuery, form?: any, item?: any, event?: JQueryEventObject) => void, + onSendRequest?: (node?: JQuery, query?: string) => void, + onReceiveRequest?: (node?: JQuery, query?: string) => void, + onShowLayout?: (node?: JQuery, query?: string) => void, + onHideLayout?: (node?: JQuery, query?: string) => void, + onLayoutBuiltBefore?: (node?: JQuery, query?: string, result?: any, resultHtmlList?: JQuery) => JQuery, + onPopulateSource?: (node?: JQuery, data?: any[], group?: any, path?: any) => any[], + onReady?: (node?: JQuery) => void, // When the Typeahead initial preparation is completed + onSearch?: (node?: JQuery, query?: string) => void, // When data is being fetched & analyzed to give search results + onLayoutBuiltAfter?: (node?: JQuery, query?: string, result?: any) => void, // Modify the dom right after the results gets inserted in the result container + onEnter?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, // When an item in the result list is focused + onLeave?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, // When an item in the result list is blurred + onClickBefore?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // Possibility to e.preventDefault() to prevent the Typeahead behaviors + onDropdownFilter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // When the dropdownFilter is changed, trigger this callback + onCacheSave?: (node?: JQuery, data?: any, group?: any, path?: any) => void, // Perform operation on the source data before it gets in Typeahead cache + onCancel?: (node?: JQuery, event?: JQueryEventObject) => void, // Triggered if the typeahead had text inside and is cleared + } + + interface Selector { + container?: string, + result?: string, + list?: string, + group?: string, + item?: string, + empty?: string, + display?: string, + query?: string, + filter?: string, + filterButton?: string, + dropdown?: string, + dropdownItem?: string, + labelContainer?: string, + label?: string, + button?: string, + backdrop?: string, + hint?: string, + cancelButton?: string + } +} diff --git a/types/jquery-typeahead/tsconfig.json b/types/jquery-typeahead/tsconfig.json new file mode 100644 index 0000000000..82e6284376 --- /dev/null +++ b/types/jquery-typeahead/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": false, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts" + ] +} \ No newline at end of file diff --git a/types/jquery-typeahead/tslint.json b/types/jquery-typeahead/tslint.json new file mode 100644 index 0000000000..a41bf5d19a --- /dev/null +++ b/types/jquery-typeahead/tslint.json @@ -0,0 +1,79 @@ +{ + "extends": "dtslint/dt.json", + "rules": { + "adjacent-overload-signatures": false, + "array-type": false, + "arrow-return-shorthand": false, + "ban-types": false, + "callable-types": false, + "comment-format": false, + "dt-header": false, + "eofline": false, + "export-just-namespace": false, + "import-spacing": false, + "interface-name": false, + "interface-over-type-literal": false, + "jsdoc-format": false, + "max-line-length": false, + "member-access": false, + "new-parens": false, + "no-any-union": false, + "no-boolean-literal-compare": false, + "no-conditional-assignment": false, + "no-consecutive-blank-lines": false, + "no-construct": false, + "no-declare-current-package": false, + "no-duplicate-imports": false, + "no-duplicate-variable": false, + "no-empty-interface": false, + "no-for-in-array": false, + "no-inferrable-types": false, + "no-internal-module": false, + "no-irregular-whitespace": false, + "no-mergeable-namespace": false, + "no-misused-new": false, + "no-namespace": false, + "no-object-literal-type-assertion": false, + "no-padding": false, + "no-redundant-jsdoc": false, + "no-redundant-jsdoc-2": false, + "no-redundant-undefined": false, + "no-reference-import": false, + "no-relative-import-in-test": false, + "no-self-import": false, + "no-single-declare-module": false, + "no-string-throw": false, + "no-unnecessary-callback-wrapper": false, + "no-unnecessary-class": false, + "no-unnecessary-generics": false, + "no-unnecessary-qualifier": false, + "no-unnecessary-type-assertion": false, + "no-useless-files": false, + "no-var-keyword": false, + "no-var-requires": false, + "no-void-expression": false, + "no-trailing-whitespace": false, + "object-literal-key-quotes": false, + "object-literal-shorthand": false, + "one-line": false, + "one-variable-per-declaration": false, + "only-arrow-functions": false, + "prefer-conditional-expression": false, + "prefer-const": false, + "prefer-declare-function": false, + "prefer-for-of": false, + "prefer-method-signature": false, + "prefer-template": false, + "radix": false, + "semicolon": false, + "space-before-function-paren": false, + "space-within-parens": false, + "strict-export-declare-modifiers": false, + "trim-file": false, + "triple-equals": false, + "typedef-whitespace": false, + "unified-signatures": false, + "void-return": false, + "whitespace": false + } +} From d82151f4e6570db04bdb96aa0a56808f8bcf1c55 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 10:45:32 +0100 Subject: [PATCH 2/8] Add the documantation. --- types/jquery-typeahead/index.d.ts | 382 ++++++++++++++++++++++++++---- 1 file changed, 335 insertions(+), 47 deletions(-) diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts index 9c0cd641eb..db69bfc98b 100644 --- a/types/jquery-typeahead/index.d.ts +++ b/types/jquery-typeahead/index.d.ts @@ -93,52 +93,250 @@ declare namespace RunningCoder.Typeahead { * @default false */ accent?: boolean | any, - searchOnFocus?: boolean, - debug?: boolean, - backdrop?: boolean | CssObject, - correlativeTemplate?: boolean, - emptyTemplate?: string | ((query?: string) => string | JQuery), - source?: Source | Source[] | SourceTable, - callback?: Callback, - blurOnTab?: boolean, - highlight?: "any" | boolean, // Added "any" to highlight any word in the template, by default true will only highlight display keys - multiselect?: MultiSelectSettings, // Multiselect configuration object, see documentation for all options - group?: boolean | string | GroupSetting, // Improved feature, boolean,string,object(key, template (string, function)) - groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any), // New feature, order groups "asc", "desc", Array, Function - maxItemPerGroup?: number, // Maximum number of result per Group + + /** + * The search result(s) will receive the HTML tag around the matched query. + * + * If set to `true`, only the display keys will be highlighted + * + * If set to `"any"`, any string within the template will be highlighted + * + * @default true + */ + highlight?: "any" | boolean, + + /** + * `multiselect` configuration + * */ + multiselect?: MultiSelectSettings, + + /** + * If set to `true`, the results will grouped by the group name specified inside `source`. + * + * If set to `string`, the results will be grouped by the corresponding object key. + * Ex: group: `"conference"` will group the hockey teams by `"Western"` and `"Eastern"` conferences in [hockey_v1 demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) + * + * If an Object is set: `key`: Grouping key. `template`: Grouping template in the result list (custom header text), can be string or function. + * + * @default false + */ + group?: boolean | string | GroupSetting, + + /** + * By default, the groups will be output in the same order as they are defined in `source`. + * Set `"asc"` or `"desc"` to have the group name sorted ascending or descending + * Set an `Array` to specify the group order to appear in the search result + */ + groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any), + + /** Set a maximum results per group if `group: true` configuration is enabled */ + maxItemPerGroup?: number, + + /** + * If a string a specified, a dropdown filter will be created between the search input and the search submit button using the `source.group` as indexes. + * The string value will appear at the end of the dropdown and will filter through all the sources. + * + * If an array of objects is set, the dropdownFilter will be built based on it. It is then possible to create filters based on item matching key:value. - + * [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) + */ dropdownFilter?: boolean | "string" | DropdownFilterItem[], // Take group options string and create a dropdown filter - dynamicFilter?: false | DynamicFilterItem[], // Filter the typeahead results based on dynamic value, Ex: Players based on TeamID - backdropOnFocus?: true, // Display the backdrop option as the Typeahead input is :focused - cache?: boolean | "localStorage" | "sessionStorage", // Improved option, true OR 'localStorage' OR 'sessionStorage' - ttl?: number, // Cache time to live in ms + + /** + * If filters objects are defined, the Typeahead source data will be filtered based on the `"selected"` / `"checked"` checkboxes, + * radios and selects based on `"OR"` and `"AND"` filtering similar to database queries. + * * `selector` is the jquery selector to reach the unique input type `"checkbox"`, `"radio"` or select tag + * * `key` the object key that will be filtered, you can use "dot" notation to reach deep object properties, + * but in that case extra processing will be performed. Ex `object.key.is.deep` + * * `|` key prefix means "OR" filtering, the object key CAN match the value + * * `&` key prefix means "AND" filtering, the object key HAS to match the value + * + * Ex `dynamicFilter: [{ selector: "#assassin", key: "|tags.Assassin" }],` + */ + dynamicFilter?: false | DynamicFilterItem[], + + /** + * If set to `true`, html will be added to add a backdrop under the search input and results. + * It is possible to override the css options by passing an object to this option. + */ + backdrop?: boolean | CssObject, + + /** + * If set to `true`, as soon as the Typeahead input is focused, the `backdrop` option will be displayed regardless. + */ + backdropOnFocus?: true, + + /** + * * If set to `true` or `localStorage`, the source data will be stored in `localStorage`. + * * If set to `sessionStorage`, the source data will be stored in `sessionStorage`. + */ + cache?: boolean | "localStorage" | "sessionStorage", + + /** This is a `cache` configuration, it sets the storage time to live in milliseconds. */ + ttl?: number, + + /** + * Enabling this option will compress the data inside Localstorage. + * * Setting `compression: true` requires `cache: true` option to be enabled. + */ compression?: boolean, // Requires LZString library - resultContainer?: "string" | JQuery | false, // List the results inside any container string or jQuery object - generateOnLoad?: boolean, // Forces the source to be generated on page load even if the input is not focused! - mustSelectItem?: boolean, // The submit function only gets called if an item is selected - href?: string | ((item?: any) => string), // String or Function to format the url for right-click & open in new tab on link results + + /** + * If enabled, the typeahead will display results (if any) on input focus. You can combine this option with the input + * attribute `"autofocus"` to display results when the page is loaded. + */ + searchOnFocus?: boolean, + + /** Blur Typeahead when Tab key is pressed, if false Tab will go though search results */ + blurOnTab?: boolean, + + /** + * If a jQuery string selector or jQuery object is specified, the typeahead results will appear in that container instead of the default one. + * If the option is set to `false`, the HTML result list will not be built. + * Use this option for filtering "already on page" HTML list elements with show / hide. + */ + resultContainer?: "string" | false | JQuery, + + /** + * If enabled, the source data will be generated (doing Ajax request and preparing to data to be searched) + * on page load instead of waiting for the input to be focused. + * * This option does not work well with `dynamic: true` unless some other configuration is adjusted. + */ + generateOnLoad?: boolean, + + /** + * If enabled, an item will HAVE TO be selected in order to submit the form. + * Use this option if you want to restrict searching to your data set only. + */ + mustSelectItem?: boolean, + + /** + * If a string is defined, every result item will receive the string as href attribute replacing any `{{itemKey}}` by the `item's value`. + * It is possible to apply an extra operation of `"slugify"` on the value `{{url|slugify}}`. - [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-beer_v1) + */ + href?: string | ((item?: any) => string), + + /** + * The key that will be searched for typeahead matching results inside source objects. + * It is possible to search through multiple keys by simply adding them inside the configuration array. + */ display?: string[], // Allows search in multiple item keys ["display1", "display2"] - template?: string | ((query?: string, item?: any) => string), // Display template of each of the result list - templateValue?: string, // Set the input value template when an item is clicked - groupTemplate?: null, // Set a custom template for the groups - cancelButton?: boolean, // If text is detected in the input, a cancel button will be available to reset the input (pressing ESC also cancels) - loadingAnimation?: true, // Display a loading animation when typeahead is doing request / searching for results - filter?: boolean | ((item?: any, displayKey?: string) => boolean), // Set to false or function to bypass Typeahead filtering. WARNING: accent, correlativeTemplate, offset & matcher will not be interpreted - matcher?: ((item?: any, displayKey?: string) => boolean), // Add an extra filtering function after the typeahead functions + + /** + * The template is a HTML string containing keys that will replaced by match results object keys. + * You MUST use `{{variable}}` delimiters for your string to be replaced. + * + * You can also reach multi-level deep object properties using regular `"."` format, `{{variable.secordlevel.thirdlevel}}` + * + * If you need to print the item values inside HTML data attributes, it is possible to use `{{variable|raw}}`. + * That optional modifier will make sure to get the unmodified value. + */ + template?: string | ((query?: string, item?: any) => string), + + /** + * In case there are no results to be displayed, a row will be displayed containing this template. + * It is possible to display the query using `{{query}}` string. + */ + emptyTemplate?: string | ((query?: string) => string | JQuery), + + /** + * When an item is selected / clicked, by default the `"Matched key"` will go inside the input. + * By defining a `templateValue`, the text that will result in the input can be customized. + */ + templateValue?: string, + + /** + * This option provides a small `"x"` on the right side of the input to clear the text, + * similar to some browser's default behavior with `input[type="search"]`. + */ + cancelButton?: boolean, + + /** + * If set to function, every element will be filtered using this custom rule AFTER the regular Typeahead filters have been applied. + */ + filter?: boolean | ((item?: any, displayKey?: string) => boolean), + + /** + * By default, search text matching is reserved to `display` keys. A searched text can't match multiple keys. + * + * If the option is enabled with `true` or `array` of display keys, every item will reveive an additional key called `compiled`. + * This key will then be searched first (using soften matching mechanism) for any matching results, then the `display` keys will + * be searched (using a `"string perfect"` matching mechanism). + * + * If the option is set to true, the `template` option will be compiled into the `"compiled"` item key. + * + * It is also possible to set an Array of display keys instead of the complete template. Try it on + * [Hockey_v1](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) + */ + correlativeTemplate?: boolean | any[], + + /** + * The source option corresponds to the data set(s) that Typeahead will look through to find matches for the user query string. + * Inside the source, you can have multiple lists of data (groups) + * It is possible to send an async request inside the data function using `$.Deferred` + * `source.group` configuration: + */ + source?: Source | Source[] | SourceTable, + + /** Display debug information (RECOMMENDED for dev environment) */ + debug?: boolean, + + /** + * The callbacks are used to customize and add functionality to your Typeahead instance. You will find plenty of examples in the Demo section. + * There are 3 ways to define the callbacks: + * * Function `(recommended)`: Anonymous function calling a local function with parameters. + * * String: Function name (can be namespaced) located on the window scope without any parameters. + * * Array: First element is the function name accessible from the window scope, second element is an array containing the parameters. + */ + callback?: Callback, + + /** Set a custom template for the groups */ + groupTemplate?: null, + + /** Display a loading animation when typeahead is doing request / searching for results */ + loadingAnimation?: true, + + /** If set to function, every element will be filtered using this custom rule AFTER the regular Typeahead filters have been applied. */ + matcher?: ((item?: any, displayKey?: string) => boolean), + selector?: Selector } interface Source { + /** Overrides the default configuration for the specified group. */ minLength?: number, + + /** Overrides the default configuration for the specified group. */ maxLength?: false | number, + + /** Overrides the default configuration for the specified group. */ dynamic?: boolean, + + /** Overrides the default configuration for the specified group. */ filter?: boolean | ((item?: any, displayKey?: string) => boolean), + + /** Overrides the default configuration for the specified group. */ matcher?: ((item?: any, displayKey?: string) => boolean), + + /** Overrides the default configuration for the specified group. */ cache?: boolean | "localStorage" | "sessionStorage", + + /** Overrides the default configuration for the specified group. */ compression?: boolean, + + /** Overrides the default configuration for the specified group. */ ttl?: number, + + /** Array or function that returns an Array. The items in your array can either be strings or objects */ data?: any[] | (() => any[]), + + /** Overrides the default configuration for the specified group. */ template?: string | ((query?: string, item?: any) => string), + + /** Overrides the default configuration for the specified group. */ display?: string | string[], + + + /** En extended version of `JQuery Ajax` */ ajax?: AJaxSettings | ((query?: string) => AJaxSettings) } @@ -176,45 +374,135 @@ declare namespace RunningCoder.Typeahead { } interface MultiSelectSettings { + /** Optional limit of maximum items to select */ limit?: number, + + /** Template when the limit is reached */ limitTemplate?: string | ((query?: string) => any), + + /** Unique item identifier to remove an item from the result list when selected (use any of the item key), by default a JSON of the item will be used */ matchOn?: string | any[], + + /** If true, the last label will be deleted if the query is empty and backspace is pressed */ cancelOnBackspace?: boolean, + + /** Href link on the multiselect item */ href?: string | ((item?: any) => any), + + /** Default items when Typeahead is loade */ data?: any[] | (() => any[] | any), + callback?: MultiSelectSettingsCallback } interface MultiSelectSettingsCallback { - onClick?: (node?: JQuery, item?: any, event?: JQueryEventObject) => any; - onCancel?: (node?: JQuery, item?: any, event?: JQueryEventObject) => any; + /** Triggered when a multiselect item is clicked */ + onClick?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void, + + /** Triggered when a multiselect item is canceled */ + onCancel?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void, } interface Callback { + /** Will be executed on Typeahead initialization, before anything else. */ onInit?: (node?: JQuery) => void, - onNavigateBefore?: (node?: JQuery, query?: string, event?: JQueryEventObject) => void, - onNavigateAfter?: (node?: JQuery, lis?: JQuery, a?: JQuery, item?: any, query?: string, event?: JQueryEventObject) => void, - onClickAfter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, - onResult?: (node?: JQuery, query?: string, result?: any, resultCount?: number) => void, - onMouseEnter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, - onMouseLeave?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, - onClick?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, - onSubmit?: (node?: JQuery, form?: any, item?: any, event?: JQueryEventObject) => void, - onSendRequest?: (node?: JQuery, query?: string) => void, - onReceiveRequest?: (node?: JQuery, query?: string) => void, - onShowLayout?: (node?: JQuery, query?: string) => void, - onHideLayout?: (node?: JQuery, query?: string) => void, - onLayoutBuiltBefore?: (node?: JQuery, query?: string, result?: any, resultHtmlList?: JQuery) => JQuery, - onPopulateSource?: (node?: JQuery, data?: any[], group?: any, path?: any) => any[], + + /** Triggers when the Typeahead initial preparation is completed. */ onReady?: (node?: JQuery) => void, // When the Typeahead initial preparation is completed + + /** Triggers when the Typeahead results layout is displayed. */ + onShowLayout?: (node?: JQuery, query?: string) => void, + + /** Triggers when the Typeahead results layout is requested to hide. */ + onHideLayout?: (node?: JQuery, query?: string) => void, + + /** Triggers every time a new search is executed in Typeahead. */ onSearch?: (node?: JQuery, query?: string) => void, // When data is being fetched & analyzed to give search results + + /** Whenever the result changes, this callback will be triggered. */ + onResult?: (node?: JQuery, query?: string, result?: any, resultCount?: number) => void, + + /** + * When the result HTML is build, modify it before it get showed. + * This callback should be used to modify the result DOM before it gets inserted into Typeahead. + * * If you are using this callback, the resultHtmlList param needs to be returned at the end of your function. + */ + onLayoutBuiltBefore?: (node?: JQuery, query?: string, result?: any, resultHtmlList?: JQuery) => JQuery, + + /** Perform an action right after the result HTML gets inserted into Typeahead's DOM. */ onLayoutBuiltAfter?: (node?: JQuery, query?: string, result?: any) => void, // Modify the dom right after the results gets inserted in the result container - onEnter?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, // When an item in the result list is focused - onLeave?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, // When an item in the result list is blurred + + /** + * When a key is pressed to navigate the results. It is possible to disable the input text change + * when using up and down arrows when `event.preventInputChange` is set to true + * */ + onNavigateBefore?: (node?: JQuery, query?: string, event?: JQueryEventObject) => void, + + /** Called at the end of Navigate (once the `.active` class and other operations are completed). */ + onNavigateAfter?: (node?: JQuery, lis?: JQuery, a?: JQuery, item?: any, query?: string, event?: JQueryEventObject) => void, + + /** Will be executed when a item is hovered inside the result list. */ + onMouseEnter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + + /** Will be executed when a result item is hovered out. */ + onMouseLeave?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + + /** + * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from + * the results list. This function will trigger before the regular behaviors. + */ + onClick?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + + /** + * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from + * the results list. This function will trigger before the regular behaviors. + */ onClickBefore?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // Possibility to e.preventDefault() to prevent the Typeahead behaviors + + /** + * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from + * the results list. This function will trigger after the regular behaviors. + */ + onClickAfter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + + /** Will be executed when a dropdown filter is selected. Requires `dropdownFilter: true`. */ onDropdownFilter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // When the dropdownFilter is changed, trigger this callback - onCacheSave?: (node?: JQuery, data?: any, group?: any, path?: any) => void, // Perform operation on the source data before it gets in Typeahead cache + + /** Gets called when the Ajax request(s) are sent. Either on initial requests or on every dynamic requests. */ + onSendRequest?: (node?: JQuery, query?: string) => void, + + /** Gets called when the Ajax request(s) are all received */ + onReceiveRequest?: (node?: JQuery, query?: string) => void, + + /** + * Gets called after the Ajax requests are all received and the data is populated inside Typeahead. + * This is the place where extra parsing or filtering should occure before the data gets available inside any Typeahead query + * For example, the Backend sends the "display" key separated by underscores "_" instead of spaces " ". + * * The `data` parameter HAS to be returned after it's transformed. + */ + onPopulateSource?: (node?: JQuery, data?: any[], group?: any, path?: any) => any[], + + /** Perform operation on the source data before it gets in Typeahead cache */ + onCacheSave?: (node?: JQuery, data?: any, group?: any, path?: any) => void, + + /** + * Override the native onSubmit function by your own. + * If after performing a set of action(s) you want to submit the form, simply do `form.submit()`. + * * The item parameter is not always defined. An item object will be sent if the submit happens after an item from the list has been selected. + */ + onSubmit?: (node?: JQuery, form?: any, item?: any, event?: JQueryEventObject) => void, + + /** + * Any time there is text inside the input and it gets cleared (Backspace, Esc, Cancel button, etc). + * It is possible to track back the event that cleared the input using event.originalEvent + */ onCancel?: (node?: JQuery, event?: JQueryEventObject) => void, // Triggered if the typeahead had text inside and is cleared + + /** When an item in the result list is focused */ + onEnter?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, + + /** When an item in the result list is blurred */ + onLeave?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, } interface Selector { From 63d2978c577f9d07776617f3ba1596146208a7a9 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 10:58:38 +0100 Subject: [PATCH 3/8] Add test --- types/jquery-typeahead/tsconfig.json | 3 +- types/jquery-typeahead/typeahead-tests.ts | 118 ++++++++++++++++++++++ 2 files changed, 120 insertions(+), 1 deletion(-) create mode 100644 types/jquery-typeahead/typeahead-tests.ts diff --git a/types/jquery-typeahead/tsconfig.json b/types/jquery-typeahead/tsconfig.json index 82e6284376..2699625f50 100644 --- a/types/jquery-typeahead/tsconfig.json +++ b/types/jquery-typeahead/tsconfig.json @@ -18,6 +18,7 @@ "forceConsistentCasingInFileNames": true }, "files": [ - "index.d.ts" + "index.d.ts", + "typeahead-tests.ts" ] } \ No newline at end of file diff --git a/types/jquery-typeahead/typeahead-tests.ts b/types/jquery-typeahead/typeahead-tests.ts new file mode 100644 index 0000000000..8399aaa56b --- /dev/null +++ b/types/jquery-typeahead/typeahead-tests.ts @@ -0,0 +1,118 @@ +class Tests { + method1(input: JQuery) { + input.typeahead({ + order: "desc", + source: { + data: [ + "Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antigua and Barbuda", + "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", + "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", + "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", + "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", + "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", + "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", + "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", + "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", + "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", + "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", + "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", + "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", + "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", + "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", + "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", + "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", + "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", + "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", + "Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", + "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", + "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", + "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", + "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", + "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe" + ] + }, + callback: { + onInit: function (node) { + console.log('Typeahead Initiated'); + } + } + }); + } + + method2() { + $.typeahead({ + input: '.js-typeahead-country_v2', + minLength: 1, + maxItem: 20, + order: "asc", + href: "https://en.wikipedia.org/?title={{display}}", + template: "{{display}} {{group}}", + source: { + country: { + ajax: { + url: "/jquerytypeahead/country_v2.json", + path: "data.country" + } + }, + capital: { + ajax: { + type: "POST", + url: "/jquerytypeahead/country_v2.json", + path: "data.capital", + data: { myKey: "myValue" } + } + } + }, + callback: { + onNavigateAfter: function (node, lis, a, item, query, event) { + if (~[38, 40].indexOf(event.keyCode)) { + var resultList = node.closest("form").find("ul.typeahead__list"), + activeLi = lis.filter("li.active"), + offsetTop = activeLi[0] && activeLi[0].offsetTop - (resultList.height() / 2) || 0; + + resultList.scrollTop(offsetTop); + } + + }, + onClickAfter: function (node, a, item, event) { + + event.preventDefault(); + + var r = confirm("You will be redirected to:\n" + item.href + "\n\nContinue?"); + if (r == true) { + window.open(item.href); + } + + $('#result-container').text(''); + + }, + onResult: function (node, query, result, resultCount) { + if (query === "") return; + + var text = ""; + if (result.length > 0 && result.length < resultCount) { + text = "Showing " + result.length + " of " + resultCount + ' elements matching "' + query + '"'; + } else if (result.length > 0) { + text = 'Showing ' + result.length + ' elements matching "' + query + '"'; + } else { + text = 'No results matching "' + query + '"'; + } + $('#result-container').html(text); + + }, + onMouseEnter: function (node, a, item, event) { + + if (item.group === "country") { + $(a).append('') + } + + }, + onMouseLeave: function (node, a, item, event) { + + $(a).find('.flag-chart').remove(); + + } + } + }); + } +} From 4bc63fdbbbd6d5ca874d405aaa266a037c675ee2 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 11:51:25 +0100 Subject: [PATCH 4/8] Small fix --- types/jquery-typeahead/index.d.ts | 6 +- types/jquery-typeahead/tslint.json | 80 +------- types/jquery-typeahead/typeahead-tests.ts | 222 +++++++++++----------- 3 files changed, 113 insertions(+), 195 deletions(-) diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts index db69bfc98b..26ec18e304 100644 --- a/types/jquery-typeahead/index.d.ts +++ b/types/jquery-typeahead/index.d.ts @@ -127,7 +127,7 @@ declare namespace RunningCoder.Typeahead { * Set `"asc"` or `"desc"` to have the group name sorted ascending or descending * Set an `Array` to specify the group order to appear in the search result */ - groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any), + groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any[]), /** Set a maximum results per group if `group: true` configuration is enabled */ maxItemPerGroup?: number, @@ -378,7 +378,7 @@ declare namespace RunningCoder.Typeahead { limit?: number, /** Template when the limit is reached */ - limitTemplate?: string | ((query?: string) => any), + limitTemplate?: string | ((query?: string) => string), /** Unique item identifier to remove an item from the result list when selected (use any of the item key), by default a JSON of the item will be used */ matchOn?: string | any[], @@ -387,7 +387,7 @@ declare namespace RunningCoder.Typeahead { cancelOnBackspace?: boolean, /** Href link on the multiselect item */ - href?: string | ((item?: any) => any), + href?: string | ((item?: any) => string), /** Default items when Typeahead is loade */ data?: any[] | (() => any[] | any), diff --git a/types/jquery-typeahead/tslint.json b/types/jquery-typeahead/tslint.json index a41bf5d19a..e60c15844f 100644 --- a/types/jquery-typeahead/tslint.json +++ b/types/jquery-typeahead/tslint.json @@ -1,79 +1,3 @@ { - "extends": "dtslint/dt.json", - "rules": { - "adjacent-overload-signatures": false, - "array-type": false, - "arrow-return-shorthand": false, - "ban-types": false, - "callable-types": false, - "comment-format": false, - "dt-header": false, - "eofline": false, - "export-just-namespace": false, - "import-spacing": false, - "interface-name": false, - "interface-over-type-literal": false, - "jsdoc-format": false, - "max-line-length": false, - "member-access": false, - "new-parens": false, - "no-any-union": false, - "no-boolean-literal-compare": false, - "no-conditional-assignment": false, - "no-consecutive-blank-lines": false, - "no-construct": false, - "no-declare-current-package": false, - "no-duplicate-imports": false, - "no-duplicate-variable": false, - "no-empty-interface": false, - "no-for-in-array": false, - "no-inferrable-types": false, - "no-internal-module": false, - "no-irregular-whitespace": false, - "no-mergeable-namespace": false, - "no-misused-new": false, - "no-namespace": false, - "no-object-literal-type-assertion": false, - "no-padding": false, - "no-redundant-jsdoc": false, - "no-redundant-jsdoc-2": false, - "no-redundant-undefined": false, - "no-reference-import": false, - "no-relative-import-in-test": false, - "no-self-import": false, - "no-single-declare-module": false, - "no-string-throw": false, - "no-unnecessary-callback-wrapper": false, - "no-unnecessary-class": false, - "no-unnecessary-generics": false, - "no-unnecessary-qualifier": false, - "no-unnecessary-type-assertion": false, - "no-useless-files": false, - "no-var-keyword": false, - "no-var-requires": false, - "no-void-expression": false, - "no-trailing-whitespace": false, - "object-literal-key-quotes": false, - "object-literal-shorthand": false, - "one-line": false, - "one-variable-per-declaration": false, - "only-arrow-functions": false, - "prefer-conditional-expression": false, - "prefer-const": false, - "prefer-declare-function": false, - "prefer-for-of": false, - "prefer-method-signature": false, - "prefer-template": false, - "radix": false, - "semicolon": false, - "space-before-function-paren": false, - "space-within-parens": false, - "strict-export-declare-modifiers": false, - "trim-file": false, - "triple-equals": false, - "typedef-whitespace": false, - "unified-signatures": false, - "void-return": false, - "whitespace": false - } -} + "extends": "dtslint/dt.json" +} \ No newline at end of file diff --git a/types/jquery-typeahead/typeahead-tests.ts b/types/jquery-typeahead/typeahead-tests.ts index 8399aaa56b..c3f68b0876 100644 --- a/types/jquery-typeahead/typeahead-tests.ts +++ b/types/jquery-typeahead/typeahead-tests.ts @@ -1,118 +1,112 @@ -class Tests { - method1(input: JQuery) { - input.typeahead({ - order: "desc", - source: { - data: [ - "Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antigua and Barbuda", - "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", - "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", - "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", - "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", - "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", - "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", - "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", - "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", - "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", - "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", - "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", - "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", - "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", - "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", - "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", - "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", - "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", - "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", - "Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", - "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", - "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", - "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", - "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", - "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe" - ] - }, - callback: { - onInit: function (node) { - console.log('Typeahead Initiated'); - } - } - }); +let t1 = $('input').typeahead({ + order: "desc", + source: { + data: [ + "Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antigua and Barbuda", + "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", + "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", + "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", + "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", + "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", + "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", + "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", + "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", + "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", + "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", + "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", + "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", + "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", + "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", + "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", + "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", + "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", + "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", + "Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", + "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", + "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", + "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", + "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", + "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe" + ] + }, + callback: { + onInit: function (node) { + console.log('Typeahead Initiated'); + } } +}); - method2() { - $.typeahead({ - input: '.js-typeahead-country_v2', - minLength: 1, - maxItem: 20, - order: "asc", - href: "https://en.wikipedia.org/?title={{display}}", - template: "{{display}} {{group}}", - source: { - country: { - ajax: { - url: "/jquerytypeahead/country_v2.json", - path: "data.country" - } - }, - capital: { - ajax: { - type: "POST", - url: "/jquerytypeahead/country_v2.json", - path: "data.capital", - data: { myKey: "myValue" } - } - } - }, - callback: { - onNavigateAfter: function (node, lis, a, item, query, event) { - if (~[38, 40].indexOf(event.keyCode)) { - var resultList = node.closest("form").find("ul.typeahead__list"), - activeLi = lis.filter("li.active"), - offsetTop = activeLi[0] && activeLi[0].offsetTop - (resultList.height() / 2) || 0; - - resultList.scrollTop(offsetTop); - } - - }, - onClickAfter: function (node, a, item, event) { - - event.preventDefault(); - - var r = confirm("You will be redirected to:\n" + item.href + "\n\nContinue?"); - if (r == true) { - window.open(item.href); - } - - $('#result-container').text(''); - - }, - onResult: function (node, query, result, resultCount) { - if (query === "") return; - - var text = ""; - if (result.length > 0 && result.length < resultCount) { - text = "Showing " + result.length + " of " + resultCount + ' elements matching "' + query + '"'; - } else if (result.length > 0) { - text = 'Showing ' + result.length + ' elements matching "' + query + '"'; - } else { - text = 'No results matching "' + query + '"'; - } - $('#result-container').html(text); - - }, - onMouseEnter: function (node, a, item, event) { - - if (item.group === "country") { - $(a).append('') - } - - }, - onMouseLeave: function (node, a, item, event) { - - $(a).find('.flag-chart').remove(); - - } +let t2 = $.typeahead({ + input: '.js-typeahead-country_v2', + minLength: 1, + maxItem: 20, + order: "asc", + href: "https://en.wikipedia.org/?title={{display}}", + template: "{{display}} {{group}}", + source: { + country: { + ajax: { + url: "/jquerytypeahead/country_v2.json", + path: "data.country" } - }); + }, + capital: { + ajax: { + type: "POST", + url: "/jquerytypeahead/country_v2.json", + path: "data.capital", + data: { myKey: "myValue" } + } + } + }, + callback: { + onNavigateAfter: function (node, lis, a, item, query, event) { + if (~[38, 40].indexOf(event.keyCode)) { + var resultList = node.closest("form").find("ul.typeahead__list"), + activeLi = lis.filter("li.active"), + offsetTop = activeLi[0] && activeLi[0].offsetTop - (resultList.height() / 2) || 0; + + resultList.scrollTop(offsetTop); + } + + }, + onClickAfter: function (node, a, item, event) { + + event.preventDefault(); + + var r = confirm("You will be redirected to:\n" + item.href + "\n\nContinue?"); + if (r == true) { + window.open(item.href); + } + + $('#result-container').text(''); + + }, + onResult: function (node, query, result, resultCount) { + if (query === "") return; + + var text = ""; + if (result.length > 0 && result.length < resultCount) { + text = "Showing " + result.length + " of " + resultCount + ' elements matching "' + query + '"'; + } else if (result.length > 0) { + text = 'Showing ' + result.length + ' elements matching "' + query + '"'; + } else { + text = 'No results matching "' + query + '"'; + } + $('#result-container').html(text); + + }, + onMouseEnter: function (node, a, item, event) { + + if (item.group === "country") { + $(a).append('') + } + + }, + onMouseLeave: function (node, a, item, event) { + + $(a).find('.flag-chart').remove(); + + } } -} +}); From 3042ca865ad2765e452ab537b87a8a7fa3e0aed2 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 12:09:59 +0100 Subject: [PATCH 5/8] Rename the test file --- ...ead-tests.ts => jquery-typeahead-tests.ts} | 45 +++++++------------ types/jquery-typeahead/tsconfig.json | 2 +- 2 files changed, 16 insertions(+), 31 deletions(-) rename types/jquery-typeahead/{typeahead-tests.ts => jquery-typeahead-tests.ts} (75%) diff --git a/types/jquery-typeahead/typeahead-tests.ts b/types/jquery-typeahead/jquery-typeahead-tests.ts similarity index 75% rename from types/jquery-typeahead/typeahead-tests.ts rename to types/jquery-typeahead/jquery-typeahead-tests.ts index c3f68b0876..92ff1969c6 100644 --- a/types/jquery-typeahead/typeahead-tests.ts +++ b/types/jquery-typeahead/jquery-typeahead-tests.ts @@ -30,7 +30,7 @@ let t1 = $('input').typeahead({ ] }, callback: { - onInit: function (node) { + onInit: (node) => { console.log('Typeahead Initiated'); } } @@ -60,53 +60,38 @@ let t2 = $.typeahead({ } }, callback: { - onNavigateAfter: function (node, lis, a, item, query, event) { + onNavigateAfter: (node, lis, a, item, query, event) => { if (~[38, 40].indexOf(event.keyCode)) { - var resultList = node.closest("form").find("ul.typeahead__list"), - activeLi = lis.filter("li.active"), - offsetTop = activeLi[0] && activeLi[0].offsetTop - (resultList.height() / 2) || 0; + const resultList = node.closest("form").find("ul.typeahead__list"); + const activeLi = lis.filter("li.active"); + const offsetTop = activeLi[0] && activeLi[0].offsetTop - (resultList.height() / 2) || 0; resultList.scrollTop(offsetTop); } - }, - onClickAfter: function (node, a, item, event) { - - event.preventDefault(); - - var r = confirm("You will be redirected to:\n" + item.href + "\n\nContinue?"); - if (r == true) { - window.open(item.href); - } - - $('#result-container').text(''); - + onClickAfter: (node, a, item, event) => { + console.log("Just log"); }, - onResult: function (node, query, result, resultCount) { + onResult: (node, query, result, resultCount) => { if (query === "") return; - var text = ""; + let text = ""; if (result.length > 0 && result.length < resultCount) { - text = "Showing " + result.length + " of " + resultCount + ' elements matching "' + query + '"'; + text = `Showing ${result.length} of ${resultCount} elements matching "${query}"`; } else if (result.length > 0) { - text = 'Showing ' + result.length + ' elements matching "' + query + '"'; + text = `Showing ${result.length} elements matching "${query}"`; } else { - text = 'No results matching "' + query + '"'; + text = 'No results matching'; } $('#result-container').html(text); - }, - onMouseEnter: function (node, a, item, event) { - + onMouseEnter: (node, a, item, event) => { if (item.group === "country") { - $(a).append('') + $(a).append(``); } - }, - onMouseLeave: function (node, a, item, event) { - + onMouseLeave: (node, a, item, event) => { $(a).find('.flag-chart').remove(); - } } }); diff --git a/types/jquery-typeahead/tsconfig.json b/types/jquery-typeahead/tsconfig.json index 2699625f50..1b5d326f2d 100644 --- a/types/jquery-typeahead/tsconfig.json +++ b/types/jquery-typeahead/tsconfig.json @@ -19,6 +19,6 @@ }, "files": [ "index.d.ts", - "typeahead-tests.ts" + "jquery-typeahead-tests.ts" ] } \ No newline at end of file From 0895e31ab1166bf4ead2e46aff5a40a79663e69c Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 12:19:23 +0100 Subject: [PATCH 6/8] change the project --- types/jquery-typeahead/index.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts index 26ec18e304..2a0c222d03 100644 --- a/types/jquery-typeahead/index.d.ts +++ b/types/jquery-typeahead/index.d.ts @@ -1,5 +1,5 @@ // Type definitions for jquery-typeahead -// Project: https://github.com/running-coder/jquery-typeahead +// Project: http://www.runningcoder.org/jquerytypeahead // Definitions by: Hamid Mayeli // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 From 4b724398df5eeb4ca9da3a133cd45bd93526eb09 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Fri, 5 Apr 2019 12:35:41 +0100 Subject: [PATCH 7/8] Remove some rules of tslint --- types/jquery-typeahead/index.d.ts | 4 +- types/jquery-typeahead/tslint.json | 78 +++++++++++++++++++++++++++++- 2 files changed, 79 insertions(+), 3 deletions(-) diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts index 2a0c222d03..e7b39ddb22 100644 --- a/types/jquery-typeahead/index.d.ts +++ b/types/jquery-typeahead/index.d.ts @@ -7,11 +7,11 @@ /// interface JQuery { - typeahead(options: RunningCoder.Typeahead.Options): JQuery; + typeahead(options: RunningCoder.Typeahead.Options): JQuery } interface JQueryStatic { - typeahead(options: RunningCoder.Typeahead.Options): JQuery; + typeahead(options: RunningCoder.Typeahead.Options): JQuery } declare namespace RunningCoder.Typeahead { diff --git a/types/jquery-typeahead/tslint.json b/types/jquery-typeahead/tslint.json index e60c15844f..a4c53997aa 100644 --- a/types/jquery-typeahead/tslint.json +++ b/types/jquery-typeahead/tslint.json @@ -1,3 +1,79 @@ { - "extends": "dtslint/dt.json" + "extends": "dtslint/dt.json", + "rules": { + "adjacent-overload-signatures": false, + "array-type": false, + "arrow-return-shorthand": false, + "ban-types": false, + "callable-types": false, + "comment-format": false, + "dt-header": false, + "eofline": false, + "export-just-namespace": false, + "import-spacing": false, + "interface-name": false, + "interface-over-type-literal": false, + "jsdoc-format": false, + "max-line-length": false, + "member-access": false, + "new-parens": false, + "no-any-union": false, + "no-boolean-literal-compare": false, + "no-conditional-assignment": false, + "no-consecutive-blank-lines": false, + "no-construct": false, + "no-declare-current-package": false, + "no-duplicate-imports": false, + "no-duplicate-variable": false, + "no-empty-interface": false, + "no-for-in-array": false, + "no-inferrable-types": false, + "no-internal-module": false, + "no-irregular-whitespace": false, + "no-mergeable-namespace": false, + "no-misused-new": false, + "no-namespace": false, + "no-object-literal-type-assertion": false, + "no-padding": false, + "no-redundant-jsdoc": false, + "no-redundant-jsdoc-2": false, + "no-redundant-undefined": false, + "no-reference-import": false, + "no-relative-import-in-test": false, + "no-self-import": false, + "no-single-declare-module": false, + "no-string-throw": false, + "no-unnecessary-callback-wrapper": false, + "no-unnecessary-class": false, + "no-unnecessary-generics": false, + "no-unnecessary-qualifier": false, + "no-unnecessary-type-assertion": false, + "no-useless-files": false, + "no-var-keyword": false, + "no-var-requires": false, + "no-void-expression": false, + "no-trailing-whitespace": false, + "object-literal-key-quotes": false, + "object-literal-shorthand": false, + "one-line": false, + "one-variable-per-declaration": false, + "only-arrow-functions": false, + "prefer-conditional-expression": false, + "prefer-const": false, + "prefer-declare-function": false, + "prefer-for-of": false, + "prefer-method-signature": false, + "prefer-template": false, + "radix": false, + "semicolon": false, + "space-before-function-paren": false, + "space-within-parens": false, + "strict-export-declare-modifiers": false, + "trim-file": false, + "triple-equals": false, + "typedef-whitespace": false, + "unified-signatures": false, + "void-return": false, + "whitespace": false + } } \ No newline at end of file From 6446b6add6fce1b141bd1565a3d099d46f1522f9 Mon Sep 17 00:00:00 2001 From: hamid_mayeli_geeksltd Date: Mon, 8 Apr 2019 09:17:13 +0100 Subject: [PATCH 8/8] Remove the ts lint rules and fix the related errors --- types/jquery-typeahead/index.d.ts | 379 +++++++++++++++-------------- types/jquery-typeahead/tslint.json | 78 +----- 2 files changed, 192 insertions(+), 265 deletions(-) diff --git a/types/jquery-typeahead/index.d.ts b/types/jquery-typeahead/index.d.ts index e7b39ddb22..ddb5104a85 100644 --- a/types/jquery-typeahead/index.d.ts +++ b/types/jquery-typeahead/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for jquery-typeahead +// Type definitions for jquery-typeahead 2.10 // Project: http://www.runningcoder.org/jquerytypeahead // Definitions by: Hamid Mayeli // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped @@ -7,75 +7,76 @@ /// interface JQuery { - typeahead(options: RunningCoder.Typeahead.Options): JQuery + typeahead(options: RunningCoder.Typeahead.Options): JQuery; } interface JQueryStatic { - typeahead(options: RunningCoder.Typeahead.Options): JQuery + typeahead(options: RunningCoder.Typeahead.Options): JQuery; } declare namespace RunningCoder.Typeahead { interface Options { /** - * The jQuery input selector is only required if the Typeahead was initialized without a jQuery object. + * The jQuery input selector is only required if the Typeahead was initialized without a jQuery object. * In that case, if no input is found, the Typeahead is dropped. */ - input?: string, + input?: string; /** - * The number of characters typed inside the search input before searching for results. + * The number of characters typed inside the search input before searching for results. * It is possible to set this option to 0 and combine it with `searchOnFocus: true` to display a set of results by default. - * + * * @default 2 */ - minLength?: number, + minLength?: number; /** * The maximum number of characters typed inside the input to perform a search. - * + * * @default false */ - maxLength?: false | number, + maxLength?: false | number; /** * The maximum number of search results that will appear inside the list. Set 0 to display ALL search results. * It is possible to combine `maxItem` with `maxItemPerGroup` to get different results. - * + * * @default 8 */ - maxItem?: false | number, + maxItem?: false | number; /** - * By default, the typeahead will only load once the source data. - * Although you can change this behavior and request the data to be re-loaded on every "input" event (similar to keypress). - [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-user_v1) + * By default, the typeahead will only load once the source data. + * Although you can change this behavior and request the data to be re-loaded on every "input" event (similar to + * keypress). - [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-user_v1) * * Note that you can modify the Ajax request to send the query with `{{query}}` modifier. - * + * * @default false */ - dynamic?: boolean, + dynamic?: boolean; /** - * If `dynamic: true`, the delay (in milliseconds) will add a timer to prevent from sending a request on every key typed. + * If `dynamic: true`, the delay (in milliseconds) will add a timer to prevent from sending a request on every key typed. * Instead the request(s) will be sent once the delay expires. - * + * * @default 300 */ - delay?: number, + delay?: number; /** - * Takes the default order in which the data was given. + * Takes the default order in which the data was given. * If `"asc"` or `"desc"` is set, they results will re-order based on display key. */ - order?: "asc" | "desc", + order?: "asc" | "desc"; /** * `false` The position of the matched query can be anywhere inside the result string - * + * * `true` The query can only be match if the result string starts by the query characters. - * + * * @default false */ - offset?: boolean, + offset?: boolean; /** * A suggestion text will appear if there is an item inside the result list that starts by the user query. @@ -83,191 +84,189 @@ declare namespace RunningCoder.Typeahead { * * @default false */ - hint?: boolean | CssObject, + hint?: boolean | CssObject; /** * If enabled, the query and search results will ignore accents (`ãàáäâẽèéëêìíïîõòóöôùúüûñç`) and display every matches regardless of the punctuation. Ex: `é = e`, `À = a`, etc. * It is possible to set a custom accent object, by simply setting `from` and `to` keys * * Using this option on large data sets (10,000+ items) might impact your search performances. - * + * * @default false */ - accent?: boolean | any, + accent?: boolean | FromToPair; /** * The search result(s) will receive the HTML tag around the matched query. - * + * * If set to `true`, only the display keys will be highlighted - * + * * If set to `"any"`, any string within the template will be highlighted - * + * * @default true */ - highlight?: "any" | boolean, + highlight?: "any" | boolean; - /** - * `multiselect` configuration - * */ - multiselect?: MultiSelectSettings, + /** `multiselect` configuration */ + multiselect?: MultiSelectSettings; /** * If set to `true`, the results will grouped by the group name specified inside `source`. - * - * If set to `string`, the results will be grouped by the corresponding object key. + * + * If set to `string`, the results will be grouped by the corresponding object key. * Ex: group: `"conference"` will group the hockey teams by `"Western"` and `"Eastern"` conferences in [hockey_v1 demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) - * + * * If an Object is set: `key`: Grouping key. `template`: Grouping template in the result list (custom header text), can be string or function. - * + * * @default false */ - group?: boolean | string | GroupSetting, + group?: boolean | string | GroupSetting; /** * By default, the groups will be output in the same order as they are defined in `source`. * Set `"asc"` or `"desc"` to have the group name sorted ascending or descending * Set an `Array` to specify the group order to appear in the search result */ - groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any[]), + groupOrder?: "asc" | "desc" | string[] | ((node?: JQuery, query?: string, result?: any, resultCount?: number, resultCountPerGroup?: number) => any[]); /** Set a maximum results per group if `group: true` configuration is enabled */ - maxItemPerGroup?: number, + maxItemPerGroup?: number; /** * If a string a specified, a dropdown filter will be created between the search input and the search submit button using the `source.group` as indexes. * The string value will appear at the end of the dropdown and will filter through all the sources. - * - * If an array of objects is set, the dropdownFilter will be built based on it. It is then possible to create filters based on item matching key:value. - + * + * If an array of objects is set, the dropdownFilter will be built based on it. It is then possible to create filters based on item matching key:value. - * [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) */ - dropdownFilter?: boolean | "string" | DropdownFilterItem[], // Take group options string and create a dropdown filter + dropdownFilter?: boolean | "string" | DropdownFilterItem[]; /** - * If filters objects are defined, the Typeahead source data will be filtered based on the `"selected"` / `"checked"` checkboxes, + * If filters objects are defined, the Typeahead source data will be filtered based on the `"selected"` / `"checked"` checkboxes, * radios and selects based on `"OR"` and `"AND"` filtering similar to database queries. * * `selector` is the jquery selector to reach the unique input type `"checkbox"`, `"radio"` or select tag - * * `key` the object key that will be filtered, you can use "dot" notation to reach deep object properties, + * * `key` the object key that will be filtered, you can use "dot" notation to reach deep object properties, * but in that case extra processing will be performed. Ex `object.key.is.deep` * * `|` key prefix means "OR" filtering, the object key CAN match the value * * `&` key prefix means "AND" filtering, the object key HAS to match the value - * + * * Ex `dynamicFilter: [{ selector: "#assassin", key: "|tags.Assassin" }],` */ - dynamicFilter?: false | DynamicFilterItem[], + dynamicFilter?: false | DynamicFilterItem[]; /** - * If set to `true`, html will be added to add a backdrop under the search input and results. + * If set to `true`, html will be added to add a backdrop under the search input and results. * It is possible to override the css options by passing an object to this option. */ - backdrop?: boolean | CssObject, + backdrop?: boolean | CssObject; /** * If set to `true`, as soon as the Typeahead input is focused, the `backdrop` option will be displayed regardless. */ - backdropOnFocus?: true, + backdropOnFocus?: true; /** * * If set to `true` or `localStorage`, the source data will be stored in `localStorage`. * * If set to `sessionStorage`, the source data will be stored in `sessionStorage`. */ - cache?: boolean | "localStorage" | "sessionStorage", + cache?: boolean | "localStorage" | "sessionStorage"; /** This is a `cache` configuration, it sets the storage time to live in milliseconds. */ - ttl?: number, + ttl?: number; - /** + /** * Enabling this option will compress the data inside Localstorage. * * Setting `compression: true` requires `cache: true` option to be enabled. */ - compression?: boolean, // Requires LZString library + compression?: boolean; /** - * If enabled, the typeahead will display results (if any) on input focus. You can combine this option with the input + * If enabled, the typeahead will display results (if any) on input focus. You can combine this option with the input * attribute `"autofocus"` to display results when the page is loaded. */ - searchOnFocus?: boolean, + searchOnFocus?: boolean; /** Blur Typeahead when Tab key is pressed, if false Tab will go though search results */ - blurOnTab?: boolean, + blurOnTab?: boolean; /** * If a jQuery string selector or jQuery object is specified, the typeahead results will appear in that container instead of the default one. - * If the option is set to `false`, the HTML result list will not be built. + * If the option is set to `false`, the HTML result list will not be built. * Use this option for filtering "already on page" HTML list elements with show / hide. */ - resultContainer?: "string" | false | JQuery, + resultContainer?: "string" | false | JQuery; /** - * If enabled, the source data will be generated (doing Ajax request and preparing to data to be searched) + * If enabled, the source data will be generated (doing Ajax request and preparing to data to be searched) * on page load instead of waiting for the input to be focused. * * This option does not work well with `dynamic: true` unless some other configuration is adjusted. */ - generateOnLoad?: boolean, + generateOnLoad?: boolean; - /** - * If enabled, an item will HAVE TO be selected in order to submit the form. - * Use this option if you want to restrict searching to your data set only. + /** + * If enabled, an item will HAVE TO be selected in order to submit the form. + * Use this option if you want to restrict searching to your data set only. */ - mustSelectItem?: boolean, + mustSelectItem?: boolean; /** * If a string is defined, every result item will receive the string as href attribute replacing any `{{itemKey}}` by the `item's value`. * It is possible to apply an extra operation of `"slugify"` on the value `{{url|slugify}}`. - [Demo](http://www.runningcoder.org/jquerytypeahead/demo/#form-beer_v1) */ - href?: string | ((item?: any) => string), + href?: string | ((item?: any) => string); /** * The key that will be searched for typeahead matching results inside source objects. * It is possible to search through multiple keys by simply adding them inside the configuration array. */ - display?: string[], // Allows search in multiple item keys ["display1", "display2"] + display?: string[]; /** - * The template is a HTML string containing keys that will replaced by match results object keys. + * The template is a HTML string containing keys that will replaced by match results object keys. * You MUST use `{{variable}}` delimiters for your string to be replaced. - * + * * You can also reach multi-level deep object properties using regular `"."` format, `{{variable.secordlevel.thirdlevel}}` - * - * If you need to print the item values inside HTML data attributes, it is possible to use `{{variable|raw}}`. + * + * If you need to print the item values inside HTML data attributes, it is possible to use `{{variable|raw}}`. * That optional modifier will make sure to get the unmodified value. */ - template?: string | ((query?: string, item?: any) => string), + template?: string | ((query?: string, item?: any) => string); - /** - * In case there are no results to be displayed, a row will be displayed containing this template. + /** + * In case there are no results to be displayed, a row will be displayed containing this template. * It is possible to display the query using `{{query}}` string. */ - emptyTemplate?: string | ((query?: string) => string | JQuery), + emptyTemplate?: string | ((query?: string) => string | JQuery); /** * When an item is selected / clicked, by default the `"Matched key"` will go inside the input. * By defining a `templateValue`, the text that will result in the input can be customized. */ - templateValue?: string, + templateValue?: string; - /** - * This option provides a small `"x"` on the right side of the input to clear the text, + /** + * This option provides a small `"x"` on the right side of the input to clear the text, * similar to some browser's default behavior with `input[type="search"]`. */ - cancelButton?: boolean, + cancelButton?: boolean; /** * If set to function, every element will be filtered using this custom rule AFTER the regular Typeahead filters have been applied. */ - filter?: boolean | ((item?: any, displayKey?: string) => boolean), + filter?: boolean | ((item?: any, displayKey?: string) => boolean); /** * By default, search text matching is reserved to `display` keys. A searched text can't match multiple keys. - * - * If the option is enabled with `true` or `array` of display keys, every item will reveive an additional key called `compiled`. + * + * If the option is enabled with `true` or `array` of display keys, every item will reveive an additional key called `compiled`. * This key will then be searched first (using soften matching mechanism) for any matching results, then the `display` keys will * be searched (using a `"string perfect"` matching mechanism). - * + * * If the option is set to true, the `template` option will be compiled into the `"compiled"` item key. - * + * * It is also possible to set an Array of display keys instead of the complete template. Try it on * [Hockey_v1](http://www.runningcoder.org/jquerytypeahead/demo/#form-hockey_v1) */ - correlativeTemplate?: boolean | any[], + correlativeTemplate?: boolean | any[]; /** * The source option corresponds to the data set(s) that Typeahead will look through to find matches for the user query string. @@ -275,10 +274,10 @@ declare namespace RunningCoder.Typeahead { * It is possible to send an async request inside the data function using `$.Deferred` * `source.group` configuration: */ - source?: Source | Source[] | SourceTable, + source?: Source | Source[] | SourceTable; /** Display debug information (RECOMMENDED for dev environment) */ - debug?: boolean, + debug?: boolean; /** * The callbacks are used to customize and add functionality to your Typeahead instance. You will find plenty of examples in the Demo section. @@ -287,242 +286,246 @@ declare namespace RunningCoder.Typeahead { * * String: Function name (can be namespaced) located on the window scope without any parameters. * * Array: First element is the function name accessible from the window scope, second element is an array containing the parameters. */ - callback?: Callback, + callback?: Callback; /** Set a custom template for the groups */ - groupTemplate?: null, + groupTemplate?: null; /** Display a loading animation when typeahead is doing request / searching for results */ - loadingAnimation?: true, + loadingAnimation?: true; /** If set to function, every element will be filtered using this custom rule AFTER the regular Typeahead filters have been applied. */ - matcher?: ((item?: any, displayKey?: string) => boolean), + matcher?: ((item?: any, displayKey?: string) => boolean); - selector?: Selector + selector?: Selector; } interface Source { /** Overrides the default configuration for the specified group. */ - minLength?: number, + minLength?: number; /** Overrides the default configuration for the specified group. */ - maxLength?: false | number, + maxLength?: false | number; /** Overrides the default configuration for the specified group. */ - dynamic?: boolean, + dynamic?: boolean; /** Overrides the default configuration for the specified group. */ - filter?: boolean | ((item?: any, displayKey?: string) => boolean), + filter?: boolean | ((item?: any, displayKey?: string) => boolean); /** Overrides the default configuration for the specified group. */ - matcher?: ((item?: any, displayKey?: string) => boolean), + matcher?: ((item?: any, displayKey?: string) => boolean); /** Overrides the default configuration for the specified group. */ - cache?: boolean | "localStorage" | "sessionStorage", + cache?: boolean | "localStorage" | "sessionStorage"; /** Overrides the default configuration for the specified group. */ - compression?: boolean, + compression?: boolean; /** Overrides the default configuration for the specified group. */ - ttl?: number, + ttl?: number; /** Array or function that returns an Array. The items in your array can either be strings or objects */ - data?: any[] | (() => any[]), + data?: any[] | (() => any[]); /** Overrides the default configuration for the specified group. */ - template?: string | ((query?: string, item?: any) => string), + template?: string | ((query?: string, item?: any) => string); /** Overrides the default configuration for the specified group. */ - display?: string | string[], - + display?: string | string[]; /** En extended version of `JQuery Ajax` */ - ajax?: AJaxSettings | ((query?: string) => AJaxSettings) + ajax?: AJaxSettings | ((query?: string) => AJaxSettings); } interface AJaxSettings extends JQueryAjaxSettings { - path?: string, - done?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void, - fail?: (jqXHR?: JQueryXHR, textStatus?: string, errorThrown?: any) => void, - always?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void, - then?: (jqXHR?: JQueryXHR, textStatus?: string) => void + path?: string; + done?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void; + fail?: (jqXHR?: JQueryXHR, textStatus?: string, errorThrown?: any) => void; + always?: (data?: JQuery, textStatus?: string, jqXHR?: JQueryXHR) => void; + then?: (jqXHR?: JQueryXHR, textStatus?: string) => void; + } + + interface FromToPair { + from: string; + to: string; } interface SourceTable { - [key: string]: Source + [key: string]: Source; } interface CssObject { - [key: string]: string + [key: string]: string; } interface DynamicFilterItem { - selector: string - key: string, + selector: string; + key: string; } interface DropdownFilterItem { - key: string, - template: string | ((item: any) => string), - value: string, - all: string + key: string; + template: string | ((item: any) => string); + value: string; + all: string; } interface GroupSetting { - key: string, - template: string | ((item: any) => string) + key: string; + template: string | ((item: any) => string); } interface MultiSelectSettings { /** Optional limit of maximum items to select */ - limit?: number, + limit?: number; /** Template when the limit is reached */ - limitTemplate?: string | ((query?: string) => string), + limitTemplate?: string | ((query?: string) => string); /** Unique item identifier to remove an item from the result list when selected (use any of the item key), by default a JSON of the item will be used */ - matchOn?: string | any[], + matchOn?: string | any[]; /** If true, the last label will be deleted if the query is empty and backspace is pressed */ - cancelOnBackspace?: boolean, + cancelOnBackspace?: boolean; /** Href link on the multiselect item */ - href?: string | ((item?: any) => string), + href?: string | ((item?: any) => string); /** Default items when Typeahead is loade */ - data?: any[] | (() => any[] | any), + data?: any[] | (() => any); - callback?: MultiSelectSettingsCallback + callback?: MultiSelectSettingsCallback; } interface MultiSelectSettingsCallback { /** Triggered when a multiselect item is clicked */ - onClick?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void, + onClick?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void; /** Triggered when a multiselect item is canceled */ - onCancel?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void, + onCancel?: (node?: JQuery, item?: any, event?: JQueryEventObject) => void; } interface Callback { /** Will be executed on Typeahead initialization, before anything else. */ - onInit?: (node?: JQuery) => void, + onInit?: (node?: JQuery) => void; /** Triggers when the Typeahead initial preparation is completed. */ - onReady?: (node?: JQuery) => void, // When the Typeahead initial preparation is completed + onReady?: (node?: JQuery) => void; /** Triggers when the Typeahead results layout is displayed. */ - onShowLayout?: (node?: JQuery, query?: string) => void, + onShowLayout?: (node?: JQuery, query?: string) => void; /** Triggers when the Typeahead results layout is requested to hide. */ - onHideLayout?: (node?: JQuery, query?: string) => void, + onHideLayout?: (node?: JQuery, query?: string) => void; /** Triggers every time a new search is executed in Typeahead. */ - onSearch?: (node?: JQuery, query?: string) => void, // When data is being fetched & analyzed to give search results + onSearch?: (node?: JQuery, query?: string) => void; /** Whenever the result changes, this callback will be triggered. */ - onResult?: (node?: JQuery, query?: string, result?: any, resultCount?: number) => void, + onResult?: (node?: JQuery, query?: string, result?: any, resultCount?: number) => void; /** - * When the result HTML is build, modify it before it get showed. + * When the result HTML is build, modify it before it get showed. * This callback should be used to modify the result DOM before it gets inserted into Typeahead. * * If you are using this callback, the resultHtmlList param needs to be returned at the end of your function. */ - onLayoutBuiltBefore?: (node?: JQuery, query?: string, result?: any, resultHtmlList?: JQuery) => JQuery, + onLayoutBuiltBefore?: (node?: JQuery, query?: string, result?: any, resultHtmlList?: JQuery) => JQuery; /** Perform an action right after the result HTML gets inserted into Typeahead's DOM. */ - onLayoutBuiltAfter?: (node?: JQuery, query?: string, result?: any) => void, // Modify the dom right after the results gets inserted in the result container - - /** - * When a key is pressed to navigate the results. It is possible to disable the input text change - * when using up and down arrows when `event.preventInputChange` is set to true - * */ - onNavigateBefore?: (node?: JQuery, query?: string, event?: JQueryEventObject) => void, - - /** Called at the end of Navigate (once the `.active` class and other operations are completed). */ - onNavigateAfter?: (node?: JQuery, lis?: JQuery, a?: JQuery, item?: any, query?: string, event?: JQueryEventObject) => void, - - /** Will be executed when a item is hovered inside the result list. */ - onMouseEnter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, - - /** Will be executed when a result item is hovered out. */ - onMouseLeave?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onLayoutBuiltAfter?: (node?: JQuery, query?: string, result?: any) => void; /** - * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from - * the results list. This function will trigger before the regular behaviors. + * When a key is pressed to navigate the results. It is possible to disable the input text change + * when using up and down arrows when `event.preventInputChange` is set to true */ - onClick?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onNavigateBefore?: (node?: JQuery, query?: string, event?: JQueryEventObject) => void; + + /** Called at the end of Navigate (once the `.active` class and other operations are completed). */ + onNavigateAfter?: (node?: JQuery, lis?: JQuery, a?: JQuery, item?: any, query?: string, event?: JQueryEventObject) => void; + + /** Will be executed when a item is hovered inside the result list. */ + onMouseEnter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; + + /** Will be executed when a result item is hovered out. */ + onMouseLeave?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; /** * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from * the results list. This function will trigger before the regular behaviors. */ - onClickBefore?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // Possibility to e.preventDefault() to prevent the Typeahead behaviors + onClick?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; + + /** + * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from + * the results list. This function will trigger before the regular behaviors. + */ + onClickBefore?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; /** * Will be executed when a result item is clicked or the right arrow is pressed when an item is selected from * the results list. This function will trigger after the regular behaviors. */ - onClickAfter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, + onClickAfter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; /** Will be executed when a dropdown filter is selected. Requires `dropdownFilter: true`. */ - onDropdownFilter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void, // When the dropdownFilter is changed, trigger this callback + onDropdownFilter?: (node?: JQuery, a?: JQuery, item?: any, event?: JQueryEventObject) => void; /** Gets called when the Ajax request(s) are sent. Either on initial requests or on every dynamic requests. */ - onSendRequest?: (node?: JQuery, query?: string) => void, + onSendRequest?: (node?: JQuery, query?: string) => void; /** Gets called when the Ajax request(s) are all received */ - onReceiveRequest?: (node?: JQuery, query?: string) => void, + onReceiveRequest?: (node?: JQuery, query?: string) => void; /** - * Gets called after the Ajax requests are all received and the data is populated inside Typeahead. + * Gets called after the Ajax requests are all received and the data is populated inside Typeahead. * This is the place where extra parsing or filtering should occure before the data gets available inside any Typeahead query * For example, the Backend sends the "display" key separated by underscores "_" instead of spaces " ". * * The `data` parameter HAS to be returned after it's transformed. */ - onPopulateSource?: (node?: JQuery, data?: any[], group?: any, path?: any) => any[], + onPopulateSource?: (node?: JQuery, data?: any[], group?: any, path?: any) => any[]; /** Perform operation on the source data before it gets in Typeahead cache */ - onCacheSave?: (node?: JQuery, data?: any, group?: any, path?: any) => void, + onCacheSave?: (node?: JQuery, data?: any, group?: any, path?: any) => void; /** * Override the native onSubmit function by your own. * If after performing a set of action(s) you want to submit the form, simply do `form.submit()`. * * The item parameter is not always defined. An item object will be sent if the submit happens after an item from the list has been selected. */ - onSubmit?: (node?: JQuery, form?: any, item?: any, event?: JQueryEventObject) => void, + onSubmit?: (node?: JQuery, form?: any, item?: any, event?: JQueryEventObject) => void; /** * Any time there is text inside the input and it gets cleared (Backspace, Esc, Cancel button, etc). * It is possible to track back the event that cleared the input using event.originalEvent */ - onCancel?: (node?: JQuery, event?: JQueryEventObject) => void, // Triggered if the typeahead had text inside and is cleared + onCancel?: (node?: JQuery, event?: JQueryEventObject) => void; /** When an item in the result list is focused */ - onEnter?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, + onEnter?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void; /** When an item in the result list is blurred */ - onLeave?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void, + onLeave?: (node?: JQuery, item?: any, result?: any, event?: JQueryEventObject) => void; } interface Selector { - container?: string, - result?: string, - list?: string, - group?: string, - item?: string, - empty?: string, - display?: string, - query?: string, - filter?: string, - filterButton?: string, - dropdown?: string, - dropdownItem?: string, - labelContainer?: string, - label?: string, - button?: string, - backdrop?: string, - hint?: string, - cancelButton?: string + container?: string; + result?: string; + list?: string; + group?: string; + item?: string; + empty?: string; + display?: string; + query?: string; + filter?: string; + filterButton?: string; + dropdown?: string; + dropdownItem?: string; + labelContainer?: string; + label?: string; + button?: string; + backdrop?: string; + hint?: string; + cancelButton?: string; } } diff --git a/types/jquery-typeahead/tslint.json b/types/jquery-typeahead/tslint.json index a4c53997aa..e60c15844f 100644 --- a/types/jquery-typeahead/tslint.json +++ b/types/jquery-typeahead/tslint.json @@ -1,79 +1,3 @@ { - "extends": "dtslint/dt.json", - "rules": { - "adjacent-overload-signatures": false, - "array-type": false, - "arrow-return-shorthand": false, - "ban-types": false, - "callable-types": false, - "comment-format": false, - "dt-header": false, - "eofline": false, - "export-just-namespace": false, - "import-spacing": false, - "interface-name": false, - "interface-over-type-literal": false, - "jsdoc-format": false, - "max-line-length": false, - "member-access": false, - "new-parens": false, - "no-any-union": false, - "no-boolean-literal-compare": false, - "no-conditional-assignment": false, - "no-consecutive-blank-lines": false, - "no-construct": false, - "no-declare-current-package": false, - "no-duplicate-imports": false, - "no-duplicate-variable": false, - "no-empty-interface": false, - "no-for-in-array": false, - "no-inferrable-types": false, - "no-internal-module": false, - "no-irregular-whitespace": false, - "no-mergeable-namespace": false, - "no-misused-new": false, - "no-namespace": false, - "no-object-literal-type-assertion": false, - "no-padding": false, - "no-redundant-jsdoc": false, - "no-redundant-jsdoc-2": false, - "no-redundant-undefined": false, - "no-reference-import": false, - "no-relative-import-in-test": false, - "no-self-import": false, - "no-single-declare-module": false, - "no-string-throw": false, - "no-unnecessary-callback-wrapper": false, - "no-unnecessary-class": false, - "no-unnecessary-generics": false, - "no-unnecessary-qualifier": false, - "no-unnecessary-type-assertion": false, - "no-useless-files": false, - "no-var-keyword": false, - "no-var-requires": false, - "no-void-expression": false, - "no-trailing-whitespace": false, - "object-literal-key-quotes": false, - "object-literal-shorthand": false, - "one-line": false, - "one-variable-per-declaration": false, - "only-arrow-functions": false, - "prefer-conditional-expression": false, - "prefer-const": false, - "prefer-declare-function": false, - "prefer-for-of": false, - "prefer-method-signature": false, - "prefer-template": false, - "radix": false, - "semicolon": false, - "space-before-function-paren": false, - "space-within-parens": false, - "strict-export-declare-modifiers": false, - "trim-file": false, - "triple-equals": false, - "typedef-whitespace": false, - "unified-signatures": false, - "void-return": false, - "whitespace": false - } + "extends": "dtslint/dt.json" } \ No newline at end of file