@layers-app/shared 0.4.7 → 0.4.8

package/dist/components/VideoPlayer/components/VideoSettingsModal/CoverSection.js

@@ -1,264 +0,0 @@
-import { jsxs as h, jsx as o } from "react/jsx-runtime";
-import { useState as l, useRef as $, useMemo as R, useCallback as x, useEffect as b } from "react";
-import { Image02Icon as te, AlertCircleIcon as oe, ArrowLeft01Icon as se, ArrowRight01Icon as ne } from "@hugeicons/core-free-icons";
-import { HugeiconsIcon as E } from "@hugeicons/react";
-import { Carousel as P } from "@mantine/carousel";
-import { Stack as ie, Text as j, Group as ce, Button as le, Box as U, Loader as ae } from "@mantine/core";
-import { Dropzone as de, IMAGE_MIME_TYPE as ue } from "@mantine/dropzone";
-import { CheckCircleIcon as me } from "../VideoIcons.js";
-import { useVideoSettingsDataSource as fe } from "./context.js";
-function Le({
-  opened: O,
-  videoId: w,
-  initialData: I,
-  title: q,
-  uploadLabel: B,
-  loadErrorLabel: D,
-  retryLabel: T,
-  onCoverUpload: u,
-  onPosterChange: ve,
-  onSelectedPosterChange: m,
-  selectedPosterUrl: L
-}) {
-  const F = fe(), [n, A] = l(null), [H, c] = l(
-    null
-  ), [, C] = l(!1), [K, k] = l(!1), [V, a] = l(/* @__PURE__ */ new Set()), [Y, f] = l(/* @__PURE__ */ new Set()), [v, y] = l(null), p = $(
-    null
-  ), z = $(!1), d = R(() => {
-    const e = n?.previews ?? [];
-    return v ? [
-      ...e,
-      { id: "uploaded", url: v, order: e.length }
-    ] : e;
-  }, [n?.previews, v]), J = R(
-    () => n?.cover?.previewId ?? d[0]?.id ?? null,
-    [n?.cover?.previewId, d]
-  ), S = H ?? J, M = d.length + 1, Q = M > 3, W = x((e) => {
-    a((t) => {
-      const r = new Set(t);
-      return r.delete(e), r;
-    }), f((t) => {
-      const r = new Set(t);
-      return r.delete(e), r;
-    });
-  }, []), X = x((e) => {
-    a((t) => {
-      const r = new Set(t);
-      return r.delete(e), r;
-    }), f((t) => new Set(t).add(e));
-  }, []), g = x(async () => {
-    if (w) {
-      C(!0), k(!1);
-      try {
-        const e = await F.getSettings();
-        A(e);
-        const t = e?.previews?.[0]?.id ?? null, r = e?.cover?.previewId ?? t;
-        c(r), a(/* @__PURE__ */ new Set()), f(/* @__PURE__ */ new Set());
-      } catch (e) {
-        console.error(
-          "cover status fetch failed",
-          e instanceof Error ? e.message : e
-        ), k(!0);
-      } finally {
-        C(!1);
-      }
-    }
-  }, [w, F]), Z = x(
-    async (e) => {
-      const t = e[0];
-      if (!t || !u) return;
-      const r = URL.createObjectURL(t);
-      y(r), a(/* @__PURE__ */ new Set(["uploaded"])), c("uploaded"), m?.(r);
-      try {
-        const s = await Promise.resolve(u(t));
-        y(null), r && URL.revokeObjectURL(r);
-        const i = s?.previews, ee = Array.isArray(i) && i.length > 0;
-        if (s && ee && i) {
-          z.current = !0, A(s);
-          const N = i[i.length - 1]?.id ?? s?.cover?.previewId ?? i[0]?.id;
-          if (c(N ?? "uploaded"), N) {
-            const _ = i.find(
-              (re) => re.id === N
-            )?.url;
-            _ && m?.(_);
-          }
-          a(/* @__PURE__ */ new Set()), f(/* @__PURE__ */ new Set());
-        } else
-          g();
-      } catch (s) {
-        y(null), r && URL.revokeObjectURL(r), c(null), console.error(
-          "cover upload failed",
-          s instanceof Error ? s.message : s
-        ), g();
-      }
-    },
-    [u, g, m]
-  ), G = R(() => L || (d.find((e) => e.id === S)?.url ?? n?.cover?.url ?? null), [L, d, S, n?.cover?.url]);
-  return b(() => {
-    if (!(!O || !w))
-      if (I) {
-        A(I);
-        const e = I?.previews?.[0]?.id ?? null, t = I?.cover?.previewId ?? e;
-        c(t), a(/* @__PURE__ */ new Set()), f(/* @__PURE__ */ new Set()), C(!1), k(!1);
-      } else
-        g();
-  }, [O, w]), b(() => {
-    if (!v || !p.current) return;
-    const t = requestAnimationFrame(() => {
-      const s = (n?.previews ?? []).length + 1;
-      p.current?.scrollTo(s);
-    });
-    return () => cancelAnimationFrame(t);
-  }, [v, n?.previews]), b(() => {
-    if (!z.current) return;
-    z.current = !1;
-    const e = p.current;
-    if (!e) return;
-    const r = (n?.previews ?? []).length;
-    requestAnimationFrame(() => e.scrollTo(r));
-  }, [n?.previews]), b(
-    () => () => {
-      p.current = null;
-    },
-    []
-  ), /* @__PURE__ */ h(ie, { gap: "xs", "data-test-id": "video-settings-cover-section", children: [
-    /* @__PURE__ */ o(
-      j,
-      {
-        className: "video-settings-modal-section-title",
-        "data-test-id": "video-settings-cover-title",
-        children: q
-      }
-    ),
-    K && /* @__PURE__ */ h(ce, { gap: "xs", mb: "xs", children: [
-      /* @__PURE__ */ o(j, { size: "sm", c: "red", children: D }),
-      T && /* @__PURE__ */ o(le, { variant: "light", size: "xs", onClick: g, children: T })
-    ] }),
-    /* @__PURE__ */ h(
-      P,
-      {
-        className: "video-settings-modal-cover-carousel",
-        classNames: {
-          controls: "video-settings-modal-cover-controls",
-          control: "video-settings-modal-cover-control"
-        },
-        slideSize: "33.333%",
-        slideGap: "10px",
-        emblaOptions: { loop: !1 },
-        withControls: Q,
-        draggable: M > 1,
-        nextControlIcon: /* @__PURE__ */ o(
-          E,
-          {
-            icon: ne,
-            size: 20,
-            color: "currentColor"
-          }
-        ),
-        previousControlIcon: /* @__PURE__ */ o(
-          E,
-          {
-            icon: se,
-            size: 20,
-            color: "currentColor"
-          }
-        ),
-        getEmblaApi: (e) => {
-          p.current = e;
-        },
-        children: [
-          /* @__PURE__ */ o(P.Slide, { children: /* @__PURE__ */ o(U, { className: "video-settings-modal-cover-cell", children: /* @__PURE__ */ o(
-            de,
-            {
-              className: "video-settings-modal-cover-upload",
-              onDrop: Z,
-              accept: ue,
-              maxFiles: 1,
-              disabled: !u,
-              style: u ? void 0 : { opacity: 0.7, pointerEvents: "none" },
-              children: /* @__PURE__ */ h(U, { className: "video-settings-modal-cover-upload-inner", children: [
-                /* @__PURE__ */ o(
-                  E,
-                  {
-                    icon: te,
-                    size: 20,
-                    color: "var(--mantine-color-bright)"
-                  }
-                ),
-                /* @__PURE__ */ o(
-                  j,
-                  {
-                    size: "sm",
-                    fw: 500,
-                    className: "video-settings-modal-cover-upload-label",
-                    children: B
-                  }
-                )
-              ] })
-            }
-          ) }) }),
-          d.map((e) => {
-            const t = G != null ? e.url === G : S != null && e.id === S, r = V.has(e.id), s = Y.has(e.id);
-            return /* @__PURE__ */ o(P.Slide, { children: /* @__PURE__ */ h(
-              U,
-              {
-                className: `video-settings-modal-cover-cell video-settings-modal-cover-thumb ${t && !s ? "selected" : ""} ${r ? "loading" : ""} ${s ? "error" : ""}`,
-                onClick: () => {
-                  s || (c(e.id), m?.(e.url));
-                },
-                role: "button",
-                tabIndex: 0,
-                onKeyDown: (i) => i.key === "Enter" && !s && void (c(e.id), m?.(e.url)),
-                children: [
-                  /* @__PURE__ */ o(
-                    "img",
-                    {
-                      src: e.url,
-                      alt: "",
-                      onLoad: () => W(e.id),
-                      onError: () => X(e.id)
-                    }
-                  ),
-                  r && /* @__PURE__ */ o(
-                    "span",
-                    {
-                      className: "video-settings-modal-cover-spinner",
-                      "aria-hidden": !0,
-                      children: /* @__PURE__ */ o(ae, { size: "sm", color: "gray" })
-                    }
-                  ),
-                  s && /* @__PURE__ */ o(
-                    "span",
-                    {
-                      className: "video-settings-modal-cover-error-icon",
-                      "aria-hidden": !0,
-                      children: /* @__PURE__ */ o(
-                        E,
-                        {
-                          icon: oe,
-                          size: 24,
-                          color: "#fff"
-                        }
-                      )
-                    }
-                  ),
-                  t && !s && /* @__PURE__ */ o(
-                    "span",
-                    {
-                      className: "video-settings-modal-cover-check",
-                      "aria-hidden": !0,
-                      children: /* @__PURE__ */ o(me, { size: 32 })
-                    }
-                  )
-                ]
-              }
-            ) }, e.id);
-          })
-        ]
-      }
-    )
-  ] });
-}
-export {
-  Le as CoverSection
-};

package/dist/components/VideoPlayer/components/VideoSettingsModal/FooterActions.d.ts

@@ -1,10 +0,0 @@
-type FooterActionsProps = {
-    cancelLabel: string;
-    saveLabel: string;
-    onCancel: () => void;
-    onSave: () => void;
-    isSaving?: boolean;
-};
-export declare function FooterActions({ cancelLabel, saveLabel, onCancel, onSave, isSaving, }: FooterActionsProps): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=FooterActions.d.ts.map

package/dist/components/VideoPlayer/components/VideoSettingsModal/FooterActions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FooterActions.d.ts","sourceRoot":"","sources":["../../../../../src/components/VideoPlayer/components/VideoSettingsModal/FooterActions.tsx"],"names":[],"mappings":"AAEA,KAAK,kBAAkB,GAAG;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,WAAW,EACX,SAAS,EACT,QAAQ,EACR,MAAM,EACN,QAAQ,GACT,EAAE,kBAAkB,2CAyBpB"}

package/dist/components/VideoPlayer/components/VideoSettingsModal/FooterActions.js

@@ -1,39 +0,0 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { Group as a, Button as e } from "@mantine/core";
-function m({
-  cancelLabel: s,
-  saveLabel: o,
-  onCancel: d,
-  onSave: r,
-  isSaving: t
-}) {
-  return /* @__PURE__ */ n(a, { justify: "flex-end", gap: 8, children: [
-    /* @__PURE__ */ i(
-      e,
-      {
-        size: "sm",
-        variant: "subtle",
-        color: "gray",
-        radius: "md",
-        onClick: d,
-        disabled: t,
-        "data-test-id": "video-settings-cancel",
-        children: s
-      }
-    ),
-    /* @__PURE__ */ i(
-      e,
-      {
-        size: "sm",
-        radius: "md",
-        onClick: r,
-        loading: t,
-        "data-test-id": "video-settings-save",
-        children: o
-      }
-    )
-  ] });
-}
-export {
-  m as FooterActions
-};

package/dist/components/VideoPlayer/components/VideoSettingsModal/ManualSubtitlesPanel.d.ts

@@ -1,14 +0,0 @@
-import type { Subtitle } from '../../types';
-import { type SubtitleTrack } from '../../utils/subtitles';
-type ManualSubtitlesPanelProps = {
-    videoId?: string | null;
-    mode: 'shaka' | 'native';
-    shakaPlayer?: any | null;
-    nativeVideo?: HTMLVideoElement | null;
-    statusSubtitles?: Subtitle[];
-    onTracksChange?: (tracks: SubtitleTrack[]) => void;
-    onSave?: (handler: () => Promise<void>) => void;
-};
-export declare function ManualSubtitlesPanel({ videoId, statusSubtitles, onTracksChange, onSave, }: ManualSubtitlesPanelProps): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=ManualSubtitlesPanel.d.ts.map

package/dist/components/VideoPlayer/components/VideoSettingsModal/ManualSubtitlesPanel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ManualSubtitlesPanel.d.ts","sourceRoot":"","sources":["../../../../../src/components/VideoPlayer/components/VideoSettingsModal/ManualSubtitlesPanel.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EACL,KAAK,aAAa,EAGnB,MAAM,uBAAuB,CAAC;AAK/B,KAAK,yBAAyB,GAAG;IAC/B,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,IAAI,EAAE,OAAO,GAAG,QAAQ,CAAC;IACzB,WAAW,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACtC,eAAe,CAAC,EAAE,QAAQ,EAAE,CAAC;IAC7B,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IACnD,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;CACjD,CAAC;AA4CF,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,eAAe,EACf,cAAc,EACd,MAAM,GACP,EAAE,yBAAyB,2CAgT3B"}

package/dist/components/VideoPlayer/components/VideoSettingsModal/ManualSubtitlesPanel.js

@@ -1,360 +0,0 @@
-import { jsxs as g, jsx as a, Fragment as Y } from "react/jsx-runtime";
-import { useState as F, useRef as G, useMemo as L, useEffect as D, useCallback as v } from "react";
-import { useTranslation as O } from "react-i18next";
-import { Flex as y, Text as T, Switch as Z, Divider as $, Menu as b, ActionIcon as q, Box as I, Loader as ee, Button as te } from "@mantine/core";
-import { isAutoGeneratedTrack as B, normalizeSubtitleTrack as V } from "../../utils/subtitles.js";
-import { TickIcon as le, MoreVerticalIcon as H } from "../VideoIcons.js";
-import ae from "../VideoSelect.js";
-import { useVideoSettingsDataSource as ie } from "./context.js";
-const E = [
-  { value: "en", label: "English" },
-  { value: "es", label: "Español" },
-  { value: "fr", label: "Français" },
-  { value: "de", label: "Deutsch" },
-  { value: "it", label: "Italiano" },
-  { value: "pt", label: "Português" },
-  { value: "ru", label: "Русский" },
-  { value: "uk", label: "Українська" },
-  { value: "pl", label: "Polski" },
-  { value: "nl", label: "Nederlands" },
-  { value: "sv", label: "Svenska" },
-  { value: "no", label: "Norsk" },
-  { value: "da", label: "Dansk" },
-  { value: "fi", label: "Suomi" },
-  { value: "tr", label: "Türkçe" },
-  { value: "ar", label: "العربية" },
-  { value: "he", label: "עברית" },
-  { value: "hi", label: "हिन्दी" },
-  { value: "ja", label: "日本語" },
-  { value: "ko", label: "한국어" },
-  { value: "zh", label: "中文" },
-  { value: "ro", label: "Română" }
-], _ = "ru", P = E.reduce(
-  (i, r) => (i[r.value] = r.label, i),
-  {}
-);
-function me({
-  videoId: i,
-  statusSubtitles: r,
-  onTracksChange: x,
-  onSave: z
-}) {
-  const { t: m } = O(), s = ie(), h = ae, [u, c] = F([]), [f, n] = F([]), w = G(/* @__PURE__ */ new Map()), [k, j] = F(!1), o = L(
-    () => u.find(B) ?? null,
-    [u]
-  );
-  D(() => {
-    o && j(o.isDisabled);
-  }, [o]);
-  const J = v(
-    (e) => {
-      o && (j(e), c(
-        (t) => t.map(
-          (l) => l.id === o.id ? { ...l, isDisabled: e } : l
-        )
-      ));
-    },
-    [o]
-  ), A = G(null);
-  D(() => {
-    o && A.current === null && (A.current = o.isDisabled);
-  }, [o]);
-  const M = v(
-    async (e = !1) => {
-      if (i) {
-        if (e || r == null)
-          try {
-            const t = await s.listSubtitles();
-            c(t);
-            return;
-          } catch {
-          }
-        try {
-          const t = await s.listSubtitles();
-          c(t);
-        } catch {
-          if (r != null) {
-            const t = (r || []).map(V).filter((l) => l.id);
-            c(t);
-          } else
-            try {
-              const l = ((await s.getSettings())?.subtitles || []).map(V).filter((d) => d.id);
-              c(l);
-            } catch (t) {
-              s.onError?.(t, "subtitles");
-            }
-        }
-      }
-    },
-    [i, s, r]
-  );
-  D(() => {
-    if (!i) {
-      c([]), n([]);
-      return;
-    }
-    M().catch(() => {
-    });
-  }, [i, M]), D(() => {
-    x?.(u);
-  }, [u, x]), D(() => {
-    z?.(async () => {
-      !i || !o || k !== A.current && (await s.setSubtitleDisabled(
-        o.id,
-        k
-      ), A.current = k);
-    });
-  }, [z, i, o, k, s]);
-  const R = L(() => {
-    const e = u.filter((l) => !B(l)), t = /* @__PURE__ */ new Map();
-    for (const l of e)
-      t.set(l.lang, l);
-    return Array.from(t.values());
-  }, [u]), N = L(() => {
-    const e = new Set(R.map((t) => t.lang));
-    return f.forEach((t) => {
-      t.lang && e.add(t.lang);
-    }), e;
-  }, [R, f]), K = v(() => {
-    const e = E.find((l) => !N.has(l.value))?.value ?? (N.has(_) ? null : _), t = e ? P[e] || e : null;
-    n((l) => [
-      ...l,
-      {
-        id: crypto.randomUUID(),
-        lang: e,
-        label: t,
-        status: "draft"
-      }
-    ]);
-  }, [N]), C = v(
-    (e, t) => {
-      n(
-        (l) => l.map(
-          (d) => d.id === e ? { ...d, ...t } : d
-        )
-      );
-    },
-    []
-  ), Q = v(
-    async (e, t) => {
-      if (!i) return;
-      const l = f.find((p) => p.id === e);
-      if (!l?.lang) return;
-      const d = new AbortController();
-      w.current.set(e, d), C(e, { status: "uploading", fileName: t.name });
-      try {
-        const p = await s.uploadSubtitle(t, {
-          lang: l.lang,
-          label: l.label || P[l.lang] || l.lang,
-          kind: "subtitles",
-          default: !1,
-          signal: d.signal
-        });
-        w.current.delete(e), n((S) => S.filter((U) => U.id !== e)), p ? c((S) => S.find((U) => U.id === p.id) ? S : [...S, p]) : await M(!0);
-      } catch (p) {
-        w.current.delete(e), C(e, { status: "error" }), s.onError?.(p, "subtitles");
-      }
-    },
-    [i, s, f, M, C]
-  ), W = v(
-    async (e) => {
-      i && (c((t) => t.filter((l) => l.id !== e)), await s.deleteSubtitle(e));
-    },
-    [i, s]
-  ), X = v((e) => {
-    n((t) => t.filter((l) => l.id !== e));
-  }, []);
-  return /* @__PURE__ */ g("div", { className: "video-settings-modal-subtitles", children: [
-    o && /* @__PURE__ */ g(
-      y,
-      {
-        align: "center",
-        gap: "md",
-        className: "video-settings-modal-subtitles-auto-toggle",
-        children: [
-          /* @__PURE__ */ a(T, { size: "sm", fw: 500, c: "var(--mantine-color-bright)", flex: 1, children: m("editor.video.settingsModal.hideAutoSubtitles") }),
-          /* @__PURE__ */ a(
-            Z,
-            {
-              size: "sm",
-              checked: k,
-              onChange: (e) => J(e.currentTarget.checked)
-            }
-          )
-        ]
-      }
-    ),
-    o && /* @__PURE__ */ a($, { my: 4 }),
-    /* @__PURE__ */ a(
-      T,
-      {
-        size: "sm",
-        mb: 0,
-        className: "video-settings-modal-subtitles-label video-settings-modal-text-label",
-        children: m("editor.video.settingsModal.uploadSubtitlesManually")
-      }
-    ),
-    R.map((e) => /* @__PURE__ */ g(
-      y,
-      {
-        align: "center",
-        gap: "xs",
-        wrap: "nowrap",
-        className: "video-settings-modal-subtitles-row",
-        children: [
-          /* @__PURE__ */ a(
-            h,
-            {
-              size: "sm",
-              data: E,
-              value: e.lang,
-              disabled: !0,
-              flex: 1,
-              miw: 140,
-              w: "auto",
-              comboboxProps: { width: "target" },
-              classNames: { input: "video-settings-modal-language-select" }
-            }
-          ),
-          /* @__PURE__ */ g(y, { align: "center", gap: 6, flex: 1, children: [
-            /* @__PURE__ */ a(le, { size: 20, color: "var(--mantine-color-green-6)" }),
-            /* @__PURE__ */ a(T, { size: "sm", "data-test-id": "video-settings-subtitle-success", children: m("editor.video.settingsModal.successfullyLoaded") })
-          ] }),
-          /* @__PURE__ */ g(b, { position: "bottom-end", children: [
-            /* @__PURE__ */ a(b.Target, { children: /* @__PURE__ */ a(
-              q,
-              {
-                size: 36,
-                variant: "subtle",
-                color: "gray",
-                "aria-label": "Subtitle actions",
-                "data-test-id": "video-settings-subtitle-row-menu",
-                children: /* @__PURE__ */ a(H, { size: 20 })
-              }
-            ) }),
-            /* @__PURE__ */ a(b.Dropdown, { children: /* @__PURE__ */ a(
-              b.Item,
-              {
-                color: "red",
-                onClick: () => W(e.id),
-                "data-test-id": "video-settings-subtitle-delete",
-                children: m("editor.video.settingsModal.deleteSubtitle")
-              }
-            ) })
-          ] })
-        ]
-      },
-      e.id
-    )),
-    f.map((e) => /* @__PURE__ */ a(
-      ne,
-      {
-        draft: e,
-        usedLanguages: N,
-        onChange: (t) => C(e.id, t),
-        onUpload: (t) => Q(e.id, t),
-        onRemove: () => X(e.id),
-        SelectComponent: h
-      },
-      e.id
-    )),
-    /* @__PURE__ */ a(
-      T,
-      {
-        component: "button",
-        type: "button",
-        className: "video-settings-modal-link",
-        onClick: K,
-        "data-test-id": "video-settings-subtitle-add",
-        children: m("editor.video.settingsModal.addSubtitleTrack")
-      }
-    )
-  ] });
-}
-function ne({
-  draft: i,
-  usedLanguages: r,
-  onChange: x,
-  onUpload: z,
-  onRemove: m,
-  SelectComponent: s
-}) {
-  const { t: h } = O(), u = G(null), c = L(
-    () => E.filter(
-      (n) => n.value === i.lang || !r.has(n.value)
-    ),
-    [r, i.lang]
-  ), f = (n) => {
-    const w = n.target.files?.[0];
-    n.target.value = "", w && z(w);
-  };
-  return /* @__PURE__ */ a(I, { children: /* @__PURE__ */ g(
-    y,
-    {
-      align: "center",
-      wrap: "nowrap",
-      className: "video-settings-modal-subtitles-row",
-      children: [
-        /* @__PURE__ */ a(
-          s,
-          {
-            size: "sm",
-            placeholder: h("editor.video.settingsModal.selectLanguage"),
-            data: c,
-            value: i.lang,
-            onChange: (n) => x({
-              lang: n,
-              label: n ? P[n] : null
-            }),
-            flex: 1,
-            miw: 140,
-            w: "auto",
-            comboboxProps: { width: "target" },
-            inputClassName: "video-settings-modal-language-select"
-          }
-        ),
-        /* @__PURE__ */ a(y, { align: "center", gap: 6, flex: 1, children: i.status === "uploading" ? /* @__PURE__ */ a(ee, { size: 22 }) : /* @__PURE__ */ g(Y, { children: [
-          /* @__PURE__ */ a(
-            "input",
-            {
-              ref: u,
-              type: "file",
-              accept: ".srt,.vtt",
-              hidden: !0,
-              onChange: f
-            }
-          ),
-          /* @__PURE__ */ a(
-            te,
-            {
-              variant: "light",
-              size: "sm",
-              className: "video-settings-modal-upload-button",
-              disabled: !i.lang,
-              onClick: () => u.current?.click(),
-              "data-test-id": "video-settings-subtitle-upload-file",
-              children: h("editor.video.settingsModal.uploadFile")
-            }
-          )
-        ] }) }),
-        /* @__PURE__ */ g(b, { position: "bottom-end", children: [
-          /* @__PURE__ */ a(b.Target, { children: /* @__PURE__ */ a(
-            q,
-            {
-              size: 36,
-              variant: "subtle",
-              color: "gray",
-              "aria-label": "Subtitle actions",
-              children: /* @__PURE__ */ a(H, { size: 20 })
-            }
-          ) }),
-          /* @__PURE__ */ a(b.Dropdown, { children: /* @__PURE__ */ a(b.Item, { color: "red", onClick: m, children: h("editor.video.settingsModal.deleteSubtitle") }) })
-        ] }),
-        i.status === "error" && /* @__PURE__ */ a(T, { size: "sm", c: "red", children: h("editor.video.settingsModal.uploadError") })
-      ]
-    }
-  ) });
-}
-export {
-  me as ManualSubtitlesPanel
-};