From c6cfed730f542b69a71de5ccd694aafb7cf251ad Mon Sep 17 00:00:00 2001 From: denisname Date: Thu, 4 Oct 2018 19:56:42 +0200 Subject: [PATCH] Update type definition (#29287) --- types/bootstrap/v3/bootstrap-tests.ts | 277 +++++++++++++++++++++++--- types/bootstrap/v3/index.d.ts | 172 ++++++++-------- types/bootstrap/v3/tsconfig.json | 2 +- types/bootstrap/v3/tslint.json | 75 +------ 4 files changed, 340 insertions(+), 186 deletions(-) diff --git a/types/bootstrap/v3/bootstrap-tests.ts b/types/bootstrap/v3/bootstrap-tests.ts index cd786b41a7..00a8fa44fd 100644 --- a/types/bootstrap/v3/bootstrap-tests.ts +++ b/types/bootstrap/v3/bootstrap-tests.ts @@ -1,48 +1,267 @@ -$('body').off('.data-api'); -$('body').off('.alert.data-api'); +// -------------------------------------------------------------------------------------- +// Modal +// -------------------------------------------------------------------------------------- -$(".btn.danger").button("toggle").addClass("fat"); -$("#myModal").modal(); -$("#myModal").modal({ keyboard: false }); -$("#myModal").modal('show'); +$(".modal").modal(); -$('#myModal').on('show', (e) => e.preventDefault()); +$(".modal").modal("show"); -$('#myModal').modal({ keyboard: false }); -$('#myModal').modal('toggle'); +$(".modal").modal("toggle"); -$('.dropdown-toggle').dropdown(); +$(".modal").modal("handleUpdate"); -$('#navbar').scrollspy(); -$('body').scrollspy({ target: '#navbar-example' }); +$(".modal").modal({ + backdrop: "static", + keyboard: false, + show: true, + remote: "remote.html", +}); -$('#element').tooltip('show'); +$(".modal").modal({ + backdrop: false, +}); -$('#element').popover('show'); +// -------------------------------------------------------------------------------------- +// Dropdown +// -------------------------------------------------------------------------------------- + +$(".dropdown").dropdown(); + +$(".dropdown").dropdown("toggle"); + +// -------------------------------------------------------------------------------------- +// Scrollspy +// -------------------------------------------------------------------------------------- + +$(".navbar").scrollspy(); + +$(".navbar").scrollspy("refresh"); + +$(".navbar").scrollspy({ + target: "#navbar-example", + offset: 10, +}); + +// -------------------------------------------------------------------------------------- +// Tooltip +// -------------------------------------------------------------------------------------- + +$("#element").tooltip(); + +$("#element").tooltip("show"); + +$("#element").tooltip({ + animation: true, + container: false, + delay: 0, + html: false, + placement: "top", + selector: ".selector", + template: '', + title: "", + trigger: "hover focus", + viewport: { selector: "body", padding: 0 }, +}); + +$("#element").tooltip({ + container: "body", +}); + +$("#element").tooltip({ + delay: { show: 500, hide: 100 }, +}); + +$("#element").tooltip({ + placement() { return "top"; }, +}); + +$("#element").tooltip({ + placement(tooltip: HTMLElement, trigger: Element) { + console.log(this.options.delay); + return "top"; + }, +}); + +$("#element").tooltip({ + placement(tooltip: HTMLElement, trigger: Element) { + // $ExpectError + console.log(this.options.content); // only for PopoverOption, not TooltipOption + return "top"; + }, +}); + +$("#element").tooltip({ + title() { return this.id; }, +}); + +$("#element").tooltip({ + viewport: "body", +}); + +// -------------------------------------------------------------------------------------- +// Popover +// -------------------------------------------------------------------------------------- + +$("#element").popover(); + +$("#element").popover("show"); + +$("#element").popover({ + animation: true, + container: false, + content: "content", + delay: 0, + html: false, + placement: "top", + selector: ".selector", + template: '', + title: "", + trigger: "hover focus", + viewport: { selector: "body", padding: 0 }, +}); + +$("#element").popover({ + container: "body", +}); + +$("#element").popover({ + content() { return `Elem id: ${this.id}`; }, +}); + +$("#element").popover({ + delay: { show: 500, hide: 100 }, +}); + +$("#element").popover({ + placement() { return "top"; }, +}); + +$("#element").popover({ + placement(tooltip: HTMLElement, trigger: Element) { + console.log(this.options.content); + return "top"; + }, +}); + +$("#element").popover({ + title() { return `Elem id: ${this.id}`; }, +}); + +$("#element").popover({ + viewport: "body", +}); + +// -------------------------------------------------------------------------------------- +// Alert +// -------------------------------------------------------------------------------------- $(".alert").alert(); -$(".alert").alert('close'); -$('.nav-tabs').button(); -$().button('toggle'); +$(".alert").alert("close"); + +// -------------------------------------------------------------------------------------- +// Button +// -------------------------------------------------------------------------------------- + +$(".btn").button(); + +$(".btn").button("toggle"); + +$(".btn").button("reset"); + +$(".btn").button("Swaps text to any data defined text state."); + +// -------------------------------------------------------------------------------------- +// Collapse +// -------------------------------------------------------------------------------------- $(".collapse").collapse(); -$('#myCollapsible').collapse({ toggle: false }); +$(".collapse").collapse("toggle"); -$('.carousel').carousel(); -$('.carousel').carousel({ interval: 2000 }); - -$('.typeahead').typeahead({ - matcher: item => true, - sorter: (items: any[]) => items, - updater: item => item, - highlighter: item => "" +$(".collapse").collapse({ + parent: "#selector", + toggle: false, }); -$('#navbar').affix(); +// -------------------------------------------------------------------------------------- +// Carousel +// -------------------------------------------------------------------------------------- -$('.item').emulateTransitionEnd(2000); +$(".carousel").carousel(); + +$(".carousel").carousel("cycle"); + +$(".carousel").carousel(200); + +$(".carousel").carousel({ + interval: 2000, + pause: "hover", + wrap: true, + keyboard: false, +}); + +$(".carousel").carousel({ + interval: false, +}); + +$(".carousel").carousel({ + pause: null, +}); + +// -------------------------------------------------------------------------------------- +// Affix +// -------------------------------------------------------------------------------------- + +$(".affix").affix(); + +$(".affix").affix("checkPosition"); + +$(".affix").affix({ + offset: 10, + target: window, +}); + +$(".affix").affix({ + offset: { top: 10, bottom: 5 }, +}); + +$(".affix").affix({ + offset: { top: 10 }, +}); + +$(".affix").affix({ + offset: { bottom: () => 10 }, +}); + +$(".affix").affix({ + offset: { + top: 100, + bottom() { + const that = this as BootstrapOffset; + return (that.bottom = $(".footer").outerHeight(true)!); + }, + } +}); + +$(".affix").affix({ + target: ".selector", +}); + +$(".affix").affix({ + target: document.getElementById("id")!, +}); + +$(".affix").affix({ + target: $("#id"), +}); + +// -------------------------------------------------------------------------------------- +// Transition +// -------------------------------------------------------------------------------------- + +$(".item").emulateTransitionEnd(2000); $.support.transition = false; -console.log(($.support.transition as any as TransitionEventNames).end === "transitionend"); + +console.log(($.support.transition as TransitionEventNames).end === "transitionend"); diff --git a/types/bootstrap/v3/index.d.ts b/types/bootstrap/v3/index.d.ts index 06142cc1d1..a6ddbeb1f8 100644 --- a/types/bootstrap/v3/index.d.ts +++ b/types/bootstrap/v3/index.d.ts @@ -1,21 +1,49 @@ -// Type definitions for Bootstrap 3.3.5 +// Type definitions for Bootstrap 3.3 // Project: http://twitter.github.com/bootstrap/ // Definitions by: Boris Yankov +// denisname // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 - /// -interface ModalOptions { - backdrop?: boolean|string; - keyboard?: boolean; - show?: boolean; - remote?: string; +// -------------------------------------------------------------------------- +// Some Types and Interfaces +// -------------------------------------------------------------------------- + +type BootstrapPlacement = "auto" | "top" | "bottom" | "left" | "right"; + +type BootstrapTrigger = "click" | "hover" | "focus" | "manual" | + "click hover" | "click focus" | "hover focus" | + "click hover focus"; + +type BootstrapDynamicOffset = (elem: JQuery) => number; + +interface BootstrapDelay { + show?: number; + hide?: number; } -interface ModalOptionsBackdropString { - backdrop?: string; // for "static" +interface BootstrapOffset { + top?: number | BootstrapDynamicOffset; + bottom?: number | BootstrapDynamicOffset; +} + +interface BootstrapViewport { + padding?: number; + selector: string; +} + +interface TooltipInstance { + options: T; +} + +// -------------------------------------------------------------------------------------- +// Options Interfaces +// -------------------------------------------------------------------------------------- + +interface ModalOptions { + backdrop?: boolean | "static"; keyboard?: boolean; show?: boolean; remote?: string; @@ -28,103 +56,83 @@ interface ScrollSpyOptions { interface TooltipOptions { animation?: boolean; + container?: string | false; + delay?: number | BootstrapDelay; html?: boolean; - placement?: string | Function; + placement?: BootstrapPlacement | ((this: TooltipInstance, tooltip: HTMLElement, trigger: Element) => BootstrapPlacement); selector?: string; - title?: string | Function; - trigger?: string; template?: string; - delay?: number | Object; - container?: string | boolean; - viewport?: string | Function | Object; + title?: string | ((this: Element) => string); + trigger?: BootstrapTrigger; + viewport?: string | BootstrapViewport; } -interface PopoverOptions { - animation?: boolean; - html?: boolean; - placement?: string | Function; - selector?: string; - trigger?: string; - title?: string | Function; - template?: string; - content?: any; - delay?: number | Object; - container?: string | boolean; - viewport?: string | Function | Object; +interface PopoverOptions extends TooltipOptions { + content?: string | ((this: Element) => string); } interface CollapseOptions { - parent?: any; + parent?: string | false; toggle?: boolean; } interface CarouselOptions { - interval?: number; - pause?: string; + interval?: number | false; + pause?: "hover" | null; wrap?: boolean; keyboard?: boolean; } -interface TypeaheadOptions { - source?: any; - items?: number; - minLength?: number; - matcher?: (item: any) => boolean; - sorter?: (items: any[]) => any[]; - updater?: (item: any) => any; - highlighter?: (item: any) => string; +interface AffixOptions { + offset?: number | BootstrapOffset; + target?: string | Node | JQuery | Window; } -interface AffixOptions { - offset?: number | Function | Object; - target?: any; +// -------------------------------------------------------------------------------------- +// jQuery +// -------------------------------------------------------------------------------------- + +interface JQuery { + modal(action?: "toggle" | "show" | "hide" | "handleUpdate"): JQuery; + modal(options: ModalOptions): JQuery; + + dropdown(action?: "toggle"): JQuery; + + scrollspy(action?: "refresh"): JQuery; + scrollspy(options: ScrollSpyOptions): JQuery; + + tab(action?: "show"): JQuery; + + tooltip(action?: "show" | "hide" | "toggle" | "destroy"): JQuery; + tooltip(options: TooltipOptions): JQuery; + + popover(action?: "show" | "hide" | "toggle" | "destroy"): JQuery; + popover(options: PopoverOptions): JQuery; + + alert(action?: "close"): JQuery; + + button(action?: "toggle" | "reset" | string): JQuery; + + collapse(action?: "toggle" | "show" | "hide"): JQuery; + collapse(options: CollapseOptions): JQuery; + + carousel(action?: "cycle" | "pause" | number | "prev" | "next"): JQuery; + carousel(options: CarouselOptions): JQuery; + + affix(action?: "checkPosition"): JQuery; + affix(options: AffixOptions): JQuery; + + emulateTransitionEnd(duration: number): JQuery; } +// -------------------------------------------------------------------------------------- +// Other +// -------------------------------------------------------------------------------------- + interface TransitionEventNames { end: string; } -interface JQuery { - modal(options?: ModalOptions): JQuery; - modal(options?: ModalOptionsBackdropString): JQuery; - modal(command: string, relatedTarget?: Element): JQuery; - - dropdown(): JQuery; - dropdown(command: string): JQuery; - - scrollspy(command: string): JQuery; - scrollspy(options?: ScrollSpyOptions): JQuery; - - tab(): JQuery; - tab(command: string): JQuery; - - tooltip(options?: TooltipOptions): JQuery; - tooltip(command: string): JQuery; - - popover(options?: PopoverOptions): JQuery; - popover(command: string): JQuery; - - alert(): JQuery; - alert(command: string): JQuery; - - button(): JQuery; - button(command: string): JQuery; - - collapse(options?: CollapseOptions): JQuery; - collapse(command: string): JQuery; - - carousel(options?: CarouselOptions): JQuery; - carousel(command: string): JQuery; - carousel(index: number): JQuery; - - typeahead(options?: TypeaheadOptions): JQuery; - - affix(options?: AffixOptions): JQuery; - affix(command: string): JQuery; - - emulateTransitionEnd(duration: number): JQuery; -} - interface JQuerySupport { transition: boolean | TransitionEventNames; } diff --git a/types/bootstrap/v3/tsconfig.json b/types/bootstrap/v3/tsconfig.json index 585af4f8b2..38477cd68e 100644 --- a/types/bootstrap/v3/tsconfig.json +++ b/types/bootstrap/v3/tsconfig.json @@ -7,7 +7,7 @@ ], "noImplicitAny": true, "noImplicitThis": true, - "strictNullChecks": false, + "strictNullChecks": true, "strictFunctionTypes": true, "baseUrl": "../../", "typeRoots": [ diff --git a/types/bootstrap/v3/tslint.json b/types/bootstrap/v3/tslint.json index a41bf5d19a..075fa88707 100644 --- a/types/bootstrap/v3/tslint.json +++ b/types/bootstrap/v3/tslint.json @@ -1,79 +1,6 @@ { "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-single-declare-module": false } }