@astryxdesign/lab 0.7.7-canary.f4edef8 → 0.7.7-canary.f88f5dc

package/dist/MobilePowerSearch/MobilePowerSearch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MobilePowerSearch.d.ts","sourceRoot":"","sources":["../../src/MobilePowerSearch/MobilePowerSearch.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"MobilePowerSearch.d.ts","sourceRoot":"","sources":["../../src/MobilePowerSearch/MobilePowerSearch.tsx"],"names":[],"mappings":"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"}

package/dist/MobilePowerSearch/MobilePowerSearch.js

@@ -97,8 +97,7 @@ import { useLocale, useTranslator } from '@astryxdesign/core/i18n';
 import '@astryxdesign/core/theme/tokens.stylex';
 import { colorVars, fontWeightVars, radiusVars, sizeVars, spacingVars, typeScaleVars, typographyVars } from '@astryxdesign/core/theme/tokens.stylex';
 import { isImeKeyEvent, isRenderable, rtlStyles } from '@astryxdesign/core/utils';
-import { MobileSheetConfirmation } from "../internal/MobileSheetConfirmation.js";
-import { useDismissSearchOnTouchDrag } from "../internal/useDismissSearchOnTouchDrag.js";
+import { SheetConfirmation, useDismissSearchOnTouchDrag } from '@astryxdesign/core/internal/touch-sheet';
 import { MobilePowerSearchValueEditor } from "./MobilePowerSearchValueEditor.js";
 import { createContentSearchSource, createFilterIdentities, fieldMatchesQuery, filterSignature, isSupportedOperator, nearestEditableIndex, resolveFilterIdentityIndex, useMobilePowerSearchConfig } from "./mobilePowerSearchUtils.js";
 
@@ -493,7 +492,9 @@ export function MobilePowerSearch({
 
   // ------------------------------------------------------------------ focus --
 
-  const fieldPickerDragProps = useDismissSearchOnTouchDrag(() => [contentSearchRef.current?.querySelector('input'), fieldSearchRef.current?.querySelector('input')]);
+  // A drag moves focus to the sheet's panel, never to the page body behind
+  // the open modal.
+  const fieldPickerDragProps = useDismissSearchOnTouchDrag(() => [contentSearchRef.current?.querySelector('input'), fieldSearchRef.current?.querySelector('input')], () => (fieldSearchRef.current ?? contentSearchRef.current)?.closest('[tabindex="-1"]'));
   const focusPendingSheetTarget = useCallback(() => {
     const target = pendingSheetFocusRef.current;
     if (target == null) {
@@ -1721,7 +1722,7 @@ export function MobilePowerSearch({
           })]
         })]
       })
-    }), /*#__PURE__*/_jsx(MobileSheetConfirmation, {
+    }), /*#__PURE__*/_jsx(SheetConfirmation, {
       isOpen: isClearConfirmationOpen,
       onOpenChange: setIsClearConfirmationOpen,
       title: "Clear all filters?",

package/dist/MobileTokenizer/MobileTokenizer.d.ts

@@ -1,7 +1,7 @@
 /**
  * @file MobileTokenizer.tsx
  * @input Public @astryxdesign/core components and hooks, plus private Lab
- *   mobile-sheet confirmation and search-drag dismissal owners
+ *   touch-sheet confirmation and search-drag dismissal from Core's internal entry
  * @output Exports MobileTokenizer — Lab prototype of the touch Tokenizer
  *   flow with the inline-compatible closed trigger, a searchable draft-selection
  *   sheet, persistent Clear all / Save footer, dirty-dismiss confirmation,

package/dist/MobileTokenizer/MobileTokenizer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MobileTokenizer.d.ts","sourceRoot":"","sources":["../../src/MobileTokenizer/MobileTokenizer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EASL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAclD,OAAO,KAAK,EAAC,cAAc,EAAE,YAAY,EAAC,MAAM,8BAA8B,CAAC;AAY/E,MAAM,MAAM,qBAAqB,CAAC,CAAC,SAAS,cAAc,IACtD;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,KAAK,CAAA;CAAC,GACtB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,IAAI,CAC1E,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC9B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACjE;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8DAA8D;IAC9D,MAAM,CAAC,EAAE;QAAC,IAAI,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAC,CAAC;IAClE;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAoMD,wBAAgB,eAAe,CAAC,CAAC,SAAS,cAAc,EAAE,EACxD,KAAK,EACL,aAAa,EACb,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,WAAW,EACX,MAAM,EACN,eAAe,EACf,QAAQ,EACR,UAAU,EACV,UAAkB,EAClB,SAAiB,EACjB,UAAU,EACV,YAAiB,EACjB,cAAkB,EAClB,UAAgB,EAChB,sBAAsB,EACtB,aAAa,EACb,MAAM,EACN,EAAE,EACF,SAAS,EACT,KAAK,EACL,YAAY,EAAE,aAAa,EAC3B,kBAAkB,EAAE,mBAAmB,EACvC,OAAO,EAAE,aAAa,EACtB,OAAO,EAAE,aAAa,EACtB,MAAM,EAAE,YAAY,EACpB,GAAG,IAAI,EACR,EAAE,oBAAoB,CAAC,CAAC,CAAC,qBAwPzB;yBAvRe,eAAe"}
+{"version":3,"file":"MobileTokenizer.d.ts","sourceRoot":"","sources":["../../src/MobileTokenizer/MobileTokenizer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EASL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAclD,OAAO,KAAK,EAAC,cAAc,EAAE,YAAY,EAAC,MAAM,8BAA8B,CAAC;AAiB/E,MAAM,MAAM,qBAAqB,CAAC,CAAC,SAAS,cAAc,IACtD;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,KAAK,CAAA;CAAC,GACtB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,IAAI,CAC1E,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC9B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACjE;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8DAA8D;IAC9D,MAAM,CAAC,EAAE;QAAC,IAAI,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAC,CAAC;IAClE;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAwLD,wBAAgB,eAAe,CAAC,CAAC,SAAS,cAAc,EAAE,EACxD,KAAK,EACL,aAAa,EACb,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,WAAW,EACX,MAAM,EACN,eAAe,EACf,QAAQ,EACR,UAAU,EACV,UAAkB,EAClB,SAAiB,EACjB,UAAU,EACV,YAAiB,EACjB,cAAkB,EAClB,UAAgB,EAChB,sBAAsB,EACtB,aAAa,EACb,MAAM,EACN,EAAE,EACF,SAAS,EACT,KAAK,EACL,YAAY,EAAE,aAAa,EAC3B,kBAAkB,EAAE,mBAAmB,EACvC,OAAO,EAAE,aAAa,EACtB,OAAO,EAAE,aAAa,EACtB,MAAM,EAAE,YAAY,EACpB,GAAG,IAAI,EACR,EAAE,oBAAoB,CAAC,CAAC,CAAC,qBAwPzB;yBAvRe,eAAe"}

package/dist/MobileTokenizer/MobileTokenizer.js

@@ -5,7 +5,7 @@
 /**
  * @file MobileTokenizer.tsx
  * @input Public @astryxdesign/core components and hooks, plus private Lab
- *   mobile-sheet confirmation and search-drag dismissal owners
+ *   touch-sheet confirmation and search-drag dismissal from Core's internal entry
  * @output Exports MobileTokenizer — Lab prototype of the touch Tokenizer
  *   flow with the inline-compatible closed trigger, a searchable draft-selection
  *   sheet, persistent Clear all / Save footer, dirty-dismiss confirmation,
@@ -53,8 +53,7 @@ import { composeEventHandlers, mergeProps } from '@astryxdesign/core/utils';
 import { VisuallyHidden } from '@astryxdesign/core/VisuallyHidden';
 import '@astryxdesign/core/theme/tokens.stylex';
 import { colorVars, radiusVars, sizeVars, spacingVars } from '@astryxdesign/core/theme/tokens.stylex';
-import { MobileSheetConfirmation } from "../internal/MobileSheetConfirmation.js";
-import { useDismissSearchOnTouchDrag } from "../internal/useDismissSearchOnTouchDrag.js";
+import { SheetConfirmation, hasSameSelection, nameSheetDraftChange, useDismissSearchOnTouchDrag } from '@astryxdesign/core/internal/touch-sheet';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const CREATABLE_ID_PREFIX = '__xds_create__';
 const LIST_RENDER_BATCH_SIZE = 50;
@@ -64,9 +63,6 @@ const LIST_LOAD_MORE_THRESHOLD_PX = 200;
 // concentric with the field's (radius-2) when inset = radius-2 − radius-1 −
 // border = 3px. The same number is the row gap, so wrapped rows read evenly.
 const TOKEN_ROW_INSET = `calc(${spacingVars['--spacing-1']} - 1px)`;
-function hasSameSelection(a, b) {
-  return a.length === b.length && a.every(item => b.some(candidate => candidate.id === item.id));
-}
 const styles = {
   trigger: {
     kzqmXN: "xh8yej3",
@@ -657,34 +653,9 @@ function MobileTokenizerSheetContent({
     if (isDraftOverMax) {
       return;
     }
-    if (isDraftDirty) {
-      const added = draftValue.find(item => !valueAtOpen.some(openItem => openItem.id === item.id));
-      const removed = valueAtOpen.find(item => !draftValue.some(draftItem => draftItem.id === item.id));
-      const lastDraftChange = lastDraftChangeRef.current;
-      const lastChangeIsNet = lastDraftChange != null && (lastDraftChange.type === 'remove' ? valueAtOpen.some(item => item.id === lastDraftChange.item.id) && !draftValue.some(item => item.id === lastDraftChange.item.id) : draftValue.some(item => item.id === lastDraftChange.item.id) && !valueAtOpen.some(item => item.id === lastDraftChange.item.id));
-      let change = null;
-      if (lastChangeIsNet) {
-        change = lastDraftChange;
-      } else if (lastDraftChange?.type === 'remove' && removed != null) {
-        change = {
-          item: removed,
-          type: 'remove'
-        };
-      } else if (added != null) {
-        const type = lastDraftChange?.item.id === added.id && lastDraftChange.type === 'create' ? 'create' : 'add';
-        change = {
-          item: added,
-          type
-        };
-      } else if (removed != null) {
-        change = {
-          item: removed,
-          type: 'remove'
-        };
-      }
-      if (change != null) {
-        onCommit([...draftValue], change);
-      }
+    const change = isDraftDirty ? nameSheetDraftChange(valueAtOpen, draftValue, lastDraftChangeRef.current) : null;
+    if (change != null) {
+      onCommit([...draftValue], change);
     }
     onCloseSheet();
   };
@@ -692,7 +663,9 @@ function MobileTokenizerSheetContent({
     label
   });
   const noResultsTitle = emptySearchResultsText ?? t('@astryx.typeahead.emptySearchResults');
-  const listDragProps = useDismissSearchOnTouchDrag(() => [searchRef.current]);
+  // A drag moves focus to the sheet's panel, never to the page body behind
+  // the open modal.
+  const listDragProps = useDismissSearchOnTouchDrag(() => [searchRef.current], () => searchRef.current?.closest('[tabindex="-1"]'));
   return /*#__PURE__*/_jsxs("div", {
     ...{
       className: "x78zum5 xdt5ytf x5yr21d x2lwn1j xrrkdod xoxd1wu xvmdzux"
@@ -881,7 +854,7 @@ function MobileTokenizerSheetContent({
         onClick: handleSave,
         xstyle: styles.footerAction
       })]
-    }), isClearConfirmationOpen && /*#__PURE__*/_jsx(MobileSheetConfirmation, {
+    }), isClearConfirmationOpen && /*#__PURE__*/_jsx(SheetConfirmation, {
       isOpen: true,
       onOpenChange: next => {
         if (!next) {
@@ -905,7 +878,7 @@ function MobileTokenizerSheetContent({
         }
         closeClearConfirmation(true);
       }
-    }), isDiscardConfirmationOpen && /*#__PURE__*/_jsx(MobileSheetConfirmation, {
+    }), isDiscardConfirmationOpen && /*#__PURE__*/_jsx(SheetConfirmation, {
       isOpen: true,
       onOpenChange: next => {
         if (!next) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astryxdesign/lab",
-  "version": "0.7.7-canary.f4edef8",
+  "version": "0.7.7-canary.f88f5dc",
   "description": "Experimental Astryx components — published to npm only under the @canary dist-tag for early testing; never released as a stable (latest) version.",
   "author": "Meta Open Source",
   "license": "MIT",
@@ -49,7 +49,7 @@
   },
   "peerDependencies": {
     "@stylexjs/stylex": ">=0.10.0",
-    "@astryxdesign/core": "0.7.7-canary.f4edef8",
+    "@astryxdesign/core": "0.7.7-canary.f88f5dc",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0"
   },
@@ -59,9 +59,9 @@
     "d3-shape": "^3.2.0"
   },
   "devDependencies": {
-    "@astryxdesign/a11y-spec": "0.7.7-canary.f4edef8",
-    "@astryxdesign/cli": "0.7.7-canary.f4edef8",
-    "@astryxdesign/interaction-harness": "0.7.7-canary.f4edef8",
+    "@astryxdesign/a11y-spec": "0.7.7-canary.f88f5dc",
+    "@astryxdesign/cli": "0.7.7-canary.f88f5dc",
+    "@astryxdesign/interaction-harness": "0.7.7-canary.f88f5dc",
     "@babel/cli": "^7.29.7",
     "@babel/core": "^7.29.7",
     "@babel/preset-react": "^7.29.7",

package/src/MobilePowerSearch/MobilePowerSearch.test.tsx

@@ -1859,6 +1859,10 @@ describe('MobilePowerSearch content search', () => {
     expect(
       within(sheet()).getByRole('heading', {name: 'Filters'}),
     ).toBeTruthy();
+    // The search sheet held focus as it closed, so words sent with the close
+    // wait for its exit to end (component:BottomSheet FR9, spec:AST-086
+    // FR14); settle that exit.
+    act(() => settleSheets());
     // The add is announced inside the sheet the flow is now on, not on the
     // page body, which assistive technology does not expose under a native
     // modal dialog.
@@ -1893,6 +1897,10 @@ describe('MobilePowerSearch content search', () => {
       within(sheet()).getByRole('button', {name: '"release notes"'}),
     );
     await waitFor(() => expect(isSheetOpen()).toBe(true));
+    // The search sheet held focus as it closed, so words sent with the close
+    // wait for its exit to end (component:BottomSheet FR9, spec:AST-086
+    // FR14); settle that exit.
+    act(() => settleSheets());
     await waitFor(() =>
       expect(sheetRegion().textContent).toBe(
         'Added "release notes" 20 results',

package/src/MobilePowerSearch/MobilePowerSearch.tsx

@@ -142,8 +142,11 @@ import {
   typographyVars,
 } from '@astryxdesign/core/theme/tokens.stylex';
 import {isImeKeyEvent, isRenderable, rtlStyles} from '@astryxdesign/core/utils';
-import {MobileSheetConfirmation} from '../internal/MobileSheetConfirmation';
-import {useDismissSearchOnTouchDrag} from '../internal/useDismissSearchOnTouchDrag';
+
+import {
+  SheetConfirmation,
+  useDismissSearchOnTouchDrag,
+} from '@astryxdesign/core/internal/touch-sheet';
 import {MobilePowerSearchValueEditor} from './MobilePowerSearchValueEditor';
 import {
   createContentSearchSource,
@@ -889,10 +892,18 @@ export function MobilePowerSearch({
 
   // ------------------------------------------------------------------ focus --
 
-  const fieldPickerDragProps = useDismissSearchOnTouchDrag(() => [
-    contentSearchRef.current?.querySelector('input'),
-    fieldSearchRef.current?.querySelector('input'),
-  ]);
+  // A drag moves focus to the sheet's panel, never to the page body behind
+  // the open modal.
+  const fieldPickerDragProps = useDismissSearchOnTouchDrag(
+    () => [
+      contentSearchRef.current?.querySelector('input'),
+      fieldSearchRef.current?.querySelector('input'),
+    ],
+    () =>
+      (
+        fieldSearchRef.current ?? contentSearchRef.current
+      )?.closest<HTMLElement>('[tabindex="-1"]'),
+  );
 
   const focusPendingSheetTarget = useCallback(() => {
     const target = pendingSheetFocusRef.current;
@@ -2356,7 +2367,7 @@ export function MobilePowerSearch({
         </div>
       </BottomSheet>
 
-      <MobileSheetConfirmation
+      <SheetConfirmation
         isOpen={isClearConfirmationOpen}
         onOpenChange={setIsClearConfirmationOpen}
         title="Clear all filters?"

package/src/MobileTokenizer/MobileTokenizer.test.tsx

@@ -1248,6 +1248,7 @@ describe('MobileTokenizer Core-sheet parity', () => {
       );
     }
     render(<Flow />);
+    const trigger = screen.getByRole('button', {name: /Tags/});
     const sheet = await openSheet();
     // Pending from open until the bootstrap settles.
     expect(within(sheet).getByRole('img', {name: 'Loading'})).toBeTruthy();
@@ -1264,11 +1265,8 @@ describe('MobileTokenizer Core-sheet parity', () => {
     // The field becomes disabled while open: the sheet closes and the query
     // is kept; re-enabled and reopened, it starts from "en", settled.
     fireEvent.click(screen.getByRole('button', {name: 'Toggle'}));
-    expect(screen.getByRole('button', {name: /Tags/})).toHaveAttribute(
-      'aria-expanded',
-      'false',
-    );
-    act(() => screen.getByRole('button', {name: /Tags/}).focus());
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    act(() => trigger.focus());
     await waitFor(() => expect(screen.queryByRole('dialog')).toBeNull());
     fireEvent.click(screen.getByRole('button', {name: 'Toggle'}));
     const reopened = await openSheet();

package/src/MobileTokenizer/MobileTokenizer.tsx

@@ -5,7 +5,7 @@
 /**
  * @file MobileTokenizer.tsx
  * @input Public @astryxdesign/core components and hooks, plus private Lab
- *   mobile-sheet confirmation and search-drag dismissal owners
+ *   touch-sheet confirmation and search-drag dismissal from Core's internal entry
  * @output Exports MobileTokenizer — Lab prototype of the touch Tokenizer
  *   flow with the inline-compatible closed trigger, a searchable draft-selection
  *   sheet, persistent Clear all / Save footer, dirty-dismiss confirmation,
@@ -72,8 +72,13 @@ import {
   sizeVars,
   spacingVars,
 } from '@astryxdesign/core/theme/tokens.stylex';
-import {MobileSheetConfirmation} from '../internal/MobileSheetConfirmation';
-import {useDismissSearchOnTouchDrag} from '../internal/useDismissSearchOnTouchDrag';
+import {
+  SheetConfirmation,
+  hasSameSelection,
+  nameSheetDraftChange,
+  useDismissSearchOnTouchDrag,
+  type SheetDraftChange,
+} from '@astryxdesign/core/internal/touch-sheet';
 
 export type MobileTokenizerChange<T extends SearchableItem> =
   | {item: T; type: 'add'}
@@ -130,18 +135,6 @@ const LIST_LOAD_MORE_THRESHOLD_PX = 200;
 // border = 3px. The same number is the row gap, so wrapped rows read evenly.
 const TOKEN_ROW_INSET = `calc(${spacingVars['--spacing-1']} - 1px)`;
 
-type SheetDraftChange<T> = {
-  item: T;
-  type: 'add' | 'create' | 'remove';
-};
-
-function hasSameSelection<T extends SearchableItem>(a: T[], b: T[]): boolean {
-  return (
-    a.length === b.length &&
-    a.every(item => b.some(candidate => candidate.id === item.id))
-  );
-}
-
 const styles = stylex.create({
   // The closed trigger is the inline Tokenizer field's own control box, as a
   // button — the same `inputWrapperStyles.base` box Core's sheet trigger
@@ -1018,39 +1011,15 @@ function MobileTokenizerSheetContent<T extends SearchableItem>({
     if (isDraftOverMax) {
       return;
     }
-    if (isDraftDirty) {
-      const added = draftValue.find(
-        item => !valueAtOpen.some(openItem => openItem.id === item.id),
-      );
-      const removed = valueAtOpen.find(
-        item => !draftValue.some(draftItem => draftItem.id === item.id),
-      );
-      const lastDraftChange = lastDraftChangeRef.current;
-      const lastChangeIsNet =
-        lastDraftChange != null &&
-        (lastDraftChange.type === 'remove'
-          ? valueAtOpen.some(item => item.id === lastDraftChange.item.id) &&
-            !draftValue.some(item => item.id === lastDraftChange.item.id)
-          : draftValue.some(item => item.id === lastDraftChange.item.id) &&
-            !valueAtOpen.some(item => item.id === lastDraftChange.item.id));
-      let change: SheetDraftChange<T> | null = null;
-      if (lastChangeIsNet) {
-        change = lastDraftChange;
-      } else if (lastDraftChange?.type === 'remove' && removed != null) {
-        change = {item: removed, type: 'remove'};
-      } else if (added != null) {
-        const type: SheetDraftChange<T>['type'] =
-          lastDraftChange?.item.id === added.id &&
-          lastDraftChange.type === 'create'
-            ? 'create'
-            : 'add';
-        change = {item: added, type};
-      } else if (removed != null) {
-        change = {item: removed, type: 'remove'};
-      }
-      if (change != null) {
-        onCommit([...draftValue], change);
-      }
+    const change = isDraftDirty
+      ? nameSheetDraftChange(
+          valueAtOpen,
+          draftValue,
+          lastDraftChangeRef.current,
+        )
+      : null;
+    if (change != null) {
+      onCommit([...draftValue], change);
     }
     onCloseSheet();
   };
@@ -1058,7 +1027,12 @@ function MobileTokenizerSheetContent<T extends SearchableItem>({
   const searchLabel = t('@astryx.tokenizer.search', {label});
   const noResultsTitle =
     emptySearchResultsText ?? t('@astryx.typeahead.emptySearchResults');
-  const listDragProps = useDismissSearchOnTouchDrag(() => [searchRef.current]);
+  // A drag moves focus to the sheet's panel, never to the page body behind
+  // the open modal.
+  const listDragProps = useDismissSearchOnTouchDrag(
+    () => [searchRef.current],
+    () => searchRef.current?.closest<HTMLElement>('[tabindex="-1"]'),
+  );
 
   return (
     <div {...stylex.props(styles.sheetBody)}>
@@ -1245,7 +1219,7 @@ function MobileTokenizerSheetContent<T extends SearchableItem>({
         />
       </div>
       {isClearConfirmationOpen && (
-        <MobileSheetConfirmation
+        <SheetConfirmation
           isOpen
           onOpenChange={next => {
             if (!next) {
@@ -1270,7 +1244,7 @@ function MobileTokenizerSheetContent<T extends SearchableItem>({
         />
       )}
       {isDiscardConfirmationOpen && (
-        <MobileSheetConfirmation
+        <SheetConfirmation
           isOpen
           onOpenChange={next => {
             if (!next) {

package/dist/internal/MobileSheetConfirmation.d.ts

@@ -1,12 +0,0 @@
-interface MobileSheetConfirmationProps {
-    isOpen: boolean;
-    onOpenChange: (isOpen: boolean) => void;
-    title: string;
-    description: string;
-    cancelLabel: string;
-    actionLabel: string;
-    onAction: () => void;
-}
-export declare function MobileSheetConfirmation({ isOpen, onOpenChange, title, description, cancelLabel, actionLabel, onAction, }: MobileSheetConfirmationProps): import("react").JSX.Element;
-export {};
-//# sourceMappingURL=MobileSheetConfirmation.d.ts.map

package/dist/internal/MobileSheetConfirmation.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MobileSheetConfirmation.d.ts","sourceRoot":"","sources":["../../src/internal/MobileSheetConfirmation.tsx"],"names":[],"mappings":"AA0BA,UAAU,4BAA4B;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAMD,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAW,EACX,WAAW,EACX,QAAQ,GACT,EAAE,4BAA4B,+BAgD9B"}

package/dist/internal/MobileSheetConfirmation.js

@@ -1,88 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-'use client';
-
-/**
- * @file MobileSheetConfirmation.tsx
- * @input Public Core Dialog, layout, text and action primitives; caller-owned copy
- * @output Private confirmation shared by MobileTokenizer and MobilePowerSearch
- * @position Lab-only mobile sheet confirmation owner; not a public export
- *
- * Core AlertDialog fixes its purpose to form and its safe action to ghost.
- * These Lab flows instead allow scrim dismissal and use separated, full-width
- * large actions with the secondary safe action focused first. Keep that
- * difference here, while preserving the existing alert-dialog theme target.
- */
-import { useId } from 'react';
-import * as stylex from '@stylexjs/stylex';
-import { Button } from '@astryxdesign/core/Button';
-import { Dialog } from '@astryxdesign/core/Dialog';
-import { Heading } from '@astryxdesign/core/Heading';
-import { Layout, LayoutContent, LayoutFooter } from '@astryxdesign/core/Layout';
-import { Stack } from '@astryxdesign/core/Stack';
-import { Text } from '@astryxdesign/core/Text';
-import { themeProps } from '@astryxdesign/core/utils';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const styles = {
-  action: {
-    kzqmXN: "xh8yej3",
-    $$css: true
-  }
-};
-export function MobileSheetConfirmation({
-  isOpen,
-  onOpenChange,
-  title,
-  description,
-  cancelLabel,
-  actionLabel,
-  onAction
-}) {
-  const titleId = useId();
-  const descriptionId = useId();
-  return /*#__PURE__*/_jsx(Dialog, {
-    ...themeProps('alert-dialog'),
-    isOpen: isOpen,
-    onOpenChange: onOpenChange,
-    purpose: "info",
-    role: "alertdialog",
-    "aria-labelledby": titleId,
-    "aria-describedby": descriptionId,
-    width: 400,
-    children: /*#__PURE__*/_jsx(Layout, {
-      content: /*#__PURE__*/_jsxs(LayoutContent, {
-        children: [/*#__PURE__*/_jsx(Heading, {
-          level: 2,
-          id: titleId,
-          children: title
-        }), /*#__PURE__*/_jsx(Text, {
-          type: "body",
-          color: "secondary",
-          id: descriptionId,
-          children: description
-        })]
-      }),
-      footer: /*#__PURE__*/_jsx(LayoutFooter, {
-        children: /*#__PURE__*/_jsxs(Stack, {
-          direction: "vertical",
-          gap: 4,
-          hAlign: "stretch",
-          children: [/*#__PURE__*/_jsx(Button, {
-            label: actionLabel,
-            variant: "destructive",
-            size: "lg",
-            onClick: onAction,
-            xstyle: styles.action
-          }), /*#__PURE__*/_jsx(Button, {
-            label: cancelLabel,
-            variant: "secondary",
-            size: "lg",
-            onClick: () => onOpenChange(false),
-            "data-autofocus": true,
-            xstyle: styles.action
-          })]
-        })
-      })
-    })
-  });
-}

package/dist/internal/useDismissSearchOnTouchDrag.d.ts

@@ -1,21 +0,0 @@
-/**
- * @file useDismissSearchOnTouchDrag.ts
- * @input Caller-owned search inputs and touch events from a separate results list
- * @output Private touch handlers shared by the Lab mobile search sheets
- * @position One owner for results-drag keyboard dismissal; not a public export
- *
- * A direct vertical touch drag dismisses only a focused caller-owned search.
- * Scroll events are deliberately not observed: filtering can clamp scrollTop
- * and fire scroll while someone is typing. Small moves, taps and multi-touch
- * gestures leave focus alone. The hook acquires no external resource.
- */
-import { type TouchEvent } from 'react';
-type SearchInput = HTMLInputElement | null | undefined;
-export declare function useDismissSearchOnTouchDrag(getSearchInputs: () => readonly SearchInput[]): {
-    onTouchStart: (event: TouchEvent<HTMLElement>) => void;
-    onTouchMove: (event: TouchEvent<HTMLElement>) => void;
-    onTouchEnd: () => void;
-    onTouchCancel: () => void;
-};
-export {};
-//# sourceMappingURL=useDismissSearchOnTouchDrag.d.ts.map

package/dist/internal/useDismissSearchOnTouchDrag.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useDismissSearchOnTouchDrag.d.ts","sourceRoot":"","sources":["../../src/internal/useDismissSearchOnTouchDrag.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,EAAS,KAAK,UAAU,EAAC,MAAM,OAAO,CAAC;AAI9C,KAAK,WAAW,GAAG,gBAAgB,GAAG,IAAI,GAAG,SAAS,CAAC;AAEvD,wBAAgB,2BAA2B,CACzC,eAAe,EAAE,MAAM,SAAS,WAAW,EAAE;0BAQrB,UAAU,CAAC,WAAW,CAAC;yBAIxB,UAAU,CAAC,WAAW,CAAC;;;EAqB/C"}

package/dist/internal/useDismissSearchOnTouchDrag.js

@@ -1,43 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-'use client';
-
-/**
- * @file useDismissSearchOnTouchDrag.ts
- * @input Caller-owned search inputs and touch events from a separate results list
- * @output Private touch handlers shared by the Lab mobile search sheets
- * @position One owner for results-drag keyboard dismissal; not a public export
- *
- * A direct vertical touch drag dismisses only a focused caller-owned search.
- * Scroll events are deliberately not observed: filtering can clamp scrollTop
- * and fire scroll while someone is typing. Small moves, taps and multi-touch
- * gestures leave focus alone. The hook acquires no external resource.
- */
-import { useRef } from 'react';
-const DRAG_THRESHOLD_PX = 8;
-export function useDismissSearchOnTouchDrag(getSearchInputs) {
-  const startYRef = useRef(null);
-  const reset = () => {
-    startYRef.current = null;
-  };
-  return {
-    onTouchStart: event => {
-      startYRef.current = event.touches.length === 1 ? event.touches[0].clientY : null;
-    },
-    onTouchMove: event => {
-      if (event.touches.length !== 1) {
-        reset();
-        return;
-      }
-      const startY = startYRef.current;
-      if (startY == null || Math.abs(event.touches[0].clientY - startY) < DRAG_THRESHOLD_PX) {
-        return;
-      }
-      reset();
-      const focusedSearch = getSearchInputs().find(input => input != null && input === document.activeElement);
-      focusedSearch?.blur();
-    },
-    onTouchEnd: reset,
-    onTouchCancel: reset
-  };
-}

package/src/internal/MobileSheetConfirmation.test.tsx

@@ -1,68 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-import {fireEvent, render, screen, within} from '@testing-library/react';
-import {beforeEach, describe, expect, it, vi} from 'vitest';
-import {MobileSheetConfirmation} from './MobileSheetConfirmation';
-
-// jsdom has no native modal presentation; keep the public Dialog path active.
-beforeEach(() => {
-  HTMLDialogElement.prototype.showModal = vi.fn(function (
-    this: HTMLDialogElement,
-  ) {
-    this.setAttribute('open', '');
-  });
-  HTMLDialogElement.prototype.close = vi.fn(function (this: HTMLDialogElement) {
-    this.removeAttribute('open');
-  });
-  window.scrollTo = vi.fn();
-});
-
-function setup() {
-  const onAction = vi.fn();
-  const onOpenChange = vi.fn();
-  render(
-    <MobileSheetConfirmation
-      isOpen
-      onOpenChange={onOpenChange}
-      title="Discard changes?"
-      description="The draft will be removed."
-      actionLabel="Discard"
-      cancelLabel="Keep editing"
-      onAction={onAction}
-    />,
-  );
-  const dialog = screen.getByRole('alertdialog', {name: 'Discard changes?'});
-  return {dialog, onAction, onOpenChange};
-}
-
-describe('MobileSheetConfirmation', () => {
-  it('keeps the alert-dialog theme target and accessible copy', () => {
-    const {dialog} = setup();
-    expect(dialog).toHaveClass('astryx-alert-dialog');
-    expect(dialog).toHaveAccessibleDescription('The draft will be removed.');
-  });
-
-  it('stacks full-width large actions with the secondary safe action focused', () => {
-    const {dialog} = setup();
-    const [destructive, safe] = within(dialog).getAllByRole('button');
-    expect(destructive).toHaveAccessibleName('Discard');
-    expect(destructive).toHaveAttribute('data-variant', 'destructive');
-    expect(safe).toHaveAccessibleName('Keep editing');
-    expect(safe).toHaveAttribute('data-variant', 'secondary');
-    for (const button of [destructive, safe]) {
-      expect(button).toHaveAttribute('data-size', 'lg');
-      expect(getComputedStyle(button).width).toBe('100%');
-    }
-    expect(getComputedStyle(safe.parentElement!).flexDirection).toBe('column');
-    expect(safe).toHaveFocus();
-  });
-
-  it('reports action and safe dismissal independently without committing on cancel', () => {
-    const {dialog, onAction, onOpenChange} = setup();
-    fireEvent.click(within(dialog).getByRole('button', {name: 'Keep editing'}));
-    expect(onOpenChange).toHaveBeenCalledWith(false);
-    expect(onAction).not.toHaveBeenCalled();
-    fireEvent.click(within(dialog).getByRole('button', {name: 'Discard'}));
-    expect(onAction).toHaveBeenCalledTimes(1);
-  });
-});

package/src/internal/MobileSheetConfirmation.tsx

@@ -1,97 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-'use client';
-
-/**
- * @file MobileSheetConfirmation.tsx
- * @input Public Core Dialog, layout, text and action primitives; caller-owned copy
- * @output Private confirmation shared by MobileTokenizer and MobilePowerSearch
- * @position Lab-only mobile sheet confirmation owner; not a public export
- *
- * Core AlertDialog fixes its purpose to form and its safe action to ghost.
- * These Lab flows instead allow scrim dismissal and use separated, full-width
- * large actions with the secondary safe action focused first. Keep that
- * difference here, while preserving the existing alert-dialog theme target.
- */
-
-import {useId} from 'react';
-import * as stylex from '@stylexjs/stylex';
-import {Button} from '@astryxdesign/core/Button';
-import {Dialog} from '@astryxdesign/core/Dialog';
-import {Heading} from '@astryxdesign/core/Heading';
-import {Layout, LayoutContent, LayoutFooter} from '@astryxdesign/core/Layout';
-import {Stack} from '@astryxdesign/core/Stack';
-import {Text} from '@astryxdesign/core/Text';
-import {themeProps} from '@astryxdesign/core/utils';
-
-interface MobileSheetConfirmationProps {
-  isOpen: boolean;
-  onOpenChange: (isOpen: boolean) => void;
-  title: string;
-  description: string;
-  cancelLabel: string;
-  actionLabel: string;
-  onAction: () => void;
-}
-
-const styles = stylex.create({
-  action: {width: '100%'},
-});
-
-export function MobileSheetConfirmation({
-  isOpen,
-  onOpenChange,
-  title,
-  description,
-  cancelLabel,
-  actionLabel,
-  onAction,
-}: MobileSheetConfirmationProps) {
-  const titleId = useId();
-  const descriptionId = useId();
-  return (
-    <Dialog
-      {...themeProps('alert-dialog')}
-      isOpen={isOpen}
-      onOpenChange={onOpenChange}
-      purpose="info"
-      role="alertdialog"
-      aria-labelledby={titleId}
-      aria-describedby={descriptionId}
-      width={400}>
-      <Layout
-        content={
-          <LayoutContent>
-            <Heading level={2} id={titleId}>
-              {title}
-            </Heading>
-            <Text type="body" color="secondary" id={descriptionId}>
-              {description}
-            </Text>
-          </LayoutContent>
-        }
-        footer={
-          <LayoutFooter>
-            <Stack direction="vertical" gap={4} hAlign="stretch">
-              <Button
-                label={actionLabel}
-                variant="destructive"
-                size="lg"
-                onClick={onAction}
-                xstyle={styles.action}
-              />
-              <Button
-                label={cancelLabel}
-                variant="secondary"
-                size="lg"
-                onClick={() => onOpenChange(false)}
-                data-autofocus
-                xstyle={styles.action}
-              />
-            </Stack>
-          </LayoutFooter>
-        }
-      />
-    </Dialog>
-  );
-}

package/src/internal/useDismissSearchOnTouchDrag.test.tsx

@@ -1,94 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-import {useRef} from 'react';
-import {fireEvent, render, screen} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import {describe, expect, it, vi} from 'vitest';
-import {useDismissSearchOnTouchDrag} from './useDismissSearchOnTouchDrag';
-
-function Harness({hasSecondSearch = false}: {hasSecondSearch?: boolean}) {
-  const firstRef = useRef<HTMLInputElement>(null);
-  const secondRef = useRef<HTMLInputElement>(null);
-  const dragProps = useDismissSearchOnTouchDrag(() => [
-    firstRef.current,
-    secondRef.current,
-  ]);
-  return (
-    <>
-      <input ref={firstRef} aria-label="First search" />
-      {hasSecondSearch && <input ref={secondRef} aria-label="Second search" />}
-      <input aria-label="Unrelated field" />
-      <div role="group" aria-label="Results" {...dragProps} />
-    </>
-  );
-}
-
-const touches = (clientY: number) => [{clientY}];
-
-function setup() {
-  render(<Harness hasSecondSearch />);
-  const search = screen.getByRole('textbox', {name: 'First search'});
-  const results = screen.getByRole('group', {name: 'Results'});
-  search.focus();
-  return {search, results};
-}
-
-describe('useDismissSearchOnTouchDrag', () => {
-  it('preserves typing across programmatic result scrolling', async () => {
-    const {search, results} = setup();
-    fireEvent.scroll(results, {target: {scrollTop: 300}});
-    await userEvent.setup().type(search, 'Eng');
-    fireEvent.scroll(results, {target: {scrollTop: 0}});
-    expect(search).toHaveFocus();
-    expect(search).toHaveValue('Eng');
-  });
-
-  it('blurs a focused owned search once at the direct vertical drag threshold', () => {
-    const {search, results} = setup();
-    const blur = vi.spyOn(search, 'blur');
-    fireEvent.touchStart(results, {touches: touches(100)});
-    fireEvent.touchMove(results, {touches: touches(107)});
-    expect(search).toHaveFocus();
-    fireEvent.touchMove(results, {touches: touches(108)});
-    expect(search).not.toHaveFocus();
-    fireEvent.touchMove(results, {touches: touches(120)});
-    expect(blur).toHaveBeenCalledTimes(1);
-  });
-
-  it('does not blur on an unowned touch move, tap, or horizontal motion', () => {
-    const {search, results} = setup();
-    fireEvent.touchMove(results, {touches: touches(120)});
-    expect(search).toHaveFocus();
-    fireEvent.touchStart(results, {touches: [{clientY: 100, clientX: 0}]});
-    fireEvent.touchMove(results, {touches: [{clientY: 100, clientX: 100}]});
-    fireEvent.touchEnd(results);
-    fireEvent.touchMove(results, {touches: touches(120)});
-    expect(search).toHaveFocus();
-  });
-
-  it('resets ownership on cancellation and multi-touch without dismissing', () => {
-    const {search, results} = setup();
-    fireEvent.touchStart(results, {touches: touches(100)});
-    fireEvent.touchCancel(results);
-    fireEvent.touchMove(results, {touches: touches(120)});
-    expect(search).toHaveFocus();
-    fireEvent.touchStart(results, {touches: touches(100)});
-    fireEvent.touchMove(results, {touches: [{clientY: 120}, {clientY: 140}]});
-    fireEvent.touchMove(results, {touches: touches(150)});
-    expect(search).toHaveFocus();
-  });
-
-  it('can dismiss either current owned input, but never an unrelated field', () => {
-    const {results} = setup();
-    const secondSearch = screen.getByRole('textbox', {name: 'Second search'});
-    secondSearch.focus();
-    fireEvent.touchStart(results, {touches: touches(100)});
-    fireEvent.touchMove(results, {touches: touches(90)});
-    expect(secondSearch).not.toHaveFocus();
-    const unrelated = screen.getByRole('textbox', {name: 'Unrelated field'});
-    unrelated.focus();
-    fireEvent.touchStart(results, {touches: touches(100)});
-    fireEvent.touchMove(results, {touches: touches(120)});
-    expect(unrelated).toHaveFocus();
-  });
-});

package/src/internal/useDismissSearchOnTouchDrag.ts

@@ -1,57 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-'use client';
-
-/**
- * @file useDismissSearchOnTouchDrag.ts
- * @input Caller-owned search inputs and touch events from a separate results list
- * @output Private touch handlers shared by the Lab mobile search sheets
- * @position One owner for results-drag keyboard dismissal; not a public export
- *
- * A direct vertical touch drag dismisses only a focused caller-owned search.
- * Scroll events are deliberately not observed: filtering can clamp scrollTop
- * and fire scroll while someone is typing. Small moves, taps and multi-touch
- * gestures leave focus alone. The hook acquires no external resource.
- */
-
-import {useRef, type TouchEvent} from 'react';
-
-const DRAG_THRESHOLD_PX = 8;
-
-type SearchInput = HTMLInputElement | null | undefined;
-
-export function useDismissSearchOnTouchDrag(
-  getSearchInputs: () => readonly SearchInput[],
-) {
-  const startYRef = useRef<number | null>(null);
-  const reset = () => {
-    startYRef.current = null;
-  };
-
-  return {
-    onTouchStart: (event: TouchEvent<HTMLElement>) => {
-      startYRef.current =
-        event.touches.length === 1 ? event.touches[0].clientY : null;
-    },
-    onTouchMove: (event: TouchEvent<HTMLElement>) => {
-      if (event.touches.length !== 1) {
-        reset();
-        return;
-      }
-      const startY = startYRef.current;
-      if (
-        startY == null ||
-        Math.abs(event.touches[0].clientY - startY) < DRAG_THRESHOLD_PX
-      ) {
-        return;
-      }
-      reset();
-      const focusedSearch = getSearchInputs().find(
-        input => input != null && input === document.activeElement,
-      );
-      focusedSearch?.blur();
-    },
-    onTouchEnd: reset,
-    onTouchCancel: reset,
-  };
-}