mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-08-12 13:00:19 +00:00
[semantic-ui-sidebar] Add type definitions. (#16974)
This commit is contained in:
Leonard Thieu
committed by
Mohamed Hegazy
Mohamed Hegazy
parent
65f13e0eef
commit
f61658bca2
+424
@@ -0,0 +1,424 @@
|
||||
interface JQuery {
|
||||
sidebar: SemanticUI.Sidebar;
|
||||
}
|
||||
|
||||
declare namespace SemanticUI {
|
||||
interface Sidebar {
|
||||
settings: SidebarSettings;
|
||||
|
||||
/**
|
||||
* Attaches sidebar action to given selector. Default event if none specified is toggle
|
||||
*/
|
||||
(behavior: 'attach events', selector: string | JQuery, event?: string): JQuery;
|
||||
/**
|
||||
* Shows sidebar
|
||||
*/
|
||||
(behavior: 'show'): JQuery;
|
||||
/**
|
||||
* Hides sidebar
|
||||
*/
|
||||
(behavior: 'hide'): JQuery;
|
||||
/**
|
||||
* Toggles visibility of sidebar
|
||||
*/
|
||||
(behavior: 'toggle'): JQuery;
|
||||
/**
|
||||
* Returns whether sidebar is visible
|
||||
*/
|
||||
(behavior: 'is visible'): boolean;
|
||||
/**
|
||||
* Returns whether sidebar is hidden
|
||||
*/
|
||||
(behavior: 'is hidden'): boolean;
|
||||
/**
|
||||
* Pushes page content to be visible alongside sidebar
|
||||
*/
|
||||
(behavior: 'push page'): JQuery;
|
||||
/**
|
||||
* Returns direction of current sidebar
|
||||
*/
|
||||
(behavior: 'get direction'): string;
|
||||
/**
|
||||
* Returns page content to original position
|
||||
*/
|
||||
(behavior: 'pull page'): JQuery;
|
||||
/**
|
||||
* Adds stylesheet to page head to trigger sidebar animations
|
||||
*/
|
||||
(behavior: 'add body CSS'): JQuery;
|
||||
/**
|
||||
* Removes any inline stylesheets for sidebar animation
|
||||
*/
|
||||
(behavior: 'remove body CSS'): JQuery;
|
||||
/**
|
||||
* Returns vendor prefixed transition end event
|
||||
*/
|
||||
(behavior: 'get transition event'): string;
|
||||
(behavior: 'destroy'): JQuery;
|
||||
<K extends keyof SidebarSettings>(behavior: 'setting', name: K, value?: undefined): SidebarSettings[K];
|
||||
<K extends keyof SidebarSettings>(behavior: 'setting', name: K, value: SidebarSettings[K]): JQuery;
|
||||
(behavior: 'setting', value: SidebarSettings.Param): JQuery;
|
||||
(settings?: SidebarSettings.Param): JQuery;
|
||||
}
|
||||
|
||||
/**
|
||||
* @see {@link http://semantic-ui.com/modules/sidebar.html#/settings}
|
||||
*/
|
||||
interface SidebarSettings extends Pick<SidebarSettings._Impl, keyof SidebarSettings._Impl> { }
|
||||
|
||||
namespace SidebarSettings {
|
||||
type Param = SidebarSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
// region Behavior
|
||||
|
||||
/**
|
||||
* Context which sidebar will appear inside
|
||||
*
|
||||
* @default 'body'
|
||||
*/
|
||||
context: string | JQuery;
|
||||
/**
|
||||
* Whether multiple sidebars can be open at once
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
exclusive: boolean;
|
||||
/**
|
||||
* Whether sidebar can be closed by clicking on page
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
closable: boolean;
|
||||
/**
|
||||
* Whether to dim page contents when sidebar is visible
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
dimPage: boolean;
|
||||
/**
|
||||
* Whether to lock page scroll when sidebar is visible
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
scrollLock: boolean;
|
||||
/**
|
||||
* Whether to return to original scroll position when sidebar is hidden, automatically occurs with transition: scale
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
returnScroll: boolean;
|
||||
/**
|
||||
* When sidebar is initialized without the proper HTML, using this option will defer creation of DOM to use requestAnimationFrame.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
delaySetup: boolean;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Animation
|
||||
|
||||
/**
|
||||
* Named transition to use when animating sidebar. Defaults to 'auto' which selects transition from defaultTransition based on direction.
|
||||
*
|
||||
* @default 'auto'
|
||||
*/
|
||||
transition: string;
|
||||
/**
|
||||
* Named transition to use when animating when detecting mobile device. Defaults to 'auto' which selects transition from defaultTransition based on direction.
|
||||
*
|
||||
* @default 'auto'
|
||||
*/
|
||||
mobileTransition: string;
|
||||
/**
|
||||
* Default transitions for each direction and screen size, used with transition: auto
|
||||
*/
|
||||
defaultTransition: Sidebar.DefaultTransitionSettings;
|
||||
/**
|
||||
* Whether Javascript animations should be used. Defaults to false. Setting to auto will use legacy animations only for browsers that do not support CSS transforms
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
useLegacy: 'auto' | boolean;
|
||||
/**
|
||||
* Duration of sidebar animation when using legacy Javascript animation
|
||||
*
|
||||
* @default 500
|
||||
*/
|
||||
duration: number;
|
||||
/**
|
||||
* Easing to use when using legacy Javascript animation
|
||||
*
|
||||
* @default 'easeInOutQuint'
|
||||
*/
|
||||
easing: string;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Callbacks
|
||||
|
||||
/**
|
||||
* Is called when a sidebar begins animating in.
|
||||
*/
|
||||
onVisible(this: JQuery): void;
|
||||
/**
|
||||
* Is called when a sidebar has finished animating in.
|
||||
*/
|
||||
onShow(this: JQuery): void;
|
||||
/**
|
||||
* Is called when a sidebar begins to hide or show
|
||||
*/
|
||||
onChange(this: JQuery): void;
|
||||
/**
|
||||
* Is called before a sidebar begins to animate out.
|
||||
*/
|
||||
onHide(this: JQuery): void;
|
||||
/**
|
||||
* Is called after a sidebar has finished animating out.
|
||||
*/
|
||||
onHidden(this: JQuery): void;
|
||||
|
||||
// endregion
|
||||
|
||||
// region DOM Settings
|
||||
|
||||
className: Sidebar.ClassNameSettings;
|
||||
regExp: Sidebar.RegExpSettings;
|
||||
selector: Sidebar.SelectorSettings;
|
||||
|
||||
// endregion
|
||||
|
||||
// region Debug Settings
|
||||
|
||||
error: Sidebar.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 Sidebar {
|
||||
interface DefaultTransitionSettings extends Pick<DefaultTransitionSettings._Impl, keyof DefaultTransitionSettings._Impl> { }
|
||||
|
||||
namespace DefaultTransitionSettings {
|
||||
type Param = DefaultTransitionSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
computer: ComputerSettings;
|
||||
mobile: MobileSettings;
|
||||
}
|
||||
|
||||
interface ComputerSettings extends Pick<ComputerSettings._Impl, keyof ComputerSettings._Impl> { }
|
||||
|
||||
namespace ComputerSettings {
|
||||
type Param = ComputerSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default 'uncover'
|
||||
*/
|
||||
left: string;
|
||||
/**
|
||||
* @default 'uncover'
|
||||
*/
|
||||
right: string;
|
||||
/**
|
||||
* @default 'overlay'
|
||||
*/
|
||||
top: string;
|
||||
/**
|
||||
* @default 'overlay'
|
||||
*/
|
||||
bottom: string;
|
||||
}
|
||||
}
|
||||
|
||||
interface MobileSettings extends Pick<MobileSettings._Impl, keyof MobileSettings._Impl> { }
|
||||
|
||||
namespace MobileSettings {
|
||||
type Param = MobileSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default 'uncover'
|
||||
*/
|
||||
left: string;
|
||||
/**
|
||||
* @default 'uncover'
|
||||
*/
|
||||
right: string;
|
||||
/**
|
||||
* @default 'overlay'
|
||||
*/
|
||||
top: string;
|
||||
/**
|
||||
* @default 'overlay'
|
||||
*/
|
||||
bottom: string;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
interface ClassNameSettings extends Pick<ClassNameSettings._Impl, keyof ClassNameSettings._Impl> { }
|
||||
|
||||
namespace ClassNameSettings {
|
||||
type Param = ClassNameSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default 'active'
|
||||
*/
|
||||
active: string;
|
||||
/**
|
||||
* @default 'animating'
|
||||
*/
|
||||
animating: string;
|
||||
/**
|
||||
* @default 'dimmed'
|
||||
*/
|
||||
dimmed: string;
|
||||
/**
|
||||
* @default 'ios'
|
||||
*/
|
||||
ios: string;
|
||||
/**
|
||||
* @default 'pushable'
|
||||
*/
|
||||
pushable: string;
|
||||
/**
|
||||
* @default 'pushed'
|
||||
*/
|
||||
pushed: string;
|
||||
/**
|
||||
* @default 'right'
|
||||
*/
|
||||
right: string;
|
||||
/**
|
||||
* @default 'top'
|
||||
*/
|
||||
top: string;
|
||||
/**
|
||||
* @default 'left'
|
||||
*/
|
||||
left: string;
|
||||
/**
|
||||
* @default 'bottom'
|
||||
*/
|
||||
bottom: string;
|
||||
/**
|
||||
* @default 'visible'
|
||||
*/
|
||||
visible: string;
|
||||
}
|
||||
}
|
||||
|
||||
interface RegExpSettings extends Pick<RegExpSettings._Impl, keyof RegExpSettings._Impl> { }
|
||||
|
||||
namespace RegExpSettings {
|
||||
type Param = RegExpSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default /(iPad|iPhone|iPod)/g
|
||||
*/
|
||||
ios: RegExp;
|
||||
/**
|
||||
* @default /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/g
|
||||
*/
|
||||
mobile: RegExp;
|
||||
}
|
||||
}
|
||||
|
||||
interface SelectorSettings extends Pick<SelectorSettings._Impl, keyof SelectorSettings._Impl> { }
|
||||
|
||||
namespace SelectorSettings {
|
||||
type Param = SelectorSettings | object;
|
||||
|
||||
interface _Impl {
|
||||
/**
|
||||
* @default '.fixed'
|
||||
*/
|
||||
fixed: string;
|
||||
/**
|
||||
* @default 'script, link, style, .ui.modal, .ui.dimmer, .ui.nag, .ui.fixed'
|
||||
*/
|
||||
omitted: string;
|
||||
/**
|
||||
* @default '.pusher'
|
||||
*/
|
||||
pusher: string;
|
||||
/**
|
||||
* @default '.ui.sidebar'
|
||||
*/
|
||||
sidebar: 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;
|
||||
/**
|
||||
* @default 'Had to add pusher element. For optimal performance make sure body content is inside a pusher element'
|
||||
*/
|
||||
pusher: string;
|
||||
/**
|
||||
* @default 'Had to move sidebar. For optimal performance make sure sidebar and pusher are direct children of your body tag'
|
||||
*/
|
||||
movedSidebar: string;
|
||||
/**
|
||||
* @default 'The overlay setting is no longer supported, use animation: overlay'
|
||||
*/
|
||||
overlay: string;
|
||||
/**
|
||||
* @default 'There were no elements that matched the specified selector'
|
||||
*/
|
||||
notFound: string;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Vendored
+11
@@ -0,0 +1,11 @@
|
||||
// Type definitions for semantic-ui-sidebar 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 path="global.d.ts" />
|
||||
|
||||
declare const sidebar: SemanticUI.Sidebar;
|
||||
export = sidebar;
|
||||
@@ -0,0 +1,118 @@
|
||||
function test_sidebar_static() {
|
||||
$.fn.sidebar.settings.error.method = 'method';
|
||||
$.fn.sidebar.settings.namespace = 'namespace';
|
||||
$.fn.sidebar.settings.name = 'name';
|
||||
$.fn.sidebar.settings.silent = false;
|
||||
$.fn.sidebar.settings.debug = true;
|
||||
$.fn.sidebar.settings.performance = true;
|
||||
$.fn.sidebar.settings.verbose = true;
|
||||
}
|
||||
|
||||
function test_sidebar() {
|
||||
const selector = '.ui.sidebar';
|
||||
$(selector).sidebar('attach events', $(), 'toggle') === $();
|
||||
$(selector).sidebar('show') === $();
|
||||
$(selector).sidebar('hide') === $();
|
||||
$(selector).sidebar('toggle') === $();
|
||||
$(selector).sidebar('is visible') === false;
|
||||
$(selector).sidebar('is hidden') === true;
|
||||
$(selector).sidebar('push page') === $();
|
||||
$(selector).sidebar('get direction') === 'top';
|
||||
$(selector).sidebar('pull page') === $();
|
||||
$(selector).sidebar('add body CSS') === $();
|
||||
$(selector).sidebar('remove body CSS') === $();
|
||||
$(selector).sidebar('get transition event') === 'transition';
|
||||
$(selector).sidebar('destroy') === $();
|
||||
$(selector).sidebar('setting', 'debug', undefined) === false;
|
||||
$(selector).sidebar('setting', 'debug') === false;
|
||||
$(selector).sidebar('setting', 'debug', true) === $();
|
||||
$(selector).sidebar('setting', {
|
||||
namespace: 'namespace',
|
||||
name: 'name',
|
||||
silent: false,
|
||||
debug: true,
|
||||
performance: true,
|
||||
verbose: true
|
||||
}) === $();
|
||||
$(selector).sidebar({
|
||||
context: $(),
|
||||
exclusive: false,
|
||||
closable: true,
|
||||
dimPage: false,
|
||||
scrollLock: true,
|
||||
returnScroll: false,
|
||||
delaySetup: true,
|
||||
transition: 'auto',
|
||||
mobileTransition: 'auto',
|
||||
defaultTransition: {
|
||||
mobile: {
|
||||
left: 'left',
|
||||
right: 'right',
|
||||
top: 'top',
|
||||
bottom: 'bottom'
|
||||
},
|
||||
computer: {
|
||||
left: 'left',
|
||||
right: 'right',
|
||||
top: 'top',
|
||||
bottom: 'bottom'
|
||||
}
|
||||
},
|
||||
useLegacy: false,
|
||||
duration: 20,
|
||||
easing: 'easeInOutQuint',
|
||||
onVisible() {
|
||||
this === $();
|
||||
},
|
||||
onShow() {
|
||||
this === $();
|
||||
},
|
||||
onChange() {
|
||||
this === $();
|
||||
},
|
||||
onHide() {
|
||||
this === $();
|
||||
},
|
||||
onHidden() {
|
||||
this === $();
|
||||
},
|
||||
className: {
|
||||
active: 'active',
|
||||
animating: 'animating',
|
||||
dimmed: 'dimmed',
|
||||
ios: 'ios',
|
||||
pushable: 'pushable',
|
||||
pushed: 'pushed',
|
||||
right: 'right',
|
||||
top: 'top',
|
||||
left: 'left',
|
||||
bottom: 'bottom',
|
||||
visible: 'visible'
|
||||
},
|
||||
regExp: {
|
||||
ios: /(iPad|iPhone|iPod)/g,
|
||||
mobile: /Mobile|iP(hone|od|ad)|Android|BlackBerry|IEMobile|Kindle|NetFront|Silk-Accelerated|(hpw|web)OS|Fennec|Minimo|Opera M(obi|ini)|Blazer|Dolfin|Dolphin|Skyfire|Zune/g,
|
||||
},
|
||||
selector: {
|
||||
fixed: 'fixed',
|
||||
omitted: 'omitted',
|
||||
pusher: 'pusher',
|
||||
sidebar: 'sidebar'
|
||||
},
|
||||
error: {
|
||||
method: 'method',
|
||||
pusher: 'pusher',
|
||||
movedSidebar: 'movedSidebar',
|
||||
animation: 'animation',
|
||||
overlay: 'overlay',
|
||||
notFound: 'notFound'
|
||||
}
|
||||
}) === $();
|
||||
$(selector).sidebar() === $();
|
||||
}
|
||||
|
||||
import sidebar = require('semantic-ui-sidebar');
|
||||
|
||||
function test_module() {
|
||||
$.fn.sidebar = sidebar;
|
||||
}
|
||||
@@ -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-sidebar-tests.ts"
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"extends": "dtslint/dt.json",
|
||||
"rules": {
|
||||
"no-empty-interface": false,
|
||||
"unified-signatures": false
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user