UI for Zipcoin Blue

menu.d.ts 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377
  1. import { ElementRef, EventEmitter, OnDestroy, OnInit, Renderer } from '@angular/core';
  2. import { App } from '../app/app';
  3. import { Backdrop } from '../backdrop/backdrop';
  4. import { Config } from '../../config/config';
  5. import { Content } from '../content/content';
  6. import { DomController } from '../../platform/dom-controller';
  7. import { GestureController } from '../../gestures/gesture-controller';
  8. import { Side } from '../../util/util';
  9. import { Keyboard } from '../../platform/keyboard';
  10. import { Menu as MenuInterface } from '../app/menu-interface';
  11. import { MenuController } from '../app/menu-controller';
  12. import { Nav } from '../nav/nav';
  13. import { Platform } from '../../platform/platform';
  14. import { RootNode } from '../split-pane/split-pane';
  15. /**
  16. * @name Menu
  17. * @description
  18. * The Menu component is a navigation drawer that slides in from the side of the current
  19. * view. By default, it slides in from the left, but the side can be overridden. The menu
  20. * will be displayed differently based on the mode, however the display type can be changed
  21. * to any of the available [menu types](#menu-types). The menu element should be a sibling
  22. * to the app's content element. There can be any number of menus attached to the content.
  23. * These can be controlled from the templates, or programmatically using the [MenuController](../../app/MenuController).
  24. *
  25. * @usage
  26. *
  27. * ```html
  28. * <ion-menu [content]="mycontent">
  29. * <ion-content>
  30. * <ion-list>
  31. * <p>some menu content, could be list items</p>
  32. * </ion-list>
  33. * </ion-content>
  34. * </ion-menu>
  35. *
  36. * <ion-nav #mycontent [root]="rootPage"></ion-nav>
  37. * ```
  38. *
  39. * To add a menu to an app, the `<ion-menu>` element should be added as a sibling to the `ion-nav` it will belongs
  40. * to. A [local variable](https://angular.io/docs/ts/latest/guide/user-input.html#local-variables)
  41. * should be added to the `ion-nav` and passed to the `ion-menu`s `content` property.
  42. *
  43. * This tells the menu what it is bound to and what element to watch for gestures.
  44. * In the below example, `content` is using [property binding](https://angular.io/docs/ts/latest/guide/template-syntax.html#!#property-binding)
  45. * because `mycontent` is a reference to the `<ion-nav>` element, and not a string.
  46. *
  47. *
  48. * ### Opening/Closing Menus
  49. *
  50. * There are several ways to open or close a menu. The menu can be **toggled** open or closed
  51. * from the template using the [MenuToggle](../MenuToggle) directive. It can also be
  52. * **closed** from the template using the [MenuClose](../MenuClose) directive. To display a menu
  53. * programmatically, inject the [MenuController](../MenuController) provider and call any of the
  54. * `MenuController` methods.
  55. *
  56. *
  57. * ### Menu Types
  58. *
  59. * The menu supports several display types: `overlay`, `reveal` and `push`. By default,
  60. * it will use the correct type based on the mode, but this can be changed. The default
  61. * type for both Material Design and Windows mode is `overlay`, and `reveal` is the default
  62. * type for iOS mode. The menu type can be changed in the app's [config](../../config/Config)
  63. * via the `menuType` property, or passed in the `type` property on the `<ion-menu>` element.
  64. * See [usage](#usage) below for examples of changing the menu type.
  65. *
  66. *
  67. * ### Navigation Bar Behavior
  68. *
  69. * If a [MenuToggle](../MenuToggle) button is added to the [Navbar](../../navbar/Navbar) of
  70. * a page, the button will only appear when the page it's in is currently a root page. The
  71. * root page is the initial page loaded in the app, or a page that has been set as the root
  72. * using the [setRoot](../../nav/NavController/#setRoot) method on the [NavController](../../nav/NavController).
  73. *
  74. * For example, say the application has two pages, `Page1` and `Page2`, and both have a
  75. * `MenuToggle` button in their navigation bars. Assume the initial page loaded into the app
  76. * is `Page1`, making it the root page. `Page1` will display the `MenuToggle` button, but once
  77. * `Page2` is pushed onto the navigation stack, the `MenuToggle` will not be displayed.
  78. *
  79. *
  80. * ### Persistent Menus
  81. *
  82. * Persistent menus display the [MenuToggle](../MenuToggle) button in the [Navbar](../../navbar/Navbar)
  83. * on all pages in the navigation stack. To make a menu persistent set `persistent` to `true` on the
  84. * `<ion-menu>` element. Note that this will only affect the `MenuToggle` button in the `Navbar` attached
  85. * to the `Menu` with `persistent` set to true, any other `MenuToggle` buttons will not be affected.
  86. * ### Menu Side
  87. *
  88. * By default, menus slide in from the left, but this can be overridden by passing `right`
  89. * to the `side` property:
  90. *
  91. * ```html
  92. * <ion-menu side="right" [content]="mycontent">...</ion-menu>
  93. * ```
  94. *
  95. *
  96. * ### Menu Type
  97. *
  98. * The menu type can be changed by passing the value to `type` on the `<ion-menu>`:
  99. *
  100. * ```html
  101. * <ion-menu type="overlay" [content]="mycontent">...</ion-menu>
  102. * ```
  103. *
  104. * It can also be set in the app's config. The below will set the menu type to
  105. * `push` for all modes, and then set the type to `overlay` for the `ios` mode.
  106. *
  107. * ```ts
  108. * // in NgModules
  109. *
  110. * imports: [
  111. * IonicModule.forRoot(MyApp,{
  112. * menuType: 'push',
  113. * platforms: {
  114. * ios: {
  115. * menuType: 'overlay',
  116. * }
  117. * }
  118. * })
  119. * ],
  120. * ```
  121. *
  122. *
  123. * ### Displaying the Menu
  124. *
  125. * To toggle a menu from the template, add a button with the `menuToggle`
  126. * directive anywhere in the page's template:
  127. *
  128. * ```html
  129. * <button ion-button menuToggle>Toggle Menu</button>
  130. * ```
  131. *
  132. * To close a menu, add the `menuClose` button. It can be added anywhere
  133. * in the content, or even the menu itself. Below it is added to the menu's
  134. * content:
  135. *
  136. * ```html
  137. * <ion-menu [content]="mycontent">
  138. * <ion-content>
  139. * <ion-list>
  140. * <ion-item menuClose detail-none>Close Menu</ion-item>
  141. * </ion-list>
  142. * </ion-content>
  143. * </ion-menu>
  144. * ```
  145. *
  146. * See the [MenuToggle](../MenuToggle) and [MenuClose](../MenuClose) docs
  147. * for more information on these directives.
  148. *
  149. * The menu can also be controlled from the Page by using the `MenuController`.
  150. * Inject the `MenuController` provider into the page and then call any of its
  151. * methods. In the below example, the `openMenu` method will open the menu
  152. * when it is called.
  153. *
  154. * ```ts
  155. * import { Component } from '@angular/core';
  156. * import { MenuController } from 'ionic-angular';
  157. *
  158. * @Component({...})
  159. * export class MyPage {
  160. * constructor(public menuCtrl: MenuController) {}
  161. *
  162. * openMenu() {
  163. * this.menuCtrl.open();
  164. * }
  165. * }
  166. * ```
  167. *
  168. * See the [MenuController](../../app/MenuController) API docs for all of the methods
  169. * and usage information.
  170. *
  171. *
  172. * @demo /docs/demos/src/menu/
  173. *
  174. * @see {@link /docs/components#menus Menu Component Docs}
  175. * @see {@link ../../app/MenuController MenuController API Docs}
  176. * @see {@link ../../nav/Nav Nav API Docs}
  177. * @see {@link ../../nav/NavController NavController API Docs}
  178. */
  179. export declare class Menu implements RootNode, MenuInterface, OnInit, OnDestroy {
  180. _menuCtrl: MenuController;
  181. private _elementRef;
  182. private _config;
  183. private _plt;
  184. private _renderer;
  185. private _keyboard;
  186. private _gestureCtrl;
  187. private _domCtrl;
  188. private _app;
  189. private _cntEle;
  190. private _gesture;
  191. private _type;
  192. private _isEnabled;
  193. private _isSwipeEnabled;
  194. private _isAnimating;
  195. private _isPersistent;
  196. private _init;
  197. private _events;
  198. private _gestureBlocker;
  199. private _isPane;
  200. private _side;
  201. /**
  202. * @hidden
  203. */
  204. isOpen: boolean;
  205. /**
  206. * @hidden
  207. */
  208. isRightSide: boolean;
  209. /**
  210. * @hidden
  211. */
  212. backdrop: Backdrop;
  213. /**
  214. * @hidden
  215. */
  216. menuContent: Content;
  217. /**
  218. * @hidden
  219. */
  220. menuNav: Nav;
  221. /**
  222. * @input {any} A reference to the content element the menu should use.
  223. */
  224. content: any;
  225. /**
  226. * @input {string} An id for the menu.
  227. */
  228. id: string;
  229. /**
  230. * @input {string} The display type of the menu. Default varies based on the mode,
  231. * see the `menuType` in the [config](../../config/Config). Available options:
  232. * `"overlay"`, `"reveal"`, `"push"`.
  233. */
  234. type: string;
  235. /**
  236. * @input {boolean} If true, the menu is enabled. Default `true`.
  237. */
  238. enabled: boolean;
  239. /**
  240. * @input {string} Which side of the view the menu should be placed. Default `"left"`.
  241. */
  242. side: Side;
  243. /**
  244. * @input {boolean} If true, swiping the menu is enabled. Default `true`.
  245. */
  246. swipeEnabled: boolean;
  247. /**
  248. * @input {boolean} If true, the menu will persist on child pages.
  249. */
  250. persistent: boolean;
  251. /**
  252. * @hidden
  253. */
  254. maxEdgeStart: number;
  255. /**
  256. * @output {event} Emitted when the menu is being dragged open.
  257. */
  258. ionDrag: EventEmitter<number>;
  259. /**
  260. * @output {event} Emitted when the menu has been opened.
  261. */
  262. ionOpen: EventEmitter<boolean>;
  263. /**
  264. * @output {event} Emitted when the menu has been closed.
  265. */
  266. ionClose: EventEmitter<boolean>;
  267. constructor(_menuCtrl: MenuController, _elementRef: ElementRef, _config: Config, _plt: Platform, _renderer: Renderer, _keyboard: Keyboard, _gestureCtrl: GestureController, _domCtrl: DomController, _app: App);
  268. /**
  269. * @hidden
  270. */
  271. ngOnInit(): void;
  272. /**
  273. * @hidden
  274. */
  275. onBackdropClick(ev: UIEvent): void;
  276. /**
  277. * @hidden
  278. */
  279. private _getType();
  280. /**
  281. * @hidden
  282. */
  283. setOpen(shouldOpen: boolean, animated?: boolean): Promise<boolean>;
  284. _forceClosing(): void;
  285. /**
  286. * @hidden
  287. */
  288. canSwipe(): boolean;
  289. /**
  290. * @hidden
  291. */
  292. isAnimating(): boolean;
  293. _swipeBeforeStart(): void;
  294. _swipeStart(): void;
  295. _swipeProgress(stepValue: number): void;
  296. _swipeEnd(shouldCompleteLeft: boolean, shouldCompleteRight: boolean, stepValue: number, velocity: number): void;
  297. private _before();
  298. private _after(isOpen);
  299. /**
  300. * @hidden
  301. */
  302. open(): Promise<boolean>;
  303. /**
  304. * @hidden
  305. */
  306. close(): Promise<boolean>;
  307. /**
  308. * @hidden
  309. */
  310. resize(): void;
  311. /**
  312. * @hidden
  313. */
  314. toggle(): Promise<boolean>;
  315. _canOpen(): boolean;
  316. /**
  317. * @hidden
  318. */
  319. _updateState(): void;
  320. /**
  321. * @hidden
  322. */
  323. enable(shouldEnable: boolean): Menu;
  324. /**
  325. * @internal
  326. */
  327. initPane(): boolean;
  328. /**
  329. * @internal
  330. */
  331. paneChanged(isPane: boolean): void;
  332. /**
  333. * @hidden
  334. */
  335. swipeEnable(shouldEnable: boolean): Menu;
  336. /**
  337. * @hidden
  338. */
  339. getNativeElement(): HTMLElement;
  340. /**
  341. * @hidden
  342. */
  343. getMenuElement(): HTMLElement;
  344. /**
  345. * @hidden
  346. */
  347. getContentElement(): HTMLElement;
  348. /**
  349. * @hidden
  350. */
  351. getBackdropElement(): HTMLElement;
  352. /**
  353. * @hidden
  354. */
  355. width(): number;
  356. /**
  357. * @hidden
  358. */
  359. getMenuController(): MenuController;
  360. /**
  361. * @hidden
  362. */
  363. setElementClass(className: string, add: boolean): void;
  364. /**
  365. * @hidden
  366. */
  367. setElementAttribute(attributeName: string, value: string): void;
  368. /**
  369. * @hidden
  370. */
  371. getElementRef(): ElementRef;
  372. /**
  373. * @hidden
  374. */
  375. ngOnDestroy(): void;
  376. }