@globalpayments/vega 2.23.0 → 2.24.2

package/dist/cjs/vega-banner.cjs.entry.js

@@ -10,16 +10,16 @@ const accessibility = require('./accessibility-bfa227f6.js');
 const ui = require('./ui-08f33116.js');
 const internalIconManager = require('./internal-icon-manager-3dd4faeb.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-92271bc0.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
 const featureFlagController = require('./feature-flag-controller-0e5235e1.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
 require('./icon-manager-2c3cf5ba.js');
 require('./create-public-api-runtime-metrics-slimmer-d2d49ff5.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./misc-3d30df91.js');
 require('./change-manager-a297e4d2.js');
 require('./index-5792390b.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 
 var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -277,33 +277,47 @@ const VegaBanner = class {
     this.actionButtonClickEventEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaBanner, vegaEventId.VegaActionButtonClick);
     /**
      * Specifies the type of the banner.
+     *
+     * @version 2.8.0
      */
     this.type = 'info';
     /**
      * Specifies the label or title for the banner.
+     *
+     * @version 2.8.0
      */
     this.bannerTitle = '';
     /**
      * Specifies the content displayed within the banner.
+     *
+     * @version 2.8.0
      */
     this.content = '';
     /**
      * Specifies the action buttons available within the banner.
      *    These buttons enable users to perform specific actions,
      *    enhancing user interaction within the banner.
+     *
+     * @version 2.8.0
      */
     this.actionButtons = null;
     /**
      * Determines whether the close icon is displayed.
+     *
+     * @version 1.13.0
      */
     this.showCloseButton = true;
     /**
      * Determines whether the banner is displayed.
+     *
+     * @version 2.13.0
      */
     this.isOpen = true;
   }
   /**
    * Invoke this method to close the banner.
+   *
+   * @version 2.8.0
    */
   async doClose() {
     this.host.remove();

package/dist/cjs/vega-bar-chart.cjs.entry.js

@@ -192,6 +192,8 @@ const VegaBarChart = class {
     this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer();
     /**
      * Specifies the rendering options for the bar chart.
+     *
+     * @version 1.33.0
      */
     this.options = {};
   }

package/dist/cjs/vega-breadcrumb.cjs.entry.js

@@ -7,12 +7,12 @@ const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const ui = require('./ui-08f33116.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-92271bc0.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
 const component = require('./component-73a88c4e.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
 require('./change-manager-a297e4d2.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -222,10 +222,14 @@ const VegaBreadcrumb = class {
      * If you set this value to `none`, all items will remain expanded.
   
      * The minimum allowed value for this property is 4.
+     *
+     * @version 1.41.0
      */
     this.maxItems = 4;
     /**
      * Represents the individual elements within the `vega-breadcrumb` component.
+     *
+     * @version 1.41.0
      */
     this.items = [];
   }

package/dist/cjs/vega-button-circle.cjs.entry.js

@@ -9,9 +9,9 @@ const changeManager = require('./change-manager-a297e4d2.js');
 const staticSubjectTitle = require('./static-subject-title-41c88385.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
 require('./type-guard-4d05d4b2.js');
 require('./breakpoints-cb3291ba.js');
 require('./ui-077fc009.js');
@@ -23,7 +23,7 @@ require('./pixel-98f2a10c.js');
 require('./state-background-color-formatter-33ae4282.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./dom-node-subject-observer-factory-92271bc0.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -97,6 +97,8 @@ const VegaButtonCircle = class {
     this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer(VegaButtonCircleRuntimeMetricsPayloadDefinition);
     /**
      * Specifies the size of the circular button.
+     *
+     * @version 1.0.2
      */
     this.size = 'default';
     /**
@@ -113,28 +115,40 @@ const VegaButtonCircle = class {
      * - `icon-only`:
      *      The circular button is rendered with an icon displayed in the default state,
      *      and the circle background appears when hovering over the button.
+     *
+     * @version 1.0.2
      */
     this.variant = 'primary';
     /**
      * Specifies whether the circular button element is disabled.
+     *
+     * @version 1.0.4
      */
     this.disabled = false;
     /**
      * Indicates the danger status of the circular button,
      *    typically used for destructive actions.
+     *
+     * @version 1.3.0
      */
     this.danger = false;
     /**
      * Specifies the type of button and its behavior in relation to
      *    form submission and data reset.
+     *
+     * @version 1.16.0
      */
     this.type = 'button';
     /**
      * Specifies the color of the icon displayed on the circular button.
+     *
+     * @version 1.24.0
      */
     this.iconColor = 'text-primary';
     /**
      * Indicates whether to use a tooltip to display the label for the button circle.
+     *
+     * @version 2.0.0
      */
     this.showTooltip = true;
     this.handleClick = (e) => {

package/dist/cjs/vega-button-group_2.cjs.entry.js

@@ -6,16 +6,16 @@ const index = require('./index-09acd3c9.js');
 const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
-const subStateObserverSlimmer = require('./sub-state-observer-slimmer-0bac2ea0.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
+const subStateObserverSlimmer = require('./sub-state-observer-slimmer-60be5379.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-92271bc0.js');
-const vegaInternalEventId = require('./vega-internal-event-id-cf4aeaec.js');
+const vegaInternalEventId = require('./vega-internal-event-id-ac20ea74.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 const ui = require('./ui-08f33116.js');
 require('./dynamic-slimmer-f31fdfd7.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -124,14 +124,20 @@ const VegaButtonGroup = class {
      * Specifies the visual style and prominence of the button group.
      *
      * It determines how the button group will be presented to the user.
+     *
+     * @version 2.5.0
      */
     this.variant = 'primary';
     /**
      * Specifies the size of the button group.
+     *
+     * @version 2.5.0
      */
     this.size = 'default';
     /**
      * Specifies the placement of the icon in relation to the button's label.
+     *
+     * @version 2.5.0
      */
     this.iconAlign = 'left';
   }
@@ -389,6 +395,8 @@ const VegaButtonGroupItem = class {
     this.iconAlign = 'left';
     /**
      * Specifies whether to display the icon only.
+     *
+     * @version 2.5.0
      */
     this.iconOnly = false;
   }

package/dist/cjs/vega-button-link.cjs.entry.js

@@ -6,13 +6,13 @@ const index = require('./index-09acd3c9.js');
 const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./change-manager-a297e4d2.js');
 require('./dom-node-subject-observer-factory-92271bc0.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -67,10 +67,14 @@ const VegaButtonLink = class {
     this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer(VegaButtonLinkRuntimeMetricsPayloadDefinition);
     /**
      * Specifies the URL associated with the button link.
+     *
+     * @version 1.0.4
      */
     this.link = VegaButtonLink.defaultLink;
     /**
      * Specifies the size of the button link.
+     *
+     * @version 1.0.2
      */
     this.size = 'default';
     /**
@@ -84,24 +88,35 @@ const VegaButtonLink = class {
      *      The icon is rendered with a circular background,
      *      providing additional emphasis and visual prominence
      *      to the icon in the button link.
+     *
+     * @version 1.0.5
      */
     this.iconType = 'icon';
     /**
      * Specifies the placement of the icon in relation to
      *    the button link's label.
+     *
+     * @version 1.3.0
      */
     this.iconAlign = 'left';
     /**
      * Specifies the text displayed on the button link.
+     *
+     * @version 1.0.4
      */
+    /* eslint-disable-next-line @stencil/strict-mutable */
     this.label = '';
     /**
      * Specifies whether the button link element is disabled.
+     *
+     * @version 1.3.0
      */
     this.disabled = false;
     /**
      * Indicates the danger status of the button link,
      *    typically used for destructive actions.
+     *
+     * @version 1.3.0
      */
     this.danger = false;
     /**
@@ -113,6 +128,8 @@ const VegaButtonLink = class {
      *    and no events will be emitted.
      *
      * @deprecated Setting the `link` property internally manages the eventful state of a Button Link.
+     *
+     * @version 1.3.0
      */
     this.eventful = true;
     this.onClick = (e) => {

package/dist/cjs/vega-button.cjs.entry.js

@@ -11,9 +11,9 @@ const changeManager = require('./change-manager-a297e4d2.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-1e404fc7.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
 require('./ui-077fc009.js');
 require('./type-guard-4d05d4b2.js');
 require('./regex-c1f70fd4.js');
@@ -22,7 +22,7 @@ require('./number-459031f7.js');
 require('./pixel-98f2a10c.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./dom-node-subject-observer-factory-92271bc0.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -87,45 +87,64 @@ const VegaButton = class {
     this.currentBreakpoint = breakpoints.getCurrentBreakpoint();
     /**
      * Specifies the size of the button.
+     *
+     * @version 1.0.0
      */
     this.size = 'default';
     /**
      * Specifies the visual style and prominence of the button.
      *
      * It determines how the button will be presented to the user.
+     *
+     * @version 1.0.0
      */
     this.variant = 'primary';
     /**
      * Specifies the placement of the icon in relation to the button's label.
+     *
+     * @version 1.3.0
      */
     this.iconAlign = 'left';
     /**
      * Specifies the text displayed on the button.
+     *
+     * @version 1.0.3
      */
+    /* eslint-disable-next-line @stencil/strict-mutable */
     this.label = null;
     /**
      * Specifies whether the button element is disabled.
+     *
+     * @version 1.0.3
      */
     this.disabled = false;
     /**
      * Indicates the danger status of the button,
      *    typically used for destructive actions.
+     *
+     * @version 1.3.0
      */
     this.danger = false;
     /**
      * Specifies whether the button should span the
      *    full width of its parent element.
+     *
+     * @version 1.3.0
      */
     this.block = false;
     /**
      * Specifies the type of button and its behavior in relation to
      *    form submission and data reset.
+     *
+     * @version 1.0.3
      */
     this.type = 'button';
     /**
      * Specifies whether the button is in a loading state. When `true`,
      *     the button is disabled and an indeterminate loading indicator
      *     is displayed within the button.
+     *
+     * @version 2.17.0
      */
     this.loading = false;
     this.handleClick = (e) => {
@@ -147,7 +166,7 @@ const VegaButton = class {
     this.host.innerHTML = '';
   }
   render() {
-    return component.sanitizeVegaComponent(index.h(index.Host, { class: { 'vega-button-block': this.block } }, index.h("button", { type: this.type, "aria-label": this.label || 'No label defined', class: {
+    return component.sanitizeVegaComponent(index.h(index.Host, { class: { 'vega-button-block': this.isBlockStyleButton() } }, index.h("button", { type: this.type, "aria-label": this.label || 'No label defined', class: {
         [`vega-button-size-${responsiveFormatFacade.ResponsiveFormatFacade.formatCustom(this.size)}`]: true,
         [`vega-button-variant-${this.variant}`]: true,
         'vega-button-disabled': this.isDisabledButton(),
@@ -180,6 +199,14 @@ const VegaButton = class {
   isDisabledButton() {
     return this.disabled || this.loading;
   }
+  /**
+   * Returns a boolean value based on the formatting of a block using a responsive format facade.
+   *
+   * @returns {boolean} A boolean value.
+   */
+  isBlockStyleButton() {
+    return responsiveFormatFacade.ResponsiveFormatFacade.formatCustom(this.block);
+  }
   get host() { return index.getElement(this); }
 };
 __decorate([

package/dist/cjs/vega-calendar_3.cjs.entry.js

@@ -7,19 +7,19 @@ const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-92271bc0.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
 const internalIconManager = require('./internal-icon-manager-3dd4faeb.js');
 const date = require('./date-0a6bb035.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-a028e5a1.js');
-const vegaInternalEventId = require('./vega-internal-event-id-cf4aeaec.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-176d59ee.js');
+const vegaInternalEventId = require('./vega-internal-event-id-ac20ea74.js');
 const accessibility = require('./accessibility-bfa227f6.js');
 const array = require('./array-6e559cde.js');
 const misc = require('./misc-3d30df91.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-1e404fc7.js');
 const timer = require('./timer-5f33058b.js');
 const changeManager = require('./change-manager-a297e4d2.js');
-const subStateObserverSlimmer = require('./sub-state-observer-slimmer-0bac2ea0.js');
+const subStateObserverSlimmer = require('./sub-state-observer-slimmer-60be5379.js');
 const placeholder = require('./placeholder-cb6d37ad.js');
 const typeGuard = require('./type-guard-4d05d4b2.js');
 const stateBackgroundColorFormatter = require('./state-background-color-formatter-33ae4282.js');
@@ -27,7 +27,7 @@ const pixel = require('./pixel-98f2a10c.js');
 require('./icon-manager-2c3cf5ba.js');
 require('./create-public-api-runtime-metrics-slimmer-d2d49ff5.js');
 require('./dynamic-slimmer-f31fdfd7.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./vega-env-manager-23b8b23c.js');
 require('./feature-flag-controller-0e5235e1.js');
 require('./index-5792390b.js');
@@ -3377,15 +3377,21 @@ const VegaCalendar = class {
     this.calendarEvents = [];
     /**
      * Specifies the current view mode of the calendar.
+     *
+     * @version 2.14.0
      */
-    /* eslint-disable @stencil/strict-mutable */
+    /* eslint-disable-next-line @stencil/strict-mutable */
     this.viewMode = 'month';
     /**
      * Specifies the time format of the calendar.
+     *
+     * @version 2.14.0
      */
     this.timeFormat = '24-hour';
     /**
      * Controls the visibility of the calendar's event color bar.
+     *
+     * @version 2.21.0
      */
     this.showEventColorBar = true;
   }

package/dist/cjs/vega-card.cjs.entry.js

@@ -139,6 +139,8 @@ const VegaCard = class {
      * Defines the background color of the card element.
      *    It accepts a string value representing a valid
      *    background color token.
+     *
+     * @version 1.3.0
      */
     this.backgroundColor = 'bg-primary';
     /**

package/dist/cjs/vega-carousel.cjs.entry.js

@@ -10,8 +10,8 @@ const responsiveFormatFacade = require('./responsive-format-facade-f7e69718.js')
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-1ee24991.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-1e404fc7.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-3fa79b00.js');
-const vegaEventId = require('./vega-event-id-5f19ff1c.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-4fb793e5.js');
+const vegaEventId = require('./vega-event-id-8aa22611.js');
 const deprecatedPropertySlimmer = require('./deprecated-property-slimmer-fc729fd9.js');
 require('./type-guard-4d05d4b2.js');
 require('./breakpoints-cb3291ba.js');
@@ -23,7 +23,7 @@ require('./pixel-98f2a10c.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./change-manager-a297e4d2.js');
 require('./dom-node-subject-observer-factory-92271bc0.js');
-require('./internal-vega-event-manager-f0f9a473.js');
+require('./internal-vega-event-manager-b80fede0.js');
 require('./object-bbd4ed7f.js');
 
 /**
@@ -257,26 +257,36 @@ const VegaCarousel = class {
     /**
      * Specifies the number of elements displayed per page in the carousel.
      * @deprecated This property will be removed soon and replaced by prop itemsPerPage
+     *
+     * @version 1.0.2
      */
     this.perPage = 1;
     /**
      * Specifies the number of items displayed per page in the carousel.
+     *
+     * @version 2.1.0
      */
     this.itemsPerPage = 1;
     /**
      * Specifies whether to show the navigational buttons
      *    at the bottom of the carousel.
+     *
+     * @version 1.0.2
      */
     this.showSlider = true;
     /**
      * Controls the amount of space between the elements in the carousel
      *    when more than one element is displayed on each page
      *    using the `itemsPerPage` property.
+     *
+     * @version 1.0.2
      */
     this.spacing = 'size-16';
     /**
      * Indicates whether the carousel can be swiped
      *    to navigate between pages on a mobile device.
+     *
+     * @version 1.18.0
      */
     this.canSwipe = true;
     this.onClickIndicators = async (e) => {
@@ -356,6 +366,8 @@ const VegaCarousel = class {
   /**
    * Invoke this method to transition the carousel to the next available page,
    *    if it exists.
+   *
+   * @version 1.0.2
    */
   async nextPage() {
     const nextPage = this.page < this.totalPages ? this.page + 1 : this.page;
@@ -364,6 +376,8 @@ const VegaCarousel = class {
   /**
    * Invoke this method to transition the carousel to the previous page,
    *    if it exists.
+   *
+   * @version 1.0.2
    */
   async prevPage() {
     const nextPage = this.page > 1 ? this.page - 1 : this.page;
@@ -374,6 +388,7 @@ const VegaCarousel = class {
    *
    * @param nextPage
    * @returns {Promise<void>}
+   * @version 1.0.6
    */
   async goToPage(nextPage) {
     await this.goToPageInternal(nextPage);