Skip to content

Commit

Permalink
Merge pull request DefinitelyTyped#24384 from denisname/select2-v4-v3
Browse files Browse the repository at this point in the history 
Select2 split v4 and v3
  • Loading branch information
@minestarks
minestarks authored Mar 23, 2018
2 parents 6490e73 + cee3ed3 commit 41f8ac6
Show file tree
Hide file tree
Showing 8 changed files with 588 additions and 162 deletions.
49 changes: 17 additions & 32 deletions types/select2/index.d.ts
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
// Type definitions for Select2 4.0.1
// Type definitions for Select2 4.0
// Project: http://ivaynberg.github.com/select2/
// Definitions by: Boris Yankov <https://github.com/borisyankov>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 2.3


/// <reference types="jquery"/>

interface Select2QueryOptions {
Expand All @@ -14,15 +13,14 @@ interface Select2QueryOptions {
callback?: (result: { results: any; more?: boolean; context?: any; }) => void;
}

interface AjaxFunction {
(settings: JQueryAjaxSettings, success?: (data: any) => null, failure?: () => null): JQueryXHR;
}
type AjaxFunction =
(settings: JQueryAjaxSettings, success?: (data: any) => null, failure?: () => null) => JQueryXHR;

interface Select2AjaxOptions extends JQueryAjaxSettings {
transport?: AjaxFunction;
/**
* Url to make request to, Can be string or a function returning a string.
*/
* Url to make request to, can be string or a function returning a string.
*/
url?: any;
dataType?: string;
delay?: number;
Expand Down Expand Up @@ -66,7 +64,6 @@ interface Select2Options {
formatInputTooShort?: (term: string, minLength: number) => string;
formatSelectionTooBig?: (maxSize: number) => string;
formatLoadMore?: (pageNumber: number) => string;
createSearchChoice?: (term: string, data: any) => any;
initSelection?: (element: JQuery, callback: (data: any) => void) => void;
tokenizer?: (input: string, selection: any[], selectCallback: () => void, options: Select2Options) => string;
tokenSeparators?: string[];
Expand All @@ -82,8 +79,8 @@ interface Select2Options {
escapeMarkup?: (markup: string) => string;
theme?: string;
/**
* Template can return both plain string that will be HTML escaped and a jquery object that can render HTML
*/
* Template can return both plain string that will be HTML escaped and a jquery object that can render HTML
*/
templateSelection?: (object: Select2SelectionObject, container: JQuery) => any;
templateResult?: (object: Select2SelectionObject) => any;
language?: string | string[] | {};
Expand All @@ -92,8 +89,6 @@ interface Select2Options {
dropdownParent?: JQuery;
debug?: boolean;
dropdownAdapter?: any;
selectionAdapter?: any;
resultsAdapter?: any;
}

interface Select2JQueryEventObject extends JQueryEventObject {
Expand Down Expand Up @@ -189,32 +184,22 @@ interface JQuery {
on(events: "change", selector?: string, data?: any, handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "change", selector?: string, handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "change", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-opening", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-open", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-close", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-highlight", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-selecting", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-removing", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-removed", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-loaded", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-focus", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-blur", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-opening", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-open", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-close", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-highlight", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-selecting", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-removing", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-removed", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-loaded", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-focus", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2-blur", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:closing", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:close", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:opening", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:open", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:selecting", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:select", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:unselecting", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
on(events: "select2:unselect", handler?: (eventObject: Select2JQueryEventObject) => any): JQuery;
}

declare class Select2 {
constructor(element: JQuery, options: Select2Options);
focus(): void;
destroy(): void;
// TODO: Don't use 'Function' as a type.
// tslint:disable-next-line:ban-types
on(event: string, callback: Function): void;
selection: any;
dropdown: any;
Expand Down
116 changes: 62 additions & 54 deletions types/select2/select2-tests.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,21 +12,21 @@ $("#e2_3").select2({
$("#e3").select2({
minimumInputLength: 2
});
function format(state) {
function format(state: any) {
if (!state.id) return state.text;
return "<img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png'/>" + state.text;
return `<img class="flag" src="images/flags/${state.id.toLowerCase()}.png"/>` + state.text;
}
$("#e4").select2({
formatResult: format,
formatSelection: format
});
$("#e5").select2({
minimumInputLength: 1,
query: function (query) {
var data = { results: [] }, i, j, s;
for (i = 1; i < 5; i++) {
s = "";
for (j = 0; j < i; j++) { s = s + query.term; }
query(query) {
const data = { results: [] as IdTextPair[] };
for (let i = 1; i < 5; i++) {
let s = "";
for (let j = 0; j < i; j++) { s = s + query.term; }
data.results.push({ id: query.term + i, text: s });
}
}
Expand All @@ -37,7 +37,7 @@ $("#e10").select2({
data: [{ id: 0, text: 'enhancement' }, { id: 1, text: 'bug' }, { id: 2, text: 'duplicate' }, { id: 3, text: 'invalid' }, { id: 4, text: 'wontfix' }]
});

var data = [{ id: 0, tag: 'enhancement' }, { id: 1, tag: 'bug' }, { id: 2, tag: 'duplicate' }, { id: 3, tag: 'invalid' }, { id: 4, tag: 'wontfix' }];
const data = [{ id: 0, tag: 'enhancement' }, { id: 1, tag: 'bug' }, { id: 2, tag: 'duplicate' }, { id: 3, tag: 'invalid' }, { id: 4, tag: 'wontfix' }];

$("#e10_2").select2({
data: { results: data, text: 'tag' },
Expand All @@ -46,47 +46,56 @@ $("#e10_2").select2({
});

$("#e10_3").select2({
data: { results: data, text: function (item) { console.log('called with', item); return item.tag; } },
data: {
results: data,
text: (item: {tag: string}) => {
console.log('called with', item);
return item.tag;
}},
formatSelection: format,
formatResult: format
});
var movieFormatResult, movieFormatSelection;

let movieFormatResult;
let movieFormatSelection;
$("#e6").select2({
placeholder: "Search for a movie",
minimumInputLength: 1,
ajax: {
url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
dataType: 'jsonp',
cache: false,
data: function (params, page) {
data(params, page) {
return {
q: params.term,
page_limit: 10,
apikey: "ju6z9mjyajq2djue3gbvv26t"
};
},
results: function (data, page) {
results(data, page) {
return { results: data.movies };
}
},
formatResult: movieFormatResult,
formatSelection: movieFormatSelection,
dropdownCssClass: "bigdrop"
});

let t: ArrayLike<string>;
$("#e6").select2({
placeholder: "Search for a movie",
minimumInputLength: 1,
ajax: {
url: () => { return "http://api.rottentomatoes.com/api/public/v1.0/movies.json"; },
url: () => "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
dataType: 'jsonp',
data: function (params, page) {
data(params, page) {
return {
q: params.term,
page_limit: 10,
apikey: "ju6z9mjyajq2djue3gbvv26t"
};
},
results: function (data, page) {
results(data, page) {
return { results: data.movies };
}
},
Expand All @@ -102,14 +111,14 @@ $("#e6").select2({
type: 'GET',
dataType: 'jsonp',
cache: false,
data: function (params, page) {
data(params, page) {
return {
q: params.term,
page_limit: 10,
apikey: "ju6z9mjyajq2djue3gbvv26t"
};
},
results: function (data, page) {
results(data, page) {
return { results: data.movies };
}
},
Expand All @@ -124,92 +133,91 @@ $("#e7").select2({
url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
dataType: 'jsonp',
delay: 100,
data: function (params, page) {
data(params, aPage) {
return {
q: params.term,
page_limit: 10,
page: page,
page: aPage,
apikey: "ju6z9mjyajq2djue3gbvv26t"
};
},
results: function (data, page) {
var more = (page * 10) < data.total;
return { results: data.movies, more: more };
results(data, page) {
const moreValue = (page * 10) < data.total;
return { results: data.movies, more: moreValue };
}
},
formatResult: movieFormatResult,
formatSelection: movieFormatSelection,
dropdownCssClass: "bigdrop"
});

function sort(elements) {
function sort(elements: any) {
return elements.sort();
}
$("#e20").select2({
sorter: sort
});

$("#e8").select2();
$("#e8_get").click(function () { alert("Selected value is: " + $("#e8").select2("val")); });
$("#e8_set").click(function () { $("#e8").select2("val", "CA"); });
$("#e8_cl").click(function () { $("#e8").select2("val", ""); });
$("#e8_get2").click(function () { alert("Selected data is: " + JSON.stringify($("#e8").select2("data"))); });
$("#e8_set2").click(function () { $("#e8").select2("data", { id: "CA", text: "California" }); });
$("#e8_open").click(function () { $("#e8").select2("open"); });
$("#e8_close").click(function () { $("#e8").select2("close"); });
$("#e8_get").click(() => alert("Selected value is: " + $("#e8").select2("val")));
$("#e8_set").click(() => $("#e8").select2("val", "CA"));
$("#e8_cl").click(() => $("#e8").select2("val", ""));
$("#e8_get2").click(() => alert("Selected data is: " + JSON.stringify($("#e8").select2("data"))));
$("#e8_set2").click(() => $("#e8").select2("data", { id: "CA", text: "California" }));
$("#e8_open").click(() => $("#e8").select2("open"));
$("#e8_close").click(() => $("#e8").select2("close"));
$("#e8_2").select2();
$("#e8_2_get").click(function () { alert("Selected value is: " + $("#e8_2").select2("val")); });
$("#e8_2_set").click(function () { $("#e8_2").select2("val", ["CA", "MA"]); });
$("#e8_2_get2").click(function () { alert("Selected value is: " + JSON.stringify($("#e8_2").select2("data"))); });
$("#e8_2_set2").click(function () { $("#e8_2").select2("data", [{ id: "CA", text: "California" }, { id: "MA", text: "Massachusetts" }]); });
$("#e8_2_cl").click(function () { $("#e8_2").select2("val", ""); });
$("#e8_2_open").click(function () { $("#e8_2").select2("open"); });
$("#e8_2_close").click(function () { $("#e8_2").select2("close"); });
$("#e8_2_get").click(() => alert("Selected value is: " + $("#e8_2").select2("val")));
$("#e8_2_set").click(() => $("#e8_2").select2("val", ["CA", "MA"]));
$("#e8_2_get2").click(() => alert("Selected value is: " + JSON.stringify($("#e8_2").select2("data"))));
$("#e8_2_set2").click(() => $("#e8_2").select2("data", [{ id: "CA", text: "California" }, { id: "MA", text: "Massachusetts" }]));
$("#e8_2_cl").click(() => $("#e8_2").select2("val", ""));
$("#e8_2_open").click(() => $("#e8_2").select2("open"));
$("#e8_2_close").click(() => $("#e8_2").select2("close"));
$("#e11").select2({
placeholder: "Select report type",
allowClear: true,
data: [{ id: 0, text: 'story' }, { id: 1, text: 'bug' }, { id: 2, text: 'task' }]
});
$("#e11_2").select2({
createSearchChoice: function (term, data) { if ($(data).filter(function () { return this.textContent.localeCompare(term) === 0; }).length === 0) { return { id: term, text: term }; } },
multiple: true,
data: [{ id: 0, text: 'story' }, { id: 1, text: 'bug' }, { id: 2, text: 'task' }]
});
function log(e) {
var item = $("<li>" + e + "</li>");
function log(e: string) {
const item = $(`<li>${e}</li>`);
$("#events_11").append(item);
item.animate({ opacity: 1 }, 10000, 'linear', function () { item.animate({ opacity: 0 }, 2000, 'linear', function () { item.remove(); }); });
item.animate({ opacity: 1 }, 10000, 'linear', () => item.animate({ opacity: 0 }, 2000, 'linear', () => item.remove()));
}
$("#e11")
// TS 0.9.5: correct overload not resolved https://typescript.codeplex.com/discussions/472172
.on("change", function (e: Select2JQueryEventObject) { log(JSON.stringify({ val: e.val, added: e.added, removed: e.removed })); })
.on("open", function () { log("open"); });
.on("change", (e: Select2JQueryEventObject) => log(JSON.stringify({ val: e.val, added: e.added, removed: e.removed })))
.on("open", () => log("open"));
$("#e11_2")
.on("change", function (e: Select2JQueryEventObject) { log(JSON.stringify({ val: e.val, added: e.added, removed: e.removed })); })
.on("open", function () { log("open"); });
.on("change", (e: Select2JQueryEventObject) => log(JSON.stringify({ val: e.val, added: e.added, removed: e.removed })))
.on("open", () => log("open"));
$("#e12").select2({ tags: ["red", "green", "blue"] });
$("#e20").select2({
tags: ["red", "green", "blue"],
tokenSeparators: [",", " "]
});
$("#e13").select2();
$("#e13_ca").click(function () { $("#e13").val("CA").trigger("change"); });
$("#e13_ak_co").click(function () { $("#e13").val(["AK", "CO"]).trigger("change"); });
$("#e13_ca").click(() => $("#e13").val("CA").trigger("change"));
$("#e13_ak_co").click(() => $("#e13").val(["AK", "CO"]).trigger("change"));
$("#e14").val(["AL", "AZ"]).select2();
$("#e14_init").click(function () { $("#e14").select2(); });
$("#e14_destroy").click(function () { $("#e14").select2("destroy"); });
$("#e14_init").click(() => $("#e14").select2());
$("#e14_destroy").click(() => $("#e14").select2("destroy"));
$("#e15").select2({ tags: ["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"] });
$("#e15").on("change", function () { $("#e15_val").html($("#e15").val() as string); });
$("#e15").on("change", () => $("#e15_val").html($("#e15").val() as string));

$("#e16").select2();
$("#e16_2").select2();
$("#e16_enable").click(function () { $("#e16,#e16_2").select2("enable"); });
$("#e16_disable").click(function () { $("#e16,#e16_2").select2("disable"); });
$("#e16_enable").click(() => $("#e16,#e16_2").select2("enable"));
$("#e16_disable").click(() => $("#e16,#e16_2").select2("disable"));
$("#e17").select2({
matcher: function (term, text) { return text.toUpperCase().indexOf(term.toUpperCase()) == 0; }
matcher: (term, text) => text.toUpperCase().indexOf(term.toUpperCase()) === 0
});
$("#e17_2").select2({
matcher: function (term, text, opt) {
matcher: (term, text, opt) => {
return text.toUpperCase().indexOf(term.toUpperCase()) >= 0
|| opt.attr("alt").toUpperCase().indexOf(term.toUpperCase()) >= 0;
}
Expand Down
4 changes: 2 additions & 2 deletions types/select2/tsconfig.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"es6",
"dom"
],
"noImplicitAny": false,
"noImplicitThis": false,
"noImplicitAny": true,
"noImplicitThis": true,
"strictNullChecks": false,
"strictFunctionTypes": true,
"baseUrl": "../",
Expand Down
Loading

0 comments on commit 41f8ac6

Please sign in to comment.