@oxy.so/bloom 3.6.0 → 4.1.0

package/lib/module/earnings/index.js

@@ -0,0 +1,8 @@
+"use strict";
+
+export { EarningsBreakdown } from "./EarningsBreakdown.js";
+export { EarningsPayoutRow } from "./EarningsPayoutRow.js";
+export { EarningsSummary } from "./EarningsSummary.js";
+export { EARNINGS_GEOMETRY, EARNINGS_LABELS, EARNINGS_PAYOUT_TONE } from "./constants.js";
+export { earningsHeadline, earningsHeadlineLabel, joinEarningsName, resolveEarningsPaint, resolveEarningsPeriod } from "./shared.js";
+//# sourceMappingURL=index.js.map

package/lib/module/earnings/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EarningsBreakdown","EarningsPayoutRow","EarningsSummary","EARNINGS_GEOMETRY","EARNINGS_LABELS","EARNINGS_PAYOUT_TONE","earningsHeadline","earningsHeadlineLabel","joinEarningsName","resolveEarningsPaint","resolveEarningsPeriod"],"sourceRoot":"../../../src","sources":["earnings/index.ts"],"mappings":";;AAAA,SAASA,iBAAiB,QAAQ,wBAAqB;AACvD,SAASC,iBAAiB,QAAQ,wBAAqB;AACvD,SAASC,eAAe,QAAQ,sBAAmB;AACnD,SAASC,iBAAiB,EAAEC,eAAe,EAAEC,oBAAoB,QAAQ,gBAAa;AAEtF,SACEC,gBAAgB,EAChBC,qBAAqB,EACrBC,gBAAgB,EAChBC,oBAAoB,EACpBC,qBAAqB,QAChB,aAAU","ignoreList":[]}

package/lib/module/earnings/shared.js

@@ -0,0 +1,63 @@
+"use strict";
+
+/**
+ * What the earnings panel paints, and the two pure decisions it is built on.
+ *
+ * The paint is RELATIVE for the reason every family here computes one the same
+ * way: the panel is on a page, in a sheet and inside a card, and a ramp stop
+ * picked here would be right for one of them and invisible on the others.
+ */
+import { hairlineOn, surfaceFillOn, surfaceTextOn } from "../styles/surface-levels.js";
+export function resolveEarningsPaint(theme, surface) {
+  const text = surfaceTextOn(theme, surface);
+  const tile = surfaceFillOn(theme, surface);
+  return {
+    surface,
+    hairline: hairlineOn(theme, surface),
+    tile,
+    text: text.text,
+    textSecondary: text.textSecondary,
+    textTertiary: text.textTertiary,
+    tileText: surfaceTextOn(theme, tile)
+  };
+}
+
+/**
+ * The period the panel is showing, by id.
+ *
+ * An id that names no period falls back to the FIRST rather than to nothing: a
+ * panel with a stale id in its state would otherwise draw an empty figure, and
+ * an empty figure reads as "you earned nothing" rather than as "this app asked
+ * for a period that is not on the list".
+ */
+export function resolveEarningsPeriod(periods, id) {
+  return periods.find(period => period.id === id) ?? periods[0];
+}
+
+/**
+ * What the chart's headline says, given which bar the reader is on.
+ *
+ * THE HEADLINE IS NEVER COMPUTED. At rest it is the period's own `total`; over
+ * a bar it is that bar's own `amount`. Both are strings the app formatted, so
+ * this function chooses between two answers rather than producing one — which
+ * is the whole of what "money arrives pre-formatted" means here.
+ *
+ * An index outside the bars is treated as no index: an active index that
+ * outlived its data must not read a hole.
+ */
+export function earningsHeadline(total, bars, activeIndex) {
+  if (activeIndex === null || bars === undefined) return total;
+  return bars[activeIndex]?.amount ?? total;
+}
+
+/** The label over the headline: the period's own name, or the bar the reader is on. */
+export function earningsHeadlineLabel(rest, bars, activeIndex) {
+  if (activeIndex === null || bars === undefined) return rest;
+  return bars[activeIndex]?.label ?? rest;
+}
+
+/** Joins the non-empty parts of an accessible name. */
+export function joinEarningsName(parts, separator = ', ') {
+  return parts.filter(part => typeof part === 'string' && part !== '').join(separator);
+}
+//# sourceMappingURL=shared.js.map

package/lib/module/earnings/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hairlineOn","surfaceFillOn","surfaceTextOn","resolveEarningsPaint","theme","surface","text","tile","hairline","textSecondary","textTertiary","tileText","resolveEarningsPeriod","periods","id","find","period","earningsHeadline","total","bars","activeIndex","undefined","amount","earningsHeadlineLabel","rest","label","joinEarningsName","parts","separator","filter","part","join"],"sourceRoot":"../../../src","sources":["earnings/shared.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,aAAa,EAAEC,aAAa,QAAQ,6BAA0B;AAmBnF,OAAO,SAASC,oBAAoBA,CAACC,KAAY,EAAEC,OAAe,EAAiB;EACjF,MAAMC,IAAI,GAAGJ,aAAa,CAACE,KAAK,EAAEC,OAAO,CAAC;EAC1C,MAAME,IAAI,GAAGN,aAAa,CAACG,KAAK,EAAEC,OAAO,CAAC;EAC1C,OAAO;IACLA,OAAO;IACPG,QAAQ,EAAER,UAAU,CAACI,KAAK,EAAEC,OAAO,CAAC;IACpCE,IAAI;IACJD,IAAI,EAAEA,IAAI,CAACA,IAAI;IACfG,aAAa,EAAEH,IAAI,CAACG,aAAa;IACjCC,YAAY,EAAEJ,IAAI,CAACI,YAAY;IAC/BC,QAAQ,EAAET,aAAa,CAACE,KAAK,EAAEG,IAAI;EACrC,CAAC;AACH;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASK,qBAAqBA,CACnCC,OAAkC,EAClCC,EAAsB,EACM;EAC5B,OAAOD,OAAO,CAACE,IAAI,CAAEC,MAAM,IAAKA,MAAM,CAACF,EAAE,KAAKA,EAAE,CAAC,IAAID,OAAO,CAAC,CAAC,CAAC;AACjE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASI,gBAAgBA,CAC9BC,KAAa,EACbC,IAAwC,EACxCC,WAA0B,EAClB;EACR,IAAIA,WAAW,KAAK,IAAI,IAAID,IAAI,KAAKE,SAAS,EAAE,OAAOH,KAAK;EAC5D,OAAOC,IAAI,CAACC,WAAW,CAAC,EAAEE,MAAM,IAAIJ,KAAK;AAC3C;;AAEA;AACA,OAAO,SAASK,qBAAqBA,CACnCC,IAAY,EACZL,IAAwC,EACxCC,WAA0B,EAClB;EACR,IAAIA,WAAW,KAAK,IAAI,IAAID,IAAI,KAAKE,SAAS,EAAE,OAAOG,IAAI;EAC3D,OAAOL,IAAI,CAACC,WAAW,CAAC,EAAEK,KAAK,IAAID,IAAI;AACzC;;AAEA;AACA,OAAO,SAASE,gBAAgBA,CAC9BC,KAAuD,EACvDC,SAAS,GAAG,IAAI,EACR;EACR,OAAOD,KAAK,CAACE,MAAM,CAAEC,IAAI,IAAqB,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,EAAE,CAAC,CAACC,IAAI,CAACH,SAAS,CAAC;AACxG","ignoreList":[]}

package/lib/module/earnings/types.js

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

package/lib/module/earnings/types.js.map

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

package/lib/module/empty-state/EmptyState.js

@@ -0,0 +1,177 @@
+"use strict";
+
+import React, { memo, useMemo } from 'react';
+import { View } from 'react-native';
+import { Button } from '../button';
+import { IconCircle } from "../icon-circle/index.js";
+import { useSurfaceFill } from "../styles/surface-levels.js";
+import { useTheme } from "../theme/use-theme.js";
+import { Text } from "../typography/index.js";
+import { EMPTY_STATE_ACTION_GAP, EMPTY_STATE_GEOMETRY } from "./constants.js";
+import { joinEmptyStateName, resolveEmptyStatePaint } from "./shared.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Nothing to show, said once.
+ *
+ *   mark      the glyph in the GRAPHICAL rung (`textGraphical`, the stop the
+ *             ladder sizes for a line rather than for text, so it clears 3:1 on
+ *             whatever is behind it), or `IconCircle`'s tinted disc, or an
+ *             arbitrary `illustration`
+ *   title     headline-semibold (panel: body-medium), `heading` level 3
+ *   line      body-regular secondary (panel: body-2-regular), capped at 360 so
+ *             a centred paragraph does not run the width of a 1440 page
+ *   children  stretched full width, laid out by whatever was passed
+ *   actions   up to two, primary then secondary, wrapping
+ *   footer    centred, under the actions
+ *
+ * The whole block is ONE named `group`: a screen reader reaching an empty list
+ * should be told the situation, not handed a heading, a paragraph and a button
+ * with nothing joining them.
+ *
+ * Bloom had no such family and a dozen components had each drawn their own —
+ * five of them the same glyph-over-headline-over-line, at five different
+ * paddings, with the two text slots spelled `emptyTitle`/`emptyDescription`,
+ * `emptyMessage`, `emptyQueueHint`, `emptyLabel`, `emptyText` and
+ * `noResultsLabel`. This is the one shape; migrating those call sites is a
+ * separate change, and this family is designed to cover them as they stand.
+ */
+function EmptyStateComponent({
+  icon: Icon,
+  media = 'glyph',
+  illustration,
+  title,
+  description,
+  action,
+  secondaryAction,
+  children,
+  footer,
+  variant = 'comfortable',
+  minHeight,
+  accessibilityLabel,
+  style,
+  testID
+}) {
+  const theme = useTheme();
+  const surface = useSurfaceFill();
+  const paint = useMemo(() => resolveEmptyStatePaint(theme, surface), [theme, surface]);
+  const g = EMPTY_STATE_GEOMETRY[variant];
+  const id = part => testID ? `${testID}-${part}` : undefined;
+
+  // `illustration` wins, and it is read for PRESENCE rather than truthiness so
+  // an explicit `illustration={null}` draws no mark at all even with an `icon`
+  // set by a default two levels up.
+  const mark = illustration !== undefined ? illustration : Icon ? media === 'circle' ?
+  /*#__PURE__*/
+  // `IconCircle` asks for an icon's FULL props (it sets `size`), which is
+  // narrower than `BloomIconComponent`'s three optional ones. Every Bloom
+  // glyph satisfies both; this is the boundary between the two spellings,
+  // and the only place in the family that needs to know there are two.
+  _jsx(IconCircle, {
+    icon: Icon,
+    size: g.circle
+  }) :
+  /*#__PURE__*/
+  // Hidden from assistive technology: the glyph repeats what the title
+  // says, and an unnamed image between a heading and its paragraph is a
+  // stop that announces nothing. The hiding goes on a WRAPPER — an icon
+  // component takes width, height and fill, and drops anything else.
+  _jsx(View, {
+    "aria-hidden": true,
+    importantForAccessibility: "no-hide-descendants",
+    children: /*#__PURE__*/_jsx(Icon, {
+      width: g.glyph,
+      height: g.glyph,
+      fill: paint.textGraphical
+    })
+  }) : null;
+  const renderAction = (a, kind) => /*#__PURE__*/_jsx(Button, {
+    variant: kind,
+    size: variant === 'compact' ? 'small' : 'medium',
+    onPress: a.onPress,
+    disabled: a.disabled,
+    loading: a.loading,
+    leadingIcon: a.icon,
+    accessibilityLabel: a.accessibilityLabel,
+    testID: a.testID ?? id(kind === 'primary' ? 'action' : 'secondary-action'),
+    children: a.label
+  });
+  return /*#__PURE__*/_jsxs(View, {
+    testID: testID,
+    role: "group",
+    accessibilityLabel: accessibilityLabel ?? joinEmptyStateName([title, description]),
+    style: [{
+      alignItems: 'center',
+      justifyContent: 'center',
+      gap: g.gap,
+      paddingTop: g.paddingVertical,
+      paddingBottom: g.paddingVertical,
+      ...(minHeight != null ? {
+        minHeight
+      } : null)
+    }, style],
+    children: [mark != null ? /*#__PURE__*/_jsx(View, {
+      testID: id('mark'),
+      style: {
+        alignItems: 'center'
+      },
+      children: mark
+    }) : null, title != null || description != null ? /*#__PURE__*/_jsxs(View, {
+      style: {
+        alignItems: 'center',
+        gap: g.textGap,
+        maxWidth: g.maxWidth
+      },
+      children: [title != null ? /*#__PURE__*/_jsx(Text, {
+        variant: g.title,
+        role: "heading",
+        "aria-level": 3,
+        testID: id('title'),
+        style: {
+          color: paint.text,
+          textAlign: 'center'
+        },
+        children: title
+      }) : null, description != null ? /*#__PURE__*/_jsx(Text, {
+        variant: g.description,
+        testID: id('description'),
+        style: {
+          color: paint.textSecondary,
+          textAlign: 'center'
+        },
+        children: description
+      }) : null]
+    }) : null, children != null ?
+    /*#__PURE__*/
+    // `alignSelf: 'stretch'` and `minWidth: 0`: what goes here is a strip, a
+    // fact box or a list, none of which is centred text — and a flex child
+    // without the floor takes its content's min-content width as the
+    // block's own, which is how a nowrap line inside one widens the page.
+    _jsx(View, {
+      testID: id('content'),
+      style: {
+        alignSelf: 'stretch',
+        minWidth: 0
+      },
+      children: children
+    }) : null, action || secondaryAction ? /*#__PURE__*/_jsxs(View, {
+      testID: id('actions'),
+      style: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        justifyContent: 'center',
+        alignItems: 'center',
+        gap: EMPTY_STATE_ACTION_GAP
+      },
+      children: [action ? renderAction(action, 'primary') : null, secondaryAction ? renderAction(secondaryAction, 'secondary') : null]
+    }) : null, footer != null ? /*#__PURE__*/_jsx(View, {
+      testID: id('footer'),
+      style: {
+        alignItems: 'center'
+      },
+      children: footer
+    }) : null]
+  });
+}
+export const EmptyState = /*#__PURE__*/memo(EmptyStateComponent);
+EmptyState.displayName = 'EmptyState';
+//# sourceMappingURL=EmptyState.js.map

package/lib/module/empty-state/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useMemo","View","Button","IconCircle","useSurfaceFill","useTheme","Text","EMPTY_STATE_ACTION_GAP","EMPTY_STATE_GEOMETRY","joinEmptyStateName","resolveEmptyStatePaint","jsx","_jsx","jsxs","_jsxs","EmptyStateComponent","icon","Icon","media","illustration","title","description","action","secondaryAction","children","footer","variant","minHeight","accessibilityLabel","style","testID","theme","surface","paint","g","id","part","undefined","mark","size","circle","importantForAccessibility","width","glyph","height","fill","textGraphical","renderAction","a","kind","onPress","disabled","loading","leadingIcon","label","role","alignItems","justifyContent","gap","paddingTop","paddingVertical","paddingBottom","textGap","maxWidth","color","text","textAlign","textSecondary","alignSelf","minWidth","flexDirection","flexWrap","EmptyState","displayName"],"sourceRoot":"../../../src","sources":["empty-state/EmptyState.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/empty-state/constants.js

@@ -0,0 +1,38 @@
+"use strict";
+
+/**
+ * The two rungs, written out rather than scaled from one another.
+ *
+ * `maxWidth` is the number worth defending: the five hand-rolled empties this
+ * family replaces used 280, 260, 360, 340 and none, and a line of explanation
+ * that runs the full width of a 1440 page is the reason they each picked one.
+ * 360 is roughly 60 characters at `body-regular`, which is where a centred
+ * paragraph stops needing a second fixation per line; the panel rung is
+ * narrower because the panel is.
+ */
+export const EMPTY_STATE_GEOMETRY = {
+  comfortable: {
+    glyph: 32,
+    circle: 'xl',
+    paddingVertical: 48,
+    gap: 16,
+    textGap: 6,
+    maxWidth: 360,
+    title: 'headline-semibold',
+    description: 'body-regular'
+  },
+  compact: {
+    glyph: 24,
+    circle: 'lg',
+    paddingVertical: 24,
+    gap: 12,
+    textGap: 4,
+    maxWidth: 280,
+    title: 'body-medium',
+    description: 'body-2-regular'
+  }
+};
+
+/** Between the two actions, in both directions — they wrap on a narrow block. */
+export const EMPTY_STATE_ACTION_GAP = 8;
+//# sourceMappingURL=constants.js.map

package/lib/module/empty-state/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EMPTY_STATE_GEOMETRY","comfortable","glyph","circle","paddingVertical","gap","textGap","maxWidth","title","description","compact","EMPTY_STATE_ACTION_GAP"],"sourceRoot":"../../../src","sources":["empty-state/constants.ts"],"mappings":";;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMA,oBAAmE,GAAG;EACjFC,WAAW,EAAE;IACXC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,IAAI;IACZC,eAAe,EAAE,EAAE;IACnBC,GAAG,EAAE,EAAE;IACPC,OAAO,EAAE,CAAC;IACVC,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,mBAAmB;IAC1BC,WAAW,EAAE;EACf,CAAC;EACDC,OAAO,EAAE;IACPR,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,IAAI;IACZC,eAAe,EAAE,EAAE;IACnBC,GAAG,EAAE,EAAE;IACPC,OAAO,EAAE,CAAC;IACVC,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,aAAa;IACpBC,WAAW,EAAE;EACf;AACF,CAAC;;AAED;AACA,OAAO,MAAME,sBAAsB,GAAG,CAAC","ignoreList":[]}

package/lib/module/empty-state/index.js

@@ -0,0 +1,6 @@
+"use strict";
+
+export { EmptyState } from "./EmptyState.js";
+export { EMPTY_STATE_ACTION_GAP, EMPTY_STATE_GEOMETRY } from "./constants.js";
+export { joinEmptyStateName, resolveEmptyStatePaint } from "./shared.js";
+//# sourceMappingURL=index.js.map

package/lib/module/empty-state/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EmptyState","EMPTY_STATE_ACTION_GAP","EMPTY_STATE_GEOMETRY","joinEmptyStateName","resolveEmptyStatePaint"],"sourceRoot":"../../../src","sources":["empty-state/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,sBAAsB,EAAEC,oBAAoB,QAAQ,gBAAa;AAE1E,SAASC,kBAAkB,EAAEC,sBAAsB,QAAQ,aAAU","ignoreList":[]}

package/lib/module/empty-state/shared.js

@@ -0,0 +1,21 @@
+"use strict";
+
+/**
+ * What an empty state paints, read RELATIVE to the surface it was dropped on
+ * (`styles/surface-levels.ts`) rather than from a ramp stop — the same block
+ * goes on a page, inside a card and inside a popover, and a glyph picked by eye
+ * disappears on one of the three.
+ *
+ * Pure, so `EmptyState.test.tsx` can walk presets and modes without rendering.
+ */
+import { surfaceTextOn } from "../styles/surface-levels.js";
+export function resolveEmptyStatePaint(theme, surface) {
+  return surfaceTextOn(theme, surface);
+}
+
+/** The announced name: the title, then the explanation, as one utterance. */
+export function joinEmptyStateName(parts) {
+  const joined = parts.filter(part => typeof part === 'string' && part !== '').join('. ');
+  return joined === '' ? undefined : joined;
+}
+//# sourceMappingURL=shared.js.map

package/lib/module/empty-state/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["surfaceTextOn","resolveEmptyStatePaint","theme","surface","joinEmptyStateName","parts","joined","filter","part","join","undefined"],"sourceRoot":"../../../src","sources":["empty-state/shared.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,aAAa,QAA+B,6BAA0B;AAK/E,OAAO,SAASC,sBAAsBA,CAACC,KAAY,EAAEC,OAAe,EAAmB;EACrF,OAAOH,aAAa,CAACE,KAAK,EAAEC,OAAO,CAAC;AACtC;;AAEA;AACA,OAAO,SAASC,kBAAkBA,CAChCC,KAA+C,EAC3B;EACpB,MAAMC,MAAM,GAAGD,KAAK,CACjBE,MAAM,CAAEC,IAAI,IAAqB,OAAOA,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,EAAE,CAAC,CACzEC,IAAI,CAAC,IAAI,CAAC;EACb,OAAOH,MAAM,KAAK,EAAE,GAAGI,SAAS,GAAGJ,MAAM;AAC3C","ignoreList":[]}

package/lib/module/empty-state/types.js

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

package/lib/module/empty-state/types.js.map

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

package/lib/module/fab/Fab.js

@@ -1,287 +1,13 @@
 "use strict";
 
-import React, { memo, useEffect, useMemo, useRef } from 'react';
-import { Animated, Pressable, Text, View } from 'react-native';
-import { styled } from 'react-native-css';
-import { useBottomEdgeInset } from "../layout/bottom-edge.js";
-import { EXPANDED_HEIGHT, MINIMIZED_HEIGHT } from "../tab-bar/shared.js";
-import { useTheme } from "../theme/use-theme.js";
-import { animation, borderRadius } from "../styles/tokens.js";
-import { bloomShadowStyle } from '../design-tokens/shadows';
-import { pressedSurface } from "../theme/press-colors.js";
-import { usePressAnimation } from "../hooks/use-press-animation.js";
-import { useInteractionState } from "../hooks/use-interaction-state.js";
-import { applyIconColor } from "../frosted-icon-button/shared.js";
-import { useFabMinimized } from "./use-fab-minimized.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// Material-style FAB scale. `small` (40px) keeps a full 24px icon box so the
-// glyph reads clearly; `medium` (56px) is the canonical FAB; `large` (64px) is
-// the high-prominence action.
-const SIZE_CONFIG = {
-  small: {
-    diameter: 40,
-    iconBox: 24,
-    fontSize: 14
-  },
-  medium: {
-    diameter: 56,
-    iconBox: 24,
-    fontSize: 15
-  },
-  large: {
-    diameter: 64,
-    iconBox: 28,
-    fontSize: 16
-  }
-};
-const MIN_NUMERIC_ICON_BOX = 22;
-
-/**
- * Resolve a `size` prop (preset name or raw pixel diameter) to concrete pixel
- * geometry. A numeric size sets the diameter directly, derives the icon box as
- * `round(size * 0.5)` (clamped to a sensible minimum) and lets the circle radius
- * stay `size / 2` (the container uses a full pill radius, so any square stays a
- * perfect circle).
- */
-function resolveSize(size) {
-  if (typeof size === 'number') {
-    return {
-      diameter: size,
-      iconBox: Math.max(MIN_NUMERIC_ICON_BOX, Math.round(size * 0.5)),
-      fontSize: Math.max(13, Math.round(size * 0.27))
-    };
-  }
-  return SIZE_CONFIG[size];
-}
-const DEFAULT_OFFSET = 16;
-const DEFAULT_Z_INDEX = 50;
-const HIT_SLOP = {
-  top: 8,
-  bottom: 8,
-  left: 8,
-  right: 8
-};
-
-/**
- * Compute the `position: absolute` anchoring for a placement. The FAB pins to
- * the nearest positioned ancestor (the consumer's column container), NOT the
- * screen — so it never escapes a constrained layout. `static` returns no
- * positioning (consumer-controlled).
- *
- * `bottomEdgeInset` applies to the BOTTOM axis only, and only for a bottom
- * placement. It is not a gap preference — `offset` is that — but the height of
- * whatever floating surface has already claimed the bottom edge, so the FAB
- * lands above a floating tab bar instead of behind it. A z-index cannot fix that
- * pairing: the bar's host is the last sibling of the app shell and paints over
- * every descendant, so the FAB has to be somewhere else, not merely on top.
- */
-function placementStyle(placement, offset, bottomEdgeInset) {
-  if (placement === 'static') return {};
-  const style = {
-    position: 'absolute'
-  };
-  if (placement === 'bottom-right' || placement === 'bottom-left') {
-    style.bottom = offset + bottomEdgeInset;
-  } else {
-    style.top = offset;
-  }
-  if (placement === 'bottom-right' || placement === 'top-right') {
-    style.right = offset;
-  } else {
-    style.left = offset;
-  }
-  return style;
-}
-
-// ---------------------------------------------------------------------------
-//  The FAB renders ONE node — the same shape `Fab.web.tsx` renders (one
-//  `<button>` carrying `className`, `style` and every visual).
-//
-//  It used to be two, and the split was worse than the one `Button` had: the
-//  outer `Animated.View` held the placement, the `zIndex`, the press transform
-//  AND the caller's `style`, while the inner `Pressable` held `className` and
-//  the FAB's own chrome. So a caller's `style` and their `className` landed on
-//  DIFFERENT nodes, and every layout class applied inside a box that had already
-//  been positioned and sized by the wrapper. Nothing errored; the same call site
-//  behaved on web and did nothing on native.
-//
-//  See `button/Button.tsx` for the full reasoning, including why splitting
-//  classes by kind is not implementable and why both wrappers are built once at
-//  module scope.
-// ---------------------------------------------------------------------------
-
-/**
- * Exactly the prop surface `Fab` hands to the pressable, and no wider — mapping
- * `WithAnimatedValue` (or `styled()`'s dot-path union) over the whole of
- * `PressableProps` overflows the checker with `TS2590`.
- */
-
-const FabPressable = Pressable;
-const StyledPressable = styled(FabPressable, {
-  className: 'style'
-});
-const AnimatedPressable = Animated.createAnimatedComponent(StyledPressable);
-const FabComponent = ({
-  onPress,
-  icon,
-  children,
-  label,
-  minimizeBehavior = 'none',
-  variant = 'tertiary',
-  size = 'medium',
-  placement = 'bottom-right',
-  offset = DEFAULT_OFFSET,
-  disabled = false,
-  accessibilityLabel,
-  accessibilityHint,
-  style,
-  labelStyle,
-  className,
-  testID,
-  zIndex = DEFAULT_Z_INDEX
-}) => {
-  const minimized = useFabMinimized(true);
-  const bottomEdgeInset = useBottomEdgeInset();
-  const theme = useTheme();
-  const sizeConfig = useMemo(() => resolveSize(size), [size]);
-  const isExtended = label != null && label.length > 0;
-  const showLabel = isExtended && !(minimized && minimizeBehavior === 'collapse');
-  const {
-    scaleAnim,
-    onPressIn,
-    onPressOut
-  } = usePressAnimation(disabled ? undefined : animation.pressScale);
-  const {
-    state: pressed,
-    onIn: onPressedIn,
-    onOut: onPressedOut
-  } = useInteractionState();
-  const resolvedColors = useMemo(() => resolveVariant(variant, theme.colors), [variant, theme.colors]);
-  const content = applyIconColor(icon ?? children, resolvedColors.foreground);
-  const followsBottomEdge = placement === 'bottom-right' || placement === 'bottom-left';
-  const bottomFollow = useRef(new Animated.Value(0)).current;
-  useEffect(() => {
-    Animated.timing(bottomFollow, {
-      toValue: followsBottomEdge && minimized ? EXPANDED_HEIGHT - MINIMIZED_HEIGHT : 0,
-      duration: 200,
-      useNativeDriver: true
-    }).start();
-  }, [bottomFollow, followsBottomEdge, minimized]);
-
-  // A FAB is always filled, so the held state is a state layer of its own label
-  // colour over its own fill — never a wash, and never an alpha'd fill: it
-  // floats over arbitrary content, so "let the page show through" would change
-  // meaning with whatever it happens to be sitting on. It REPLACES the opacity
-  // dip this used to carry, which was a second press vocabulary for one family.
-  const pressedBackground = useMemo(() => pressedSurface(theme.colors, resolvedColors.background, resolvedColors.foreground), [theme.colors, resolvedColors.background, resolvedColors.foreground]);
-  const containerStyle = useMemo(() => {
-    const base = {
-      alignItems: 'center',
-      justifyContent: 'center',
-      flexDirection: 'row',
-      backgroundColor: resolvedColors.background,
-      borderRadius: borderRadius.full,
-      height: sizeConfig.diameter,
-      // `shadow-m` — the elevated/overlay role. Hand-rolling it here meant one
-      // more set of numbers to keep in step, and only the native half of the
-      // split: on web these props are the deprecated path.
-      ...bloomShadowStyle('m')
-    };
-    if (showLabel) {
-      base.paddingHorizontal = sizeConfig.diameter <= 44 ? 14 : 20;
-      base.gap = 8;
-    } else {
-      base.width = sizeConfig.diameter;
-    }
-    return base;
-  }, [resolvedColors.background, sizeConfig.diameter, theme.colors.shadow, showLabel]);
-  const labelTextStyle = useMemo(() => ({
-    fontSize: sizeConfig.fontSize,
-    fontWeight: '600',
-    color: resolvedColors.foreground
-  }), [sizeConfig.fontSize, resolvedColors.foreground]);
-  const handlePressIn = disabled ? undefined : () => {
-    onPressIn();
-    onPressedIn();
-  };
-  const handlePressOut = disabled ? undefined : () => {
-    onPressOut();
-    onPressedOut();
-  };
-  if (minimized && minimizeBehavior === 'hide') return null;
-  return /*#__PURE__*/_jsxs(AnimatedPressable, {
-    className: className,
-    style: [placementStyle(placement, offset, bottomEdgeInset), {
-      zIndex
-    }, containerStyle, disabled && {
-      opacity: 0.5
-    }, pressed && !disabled && {
-      backgroundColor: pressedBackground
-    },
-    // Before the caller's `style`, so `style` keeps winning the whole array
-    // the way it always has (and the way the web fork spreads it last). The
-    // cost is that a caller who sets `transform` replaces the press scale
-    // instead of composing with it — when the transform sat on a separate
-    // wrapper node the two multiplied.
-    {
-      transform: [{
-        translateY: bottomFollow
-      }, {
-        scale: scaleAnim
-      }]
-    }, style],
-    onPress: disabled ? undefined : onPress,
-    onPressIn: handlePressIn,
-    onPressOut: handlePressOut,
-    disabled: disabled,
-    hitSlop: HIT_SLOP,
-    accessibilityRole: "button",
-    accessibilityLabel: accessibilityLabel ?? label,
-    accessibilityHint: accessibilityHint,
-    accessibilityState: {
-      disabled
-    },
-    testID: testID,
-    children: [content != null && /*#__PURE__*/_jsx(View, {
-      style: {
-        width: sizeConfig.iconBox,
-        height: sizeConfig.iconBox,
-        alignItems: 'center',
-        justifyContent: 'center'
-      },
-      children: content
-    }), showLabel && /*#__PURE__*/_jsx(Text, {
-      style: [labelTextStyle, labelStyle],
-      numberOfLines: 1,
-      children: label
-    })]
+import { memo } from 'react';
+import { Button } from '../button';
+import { useFabProps } from "./use-fab-props.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const Fab = /*#__PURE__*/memo(function Fab(props) {
+  return /*#__PURE__*/_jsx(Button, {
+    ...useFabProps(props)
   });
-};
-function resolveVariant(variant, colors) {
-  switch (variant) {
-    case 'secondary':
-      return {
-        background: colors.secondary,
-        foreground: colors.secondaryForeground
-      };
-    case 'tertiary':
-      return {
-        background: colors.tertiary,
-        foreground: colors.tertiaryForeground
-      };
-    case 'surface':
-      return {
-        background: colors.card,
-        foreground: colors.text
-      };
-    case 'primary':
-    default:
-      return {
-        background: colors.primary,
-        foreground: colors.primaryForeground
-      };
-  }
-}
-export const Fab = /*#__PURE__*/memo(FabComponent);
+});
 Fab.displayName = 'Fab';
 //# sourceMappingURL=Fab.js.map