feat!: dispatch "change" event in Pagination, rename "change" to "update" in Select (#1497)

Closes #1491

* feat(pagination): dispatch "change" event when interacting with previous/next buttons, page/page size dropdowns

* breaking(select): rename dispatched "change" event to "update"

* breaking(select): forward `change` event to `Select`

src/Pagination/Pagination.svelte

@@ -1,8 +1,9 @@
 <script>
   /**
-   * @event {{ pageSize: number; page: number; }} update
+   * @event {{ page?: number; pageSize?: number }} change - Dispatched after any user interaction
    * @event {{ page: number; }} click:button--previous
    * @event {{ page: number; }} click:button--next
+   * @event {{ pageSize: number; page: number; }} update
    */
 
   /** Specify the current page index */
@@ -109,6 +110,9 @@
         hideLabel
         noLabel
         inline
+        on:change="{() => {
+          dispatch('change', { pageSize });
+        }}"
         bind:selected="{pageSize}"
       >
         {#each pageSizes as size, i (size)}
@@ -136,6 +140,9 @@
         labelText="Page number, of {totalPages} pages"
         inline
         hideLabel
+        on:change="{() => {
+          dispatch('change', { page });
+        }}"
         bind:selected="{page}"
       >
         {#each selectItems as size, i (size)}
@@ -161,6 +168,7 @@
       on:click="{() => {
         page--;
         dispatch('click:button--previous', { page });
+        dispatch('change', { page });
       }}"
     />
     <Button
@@ -176,6 +184,7 @@
       on:click="{() => {
         page++;
         dispatch('click:button--next', { page });
+        dispatch('change', { page });
       }}"
     />
   </div>

src/Select/Select.svelte

@@ -1,6 +1,6 @@
 <script>
   /**
-   * @event {string | number} change
+   * @event {string | number} update The selected value.
    */
 
   /**
@@ -114,7 +114,7 @@
     selected = $selectedValue;
 
     if (prevSelected !== undefined && selected !== prevSelected) {
-      dispatch("change", $selectedValue);
+      dispatch("update", $selectedValue);
     }
 
     prevSelected = selected;
@@ -163,6 +163,7 @@
             class:bx--select-input--sm="{size === 'sm'}"
             class:bx--select-input--xl="{size === 'xl'}"
             on:change="{handleChange}"
+            on:change
             on:input
             on:focus
             on:blur
@@ -206,6 +207,7 @@
           class:bx--select-input--sm="{size === 'sm'}"
           class:bx--select-input--xl="{size === 'xl'}"
           on:change="{handleChange}"
+          on:change
           on:input
           on:focus
           on:blur