@oxy.so/bloom 3.6.0 → 4.0.0

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

@@ -0,0 +1,30 @@
+"use strict";
+
+/**
+ * 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. */
+export const 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.
+ */
+export const SWIPE_COMMIT_FRACTION = 0.4;
+
+/** Below this many pixels the drag reads as a tap and the row springs straight back. */
+export const SWIPE_TAP_SLOP = 10;
+
+/** How long the snap to the resting position takes. Dropped under reduced motion. */
+export const SWIPE_SNAP_DURATION = 160;
+
+/** The corner radius a row's panes are clipped to, unless the caller says otherwise. */
+export const SWIPE_ROW_RADIUS = 12;
+
+/** How far the finger travels horizontally before the pan claims the touch. */
+export const SWIPE_ACTIVATE_OFFSET = 12;
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["SWIPE_ACTION_WIDTH","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;AACA,OAAO,MAAMA,kBAAkB,GAAG,EAAE;;AAEpC;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,qBAAqB,GAAG,GAAG;;AAExC;AACA,OAAO,MAAMC,cAAc,GAAG,EAAE;;AAEhC;AACA,OAAO,MAAMC,mBAAmB,GAAG,GAAG;;AAEtC;AACA,OAAO,MAAMC,gBAAgB,GAAG,EAAE;;AAElC;AACA,OAAO,MAAMC,qBAAqB,GAAG,EAAE","ignoreList":[]}

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

@@ -0,0 +1,7 @@
+"use strict";
+
+export { SwipeRow } from "./SwipeRow.js";
+export { SWIPE_ACTION_WIDTH, SWIPE_ACTIVATE_OFFSET, SWIPE_COMMIT_FRACTION, SWIPE_ROW_RADIUS, SWIPE_SNAP_DURATION, SWIPE_TAP_SLOP } from "./constants.js";
+export { resolveSwipeRowPaint, swipeActionPaint } from "./shared.js";
+export { useSwipeAvailable } from "./use-swipe-available.js";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["SwipeRow","SWIPE_ACTION_WIDTH","SWIPE_ACTIVATE_OFFSET","SWIPE_COMMIT_FRACTION","SWIPE_ROW_RADIUS","SWIPE_SNAP_DURATION","SWIPE_TAP_SLOP","resolveSwipeRowPaint","swipeActionPaint","useSwipeAvailable"],"sourceRoot":"../../../src","sources":["swipe-row/index.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,eAAY;AACrC,SACEC,kBAAkB,EAClBC,qBAAqB,EACrBC,qBAAqB,EACrBC,gBAAgB,EAChBC,mBAAmB,EACnBC,cAAc,QACT,gBAAa;AACpB,SAASC,oBAAoB,EAAEC,gBAAgB,QAAQ,aAAU;AACjE,SAASC,iBAAiB,QAAQ,0BAAuB","ignoreList":[]}

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

@@ -0,0 +1,47 @@
+"use strict";
+
+import { resolveAccentColors } from "../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.
+ */
+export function resolveSwipeRowPaint(theme) {
+  const neutral = resolveAccentColors(theme.colors, 'default', 'subtle');
+  const accent = resolveAccentColors(theme.colors, 'primary', 'solid');
+  const negative = 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. */
+export 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/module/swipe-row/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["resolveAccentColors","resolveSwipeRowPaint","theme","neutral","colors","accent","negative","background","onNeutral","foreground","onAccent","onNegative","swipeActionPaint","action","paint","tone"],"sourceRoot":"../../../src","sources":["swipe-row/shared.ts"],"mappings":";;AAAA,SAASA,mBAAmB,QAAQ,2BAAwB;AAI5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,oBAAoBA,CAACC,KAAY,EAAiB;EAChE,MAAMC,OAAO,GAAGH,mBAAmB,CAACE,KAAK,CAACE,MAAM,EAAE,SAAS,EAAE,QAAQ,CAAC;EACtE,MAAMC,MAAM,GAAGL,mBAAmB,CAACE,KAAK,CAACE,MAAM,EAAE,SAAS,EAAE,OAAO,CAAC;EACpE,MAAME,QAAQ,GAAGN,mBAAmB,CAACE,KAAK,CAACE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC;EACpE,OAAO;IACLD,OAAO,EAAEA,OAAO,CAACI,UAAU;IAC3BC,SAAS,EAAEL,OAAO,CAACM,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;AACA,OAAO,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,CAACX,OAAO;QAAEM,UAAU,EAAEK,KAAK,CAACN;MAAU,CAAC;EACrE;AACF","ignoreList":[]}

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

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

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

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

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

@@ -0,0 +1,49 @@
+"use strict";
+
+import { useEffect, useState } from 'react';
+import { Platform } from '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.
+ */
+export function useSwipeAvailable() {
+  const [coarse, setCoarse] = useState(() => coarsePointerQuery()?.matches ?? false);
+  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 Platform.OS === 'web' ? coarse : true;
+}
+//# sourceMappingURL=use-swipe-available.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","Platform","COARSE_POINTER","coarsePointerQuery","window","matchMedia","undefined","useSwipeAvailable","coarse","setCoarse","matches","query","listener","event","addEventListener","removeEventListener","addListener","removeListener","OS"],"sourceRoot":"../../../src","sources":["swipe-row/use-swipe-available.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,QAAQ,QAAQ,cAAc;AAEvC,MAAMC,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;AACA,OAAO,SAASC,iBAAiBA,CAAA,EAAY;EAC3C,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGT,QAAQ,CAAU,MAAMG,kBAAkB,CAAC,CAAC,EAAEO,OAAO,IAAI,KAAK,CAAC;EAE3FX,SAAS,CAAC,MAAM;IACd,MAAMY,KAAK,GAAGR,kBAAkB,CAAC,CAAC;IAClC,IAAIQ,KAAK,KAAKL,SAAS,EAAE,OAAOA,SAAS;IACzCG,SAAS,CAACE,KAAK,CAACD,OAAO,CAAC;IACxB,MAAME,QAAQ,GAAIC,KAA0B,IAAKJ,SAAS,CAACI,KAAK,CAACH,OAAO,CAAC;IACzE;IACA;IACA,IAAI,OAAOC,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,OAAOX,QAAQ,CAACiB,EAAE,KAAK,KAAK,GAAGV,MAAM,GAAG,IAAI;AAC9C","ignoreList":[]}

package/lib/module/switch/Switch.js

@@ -1,5 +1,8 @@
 "use strict";
 
+import { normalizeBloomSize } from "../appearance/legacy.js";
+import { useBloomAppearance } from "../appearance/index.js";
+import { resolveBloomColors } from "../appearance/colors.js";
 import React, { memo, useCallback, useRef } from 'react';
 import { Pressable, Animated, StyleSheet } from 'react-native';
 import { useTheme } from "../theme/use-theme.js";
@@ -9,37 +12,59 @@ import { useAccessibleNameWarning } from "../hooks/use-accessible-name-warning.j
 import { useFieldMembership } from "../field/membership.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 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.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 = 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
+  } = useBloomAppearance({
+    size: normalizeBloomSize(sizeProp),
+    tone: toneProp
+  }, {
+    size: 'md',
+    tone: 'accent'
+  });
+  const paint = resolveBloomColors(theme.colors, tone, 'solid');
   const field = useFieldMembership({
     accessibilityLabel,
     disabled,
@@ -47,24 +72,24 @@ const SwitchComponent = /*#__PURE__*/React.forwardRef(({
   });
   const isDisabled = field.disabled;
   useAccessibleNameWarning('Switch', field.accessibilityLabel);
-  const anim = useRef(new Animated.Value(value ? 1 : 0)).current;
+  const anim = useRef(new Animated.Value(checked ? 1 : 0)).current;
   const pressAnim = useRef(new 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 = 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 = useRef(checked);
+  if (prevValueRef.current !== checked) {
+    prevValueRef.current = checked;
     Animated.spring(anim, {
-      toValue: value ? 1 : 0,
+      toValue: checked ? 1 : 0,
       useNativeDriver: false,
       ...animation.spring.gentle
     }).start();
   }
   const handlePress = useCallback(() => {
     if (isDisabled) return;
-    onValueChange(!value);
-  }, [isDisabled, value, onValueChange]);
+    onCheckedChange?.(!checked);
+  }, [isDisabled, checked, onCheckedChange]);
   const onPressIn = useCallback(() => {
     if (isDisabled) return;
     Animated.spring(pressAnim, {
@@ -85,7 +110,7 @@ const SwitchComponent = /*#__PURE__*/React.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],
@@ -103,7 +128,7 @@ const SwitchComponent = /*#__PURE__*/React.forwardRef(({
   return /*#__PURE__*/_jsx(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"
@@ -141,6 +166,10 @@ const SwitchComponent = /*#__PURE__*/React.forwardRef(({
       },
       children: /*#__PURE__*/_jsx(Animated.View, {
         style: [styles.thumb, {
+          backgroundColor: anim.interpolate({
+            inputRange: [0, 1],
+            outputRange: [theme.colors.text, paint.foreground]
+          }),
           width: thumb,
           height: thumbHeight,
           borderRadius: thumbRadius,
@@ -165,7 +194,6 @@ const styles = StyleSheet.create({
     opacity: 0.4
   },
   thumb: {
-    backgroundColor: '#fff',
     // Subtle raise (`shadow-s`) — `boxShadow` on web (RN-Web deprecated `shadow*`),
     // RN elevation/shadow on native.
     ...bloomShadowStyle('s')

package/lib/module/switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","memo","useCallback","useRef","Pressable","Animated","StyleSheet","useTheme","animation","bloomShadowStyle","useAccessibleNameWarning","useFieldMembership","jsx","_jsx","TRACK","default","w","h","sm","THUMB","PADDING","SQUEEZE_RATIO","SwitchComponent","forwardRef","value","onValueChange","disabled","style","size","accessibilityLabel","nativeID","testID","ref","theme","field","isDisabled","anim","Value","current","pressAnim","prevValueRef","spring","toValue","useNativeDriver","gentle","start","handlePress","onPressIn","snappy","onPressOut","track","thumb","travel","trackBg","interpolate","inputRange","outputRange","colors","border","primary","thumbX","squeezedHeight","thumbHeight","thumbRadius","role","describedBy","invalid","undefined","onPress","styles","hitSlop","HIT_SLOP","children","View","width","height","borderRadius","backgroundColor","justifyContent","alignItems","transform","translateX","displayName","Switch","top","bottom","left","right","create","opacity"],"sourceRoot":"../../../src","sources":["switch/Switch.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,IAAI,EAAEC,WAAW,EAAEC,MAAM,QAAQ,OAAO;AACxD,SAASC,SAAS,EAAEC,QAAQ,EAAEC,UAAU,QAAQ,cAAc;AAE9D,SAASC,QAAQ,QAAQ,uBAAoB;AAC7C,SAASC,SAAS,QAAQ,qBAAkB;AAC5C,SAASC,gBAAgB,QAAQ,0BAA0B;AAC3D,SAASC,wBAAwB,QAAQ,yCAAsC;AAC/E,SAASC,kBAAkB,QAAQ,wBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGzD,MAAMC,KAAK,GAAG;EAAEC,OAAO,EAAE;IAAEC,CAAC,EAAE,EAAE;IAAEC,CAAC,EAAE;EAAG,CAAC;EAAEC,EAAE,EAAE;IAAEF,CAAC,EAAE,EAAE;IAAEC,CAAC,EAAE;EAAG;AAAE,CAAU;AAC1E,MAAME,KAAK,GAAG;EAAEJ,OAAO,EAAE,EAAE;EAAEG,EAAE,EAAE;AAAG,CAAU;AAC9C,MAAME,OAAO,GAAG,CAAC;AACjB,MAAMC,aAAa,GAAG,IAAI,CAAC,CAAC;;AAE5B,MAAMC,eAAe,gBAAGtB,KAAK,CAACuB,UAAU,CACtC,CACE;EAAEC,KAAK;EAAEC,aAAa;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,IAAI,GAAG,SAAS;EAAEC,kBAAkB;EAAEC,QAAQ;EAAEC;AAAO,CAAC,EACjGC,GAAG,KACA;EACH,MAAMC,KAAK,GAAG1B,QAAQ,CAAC,CAAC;EACxB;EACA;EACA;EACA;EACA,MAAM2B,KAAK,GAAGvB,kBAAkB,CAAC;IAAEkB,kBAAkB;IAAEH,QAAQ;IAAEI;EAAS,CAAC,CAAC;EAC5E,MAAMK,UAAU,GAAGD,KAAK,CAACR,QAAQ;EACjChB,wBAAwB,CAAC,QAAQ,EAAEwB,KAAK,CAACL,kBAAkB,CAAC;EAC5D,MAAMO,IAAI,GAAGjC,MAAM,CAAC,IAAIE,QAAQ,CAACgC,KAAK,CAACb,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAACc,OAAO;EAC9D,MAAMC,SAAS,GAAGpC,MAAM,CAAC,IAAIE,QAAQ,CAACgC,KAAK,CAAC,CAAC,CAAC,CAAC,CAACC,OAAO;;EAEvD;EACA;EACA,MAAME,YAAY,GAAGrC,MAAM,CAACqB,KAAK,CAAC;EAClC,IAAIgB,YAAY,CAACF,OAAO,KAAKd,KAAK,EAAE;IAClCgB,YAAY,CAACF,OAAO,GAAGd,KAAK;IAC5BnB,QAAQ,CAACoC,MAAM,CAACL,IAAI,EAAE;MACpBM,OAAO,EAAElB,KAAK,GAAG,CAAC,GAAG,CAAC;MACtBmB,eAAe,EAAE,KAAK;MACtB,GAAGnC,SAAS,CAACiC,MAAM,CAACG;IACtB,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;EACZ;EAEA,MAAMC,WAAW,GAAG5C,WAAW,CAAC,MAAM;IACpC,IAAIiC,UAAU,EAAE;IAChBV,aAAa,CAAC,CAACD,KAAK,CAAC;EACvB,CAAC,EAAE,CAACW,UAAU,EAAEX,KAAK,EAAEC,aAAa,CAAC,CAAC;EAEtC,MAAMsB,SAAS,GAAG7C,WAAW,CAAC,MAAM;IAClC,IAAIiC,UAAU,EAAE;IAChB9B,QAAQ,CAACoC,MAAM,CAACF,SAAS,EAAE;MACzBG,OAAO,EAAE,CAAC;MACVC,eAAe,EAAE,KAAK;MACtB,GAAGnC,SAAS,CAACiC,MAAM,CAACO;IACtB,CAAC,CAAC,CAACH,KAAK,CAAC,CAAC;EACZ,CAAC,EAAE,CAACV,UAAU,EAAEI,SAAS,CAAC,CAAC;EAE3B,MAAMU,UAAU,GAAG/C,WAAW,CAAC,MAAM;IACnCG,QAAQ,CAACoC,MAAM,CAACF,SAAS,EAAE;MACzBG,OAAO,EAAE,CAAC;MACVC,eAAe,EAAE,KAAK;MACtB,GAAGnC,SAAS,CAACiC,MAAM,CAACG;IACtB,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC;EACZ,CAAC,EAAE,CAACN,SAAS,CAAC,CAAC;EAEf,MAAMW,KAAK,GAAGpC,KAAK,CAACc,IAAI,CAAC;EACzB,MAAMuB,KAAK,GAAGhC,KAAK,CAACS,IAAI,CAAC;EACzB,MAAMwB,MAAM,GAAGF,KAAK,CAAClC,CAAC,GAAGmC,KAAK,GAAG/B,OAAO,GAAG,CAAC;EAE5C,MAAMiC,OAAO,GAAGjB,IAAI,CAACkB,WAAW,CAAC;IAC/BC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAE,CAACvB,KAAK,CAACwB,MAAM,CAACC,MAAM,EAAEzB,KAAK,CAACwB,MAAM,CAACE,OAAO;EACzD,CAAC,CAAC;EAEF,MAAMC,MAAM,GAAGxB,IAAI,CAACkB,WAAW,CAAC;IAC9BC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAE,CAACpC,OAAO,EAAEA,OAAO,GAAGgC,MAAM;EACzC,CAAC,CAAC;EAEF,MAAMS,cAAc,GAAGV,KAAK,GAAG9B,aAAa;EAE5C,MAAMyC,WAAW,GAAGvB,SAAS,CAACe,WAAW,CAAC;IACxCC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAE,CAACL,KAAK,EAAEU,cAAc;EACrC,CAAC,CAAC;EAEF,MAAME,WAAW,GAAGxB,SAAS,CAACe,WAAW,CAAC;IACxCC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAE,CAACL,KAAK,GAAG,CAAC,EAAEU,cAAc,GAAG,CAAC;EAC7C,CAAC,CAAC;EAEF,oBACEhD,IAAA,CAACT,SAAS;IACR4B,GAAG,EAAEA,GAAI;IACTgC,IAAI,EAAC,QAAQ;IACb,gBAAcxC;IACd;IACA;IACA;IACA;IACA;IACA;IACA;IAAA;IACAK,kBAAkB,EAAEK,KAAK,CAACL,kBAAmB;IAC7CC,QAAQ,EAAEI,KAAK,CAACJ,QAAS;IACzB,oBAAkBI,KAAK,CAAC+B,WAAY;IACpC,gBAAc/B,KAAK,CAACgC,OAAO,IAAIC;IAC/B;IACA;IACA;IACA;IACA;IACA;IAAA;IACAzC,QAAQ,EAAES,UAAW;IACrBiC,OAAO,EAAEtB,WAAY;IACrBC,SAAS,EAAEA,SAAU;IACrBE,UAAU,EAAEA,UAAW;IACvBtB,KAAK,EAAE,CAACQ,UAAU,IAAIkC,MAAM,CAAC3C,QAAQ,EAAEC,KAAK,CAAE;IAC9C2C,OAAO,EAAEC,QAAS;IAClBxC,MAAM,EAAEA,MAAO;IAAAyC,QAAA,eAEf3D,IAAA,CAACR,QAAQ,CAACoE,IAAI;MACZ9C,KAAK,EAAE;QACL+C,KAAK,EAAExB,KAAK,CAAClC,CAAC;QACd2D,MAAM,EAAEzB,KAAK,CAACjC,CAAC;QACf2D,YAAY,EAAE1B,KAAK,CAACjC,CAAC,GAAG,CAAC;QACzB4D,eAAe,EAAExB,OAAO;QACxByB,cAAc,EAAE,QAAQ;QACxBC,UAAU,EAAE;MACd,CAAE;MAAAP,QAAA,eAEF3D,IAAA,CAACR,QAAQ,CAACoE,IAAI;QACZ9C,KAAK,EAAE,CACL0C,MAAM,CAAClB,KAAK,EACZ;UACEuB,KAAK,EAAEvB,KAAK;UACZwB,MAAM,EAAEb,WAAW;UACnBc,YAAY,EAAEb,WAAW;UACzBiB,SAAS,EAAE,CAAC;YAAEC,UAAU,EAAErB;UAAO,CAAC;QACpC,CAAC;MACD,CACH;IAAC,CACW;EAAC,CACP,CAAC;AAEhB,CACF,CAAC;AAEDtC,eAAe,CAAC4D,WAAW,GAAG,QAAQ;AAEtC,OAAO,MAAMC,MAAM,gBAAGlF,IAAI,CAACqB,eAAe,CAAC;AAE3C,MAAMiD,QAAQ,GAAG;EAAEa,GAAG,EAAE,CAAC;EAAEC,MAAM,EAAE,CAAC;EAAEC,IAAI,EAAE,CAAC;EAAEC,KAAK,EAAE;AAAE,CAAU;AAElE,MAAMlB,MAAM,GAAG/D,UAAU,CAACkF,MAAM,CAAC;EAC/B9D,QAAQ,EAAE;IACR+D,OAAO,EAAE;EACX,CAAC;EACDtC,KAAK,EAAE;IACL0B,eAAe,EAAE,MAAM;IACvB;IACA;IACA,GAAGpE,gBAAgB,CAAC,GAAG;EACzB;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["normalizeBloomSize","useBloomAppearance","resolveBloomColors","React","memo","useCallback","useRef","Pressable","Animated","StyleSheet","useTheme","animation","bloomShadowStyle","useAccessibleNameWarning","useFieldMembership","jsx","_jsx","TRACK","xs","w","h","sm","md","lg","THUMB","PADDING","SQUEEZE_RATIO","SwitchComponent","forwardRef","checked","checkedProp","value","onCheckedChange","onCheckedChangeProp","onValueChange","disabled","style","size","sizeProp","tone","toneProp","accessibilityLabel","nativeID","testID","ref","theme","paint","colors","field","isDisabled","anim","Value","current","pressAnim","prevValueRef","spring","toValue","useNativeDriver","gentle","start","handlePress","onPressIn","snappy","onPressOut","track","thumb","travel","trackBg","interpolate","inputRange","outputRange","border","background","thumbX","squeezedHeight","thumbHeight","thumbRadius","role","describedBy","invalid","undefined","onPress","styles","hitSlop","HIT_SLOP","children","View","width","height","borderRadius","backgroundColor","justifyContent","alignItems","text","foreground","transform","translateX","displayName","Switch","top","bottom","left","right","create","opacity"],"sourceRoot":"../../../src","sources":["switch/Switch.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/tab-bar/TabBarBase.js

@@ -15,14 +15,16 @@
  * react-native-screens, so this file is safe in a web bundle and in a
  * consumer's type-check.
  */
-import { Children, createContext, useCallback, useContext, useEffect, useMemo } from 'react';
-import { Platform, Pressable, StyleSheet, useWindowDimensions, View } from 'react-native';
+import { Children, Fragment, createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import { Platform, Pressable, StyleSheet, View } from 'react-native';
 import { Gesture, GestureDetector } from 'react-native-gesture-handler';
 import Animated, { Extrapolation, interpolate, interpolateColor, runOnJS, useAnimatedReaction, useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useHaptics } from "../hooks/use-haptics.js";
 import { useClaimBottomEdge } from "../layout/bottom-edge.js";
 import { windowEdgeGap } from "../layout/edge.js";
+import { useTheme } from "../theme/use-theme.js";
+import { SolidTabBarSurface } from "./surface-solid.js";
 import { setMinimized, useMinimizeState } from "./context.js";
 import { BAR_MARGIN, BLUR_BLEED, EXPANDED_HEIGHT, HIGHLIGHT_EXPANDED, HIGHLIGHT_FADE, HIGHLIGHT_MINIMIZED, MAX_EXPANDED_ITEM_WIDTH, ICON_SIZE, ITEM_GAP, ITEM_PAD_V, LABEL_FONT_SIZE, LONG_PRESS_MIN_DURATION, MINIMIZED_HEIGHT, MINIMIZED_INSET, ROW_PAD_H, SLIDE_SPRING, useTabBarTheme } from "./shared.js";
 
@@ -33,6 +35,18 @@ import { BAR_MARGIN, BLUR_BLEED, EXPANDED_HEIGHT, HIGHLIGHT_EXPANDED, HIGHLIGHT_
  */
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const BarContext = /*#__PURE__*/createContext(null);
+function OptionalGesture({
+  enabled,
+  children,
+  ...props
+}) {
+  return enabled ? /*#__PURE__*/_jsx(GestureDetector, {
+    ...props,
+    children: children
+  }) : /*#__PURE__*/_jsx(Fragment, {
+    children: children
+  });
+}
 /**
  * Floating tab bar with Revolut-style minimize-on-scroll, a sliding highlight
  * and finger scrubbing.
@@ -49,15 +63,18 @@ function TabBarBody({
   haptics = true,
   blur = true,
   maxWidth,
+  embedded = false,
+  scrollable = false,
+  material = 'translucent',
+  minimizeProgress,
+  onLayout,
   style,
   ...viewProps
 }) {
   const insets = useSafeAreaInsets();
-  const {
-    width: windowWidth
-  } = useWindowDimensions();
+  const [containerWidth, setContainerWidth] = useState(0);
   const minimized = useMinimizeState();
-  const progress = minimized.progress;
+  const progress = minimizeProgress ?? minimized.progress;
   const tabCount = Math.max(Children.count(children), 1);
 
   // Is a tab selected at all?
@@ -83,7 +100,13 @@ function TabBarBody({
   const highlightOpacity = useSharedValue(hasSelection ? 1 : 0);
   const isDragging = useSharedValue(false);
   const lastTicked = useSharedValue(-1);
-  const theme = useTabBarTheme(themeOverrides);
+  const {
+    colors
+  } = useTheme();
+  const theme = useTabBarTheme(material === 'solid' ? {
+    ...themeOverrides,
+    solidFallback: themeOverrides?.solidFallback ?? colors.backgroundSecondary
+  } : themeOverrides);
   const impact = useHaptics();
 
   // The pill's OUTER width (the box the animated minimize inset is applied
@@ -97,7 +120,8 @@ function TabBarBody({
   // the whole window. Each expanded slot gets at most a comfortable 88pt; more
   // tabs naturally grow the pill until it reaches the available width. An
   // explicit `maxWidth` remains an additional ceiling, never a width request.
-  const availableWidth = windowWidth - BAR_MARGIN * 2;
+  const availableWidth = Math.max(0, containerWidth - (embedded ? 0 : BAR_MARGIN * 2));
+  const minimizeInset = embedded ? 0 : Math.min(MINIMIZED_INSET, Math.max(0, (availableWidth - tabCount * 44 - ROW_PAD_H * 2) / 2));
   const contentWidth = tabCount * MAX_EXPANDED_ITEM_WIDTH + ROW_PAD_H * 2;
   const barOuterWidth = Math.min(availableWidth, contentWidth, maxWidth ?? Infinity);
 
@@ -192,7 +216,7 @@ function TabBarBody({
     const indexAtX = (x, minimizedValue) => {
       'worklet';
 
-      const sideInset = interpolate(minimizedValue, [0, 1], [0, MINIMIZED_INSET], Extrapolation.CLAMP);
+      const sideInset = interpolate(minimizedValue, [0, 1], [0, minimizeInset], Extrapolation.CLAMP);
       // `event.x` is measured from the left edge of the view the detector is
       // attached to — the animated pill itself, NOT the window and not the wrap
       // around it. Its width is therefore the outer width minus the two
@@ -274,7 +298,7 @@ function TabBarBody({
       runOnJS(longPressIndex)(Math.round(indexAtX(event.x, progress.value)));
     });
     return Gesture.Race(pan, tap, longPress);
-  }, [barOuterWidth, tabCount, selectIndex, hasLongPress, longPressIndex, tick, driven, isDragging, lastTicked, slideIndex, highlightOpacity, minimized, progress]);
+  }, [barOuterWidth, minimizeInset, tabCount, selectIndex, hasLongPress, longPressIndex, tick, driven, isDragging, lastTicked, slideIndex, highlightOpacity, minimized, progress]);
 
   // CRITICAL — every shared value and every scalar a mapper READS must appear
   // in its dependency array. On web WITHOUT the react-native-worklets babel
@@ -301,13 +325,13 @@ function TabBarBody({
     // leaving the highlight narrower than the tab it sits under. Static styles
     // are unaffected — they take RNW's own StyleSheet path, which does handle
     // the shorthand — so this only bites inside a mapper.
-    const inset = interpolate(progress.value, [0, 1], [0, MINIMIZED_INSET], Extrapolation.CLAMP);
+    const inset = interpolate(progress.value, [0, 1], [0, minimizeInset], Extrapolation.CLAMP);
     return {
       height,
       marginLeft: inset,
       marginRight: inset
     };
-  }, [progress]);
+  }, [progress, minimizeInset]);
 
   // The capsule shape lives on the surface itself: iOS 26 glass renders its own
   // native corner configuration (true squircle + rim lighting). Clipping a
@@ -317,14 +341,14 @@ function TabBarBody({
     return {
       borderRadius: height / 2
     };
-  }, [progress]);
+  }, [progress, minimizeInset]);
 
   // One shared highlight that slides between tabs (transform-only → GPU). All
   // geometry derives from shared values, never from layout callbacks.
   const highlightStyle = useAnimatedStyle(() => {
     const barHeight = interpolate(progress.value, [0, 1], [EXPANDED_HEIGHT, MINIMIZED_HEIGHT], Extrapolation.CLAMP);
     const height = interpolate(progress.value, [0, 1], [HIGHLIGHT_EXPANDED, HIGHLIGHT_MINIMIZED], Extrapolation.CLAMP);
-    const sideInset = interpolate(progress.value, [0, 1], [0, MINIMIZED_INSET], Extrapolation.CLAMP);
+    const sideInset = interpolate(progress.value, [0, 1], [0, minimizeInset], Extrapolation.CLAMP);
     // Same `barOuterWidth` the scrub worklet resolves an index from — see the
     // note where it is computed.
     const barWidth = barOuterWidth - sideInset * 2;
@@ -343,11 +367,11 @@ function TabBarBody({
         translateX: ROW_PAD_H + itemWidth * slideIndex.value
       }]
     };
-  }, [progress, slideIndex, highlightOpacity, barOuterWidth, tabCount]);
+  }, [progress, slideIndex, highlightOpacity, barOuterWidth, tabCount, minimizeInset]);
 
   // Shared with `useTabBarFootprint`, so a consumer accounting for the bar in
   // its own layout can never drift from where the bar actually sits.
-  const bottomOffset = windowEdgeGap(insets.bottom);
+  const bottomOffset = embedded ? 0 : windowEdgeGap(insets.bottom);
 
   // Publish what the bar occupies so anything else at this edge stacks above it
   // rather than behind it. Same number `useTabBarFootprint` reports, derived from
@@ -355,7 +379,7 @@ function TabBarBody({
   // where the bar actually sits. The EXPANDED height on purpose: the bar
   // minimizes on scroll and re-expands, so claiming the minimized height would
   // drop a FAB onto the pill the moment the user scrolled back up.
-  useClaimBottomEdge(bottomOffset + EXPANDED_HEIGHT);
+  useClaimBottomEdge(embedded ? 0 : bottomOffset + EXPANDED_HEIGHT);
 
   // How centring and the animated inset compose: centring is STATIC and belongs
   // to the wrap, the inset stays ANIMATED on the pill inside it. The wrap is
@@ -374,6 +398,8 @@ function TabBarBody({
     alignSelf: 'center'
   };
   const barContext = useMemo(() => ({
+    scrollable,
+    progress,
     slideIndex,
     highlightOpacity,
     isDragging,
@@ -381,12 +407,19 @@ function TabBarBody({
     activeIndex,
     driven,
     selectIndex
-  }), [slideIndex, highlightOpacity, isDragging, theme, activeIndex, driven, selectIndex]);
+  }), [scrollable, progress, slideIndex, highlightOpacity, isDragging, theme, activeIndex, driven, selectIndex]);
+  const ResolvedSurface = material === 'solid' ? SolidTabBarSurface : Surface;
   return /*#__PURE__*/_jsxs(View, {
     ...viewProps,
+    onLayout: event => {
+      setContainerWidth(event.nativeEvent.layout.width);
+      onLayout?.(event);
+    },
     pointerEvents: "box-none",
-    style: [styles.root, style],
-    children: [blur !== false && /*#__PURE__*/_jsx(Blur, {
+    style: [embedded ? {
+      width: '100%'
+    } : styles.root, style],
+    children: [!embedded && blur !== false && /*#__PURE__*/_jsx(Blur, {
       direction: "bottom",
       intensity: typeof blur === 'object' ? blur.intensity : undefined,
       style: {
@@ -398,14 +431,15 @@ function TabBarBody({
       }
     }), /*#__PURE__*/_jsx(View, {
       pointerEvents: "box-none",
-      style: [styles.barWrap, {
+      style: [embedded ? undefined : styles.barWrap, {
         marginBottom: bottomOffset
       }, constrainedWrapStyle],
-      children: /*#__PURE__*/_jsx(GestureDetector, {
+      children: /*#__PURE__*/_jsx(OptionalGesture, {
+        enabled: !scrollable,
         gesture: gesture,
         children: /*#__PURE__*/_jsxs(Animated.View, {
           style: barStyle,
-          children: [/*#__PURE__*/_jsx(Surface, {
+          children: [/*#__PURE__*/_jsx(ResolvedSurface, {
             theme: theme,
             style: shapeStyle
           }), /*#__PURE__*/_jsx(Animated.View, {
@@ -440,8 +474,8 @@ function TabBarButtonBody({
   ...pressableProps
 }) {
   const minimized = useMinimizeState();
-  const progress = minimized.progress;
   const bar = useContext(BarContext);
+  const progress = bar?.progress ?? minimized.progress;
   // Resolved outside the bar too, so a standalone button still themes itself.
   const standaloneTheme = useTabBarTheme();
   const theme = bar?.theme ?? standaloneTheme;
@@ -554,7 +588,7 @@ function TabBarButtonBody({
       // one tap produced `PRESSABLE selectIndex(1)` AND `GESTURE tap
       // selectIndex(1)` ~600ms apart on a busy JS thread — so there, and only
       // there, this press stands down.
-      if (isFocused === undefined && Platform.OS !== 'android') bar?.selectIndex(index);
+      if (isFocused === undefined && (bar?.scrollable || Platform.OS !== 'android')) bar?.selectIndex(index);
       onPress?.(event);
     }
     // `Pressable`'s `style` also accepts a function of the press state; both