@theguild/components 7.2.0-alpha-20241101220642-0b6682d9cf4196529799e8ad0e38b83426590e93 → 8.0.0-alpha-20241103132221-f9d255adde945cffb98f9f7c914ac29896a15819

package/dist/components/hive-footer.js

@@ -0,0 +1,252 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../cn";
+import { siteOrigin } from "../constants";
+import { HiveCombinationMark } from "../logos";
+import { PRODUCTS } from "../products";
+import { Anchor } from "./anchor";
+import {
+  CSAStarLevelOneIcon,
+  DiscordIcon,
+  GitHubIcon,
+  LinkedInIcon,
+  TwitterIcon,
+  YouTubeIcon
+} from "./icons";
+const HiveFooter = ({ className, logo, resources = [] }) => {
+  return /* @__PURE__ */ jsxs("footer", { className: cn("relative flex justify-center px-4 py-6 xl:px-[120px]", className), children: [
+    /* @__PURE__ */ jsxs("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__ */ jsxs("div", { className: "max-lg:col-span-full", children: [
+        /* @__PURE__ */ jsx(
+          Anchor,
+          {
+            href: `${siteOrigin}/`,
+            ...logo,
+            className: "hive-focus -m-1.5 flex rounded p-1.5",
+            children: /* @__PURE__ */ jsx(HiveCombinationMark, { className: "h-8 w-auto text-green-1000 dark:text-white" })
+          }
+        ),
+        /* @__PURE__ */ jsx("p", { className: "mt-6 lg:mt-8", children: "Open-source GraphQL management platform" })
+      ] }),
+      /* @__PURE__ */ jsxs("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__ */ jsx(List, { heading: "Products", links: products }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[inherit]", children: [
+          /* @__PURE__ */ jsx(List, { heading: "Developer", links: DEVELOPER }),
+          ENTERPRISE.length > 0 && /* @__PURE__ */ jsx(List, { heading: "Enterprise", links: ENTERPRISE }),
+          resources.length > 0 && /* @__PURE__ */ jsx(List, { heading: "Resources", links: resources })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[inherit]", children: [
+          /* @__PURE__ */ jsx(List, { heading: "Company", links: COMPANY }),
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "https://the-guild.dev/graphql/hive#pricing",
+              className: "hive-focus -m-2 rounded p-2 font-medium hover:text-blue-700 hover:underline dark:hover:text-blue-100",
+              children: "Pricing"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "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) => {
+                window.$crisp?.push(["do", "chat:open"]);
+                event.preventDefault();
+              },
+              children: "Contact Us"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(CSAStarLink, { className: "sm:col-start-[-1] lg:col-start-[-2]" })
+      ] }),
+      /* @__PURE__ */ jsxs("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__ */ jsx("div", { className: "flex gap-6 lg:order-1", children: COMMUNITY.map(({ icon: Icon, ...iconProps }) => /* @__PURE__ */ jsx(
+          Anchor,
+          {
+            className: "hive-focus -m-1 rounded-md p-1 hover:text-blue-700 dark:hover:text-blue-100",
+            ...iconProps,
+            children: /* @__PURE__ */ jsx(Icon, { className: "h-5 w-auto" })
+          },
+          iconProps.title
+        )) }),
+        /* @__PURE__ */ jsxs("p", { className: "text-sm", children: [
+          "\xA9 ",
+          (/* @__PURE__ */ new Date()).getFullYear(),
+          " The Guild"
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(DecorationArch, { className: "pointer-events-none absolute bottom-0 left-0 hidden mix-blend-multiply lg:block dark:opacity-5 dark:mix-blend-normal" })
+  ] });
+};
+function List({
+  heading,
+  links,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-y-3 text-nowrap lg:gap-y-4", className), children: [
+    /* @__PURE__ */ jsx("h3", { className: "font-medium dark:text-white", children: heading }),
+    /* @__PURE__ */ jsx("ul", { className: "contents", children: links.map((link, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+      Anchor,
+      {
+        ...link,
+        className: "hive-focus -m-2 block rounded p-2 hover:text-blue-700 hover:underline dark:hover:text-blue-100"
+      }
+    ) }, i)) })
+  ] });
+}
+const ENTERPRISE = [
+  //   {
+  //     children: 'Consumer Stories',
+  //     href: '#TODO!',
+  //   },
+  //   {
+  //     children: 'Why GraphQL',
+  //     href: '#TODO!',
+  //   },
+  //   {
+  //     children: 'Professional Services',
+  //     href: '#TODO!',
+  //   },
+  //   {
+  //     children: 'Commitment to Security',
+  //     href: '#TODO!',
+  //   },
+];
+const 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 GraphQL Hive",
+    href: "https://the-guild.dev/graphql/hive/product-updates"
+  },
+  {
+    children: "Blog",
+    title: "Read our blog",
+    href: "https://the-guild.dev/blog"
+  }
+];
+const 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"
+  }
+];
+const COMMUNITY = [
+  {
+    icon: GitHubIcon,
+    title: "Check our GitHub account",
+    href: "https://github.com/the-guild-org"
+  },
+  {
+    icon: TwitterIcon,
+    title: "Visit our Twitter",
+    href: "https://twitter.com/TheGuildDev"
+  },
+  {
+    icon: LinkedInIcon,
+    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: YouTubeIcon,
+    title: "Watch Our Videos",
+    href: "https://youtube.com/watch?v=d_GBgH-L5c4&list=PLhCf3AUOg4PgQoY_A6xWDQ70yaNtPYtZd"
+  }
+];
+const products = [
+  PRODUCTS.HIVE,
+  PRODUCTS.MESH,
+  PRODUCTS.YOGA,
+  PRODUCTS.CODEGEN,
+  PRODUCTS.INSPECTOR,
+  PRODUCTS.SCALARS,
+  PRODUCTS.ENVELOP,
+  PRODUCTS.ESLINT,
+  PRODUCTS.SOFA
+  // TODO: All libraries, go to /explore page
+].map(({ name, href, title }) => ({
+  children: name,
+  href,
+  title
+}));
+function DecorationArch(props) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 360,
+      height: 360,
+      viewBox: "0 0 360 360",
+      fill: "none",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "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__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint0_linear_711_2541",
+            x1: 180,
+            y1: -786805e-11,
+            x2: 180,
+            y2: 360,
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { stopColor: "#C1D3D7" }),
+              /* @__PURE__ */ jsx("stop", { offset: 1, stopColor: "#86B6C1" })
+            ]
+          }
+        ) })
+      ]
+    }
+  );
+}
+function CSAStarLink({ className }) {
+  return /* @__PURE__ */ jsx(
+    "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__ */ jsx(CSAStarLevelOneIcon, { className: "size-20 lg:size-[120px] dark:opacity-95" })
+    }
+  );
+}
+export {
+  HiveFooter
+};

package/dist/components/hive-navigation/graphql-conf-card.d.mts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StaticImageData } from 'next/image';
+
+interface GraphQLConfCardProps {
+    image: StaticImageData;
+}
+declare function GraphQLConfCard({ image }: GraphQLConfCardProps): react_jsx_runtime.JSX.Element;
+
+export { GraphQLConfCard, type GraphQLConfCardProps };

package/dist/components/hive-navigation/graphql-conf-card.js

@@ -0,0 +1,26 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowIcon } from "../icons";
+import { Image } from "../image";
+import { NavigationMenuLink } from "./navigation-menu";
+function GraphQLConfCard({ image }) {
+  return /* @__PURE__ */ jsxs(
+    NavigationMenuLink,
+    {
+      href: "https://www.youtube.com/playlist?list=PL43V96KpNj7OMvmfL0WFKP6LpoboM8Hde",
+      className: "group w-[358px]",
+      children: [
+        /* @__PURE__ */ jsx(Image, { alt: "", ...image, width: 358, height: 200 }),
+        /* @__PURE__ */ jsx("strong", { className: "mt-6 block text-xl font-medium leading-7 text-green-1000 dark:text-neutral-100", children: "GraphQLConf 2024" }),
+        /* @__PURE__ */ jsx("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__ */ jsx("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__ */ jsxs("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__ */ jsx(ArrowIcon, {})
+        ] })
+      ]
+    }
+  );
+}
+export {
+  GraphQLConfCard
+};

package/dist/components/hive-navigation/index.d.mts

@@ -0,0 +1,55 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import react__default, { ReactNode } from 'react';
+export { GraphQLConfCard, GraphQLConfCardProps } from './graphql-conf-card.mjs';
+import 'next/image';
+
+interface HiveNavigationProps {
+    companyMenuChildren?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    /**
+     * We change links to relative based on what product we're in.
+     */
+    productName: string;
+}
+/**
+ *
+ * @example
+ * ```tsx
+ * <HiveNavigation
+ *   companyMenuChildren={<GraphQLConfCard image={graphQLConfLocalImage} />}
+ *   items={items}
+ * >
+ *   {extraContent}
+ * </HiveNavigation>
+ * ```
+ */
+declare function HiveNavigation({ companyMenuChildren, children, className, productName, }: HiveNavigationProps): react_jsx_runtime.JSX.Element;
+interface ProductsMenuProps extends MenuContentColumnsProps {
+    productName: string;
+}
+/**
+ * @internal
+ */
+declare const ProductsMenu: react__default.ForwardRefExoticComponent<ProductsMenuProps & react__default.RefAttributes<HTMLDivElement>>;
+interface MenuContentColumnsProps extends react__default.HTMLAttributes<HTMLDivElement> {
+}
+interface DeveloperMenuProps extends react__default.HTMLAttributes<HTMLDivElement> {
+    isHive: boolean;
+}
+/**
+ * @internal
+ */
+declare const DeveloperMenu: react__default.ForwardRefExoticComponent<DeveloperMenuProps & react__default.RefAttributes<HTMLDivElement>>;
+/**
+ * @internal
+ */
+declare function EnterpriseMenu(): react_jsx_runtime.JSX.Element;
+/**
+ * @internal
+ */
+declare function CompanyMenu({ children }: {
+    children: react__default.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+export { CompanyMenu, DeveloperMenu, EnterpriseMenu, HiveNavigation, type HiveNavigationProps, ProductsMenu };