@oxy.so/bloom 2.9.0 → 2.11.0

package/lib/commonjs/media-controls/PauseGlyph.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PauseGlyph = void 0;
+var _TEMPLATE = require("../icons/TEMPLATE.js");
+/**
+ * Bloom's pause glyph — the play triangle's WEIGHT, in two bars.
+ *
+ * Measured in the shared 24 viewBox (`scripts/…` is not needed; the numbers are
+ * the paths' own):
+ *
+ *   play triangle    (8, 4) · (8, 20) · (20, 12), corners rounded   95.5 units²
+ *   two bars 2 × 14  the stock media pause                          56.0 units²  0.59 ×
+ *   two bars 3 × 16  this                                           96.0 units²  1.005 ×
+ *
+ * At 0.59 the pause read a full step lighter than the play it replaces, at every
+ * size, so a transport button changed WEIGHT as it toggled — the one thing a
+ * play/pause pair must not do, since the two are the same control. Ink area is
+ * the match that matters here: same vertical extent (y 4 → 20, the triangle's
+ * own), bars widened from 2 to 3, and the gap left at 6 so the pair still reads
+ * as two bars rather than a block.
+ *
+ * Bloom-LOCAL rather than an edit to `icons/remix/RiPauseFill`: that file is
+ * generated, and the stock weight is right for a 16px list glyph. This is the
+ * one for a filled transport button.
+ */
+const PauseGlyph = exports.PauseGlyph = (0, _TEMPLATE.createSinglePathSVG)({
+  path: 'M6 4H9V20H6V4ZM15 4H18V20H15V4Z'
+});
+//# sourceMappingURL=PauseGlyph.js.map

package/lib/commonjs/media-controls/PauseGlyph.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_TEMPLATE","require","PauseGlyph","exports","createSinglePathSVG","path"],"sourceRoot":"../../../src","sources":["media-controls/PauseGlyph.tsx"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,IAAAE,6BAAmB,EAAC;EAC5CC,IAAI,EAAE;AACR,CAAC,CAAC","ignoreList":[]}

package/lib/commonjs/media-controls/PlayButton.js

@@ -0,0 +1,183 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PlayButton = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _RiPlayFill = require("../icons/remix/RiPlayFill.js");
+var _tokens = require("../styles/tokens.js");
+var _adoptStyleSheet = require("../styles/adopt-style-sheet.js");
+var _webData = require("../styles/web-data.js");
+var _useTheme = require("../theme/use-theme.js");
+var _shared = require("./shared.js");
+var _PauseGlyph = require("./PauseGlyph.js");
+var _SpinnerRing = require("./SpinnerRing.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 round play / pause button.
+ *
+ *            diameter   glyph
+ *   small    32         16
+ *   medium   48         24
+ *   large    56         28
+ *
+ *   accent    accent-500 fill, primaryForeground glyph; hover accent-600
+ *             (dark 400), press accent-700 (dark 300)
+ *   inverse   text-colour fill, background-colour glyph; hover mixes 16% of
+ *             the background in
+ *   plain     the glyph alone in the text colour; hover turns it accent
+ *
+ * Colour change only — no scale. `RiPlayFill`'s triangle already sits right of
+ * its box's centre (the path spans x 8..19.6 of 24), which puts its visual
+ * weight on the circle's centre, so no further nudge is applied.
+ *
+ * The pause glyph is Bloom's own (`PauseGlyph`), not the stock media one: the
+ * stock two-bar pause carries 0.59 × the triangle's ink, so the button changed
+ * WEIGHT as it toggled at every size. The measurement and the widened path are
+ * in `PauseGlyph.tsx`.
+ *
+ * Accessibility: a plain `button` whose NAME is the action ("Play Night Drive"
+ * / "Pause Night Drive"). It deliberately carries no `aria-pressed`: a toggle
+ * button keeps one name and flips its pressed state, whereas this names what
+ * pressing does next, and a name that changes AND a pressed state would announce
+ * "Pause, pressed" — two answers to one question. `loading` sets `aria-busy`
+ * (React Native folds it into `accessibilityState.busy`).
+ */
+
+const SIZE_CONFIG = {
+  small: {
+    box: 32,
+    glyph: 16
+  },
+  medium: {
+    box: 48,
+    glyph: 24
+  },
+  large: {
+    box: 56,
+    glyph: 28
+  }
+};
+function PlayButtonComponent({
+  playing,
+  onPress,
+  interactive = true,
+  size = 'medium',
+  variant = 'accent',
+  loading = false,
+  disabled = false,
+  subject,
+  playLabel = 'Play',
+  pauseLabel = 'Pause',
+  accessibilityLabel,
+  style,
+  testID
+}) {
+  const theme = (0, _useTheme.useTheme)();
+  (0, _react.useEffect)(() => {
+    (0, _adoptStyleSheet.adoptStyleSheet)(_shared.MEDIA_CONTROLS_STYLE_ID, _shared.MEDIA_CONTROLS_CSS);
+  }, []);
+  const paint = (0, _react.useMemo)(() => (0, _shared.resolveMediaControlsPaint)(theme), [theme]);
+  const [hovered, setHovered] = (0, _react.useState)(false);
+  const [pressed, setPressed] = (0, _react.useState)(false);
+  const {
+    box,
+    glyph
+  } = SIZE_CONFIG[size];
+  const action = playing ? pauseLabel : playLabel;
+  const name = accessibilityLabel ?? (subject ? `${action} ${subject}` : action);
+  const active = !disabled && (pressed || hovered);
+  let fill;
+  let glyphColor;
+  if (variant === 'accent') {
+    fill = !disabled && pressed ? paint.accentPressed : active ? paint.accentHover : paint.accent;
+    glyphColor = paint.onAccent;
+  } else if (variant === 'inverse') {
+    fill = active ? paint.inverseHover : paint.inverse;
+    glyphColor = paint.onInverse;
+  } else {
+    fill = undefined;
+    glyphColor = active ? paint.accent : paint.text;
+  }
+  const Glyph = playing ? _PauseGlyph.PauseGlyph : _RiPlayFill.RiPlayFill;
+  const rootStyle = {
+    width: box,
+    height: box,
+    borderRadius: _tokens.borderRadius.full,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: fill,
+    opacity: disabled ? _tokens.DISABLED_OPACITY : 1,
+    '--bloom-media-ring': paint.ring,
+    ...(_shared.IS_WEB ? {
+      transitionProperty: 'background-color',
+      transitionDuration: '150ms'
+    } : null)
+  };
+  const glyphBox = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    pointerEvents: "none",
+    style: {
+      width: glyph,
+      height: glyph
+    },
+    children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_SpinnerRing.SpinnerRing, {
+      size: glyph,
+      color: glyphColor
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Glyph, {
+      width: glyph,
+      height: glyph,
+      fill: glyphColor
+    })
+  });
+
+  // `interactive={false}` makes this DECORATION — the poster frame or the row around it
+  // is the press target, and a second `role="button"` inside one is invalid HTML
+  // (react-dom says so out loud) and a second stop for a screen reader on the
+  // same action. It keeps its box and its fill; it just stops claiming to be a
+  // control. An explicit `accessibilityLabel` still names it, for the rare case
+  // where the glyph is the only thing saying what state the media is in.
+  if (!interactive) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      ...(0, _webData.webDataSet)({
+        bloomPlayButton: variant
+      }),
+      role: accessibilityLabel ? 'img' : undefined,
+      accessibilityLabel: accessibilityLabel,
+      "aria-hidden": accessibilityLabel ? undefined : true,
+      importantForAccessibility: accessibilityLabel ? 'yes' : 'no-hide-descendants',
+      accessibilityElementsHidden: !accessibilityLabel,
+      style: [rootStyle, style],
+      testID: testID,
+      children: glyphBox
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+    ...(0, _webData.webDataSet)({
+      bloomMediaFocusable: '',
+      bloomPlayButton: variant
+    }),
+    role: "button",
+    accessibilityLabel: name,
+    "aria-busy": loading || undefined,
+    "aria-disabled": disabled || undefined,
+    accessibilityState: {
+      busy: loading,
+      disabled
+    },
+    disabled: disabled,
+    onPress: onPress,
+    onHoverIn: () => setHovered(true),
+    onHoverOut: () => setHovered(false),
+    onPressIn: () => setPressed(true),
+    onPressOut: () => setPressed(false),
+    style: [rootStyle, style],
+    testID: testID,
+    children: glyphBox
+  });
+}
+const PlayButton = exports.PlayButton = /*#__PURE__*/(0, _react.memo)(PlayButtonComponent);
+PlayButton.displayName = 'PlayButton';
+//# sourceMappingURL=PlayButton.js.map

package/lib/commonjs/media-controls/PlayButton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_RiPlayFill","_tokens","_adoptStyleSheet","_webData","_useTheme","_shared","_PauseGlyph","_SpinnerRing","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SIZE_CONFIG","small","box","glyph","medium","large","PlayButtonComponent","playing","onPress","interactive","size","variant","loading","disabled","subject","playLabel","pauseLabel","accessibilityLabel","style","testID","theme","useTheme","useEffect","adoptStyleSheet","MEDIA_CONTROLS_STYLE_ID","MEDIA_CONTROLS_CSS","paint","useMemo","resolveMediaControlsPaint","hovered","setHovered","useState","pressed","setPressed","action","name","active","fill","glyphColor","accentPressed","accentHover","accent","onAccent","inverseHover","inverse","onInverse","undefined","text","Glyph","PauseGlyph","RiPlayFill","rootStyle","width","height","borderRadius","full","alignItems","justifyContent","backgroundColor","opacity","DISABLED_OPACITY","ring","IS_WEB","transitionProperty","transitionDuration","glyphBox","jsx","View","pointerEvents","children","SpinnerRing","color","webDataSet","bloomPlayButton","role","importantForAccessibility","accessibilityElementsHidden","Pressable","bloomMediaFocusable","accessibilityState","busy","onHoverIn","onHoverOut","onPressIn","onPressOut","PlayButton","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["media-controls/PlayButton.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/media-controls/PlaybackProgress.js

@@ -0,0 +1,134 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PlaybackProgress = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _useTheme = require("../theme/use-theme.js");
+var _index = require("../typography/index.js");
+var _MediaTrack = require("./MediaTrack.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 thin scrubber under a player: rail, buffered segment, progress fill and a
+ * thumb that shows on hover (web), keyboard focus and while dragging.
+ *
+ *   rail     4px pill, hit area 16 tall
+ *   times    caption-1-medium, tabular, muted; `inline` sits them either side
+ *            of the rail (8px gap, 40px min width); `below` under its two ends
+ *
+ * Seeking: `onSeekPreview(seconds)` fires while dragging (the fill and the
+ * elapsed time follow the pointer), `onSeek(seconds)` once on release. Arrow
+ * keys (web) and the native `increment`/`decrement` actions call `onSeek`
+ * directly, ±`keyboardStep` seconds; Home/End jump to the ends.
+ *
+ * Accessibility: a `slider` (`role="slider"`), named "Seek" by default, with
+ * `aria-valuemin` 0, `aria-valuemax` the duration, `aria-valuenow` the position
+ * and `aria-valuetext` "1:23 of 3:45". The drawn times are hidden — the value
+ * text already says them.
+ */
+function PlaybackProgressComponent({
+  value,
+  duration,
+  buffered,
+  onSeek,
+  onSeekPreview,
+  showTimes = false,
+  showRemaining = false,
+  timesPosition = 'inline',
+  keyboardStep = 5,
+  disabled = false,
+  accessibilityLabel = 'Seek',
+  formatValueText,
+  style,
+  testID
+}) {
+  const theme = (0, _useTheme.useTheme)();
+  const paint = (0, _react.useMemo)(() => (0, _shared.resolveMediaControlsPaint)(theme), [theme]);
+  const [dragValue, setDragValue] = (0, _react.useState)(null);
+  const valueText = (0, _react.useCallback)(seconds => formatValueText ? formatValueText(seconds, duration) : `${(0, _shared.formatDuration)(seconds)} of ${(0, _shared.formatDuration)(duration)}`, [formatValueText, duration]);
+  const track = /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaTrack.MediaTrack, {
+    value: value,
+    max: duration,
+    buffered: buffered,
+    onPreview: onSeekPreview,
+    onCommit: onSeek,
+    onDragChange: setDragValue,
+    step: keyboardStep,
+    disabled: disabled,
+    accessibilityLabel: accessibilityLabel,
+    valueText: valueText,
+    style: {
+      flexGrow: 1,
+      flexShrink: 1
+    },
+    testID: testID ? `${testID}-track` : undefined
+  });
+  if (!showTimes) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [{
+        flexDirection: 'row',
+        minWidth: 0
+      }, style],
+      testID: testID,
+      children: track
+    });
+  }
+  const position = Math.min(Math.max(0, dragValue ?? value), Math.max(0, duration));
+  const elapsed = (0, _shared.formatDuration)(position);
+  const right = showRemaining ? `−${(0, _shared.formatDuration)(Math.max(0, duration - position))}` : (0, _shared.formatDuration)(duration);
+  const timeStyle = {
+    color: paint.textMuted,
+    fontVariant: ['tabular-nums']
+  };
+  const label = (text, align) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
+    variant: "caption-1-medium",
+    numberOfLines: 1,
+    importantForAccessibility: "no",
+    accessibilityElementsHidden: true,
+    "aria-hidden": true,
+    style: [timeStyle, {
+      textAlign: align
+    }, timesPosition === 'inline' ? {
+      minWidth: 40
+    } : null],
+    children: text
+  });
+  if (timesPosition === 'below') {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: [{
+        minWidth: 0
+      }, style],
+      testID: testID,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: {
+          flexDirection: 'row'
+        },
+        children: track
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: {
+          flexDirection: 'row',
+          justifyContent: 'space-between',
+          marginTop: 2
+        },
+        children: [label(elapsed, 'left'), label(right, 'right')]
+      })]
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: [{
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 8,
+      minWidth: 0
+    }, style],
+    testID: testID,
+    children: [label(elapsed, 'right'), track, label(right, 'left')]
+  });
+}
+const PlaybackProgress = exports.PlaybackProgress = /*#__PURE__*/(0, _react.memo)(PlaybackProgressComponent);
+PlaybackProgress.displayName = 'PlaybackProgress';
+//# sourceMappingURL=PlaybackProgress.js.map

package/lib/commonjs/media-controls/PlaybackProgress.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_index","_MediaTrack","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","PlaybackProgressComponent","value","duration","buffered","onSeek","onSeekPreview","showTimes","showRemaining","timesPosition","keyboardStep","disabled","accessibilityLabel","formatValueText","style","testID","theme","useTheme","paint","useMemo","resolveMediaControlsPaint","dragValue","setDragValue","useState","valueText","useCallback","seconds","formatDuration","track","jsx","MediaTrack","max","onPreview","onCommit","onDragChange","step","flexGrow","flexShrink","undefined","View","flexDirection","minWidth","children","position","Math","min","elapsed","right","timeStyle","color","textMuted","fontVariant","label","text","align","Text","variant","numberOfLines","importantForAccessibility","accessibilityElementsHidden","textAlign","jsxs","justifyContent","marginTop","alignItems","gap","PlaybackProgress","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["media-controls/PlaybackProgress.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/media-controls/SpinnerRing.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SpinnerRing = SpinnerRing;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+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); }
+/**
+ * A ring with one bright quarter, turning once every 800ms. Internal to the
+ * family (`PlayButton`'s `loading`). It keeps turning under reduced motion: it
+ * is a status, not decoration, and a still ring would read as "stalled".
+ */
+function SpinnerRing({
+  size,
+  color
+}) {
+  const rotation = (0, _reactNativeReanimated.useSharedValue)(0);
+  (0, _react.useEffect)(() => {
+    rotation.value = 0;
+    rotation.value = (0, _reactNativeReanimated.withRepeat)((0, _reactNativeReanimated.withTiming)(360, {
+      duration: 800,
+      easing: _reactNativeReanimated.Easing.linear
+    }), -1, false);
+    return () => (0, _reactNativeReanimated.cancelAnimation)(rotation);
+  }, [rotation]);
+  const animated = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
+    transform: [{
+      rotate: `${rotation.value}deg`
+    }]
+  }), [rotation]);
+  const stroke = Math.max(2, Math.round(size / 10));
+  const ring = {
+    width: size,
+    height: size,
+    borderRadius: size / 2,
+    borderWidth: stroke
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    pointerEvents: "none",
+    style: {
+      width: size,
+      height: size
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [ring, {
+        position: 'absolute',
+        borderColor: color,
+        opacity: 0.3
+      }]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
+      style: [ring, {
+        borderTopColor: 'transparent',
+        borderRightColor: 'transparent',
+        borderBottomColor: 'transparent',
+        borderLeftColor: color
+      }, animated]
+    })]
+  });
+}
+//# sourceMappingURL=SpinnerRing.js.map

package/lib/commonjs/media-controls/SpinnerRing.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SpinnerRing","size","color","rotation","useSharedValue","useEffect","value","withRepeat","withTiming","duration","easing","Easing","linear","cancelAnimation","animated","useAnimatedStyle","transform","rotate","stroke","Math","max","round","ring","width","height","borderRadius","borderWidth","jsxs","View","pointerEvents","style","children","jsx","position","borderColor","opacity","borderTopColor","borderRightColor","borderBottomColor","borderLeftColor"],"sourceRoot":"../../../src","sources":["media-controls/SpinnerRing.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/media-controls/VolumeControl.js

@@ -0,0 +1,152 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VolumeControl = void 0;
+exports.volumeIconFor = volumeIconFor;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _RiVolumeDownLine = require("../icons/remix/RiVolumeDownLine.js");
+var _RiVolumeMuteLine = require("../icons/remix/RiVolumeMuteLine.js");
+var _RiVolumeUpLine = require("../icons/remix/RiVolumeUpLine.js");
+var _adoptStyleSheet = require("../styles/adopt-style-sheet.js");
+var _tokens = require("../styles/tokens.js");
+var _webData = require("../styles/web-data.js");
+var _clamp = require("../styles/clamp.js");
+var _useTheme = require("../theme/use-theme.js");
+var _MediaTrack = require("./MediaTrack.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 speaker glyph for a level: muted or 0 → mute, under 0.5 → down, else up. */
+function volumeIconFor(volume, muted) {
+  if (muted || volume <= 0) return _RiVolumeMuteLine.RiVolumeMuteLine;
+  return volume < 0.5 ? _RiVolumeDownLine.RiVolumeDownLine : _RiVolumeUpLine.RiVolumeUpLine;
+}
+
+/**
+ * A speaker button that mutes, beside a short volume slider.
+ *
+ *   button   32 round, 20px glyph, muted neutral; hover: text colour on a
+ *            neutral-100 (dark neutral-800) wash
+ *   slider   the family's 4px rail, `sliderWidth` wide (96), 4px after the button
+ *
+ * The glyph follows the level: `RiVolumeMuteLine` (muted or 0),
+ * `RiVolumeDownLine` (under 50%), `RiVolumeUpLine`. While muted the slider draws
+ * 0; moving it calls `onMutedChange(false)` as well as `onVolumeChange`.
+ *
+ * `sliderVisibility="hover"` hides the slider on web until the control is
+ * hovered or holds keyboard focus (its width stays reserved, so nothing moves);
+ * a device without hover, and native, always shows it.
+ *
+ * Accessibility: the button is named by the action ("Mute" / "Unmute"); the
+ * slider is a `slider` named "Volume" with `aria-valuetext` "40%". Arrows step
+ * 5%.
+ */
+function VolumeControlComponent({
+  volume,
+  onVolumeChange,
+  muted = false,
+  onMutedChange,
+  sliderWidth = 96,
+  sliderVisibility = 'always',
+  disabled = false,
+  muteLabel = 'Mute',
+  unmuteLabel = 'Unmute',
+  accessibilityLabel = 'Volume',
+  style,
+  testID
+}) {
+  const theme = (0, _useTheme.useTheme)();
+  (0, _react.useEffect)(() => {
+    (0, _adoptStyleSheet.adoptStyleSheet)(_shared.MEDIA_CONTROLS_STYLE_ID, _shared.MEDIA_CONTROLS_CSS);
+  }, []);
+  const paint = (0, _react.useMemo)(() => (0, _shared.resolveMediaControlsPaint)(theme), [theme]);
+  const [hovered, setHovered] = (0, _react.useState)(false);
+  const level = (0, _clamp.clamp)(volume, 0, 1);
+  const drawn = muted ? 0 : level;
+  const Glyph = volumeIconFor(level, muted);
+  const change = (0, _react.useCallback)(next => {
+    const rounded = Math.round((0, _clamp.clamp)(next, 0, 1) * 100) / 100;
+    if (muted && rounded > 0) onMutedChange?.(false);
+    onVolumeChange(rounded);
+  }, [muted, onMutedChange, onVolumeChange]);
+  const valueText = (0, _react.useCallback)(v => `${Math.round(v * 100)}%`, []);
+  const buttonStyle = {
+    width: 32,
+    height: 32,
+    borderRadius: _tokens.borderRadius.full,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: hovered && !disabled ? paint.wash : undefined,
+    '--bloom-media-ring': paint.ring
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    ...(0, _webData.webDataSet)({
+      bloomVolumeControl: '',
+      bloomVolumeReveal: _shared.IS_WEB ? sliderVisibility : 'always'
+    }),
+    style: [{
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 4,
+      opacity: disabled ? _tokens.DISABLED_OPACITY : 1
+    }, style],
+    testID: testID,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+      ...(0, _webData.webDataSet)({
+        bloomMediaFocusable: ''
+      }),
+      role: "button",
+      accessibilityLabel: muted ? unmuteLabel : muteLabel,
+      "aria-disabled": disabled || undefined,
+      accessibilityState: {
+        disabled
+      },
+      disabled: disabled,
+      onHoverIn: () => setHovered(true),
+      onHoverOut: () => setHovered(false),
+      onPress: () => onMutedChange?.(!muted),
+      style: buttonStyle,
+      testID: testID ? `${testID}-mute` : undefined,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        pointerEvents: "none",
+        style: {
+          width: 20,
+          height: 20
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Glyph, {
+          width: 20,
+          height: 20,
+          fill: hovered && !disabled ? paint.text : paint.textMuted
+        })
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      ...(0, _webData.webDataSet)({
+        bloomVolumeSlider: ''
+      }),
+      style: {
+        width: sliderWidth,
+        flexDirection: 'row'
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaTrack.MediaTrack, {
+        value: drawn,
+        max: 1,
+        onPreview: change,
+        onCommit: change,
+        step: 0.05,
+        disabled: disabled,
+        accessibilityLabel: accessibilityLabel,
+        valueText: valueText,
+        style: {
+          flexGrow: 1
+        },
+        testID: testID ? `${testID}-slider` : undefined
+      })
+    })]
+  });
+}
+const VolumeControl = exports.VolumeControl = /*#__PURE__*/(0, _react.memo)(VolumeControlComponent);
+VolumeControl.displayName = 'VolumeControl';
+//# sourceMappingURL=VolumeControl.js.map

package/lib/commonjs/media-controls/VolumeControl.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_RiVolumeDownLine","_RiVolumeMuteLine","_RiVolumeUpLine","_adoptStyleSheet","_tokens","_webData","_clamp","_useTheme","_MediaTrack","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","volumeIconFor","volume","muted","RiVolumeMuteLine","RiVolumeDownLine","RiVolumeUpLine","VolumeControlComponent","onVolumeChange","onMutedChange","sliderWidth","sliderVisibility","disabled","muteLabel","unmuteLabel","accessibilityLabel","style","testID","theme","useTheme","useEffect","adoptStyleSheet","MEDIA_CONTROLS_STYLE_ID","MEDIA_CONTROLS_CSS","paint","useMemo","resolveMediaControlsPaint","hovered","setHovered","useState","level","clamp","drawn","Glyph","change","useCallback","next","rounded","Math","round","valueText","v","buttonStyle","width","height","borderRadius","full","alignItems","justifyContent","backgroundColor","wash","undefined","ring","jsxs","View","webDataSet","bloomVolumeControl","bloomVolumeReveal","IS_WEB","flexDirection","gap","opacity","DISABLED_OPACITY","children","jsx","Pressable","bloomMediaFocusable","role","accessibilityState","onHoverIn","onHoverOut","onPress","pointerEvents","fill","text","textMuted","bloomVolumeSlider","MediaTrack","value","max","onPreview","onCommit","step","flexGrow","VolumeControl","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["media-controls/VolumeControl.tsx"],"mappings":"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","ignoreList":[]}