@layers-app/shared 0.4.4 → 0.4.6

package/dist/components/FilePicker/FilePicker.js

@@ -1,23 +1,23 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import { useState as E, useMemo as u, useEffect as le } from "react";
-import { useTranslation as ie } from "react-i18next";
-import { ImageAdd02Icon as V } from "@hugeicons/core-free-icons";
-import { HugeiconsIcon as j } from "@hugeicons/react";
-import { Flex as r, ActionIcon as re, Button as A, Text as ae, Tabs as x, Box as oe, Popover as F, Stack as se } from "@mantine/core";
-import { getEnvConfig as L } from "../../config/envConfig.js";
-import { isFeature as te } from "../../helpers/feature.js";
-import { useMenu as ce } from "../../hooks/useMenu.js";
-import { usePlatform as de } from "../../hooks/usePlatform.js";
-import { MediaLibraryBrowser as ue } from "../MediaLibrary/MediaLibraryBrowser.js";
-import { FilePickerGallery as he } from "./FilePickerGallery.js";
-import { FilePickerGiphy as pe } from "./FilePickerGiphy.js";
+import { jsx as e, jsxs as v } from "react/jsx-runtime";
+import { useState as T, useMemo as d, useEffect as ee } from "react";
+import { useTranslation as ne } from "react-i18next";
+import { ImageAdd02Icon as B } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as E } from "@hugeicons/react";
+import { Flex as s, ActionIcon as le, Button as V, Text as ie, Box as re, Popover as P, Stack as ae } from "@mantine/core";
+import { getEnvConfig as A } from "../../config/envConfig.js";
+import { isFeature as oe } from "../../helpers/feature.js";
+import { useMenu as te } from "../../hooks/useMenu.js";
+import { usePlatform as se } from "../../hooks/usePlatform.js";
+import { MediaLibraryBrowser as ce } from "../MediaLibrary/MediaLibraryBrowser.js";
+import { PillTabs as de } from "../PillTabs/PillTabs.js";
+import { FilePickerGallery as ue } from "./FilePickerGallery.js";
+import { FilePickerGiphy as he } from "./FilePickerGiphy.js";
 import { FilePickerLink as me } from "./FilePickerLink.js";
-import { FilePickerUnsplash as fe } from "./FilePickerUnsplash.js";
-import { FilePickerGoogleDrive as ge } from "./FilePickerGoogleDrive.js";
-import { FilePickerUpload as ve } from "./FilePickerUpload.js";
-import { coverCollections as be } from "./coverCollections.js";
-import w from "./FilePicker.module.css.js";
-const Ce = [
+import { FilePickerUnsplash as pe } from "./FilePickerUnsplash.js";
+import { FilePickerGoogleDrive as fe } from "./FilePickerGoogleDrive.js";
+import { FilePickerUpload as ge } from "./FilePickerUpload.js";
+import { coverCollections as ve } from "./coverCollections.js";
+const be = [
   "gallery",
   "upload",
   "link",
@@ -25,120 +25,120 @@ const Ce = [
   "giphy",
   "googleDrive",
   "media"
-], He = ({
-  onChange: N,
-  onRemove: U,
+], Oe = ({
+  onChange: j,
+  onRemove: L,
   onUpload: b,
-  uploading: _ = !1,
-  showTabs: o = Ce,
-  children: H,
-  width: O = 610,
-  position: R = "bottom-end",
-  readOnly: $ = !1,
-  hasImage: q,
-  giphyToken: ke,
-  unsplashClientId: ye,
+  uploading: U = !1,
+  showTabs: a = be,
+  children: _,
+  width: H = 610,
+  position: O = "bottom-end",
+  readOnly: X = !1,
+  hasImage: $,
+  giphyToken: Ce,
+  unsplashClientId: ke,
   type: S = "image",
-  galleryCollection: h = [],
-  isValidMediaUrl: J,
-  popoverProps: K,
-  dropZoneProps: Q,
-  targetProps: W,
-  onOpenedChange: X,
+  galleryCollection: u = [],
+  isValidMediaUrl: q,
+  popoverProps: w,
+  dropZoneProps: J,
+  targetProps: K,
+  onOpenedChange: N,
   googleDrive: l,
-  mediaLibrary: a,
-  inline: p = !1,
+  mediaLibrary: r,
+  inline: h = !1,
   tab: C,
-  uploadIcon: Y
+  uploadIcon: Q
 }) => {
-  const { t: i } = ie("ui"), [T, m] = E(!1), { isMobile: I } = ce(), M = de(), f = u(() => h.length > 0 ? h : p ? be.map((n) => ({
+  const { t: i } = ne("ui"), [x, m] = T(!1), { isMobile: y } = te(), I = se(), p = d(() => u.length > 0 ? u : h ? ve.map((n) => ({
     ...n,
     title: i(`coverGroups.${n.id}`, { defaultValue: n.id })
-  })) : h, [h, p, i]), s = u(() => [
+  })) : u, [u, h, i]), o = d(() => [
     {
       value: "gallery",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.gallery") }) }),
-      visible: o.includes("gallery") && !!f.length
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.gallery") }) }),
+      visible: a.includes("gallery") && !!p.length
     },
     {
       value: "upload",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.upload") }) }),
-      visible: o.includes("upload") && !!b
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.upload") }) }),
+      visible: a.includes("upload") && !!b
     },
     {
       value: "link",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.link") }) }),
-      visible: o.includes("link")
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.link") }) }),
+      visible: a.includes("link")
     },
     {
       value: "unsplash",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.searchImages") }) }),
-      visible: o.includes("unsplash") && L().media?.unsplashEnabled !== !1
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.searchImages") }) }),
+      visible: a.includes("unsplash") && A().media?.unsplashEnabled !== !1
     },
     {
       value: "giphy",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: "GIFs" }) }),
-      visible: o.includes("giphy") && M.has("giphy") && L().media?.giphyEnabled !== !1
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: "GIFs" }) }),
+      visible: a.includes("giphy") && I.has("giphy") && A().media?.giphyEnabled !== !1
     },
     {
       value: "googleDrive",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.googleDrive", {
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.googleDrive", {
         defaultValue: "Google Drive"
       }) }) }),
-      visible: o.includes("googleDrive") && !!l
+      visible: a.includes("googleDrive") && !!l
     },
     {
       value: "media",
-      label: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e("span", { children: i("changeCover.media", { defaultValue: "Media" }) }) }),
-      visible: o.includes("media") && !!a && te()
+      label: /* @__PURE__ */ e(s, { children: /* @__PURE__ */ e("span", { children: i("changeCover.media", { defaultValue: "Media" }) }) }),
+      visible: a.includes("media") && !!r && oe()
     }
-  ].filter((y) => y.visible), [
-    o,
-    M,
+  ].filter((F) => F.visible), [
+    a,
+    I,
     i,
-    f.length,
+    p.length,
     b,
     l,
-    a
-  ]), g = C !== void 0, [Z, P] = E(() => C !== void 0 ? "" : s[0]?.value ?? "");
-  le(() => {
-    g || s.length && P((n) => n && s.some((y) => y.value === n) ? n : s[0].value);
-  }, [s, g]);
-  const k = u(() => s.map((n) => n.value), [s]), v = g ? C : Z, t = u(() => v && k.includes(v) ? v : k[0] ?? "", [v, k]), z = (n) => {
-    g || P(n);
-  }, D = (n) => {
+    r
+  ]), f = C !== void 0, [R, M] = T(() => C !== void 0 ? "" : o[0]?.value ?? "");
+  ee(() => {
+    f || o.length && M((n) => n && o.some((F) => F.value === n) ? n : o[0].value);
+  }, [o, f]);
+  const k = d(() => o.map((n) => n.value), [o]), g = f ? C : R, t = d(() => g && k.includes(g) ? g : k[0] ?? "", [g, k]), W = (n) => {
+    f || M(n);
+  }, Y = (n) => {
     b?.(n, m);
   }, c = (n) => {
-    N?.(n), p || m(!1);
-  }, ee = u(() => I ? /* @__PURE__ */ d(re, { size: "lg", children: [
-    /* @__PURE__ */ e(j, { icon: V, size: 22 }),
+    j?.(n), h || m(!1);
+  }, Z = d(() => y ? /* @__PURE__ */ v(le, { size: "lg", children: [
+    /* @__PURE__ */ e(E, { icon: B, size: 22 }),
     " "
   ] }) : /* @__PURE__ */ e(
-    A,
+    V,
     {
       variant: "default",
       size: "xs",
-      leftSection: /* @__PURE__ */ e(j, { icon: V, size: 16 }),
-      children: /* @__PURE__ */ e(ae, { fw: 600, size: "sm", children: i("changeCover.change") })
+      leftSection: /* @__PURE__ */ e(E, { icon: B, size: 16 }),
+      children: /* @__PURE__ */ e(ie, { fw: 600, size: "sm", children: i("changeCover.change") })
     }
-  ), [i, I]), G = (n) => {
-    m(n), X?.(n);
-  }, B = /* @__PURE__ */ d(se, { gap: 0, px: 8, pb: 8, pt: "sm", children: [
-    t === "gallery" && !!f.length && /* @__PURE__ */ e(
-      he,
+  ), [i, y]), z = (n) => {
+    m(n), N?.(n);
+  }, G = /* @__PURE__ */ v(ae, { gap: 0, px: 8, pb: 8, pt: "sm", children: [
+    t === "gallery" && !!p.length && /* @__PURE__ */ e(
+      ue,
       {
-        galleryCollection: f,
+        galleryCollection: p,
         onChange: c
       }
     ),
     t === "upload" && /* @__PURE__ */ e(
-      ve,
+      ge,
       {
         type: S || "image",
-        uploading: _,
-        dropZoneProps: Q,
-        onUpload: D,
-        icon: Y
+        uploading: U,
+        dropZoneProps: J,
+        onUpload: Y,
+        icon: Q
       }
     ),
     t === "link" && /* @__PURE__ */ e(
@@ -146,13 +146,13 @@ const Ce = [
       {
         type: S || "image",
         onChange: c,
-        isValidMediaUrl: J
+        isValidMediaUrl: q
       }
     ),
-    t === "unsplash" && /* @__PURE__ */ e(fe, { onChange: c }),
-    t === "giphy" && /* @__PURE__ */ e(pe, { onChange: c }),
+    t === "unsplash" && /* @__PURE__ */ e(pe, { onChange: c }),
+    t === "giphy" && /* @__PURE__ */ e(he, { onChange: c }),
     t === "googleDrive" && l && /* @__PURE__ */ e(
-      ge,
+      fe,
       {
         isConnected: l.isConnected,
         connectedEmail: l.connectedEmail,
@@ -168,104 +168,78 @@ const Ce = [
         error: l.error
       }
     ),
-    t === "media" && a && /* @__PURE__ */ e(
-      ue,
+    t === "media" && r && /* @__PURE__ */ e(
+      ce,
       {
-        items: a.items,
-        isLoading: a.isLoading,
-        breadcrumbs: a.breadcrumbs,
-        onFolderClick: a.onFolderClick,
-        onBreadcrumbClick: a.onBreadcrumbClick,
+        items: r.items,
+        isLoading: r.isLoading,
+        breadcrumbs: r.breadcrumbs,
+        onFolderClick: r.onFolderClick,
+        onBreadcrumbClick: r.onBreadcrumbClick,
         onSelect: (n) => {
-          a.onSelect?.(n), m(!1);
+          r.onSelect?.(n), m(!1);
         }
       }
     )
-  ] }), ne = /* @__PURE__ */ e(r, { justify: "space-between", align: "center", children: /* @__PURE__ */ e(
-    x,
+  ] }), D = /* @__PURE__ */ e(
+    de,
     {
-      defaultValue: "gallery",
       value: t,
-      onChange: (n) => n && z(n),
-      styles: {
-        list: {
-          alignItems: "center",
-          paddingRight: "var(--mantine-spacing-xs)"
-        }
-      },
-      w: "100%",
-      children: /* @__PURE__ */ d(
-        x.List,
+      onChange: (n) => W(n),
+      height: 54,
+      pillPaddingX: 12,
+      items: o.map((n) => ({
+        value: n.value,
+        label: n.label,
+        disabled: X
+      })),
+      rightSlot: $ && /* @__PURE__ */ e(
+        V,
         {
-          style: {
-            gap: "4px"
-          },
-          px: 8,
-          h: 54,
-          children: [
-            s.map((n) => /* @__PURE__ */ e(
-              x.Tab,
-              {
-                className: w.originalTab,
-                disabled: $,
-                h: "100%",
-                p: 0,
-                value: n.value,
-                onClick: () => z(n.value),
-                children: /* @__PURE__ */ e(r, { className: w.customTab, px: "sm", h: 36, children: n.label })
-              },
-              n.value
-            )),
-            q && /* @__PURE__ */ e(
-              A,
-              {
-                variant: "subtle",
-                fz: "sm",
-                lh: "sm",
-                fw: 500,
-                px: "sm",
-                size: "30px",
-                onClick: U,
-                color: "var(--mantine-color-gray-light-color)",
-                style: { marginLeft: "auto" },
-                children: i("remove")
-              }
-            )
-          ]
+          variant: "subtle",
+          fz: "sm",
+          lh: "sm",
+          fw: 500,
+          px: "sm",
+          size: "30px",
+          onClick: L,
+          color: "var(--mantine-color-gray-light-color)",
+          style: { marginLeft: "auto" },
+          children: i("remove")
         }
       )
     }
-  ) });
-  return p ? /* @__PURE__ */ e(
-    oe,
+  );
+  return h ? /* @__PURE__ */ e(
+    re,
     {
       "data-file-picker-inline": !0,
       bdrs: 8,
       p: 12,
       bg: "light-dark(var(--mantine-color-white), var(--mantine-color-dark-7))",
-      children: B
+      children: G
     }
-  ) : /* @__PURE__ */ d(
-    F,
+  ) : /* @__PURE__ */ v(
+    P,
     {
-      width: O,
+      width: H,
       radius: "var(--mantine-spacing-sm)",
-      position: R,
+      position: O,
       shadow: "md",
-      opened: T,
-      onChange: G,
+      opened: x,
+      onChange: z,
       withinPortal: !0,
-      ...K || {},
+      ...w || {},
       children: [
-        /* @__PURE__ */ e(F.Target, { children: /* @__PURE__ */ e(r, { onClick: () => G(!T), ...W, children: H ?? ee }) }),
-        /* @__PURE__ */ d(F.Dropdown, { p: 0, children: [
-          ne,
-          B
+        /* @__PURE__ */ e(P.Target, { children: /* @__PURE__ */ e(s, { onClick: () => z(!x), ...K, children: _ ?? Z }) }),
+        /* @__PURE__ */ v(P.Dropdown, { p: 0, children: [
+          D,
+          G
         ] })
       ]
     }
   );
 };
 export {
-  He as FilePicker
+  Oe as FilePicker
 };

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

@@ -1,17 +1,13 @@
-const o = "_itemImage_5y6cx_1", t = "_imageAuthor_5y6cx_14", c = "_originalTab_5y6cx_22", e = "_customTab_5y6cx_28", _ = "_button_5y6cx_36", a = "_pickerDropZone_5y6cx_46", n = {
-  itemImage: o,
+const e = "_itemImage_119se_1", t = "_imageAuthor_119se_27", o = "_button_119se_43", s = "_pickerDropZone_119se_63", _ = {
+  itemImage: e,
   imageAuthor: t,
-  originalTab: c,
-  customTab: e,
-  button: _,
-  pickerDropZone: a
+  button: o,
+  pickerDropZone: s
 };
 export {
-  _ as button,
-  e as customTab,
-  n as default,
+  o as button,
+  _ as default,
   t as imageAuthor,
-  o as itemImage,
-  c as originalTab,
-  a as pickerDropZone
+  e as itemImage,
+  s as pickerDropZone
 };

package/dist/components/FilePicker/FilePickerGallery.js

@@ -1,4 +1,4 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
 import { useState as d, useMemo as f } from "react";
 import { useTranslation as x } from "react-i18next";
 import { Search01Icon as $ } from "@hugeicons/core-free-icons";
@@ -6,17 +6,17 @@ import { HugeiconsIcon as v } from "@hugeicons/react";
 import { Stack as m, FocusTrap as g, TextInput as I, Text as u, SimpleGrid as w, AspectRatio as C } from "@mantine/core";
 import S from "./FilePicker.module.css.js";
 const G = ({
-  galleryCollection: n,
+  galleryCollection: i,
   onChange: p
 }) => {
-  const { t: a } = x("ui"), [i, h] = d(""), l = f(() => {
-    const e = i.trim().toLowerCase();
-    return e ? n.map((t) => ({
+  const { t: a } = x("ui"), [s, h] = d(""), c = f(() => {
+    const e = s.trim().toLowerCase();
+    return e ? i.map((t) => ({
       ...t,
-      items: t.items.filter((s) => `${t.title} ${t.id} ${t.path} ${s}`.toLowerCase().includes(e))
-    })).filter((t) => t.items.length > 0) : n;
-  }, [n, i]);
-  return /* @__PURE__ */ c(m, { gap: "sm", children: [
+      items: t.items.filter((n) => `${t.title} ${t.id} ${t.path} ${n}`.toLowerCase().includes(e))
+    })).filter((t) => t.items.length > 0) : i;
+  }, [i, s]);
+  return /* @__PURE__ */ l(m, { gap: "sm", children: [
     /* @__PURE__ */ r(g, { active: !0, children: /* @__PURE__ */ r(
       I,
       {
@@ -24,11 +24,11 @@ const G = ({
         maxLength: 50,
         placeholder: a("changeCover.searchImage"),
         "data-autofocus": !0,
-        value: i,
+        value: s,
         onChange: (e) => h(e.currentTarget.value)
       }
     ) }),
-    /* @__PURE__ */ r(m, { gap: "xs", mah: 400, w: "100%", style: { overflow: "auto" }, children: l.length === 0 && i.trim() ? /* @__PURE__ */ r(u, { fz: "xs", c: "dimmed", ta: "center", py: "xs", children: a("changeCover.noResult") }) : l.map((e) => /* @__PURE__ */ c(m, { gap: 4, pb: "sm", children: [
+    /* @__PURE__ */ r(m, { gap: "xs", mah: 400, w: "100%", style: { overflow: "auto" }, children: c.length === 0 && s.trim() ? /* @__PURE__ */ r(u, { fz: "xs", c: "dimmed", ta: "center", py: "xs", children: a("changeCover.noResult") }) : c.map((e) => /* @__PURE__ */ l(m, { gap: 4, pb: "sm", children: [
       /* @__PURE__ */ r("a", { target: "_blank", href: e?.url || "#", rel: "noreferrer", children: /* @__PURE__ */ r(
         u,
         {
@@ -41,7 +41,7 @@ const G = ({
           children: e.title
         }
       ) }),
-      /* @__PURE__ */ r(w, { spacing: 10, cols: 4, children: e.items.map((t, s) => {
+      /* @__PURE__ */ r(w, { spacing: 10, cols: 4, children: e.items.map((t, n) => {
         const o = "/images/covers/" + e.path + t;
         return /* @__PURE__ */ r(
           C,
@@ -53,7 +53,7 @@ const G = ({
               backgroundImage: `url(${o})`
             }
           },
-          `${e.id}-${t}-${s}`
+          `${e.id}-${t}-${n}`
         );
       }) })
     ] }, e.id)) })

package/dist/components/FilePicker/FilePickerGiphy.js

@@ -1,5 +1,5 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import { useState as l, useMemo as x, useEffect as f, useCallback as I } from "react";
+import { useState as l, useMemo as y, useEffect as f, useCallback as I } from "react";
 import { useTranslation as S } from "react-i18next";
 import { Search01Icon as P } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon as T } from "@hugeicons/react";
@@ -15,7 +15,7 @@ const k = (c) => (c || []).reduce((o, i) => (o[i.id] = i, o), {}), U = ({
   const { t: o } = S("ui"), [i, v] = l(""), [m] = F(i, 800), [u, p] = l(1), [d, h] = l({}), { data: r, isLoading: s } = N(
     { q: m, limit: 24, offset: (u - 1) * 24 + 1 },
     u
-  ), a = x(
+  ), a = y(
     () => Object.values({ ...d, ...k(r?.items) }),
     [d, r?.items]
   ), g = M(() => {
@@ -28,7 +28,7 @@ const k = (c) => (c || []).reduce((o, i) => (o[i.id] = i, o), {}), U = ({
   }, [r?.items, g]), f(() => {
     h({});
   }, [m]);
-  const y = I(
+  const x = I(
     (t) => {
       v(t.currentTarget.value), p(1);
     },
@@ -43,7 +43,7 @@ const k = (c) => (c || []).reduce((o, i) => (o[i.id] = i, o), {}), U = ({
         placeholder: o("changeCover.searchGifs"),
         "data-autofocus": !0,
         value: i,
-        onChange: y
+        onChange: x
       }
     ) }),
     /* @__PURE__ */ n(C, { mah: 300, w: "100%", style: { overflowY: "auto" }, children: [

package/dist/components/FilePicker/FilePickerGoogleDrive.js

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { useState as C, useRef as D, useEffect as y, useCallback as I } from "react";
+import { useState as C, useRef as D, useEffect as I, useCallback as y } from "react";
 import { useTranslation as T } from "react-i18next";
 import { Search01Icon as G } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon as R } from "@hugeicons/react";
@@ -20,10 +20,10 @@ const O = ({
   error: s
 }) => {
   const { t } = T("ui"), [m, S] = C(""), [u] = j(m, 800), d = D(c);
-  d.current = c, y(() => {
+  d.current = c, I(() => {
     d.current(u);
   }, [u]);
-  const z = I(
+  const z = y(
     (r) => {
       S(r.currentTarget.value);
     },

package/dist/components/FilePicker/FilePickerUnsplash.js

@@ -9,22 +9,22 @@ import { NoData as A } from "../NoData/NoData.js";
 import { FilePickerSkeletonLoader as Q } from "./FilePickerSkeletonLoader.js";
 import { useUnsplashPhotos as R } from "./api/unsplashApi.js";
 import b from "./FilePicker.module.css.js";
-const y = (l) => (l || []).reduce((r, o) => (r[o.id] = o, r), {}), X = ({
+const v = (l) => (l || []).reduce((t, o) => (t[o.id] = o, t), {}), X = ({
   onChange: l
 }) => {
-  const { t: r } = z("ui"), [o, v] = m(""), [u] = q(o, 800), [x, h] = m(1), [p, d] = m({}), { data: a, isLoading: n } = R(
+  const { t } = z("ui"), [o, x] = m(""), [u] = q(o, 800), [y, h] = m(1), [p, d] = m({}), { data: a, isLoading: n } = R(
     {
       query: u,
-      page: x,
+      page: y,
       per_page: 24,
       order_by: "popular"
     }
   ), i = P(
-    () => Object.values({ ...p, ...y(a?.items) }),
+    () => Object.values({ ...p, ...v(a?.items) }),
     [p, a?.items]
   ), g = w(() => {
     setTimeout(() => {
-      d((t) => ({ ...t, ...y(a?.items) }));
+      d((r) => ({ ...r, ...v(a?.items) }));
     }, 0);
   }, 100);
   f(() => {
@@ -33,8 +33,8 @@ const y = (l) => (l || []).reduce((r, o) => (r[o.id] = o, r), {}), X = ({
     d({});
   }, [u]);
   const I = T(
-    (t) => {
-      v(t.currentTarget.value), h(1);
+    (r) => {
+      x(r.currentTarget.value), h(1);
     },
     []
   );
@@ -44,7 +44,7 @@ const y = (l) => (l || []).reduce((r, o) => (r[o.id] = o, r), {}), X = ({
       {
         leftSection: n ? /* @__PURE__ */ e(F, { size: 16 }) : /* @__PURE__ */ e(j, { size: 16, icon: L }),
         maxLength: 50,
-        placeholder: r("changeCover.searchImage"),
+        placeholder: t("changeCover.searchImage"),
         "data-autofocus": !0,
         value: o,
         onChange: I
@@ -52,42 +52,42 @@ const y = (l) => (l || []).reduce((r, o) => (r[o.id] = o, r), {}), X = ({
     ) }),
     /* @__PURE__ */ s(c, { mah: 300, w: "100%", style: { overflowY: "auto" }, children: [
       !!i.length && /* @__PURE__ */ s(k, { gap: 8, children: [
-        /* @__PURE__ */ e(M, { cols: 4, spacing: 10, children: i.map((t) => /* @__PURE__ */ s(c, { children: [
+        /* @__PURE__ */ e(M, { cols: 4, spacing: 10, children: i.map((r) => /* @__PURE__ */ s(c, { children: [
           /* @__PURE__ */ e(
             N,
             {
-              onClick: () => l?.(t.urls.regular),
+              onClick: () => l?.(r.urls.regular),
               ratio: 120 / 65,
               className: b.itemImage,
               style: {
-                backgroundImage: `url(${t.urls.small})`
+                backgroundImage: `url(${r.urls.small})`
               }
             }
           ),
           /* @__PURE__ */ e(c, { className: b.imageAuthor, children: /* @__PURE__ */ s(C, { truncate: !0, c: "gray", size: "xs", children: [
-            r("changeCover.photoBy"),
+            t("changeCover.photoBy"),
             " ",
             /* @__PURE__ */ e(
               C,
               {
                 component: "a",
                 inherit: !0,
-                href: t.user.links.html,
+                href: r.user.links.html,
                 target: "_blank",
                 rel: "noopener noreferrer",
                 onClick: (S) => S.stopPropagation(),
-                children: t.user.name
+                children: r.user.name
               }
             )
           ] }) })
-        ] }, t.id)) }),
+        ] }, r.id)) }),
         a?.hasMore && /* @__PURE__ */ e(
           _,
           {
             variant: "subtle",
             loading: n,
-            onClick: () => h((t) => t + 1),
-            children: r("loadMore")
+            onClick: () => h((r) => r + 1),
+            children: t("loadMore")
           }
         )
       ] }),
@@ -96,7 +96,7 @@ const y = (l) => (l || []).reduce((r, o) => (r[o.id] = o, r), {}), X = ({
         {
           size: 120,
           illustration: "noImage",
-          description: r("changeCover.noResult"),
+          description: t("changeCover.noResult"),
           titleProps: { size: "xs", c: "dimmed" }
         }
       ) }),