@astryxdesign/core 0.7.7-canary.4a8a76e → 0.7.7-canary.4e495ec

package/src/hooks/useMenuPress.ts

@@ -483,7 +483,10 @@ export function useMenuPress(options: UseMenuPressOptions): UseMenuPressReturn {
           // Detach before acting: the activation usually closes the menu.
           endGesture();
           // Once armed, the one swallower stays installed.
-          armClickGuard(doc, {staysInstalled: true});
+          armClickGuard(doc, {
+            staysInstalled: true,
+            cancelsTouchEnd: native?.pointerType === 'touch',
+          });
           if (native != null) {
             activate(effect.row, native);
           }
@@ -492,7 +495,10 @@ export function useMenuPress(options: UseMenuPressOptions): UseMenuPressReturn {
         case 'settle': {
           endGesture();
           if (effect.stray) {
-            armClickGuard(doc, {staysInstalled: true});
+            armClickGuard(doc, {
+              staysInstalled: true,
+              cancelsTouchEnd: native?.pointerType === 'touch',
+            });
           }
           if (effect.dismiss) {
             optionsRef.current.onDismiss?.();

package/src/i18n/generated-english/PowerSearch/PowerSearch.generated.ts

@@ -8,6 +8,7 @@
 
 const english: Readonly<Record<string, string>> = {
   "@astryx.powersearch.allFiltersRemoved": "All filters removed",
+  "@astryx.powersearch.editableFiltersRemoved": "Editable filters removed",
   "@astryx.powersearch.editor.apply": "Apply",
   "@astryx.powersearch.label": "Search",
   "@astryx.powersearch.placeholder": "Search…",

package/src/i18n/generated-english/Tokenizer/TokenizerBottomSheet.generated.ts

@@ -7,6 +7,7 @@
  */
 
 const english: Readonly<Record<string, string>> = {
+  "@astryx.alertDialog.cancel": "Cancel",
   "@astryx.textInput.clearLabel": "Clear {label}",
   "@astryx.tokenizer.add": "Add",
   "@astryx.tokenizer.addValue": "Add {value}",
@@ -16,11 +17,16 @@ const english: Readonly<Record<string, string>> = {
   "@astryx.tokenizer.clearAllTitle": "Clear all selected items?",
   "@astryx.tokenizer.clearSelection": "Clear selection",
   "@astryx.tokenizer.create": "Create \"{value}\"",
-  "@astryx.tokenizer.done": "Done",
+  "@astryx.tokenizer.discardChanges": "Discard changes",
+  "@astryx.tokenizer.discardChangesDescription": "Your changes to {label} haven't been saved.",
+  "@astryx.tokenizer.discardChangesTitle": "Discard changes?",
+  "@astryx.tokenizer.keepEditing": "Keep editing",
   "@astryx.tokenizer.noResultsDescription": "Try a different search.",
   "@astryx.tokenizer.nothingToClear": "Nothing selected",
+  "@astryx.tokenizer.save": "Save",
   "@astryx.tokenizer.search": "Search {label}",
   "@astryx.tokenizer.searchPlaceholder": "Search…",
+  "@astryx.tokenizer.selectionLimit": "Select up to {count, plural, one {# item} other {# items}}",
   "@astryx.tokenizer.tokenAdded": "Added {label}",
   "@astryx.tokenizer.tokenRemoved": "Removed {label}",
   "@astryx.typeahead.emptySearchResults": "No results found",

package/src/i18n/generated-locales/en.generated.ts

@@ -315,6 +315,7 @@ const runtimeCatalog: Readonly<Record<string, string>> = {
   '@astryx.powersearch.label': 'Search',
   '@astryx.powersearch.placeholder': 'Search…',
   '@astryx.powersearch.allFiltersRemoved': 'All filters removed',
+  '@astryx.powersearch.editableFiltersRemoved': 'Editable filters removed',
   '@astryx.resizable.collapsed': 'Collapsed',
   '@astryx.resizable.handle.label': 'Resize handle',
   '@astryx.selector.placeholder': 'Select…',

package/src/i18n/generated-locales/pseudo.generated.ts

@@ -322,6 +322,7 @@ const runtimeCatalog: Readonly<Record<string, string>> = {
   '@astryx.powersearch.label': '⟦Šéàřçĥ⟧',
   '@astryx.powersearch.placeholder': '⟦Šéàřçĥ…⟧',
   '@astryx.powersearch.allFiltersRemoved': '⟦Àłł ƒíłţéřš řéɱóṽéð⟧',
+  '@astryx.powersearch.editableFiltersRemoved': '⟦Éðíţàƀłé ƒíłţéřš řéɱóṽéð⟧',
   '@astryx.resizable.collapsed': '⟦Çółłàþšéð⟧',
   '@astryx.resizable.handle.label': '⟦Řéšížé ĥàñðłé⟧',
   '@astryx.selector.placeholder': '⟦Šéłéçţ…⟧',

package/src/internal/SheetConfirmation.tsx

@@ -0,0 +1,101 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file SheetConfirmation.tsx
+ * @input Dialog, Layout, Heading, Text, Button; caller-owned copy
+ * @output SheetConfirmation — the confirmation a touch sheet opens over
+ *   itself for Clear all and for discarding a changed draft
+ * @position Core-internal, shared by the Tokenizer sheet and the PowerSearch
+ *   sheets; not a public export
+ *
+ * AlertDialog fixes its purpose to form and its safe action to ghost. A touch
+ * sheet's confirmation allows scrim dismissal. Its two full-width large
+ * actions are stacked and separated: the destructive action first in reading
+ * order, the safe action focused first. The alert-dialog theme target stays.
+ */
+
+import {useId} from 'react';
+import * as stylex from '@stylexjs/stylex';
+import {Button} from '../Button/Button';
+import {Dialog} from '../Dialog/Dialog';
+import {Heading} from '../Heading/Heading';
+import {Layout} from '../Layout/Layout';
+import {LayoutContent} from '../Layout/LayoutContent';
+import {LayoutFooter} from '../Layout/LayoutFooter';
+import {Stack} from '../Stack/Stack';
+import {Text} from '../Text/Text';
+import {themeProps} from '../utils/themeProps';
+
+export interface SheetConfirmationProps {
+  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 SheetConfirmation({
+  isOpen,
+  onOpenChange,
+  title,
+  description,
+  cancelLabel,
+  actionLabel,
+  onAction,
+}: SheetConfirmationProps) {
+  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/sheetDraft.ts

@@ -0,0 +1,80 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+/**
+ * @file sheetDraft.ts
+ * @input A sheet's selection at open, its draft, and the last edit made
+ * @output SheetDraftChange, hasSameSelection, nameSheetDraftChange — the
+ *   rules a touch sheet's Save and dismissal share
+ * @position Core-internal, shared by the Tokenizer sheet and the Lab sheets
+ *   through `internal/touch-sheet`; not a public export
+ *
+ * A touch sheet edits a draft and reports it once, on Save, with one change:
+ * the last edit that still holds, else the nearest net add or remove. A
+ * dismissal asks before discarding only while the draft differs from the
+ * selection at open, as a set: a row unchecked and checked again is no change.
+ */
+
+interface SheetDraftItem {
+  id: string | number;
+}
+
+/** An edit of a sheet's draft, and the shape Save reports. */
+export type SheetDraftChange<T> = {
+  item: T;
+  type: 'add' | 'create' | 'remove';
+};
+
+/** Whether two selections hold the same items, in any order. */
+export function hasSameSelection<T extends SheetDraftItem>(
+  a: ReadonlyArray<T>,
+  b: ReadonlyArray<T>,
+): boolean {
+  if (a.length !== b.length) {
+    return false;
+  }
+  const ids = new Set(a.map(item => item.id));
+  return b.every(item => ids.has(item.id));
+}
+
+/**
+ * The change Save reports for a draft that differs from the selection at
+ * open, or `null` when nothing differs. The last edit names it when it still
+ * holds: its item is in the draft and was not selected at open, or was
+ * selected at open and is gone. Otherwise, after a removal, a `remove` names
+ * an item that is gone; otherwise an `add` (`create` when the last edit
+ * created that item) names an item that is new; otherwise a `remove` names
+ * an item that is gone.
+ */
+export function nameSheetDraftChange<T extends SheetDraftItem>(
+  valueAtOpen: ReadonlyArray<T>,
+  draftValue: ReadonlyArray<T>,
+  lastDraftChange: SheetDraftChange<T> | null,
+): SheetDraftChange<T> | null {
+  const wasSelected = (id: T['id']) => valueAtOpen.some(item => item.id === id);
+  const isSelected = (id: T['id']) => draftValue.some(item => item.id === id);
+  const added = draftValue.find(item => !wasSelected(item.id));
+  const removed = valueAtOpen.find(item => !isSelected(item.id));
+  const lastChangeIsNet =
+    lastDraftChange != null &&
+    (lastDraftChange.type === 'remove'
+      ? wasSelected(lastDraftChange.item.id) &&
+        !isSelected(lastDraftChange.item.id)
+      : isSelected(lastDraftChange.item.id) &&
+        !wasSelected(lastDraftChange.item.id));
+  if (lastChangeIsNet) {
+    return lastDraftChange;
+  }
+  if (lastDraftChange?.type === 'remove' && removed != null) {
+    return {item: removed, type: 'remove'};
+  }
+  if (added != null) {
+    const type: SheetDraftChange<T>['type'] =
+      lastDraftChange?.item.id === added.id && lastDraftChange.type === 'create'
+        ? 'create'
+        : 'add';
+    return {item: added, type};
+  }
+  if (removed != null) {
+    return {item: removed, type: 'remove'};
+  }
+  return null;
+}

package/src/internal/touch-sheet.ts

@@ -0,0 +1,21 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+/**
+ * @file touch-sheet.ts
+ * @input The touch sheets' shared confirmation, search-drag dismissal and
+ *   draft rules
+ * @output `@astryxdesign/core/internal/touch-sheet`: SheetConfirmation,
+ *   useDismissSearchOnTouchDrag, hasSameSelection and nameSheetDraftChange,
+ *   re-exported by name for Lab's sheets
+ * @position An internal entry reserved for Astryx's own packages:
+ *   undocumented, outside the public API and its compatibility promise,
+ *   versioned in lockstep with Core, and allowed only in Core and Lab by the
+ *   `@astryx/no-core-internal-import` lint rule. Core components import the
+ *   same modules by relative path. Named re-exports only.
+ *
+ * SYNC: When modified, update scripts/sync-exports.js.
+ */
+export {SheetConfirmation} from './SheetConfirmation';
+export type {SheetConfirmationProps} from './SheetConfirmation';
+export {useDismissSearchOnTouchDrag} from './useDismissSearchOnTouchDrag';
+export {hasSameSelection, nameSheetDraftChange} from './sheetDraft';
+export type {SheetDraftChange} from './sheetDraft';

package/src/internal/useDismissSearchOnTouchDrag.ts

@@ -0,0 +1,69 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+/**
+ * @file useDismissSearchOnTouchDrag.ts
+ * @input Caller-owned search inputs, a focus target, and touch events from a
+ *   separate results list
+ * @output useDismissSearchOnTouchDrag — touch handlers for the results list
+ * @position Core-internal, shared by the touch sheets; not a public export
+ *
+ * A direct vertical touch drag on the results moves focus off a focused
+ * search input. The on-screen keyboard then leaves and the rows come into
+ * view; the query stays. Focus goes to the caller's target (the sheet's
+ * panel), never to the page body behind an open modal. Scroll events are not
+ * observed: filtering can clamp scrollTop and fire scroll while someone is
+ * typing. Small moves, taps and multi-touch gestures leave focus alone.
+ */
+
+import {useRef, type TouchEvent} from 'react';
+
+const DRAG_THRESHOLD_PX = 8;
+
+type SearchInput = HTMLInputElement | null | undefined;
+
+export function useDismissSearchOnTouchDrag(
+  getSearchInputs: () => ReadonlyArray<SearchInput>,
+  getFocusTarget?: () => HTMLElement | null | undefined,
+) {
+  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,
+      );
+      if (focusedSearch == null) {
+        return;
+      }
+      const target = getFocusTarget?.();
+      if (target != null) {
+        target.focus({preventScroll: true});
+      } else {
+        focusedSearch.blur();
+      }
+    },
+    onTouchEnd: reset,
+    onTouchCancel: reset,
+  };
+}

package/src/motion/MEASUREMENTS.md

@@ -219,6 +219,13 @@ Bookmarks sheet.
 | M-SG18 | iPad S1 (touch; pointer if available)                                                                                                       | tap, hold, drag; hover                                                                                                                                                                                                                                                                                                                                                                            | differences from iPhone                                                                                                                               | B      |
 | M-SG19 | Safari showing the segmented stories vs S1                                                                                                  | the segmented storyboards side by side                                                                                                                                                                                                                                                                                                                                                            | synced recordings (parity proof)                                                                                                                      | B      |
 
+Done (UIKit lab, iOS 26.2 simulator, Oct 23–24 2026; in the segmented control's
+own table, `uikit/segmented.ts`, tagged `measured:`): M-SG02 (the selection
+spring and the drag clamp; the tracking spring is the shared
+`springs.fingerTracking`; the lift was measured too and is not in the table,
+since a pressed thumb's lift is a theme's) and M-SG03 (the tap's frames,
+fitted per frame).
+
 ## Sheets (UISheetPresentationController)
 
 Probe app "SheetProbe" on an iPhone 16 Pro (iPad Pro 11" for M-SH11 / M-SH20 /

package/src/motion/README.md

@@ -22,6 +22,7 @@ roles through `resolveMotion`.
 | `uikit/navigation.ts`                            | UINavigationController: push velocity, parallax, dimming, transition clock, interactive pop finish rule.                                                             |
 | `uikit/progressBar.ts`                           | UIProgressView's fill: the whole-track duration and curve, its minimum length and empty alpha; the reduced-motion pulse (three roles).                               |
 | `uikit/gestures.ts`                              | Gesture recognizer thresholds, the velocity filter and haptic stand-ins, as `{value, unit}` entries (sources in JSDoc).                                              |
+| `uikit/segmented.ts`                             | UISegmentedControl: the selection indicator's spring; under Reduce Motion the animator's cross-fade replaces it.                                                     |
 | `uikit/switch.ts`                                | UISwitch on iOS 26.2: geometry, the lift, settle, travel and tracking springs, the flip distance, the track colour.                                                  |
 | `roles.ts`                                       | The internal motion roles: the springs, durations and curves `spec:AST-094` FR4 names, registered by the shared tables, and a role's CSS form read back.             |
 | `roleValue.ts`                                   | A role's CSS form, written: a spring's duration and bounce, a duration in ms, a curve's `cubic-bezier()`.                                                            |

package/src/motion/roles.ts

@@ -5,7 +5,8 @@
  * @input The motion tables (motion/uikit and each component's own table)
  * @output registerMotionTable, motionRoleOf, motionRoleIn, listMotionRoles,
  *   motionRoleVariable, and the CSS form of a role's value
- *   (formatMotionRoleValue, parseMotionRoleValue)
+ *   (formatMotionRoleValue, parseMotionRoleValue), and parseCssEasing for a
+ *   CSS transition's easing
  * @position Motion foundation, internal to core: read by the code that
  *   resolves a role when a motion starts. No public API writes a role: touch
  *   motion stays internal until the public motion-token set is decided.
@@ -260,3 +261,21 @@ export function parseMotionRoleValue(
     ? points
     : null;
 }
+
+/** The CSS easing keywords, as the control points CSS gives them. */
+const EASING_KEYWORDS: Readonly<Record<string, MotionCurvePoints>> = {
+  linear: [0, 0, 1, 1],
+  ease: [0.25, 0.1, 0.25, 1],
+  'ease-in': [0.42, 0, 1, 1],
+  'ease-out': [0, 0, 0.58, 1],
+  'ease-in-out': [0.42, 0, 0.58, 1],
+};
+
+/**
+ * Reads a CSS easing, a keyword or a `cubic-bezier()`, as a curve role's value
+ * is read. Returns null for any other easing, such as `steps()`.
+ */
+export function parseCssEasing(text: string): MotionCurvePoints | null {
+  const value = text.trim();
+  return EASING_KEYWORDS[value] ?? parseMotionRoleValue('curve', value);
+}

package/src/motion/uikit/index.ts

@@ -4,10 +4,10 @@
  * @file index.ts
  * @input The domain files of the UIKit constants table
  * @output Re-exports `springs` and one constant per spring (`SHEET_PRESENT_SPRING`,
- *   …), `scroll`, `timing`, `navigation`, `progressBar`, the `slider` and
- *   switch (`switchControl`) domains, and the gesture thresholds (one
- *   `UIKIT_*` group per recognizer, their union `UIKIT_GESTURES`, and the
- *   haptic tables)
+ *   …), `scroll`, `timing`, `navigation`, `progressBar`, `segmentedControl`,
+ *   the `slider` and switch (`switchControl`) domains, and the gesture
+ *   thresholds (one `UIKIT_*` group per recognizer, their union
+ *   `UIKIT_GESTURES`, and the haptic tables)
  * @position Entry of the UIKit constants table (motion/uikit). Internal to
  *   core: not exported from the package entry point
  *
@@ -42,6 +42,7 @@ export {
 export {navigation, registerNavigationTable} from './navigation';
 export {progressBar, registerProgressBarTable} from './progressBar';
 export {registerScrollTable, scroll} from './scroll';
+export {segmentedControl} from './segmented';
 export {slider} from './slider';
 export {
   ACTION_SHEET_DISMISS_SPRING,
@@ -64,7 +65,6 @@ export {
   NAVIGATION_POP_SPRING,
   NAVIGATION_PUSH_SPRING,
   QUICK_CHANGE_SPRING,
-  SEGMENTED_THUMB_SPRING,
   SETTLE_SPRING,
   SHEET_DETENT_SPRING,
   SHEET_DISMISS_SPRING,

package/src/motion/uikit/segmented.ts

@@ -0,0 +1,74 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file segmented.ts
+ * @input Nothing; data only
+ * @output Exports `segmentedControl`, UISegmentedControl's selection slide
+ *   spring and its drag overshoot; and `registerSegmentedTable`, which
+ *   registers the spring as an internal motion role
+ * @position The segmented-control domain of the UIKit constants table
+ *   (motion/uikit); read by SegmentedControl's touch presentation
+ *
+ * SYNC: When modified, update:
+ * - /packages/core/src/SegmentedControl/useSegmentedSelectionMotion.ts
+ * - /packages/core/src/motion/README.md (domain list)
+ */
+
+import {registerMotionTable} from '../roles';
+
+/**
+ * UIKit's own UISegmentedControl, measured with three text segments in a
+ * 300 × 31 pt control. A tap and a programmatic change follow the same
+ * spring. Every leaf carries a `@source`, and uikit.test.ts checks it.
+ *
+ * Some UIKit motion is left out on purpose. UIKit cross-fades the two titles
+ * that change, over 0.2 s. Astryx switches them at once, because a
+ * cross-fade needs a second copy of each title. Under Reduce Motion, UIKit's
+ * lens fades in at the new segment and scales from 0.88. Astryx allows no
+ * scaling there, so the animator's Reduce Motion cross-fade replaces it.
+ * UIKit's lens also lifts and stretches under a finger. A theme role owns
+ * the lift, and the stretch is not modeled. The lens chases a dragging
+ * finger on the shared `springs.fingerTracking` role, which matches the
+ * values UIKit reports for this control.
+ */
+export const segmentedControl = {
+  /**
+   * The selection indicator's slide from the old segment to the new one,
+   * after a tap or a programmatic change. Its response is 0.40 s and its
+   * damping ratio 0.85. That gives about 1.25 pt of overshoot on a 200 pt
+   * move, settled by about 0.6 s. The width follows the same spring when the
+   * segments differ in width.
+   * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+   *   iPhone 17 Pro, UIViewSpringAnimationBehavior read on the lens position
+   *   for a tap and a programmatic set (dampingRatio 0.85, response 0.40,
+   *   tracking off), Oct 23 2026
+   * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+   *   iPhone 17 Pro, per-frame log of the lens's presentation position and
+   *   velocity (method C) for a tap, a programmatic set and an animated set,
+   *   least-squares spring fit (response 0.395 / 0.405 / 0.400 s, damping
+   *   ratio 0.855 / 0.845 / 0.850, rms at most 0.65 pt over 200 pt),
+   *   Oct 23 2026
+   */
+  selectionSpring: {response: 0.4, dampingRatio: 0.85},
+  /**
+   * How far past the first or last segment's center the lens follows a
+   * dragging finger, in pt. Beyond that, the lens stays put while the finger
+   * goes on.
+   * @source measured: UIKit lab (injected host app), iOS 26.2 simulator,
+   *   iPhone 17 Pro, a drag 60 pt past the last segment: the lens stops about
+   *   11 pt past its center (312 vs 301), Oct 23 2026
+   */
+  dragOvershoot: 11,
+} as const;
+
+/**
+ * Registers this table with the motion registry (motion/roles.ts). The
+ * slide's spring becomes an internal motion role. The drag overshoot is not
+ * motion, so it stays an internal constant. Nothing registers on import, and
+ * a second call does nothing.
+ */
+export function registerSegmentedTable(): void {
+  registerMotionTable('segmented', segmentedControl, {
+    roles: ['selectionSpring'],
+  });
+}

package/src/motion/uikit/springs.ts

@@ -15,11 +15,11 @@
  * that will confirm or replace them (MEASUREMENTS.md lists them all).
  * uikit.test.ts enforces both.
  *
- * Most springs are measured on iOS 26.2 or documented by Apple; two are still
- * GUESSES (`segmentedThumb`, `banner`). `switchThumbMove` is the switch's
- * measured travel, which uikit/switch.ts reads. A guess starts from the
- * nearest sourced spring and names it. A component built on the table gets
- * the measured value the moment it lands, without changing.
+ * Most springs are measured on iOS 26.2 or documented by Apple; one is still
+ * a GUESS (`banner`). `switchThumbMove` is the switch's measured travel,
+ * which uikit/switch.ts reads. A guess starts from the nearest sourced
+ * spring and names it. A component built on the table gets the measured
+ * value the moment it lands, without changing.
  *
  * Press highlight in/out are fades, not springs: see timing.ts.
  *
@@ -400,21 +400,6 @@ export const SWITCH_THUMB_MOVE_SPRING = {
   dampingRatio: 1,
 } as const;
 
-/**
- * UISegmentedControl selection thumb sliding to a new segment.
- * @source GUESS — WebKit's UIKit-matched switch thumb spring
- *   (RenderThemeCocoa.mm `thumbMoveSpring`: response 0.30 s, ratio 0.75),
- *   kept only until UISegmentedControl's measured spring replaces it;
- *   UISwitch's measured travel (`SWITCH_THUMB_MOVE_SPRING`)
- *   belongs to another control
- * @measure M-SG02
- * @measure M-SG03
- */
-export const SEGMENTED_THUMB_SPRING = {
-  response: 0.3,
-  dampingRatio: 0.75,
-} as const;
-
 // ---------------------------------------------------------------------
 // System
 // ---------------------------------------------------------------------
@@ -504,7 +489,6 @@ export const springs = {
   contextMenuMorph: CONTEXT_MENU_MORPH_SPRING,
   menuReducedMotion: MENU_REDUCED_MOTION_SPRING,
   switchThumbMove: SWITCH_THUMB_MOVE_SPRING,
-  segmentedThumb: SEGMENTED_THUMB_SPRING,
   keyboard: KEYBOARD_SPRING,
   banner: BANNER_SPRING,
   sliderRelease: SLIDER_RELEASE_SPRING,

package/src/privateAttributes/segmentTitle.stylex.ts

@@ -0,0 +1,22 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file privateAttributes/segmentTitle.stylex.ts
+ * @input Nothing
+ * @output segmentTitleProps, which marks a SegmentedControl segment's title,
+ *   and titleOfSegment, which finds that title in a segment
+ * @position Owner module of the private segment-title attribute: the only
+ *   file that writes its name. No package entry exports it.
+ */
+
+const SEGMENT_TITLE = 'data-astryx-segment-title';
+
+/** Spread on a segment's title: marks it for the touch layer. */
+export const segmentTitleProps: Readonly<Record<string, string>> = {
+  [SEGMENT_TITLE]: '',
+};
+
+/** The title inside `segment`, or null when the label is hidden. */
+export function titleOfSegment(segment: Element): HTMLElement | null {
+  return segment.querySelector<HTMLElement>(`[${SEGMENT_TITLE}]`);
+}