@oxy.so/bloom 2.9.0 → 2.10.0

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useCallback","useMemo","useState","View","useTheme","Text","MediaTrack","formatDuration","resolveMediaControlsPaint","jsx","_jsx","jsxs","_jsxs","PlaybackProgressComponent","value","duration","buffered","onSeek","onSeekPreview","showTimes","showRemaining","timesPosition","keyboardStep","disabled","accessibilityLabel","formatValueText","style","testID","theme","paint","dragValue","setDragValue","valueText","seconds","track","max","onPreview","onCommit","onDragChange","step","flexGrow","flexShrink","undefined","flexDirection","minWidth","children","position","Math","min","elapsed","right","timeStyle","color","textMuted","fontVariant","label","text","align","variant","numberOfLines","importantForAccessibility","accessibilityElementsHidden","textAlign","justifyContent","marginTop","alignItems","gap","PlaybackProgress","displayName"],"sourceRoot":"../../../src","sources":["media-controls/PlaybackProgress.tsx"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,60 @@
+"use strict";
+
+import React, { useEffect } from 'react';
+import { View } from 'react-native';
+import Animated, { Easing, cancelAnimation, useAnimatedStyle, useSharedValue, withRepeat, withTiming } from 'react-native-reanimated';
+
+/**
+ * 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".
+ */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function SpinnerRing({
+  size,
+  color
+}) {
+  const rotation = useSharedValue(0);
+  useEffect(() => {
+    rotation.value = 0;
+    rotation.value = withRepeat(withTiming(360, {
+      duration: 800,
+      easing: Easing.linear
+    }), -1, false);
+    return () => cancelAnimation(rotation);
+  }, [rotation]);
+  const animated = 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__*/_jsxs(View, {
+    pointerEvents: "none",
+    style: {
+      width: size,
+      height: size
+    },
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [ring, {
+        position: 'absolute',
+        borderColor: color,
+        opacity: 0.3
+      }]
+    }), /*#__PURE__*/_jsx(Animated.View, {
+      style: [ring, {
+        borderTopColor: 'transparent',
+        borderRightColor: 'transparent',
+        borderBottomColor: 'transparent',
+        borderLeftColor: color
+      }, animated]
+    })]
+  });
+}
+//# sourceMappingURL=SpinnerRing.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","View","Animated","Easing","cancelAnimation","useAnimatedStyle","useSharedValue","withRepeat","withTiming","jsx","_jsx","jsxs","_jsxs","SpinnerRing","size","color","rotation","value","duration","easing","linear","animated","transform","rotate","stroke","Math","max","round","ring","width","height","borderRadius","borderWidth","pointerEvents","style","children","position","borderColor","opacity","borderTopColor","borderRightColor","borderBottomColor","borderLeftColor"],"sourceRoot":"../../../src","sources":["media-controls/SpinnerRing.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,IACbC,MAAM,EACNC,eAAe,EACfC,gBAAgB,EAChBC,cAAc,EACdC,UAAU,EACVC,UAAU,QACL,yBAAyB;;AAEhC;AACA;AACA;AACA;AACA;AAJA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAKA,OAAO,SAASC,WAAWA,CAAC;EAAEC,IAAI;EAAEC;AAAuC,CAAC,EAAE;EAC5E,MAAMC,QAAQ,GAAGV,cAAc,CAAC,CAAC,CAAC;EAElCN,SAAS,CAAC,MAAM;IACdgB,QAAQ,CAACC,KAAK,GAAG,CAAC;IAClBD,QAAQ,CAACC,KAAK,GAAGV,UAAU,CAACC,UAAU,CAAC,GAAG,EAAE;MAAEU,QAAQ,EAAE,GAAG;MAAEC,MAAM,EAAEhB,MAAM,CAACiB;IAAO,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC;IACjG,OAAO,MAAMhB,eAAe,CAACY,QAAQ,CAAC;EACxC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEd,MAAMK,QAAQ,GAAGhB,gBAAgB,CAC/B,OAAO;IAAEiB,SAAS,EAAE,CAAC;MAAEC,MAAM,EAAE,GAAGP,QAAQ,CAACC,KAAK;IAAM,CAAC;EAAE,CAAC,CAAC,EAC3D,CAACD,QAAQ,CACX,CAAC;EAED,MAAMQ,MAAM,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACb,IAAI,GAAG,EAAE,CAAC,CAAC;EACjD,MAAMc,IAAI,GAAG;IAAEC,KAAK,EAAEf,IAAI;IAAEgB,MAAM,EAAEhB,IAAI;IAAEiB,YAAY,EAAEjB,IAAI,GAAG,CAAC;IAAEkB,WAAW,EAAER;EAAO,CAAU;EAChG,oBACEZ,KAAA,CAACX,IAAI;IAACgC,aAAa,EAAC,MAAM;IAACC,KAAK,EAAE;MAAEL,KAAK,EAAEf,IAAI;MAAEgB,MAAM,EAAEhB;IAAK,CAAE;IAAAqB,QAAA,gBAE9DzB,IAAA,CAACT,IAAI;MAACiC,KAAK,EAAE,CAACN,IAAI,EAAE;QAAEQ,QAAQ,EAAE,UAAU;QAAEC,WAAW,EAAEtB,KAAK;QAAEuB,OAAO,EAAE;MAAI,CAAC;IAAE,CAAE,CAAC,eACnF5B,IAAA,CAACR,QAAQ,CAACD,IAAI;MACZiC,KAAK,EAAE,CACLN,IAAI,EACJ;QACEW,cAAc,EAAE,aAAa;QAC7BC,gBAAgB,EAAE,aAAa;QAC/BC,iBAAiB,EAAE,aAAa;QAChCC,eAAe,EAAE3B;MACnB,CAAC,EACDM,QAAQ;IACR,CACH,CAAC;EAAA,CACE,CAAC;AAEX","ignoreList":[]}

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

@@ -0,0 +1,145 @@
+"use strict";
+
+import React, { memo, useCallback, useEffect, useMemo, useState } from 'react';
+import { Pressable, View } from 'react-native';
+import { webDataSet } from "../checkbox/shared.js";
+import { RiVolumeDownLine } from "../icons/remix/RiVolumeDownLine.js";
+import { RiVolumeMuteLine } from "../icons/remix/RiVolumeMuteLine.js";
+import { RiVolumeUpLine } from "../icons/remix/RiVolumeUpLine.js";
+import { adoptStyleSheet } from "../styles/adopt-style-sheet.js";
+import { borderRadius } from "../styles/tokens.js";
+import { useTheme } from "../theme/use-theme.js";
+import { MediaTrack } from "./MediaTrack.js";
+import { IS_WEB, MEDIA_CONTROLS_CSS, MEDIA_CONTROLS_STYLE_ID, clamp, resolveMediaControlsPaint } from "./shared.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** The speaker glyph for a level: muted or 0 → mute, under 0.5 → down, else up. */
+export function volumeIconFor(volume, muted) {
+  if (muted || volume <= 0) return RiVolumeMuteLine;
+  return volume < 0.5 ? RiVolumeDownLine : 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 = useTheme();
+  useEffect(() => {
+    adoptStyleSheet(MEDIA_CONTROLS_STYLE_ID, MEDIA_CONTROLS_CSS);
+  }, []);
+  const paint = useMemo(() => resolveMediaControlsPaint(theme), [theme]);
+  const [hovered, setHovered] = useState(false);
+  const level = clamp(volume, 0, 1);
+  const drawn = muted ? 0 : level;
+  const Glyph = volumeIconFor(level, muted);
+  const change = useCallback(next => {
+    const rounded = Math.round(clamp(next, 0, 1) * 100) / 100;
+    if (muted && rounded > 0) onMutedChange?.(false);
+    onVolumeChange(rounded);
+  }, [muted, onMutedChange, onVolumeChange]);
+  const valueText = useCallback(v => `${Math.round(v * 100)}%`, []);
+  const buttonStyle = {
+    width: 32,
+    height: 32,
+    borderRadius: borderRadius.full,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: hovered && !disabled ? paint.wash : undefined,
+    '--bloom-media-ring': paint.ring
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    ...webDataSet({
+      bloomVolumeControl: '',
+      bloomVolumeReveal: IS_WEB ? sliderVisibility : 'always'
+    }),
+    style: [{
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 4,
+      opacity: disabled ? 0.5 : 1
+    }, style],
+    testID: testID,
+    children: [/*#__PURE__*/_jsx(Pressable, {
+      ...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__*/_jsx(View, {
+        pointerEvents: "none",
+        style: {
+          width: 20,
+          height: 20
+        },
+        children: /*#__PURE__*/_jsx(Glyph, {
+          width: 20,
+          height: 20,
+          fill: hovered && !disabled ? paint.text : paint.textMuted
+        })
+      })
+    }), /*#__PURE__*/_jsx(View, {
+      ...webDataSet({
+        bloomVolumeSlider: ''
+      }),
+      style: {
+        width: sliderWidth,
+        flexDirection: 'row'
+      },
+      children: /*#__PURE__*/_jsx(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
+      })
+    })]
+  });
+}
+export const VolumeControl = /*#__PURE__*/memo(VolumeControlComponent);
+VolumeControl.displayName = 'VolumeControl';
+//# sourceMappingURL=VolumeControl.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useCallback","useEffect","useMemo","useState","Pressable","View","webDataSet","RiVolumeDownLine","RiVolumeMuteLine","RiVolumeUpLine","adoptStyleSheet","borderRadius","useTheme","MediaTrack","IS_WEB","MEDIA_CONTROLS_CSS","MEDIA_CONTROLS_STYLE_ID","clamp","resolveMediaControlsPaint","jsx","_jsx","jsxs","_jsxs","volumeIconFor","volume","muted","VolumeControlComponent","onVolumeChange","onMutedChange","sliderWidth","sliderVisibility","disabled","muteLabel","unmuteLabel","accessibilityLabel","style","testID","theme","paint","hovered","setHovered","level","drawn","Glyph","change","next","rounded","Math","round","valueText","v","buttonStyle","width","height","full","alignItems","justifyContent","backgroundColor","wash","undefined","ring","bloomVolumeControl","bloomVolumeReveal","flexDirection","gap","opacity","children","bloomMediaFocusable","role","accessibilityState","onHoverIn","onHoverOut","onPress","pointerEvents","fill","text","textMuted","bloomVolumeSlider","value","max","onPreview","onCommit","step","flexGrow","VolumeControl","displayName"],"sourceRoot":"../../../src","sources":["media-controls/VolumeControl.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/media-controls/index.js

@@ -0,0 +1,10 @@
+"use strict";
+
+export { PlayButton } from "./PlayButton.js";
+export { LikeButton } from "./LikeButton.js";
+export { ExplicitBadge } from "./ExplicitBadge.js";
+export { NowPlayingIndicator } from "./NowPlayingIndicator.js";
+export { PlaybackProgress } from "./PlaybackProgress.js";
+export { VolumeControl } from "./VolumeControl.js";
+export { formatDuration } from "./shared.js";
+//# sourceMappingURL=index.js.map

package/lib/module/media-controls/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PlayButton","LikeButton","ExplicitBadge","NowPlayingIndicator","PlaybackProgress","VolumeControl","formatDuration"],"sourceRoot":"../../../src","sources":["media-controls/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,UAAU,QAAQ,iBAAc;AACzC,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,mBAAmB,QAAQ,0BAAuB;AAC3D,SAASC,gBAAgB,QAAQ,uBAAoB;AACrD,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,cAAc,QAAQ,aAAU","ignoreList":[]}

package/lib/module/media-controls/shared.js

@@ -0,0 +1,106 @@
+"use strict";
+
+import { Platform } from 'react-native';
+import { mixColor, resolveButtonRamps } from "../button/shared.js";
+export const IS_WEB = Platform.OS === 'web';
+
+/**
+ * Seconds as a clock: `m:ss` under an hour, `h:mm:ss` from an hour. Fractions
+ * are floored (a player at 59.9s has not reached 1:00). Negative, `NaN` and
+ * infinite input draw `0:00`.
+ */
+export function formatDuration(seconds) {
+  const total = Number.isFinite(seconds) && seconds > 0 ? Math.floor(seconds) : 0;
+  const h = Math.floor(total / 3600);
+  const m = Math.floor(total % 3600 / 60);
+  const s = total % 60;
+  const ss = String(s).padStart(2, '0');
+  return h > 0 ? `${h}:${String(m).padStart(2, '0')}:${ss}` : `${m}:${ss}`;
+}
+export function clamp(v, min, max) {
+  return Math.min(max, Math.max(min, v));
+}
+
+/** Every colour the family paints, from the theme only. */
+
+export function resolveMediaControlsPaint(theme) {
+  const {
+    accent,
+    neutral: n
+  } = resolveButtonRamps(theme);
+  const dark = theme.isDark;
+  const {
+    colors
+  } = theme;
+  return {
+    accent: accent[500],
+    accentHover: dark ? accent[400] : accent[600],
+    accentPressed: dark ? accent[300] : accent[700],
+    onAccent: colors.primaryForeground,
+    inverse: colors.text,
+    inverseHover: mixColor(colors.text, colors.background, 0.16),
+    onInverse: colors.background,
+    text: colors.text,
+    textMuted: dark ? n[400] : n[500],
+    wash: dark ? n[800] : n[100],
+    rail: dark ? n[700] : n[200],
+    buffered: dark ? n[500] : n[300],
+    badge: dark ? n[400] : n[500],
+    onBadge: colors.background,
+    ring: accent[500]
+  };
+}
+
+// ---------------------------------------------------------------------------
+//  Web CSS — focus rings and the hover reveal have no inline-style spelling, so
+//  they hang off `dataSet` attributes in one adopted sheet.
+// ---------------------------------------------------------------------------
+
+export const MEDIA_CONTROLS_STYLE_ID = 'bloom-media-controls-web-css';
+const FOCUSABLE = '[data-bloom-media-focusable]';
+const THUMB = '[data-bloom-media-thumb]';
+const TRACK = '[data-bloom-media-track]';
+const VOLUME = '[data-bloom-volume-control]';
+const VOLUME_SLIDER = '[data-bloom-volume-slider]';
+export const MEDIA_CONTROLS_CSS = `
+${FOCUSABLE} {
+  outline: none;
+  cursor: pointer;
+}
+${FOCUSABLE}[aria-disabled="true"] {
+  cursor: default;
+}
+${FOCUSABLE}:focus-visible {
+  outline: 2px solid var(--bloom-media-ring, currentColor);
+  outline-offset: 2px;
+}
+${TRACK}:focus-visible {
+  outline-offset: 4px;
+  border-radius: 4px;
+}
+${TRACK}:focus-visible ${THUMB} {
+  opacity: 1 !important;
+}
+${TRACK}:focus-visible [data-bloom-media-fill] {
+  background-color: var(--bloom-media-accent) !important;
+}
+${VOLUME}[data-bloom-volume-reveal="hover"] ${VOLUME_SLIDER} {
+  opacity: 0;
+  transition: opacity 150ms ease-out;
+}
+${VOLUME}[data-bloom-volume-reveal="hover"]:hover ${VOLUME_SLIDER},
+${VOLUME}[data-bloom-volume-reveal="hover"]:focus-within ${VOLUME_SLIDER} {
+  opacity: 1;
+}
+@media (hover: none) {
+  ${VOLUME}[data-bloom-volume-reveal="hover"] ${VOLUME_SLIDER} {
+    opacity: 1;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  ${VOLUME} ${VOLUME_SLIDER} {
+    transition: none;
+  }
+}
+`;
+//# sourceMappingURL=shared.js.map

package/lib/module/media-controls/shared.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","mixColor","resolveButtonRamps","IS_WEB","OS","formatDuration","seconds","total","Number","isFinite","Math","floor","h","m","s","ss","String","padStart","clamp","v","min","max","resolveMediaControlsPaint","theme","accent","neutral","n","dark","isDark","colors","accentHover","accentPressed","onAccent","primaryForeground","inverse","text","inverseHover","background","onInverse","textMuted","wash","rail","buffered","badge","onBadge","ring","MEDIA_CONTROLS_STYLE_ID","FOCUSABLE","THUMB","TRACK","VOLUME","VOLUME_SLIDER","MEDIA_CONTROLS_CSS"],"sourceRoot":"../../../src","sources":["media-controls/shared.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/media-controls/types.js

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

package/lib/module/media-controls/types.js.map

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

package/lib/module/media-header/ArtistAbout.js

@@ -0,0 +1,119 @@
+"use strict";
+
+import React, { memo } from 'react';
+import { Image, StyleSheet, View } from 'react-native';
+import { Text } from "../typography/index.js";
+import { ArtistStats } from "./ArtistStats.js";
+import { ClampedText, useImageUri, useMediaHeaderPaint } from "./parts.js";
+import { gradientStyle } from "./shared.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The "About" section of an artist page.
+ *
+ *   heading    title-1-bold
+ *   card       radius 16, `card` fill; with `image` a 16:9 photo on top of it
+ *   bio        body-regular, clamped to `bioLines` with "Show more"
+ *   stats      `ArtistStats` (followers, monthly listeners)
+ *   cities     "Where people listen": city headline-semibold · count body-regular muted
+ */
+
+function ArtistAboutComponent({
+  image,
+  bio,
+  bioLines = 3,
+  stats,
+  cities,
+  title = 'About',
+  showMoreLabel,
+  showLessLabel,
+  style,
+  testID
+}) {
+  const paint = useMediaHeaderPaint();
+  const uri = useImageUri(image, 'large');
+  return /*#__PURE__*/_jsxs(View, {
+    style: [{
+      gap: 12
+    }, style],
+    testID: testID,
+    children: [/*#__PURE__*/_jsx(Text, {
+      variant: "title-1-bold",
+      role: "heading",
+      "aria-level": 2,
+      style: {
+        color: paint.text
+      },
+      children: title
+    }), /*#__PURE__*/_jsxs(View, {
+      style: {
+        borderRadius: 16,
+        overflow: 'hidden',
+        backgroundColor: paint.card
+      },
+      children: [uri ? /*#__PURE__*/_jsxs(View, {
+        style: {
+          width: '100%',
+          aspectRatio: 16 / 9
+        },
+        children: [/*#__PURE__*/_jsx(Image, {
+          source: {
+            uri
+          },
+          style: StyleSheet.absoluteFill,
+          resizeMode: "cover"
+        }), /*#__PURE__*/_jsx(View, {
+          pointerEvents: "none",
+          style: [StyleSheet.absoluteFill, gradientStyle(['rgba(0, 0, 0, 0) 60%', 'rgba(0, 0, 0, 0.35) 100%'])]
+        })]
+      }) : null, /*#__PURE__*/_jsxs(View, {
+        style: {
+          padding: 16,
+          gap: 20
+        },
+        children: [/*#__PURE__*/_jsx(ClampedText, {
+          lines: bioLines,
+          color: paint.text,
+          linkColor: paint.text,
+          ring: paint.ring,
+          showMoreLabel: showMoreLabel,
+          showLessLabel: showLessLabel,
+          testID: testID ? `${testID}-bio` : undefined,
+          children: bio
+        }), stats && stats.length > 0 ? /*#__PURE__*/_jsx(ArtistStats, {
+          stats: stats,
+          testID: testID ? `${testID}-stats` : undefined
+        }) : null, cities && cities.length > 0 ? /*#__PURE__*/_jsx(View, {
+          role: "list",
+          style: {
+            gap: 12
+          },
+          testID: testID ? `${testID}-cities` : undefined,
+          children: cities.map((city, i) => /*#__PURE__*/_jsxs(View, {
+            role: "listitem",
+            accessible: true,
+            accessibilityLabel: `${city.city}, ${city.count}`,
+            style: {
+              gap: 0
+            },
+            children: [/*#__PURE__*/_jsx(Text, {
+              variant: "headline-semibold",
+              style: {
+                color: paint.text
+              },
+              children: city.city
+            }), /*#__PURE__*/_jsx(Text, {
+              variant: "body-regular",
+              style: {
+                color: paint.textMuted
+              },
+              children: city.count
+            })]
+          }, `${city.city}-${i}`))
+        }) : null]
+      })]
+    })]
+  });
+}
+export const ArtistAbout = /*#__PURE__*/memo(ArtistAboutComponent);
+ArtistAbout.displayName = 'ArtistAbout';
+//# sourceMappingURL=ArtistAbout.js.map

package/lib/module/media-header/ArtistAbout.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","Image","StyleSheet","View","Text","ArtistStats","ClampedText","useImageUri","useMediaHeaderPaint","gradientStyle","jsx","_jsx","jsxs","_jsxs","ArtistAboutComponent","image","bio","bioLines","stats","cities","title","showMoreLabel","showLessLabel","style","testID","paint","uri","gap","children","variant","role","color","text","borderRadius","overflow","backgroundColor","card","width","aspectRatio","source","absoluteFill","resizeMode","pointerEvents","padding","lines","linkColor","ring","undefined","length","map","city","i","accessible","accessibilityLabel","count","textMuted","ArtistAbout","displayName"],"sourceRoot":"../../../src","sources":["media-header/ArtistAbout.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/media-header/ArtistHero.js

@@ -0,0 +1,146 @@
+"use strict";
+
+import React, { memo } from 'react';
+import { Image, StyleSheet, View } from 'react-native';
+import { RiVerifiedBadgeFill } from "../icons/remix/RiVerifiedBadgeFill.js";
+import { Text } from "../typography/index.js";
+import { Cover, HeaderTitle, MediaHeaderFrame, useImageUri, useMediaHeaderPaint } from "./parts.js";
+import { gradientStyle, selectTitleVariant } from "./shared.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The top of an artist page.
+ *
+ * With `banner`: the image fills the band (wide 400 tall, narrow 300) under a
+ * bottom scrim — transparent to 60% black — and the text is white, because it
+ * sits on a photo, not on the theme.
+ *
+ * Without: the band is tinted from `artworkColor` and a round `avatar` (232 wide,
+ * 160 centred on narrow) stands beside the text, which takes the band's text colour.
+ *
+ *   verified   RiVerifiedBadgeFill (accent disc, white tick) + "Verified artist"
+ *   name       large-title … display-4 bold by length and width
+ *   listeners  body-medium
+ *
+ * The `actions` area (Play, Follow pill, shuffle, more) fades into the page under it.
+ */
+
+const SCRIM = ['rgba(0, 0, 0, 0) 0%', 'rgba(0, 0, 0, 0.12) 45%', 'rgba(0, 0, 0, 0.62) 100%'];
+function ArtistHeroComponent({
+  name,
+  banner,
+  avatar,
+  verified = false,
+  verifiedLabel = 'Verified artist',
+  listeners,
+  artworkColor,
+  actions,
+  headingLevel = 1,
+  style,
+  testID
+}) {
+  const paint = useMediaHeaderPaint(artworkColor);
+  const bannerUri = useImageUri(banner, 'large');
+  const onPhoto = !!bannerUri;
+  const fg = onPhoto ? '#ffffff' : paint.onBand;
+  const fgMuted = onPhoto ? '#ffffff' : paint.onBandMuted;
+  return /*#__PURE__*/_jsx(MediaHeaderFrame, {
+    paint: paint,
+    style: style,
+    testID: testID,
+    actions: actions,
+    actionsFade: onPhoto ? [paint.background, paint.background] : undefined,
+    centerCoverOnNarrow: true,
+    coverWidth: wide => onPhoto ? 0 : wide ? 232 : 160,
+    backdrop: onPhoto ? /*#__PURE__*/_jsxs(View, {
+      pointerEvents: "none",
+      style: StyleSheet.absoluteFill,
+      testID: testID ? `${testID}-banner` : undefined,
+      children: [/*#__PURE__*/_jsx(Image, {
+        source: {
+          uri: bannerUri
+        },
+        style: StyleSheet.absoluteFill,
+        resizeMode: "cover"
+      }), /*#__PURE__*/_jsx(View, {
+        style: [StyleSheet.absoluteFill, gradientStyle(SCRIM)]
+      })]
+    }) : undefined,
+    cover: onPhoto ? undefined : ({
+      wide
+    }) => /*#__PURE__*/_jsx(Cover, {
+      source: avatar,
+      size: wide ? 232 : 160,
+      shape: "round",
+      paint: paint,
+      testID: testID ? `${testID}-avatar` : undefined
+    }),
+    children: ({
+      wide,
+      textWidth
+    }) => /*#__PURE__*/_jsxs(View, {
+      style: {
+        gap: 4,
+        minHeight: onPhoto ? wide ? 304 : 220 : undefined,
+        justifyContent: 'flex-end'
+      },
+      children: [verified ? /*#__PURE__*/_jsxs(View, {
+        style: {
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap: 6
+        },
+        testID: testID ? `${testID}-verified` : undefined,
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: {
+            width: 24,
+            height: 24,
+            alignItems: 'center',
+            justifyContent: 'center'
+          },
+          children: [/*#__PURE__*/_jsx(View, {
+            style: {
+              position: 'absolute',
+              width: 12,
+              height: 12,
+              borderRadius: 6,
+              backgroundColor: '#ffffff'
+            }
+          }), /*#__PURE__*/_jsx(View, {
+            style: {
+              width: 24,
+              height: 24
+            },
+            children: /*#__PURE__*/_jsx(RiVerifiedBadgeFill, {
+              width: 24,
+              height: 24,
+              fill: paint.accent
+            })
+          })]
+        }), /*#__PURE__*/_jsx(Text, {
+          variant: "body-medium",
+          style: {
+            color: fg
+          },
+          children: verifiedLabel
+        })]
+      }) : null, /*#__PURE__*/_jsx(HeaderTitle, {
+        variant: selectTitleVariant(name, textWidth),
+        color: fg,
+        level: headingLevel,
+        numberOfLines: 2,
+        testID: testID ? `${testID}-name` : undefined,
+        children: name
+      }), listeners ? /*#__PURE__*/_jsx(Text, {
+        variant: "body-medium",
+        style: {
+          color: fgMuted
+        },
+        testID: testID ? `${testID}-listeners` : undefined,
+        children: listeners
+      }) : null]
+    })
+  });
+}
+export const ArtistHero = /*#__PURE__*/memo(ArtistHeroComponent);
+ArtistHero.displayName = 'ArtistHero';
+//# sourceMappingURL=ArtistHero.js.map

package/lib/module/media-header/ArtistHero.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","Image","StyleSheet","View","RiVerifiedBadgeFill","Text","Cover","HeaderTitle","MediaHeaderFrame","useImageUri","useMediaHeaderPaint","gradientStyle","selectTitleVariant","jsx","_jsx","jsxs","_jsxs","SCRIM","ArtistHeroComponent","name","banner","avatar","verified","verifiedLabel","listeners","artworkColor","actions","headingLevel","style","testID","paint","bannerUri","onPhoto","fg","onBand","fgMuted","onBandMuted","actionsFade","background","undefined","centerCoverOnNarrow","coverWidth","wide","backdrop","pointerEvents","absoluteFill","children","source","uri","resizeMode","cover","size","shape","textWidth","gap","minHeight","justifyContent","flexDirection","alignItems","width","height","position","borderRadius","backgroundColor","fill","accent","variant","color","level","numberOfLines","ArtistHero","displayName"],"sourceRoot":"../../../src","sources":["media-header/ArtistHero.tsx"],"mappings":"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","ignoreList":[]}