@oxy.so/bloom 2.10.0 → 2.12.0

package/lib/module/call-ui/parts.js

@@ -0,0 +1,224 @@
+"use strict";
+
+import React, { useMemo } from 'react';
+import { Pressable, StyleSheet, View } from 'react-native';
+import Svg, { Defs, LinearGradient, Rect, Stop } from 'react-native-svg';
+import { RiDragMove2Line } from "../icons/remix/RiDragMove2Line.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * The shared stage pieces: the wash behind a voice call, and the two scrims
+ * that keep chrome legible over a video frame.
+ *
+ * Both are `react-native-svg` gradients, and both carry their alpha in
+ * `stopOpacity` rather than in `stopColor`. react-native-svg DISCARDS the alpha
+ * inside `stopColor` while CSS keeps it, so an `rgba()` stop renders correctly
+ * on web and fully opaque on native — a scrim that hides the video it is meant
+ * to sit over, on the one platform the video matters most.
+ */
+
+let gradientId = 0;
+
+/**
+ * The wash behind a voice call: the accent-mixed colour at the top fading into
+ * the stage at the bottom, so the avatar sits in light and the controls sit in
+ * the dark.
+ */
+export function CallStageBackdrop({
+  paint
+}) {
+  const id = useMemo(() => `bloom-call-stage-${gradientId++}`, []);
+  return /*#__PURE__*/_jsxs(Svg, {
+    width: "100%",
+    height: "100%",
+    style: StyleSheet.absoluteFill,
+    pointerEvents: "none",
+    testID: "call-stage-backdrop",
+    children: [/*#__PURE__*/_jsx(Defs, {
+      children: /*#__PURE__*/_jsxs(LinearGradient, {
+        id: id,
+        x1: "0",
+        y1: "0",
+        x2: "0",
+        y2: "1",
+        children: [/*#__PURE__*/_jsx(Stop, {
+          offset: "0",
+          stopColor: paint.stageWash,
+          stopOpacity: 1
+        }), /*#__PURE__*/_jsx(Stop, {
+          offset: "0.55",
+          stopColor: paint.stage,
+          stopOpacity: 1
+        }), /*#__PURE__*/_jsx(Stop, {
+          offset: "1",
+          stopColor: paint.stage,
+          stopOpacity: 1
+        })]
+      })
+    }), /*#__PURE__*/_jsx(Rect, {
+      x: "0",
+      y: "0",
+      width: "100%",
+      height: "100%",
+      fill: `url(#${id})`
+    })]
+  });
+}
+
+/**
+ * A scrim pinned to one edge, transparent at the far end.
+ *
+ * `edge="top"` darkens under the top bar, `edge="bottom"` under the controls.
+ * It is TRANSLUCENT on purpose: an opaque band would be a letterbox, and the
+ * video is the content.
+ */
+export function CallScrim({
+  paint,
+  edge,
+  height,
+  opacity = 0.72
+}) {
+  const id = useMemo(() => `bloom-call-scrim-${gradientId++}`, []);
+  const from = edge === 'top' ? opacity : 0;
+  const to = edge === 'top' ? 0 : opacity;
+  return /*#__PURE__*/_jsx(View, {
+    pointerEvents: "none",
+    style: {
+      position: 'absolute',
+      left: 0,
+      right: 0,
+      height,
+      ...(edge === 'top' ? {
+        top: 0
+      } : {
+        bottom: 0
+      })
+    },
+    children: /*#__PURE__*/_jsxs(Svg, {
+      width: "100%",
+      height: "100%",
+      children: [/*#__PURE__*/_jsx(Defs, {
+        children: /*#__PURE__*/_jsxs(LinearGradient, {
+          id: id,
+          x1: "0",
+          y1: "0",
+          x2: "0",
+          y2: "1",
+          children: [/*#__PURE__*/_jsx(Stop, {
+            offset: "0",
+            stopColor: paint.stage,
+            stopOpacity: from
+          }), /*#__PURE__*/_jsx(Stop, {
+            offset: "1",
+            stopColor: paint.stage,
+            stopOpacity: to
+          })]
+        })
+      }), /*#__PURE__*/_jsx(Rect, {
+        x: "0",
+        y: "0",
+        width: "100%",
+        height: "100%",
+        fill: `url(#${id})`
+      })]
+    })
+  });
+}
+
+/**
+ * The local camera, pinned to one corner of the stage.
+ *
+ * With `onMove` the whole frame becomes ONE button that cycles the corners —
+ * a drag has no keyboard and no screen-reader equivalent, and a 24px grab
+ * handle inside a 96px frame is a smaller target than the frame itself. The
+ * move glyph stays as a decorative hint (`aria-hidden` by having no role and
+ * no text) so the affordance is visible without being a second control.
+ */
+export function PictureInPicture({
+  corner,
+  width,
+  borderColor,
+  backgroundColor,
+  hintColor,
+  hintBackground,
+  moveLabel,
+  onMove,
+  children,
+  testID
+}) {
+  const frame = {
+    position: 'absolute',
+    width,
+    height: Math.round(width * PIP_ASPECT),
+    borderRadius: PIP_RADIUS,
+    borderWidth: 1,
+    borderColor,
+    backgroundColor,
+    overflow: 'hidden',
+    ...cornerInsets(corner)
+  };
+  const body = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [children, onMove === undefined ? null :
+    /*#__PURE__*/
+    // The hint needs its own backing: the frame behind it is the user's own
+    // camera, which is as likely to be a bright window as a dark room, and a
+    // bare glyph disappears into one of them.
+    _jsx(View, {
+      style: {
+        position: 'absolute',
+        right: 6,
+        bottom: 6,
+        width: 24,
+        height: 24,
+        borderRadius: 12,
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: hintBackground
+      },
+      pointerEvents: "none",
+      children: /*#__PURE__*/_jsx(RiDragMove2Line, {
+        width: 14,
+        height: 14,
+        fill: hintColor
+      })
+    })]
+  });
+  if (onMove === undefined) {
+    return /*#__PURE__*/_jsx(View, {
+      style: frame,
+      testID: testID,
+      children: body
+    });
+  }
+  return /*#__PURE__*/_jsx(Pressable, {
+    role: "button",
+    accessibilityLabel: moveLabel,
+    onPress: onMove,
+    style: frame,
+    testID: testID,
+    children: body
+  });
+}
+
+/** PiP geometry: 96 × 140 at the default width, rounded like a tile. */
+const PIP_ASPECT = 1.46;
+const PIP_RADIUS = 14;
+const PIP_INSET = 12;
+/** Clears the top bar, so the PiP never lands on the minimise button. */
+const PIP_TOP_INSET = 96;
+function cornerInsets(corner) {
+  const vertical = corner === 'top-left' || corner === 'top-right' ? {
+    top: PIP_TOP_INSET
+  } : {
+    bottom: PIP_INSET
+  };
+  const horizontal = corner === 'top-left' || corner === 'bottom-left' ? {
+    left: PIP_INSET
+  } : {
+    right: PIP_INSET
+  };
+  return {
+    ...vertical,
+    ...horizontal
+  };
+}
+//# sourceMappingURL=parts.js.map

package/lib/module/call-ui/parts.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","Pressable","StyleSheet","View","Svg","Defs","LinearGradient","Rect","Stop","RiDragMove2Line","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","gradientId","CallStageBackdrop","paint","id","width","height","style","absoluteFill","pointerEvents","testID","children","x1","y1","x2","y2","offset","stopColor","stageWash","stopOpacity","stage","x","y","fill","CallScrim","edge","opacity","from","to","position","left","right","top","bottom","PictureInPicture","corner","borderColor","backgroundColor","hintColor","hintBackground","moveLabel","onMove","frame","Math","round","PIP_ASPECT","borderRadius","PIP_RADIUS","borderWidth","overflow","cornerInsets","body","undefined","alignItems","justifyContent","role","accessibilityLabel","onPress","PIP_INSET","PIP_TOP_INSET","vertical","horizontal"],"sourceRoot":"../../../src","sources":["call-ui/parts.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/call-ui/shared.js

@@ -0,0 +1,309 @@
+"use strict";
+
+import { ACCENT_TABLE, colorRamp, DANGER_TABLE, mixColor, resolveButtonRamps } from "../button/shared.js";
+
+// ---------------------------------------------------------------------------
+//  The stage palette
+// ---------------------------------------------------------------------------
+
+/**
+ * A call STAGE is dark in both modes, and that is a decision rather than an
+ * oversight.
+ *
+ * The stage backs a video frame Bloom does not own. White chrome over an
+ * unknown frame is the only thing that survives a bright kitchen and a dark
+ * bedroom in the same call, and a light-mode stage would have to repaint every
+ * glyph the moment the camera turns on. So the MODE picks the depth
+ * (`neutral-900` light, `neutral-950` dark) and nothing else: the preset's hue
+ * still tints both, and the accent still comes from the theme.
+ *
+ * The surfaces that are IN the app rather than over the video — the incoming
+ * banner, the call-log row, the group-call strip — take the ordinary theme
+ * surface and flip with the mode like everything else in Bloom.
+ */
+
+export function resolveCallPaint(theme, accentColor) {
+  const {
+    accent,
+    neutral: n
+  } = resolveButtonRamps(theme);
+  const c = theme.colors;
+  const dark = theme.isDark;
+  const red = colorRamp(c.negative, DANGER_TABLE);
+  const green = colorRamp(c.success, ACCENT_TABLE);
+  const hue = accentColor ?? accent[500];
+  const stage = dark ? n[950] : n[900];
+  return {
+    stage,
+    // 0.42 is the most wash the stage takes before the status line stops
+    // clearing AA against it on the brightest preset.
+    stageWash: mixColor(stage, hue, 0.42),
+    onStage: n[50],
+    onStageMuted: mixColor(stage, n[50], 0.72),
+    control: mixColor(stage, n[50], 0.16),
+    controlHover: mixColor(stage, n[50], 0.26),
+    controlActive: n[50],
+    onControlActive: n[900],
+    // READ THE PAIR. `negative`/`negativeForeground` is the text pair — in dark
+    // mode it is a pale rose meant for type on a dark page, and a filled circle
+    // painted from it reads as a warning sticker rather than as "stop". The
+    // ERROR pair is the filled one and it is strong in both modes, which is what
+    // a stage that is dark in both modes needs.
+    end: c.error,
+    endHover: mixColor(c.error, c.errorForeground, 0.16),
+    onEnd: c.errorForeground,
+    accept: c.success,
+    acceptHover: mixColor(c.success, c.successForeground, 0.16),
+    onAccept: c.successForeground,
+    speaking: dark ? green[400] : green[500],
+    negativeOnStage: colorRamp(c.error, DANGER_TABLE)[400],
+    pipBorder: mixColor(stage, n[50], 0.24),
+    tile: mixColor(stage, n[50], 0.09),
+    tilePill: mixColor(stage, n[950], 0.45),
+    surface: c.background,
+    surfaceRaised: c.card,
+    border: dark ? n[700] : n[200],
+    text: c.text,
+    textSecondary: c.textSecondary,
+    negative: dark ? red[400] : red[500],
+    accent: accent[500],
+    onAccent: c.primaryForeground,
+    rowSelected: dark ? mixColor(c.background, n[700], 0.6) : n[100]
+  };
+}
+
+// ---------------------------------------------------------------------------
+//  Status line
+// ---------------------------------------------------------------------------
+
+export const CALL_STATUS_LABELS = {
+  calling: 'Calling…',
+  ringing: 'Ringing',
+  connecting: 'Connecting…',
+  active: 'Connected',
+  reconnecting: 'Reconnecting…',
+  onHold: 'On hold',
+  ended: 'Call ended'
+};
+
+/**
+ * The ONE line under the name, resolved by precedence rather than by five
+ * call sites each picking their own.
+ *
+ *   1. `statusText`     the app said exactly what to show
+ *   2. `ended`          never a timer: a call that is over has no elapsed time,
+ *                       and the last tick frozen on screen reads as live
+ *   3. `reconnecting`   the timer keeps counting underneath, but saying so
+ *                       while the media is down is a lie the user can see
+ *   4. `active`         `duration`, or the `active` label until the first tick
+ *   5. anything else    that status's own label
+ *
+ * Written as a function, not as JSX branches, because it is the part that has
+ * a wrong answer — and `duration` surviving into `ended` was the wrong answer
+ * this shape exists to make impossible.
+ */
+export function resolveCallStatusLine(input) {
+  const {
+    status,
+    duration,
+    statusText,
+    labels
+  } = input;
+  if (statusText !== undefined && statusText !== '') return statusText;
+  const l = {
+    ...CALL_STATUS_LABELS,
+    ...labels
+  };
+  if (status === 'ended') return l.ended;
+  if (status === 'reconnecting') return l.reconnecting;
+  if (status === 'active') return duration !== undefined && duration !== '' ? duration : l.active;
+  return l[status];
+}
+
+/** Whether the stage should keep drawing the control bar. */
+export function callIsLive(status) {
+  return status !== 'ended';
+}
+
+// ---------------------------------------------------------------------------
+//  Controls
+// ---------------------------------------------------------------------------
+
+export const CALL_CONTROL_LABELS = {
+  mute: 'Mute',
+  unmute: 'Unmute',
+  speakerOn: 'Turn speaker on',
+  speakerOff: 'Turn speaker off',
+  videoOn: 'Turn camera on',
+  videoOff: 'Turn camera off',
+  flipCamera: 'Flip camera',
+  screenShareOn: 'Share screen',
+  screenShareOff: 'Stop sharing screen',
+  addParticipant: 'Add participant',
+  endCall: 'End call'
+};
+
+/** The order a bar draws its toggles in, whichever subset is present. */
+export const CALL_CONTROL_ORDER = ['mute', 'video', 'speaker', 'screenShare', 'flipCamera', 'addParticipant'];
+
+/** Button diameter and glyph size per rung. */
+export const CALL_CONTROL_GEOMETRY = {
+  small: {
+    size: 40,
+    glyph: 20,
+    gap: 8
+  },
+  medium: {
+    size: 48,
+    glyph: 22,
+    gap: 12
+  },
+  large: {
+    size: 56,
+    glyph: 26,
+    gap: 16
+  }
+};
+export const CALL_SCREEN_LABELS = {
+  ...CALL_STATUS_LABELS,
+  minimise: 'Minimise call',
+  chat: 'Open chat',
+  participants: 'Participants',
+  movePip: corner => `Move self view (now ${CALL_PIP_CORNER_NAMES[corner]})`
+};
+export const CALL_PIP_CORNER_NAMES = {
+  'top-left': 'top left',
+  'top-right': 'top right',
+  'bottom-left': 'bottom left',
+  'bottom-right': 'bottom right'
+};
+
+/**
+ * The corner the PiP moves to next — clockwise from wherever it is.
+ *
+ * One button that CYCLES rather than a drag gesture, because a drag has no
+ * keyboard and no screen-reader equivalent; the app is still free to drag it
+ * itself and report the corner it landed in.
+ */
+export const CALL_PIP_CYCLE = {
+  'top-right': 'bottom-right',
+  'bottom-right': 'bottom-left',
+  'bottom-left': 'top-left',
+  'top-left': 'top-right'
+};
+
+// ---------------------------------------------------------------------------
+//  Group call layout
+// ---------------------------------------------------------------------------
+
+/**
+ * Columns for `count` tiles: `ceil(sqrt(count))`, which is the layout people
+ * already expect — 2 side by side, 4 as a square, 6 as 3×2, 9 as 3×3, 12 as
+ * 4×3.
+ *
+ * A count of 0 still answers 1: a grid with no columns divides by zero, and a
+ * participant list is empty for one frame every time a call starts.
+ */
+export function callGridColumns(count) {
+  const n = Math.max(0, Math.floor(count));
+  if (n <= 1) return 1;
+  return Math.ceil(Math.sqrt(n));
+}
+/**
+ * How many tiles fit, and how they sit.
+ *
+ * The overflow tile TAKES A CELL rather than being added beside them: with
+ * `maxTiles` 9 and 12 people the grid draws 8 faces and a `+4`, not 9 faces and
+ * a tenth cell that breaks the 3×3. Getting this backwards is how a "9-up"
+ * grid silently becomes a 10-cell 4×3.
+ */
+export function callGridLayout(count, maxTiles = 9, columnsOverride) {
+  const total = Math.max(0, Math.floor(count));
+  const cap = maxTiles > 0 ? Math.floor(maxTiles) : total;
+  const overflowing = total > cap;
+  const visible = overflowing ? Math.max(0, cap - 1) : total;
+  const overflow = overflowing ? total - visible : 0;
+  const cells = visible + (overflow > 0 ? 1 : 0);
+  const columns = Math.max(1, columnsOverride ?? callGridColumns(cells));
+  return {
+    visible,
+    overflow,
+    columns,
+    rows: Math.max(1, Math.ceil(cells / columns)),
+    cells
+  };
+}
+
+/**
+ * Which participant the spotlight shows: the one asked for, else whoever is
+ * presenting, else whoever is speaking, else the first.
+ */
+export function callSpotlightIndex(participants, spotlightId) {
+  if (participants.length === 0) return -1;
+  const byId = spotlightId ? participants.findIndex(p => p.id === spotlightId) : -1;
+  if (byId >= 0) return byId;
+  const presenting = participants.findIndex(p => p.presenting === true);
+  if (presenting >= 0) return presenting;
+  const speaking = participants.findIndex(p => p.speaking === true);
+  if (speaking >= 0) return speaking;
+  return 0;
+}
+
+/** The speaking ring's pulse. One period, so the tile and the group bar agree. */
+export const CALL_SPEAKING_PULSE_MS = 900;
+
+// ---------------------------------------------------------------------------
+//  Call history
+// ---------------------------------------------------------------------------
+
+export const CALL_HISTORY_LABELS = {
+  incoming: 'Incoming',
+  outgoing: 'Outgoing',
+  missed: 'Missed',
+  declined: 'Declined',
+  callBack: name => `Call ${name} back`
+};
+
+/** A missed or declined call is the only one drawn in the negative colour. */
+export function isNegativeDirection(direction) {
+  return direction === 'missed' || direction === 'declined';
+}
+export const CALL_UI_RADIUS = {
+  /** Cards, tiles and the incoming banner. */
+  card: 16,
+  /** The PiP and a group tile. */
+  tile: 14,
+  /** The stage itself, when it is framed rather than full-bleed. */
+  stage: 20
+};
+
+// ---------------------------------------------------------------------------
+//  Incoming
+// ---------------------------------------------------------------------------
+
+export const INCOMING_CALL_LABELS = {
+  accept: 'Accept',
+  decline: 'Decline',
+  message: 'Message',
+  remind: 'Remind me',
+  slideToAnswer: 'Slide to answer',
+  voice: 'Incoming voice call',
+  video: 'Incoming video call'
+};
+
+/**
+ * How far along the track the knob has to be RELEASED for the call to answer.
+ *
+ * 0.6 rather than "all the way": a slider that only fires at 100% needs a
+ * pixel-accurate finish on a phone someone is fumbling for, and one that fires
+ * at 30% answers calls the user was only inspecting. Exported so the gate reads
+ * the same number the component does.
+ */
+export const SLIDE_ANSWER_THRESHOLD = 0.6;
+
+/** Whether a release at `dx` over a `max`-px track answers the call. */
+export function slideAnswers(dx, max) {
+  if (!(max > 0)) return false;
+  return dx >= max * SLIDE_ANSWER_THRESHOLD;
+}
+//# sourceMappingURL=shared.js.map

package/lib/module/call-ui/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ACCENT_TABLE","colorRamp","DANGER_TABLE","mixColor","resolveButtonRamps","resolveCallPaint","theme","accentColor","accent","neutral","n","c","colors","dark","isDark","red","negative","green","success","hue","stage","stageWash","onStage","onStageMuted","control","controlHover","controlActive","onControlActive","end","error","endHover","errorForeground","onEnd","accept","acceptHover","successForeground","onAccept","speaking","negativeOnStage","pipBorder","tile","tilePill","surface","background","surfaceRaised","card","border","text","textSecondary","onAccent","primaryForeground","rowSelected","CALL_STATUS_LABELS","calling","ringing","connecting","active","reconnecting","onHold","ended","resolveCallStatusLine","input","status","duration","statusText","labels","undefined","l","callIsLive","CALL_CONTROL_LABELS","mute","unmute","speakerOn","speakerOff","videoOn","videoOff","flipCamera","screenShareOn","screenShareOff","addParticipant","endCall","CALL_CONTROL_ORDER","CALL_CONTROL_GEOMETRY","small","size","glyph","gap","medium","large","CALL_SCREEN_LABELS","minimise","chat","participants","movePip","corner","CALL_PIP_CORNER_NAMES","CALL_PIP_CYCLE","callGridColumns","count","Math","max","floor","ceil","sqrt","callGridLayout","maxTiles","columnsOverride","total","cap","overflowing","visible","overflow","cells","columns","rows","callSpotlightIndex","spotlightId","length","byId","findIndex","p","id","presenting","CALL_SPEAKING_PULSE_MS","CALL_HISTORY_LABELS","incoming","outgoing","missed","declined","callBack","name","isNegativeDirection","direction","CALL_UI_RADIUS","INCOMING_CALL_LABELS","decline","message","remind","slideToAnswer","voice","video","SLIDE_ANSWER_THRESHOLD","slideAnswers","dx"],"sourceRoot":"../../../src","sources":["call-ui/shared.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/call-ui/types.js

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

package/lib/module/call-ui/types.js.map

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

package/lib/module/carousel/Carousel.js

@@ -9,6 +9,7 @@ import { RiArrowLeftSLine, RiArrowRightSLine } from "../icons/remix/index.js";
 import { useInteractionState } from "../hooks/use-interaction-state.js";
 import { useInteractiveWebCss } from "../styles/interactive-web-css.js";
 import { borderRadius } from "../styles/tokens.js";
+import { webDataSet } from "../styles/web-data.js";
 import { useTheme } from "../theme/use-theme.js";
 import { CarouselContext, CarouselItemIndexContext } from "./context.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -109,11 +110,6 @@ ${DOT} {
 }
 }
 `;
-function webData(data) {
-  return IS_WEB ? {
-    dataSet: data
-  } : {};
-}
 
 // ---------------------------------------------------------------------------
 //  Slide
@@ -138,7 +134,7 @@ const CarouselItemComponent = function CarouselItem({
   }, [reportOffset, index]);
   const slideWidth = width ?? (ctx && ctx.trackWidth > 0 ? ctx.trackWidth : undefined);
   return /*#__PURE__*/_jsx(View, {
-    ...webData({
+    ...webDataSet({
       bloomCarouselItem: ''
     }),
     role: "group",
@@ -193,7 +189,7 @@ function CarouselDot({
   }, [active, reducedMotion, width]);
   const background = active ? paint.dotActive : hovered ? paint.dotHover : paint.dot;
   return /*#__PURE__*/_jsx(Pressable, {
-    ...webData({
+    ...webDataSet({
       bloomCarouselDot: ''
     }),
     accessibilityRole: "button",
@@ -400,7 +396,7 @@ const CarouselComponent = function Carousel({
       value: contextValue,
       children: /*#__PURE__*/_jsx(ScrollView, {
         ref: scrollRef,
-        ...webData({
+        ...webDataSet({
           bloomCarouselTrack: align
         }),
         ...(IS_WEB ? {