{"version":3,"file":"toolbox-load-more.mjs","sources":["../../../projects/toolbox/load-more/load-more.component.ts","../../../projects/toolbox/load-more/load-more.component.html","../../../projects/toolbox/load-more/toolbox-load-more.ts"],"sourcesContent":["import {\r\n  Component, output, input, computed,\r\n  effect, signal, ChangeDetectionStrategy\r\n} from \"@angular/core\";\r\n\r\nimport { TbxLoadMoreEvent } from \"./load-more.event\";\r\nimport { DecimalPipe } from \"@angular/common\";\r\n\r\n/**\r\n * Displays a 'load more' button using Bootstrap classes.\r\n */\r\n@Component( {\r\n    selector: \"tbx-load-more\",\r\n    templateUrl: \"./load-more.component.html\",\r\n    styleUrls: [\"./load-more.component.scss\"],\r\n    imports: [DecimalPipe],\r\n    changeDetection: ChangeDetectionStrategy.OnPush\r\n} )\r\nexport class TbxLoadMoreComponent {\r\n  /** The total items to base the calculation of the next group of items to load. */\r\n  public totalItems = input.required<number>();\r\n\r\n  /** The amount of items to be loaded at a time (defaults to 100). */\r\n  public loadSize = input<number>( 100 );\r\n\r\n  /** The message to display when there are no more items to load. */\r\n  public noMoreMessage = input<string>( \"No more items to display or limit reached.\" );\r\n\r\n  /** The message to display when there are more items to load. */\r\n  public loadMoreText = input<string>( \"Load More...\" );\r\n\r\n  /** Indicates to show the 'load more' chevron in the button (defaults to true). */\r\n  public showChevron = input<boolean>( true );\r\n\r\n  /**\r\n   * The FontAwesome class to display as the chevron\r\n   * (defaults to 'fa fa-chevron-circle-down')\r\n   */\r\n  public chevronClass = input<string>( \"fa fa-chevron-circle-down\" );\r\n\r\n  /** The classes to apply to the Load More button (defaults to 'btn btn-primary'). */\r\n  public moreButtonClass = input<string>( \"btn btn-primary\" );\r\n\r\n  /** The message to display to load all items. */\r\n  public loadAllText = input<string>( \"Load All...\" );\r\n\r\n  /** The classes to apply to the Load All button (defaults to 'btn btn-secondary'). */\r\n  public allButtonClass = input<string>( \"btn btn-secondary\" );\r\n\r\n  /** Indicates to show/hide the Load All button. */\r\n  public showAllButton = input<boolean>( true );\r\n\r\n  /** Indicates to show/hide the item counts in the button captions. */\r\n  public showCounts = input<boolean>( true );\r\n\r\n  /**\r\n   * The event raised when new calculations are made to load more items. The event\r\n   * argument will include the start and end index {@link TbxLoadMoreEvent}.\r\n   */\r\n  public loadMore = output<TbxLoadMoreEvent>();\r\n\r\n  /** Gets a value indicating whether there are more items to load. */\r\n  protected moreItems = computed( () => this.loadOffset() < this.totalItems() );\r\n\r\n  /** Indicates to show the component (defaults to not visible). */\r\n  protected visible = computed( () => this.totalItems() > 0 );\r\n\r\n  /** Stores the last offset that was loaded. */\r\n  protected loadOffset = signal( 0 );\r\n\r\n  public constructor() {\r\n    effect( () => {\r\n      // console.log( \"Data changed\", this.totalItems() );\r\n      this.totalItems();\r\n      this.resetLoad();\r\n    } );\r\n  }\r\n\r\n  protected resetLoad(): void {\r\n    // If we directly emit an event to update, Angular will throw a\r\n    // ExpressionChangedAfterItHasBeenCheckedError error. Create a\r\n    // micro-task to emit the event instead https://tinyurl.com/y7drfj5p\r\n    void Promise.resolve( null ).then( () => {\r\n      // console.log( \"Resetting to zero...\" );\r\n      this.loadOffset.set( 0 );\r\n      this.onLoadMore();\r\n      // this.visible = this.internalTotalItems > 0;\r\n    } );\r\n  }\r\n\r\n  protected onLoadAll(): void {\r\n    if( !this.moreItems() ) {\r\n      return;\r\n    }\r\n\r\n    this.loadOffset.set( this.totalItems() );\r\n\r\n    this.loadMore.emit( {\r\n      totalItems: this.totalItems(),\r\n      startIndex: this.loadOffset(),\r\n      endIndex: this.loadOffset()\r\n    } );\r\n  }\r\n\r\n  protected onLoadMore(): void {\r\n    if( !this.moreItems() ) {\r\n      return;\r\n    }\r\n\r\n    // Need to convert input properties to number even if declared as that\r\n    // https://tinyurl.com/ydc92mng\r\n    let endIndex = this.loadOffset() + Number( this.loadSize() );\r\n    if( endIndex > this.totalItems() ) {\r\n      endIndex = this.totalItems();\r\n    }\r\n\r\n    // Let subscribers know they have to load more items.\r\n    this.loadMore.emit( {\r\n      totalItems: this.totalItems(),\r\n      startIndex: this.loadOffset(),\r\n      endIndex\r\n    } );\r\n\r\n    // Increment the offset/start index to next group\r\n    this.loadOffset.update( o => o + Number( this.loadSize() ) );\r\n  }\r\n}\r\n","@if (visible()) {\r\n  <div class=\"load-more\">\r\n    @if (moreItems()) {\r\n      <button class=\"{{ moreButtonClass() }}\"\r\n              (click)=\"onLoadMore()\">\r\n        @if (showChevron()) {\r\n          <i class=\"{{ chevronClass() }}\"></i>\r\n        }\r\n        &nbsp;{{ loadMoreText() }}\r\n        @if (showCounts()) {\r\n          ({{ loadOffset() | number }} - {{ totalItems() | number }})\r\n        }\r\n      </button>\r\n      @if (showAllButton()) {\r\n        <button class=\"{{ allButtonClass() }} ms-1\"\r\n                (click)=\"onLoadAll()\">\r\n          @if (showChevron()) {\r\n            <i class=\"fa fa-chevron-circle-right\"></i>\r\n          }\r\n          &nbsp;{{ loadAllText() }}\r\n          @if (showCounts()) {\r\n            ({{ totalItems() | number }})\r\n          }\r\n        </button>\r\n      }\r\n    } @else {\r\n      <div class=\"no-more-message\">\r\n        {{ noMoreMessage() }}\r\n      </div>\r\n    }\r\n  </div>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}