@depup/nextra 4.6.1-depup.0

package/dist/client/components/callout.d.ts

@@ -0,0 +1,136 @@
+import * as react_jsx_runtime_js from 'react/jsx-runtime.js';
+import { FC, HTMLAttributes, ReactNode } from 'react';
+
+declare const TypeToEmoji: {
+    default: react_jsx_runtime_js.JSX.Element;
+    error: react_jsx_runtime_js.JSX.Element;
+    info: react_jsx_runtime_js.JSX.Element;
+    warning: react_jsx_runtime_js.JSX.Element;
+    important: react_jsx_runtime_js.JSX.Element;
+};
+type CalloutType = keyof typeof TypeToEmoji;
+type CalloutProps = HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Defines the style of the callout and determines the default icon if `emoji` is not provided.
+     *
+     * If set to `null`, no border, background, or text styling will be applied.
+     * @default 'default'
+     */
+    type?: CalloutType | null;
+    /**
+     * Icon displayed in the callout. Can be a string emoji or a custom React element.
+     *
+     * Default values based on `type`:
+     * - `<GitHubTipIcon />` for `type: 'default'`
+     * - `<GitHubCautionIcon />` for `type: 'error'`
+     * - `<GitHubNoteIcon />` for `type: 'info'`
+     * - `<GitHubWarningIcon />` for `type: 'warning'`
+     * - `<GitHubImportantIcon />` for `type: 'important'`
+     * @default Determined by `type`
+     */
+    emoji?: ReactNode;
+};
+/**
+ * A built-in component to show important information to the reader.
+ *
+ * @example
+ * <Callout>
+ *   A **callout** is a short piece of text intended to attract attention.
+ * </Callout>
+ *
+ * <Callout type="info">
+ *   A **callout** is a short piece of text intended to attract attention.
+ * </Callout>
+ *
+ * <Callout type="warning">
+ *   A **callout** is a short piece of text intended to attract attention.
+ * </Callout>
+ *
+ * <Callout type="error">
+ *   A **callout** is a short piece of text intended to attract attention.
+ * </Callout>
+ *
+ * <Callout type="important">
+ *   A **callout** is a short piece of text intended to attract attention.
+ * </Callout>
+ *
+ * @usage
+ * ### Default
+ *
+ * <Callout>Helpful advice for doing things better or more easily.</Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout>Helpful advice for doing things better or more easily.</Callout>
+ * ```
+ *
+ * ### Info
+ *
+ * <Callout type="info">
+ *   Useful information that users should know, even when skimming content.
+ * </Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout type="info">
+ *   Useful information that users should know, even when skimming content.
+ * </Callout>
+ * ```
+ *
+ * ### Warning
+ *
+ * <Callout type="warning">
+ *   Urgent info that needs immediate user attention to avoid problems.
+ * </Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout type="warning">
+ *   Urgent info that needs immediate user attention to avoid problems.
+ * </Callout>
+ * ```
+ *
+ * ### Error
+ *
+ * <Callout type="error">
+ *   Advises about risks or negative outcomes of certain actions.
+ * </Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout type="error">
+ *   Advises about risks or negative outcomes of certain actions.
+ * </Callout>
+ * ```
+ *
+ * ### Important
+ *
+ * <Callout type="important">
+ *   Key information users need to know to achieve their goal.
+ * </Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout type="important">
+ *   Key information users need to know to achieve their goal.
+ * </Callout>
+ * ```
+ *
+ * ### Custom icon
+ *
+ * <Callout type="info" emoji="⭐">Nextra has 13k stars on GitHub!</Callout>
+ *
+ * ```mdx
+ * import { Callout } from 'nextra/components'
+ *
+ * <Callout type="info" emoji="⭐">Nextra has 13k stars on GitHub!</Callout>
+ * ```
+ */
+declare const Callout: FC<CalloutProps>;
+
+export { Callout };

package/dist/client/components/callout.js

@@ -0,0 +1,99 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
+import cn from "clsx";
+import { GitHubCautionIcon, GitHubImportantIcon, GitHubNoteIcon, GitHubTipIcon, GitHubWarningIcon } from "../icons/index.js";
+const TypeToEmoji = {
+  default: /* @__PURE__ */ jsx(GitHubTipIcon, { height: ".8em", className: "x:mt-[.3em]" }),
+  error: /* @__PURE__ */ jsx(GitHubCautionIcon, { height: ".8em", className: "x:mt-[.3em]" }),
+  info: /* @__PURE__ */ jsx(GitHubNoteIcon, { height: ".8em", className: "x:mt-[.3em]" }),
+  warning: /* @__PURE__ */ jsx(GitHubWarningIcon, { height: ".8em", className: "x:mt-[.3em]" }),
+  important: /* @__PURE__ */ jsx(GitHubImportantIcon, { height: ".8em", className: "x:mt-[.3em]" })
+};
+const classes = {
+  default: cn("x:bg-green-100 x:dark:bg-green-900/30", "x:text-green-700 x:dark:text-green-500", "x:border-green-700 x:dark:border-green-800"),
+  error: cn("x:bg-red-100 x:dark:bg-red-900/30", "x:text-red-700 x:dark:text-red-500", "x:border-red-700 x:dark:border-red-600"),
+  info: cn("x:bg-blue-100 x:dark:bg-blue-900/30", "x:text-blue-700 x:dark:text-blue-400", "x:border-blue-700 x:dark:border-blue-600"),
+  warning: cn("x:bg-yellow-50 x:dark:bg-yellow-700/30", "x:text-yellow-700 x:dark:text-yellow-500", "x:border-yellow-700"),
+  important: cn("x:bg-purple-100 x:dark:bg-purple-900/30", "x:text-purple-600 x:dark:text-purple-400", "x:border-purple-600")
+};
+const Callout = (t0) => {
+  const $ = _c(18);
+  let className;
+  let props;
+  let t1;
+  let t2;
+  if ($[0] !== t0) {
+    ({
+      className,
+      type: t1,
+      emoji: t2,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props;
+    $[3] = t1;
+    $[4] = t2;
+  } else {
+    className = $[1];
+    props = $[2];
+    t1 = $[3];
+    t2 = $[4];
+  }
+  const type = t1 === void 0 ? "default" : t1;
+  const emoji = t2 === void 0 ? type && TypeToEmoji[type] : t2;
+  const t3 = type && classes[type];
+  let t4;
+  if ($[5] !== t3) {
+    t4 = cn("nextra-callout x:overflow-x-auto x:not-first:mt-[1.25em] x:flex x:rounded-lg x:border x:py-[.5em] x:pe-[1em]", "x:contrast-more:border-current!", t3);
+    $[5] = t3;
+    $[6] = t4;
+  } else {
+    t4 = $[6];
+  }
+  let t5;
+  if ($[7] !== emoji) {
+    t5 = /* @__PURE__ */ jsx("div", { className: "x:select-none x:text-[1.25em] x:ps-[.6em] x:pe-[.4em]", style, "data-pagefind-ignore": "all", children: emoji });
+    $[7] = emoji;
+    $[8] = t5;
+  } else {
+    t5 = $[8];
+  }
+  let t6;
+  if ($[9] !== className) {
+    t6 = cn("x:w-full x:min-w-0", className);
+    $[9] = className;
+    $[10] = t6;
+  } else {
+    t6 = $[10];
+  }
+  let t7;
+  if ($[11] !== props || $[12] !== t6) {
+    t7 = /* @__PURE__ */ jsx("div", { className: t6, ...props });
+    $[11] = props;
+    $[12] = t6;
+    $[13] = t7;
+  } else {
+    t7 = $[13];
+  }
+  let t8;
+  if ($[14] !== t4 || $[15] !== t5 || $[16] !== t7) {
+    t8 = /* @__PURE__ */ jsxs("div", { className: t4, children: [
+      t5,
+      t7
+    ] });
+    $[14] = t4;
+    $[15] = t5;
+    $[16] = t7;
+    $[17] = t8;
+  } else {
+    t8 = $[17];
+  }
+  return t8;
+};
+const style = {
+  fontFamily: '"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"'
+};
+export {
+  Callout
+};

package/dist/client/components/cards.d.ts

@@ -0,0 +1,104 @@
+import { FC, HTMLAttributes, ReactElement, ReactNode } from 'react';
+
+/**
+ * A built-in component that allows you to display content in a visually appealing card format. It
+ * includes options for adding an icon, title, link and an image to related content.
+ *
+ * @example
+ * ### Grouped cards
+ *
+ * <Cards>
+ *   <Cards.Card
+ *     icon={<WarningIcon />}
+ *     title="Callout"
+ *     href="/docs/built-ins/callout"
+ *   />
+ *   <Cards.Card
+ *     icon={<CardsIcon />}
+ *     title="Tabs"
+ *     href="/docs/built-ins/tabs"
+ *   />
+ *   <Cards.Card
+ *     icon={<OneIcon />}
+ *     title="Steps"
+ *     href="/docs/built-ins/steps"
+ *   />
+ * </Cards>
+ *
+ * ### Single card
+ *
+ * <br />
+ * <Cards.Card
+ *   icon={<BoxIcon />}
+ *   title="About Nextra"
+ *   href="/about"
+ *   arrow
+ * />
+ *
+ * @usage
+ * ### Grouped cards
+ *
+ * Import the `<Cards>` component to your page, which includes the `<Card>` component.
+ *
+ * Then, optionally import the icons that you want to use. To create a set of cards, follow the
+ * example below where the `<Cards.Card>` component is used to create a card and the `<Cards>`
+ * component is used to group multiple cards together.
+ *
+ * ```mdx filename="MDX"
+ * import { Cards } from 'nextra/components'
+ * import { CardsIcon, OneIcon, WarningIcon } from '../path/with/your/icons'
+ *
+ * <Cards>
+ *   <Cards.Card
+ *     icon={<WarningIcon />}
+ *     title="Callout"
+ *     href="/docs/built-ins/callout"
+ *   />
+ *   <Cards.Card
+ *     icon={<CardsIcon />}
+ *     title="Tabs"
+ *     href="/docs/built-ins/tabs"
+ *   />
+ *   <Cards.Card
+ *     icon={<OneIcon />}
+ *     title="Steps"
+ *     href="/docs/built-ins/steps"
+ *   />
+ * </Cards>
+ * ```
+ *
+ * ### Single card
+ *
+ * A `<Card>` not wrapped in a `<Cards>` component will not be grouped with other cards. This can
+ * be useful if you want to display a single card in a different format than the other cards on the
+ * page.
+ *
+ * ```mdx filename="MDX"
+ * <Cards.Card
+ *   icon={<BoxIcon />}
+ *   title="About Nextra"
+ *   href="/about"
+ *   arrow
+ * />
+ * ```
+ */
+declare const Cards: FC<{
+    /**
+     * Number of columns.
+     * @default 3
+     */
+    num?: number;
+} & HTMLAttributes<HTMLDivElement>> & {
+    displayName: string;
+    Card: FC<{
+        title: string;
+        icon?: ReactElement;
+        arrow?: boolean;
+        href: string;
+        children?: ReactNode;
+        /** CSS class name. */
+        className?: string;
+    }>;
+};
+
+export { Cards };

package/dist/client/components/cards.js

@@ -0,0 +1,132 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
+import cn from "clsx";
+import NextLink from "next/link";
+const Card = (t0) => {
+  const $ = _c(29);
+  let arrow;
+  let children;
+  let className;
+  let href;
+  let icon;
+  let props;
+  let title;
+  if ($[0] !== t0) {
+    ({
+      children,
+      title,
+      icon,
+      arrow,
+      href,
+      className,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = arrow;
+    $[2] = children;
+    $[3] = className;
+    $[4] = href;
+    $[5] = icon;
+    $[6] = props;
+    $[7] = title;
+  } else {
+    arrow = $[1];
+    children = $[2];
+    className = $[3];
+    href = $[4];
+    icon = $[5];
+    props = $[6];
+    title = $[7];
+  }
+  const t1 = children ? "x:bg-gray-100 x:shadow x:dark:border-neutral-700 x:dark:bg-neutral-800 x:dark:text-gray-50 x:hover:shadow-lg x:dark:hover:border-neutral-500 x:dark:hover:bg-neutral-700" : "x:bg-transparent x:shadow-sm x:dark:border-neutral-800 x:hover:bg-slate-50 x:hover:shadow-md x:dark:hover:border-neutral-700 x:dark:hover:bg-neutral-900";
+  let t2;
+  if ($[8] !== className || $[9] !== t1) {
+    t2 = cn("x:group", "x:focus-visible:nextra-focus nextra-card x:flex x:flex-col x:justify-start x:overflow-hidden x:rounded-lg x:border x:border-gray-200", "x:text-current x:no-underline x:dark:shadow-none", "x:hover:shadow-gray-100 x:dark:hover:shadow-none x:shadow-gray-100", "x:active:shadow-sm x:active:shadow-gray-200", "x:transition-all x:duration-200 x:hover:border-gray-300", t1, className);
+    $[8] = className;
+    $[9] = t1;
+    $[10] = t2;
+  } else {
+    t2 = $[10];
+  }
+  let t3;
+  if ($[11] !== arrow) {
+    t3 = arrow && ['x:after:content-["\u2192"] x:after:transition-transform x:after:duration-75', "x:group-hover:after:translate-x-0.5", "x:group-focus:after:translate-x-0.5"];
+    $[11] = arrow;
+    $[12] = t3;
+  } else {
+    t3 = $[12];
+  }
+  const t4 = children ? "x:dark:text-gray-300 x:dark:hover:text-gray-100" : "x:dark:text-neutral-200 x:dark:hover:text-neutral-50";
+  let t5;
+  if ($[13] !== t3 || $[14] !== t4) {
+    t5 = cn("x:flex x:font-semibold x:items-center x:gap-2 x:p-4 x:text-gray-700 x:hover:text-gray-900", t3, t4);
+    $[13] = t3;
+    $[14] = t4;
+    $[15] = t5;
+  } else {
+    t5 = $[15];
+  }
+  const t6 = typeof title === "string" ? title : void 0;
+  let t7;
+  if ($[16] !== title) {
+    t7 = /* @__PURE__ */ jsx("span", { className: "_truncate", children: title });
+    $[16] = title;
+    $[17] = t7;
+  } else {
+    t7 = $[17];
+  }
+  let t8;
+  if ($[18] !== icon || $[19] !== t5 || $[20] !== t6 || $[21] !== t7) {
+    t8 = /* @__PURE__ */ jsxs("span", { className: t5, title: t6, children: [
+      icon,
+      t7
+    ] });
+    $[18] = icon;
+    $[19] = t5;
+    $[20] = t6;
+    $[21] = t7;
+    $[22] = t8;
+  } else {
+    t8 = $[22];
+  }
+  let t9;
+  if ($[23] !== children || $[24] !== href || $[25] !== props || $[26] !== t2 || $[27] !== t8) {
+    t9 = /* @__PURE__ */ jsxs(NextLink, { href, className: t2, ...props, children: [
+      children,
+      t8
+    ] });
+    $[23] = children;
+    $[24] = href;
+    $[25] = props;
+    $[26] = t2;
+    $[27] = t8;
+    $[28] = t9;
+  } else {
+    t9 = $[28];
+  }
+  return t9;
+};
+const _Cards = ({
+  children,
+  num = 3,
+  className,
+  style,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: cn(
+    "nextra-cards x:mt-4 x:gap-4 x:grid",
+    "not-prose",
+    // for nextra-theme-blog
+    className
+  ), ...props, style: {
+    ...style,
+    ["--rows"]: num
+  }, children });
+};
+const Cards = Object.assign(_Cards, {
+  displayName: "Cards",
+  Card
+});
+export {
+  Cards
+};

package/dist/client/components/collapse.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from 'react';
+
+declare const Collapse: FC<{
+    className?: string;
+    children: ReactNode;
+    isOpen: boolean;
+    horizontal?: boolean;
+    openDuration?: number;
+    closeDuration?: number;
+}>;
+
+export { Collapse };

package/dist/client/components/collapse.js

@@ -0,0 +1,143 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
+import cn from "clsx";
+import { Children, useEffect, useRef, useState } from "react";
+const Collapse = (t0) => {
+  const $ = _c(24);
+  const {
+    className,
+    children,
+    isOpen,
+    horizontal: t1,
+    openDuration: t2,
+    closeDuration: t3
+  } = t0;
+  const horizontal = t1 === void 0 ? false : t1;
+  const openDuration = t2 === void 0 ? 500 : t2;
+  const closeDuration = t3 === void 0 ? 300 : t3;
+  const containerRef = useRef(null);
+  const [initialOpen] = useState(isOpen);
+  const animationRef = useRef(0);
+  const initialRender = useRef(true);
+  let t4;
+  let t5;
+  if ($[0] !== horizontal || $[1] !== isOpen || $[2] !== openDuration) {
+    t4 = () => {
+      const animation = animationRef.current;
+      const container = containerRef.current;
+      if (animation) {
+        clearTimeout(animation);
+        animationRef.current = 0;
+      }
+      if (initialRender.current) {
+        return;
+      }
+      const child = container.children[0];
+      if (horizontal) {
+        child.style.width = `${child.clientWidth}px`;
+        container.style.width = `${child.clientWidth}px`;
+      } else {
+        container.style.height = `${child.clientHeight}px`;
+      }
+      if (isOpen) {
+        animationRef.current = window.setTimeout(() => {
+          container.style.removeProperty("height");
+        }, openDuration);
+      } else {
+        requestAnimationFrame(() => {
+          if (horizontal) {
+            container.style.width = "0";
+          } else {
+            container.style.height = "0";
+          }
+        });
+      }
+    };
+    t5 = [horizontal, isOpen, openDuration];
+    $[0] = horizontal;
+    $[1] = isOpen;
+    $[2] = openDuration;
+    $[3] = t4;
+    $[4] = t5;
+  } else {
+    t4 = $[3];
+    t5 = $[4];
+  }
+  useEffect(t4, t5);
+  let t6;
+  let t7;
+  if ($[5] !== horizontal || $[6] !== isOpen) {
+    t6 = () => {
+      if (isOpen || !horizontal) {
+        initialRender.current = false;
+      }
+    };
+    t7 = [horizontal, isOpen];
+    $[5] = horizontal;
+    $[6] = isOpen;
+    $[7] = t6;
+    $[8] = t7;
+  } else {
+    t6 = $[7];
+    t7 = $[8];
+  }
+  useEffect(t6, t7);
+  let t8;
+  if ($[9] !== children) {
+    t8 = Children.count(children) === 1 && children && typeof children === "object" && "type" in children ? children : /* @__PURE__ */ jsx("div", { children });
+    $[9] = children;
+    $[10] = t8;
+  } else {
+    t8 = $[10];
+  }
+  const newChildren = t8;
+  const t9 = isOpen ? "x:opacity-100" : "x:opacity-0 x:overflow-hidden";
+  let t10;
+  if ($[11] !== className || $[12] !== t9) {
+    t10 = cn("x:transform-gpu x:transition-all x:ease-in-out x:motion-reduce:transition-none", t9, className);
+    $[11] = className;
+    $[12] = t9;
+    $[13] = t10;
+  } else {
+    t10 = $[13];
+  }
+  let t11;
+  if ($[14] !== horizontal || $[15] !== initialOpen) {
+    t11 = initialOpen || horizontal ? void 0 : {
+      height: 0
+    };
+    $[14] = horizontal;
+    $[15] = initialOpen;
+    $[16] = t11;
+  } else {
+    t11 = $[16];
+  }
+  const t12 = (isOpen ? openDuration : closeDuration) + "ms";
+  let t13;
+  if ($[17] !== t11 || $[18] !== t12) {
+    t13 = {
+      ...t11,
+      transitionDuration: t12
+    };
+    $[17] = t11;
+    $[18] = t12;
+    $[19] = t13;
+  } else {
+    t13 = $[19];
+  }
+  let t14;
+  if ($[20] !== newChildren || $[21] !== t10 || $[22] !== t13) {
+    t14 = /* @__PURE__ */ jsx("div", { ref: containerRef, className: t10, style: t13, children: newChildren });
+    $[20] = newChildren;
+    $[21] = t10;
+    $[22] = t13;
+    $[23] = t14;
+  } else {
+    t14 = $[23];
+  }
+  return t14;
+};
+export {
+  Collapse
+};

package/dist/client/components/file-tree/file.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode, FC } from 'react';
+
+type FileProps = {
+    name: ReactNode;
+    active?: boolean;
+};
+declare const File: FC<FileProps>;
+
+export { File, type FileProps };

package/dist/client/components/file-tree/file.js

@@ -0,0 +1,43 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c as _c } from "react-compiler-runtime";
+import cn from "clsx";
+import { FileIcon } from "../../icons/index.js";
+const File = (t0) => {
+  const $ = _c(6);
+  const {
+    name,
+    active
+  } = t0;
+  const t1 = active && "x:text-primary-600";
+  let t2;
+  if ($[0] !== t1) {
+    t2 = cn("x:flex x:items-center x:gap-1 x:break-all", t1);
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  let t3;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /* @__PURE__ */ jsx(FileIcon, { height: "14", className: "x:shrink-0" });
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  let t4;
+  if ($[3] !== name || $[4] !== t2) {
+    t4 = /* @__PURE__ */ jsxs("li", { className: t2, children: [
+      t3,
+      name
+    ] });
+    $[3] = name;
+    $[4] = t2;
+    $[5] = t4;
+  } else {
+    t4 = $[5];
+  }
+  return t4;
+};
+export {
+  File
+};

package/dist/client/components/file-tree/folder.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from 'react';
+import { FileProps } from './file.js';
+
+type FolderProps = FileProps & {
+    open?: boolean;
+    /** @default false */
+    defaultOpen?: boolean;
+    children: ReactNode;
+};
+declare const Folder: FC<FolderProps>;
+
+export { Folder };