@theguild/components
Version:
2,973 lines (2,922 loc) • 141 kB
JavaScript
import {
DiscordIcon,
FOUR_MAIN_PRODUCTS,
GitHubIcon,
InformationCircleIcon,
PRODUCTS,
SIX_HIGHLIGHTED_PRODUCTS,
SvgAccountBox,
SvgApps,
SvgArrowIcon,
SvgBard,
SvgCaretSlim,
SvgCheck,
SvgClose,
SvgCodegen,
SvgCsaStarLevelOne,
SvgGroup,
SvgHive,
SvgHiveGateway,
SvgHonour,
SvgLinkedin,
SvgList,
SvgMesh as SvgMesh2,
SvgMoon,
SvgMore,
SvgPaper,
SvgPencil,
SvgRightCorner,
SvgSearch,
SvgShare,
SvgShieldFlash,
SvgStellate,
SvgTarget,
SvgTwitter,
SvgYoga as SvgYoga2,
SvgYoutube
} from "./chunk-EVX72CXY.js";
import {
EnvelopLettermark,
GraphQLESlintLettermark,
InspectorLettermark,
ScalarsLettermark,
SofaLettermark,
SvgAngular,
SvgCodeGenerator,
SvgConductor,
SvgConfig,
SvgFets,
SvgGraphqlFoundation,
SvgGuild,
SvgHeltin,
SvgHiveCombinationMark,
SvgKitql,
SvgMesh,
SvgModules,
SvgNextra,
SvgSse,
SvgStitching,
SvgTheGuild,
SvgTools,
SvgWhatsapp,
SvgWs,
SvgYoga,
cn
} from "./chunk-X3SBJHCD.js";
// src/index.ts
import { default as default2 } from "@giscus/react";
import {
Bleed,
Collapse,
Navbar as Navbar2,
NotFoundPage,
useConfig as useConfig2,
useTheme as useTheme2,
useThemeConfig as useThemeConfig2
} from "nextra-theme-docs";
import { createCatchAllMeta } from "nextra/catch-all";
import {
Callout,
Cards,
Code,
FileTree,
Mermaid,
RemoteContent,
Steps,
Tabs as Tabs3,
Table,
Td,
Th,
Tr
} from "nextra/components";
import { useData, useMounted as useMounted3 } from "nextra/hooks";
import { useMDXComponents } from "nextra/mdx";
// src/components/anchor.tsx
import { forwardRef } from "react";
import NextLink from "next/link";
import clsx from "clsx";
import { Fragment, jsx } from "react/jsx-runtime";
var Anchor = forwardRef(function Anchor2({ href = "", children, newWindow, sameSite, className, ...props }, forwardedRef) {
const classes2 = clsx(className, "outline-none transition focus-visible:ring");
if (typeof href === "string") {
if (sameSite) {
const url = new URL(href);
href = url.pathname + url.search + url.hash;
}
if (href.startsWith("#")) {
return /* @__PURE__ */ jsx("a", { ref: forwardedRef, href, className: classes2, ...props, children });
}
if (newWindow && /^https?:\/\//.test(href)) {
return /* @__PURE__ */ jsx(
"a",
{
ref: forwardedRef,
href,
target: "_blank",
rel: "noreferrer",
className: classes2,
...props,
children
}
);
}
}
return /* @__PURE__ */ jsx(NextLink, { ref: forwardedRef, href, ...props, className: classes2, legacyBehavior: false, children: /* @__PURE__ */ jsx(Fragment, { children }) });
});
// src/components/button.tsx
import clsx2 from "clsx";
import { jsx as jsx2 } from "react/jsx-runtime";
var Button = ({
children,
className,
variant = "primary",
...props
}) => {
return /* @__PURE__ */ jsx2(
Anchor,
{
className: clsx2(
"flex-none rounded-md p-3 text-center text-xs font-medium hover:shadow-lg md:px-5",
variant === "primary" ? "bg-cyan-400 text-white hover:shadow-cyan-400/40" : "bg-white text-black hover:shadow-white/40",
className
),
...props,
children
}
);
};
// src/components/cards-colorful.tsx
import clsx3 from "clsx";
import { jsx as jsx3, jsxs } from "react/jsx-runtime";
var CardsColorful = ({ cards, className }) => /* @__PURE__ */ jsx3("section", { className: clsx3("bg-white py-8 dark:bg-dark", className), children: /* @__PURE__ */ jsx3("div", { className: "container flex flex-wrap space-y-6 md:flex-nowrap md:space-x-8 md:space-y-0", children: cards.map((card) => /* @__PURE__ */ jsx3(
Anchor,
{
className: "relative min-h-[200px] w-full rounded-3xl p-8 text-white [background:var(--color)] after:absolute after:right-0 after:top-0 after:h-full after:w-[calc(30%-1rem)] after:rounded-3xl after:bg-white/10 after:content-[''] md:h-72 md:w-1/2 md:hover:scale-105 md:hover:shadow-xl lg:after:w-[calc(50%-1rem)]",
style: { "--color": card.color },
...card.link,
children: /* @__PURE__ */ jsxs("div", { className: "w-3/4 lg:w-1/2", children: [
/* @__PURE__ */ jsx3("h2", { className: "pb-1.5 text-xs font-semibold uppercase opacity-60", children: card.category }),
/* @__PURE__ */ jsx3("h3", { className: "pb-2.5 text-2xl font-bold md:text-3xl", children: card.title }),
/* @__PURE__ */ jsx3("p", { className: "text-xs font-medium opacity-60", children: card.description })
] })
},
card.title
)) }) });
// src/components/feature-list.tsx
import clsx4 from "clsx";
// src/components/image.tsx
import NextImage from "next/image";
import { jsx as jsx4 } from "react/jsx-runtime";
function Image(props) {
return /* @__PURE__ */ jsx4(NextImage, { placeholder: "blur", ...props });
}
// src/components/feature-list.tsx
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
var FeatureList = ({
title,
description,
items,
link,
className
}) => /* @__PURE__ */ jsx5("section", { className: clsx4("bg-white dark:bg-dark", className), children: /* @__PURE__ */ jsxs2("div", { className: "container py-14", children: [
title && /* @__PURE__ */ jsxs2("div", { className: "mb-6 flex flex-col items-center", children: [
/* @__PURE__ */ jsx5("h2", { className: "mb-1.5 mt-0 text-center text-2xl font-bold text-black md:text-3xl dark:text-gray-50", children: title }),
description && /* @__PURE__ */ jsx5("div", { className: "mb-1.5 mt-1 text-center text-base text-gray-500 dark:text-gray-400", children: description }),
link && /* @__PURE__ */ jsx5(
Anchor,
{
...link,
className: clsx4("w-max text-sm text-cyan-400 hover:text-cyan-300", link.className)
}
)
] }),
/* @__PURE__ */ jsx5("div", { className: "flex flex-wrap justify-center gap-12", children: items.map((item) => /* @__PURE__ */ jsxs2("div", { className: "flex w-56 flex-col items-center", children: [
/* @__PURE__ */ jsx5(Image, { ...item.image, className: clsx4("w-28", item.image.className) }),
/* @__PURE__ */ jsx5("h3", { className: "m-0 text-lg font-bold text-black dark:text-gray-50", children: item.title }),
/* @__PURE__ */ jsx5("div", { className: "text-center text-sm text-gray-500 dark:text-gray-400", children: item.description }),
item.link && /* @__PURE__ */ jsx5(
Anchor,
{
...item.link,
className: clsx4(
"mt-2 w-max text-sm text-cyan-400 hover:text-cyan-300",
item.link.className
)
}
)
] }, item.title)) })
] }) });
// src/components/footer.tsx
import { clsx as clsx5 } from "clsx";
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
var COMPANY = [
{
children: "About",
title: "Learn more about us",
href: "https://the-guild.dev/about-us"
},
{
children: "Blog",
title: "Read our blog",
href: "https://the-guild.dev/blog"
},
{
children: "Newsletter",
title: "Newsletter",
href: "https://the-guild.dev/newsletter"
}
];
var COMMUNITY = [
{
icon: SvgTwitter,
title: "Visit our Twitter",
href: "https://twitter.com/TheGuildDev"
},
{
icon: SvgLinkedin,
title: "Visit our LinkedIn",
href: "https://linkedin.com/company/the-guild-software"
},
{
icon: DiscordIcon,
title: "Reach us on Discord",
href: "https://discord.com/invite/xud7bH9"
},
{
icon: GitHubIcon,
title: "Check our GitHub account",
href: "https://github.com/the-guild-org"
},
{
icon: SvgYoutube,
title: "Watch Our Videos",
href: "https://youtube.com/watch?v=d_GBgH-L5c4&list=PLhCf3AUOg4PgQoY_A6xWDQ70yaNtPYtZd"
}
];
var products = [
PRODUCTS.HIVE,
PRODUCTS.MESH,
PRODUCTS.YOGA,
PRODUCTS.CODEGEN,
PRODUCTS.NEXTRA,
{ ...PRODUCTS.SOFA, name: "GraphQL to REST" }
].map(({ name, href, title }) => ({
children: name,
href,
title
}));
var classes = {
title: clsx5("mb-2.5 text-lg font-medium text-gray-900 dark:text-gray-100"),
anchor: clsx5("text-gray-500 hover:text-black dark:text-[#b4b5be] hover:dark:text-gray-100")
};
var renderLinks = (list) => /* @__PURE__ */ jsx6("ul", { className: "m-0 mb-8 list-none p-0 last:mb-0", children: list.map((link, i) => /* @__PURE__ */ jsx6("li", { className: "mb-3 last:mb-0", children: /* @__PURE__ */ jsx6(Anchor, { className: clsx5(classes.anchor, "inline-block text-sm"), ...link }) }, i)) });
function Footer({
className,
sameSite,
resources = [],
logo
}) {
return /* @__PURE__ */ jsx6(
"footer",
{
className: clsx5(
"bg-[#fafafa] py-[60px] text-base md:py-[140px] dark:bg-[#0f1114]",
className
),
children: /* @__PURE__ */ jsx6("div", { className: "container max-w-[90rem]", children: /* @__PURE__ */ jsxs3("div", { className: "relative flex justify-between gap-10 max-md:flex-col", children: [
/* @__PURE__ */ jsxs3(
Anchor,
{
className: "flex items-center gap-2 self-start",
href: "https://the-guild.dev",
sameSite,
...logo,
children: [
/* @__PURE__ */ jsx6(SvgGuild, { className: "h-9 w-auto" }),
/* @__PURE__ */ jsx6(SvgTheGuild, { className: "h-7 w-auto" })
]
}
),
/* @__PURE__ */ jsxs3("div", { children: [
/* @__PURE__ */ jsx6("h3", { className: classes.title, children: "Products" }),
/* @__PURE__ */ jsx6("div", { className: "flex gap-6", children: renderLinks(products) })
] }),
/* @__PURE__ */ jsxs3("div", { children: [
/* @__PURE__ */ jsx6("h3", { className: classes.title, children: "Resources" }),
renderLinks([
{
children: "Press Kit",
title: "Press Kit",
href: "https://the-guild.dev/logos"
},
...resources
])
] }),
/* @__PURE__ */ jsxs3("div", { children: [
/* @__PURE__ */ jsx6("h3", { className: classes.title, children: "Company" }),
renderLinks(COMPANY)
] }),
/* @__PURE__ */ jsx6("div", { className: "flex gap-5 text-[#b4b5be]", children: COMMUNITY.map(({ icon: Icon, ...iconProps }) => /* @__PURE__ */ jsx6(Anchor, { className: classes.anchor, ...iconProps, children: /* @__PURE__ */ jsx6(Icon, { className: "h-5 w-auto" }) }, iconProps.title)) }),
/* @__PURE__ */ jsx6(SvgCsaStarLevelOne, { className: "absolute right-0 ml-auto h-[4.5rem] w-auto md:bottom-0" })
] }) })
}
);
}
// src/components/hero-gradient.tsx
import { isValidElement } from "react";
import clsx6 from "clsx";
import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
var Shadow = ({ className }) => {
return /* @__PURE__ */ jsx7(
"span",
{
className: clsx6(
"absolute size-[500px] -translate-x-1/2 -translate-y-1/2 rounded-full blur-3xl",
className
)
}
);
};
var HeroGradient = ({
title,
description,
link,
version,
colors = [],
image,
className
}) => {
return /* @__PURE__ */ jsx7("section", { className: clsx6("bg-white md:py-14 dark:bg-dark", className), children: /* @__PURE__ */ jsxs4(
"div",
{
className: clsx6(
"container relative z-0 flex max-w-[90rem] items-center gap-6 px-6 md:px-14",
image ? "py-6" : "py-14"
),
children: [
/* @__PURE__ */ jsxs4(
"div",
{
className: "absolute inset-0 z-[-1] overflow-hidden bg-black md:mx-6 md:rounded-3xl dark:bg-dark",
style: { "--colorA": colors[0], "--colorB": colors[1] },
children: [
/* @__PURE__ */ jsx7(Shadow, { className: "-left-10 -top-24 [background:var(--colorA)]" }),
/* @__PURE__ */ jsx7(Shadow, { className: "-top-5 hidden [background:var(--colorA)] md:right-[-28rem] md:block" }),
/* @__PURE__ */ jsx7(Shadow, { className: "bottom-[-31rem] right-[-22rem] [background:var(--colorB)]" }),
/* @__PURE__ */ jsx7(Shadow, { className: "-left-12 bottom-[-37rem] hidden [background:var(--colorB)] md:block" })
]
}
),
/* @__PURE__ */ jsxs4("div", { className: clsx6("grow md:pl-6"), children: [
/* @__PURE__ */ jsx7("h1", { className: "max-w-lg text-2xl font-bold text-white md:text-3xl", children: title }),
/* @__PURE__ */ jsx7("p", { className: "mb-4 mt-2.5 max-w-md text-base text-white opacity-70 md:text-lg", children: description }),
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-x-3 text-xs md:mt-9", children: [
link && toArray(link).map((link2, i) => /* @__PURE__ */ jsx7(
Button,
{
variant: "secondary",
...link2,
className: clsx6("!px-8", link2.className)
},
i
)),
version && isValidElement(version) ? version : /* @__PURE__ */ jsx7("span", { className: "text-gray-50 opacity-60", children: version })
] })
] }),
image && /* @__PURE__ */ jsx7(
Image,
{
...image,
className: clsx6(
"hidden w-full max-w-sm select-none sm:max-w-md md:block",
image.className
)
}
)
]
}
) });
};
function toArray(input) {
return Array.isArray(input) ? input : [input];
}
// src/components/hero-illustration.tsx
import clsx7 from "clsx";
import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
var HeroIllustration = ({
title,
description,
link,
image,
flipped,
className
}) => /* @__PURE__ */ jsx8("section", { className: clsx7("bg-white dark:bg-dark", className), children: /* @__PURE__ */ jsxs5(
"div",
{
className: clsx7(
"container flex flex-wrap items-center gap-8 py-8 md:flex-nowrap md:justify-around",
flipped && "md:flex-row-reverse"
),
children: [
/* @__PURE__ */ jsx8(Image, { ...image, className: clsx7("w-full max-w-md md:w-2/5", image.className) }),
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col items-start gap-3", children: [
/* @__PURE__ */ jsx8("h2", { className: "max-w-sm text-2xl font-bold text-black md:text-3xl dark:text-gray-50", children: title }),
/* @__PURE__ */ jsx8("p", { className: "max-w-md text-base text-gray-500 dark:text-gray-400", children: description }),
link && /* @__PURE__ */ jsx8(Button, { ...link })
] })
]
}
) });
// src/components/hero-marketplace.tsx
import clsx8 from "clsx";
import CubeBL from "./marketplace-cube-bl-42X7Y3KO.png";
import CubeBR from "./marketplace-cube-br-Y5MZRDIL.png";
import CubeTL from "./marketplace-cube-tl-PEJKW6RX.png";
import CubeTR from "./marketplace-cube-tr-O5XQ6Q4N.png";
import IllustrationDesktop from "./marketplace-desktop-7XUR54PR.png";
import IllustrationMobile from "./marketplace-mobile-DI462WKF.png";
import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
var Shadow2 = ({ className }) => {
return /* @__PURE__ */ jsx9(
"span",
{
className: clsx8(
"absolute size-[750px] -translate-x-1/2 -translate-y-1/2 rounded-full opacity-40 blur-3xl",
className
)
}
);
};
var Cube = ({ className, src }) => {
return /* @__PURE__ */ jsx9(
Image,
{
className: clsx8("absolute -translate-x-1/2 -translate-y-1/2", className),
src,
alt: "Cube"
}
);
};
var HeroMarketplace = ({
title,
description,
link,
className,
image
}) => /* @__PURE__ */ jsx9("section", { className: clsx8("overflow-hidden bg-white dark:bg-dark", className), children: /* @__PURE__ */ jsxs6("div", { className: "relative", children: [
/* @__PURE__ */ jsxs6(
"div",
{
className: "absolute inset-0 overflow-hidden bg-black dark:bg-dark",
style: { "--colorA": "#ff34ae", "--colorB": "#1cc8ee" },
children: [
/* @__PURE__ */ jsx9(Shadow2, { className: "left-[-30px] top-[-175px] [background:var(--colorA)] md:left-[-60px] md:top-[-150px]" }),
/* @__PURE__ */ jsx9(Shadow2, { className: "bottom-[-800px] right-[-700px] hidden [background:var(--colorA)] md:block" }),
/* @__PURE__ */ jsx9(Shadow2, { className: "bottom-[-600px] left-[-30px] [background:var(--colorB)] md:bottom-[-700px] md:left-5" })
]
}
),
/* @__PURE__ */ jsxs6("div", { children: [
/* @__PURE__ */ jsx9(Cube, { src: CubeTL, className: "-top-2.5 left-6 md:left-10 md:top-6" }),
/* @__PURE__ */ jsx9(Cube, { src: CubeTR, className: "-bottom-60 -right-52 top-auto md:bottom-auto md:top-20" }),
/* @__PURE__ */ jsx9(Cube, { src: CubeBR, className: "-bottom-32 -right-20 hidden md:block" }),
/* @__PURE__ */ jsx9(Cube, { src: CubeBL, className: "-bottom-40 left-10 hidden md:block" })
] }),
/* @__PURE__ */ jsxs6("div", { className: "container mb-28 mt-16 flex max-w-[90rem] flex-wrap items-center pb-1 pt-20 md:mb-20 md:mt-7 md:flex-nowrap md:pt-0", children: [
/* @__PURE__ */ jsxs6(
"picture",
{
className: "z-[1] order-last -mb-20 -ml-8 mt-5 w-full max-w-md md:order-first md:-mb-24 md:-ml-12 md:mt-0 md:w-auto md:max-w-none lg:-ml-14 lg:w-2/3",
...image,
children: [
/* @__PURE__ */ jsx9("source", { media: "(min-width:768px)", srcSet: IllustrationDesktop }),
/* @__PURE__ */ jsx9(Image, { className: "mx-auto w-auto", src: IllustrationMobile, alt: "Products List" })
]
}
),
/* @__PURE__ */ jsxs6("div", { className: "relative z-[1]", children: [
/* @__PURE__ */ jsx9("h2", { className: "mb-2.5 max-w-lg text-2xl font-bold text-white md:text-3xl dark:text-gray-50", children: title }),
/* @__PURE__ */ jsx9("p", { className: "max-w-lg text-base text-gray-300 opacity-70", children: description }),
link && /* @__PURE__ */ jsx9("div", { className: "relative z-[1] mt-4 hidden items-center text-xs md:mt-9 md:flex", children: /* @__PURE__ */ jsx9(Button, { ...link }) })
] })
] })
] }) });
// src/components/hero-video.tsx
import { useRouter } from "next/router";
import clsx9 from "clsx";
import { useMounted } from "nextra/hooks";
import ReactPlayer from "react-player/lazy";
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
var HeroVideo = ({
title,
description,
link,
video,
flipped,
className,
videoProps
}) => {
const { basePath } = useRouter();
const mounted = useMounted();
return /* @__PURE__ */ jsx10("section", { className: clsx9("bg-gray-100 dark:bg-neutral-800", className), children: /* @__PURE__ */ jsxs7(
"div",
{
className: clsx9(
"container flex flex-wrap py-8 md:flex-nowrap md:items-center md:justify-center",
flipped && "md:flex-row-reverse"
),
children: [
/* @__PURE__ */ jsxs7("div", { className: "mb-16 mt-8 md:my-0", children: [
/* @__PURE__ */ jsx10("h2", { className: "m-0 max-w-sm text-2xl font-bold text-black md:text-3xl dark:text-gray-50", children: title }),
/* @__PURE__ */ jsx10("p", { className: "mb-3 mt-1 max-w-md text-base text-gray-500 dark:text-gray-400", children: description }),
link && /* @__PURE__ */ jsx10(
Anchor,
{
...link,
className: clsx9(
"mt-auto w-max text-sm text-cyan-400 hover:text-cyan-300",
link.className
)
}
)
] }),
/* @__PURE__ */ jsx10(
"div",
{
className: clsx9(
"h-72 w-full overflow-hidden rounded-xl bg-white shadow-xl sm:h-96 md:h-72 md:w-3/5 lg:h-96",
flipped ? "md:mr-8" : "md:ml-8"
),
children: mounted && /* @__PURE__ */ jsx10(
ReactPlayer,
{
url: video.src,
light: video.placeholder.startsWith("/") ? basePath + video.placeholder : video.placeholder,
controls: true,
height: "100%",
width: "100%",
config: {
youtube: {
playerVars: {
autoplay: 1
}
}
},
...videoProps
}
)
}
)
]
}
) });
};
// src/components/info-list.tsx
import clsx10 from "clsx";
import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
var InfoList = ({ title, items, className }) => /* @__PURE__ */ jsx11("section", { className: clsx10("bg-white dark:bg-dark", className), children: /* @__PURE__ */ jsxs8("div", { className: "container max-w-[90rem] py-12", children: [
title && /* @__PURE__ */ jsx11("h2", { className: "mb-4 mt-0 text-2xl font-bold text-black md:text-3xl dark:text-gray-50", children: title }),
/* @__PURE__ */ jsx11("div", { className: "flex flex-wrap", children: items.map((item, index) => /* @__PURE__ */ jsxs8(
"section",
{
className: "mb-9 box-border flex w-full max-w-lg flex-col pr-10 last:mb-0 md:w-1/2 lg:mb-0 lg:w-1/3",
children: [
/* @__PURE__ */ jsx11("h3", { className: "m-0 text-base font-semibold text-black dark:text-gray-50", children: item.title }),
/* @__PURE__ */ jsx11("p", { className: "mb-4 mt-2 grow text-sm text-gray-500 dark:text-gray-400", children: item.description }),
item.link && /* @__PURE__ */ jsx11(
Anchor,
{
className: "mt-auto w-max text-sm text-cyan-400 hover:text-cyan-300",
...item.link
}
)
]
},
`info-${index}`
)) })
] }) });
// src/components/legacy-package-cmd.tsx
import { useMemo } from "react";
import { Pre, Tabs } from "nextra/components";
import { jsx as jsx12 } from "react/jsx-runtime";
var PACKAGE_MANAGERS = ["yarn", "npm", "pnpm"];
var Add = {
yarn: "yarn add",
npm: "npm install",
pnpm: "pnpm add"
};
var Run = {
yarn: "yarn",
npm: "npm run",
pnpm: "pnpm"
};
var Install = {
yarn: "yarn",
npm: "npm install",
pnpm: "pnpm install"
};
var Init = {
yarn: "yarn init --yes",
npm: "npm init --yes",
pnpm: "pnpm init"
};
var Global = {
yarn: "yarn global add",
npm: "npm install --global",
pnpm: "pnpm add --global"
};
var LegacyPackageCmd = ({
packages
}) => {
const commands = useMemo(
() => PACKAGE_MANAGERS.map(
(pkgManager) => packages.map((pkg) => typeof pkg === "string" ? { name: pkg, cmd: "add" } : pkg).map((pkg) => {
switch (pkg.cmd) {
case "run":
return `${pkgManager === "npm" && pkg.isNpx ? "npx" : Run[pkgManager]} ${pkg.name}`;
case "install":
return `${Install[pkgManager]}${pkg.name ? ` ${pkg.name}` : ""}`;
case "init":
return Init[pkgManager];
default:
return `${pkg.isGlobal ? Global[pkgManager] : Add[pkgManager]} ${pkg.name}`;
}
}).join("\n")
),
[packages]
);
return /* @__PURE__ */ jsx12(Tabs, { items: PACKAGE_MANAGERS, children: PACKAGE_MANAGERS.map((pkgManager, index) => /* @__PURE__ */ jsx12(Tabs.Tab, { children: /* @__PURE__ */ jsx12(Pre, { "data-filename": "Terminal", "data-copy": "", "data-language": "sh", "data-theme": "default", children: /* @__PURE__ */ jsx12("code", { children: /* @__PURE__ */ jsx12("span", { className: "line", children: commands[index] }) }) }) }, pkgManager)) });
};
// src/components/marketplace-list.tsx
import { useEffect, useMemo as useMemo2, useState } from "react";
import ReactPaginate from "react-paginate";
// src/components/heading.tsx
import { jsx as jsx13 } from "react/jsx-runtime";
function Heading({ as: _as, size, className, children, ...rest }) {
const Level = _as || "h2";
let sizeStyle = "";
switch (size) {
// TODO: This should probably be a class, not a component, because the design expects
// an equivalent of `heading-sm lg:heading-xl.`
case "xl":
sizeStyle = "text-4xl leading-[1.2] md:text-6xl md:leading-[1.1875] tracking-[-0.64px]";
break;
case "lg":
sizeStyle = "text-4xl leading-[1.2] md:text-[56px] md:leading-[1.14286] tracking-[-0.56px]";
break;
case "md":
sizeStyle = "text-4xl leading-[1.2] md:text-5xl md:leading-[1.16667] tracking-[-0.48px]";
break;
case "sm":
sizeStyle = "text-[40px] leading-[1.2] tracking-[-0.2px]";
break;
case "xs":
sizeStyle = "text-[32px]/[1.25] tracking-[-0.16px]";
break;
}
const id = typeof children === "string" ? children.replace(/[\s.,]+/g, "-").toLowerCase() : void 0;
return /* @__PURE__ */ jsx13(Level, { className: cn(sizeStyle, className), id, ...rest, children: id ? /* @__PURE__ */ jsx13("a", { href: `#${id}`, className: "cursor-text", tabIndex: -1, onClick: preventScroll, children }) : children });
}
function preventScroll(event) {
if (event.currentTarget.tagName !== "A") return;
const href = event.currentTarget.getAttribute("href");
if (href?.[0] !== "#") return;
event.preventDefault();
const url = new URL(window.location.href);
url.hash = href.slice(1);
window.history.replaceState({}, "", url.toString());
}
// src/components/tag.tsx
import { jsx as jsx14 } from "react/jsx-runtime";
var Tag = ({ children, selected, onClick, ...rest }) => {
return /* @__PURE__ */ jsx14(
"button",
{
tabIndex: onClick ? 0 : -1,
className: cn(
"hive-focus inline cursor-pointer rounded-full border-0 px-3 py-1 text-xs font-medium outline-none",
selected ? "bg-neutral-700 text-white [.green_&]:bg-green-600" : "bg-neutral-900/5 text-neutral-800 dark:bg-neutral-200/10 dark:text-neutral-200 [.green_&]:bg-green-700 [.green_&]:text-green-200"
),
onClick,
...rest,
children
}
);
};
var TagsContainer = ({
children,
className,
focusgroup
}) => {
return (
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
/* @__PURE__ */ jsx14(
"div",
{
className: cn("flex flex-wrap gap-2 py-2", className),
onKeyDown: focusgroup ? moveFocusWithLeftAndRight : void 0,
children
}
)
);
};
var moveFocusWithLeftAndRight = (event) => {
if (event.target instanceof HTMLElement && event.target.tagName === "BUTTON") {
let next;
switch (event.key) {
case "ArrowRight":
next = event.target.nextElementSibling;
break;
case "ArrowLeft":
next = event.target.previousElementSibling;
break;
}
if (next && next instanceof HTMLElement && next.tagName === "BUTTON") {
event.preventDefault();
next.focus();
}
}
};
// src/components/marketplace-list.tsx
import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
var formatDate = (value) => {
const months = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec"
];
const date = new Date(value);
return `${months[date.getMonth()]} ${date.getDate()}, ${date.getFullYear()}`;
};
var numberFormat = Intl.NumberFormat("en-US", {
notation: "compact"
});
var MarketplaceList = ({
title,
placeholder,
items,
pagination,
className,
colorScheme = "neutral"
}) => {
const [currentPage, setCurrentPage] = useState(0);
const pageSize = pagination || 5;
const pageCount = items ? Math.ceil(items.length / pageSize) : 1;
useEffect(() => {
setCurrentPage(0);
}, [items]);
const pages = useMemo2(() => {
const itemsCopy = [...items];
const pagesData = [];
while (itemsCopy.length > 0) {
pagesData.push(itemsCopy.splice(0, pageSize));
}
return pagesData;
}, [items, pageSize]);
return /* @__PURE__ */ jsxs9(
"section",
{
className: cn(
// --bg and --fg are defined in style.css under .MarketplaceSearch
"MarketplaceSearch",
colorScheme,
"w-full dark:bg-neutral-900 [&.green]:bg-green-1000",
className
),
children: [
title && /* @__PURE__ */ jsx15(
Heading,
{
as: "h2",
size: "sm",
className: "mb-6 mt-4 text-2xl/8 font-medium text-[--fg,theme(colors.neutral.900)] dark:text-white",
children: title
}
),
pages[currentPage]?.length ? /* @__PURE__ */ jsxs9(Fragment2, { children: [
/* @__PURE__ */ jsx15("ul", { className: "grid gap-4 lg:grid-cols-2 lg:gap-6", children: pages[currentPage].map((item, i) => {
return /* @__PURE__ */ jsx15("li", { className: "*:h-full", children: /* @__PURE__ */ jsx15(
MarketplaceListItem,
{
item,
tabIndex: i === 0 ? 0 : -1,
onKeyDown: (event) => {
const ul = event.currentTarget.parentElement.parentElement;
const gridTemplateColumns = ul.computedStyleMap().get("grid-template-columns")?.toString();
const columns = parseInt(gridTemplateColumns?.match(/repeat\((\d)/)?.[1]) || 1;
moveFocusOnArrowKeys(event, columns);
}
}
) }, item.title);
}) }),
pageCount > 1 && /* @__PURE__ */ jsx15(
ReactPaginate,
{
pageCount,
forcePage: currentPage,
pageRangeDisplayed: 3,
marginPagesDisplayed: 1,
onPageChange: (page) => setCurrentPage(page.selected),
containerClassName: "flex justify-center gap-2 mt-6",
previousClassName: "hidden",
nextClassName: "hidden",
breakLinkClassName: "hive-focus rounded text-[--fg-80] [.green_&]:text-green-200",
pageLinkClassName: "hive-focus text-sm font-medium rounded-lg [.green_&]:text-green-200 [.green_&]:border-green-700 border border-neutral-600 dark:text-neutral-200 size-7 flex justify-center items-center select-none",
activeLinkClassName: "text-[--bg] dark:!text-[--bg] bg-[--fg] [.green_&]:bg-green-300 [.green_&]:text-green-800"
}
)
] }) : /* @__PURE__ */ jsx15("div", { className: "flex h-24 w-full items-center justify-center", children: placeholder })
]
}
);
};
function MarketplaceListItem({ item, ...rest }) {
return /* @__PURE__ */ jsxs9(
Anchor,
{
...item.link,
...rest,
className: cn(
"hive-focus flex gap-4 rounded-2xl border border-transparent bg-neutral-50 p-6 @container hover:border-neutral-200/50 hover:bg-neutral-100 @lg:gap-6 dark:bg-neutral-800 dark:hover:border-neutral-700 dark:hover:bg-neutral-700/50 [.green_&]:bg-green-900 [.green_&]:hover:border-green-700/50 [.green_&]:hover:bg-green-800/75",
item.link.className
),
children: [
/* @__PURE__ */ jsx15(
"div",
{
className: cn(
"size-16 shrink-0 rounded-lg bg-[--bg] @lg:size-16 @2xl:size-[92px] [.green_&]:[background:linear-gradient(135deg,_#68A8B6_0%,_#3B736A_100%)]"
),
children: /* @__PURE__ */ jsx15(
Image,
{
...item.image,
placeholder: item.image.placeholder || "empty",
width: "92",
height: "92",
className: "aspect-square rounded-lg object-contain ring-1 ring-inset ring-[rgb(from_var(--fg)_r_g_b_/_0.1)]"
}
)
}
),
/* @__PURE__ */ jsxs9("div", { className: "flex flex-col", children: [
/* @__PURE__ */ jsx15("h3", { className: "m-0 line-clamp-2 font-medium text-[--fg] @lg:text-2xl", children: item.title }),
/* @__PURE__ */ jsx15("div", { className: "mb-2 line-clamp-3 text-sm text-[--fg-80] @lg:text-base", children: item.description }),
item.tags && item.tags.length > 0 && /* @__PURE__ */ jsx15(TagsContainer, { className: "mt-auto", children: item.tags.map((tagName) => /* @__PURE__ */ jsx15(Tag, { children: tagName }, tagName)) }),
/* @__PURE__ */ jsxs9("div", { className: "flex flex-wrap gap-x-4 text-xs text-[--fg-80] @lg:text-sm", children: [
/* @__PURE__ */ jsxs9("span", { children: [
"Updated ",
/* @__PURE__ */ jsx15("time", { dateTime: item.update, children: formatDate(item.update) })
] }),
item.weeklyNPMDownloads && /* @__PURE__ */ jsxs9("span", { className: "hidden @sm:block", children: [
numberFormat.format(item.weeklyNPMDownloads),
" weekly downloads"
] })
] })
] })
]
}
);
}
function moveFocusOnArrowKeys(event, columns) {
let listItem;
const move = { ArrowDown: "\u2B07", ArrowUp: "\u2B06", ArrowRight: "\u27A1\uFE0F", ArrowLeft: "\u2B05\uFE0F" }[event.key];
if (!move) return;
if (move === "\u2B05\uFE0F") {
const parent = event.currentTarget.parentElement;
if (parent) {
listItem = parent.previousElementSibling;
}
} else if (move === "\u27A1\uFE0F") {
const parent = event.currentTarget.parentElement;
if (parent) {
listItem = parent.nextElementSibling;
}
} else {
listItem = event.currentTarget.parentElement;
while (columns > 0 && listItem) {
if (move === "\u2B06") {
columns--;
listItem = listItem.previousElementSibling;
} else if (move === "\u2B07") {
columns--;
listItem = listItem.nextElementSibling;
}
}
}
if (listItem && listItem instanceof HTMLElement && listItem.tagName === "LI") {
const anchor = listItem.querySelector("a");
if (anchor) {
anchor.focus();
event.preventDefault();
}
}
}
// src/components/marketplace-search.tsx
import { isValidElement as isValidElement2, useMemo as useMemo3, useState as useState2 } from "react";
import fuzzy from "fuzzy";
import { Tabs as Tabs2 } from "nextra/components";
import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
var renderQueryPlaceholder = (placeholder, query) => {
if (!query || isValidElement2(placeholder)) {
return placeholder;
}
const subStrings = placeholder.split("{query}");
return /* @__PURE__ */ jsxs10(Fragment3, { children: [
subStrings[0],
" ",
/* @__PURE__ */ jsxs10("strong", { children: [
'"',
query,
'"'
] }),
" ",
subStrings[1]
] });
};
var MarketplaceSearch = ({
title,
tagsFilter,
placeholder,
primaryList,
secondaryList,
queryList,
className,
colorScheme = "neutral"
}) => {
const [query, setQuery] = useState2("");
const handleTagClick = (tagName) => {
if (query.includes(`#${tagName}`)) {
setQuery(query.replace(`#${tagName}`, "").trim());
} else {
setQuery((prev) => `${prev} #${tagName}`);
}
};
const items = useMemo3(() => {
if (query && queryList) {
const tags = query.split(/\s+/).filter((e) => e.startsWith("#")).map((e) => e.replace("#", ""));
let filteredItems = queryList.items;
if (tags.length > 0) {
filteredItems = queryList.items.filter((item) => tags.every((e) => item.tags?.includes(e)));
}
const matchedResults = fuzzy.filter(
// Removes tags and all special characters from the query string for better fuzzy matching
// query
query.replace(/#\w+/gi, "").replace(/[^\w\s]/gi, "").trim(),
// Mapping the queryList items into a list of strings including the titles
filteredItems.map((e) => e.title)
).map((e) => e.original.toLowerCase());
return queryList.items.filter((e) => matchedResults.includes(e.title.toLowerCase()));
}
}, [query, queryList]);
return /* @__PURE__ */ jsx16(
"section",
{
className: cn(
// --bg and --fg are defined in style.css under .MarketplaceSearch
"MarketplaceSearch",
colorScheme,
"bg-[--bg]",
className
),
children: /* @__PURE__ */ jsxs10("div", { className: "container max-w-[90rem] py-12", children: [
/* @__PURE__ */ jsx16(Heading, { as: "h1", className: "mb-4 text-[32px] text-[--fg]", size: "sm", children: title }),
tagsFilter && /* @__PURE__ */ jsx16(TagsContainer, { focusgroup: "horizontal", children: tagsFilter.map((tagName, i) => /* @__PURE__ */ jsx16(
Tag,
{
selected: query.includes(`#${tagName}`),
onClick: () => handleTagClick(tagName),
tabIndex: i === 0 ? 0 : -1,
children: tagName
},
tagName
)) }),
/* @__PURE__ */ jsx16(
MarketplaceSearchInput,
{
onChange: setQuery,
value: query,
placeholder,
className: "mt-4"
}
),
items && queryList ? /* @__PURE__ */ jsx16(
MarketplaceList,
{
title: queryList.title,
items,
placeholder: renderQueryPlaceholder(queryList.placeholder, query),
pagination: queryList.pagination,
colorScheme
}
) : /* @__PURE__ */ jsx16(
MarketplaceSearchTabs,
{
tabs: [primaryList, secondaryList],
colorScheme,
className: "mt-8"
}
)
] })
}
);
};
function MarketplaceSearchInput({
onChange,
value,
placeholder,
className
}) {
return /* @__PURE__ */ jsx16("div", { className: "border-b border-[--fg-60]", children: /* @__PURE__ */ jsxs10("div", { className: cn("hive-focus-within flex items-center rounded px-2", className), children: [
/* @__PURE__ */ jsx16(SvgSearch, { className: "text-[--fg-80]" }),
/* @__PURE__ */ jsx16(
"input",
{
value,
type: "search",
placeholder,
onChange: (event) => onChange(event.currentTarget.value),
className: "ml-2 w-full border-0 bg-transparent py-2 font-medium text-[--fg] outline-none placeholder:text-[--fg-60] [&::-webkit-search-cancel-button]:hidden"
}
),
/* @__PURE__ */ jsx16(
"button",
{
onClick: () => onChange(""),
tabIndex: -1,
className: "flex size-6 items-center justify-center rounded-sm",
children: /* @__PURE__ */ jsx16(SvgClose, { className: "size-5 text-[--fg-80]" })
}
)
] }) });
}
function MarketplaceSearchTabs({
tabs: lists,
colorScheme,
className
}) {
const items = lists.filter(
(list) => list?.title != null
);
return /* @__PURE__ */ jsx16("div", { className, children: /* @__PURE__ */ jsx16(
Tabs2,
{
items: items.map((list) => list.title),
className: "grid grid-cols-2 gap-1 rounded-2xl border-none bg-neutral-800 [.green_&]:!bg-green-900 [.light_&]:bg-neutral-100 [.light_&]:text-green-200",
tabClassName: cn(
"rounded-2xl border-none p-3 text-sm font-medium text-neutral-200 hover:bg-neutral-700/50 hover:text-white aria-selected:!cursor-default aria-selected:!bg-[--fg] aria-selected:!text-[--bg] sm:p-4 sm:text-base [.green_&]:!bg-green-900 [.green_&]:!text-green-200 [.green_&]:hover:!bg-green-700/25 [.green_&]:hover:!text-green-100 [.green_&]:aria-selected:!bg-green-300 [.green_&]:aria-selected:!text-green-800 [.light_&]:bg-neutral-100 [.light_&]:text-neutral-800 [.light_&]:hover:bg-neutral-200/80 [.light_&]:hover:text-neutral-900"
),
children: items.map((list, i) => /* @__PURE__ */ jsx16(Tabs2.Tab, { tabIndex: -1, children: /* @__PURE__ */ jsx16(
MarketplaceList,
{
...list,
title: void 0,
colorScheme
}
) }, i))
}
) });
}
// src/components/mdx-components.tsx
import { addBasePath } from "next/dist/client/add-base-path";
import NextImage2 from "next/image";
import clsx11 from "clsx";
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
var mdxComponents = {
source({ src, type, ...props }) {
if (!src) {
throw new Error("Must provide `src` prop");
}
let ext = src.replace(/.*\./, "");
if (ext === "mov") {
ext = "quicktime";
}
return /* @__PURE__ */ jsx17("source", { ...props, src: addBasePath(src), type: type || `video/${ext}` });
},
video: ({ className, children, ...props }) => /* @__PURE__ */ jsxs11("video", { className: clsx11("mt-6 w-full", className), autoPlay: true, loop: true, muted: true, ...props, children: [
children,
"Your browser does not support HTML video."
] }),
iframe: ({ className, ...props }) => /* @__PURE__ */ jsx17(
"iframe",
{
className: clsx11("mt-6 aspect-video w-full", className),
title: "YouTube Video Player",
allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
allowFullScreen: true,
...props
}
),
img(props) {
const ComponentToUse = typeof props.src === "object" ? NextImage2 : "img";
if (typeof props.src === "string" && !props.src.startsWith("http")) {
console.warn("Image", props.src, "doesn't use NextImage");
}
return /* @__PURE__ */ jsx17(ComponentToUse, { ...props });
}
};
// src/components/npm-badge.tsx
import { jsx as jsx18 } from "react/jsx-runtime";
var NPMBadge = ({ name }) => {
const encodedPackage = encodeURIComponent(name);
return /* @__PURE__ */ jsx18(Anchor, { href: `https://npmjs.com/package/${encodedPackage}`, newWindow: true, children: /* @__PURE__ */ jsx18(
"img",
{
src: `https://badge.fury.io/js/${encodedPackage}.svg`,
alt: "npm version",
className: "h-6"
}
) });
};
// src/components/guild-navbar-logo.tsx
import clsx12 from "clsx";
import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
function GuildUnifiedLogo({
children,
title,
description
}) {
return /* @__PURE__ */ jsxs12(Fragment4, { children: [
/* @__PURE__ */ jsxs12(
Anchor,
{
title: "View our website",
className: clsx12(
"flex items-center gap-x-1.5 transition-opacity hover:opacity-75",
children && "max-md:hidden"
),
href: "https://the-guild.dev",
children: [
/* @__PURE__ */ jsx19(SvgGuild, { className: "h-9 w-auto" }),
/* @__PURE__ */ jsx19(SvgTheGuild, { className: "w-11" })
]
}
),
children && /* @__PURE__ */ jsxs12(Fragment4, { children: [
/* @__PURE__ */ jsx19(
"svg",
{
height: "22",
viewBox: "0 0 10 22",
stroke: "currentColor",
className: "mx-6 shrink-0 max-md:hidden",
children: /* @__PURE__ */ jsx19("path", { d: "M8.6001 0.833313L0.600097 20.8333" })
}
),
/* @__PURE__ */ jsxs12(
Anchor,
{
title,
className: "flex shrink-0 items-center gap-x-1.5 hover:opacity-75",
href: "/",
children: [
typeof children === "function" ? children({}) : children,
/* @__PURE__ */ jsxs12("div", { children: [
/* @__PURE__ */ jsx19("h1", { className: "text-sm font-bold leading-tight", children: title }),
/* @__PURE__ */ jsx19("h2", { className: "text-xs max-lg:hidden", children: description })
] })
]
}
)
] })
] });
}
function getNavbarLogo(logo, websiteName, description) {
return websiteName === "Hive" ? /* @__PURE__ */ jsx19(Anchor, { title: websiteName, href: "/", children: typeof logo === "function" ? logo({}) : logo }) : /* @__PURE__ */ jsx19(GuildUnifiedLogo, { description, title: websiteName, children: logo });
}
// src/components/theme-switcher.tsx
import { useTheme } from "nextra-theme-docs";
import { jsx as jsx20 } from "react/jsx-runtime";
function ThemeSwitcherButton() {
const { resolvedTheme, setTheme } = useTheme();
return /* @__PURE__ */ jsx20(
"button",
{
onClick: () => setTheme(resolvedTheme === "light" ? "dark" : "light"),
className: "self-center rounded-sm p-2 outline-none focus-visible:ring",
children: /* @__PURE__ */ jsx20(SvgMoon, { className: "fill-transparent stroke-gray-500 dark:fill-gray-100 dark:stroke-gray-100" })
}
);
}
// src/components/company-menu.tsx
import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
var productsItems = Object.fromEntries(
Object.values(PRODUCTS).map((product) => [
product.name,
{
title: /* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-2", title: product.title, children: [
/* @__PURE__ */ jsx21(product.logo, { className: "size-7 shrink-0" }),
product.name
] }),
href: product.href
}
])
);
function addGuildCompanyMenu(items) {
return [
{
type: "menu",
title: "Company",
items: {
about: {
title: "About",
href: "https://the-guild.dev/about-us",
newWindow: true
},
blog: {
title: "Blog",
href: "https://the-guild.dev/blog",
newWindow: true
},
contact: {
title: "Contact",
href: "https://the-guild.dev/#get-in-touch",
newWindow: true
}
},
name: "company",
route: "#"
},
{
type: "menu",
title: "Products",
items: productsItems,
name: "products",
route: "#"
},
...items
];
}
// src/components/call-to-action.tsx
import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
var variantStyles = {
primary: cn(
"bg-primary hover:bg-green-800 hover:text-white focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-green-800 dark:bg-neutral-100 dark:text-neutral-800 dark:hover:bg-white dark:hover:text-neutral-900"
),
"primary-inverted": cn(
"bg-primary hover:bg-white focus-visible:outline-4 focus-visible:outline-offset-0 focus-visible:outline-white/40"
),
secondary: cn(
"bg-green-300 hover:bg-green-200 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-green-300/40"
),
"secondary-inverted": cn(
"bg-green-800 text-white hover:bg-green-700 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-green-800/40"
),
tertiary: cn(
"bg-transparent text-green-1000 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-green-800"
)
};
function CallToAction(props) {
const className = cn(
"relative flex items-center justify-center gap-2 text-nowrap rounded-lg px-6 py-3 font-medium leading-6 text-green-1000 focus-visible:outline focus-visible:ring-0 focus-visible:ring-offset-0 sm:w-fit dark:text-neutral-200 [&:hover>:first-child]:-inset-px [&:hover>:first-child]:rounded-[9px]",
variantStyles[props.variant],
props.className
);
if ("href" in props && typeof props.href === "string") {
const { className: _12, variant: _22, children: children2, ...rest2 } = props;
return /* @__PURE__ */ jsxs14(Anchor, { className, ...rest2, children: [
/* @__PURE__ */ jsx22("div", { className: "absolute inset-0 rounded-lg border border-green-800 dark:border-neutral-200" }),
children2
] });
}
const { className: _1, variant: _2, children, ...rest } = props;
return /* @__PURE__ */ jsxs14("button", { className, ...rest, children: [
/* @__PURE__ */ jsx22("div", { className: "absolute inset-0 rounded-lg border border-green-800 dark:border-neutral-200" }),
children
] });
}
// src/components/decorations/arch-decoration.svg
import { jsx as jsx23 } from "react/jsx-runtime";
var SvgArchDecoration = (props) => /* @__PURE__ */ jsx23("svg", { width: 432, height: 432, viewBox: "0 0 432 432", preserveAspectRatio: "xMidYMid meet", ...props, children: /* @__PURE__ */ jsx23("path", { d: "M.75 431v.25h90.24V160.868c0-38.596 31.282-69.878 69.878-69.878H431.25V.75H191.864a47.017 47.017 0 0 0-33.23 13.771l-68.07 68.071-7.972 7.971-68.07 68.071A47.018 47.018 0 0 0 .75 191.864V431Z", fill: "url(#arch-decoration-a)", stroke: "url(#arch-decoration-b)", strokeWidth: 0.5 }) });
// src/components/decorations/arch-decoration-gradient-defs.svg
import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
var SvgArchDecorationGradientDefs = (props) => /* @__PURE__ */ jsx24("svg", { width: 432, height: 432, viewBox: "0 0 432 432", className: "absolute -z-10", ...props, children: /* @__PURE__ */ jsxs15("defs", { children: [
/* @__PURE__ */ jsxs15("linearGradient", { id: "arch-decoration-a", x1: 48.5, y1: 53.5, x2: 302.5, y2: 341, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx24("stop", { stopColor: "#fff", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx24("stop", { offset: 1, stopColor: "#fff", stopOpacity: 0.3 })
] }),
/* @__PURE__ */ jsxs15("linearGradient", { id: "arch-decoration-b", x1: 1, y1: 1, x2: 431, y2: 431, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx24("stop", { stopColor: "#fff", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx24("stop", { offset: 1, stopColor: "#fff", stopOpacity: 0.4 })
] })
] }) });
// src/components/decorations/highlight-decoration.svg
import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
var SvgHighlightDecoration = (props) => /* @__PURE__ */ jsxs16("svg", { width: 895, height: 674, viewBox: "0 0 895 674", fill: "#86B6C1", className: "firefox-highlight-fix", ...props, children: [
/* @__PURE__ */ jsx25("g", { filter: "url(#filter0_f_711_1774)", children: /* @__PURE__ */ jsx25("path", { d: "M350 280.534C350 296.208 356.24 311.261 367.33 322.351L453.447 408.468L463.532 418.553L549.649 504.67C560.739 515.76 575.792 522 591.466 522L894 522L894 408.468L552.251 408.468C503.249 408.468 463.532 368.751 463.532 319.749L463.532 -22L350 -22L350 280.534Z" }) }),
/* @__PURE__ */ jsx25("defs", { children: /* @__PURE__ */ jsxs16("filter", { id: "filter0_f_711_1774", x: -305176e-10, y: -372, width: 1244, height: 1244, filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB", children: [
/* @__PURE__ */ jsx25("feFlood", { floodOpacity: 0, result: "BackgroundImageFix" }),
/* @__PURE__ */ jsx25("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }),
/* @__PURE__ */ jsx25("feGaussianBlur", { stdDeviation: 175, result: "effect1_foregroundBlur_711_1774" })
] }) }),
/* @__PURE__ */ jsx25("style", { children: "\n @supports (-moz-appearance: none) {\n .firefox-highlight-fix {\n opacity: 0.3;\n filter: blur(175px);\n }\n }\n " })
] });
// src/components/decorations/large-hive-icon-decoration.svg
import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
var SvgLargeHiveIconDecoration = (props) => /* @__PURE__ */ jsxs17("svg", { width: 305, height: 217, viewBox: "0 0 305 217", fill: "none", ...props, children: [
/* @__PURE__ */ jsxs17("g", { clipPath: "url(#clip0_711_1997)", children: [
/* @__PURE__ */ jsx26("mask", { id: "a", fill: "#fff", children: /* @__PURE__ */ jsx26("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M91.485 0h122.03L305 91.485v122.03L213.515 305H91.485L0 213.515V91.485L91.485 0zm77.641 285.534l116.396-116.397c9.186-9.186 9.186-24.076 0-33.263L169.126 19.478c-9.187-9.186-24.077-9.186-33.263 0L19.478 135.874c-9.186 9.187-9.186 24.077 0 33.263l116.385 116.397c9.186 9.186 24.076 9.186 33.263 0zm-48.561-133.04l31.928-31.929 31.929 31.929-31.929 31.929-31.928-31.929z" }) }),
/* @__PURE__ */ jsx26("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M91.485 0h122.03L305 91.485v122.03L213.515 305H91.485L0 213.515V91.485L91.485 0zm77.641 285.534l116.396-116.397c9.186-9.186 9.186-24.076 0-33.263L169.126 19.478c-9.187-9.186-24.077-9.186-33.263 0L19.478 135.874c-9.186 9.187-9.186 24.077 0 33.263l116.385 116.397c9.186 9.186 24.076 9.186 33.263 0zm-48.561-133.04l31.928-31.929 31.929 31.929-31.929 31.929-31.928-31.929z", fill: "url(#paint0_linear_711_1997)" }),
/* @__PURE__ */ jsx26("path", { d: "M213.515 0l.707-.707L213.93-1h-.415v1zM91.485 0v-1h-.415l-.292.293.707.707zM305 91.485h1v-.415l-.293-.292-.707.707zm0 122.03l.707.707.293-.292v-.415h-1zM213.515 305v1h.415l.292-.293-.707-.707zm-122.03 0l-.707.707.292.293h.415v-1zM0 213.515h-1v.415l.293.292.707-.707zm0-122.03l-.707-.707-.293.292v.415h1zm285.522 77.652l.707.707-.707-.707zM169.126 285.534l-.708-.707.708.707zm116.396-149.66l.707-.707-.707.707zM169.126 19.478l-.708.707.708-.707zm-33.263 0l-.707-.707.707.707zM19.478 135.874l.707.708-.707-.708zm0 33.263l.707-.707-.707.707zm116.385 116.397l-.707.707.707-.707zm16.63-164.969l.708-.707-.708-.707-.707.707.707.707zm-31.928 31.929l-.707-.707-.708.707.708.707.707-.707zm63.857 0l.707.707.708-.707-.708-.707-.707.707zm-31.929 31.929l-.707.707.707.707.708-.707-.708-.707zM213.515-1H91.485v2h122.03v-2zm92.192 91.778L214.222-.707 212.808.707l91.485 91.485 1.414-1.414zM306 213.515V91.485h-2v122.03h2zm-91.778 92.192l91.485-91.485-1.414-1.414-91.485 91.485 1.414 1.414zM91.485 306h122.03v-2H91.485v2zM-.707 214.222l91.485 91.485 1.414-1.414L.707 212.808l-1.414 1.414zM-1 91.485v122.03h2V91.485h-2zM90.778-.707L-.707 90.778l1.414 1.414L92.192.707 90.778-.707zM284.815 168.43L168.418 284.827l1.415 1.414 116.396-116.397-1.414-1.414zm0-31.848c8.796 8.795 8.796 23.053 0 31.848l1.414 1.414c9.577-9.576 9.577-25.1 0-34.677l-1.414 1.415zM168.418 20.185l116.397 116.397 1.414-1.415L169.833 18.771l-1.415 1.414zm-31.848 0c8.795-8.796 23.053-8.796 31.848 0l1.415-1.414c-9.577-9.577-25.101-9.577-34.677 0l1.414 1.414zM20.185 136.582L136.57 20.185l-1.414-1.414L18.771 135.167l1.414 1.415zm0 31.848c-8.796-8.795-8.796-23.053 0-31.848l-1.414-1.415c-9.577 9.577-9.577 25.101 0 34.677l1.414-1.414zM136.57 284.827L20.185 168.43l-1.414 1.414 116.385 116.397 1.414-1.414zm31.848 0c-8.795 8.795-23.053 8.795-31.848 0l-1.414 1.414c9.576 9.577 25.1 9.577 34.677 0l-1.415-1.414zm-16.632-164.969l-31.928 31.929 1.414 1.414 31.929-31.929-1.415-1.414zm33.343 31.929l-31.928-31.929-1.415 1.414 31.929 31.929 1.414-1.414zm-31.928 33.343l31.928-31.929-1.414-1.414-31.929 31.929 1.415 1.414zm-33.343-31.929l31.928 31.929 1.415-1.414-31.929-31.929-1.414 1.414z", fill: "url(#paint1_linear_711_1997)", mask: "url(#a)" })
] }),
/* @__PURE__ */ jsxs17("defs", { children: [
/* @__PURE__ */ jsxs17("linearGradient", { id: "paint0_linear_711_1997", x1: 0, y1: 0, x2: 305, y2: 305, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx26("stop", { stopColor: "#004540", stopOpacity: 0.4 }),
/* @__PURE__ */ jsx26("stop", { offset: 1, stopColor: "#004540" })
] }),
/* @__PURE__ */ jsxs17("linearGradient", { id: "paint1_linear_711_1997", x1: 0, y1: 0, x2: 305, y2: 305, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx26("stop", { stopColor: "#4F6C6A", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx26("stop", { offset: 1, stopColor: "#4F6C6A", stopOpacity: 0.8 })
] }),
/* @__PURE__ */ jsx26("clipPath", { id: "clip0_711_1997", children: /* @__PURE__ */ jsx26("path", { fill: "#fff", d: "M0 0H305V305H0z" }) })
] })
] });
// src/components/decorations/index.tsx
import { jsx as jsx27 } from "react/jsx-runtime";
function DecorationIsolation(props) {
return /* @__PURE__ */ jsx27(
"div",
{
...props,
className: cn("pointer-events-none absolute inset-0 overflow-hidden", props.className)
}
);
}
// src/components/get-your-api-game-right-section.tsx
import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
function GetYourAPIGameRightSection({ className }) {
return /* @__PURE__ */ jsxs18(
"section",
{
className: cn(className, "relative overflow-hidden rounded-3xl bg-primary md:h-[308px]"),
children: [
/* @__PURE__ */ jsxs18(DecorationIsolation, { children: [
/* @__PURE__ */ jsx28(GreenArchDecoration, { className: "absolute inset-y-0 right-0 hidden opacity-10 md:block [@media(min-width:1300px)]:opacity-100" }),
/* @__PURE__ */ jsx28(StrokeDecoration, { className: "absolute right-[607px] max-md:right-[-36px] max-md:top-[-71px] max-md:size-[200px] max-md:rotate-180 md:bottom-0" })
] }),
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col items-stretch justify-between gap-x-6 gap-y-4 p-4 sm:items-center md:h-[308px] md:flex-row md:px-24", children: [
/* @__PURE__ */ jsx28(
Heading,
{
as: "h2",
size: "md",
className: "text-[40px] leading-[1.2] tracking-[-0.2px] max-sm:text-balance max-sm:text-center md:text-[56px] md:leading-[1.142586] md:tracking-[-0.56px]",
children: "Get your API game right."
}
),
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-x-4 gap-y-2 whitespace-pre sm:flex-row", children: [
/* @__PURE__ */ jsx28(CallToAction, { variant: "secondary-inverted", href: "https://app.graphql-hive.com/", children: "Get started for free" }),
/* @__PURE__ */ jsx28(
CallToAction,
{
variant: "tertiary",
href: "https://the-guild.dev/contact",
onClick: (event) => {
if (window.$crisp) {
window.$crisp.push(["do", "chat:open"]);
event.preventDefault();
}
},
children: "Talk to us"
}
)
] })
] })
]
}
);
}
function GreenArchDecoration(props) {
return /* @__PURE__ */ jsxs18(
"svg",
{
width: 538,
height: 309,
viewBox: "0 0 538 309",
fill: "none",
xmlns: "http://www.w3.org/2000/svg",
...props,
children: [
/* @__PURE__ */ jsx28(
"path",
{
d: "M0 127.88c0 11.695 4.565 22.926 12.679 31.201l63.005 64.257 7.378 7.524 63.005 64.257c8.113 8.275 19.126 12.931 30.594 12.931H546.5v-84.712H147.971c-35.852 0-64.91-29.635-64.91-66.199V-97.857H0V127.88z",
fill: "url(#paint0_linear_711_2526)"
}
),
/* @__PURE__ */ jsx28("defs", { children: /* @__PURE__ */ jsxs18(
"linearGradient",
{
id: "paint0_linear_711_2526",
x1: 273.25,
y1: -3.00975,
x2: 273.25,
y2: 308.05,
gradientUnits: "userSpaceOnUse",
children: [
/* @__PURE__ */ jsx28("stop", { stopColor: "#55998D" }),
/* @__PURE__ */ jsx28("stop", { offset: 1, stopColor: "#245850" })
]
}
) })
]
}
);
}
function StrokeDecoration(props) {
return /* @__PURE__ */ jsxs18(
"svg",
{
width: 304,
height: 284,
viewBox: "0 0 304 284",
fill: "none",
xmlns: "http://www.w3.org/2000/svg",
...props,
children: [
/* @__PURE__ */ jsx28(
"path",
{
d: "M293.962 111.972a32.561 32.561 0 019.538 23.014V303.55h-62.444V113.073c0-27.66-22.419-50.079-50.079-50.079H.5V.55h168.563a32.565 32.565 0 0123.015 9.538l48.124 48.124 5.636 5.636 48.124 48.124z",
stroke: "url(#paint0_linear_711_2520)"
}
),
/* @__PURE__ */ jsx28("defs", { children: /* @__PURE__ */ jsxs18(
"linearGradient",
{
id: "paint0_linear_711_2520",
x1: 152,
y1: 159.05,
x2: 294.5,
y2: 5.04982,
gradientUnits: "userSpaceOnUse",
children: [
/* @__PURE__ */ jsx28("stop", { stopColor: "#A2C1C4", stopOpacity: 0 }),
/* @__PURE__ */ jsx28("stop", { offset: 1, stopColor: "#A2C1C4", stopOpacity: 0.8 })
]
}
) })
]
}
);
}
// src/components/hive-navigation/index.tsx
import React, { forwardRef as forwardRef3, Fragment as Fragment5, useEffect as useEffect3, useRef } from "react";
import { createPortal } from "react-dom";
import { useRouter as useRouter2 } from "next/router";
import { useMenu, useThemeConfig } from "nextra-theme-docs";
import { useMounted as useMounted2 } from "nextra/hooks";
import { MenuIcon } from "nextra/icons";
// src/helpers/render-slot.tsx
import { cloneElement } from "react";
import { jsx as jsx29 } from "react/jsx-runtime";
function renderSlot(Slot, props) {
if (typeof Slot === "function") {
return /* @__PURE__ */ jsx29(Slot, { ...props });
}
if (!(typeof Slot === "object" && Slot && "props" in Slot)) return null;
if ("className" in props) {
props = {
...props,
className: cn(Slot.props.className, props.className)
};
return cloneElement(Slot, props);
}
}
// src/components/hive-navigation/navigation-menu.tsx
import {
forwardRef as forwardRef2,
useEffect as useEffect2,
useLayoutEffect
} from "react";
import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
import { jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
var CONTAINER_ID = "h-navmenu-container";
var VIEWPORT_ID = "h-navmenu-viewport";
var NavigationMenu = forwardRef2(({ className, children, forceMount, ...rest }, ref) => /* @__PURE__ */ jsxs19(
NavigationMenuPrimitive.Root,
{
id: CONTAINER_ID,
ref,
className: cn("relative z-10 flex flex-1 items-center", className),
"aria-label": "Navigation Menu",
...rest,
children: [
children,
/* @__PURE__ */ jsx30(NavigationMenuViewport, { forceMount }),
/* @__PURE__ */ jsx30(RemoveMotionIfPreferred, {})
]
}
));
NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;
var NavigationMenuList = forwardRef2(({ className, ...rest }, ref) => /* @__PURE__ */ jsx30(
NavigationMenuPrimitive.List,
{
ref,
className: cn(
"group flex flex-1 list-none items-center rounded-lg border-beige-200 px-1.5 lg:border lg:px-3 dark:border-neutral-700",
className
),
...rest
}
));
NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
var NavigationMenuItem = NavigationMenuPrimitive.Item;
var NavigationMenuTrigger = forwardRef2(({ className, children, ...rest }, ref) => /* @__PURE__ */ jsx30(
NavigationMenuPrimitive.Trigger,
{
ref,
className: cn(
"hive-focus cursor-default rounded p-3 font-medium leading-normal text-green-800 aria-expanded:text-green-1000 dark:text-neutral-300 dark:aria-expanded:text-neutral-100",
className
),
onPointerOver: (event) => {
rest.onPointerOver?.(event);
const container = document.getElementById(CONTAINER_ID);
const viewport = document.getElementById(VIEWPORT_ID);
if (!viewport || !(viewport instanceof HTMLElement) || !container) return;
const newX = getTransformX(event.currentTarget, viewport, container);
if (!viewport.style.transition) {
setTimeout(() => {
viewport.style.transition = "transform 0.5s";
}, 0);
}
viewport.style.transform = `translateX(${newX}px)`;
},
...rest,
children
}
));
NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
var NavigationMenuContent = forwardRef2(({ className, ...rest }, ref) => /* @__PURE__ */ jsx30(
NavigationMenuPrimitive.Content,
{
ref,
className: cn(
"absolute left-0 top-0 w-auto bg-white data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 dark:bg-neutral-900 [&>:first-child]:p-6",
className
),
...rest,
style: {
animationDuration: "0.4s",
...rest.style
}
}
));
NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
var NavigationMenuLink = forwardRef2(({ className, arrow, children, href, ...rest }, ref) => {
const isActive = false;
return /* @__PURE__ */ jsx30(NavigationMenuPrimitive.Link, { active: isActive, ...rest, asChild: true, ref, children: /* @__PURE__ */ jsxs19(
Anchor,
{
href,
className: cn(
'hive-focus [data-active="true"]:text-green-1000 rounded p-3 leading-normal text-green-800 transition-colors hover:bg-beige-100 hover:text-green-1000 dark:text-neutral-300 dark:hover:bg-neutral-800/50 dark:hover:text-neutral-100 [&:hover>svg]:opacity-100',
arrow && "flex items-center",
className
),
...href.startsWith("http") ? { target: "_blank", rel: "noopener noreferrer" } : {},
children: [
children,
arrow && /* @__PURE__ */ jsx30(SvgArrowIcon, { className: "ml-auto size-6 shrink-0 opacity-0 transition-all" })
]
}
) });
});
NavigationMenuLink.displayName = NavigationMenuPrimitive.Link.displayName;
var useIsomorphicLayoutEffect = typeof window === "undefined" ? useEffect2 : useLayoutEffect;
var NavigationMenuViewport = forwardRef2(({ className, ...rest }, ref) => {
useIsomorphicLayoutEffect(() => {
const viewport = document.getElementById(VIEWPORT_ID);
const container = document.getElementById(CONTAINER_ID);
if (!(container && container instanceof HTMLElement && viewport && viewport instanceof HTMLElement)) {
return;
}
const firstCollectionItem = container.querySelector("[data-radix-collection-item]");
if (firstCollectionItem && firstCollectionItem instanceof HTMLElement) {
viewport.style.transform = `translateX(${getTransformX(firstCollectionItem, viewport, container)}px)`;
}
}, []);
return /* @__PURE__ */ jsx30(
"div",
{
id: VIEWPORT_ID,
className: "absolute left-0 top-full flex",
style: {
perspective: "2000px"
},
children: /* @__PURE__ */ jsx30(
NavigationMenuPrimitive.Viewport,
{
className: cn(
"relative mt-1.5 h-[--radix-navigation-menu-viewport-height] w-[--radix-navigation-menu-viewport-width] origin-[top_center] overflow-hidden rounded-xl border border-beige-200 bg-white shadow-[0px_16px_32px_-12px_rgba(14,18,27,0.10)] ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-90 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 dark:border-neutral-800 dark:bg-neutral-900",
className
),
style: {
transition: "width 450ms, height 450ms, transform 250ms, opacity 250ms"
},
ref,
...rest
}
)
}
);
});
NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
var NavigationMenuIndicator = forwardRef2(({ className, ...rest }, ref) => /* @__PURE__ */ jsx30(
NavigationMenuPrimitive.Indicator,
{
ref,
className: cn(
"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",
className
),
...rest,
children: /* @__PURE__ */ jsx30("div", { className: "relative top-[60%] size-2 rotate-45 rounded-tl-sm bg-beige-200 shadow-md" })
}
));
NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
function getTransformX(element, viewport, container) {
const boundingBox = element.getBoundingClientRect();
const containerLeft = container.getBoundingClientRect().left;
const left = boundingBox.left - containerLeft;
const offsetX = -32;
let newX = left + offsetX;
if (newX + viewport.offsetWidth > window.innerWidth) {
newX = window.innerWidth - viewport.offsetWidth + offsetX;
}
return newX;
}
function RemoveMotionIfPreferred() {
return /* @__PURE__ */ jsx30("style", { children: `@media (prefers-reduced-motion: reduce) { #${CONTAINER_ID} * { animation-duration: 0ms !important; transition-duration: 0ms !important; } }` });
}
// src/components/hive-navigation/graphql-conf-card.tsx
import { jsx as jsx31, jsxs as jsxs20 } from "react/jsx-runtime";
function GraphQLConfCard({ image }) {
return /* @__PURE__ */ jsxs20(
NavigationMenuLink,
{
href: "https://www.youtube.com/playlist?list=PL43V96KpNj7OMvmfL0WFKP6LpoboM8Hde",
className: "group w-[358px]",
children: [
/* @__PURE__ */ jsx31(Image, { alt: "", ...image, width: 358, height: 200 }),
/* @__PURE__ */ jsx31("strong", { className: "mt-6 block text-xl font-medium leading-7 text-green-1000 dark:text-neutral-100", children: "GraphQLConf 2024" }),
/* @__PURE__ */ jsx31("p", { className: "mt-4 text-sm font-medium leading-5 text-green-800 dark:text-neutral-200", children: "September 10-12 | San Francisco CA" }),
/* @__PURE__ */ jsx31("p", { className: "mt-2 text-sm font-normal leading-5 text-green-800 dark:text-neutral-200", children: "The official GraphQL conference hosted by GraphQL Foundation." }),
/* @__PURE__ */ jsxs20("span", { className: "mt-6 flex items-center gap-2 rounded-lg font-medium text-green-800 transition-colors group-hover:text-green-1000 dark:text-neutral-200 dark:group-hover:text-neutral-100", children: [
"Watch The Guild at GraphQLConf 2024",
/* @__PURE__ */ jsx31(SvgArrowIcon, {})
] })
]
}
);
}
// src/components/hive-navigation/index.tsx
import { jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
var ENTERPRISE_MENU_HIDDEN = true;
function HiveNavigation({
companyMenuChildren,
children,
className,
productName,
logo,
navLinks,
developerMenu
}) {
const themeConfig = useThemeConfig();
const Search = themeConfig?.search?.component;
const isHive = productName === "Hive";
const containerRef = useRef(null);
logo || (logo = /* @__PURE__ */ jsx32(HiveLogoLink, { isHive }));
navLinks || (navLinks = [
{
href: isHive ? "/pricing" : "https://the-guild.dev/graphql/hive/pricing",
children: "Pricing"
}
]);
return /* @__PURE__ */ jsxs21(
"div",
{
ref: containerRef,
className: cn(
"sticky top-0 z-20 border-b border-beige-400/[var(--border-opacity)] bg-[rgb(var(--nextra-bg))] px-6 py-4 text-green-1000 transition-[border-color] duration-500 md:mb-[7px] md:mt-2 dark:border-neutral-700/[var(--border-opacity)] dark:text-neutral-200 [&.light]:border-beige-400/[var(--border-opacity)] [&.light]:bg-white [&.light]:text-green-1000",
className?.includes("light") && "light"
),
style: { "--border-opacity": 0 },
children: [
/* @__PURE__ */ jsx32(
TopOfSiteMarker,
{
onChange: (scrolled) => {
const container = containerRef.current;
container.style.setProperty("--border-opacity", scrolled ? "1" : "0");
}
}
),
/* @__PURE__ */ jsxs21("div", { className: "flex items-center justify-between md:hidden", children: [
logo,
/* @__PURE__ */ jsx32(HamburgerButton, {})
] }),
/* @__PURE__ */ jsxs21(NavigationMenu, { className: cn("mx-auto hidden md:flex", className), delayDuration: 0, children: [
logo,
/* @__PURE__ */ jsxs21(NavigationMenuList, { className: "ml-4 bg-white dark:bg-transparent [@media(min-width:1180px)]:ml-16", children: [
/* @__PURE__ */ jsxs21(NavigationMenuItem, { children: [
/* @__PURE__ */ jsx32(NavigationMenuTrigger, { children: "Products" }),
/* @__PURE__ */ jsx32(NavigationMenuContent, { children: /* @__PURE__ */ jsx32(ProductsMenu, { productName }) })
] }),
/* @__PURE__ */ jsxs21(NavigationMenuItem, { children: [
/* @__PURE__ */ jsx32(NavigationMenuTrigger, { children: "Developer" }),
/* @__PURE__ */ jsx32(NavigationMenuContent, { children: /* @__PURE__ */ jsx32(DeveloperMenu, { isHive, developerMenu }) })
] }),
!ENTERPRISE_MENU_HIDDEN && /* @__PURE__ */ jsxs21(NavigationMenuItem, { children: [
/* @__PURE__ */ jsx32(NavigationMenuTrigger, { children: "Enterprise" }),
/* @__PURE__ */ jsx32(NavigationMenuContent, { children: /* @__PURE__ */ jsx32(EnterpriseMenu, {}) })
] }),
/* @__PURE__ */ jsxs21(NavigationMenuItem, { children: [
/* @__PURE__ */ jsx32(NavigationMenuTrigger, { children: "Company" }),
/* @__PURE__ */ jsx32(NavigationMenuContent, { children: /* @__PURE__ */ jsx32(CompanyMenu, { children: companyMenuChildren }) })
] }),
navLinks.map(({ href, children: children2 }, i) => /* @__PURE__ */ jsx32(NavigationMenuItem, { className: "flex", children: /* @__PURE__ */ jsx32(NavigationMenuLink, { href, className: "font-medium", children: children2 }) }, i))
] }),
/* @__PURE__ */ jsx32("div", { className: "flex-1" }),
children,
renderSlot(Search, {
className: cn(
"relative ml-4 basis-64 [&_:is(input,kbd)]:text-green-700 dark:[&_:is(input,kbd)]:text-neutral-300 [&_input]:h-12 [&_input]:w-full [&_input]:rounded-lg [&_input]:border [&_input]:border-green-200 [&_input]:bg-white [&_input]:pl-4 [&_input]:pr-8 [&_input]:ring-[hsl(var(--nextra-primary-hue)_var(--nextra-primary-saturation)_32%/var(--tw-ring-opacity))] [&_input]:ring-offset-[rgb(var(--nextra-bg))] dark:[&_input]:border-neutral-800 [&_input]:dark:bg-inherit [&_kbd]:absolute [&_kbd]:right-4 [&_kbd]:top-1/2 [&_kbd]:my-0 [&_kbd]:-translate-y-1/2 [&_kbd]:border-none [&_kbd]:bg-green-200 dark:[&_kbd]:bg-neutral-700"
)
}),
/* @__PURE__ */ jsxs21(
CallToAction,
{
className: "ml-4 max-lg:hidden",
variant: "tertiary",
href: "https://the-guild.dev/contact",
target: "_blank",
rel: "noopener noreferrer",
onClick: (event) => {
if (window.$crisp) {
window.$crisp.push(["do", "chat:open"]);
event.preventDefault();
}
},
children: [
"Contact ",
/* @__PURE__ */ jsx32("span", { className: "hidden xl:contents", children: "us" })
]
}
),
isHive ? /* @__PURE__ */ jsx32(CallToAction, { variant: "primary", href: "https://app.graphql-hive.com/", className: "ml-4", children: "Sign in" }) : /* @__PURE__ */ jsx32(CallToAction, { variant: "primary", href: "/docs", className: "ml-4", children: "Docs" })
] })
]
}
);
}
var ProductsMenu = React.forwardRef(
({ productName, ...rest }, ref) => {
const { asPath } = useRouter2();
const bidirectionalProductLink = (product) => {
if (productName === product.name) {
return asPath === "/" ? "/docs" : "/";
}
return product.href;
};
return /* @__PURE__ */ jsxs21(MenuContentColumns, { ref, ...rest, children: [
/* @__PURE__ */ jsxs21("div", { className: "w-[220px]", children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Platform" }),
/* @__PURE__ */ jsxs21(NavigationMenuLink, { href: bidirectionalProductLink(PRODUCTS.HIVE), className: "p-4", children: [
/* @__PURE__ */ jsx32("div", { className: "w-fit rounded-lg bg-green-800 p-3 dark:bg-white/10", children: /* @__PURE__ */ jsx32(SvgHive, { className: "size-10 text-white" }) }),
/* @__PURE__ */ jsx32("p", { className: "mt-4 text-base font-medium leading-normal text-green-1000 dark:text-neutral-200", children: "Hive" }),
/* @__PURE__ */ jsx32("p", { className: "mt-1 text-sm leading-5 text-green-800 dark:text-neutral-400", children: "GraphQL Federation Platform with Schema Registry and Analytics" })
] }),
/* @__PURE__ */ jsxs21(
Anchor,
{
href: "https://app.graphql-hive.com/",
title: "Discover the Hive platform",
className: "hive-focus -my-2 ml-2 flex items-center gap-2 rounded-lg p-2 font-medium text-green-800 transition-colors hover:bg-beige-100 hover:text-green-1000 dark:text-neutral-400 dark:hover:bg-neutral-800/50 dark:hover:text-neutral-200",
children: [
/* @__PURE__ */ jsx32("span", { children: "Get started" }),
" ",
/* @__PURE__ */ jsx32(SvgArrowIcon, {})
]
}
)
] }),
/* @__PURE__ */ jsxs21("div", { className: "w-[269px] xl:w-[281px]", children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "The GraphQL Stack" }),
/* @__PURE__ */ jsx32("ul", { children: [
[PRODUCTS.HIVE_GATEWAY, "GraphQL Federation Gateway"],
[PRODUCTS.MESH, "Anything to GraphQL"],
[PRODUCTS.YOGA, "GraphQL Server & Subgraph"]
].map(([product, description]) => {
const Logo = product.logo;
return /* @__PURE__ */ jsx32("li", { children: /* @__PURE__ */ jsxs21(
NavigationMenuLink,
{
href: bidirectionalProductLink(product),
title: product.title,
className: "flex flex-row items-center gap-4 p-4",
children: [
/* @__PURE__ */ jsx32("div", { className: "size-12 rounded-lg bg-blue-400 p-2.5", children: /* @__PURE__ */ jsx32(Logo, { className: "size-7 text-green-1000" }) }),
/* @__PURE__ */ jsxs21("div", { children: [
/* @__PURE__ */ jsx32("p", { className: "text-base font-medium leading-normal text-green-1000 dark:text-neutral-200", children: product.name }),
/* @__PURE__ */ jsx32("p", { className: "col-start-2 mt-1 text-sm leading-5 text-green-800 dark:text-neutral-300", children: description })
] })
]
}
) }, product.name);
}) })
] }),
/* @__PURE__ */ jsxs21("div", { className: "w-[364px]", children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Libraries" }),
/* @__PURE__ */ jsx32("ul", { className: "grid grid-cols-2 gap-x-4", children: SIX_HIGHLIGHTED_PRODUCTS.map((product) => {
const Logo = product.logo;
return /* @__PURE__ */ jsx32("li", { children: /* @__PURE__ */ jsxs21(
NavigationMenuLink,
{
href: bidirectionalProductLink(product),
className: "flex flex-row items-center gap-3 px-4 py-2",
arrow: true,
children: [
/* @__PURE__ */ jsx32("div", { className: "flex size-8 items-center justify-center rounded bg-beige-200 p-[5px] dark:bg-white/5", children: /* @__PURE__ */ jsx32(Logo, { className: "size-8 text-green-1000 dark:text-neutral-300" }) }),
/* @__PURE__ */ jsx32("div", { children: /* @__PURE__ */ jsx32("p", { className: "text-base font-medium leading-normal text-green-1000 dark:text-neutral-200", children: product.name === PRODUCTS.ESLINT.name ? "ESLint" : product.name }) })
]
}
) }, product.name);
}) }),
/* @__PURE__ */ jsxs21(
Anchor,
{
href: productName === "Hive" ? "/ecosystem" : "https://the-guild.dev/graphql/hive/ecosystem",
className: "hive-focus -my-2 ml-2 flex items-center gap-2 rounded-lg p-2 font-medium text-green-800 transition-colors hover:bg-beige-100 hover:text-green-1000 dark:text-neutral-400 dark:hover:bg-neutral-800/50 dark:hover:text-neutral-200",
children: [
/* @__PURE__ */ jsx32("span", { children: "Explore all libraries" }),
" ",
/* @__PURE__ */ jsx32(SvgArrowIcon, {})
]
}
)
] })
] });
}
);
ProductsMenu.displayName = "ProductsMenu";
var MenuContentColumns = forwardRef3(
(props, ref) => {
return /* @__PURE__ */ jsx32("div", { className: "flex gap-x-6 *:flex *:flex-col *:gap-4", ref, ...props, children: React.Children.toArray(props.children).filter(Boolean).map((child, index, array) => {
return /* @__PURE__ */ jsxs21(Fragment5, { children: [
child,
index < array.length - 1 && /* @__PURE__ */ jsx32("div", { className: "w-px bg-beige-200 dark:bg-neutral-800" })
] }, index);
}) });
}
);
MenuContentColumns.displayName = "MenuContentColumns";
var DeveloperMenu = React.forwardRef(
({ isHive, developerMenu, ...rest }, ref) => {
developerMenu || (developerMenu = [
{
href: isHive ? "/docs" : "https://the-guild.dev/graphql/hive/docs",
icon: SvgPaper,
title: "Visit the documentation",
children: "Documentation"
},
{
href: "https://status.graphql-hive.com/",
title: "Check Hive status",
icon: SvgTarget,
children: "Status"
},
{
href: isHive ? "/product-updates" : "https://the-guild.dev/graphql/hive/product-updates",
title: "Read most recent developments from Hive",
icon: SvgRightCorner,
children: "Product Updates"
},
{
href: "https://the-guild.dev/blog",
title: "Read our blog post",
icon: SvgPencil,
children: "Blog"
},
{
href: isHive ? "https://github.com/graphql-hive/console" : "https://github.com/dotansimha/graphql-code-generator",
title: "Give us a star",
icon: GitHubIcon,
children: "GitHub"
}
]);
return /* @__PURE__ */ jsxs21(MenuContentColumns, { ...rest, ref, children: [
/* @__PURE__ */ jsxs21("div", { children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Developer" }),
/* @__PURE__ */ jsx32("ul", { children: developerMenu.map(({ href, title, icon, children }, i) => /* @__PURE__ */ jsx32(MenuColumnListItem, { title, href, icon, children }, i)) })
] }),
/* @__PURE__ */ jsxs21("div", { children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Community" }),
/* @__PURE__ */ jsx32("ul", { children: [
[
"YouTube",
YouTubeIcon,
"https://www.youtube.com/watch?v=d_GBgH-L5c4&list=PLhCf3AUOg4PgQoY_A6xWDQ70yaNtPYtZd"
],
["X", TwitterIcon, "https://x.com/theguilddev"],
["LinkedIn", LinkedInIcon, "https://www.linkedin.com/company/the-guild-software/"],
["Discord", DiscordIcon2, "https://discord.com/invite/xud7bH9"]
].map(([text, Icon, href], i) => /* @__PURE__ */ jsx32(MenuColumnListItem, { href, icon: Icon, children: text }, i)) })
] })
] });
}
);
DeveloperMenu.displayName = "DeveloperMenu";
function MenuColumnListItem({
children,
href,
title,
icon: Icon
}) {
return /* @__PURE__ */ jsx32("li", { children: /* @__PURE__ */ jsxs21(
NavigationMenuLink,
{
href,
title,
className: "flex flex-row items-center gap-3 text-nowrap px-4 py-2",
arrow: true,
children: [
/* @__PURE__ */ jsx32(Icon, { className: "size-6 shrink-0" }),
/* @__PURE__ */ jsx32("p", { className: "text-base font-medium leading-normal text-green-1000 dark:text-neutral-200", children })
]
}
) });
}
function ColumnLabel({ children }) {
return /* @__PURE__ */ jsx32("p", { className: "px-4 text-sm leading-5 text-green-700 dark:text-neutral-300", children });
}
function YouTubeIcon(props) {
return /* @__PURE__ */ jsx32("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsx32("path", { d: "M20.5887 7.04819C21 8.65199 21 12 21 12C21 12 21 15.348 20.5887 16.9518C20.3601 17.8383 19.6914 18.5358 18.8445 18.7716C17.3064 19.2 12 19.2 12 19.2C12 19.2 6.6963 19.2 5.1555 18.7716C4.305 18.5322 3.6372 17.8356 3.4113 16.9518C3 15.348 3 12 3 12C3 12 3 8.65199 3.4113 7.04819C3.6399 6.16169 4.3086 5.46419 5.1555 5.22839C6.6963 4.79999 12 4.79999 12 4.79999C12 4.79999 17.3064 4.79999 18.8445 5.22839C19.695 5.46779 20.3628 6.16439 20.5887 7.04819ZM10.2 15.15L15.6 12L10.2 8.84999V15.15Z" }) });
}
function TwitterIcon(props) {
return /* @__PURE__ */ jsx32("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsx32("path", { d: "M16.6536 4.6875H19.1346L13.7144 10.8825L20.0909 19.3125H15.0981L11.1876 14.1997L6.71313 19.3125H4.23063L10.0281 12.6862L3.91113 4.6875H9.03063L12.5654 9.36075L16.6536 4.6875ZM15.7829 17.8275H17.1576L8.28363 6.0945H6.80838L15.7829 17.8275Z" }) });
}
function LinkedInIcon(props) {
return /* @__PURE__ */ jsx32("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsx32("path", { d: "M17.7015 17.7051H15.303V13.9458C15.303 13.0494 15.285 11.8956 14.052 11.8956C12.8019 11.8956 12.6111 12.8712 12.6111 13.8801V17.7051H10.2117V9.97499H12.5157V11.028H12.5472C12.8694 10.4214 13.6524 9.77969 14.8224 9.77969C17.2524 9.77969 17.7024 11.3799 17.7024 13.4616V17.7051H17.7015ZM7.50272 8.91749C7.31962 8.91773 7.13828 8.88183 6.96908 8.81184C6.79988 8.74185 6.64617 8.63916 6.51674 8.50965C6.38731 8.38013 6.28471 8.22635 6.21483 8.05711C6.14496 7.88786 6.10917 7.70649 6.10952 7.52339C6.1097 7.24785 6.19159 6.97854 6.34482 6.74953C6.49806 6.52051 6.71576 6.34208 6.9704 6.2368C7.22504 6.13152 7.50519 6.10411 7.77541 6.15804C8.04563 6.21197 8.29378 6.34482 8.4885 6.53979C8.68322 6.73476 8.81575 6.98309 8.86933 7.25338C8.92291 7.52367 8.89514 7.80377 8.78953 8.05828C8.68392 8.31279 8.50521 8.53026 8.276 8.6832C8.04679 8.83614 7.77737 8.91767 7.50182 8.91749H7.50272ZM8.70512 17.7051H6.29942V9.97499H8.70602V17.7051H8.70512ZM18.903 3.89999H5.09612C4.43372 3.89999 3.90002 4.42199 3.90002 5.06729V18.9327C3.90002 19.578 4.43462 20.1 5.09522 20.1H18.8994C19.56 20.1 20.1 19.578 20.1 18.9327V5.06729C20.1 4.42199 19.56 3.89999 18.8994 3.89999H18.9021H18.903Z" }) });
}
function DiscordIcon2(props) {
return /* @__PURE__ */ jsx32("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsx32("path", { d: "M10.2684 11.1C10.8084 11.1 11.2458 11.505 11.2359 12C11.2359 12.495 10.8093 12.9 10.2684 12.9C9.73742 12.9 9.30002 12.495 9.30002 12C9.30002 11.505 9.72752 11.1 10.2684 11.1ZM13.7316 11.1C14.2725 11.1 14.7 11.505 14.7 12C14.7 12.495 14.2725 12.9 13.7316 12.9C13.2006 12.9 12.7641 12.495 12.7641 12C12.7641 11.505 13.1907 11.1 13.7316 11.1ZM18.2019 3C19.2486 3 20.1 3.8694 20.1 4.9467V21.9L18.1101 20.1045L16.9896 19.0461L15.8043 17.9211L16.2957 19.6698H5.79812C4.75142 19.6698 3.90002 18.8004 3.90002 17.7231V4.9467C3.90002 3.8694 4.75142 3 5.79812 3H18.201H18.2019ZM14.6289 15.3417C16.6746 15.276 17.4621 13.9053 17.4621 13.9053C17.4621 10.8624 16.1283 8.3955 16.1283 8.3955C14.7963 7.3758 13.5273 7.4037 13.5273 7.4037L13.3977 7.5549C14.9718 8.0463 15.7026 8.7555 15.7026 8.7555C14.8432 8.27129 13.896 7.9629 12.9162 7.8483C12.2947 7.7781 11.667 7.78415 11.0469 7.8663C10.9911 7.8663 10.9443 7.8762 10.8894 7.8852C10.5654 7.914 9.77792 8.0364 8.78792 8.481C8.44592 8.6412 8.24162 8.7555 8.24162 8.7555C8.24162 8.7555 9.01022 8.0085 10.6761 7.5171L10.5834 7.4037C10.5834 7.4037 9.31532 7.3758 7.98242 8.3964C7.98242 8.3964 6.64952 10.8624 6.64952 13.9053C6.64952 13.9053 7.42712 15.2751 9.47283 15.3417C9.47283 15.3417 9.81482 14.9169 10.0938 14.5578C8.91752 14.1978 8.47382 13.4418 8.47382 13.4418C8.47382 13.4418 8.56563 13.5084 8.73212 13.6029C8.74113 13.6119 8.75012 13.6218 8.76902 13.6308C8.79692 13.6506 8.82482 13.6596 8.85273 13.6785C9.08402 13.8108 9.31532 13.9143 9.52772 13.9998C9.90753 14.151 10.3611 14.3022 10.8894 14.4066C11.6808 14.5617 12.4945 14.5648 13.287 14.4156C13.7487 14.3332 14.199 14.197 14.6289 14.0097C14.9529 13.8864 15.3138 13.7064 15.6936 13.4517C15.6936 13.4517 15.231 14.2266 14.0178 14.5767C14.2959 14.9358 14.6298 15.3417 14.6298 15.3417H14.6289Z" }) });
}
function EnterpriseMenu() {
return /* @__PURE__ */ jsx32("ul", { children: [
// TODO: Enable these when the pages are created.
[SvgAccountBox, "Customer Stories", ""],
[SvgBard, "Why GraphQL", ""],
[SvgHonour, "Professional Services", ""],
[SvgShieldFlash, "Commitment to Security", ""]
].map(([Icon, text, href], i) => {
return /* @__PURE__ */ jsx32(MenuColumnListItem, { href, icon: Icon, children: text }, i);
}) });
}
function CompanyMenu({ children }) {
return /* @__PURE__ */ jsxs21(MenuContentColumns, { children: [
/* @__PURE__ */ jsxs21("div", { children: [
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Company" }),
/* @__PURE__ */ jsxs21("ul", { children: [
/* @__PURE__ */ jsx32(MenuColumnListItem, { icon: SvgGroup, href: "https://the-guild.dev/about-us", children: "About Us" }),
/* @__PURE__ */ jsx32(MenuColumnListItem, { icon: SvgApps, href: "https://the-guild.dev/logos", children: "Brand Assets" })
] }),
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Proudly made by" }),
/* @__PURE__ */ jsxs21(NavigationMenuLink, { href: "https://the-guild.dev", className: "px-4 py-2", arrow: true, children: [
/* @__PURE__ */ jsx32(SvgGuild, { className: "-my-2 size-10" }),
/* @__PURE__ */ jsx32(SvgTheGuild, { className: "h-8" })
] }),
/* @__PURE__ */ jsx32(ColumnLabel, { children: "Part of" }),
/* @__PURE__ */ jsx32(
NavigationMenuLink,
{
href: "https://graphql.org/community/foundation/",
className: "px-4 py-2 text-blue-800 hover:text-blue-1000",
arrow: true,
children: /* @__PURE__ */ jsx32(SvgGraphqlFoundation, { className: "" })
}
)
] }),
children && /* @__PURE__ */ jsx32("div", { children })
] });
}
function HiveLogoLink({ isHive }) {
return /* @__PURE__ */ jsx32(
Anchor,
{
href: isHive ? "/" : "https://the-guild.dev/graphql/hive",
className: "hive-focus -m-2 flex items-center rounded-md p-2",
children: /* @__PURE__ */ jsx32(SvgHiveCombinationMark, { className: "text-green-1000 dark:text-neutral-200" })
}
);
}
function HamburgerButton() {
const { menu, setMenu } = useMenu();
return /* @__PURE__ */ jsx32(
"button",
{
type: "button",
"aria-label": "Menu",
className: "md:_hidden hover nextra-hamburger -m-1 rounded-lg bg-transparent p-1 text-green-1000 focus-visible:outline-none focus-visible:ring active:bg-beige-200 dark:text-neutral-200 dark:active:bg-neutral-800",
onClick: () => setMenu(!menu),
children: /* @__PURE__ */ jsx32(
MenuIcon,
{
className: cn({ open: menu }, "size-6 stroke-current [&_path]:[stroke-linecap:square]")
}
)
}
);
}
var TopOfSiteMarker = function TopOfSiteMarker2({
onChange,
className
}) {
const mounted = useMounted2();
const markerRef = useRef(null);
const onChangeRef = useRef(onChange);
onChangeRef.current = onChange;
useEffect3(() => {
if (mounted && markerRef.current && "IntersectionObserver" in window) {
const marker = markerRef.current;
const observer = new IntersectionObserver((entries) => {
onChangeRef.current(entries[0].boundingClientRect.y < -1);
});
observer.observe(markerRef.current);
return () => {
observer.unobserve(marker);
};
}
}, [mounted]);
if (!mounted) {
return null;
}
return createPortal(
/* @__PURE__ */ jsx32("div", { ref: markerRef, className: cn("absolute left-0 top-0 -z-50 size-px", className) }),
document.body
);
};
// src/components/hive-footer.tsx
import { jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
function HiveFooter({
className,
logo,
sameSite,
description,
items = {}
}) {
items = { ...HiveFooter.DEFAULT_ITEMS, ...items };
description || (description = "Open-source GraphQL management platform");
return /* @__PURE__ */ jsxs22("footer", { className: cn("relative flex justify-center px-4 py-6 xl:px-[120px]", className), children: [
/* @__PURE__ */ jsxs22("div", { className: "mx-4 grid w-full max-w-[75rem] grid-cols-1 gap-x-6 text-green-800 max-lg:gap-y-16 sm:grid-cols-4 lg:gap-x-8 xl:gap-x-10 dark:text-neutral-400", children: [
/* @__PURE__ */ jsxs22("div", { className: "max-lg:col-span-full", children: [
/* @__PURE__ */ jsx33(
Anchor,
{
href: "/",
sameSite,
...logo,
className: "hive-focus -m-1.5 flex rounded p-1.5 text-green-1000 dark:text-white",
children: logo?.children || /* @__PURE__ */ jsx33(SvgHiveCombinationMark, { className: "h-8 w-auto" })
}
),
/* @__PURE__ */ jsx33("p", { className: "mt-6 lg:mt-8", children: description })
] }),
/* @__PURE__ */ jsxs22("div", { className: "col-span-full grid grid-flow-row grid-cols-2 justify-stretch gap-6 text-sm sm:col-span-4 sm:grid-cols-3 lg:col-span-3 lg:pb-12 lg:text-base", children: [
/* @__PURE__ */ jsx33(List2, { heading: "Products", links: productLinks }),
/* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-[inherit]", children: [
/* @__PURE__ */ jsx33(List2, { heading: "Developer", links: items.developer }),
/* @__PURE__ */ jsx33(List2, { heading: "Resources", links: items.resources })
] }),
/* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-[inherit]", children: [
/* @__PURE__ */ jsx33(List2, { heading: "Company", links: items.company }),
items.links?.map((link, i) => /* @__PURE__ */ jsx33(
Anchor,
{
className: "hive-focus -m-2 rounded p-2 font-medium hover:text-blue-700 hover:underline dark:hover:text-blue-100",
...link
},
i
)),
/* @__PURE__ */ jsx33(
"a",
{
className: "hive-focus -m-2 rounded p-2 font-medium hover:text-blue-700 hover:underline dark:hover:text-blue-100",
href: "https://the-guild.dev/contact",
onClick: (event) => {
if (window.$crisp) {
window.$crisp.push(["do", "chat:open"]);
event.preventDefault();
}
},
children: "Contact Us"
}
)
] }),
/* @__PURE__ */ jsx33(CSAStarLink, { className: "sm:col-start-[-1] lg:col-start-[-2]" })
] }),
/* @__PURE__ */ jsxs22("div", { className: "col-span-full flex flex-row flex-wrap justify-between gap-x-[inherit] gap-y-8 lg:w-full lg:pb-2 lg:pt-8", children: [
/* @__PURE__ */ jsx33("div", { className: "flex gap-6 lg:order-1", children: SOCIAL_ICONS.map(({ icon: Icon, ...iconProps }) => /* @__PURE__ */ jsx33(
Anchor,
{
className: "hive-focus -m-1 rounded-md p-1 hover:text-blue-700 dark:hover:text-blue-100",
...iconProps,
children: /* @__PURE__ */ jsx33(Icon, { className: "h-5 w-auto" })
},
iconProps.title
)) }),
/* @__PURE__ */ jsxs22("p", { className: "text-sm", children: [
"\xA9 ",
(/* @__PURE__ */ new Date()).getFullYear(),
" The Guild"
] })
] })
] }),
/* @__PURE__ */ jsx33(DecorationArch, { className: "pointer-events-none absolute bottom-0 left-0 hidden mix-blend-multiply lg:block dark:opacity-5 dark:mix-blend-normal" })
] });
}
function List2({
heading,
links,
className
}) {
if (!links?.length) return null;
return /* @__PURE__ */ jsxs22("div", { className: cn("flex flex-col gap-y-3 text-nowrap lg:gap-y-4", className), children: [
/* @__PURE__ */ jsx33("h3", { className: "font-medium dark:text-white", children: heading }),
/* @__PURE__ */ jsx33("ul", { className: "contents", children: links.map((link, i) => /* @__PURE__ */ jsx33("li", { children: /* @__PURE__ */ jsx33(
Anchor,
{
...link,
className: "hive-focus -m-2 block rounded p-2 hover:text-blue-700 hover:underline dark:hover:text-blue-100"
}
) }, i)) })
] });
}
var DEFAULT_ITEMS = {
developer: [
{
children: "Documentation",
title: "Read the docs",
href: "/docs"
},
{
children: "Hive Status",
title: "Check Hive status",
href: "https://status.graphql-hive.com/"
},
{
children: "Hive Updates",
title: "Read most recent developments from Hive",
href: "https://the-guild.dev/graphql/hive/product-updates"
},
{
children: "Blog",
title: "Read our blog",
href: "https://the-guild.dev/blog"
}
],
company: [
{
children: "About",
title: "Learn more about us",
href: "https://the-guild.dev/about-us"
},
{
children: "Brand Assets",
title: "Brand Assets",
href: "https://the-guild.dev/logos"
},
{
children: "Newsletter",
title: "Newsletter",
href: "https://the-guild.dev/newsletter"
}
],
resources: [],
links: [
{
children: "OSS Friends",
href: "https://the-guild.dev/graphql/hive/oss-friends"
},
{
children: "Pricing",
href: "https://the-guild.dev/graphql/hive#pricing"
}
]
};
HiveFooter.DEFAULT_ITEMS = DEFAULT_ITEMS;
var SOCIAL_ICONS = [
{
icon: GitHubIcon,
title: "Check our GitHub account",
href: "https://github.com/the-guild-org"
},
{
icon: SvgTwitter,
title: "Visit our Twitter",
href: "https://twitter.com/TheGuildDev"
},
{
icon: SvgLinkedin,
title: "Visit our LinkedIn",
href: "https://linkedin.com/company/the-guild-software"
},
{
icon: DiscordIcon,
title: "Reach us on Discord",
href: "https://discord.com/invite/xud7bH9"
},
{
icon: SvgYoutube,
title: "Watch Our Videos",
href: "https://youtube.com/watch?v=d_GBgH-L5c4&list=PLhCf3AUOg4PgQoY_A6xWDQ70yaNtPYtZd"
}
];
var productLinks = [...FOUR_MAIN_PRODUCTS, ...SIX_HIGHLIGHTED_PRODUCTS].map(
({ name, href, title }) => ({
children: name,
href,
title
})
);
function DecorationArch(props) {
return /* @__PURE__ */ jsxs22(
"svg",
{
xmlns: "http://www.w3.org/2000/svg",
width: 360,
height: 360,
viewBox: "0 0 360 360",
fill: "none",
...props,
children: [
/* @__PURE__ */ jsx33(
"path",
{
d: "M360 159.793a39.152 39.152 0 00-11.468-27.672l-56.99-56.99-6.673-6.673-56.99-56.99A39.153 39.153 0 00200.207 0H0v75.131h226.157c32.428 0 58.712 26.284 58.712 58.712V360H360V159.793z",
fill: "url(#paint0_linear_711_2541)"
}
),
/* @__PURE__ */ jsx33("defs", { children: /* @__PURE__ */ jsxs22(
"linearGradient",
{
id: "paint0_linear_711_2541",
x1: 180,
y1: -786805e-11,
x2: 180,
y2: 360,
gradientUnits: "userSpaceOnUse",
children: [
/* @__PURE__ */ jsx33("stop", { stopColor: "#C1D3D7" }),
/* @__PURE__ */ jsx33("stop", { offset: 1, stopColor: "#86B6C1" })
]
}
) })
]
}
);
}
function CSAStarLink({ className }) {
return /* @__PURE__ */ jsx33(
"a",
{
href: "https://cloudsecurityalliance.org/star/registry/software-products-guild-ltd-the-guild/services/graphql-hive",
target: "_blank",
rel: "noreferrer noopener",
className: cn(
"hive-focus w-fit rounded-full focus-visible:outline-none focus-visible:ring-offset-2 focus-visible:ring-offset-[rgb(var(--nextra-bg))]",
className
),
children: /* @__PURE__ */ jsx33(SvgCsaStarLevelOne, { className: "size-20 lg:size-[120px] dark:opacity-95" })
}
);
}
// src/components/product-card/hive-decoration.svg
import { jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
var SvgHiveDecoration = (props) => /* @__PURE__ */ jsxs23("svg", { viewBox: "0 0 160 172", fill: "none", ...props, children: [
/* @__PURE__ */ jsxs23("mask", { id: "path-1-outside-1_642_4223", maskUnits: "userSpaceOnUse", x: 0, y: -52, width: 265, height: 265, fill: "black", children: [
/* @__PURE__ */ jsx34("rect", { fill: "white", y: -52, width: 265, height: 265 }),
/* @__PURE__ */ jsx34("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M79.8868 -51H185.113L264 27.8868V133.113L185.113 212H79.8868L1 133.113V27.8868L79.8868 -51ZM146.836 195.215L247.204 94.8463C255.126 86.9252 255.126 74.085 247.204 66.1639L146.836 -34.2043C138.915 -42.1255 126.075 -42.1255 118.154 -34.2043L17.7957 66.1639C9.87451 74.085 9.87451 86.9252 17.7957 94.8463L118.154 195.215C126.075 203.136 138.915 203.136 146.836 195.215ZM104.963 80.4952L132.495 52.9631L160.027 80.4952L132.495 108.027L104.963 80.4952Z" })
] }),
/* @__PURE__ */ jsx34("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M79.8868 -51H185.113L264 27.8868V133.113L185.113 212H79.8868L1 133.113V27.8868L79.8868 -51ZM146.836 195.215L247.204 94.8463C255.126 86.9252 255.126 74.085 247.204 66.1639L146.836 -34.2043C138.915 -42.1255 126.075 -42.1255 118.154 -34.2043L17.7957 66.1639C9.87451 74.085 9.87451 86.9252 17.7957 94.8463L118.154 195.215C126.075 203.136 138.915 203.136 146.836 195.215ZM104.963 80.4952L132.495 52.9631L160.027 80.4952L132.495 108.027L104.963 80.4952Z", fill: "url(#paint0_linear_642_4223)" }),
/* @__PURE__ */ jsx34("path", { d: "M185.113 -51L185.467 -51.3536L185.32 -51.5H185.113V-51ZM79.8868 -51V-51.5H79.6797L79.5333 -51.3536L79.8868 -51ZM264 27.8868H264.5V27.6797L264.354 27.5333L264 27.8868ZM264 133.113L264.354 133.467L264.5 133.32V133.113H264ZM185.113 212V212.5H185.32L185.467 212.354L185.113 212ZM79.8868 212L79.5333 212.354L79.6797 212.5H79.8868V212ZM1 133.113H0.5V133.32L0.646447 133.467L1 133.113ZM1 27.8868L0.646447 27.5333L0.5 27.6797V27.8868H1ZM146.836 195.215L147.19 195.568L146.836 195.215ZM247.204 66.1639L246.851 66.5174L247.204 66.1639ZM146.836 -34.2043L147.19 -34.5579L146.836 -34.2043ZM118.154 -34.2043L117.8 -34.5579L117.8 -34.5579L118.154 -34.2043ZM17.7957 66.1639L18.1492 66.5174L18.1492 66.5174L17.7957 66.1639ZM17.7957 94.8463L18.1492 94.4928L18.1492 94.4928L17.7957 94.8463ZM118.154 195.215L117.8 195.568L117.8 195.568L118.154 195.215ZM132.495 52.9631L132.849 52.6096L132.495 52.256L132.142 52.6096L132.495 52.9631ZM104.963 80.4952L104.609 80.1417L104.256 80.4952L104.609 80.8488L104.963 80.4952ZM160.027 80.4952L160.381 80.8488L160.734 80.4952L160.381 80.1417L160.027 80.4952ZM132.495 108.027L132.142 108.381L132.495 108.734L132.849 108.381L132.495 108.027ZM185.113 -51.5H79.8868V-50.5H185.113V-51.5ZM264.354 27.5333L185.467 -51.3536L184.76 -50.6464L263.646 28.2404L264.354 27.5333ZM264.5 133.113V27.8868H263.5V133.113H264.5ZM185.467 212.354L264.354 133.467L263.646 132.76L184.76 211.646L185.467 212.354ZM79.8868 212.5H185.113V211.5H79.8868V212.5ZM0.646447 133.467L79.5333 212.354L80.2404 211.646L1.35355 132.76L0.646447 133.467ZM0.5 27.8868V133.113H1.5V27.8868H0.5ZM79.5333 -51.3536L0.646447 27.5333L1.35355 28.2404L80.2404 -50.6464L79.5333 -51.3536ZM246.851 94.4928L146.483 194.861L147.19 195.568L247.558 95.1998L246.851 94.4928ZM246.851 66.5174C254.577 74.2433 254.577 86.7669 246.851 94.4928L247.558 95.1998C255.674 87.0835 255.674 73.9267 247.558 65.8103L246.851 66.5174ZM146.483 -33.8508L246.851 66.5174L247.558 65.8103L147.19 -34.5579L146.483 -33.8508ZM118.507 -33.8508C126.233 -41.5767 138.757 -41.5767 146.483 -33.8508L147.19 -34.5579C139.073 -42.6743 125.917 -42.6743 117.8 -34.5579L118.507 -33.8508ZM18.1492 66.5174L118.507 -33.8508L117.8 -34.5579L17.4421 65.8103L18.1492 66.5174ZM18.1492 94.4928C10.4233 86.7669 10.4233 74.2433 18.1492 66.5174L17.4421 65.8103C9.3257 73.9267 9.3257 87.0835 17.4421 95.1998L18.1492 94.4928ZM118.507 194.861L18.1492 94.4928L17.4421 95.1998L117.8 195.568L118.507 194.861ZM146.483 194.861C138.757 202.587 126.233 202.587 118.507 194.861L117.8 195.568C125.917 203.684 139.073 203.684 147.19 195.568L146.483 194.861ZM132.142 52.6096L104.609 80.1417L105.317 80.8488L132.849 53.3167L132.142 52.6096ZM160.381 80.1417L132.849 52.6096L132.142 53.3167L159.674 80.8488L160.381 80.1417ZM132.849 108.381L160.381 80.8488L159.674 80.1417L132.142 107.674L132.849 108.381ZM104.609 80.8488L132.142 108.381L132.849 107.674L105.317 80.1417L104.609 80.8488Z", fill: "url(#paint1_linear_642_4223)", mask: "url(#path-1-outside-1_642_4223)" }),
/* @__PURE__ */ jsxs23("defs", { children: [
/* @__PURE__ */ jsxs23("linearGradient", { id: "paint0_linear_642_4223", x1: 0.999999, y1: 2, x2: 161, y2: 171, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx34("stop", { stopColor: "#3B736A" }),
/* @__PURE__ */ jsx34("stop", { offset: 1, stopColor: "#245850" })
] }),
/* @__PURE__ */ jsxs23("linearGradient", { id: "paint1_linear_642_4223", x1: 1, y1: 5, x2: 161, y2: 173.5, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx34("stop", { stopColor: "white", stopOpacity: 0.4 }),
/* @__PURE__ */ jsx34("stop", { offset: 1, stopColor: "white", stopOpacity: 0.1 })
] })
] })
] });
// src/components/product-card/hive-gateway-decoration.svg
import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
var SvgHiveGatewayDecoration = (props) => /* @__PURE__ */ jsxs24("svg", { viewBox: "0 0 177 172", fill: "none", ...props, children: [
/* @__PURE__ */ jsx35("path", { d: "m150 -11.850765-46.65480.000006V67.1886c0 13.4292-10.8768 24.306-24.3054 24.306H0l4.32e-6 46.6548H50.90466c6.36576 0 12.47094-2.529 16.97154-7.0308l75.0954-75.1056C147.4716 51.5124 150 45.408 150 39.043620000000004V-11.850765Zm12 0 46.6548.000006V67.1886c0 13.4292 10.8768 24.306 24.3054 24.306H312v46.6548h-50.9046c-6.366 0-12.471-2.529-16.9716-7.0308L168.0284 55.8562C164.5284 51.5124 162 45.408 162 39.043620000000004V-11.850765ZM150 300.1494h-46.6548V221.1096c0-13.4286-10.8768-24.3054-24.3054-24.3054H0l4.32e-6-46.6548H50.90466c6.36576 0 12.47094 2.529 16.97154 7.0302l75.0954 75.1056c4.5 4.5012 7.0284 10.605 7.0284 16.9698v50.8944Zm12 0h46.6548V221.1096c0-13.4286 10.8768-24.3054 24.3054-24.3054H312v-46.6548h-50.9046c-6.366 0-12.471 2.529-16.9716 7.0302L168.0284 232.2852c-4.5 4.5012-7.0284 10.605-7.0284 16.9698v50.8944Zm17.0214-179.022H132.978v46.0434h46.0434v-46.0434Z", fill: "url(#paint0_linear_642_4281)", stroke: "url(#paint1_linear_642_4281)" }),
/* @__PURE__ */ jsxs24("defs", { children: [
/* @__PURE__ */ jsxs24("linearGradient", { id: "paint0_linear_642_4281", x1: 55.5, y1: 63, x2: 172.004, y2: 170.996, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx35("stop", { stopColor: "white", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx35("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] }),
/* @__PURE__ */ jsxs24("linearGradient", { id: "paint1_linear_642_4281", x1: 64, y1: 64, x2: 175, y2: 171.5, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx35("stop", { stopColor: "white", stopOpacity: 0.6 }),
/* @__PURE__ */ jsx35("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] })
] })
] });
// src/components/product-card/mesh-decoration.svg
import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
var SvgMeshDecoration = (props) => /* @__PURE__ */ jsxs25("svg", { viewBox: "0 0 156 172", fill: "none", ...props, children: [
/* @__PURE__ */ jsxs25("mask", { id: "path-1-outside-1_642_4203", maskUnits: "userSpaceOnUse", x: 0, y: -75, width: 248, height: 248, fill: "black", children: [
/* @__PURE__ */ jsx36("rect", { fill: "white", y: -75, width: 248, height: 248 }),
/* @__PURE__ */ jsx36("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M213.474 -37.2159L246.99 -3.69922H247V101.699L213.483 135.216L210.216 138.483L176.699 172H71.3008L37.7841 138.483L34.5167 135.216L1 101.699V-3.69922L34.5071 -37.2159L37.7745 -40.4833L71.2912 -74H176.69L210.206 -40.4833L213.474 -37.2159ZM56.9474 135.206H191.043C201.631 135.206 210.206 126.631 210.206 116.043V-18.0526C210.206 -28.6403 201.631 -37.2159 191.043 -37.2159H56.9474C46.3597 -37.2159 37.7841 -28.6403 37.7841 -18.0526V116.043C37.7841 126.631 46.3597 135.206 56.9474 135.206ZM70.9266 83.0905V14.8977C70.9266 4.30997 79.5022 -4.26562 90.09 -4.26562H157.9C168.487 -4.26562 177.063 4.30997 177.063 14.8977V83.0905C177.063 93.6783 168.487 102.254 157.9 102.254H90.09C79.5022 102.254 70.9266 93.6783 70.9266 83.0905ZM140.279 65.4698V32.5184H107.711V65.4698H140.279Z" })
] }),
/* @__PURE__ */ jsx36("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M213.474 -37.2159L246.99 -3.69922H247V101.699L213.483 135.216L210.216 138.483L176.699 172H71.3008L37.7841 138.483L34.5167 135.216L1 101.699V-3.69922L34.5071 -37.2159L37.7745 -40.4833L71.2912 -74H176.69L210.206 -40.4833L213.474 -37.2159ZM56.9474 135.206H191.043C201.631 135.206 210.206 126.631 210.206 116.043V-18.0526C210.206 -28.6403 201.631 -37.2159 191.043 -37.2159H56.9474C46.3597 -37.2159 37.7841 -28.6403 37.7841 -18.0526V116.043C37.7841 126.631 46.3597 135.206 56.9474 135.206ZM70.9266 83.0905V14.8977C70.9266 4.30997 79.5022 -4.26562 90.09 -4.26562H157.9C168.487 -4.26562 177.063 4.30997 177.063 14.8977V83.0905C177.063 93.6783 168.487 102.254 157.9 102.254H90.09C79.5022 102.254 70.9266 93.6783 70.9266 83.0905ZM140.279 65.4698V32.5184H107.711V65.4698H140.279Z", fill: "url(#paint0_linear_642_4203)" }),
/* @__PURE__ */ jsx36("path", { d: "M246.99 -3.69922L246.637 -3.34566L246.783 -3.19922H246.99V-3.69922ZM213.474 -37.2159L213.827 -37.5695L213.474 -37.2159ZM247 -3.69922H247.5V-4.19922H247V-3.69922ZM247 101.699L247.354 102.053L247.5 101.906V101.699H247ZM213.483 135.216L213.837 135.57L213.483 135.216ZM210.216 138.483L210.57 138.837L210.216 138.483ZM176.699 172V172.5H176.906L177.053 172.354L176.699 172ZM71.3008 172L70.9472 172.354L71.0937 172.5H71.3008V172ZM37.7841 138.483L38.1376 138.13V138.13L37.7841 138.483ZM34.5167 135.216L34.1632 135.57V135.57L34.5167 135.216ZM1 101.699H0.5V101.906L0.646447 102.053L1 101.699ZM1 -3.69922L0.646396 -4.05272L0.5 -3.90628V-3.69922H1ZM34.5071 -37.2159L34.1536 -37.5695L34.1535 -37.5694L34.5071 -37.2159ZM37.7745 -40.4833L38.128 -40.1297L37.7745 -40.4833ZM71.2912 -74V-74.5H71.0841L70.9376 -74.3536L71.2912 -74ZM176.69 -74L177.043 -74.3536L176.897 -74.5H176.69V-74ZM210.206 -40.4833L209.853 -40.1297L210.206 -40.4833ZM140.279 32.5184H140.779V32.0184H140.279V32.5184ZM140.279 65.4698V65.9698H140.779V65.4698H140.279ZM107.711 32.5184V32.0184H107.211V32.5184H107.711ZM107.711 65.4698H107.211V65.9698H107.711V65.4698ZM247.344 -4.05277L213.827 -37.5695L213.12 -36.8624L246.637 -3.34566L247.344 -4.05277ZM247 -4.19922H246.99V-3.19922H247V-4.19922ZM247.5 101.699V-3.69922H246.5V101.699H247.5ZM213.837 135.57L247.354 102.053L246.646 101.346L213.13 134.862L213.837 135.57ZM210.57 138.837L213.837 135.57L213.13 134.862L209.862 138.13L210.57 138.837ZM177.053 172.354L210.57 138.837L209.862 138.13L176.346 171.646L177.053 172.354ZM71.3008 172.5H176.699V171.5H71.3008V172.5ZM37.4305 138.837L70.9472 172.354L71.6543 171.646L38.1376 138.13L37.4305 138.837ZM34.1632 135.57L37.4305 138.837L38.1376 138.13L34.8703 134.862L34.1632 135.57ZM0.646447 102.053L34.1632 135.57L34.8703 134.862L1.35355 101.346L0.646447 102.053ZM0.5 -3.69922V101.699H1.5V-3.69922H0.5ZM34.1535 -37.5694L0.646396 -4.05272L1.3536 -3.34572L34.8607 -36.8624L34.1535 -37.5694ZM37.4209 -40.8368L34.1536 -37.5695L34.8607 -36.8624L38.128 -40.1297L37.4209 -40.8368ZM70.9376 -74.3536L37.4209 -40.8368L38.128 -40.1297L71.6447 -73.6464L70.9376 -74.3536ZM176.69 -74.5H71.2912V-73.5H176.69V-74.5ZM210.56 -40.8368L177.043 -74.3536L176.336 -73.6464L209.853 -40.1297L210.56 -40.8368ZM213.827 -37.5695L210.56 -40.8368L209.853 -40.1297L213.12 -36.8624L213.827 -37.5695ZM191.043 134.706H56.9474V135.706H191.043V134.706ZM209.706 116.043C209.706 126.355 201.355 134.706 191.043 134.706V135.706C201.907 135.706 210.706 126.907 210.706 116.043H209.706ZM209.706 -18.0526V116.043H210.706V-18.0526H209.706ZM191.043 -36.7159C201.355 -36.7159 209.706 -28.3642 209.706 -18.0526H210.706C210.706 -28.9165 201.907 -37.7159 191.043 -37.7159V-36.7159ZM56.9474 -36.7159H191.043V-37.7159H56.9474V-36.7159ZM38.2841 -18.0526C38.2841 -28.3642 46.6358 -36.7159 56.9474 -36.7159V-37.7159C46.0835 -37.7159 37.2841 -28.9165 37.2841 -18.0526H38.2841ZM38.2841 116.043V-18.0526H37.2841V116.043H38.2841ZM56.9474 134.706C46.6358 134.706 38.2841 126.355 38.2841 116.043H37.2841C37.2841 126.907 46.0835 135.706 56.9474 135.706V134.706ZM70.4266 14.8977V83.0905H71.4266V14.8977H70.4266ZM90.09 -4.76562C79.2261 -4.76562 70.4266 4.03383 70.4266 14.8977H71.4266C71.4266 4.58612 79.7784 -3.76562 90.09 -3.76562V-4.76562ZM157.9 -4.76562H90.09V-3.76562H157.9V-4.76562ZM177.563 14.8977C177.563 4.03383 168.763 -4.76562 157.9 -4.76562V-3.76562C168.211 -3.76562 176.563 4.58612 176.563 14.8977H177.563ZM177.563 83.0905V14.8977H176.563V83.0905H177.563ZM157.9 102.754C168.763 102.754 177.563 93.9544 177.563 83.0905H176.563C176.563 93.4021 168.211 101.754 157.9 101.754V102.754ZM90.09 102.754H157.9V101.754H90.09V102.754ZM70.4266 83.0905C70.4266 93.9544 79.2261 102.754 90.09 102.754V101.754C79.7784 101.754 71.4266 93.4021 71.4266 83.0905H70.4266ZM139.779 32.5184V65.4698H140.779V32.5184H139.779ZM107.711 33.0184H140.279V32.0184H107.711V33.0184ZM108.211 65.4698V32.5184H107.211V65.4698H108.211ZM140.279 64.9698H107.711V65.9698H140.279V64.9698Z", fill: "url(#paint1_linear_642_4203)", mask: "url(#path-1-outside-1_642_4203)" }),
/* @__PURE__ */ jsxs25("defs", { children: [
/* @__PURE__ */ jsxs25("linearGradient", { id: "paint0_linear_642_4203", x1: 1, y1: -1, x2: 143.007, y2: 171.994, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx36("stop", { stopColor: "white", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx36("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] }),
/* @__PURE__ */ jsxs25("linearGradient", { id: "paint1_linear_642_4203", x1: 0.999998, y1: 0.500001, x2: 140.501, y2: 171.999, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx36("stop", { stopColor: "white", stopOpacity: 0.6 }),
/* @__PURE__ */ jsx36("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] })
] })
] });
// src/components/product-card/yoga-decoration.svg
import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
var SvgYogaDecoration = (props) => /* @__PURE__ */ jsxs26("svg", { viewBox: "0 -11 211 163", fill: "none", ...props, children: [
/* @__PURE__ */ jsxs26("mask", { id: "path-1-outside-1_642_4128", maskUnits: "userSpaceOnUse", x: 0, y: 0, width: 334, height: 340, fill: "black", children: [
/* @__PURE__ */ jsx37("rect", { fill: "white", width: 334, height: 340 }),
/* @__PURE__ */ jsx37("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M222.174 67.0744H169.727L201.223 35.5783L166.657 1L132.079 35.5783L163.575 67.0744H111.128C104.378 67.0744 97.8956 69.7617 93.1196 74.5377L1 166.657L35.5783 201.236L148.649 88.1653C158.595 78.2184 174.719 78.2184 184.666 88.1653L297.736 201.236L332.315 166.657L240.182 74.525C235.406 69.749 228.924 67.0617 222.174 67.0617V67.0744ZM166.656 269.854L132.083 304.427L166.656 339L201.229 304.427L166.656 269.854ZM111.141 201.239H166.657H166.683H222.199C228.949 201.239 235.432 203.927 240.208 208.703L266.788 235.283L232.21 269.861L184.679 222.33C174.732 212.383 158.608 212.383 148.661 222.33L101.131 269.861L66.5522 235.283L93.1323 208.703C97.9083 203.927 104.391 201.239 111.141 201.239Z" })
] }),
/* @__PURE__ */ jsx37("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M222.174 67.0744H169.727L201.223 35.5783L166.657 1L132.079 35.5783L163.575 67.0744H111.128C104.378 67.0744 97.8956 69.7617 93.1196 74.5377L1 166.657L35.5783 201.236L148.649 88.1653C158.595 78.2184 174.719 78.2184 184.666 88.1653L297.736 201.236L332.315 166.657L240.182 74.525C235.406 69.749 228.924 67.0617 222.174 67.0617V67.0744ZM166.656 269.854L132.083 304.427L166.656 339L201.229 304.427L166.656 269.854ZM111.141 201.239H166.657H166.683H222.199C228.949 201.239 235.432 203.927 240.208 208.703L266.788 235.283L232.21 269.861L184.679 222.33C174.732 212.383 158.608 212.383 148.661 222.33L101.131 269.861L66.5522 235.283L93.1323 208.703C97.9083 203.927 104.391 201.239 111.141 201.239Z", fill: "url(#paint0_linear_642_4128)" }),
/* @__PURE__ */ jsx37("path", { d: "M169.727 67.0744L169.373 66.7209L168.52 67.5744H169.727V67.0744ZM222.174 67.0744V67.5744H222.674V67.0744H222.174ZM201.223 35.5783L201.576 35.9318L201.93 35.5783L201.576 35.2248L201.223 35.5783ZM166.657 1L167.011 0.646512L166.657 0.292828L166.304 0.646447L166.657 1ZM132.079 35.5783L131.725 35.2247L131.372 35.5783L131.725 35.9318L132.079 35.5783ZM163.575 67.0744V67.5744H164.782L163.929 66.7209L163.575 67.0744ZM1 166.657L0.646447 166.304L0.292893 166.657L0.646447 167.011L1 166.657ZM35.5783 201.236L35.2247 201.589L35.5783 201.943L35.9318 201.589L35.5783 201.236ZM148.649 88.1653L149.002 88.5188L148.649 88.1653ZM184.666 88.1653L184.312 88.5188L184.666 88.1653ZM297.736 201.236L297.383 201.589L297.736 201.943L298.09 201.589L297.736 201.236ZM332.315 166.657L332.668 167.011L333.022 166.657L332.668 166.304L332.315 166.657ZM240.182 74.525L239.829 74.8785L240.182 74.525ZM222.174 67.0617V66.5617H221.674V67.0617H222.174ZM132.083 304.427L131.73 304.073L131.376 304.427L131.73 304.78L132.083 304.427ZM166.656 269.854L167.01 269.5L166.656 269.147L166.303 269.5L166.656 269.854ZM166.656 339L166.303 339.353L166.656 339.707L167.01 339.353L166.656 339ZM201.229 304.427L201.583 304.78L201.936 304.427L201.583 304.073L201.229 304.427ZM240.208 208.703L240.561 208.349V208.349L240.208 208.703ZM266.788 235.283L267.141 235.636L267.495 235.283L267.141 234.929L266.788 235.283ZM232.21 269.861L231.856 270.214L232.21 270.568L232.563 270.214L232.21 269.861ZM148.661 222.33L149.015 222.684L148.661 222.33ZM101.131 269.861L100.777 270.214L101.131 270.568L101.484 270.214L101.131 269.861ZM66.5522 235.283L66.1987 234.929L65.8451 235.283L66.1987 235.636L66.5522 235.283ZM169.727 67.5744H222.174V66.5744H169.727V67.5744ZM200.869 35.2247L169.373 66.7209L170.08 67.428L201.576 35.9318L200.869 35.2247ZM166.304 1.35349L200.869 35.9318L201.576 35.2248L167.011 0.646512L166.304 1.35349ZM132.433 35.9318L167.011 1.35355L166.304 0.646447L131.725 35.2247L132.433 35.9318ZM163.929 66.7209L132.433 35.2247L131.725 35.9318L163.222 67.428L163.929 66.7209ZM111.128 67.5744H163.575V66.5744H111.128V67.5744ZM93.4731 74.8913C98.1555 70.2089 104.511 67.5744 111.128 67.5744V66.5744C104.245 66.5744 97.6357 69.3145 92.766 74.1842L93.4731 74.8913ZM1.35355 167.011L93.4731 74.8913L92.766 74.1842L0.646447 166.304L1.35355 167.011ZM35.9318 200.882L1.35355 166.304L0.646447 167.011L35.2247 201.589L35.9318 200.882ZM148.295 87.8117L35.2247 200.882L35.9318 201.589L149.002 88.5188L148.295 87.8117ZM185.02 87.8117C174.877 77.6696 158.437 77.6696 148.295 87.8117L149.002 88.5188C158.754 78.7672 174.561 78.7672 184.312 88.5188L185.02 87.8117ZM298.09 200.882L185.02 87.8117L184.312 88.5188L297.383 201.589L298.09 200.882ZM331.961 166.304L297.383 200.882L298.09 201.589L332.668 167.011L331.961 166.304ZM239.829 74.8785L331.961 167.011L332.668 166.304L240.536 74.1714L239.829 74.8785ZM222.174 67.5617C228.791 67.5617 235.146 70.1962 239.829 74.8785L240.536 74.1714C235.666 69.3018 229.056 66.5617 222.174 66.5617V67.5617ZM222.674 67.0744V67.0617H221.674V67.0744H222.674ZM132.437 304.78L167.01 270.207L166.303 269.5L131.73 304.073L132.437 304.78ZM167.01 338.646L132.437 304.073L131.73 304.78L166.303 339.353L167.01 338.646ZM200.876 304.073L166.303 338.646L167.01 339.353L201.583 304.78L200.876 304.073ZM166.303 270.207L200.876 304.78L201.583 304.073L167.01 269.5L166.303 270.207ZM166.657 200.739H111.141V201.739H166.657V200.739ZM166.683 200.739H166.657V201.739H166.683V200.739ZM222.199 200.739H166.683V201.739H222.199V200.739ZM240.561 208.349C235.692 203.479 229.082 200.739 222.199 200.739V201.739C228.816 201.739 235.172 204.374 239.854 209.056L240.561 208.349ZM267.141 234.929L240.561 208.349L239.854 209.056L266.434 235.636L267.141 234.929ZM232.563 270.214L267.141 235.636L266.434 234.929L231.856 269.507L232.563 270.214ZM184.325 222.684L231.856 270.214L232.563 269.507L185.032 221.977L184.325 222.684ZM149.015 222.684C158.766 212.932 174.574 212.932 184.325 222.684L185.032 221.977C174.89 211.834 158.45 211.834 148.308 221.977L149.015 222.684ZM101.484 270.214L149.015 222.684L148.308 221.977L100.777 269.507L101.484 270.214ZM66.1987 235.636L100.777 270.214L101.484 269.507L66.9058 234.929L66.1987 235.636ZM92.7787 208.349L66.1987 234.929L66.9058 235.636L93.4858 209.056L92.7787 208.349ZM111.141 200.739C104.258 200.739 97.6484 203.479 92.7787 208.349L93.4858 209.056C98.1682 204.374 104.524 201.739 111.141 201.739V200.739Z", fill: "url(#paint1_linear_642_4128)", mask: "url(#path-1-outside-1_642_4128)" }),
/* @__PURE__ */ jsxs26("defs", { children: [
/* @__PURE__ */ jsxs26("linearGradient", { id: "paint0_linear_642_4128", x1: 82.5, y1: 43, x2: 183.837, y2: 159.975, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx37("stop", { stopColor: "white", stopOpacity: 0.1 }),
/* @__PURE__ */ jsx37("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] }),
/* @__PURE__ */ jsxs26("linearGradient", { id: "paint1_linear_642_4128", x1: 100.5, y1: 53.5, x2: 210.094, y2: 158.311, gradientUnits: "userSpaceOnUse", children: [
/* @__PURE__ */ jsx37("stop", { stopColor: "white", stopOpacity: 0.6 }),
/* @__PURE__ */ jsx37("stop", { offset: 1, stopColor: "white", stopOpacity: 0.4 })
] })
] })
] });
// src/components/product-card/index.tsx
import { jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
var cardDecorations = {
[PRODUCTS.HIVE.name]: SvgHiveDecoration,
[PRODUCTS.YOGA.name]: SvgYogaDecoration,
[PRODUCTS.MESH.name]: SvgMeshDecoration,
[PRODUCTS.HIVE_GATEWAY.name]: SvgHiveGatewayDecoration
};
function MainProductCard({ as: Root2, product, className, ...rest }) {
const Decoration = cardDecorations[product.name];
const Icon = product.logo;
const isHive = product.name === PRODUCTS.HIVE.name;
return /* @__PURE__ */ jsxs27(
Root2,
{
className: cn(
"hive-focus-within group relative flex-1 shrink-0 basis-[283.5px] overflow-hidden rounded-2xl bg-blue-400 text-green-1000 max-md:w-[283.5px]",
isHive && "bg-green-1000 text-white",
className
),
...rest,
children: [
/* @__PURE__ */ jsxs27(
"a",
{
className: "relative z-10 flex h-full flex-1 flex-col justify-between p-8 outline-none focus-visible:outline-none",
href: product.href,
children: [
/* @__PURE__ */ jsx38("p", { className: "font-medium", children: product.name }),
/* @__PURE__ */ jsx38(Icon, { className: "mt-8" }),
/* @__PURE__ */ jsx38(SvgArrowIcon, { className: "absolute bottom-8 right-8" })
]
}
),
/* @__PURE__ */ jsx38(
Decoration,
{
strokeWidth: "0.5px",
className: cn(
"pointer-events-none absolute bottom-0 right-0 h-full fill-blue-200 opacity-0 transition-opacity duration-500 group-focus-within:opacity-100 group-hover:opacity-100",
isHive && "fill-blue-700"
),
preserveAspectRatio: "xMidYMid meet"
}
),
/* @__PURE__ */ jsx38(SvgHighlightDecoration, { className: "pointer-events-none absolute left-0 top-[-15%] h-[150%] w-full opacity-0 transition-opacity duration-1000 group-focus-within:opacity-100 group-hover:opacity-100" })
]
}
);
}
function AncillaryProductCard({ product, as: Root2, className, ...rest }) {
const Logo = product.logo;
return /* @__PURE__ */ jsx38(
Root2,
{
className: cn(
"hive-focus-within shrink-0 basis-[283.5px] rounded-2xl bg-beige-200 text-green-1000 transition-colors duration-500 hover:bg-beige-400 max-sm:min-w-[283.5px]",
className
),
...rest,
children: /* @__PURE__ */ jsxs27(
"a",
{
href: product.href,
className: "relative flex h-full flex-col justify-between rounded-[inherit] p-8 focus:outline-none focus-visible:outline-none",
children: [
/* @__PURE__ */ jsxs27("div", { children: [
/* @__PURE__ */ jsx38("p", { className: "font-medium", children: product.name }),
/* @__PURE__ */ jsx38("p", { className: "mt-2 text-sm text-green-800", children: product.title })
] }),
/* @__PURE__ */ jsx38(
"div",
{
role: "presentation",
className: "mt-8 flex size-8 items-center justify-center rounded bg-green-1000 p-[5px] text-sm/5 font-medium text-white",
children: /* @__PURE__ */ jsx38(Logo, {})
}
),
/* @__PURE__ */ jsx38(SvgArrowIcon, { className: "absolute bottom-8 right-8" })
]
}
)
}
);
}
function ProductCard(props) {
const isMainProduct = FOUR_MAIN_PRODUCTS.some((p) => p.name === props.product.name);
return isMainProduct ? /* @__PURE__ */ jsx38(MainProductCard, { ...props }) : /* @__PURE__ */ jsx38(AncillaryProductCard, { ...props });
}
// src/components/tools-and-libraries-cards/index.tsx
import { jsx as jsx39, jsxs as jsxs28 } from "react/jsx-runtime";
function ToolsAndLibrariesCards({
className,
isHive,
...rest
}) {
return /* @__PURE__ */ jsxs28(
"section",
{
className: cn(
"isolate flex flex-col gap-6 px-4 py-6 lg:gap-12 lg:py-24 xl:px-[120px]",
className
),
...rest,
children: [
/* @__PURE__ */ jsx39(Heading, { as: "h2", size: "md", className: "text-green-1000", children: "Discover the complete ecosystem of tools and libraries" }),
/* @__PURE__ */ jsx39("p", { className: "text-green-800", children: "Complete GraphQL Federation Stack" }),
/* @__PURE__ */ jsx39("ul", { className: "-mx-12 -my-2 flex grid-cols-2 gap-[22px] overflow-auto px-12 py-2 lg:grid xl:grid-cols-4", children: FOUR_MAIN_PRODUCTS.map((product) => /* @__PURE__ */ jsx39(MainProductCard, { as: "li", product }, product.name)) }),
/* @__PURE__ */ jsx39("p", { className: "text-green-800", children: "Our libraries to support all your GraphQL needs" }),
/* @__PURE__ */ jsx39("ul", { className: "-mx-12 -my-2 flex h-max grid-cols-6 gap-[22px] overflow-x-auto overflow-y-hidden px-12 py-2 max-sm:-mx-8 max-sm:px-8 sm:grid sm:grid-cols-2 lg:grid-cols-3", children: SIX_HIGHLIGHTED_PRODUCTS.map((product) => /* @__PURE__ */ jsx39(AncillaryProductCard, { as: "li", product }, product.name)) }),
/* @__PURE__ */ jsx39(
CallToAction,
{
href: isHive ? "/ecosystem" : "https://the-guild.dev/graphql/hive/ecosystem",
variant: "primary",
children: "Explore the Ecosystem"
}
)
]
}
);
}
// src/components/cookies-consent.tsx
import { useState as useState3 } from "react";
import { jsx as jsx40, jsxs as jsxs29 } from "react/jsx-runtime";
function CookiesConsent(props) {
const [consented, setConsented] = useState3(() => localStorage.getItem("cookies") === "true");
const onAccept = () => {
setConsented(true);
localStorage.setItem("cookies", "true");
};
if (consented) {
return null;
}
return /* @__PURE__ */ jsxs29(
"div",
{
...props,
className: cn(
"fixed bottom-0 z-50 flex flex-wrap items-center justify-center gap-x-4 gap-y-3 rounded-lg border border-beige-200 bg-beige-100 p-4 text-sm text-green-800 shadow-xl lg:flex-nowrap lg:justify-between lg:text-left dark:border-neutral-800 dark:bg-neutral-900 dark:text-neutral-200",
props.className
),
children: [
/* @__PURE__ */ jsxs29("div", { children: [
/* @__PURE__ */ jsx40("p", { className: "max-sm:inline", children: "This site uses cookies for analytics and improving your experience." }),
" ",
/* @__PURE__ */ jsx40("p", { className: "max-sm:inline", children: "By using our services, you consent to cookies." })
] }),
/* @__PURE__ */ jsxs29("div", { className: "ml-auto flex w-auto items-center justify-end gap-4", children: [
/* @__PURE__ */ jsx40(
"a",
{
href: "https://the-guild.dev/graphql/hive/privacy-policy.pdf",
className: "hive-focus whitespace-nowrap rounded p-1 hover:text-blue-700 hover:underline dark:hover:text-blue-100",
target: "_blank",
rel: "noopener noreferrer",
children: "Privacy Policy"
}
),
/* @__PURE__ */ jsx40(CallToAction, { variant: "tertiary", onClick: onAccept, className: "px-4 py-2", children: "Allow" })
] })
]
}
);
}
// src/components/stud.tsx
import { jsx as jsx41 } from "react/jsx-runtime";
function Stud(props) {
return /* @__PURE__ */ jsx41(
"div",
{
...props,
className: cn(
"w-fit rounded-lg bg-[linear-gradient(135deg,#68A8B6,#3B736A)] p-[9px] text-white",
props.className
)
}
);
}
// src/components/info-card.tsx
import { jsx as jsx42, jsxs as jsxs30 } from "react/jsx-runtime";
function InfoCard({
as: Root2 = "div",
icon,
heading,
className,
children,
...rest
}) {
return /* @__PURE__ */ jsxs30(Root2, { className: cn("bg-beige-100 p-6 md:p-12", className), ...rest, children: [
/* @__PURE__ */ jsx42(Stud, { children: icon }),
/* @__PURE__ */ jsx42("h3", { className: "mt-4 text-xl font-medium leading-[1.4] text-green-1000 md:mt-6", children: heading }),
/* @__PURE__ */ jsx42("p", { className: "mt-2 text-green-800 md:mt-4", children })
] });
}
// src/components/text-link.tsx
import React2 from "react";
import { jsx as jsx43 } from "react/jsx-runtime";
function TextLink({ className, children, ...rest }) {
const hasArrow = children && flattenFragments(children).some(
(child) => typeof child === "object" && child && "type" in child && child.type === SvgArrowIcon
);
return /* @__PURE__ */ jsx43(
Anchor,
{
className: cn(
"hive-focus -mx-1 -my-0.5 rounded px-1 py-0.5 hover:text-blue-700 dark:hover:text-blue-500",
hasArrow ? "inline-flex items-center gap-2" : "underline",
className
),
...rest,
children
}
);
}
function flattenFragments(children) {
return React2.Children.toArray(children).flatMap(
(child) => typeof child === "object" && "type" in child && child.type === React2.Fragment ? child.props.children : child
);
}
// src/components/explore-main-product-cards.tsx
import { jsx as jsx44, jsxs as jsxs31 } from "react/jsx-runtime";
function ExploreMainProductCards({
className,
isHive,
...rest
}) {
return /* @__PURE__ */ jsxs31(
"section",
{
className: cn(
"relative isolate flex flex-wrap gap-6 px-4 py-6 lg:gap-12 lg:py-24 xl:px-[120px]",
className
),
...rest,
children: [
/* @__PURE__ */ jsxs31("div", { className: "[@media(min-width:1490px)]:w-[293px]", children: [
/* @__PURE__ */ jsx44(Heading, { as: "h2", size: "xs", className: "text-pretty", children: "Explore Hive 360\xB0 GraphQL Ecosystem to reach full potential" }),
/* @__PURE__ */ jsxs31(
TextLink,
{
href: isHive ? "/ecosystem" : "https://the-guild.dev/graphql/hive/ecosystem",
className: "mt-4 lg:mt-6",
children: [
"Learn more",
/* @__PURE__ */ jsx44(SvgArrowIcon, {})
]
}
)
] }),
/* @__PURE__ */ jsx44("ul", { className: "-mx-12 -my-2 flex shrink-0 grow gap-[22px] overflow-auto px-12 py-2 [@media(max-width:1490px)]:w-full [@media(min-width:1490px)]:overflow-visible [&>:nth-child(n+4)]:[@media(min-width:1490px)]:hidden", children: FOUR_MAIN_PRODUCTS.map((product) => /* @__PURE__ */ jsx44(MainProductCard, { as: "li", product }, product.name)) })
]
}
);
}
// src/define-config.tsx
import { useRouter as useRouter3 } from "next/router";
import { Navbar, useConfig } from "nextra-theme-docs";
import { Fragment as Fragment6, jsx as jsx45, jsxs as jsxs32 } from "react/jsx-runtime";
function defineConfig({
websiteName,
description,
logo,
...config
}) {
if (!config.docsRepositoryBase) {
throw new Error('Missing required "docsRepositoryBase" property');
}
const url = new URL(config.docsRepositoryBase);
const [, org, repoName] = url.pathname.split("/");
const siteUrl = process.env.SITE_URL;
return {
editLink: {
content: "Edit this page on GitHub"
},
feedback: {
content: "Question? Give us feedback \u2192",
labels: "kind/docs"
},
footer: {
component: /* @__PURE__ */ jsx45(Footer, {})
},
sidebar: {
defaultMenuCollapseLevel: 1,
toggleButton: true
},
project: {
link: `${url.origin}/${org}/${repoName}`
// GitHub link in the navbar
},
head: function useHead() {
const { frontMatter, title: pageTitle } = useConfig();
const { asPath } = useRouter3();
const {
description: description2 = `${websiteName} Documentation`,
type = "website",
canonical = siteUrl && `${siteUrl}${// we disallow trailing slashes
// TODO: dont do this if `trailingSlashes: true`
asPath === "/" ? (
// homepage
""
) : asPath.startsWith("/?") ? (
// homepage with search params (remove just slash)
asPath.slice(1)
) : (
// other pages
asPath
)}`,
image = `https://og-image.the-guild.dev/?product=${websiteName}&title=${encodeURI(
pageTitle
)}`
} = frontMatter;
const title = `${pageTitle} (${websiteName})`;
return /* @__PURE__ */ jsxs32(Fragment6, { children: [
/* @__PURE__ */ jsx45("title", { children: title }),
/* @__PURE__ */ jsx45("meta", { property: "og:title", content: title }),
description2 && [
/* @__PURE__ */ jsx45("meta", { name: "description", content: description2 }, 0),
/* @__PURE__ */ jsx45("meta", { property: "og:description", content: description2 }, 1)
],
canonical && [
/* @__PURE__ */ jsx45("link", { rel: "canonical", href: canonical }, 3),
/* @__PURE__ */ jsx45("meta", { property: "og:url", content: canonical }, 4)
],
/* @__PURE__ */ jsx45("meta", { name: "twitter:card", content: "summary_large_image" }),
/* @__PURE__ */ jsx45("meta", { name: "twitter:site", content: "https://the-guild.dev" }),
/* @__PURE__ */ jsx45("meta", { name: "twitter:creator", content: "@TheGuildDev" }),
/* @__PURE__ */ jsx45("meta", { property: "og:type", content: type }),
/* @__PURE__ */ jsx45("meta", { property: "og:site_name", content: websiteName }),
/* @__PURE__ */ jsx45("meta", { property: "og:image", content: image }),
/* @__PURE__ */ jsx45("meta", { property: "og:image:alt", content: pageTitle }),
/* @__PURE__ */ jsx45("meta", { content: websiteName, name: "apple-mobile-web-app-title" }),
/* @__PURE__ */ jsx45("meta", { content: websiteName, name: "application-name" }),
/* @__PURE__ */ jsx45("meta", { name: "robots", content: "index,follow" })
] });
},
logoLink: false,
logo: getNavbarLogo(logo, websiteName, description),
navbar: {
extraContent: /* @__PURE__ */ jsx45(ThemeSwitcherButton, {}),
...logo && { component: (props) => /* @__PURE__ */ jsx45(Navbar, { items: addGuildCompanyMenu(props.items) }) }
},
...config,
components: {
...mdxComponents,
...config.components
}
};
}
// src/npm.ts
import semver from "semver";
var cache = {};
function withoutStartingSlash(v) {
if (v === "/") return v;
if (v.startsWith("/")) return v.slice(1, v.length);
return v;
}
function withoutTrailingSlash(v) {
if (v === "/") return v;
if (v.endsWith("/")) return v.slice(0, v.length - 1);
return v;
}
function withStartingSlash(v) {
if (v.startsWith("/")) return v;
return `/${v}`;
}
async function tryRemoteReadme(repo, path) {
const fetchPath = `https://raw.githubusercontent.com/${withoutStartingSlash(
withoutTrailingSlash(repo)
)}/HEAD${withStartingSlash(path)}`;
try {
const response = await fetch(fetchPath, {
method: "GET"
});
if (response.status === 404) {
console.error(`ERROR | ${fetchPath} Not Found`);
}
return await response.text();
} catch (err) {
console.error(
`[@theguild/components] ERROR | Error while trying to get README from GitHub ${fetchPath}`
);
console.error(err);
return null;
}
}
var NO_NPM_README_PLACEHOLDER = "ERROR: No README data found!";
var fetchPackageInfo = async (packageName, githubReadme) => {
const cacheKey = githubReadme ? `${githubReadme.repo}${githubReadme.path}` : packageName;
const cachedData = cache[cacheKey];
if (cachedData) {
return cachedData;
}
const encodedName = encodeURIComponent(packageName);
console.debug(`Loading NPM package info: ${packageName}`);
const [packageInfo, { downloads }] = await Promise.all([
fetch(`https://registry.npmjs.org/${encodedName}`).then((response) => response.json()),
fetch(`https://api.npmjs.org/downloads/point/last-week/${encodedName}`).then(
(response) => response.json()
)
]);
const { readme, time, description } = packageInfo;
const latestVersion = packageInfo["dist-tags"].latest;
const readmeContent = githubReadme && await tryRemoteReadme(githubReadme.repo, githubReadme.path);
cache[cacheKey] = {
readme: readmeContent || readme !== NO_NPM_README_PLACEHOLDER && readme || // for some reason top level "readme" can be empty string, so we get the latest version readme
Object.values(packageInfo.versions).reverse().find((curr) => {
const isReadmeExist = curr.readme && curr.readme !== NO_NPM_README_PLACEHOLDER;
if (isReadmeExist) {
return semver.lte(curr.version, latestVersion);
}
})?.readme || "",
createdAt: time.created,
updatedAt: time.modified,
description,
weeklyNPMDownloads: downloads
};
return cache[cacheKey];
};
export {
SvgAccountBox as AccountBox,
Anchor,
AncillaryProductCard,
SvgAngular as AngularLogo,
SvgApps as AppsIcon,
SvgArchDecoration as ArchDecoration,
SvgArchDecorationGradientDefs as ArchDecorationGradientDefs,
SvgArrowIcon as ArrowIcon,
SvgBard as BardIcon,
Bleed,
Button,
SvgCsaStarLevelOne as CSAStarLevelOneIcon,
CallToAction,
Callout,
Cards,
CardsColorful,
SvgCaretSlim as CaretSlimIcon,
SvgCheck as CheckIcon,
SvgClose as CloseIcon,
Code,
SvgCodeGenerator as CodeGeneratorLogo,
SvgCodegen as CodegenIcon,
Collapse,
SvgConductor as ConductorLogo,
SvgConfig as ConfigLogo,
CookiesConsent,
DecorationIsolation,
DiscordIcon,
EnvelopLettermark,
ExploreMainProductCards,
FeatureList,
SvgFets as FetsLogo,
FileTree,
Footer,
GetYourAPIGameRightSection,
default2 as Giscus,
GitHubIcon,
GraphQLConfCard,
GraphQLESlintLettermark,
SvgGraphqlFoundation as GraphQLFoundationLogo,
SvgGroup as GroupIcon,
SvgGuild as GuildLogo,
Heading,
SvgHeltin as HeltinLogo,
HeroGradient,
HeroIllustration,
HeroMarketplace,
HeroVideo,
SvgHighlightDecoration as HighlightDecoration,
SvgHiveCombinationMark as HiveCombinationMark,
HiveFooter,
SvgHiveGateway as HiveGatewayIcon,
SvgHive as HiveIcon,
HiveNavigation,
SvgHonour as HonourIcon,
Image,
InfoCard,
InfoList,
InformationCircleIcon,
InspectorLettermark,
SvgKitql as KitQLLogo,
SvgLargeHiveIconDecoration as LargeHiveIconDecoration,
LegacyPackageCmd,
SvgLinkedin as LinkedInIcon,
SvgList as ListIcon,
MainProductCard,
MarketplaceList,
MarketplaceSearch,
Mermaid,
SvgMesh2 as MeshIcon,
SvgMesh as MeshLogo,
SvgModules as ModulesLogo,
SvgMoon as MoonIcon,
SvgMore as MoreIcon,
NPMBadge,
Navbar2 as Navbar,
SvgNextra as NextraLogo,
NotFoundPage,
PRODUCTS,
SvgPaper as PaperIcon,
SvgPencil as PencilIcon,
ProductCard,
RemoteContent,
SvgRightCorner as RightCornerIcon,
SvgSse as SSELogo,
ScalarsLettermark,
SvgSearch as SearchIcon,
SvgShare as ShareIcon,
SvgShieldFlash as ShieldFlashIcon,
SofaLettermark,
SvgStellate as StellateIcon,
Steps,
SvgStitching as StitchingLogo,
Stud,
Table,
Tabs3 as Tabs,
SvgTarget as TargetIcon,
Td,
Th,
SvgTheGuild as TheGuild,
ThemeSwitcherButton,
ToolsAndLibrariesCards,
SvgTools as ToolsLogo,
Tr,
SvgTwitter as TwitterIcon,
SvgWs as WSLogo,
SvgWhatsapp as WhatsAppLogo,
SvgYoga2 as YogaIcon,
SvgYoga as YogaLogo,
SvgYoutube as YouTubeIcon,
cn,
createCatchAllMeta,
defineConfig,
fetchPackageInfo,
getNavbarLogo,
mdxComponents,
productsItems,
useConfig2 as useConfig,
useData,
useMDXComponents,
useMounted3 as useMounted,
useTheme2 as useTheme,
useThemeConfig2 as useThemeConfig
};