@oxy.so/bloom 3.5.0 → 4.0.0

package/lib/commonjs/{chat-list/ChatSwipeRow.js → swipe-row/SwipeRow.js}

@@ -3,64 +3,90 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ChatSwipeRow = ChatSwipeRow;
+exports.SwipeRow = SwipeRow;
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _reactNativeGestureHandler = require("react-native-gesture-handler");
 var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _useTheme = require("../theme/use-theme.js");
 var _index = require("../typography/index.js");
-var _parts = require("./parts.js");
+var _constants = require("./constants.js");
 var _shared = require("./shared.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
- * The drag affordance behind a chat row, on touch.
+ * ONE drag affordance for every list row in this library.
  *
  * Dragging RIGHT uncovers `actions.left` from the left edge, dragging LEFT
  * uncovers `actions.right`. The row travels with the finger up to the pane's
- * full width (`SWIPE_ACTION_WIDTH` per action) and snaps open past
+ * full width (`actionWidth` per action) and snaps open past
  * `SWIPE_COMMIT_FRACTION` of it, closed below — so a half-hearted drag never
  * leaves a row stuck ajar. Anything under `SWIPE_TAP_SLOP` is a tap and the
  * gesture springs straight back.
  *
  * The gesture activates only past a horizontal threshold and FAILS on vertical
- * travel, so a list scroll never turns into a swipe. Panes are laid under the
+ * travel, so a list scroll never turns into a swipe. Panes are laid UNDER the
  * row and grow with it rather than sliding in from outside: the row is what
  * moves, and the action underneath is revealed, not pushed.
  *
- * WEB gets none of this. `ChatListItem` renders the same actions as hover
- * buttons there, because a drag is undiscoverable with a mouse and a
- * `pointerdown`-driven pan fights text selection.
+ * It owns the gesture and almost nothing else. It draws no row and knows no
+ * density; the one colour it insists on is the OPAQUE fill under the
+ * travelling layer, because the panes are behind the row and would otherwise
+ * read straight through it. It resolves no other row colours — the caller passes its children, and either the
+ * pane pairs it already resolved or nothing at all, in which case the panes
+ * come off the theme. That is what lets a chat row and a mail row share one
+ * implementation instead of drifting into two.
+ *
+ * WHO GETS IT is `useSwipeAvailable()`: every touch pointer, on any platform.
+ * A mouse gets whatever hover affordance the calling family draws, because a
+ * drag is undiscoverable with a pointer.
+ *
+ * A SWIPE IS NOT REACHABLE BY KEYBOARD OR BY A SCREEN READER, and this
+ * component does not pretend otherwise: while a pane is closed it is hidden
+ * from assistive technology entirely, rather than leaving invisible buttons in
+ * the tab order for focus to disappear into. The caller owes those actions a
+ * second path — a hover rail, a row menu, or `accessibilityActions` on the row
+ * itself. `mail-list` does the last two; see `docs/swipe-row.mdx`.
  *
  * Reduced motion keeps the panes and drops the SNAP animation — the row jumps
  * to its resting position instead of easing to it.
  */
-function ChatSwipeRow({
+function SwipeRow({
   actions,
   onAction,
   height,
   paint,
+  background,
+  radius = _constants.SWIPE_ROW_RADIUS,
+  actionWidth = _constants.SWIPE_ACTION_WIDTH,
   closeLabel = 'Close actions',
+  onOpenChange,
   children,
   testID
 }) {
+  const theme = (0, _useTheme.useTheme)();
   const translateX = (0, _reactNativeReanimated.useSharedValue)(0);
   const reducedMotion = (0, _reactNativeReanimated.useReducedMotion)();
   const [open, setOpen] = (0, _react.useState)(null);
+  const tones = (0, _react.useMemo)(() => paint ?? (0, _shared.resolveSwipeRowPaint)(theme), [paint, theme]);
+  // The panes sit UNDER the row, so the travelling layer has to be opaque or
+  // they read through it.
+  const rowFill = background ?? theme.colors.background;
   const left = actions.left ?? [];
   const right = actions.right ?? [];
-  const leftWidth = left.length * _shared.SWIPE_ACTION_WIDTH;
-  const rightWidth = right.length * _shared.SWIPE_ACTION_WIDTH;
+  const leftWidth = left.length * actionWidth;
+  const rightWidth = right.length * actionWidth;
   const settle = (0, _react.useCallback)(next => {
     setOpen(next);
-  }, []);
+    onOpenChange?.(next);
+  }, [onOpenChange]);
   const close = (0, _react.useCallback)(() => {
     translateX.value = reducedMotion ? 0 : (0, _reactNativeReanimated.withTiming)(0, {
-      duration: 160
+      duration: _constants.SWIPE_SNAP_DURATION
     });
-    setOpen(null);
-  }, [reducedMotion, translateX]);
-  const pan = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Pan().activeOffsetX([-12, 12]).failOffsetY([-12, 12]).onChange(event => {
+    settle(null);
+  }, [reducedMotion, settle, translateX]);
+  const pan = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Pan().activeOffsetX([-_constants.SWIPE_ACTIVATE_OFFSET, _constants.SWIPE_ACTIVATE_OFFSET]).failOffsetY([-_constants.SWIPE_ACTIVATE_OFFSET, _constants.SWIPE_ACTIVATE_OFFSET]).onChange(event => {
     'worklet';
 
     const next = translateX.value + event.changeX;
@@ -69,17 +95,17 @@ function ChatSwipeRow({
     'worklet';
 
     const travelled = Math.abs(translateX.value);
-    if (travelled < _shared.SWIPE_TAP_SLOP) {
+    if (travelled < _constants.SWIPE_TAP_SLOP) {
       translateX.value = 0;
       (0, _reactNativeReanimated.runOnJS)(settle)(null);
       return;
     }
     const opening = translateX.value > 0 ? 'left' : 'right';
     const full = opening === 'left' ? leftWidth : rightWidth;
-    const commit = travelled >= full * _shared.SWIPE_COMMIT_FRACTION && full > 0;
+    const commit = travelled >= full * _constants.SWIPE_COMMIT_FRACTION && full > 0;
     const target = commit ? opening === 'left' ? leftWidth : -rightWidth : 0;
     translateX.value = reducedMotion ? target : (0, _reactNativeReanimated.withTiming)(target, {
-      duration: 160
+      duration: _constants.SWIPE_SNAP_DURATION
     });
     (0, _reactNativeReanimated.runOnJS)(settle)(commit ? opening : null);
   }), [leftWidth, reducedMotion, rightWidth, settle, translateX]);
@@ -110,7 +136,7 @@ function ChatSwipeRow({
       flexDirection: 'row'
     },
     children: list.map(action => {
-      const tone = (0, _parts.actionPanePaint)(action, paint);
+      const tone = (0, _shared.swipeActionPaint)(action, tones);
       const Icon = action.icon;
       return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
         role: "button",
@@ -121,8 +147,8 @@ function ChatSwipeRow({
           close();
         },
         style: {
-          width: _shared.SWIPE_ACTION_WIDTH,
-          height,
+          width: actionWidth,
+          alignSelf: 'stretch',
           alignItems: 'center',
           justifyContent: 'center',
           gap: 4,
@@ -144,15 +170,26 @@ function ChatSwipeRow({
       }, action.key);
     })
   });
+
+  // A closed pane is 0 wide and clipped, so anything inside it is a control
+  // nobody can see. Hiding it is the difference between "unreachable" and
+  // "reachable, invisible, and it steals the focus ring".
+  const hiddenWhenClosed = side => open === side ? null : {
+    'aria-hidden': true,
+    importantForAccessibility: 'no-hide-descendants'
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
     style: {
       position: 'relative',
-      height,
-      borderRadius: _shared.CHAT_ROW_RADIUS,
+      ...(height === undefined ? null : {
+        height
+      }),
+      borderRadius: radius,
       overflow: 'hidden'
     },
     testID: testID,
     children: [leftWidth > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+      ...hiddenWhenClosed('left'),
       style: [{
         position: 'absolute',
         left: 0,
@@ -162,6 +199,7 @@ function ChatSwipeRow({
       }, leftPaneStyle],
       children: pane(left, 'left')
     }) : null, rightWidth > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+      ...hiddenWhenClosed('right'),
       style: [{
         position: 'absolute',
         right: 0,
@@ -174,12 +212,14 @@ function ChatSwipeRow({
       gesture: pan,
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
         style: [{
+          backgroundColor: rowFill
+        }, height === undefined ? null : {
           height
         }, rowStyle],
         children: [children, open !== null ?
         /*#__PURE__*/
         // While a pane is open the row itself closes it rather than opening
-        // the conversation — the same rule a tap outside an open menu follows.
+        // what it points at — the same rule a tap outside an open menu follows.
         (0, _jsxRuntime.jsx)(_reactNative.Pressable, {
           role: "button",
           accessibilityLabel: closeLabel,
@@ -191,4 +231,4 @@ function ChatSwipeRow({
     })]
   });
 }
-//# sourceMappingURL=ChatSwipeRow.js.map
+//# sourceMappingURL=SwipeRow.js.map

package/lib/commonjs/swipe-row/SwipeRow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeGestureHandler","_reactNativeReanimated","_useTheme","_index","_constants","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SwipeRow","actions","onAction","height","paint","background","radius","SWIPE_ROW_RADIUS","actionWidth","SWIPE_ACTION_WIDTH","closeLabel","onOpenChange","children","testID","theme","useTheme","translateX","useSharedValue","reducedMotion","useReducedMotion","open","setOpen","useState","tones","useMemo","resolveSwipeRowPaint","rowFill","colors","left","right","leftWidth","length","rightWidth","settle","useCallback","next","close","value","withTiming","duration","SWIPE_SNAP_DURATION","pan","Gesture","Pan","activeOffsetX","SWIPE_ACTIVATE_OFFSET","failOffsetY","onChange","event","changeX","Math","max","min","onFinalize","travelled","abs","SWIPE_TAP_SLOP","runOnJS","opening","full","commit","SWIPE_COMMIT_FRACTION","target","rowStyle","useAnimatedStyle","transform","leftPaneStyle","width","rightPaneStyle","pane","list","side","jsx","View","style","position","top","bottom","flexDirection","map","action","tone","swipeActionPaint","Icon","icon","jsxs","Pressable","role","accessibilityLabel","label","onPress","key","alignSelf","alignItems","justifyContent","gap","backgroundColor","undefined","fill","foreground","Text","variant","numberOfLines","color","hiddenWhenClosed","importantForAccessibility","borderRadius","overflow","GestureDetector","gesture","StyleSheet","absoluteFill"],"sourceRoot":"../../../src","sources":["swipe-row/SwipeRow.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/swipe-row/constants.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SWIPE_TAP_SLOP = exports.SWIPE_SNAP_DURATION = exports.SWIPE_ROW_RADIUS = exports.SWIPE_COMMIT_FRACTION = exports.SWIPE_ACTIVATE_OFFSET = exports.SWIPE_ACTION_WIDTH = void 0;
+/**
+ * The drag's thresholds and the rail's geometry, in one place because they are
+ * one decision: how far a finger travels before the row is considered to have
+ * been opened rather than nudged.
+ */
+
+/** The widest a pane opens, per action. A 76 target is comfortable for a thumb. */
+const SWIPE_ACTION_WIDTH = exports.SWIPE_ACTION_WIDTH = 76;
+
+/**
+ * How far a row must travel, as a fraction of the pane's full width, before the
+ * drag is committed rather than sprung back. Below it the row closes, so a
+ * half-hearted drag never leaves a row stuck ajar.
+ */
+const SWIPE_COMMIT_FRACTION = exports.SWIPE_COMMIT_FRACTION = 0.4;
+
+/** Below this many pixels the drag reads as a tap and the row springs straight back. */
+const SWIPE_TAP_SLOP = exports.SWIPE_TAP_SLOP = 10;
+
+/** How long the snap to the resting position takes. Dropped under reduced motion. */
+const SWIPE_SNAP_DURATION = exports.SWIPE_SNAP_DURATION = 160;
+
+/** The corner radius a row's panes are clipped to, unless the caller says otherwise. */
+const SWIPE_ROW_RADIUS = exports.SWIPE_ROW_RADIUS = 12;
+
+/** How far the finger travels horizontally before the pan claims the touch. */
+const SWIPE_ACTIVATE_OFFSET = exports.SWIPE_ACTIVATE_OFFSET = 12;
+//# sourceMappingURL=constants.js.map

package/lib/commonjs/swipe-row/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SWIPE_ACTION_WIDTH","exports","SWIPE_COMMIT_FRACTION","SWIPE_TAP_SLOP","SWIPE_SNAP_DURATION","SWIPE_ROW_RADIUS","SWIPE_ACTIVATE_OFFSET"],"sourceRoot":"../../../src","sources":["swipe-row/constants.ts"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;;AAEA;AACO,MAAMA,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAG,EAAE;;AAEpC;AACA;AACA;AACA;AACA;AACO,MAAME,qBAAqB,GAAAD,OAAA,CAAAC,qBAAA,GAAG,GAAG;;AAExC;AACO,MAAMC,cAAc,GAAAF,OAAA,CAAAE,cAAA,GAAG,EAAE;;AAEhC;AACO,MAAMC,mBAAmB,GAAAH,OAAA,CAAAG,mBAAA,GAAG,GAAG;;AAEtC;AACO,MAAMC,gBAAgB,GAAAJ,OAAA,CAAAI,gBAAA,GAAG,EAAE;;AAElC;AACO,MAAMC,qBAAqB,GAAAL,OAAA,CAAAK,qBAAA,GAAG,EAAE","ignoreList":[]}

package/lib/commonjs/swipe-row/index.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "SWIPE_ACTION_WIDTH", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_ACTION_WIDTH;
+  }
+});
+Object.defineProperty(exports, "SWIPE_ACTIVATE_OFFSET", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_ACTIVATE_OFFSET;
+  }
+});
+Object.defineProperty(exports, "SWIPE_COMMIT_FRACTION", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_COMMIT_FRACTION;
+  }
+});
+Object.defineProperty(exports, "SWIPE_ROW_RADIUS", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_ROW_RADIUS;
+  }
+});
+Object.defineProperty(exports, "SWIPE_SNAP_DURATION", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_SNAP_DURATION;
+  }
+});
+Object.defineProperty(exports, "SWIPE_TAP_SLOP", {
+  enumerable: true,
+  get: function () {
+    return _constants.SWIPE_TAP_SLOP;
+  }
+});
+Object.defineProperty(exports, "SwipeRow", {
+  enumerable: true,
+  get: function () {
+    return _SwipeRow.SwipeRow;
+  }
+});
+Object.defineProperty(exports, "resolveSwipeRowPaint", {
+  enumerable: true,
+  get: function () {
+    return _shared.resolveSwipeRowPaint;
+  }
+});
+Object.defineProperty(exports, "swipeActionPaint", {
+  enumerable: true,
+  get: function () {
+    return _shared.swipeActionPaint;
+  }
+});
+Object.defineProperty(exports, "useSwipeAvailable", {
+  enumerable: true,
+  get: function () {
+    return _useSwipeAvailable.useSwipeAvailable;
+  }
+});
+var _SwipeRow = require("./SwipeRow.js");
+var _constants = require("./constants.js");
+var _shared = require("./shared.js");
+var _useSwipeAvailable = require("./use-swipe-available.js");
+//# sourceMappingURL=index.js.map

package/lib/commonjs/swipe-row/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_SwipeRow","require","_constants","_shared","_useSwipeAvailable"],"sourceRoot":"../../../src","sources":["swipe-row/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAD,OAAA;AAQA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAH,OAAA","ignoreList":[]}

package/lib/commonjs/swipe-row/shared.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resolveSwipeRowPaint = resolveSwipeRowPaint;
+exports.swipeActionPaint = swipeActionPaint;
+var _accentColors = require("../theme/accent-colors.js");
+/**
+ * The pane colours read off the theme.
+ *
+ * Nothing here picks a ramp stop. `accent` and `negative` are the SOLID pairs a
+ * filled control already uses, so a delete pane is the same red as a
+ * destructive button; `neutral` is the SUBTLE default pair, which is the one
+ * fill in the palette that reads as "a surface behind the row" rather than as a
+ * second control competing with the one the reader dragged away.
+ */
+function resolveSwipeRowPaint(theme) {
+  const neutral = (0, _accentColors.resolveAccentColors)(theme.colors, 'default', 'subtle');
+  const accent = (0, _accentColors.resolveAccentColors)(theme.colors, 'primary', 'solid');
+  const negative = (0, _accentColors.resolveAccentColors)(theme.colors, 'error', 'solid');
+  return {
+    neutral: neutral.background,
+    onNeutral: neutral.foreground,
+    accent: accent.background,
+    onAccent: accent.foreground,
+    negative: negative.background,
+    onNegative: negative.foreground
+  };
+}
+
+/** The pair one action's tone paints with. Pure. */
+function swipeActionPaint(action, paint) {
+  switch (action.tone) {
+    case 'negative':
+      return {
+        background: paint.negative,
+        foreground: paint.onNegative
+      };
+    case 'accent':
+      return {
+        background: paint.accent,
+        foreground: paint.onAccent
+      };
+    default:
+      return {
+        background: paint.neutral,
+        foreground: paint.onNeutral
+      };
+  }
+}
+//# sourceMappingURL=shared.js.map

package/lib/commonjs/swipe-row/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_accentColors","require","resolveSwipeRowPaint","theme","neutral","resolveAccentColors","colors","accent","negative","background","onNeutral","foreground","onAccent","onNegative","swipeActionPaint","action","paint","tone"],"sourceRoot":"../../../src","sources":["swipe-row/shared.ts"],"mappings":";;;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,oBAAoBA,CAACC,KAAY,EAAiB;EAChE,MAAMC,OAAO,GAAG,IAAAC,iCAAmB,EAACF,KAAK,CAACG,MAAM,EAAE,SAAS,EAAE,QAAQ,CAAC;EACtE,MAAMC,MAAM,GAAG,IAAAF,iCAAmB,EAACF,KAAK,CAACG,MAAM,EAAE,SAAS,EAAE,OAAO,CAAC;EACpE,MAAME,QAAQ,GAAG,IAAAH,iCAAmB,EAACF,KAAK,CAACG,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC;EACpE,OAAO;IACLF,OAAO,EAAEA,OAAO,CAACK,UAAU;IAC3BC,SAAS,EAAEN,OAAO,CAACO,UAAU;IAC7BJ,MAAM,EAAEA,MAAM,CAACE,UAAU;IACzBG,QAAQ,EAAEL,MAAM,CAACI,UAAU;IAC3BH,QAAQ,EAAEA,QAAQ,CAACC,UAAU;IAC7BI,UAAU,EAAEL,QAAQ,CAACG;EACvB,CAAC;AACH;;AAEA;AACO,SAASG,gBAAgBA,CAC9BC,MAAsB,EACtBC,KAAoB,EACwB;EAC5C,QAAQD,MAAM,CAACE,IAAI;IACjB,KAAK,UAAU;MACb,OAAO;QAAER,UAAU,EAAEO,KAAK,CAACR,QAAQ;QAAEG,UAAU,EAAEK,KAAK,CAACH;MAAW,CAAC;IACrE,KAAK,QAAQ;MACX,OAAO;QAAEJ,UAAU,EAAEO,KAAK,CAACT,MAAM;QAAEI,UAAU,EAAEK,KAAK,CAACJ;MAAS,CAAC;IACjE;MACE,OAAO;QAAEH,UAAU,EAAEO,KAAK,CAACZ,OAAO;QAAEO,UAAU,EAAEK,KAAK,CAACN;MAAU,CAAC;EACrE;AACF","ignoreList":[]}

package/lib/commonjs/swipe-row/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/lib/commonjs/swipe-row/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["swipe-row/types.ts"],"mappings":"","ignoreList":[]}

package/lib/commonjs/swipe-row/use-swipe-available.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSwipeAvailable = useSwipeAvailable;
+var _react = require("react");
+var _reactNative = require("react-native");
+const COARSE_POINTER = '(pointer: coarse)';
+
+/** `undefined` wherever there is no `matchMedia` — SSR, a test renderer, an old browser. */
+function coarsePointerQuery() {
+  if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') return undefined;
+  try {
+    return window.matchMedia(COARSE_POINTER);
+  } catch {
+    return undefined;
+  }
+}
+
+/**
+ * Whether a drag is the right affordance for THIS pointer.
+ *
+ * Native is always yes. Web is yes only where the pointer is COARSE: a web
+ * build runs on a phone as readily as on a desktop, and the answer is a
+ * property of the input device, not of the platform the bundle was built for.
+ * A mouse gets the hover affordance its family draws instead — a drag is
+ * undiscoverable with a pointer, and a `pointerdown`-driven pan fights text
+ * selection.
+ *
+ * It is a HOOK rather than a constant because the answer changes without a
+ * reload: a tablet with a keyboard folio attached and detached is the same
+ * document, and a desktop window dragged to a touchscreen is too.
+ */
+function useSwipeAvailable() {
+  const [coarse, setCoarse] = (0, _react.useState)(() => coarsePointerQuery()?.matches ?? false);
+  (0, _react.useEffect)(() => {
+    const query = coarsePointerQuery();
+    if (query === undefined) return undefined;
+    setCoarse(query.matches);
+    const listener = event => setCoarse(event.matches);
+    // `addListener` is the deprecated spelling, and the only one Safari below
+    // 14 has. Losing the subscription is silent, so both are tried.
+    if (typeof query.addEventListener === 'function') {
+      query.addEventListener('change', listener);
+      return () => query.removeEventListener('change', listener);
+    }
+    query.addListener(listener);
+    return () => query.removeListener(listener);
+  }, []);
+  return _reactNative.Platform.OS === 'web' ? coarse : true;
+}
+//# sourceMappingURL=use-swipe-available.js.map

package/lib/commonjs/swipe-row/use-swipe-available.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","COARSE_POINTER","coarsePointerQuery","window","matchMedia","undefined","useSwipeAvailable","coarse","setCoarse","useState","matches","useEffect","query","listener","event","addEventListener","removeEventListener","addListener","removeListener","Platform","OS"],"sourceRoot":"../../../src","sources":["swipe-row/use-swipe-available.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,MAAME,cAAc,GAAG,mBAAmB;;AAE1C;AACA,SAASC,kBAAkBA,CAAA,EAA+B;EACxD,IAAI,OAAOC,MAAM,KAAK,WAAW,IAAI,OAAOA,MAAM,CAACC,UAAU,KAAK,UAAU,EAAE,OAAOC,SAAS;EAC9F,IAAI;IACF,OAAOF,MAAM,CAACC,UAAU,CAACH,cAAc,CAAC;EAC1C,CAAC,CAAC,MAAM;IACN,OAAOI,SAAS;EAClB;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,iBAAiBA,CAAA,EAAY;EAC3C,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAG,IAAAC,eAAQ,EAAU,MAAMP,kBAAkB,CAAC,CAAC,EAAEQ,OAAO,IAAI,KAAK,CAAC;EAE3F,IAAAC,gBAAS,EAAC,MAAM;IACd,MAAMC,KAAK,GAAGV,kBAAkB,CAAC,CAAC;IAClC,IAAIU,KAAK,KAAKP,SAAS,EAAE,OAAOA,SAAS;IACzCG,SAAS,CAACI,KAAK,CAACF,OAAO,CAAC;IACxB,MAAMG,QAAQ,GAAIC,KAA0B,IAAKN,SAAS,CAACM,KAAK,CAACJ,OAAO,CAAC;IACzE;IACA;IACA,IAAI,OAAOE,KAAK,CAACG,gBAAgB,KAAK,UAAU,EAAE;MAChDH,KAAK,CAACG,gBAAgB,CAAC,QAAQ,EAAEF,QAAQ,CAAC;MAC1C,OAAO,MAAMD,KAAK,CAACI,mBAAmB,CAAC,QAAQ,EAAEH,QAAQ,CAAC;IAC5D;IACAD,KAAK,CAACK,WAAW,CAACJ,QAAQ,CAAC;IAC3B,OAAO,MAAMD,KAAK,CAACM,cAAc,CAACL,QAAQ,CAAC;EAC7C,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOM,qBAAQ,CAACC,EAAE,KAAK,KAAK,GAAGb,MAAM,GAAG,IAAI;AAC9C","ignoreList":[]}

package/lib/commonjs/switch/Switch.js

@@ -4,6 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Switch = void 0;
+var _legacy = require("../appearance/legacy.js");
+var _index = require("../appearance/index.js");
+var _colors = require("../appearance/colors.js");
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _useTheme = require("../theme/use-theme.js");
@@ -14,37 +17,59 @@ var _membership = require("../field/membership.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const TRACK = {
-  default: {
-    w: 44,
-    h: 26
+  xs: {
+    w: 30,
+    h: 18
   },
   sm: {
     w: 36,
     h: 22
+  },
+  md: {
+    w: 44,
+    h: 26
+  },
+  lg: {
+    w: 52,
+    h: 30
   }
 };
 const THUMB = {
-  default: 22,
-  sm: 18
+  xs: 14,
+  sm: 18,
+  md: 22,
+  lg: 26
 };
 const PADDING = 2;
 const SQUEEZE_RATIO = 0.75; // thumb height shrinks to 75% when pressed
 
 const SwitchComponent = /*#__PURE__*/_react.default.forwardRef(({
+  checked: checkedProp,
   value,
+  onCheckedChange: onCheckedChangeProp,
   onValueChange,
   disabled,
   style,
-  size = 'default',
+  size: sizeProp,
+  tone: toneProp,
   accessibilityLabel,
   nativeID,
   testID
 }, ref) => {
+  const checked = checkedProp ?? value ?? false;
+  const onCheckedChange = onCheckedChangeProp ?? onValueChange;
   const theme = (0, _useTheme.useTheme)();
-  // A switch draws no text, so a `Field` is often the only thing that names
-  // it — and the warning has to see the RESOLVED name, or a correctly
-  // labelled switch inside a field warns anyway and the warning stops
-  // meaning anything.
+  const {
+    size,
+    tone
+  } = (0, _index.useBloomAppearance)({
+    size: (0, _legacy.normalizeBloomSize)(sizeProp),
+    tone: toneProp
+  }, {
+    size: 'md',
+    tone: 'accent'
+  });
+  const paint = (0, _colors.resolveBloomColors)(theme.colors, tone, 'solid');
   const field = (0, _membership.useFieldMembership)({
     accessibilityLabel,
     disabled,
@@ -52,24 +77,24 @@ const SwitchComponent = /*#__PURE__*/_react.default.forwardRef(({
   });
   const isDisabled = field.disabled;
   (0, _useAccessibleNameWarning.useAccessibleNameWarning)('Switch', field.accessibilityLabel);
-  const anim = (0, _react.useRef)(new _reactNative.Animated.Value(value ? 1 : 0)).current;
+  const anim = (0, _react.useRef)(new _reactNative.Animated.Value(checked ? 1 : 0)).current;
   const pressAnim = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
 
-  // Track last value to detect external changes and animate accordingly.
-  // This avoids useEffect while still handling controlled value changes.
-  const prevValueRef = (0, _react.useRef)(value);
-  if (prevValueRef.current !== value) {
-    prevValueRef.current = value;
+  // Track last checked to detect external changes and animate accordingly.
+  // This avoids useEffect while still handling controlled checked changes.
+  const prevValueRef = (0, _react.useRef)(checked);
+  if (prevValueRef.current !== checked) {
+    prevValueRef.current = checked;
     _reactNative.Animated.spring(anim, {
-      toValue: value ? 1 : 0,
+      toValue: checked ? 1 : 0,
       useNativeDriver: false,
       ..._tokens.animation.spring.gentle
     }).start();
   }
   const handlePress = (0, _react.useCallback)(() => {
     if (isDisabled) return;
-    onValueChange(!value);
-  }, [isDisabled, value, onValueChange]);
+    onCheckedChange?.(!checked);
+  }, [isDisabled, checked, onCheckedChange]);
   const onPressIn = (0, _react.useCallback)(() => {
     if (isDisabled) return;
     _reactNative.Animated.spring(pressAnim, {
@@ -90,7 +115,7 @@ const SwitchComponent = /*#__PURE__*/_react.default.forwardRef(({
   const travel = track.w - thumb - PADDING * 2;
   const trackBg = anim.interpolate({
     inputRange: [0, 1],
-    outputRange: [theme.colors.border, theme.colors.primary]
+    outputRange: [theme.colors.border, paint.background]
   });
   const thumbX = anim.interpolate({
     inputRange: [0, 1],
@@ -108,7 +133,7 @@ const SwitchComponent = /*#__PURE__*/_react.default.forwardRef(({
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
     ref: ref,
     role: "switch",
-    "aria-checked": value
+    "aria-checked": checked
     // The NAME. A switch renders a track and a thumb, so there is no text
     // for the name to be computed from and no sibling caption either
     // platform will adopt — without this the control announces "switch, on"
@@ -146,6 +171,10 @@ const SwitchComponent = /*#__PURE__*/_react.default.forwardRef(({
       },
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
         style: [styles.thumb, {
+          backgroundColor: anim.interpolate({
+            inputRange: [0, 1],
+            outputRange: [theme.colors.text, paint.foreground]
+          }),
           width: thumb,
           height: thumbHeight,
           borderRadius: thumbRadius,
@@ -170,7 +199,6 @@ const styles = _reactNative.StyleSheet.create({
     opacity: 0.4
   },
   thumb: {
-    backgroundColor: '#fff',
     // Subtle raise (`shadow-s`) — `boxShadow` on web (RN-Web deprecated `shadow*`),
     // RN elevation/shadow on native.
     ...(0, _shadows.bloomShadowStyle)('s')