Front end of the Slack clone application.

fab.d.ts 1.7KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. import { ElementRef, Renderer } from '@angular/core';
  2. import { Config } from '../../config/config';
  3. import { Ion } from '../ion';
  4. /**
  5. * @name FabButton
  6. * @module ionic
  7. *
  8. * @description
  9. * FABs (Floating Action Buttons) are standard material design components. They are shaped as a circle that represents a promoted action. When pressed, it may contain more related actions.
  10. * FABs as its name suggests are floating over the content in a fixed position. This is not achieved exclusively with `<button ion-fab>Button</button>` but it has to wrapped with the `<ion-fab>` component, like this:
  11. *
  12. * ```html
  13. * <ion-content>
  14. * <!-- Real floating action button, fixed. It will not scroll with the content -->
  15. * <ion-fab>
  16. * <button ion-fab>Button</button>
  17. * </ion-fab>
  18. *
  19. * <!-- Button shaped as a circle that just like a normal button scrolls with the content -->
  20. * <button ion-fab>Button</button>
  21. * </ion-content>
  22. *
  23. * ```
  24. *
  25. * In case the button is not wrapped with `<ion-fab>`, the fab button will behave like a normal button, scrolling with the content.
  26. *
  27. * See [ion-fab] to learn more information about how to position the fab button.
  28. *
  29. * @property [mini] - Makes a fab button with a reduced size.
  30. *
  31. * @usage
  32. *
  33. * ```html
  34. *
  35. * <!-- Colors -->
  36. * <ion-fab>
  37. * <button ion-fab color="primary">Button</button>
  38. * </ion-fab>
  39. *
  40. * <!-- Mini -->
  41. * <ion-fab>
  42. * <button ion-fab mini>Small</button>
  43. * </ion-fab>
  44. * ```
  45. *
  46. * @demo /docs/demos/src/fab/
  47. * @see {@link /docs/components#fabs FAB Component Docs}
  48. */
  49. export declare class FabButton extends Ion {
  50. constructor(config: Config, elementRef: ElementRef, renderer: Renderer);
  51. /**
  52. * @hidden
  53. */
  54. setActiveClose(closeVisible: boolean): void;
  55. }