12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. import { Directive, ElementRef, EventEmitter, Input, Output } from '@angular/core';
  2. import { Platform } from '../../platform/platform';
  3. import { isRightSide } from '../../util/util';
  4. /**
  5. * @name ItemOptions
  6. * @description
  7. * The option buttons for an `ion-item-sliding`. These buttons can be placed either on the left or right side.
  8. * You can combine the `(ionSwipe)` event plus the `expandable` directive to create a full swipe action for the item.
  9. *
  10. * @usage
  11. *
  12. * ```html
  13. * <ion-item-sliding>
  14. * <ion-item>
  15. * Item 1
  16. * </ion-item>
  17. * <ion-item-options side="right" (ionSwipe)="saveItem(item)">
  18. * <button ion-button expandable (click)="saveItem(item)">
  19. * <ion-icon name="star"></ion-icon>
  20. * </button>
  21. * </ion-item-options>
  22. * </ion-item-sliding>
  23. *```
  24. */
  25. export class ItemOptions {
  26. constructor(_elementRef, _plt) {
  27. this._elementRef = _elementRef;
  28. this._plt = _plt;
  29. /**
  30. * @output {event} Emitted when the item has been fully swiped.
  31. */
  32. this.ionSwipe = new EventEmitter();
  33. }
  34. /**
  35. * @hidden
  36. */
  37. isRightSide() {
  38. return isRightSide(this.side, this._plt.isRTL, true);
  39. }
  40. /**
  41. * @hidden
  42. */
  43. width() {
  44. return this._elementRef.nativeElement.offsetWidth;
  45. }
  46. }
  47. ItemOptions.decorators = [
  48. { type: Directive, args: [{
  49. selector: 'ion-item-options',
  50. },] },
  51. ];
  52. /** @nocollapse */
  53. ItemOptions.ctorParameters = () => [
  54. { type: ElementRef, },
  55. { type: Platform, },
  56. ];
  57. ItemOptions.propDecorators = {
  58. 'side': [{ type: Input },],
  59. 'ionSwipe': [{ type: Output },],
  60. };
  61. //# sourceMappingURL=item-options.js.map