From 31def508ff755427b854e5b59a739fbb19cd15ff Mon Sep 17 00:00:00 2001 From: Sam Herrmann Date: Sat, 27 Jun 2015 16:41:10 -0400 Subject: [PATCH] Add AngularStrap type definitions As documented on the AngularStrap website: http://mgcrea.github.io/angular-strap/ --- angular-strap/angular-strap-tests.ts | 378 +++++++++++++++++ angular-strap/angular-strap.d.ts | 600 +++++++++++++++++++++++++++ 2 files changed, 978 insertions(+) create mode 100644 angular-strap/angular-strap-tests.ts create mode 100644 angular-strap/angular-strap.d.ts diff --git a/angular-strap/angular-strap-tests.ts b/angular-strap/angular-strap-tests.ts new file mode 100644 index 000000000..90c7a2bde --- /dev/null +++ b/angular-strap/angular-strap-tests.ts @@ -0,0 +1,378 @@ +/// +/// + +module angularStrapTests { + + import ngStrap = mgcrea.ngStrap; + + /////////////////////////////////////////////////////////////////////////// + // Modal + /////////////////////////////////////////////////////////////////////////// + + module modalTests { + + interface IDemoCtrlScope extends ngStrap.modal.IModalScope { + showModal: () => void; + } + + angular.module('demoApp') + .config($modalConfig) + .controller('demoCtrl', demoCtrl); + + function demoCtrl($scope: IDemoCtrlScope, + $modal: ngStrap.modal.IModalService): void { + + var myModalOptions: ngStrap.modal.IModalOptions = {}; + myModalOptions.title = 'My Title'; + myModalOptions.content = 'Hello Modal
This is a multiline message!'; + myModalOptions.show = true; + + var myModal = $modal(myModalOptions); + + var myOtherModalOptions: ngStrap.modal.IModalOptions = {}; + myOtherModalOptions.scope = $scope; + myOtherModalOptions.template = 'modal/docs/modal.demo.tpl.html'; + myOtherModalOptions.show = false; + + var myOtherModal = $modal(myOtherModalOptions); + + $scope.showModal = (): void => { + myOtherModal.$promise.then(myOtherModal.show); + }; + } + + function $modalConfig($modalProvider: ngStrap.modal.IModalProvider): void { + var defaults: ngStrap.modal.IModalOptions = { + animation: 'am-flip-x' + } + angular.extend($modalProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Aside + /////////////////////////////////////////////////////////////////////////// + + module asideTests { + + angular.module('demoApp') + .config($asideConfig) + .controller('demoCtrl', demoCtrl); + + function demoCtrl($scope: ngStrap.aside.IAsideScope, + $aside: ngStrap.aside.IAsideService): void { + + var myAsideOptions: ngStrap.aside.IAsideOptions = {}; + myAsideOptions.title = 'My Title'; + myAsideOptions.content = 'My content'; + myAsideOptions.show = true; + + var myAside = $aside(myAsideOptions); + + var myOtherAsideOptions: ngStrap.aside.IAsideOptions = {}; + myOtherAsideOptions.scope = $scope; + myOtherAsideOptions.template = 'aside/docs/aside.demo.tpl.html'; + + var myOtherAside = $aside(); + + myOtherAside.$promise.then(() => { + myOtherAside.show(); + }); + } + + function $asideConfig($asideProvider: ngStrap.aside.IAsideProvider): void { + var defaults: ngStrap.aside.IAsideOptions = {}; + defaults.animation = 'am-fadeAndSlideLeft'; + defaults.placement = 'left'; + + angular.extend($asideProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Alert + /////////////////////////////////////////////////////////////////////////// + + module alertTests { + + angular.module('demoApp') + .config($alertConfig) + .controller('demoCtrl', demoCtrl); + + function demoCtrl($scope: ngStrap.alert.IAlertScope, + $alert: ngStrap.alert.IAlertService): void { + + var options: ngStrap.alert.IAlertOptions = {}; + options.title = 'Holy guacamole!'; + options.content = 'Best check yo self, you\'re not looking too good.'; + options.placement = 'top'; + options.type = 'info'; + options.show = true; + + var myAlert = $alert(); + } + + function $alertConfig($alertProvider: ngStrap.alert.IAlertProvider): void { + var defaults: ngStrap.alert.IAlertOptions = {}; + defaults.animation = 'am-fade-and-slide-top'; + defaults.placement = 'top'; + + angular.extend($alertProvider.defaults, defaults); + }; + } + + + /////////////////////////////////////////////////////////////////////////// + // Tooltip + /////////////////////////////////////////////////////////////////////////// + + module tooltipTests { + + angular.module('demoApp') + .config($tooltipConfig) + .controller('demoDrct', demoDrct); + + function demoDrct($tooltip: ngStrap.tooltip.ITooltipService): ng.IDirective { + var drct: ng.IDirective = {}; + drct.restrict = 'EA'; + drct.link = link; + return drct; + + function link(scope: ng.IScope, elem: ng.IAugmentedJQuery, attrs: ng.IAttributes): void { + var options: ngStrap.tooltip.ITooltipOptions = {}; + options.title = 'My Title'; + $tooltip(elem, options); + } + } + + function $tooltipConfig($tooltipProvider: ngStrap.tooltip.ITooltipProvider): void { + var defaults: ngStrap.tooltip.ITooltipOptions = {}; + defaults.animation = 'am-flip-x'; + defaults.trigger = 'hover'; + + angular.extend($tooltipProvider.defaults, defaults); + }; + } + + + /////////////////////////////////////////////////////////////////////////// + // Popover + /////////////////////////////////////////////////////////////////////////// + + module popoverTests { + + angular.module('demoApp') + .config($popoverConfig) + .controller('demoDrct', demoDrct); + + function demoDrct($popover: ngStrap.popover.IPopoverService): ng.IDirective { + var drct: ng.IDirective = {}; + drct.restrict = 'EA'; + drct.link = link; + return drct; + + function link(scope: ng.IScope, elem: ng.IAugmentedJQuery, attrs: ng.IAttributes): void { + var options: ngStrap.tooltip.ITooltipOptions = {}; + options.title = 'My Title'; + + $popover(elem, options); + } + } + + function $popoverConfig($popoverProvider: ngStrap.popover.IPopoverProvider): void { + var defaults: ngStrap.tooltip.ITooltipOptions = {} + defaults.animation = 'am-flip-x'; + defaults.trigger = 'hover'; + + angular.extend($popoverProvider.defaults, defaults); + }; + } + + + /////////////////////////////////////////////////////////////////////////// + // Typeahead + /////////////////////////////////////////////////////////////////////////// + + module typeaheadTests { + + angular.module('myApp') + .config($typeaheadConfig); + + function $typeaheadConfig($typeaheadProvider: ngStrap.typeahead.ITypeaheadProvider) { + var defaults: ngStrap.typeahead.ITypeaheadOptions = {} + defaults.animation = 'am-flip-x'; + defaults.minLength = 2; + defaults.limit = 8; + + angular.extend($typeaheadProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Datepicker + /////////////////////////////////////////////////////////////////////////// + + module datepickerTests { + + angular.module('myApp') + .config($datepickerConfig); + + function $datepickerConfig($datepickerProvider: ngStrap.datepicker.IDatepickerProvider): void { + var defaults: ngStrap.datepicker.IDatepickerOptions = {}; + defaults.dateFormat = 'dd/MM/yyyy'; + defaults.startWeek = 1; + + angular.extend($datepickerProvider.defaults, defaults); + }; + } + + + /////////////////////////////////////////////////////////////////////////// + // Timepicker + /////////////////////////////////////////////////////////////////////////// + + module timepickerTests { + + angular.module('myApp') + .config($timepickerConfig); + + function $timepickerConfig($timepickerProvider: ngStrap.timepicker.ITimepickerProvider): void { + var defaults: ngStrap.timepicker.ITimepickerOptions = {}; + defaults.timeFormat = 'HH:mm'; + defaults.length = 7; + + angular.extend($timepickerProvider.defaults, defaults); + }; + } + + + /////////////////////////////////////////////////////////////////////////// + // Select + /////////////////////////////////////////////////////////////////////////// + + module selectTests { + + angular.module('myApp') + .config($selectConfig); + + function $selectConfig($selectProvider: ngStrap.select.ISelectProvider): void { + var defaults: ngStrap.select.ISelectOptions = {}; + defaults.animation = 'am-flip-x'; + defaults.sort = false; + + angular.extend($selectProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Tabs + /////////////////////////////////////////////////////////////////////////// + + module tabTests { + + angular.module('myApp') + .config($tabConfig); + + function $tabConfig($tabProvider: ngStrap.tab.ITabProvider) { + var defaults: ngStrap.tab.ITabOptions = {}; + defaults.animation = 'am-flip-x'; + + angular.extend($tabProvider.defaults, defaults); + } + } + + /////////////////////////////////////////////////////////////////////////// + // Collapse + /////////////////////////////////////////////////////////////////////////// + + module collapseTests { + + angular.module('myApp') + .config($collapseConfig); + + function $collapseConfig($collapseProvider: ngStrap.collapse.ICollapseProvider):void { + var defaults: ngStrap.collapse.ICollapseOptions = {}; + defaults.animation = 'am-flip-x'; + + angular.extend($collapseProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Dropdown + /////////////////////////////////////////////////////////////////////////// + + module dropdownTests { + + angular.module('myApp') + .config($dropdownConfig); + + function $dropdownConfig($dropdownProvider: ngStrap.dropdown.IDropdownProvider):void { + var defaults: ngStrap.dropdown.IDropdownOptions = {}; + defaults.animation = 'am-flip-x'; + defaults.trigger = 'hover'; + + angular.extend($dropdownProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Navbar + /////////////////////////////////////////////////////////////////////////// + + module navbarTests { + + angular.module('myApp') + .config($navbarConfig); + + function $navbarConfig($navbarProvider: ngStrap.navbar.INavbarProvider):void { + var defaults: ngStrap.navbar.INavbarOptions = {}; + defaults.activeClass = 'in'; + + angular.extend($navbarProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Scrollspy + /////////////////////////////////////////////////////////////////////////// + + module scrollspyTests { + + angular.module('myApp') + .config($scrollspyConfig); + + function $scrollspyConfig($scrollspyProvider: ngStrap.scrollspy.IScrollspyProvider):void { + var defaults: ngStrap.scrollspy.IScrollspyOptions = {}; + defaults.offset = 0; + defaults.target = 'my-selector'; + + angular.extend($scrollspyProvider.defaults, defaults); + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Affix + /////////////////////////////////////////////////////////////////////////// + + module affixTests { + + angular.module('myApp') + .config($affixConfig); + + function $affixConfig($affixProvider: ngStrap.affix.IAffixProvider):void { + var defaults: ngStrap.affix.IAffixOptions = {}; + defaults.offsetTop = 100; + + angular.extend($affixProvider.defaults, defaults); + } + } +} \ No newline at end of file diff --git a/angular-strap/angular-strap.d.ts b/angular-strap/angular-strap.d.ts new file mode 100644 index 000000000..10e46bc1c --- /dev/null +++ b/angular-strap/angular-strap.d.ts @@ -0,0 +1,600 @@ +// Type definitions for angular-strap v2.2.x +// Project: http://mgcrea.github.io/angular-strap/ +// Definitions by: Sam Herrmann +// Definitions: https://github.com/borisyankov/DefinitelyTyped + + +/// + +declare module mgcrea.ngStrap { + + /////////////////////////////////////////////////////////////////////////// + // Modal + // see http://mgcrea.github.io/angular-strap/#/modals + /////////////////////////////////////////////////////////////////////////// + + module modal { + + interface IModalService { + (config?: IModalOptions): IModal; + } + + interface IModalProvider { + defaults: IModalOptions; + } + + interface IModal { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface IModalOptions { + animation?: string; + backdropAnimation?: string; + placement?: string; + title?: string; + content?: string; + html?: boolean; + backdrop?: boolean | string; + keyboard?: boolean; + show?: boolean; + container?: string | boolean; + template?: string; + contentTemplate?: string; + prefixEvent?: string; + id?: string; + scope?: ng.IScope; + } + + interface IModalScope extends ng.IScope { + $show: () => void; + $hide: () => void; + $toggle: () => void; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Aside + // see http://mgcrea.github.io/angular-strap/#/asides + /////////////////////////////////////////////////////////////////////////// + + module aside { + + interface IAsideService { + (config?: IAsideOptions): IAside; + } + + interface IAsideProvider { + defaults: IAsideOptions; + } + + interface IAside { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface IAsideOptions { + animation?: string; + placement?: string; + title?: string; + content?: string; + html?: boolean; + backdrop?: boolean | string; + keyboard?: boolean; + show?: boolean; + container?: string | boolean; + template?: string; + contentTemplate?: string; + scope?: ng.IScope; + } + + interface IAsideScope extends ng.IScope { + $show: () => void; + $hide: () => void; + $toggle: () => void; + } + } + + + + /////////////////////////////////////////////////////////////////////////// + // Alert + // see http://mgcrea.github.io/angular-strap/#/alerts + /////////////////////////////////////////////////////////////////////////// + + module alert { + + interface IAlertService { + (config?: IAlertOptions): IAlert; + } + + interface IAlertProvider { + defaults: IAlertOptions; + } + + interface IAlert { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface IAlertOptions { + animation?: string; + placement?: string; + title?: string; + content?: string; + type?: string; + keyboard?: boolean; + show?: boolean; + container?: string | boolean; + template?: string; + duration?: number | boolean; + dismissable?: boolean; + } + + interface IAlertScope extends ng.IScope { + $show: () => void; + $hide: () => void; + $toggle: () => void; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Tooltip + // see http://mgcrea.github.io/angular-strap/#/tooltips + /////////////////////////////////////////////////////////////////////////// + + module tooltip { + + interface ITooltipService { + (element: ng.IAugmentedJQuery, config?: ITooltipOptions): ITooltip; + } + + interface ITooltipProvider { + defaults: ITooltipOptions; + } + + interface ITooltip { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface ITooltipOptions { + animation?: string; + placement?: string; + trigger?: string; + title?: string; + html?: boolean; + delay?: number | { show: number; hide: number}; + container?: string | boolean; + target?: string | ng.IAugmentedJQuery | boolean; + template?: string; + contentTemplate?: string; + prefixEvent?: string; + id?: string; + viewport?: string | { selector: string; padding: string | number }; + } + + interface ITooltipScope extends ng.IScope { + $show: () => void; + $hide: () => void; + $toggle: () => void; + $setEnabled: (isEnabled: boolean) => void; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Popover + // see http://mgcrea.github.io/angular-strap/#/popovers + /////////////////////////////////////////////////////////////////////////// + + module popover { + + interface IPopoverService { + (element: ng.IAugmentedJQuery, config?: IPopoverOptions): IPopover; + } + + interface IPopoverProvider { + defaults: IPopoverOptions; + } + + interface IPopover { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface IPopoverOptions { + animation?: string; + placement?: string; + trigger?: string; + title?: string; + content?: string; + html?: boolean; + delay?: number | { show: number; hide: number }; + container?: string | boolean; + target?: string | ng.IAugmentedJQuery | boolean; + template?: string; + contentTemplate?: string; + autoClose?: boolean; + id?: string; + viewport?: string | { selector: string; padding: string | number }; + } + + interface IPopoverScope extends ng.IScope { + $show: () => void; + $hide: () => void; + $toggle: () => void; + } + } + + + + /////////////////////////////////////////////////////////////////////////// + // Typeahead + // see http://mgcrea.github.io/angular-strap/#/typeaheads + /////////////////////////////////////////////////////////////////////////// + + module typeahead { + + interface ITypeaheadService { + (element: ng.IAugmentedJQuery, controller: any, config?: ITypeaheadOptions): ITypeahead; + } + + interface ITypeaheadProvider { + defaults: ITypeaheadOptions; + } + + interface ITypeahead { + $promise: ng.IPromise; + show: () => void; + hide: () => void; + toggle: () => void; + } + + interface ITypeaheadOptions { + animation?: string; + placement?: string; + trigger?: string; + html?: boolean; + delay?: number | { show: number; hide: number }; + container?: string | boolean; + template?: string; + limit?: number; + minLength?: number; + autoSelect?: boolean; + comparator?: string; + id?: string; + watchOptions?: boolean; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Datepicker + // see http://mgcrea.github.io/angular-strap/#/datepickers + /////////////////////////////////////////////////////////////////////////// + + module datepicker { + + interface IDatepickerService { + (element: ng.IAugmentedJQuery, controller: any, config?: IDatepickerOptions): IDatepicker; + } + + interface IDatepickerProvider { + defaults: IDatepickerOptions; + } + + interface IDatepicker { + update: (date: Date) => void; + updateDisabledDates: (dateRanges: IDatepickerDateRange[]) => void; + select: (dateConstructorArg: string | number | number[], keep: boolean) => void; + setMode: (mode: any) => void; + int: () => void; + destroy: () => void; + show: () => void; + hide: () => void; + } + + interface IDatepickerDateRange { + start: Date; + end: Date; + } + + interface IDatepickerOptions { + animation?: string; + placement?: string; + trigger?: string; + html?: boolean; + delay?: number | { show: number; hide: number }; + container?: string | boolean; + template?: string; + dateFormat?: string; + modelDateFormat?: string; + dateType?: string; + timezone?: string; + autoclose?: boolean; + useNative?: boolean; + minDate?: Date; + maxDate?: Date; + startView?: number; + minView?: number; + startWeek?: number; + startDate?: Date; + iconLeft?: string; + iconRight?: string; + daysOfWeekDisabled?: string; + disabledDates?: IDatepickerDateRange[]; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Timepicker + // see http://mgcrea.github.io/angular-strap/#/timepickers + /////////////////////////////////////////////////////////////////////////// + + module timepicker { + + interface ITimepickerService { + (element: ng.IAugmentedJQuery, controller: any, config?: ITimepickerOptions): ITimepicker; + } + + interface ITimepickerProvider { + defaults: ITimepickerOptions; + } + + interface ITimepicker { + + } + + interface ITimepickerOptions { + animation?: string; + placement?: string; + trigger?: string; + html?: boolean; + delay?: number | { show: number; hide: number; }; + container?: string | boolean; + template?: string; + timeFormat?: string; + modelTimeFormat?: string; + timeType?: string; + autoclose?: boolean; + useNative?: boolean; + minTime?: Date; // TODO + maxTime?: Date; // TODO + length?: number; + hourStep?: number; + minuteStep?: number; + secondStep?: number; + roundDisplay?: boolean; + iconUp?: string; + iconDown?: string; + arrowBehaviour?: string; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Button + // see http://mgcrea.github.io/angular-strap/#/buttons + /////////////////////////////////////////////////////////////////////////// + + // No definitions for this module + + + /////////////////////////////////////////////////////////////////////////// + // Select + // see http://mgcrea.github.io/angular-strap/#/selects + /////////////////////////////////////////////////////////////////////////// + + module select { + + interface ISelectService { + (element: ng.IAugmentedJQuery, controller: any, config: ISelectOptions): ISelect; + } + + interface ISelectProvider { + defaults: ISelectOptions; + } + + interface ISelect { + update: (matches: any) => void; + active: (index: number) => number; + select: (index: number) => void; + show: () => void; + hide: () => void; + } + + interface ISelectOptions { + animation?: string; + placement?: string; + trigger?: string; + html?: boolean; + delay?: number | { show: number; hide: number; }; + container?: string | boolean; + template?: string; + multiple?: boolean; + allNoneButtons?: boolean; + allText?: string; + noneText?: string; + maxLength?: number; + maxLengthHtml?: string; + sort?: boolean; + placeholder?: string; + iconCheckmark?: string; + id?: string; + } + } + + /////////////////////////////////////////////////////////////////////////// + // Tabs + // see http://mgcrea.github.io/angular-strap/#/tabs + /////////////////////////////////////////////////////////////////////////// + + module tab { + + interface ITabProvider { + defaults: ITabOptions; + } + + interface ITabService { + defaults: ITabOptions; + controller: any; + } + + interface ITabOptions { + animation?: string; + template?: string; + navClass?: string; + activeClass?: string; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Collapses + // see http://mgcrea.github.io/angular-strap/#/collapses + /////////////////////////////////////////////////////////////////////////// + + module collapse { + + interface ICollapseProvider { + defaults: ICollapseOptions; + } + + interface ICollapseOptions { + animation?: string; + activeClass?: string; + disallowToggle?: boolean; + startCollapsed?: boolean; + allowMultiple?: boolean; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Dropdowsn + // see http://mgcrea.github.io/angular-strap/#/dropdowns + /////////////////////////////////////////////////////////////////////////// + + module dropdown { + + interface IDropdownProvider { + defaults: IDropdownOptions; + } + + interface IDropdownService { + (element: ng.IAugmentedJQuery, config: IDropdownOptions): IDropdown; + } + + interface IDropdown { + show: () => void; + hide: () => void; + destroy: () => void; + } + + interface IDropdownOptions { + animation?: string; + placement?: string; + trigger?: string; + html?: boolean; + delay?: number | { show: number; hide: number; }; + container?: string | boolean; + template?: string; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Navbar + // see http://mgcrea.github.io/angular-strap/#/navbars + /////////////////////////////////////////////////////////////////////////// + + module navbar { + + interface INavbarProvider { + defaults: INavbarOptions; + } + + interface INavbarOptions { + activeClass?: string; + routeAttr?: string; + } + + interface INavbarService { + defaults: INavbarOptions; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Scrollspy + // see http://mgcrea.github.io/angular-strap/#/scrollspy + /////////////////////////////////////////////////////////////////////////// + + module scrollspy { + + interface IScrollspyProvider { + defaults: IScrollspyOptions; + } + + interface IScrollspyService { + (element: ng.IAugmentedJQuery, options: IScrollspyOptions): IScrollspy; + } + + interface IScrollspy { + checkOffsets: () => void; + trackElement: (target: any, source: any) => void; + untrackElement: (target: any, source: any) => void; + activate: (index: number) => void; + } + + interface IScrollspyOptions { + target?: string; + offset?: number; + } + } + + + /////////////////////////////////////////////////////////////////////////// + // Affix + // see http://mgcrea.github.io/angular-strap/#/affix + /////////////////////////////////////////////////////////////////////////// + + module affix { + + interface IAffixProvider { + defaults: IAffixOptions; + } + + interface IAffixService { + (element: ng.IAugmentedJQuery, options: IAffixOptions): IAffix; + } + + interface IAffix { + init: () => void; + destroy: () => void; + checkPositionWithEventLoop: () => void; + checkPosition: () => void; + } + + interface IAffixOptions { + offsetTop?: number; + offsetBottom?: number; + offsetParent?: number; + offsetUnpin?: number; + } + } +}