@locusgraph/components 0.1.1 → 0.2.1

package/dist/shell/docs/on-this-page.js

@@ -1,12 +1,83 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+
+import { c as _c } from "react/compiler-runtime";
 import { cn } from "cn";
 import { useActiveSection } from "./use-active-section.js";
-function OnThisPage({ sections, title = "On This Page" }) {
-    const [activeId, pinSection] = useActiveSection(sections.map((section) => section.id));
-    return (_jsxs("nav", { "aria-label": title, className: "flex flex-col gap-2 text-sm", children: [_jsx("p", { className: "h-6 text-xs font-medium text-muted-foreground", children: title }), sections.map((section) => (_jsx("button", { type: "button", onClick: () => {
-                    pinSection(section.id);
-                    document.getElementById(section.id)?.scrollIntoView({ behavior: "smooth" });
-                }, "aria-current": activeId === section.id ? "location" : undefined, className: cn("text-left text-[0.8rem] text-muted-foreground transition-colors hover:text-foreground", section.nested && "pl-4", activeId === section.id && "font-medium text-foreground"), children: section.title }, section.id)))] }));
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function OnThisPage(t0) {
+  const $ = _c(15);
+  const {
+    sections,
+    title: t1
+  } = t0;
+  const title = t1 === undefined ? "On This Page" : t1;
+  let t2;
+  if ($[0] !== sections) {
+    t2 = sections.map(_temp);
+    $[0] = sections;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const [activeId, pinSection] = useActiveSection(t2);
+  let t3;
+  if ($[2] !== title) {
+    t3 = /*#__PURE__*/_jsx("p", {
+      className: "eyebrow flex h-6 items-center",
+      children: title
+    });
+    $[2] = title;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  let t4;
+  if ($[4] !== activeId || $[5] !== pinSection || $[6] !== sections) {
+    let t5;
+    if ($[8] !== activeId || $[9] !== pinSection) {
+      t5 = section_0 => /*#__PURE__*/_jsx("button", {
+        type: "button",
+        onClick: () => {
+          pinSection(section_0.id);
+          document.getElementById(section_0.id)?.scrollIntoView({
+            behavior: "smooth"
+          });
+        },
+        "aria-current": activeId === section_0.id ? "location" : undefined,
+        className: cn("text-left text-[0.8rem] text-muted-foreground transition-colors hover:text-foreground", section_0.nested && "pl-4", activeId === section_0.id && "font-medium text-foreground"),
+        children: section_0.title
+      }, section_0.id);
+      $[8] = activeId;
+      $[9] = pinSection;
+      $[10] = t5;
+    } else {
+      t5 = $[10];
+    }
+    t4 = sections.map(t5);
+    $[4] = activeId;
+    $[5] = pinSection;
+    $[6] = sections;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[11] !== t3 || $[12] !== t4 || $[13] !== title) {
+    t5 = /*#__PURE__*/_jsxs("nav", {
+      "aria-label": title,
+      className: "flex flex-col gap-2 text-sm",
+      children: [t3, t4]
+    });
+    $[11] = t3;
+    $[12] = t4;
+    $[13] = title;
+    $[14] = t5;
+  } else {
+    t5 = $[14];
+  }
+  return t5;
+}
+function _temp(section) {
+  return section.id;
 }
 export { OnThisPage };

package/dist/shell/docs/use-active-section.js

@@ -1,54 +1,100 @@
+import { c as _c } from "react/compiler-runtime";
 import { useCallback, useEffect, useRef, useState } from "react";
 const SMOOTH_SCROLL_MS = 800;
 function isWindowScrolledToBottom() {
-    const pageHeight = document.documentElement.scrollHeight;
-    const canScroll = pageHeight > window.innerHeight + 2;
-    return canScroll && window.innerHeight + window.scrollY >= pageHeight - 2;
+  const pageHeight = document.documentElement.scrollHeight;
+  const canScroll = pageHeight > window.innerHeight + 2;
+  return canScroll && window.innerHeight + window.scrollY >= pageHeight - 2;
 }
 const ACTIVE_LINE_PX = 120;
 function lastSectionAboveLine(ids) {
-    let current = ids[0];
-    for (const id of ids) {
-        const top = document.getElementById(id)?.getBoundingClientRect().top;
-        if (top !== undefined && top <= ACTIVE_LINE_PX) {
-            current = id;
-        }
+  let current = ids[0];
+  for (const id of ids) {
+    const top = document.getElementById(id)?.getBoundingClientRect().top;
+    if (top !== undefined && top <= ACTIVE_LINE_PX) {
+      current = id;
     }
-    return current;
+  }
+  return current;
 }
 function useActiveSection(sectionIds) {
-    const [activeId, setActiveId] = useState(sectionIds[0] ?? "");
-    const pinnedUntil = useRef(0);
-    const followScroll = useCallback((id) => {
-        if (Date.now() > pinnedUntil.current) {
-            setActiveId(id);
-        }
-    }, []);
-    const pinSection = useCallback((id) => {
-        pinnedUntil.current = Date.now() + SMOOTH_SCROLL_MS;
+  const $ = _c(9);
+  const [activeId, setActiveId] = useState(sectionIds[0] ?? "");
+  const pinnedUntil = useRef(0);
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = id => {
+      if (Date.now() > pinnedUntil.current) {
         setActiveId(id);
-    }, []);
-    const idsKey = sectionIds.join(" ");
-    useEffect(() => {
-        const ids = idsKey.split(" ").filter(Boolean);
-        let frame = 0;
-        const updateActiveSection = () => {
-            cancelAnimationFrame(frame);
-            frame = requestAnimationFrame(() => {
-                const lastId = ids.at(-1);
-                const current = isWindowScrolledToBottom() && lastId ? lastId : lastSectionAboveLine(ids);
-                if (current) {
-                    followScroll(current);
-                }
-            });
-        };
-        updateActiveSection();
-        window.addEventListener("scroll", updateActiveSection, { passive: true });
-        return () => {
-            cancelAnimationFrame(frame);
-            window.removeEventListener("scroll", updateActiveSection);
-        };
-    }, [idsKey, followScroll]);
-    return [activeId, pinSection];
+      }
+    };
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const followScroll = t0;
+  let t1;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = id_0 => {
+      pinnedUntil.current = Date.now() + SMOOTH_SCROLL_MS;
+      setActiveId(id_0);
+    };
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const pinSection = t1;
+  let t2;
+  if ($[2] !== sectionIds) {
+    t2 = sectionIds.join(" ");
+    $[2] = sectionIds;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  const idsKey = t2;
+  let t3;
+  let t4;
+  if ($[4] !== idsKey) {
+    t3 = () => {
+      const ids = idsKey.split(" ").filter(Boolean);
+      let frame = 0;
+      const updateActiveSection = () => {
+        cancelAnimationFrame(frame);
+        frame = requestAnimationFrame(() => {
+          const lastId = ids.at(-1);
+          const current = isWindowScrolledToBottom() && lastId ? lastId : lastSectionAboveLine(ids);
+          if (current) {
+            followScroll(current);
+          }
+        });
+      };
+      updateActiveSection();
+      window.addEventListener("scroll", updateActiveSection, {
+        passive: true
+      });
+      return () => {
+        cancelAnimationFrame(frame);
+        window.removeEventListener("scroll", updateActiveSection);
+      };
+    };
+    t4 = [idsKey, followScroll];
+    $[4] = idsKey;
+    $[5] = t3;
+    $[6] = t4;
+  } else {
+    t3 = $[5];
+    t4 = $[6];
+  }
+  useEffect(t3, t4);
+  let t5;
+  if ($[7] !== activeId) {
+    t5 = [activeId, pinSection];
+    $[7] = activeId;
+    $[8] = t5;
+  } else {
+    t5 = $[8];
+  }
+  return t5;
 }
 export { useActiveSection };

package/dist/shell/navigation/app-sidebar.js

@@ -1,12 +1,194 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { Sidebar, SidebarRail } from "../../layout/sidebar/sidebar.js";
 import { SidebarMenu, SidebarMenuButton, SidebarMenuItem } from "../../layout/sidebar/sidebar-menu.js";
-import { SidebarContent, SidebarFooter, SidebarHeader, } from "../../layout/sidebar/sidebar-sections.js";
+import { SidebarContent, SidebarFooter, SidebarHeader } from "../../layout/sidebar/sidebar-sections.js";
 import { NavGroup } from "./nav-group.js";
-function BrandLink({ brand, Link }) {
-    return (_jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { size: "lg", asChild: true, children: _jsxs(Link, { href: brand.href, children: [_jsx("span", { "data-slot": "app-brand-icon", className: "flex aspect-square size-8 shrink-0 items-center justify-center rounded-lg border border-line bg-ghost", children: brand.icon }), _jsxs("span", { className: "grid flex-1 text-left leading-tight", children: [_jsx("span", { className: "truncate text-sm font-semibold tracking-tight", children: brand.title }), brand.subtitle && (_jsx("span", { className: "truncate text-xs text-soft", children: brand.subtitle }))] })] }) }) }) }));
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function BrandLink(t0) {
+  const $ = _c(14);
+  const {
+    brand,
+    Link
+  } = t0;
+  let t1;
+  if ($[0] !== brand.icon) {
+    t1 = /*#__PURE__*/_jsx("span", {
+      "data-slot": "app-brand-icon",
+      className: "flex aspect-square size-8 shrink-0 items-center justify-center rounded-lg border border-line bg-ghost",
+      children: brand.icon
+    });
+    $[0] = brand.icon;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] !== brand.title) {
+    t2 = /*#__PURE__*/_jsx("span", {
+      className: "truncate text-sm font-semibold tracking-tight",
+      children: brand.title
+    });
+    $[2] = brand.title;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  let t3;
+  if ($[4] !== brand.subtitle) {
+    t3 = brand.subtitle && /*#__PURE__*/_jsx("span", {
+      className: "truncate text-xs text-soft",
+      children: brand.subtitle
+    });
+    $[4] = brand.subtitle;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  let t4;
+  if ($[6] !== t2 || $[7] !== t3) {
+    t4 = /*#__PURE__*/_jsxs("span", {
+      className: "grid flex-1 text-left leading-tight",
+      children: [t2, t3]
+    });
+    $[6] = t2;
+    $[7] = t3;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  let t5;
+  if ($[9] !== Link || $[10] !== brand.href || $[11] !== t1 || $[12] !== t4) {
+    t5 = /*#__PURE__*/_jsx(SidebarMenu, {
+      children: /*#__PURE__*/_jsx(SidebarMenuItem, {
+        children: /*#__PURE__*/_jsx(SidebarMenuButton, {
+          size: "lg",
+          asChild: true,
+          children: /*#__PURE__*/_jsxs(Link, {
+            href: brand.href,
+            children: [t1, t4]
+          })
+        })
+      })
+    });
+    $[9] = Link;
+    $[10] = brand.href;
+    $[11] = t1;
+    $[12] = t4;
+    $[13] = t5;
+  } else {
+    t5 = $[13];
+  }
+  return t5;
 }
-function AppSidebar({ brand, groups, bottomItems, footer, activeHref, linkComponent = "a", }) {
-    return (_jsxs(Sidebar, { collapsible: "icon", children: [_jsx(SidebarHeader, { className: "h-14 justify-center border-b border-line py-0", children: _jsx(BrandLink, { brand: brand, Link: linkComponent }) }), _jsxs(SidebarContent, { children: [groups.map((group) => (_jsx(NavGroup, { group: group, activeHref: activeHref, Link: linkComponent }, group.label))), bottomItems && bottomItems.length > 0 && (_jsx(NavGroup, { group: { label: "", items: bottomItems }, activeHref: activeHref, Link: linkComponent, className: "mt-auto" }))] }), footer && _jsx(SidebarFooter, { className: "border-t border-line", children: footer }), _jsx(SidebarRail, {})] }));
+function AppSidebar(t0) {
+  const $ = _c(24);
+  const {
+    brand,
+    groups,
+    bottomItems,
+    footer,
+    activeHref,
+    linkComponent: t1
+  } = t0;
+  const linkComponent = t1 === undefined ? "a" : t1;
+  let t2;
+  if ($[0] !== brand || $[1] !== linkComponent) {
+    t2 = /*#__PURE__*/_jsx(SidebarHeader, {
+      className: "h-14 justify-center border-b border-line py-0",
+      children: /*#__PURE__*/_jsx(BrandLink, {
+        brand: brand,
+        Link: linkComponent
+      })
+    });
+    $[0] = brand;
+    $[1] = linkComponent;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  let t3;
+  if ($[3] !== activeHref || $[4] !== groups || $[5] !== linkComponent) {
+    let t4;
+    if ($[7] !== activeHref || $[8] !== linkComponent) {
+      t4 = group => /*#__PURE__*/_jsx(NavGroup, {
+        group: group,
+        activeHref: activeHref,
+        Link: linkComponent
+      }, group.label);
+      $[7] = activeHref;
+      $[8] = linkComponent;
+      $[9] = t4;
+    } else {
+      t4 = $[9];
+    }
+    t3 = groups.map(t4);
+    $[3] = activeHref;
+    $[4] = groups;
+    $[5] = linkComponent;
+    $[6] = t3;
+  } else {
+    t3 = $[6];
+  }
+  let t4;
+  if ($[10] !== activeHref || $[11] !== bottomItems || $[12] !== linkComponent) {
+    t4 = bottomItems && bottomItems.length > 0 && /*#__PURE__*/_jsx(NavGroup, {
+      group: {
+        label: "",
+        items: bottomItems
+      },
+      activeHref: activeHref,
+      Link: linkComponent,
+      className: "mt-auto"
+    });
+    $[10] = activeHref;
+    $[11] = bottomItems;
+    $[12] = linkComponent;
+    $[13] = t4;
+  } else {
+    t4 = $[13];
+  }
+  let t5;
+  if ($[14] !== t3 || $[15] !== t4) {
+    t5 = /*#__PURE__*/_jsxs(SidebarContent, {
+      children: [t3, t4]
+    });
+    $[14] = t3;
+    $[15] = t4;
+    $[16] = t5;
+  } else {
+    t5 = $[16];
+  }
+  let t6;
+  if ($[17] !== footer) {
+    t6 = footer && /*#__PURE__*/_jsx(SidebarFooter, {
+      className: "border-t border-line",
+      children: footer
+    });
+    $[17] = footer;
+    $[18] = t6;
+  } else {
+    t6 = $[18];
+  }
+  let t7;
+  if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = /*#__PURE__*/_jsx(SidebarRail, {});
+    $[19] = t7;
+  } else {
+    t7 = $[19];
+  }
+  let t8;
+  if ($[20] !== t2 || $[21] !== t5 || $[22] !== t6) {
+    t8 = /*#__PURE__*/_jsxs(Sidebar, {
+      collapsible: "icon",
+      children: [t2, t5, t6, t7]
+    });
+    $[20] = t2;
+    $[21] = t5;
+    $[22] = t6;
+    $[23] = t8;
+  } else {
+    t8 = $[23];
+  }
+  return t8;
 }
 export { AppSidebar };

package/dist/shell/navigation/nav-group.js

@@ -1,17 +1,168 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { c as _c } from "react/compiler-runtime";
 import { SidebarMenu, SidebarMenuButton, SidebarMenuItem } from "../../layout/sidebar/sidebar-menu.js";
-import { SidebarGroup, SidebarGroupContent, SidebarGroupLabel, } from "../../layout/sidebar/sidebar-sections.js";
+import { SidebarGroup, SidebarGroupContent, SidebarGroupLabel } from "../../layout/sidebar/sidebar-sections.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 function isActiveHref(itemHref, activeHref) {
-    return activeHref === itemHref || activeHref.startsWith(`${itemHref}/`);
+  return activeHref === itemHref || activeHref.startsWith(`${itemHref}/`);
 }
-function NavItemLink({ item, Link, ...props }) {
-    const content = (_jsxs(_Fragment, { children: [_jsx(item.icon, {}), _jsx("span", { children: item.title })] }));
-    if (item.external) {
-        return (_jsx("a", { ...props, href: item.href, target: "_blank", rel: "noreferrer", children: content }));
+function NavItemLink(t0) {
+  const $ = _c(20);
+  let Link;
+  let item;
+  let props;
+  if ($[0] !== t0) {
+    ({
+      item,
+      Link,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = Link;
+    $[2] = item;
+    $[3] = props;
+  } else {
+    Link = $[1];
+    item = $[2];
+    props = $[3];
+  }
+  let t1;
+  if ($[4] !== item.icon) {
+    t1 = /*#__PURE__*/_jsx(item.icon, {});
+    $[4] = item.icon;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  let t2;
+  if ($[6] !== item.title) {
+    t2 = /*#__PURE__*/_jsx("span", {
+      children: item.title
+    });
+    $[6] = item.title;
+    $[7] = t2;
+  } else {
+    t2 = $[7];
+  }
+  let t3;
+  if ($[8] !== t1 || $[9] !== t2) {
+    t3 = /*#__PURE__*/_jsxs(_Fragment, {
+      children: [t1, t2]
+    });
+    $[8] = t1;
+    $[9] = t2;
+    $[10] = t3;
+  } else {
+    t3 = $[10];
+  }
+  const content = t3;
+  if (item.external) {
+    let t4;
+    if ($[11] !== content || $[12] !== item.href || $[13] !== props) {
+      t4 = /*#__PURE__*/_jsx("a", {
+        ...props,
+        href: item.href,
+        target: "_blank",
+        rel: "noreferrer",
+        children: content
+      });
+      $[11] = content;
+      $[12] = item.href;
+      $[13] = props;
+      $[14] = t4;
+    } else {
+      t4 = $[14];
     }
-    return (_jsx(Link, { ...props, href: item.href, children: content }));
+    return t4;
+  }
+  let t4;
+  if ($[15] !== Link || $[16] !== content || $[17] !== item.href || $[18] !== props) {
+    t4 = /*#__PURE__*/_jsx(Link, {
+      ...props,
+      href: item.href,
+      children: content
+    });
+    $[15] = Link;
+    $[16] = content;
+    $[17] = item.href;
+    $[18] = props;
+    $[19] = t4;
+  } else {
+    t4 = $[19];
+  }
+  return t4;
 }
-function NavGroup({ group, activeHref, Link, className }) {
-    return (_jsxs(SidebarGroup, { className: className, children: [group.label && _jsx(SidebarGroupLabel, { children: group.label }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: group.items.map((item) => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, isActive: isActiveHref(item.href, activeHref), tooltip: item.title, children: _jsx(NavItemLink, { item: item, Link: Link }) }) }, item.href))) }) })] }));
+function NavGroup(t0) {
+  const $ = _c(15);
+  const {
+    group,
+    activeHref,
+    Link,
+    className
+  } = t0;
+  let t1;
+  if ($[0] !== group.label) {
+    t1 = group.label && /*#__PURE__*/_jsx(SidebarGroupLabel, {
+      children: group.label
+    });
+    $[0] = group.label;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  let t2;
+  if ($[2] !== Link || $[3] !== activeHref || $[4] !== group.items) {
+    let t3;
+    if ($[6] !== Link || $[7] !== activeHref) {
+      t3 = item => /*#__PURE__*/_jsx(SidebarMenuItem, {
+        children: /*#__PURE__*/_jsx(SidebarMenuButton, {
+          asChild: true,
+          isActive: isActiveHref(item.href, activeHref),
+          tooltip: item.title,
+          children: /*#__PURE__*/_jsx(NavItemLink, {
+            item: item,
+            Link: Link
+          })
+        })
+      }, item.href);
+      $[6] = Link;
+      $[7] = activeHref;
+      $[8] = t3;
+    } else {
+      t3 = $[8];
+    }
+    t2 = group.items.map(t3);
+    $[2] = Link;
+    $[3] = activeHref;
+    $[4] = group.items;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[9] !== t2) {
+    t3 = /*#__PURE__*/_jsx(SidebarGroupContent, {
+      children: /*#__PURE__*/_jsx(SidebarMenu, {
+        children: t2
+      })
+    });
+    $[9] = t2;
+    $[10] = t3;
+  } else {
+    t3 = $[10];
+  }
+  let t4;
+  if ($[11] !== className || $[12] !== t1 || $[13] !== t3) {
+    t4 = /*#__PURE__*/_jsxs(SidebarGroup, {
+      className: className,
+      children: [t1, t3]
+    });
+    $[11] = className;
+    $[12] = t1;
+    $[13] = t3;
+    $[14] = t4;
+  } else {
+    t4 = $[14];
+  }
+  return t4;
 }
 export { isActiveHref, NavGroup };

package/dist/shell/theme-toggle.js

@@ -1,9 +1,56 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { MoonIcon, SunIcon } from "lucide-react";
+
+import { c as _c } from "react/compiler-runtime";
+import { Moon as MoonIcon, Sun as SunIcon } from "@carbon/icons-react";
 import { Button } from "../action/button.js";
-function ThemeToggle({ theme, onThemeChange }) {
-    const nextTheme = theme === "dark" ? "light" : "dark";
-    return (_jsxs(Button, { variant: "ghost", size: "icon-sm", "aria-label": `Switch to ${nextTheme} theme`, onClick: () => onThemeChange(nextTheme), children: [_jsx(SunIcon, { className: "scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" }), _jsx(MoonIcon, { className: "absolute scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" })] }));
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function ThemeToggle(t0) {
+  const $ = _c(8);
+  const {
+    theme,
+    onThemeChange
+  } = t0;
+  const nextTheme = theme === "dark" ? "light" : "dark";
+  const t1 = `Switch to ${nextTheme} theme`;
+  let t2;
+  if ($[0] !== nextTheme || $[1] !== onThemeChange) {
+    t2 = () => onThemeChange(nextTheme);
+    $[0] = nextTheme;
+    $[1] = onThemeChange;
+    $[2] = t2;
+  } else {
+    t2 = $[2];
+  }
+  let t3;
+  let t4;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /*#__PURE__*/_jsx(SunIcon, {
+      className: "scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90"
+    });
+    t4 = /*#__PURE__*/_jsx(MoonIcon, {
+      className: "absolute scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0"
+    });
+    $[3] = t3;
+    $[4] = t4;
+  } else {
+    t3 = $[3];
+    t4 = $[4];
+  }
+  let t5;
+  if ($[5] !== t1 || $[6] !== t2) {
+    t5 = /*#__PURE__*/_jsxs(Button, {
+      variant: "ghost",
+      size: "icon-sm",
+      "aria-label": t1,
+      onClick: t2,
+      children: [t3, t4]
+    });
+    $[5] = t1;
+    $[6] = t2;
+    $[7] = t5;
+  } else {
+    t5 = $[7];
+  }
+  return t5;
 }
 export { ThemeToggle };