@0xchain/header 1.1.0-beta.7 → 1.1.0-beta.71

package/dist/lib/Nav.js

@@ -1,167 +1,240 @@
 'use client';
-import { jsx as r, jsxs as i, Fragment as P } from "react/jsx-runtime";
-import p from "@0xchain/link";
-import j from "./User/index.js";
-import c from "./Setting/index.js";
-import h from "@0xchain/translation";
-import { twMerge as l } from "tailwind-merge";
-import I from "@0xchain/better-link";
-import { useLocale as T } from "next-intl";
-import k from "./User/Logout.js";
-import { useState as m, useCallback as A, useEffect as R } from "react";
-import C from "./User/SignIn.js";
-import { fetchUserProfile as X } from "@0xchain/auth";
-import { onUserEvent as D, cleanUserEvent as K, USER_EVENTS as x } from "./events.js";
-import { usePathname as $ } from "next/navigation";
-import g from "./Explorer.js";
-import { useIsChaindigg as q } from "./context.js";
-function le({ onClick: t = () => {
-}, hideNews: w = !1, hideLogin: U = !1, user: b }) {
-  const a = q(), { gotoAISQL: y, gotoChat: E } = I(), s = T(), n = $(), [L, v] = m(""), [d, N] = m(b), [F, _] = m(!1), S = [
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import LinkBar from "@0xchain/link";
+import UserControl from "./User/index.js";
+import Setting from "./Setting/index.js";
+import Translation from "@0xchain/translation";
+import { twMerge } from "tailwind-merge";
+import BetterLink from "@0xchain/better-link";
+import { useLocale } from "@0xchain/i18n/react";
+import Logout from "./User/Logout.js";
+import { useState, useCallback, useEffect } from "react";
+import SignIn from "./User/SignIn.js";
+import { getClientSession, getRuntimeLoginState } from "@0xchain/auth";
+import { onUserEvent, USER_EVENTS } from "./events.js";
+import { usePathname } from "next/navigation";
+import Explorer from "./Explorer.js";
+import Products from "./Products.js";
+import { useIsChaindigg } from "./context.js";
+import { hasProfileIdentity, fetchHeaderProfile } from "./authProfile.js";
+function Nav({ onClick = () => void 0, hideNews = false, hideLogin = false, user }) {
+  const isChaindigg = useIsChaindigg();
+  const { gotoAISQL, gotoChat } = BetterLink();
+  const locale = useLocale();
+  const pathname = usePathname();
+  const [userKey, setUserKey] = useState("");
+  const [userInfo, setUserInfo] = useState(user);
+  const hasUserProfile = hasProfileIdentity(userInfo);
+  const [, setExplorerExpanded] = useState(false);
+  const ichaingoNavList = [
     {
       baseUrl: process.env.NEXT_PUBLIC_CHAT_URL,
-      href: E({ locale: s }),
-      key: `/${s}`,
-      label: /* @__PURE__ */ r("span", { children: "iSearch" }),
-      show: (e) => e === `/${s}` || e.includes(`/${s}/conversation`)
+      href: gotoChat({ locale }),
+      key: `/${locale}`,
+      label: /* @__PURE__ */ jsx("span", { children: "iSearch" }),
+      show: (pathname2) => {
+        return pathname2 === `/${locale}` || pathname2.includes(`/${locale}/conversation`);
+      }
     },
     {
-      baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
-      href: y({ locale: s }),
-      key: "/sql",
-      label: "iSQL",
-      show: (e) => e.includes(`/${s}/sql`)
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
+      href: gotoAISQL({ locale }),
+      key: "/query",
+      label: "iQuery",
+      show: (pathname2) => {
+        return pathname2.includes(`/${locale}/query`);
+      }
     },
     {
-      baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
-      href: "/explorer",
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
       key: "/explorer",
-      label: /* @__PURE__ */ r(g, { onClick: t, onExpandChange: _ }),
-      show: (e) => e.includes("/explorer")
+      href: "/explorer",
+      label: /* @__PURE__ */ jsx(Explorer, { onClick, onExpandChange: setExplorerExpanded }),
+      show: (pathname2) => {
+        return pathname2.includes(`/explorer`);
+      }
     },
     {
-      baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
-      href: "/news",
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
+      href: `/news`,
       key: "/news",
-      label: /* @__PURE__ */ r(h, { value: "news", parentKey: "menu" }),
-      show: (e) => e.includes("/news")
+      label: /* @__PURE__ */ jsx(Translation, { value: "news", parentKey: "menu" }),
+      show: (pathname2) => {
+        return pathname2.includes(`/news`);
+      }
     },
     {
-      baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
-      href: "/ranking/token",
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
+      href: `/ranking`,
       key: "/ranking",
-      label: /* @__PURE__ */ r(h, { value: "ranking", parentKey: "menu" }),
-      show: (e) => e.includes("/ranking")
+      label: /* @__PURE__ */ jsx(Translation, { value: "ranking", parentKey: "menu" }),
+      show: (pathname2) => {
+        return pathname2.includes(`/ranking`);
+      }
+    },
+    {
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
+      href: `/learn`,
+      key: "/learn",
+      label: /* @__PURE__ */ jsx(Translation, { value: "learn", parentKey: "menu" }),
+      show: (pathname2) => {
+        return pathname2.includes(`/learn`);
+      }
+    },
+    {
+      baseUrl: process.env.NEXT_PUBLIC_APP_URL,
+      key: "/products",
+      label: /* @__PURE__ */ jsx(Products, { onClick }),
+      show: (pathname2) => {
+        return pathname2.includes("/widget");
+      }
     }
-  ].filter((e) => w ? !["/explorer", "/chat", "/sql"].includes(e.key) : !0), B = [
+  ]?.filter((item) => {
+    if (hideNews) {
+      return !["/explorer", "/chat", "/query"].includes(item.key);
+    }
+    return true;
+  });
+  const chaindiggNavList = [
     {
-      baseUrl: process.env.NEXT_PUBLIC_BASE_URL,
-      href: "/explorer",
       key: "/explorer",
-      label: /* @__PURE__ */ r(g, {}),
-      show: (e) => e.includes("/explorer")
+      label: /* @__PURE__ */ jsx(Explorer, {}),
+      show: (pathname2) => {
+        return pathname2.includes(`/explorer`);
+      }
     }
-  ], u = a ? B : S, f = A(() => new Promise((e) => {
-    X().then((o) => {
-      N(o), v((/* @__PURE__ */ new Date()).getTime().toString()), e(o);
-    });
-  }), []);
-  return R(() => {
-    if (!a)
-      return D(x.PROFILE_UPDATED, f), () => {
-        K(x.PROFILE_UPDATED, f);
-      };
-  }, [a]), a ? /* @__PURE__ */ i(
-    "nav",
-    {
-      className: l(
-        "flex flex-col justify-start items-start md:px-3",
-        "md:flex-row md:justify-end md:items-start md:px-0",
-        "md:gap-6"
-      ),
-      children: [
-        /* @__PURE__ */ r(
-          "ul",
-          {
-            className: l(
-              "flex flex-col justify-start items-start w-full h-full text-sm leading-[44px] z-1001 text-foreground",
-              "md:flex-row md:items-center md:w-auto md:h-[34px] md:leading-[34px] md:gap-6",
-              "order-2 md:order-0"
-            ),
-            children: u.map((e, o) => /* @__PURE__ */ r(
-              "li",
-              {
-                className: l(
-                  "w-full md:w-auto h-11 md:h-auto cursor-pointer hover:text-primary",
-                  e.show(n) && "border-b-2 border-primary text-primary"
-                ),
-                children: e.href === n ? e.label : /* @__PURE__ */ r(
-                  p,
-                  {
-                    href: e.href,
-                    onClick: t,
-                    className: "h-full flex items-center justify-start",
-                    baseUrl: e.baseUrl,
-                    suppressHydrationWarning: !0,
-                    children: e.label
-                  }
-                )
-              },
-              o
-            ))
-          }
-        ),
-        /* @__PURE__ */ r(c, { onClick: t })
-      ]
+  ];
+  const NavList = isChaindigg ? chaindiggNavList : ichaingoNavList;
+  const updateUserInfo = useCallback(async () => {
+    try {
+      const profile = await fetchHeaderProfile();
+      setUserInfo(profile || {});
+      setUserKey((/* @__PURE__ */ new Date()).getTime().toString());
+      return profile;
+    } catch (error) {
+      console.error(error);
+      setUserInfo({});
+      return null;
+    }
+  }, []);
+  useEffect(() => {
+    if (isChaindigg) return;
+    const cleanProfileUpdated = onUserEvent(USER_EVENTS.PROFILE_UPDATED, updateUserInfo);
+    const cleanLoggedIn = onUserEvent(USER_EVENTS.LOGGED_IN, updateUserInfo);
+    const cookieLoggedIn = getClientSession().isLoggedIn;
+    if (!hasUserProfile && (cookieLoggedIn || getRuntimeLoginState() === true)) {
+      updateUserInfo();
     }
-  ) : /* @__PURE__ */ i(
+    return () => {
+      cleanProfileUpdated();
+      cleanLoggedIn();
+    };
+  }, [hasUserProfile, isChaindigg, updateUserInfo]);
+  if (isChaindigg) {
+    return /* @__PURE__ */ jsxs(
+      "nav",
+      {
+        className: twMerge(
+          "flex flex-col justify-start items-start md:px-3",
+          "md:flex-row md:justify-start md:items-start md:px-0",
+          "md:gap-6"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            "ul",
+            {
+              className: twMerge(
+                "flex flex-col flex-1 justify-start items-start w-full h-full text-sm leading-[44px] z-1001 text-foreground",
+                "md:flex-row md:items-center md:w-auto md:h-[34px] md:leading-[34px] md:gap-5",
+                "order-2 md:order-0"
+              ),
+              children: NavList.map((item, index) => /* @__PURE__ */ jsx(
+                "li",
+                {
+                  className: twMerge(
+                    "w-full md:w-auto h-11 md:h-auto cursor-pointer hover:text-primary",
+                    item.show(pathname) && "border-b-2 border-primary text-primary"
+                  ),
+                  children: !item.href || item.href === pathname ? item.label : /* @__PURE__ */ jsx(
+                    LinkBar,
+                    {
+                      href: item.href,
+                      onClick,
+                      className: twMerge(
+                        "w-full md:w-auto h-11 md:h-auto cursor-pointer hover:text-primary",
+                        item.show(pathname) && "border-b-2 border-primary text-primary",
+                        "h-full flex items-center justify-start"
+                      ),
+                      baseUrl: item.baseUrl,
+                      suppressHydrationWarning: true,
+                      children: item.label
+                    }
+                  )
+                },
+                index
+              ))
+            }
+          ),
+          /* @__PURE__ */ jsx(Setting, { onClick })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
     "nav",
     {
-      className: l(
+      className: twMerge(
         "flex flex-col justify-start items-start md:px-3",
-        "md:flex-row md:justify-end md:items-center md:px-0",
+        "md:flex-row md:justify-end md:items-center md:px-0 md:flex-1",
         "md:gap-4"
       ),
       children: [
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ jsx(
           "ul",
           {
-            className: l(
+            className: twMerge(
               "flex flex-col justify-start items-start w-full h-full text-sm z-1001 text-foreground",
-              "md:flex-row md:items-center md:w-auto md:h-[34px] md:gap-6",
+              "md:flex-row md:items-center md:w-auto md:h-[34px] md:gap-6 md:flex-1",
               "order-2 md:order-0"
             ),
-            children: u.map((e, o) => /* @__PURE__ */ r(
-              "li",
-              {
-                className: l(
-                  "w-full md:px-4 md:py-1 md:h-auto font-bold md:w-auto cursor-pointer md:rounded-full",
-                  e.key === "/explorer" ? "h-auto" : "h-11",
-                  e.show(n) ? "md:text-primary md:bg-primary/20" : "md:hover:bg-border"
-                ),
-                children: e.href === n ? e.label : /* @__PURE__ */ r(
-                  p,
-                  {
-                    href: e.href,
-                    onClick: t,
-                    className: "h-full flex items-center justify-start",
-                    baseUrl: e.baseUrl,
-                    suppressHydrationWarning: !0,
-                    children: e.label
-                  }
-                )
-              },
-              o
-            ))
+            children: NavList.map((item, index) => {
+              return /* @__PURE__ */ jsx(
+                "li",
+                {
+                  className: twMerge(
+                    "w-full md:h-auto font-bold md:w-auto cursor-pointer md:rounded-full",
+                    item.key === "/explorer" || item.key === "/products" ? "h-auto" : "h-11",
+                    item.show(pathname) ? "md:text-primary md:bg-primary/10" : "md:hover:bg-border"
+                  ),
+                  children: !item.href || item.href === pathname ? item.label : /* @__PURE__ */ jsx(
+                    LinkBar,
+                    {
+                      href: item.href,
+                      onClick,
+                      className: twMerge(
+                        "w-full md:px-4 md:py-1 md:h-auto font-bold md:w-auto cursor-pointer md:rounded-full",
+                        item.key === "/explorer" || item.key === "/products" ? "h-auto" : "h-11",
+                        item.show(pathname) ? "md:text-primary md:bg-primary/10" : "md:hover:bg-border",
+                        "h-full flex items-center justify-start"
+                      ),
+                      baseUrl: item.baseUrl,
+                      suppressHydrationWarning: true,
+                      children: item.label
+                    }
+                  )
+                },
+                index
+              );
+            })
           }
         ),
-        /* @__PURE__ */ r(c, { onClick: t }),
-        !n.includes("/login") && !U ? /* @__PURE__ */ i(P, { children: [
-          /* @__PURE__ */ r(j, { onClick: t, userInfo: d }, L),
-          d != null && d.id ? /* @__PURE__ */ r("div", { className: "flex md:hidden h-11 md:h-auto cursor-pointer whitespace-nowrap order-3 bg-background rounded-lg p-2 mt-3 w-full items-center justify-center text-muted-foreground", children: /* @__PURE__ */ r(k, {}) }) : /* @__PURE__ */ r(
-            C,
+        /* @__PURE__ */ jsx(Setting, { onClick }),
+        !pathname.includes("/login") && !hideLogin ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(UserControl, { onClick, userInfo }, userKey),
+          hasUserProfile ? /* @__PURE__ */ jsx("div", { className: "flex md:hidden h-11 md:h-auto cursor-pointer whitespace-nowrap order-3 bg-background rounded-lg p-2 mt-3 w-full items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx(Logout, {}) }) : /* @__PURE__ */ jsx(
+            SignIn,
             {
-              onClick: t,
+              onClick,
               className: "flex md:hidden h-11 cursor-pointer whitespace-nowrap order-3 bg-primary text-white rounded-lg p-2 mt-3 w-full items-center justify-center"
             }
           )
@@ -171,5 +244,5 @@ function le({ onClick: t = () => {
   );
 }
 export {
-  le as default
+  Nav as default
 };

package/dist/lib/Products.js

@@ -0,0 +1,89 @@
+'use client';
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import Translation from "@0xchain/translation";
+import { useLocale } from "@0xchain/i18n/react";
+import { Dropdown } from "antd";
+import { useState } from "react";
+import { Accordion, AccordionItem, AccordionTrigger } from "@0xchain/ui/accordion";
+const PRODUCT_ITEMS = [
+  {
+    key: "widget",
+    href: "/widget",
+    label: /* @__PURE__ */ jsx(Translation, { value: "products.widget", parentKey: "menu" })
+  }
+];
+function Products({
+  onClick,
+  onExpandChange
+}) {
+  const locale = useLocale();
+  const [accordionValue, setAccordionValue] = useState("");
+  const handleClick = (e, href) => {
+    e?.preventDefault();
+    e?.stopPropagation();
+    onClick?.();
+    setAccordionValue("");
+    const baseUrl = process.env.NEXT_PUBLIC_APP_URL || "";
+    window.location.href = `${baseUrl}/${locale}${href}`;
+  };
+  const renderItemContent = (item) => /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center gap-2 py-2 cursor-pointer font-medium", children: item.label });
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "hidden md:block", children: /* @__PURE__ */ jsx(
+      Dropdown,
+      {
+        getPopupContainer: () => document.body,
+        classNames: {
+          root: "w-50"
+        },
+        arrow: { pointAtCenter: true },
+        placement: "bottom",
+        menu: {
+          items: PRODUCT_ITEMS.map((item) => ({
+            label: renderItemContent(item),
+            key: item.key,
+            onClick: (info) => handleClick(info.domEvent, item.href)
+          }))
+        },
+        children: /* @__PURE__ */ jsx("div", { className: "whitespace-nowrap flex items-center gap-1 rounded-lg md:px-4 md:py-1 ", children: /* @__PURE__ */ jsx(Translation, { value: "products.product", parentKey: "menu" }) })
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "md:hidden w-full", children: /* @__PURE__ */ jsxs("div", { onClick: (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+    }, children: [
+      /* @__PURE__ */ jsx(
+        Accordion,
+        {
+          type: "single",
+          collapsible: true,
+          className: "w-full",
+          value: accordionValue,
+          onValueChange: (value) => {
+            setAccordionValue(value);
+            onExpandChange?.(!!value);
+          },
+          children: /* @__PURE__ */ jsx(AccordionItem, { value: "products", className: "border-0", children: /* @__PURE__ */ jsx(AccordionTrigger, { className: "rounded-lg font-medium h-11 w-full flex py-2 justify-between items-center hover:no-underline focus-visible:ring-0 focus-visible:ring-offset-0", children: /* @__PURE__ */ jsx("div", { className: "flex w-full justify-between items-center", children: /* @__PURE__ */ jsx("span", { className: "text-foreground", children: /* @__PURE__ */ jsx(Translation, { value: "products.product", parentKey: "menu" }) }) }) }) })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "grid transition-[grid-template-rows] duration-300 ease-in-out",
+          style: { gridTemplateRows: accordionValue ? "1fr" : "0fr" },
+          children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "mt-3 rounded-lg flex flex-col gap-2 max-h-[60vh] overflow-auto", children: PRODUCT_ITEMS.map((item) => /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "w-full",
+              onClick: (e) => handleClick(e, item.href),
+              children: renderItemContent(item)
+            },
+            item.key
+          )) }) })
+        }
+      )
+    ] }) })
+  ] });
+}
+export {
+  Products as default
+};

package/dist/lib/Right.js

@@ -1,21 +1,26 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
-import l from "./Nav.js";
-import i from "./Drawer.js";
-import { twMerge as s } from "tailwind-merge";
-var o = /* @__PURE__ */ ((t) => (t.EXPLORER = "explorer", t.CHAT = "chat", t.DEFAULT = "default", t))(o || {});
-function x({
-  hideNews: t = !1,
-  hideLogin: a = !1,
-  user: e,
-  source: m = "default"
+import { jsxs, jsx } from "react/jsx-runtime";
+import Nav from "./Nav.js";
+import Drawer from "./Drawer.js";
+import { twMerge } from "tailwind-merge";
+var HeaderSource = /* @__PURE__ */ ((HeaderSource2) => {
+  HeaderSource2["EXPLORER"] = "explorer";
+  HeaderSource2["CHAT"] = "chat";
+  HeaderSource2["DEFAULT"] = "default";
+  return HeaderSource2;
+})(HeaderSource || {});
+function Right({
+  hideNews = false,
+  hideLogin = false,
+  user,
+  source = "default"
   /* DEFAULT */
 }) {
-  return /* @__PURE__ */ f("div", { className: s(m === "chat" ? "" : "flex justify-end items-center md:gap-10 z-1001"), children: [
-    /* @__PURE__ */ r(i, { hideLogin: a, hideNews: t, user: e }),
-    /* @__PURE__ */ r("div", { className: "hidden md:block", children: /* @__PURE__ */ r(l, { hideNews: t, hideLogin: a, user: e }) })
+  return /* @__PURE__ */ jsxs("div", { className: twMerge(source === "chat" ? "" : "flex md:flex-1 justify-start items-center md:gap-10 z-1001"), children: [
+    /* @__PURE__ */ jsx(Drawer, { hideLogin, hideNews, user }),
+    /* @__PURE__ */ jsx("div", { className: "hidden md:block flex-1", children: /* @__PURE__ */ jsx(Nav, { hideNews, hideLogin, user }) })
   ] });
 }
 export {
-  o as HeaderSource,
-  x as default
+  HeaderSource,
+  Right as default
 };

package/dist/lib/Setting/SettingBody.js

@@ -1,56 +1,64 @@
 'use client';
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { useLocale as h, useTranslations as d } from "next-intl";
-import { useSearchParams as p, usePathname as x } from "next/navigation";
-import { Accordion as b, AccordionItem as w, AccordionTrigger as y, AccordionContent as N } from "@0xchain/ui/accordion";
-import { twMerge as j } from "tailwind-merge";
-import { useCallback as v } from "react";
-import k from "@0xchain/link";
-import $ from "@0xchain/theme-toggle";
-function U({ onClick: f = () => {
-} }) {
-  var i;
-  const a = h(), l = p(), t = d("lang"), s = d("setting"), o = [
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useLocale, useTranslations } from "@0xchain/i18n/react";
+import { useSearchParams, usePathname } from "next/navigation";
+import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from "@0xchain/ui/accordion";
+import { twMerge } from "tailwind-merge";
+import { useCallback } from "react";
+import LinkBar from "@0xchain/link";
+import ThemeToggle from "@0xchain/theme-toggle";
+function SettingBody({ onClick = () => void 0 }) {
+  const locale = useLocale();
+  const params = useSearchParams();
+  const t = useTranslations("lang");
+  const tSetting = useTranslations("setting");
+  const supportedLanguages = [
     { name: t("en"), lang: "en" },
     { name: t("ja"), lang: "ja" },
     { name: t("ko"), lang: "ko" },
     { name: t("zh-hant"), lang: "zh-hant" },
     { name: t("zh-hans"), lang: "zh-hans" }
-  ], c = x(), u = v(
-    (n) => {
-      const m = c.replace(new RegExp(`/${a}(/|$)`), `/${n}$1`), g = l.toString();
-      return g ? `${m}?${g}` : m;
+  ];
+  const pathname = usePathname();
+  const generateLanguageUrl = useCallback(
+    (newLang) => {
+      const newUrl = pathname.replace(new RegExp(`/${locale}(/|$)`), `/${newLang}$1`);
+      const search = params.toString();
+      if (search) {
+        return `${newUrl}?${search}`;
+      }
+      return newUrl;
     },
-    [c, a, l]
+    [pathname, locale, params]
   );
-  return /* @__PURE__ */ r("div", { className: "text-sm gap-2 flex flex-col justify-start items-start md:py-2", children: [
-    /* @__PURE__ */ e("div", { className: "flex w-full justify-between items-center", children: /* @__PURE__ */ e(b, { type: "single", className: "flex-1", collapsible: !0, children: /* @__PURE__ */ r(w, { value: a, className: "border-0", children: [
-      /* @__PURE__ */ e(y, { className: "p-2 bg-background rounded-lg h-11 md:h-auto text-gray-500 w-full flex py-2 justify-between items-center hover:no-underline focus-visible:ring-0 focus-visible:ring-offset-0", children: /* @__PURE__ */ r("div", { className: "flex w-full justify-between items-center", children: [
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: s("language") }),
-        /* @__PURE__ */ e("span", { className: "text-foreground", children: (i = o.find((n) => n.lang === a)) == null ? void 0 : i.name })
+  return /* @__PURE__ */ jsxs("div", { className: "text-sm gap-2 flex flex-col justify-start items-start md:py-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex w-full justify-between items-center", children: /* @__PURE__ */ jsx(Accordion, { type: "single", className: "flex-1", collapsible: true, children: /* @__PURE__ */ jsxs(AccordionItem, { value: locale, className: "border-0", children: [
+      /* @__PURE__ */ jsx(AccordionTrigger, { className: "p-2 bg-background rounded-lg h-11 md:h-auto text-gray-500 w-full flex py-2 justify-between items-center hover:no-underline focus-visible:ring-0 focus-visible:ring-offset-0", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full justify-between items-center", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-foreground", children: tSetting("language") }),
+        /* @__PURE__ */ jsx("span", { className: "text-foreground", children: supportedLanguages.find((item) => item.lang === locale)?.name })
       ] }) }),
-      /* @__PURE__ */ e(N, { className: "bg-background mt-3 rounded-lg flex flex-col gap-2", children: o.map((n) => /* @__PURE__ */ e(
-        k,
+      /* @__PURE__ */ jsx(AccordionContent, { className: "bg-background mt-3 rounded-lg flex flex-col gap-2", children: supportedLanguages.map((item) => /* @__PURE__ */ jsx(
+        LinkBar,
         {
-          prefetch: !1,
-          withLocale: !1,
-          className: j(
+          prefetch: false,
+          withLocale: false,
+          className: twMerge(
             "p-2 rounded-lg flex w-full justify-between items-center",
-            a === n.lang ? "text-primary" : ""
+            locale === item.lang ? "text-primary" : ""
           ),
-          href: u(n.lang),
-          onClick: f,
-          children: n.name
+          href: generateLanguageUrl(item.lang),
+          onClick,
+          children: item.name
         },
-        n.lang
+        item.lang
       )) })
     ] }) }) }),
-    /* @__PURE__ */ r("div", { className: "bg-background p-2 rounded-lg h-11 md:h-auto flex w-full justify-between items-center", children: [
-      /* @__PURE__ */ e("div", { children: s("theme") }),
-      /* @__PURE__ */ e($, {})
+    /* @__PURE__ */ jsxs("div", { className: "bg-background p-2 rounded-lg h-11 md:h-auto flex w-full justify-between items-center", children: [
+      /* @__PURE__ */ jsx("div", { children: tSetting("theme") }),
+      /* @__PURE__ */ jsx(ThemeToggle, {})
     ] })
   ] });
 }
 export {
-  U as default
+  SettingBody as default
 };