fix(sort-handle): allow move and reorder events to be cancelled (#12095)

**Related Issue:** #11774

## Summary

- allows events to be cancelled
- This is inconsistent with the other events where the propagation is
being stopped when needed
- see
https://github.com/Esri/calcite-design-system/blob/b1c2b56c883ea3dc59c7fbc121e364b337c12d9d/packages/calcite-components/src/components/block/block.tsx#L312-L332

Author: driskull

packages/calcite-components/src/components/sort-handle/sort-handle.e2e.ts

@@ -75,8 +75,9 @@ describe("calcite-sort-handle", () => {
 
     await page.keyboard.press("Enter");
     await page.waitForChanges();
-    expect(await calciteSortHandleReorderSpy.lastEvent.detail.reorder).toBe(REORDER_VALUES[0]);
+    expect(calciteSortHandleReorderSpy.lastEvent.detail.reorder).toBe(REORDER_VALUES[0]);
     expect(calciteSortHandleReorderSpy).toHaveReceivedEventTimes(1);
+    expect(calciteSortHandleReorderSpy.lastEvent.cancelable).toBe(true);
   });
 
   it("fires calciteSortHandleMove event", async () => {
@@ -104,8 +105,9 @@ describe("calcite-sort-handle", () => {
 
     await page.keyboard.press(" ");
     await page.waitForChanges();
-    expect(await calciteSortHandleMoveSpy.lastEvent.detail.moveTo.id).toBe(moveToItems[1].id);
+    expect(calciteSortHandleMoveSpy.lastEvent.detail.moveTo.id).toBe(moveToItems[1].id);
     expect(calciteSortHandleMoveSpy).toHaveReceivedEventTimes(1);
+    expect(calciteSortHandleMoveSpy.lastEvent.cancelable).toBe(true);
   });
 
   it("is disabled when no moveToItems, setPosition < 1 or setSize < 2", async () => {

packages/calcite-components/src/components/sort-handle/sort-handle.tsx

@@ -136,13 +136,13 @@ export class SortHandle extends LitElement implements InteractiveComponent {
   calciteSortHandleClose = createEvent({ cancelable: false });
 
   /** Fires when a move item has been selected. */
-  calciteSortHandleMove = createEvent<MoveEventDetail>({ cancelable: false });
+  calciteSortHandleMove = createEvent<MoveEventDetail>({ cancelable: true });
 
   /** Fires when the component is open and animation is complete. */
   calciteSortHandleOpen = createEvent({ cancelable: false });
 
   /** Fires when a reorder has been selected. */
-  calciteSortHandleReorder = createEvent<ReorderEventDetail>({ cancelable: false });
+  calciteSortHandleReorder = createEvent<ReorderEventDetail>({ cancelable: true });
 
   // #endregion