@layers-app/shared 0.4.1 → 0.4.3

package/dist/components/MusicPlayerBar/MusicPlayerBar.js

@@ -0,0 +1,239 @@
+import { jsxs as p, Fragment as Z, jsx as r } from "react/jsx-runtime";
+import { useCallback as a } from "react";
+import { useMediaQuery as O, useDisclosure as x } from "@mantine/hooks";
+import { HiddenAudio as ee } from "./components/HiddenAudio.js";
+import { HoverActions as oe } from "./components/HoverActions.js";
+import { MobileActionsDrawer as te } from "./components/MobileActionsDrawer.js";
+import { MobileSpeedDrawer as re } from "./components/MobileSpeedDrawer.js";
+import { MobileTailControls as ae } from "./components/MobileTailControls.js";
+import { PlayButton as ne } from "./components/PlayButton.js";
+import { SpeedPopover as le } from "./components/SpeedPopover.js";
+import { Timer as ie } from "./components/Timer.js";
+import { VolumePopover as de } from "./components/VolumePopover.js";
+import { Waveform as se } from "./components/Waveform.js";
+import { TOUCH_DEVICE_QUERY as pe, TOUCH_TABLET_QUERY as ce, HOVER_CAPABLE_QUERY as me, DEFAULT_RATES as ue, SPEED_POPOVER_CLOSE_DELAY_MS as fe, SPEED_POPOVER_OPEN_DELAY_MS as ve, VOLUME_POPOVER_CLOSE_DELAY_MS as be, VOLUME_POPOVER_OPEN_DELAY_MS as Le } from "./constants.js";
+import { downloadByUrl as Ee, resolveDownloadFileName as De } from "./helpers.js";
+import { useAudioPlayback as he } from "./hooks/useAudioPlayback.js";
+import { useCopyFeedback as Pe } from "./hooks/useCopyFeedback.js";
+import { useHoverPopover as B } from "./hooks/useHoverPopover.js";
+import { useMusicPlayerLabels as Se } from "./hooks/useMusicPlayerLabels.js";
+import { useWaveform as Te } from "./hooks/useWaveform.js";
+import c from "./MusicPlayerBar.module.css.js";
+function We({
+  src: n,
+  duration: H,
+  playbackRates: i = ue,
+  initialVolume: N = 1,
+  waveformHeights: Y,
+  disable: m = !1,
+  showDelete: u = !0,
+  showDownload: f = !0,
+  showCopyLink: v = !0,
+  onDelete: b,
+  onDownload: L,
+  onCopyLink: _,
+  onCopyError: C,
+  extraActions: y
+}) {
+  const o = Se(), l = O(pe, !1), I = O(ce, !1), F = O(me, !0), e = he({
+    durationProp: H,
+    initialVolume: N,
+    playbackRates: i
+  }), E = Te(Y), d = B(
+    ve,
+    fe
+  ), D = B(
+    Le,
+    be
+  ), { linkCopied: g, markCopied: A } = Pe(), [
+    Q,
+    { open: M, close: h }
+  ] = x(!1), [
+    j,
+    { open: w, close: P }
+  ] = x(!1), W = a(
+    (t) => {
+      const s = e.audioRef.current;
+      if (!s || !e.duration) return;
+      const U = t * e.duration;
+      s.currentTime = U, e.setCurrentTime(U);
+    },
+    [e]
+  ), $ = a(
+    (t) => {
+      e.selectRate(t), d.setOpened(!1);
+    },
+    [e, d]
+  ), R = a(
+    (t) => {
+      if (t.stopPropagation(), t.preventDefault(), L) {
+        L();
+        return;
+      }
+      Ee(n, De(n));
+    },
+    [L, n]
+  ), k = a(
+    (t) => {
+      t.stopPropagation(), t.preventDefault();
+      const s = _ ?? (() => navigator.clipboard.writeText(n));
+      Promise.resolve(s()).then(
+        () => A(),
+        () => C?.()
+      );
+    },
+    [_, C, n, A]
+  ), V = a(() => {
+    b?.();
+  }, [b]), q = a(() => {
+    h(), w();
+  }, [h, w]), z = a(() => {
+    P(), M();
+  }, [P, M]), G = a(
+    (t) => e.selectRate(t),
+    [e]
+  ), J = e.duration > 0 ? e.currentTime / e.duration : 0, K = Math.round(J * E.barCount), X = i[e.rateIndex] ?? 1, S = !!b, T = f || v || u && S || !!y;
+  return /* @__PURE__ */ p(Z, { children: [
+    /* @__PURE__ */ r(
+      ee,
+      {
+        audioRef: e.audioRef,
+        src: n,
+        onLoadedMetadata: e.handleLoadedMetadata,
+        onEnded: e.handleEnded,
+        onTimeUpdate: e.setCurrentTime
+      }
+    ),
+    /* @__PURE__ */ p(
+      "div",
+      {
+        "data-testid": "music-player-bar",
+        className: `${c.bar} music-player-bar`,
+        "data-popovers-open": d.opened || D.opened || void 0,
+        "data-volume-open": D.opened || void 0,
+        "data-hover-actions-reduced": m || void 0,
+        children: [
+          /* @__PURE__ */ r(
+            ne,
+            {
+              playing: e.playing,
+              onToggle: e.togglePlay,
+              playLabel: o.play,
+              pauseLabel: o.pause
+            }
+          ),
+          /* @__PURE__ */ r(
+            ie,
+            {
+              currentTime: e.currentTime,
+              duration: e.duration,
+              label: o.timeDisplay
+            }
+          ),
+          /* @__PURE__ */ r(
+            se,
+            {
+              clipRef: E.clipRef,
+              heights: E.heights,
+              activeBar: K,
+              currentTime: e.currentTime,
+              duration: e.duration,
+              label: o.waveformSeek,
+              onSeek: W
+            }
+          ),
+          /* @__PURE__ */ p("div", { className: c.tailRail, children: [
+            l ? /* @__PURE__ */ r(
+              ae,
+              {
+                currentRate: X,
+                showMore: T,
+                speedLabel: o.playbackSpeed,
+                moreLabel: o.more,
+                onOpenSpeedDrawer: q,
+                onOpenActionsDrawer: z
+              }
+            ) : /* @__PURE__ */ p("div", { className: c.tail, children: [
+              /* @__PURE__ */ r(
+                le,
+                {
+                  popover: d,
+                  rates: i,
+                  currentIndex: e.rateIndex,
+                  label: o.playbackSpeed,
+                  onSelect: $
+                }
+              ),
+              /* @__PURE__ */ r(
+                de,
+                {
+                  popover: D,
+                  volume: e.volume,
+                  muted: e.muted,
+                  isTouchTablet: I,
+                  muteLabel: o.mute,
+                  unmuteLabel: o.unmute,
+                  volumeLabel: o.volume,
+                  onToggleMute: e.toggleMuted,
+                  onVolumeChange: e.handleVolumeChange
+                }
+              )
+            ] }),
+            !l && /* @__PURE__ */ r("div", { className: c.tailSpacer, "aria-hidden": !0 })
+          ] }),
+          !l && T && /* @__PURE__ */ r(
+            oe,
+            {
+              disable: m,
+              linkCopied: g,
+              showDownload: f,
+              showCopyLink: v,
+              showDelete: u,
+              hasDelete: S,
+              tooltipsDisabled: !F,
+              downloadLabel: o.download,
+              copyLinkLabel: o.copyLink,
+              deleteLabel: o.delete,
+              onDownload: R,
+              onCopyLink: k,
+              onDelete: V,
+              extraActions: y
+            }
+          )
+        ]
+      }
+    ),
+    l && /* @__PURE__ */ r(
+      re,
+      {
+        opened: j,
+        rates: i,
+        currentIndex: e.rateIndex,
+        title: o.playbackSpeed,
+        onSelect: G,
+        onClose: P
+      }
+    ),
+    l && T && /* @__PURE__ */ r(
+      te,
+      {
+        opened: Q,
+        title: o.mobileActionsTitle,
+        linkCopied: g,
+        showDownload: f,
+        showCopyLink: v,
+        showDelete: u && S && !m,
+        downloadLabel: o.download,
+        copyLinkLabel: o.copyLink,
+        deleteLabel: o.delete,
+        onDownload: R,
+        onCopyLink: k,
+        onDelete: V,
+        onClose: h
+      }
+    )
+  ] });
+}
+export {
+  We as MusicPlayerBar
+};

package/dist/components/MusicPlayerBar/MusicPlayerBar.module.css.js

@@ -0,0 +1,49 @@
+const e = "_bar_1vkxh_1", t = "_waveformClip_1vkxh_34", o = "_waveform_1vkxh_34", _ = "_tailRail_1vkxh_53", s = "_tail_1vkxh_53", n = "_tailSpacer_1vkxh_69", v = "_hoverActions_1vkxh_88", i = "_stem_1vkxh_119", c = "_stemActive_1vkxh_126", p = "_stemInactive_1vkxh_131", r = "_playBtn_1vkxh_136", a = "_timer_1vkxh_141", h = "_speedTrigger_1vkxh_146", l = "_speedChip_1vkxh_163", d = "_speedChipActive_1vkxh_183", m = "_speedLabel_1vkxh_191", x = "_volumeDropdown_1vkxh_197", k = "_volumeSlider_1vkxh_205", w = "_speedDropdown_1vkxh_228", A = "_ghostDropdown_1vkxh_240", g = "_hoverActionItem_1vkxh_248", C = "_actionIconBtn_1vkxh_261", D = {
+  bar: e,
+  waveformClip: t,
+  waveform: o,
+  tailRail: _,
+  tail: s,
+  tailSpacer: n,
+  hoverActions: v,
+  stem: i,
+  stemActive: c,
+  stemInactive: p,
+  playBtn: r,
+  timer: a,
+  speedTrigger: h,
+  speedChip: l,
+  speedChipActive: d,
+  speedLabel: m,
+  volumeDropdown: x,
+  volumeSlider: k,
+  speedDropdown: w,
+  ghostDropdown: A,
+  hoverActionItem: g,
+  actionIconBtn: C
+};
+export {
+  C as actionIconBtn,
+  e as bar,
+  D as default,
+  A as ghostDropdown,
+  g as hoverActionItem,
+  v as hoverActions,
+  r as playBtn,
+  l as speedChip,
+  d as speedChipActive,
+  w as speedDropdown,
+  m as speedLabel,
+  h as speedTrigger,
+  i as stem,
+  c as stemActive,
+  p as stemInactive,
+  s as tail,
+  _ as tailRail,
+  n as tailSpacer,
+  a as timer,
+  x as volumeDropdown,
+  k as volumeSlider,
+  o as waveform,
+  t as waveformClip
+};

package/dist/components/MusicPlayerBar/components/HiddenAudio.d.ts

@@ -0,0 +1,10 @@
+type Props = {
+    audioRef: React.MutableRefObject<HTMLAudioElement | null>;
+    src: string;
+    onLoadedMetadata: () => void;
+    onEnded: () => void;
+    onTimeUpdate: (value: number) => void;
+};
+export declare function HiddenAudio({ audioRef, src, onLoadedMetadata, onEnded, onTimeUpdate, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=HiddenAudio.d.ts.map

package/dist/components/MusicPlayerBar/components/HiddenAudio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HiddenAudio.d.ts","sourceRoot":"","sources":["../../../../src/components/MusicPlayerBar/components/HiddenAudio.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,KAAK,CAAC,gBAAgB,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC1D,GAAG,EAAE,MAAM,CAAC;IACZ,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,GAAG,EACH,gBAAgB,EAChB,OAAO,EACP,YAAY,GACb,EAAE,KAAK,2CAuBP"}

package/dist/components/MusicPlayerBar/components/HiddenAudio.js

@@ -0,0 +1,35 @@
+import { jsx as a } from "react/jsx-runtime";
+import { useCallback as p } from "react";
+function m({
+  audioRef: t,
+  src: o,
+  onLoadedMetadata: r,
+  onEnded: i,
+  onTimeUpdate: e
+}) {
+  const n = p(() => {
+    e(t.current?.currentTime ?? 0);
+  }, [t, e]);
+  return /* @__PURE__ */ a(
+    "audio",
+    {
+      ref: t,
+      src: o,
+      title: "",
+      onLoadedMetadata: r,
+      onTimeUpdate: n,
+      onEnded: i,
+      preload: "metadata",
+      style: {
+        position: "absolute",
+        width: 0,
+        height: 0,
+        opacity: 0,
+        pointerEvents: "none"
+      }
+    }
+  );
+}
+export {
+  m as HiddenAudio
+};

package/dist/components/MusicPlayerBar/components/HoverActions.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+type Props = {
+    disable: boolean;
+    linkCopied: boolean;
+    showDownload: boolean;
+    showCopyLink: boolean;
+    showDelete: boolean;
+    hasDelete: boolean;
+    tooltipsDisabled: boolean;
+    downloadLabel: string;
+    copyLinkLabel: string;
+    deleteLabel: string;
+    onDownload: (e: React.MouseEvent) => void;
+    onCopyLink: (e: React.MouseEvent) => void;
+    onDelete: () => void;
+    extraActions?: ReactNode;
+};
+export declare function HoverActions({ disable, linkCopied, showDownload, showCopyLink, showDelete, hasDelete, tooltipsDisabled, downloadLabel, copyLinkLabel, deleteLabel, onDownload, onCopyLink, onDelete, extraActions, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=HoverActions.d.ts.map

package/dist/components/MusicPlayerBar/components/HoverActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoverActions.d.ts","sourceRoot":"","sources":["../../../../src/components/MusicPlayerBar/components/HoverActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAavC,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B,CAAC;AAoCF,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,SAAS,EACT,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,UAAU,EACV,QAAQ,EACR,YAAY,GACb,EAAE,KAAK,2CA2CP"}

package/dist/components/MusicPlayerBar/components/HoverActions.js

@@ -0,0 +1,88 @@
+import { jsxs as h, jsx as o } from "react/jsx-runtime";
+import { Download01Icon as A, Tick02Icon as g, Link02Icon as x, Delete03Icon as C } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as k } from "@hugeicons/react";
+import { Tooltip as D, ActionIcon as w } from "@mantine/core";
+import m from "../MusicPlayerBar.module.css.js";
+function l({
+  label: n,
+  ariaLabel: r,
+  tooltipDisabled: i,
+  icon: e,
+  iconColor: t,
+  onClick: c
+}) {
+  return /* @__PURE__ */ o(D, { label: n, disabled: i, withArrow: !0, children: /* @__PURE__ */ o("div", { className: m.hoverActionItem, children: /* @__PURE__ */ o(
+    w,
+    {
+      variant: "transparent",
+      size: 28,
+      "aria-label": r,
+      onClick: c,
+      className: m.actionIconBtn,
+      children: /* @__PURE__ */ o(k, { icon: e, size: 16, color: t })
+    }
+  ) }) });
+}
+function H({
+  disable: n,
+  linkCopied: r,
+  showDownload: i,
+  showCopyLink: e,
+  showDelete: t,
+  hasDelete: c,
+  tooltipsDisabled: a,
+  downloadLabel: s,
+  copyLinkLabel: v,
+  deleteLabel: p,
+  onDownload: b,
+  onCopyLink: d,
+  onDelete: u,
+  extraActions: I
+}) {
+  return /* @__PURE__ */ h(
+    "div",
+    {
+      className: m.hoverActions,
+      onPointerDown: (f) => f.stopPropagation(),
+      children: [
+        i && /* @__PURE__ */ o(
+          l,
+          {
+            label: s,
+            ariaLabel: s,
+            tooltipDisabled: a,
+            icon: A,
+            iconColor: "var(--mantine-color-gray-text)",
+            onClick: b
+          }
+        ),
+        e && /* @__PURE__ */ o(
+          l,
+          {
+            label: v,
+            ariaLabel: v,
+            tooltipDisabled: a,
+            icon: r ? g : x,
+            iconColor: r ? "var(--mantine-color-green-6)" : "var(--mantine-color-gray-text)",
+            onClick: d
+          }
+        ),
+        t && c && !n && /* @__PURE__ */ o(
+          l,
+          {
+            label: p,
+            ariaLabel: "remove-music-block",
+            tooltipDisabled: a,
+            icon: C,
+            iconColor: "var(--mantine-color-red-5)",
+            onClick: u
+          }
+        ),
+        I
+      ]
+    }
+  );
+}
+export {
+  H as HoverActions
+};

package/dist/components/MusicPlayerBar/components/MobileActionsDrawer.d.ts

@@ -0,0 +1,18 @@
+type Props = {
+    opened: boolean;
+    title: string;
+    linkCopied: boolean;
+    showDownload: boolean;
+    showCopyLink: boolean;
+    showDelete: boolean;
+    downloadLabel: string;
+    copyLinkLabel: string;
+    deleteLabel: string;
+    onDownload: (e: React.MouseEvent) => void;
+    onCopyLink: (e: React.MouseEvent) => void;
+    onDelete: () => void;
+    onClose: () => void;
+};
+export declare function MobileActionsDrawer({ opened, title, linkCopied, showDownload, showCopyLink, showDelete, downloadLabel, copyLinkLabel, deleteLabel, onDownload, onCopyLink, onDelete, onClose, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MobileActionsDrawer.d.ts.map

package/dist/components/MusicPlayerBar/components/MobileActionsDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileActionsDrawer.d.ts","sourceRoot":"","sources":["../../../../src/components/MusicPlayerBar/components/MobileActionsDrawer.tsx"],"names":[],"mappings":"AASA,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,UAAU,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC1C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,KAAK,EACL,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,UAAU,EACV,QAAQ,EACR,OAAO,GACR,EAAE,KAAK,2CAyEP"}

package/dist/components/MusicPlayerBar/components/MobileActionsDrawer.js

@@ -0,0 +1,91 @@
+import { jsx as t, jsxs as y } from "react/jsx-runtime";
+import { Download01Icon as k, Tick02Icon as v, Link02Icon as x, Delete03Icon as j } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as i } from "@hugeicons/react";
+import { Drawer as I, Stack as g, Button as e } from "@mantine/core";
+function W({
+  opened: n,
+  title: c,
+  linkCopied: l,
+  showDownload: a,
+  showCopyLink: u,
+  showDelete: f,
+  downloadLabel: m,
+  copyLinkLabel: d,
+  deleteLabel: s,
+  onDownload: p,
+  onCopyLink: b,
+  onDelete: h,
+  onClose: o
+}) {
+  return /* @__PURE__ */ t(I, { opened: n, onClose: o, position: "bottom", title: c, children: /* @__PURE__ */ y(g, { gap: 4, p: 0, children: [
+    a && /* @__PURE__ */ t(
+      e,
+      {
+        type: "button",
+        variant: "subtle",
+        color: "gray",
+        fullWidth: !0,
+        justify: "flex-start",
+        onClick: (r) => {
+          o(), p(r);
+        },
+        leftSection: /* @__PURE__ */ t(
+          i,
+          {
+            icon: k,
+            size: 16,
+            color: "var(--mantine-color-dimmed)"
+          }
+        ),
+        children: m
+      }
+    ),
+    u && /* @__PURE__ */ t(
+      e,
+      {
+        type: "button",
+        variant: "subtle",
+        color: "gray",
+        fullWidth: !0,
+        justify: "flex-start",
+        onClick: (r) => {
+          o(), b(r);
+        },
+        leftSection: /* @__PURE__ */ t(
+          i,
+          {
+            icon: l ? v : x,
+            size: 16,
+            color: "var(--mantine-color-dimmed)"
+          }
+        ),
+        children: d
+      }
+    ),
+    f && /* @__PURE__ */ t(
+      e,
+      {
+        type: "button",
+        variant: "subtle",
+        color: "red",
+        fullWidth: !0,
+        justify: "flex-start",
+        onClick: () => {
+          o(), h();
+        },
+        leftSection: /* @__PURE__ */ t(
+          i,
+          {
+            icon: j,
+            size: 16,
+            color: "var(--mantine-color-red-6)"
+          }
+        ),
+        children: s
+      }
+    )
+  ] }) });
+}
+export {
+  W as MobileActionsDrawer
+};

package/dist/components/MusicPlayerBar/components/MobileSpeedDrawer.d.ts

@@ -0,0 +1,11 @@
+type Props = {
+    opened: boolean;
+    rates: readonly number[];
+    currentIndex: number;
+    title: string;
+    onSelect: (index: number) => void;
+    onClose: () => void;
+};
+export declare function MobileSpeedDrawer({ opened, rates, currentIndex, title, onSelect, onClose, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MobileSpeedDrawer.d.ts.map

package/dist/components/MusicPlayerBar/components/MobileSpeedDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileSpeedDrawer.d.ts","sourceRoot":"","sources":["../../../../src/components/MusicPlayerBar/components/MobileSpeedDrawer.tsx"],"names":[],"mappings":"AAIA,KAAK,KAAK,GAAG;IACX,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,KAAK,EACL,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,OAAO,GACR,EAAE,KAAK,2CA6BP"}

package/dist/components/MusicPlayerBar/components/MobileSpeedDrawer.js

@@ -0,0 +1,38 @@
+import { jsx as t, jsxs as m } from "react/jsx-runtime";
+import { Tick02Icon as s } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as a } from "@hugeicons/react";
+import { Drawer as f, Stack as d, Button as h } from "@mantine/core";
+function k({
+  opened: e,
+  rates: c,
+  currentIndex: l,
+  title: p,
+  onSelect: u,
+  onClose: o
+}) {
+  return /* @__PURE__ */ t(f, { opened: e, onClose: o, position: "bottom", title: p, children: /* @__PURE__ */ t(d, { gap: 4, p: 0, children: c.map((r, i) => {
+    const n = i === l;
+    return /* @__PURE__ */ m(
+      h,
+      {
+        type: "button",
+        variant: "subtle",
+        color: n ? void 0 : "gray",
+        fullWidth: !0,
+        justify: "flex-start",
+        onClick: () => {
+          u(i), o();
+        },
+        rightSection: n ? /* @__PURE__ */ t(a, { icon: s, size: 16 }) : null,
+        children: [
+          r,
+          "x"
+        ]
+      },
+      r
+    );
+  }) }) });
+}
+export {
+  k as MobileSpeedDrawer
+};

package/dist/components/MusicPlayerBar/components/MobileTailControls.d.ts

@@ -0,0 +1,11 @@
+type Props = {
+    currentRate: number;
+    showMore: boolean;
+    speedLabel: string;
+    moreLabel: string;
+    onOpenSpeedDrawer: () => void;
+    onOpenActionsDrawer: () => void;
+};
+export declare function MobileTailControls({ currentRate, showMore, speedLabel, moreLabel, onOpenSpeedDrawer, onOpenActionsDrawer, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=MobileTailControls.d.ts.map

package/dist/components/MusicPlayerBar/components/MobileTailControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileTailControls.d.ts","sourceRoot":"","sources":["../../../../src/components/MusicPlayerBar/components/MobileTailControls.tsx"],"names":[],"mappings":"AAMA,KAAK,KAAK,GAAG;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,WAAW,EACX,QAAQ,EACR,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,mBAAmB,GACpB,EAAE,KAAK,2CA4BP"}

package/dist/components/MusicPlayerBar/components/MobileTailControls.js

@@ -0,0 +1,50 @@
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { MoreHorizontalIcon as s } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as m } from "@hugeicons/react";
+import { UnstyledButton as p, ActionIcon as d } from "@mantine/core";
+import i from "../MusicPlayerBar.module.css.js";
+function y({
+  currentRate: t,
+  showMore: e,
+  speedLabel: l,
+  moreLabel: n,
+  onOpenSpeedDrawer: a,
+  onOpenActionsDrawer: c
+}) {
+  return /* @__PURE__ */ o("div", { className: i.tail, children: [
+    /* @__PURE__ */ o(
+      p,
+      {
+        type: "button",
+        className: i.speedTrigger,
+        "aria-label": l,
+        onClick: a,
+        children: [
+          t,
+          "x"
+        ]
+      }
+    ),
+    e && /* @__PURE__ */ r(
+      d,
+      {
+        variant: "subtle",
+        color: "gray",
+        size: 28,
+        "aria-label": n,
+        onClick: c,
+        children: /* @__PURE__ */ r(
+          m,
+          {
+            icon: s,
+            size: 20,
+            color: "var(--mantine-color-gray-text)"
+          }
+        )
+      }
+    )
+  ] });
+}
+export {
+  y as MobileTailControls
+};