mirror of
https://github.com/FlipsideCrypto/DefinitelyTyped.git
synced 2026-02-06 10:56:53 +00:00
[semantic-ui-modal] Add type definitions (#16943)
This commit is contained in:
parent
277b8a1629
commit
d18c243d4e
286
types/semantic-ui-modal/global.d.ts
vendored
Normal file
286
types/semantic-ui-modal/global.d.ts
vendored
Normal file
@ -0,0 +1,286 @@
|
||||
interface JQuery {
|
||||
modal: SemanticUI.Modal;
|
||||
}
|
||||
|
||||
declare namespace SemanticUI {
|
||||
interface Modal {
|
||||
settings: ModalSettings;
|
||||
|
||||
/**
|
||||
* Shows the modal
|
||||
*/
|
||||
(behavior: 'show'): JQuery;
|
||||
/**
|
||||
* Hides the modal
|
||||
*/
|
||||
(behavior: 'hide'): JQuery;
|
||||
/**
|
||||
* Toggles the modal
|
||||
*/
|
||||
(behavior: 'toggle'): JQuery;
|
||||
/**
|
||||
* Refreshes centering of modal on page
|
||||
*/
|
||||
(behavior: 'refresh'): JQuery;
|
||||
/**
|
||||
* Shows associated page dimmer
|
||||
*/
|
||||
(behavior: 'show dimmer'): JQuery;
|
||||
/**
|
||||
* Hides associated page dimmer
|
||||
*/
|
||||
(behavior: 'hide dimmer'): JQuery;
|
||||
/**
|
||||
* Hides all modals not selected modal in a dimmer
|
||||
*/
|
||||
(behavior: 'hide others'): JQuery;
|
||||
/**
|
||||
* Hides all visible modals in the same dimmer
|
||||
*/
|
||||
(behavior: 'hide all'): JQuery;
|
||||
/**
|
||||
* Caches current modal size
|
||||
*/
|
||||
(behavior: 'cache sizes'): JQuery;
|
||||
/**
|
||||
* Returns whether the modal can fit on the page
|
||||
*/
|
||||
(behavior: 'can fit'): boolean;
|
||||
/**
|
||||
* Returns whether the modal is active
|
||||
*/
|
||||
(behavior: 'is active'): boolean;
|
||||
/**
|
||||
* Sets modal to active
|
||||
*/
|
||||
(behavior: 'set active'): JQuery;
|
||||
(behavior: 'attach events', selector: string | JQuery, event?: string): JQuery;
|
||||
(behavior: 'destroy'): JQuery;
|
||||
<K extends keyof ModalSettings>(behavior: 'setting', name: K, value?: undefined): ModalSettings[K];
|
||||
<K extends keyof ModalSettings>(behavior: 'setting', name: K, value: ModalSettings[K]): JQuery;
|
||||
(behavior: 'setting', value: ModalSettings.Param): JQuery;
|
||||
(settings?: ModalSettings.Param): JQuery;
|
||||
}
|
||||
|
||||
/**
|
||||
* @see {@link http://semantic-ui.com/modules/modal.html#/settings}
|
||||
*/
|
||||
interface ModalSettings extends Pick<ModalSettings._Impl, keyof ModalSettings._Impl> { }
|
||||
|
||||
namespace ModalSettings {
|
||||
type Param = ModalSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
// region Modal Settings
|
||||
|
||||
/**
|
||||
* If set to false will prevent the modal from being moved to inside the dimmer
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
detachable: boolean;
|
||||
/**
|
||||
* When true, the first form input inside the modal will receive focus when shown. Set this to false to prevent this behavior.
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
autofocus: boolean;
|
||||
/**
|
||||
* Whether any change in modal DOM should automatically refresh cached positions
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
observeChanges: boolean;
|
||||
/**
|
||||
* If set to true will not close other visible modals when opening a new one
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
allowMultiple: boolean;
|
||||
/**
|
||||
* Whether to automatically bind keyboard shortcuts
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
keyboardShortcuts: boolean;
|
||||
/**
|
||||
* A vertical offset to allow for content outside of modal, for example a close button, to be centered.
|
||||
*
|
||||
* @default 0
|
||||
*/
|
||||
offset: number;
|
||||
/**
|
||||
* Selector or jquery object specifying the area to dim
|
||||
*
|
||||
* @default 'body'
|
||||
*/
|
||||
context: string | JQuery;
|
||||
/**
|
||||
* Setting to false will not allow you to close the modal by clicking on the dimmer
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
closable: boolean;
|
||||
/**
|
||||
* You can specify custom settings to extend UI dimmer
|
||||
*
|
||||
* @see {@link http://semantic-ui.com/modules/dimmer.html}
|
||||
*/
|
||||
dimmerSettings: DimmerSettings;
|
||||
/**
|
||||
* Named transition to use when animating menu in and out, full list can be found in ui transitions docs.
|
||||
*
|
||||
* @default 'scale'
|
||||
* @see {@link http://semantic-ui.com/modules/transition.html}
|
||||
*/
|
||||
transition: string;
|
||||
/**
|
||||
* Duration of animation
|
||||
*
|
||||
* @default 400
|
||||
*/
|
||||
duration: number;
|
||||
/**
|
||||
* Whether additional animations should queue
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
queue: boolean;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Callbacks
|
||||
|
||||
/**
|
||||
* Is called when a modal starts to show.
|
||||
*/
|
||||
onShow(this: JQuery): void;
|
||||
/**
|
||||
* Is called after a modal has finished showing animating.
|
||||
*/
|
||||
onVisible(this: JQuery): void;
|
||||
/**
|
||||
* Is called after a modal starts to hide. If the function returns false, the modal will not hide.
|
||||
*/
|
||||
onHide(this: JQuery, $element: JQuery): false | void;
|
||||
/**
|
||||
* Is called after a modal has finished hiding animation.
|
||||
*/
|
||||
onHidden(this: JQuery): void;
|
||||
/**
|
||||
* Is called after a positive, approve or ok button is pressed. If the function returns false, the modal will not hide.
|
||||
*/
|
||||
onApprove(this: JQuery, $element: JQuery): false | void;
|
||||
/**
|
||||
* Is called after a negative, deny or cancel button is pressed. If the function returns false the modal will not hide.
|
||||
*/
|
||||
onDeny(this: JQuery, $element: JQuery): false | void;
|
||||
|
||||
// endregion
|
||||
|
||||
// region DOM Settings
|
||||
|
||||
selector: Modal.SelectorSettings;
|
||||
className: Modal.ClassNameSettings;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Debug Settings
|
||||
|
||||
error: Modal.ErrorSettings;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Component Settings
|
||||
|
||||
// region DOM Settings
|
||||
|
||||
/**
|
||||
* Event namespace. Makes sure module teardown does not effect other events attached to an element.
|
||||
*/
|
||||
namespace: string;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Debug Settings
|
||||
|
||||
/**
|
||||
* Name used in log statements
|
||||
*/
|
||||
name: string;
|
||||
/**
|
||||
* Silences all console output including error messages, regardless of other debug settings.
|
||||
*/
|
||||
silent: boolean;
|
||||
/**
|
||||
* Debug output to console
|
||||
*/
|
||||
debug: boolean;
|
||||
/**
|
||||
* Show console.table output with performance metrics
|
||||
*/
|
||||
performance: boolean;
|
||||
/**
|
||||
* Debug output includes all internal behaviors
|
||||
*/
|
||||
verbose: boolean;
|
||||
|
||||
// endregion
|
||||
|
||||
// endregion
|
||||
}
|
||||
}
|
||||
|
||||
namespace Modal {
|
||||
interface SelectorSettings extends Pick<SelectorSettings._Impl, keyof SelectorSettings._Impl> { }
|
||||
|
||||
namespace SelectorSettings {
|
||||
type Param = SelectorSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default '.close, .actions .button'
|
||||
*/
|
||||
close: string;
|
||||
/**
|
||||
* @default '.actions .positive, .actions .approve, .actions .ok'
|
||||
*/
|
||||
approve: string;
|
||||
/**
|
||||
* @default '.actions .negative, .actions .deny, .actions .cancel'
|
||||
*/
|
||||
deny: string;
|
||||
}
|
||||
}
|
||||
|
||||
interface ClassNameSettings extends Pick<ClassNameSettings._Impl, keyof ClassNameSettings._Impl> { }
|
||||
|
||||
namespace ClassNameSettings {
|
||||
type Param = ClassNameSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default 'active'
|
||||
*/
|
||||
active: string;
|
||||
/**
|
||||
* @default 'scrolling'
|
||||
*/
|
||||
scrolling: string;
|
||||
}
|
||||
}
|
||||
|
||||
interface ErrorSettings extends Pick<ErrorSettings._Impl, keyof ErrorSettings._Impl> { }
|
||||
|
||||
namespace ErrorSettings {
|
||||
type Param = ErrorSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default 'The method you called is not defined.'
|
||||
*/
|
||||
method: string;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
12
types/semantic-ui-modal/index.d.ts
vendored
Normal file
12
types/semantic-ui-modal/index.d.ts
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
// Type definitions for semantic-ui-modal 2.2
|
||||
// Project: http://www.semantic-ui.com
|
||||
// Definitions by: Leonard Thieu <https://github.com/leonard-thieu>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
// TypeScript Version: 2.2
|
||||
|
||||
/// <reference types="jquery" />
|
||||
/// <reference types="semantic-ui-dimmer" />
|
||||
/// <reference path="global.d.ts" />
|
||||
|
||||
declare const modal: SemanticUI.Modal;
|
||||
export = modal;
|
||||
139
types/semantic-ui-modal/semantic-ui-modal-tests.ts
Normal file
139
types/semantic-ui-modal/semantic-ui-modal-tests.ts
Normal file
@ -0,0 +1,139 @@
|
||||
function test_modal_static() {
|
||||
$.fn.modal.settings.error.method = 'method';
|
||||
$.fn.modal.settings.namespace = 'namespace';
|
||||
$.fn.modal.settings.name = 'name';
|
||||
$.fn.modal.settings.silent = false;
|
||||
$.fn.modal.settings.debug = true;
|
||||
$.fn.modal.settings.performance = true;
|
||||
$.fn.modal.settings.verbose = true;
|
||||
}
|
||||
|
||||
function test_modal() {
|
||||
const selector = '.ui.modal';
|
||||
$(selector).modal('show') === $();
|
||||
$(selector).modal('hide') === $();
|
||||
$(selector).modal('toggle') === $();
|
||||
$(selector).modal('refresh') === $();
|
||||
$(selector).modal('show dimmer') === $();
|
||||
$(selector).modal('hide dimmer') === $();
|
||||
$(selector).modal('hide others') === $();
|
||||
$(selector).modal('hide all') === $();
|
||||
$(selector).modal('cache sizes') === $();
|
||||
$(selector).modal('can fit') === true;
|
||||
$(selector).modal('is active') === true;
|
||||
$(selector).modal('set active') === $();
|
||||
$(selector).modal('attach events', 'selector', 'blur') === $();
|
||||
$(selector).modal('destroy') === $();
|
||||
$(selector).modal('setting', 'debug', undefined) === false;
|
||||
$(selector).modal('setting', 'debug') === false;
|
||||
$(selector).modal('setting', 'debug', true) === $();
|
||||
$(selector).modal('setting', {
|
||||
namespace: 'namespace',
|
||||
name: 'name',
|
||||
silent: false,
|
||||
debug: true,
|
||||
performance: true,
|
||||
verbose: true
|
||||
}) === $();
|
||||
$(selector).modal({
|
||||
detachable: true,
|
||||
autofocus: false,
|
||||
observeChanges: true,
|
||||
allowMultiple: false,
|
||||
keyboardShortcuts: true,
|
||||
offset: 10,
|
||||
context: $(),
|
||||
closable: false,
|
||||
dimmerSettings: {
|
||||
opacity: 1,
|
||||
variation: 'variation',
|
||||
dimmerName: 'dimmerName',
|
||||
closable: true,
|
||||
on: 'click',
|
||||
useCSS: true,
|
||||
duration: {
|
||||
show: 200,
|
||||
hide: 300
|
||||
},
|
||||
transition: 'fade',
|
||||
onShow() {
|
||||
this === $();
|
||||
},
|
||||
onHide() {
|
||||
this === $();
|
||||
},
|
||||
onChange() {
|
||||
this === $();
|
||||
},
|
||||
selector: {
|
||||
dimmable: '.dimmable',
|
||||
dimmer: '.dimmer',
|
||||
content: '.content'
|
||||
},
|
||||
template: {
|
||||
dimmer() {
|
||||
return $();
|
||||
}
|
||||
},
|
||||
className: {
|
||||
active: 'active',
|
||||
dimmable: 'dimmable',
|
||||
dimmed: 'dimmed',
|
||||
disabled: 'disabled',
|
||||
pageDimmer: 'pageDimmer',
|
||||
hide: 'hide',
|
||||
show: 'show',
|
||||
transition: 'transition'
|
||||
},
|
||||
error: {
|
||||
method: 'method'
|
||||
}
|
||||
},
|
||||
transition: 'scale',
|
||||
duration: 400,
|
||||
queue: true,
|
||||
onShow() {
|
||||
this === $();
|
||||
},
|
||||
onVisible() {
|
||||
this === $();
|
||||
},
|
||||
onHide($element) {
|
||||
this === $();
|
||||
$element === $();
|
||||
return false;
|
||||
},
|
||||
onHidden() {
|
||||
this === $();
|
||||
},
|
||||
onApprove($element) {
|
||||
this === $();
|
||||
$element === $();
|
||||
return false;
|
||||
},
|
||||
onDeny($element) {
|
||||
this === $();
|
||||
$element === $();
|
||||
return false;
|
||||
},
|
||||
selector: {
|
||||
close: 'close',
|
||||
approve: 'approve',
|
||||
deny: 'deny'
|
||||
},
|
||||
className: {
|
||||
active: 'active',
|
||||
scrolling: 'scrolling'
|
||||
},
|
||||
error: {
|
||||
method: 'method'
|
||||
}
|
||||
}) === $();
|
||||
$(selector).modal() === $();
|
||||
}
|
||||
|
||||
import modal = require('semantic-ui-modal');
|
||||
|
||||
function test_module() {
|
||||
$.fn.modal = modal;
|
||||
}
|
||||
24
types/semantic-ui-modal/tsconfig.json
Normal file
24
types/semantic-ui-modal/tsconfig.json
Normal file
@ -0,0 +1,24 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"module": "commonjs",
|
||||
"lib": [
|
||||
"es6",
|
||||
"dom"
|
||||
],
|
||||
"noImplicitAny": true,
|
||||
"noImplicitThis": true,
|
||||
"strictNullChecks": true,
|
||||
"baseUrl": "../",
|
||||
"typeRoots": [
|
||||
"../"
|
||||
],
|
||||
"types": [],
|
||||
"noEmit": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
},
|
||||
"files": [
|
||||
"index.d.ts",
|
||||
"global.d.ts",
|
||||
"semantic-ui-modal-tests.ts"
|
||||
]
|
||||
}
|
||||
7
types/semantic-ui-modal/tslint.json
Normal file
7
types/semantic-ui-modal/tslint.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"extends": "dtslint/dt.json",
|
||||
"rules": {
|
||||
"no-empty-interface": false,
|
||||
"unified-signatures": false
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user