@oxy.so/bloom 2.8.0 → 2.10.0

package/lib/module/queue-panel/QueuePanelRow.js

@@ -0,0 +1,181 @@
+"use strict";
+
+import React, { memo, useEffect, useMemo } from 'react';
+import { Image, Pressable, View } from 'react-native';
+import { webDataSet } from "../checkbox/shared.js";
+import { useInteractionState } from "../hooks/use-interaction-state.js";
+import { RiMusic2Line } from "../icons/remix/RiMusic2Line.js";
+import { useImageResolver } from "../image-resolver/context.js";
+import { ExplicitBadge } from "../media-controls/ExplicitBadge.js";
+import { NowPlayingIndicator } from "../media-controls/NowPlayingIndicator.js";
+import { adoptStyleSheet } from "../styles/adopt-style-sheet.js";
+import { useTheme } from "../theme/use-theme.js";
+import { Text } from "../typography/index.js";
+import { IS_WEB, QUEUE_COVER_SIZE, QUEUE_PANEL_CSS, QUEUE_PANEL_STYLE_ID, QUEUE_ROW_HEIGHT, isImageUrl, resolveQueuePanelPaint } from "./shared.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * One track row, 56 tall:
+ *
+ *   8 · cover 40 (radius 6) · 12 · title body-medium / artists caption-1-regular · meta · trailing · 8
+ *
+ * The cover and text are ONE pressable (named "Play <title>"); `trailing`
+ * controls sit beside it rather than inside, so no button is nested in a
+ * button. Hover paints the row's highlight (web); the current row's title turns
+ * accent and the now-playing bars replace the meta.
+ */
+
+export function QueueCover({
+  cover,
+  size = QUEUE_COVER_SIZE
+}) {
+  const theme = useTheme();
+  const paint = useMemo(() => resolveQueuePanelPaint(theme), [theme]);
+  const resolver = useImageResolver();
+  const uri = cover ? isImageUrl(cover) ? cover : resolver?.(cover, 'thumb') : undefined;
+  const box = {
+    width: size,
+    height: size,
+    borderRadius: 6,
+    backgroundColor: paint.placeholder,
+    overflow: 'hidden',
+    alignItems: 'center',
+    justifyContent: 'center'
+  };
+  return /*#__PURE__*/_jsx(View, {
+    style: box,
+    children: uri ? /*#__PURE__*/_jsx(Image, {
+      source: {
+        uri
+      },
+      style: {
+        width: size,
+        height: size
+      },
+      accessibilityIgnoresInvertColors: true
+    }) : /*#__PURE__*/_jsx(RiMusic2Line, {
+      width: size / 2,
+      height: size / 2,
+      fill: paint.placeholderGlyph
+    })
+  });
+}
+export function useQueuePanelCss() {
+  useEffect(() => {
+    adoptStyleSheet(QUEUE_PANEL_STYLE_ID, QUEUE_PANEL_CSS);
+  }, []);
+}
+function QueuePanelRowComponent({
+  track,
+  onPress,
+  current = false,
+  playing = true,
+  accessibilityLabel,
+  trailing,
+  highlighted = false,
+  webState,
+  style,
+  testID
+}) {
+  const theme = useTheme();
+  useQueuePanelCss();
+  const paint = useMemo(() => resolveQueuePanelPaint(theme), [theme]);
+  const {
+    state: hovered,
+    onIn,
+    onOut
+  } = useInteractionState();
+  const rowStyle = {
+    height: QUEUE_ROW_HEIGHT,
+    flexDirection: 'row',
+    alignItems: 'center',
+    borderRadius: 8,
+    paddingRight: 8,
+    backgroundColor: hovered || highlighted ? paint.rowHover : 'transparent',
+    '--bloom-queue-ring': paint.ring
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    ...webDataSet({
+      bloomQueueRow: webState ?? (highlighted ? 'active' : '')
+    }),
+    onPointerEnter: IS_WEB ? onIn : undefined,
+    onPointerLeave: IS_WEB ? onOut : undefined,
+    style: [rowStyle, style],
+    testID: testID,
+    children: [/*#__PURE__*/_jsxs(Pressable, {
+      ...webDataSet({
+        bloomQueueFocusable: ''
+      }),
+      role: "button",
+      accessibilityLabel: accessibilityLabel ?? `Play ${track.title}`,
+      onPress: onPress,
+      style: {
+        flex: 1,
+        minWidth: 0,
+        alignSelf: 'stretch',
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingLeft: 8,
+        borderRadius: 8
+      },
+      testID: testID ? `${testID}-play` : undefined,
+      children: [/*#__PURE__*/_jsx(QueueCover, {
+        cover: track.cover
+      }), /*#__PURE__*/_jsxs(View, {
+        style: {
+          flex: 1,
+          minWidth: 0,
+          marginLeft: 12,
+          marginRight: 8
+        },
+        children: [/*#__PURE__*/_jsx(Text, {
+          variant: "body-medium",
+          numberOfLines: 1,
+          style: {
+            color: current ? paint.accent : paint.text
+          },
+          children: track.title
+        }), track.artists || track.explicit ? /*#__PURE__*/_jsxs(View, {
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: 4,
+            minWidth: 0
+          },
+          children: [track.explicit ? /*#__PURE__*/_jsx(ExplicitBadge, {
+            size: "small"
+          }) : null, track.artists ? /*#__PURE__*/_jsx(Text, {
+            variant: "caption-1-regular",
+            numberOfLines: 1,
+            style: {
+              color: paint.textSecondary,
+              flexShrink: 1
+            },
+            children: track.artists
+          }) : null]
+        }) : null]
+      }), current ? /*#__PURE__*/_jsx(NowPlayingIndicator, {
+        playing: playing,
+        size: 14,
+        testID: testID ? `${testID}-indicator` : undefined
+      }) : track.meta ? /*#__PURE__*/_jsx(Text, {
+        variant: "caption-1-regular",
+        numberOfLines: 1,
+        style: {
+          color: paint.textSecondary
+        },
+        children: track.meta
+      }) : null]
+    }), trailing ? /*#__PURE__*/_jsx(View, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        marginLeft: 4,
+        gap: 2
+      },
+      children: trailing
+    }) : null]
+  });
+}
+export const QueuePanelRow = /*#__PURE__*/memo(QueuePanelRowComponent);
+QueuePanelRow.displayName = 'QueuePanelRow';
+//# sourceMappingURL=QueuePanelRow.js.map

package/lib/module/queue-panel/QueuePanelRow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useEffect","useMemo","Image","Pressable","View","webDataSet","useInteractionState","RiMusic2Line","useImageResolver","ExplicitBadge","NowPlayingIndicator","adoptStyleSheet","useTheme","Text","IS_WEB","QUEUE_COVER_SIZE","QUEUE_PANEL_CSS","QUEUE_PANEL_STYLE_ID","QUEUE_ROW_HEIGHT","isImageUrl","resolveQueuePanelPaint","jsx","_jsx","jsxs","_jsxs","QueueCover","cover","size","theme","paint","resolver","uri","undefined","box","width","height","borderRadius","backgroundColor","placeholder","overflow","alignItems","justifyContent","style","children","source","accessibilityIgnoresInvertColors","fill","placeholderGlyph","useQueuePanelCss","QueuePanelRowComponent","track","onPress","current","playing","accessibilityLabel","trailing","highlighted","webState","testID","state","hovered","onIn","onOut","rowStyle","flexDirection","paddingRight","rowHover","ring","bloomQueueRow","onPointerEnter","onPointerLeave","bloomQueueFocusable","role","title","flex","minWidth","alignSelf","paddingLeft","marginLeft","marginRight","variant","numberOfLines","color","accent","text","artists","explicit","gap","textSecondary","flexShrink","meta","QueuePanelRow","displayName"],"sourceRoot":"../../../src","sources":["queue-panel/QueuePanelRow.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/queue-panel/QueueReorderList.js

@@ -0,0 +1,331 @@
+"use strict";
+
+import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { PanResponder, View } from 'react-native';
+import { webDataSet } from "../checkbox/shared.js";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '../dropdown-menu';
+import { RiArrowDownLine } from "../icons/remix/RiArrowDownLine.js";
+import { RiArrowUpLine } from "../icons/remix/RiArrowUpLine.js";
+import { RiCloseLine } from "../icons/remix/RiCloseLine.js";
+import { RiDeleteBinLine } from "../icons/remix/RiDeleteBinLine.js";
+import { RiDraggable } from "../icons/remix/RiDraggable.js";
+import { RiMoreFill } from "../icons/remix/RiMoreFill.js";
+import { useTheme } from "../theme/use-theme.js";
+import { QueueIconButton } from "./QueueIconButton.js";
+import { QueuePanelRow } from "./QueuePanelRow.js";
+import { IS_WEB, QUEUE_ROW_HEIGHT, queueDragShift, queueDragTarget, resolveQueuePanelPaint } from "./shared.js";
+
+/**
+ * A reorderable section of the queue.
+ *
+ * Three ways to move a row, all ending in one `onReorder(section, from, to)`:
+ *
+ *   drag      the handle (hover-revealed on web, always drawn on touch). The
+ *             row lifts under the pointer and its neighbours slide to show
+ *             where it lands; rows are a fixed 56 tall, so the landing index
+ *             is `from + round(dy / 56)` with no measuring.
+ *   keyboard  the focused handle answers ArrowUp / ArrowDown; native exposes
+ *             the same as "Move up" / "Move down" accessibility actions.
+ *   menu      the row's "More options" menu: Move up, Move down, Remove.
+ *
+ * Every move is announced ("Night Drive moved to position 2 of 5").
+ */
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+function QueueReorderRow({
+  track,
+  index,
+  count,
+  section,
+  labels,
+  paint,
+  drag,
+  target,
+  move,
+  onRemove,
+  onPlay,
+  onDragStart,
+  onDragMove,
+  onDragEnd,
+  registerHandle,
+  removeButton,
+  testID
+}) {
+  const [menuOpen, setMenuOpen] = useState(false);
+  const dragging = drag?.from === index;
+  const canUp = index > 0;
+  const canDown = index < count - 1;
+  const latest = useRef({
+    index,
+    onDragStart,
+    onDragMove,
+    onDragEnd,
+    enabled: !!move
+  });
+  latest.current = {
+    index,
+    onDragStart,
+    onDragMove,
+    onDragEnd,
+    enabled: !!move
+  };
+  const panResponder = useMemo(() => PanResponder.create({
+    onStartShouldSetPanResponder: () => latest.current.enabled,
+    onMoveShouldSetPanResponder: () => latest.current.enabled,
+    onPanResponderTerminationRequest: () => false,
+    onPanResponderGrant: () => latest.current.onDragStart(latest.current.index),
+    onPanResponderMove: (_e, g) => latest.current.onDragMove(g.dy),
+    onPanResponderRelease: () => latest.current.onDragEnd(true),
+    onPanResponderTerminate: () => latest.current.onDragEnd(false)
+  }), []);
+  const onKeyDown = useCallback(event => {
+    if (!move) return;
+    if (event.key === 'ArrowUp' && canUp) {
+      event.preventDefault();
+      move(index, index - 1);
+    } else if (event.key === 'ArrowDown' && canDown) {
+      event.preventDefault();
+      move(index, index + 1);
+    }
+  }, [move, index, canUp, canDown]);
+  const onAccessibilityAction = useCallback(event => {
+    if (!move) return;
+    if (event.nativeEvent.actionName === 'moveUp' && canUp) move(index, index - 1);else if (event.nativeEvent.actionName === 'moveDown' && canDown) move(index, index + 1);
+  }, [move, index, canUp, canDown]);
+  const offset = drag ? dragging ? drag.dy : queueDragShift(index, drag.from, target, QUEUE_ROW_HEIGHT) : 0;
+  const liftStyle = {
+    transform: [{
+      translateY: offset
+    }],
+    zIndex: dragging ? 1 : 0,
+    borderRadius: 8,
+    ...(dragging ? {
+      backgroundColor: paint.dragSurface,
+      boxShadow: paint.dragShadow
+    } : null),
+    ...(IS_WEB && drag && !dragging ? {
+      transitionProperty: 'transform',
+      transitionDuration: '120ms'
+    } : null)
+  };
+  const title = track.title;
+  const reveal = children => /*#__PURE__*/_jsx(View, {
+    ...webDataSet({
+      bloomQueueReveal: ''
+    }),
+    style: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 2
+    },
+    children: children
+  });
+  const trailing = reveal(/*#__PURE__*/_jsxs(_Fragment, {
+    children: [onRemove && removeButton ? /*#__PURE__*/_jsx(QueueIconButton, {
+      icon: RiCloseLine,
+      accessibilityLabel: `${labels.remove}: ${title}`,
+      onPress: () => onRemove(section, index, track),
+      testID: testID ? `${testID}-remove` : undefined
+    }) : null, move || onRemove ? /*#__PURE__*/_jsxs(DropdownMenu, {
+      open: menuOpen,
+      onOpenChange: setMenuOpen,
+      children: [/*#__PURE__*/_jsx(DropdownMenuTrigger, {
+        asChild: true,
+        label: labels.moreOptions(title),
+        children: /*#__PURE__*/_jsx(QueueIconButton, {
+          icon: RiMoreFill,
+          accessibilityLabel: labels.moreOptions(title),
+          testID: testID ? `${testID}-more` : undefined
+        })
+      }), /*#__PURE__*/_jsxs(DropdownMenuContent, {
+        align: "end",
+        label: labels.moreOptions(title),
+        children: [move ? /*#__PURE__*/_jsxs(_Fragment, {
+          children: [/*#__PURE__*/_jsx(DropdownMenuItem, {
+            disabled: !canUp,
+            leading: /*#__PURE__*/_jsx(RiArrowUpLine, {
+              width: 16,
+              height: 16,
+              fill: paint.textSecondary
+            }),
+            onPress: () => move(index, index - 1),
+            testID: testID ? `${testID}-move-up` : undefined,
+            children: labels.moveUp
+          }), /*#__PURE__*/_jsx(DropdownMenuItem, {
+            disabled: !canDown,
+            leading: /*#__PURE__*/_jsx(RiArrowDownLine, {
+              width: 16,
+              height: 16,
+              fill: paint.textSecondary
+            }),
+            onPress: () => move(index, index + 1),
+            testID: testID ? `${testID}-move-down` : undefined,
+            children: labels.moveDown
+          })]
+        }) : null, move && onRemove ? /*#__PURE__*/_jsx(DropdownMenuSeparator, {}) : null, onRemove ? /*#__PURE__*/_jsx(DropdownMenuItem, {
+          variant: "destructive",
+          leading: /*#__PURE__*/_jsx(RiDeleteBinLine, {
+            width: 16,
+            height: 16,
+            fill: paint.textSecondary
+          }),
+          onPress: () => onRemove(section, index, track),
+          testID: testID ? `${testID}-menu-remove` : undefined,
+          children: labels.remove
+        }) : null]
+      })]
+    }) : null, move ? /*#__PURE__*/_jsx(View, {
+      ref: node => registerHandle(track.id, node),
+      ...panResponder.panHandlers,
+      ...webDataSet({
+        bloomQueueHandle: '',
+        bloomQueueFocusable: ''
+      }),
+      ...(IS_WEB ? {
+        tabIndex: 0,
+        onKeyDown
+      } : null),
+      role: "button",
+      accessibilityLabel: labels.reorder(title),
+      accessibilityHint: labels.reorderHint,
+      accessibilityActions: [{
+        name: 'moveUp',
+        label: labels.moveUp
+      }, {
+        name: 'moveDown',
+        label: labels.moveDown
+      }],
+      onAccessibilityAction: onAccessibilityAction,
+      style: {
+        width: 24,
+        height: 32,
+        alignItems: 'center',
+        justifyContent: 'center',
+        borderRadius: 6
+      },
+      testID: testID ? `${testID}-handle` : undefined,
+      children: /*#__PURE__*/_jsx(RiDraggable, {
+        width: 16,
+        height: 16,
+        fill: paint.textSecondary
+      })
+    }) : null]
+  }));
+  return /*#__PURE__*/_jsx(View, {
+    role: "listitem",
+    style: liftStyle,
+    children: /*#__PURE__*/_jsx(QueuePanelRow, {
+      track: track,
+      highlighted: menuOpen || dragging,
+      webState: dragging ? 'dragging' : menuOpen ? 'active' : undefined,
+      accessibilityLabel: `${labels.play} ${title}`,
+      onPress: onPlay ? () => onPlay(section, index, track) : undefined,
+      trailing: trailing,
+      testID: testID
+    })
+  });
+}
+function QueueReorderListComponent({
+  section,
+  tracks,
+  labels,
+  onReorder,
+  onRemove,
+  onPlay,
+  onDragActiveChange,
+  onAnnounce,
+  removeButton = true,
+  testID
+}) {
+  const theme = useTheme();
+  const paint = useMemo(() => resolveQueuePanelPaint(theme), [theme]);
+  const [drag, setDrag] = useState(null);
+  const count = tracks.length;
+  const target = drag ? queueDragTarget(drag.from, drag.dy, QUEUE_ROW_HEIGHT, count) : -1;
+  const handles = useRef(new Map());
+  const pendingFocus = useRef(null);
+  const registerHandle = useCallback((id, node) => {
+    if (node) handles.current.set(id, node);else handles.current.delete(id);
+  }, []);
+
+  // A keyboard move re-orders the DOM, which blurs the moved handle; put focus back.
+  useEffect(() => {
+    const id = pendingFocus.current;
+    if (!id) return;
+    pendingFocus.current = null;
+    const node = handles.current.get(id);
+    node?.focus?.();
+  }, [tracks]);
+  const tracksRef = useRef(tracks);
+  tracksRef.current = tracks;
+  const move = useCallback((from, to) => {
+    const list = tracksRef.current;
+    const track = list[from];
+    if (!onReorder || !track || to < 0 || to >= list.length || to === from) return;
+    pendingFocus.current = track.id;
+    onReorder(section, from, to);
+    onAnnounce?.(labels.moved(track.title, to + 1, list.length));
+  }, [onReorder, onAnnounce, labels, section]);
+  const dragRef = useRef(null);
+  const onDragStart = useCallback(index => {
+    dragRef.current = {
+      from: index,
+      dy: 0
+    };
+    setDrag(dragRef.current);
+    onDragActiveChange?.(true);
+  }, [onDragActiveChange]);
+  const onDragMove = useCallback(dy => {
+    if (!dragRef.current) return;
+    // The row travels no further than the first and last slot of its own section.
+    const {
+      from
+    } = dragRef.current;
+    const max = (tracksRef.current.length - 1 - from) * QUEUE_ROW_HEIGHT;
+    const clamped = Math.min(max, Math.max(-from * QUEUE_ROW_HEIGHT, dy));
+    dragRef.current = {
+      ...dragRef.current,
+      dy: clamped
+    };
+    setDrag(dragRef.current);
+  }, []);
+  const onDragEnd = useCallback(commit => {
+    const current = dragRef.current;
+    dragRef.current = null;
+    setDrag(null);
+    onDragActiveChange?.(false);
+    if (!commit || !current) return;
+    const to = queueDragTarget(current.from, current.dy, QUEUE_ROW_HEIGHT, tracksRef.current.length);
+    if (to !== current.from) {
+      pendingFocus.current = null;
+      const track = tracksRef.current[current.from];
+      onReorder?.(section, current.from, to);
+      if (track) onAnnounce?.(labels.moved(track.title, to + 1, tracksRef.current.length));
+    }
+  }, [onDragActiveChange, onReorder, onAnnounce, labels, section]);
+  return /*#__PURE__*/_jsx(View, {
+    role: "list",
+    testID: testID,
+    children: tracks.map((track, index) => /*#__PURE__*/_jsx(QueueReorderRow, {
+      track: track,
+      index: index,
+      count: count,
+      section: section,
+      labels: labels,
+      paint: paint,
+      drag: drag,
+      target: target,
+      move: onReorder ? move : undefined,
+      onRemove: onRemove,
+      onPlay: onPlay,
+      onDragStart: onDragStart,
+      onDragMove: onDragMove,
+      onDragEnd: onDragEnd,
+      registerHandle: registerHandle,
+      removeButton: removeButton,
+      testID: testID ? `${testID}-row-${index}` : undefined
+    }, track.id))
+  });
+}
+export const QueueReorderList = /*#__PURE__*/memo(QueueReorderListComponent);
+QueueReorderList.displayName = 'QueueReorderList';
+//# sourceMappingURL=QueueReorderList.js.map

package/lib/module/queue-panel/QueueReorderList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useCallback","useEffect","useMemo","useRef","useState","PanResponder","View","webDataSet","DropdownMenu","DropdownMenuContent","DropdownMenuItem","DropdownMenuSeparator","DropdownMenuTrigger","RiArrowDownLine","RiArrowUpLine","RiCloseLine","RiDeleteBinLine","RiDraggable","RiMoreFill","useTheme","QueueIconButton","QueuePanelRow","IS_WEB","QUEUE_ROW_HEIGHT","queueDragShift","queueDragTarget","resolveQueuePanelPaint","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","QueueReorderRow","track","index","count","section","labels","paint","drag","target","move","onRemove","onPlay","onDragStart","onDragMove","onDragEnd","registerHandle","removeButton","testID","menuOpen","setMenuOpen","dragging","from","canUp","canDown","latest","enabled","current","panResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderTerminationRequest","onPanResponderGrant","onPanResponderMove","_e","g","dy","onPanResponderRelease","onPanResponderTerminate","onKeyDown","event","key","preventDefault","onAccessibilityAction","nativeEvent","actionName","offset","liftStyle","transform","translateY","zIndex","borderRadius","backgroundColor","dragSurface","boxShadow","dragShadow","transitionProperty","transitionDuration","title","reveal","children","bloomQueueReveal","style","flexDirection","alignItems","gap","trailing","icon","accessibilityLabel","remove","onPress","undefined","open","onOpenChange","asChild","label","moreOptions","align","disabled","leading","width","height","fill","textSecondary","moveUp","moveDown","variant","ref","node","id","panHandlers","bloomQueueHandle","bloomQueueFocusable","tabIndex","role","reorder","accessibilityHint","reorderHint","accessibilityActions","name","justifyContent","highlighted","webState","play","QueueReorderListComponent","tracks","onReorder","onDragActiveChange","onAnnounce","theme","setDrag","length","handles","Map","pendingFocus","set","delete","get","focus","tracksRef","to","list","moved","dragRef","max","clamped","Math","min","commit","map","QueueReorderList","displayName"],"sourceRoot":"../../../src","sources":["queue-panel/QueueReorderList.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/queue-panel/RecentlyPlayedList.js

@@ -0,0 +1,64 @@
+"use strict";
+
+import React, { memo, useMemo } from 'react';
+import { View } from 'react-native';
+import { useTheme } from "../theme/use-theme.js";
+import { Text } from "../typography/index.js";
+import { QueuePanelRow } from "./QueuePanelRow.js";
+import { DEFAULT_QUEUE_PANEL_LABELS, resolveQueuePanelPaint } from "./shared.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * The listening history: plain `QueuePanelRow`s, newest first, each pressable to
+ * play again, with the app's "when" string (`meta`) at the trailing edge. The
+ * loaded track (`currentId`) takes the accent title and the now-playing bars.
+ * An empty list draws one secondary line.
+ */
+function RecentlyPlayedListComponent({
+  items,
+  onPlay,
+  currentId,
+  playing = true,
+  labels,
+  style,
+  testID
+}) {
+  const theme = useTheme();
+  const paint = useMemo(() => resolveQueuePanelPaint(theme), [theme]);
+  const play = labels?.play ?? DEFAULT_QUEUE_PANEL_LABELS.play;
+  if (items.length === 0) {
+    return /*#__PURE__*/_jsx(View, {
+      style: [{
+        paddingTop: 24,
+        paddingBottom: 24,
+        alignItems: 'center'
+      }, style],
+      testID: testID,
+      children: /*#__PURE__*/_jsx(Text, {
+        variant: "body-regular",
+        style: {
+          color: paint.textSecondary
+        },
+        children: labels?.emptyRecent ?? DEFAULT_QUEUE_PANEL_LABELS.emptyRecent
+      })
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    role: "list",
+    style: style,
+    testID: testID,
+    children: items.map((track, index) => /*#__PURE__*/_jsx(View, {
+      role: "listitem",
+      children: /*#__PURE__*/_jsx(QueuePanelRow, {
+        track: track,
+        current: track.id === currentId,
+        playing: playing,
+        accessibilityLabel: `${play} ${track.title}`,
+        onPress: onPlay ? () => onPlay(index, track) : undefined,
+        testID: testID ? `${testID}-row-${index}` : undefined
+      })
+    }, `${track.id}-${index}`))
+  });
+}
+export const RecentlyPlayedList = /*#__PURE__*/memo(RecentlyPlayedListComponent);
+RecentlyPlayedList.displayName = 'RecentlyPlayedList';
+//# sourceMappingURL=RecentlyPlayedList.js.map

package/lib/module/queue-panel/RecentlyPlayedList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useMemo","View","useTheme","Text","QueuePanelRow","DEFAULT_QUEUE_PANEL_LABELS","resolveQueuePanelPaint","jsx","_jsx","RecentlyPlayedListComponent","items","onPlay","currentId","playing","labels","style","testID","theme","paint","play","length","paddingTop","paddingBottom","alignItems","children","variant","color","textSecondary","emptyRecent","role","map","track","index","current","id","accessibilityLabel","title","onPress","undefined","RecentlyPlayedList","displayName"],"sourceRoot":"../../../src","sources":["queue-panel/RecentlyPlayedList.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAC5C,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,QAAQ,QAAQ,uBAAoB;AAC7C,SAASC,IAAI,QAAQ,wBAAe;AACpC,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,0BAA0B,EAAEC,sBAAsB,QAAQ,aAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG9E;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,2BAA2BA,CAAC;EACnCC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,OAAO,GAAG,IAAI;EACdC,MAAM;EACNC,KAAK;EACLC;AACuB,CAAC,EAAE;EAC1B,MAAMC,KAAK,GAAGf,QAAQ,CAAC,CAAC;EACxB,MAAMgB,KAAK,GAAGlB,OAAO,CAAC,MAAMM,sBAAsB,CAACW,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EACnE,MAAME,IAAI,GAAGL,MAAM,EAAEK,IAAI,IAAId,0BAA0B,CAACc,IAAI;EAE5D,IAAIT,KAAK,CAACU,MAAM,KAAK,CAAC,EAAE;IACtB,oBACEZ,IAAA,CAACP,IAAI;MAACc,KAAK,EAAE,CAAC;QAAEM,UAAU,EAAE,EAAE;QAAEC,aAAa,EAAE,EAAE;QAAEC,UAAU,EAAE;MAAS,CAAC,EAAER,KAAK,CAAE;MAACC,MAAM,EAAEA,MAAO;MAAAQ,QAAA,eAChGhB,IAAA,CAACL,IAAI;QAACsB,OAAO,EAAC,cAAc;QAACV,KAAK,EAAE;UAAEW,KAAK,EAAER,KAAK,CAACS;QAAc,CAAE;QAAAH,QAAA,EAChEV,MAAM,EAAEc,WAAW,IAAIvB,0BAA0B,CAACuB;MAAW,CAC1D;IAAC,CACH,CAAC;EAEX;EAEA,oBACEpB,IAAA,CAACP,IAAI;IAAC4B,IAAI,EAAC,MAAM;IAACd,KAAK,EAAEA,KAAM;IAACC,MAAM,EAAEA,MAAO;IAAAQ,QAAA,EAC5Cd,KAAK,CAACoB,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,kBACtBxB,IAAA,CAACP,IAAI;MAA8B4B,IAAI,EAAC,UAAU;MAAAL,QAAA,eAChDhB,IAAA,CAACJ,aAAa;QACZ2B,KAAK,EAAEA,KAAM;QACbE,OAAO,EAAEF,KAAK,CAACG,EAAE,KAAKtB,SAAU;QAChCC,OAAO,EAAEA,OAAQ;QACjBsB,kBAAkB,EAAE,GAAGhB,IAAI,IAAIY,KAAK,CAACK,KAAK,EAAG;QAC7CC,OAAO,EAAE1B,MAAM,GAAG,MAAMA,MAAM,CAACqB,KAAK,EAAED,KAAK,CAAC,GAAGO,SAAU;QACzDtB,MAAM,EAAEA,MAAM,GAAG,GAAGA,MAAM,QAAQgB,KAAK,EAAE,GAAGM;MAAU,CACvD;IAAC,GARO,GAAGP,KAAK,CAACG,EAAE,IAAIF,KAAK,EASzB,CACP;EAAC,CACE,CAAC;AAEX;AAEA,OAAO,MAAMO,kBAAkB,gBAAGxC,IAAI,CAACU,2BAA2B,CAAC;AACnE8B,kBAAkB,CAACC,WAAW,GAAG,oBAAoB","ignoreList":[]}

package/lib/module/queue-panel/index.js

@@ -0,0 +1,7 @@
+"use strict";
+
+export { QueuePanel } from "./QueuePanel.js";
+export { QueuePanelRow } from "./QueuePanelRow.js";
+export { RecentlyPlayedList } from "./RecentlyPlayedList.js";
+export { DEFAULT_QUEUE_PANEL_LABELS, QUEUE_ROW_HEIGHT, moveQueueItem, queueDragShift, queueDragTarget } from "./shared.js";
+//# sourceMappingURL=index.js.map

package/lib/module/queue-panel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["QueuePanel","QueuePanelRow","RecentlyPlayedList","DEFAULT_QUEUE_PANEL_LABELS","QUEUE_ROW_HEIGHT","moveQueueItem","queueDragShift","queueDragTarget"],"sourceRoot":"../../../src","sources":["queue-panel/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,kBAAkB,QAAQ,yBAAsB;AACzD,SACEC,0BAA0B,EAC1BC,gBAAgB,EAChBC,aAAa,EACbC,cAAc,EACdC,eAAe,QACV,aAAU","ignoreList":[]}