@fanvue/ui 3.15.0 → 3.17.0

package/dist/components/VoiceNote/VoiceNote.mjs

@@ -0,0 +1,288 @@
+"use client";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { resamplePeaks, formatTime } from "../../utils/audioWaveform.mjs";
+import { cn } from "../../utils/cn.mjs";
+import { useAudioPlayback } from "../../utils/useAudioPlayback.mjs";
+import { useFittedBarCount } from "../../utils/useFittedBarCount.mjs";
+import { useWaveformPeaks } from "../../utils/useWaveformPeaks.mjs";
+import { useWaveformSeek } from "../../utils/useWaveformSeek.mjs";
+import { IconButton } from "../IconButton/IconButton.mjs";
+import { CloseIcon } from "../Icons/CloseIcon.mjs";
+import { PauseIcon } from "../Icons/PauseIcon.mjs";
+import { PlayIcon } from "../Icons/PlayIcon.mjs";
+const DEFAULT_WAVEFORM = [
+  0.15,
+  0.46,
+  0.85,
+  0.23,
+  1,
+  0.85,
+  0.62,
+  0.62,
+  0.62,
+  0.85,
+  0.85,
+  0.62,
+  0.62,
+  1,
+  1,
+  0.62,
+  0.62,
+  0.62,
+  0.23,
+  0.23,
+  0.15,
+  0.46,
+  0.85,
+  0.23,
+  1,
+  0.46,
+  0.85,
+  0.62,
+  0.23,
+  0.23,
+  0.62,
+  0.62,
+  0.85,
+  0.85,
+  0.62,
+  0.62,
+  0.85,
+  1,
+  0.85,
+  1,
+  0.62,
+  0.62,
+  0.62,
+  0.23,
+  0.23,
+  0.62,
+  0.23,
+  0.23,
+  0.23,
+  0.62,
+  0.85,
+  0.62,
+  0.85,
+  1,
+  0.85,
+  0.85,
+  1,
+  0.85,
+  0.23,
+  0.23,
+  0.23,
+  0.46,
+  0.62,
+  0.23,
+  0.23
+];
+const MIN_BAR_HEIGHT = 4;
+const MAX_BAR_HEIGHT = {
+  default: 26,
+  small: 16
+};
+const CONTROL_SIZE = {
+  default: "48",
+  small: "32"
+};
+const BAR_WIDTH_PX = 4;
+const BAR_GAP_PX = 4;
+const DEFAULT_BAR_COUNT = 40;
+function activeBarClass(negative) {
+  return negative ? "bg-messages-waveform-listening-negative-active" : "bg-messages-waveform-listening-active";
+}
+function inactiveBarClass(negative) {
+  return negative ? "bg-messages-waveform-listening-negative-inactive" : "bg-messages-waveform-listening-inactive";
+}
+function restingBarClass(negative) {
+  return negative ? "bg-messages-waveform-listening-negative-default" : "bg-messages-waveform-default";
+}
+function WaveformBars({ bars, variant, size, negative, progress }) {
+  const hasProgress = progress !== void 0;
+  const activeCount = hasProgress ? Math.round(progress * bars.length) : 0;
+  const maxBarHeight = MAX_BAR_HEIGHT[size];
+  return /* @__PURE__ */ jsx(Fragment, { children: bars.map((amplitude, index) => {
+    const height = variant === "flat" ? MIN_BAR_HEIGHT : Math.max(MIN_BAR_HEIGHT, Math.round(amplitude * maxBarHeight));
+    const colorClass = !hasProgress ? restingBarClass(negative) : index < activeCount ? activeBarClass(negative) : inactiveBarClass(negative);
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: cn("w-1 shrink-0 rounded-[2px]", colorClass),
+        style: { height }
+      },
+      index
+    );
+  }) });
+}
+function WaveformMeta({ time, fileName, textColor }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    time && /* @__PURE__ */ jsx("span", { className: cn("typography-body-small-14px-regular shrink-0", textColor), children: time }),
+    fileName && /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: cn(
+          "typography-body-small-14px-regular min-w-0 max-w-[50%] truncate",
+          textColor
+        ),
+        children: fileName
+      }
+    )
+  ] });
+}
+const VoiceNote = React.forwardRef(
+  ({
+    className,
+    src,
+    duration,
+    waveform = DEFAULT_WAVEFORM,
+    variant = "default",
+    size = "default",
+    negative = false,
+    progress,
+    playing,
+    defaultPlaying = false,
+    onPlayPause,
+    onEnded,
+    time,
+    fileName,
+    showControls = true,
+    showTimestamp = true,
+    showRemove = false,
+    onRemove,
+    playButtonLabel,
+    removeButtonLabel = "Remove",
+    "aria-label": ariaLabel = "Voice note",
+    ...props
+  }, ref) => {
+    const isPlayer = src !== void 0;
+    const playback = useAudioPlayback({
+      src,
+      duration,
+      playing,
+      defaultPlaying,
+      onEnded,
+      onPlay: React.useCallback(() => onPlayPause?.(true), [onPlayPause]),
+      onPause: React.useCallback(() => onPlayPause?.(false), [onPlayPause])
+    });
+    const decodedPeaks = useWaveformPeaks(src);
+    const [internalPlaying, setInternalPlaying] = React.useState(defaultPlaying);
+    const isControlled = playing !== void 0;
+    const trackRef = React.useRef(null);
+    const fittedBarCount = useFittedBarCount(trackRef, {
+      barWidthPx: BAR_WIDTH_PX,
+      gapPx: BAR_GAP_PX,
+      fallback: DEFAULT_BAR_COUNT
+    });
+    const seekProps = useWaveformSeek({
+      trackRef,
+      displayDuration: playback.displayDuration,
+      currentTime: playback.currentTime,
+      seekTo: playback.seekTo,
+      setSeeking: playback.setSeeking
+    });
+    const isPlaying = isPlayer ? playback.isPlaying : playing ?? internalPlaying;
+    const handlePlayPause = () => {
+      if (isPlayer) {
+        playback.toggle();
+        return;
+      }
+      const next = !isPlaying;
+      if (!isControlled) setInternalPlaying(next);
+      onPlayPause?.(next);
+    };
+    const bars = resamplePeaks(isPlayer ? decodedPeaks : waveform, fittedBarCount);
+    const progressValue = isPlayer ? playback.progress : progress;
+    const textColor = negative ? "text-content-primary-inverted" : "text-content-primary";
+    const playerTime = playback.hasStarted ? playback.currentTime : playback.displayDuration;
+    const displayTime = isPlayer ? formatTime(playerTime) : time;
+    const controlLabel = playButtonLabel ?? (isPlaying ? "Pause" : "Play");
+    const trackAria = isPlayer ? seekProps : { "aria-hidden": true };
+    return (
+      // biome-ignore lint/a11y/useSemanticElements: <fieldset> would break the public HTMLDivElement ref/props API
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref,
+          role: "group",
+          "aria-label": ariaLabel,
+          className: cn("flex items-center gap-3", size === "small" ? "h-8" : "h-12", className),
+          ...props,
+          children: [
+            showControls && /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                variant: "secondary",
+                size: CONTROL_SIZE[size],
+                negative,
+                icon: isPlaying ? /* @__PURE__ */ jsx(PauseIcon, {}) : /* @__PURE__ */ jsx(PlayIcon, {}),
+                "aria-label": controlLabel,
+                onClick: handlePlayPause
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: trackRef,
+                "data-testid": "voice-note-waveform",
+                className: cn(
+                  "flex h-full min-w-0 flex-1 items-center gap-1 overflow-hidden",
+                  isPlayer && "cursor-pointer touch-none select-none focus-visible:shadow-focus-ring focus-visible:outline-none"
+                ),
+                ...trackAria,
+                children: /* @__PURE__ */ jsx(
+                  WaveformBars,
+                  {
+                    bars,
+                    variant,
+                    size,
+                    negative,
+                    progress: progressValue
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              WaveformMeta,
+              {
+                time: showTimestamp ? displayTime : void 0,
+                fileName,
+                textColor
+              }
+            ),
+            showRemove && /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                variant: "tertiary",
+                size: CONTROL_SIZE[size],
+                negative,
+                icon: /* @__PURE__ */ jsx(CloseIcon, {}),
+                "aria-label": removeButtonLabel,
+                onClick: onRemove
+              }
+            ),
+            isPlayer && // biome-ignore lint/a11y/useMediaCaption: a UI voice note / short recording, not narrated content needing captions
+            /* @__PURE__ */ jsx(
+              "audio",
+              {
+                ref: playback.audioRef,
+                src,
+                preload: "metadata",
+                className: "hidden",
+                onLoadedMetadata: playback.audioHandlers.onLoadedMetadata,
+                onTimeUpdate: playback.audioHandlers.onTimeUpdate,
+                onEnded: playback.audioHandlers.onEnded
+              }
+            )
+          ]
+        }
+      )
+    );
+  }
+);
+VoiceNote.displayName = "VoiceNote";
+export {
+  VoiceNote
+};
+//# sourceMappingURL=VoiceNote.mjs.map

package/dist/components/VoiceNote/VoiceNote.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VoiceNote.mjs","sources":["../../../src/components/VoiceNote/VoiceNote.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { formatTime, resamplePeaks } from \"@/utils/audioWaveform\";\nimport { cn } from \"@/utils/cn\";\nimport { useAudioPlayback } from \"@/utils/useAudioPlayback\";\nimport { useFittedBarCount } from \"@/utils/useFittedBarCount\";\nimport { useWaveformPeaks } from \"@/utils/useWaveformPeaks\";\nimport { useWaveformSeek } from \"@/utils/useWaveformSeek\";\nimport { IconButton, type IconButtonSize } from \"../IconButton/IconButton\";\nimport { CloseIcon } from \"../Icons/CloseIcon\";\nimport { PauseIcon } from \"../Icons/PauseIcon\";\nimport { PlayIcon } from \"../Icons/PlayIcon\";\n\n/** Visual style of the waveform. */\nexport type VoiceNoteVariant = \"default\" | \"flat\";\n\n/** Size preset for the voice note. */\nexport type VoiceNoteSize = \"default\" | \"small\";\n\n/**\n * Default waveform amplitudes (0–1), taken from the Figma reference so the\n * resting state renders 1:1 when no `waveform` data (or `src`) is supplied.\n */\nconst DEFAULT_WAVEFORM = [\n  0.15, 0.46, 0.85, 0.23, 1, 0.85, 0.62, 0.62, 0.62, 0.85, 0.85, 0.62, 0.62, 1, 1, 0.62, 0.62, 0.62,\n  0.23, 0.23, 0.15, 0.46, 0.85, 0.23, 1, 0.46, 0.85, 0.62, 0.23, 0.23, 0.62, 0.62, 0.85, 0.85, 0.62,\n  0.62, 0.85, 1, 0.85, 1, 0.62, 0.62, 0.62, 0.23, 0.23, 0.62, 0.23, 0.23, 0.23, 0.62, 0.85, 0.62,\n  0.85, 1, 0.85, 0.85, 1, 0.85, 0.23, 0.23, 0.23, 0.46, 0.62, 0.23, 0.23,\n];\n\nconst MIN_BAR_HEIGHT = 4;\nconst MAX_BAR_HEIGHT: Record<VoiceNoteSize, number> = {\n  default: 26,\n  small: 16,\n};\n\nconst CONTROL_SIZE: Record<VoiceNoteSize, IconButtonSize> = {\n  default: \"48\",\n  small: \"32\",\n};\n\n/** Rendered width of a single waveform bar, in pixels (`w-1`). */\nconst BAR_WIDTH_PX = 4;\n/** Gap between waveform bars, in pixels (`gap-1`). */\nconst BAR_GAP_PX = 4;\n/** Bar count before the track is measured (SSR, jsdom, or zero-width layout). */\nconst DEFAULT_BAR_COUNT = 40;\n\nfunction activeBarClass(negative: boolean): string {\n  return negative\n    ? \"bg-messages-waveform-listening-negative-active\"\n    : \"bg-messages-waveform-listening-active\";\n}\n\nfunction inactiveBarClass(negative: boolean): string {\n  return negative\n    ? \"bg-messages-waveform-listening-negative-inactive\"\n    : \"bg-messages-waveform-listening-inactive\";\n}\n\nfunction restingBarClass(negative: boolean): string {\n  return negative\n    ? \"bg-messages-waveform-listening-negative-default\"\n    : \"bg-messages-waveform-default\";\n}\n\ninterface WaveformBarsProps {\n  bars: number[];\n  variant: VoiceNoteVariant;\n  size: VoiceNoteSize;\n  negative: boolean;\n  progress: number | undefined;\n}\n\nfunction WaveformBars({ bars, variant, size, negative, progress }: WaveformBarsProps) {\n  const hasProgress = progress !== undefined;\n  const activeCount = hasProgress ? Math.round(progress * bars.length) : 0;\n  const maxBarHeight = MAX_BAR_HEIGHT[size];\n\n  return (\n    <>\n      {bars.map((amplitude, index) => {\n        const height =\n          variant === \"flat\"\n            ? MIN_BAR_HEIGHT\n            : Math.max(MIN_BAR_HEIGHT, Math.round(amplitude * maxBarHeight));\n        const colorClass = !hasProgress\n          ? restingBarClass(negative)\n          : index < activeCount\n            ? activeBarClass(negative)\n            : inactiveBarClass(negative);\n\n        return (\n          <span\n            // biome-ignore lint/suspicious/noArrayIndexKey: bars are a fixed positional sequence\n            key={index}\n            className={cn(\"w-1 shrink-0 rounded-[2px]\", colorClass)}\n            style={{ height }}\n          />\n        );\n      })}\n    </>\n  );\n}\n\ninterface WaveformMetaProps {\n  time: string | undefined;\n  fileName: string | undefined;\n  textColor: string;\n}\n\nfunction WaveformMeta({ time, fileName, textColor }: WaveformMetaProps) {\n  return (\n    <>\n      {time && (\n        <span className={cn(\"typography-body-small-14px-regular shrink-0\", textColor)}>{time}</span>\n      )}\n      {fileName && (\n        <span\n          className={cn(\n            \"typography-body-small-14px-regular min-w-0 max-w-[50%] truncate\",\n            textColor,\n          )}\n        >\n          {fileName}\n        </span>\n      )}\n    </>\n  );\n}\n\nexport interface VoiceNoteProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onPlay\" | \"onPause\"> {\n  /**\n   * URL of the audio to play. When set, the component manages a real `<audio>`\n   * element: it decodes the waveform, plays/pauses, tracks live progress and is\n   * seekable — `waveform`/`progress` are derived automatically. Leave unset for\n   * a presentational, fully-controlled voice note.\n   */\n  src?: string;\n  /** Fallback total duration (seconds), used until the media's metadata loads. */\n  duration?: number;\n  /** Amplitude values (0–1), one per bar. Ignored when `src` is set. Falls back to a built-in pattern. */\n  waveform?: number[];\n  /** Visual style; `flat` renders a simplified dotted preview. @default \"default\" */\n  variant?: VoiceNoteVariant;\n  /** Size preset. @default \"default\" */\n  size?: VoiceNoteSize;\n  /** Dark-surface treatment for use on message bubbles. @default false */\n  negative?: boolean;\n  /**\n   * Playback progress (0–1) for the presentational mode. When set, the waveform\n   * splits into played/unplayed bars (the \"Listening\" state). Ignored when `src`\n   * is set (progress comes from the media element).\n   */\n  progress?: number;\n  /** Whether audio is playing (controlled) — toggles the play/pause icon. */\n  playing?: boolean;\n  /** Initial playing state (uncontrolled). @default false */\n  defaultPlaying?: boolean;\n  /** Called with the next playing state when the play/pause control is pressed. */\n  onPlayPause?: (playing: boolean) => void;\n  /** Called when audio playback reaches the end (only in `src` mode). */\n  onEnded?: () => void;\n  /** Timestamp or duration label, e.g. \"0:05\". Ignored when `src` is set (derived from the media). */\n  time?: string;\n  /** File name shown when the audio is an uploaded file rather than a voice note. */\n  fileName?: string;\n  /** Show the play/pause control. @default true */\n  showControls?: boolean;\n  /** Show the timestamp label. @default true */\n  showTimestamp?: boolean;\n  /** Show a remove button (calls {@link VoiceNoteProps.onRemove}). @default false */\n  showRemove?: boolean;\n  /** Called when the remove button is pressed. */\n  onRemove?: () => void;\n  /** Accessible name for the play/pause control. Defaults to \"Play\"/\"Pause\". */\n  playButtonLabel?: string;\n  /** Accessible name for the remove button. @default \"Remove\" */\n  removeButtonLabel?: string;\n  /** Accessible name for the whole player. @default \"Voice note\" */\n  \"aria-label\"?: string;\n}\n\n/**\n * A voice-note audio player: a play/pause control, an amplitude waveform, and a\n * timestamp — for voice messages and audio attachments in a conversation.\n *\n * Two modes: pass `src` for a self-contained player that decodes the waveform,\n * plays real audio, tracks live progress and is seekable; or omit `src` and\n * drive it with `playing`/`progress` + `onPlayPause` for a presentational,\n * fully-controlled voice note. `flat` renders a compact dotted preview and\n * `negative` adapts it to dark message bubbles.\n *\n * @example\n * ```tsx\n * <VoiceNote src=\"https://example.com/note.mp3\" duration={5} />\n * <VoiceNote time=\"0:05\" progress={0.4} playing onPlayPause={toggle} />\n * ```\n */\nexport const VoiceNote = React.forwardRef<HTMLDivElement, VoiceNoteProps>(\n  (\n    {\n      className,\n      src,\n      duration,\n      waveform = DEFAULT_WAVEFORM,\n      variant = \"default\",\n      size = \"default\",\n      negative = false,\n      progress,\n      playing,\n      defaultPlaying = false,\n      onPlayPause,\n      onEnded,\n      time,\n      fileName,\n      showControls = true,\n      showTimestamp = true,\n      showRemove = false,\n      onRemove,\n      playButtonLabel,\n      removeButtonLabel = \"Remove\",\n      \"aria-label\": ariaLabel = \"Voice note\",\n      ...props\n    },\n    ref,\n  ) => {\n    const isPlayer = src !== undefined;\n\n    const playback = useAudioPlayback({\n      src,\n      duration,\n      playing,\n      defaultPlaying,\n      onEnded,\n      onPlay: React.useCallback(() => onPlayPause?.(true), [onPlayPause]),\n      onPause: React.useCallback(() => onPlayPause?.(false), [onPlayPause]),\n    });\n    const decodedPeaks = useWaveformPeaks(src);\n\n    const [internalPlaying, setInternalPlaying] = React.useState(defaultPlaying);\n    const isControlled = playing !== undefined;\n\n    const trackRef = React.useRef<HTMLDivElement>(null);\n    const fittedBarCount = useFittedBarCount(trackRef, {\n      barWidthPx: BAR_WIDTH_PX,\n      gapPx: BAR_GAP_PX,\n      fallback: DEFAULT_BAR_COUNT,\n    });\n    const seekProps = useWaveformSeek({\n      trackRef,\n      displayDuration: playback.displayDuration,\n      currentTime: playback.currentTime,\n      seekTo: playback.seekTo,\n      setSeeking: playback.setSeeking,\n    });\n\n    const isPlaying = isPlayer ? playback.isPlaying : (playing ?? internalPlaying);\n\n    const handlePlayPause = () => {\n      if (isPlayer) {\n        playback.toggle();\n        return;\n      }\n      const next = !isPlaying;\n      if (!isControlled) setInternalPlaying(next);\n      onPlayPause?.(next);\n    };\n\n    const bars = resamplePeaks(isPlayer ? decodedPeaks : waveform, fittedBarCount);\n    const progressValue = isPlayer ? playback.progress : progress;\n    const textColor = negative ? \"text-content-primary-inverted\" : \"text-content-primary\";\n\n    const playerTime = playback.hasStarted ? playback.currentTime : playback.displayDuration;\n    const displayTime = isPlayer ? formatTime(playerTime) : time;\n    const controlLabel = playButtonLabel ?? (isPlaying ? \"Pause\" : \"Play\");\n    const trackAria = isPlayer ? seekProps : ({ \"aria-hidden\": true } as const);\n\n    return (\n      // biome-ignore lint/a11y/useSemanticElements: <fieldset> would break the public HTMLDivElement ref/props API\n      <div\n        ref={ref}\n        role=\"group\"\n        aria-label={ariaLabel}\n        className={cn(\"flex items-center gap-3\", size === \"small\" ? \"h-8\" : \"h-12\", className)}\n        {...props}\n      >\n        {showControls && (\n          <IconButton\n            variant=\"secondary\"\n            size={CONTROL_SIZE[size]}\n            negative={negative}\n            icon={isPlaying ? <PauseIcon /> : <PlayIcon />}\n            aria-label={controlLabel}\n            onClick={handlePlayPause}\n          />\n        )}\n\n        <div\n          ref={trackRef}\n          data-testid=\"voice-note-waveform\"\n          className={cn(\n            \"flex h-full min-w-0 flex-1 items-center gap-1 overflow-hidden\",\n            isPlayer &&\n              \"cursor-pointer touch-none select-none focus-visible:shadow-focus-ring focus-visible:outline-none\",\n          )}\n          {...trackAria}\n        >\n          <WaveformBars\n            bars={bars}\n            variant={variant}\n            size={size}\n            negative={negative}\n            progress={progressValue}\n          />\n        </div>\n\n        <WaveformMeta\n          time={showTimestamp ? displayTime : undefined}\n          fileName={fileName}\n          textColor={textColor}\n        />\n\n        {showRemove && (\n          <IconButton\n            variant=\"tertiary\"\n            size={CONTROL_SIZE[size]}\n            negative={negative}\n            icon={<CloseIcon />}\n            aria-label={removeButtonLabel}\n            onClick={onRemove}\n          />\n        )}\n\n        {isPlayer && (\n          // biome-ignore lint/a11y/useMediaCaption: a UI voice note / short recording, not narrated content needing captions\n          <audio\n            ref={playback.audioRef}\n            src={src}\n            preload=\"metadata\"\n            className=\"hidden\"\n            onLoadedMetadata={playback.audioHandlers.onLoadedMetadata}\n            onTimeUpdate={playback.audioHandlers.onTimeUpdate}\n            onEnded={playback.audioHandlers.onEnded}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nVoiceNote.displayName = \"VoiceNote\";\n"],"names":[],"mappings":";;;;;;;;;;;;;AAsBA,MAAM,mBAAmB;AAAA,EACvB;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAG;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAC7F;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAC7F;AAAA,EAAM;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAC1F;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAAG;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AAAA,EAAM;AACpE;AAEA,MAAM,iBAAiB;AACvB,MAAM,iBAAgD;AAAA,EACpD,SAAS;AAAA,EACT,OAAO;AACT;AAEA,MAAM,eAAsD;AAAA,EAC1D,SAAS;AAAA,EACT,OAAO;AACT;AAGA,MAAM,eAAe;AAErB,MAAM,aAAa;AAEnB,MAAM,oBAAoB;AAE1B,SAAS,eAAe,UAA2B;AACjD,SAAO,WACH,mDACA;AACN;AAEA,SAAS,iBAAiB,UAA2B;AACnD,SAAO,WACH,qDACA;AACN;AAEA,SAAS,gBAAgB,UAA2B;AAClD,SAAO,WACH,oDACA;AACN;AAUA,SAAS,aAAa,EAAE,MAAM,SAAS,MAAM,UAAU,YAA+B;AACpF,QAAM,cAAc,aAAa;AACjC,QAAM,cAAc,cAAc,KAAK,MAAM,WAAW,KAAK,MAAM,IAAI;AACvE,QAAM,eAAe,eAAe,IAAI;AAExC,SACE,oBAAA,UAAA,EACG,UAAA,KAAK,IAAI,CAAC,WAAW,UAAU;AAC9B,UAAM,SACJ,YAAY,SACR,iBACA,KAAK,IAAI,gBAAgB,KAAK,MAAM,YAAY,YAAY,CAAC;AACnE,UAAM,aAAa,CAAC,cAChB,gBAAgB,QAAQ,IACxB,QAAQ,cACN,eAAe,QAAQ,IACvB,iBAAiB,QAAQ;AAE/B,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QAGC,WAAW,GAAG,8BAA8B,UAAU;AAAA,QACtD,OAAO,EAAE,OAAA;AAAA,MAAO;AAAA,MAFX;AAAA,IAAA;AAAA,EAKX,CAAC,EAAA,CACH;AAEJ;AAQA,SAAS,aAAa,EAAE,MAAM,UAAU,aAAgC;AACtE,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,4BACE,QAAA,EAAK,WAAW,GAAG,+CAA+C,SAAS,GAAI,UAAA,MAAK;AAAA,IAEtF,YACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QAAA;AAAA,QAGD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GAEJ;AAEJ;AAuEO,MAAM,YAAY,MAAM;AAAA,EAC7B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,UAAU;AAAA,IACV,OAAO;AAAA,IACP,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA,oBAAoB;AAAA,IACpB,cAAc,YAAY;AAAA,IAC1B,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,WAAW,QAAQ;AAEzB,UAAM,WAAW,iBAAiB;AAAA,MAChC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,MAAM,YAAY,MAAM,cAAc,IAAI,GAAG,CAAC,WAAW,CAAC;AAAA,MAClE,SAAS,MAAM,YAAY,MAAM,cAAc,KAAK,GAAG,CAAC,WAAW,CAAC;AAAA,IAAA,CACrE;AACD,UAAM,eAAe,iBAAiB,GAAG;AAEzC,UAAM,CAAC,iBAAiB,kBAAkB,IAAI,MAAM,SAAS,cAAc;AAC3E,UAAM,eAAe,YAAY;AAEjC,UAAM,WAAW,MAAM,OAAuB,IAAI;AAClD,UAAM,iBAAiB,kBAAkB,UAAU;AAAA,MACjD,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAU;AAAA,IAAA,CACX;AACD,UAAM,YAAY,gBAAgB;AAAA,MAChC;AAAA,MACA,iBAAiB,SAAS;AAAA,MAC1B,aAAa,SAAS;AAAA,MACtB,QAAQ,SAAS;AAAA,MACjB,YAAY,SAAS;AAAA,IAAA,CACtB;AAED,UAAM,YAAY,WAAW,SAAS,YAAa,WAAW;AAE9D,UAAM,kBAAkB,MAAM;AAC5B,UAAI,UAAU;AACZ,iBAAS,OAAA;AACT;AAAA,MACF;AACA,YAAM,OAAO,CAAC;AACd,UAAI,CAAC,aAAc,oBAAmB,IAAI;AAC1C,oBAAc,IAAI;AAAA,IACpB;AAEA,UAAM,OAAO,cAAc,WAAW,eAAe,UAAU,cAAc;AAC7E,UAAM,gBAAgB,WAAW,SAAS,WAAW;AACrD,UAAM,YAAY,WAAW,kCAAkC;AAE/D,UAAM,aAAa,SAAS,aAAa,SAAS,cAAc,SAAS;AACzE,UAAM,cAAc,WAAW,WAAW,UAAU,IAAI;AACxD,UAAM,eAAe,oBAAoB,YAAY,UAAU;AAC/D,UAAM,YAAY,WAAW,YAAa,EAAE,eAAe,KAAA;AAE3D;AAAA;AAAA,MAEE;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,MAAK;AAAA,UACL,cAAY;AAAA,UACZ,WAAW,GAAG,2BAA2B,SAAS,UAAU,QAAQ,QAAQ,SAAS;AAAA,UACpF,GAAG;AAAA,UAEH,UAAA;AAAA,YAAA,gBACC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,MAAM,aAAa,IAAI;AAAA,gBACvB;AAAA,gBACA,MAAM,YAAY,oBAAC,WAAA,CAAA,CAAU,wBAAM,UAAA,EAAS;AAAA,gBAC5C,cAAY;AAAA,gBACZ,SAAS;AAAA,cAAA;AAAA,YAAA;AAAA,YAIb;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK;AAAA,gBACL,eAAY;AAAA,gBACZ,WAAW;AAAA,kBACT;AAAA,kBACA,YACE;AAAA,gBAAA;AAAA,gBAEH,GAAG;AAAA,gBAEJ,UAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA,UAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACZ;AAAA,YAAA;AAAA,YAGF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAM,gBAAgB,cAAc;AAAA,gBACpC;AAAA,gBACA;AAAA,cAAA;AAAA,YAAA;AAAA,YAGD,cACC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,MAAM,aAAa,IAAI;AAAA,gBACvB;AAAA,gBACA,0BAAO,WAAA,EAAU;AAAA,gBACjB,cAAY;AAAA,gBACZ,SAAS;AAAA,cAAA;AAAA,YAAA;AAAA,YAIZ;AAAA,YAEC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAK,SAAS;AAAA,gBACd;AAAA,gBACA,SAAQ;AAAA,gBACR,WAAU;AAAA,gBACV,kBAAkB,SAAS,cAAc;AAAA,gBACzC,cAAc,SAAS,cAAc;AAAA,gBACrC,SAAS,SAAS,cAAc;AAAA,cAAA;AAAA,YAAA;AAAA,UAClC;AAAA,QAAA;AAAA,MAAA;AAAA;AAAA,EAIR;AACF;AAEA,UAAU,cAAc;"}