@lobehub/ui 3.4.2 → 3.4.3

package/es/mdx/Callout/style.mjs

@@ -0,0 +1,39 @@
+import { createStyles } from "antd-style";
+
+//#region src/mdx/Callout/style.ts
+const useStyles = createStyles(({ css: css$1 }) => {
+	return {
+		container: css$1`
+      --lobe-markdown-margin-multiple: 1;
+
+      overflow: hidden;
+      gap: 0.75em;
+
+      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);
+      padding-block: calc(var(--lobe-markdown-margin-multiple) * 1em);
+      padding-inline: 1em;
+
+      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);
+    `,
+		content: css$1`
+      margin-block: calc(var(--lobe-markdown-margin-multiple) * -1em);
+
+      > div {
+        margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);
+      }
+
+      p {
+        color: inherit !important;
+      }
+    `,
+		underlineAnchor: css$1`
+      a {
+        text-decoration: underline;
+      }
+    `
+	};
+});
+
+//#endregion
+export { useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/mdx/Callout/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/mdx/Callout/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css }) => {\n  return {\n    container: css`\n      --lobe-markdown-margin-multiple: 1;\n\n      overflow: hidden;\n      gap: 0.75em;\n\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      padding-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      padding-inline: 1em;\n\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n    `,\n    content: css`\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * -1em);\n\n      > div {\n        margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      }\n\n      p {\n        color: inherit !important;\n      }\n    `,\n    underlineAnchor: css`\n      a {\n        text-decoration: underline;\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,iBAAU;AACjD,QAAO;EACL,WAAW,KAAG;;;;;;;;;;;;EAYd,SAAS,KAAG;;;;;;;;;;;EAWZ,iBAAiB,KAAG;;;;;EAKrB;EACD"}

package/es/mdx/Cards/Card.d.mts

@@ -0,0 +1,23 @@
+import { BlockProps } from "../../Block/type.mjs";
+import "../../Block/index.mjs";
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { TagProps } from "../../Tag/type.mjs";
+import "../../Tag/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/Cards/Card.d.ts
+interface CardProps extends Omit<BlockProps, 'children'> {
+  desc?: string;
+  href?: string;
+  icon?: IconProps['icon'];
+  iconProps?: Omit<IconProps, 'icon'>;
+  image?: string;
+  tag?: string;
+  tagColor?: TagProps['color'];
+  title: string;
+}
+declare const Card: FC<CardProps>;
+//#endregion
+export { Card, CardProps };
+//# sourceMappingURL=Card.d.mts.map

package/es/mdx/Cards/Card.mjs

@@ -0,0 +1,119 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Block_default from "../../Block/Block.mjs";
+import Icon_default from "../../Icon/Icon.mjs";
+import Img_default from "../../Img/index.mjs";
+import Tag_default from "../../Tag/Tag.mjs";
+import A_default from "../../A/index.mjs";
+import { createStyles } from "antd-style";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/mdx/Cards/Card.tsx
+const useStyles = createStyles(({ css: css$1, cx: cx$1, token }) => {
+	const icon = cx$1(css$1`
+    margin-block: 0.1em;
+    opacity: 0.5;
+    transition: opacity 0.2s ${token.motionEaseInOut};
+  `);
+	return {
+		card: css$1`
+      --lobe-markdown-header-multiple: 0.2;
+      --lobe-markdown-margin-multiple: 1;
+
+      overflow: hidden;
+      height: 100%;
+      color: ${token.colorText};
+
+      h3,
+      p {
+        margin-block: 0 !important;
+      }
+
+      p {
+        color: ${token.colorTextDescription};
+        transition: color 0.2s ${token.motionEaseInOut};
+      }
+
+      &:hover {
+        p {
+          color: ${token.colorTextSecondary};
+        }
+
+        .${icon} {
+          opacity: 1;
+        }
+      }
+    `,
+		content: css$1`
+      width: 100%;
+      padding: 1.4em;
+    `,
+		icon
+	};
+});
+const Card = ({ tag, tagColor = "blue", icon, title, desc, href, iconProps, className, image, variant = "filled", ...rest }) => {
+	const { cx: cx$1, styles } = useStyles();
+	return /* @__PURE__ */ jsx(A_default, {
+		href,
+		children: /* @__PURE__ */ jsxs(Block_default, {
+			align: "flex-start",
+			className: cx$1(styles.card, className),
+			clickable: true,
+			variant,
+			...rest,
+			children: [
+				image && /* @__PURE__ */ jsx(Img_default, {
+					alt: title,
+					height: 100,
+					src: image,
+					style: {
+						height: "auto",
+						width: "100%"
+					},
+					width: 250
+				}),
+				tag && /* @__PURE__ */ jsx(FlexBasic_default, {
+					align: "flex-start",
+					className: styles.content,
+					style: {
+						paddingBottom: "0.2em",
+						paddingTop: "1.8em"
+					},
+					children: /* @__PURE__ */ jsx(Tag_default, {
+						color: tagColor,
+						style: {
+							borderRadius: "1em",
+							fontSize: "0.8em",
+							fontWeight: 500,
+							paddingBlock: "0.1em",
+							paddingInline: "0.6em"
+						},
+						children: tag
+					})
+				}),
+				/* @__PURE__ */ jsxs(FlexBasic_default, {
+					align: desc ? "flex-start" : "center",
+					className: styles.content,
+					gap: "0.75em",
+					horizontal: true,
+					children: [!image && icon && /* @__PURE__ */ jsx(Icon_default, {
+						className: styles.icon,
+						icon,
+						size: { size: "1.5em" },
+						...iconProps
+					}), /* @__PURE__ */ jsxs(FlexBasic_default, {
+						gap: "0.2em",
+						children: [/* @__PURE__ */ jsx("h3", { children: title }), desc && /* @__PURE__ */ jsx("p", { children: desc })]
+					})]
+				})
+			]
+		})
+	});
+};
+Card.displayName = "MdxCard";
+var Card_default = Card;
+
+//#endregion
+export { Card_default as default };
+//# sourceMappingURL=Card.mjs.map

package/es/mdx/Cards/Card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.mjs","names":["cx","Card: FC<CardProps>","A","Block","Img","Flexbox","Tag","Icon"],"sources":["../../../src/mdx/Cards/Card.tsx"],"sourcesContent":["'use client';\n\nimport { createStyles } from 'antd-style';\nimport { FC } from 'react';\n\nimport A from '@/A';\nimport Block, { type BlockProps } from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Icon, { type IconProps } from '@/Icon';\nimport Img from '@/Img';\nimport Tag, { type TagProps } from '@/Tag';\n\nconst useStyles = createStyles(({ css, cx, token }) => {\n  const icon = cx(css`\n    margin-block: 0.1em;\n    opacity: 0.5;\n    transition: opacity 0.2s ${token.motionEaseInOut};\n  `);\n\n  return {\n    card: css`\n      --lobe-markdown-header-multiple: 0.2;\n      --lobe-markdown-margin-multiple: 1;\n\n      overflow: hidden;\n      height: 100%;\n      color: ${token.colorText};\n\n      h3,\n      p {\n        margin-block: 0 !important;\n      }\n\n      p {\n        color: ${token.colorTextDescription};\n        transition: color 0.2s ${token.motionEaseInOut};\n      }\n\n      &:hover {\n        p {\n          color: ${token.colorTextSecondary};\n        }\n\n        .${icon} {\n          opacity: 1;\n        }\n      }\n    `,\n    content: css`\n      width: 100%;\n      padding: 1.4em;\n    `,\n    icon,\n  };\n});\n\nexport interface CardProps extends Omit<BlockProps, 'children'> {\n  desc?: string;\n  href?: string;\n  icon?: IconProps['icon'];\n  iconProps?: Omit<IconProps, 'icon'>;\n  image?: string;\n  tag?: string;\n  tagColor?: TagProps['color'];\n  title: string;\n}\n\nconst Card: FC<CardProps> = ({\n  tag,\n  tagColor = 'blue',\n  icon,\n  title,\n  desc,\n  href,\n  iconProps,\n  className,\n  image,\n  variant = 'filled',\n  ...rest\n}) => {\n  const { cx, styles } = useStyles();\n\n  return (\n    <A href={href}>\n      <Block\n        align={'flex-start'}\n        className={cx(styles.card, className)}\n        clickable\n        variant={variant}\n        {...rest}\n      >\n        {image && (\n          <Img\n            alt={title}\n            height={100}\n            src={image}\n            style={{ height: 'auto', width: '100%' }}\n            width={250}\n          />\n        )}\n        {tag && (\n          <Flexbox\n            align={'flex-start'}\n            className={styles.content}\n            style={{ paddingBottom: '0.2em', paddingTop: '1.8em' }}\n          >\n            <Tag\n              color={tagColor}\n              style={{\n                borderRadius: '1em',\n                fontSize: '0.8em',\n                fontWeight: 500,\n                paddingBlock: '0.1em',\n                paddingInline: '0.6em',\n              }}\n            >\n              {tag}\n            </Tag>\n          </Flexbox>\n        )}\n        <Flexbox\n          align={desc ? 'flex-start' : 'center'}\n          className={styles.content}\n          gap={'0.75em'}\n          horizontal\n        >\n          {!image && icon && (\n            <Icon className={styles.icon} icon={icon} size={{ size: '1.5em' }} {...iconProps} />\n          )}\n          <Flexbox gap={'0.2em'}>\n            <h3>{title}</h3>\n            {desc && <p>{desc}</p>}\n          </Flexbox>\n        </Flexbox>\n      </Block>\n    </A>\n  );\n};\n\nCard.displayName = 'MdxCard';\n\nexport default Card;\n"],"mappings":";;;;;;;;;;;;AAYA,MAAM,YAAY,cAAc,EAAE,YAAK,UAAI,YAAY;CACrD,MAAM,OAAOA,KAAG,KAAG;;;+BAGU,MAAM,gBAAgB;IACjD;AAEF,QAAO;EACL,MAAM,KAAG;;;;;;eAME,MAAM,UAAU;;;;;;;;iBAQd,MAAM,qBAAqB;iCACX,MAAM,gBAAgB;;;;;mBAKpC,MAAM,mBAAmB;;;WAGjC,KAAK;;;;;EAKZ,SAAS,KAAG;;;;EAIZ;EACD;EACD;AAaF,MAAMC,QAAuB,EAC3B,KACA,WAAW,QACX,MACA,OACA,MACA,MACA,WACA,WACA,OACA,UAAU,UACV,GAAG,WACC;CACJ,MAAM,EAAE,UAAI,WAAW,WAAW;AAElC,QACE,oBAACC;EAAQ;YACP,qBAACC;GACC,OAAO;GACP,WAAWH,KAAG,OAAO,MAAM,UAAU;GACrC;GACS;GACT,GAAI;;IAEH,SACC,oBAACI;KACC,KAAK;KACL,QAAQ;KACR,KAAK;KACL,OAAO;MAAE,QAAQ;MAAQ,OAAO;MAAQ;KACxC,OAAO;MACP;IAEH,OACC,oBAACC;KACC,OAAO;KACP,WAAW,OAAO;KAClB,OAAO;MAAE,eAAe;MAAS,YAAY;MAAS;eAEtD,oBAACC;MACC,OAAO;MACP,OAAO;OACL,cAAc;OACd,UAAU;OACV,YAAY;OACZ,cAAc;OACd,eAAe;OAChB;gBAEA;OACG;MACE;IAEZ,qBAACD;KACC,OAAO,OAAO,eAAe;KAC7B,WAAW,OAAO;KAClB,KAAK;KACL;gBAEC,CAAC,SAAS,QACT,oBAACE;MAAK,WAAW,OAAO;MAAY;MAAM,MAAM,EAAE,MAAM,SAAS;MAAE,GAAI;OAAa,EAEtF,qBAACF;MAAQ,KAAK;iBACZ,oBAAC,kBAAI,QAAW,EACf,QAAQ,oBAAC,iBAAG,OAAS;OACd;MACF;;IACJ;GACN;;AAIR,KAAK,cAAc;AAEnB,mBAAe"}

package/es/mdx/Cards/index.d.mts

@@ -0,0 +1,10 @@
+import { GridProps } from "../../Grid/type.mjs";
+import "../../Grid/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/Cards/index.d.ts
+type CardsProps = GridProps;
+declare const Cards: FC<CardsProps>;
+//#endregion
+export { Cards, CardsProps };
+//# sourceMappingURL=index.d.mts.map

package/es/mdx/Cards/index.mjs

@@ -0,0 +1,23 @@
+'use client';
+
+import Grid_default from "../../Grid/Grid.mjs";
+import { useStyles } from "./style.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/mdx/Cards/index.tsx
+const Cards = ({ children, className, maxItemWidth = 250, rows = 3, ...rest }) => {
+	const { cx, styles } = useStyles();
+	return /* @__PURE__ */ jsx(Grid_default, {
+		className: cx(styles.container, className),
+		maxItemWidth,
+		rows,
+		...rest,
+		children
+	});
+};
+Cards.displayName = "MdxCards";
+var Cards_default = Cards;
+
+//#endregion
+export { Cards_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/mdx/Cards/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Cards: FC<CardsProps>","Grid"],"sources":["../../../src/mdx/Cards/index.tsx"],"sourcesContent":["'use client';\n\nimport type { FC } from 'react';\n\nimport Grid, { type GridProps } from '@/Grid';\n\nimport { useStyles } from './style';\n\nexport type CardsProps = GridProps;\n\nconst Cards: FC<CardsProps> = ({ children, className, maxItemWidth = 250, rows = 3, ...rest }) => {\n  const { cx, styles } = useStyles();\n  return (\n    <Grid\n      className={cx(styles.container, className)}\n      maxItemWidth={maxItemWidth}\n      rows={rows}\n      {...rest}\n    >\n      {children}\n    </Grid>\n  );\n};\n\nCards.displayName = 'MdxCards';\n\nexport default Cards;\n"],"mappings":";;;;;;;AAUA,MAAMA,SAAyB,EAAE,UAAU,WAAW,eAAe,KAAK,OAAO,GAAG,GAAG,WAAW;CAChG,MAAM,EAAE,IAAI,WAAW,WAAW;AAClC,QACE,oBAACC;EACC,WAAW,GAAG,OAAO,WAAW,UAAU;EAC5B;EACR;EACN,GAAI;EAEH;GACI;;AAIX,MAAM,cAAc;AAEpB,oBAAe"}

package/es/mdx/Cards/style.mjs

@@ -0,0 +1,16 @@
+import { createStyles } from "antd-style";
+
+//#region src/mdx/Cards/style.ts
+const useStyles = createStyles(({ css: css$1 }) => {
+	return { container: css$1`
+      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);
+
+      > div {
+        margin: 0 !important;
+      }
+    ` };
+});
+
+//#endregion
+export { useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/mdx/Cards/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/mdx/Cards/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css }) => {\n  return {\n    container: css`\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n\n      > div {\n        margin: 0 !important;\n      }\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,iBAAU;AACjD,QAAO,EACL,WAAW,KAAG;;;;;;OAOf;EACD"}

package/es/mdx/FileTree/File.d.mts

@@ -0,0 +1,15 @@
+import { FlexboxProps } from "../../Flex/type.mjs";
+import "../../Flex/index.mjs";
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/FileTree/File.d.ts
+interface FileProps extends Omit<FlexboxProps, 'children'> {
+  icon?: IconProps['icon'];
+  name: string;
+}
+declare const File: FC<FileProps>;
+//#endregion
+export { File, FileProps };
+//# sourceMappingURL=File.d.mts.map

package/es/mdx/FileTree/File.mjs

@@ -0,0 +1,23 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Icon_default from "../../Icon/Icon.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FileIcon } from "lucide-react";
+
+//#region src/mdx/FileTree/File.tsx
+const File = ({ name, icon = FileIcon, ...rest }) => {
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		align: "center",
+		gap: 4,
+		horizontal: true,
+		...rest,
+		children: [/* @__PURE__ */ jsx(Icon_default, { icon }), /* @__PURE__ */ jsx("span", { children: name })]
+	});
+};
+File.displayName = "MdxFile";
+var File_default = File;
+
+//#endregion
+export { File_default as default };
+//# sourceMappingURL=File.mjs.map

package/es/mdx/FileTree/File.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"File.mjs","names":["File: FC<FileProps>","Flexbox","Icon"],"sources":["../../../src/mdx/FileTree/File.tsx"],"sourcesContent":["'use client';\n\nimport { FileIcon } from 'lucide-react';\nimport { FC } from 'react';\n\nimport { Flexbox, FlexboxProps } from '@/Flex';\nimport Icon, { type IconProps } from '@/Icon';\n\nexport interface FileProps extends Omit<FlexboxProps, 'children'> {\n  icon?: IconProps['icon'];\n  name: string;\n}\n\nconst File: FC<FileProps> = ({ name, icon = FileIcon, ...rest }) => {\n  return (\n    <Flexbox align={'center'} gap={4} horizontal {...rest}>\n      <Icon icon={icon} />\n      <span>{name}</span>\n    </Flexbox>\n  );\n};\n\nFile.displayName = 'MdxFile';\n\nexport default File;\n"],"mappings":";;;;;;;;AAaA,MAAMA,QAAuB,EAAE,MAAM,OAAO,UAAU,GAAG,WAAW;AAClE,QACE,qBAACC;EAAQ,OAAO;EAAU,KAAK;EAAG;EAAW,GAAI;aAC/C,oBAACC,gBAAW,OAAQ,EACpB,oBAAC,oBAAM,OAAY;GACX;;AAId,KAAK,cAAc;AAEnB,mBAAe"}

package/es/mdx/FileTree/Folder.d.mts

@@ -0,0 +1,16 @@
+import { FlexboxProps } from "../../Flex/type.mjs";
+import "../../Flex/index.mjs";
+import { IconProps } from "../../Icon/type.mjs";
+import "../../Icon/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/FileTree/Folder.d.ts
+interface FolderProps extends FlexboxProps {
+  defaultOpen?: boolean;
+  icon?: IconProps['icon'];
+  name: string;
+}
+declare const Folder: FC<FolderProps>;
+//#endregion
+export { Folder, FolderProps };
+//# sourceMappingURL=Folder.d.mts.map

package/es/mdx/FileTree/Folder.mjs

@@ -0,0 +1,48 @@
+'use client';
+
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Icon_default from "../../Icon/Icon.mjs";
+import { useState } from "react";
+import { createStyles } from "antd-style";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FolderIcon, FolderOpen } from "lucide-react";
+
+//#region src/mdx/FileTree/Folder.tsx
+const useStyles = createStyles(({ css: css$1, token }) => {
+	return {
+		folder: css$1`
+      cursor: pointer;
+
+      &:hover {
+        color: ${token.colorText};
+      }
+    `,
+		folderChildren: css$1`
+      padding-inline-start: 1em;
+    `
+	};
+});
+const Folder = ({ name, defaultOpen, icon = FolderIcon, children, ...rest }) => {
+	const [open, setOpen] = useState(defaultOpen);
+	const { styles } = useStyles();
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		...rest,
+		children: [/* @__PURE__ */ jsxs(FlexBasic_default, {
+			align: "center",
+			className: styles.folder,
+			gap: 4,
+			horizontal: true,
+			onClick: () => setOpen(!open),
+			children: [/* @__PURE__ */ jsx(Icon_default, { icon: open ? FolderOpen : icon }), /* @__PURE__ */ jsx("span", { children: name })]
+		}), open && /* @__PURE__ */ jsx(FlexBasic_default, {
+			className: styles.folderChildren,
+			children
+		})]
+	});
+};
+Folder.displayName = "MdxFolder";
+var Folder_default = Folder;
+
+//#endregion
+export { Folder_default as default };
+//# sourceMappingURL=Folder.mjs.map

package/es/mdx/FileTree/Folder.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Folder.mjs","names":["Folder: FC<FolderProps>","Flexbox","Icon"],"sources":["../../../src/mdx/FileTree/Folder.tsx"],"sourcesContent":["'use client';\n\nimport { createStyles } from 'antd-style';\nimport { FolderIcon, FolderOpen } from 'lucide-react';\nimport { FC, useState } from 'react';\n\nimport { Flexbox, FlexboxProps } from '@/Flex';\nimport Icon, { type IconProps } from '@/Icon';\n\nconst useStyles = createStyles(({ css, token }) => {\n  return {\n    folder: css`\n      cursor: pointer;\n\n      &:hover {\n        color: ${token.colorText};\n      }\n    `,\n    folderChildren: css`\n      padding-inline-start: 1em;\n    `,\n  };\n});\n\nexport interface FolderProps extends FlexboxProps {\n  defaultOpen?: boolean;\n  icon?: IconProps['icon'];\n  name: string;\n}\n\nconst Folder: FC<FolderProps> = ({ name, defaultOpen, icon = FolderIcon, children, ...rest }) => {\n  const [open, setOpen] = useState(defaultOpen);\n  const { styles } = useStyles();\n  return (\n    <Flexbox {...rest}>\n      <Flexbox\n        align={'center'}\n        className={styles.folder}\n        gap={4}\n        horizontal\n        onClick={() => setOpen(!open)}\n      >\n        <Icon icon={open ? FolderOpen : icon} />\n        <span>{name}</span>\n      </Flexbox>\n      {open && <Flexbox className={styles.folderChildren}>{children}</Flexbox>}\n    </Flexbox>\n  );\n};\n\nFolder.displayName = 'MdxFolder';\n\nexport default Folder;\n"],"mappings":";;;;;;;;;;AASA,MAAM,YAAY,cAAc,EAAE,YAAK,YAAY;AACjD,QAAO;EACL,QAAQ,KAAG;;;;iBAIE,MAAM,UAAU;;;EAG7B,gBAAgB,KAAG;;;EAGpB;EACD;AAQF,MAAMA,UAA2B,EAAE,MAAM,aAAa,OAAO,YAAY,UAAU,GAAG,WAAW;CAC/F,MAAM,CAAC,MAAM,WAAW,SAAS,YAAY;CAC7C,MAAM,EAAE,WAAW,WAAW;AAC9B,QACE,qBAACC;EAAQ,GAAI;aACX,qBAACA;GACC,OAAO;GACP,WAAW,OAAO;GAClB,KAAK;GACL;GACA,eAAe,QAAQ,CAAC,KAAK;cAE7B,oBAACC,gBAAK,MAAM,OAAO,aAAa,OAAQ,EACxC,oBAAC,oBAAM,OAAY;IACX,EACT,QAAQ,oBAACD;GAAQ,WAAW,OAAO;GAAiB;IAAmB;GAChE;;AAId,OAAO,cAAc;AAErB,qBAAe"}

package/es/mdx/FileTree/index.d.mts

@@ -0,0 +1,9 @@
+import { DivProps } from "../../types/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/FileTree/index.d.ts
+type FileTreeProps = DivProps;
+declare const FileTree: FC<FileTreeProps>;
+//#endregion
+export { FileTree, FileTreeProps };
+//# sourceMappingURL=index.d.mts.map

package/es/mdx/FileTree/index.mjs

@@ -0,0 +1,20 @@
+'use client';
+
+import { useStyles } from "./style.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/mdx/FileTree/index.tsx
+const FileTree = ({ children, className, ...rest }) => {
+	const { cx, styles } = useStyles();
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(styles.container, className),
+		...rest,
+		children
+	});
+};
+FileTree.displayName = "MdxFileTree";
+var FileTree_default = FileTree;
+
+//#endregion
+export { FileTree_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/mdx/FileTree/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["FileTree: FC<FileTreeProps>"],"sources":["../../../src/mdx/FileTree/index.tsx"],"sourcesContent":["'use client';\n\nimport { FC } from 'react';\n\nimport { DivProps } from '@/types';\n\nimport { useStyles } from './style';\n\nexport type FileTreeProps = DivProps;\n\nconst FileTree: FC<FileTreeProps> = ({ children, className, ...rest }) => {\n  const { cx, styles } = useStyles();\n  return (\n    <div className={cx(styles.container, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nFileTree.displayName = 'MdxFileTree';\n\nexport default FileTree;\n"],"mappings":";;;;;;AAUA,MAAMA,YAA+B,EAAE,UAAU,WAAW,GAAG,WAAW;CACxE,MAAM,EAAE,IAAI,WAAW,WAAW;AAClC,QACE,oBAAC;EAAI,WAAW,GAAG,OAAO,WAAW,UAAU;EAAE,GAAI;EAClD;GACG;;AAIV,SAAS,cAAc;AAEvB,uBAAe"}

package/es/mdx/FileTree/style.mjs

@@ -0,0 +1,19 @@
+import { createStyles } from "antd-style";
+
+//#region src/mdx/FileTree/style.ts
+const useStyles = createStyles(({ css: css$1, token }) => {
+	return { container: css$1`
+      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);
+      padding-block: 0.75em;
+      padding-inline: 1em;
+
+      color: ${token.colorTextSecondary};
+
+      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);
+      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);
+    ` };
+});
+
+//#endregion
+export { useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/mdx/FileTree/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/mdx/FileTree/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css, token }) => {\n  return {\n    container: css`\n      margin-block: calc(var(--lobe-markdown-margin-multiple) * 1em);\n      padding-block: 0.75em;\n      padding-inline: 1em;\n\n      color: ${token.colorTextSecondary};\n\n      border-radius: calc(var(--lobe-markdown-border-radius) * 1px);\n      box-shadow: 0 0 0 1px var(--lobe-markdown-border-color);\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,YAAK,YAAY;AACxD,QAAO,EACL,WAAW,KAAG;;;;;eAKH,MAAM,mBAAmB;;;;OAKrC;EACD"}

package/es/mdx/Mdx/index.d.mts

@@ -0,0 +1,24 @@
+import { TypographyProps } from "../../Markdown/type.mjs";
+import "../../Markdown/index.mjs";
+import * as react27 from "react";
+import { ReactNode } from "react";
+import { Pluggable } from "unified";
+
+//#region src/mdx/Mdx/index.d.ts
+interface MdxProps extends Omit<TypographyProps, 'children'> {
+  children: string;
+  components?: any[];
+  enableImageGallery?: boolean;
+  enableLatex?: boolean;
+  enableMermaid?: boolean;
+  fallback?: ReactNode;
+  fullFeaturedCodeBlock?: boolean;
+  onDoubleClick?: () => void;
+  rehypePlugins?: Pluggable[];
+  remarkPlugins?: Pluggable[];
+  variant?: 'normal' | 'chat';
+}
+declare const Mdx: react27.NamedExoticComponent<MdxProps>;
+//#endregion
+export { Mdx, MdxProps };
+//# sourceMappingURL=index.d.mts.map

package/es/mdx/Mdx/index.mjs

@@ -0,0 +1,108 @@
+'use client';
+
+import Alert_default from "../../Alert/Alert.mjs";
+import PreviewGroup_default from "../../Image/PreviewGroup.mjs";
+import Image_default from "../mdxComponents/Image.mjs";
+import Video_default from "../mdxComponents/Video.mjs";
+import { useMarkdownContent } from "../../hooks/useMarkdown/useMarkdownContent.mjs";
+import Typography_default from "../../Markdown/Typography.mjs";
+import { useStyles } from "../../Markdown/style.mjs";
+import mdxComponents_default from "../mdxComponents/index.mjs";
+import CodeBlock_default from "../mdxComponents/CodeBlock.mjs";
+import { memo, useEffect, useMemo, useState } from "react";
+import jsxRuntime, { jsx } from "react/jsx-runtime";
+import { rehypeGithubAlerts } from "rehype-github-alerts";
+import rehypeKatex from "rehype-katex";
+import remarkGfm from "remark-gfm";
+import remarkMath from "remark-math";
+import { evaluate } from "@mdx-js/mdx";
+import jsxDevRuntime from "react/jsx-dev-runtime";
+
+//#region src/mdx/Mdx/index.tsx
+const runtime = process.env.NODE_ENV === "production" ? jsxRuntime : jsxDevRuntime;
+const Mdx = memo(({ children, className, style, fullFeaturedCodeBlock = true, enableImageGallery, enableLatex = true, enableMermaid = true, rehypePlugins, remarkPlugins, components = {}, fallback = null, fontSize, headerMultiple, lineHeight, marginMultiple, variant, ...rest }) => {
+	const { cx, styles } = useStyles();
+	const escapedContent = useMarkdownContent(children);
+	const isChatMode = variant === "chat";
+	const [MDXContent, setMDXContent] = useState(() => () => null);
+	const innerRehypePlugins = Array.isArray(rehypePlugins) ? rehypePlugins : [rehypePlugins];
+	const memoRehypePlugins = useMemo(() => [
+		rehypeGithubAlerts,
+		enableLatex && rehypeKatex,
+		...innerRehypePlugins
+	].filter(Boolean), [enableLatex, ...innerRehypePlugins]);
+	const innerRemarkPlugins = Array.isArray(remarkPlugins) ? remarkPlugins : [remarkPlugins];
+	const memoRemarkPlugins = useMemo(() => [
+		remarkGfm,
+		enableLatex && remarkMath,
+		...innerRemarkPlugins
+	].filter(Boolean), [enableLatex, ...innerRemarkPlugins]);
+	const memoComponents = useMemo(() => {
+		const list = {};
+		Object.entries({
+			...mdxComponents_default,
+			img: Image_default,
+			pre: (props) => /* @__PURE__ */ jsx(CodeBlock_default, {
+				...props,
+				enableMermaid,
+				fullFeatured: fullFeaturedCodeBlock
+			}),
+			video: Video_default,
+			...components
+		}).forEach(([key, Render]) => {
+			list[key] = (props) => /* @__PURE__ */ jsx(Render, { ...props });
+		});
+		return list;
+	}, [
+		components,
+		enableMermaid,
+		fullFeaturedCodeBlock
+	]);
+	useEffect(() => {
+		if (!escapedContent) return;
+		(async () => {
+			try {
+				const { default: Content } = await evaluate(escapedContent, {
+					...runtime,
+					development: process.env.NODE_ENV !== "production",
+					rehypePlugins: memoRehypePlugins,
+					remarkPlugins: memoRemarkPlugins
+				});
+				setMDXContent(() => Content);
+			} catch (error) {
+				setMDXContent(() => () => /* @__PURE__ */ jsx(Alert_default, {
+					description: String(error?.message),
+					style: { width: "100%" },
+					title: "Error compiling MDX",
+					type: "error"
+				}));
+				console.error("Error compiling MDX:", error);
+			}
+		})();
+	}, [
+		escapedContent,
+		memoRehypePlugins,
+		memoRemarkPlugins
+	]);
+	if (!escapedContent || !MDXContent) return fallback;
+	return /* @__PURE__ */ jsx(Typography_default, {
+		className: cx(enableLatex && styles.latex, isChatMode && styles.chat, className),
+		"data-code-type": "mdx",
+		fontSize,
+		headerMultiple,
+		lineHeight,
+		marginMultiple,
+		style,
+		...rest,
+		children: /* @__PURE__ */ jsx(PreviewGroup_default, {
+			enable: enableImageGallery,
+			children: /* @__PURE__ */ jsx(MDXContent, { components: memoComponents })
+		})
+	});
+});
+Mdx.displayName = "Mdx";
+var Mdx_default = Mdx;
+
+//#endregion
+export { Mdx_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/mdx/Mdx/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["list: any","mdxComponents","Image","CodeBlock","Video","error: any","Alert","Typography","PreviewGroup"],"sources":["../../../src/mdx/Mdx/index.tsx"],"sourcesContent":["'use client';\n\nimport { evaluate } from '@mdx-js/mdx';\nimport { ReactNode, memo, useEffect, useMemo, useState } from 'react';\nimport jsxDevRuntime from 'react/jsx-dev-runtime';\nimport jsxRuntime from 'react/jsx-runtime';\nimport { rehypeGithubAlerts } from 'rehype-github-alerts';\nimport rehypeKatex from 'rehype-katex';\nimport remarkGfm from 'remark-gfm';\nimport remarkMath from 'remark-math';\nimport type { Pluggable } from 'unified';\n\nimport Alert from '@/Alert';\nimport { PreviewGroup } from '@/Image';\nimport { Typography, type TypographyProps } from '@/Markdown';\nimport { useStyles } from '@/Markdown/style';\nimport { useMarkdownContent } from '@/hooks/useMarkdown';\n\nimport mdxComponents from '../mdxComponents';\nimport CodeBlock from '../mdxComponents/CodeBlock';\nimport Image from '../mdxComponents/Image';\nimport Video from '../mdxComponents/Video';\n\nconst runtime = process.env.NODE_ENV === 'production' ? jsxRuntime : jsxDevRuntime;\n\nexport interface MdxProps extends Omit<TypographyProps, 'children'> {\n  children: string;\n  components?: any[];\n  enableImageGallery?: boolean;\n  enableLatex?: boolean;\n  enableMermaid?: boolean;\n  fallback?: ReactNode;\n  fullFeaturedCodeBlock?: boolean;\n  onDoubleClick?: () => void;\n  rehypePlugins?: Pluggable[];\n  remarkPlugins?: Pluggable[];\n  variant?: 'normal' | 'chat';\n}\n\nconst Mdx = memo<MdxProps>(\n  ({\n    children,\n    className,\n    style,\n    fullFeaturedCodeBlock = true,\n    enableImageGallery,\n    enableLatex = true,\n    enableMermaid = true,\n    rehypePlugins,\n    remarkPlugins,\n    components = {},\n    fallback = null,\n    fontSize,\n    headerMultiple,\n    lineHeight,\n    marginMultiple,\n    variant,\n    ...rest\n  }) => {\n    const { cx, styles } = useStyles();\n    const escapedContent = useMarkdownContent(children);\n\n    const isChatMode = variant === 'chat';\n\n    const [MDXContent, setMDXContent] = useState<any>(() => () => null);\n\n    const innerRehypePlugins = Array.isArray(rehypePlugins) ? rehypePlugins : [rehypePlugins];\n    const memoRehypePlugins = useMemo(\n      () =>\n        [rehypeGithubAlerts, enableLatex && rehypeKatex, ...innerRehypePlugins].filter(\n          Boolean,\n        ) as any,\n      [enableLatex, ...innerRehypePlugins],\n    );\n\n    const innerRemarkPlugins = Array.isArray(remarkPlugins) ? remarkPlugins : [remarkPlugins];\n    const memoRemarkPlugins = useMemo(\n      () => [remarkGfm, enableLatex && remarkMath, ...innerRemarkPlugins].filter(Boolean) as any,\n      [enableLatex, ...innerRemarkPlugins],\n    );\n\n    const memoComponents = useMemo(() => {\n      const list: any = {};\n      Object.entries({\n        ...mdxComponents,\n        img: Image,\n        pre: (props: any) => (\n          <CodeBlock\n            {...props}\n            enableMermaid={enableMermaid}\n            fullFeatured={fullFeaturedCodeBlock}\n          />\n        ),\n        video: Video,\n        ...components,\n      }).forEach(([key, Render]: any) => {\n        list[key] = (props: any) => <Render {...props} />;\n      });\n      return list;\n    }, [components, enableMermaid, fullFeaturedCodeBlock]);\n\n    useEffect(() => {\n      if (!escapedContent) return;\n      (async () => {\n        try {\n          const { default: Content } = await evaluate(escapedContent, {\n            ...runtime,\n            development: process.env.NODE_ENV !== 'production',\n            rehypePlugins: memoRehypePlugins,\n            remarkPlugins: memoRemarkPlugins,\n          });\n          setMDXContent(() => Content);\n        } catch (error: any) {\n          // @ts-ignore\n          setMDXContent(() => () => (\n            <Alert\n              description={String(error?.message as string)}\n              style={{\n                width: '100%',\n              }}\n              title={'Error compiling MDX'}\n              type=\"error\"\n            />\n          ));\n          console.error('Error compiling MDX:', error);\n        }\n      })();\n    }, [escapedContent, memoRehypePlugins, memoRemarkPlugins]);\n\n    if (!escapedContent || !MDXContent) return fallback;\n\n    return (\n      <Typography\n        className={cx(enableLatex && styles.latex, isChatMode && styles.chat, className)}\n        data-code-type=\"mdx\"\n        fontSize={fontSize}\n        headerMultiple={headerMultiple}\n        lineHeight={lineHeight}\n        marginMultiple={marginMultiple}\n        style={style}\n        {...rest}\n      >\n        <PreviewGroup enable={enableImageGallery}>\n          <MDXContent components={memoComponents} />\n        </PreviewGroup>\n      </Typography>\n    );\n  },\n);\n\nMdx.displayName = 'Mdx';\n\nexport default Mdx;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,UAAU,QAAQ,IAAI,aAAa,eAAe,aAAa;AAgBrE,MAAM,MAAM,MACT,EACC,UACA,WACA,OACA,wBAAwB,MACxB,oBACA,cAAc,MACd,gBAAgB,MAChB,eACA,eACA,aAAa,EAAE,EACf,WAAW,MACX,UACA,gBACA,YACA,gBACA,SACA,GAAG,WACC;CACJ,MAAM,EAAE,IAAI,WAAW,WAAW;CAClC,MAAM,iBAAiB,mBAAmB,SAAS;CAEnD,MAAM,aAAa,YAAY;CAE/B,MAAM,CAAC,YAAY,iBAAiB,qBAA0B,KAAK;CAEnE,MAAM,qBAAqB,MAAM,QAAQ,cAAc,GAAG,gBAAgB,CAAC,cAAc;CACzF,MAAM,oBAAoB,cAEtB;EAAC;EAAoB,eAAe;EAAa,GAAG;EAAmB,CAAC,OACtE,QACD,EACH,CAAC,aAAa,GAAG,mBAAmB,CACrC;CAED,MAAM,qBAAqB,MAAM,QAAQ,cAAc,GAAG,gBAAgB,CAAC,cAAc;CACzF,MAAM,oBAAoB,cAClB;EAAC;EAAW,eAAe;EAAY,GAAG;EAAmB,CAAC,OAAO,QAAQ,EACnF,CAAC,aAAa,GAAG,mBAAmB,CACrC;CAED,MAAM,iBAAiB,cAAc;EACnC,MAAMA,OAAY,EAAE;AACpB,SAAO,QAAQ;GACb,GAAGC;GACH,KAAKC;GACL,MAAM,UACJ,oBAACC;IACC,GAAI;IACW;IACf,cAAc;KACd;GAEJ,OAAOC;GACP,GAAG;GACJ,CAAC,CAAC,SAAS,CAAC,KAAK,YAAiB;AACjC,QAAK,QAAQ,UAAe,oBAAC,UAAO,GAAI,QAAS;IACjD;AACF,SAAO;IACN;EAAC;EAAY;EAAe;EAAsB,CAAC;AAEtD,iBAAgB;AACd,MAAI,CAAC,eAAgB;AACrB,GAAC,YAAY;AACX,OAAI;IACF,MAAM,EAAE,SAAS,YAAY,MAAM,SAAS,gBAAgB;KAC1D,GAAG;KACH,aAAa,QAAQ,IAAI,aAAa;KACtC,eAAe;KACf,eAAe;KAChB,CAAC;AACF,wBAAoB,QAAQ;YACrBC,OAAY;AAEnB,8BACE,oBAACC;KACC,aAAa,OAAO,OAAO,QAAkB;KAC7C,OAAO,EACL,OAAO,QACR;KACD,OAAO;KACP,MAAK;MACL,CACF;AACF,YAAQ,MAAM,wBAAwB,MAAM;;MAE5C;IACH;EAAC;EAAgB;EAAmB;EAAkB,CAAC;AAE1D,KAAI,CAAC,kBAAkB,CAAC,WAAY,QAAO;AAE3C,QACE,oBAACC;EACC,WAAW,GAAG,eAAe,OAAO,OAAO,cAAc,OAAO,MAAM,UAAU;EAChF,kBAAe;EACL;EACM;EACJ;EACI;EACT;EACP,GAAI;YAEJ,oBAACC;GAAa,QAAQ;aACpB,oBAAC,cAAW,YAAY,iBAAkB;IAC7B;GACJ;EAGlB;AAED,IAAI,cAAc;AAElB,kBAAe"}

package/es/mdx/Steps/index.d.mts

@@ -0,0 +1,8 @@
+import { DivProps } from "../../types/index.mjs";
+import { FC } from "react";
+
+//#region src/mdx/Steps/index.d.ts
+declare const Steps: FC<DivProps>;
+//#endregion
+export { Steps };
+//# sourceMappingURL=index.d.mts.map

package/es/mdx/Steps/index.mjs

@@ -0,0 +1,20 @@
+'use client';
+
+import { useStyles } from "./style.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/mdx/Steps/index.tsx
+const Steps = ({ children, className, ...rest }) => {
+	const { cx, styles } = useStyles();
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(styles.container, className),
+		...rest,
+		children
+	});
+};
+Steps.displayName = "MdxSteps";
+var Steps_default = Steps;
+
+//#endregion
+export { Steps_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/mdx/Steps/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["Steps: FC<DivProps>"],"sources":["../../../src/mdx/Steps/index.tsx"],"sourcesContent":["'use client';\n\nimport { FC } from 'react';\n\nimport { DivProps } from '@/types';\n\nimport { useStyles } from './style';\n\nconst Steps: FC<DivProps> = ({ children, className, ...rest }) => {\n  const { cx, styles } = useStyles();\n\n  return (\n    <div className={cx(styles.container, className)} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nSteps.displayName = 'MdxSteps';\n\nexport default Steps;\n"],"mappings":";;;;;;AAQA,MAAMA,SAAuB,EAAE,UAAU,WAAW,GAAG,WAAW;CAChE,MAAM,EAAE,IAAI,WAAW,WAAW;AAElC,QACE,oBAAC;EAAI,WAAW,GAAG,OAAO,WAAW,UAAU;EAAE,GAAI;EAClD;GACG;;AAIV,MAAM,cAAc;AAEpB,oBAAe"}