@lobehub/ui 5.6.2 → 5.6.4

package/es/CodeDiff/PatchDiff.mjs

@@ -1,13 +1,11 @@
-'use client';
-
+"use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
-import MaterialFileTypeIcon_default from "../MaterialFileTypeIcon/MaterialFileTypeIcon.mjs";
-import { headerVariants, prefix, styles, variants } from "./style.mjs";
+import MaterialFileTypeIcon from "../MaterialFileTypeIcon/MaterialFileTypeIcon.mjs";
+import { headerVariants, styles, variants } from "./style.mjs";
 import { memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cx } from "antd-style";
 import { PatchDiff } from "@pierre/diffs/react";
-
 //#region src/CodeDiff/PatchDiff.tsx
 const countPatchChanges = (patch) => {
 	const lines = patch.split("\n");
@@ -56,7 +54,7 @@ const PatchDiff$1 = memo(({ patch, language, fileName, viewMode = "split", showH
 				horizontal: true,
 				align: "center",
 				gap: 8,
-				children: [/* @__PURE__ */ jsx(MaterialFileTypeIcon_default, {
+				children: [/* @__PURE__ */ jsx(MaterialFileTypeIcon, {
 					filename: fileName || displayName,
 					size: 18,
 					type: "file"
@@ -78,7 +76,7 @@ const PatchDiff$1 = memo(({ patch, language, fileName, viewMode = "split", showH
 					})]
 				}), actions && /* @__PURE__ */ jsx(FlexBasic_default, {
 					align: "center",
-					className: cx(`${prefix}-actions`, styles.actions),
+					className: cx(`lobe-code-diff-actions`, styles.actions),
 					gap: 4,
 					children: actions
 				})]
@@ -94,8 +92,7 @@ const PatchDiff$1 = memo(({ patch, language, fileName, viewMode = "split", showH
 	});
 });
 PatchDiff$1.displayName = "PatchDiff";
-var PatchDiff_default = PatchDiff$1;
-
 //#endregion
-export { PatchDiff_default as default };
+export { PatchDiff$1 as default };
+
 //# sourceMappingURL=PatchDiff.mjs.map

package/es/CodeDiff/PatchDiff.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PatchDiff.mjs","names":["PatchDiff","Flexbox","MaterialFileTypeIcon","PierrePatchDiff"],"sources":["../../src/CodeDiff/PatchDiff.tsx"],"sourcesContent":["'use client';\n\nimport type { FileDiffOptions } from '@pierre/diffs';\nimport { PatchDiff as PierrePatchDiff } from '@pierre/diffs/react';\nimport { cx } from 'antd-style';\nimport { memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\n\nimport { headerVariants, prefix, styles, variants } from './style';\nimport type { PatchDiffProps } from './type';\n\nconst countPatchChanges = (patch: string): { additions: number; deletions: number } => {\n  const lines = patch.split('\\n');\n  let additions = 0;\n  let deletions = 0;\n\n  for (const line of lines) {\n    if (line.startsWith('+') && !line.startsWith('+++')) {\n      additions++;\n    } else if (line.startsWith('-') && !line.startsWith('---')) {\n      deletions++;\n    }\n  }\n\n  return { additions, deletions };\n};\n\nexport const PatchDiff = memo<PatchDiffProps>(\n  ({\n    patch,\n    language,\n    fileName,\n    viewMode = 'split',\n    showHeader = true,\n    variant = 'filled',\n    className,\n    classNames,\n    styles: customStyles,\n    actionsRender,\n    diffOptions,\n    ...rest\n  }) => {\n    const displayName = useMemo(() => {\n      if (fileName) return fileName;\n      // Try to extract filename from patch header\n      const match = patch.match(/^(?:-{3}|\\+{3})\\s+(?:a\\/|b\\/)?(.+?)(?:\\t|$)/m);\n      if (match?.[1]) return match[1];\n      if (language) return language;\n      return 'patch';\n    }, [fileName, patch, language]);\n\n    const { additions, deletions } = useMemo(() => countPatchChanges(patch), [patch]);\n\n    const actions = useMemo(() => {\n      if (!actionsRender) return null;\n      return actionsRender({\n        originalNode: null,\n        patch,\n      });\n    }, [actionsRender, patch]);\n\n    const options = useMemo<FileDiffOptions<string>>(\n      () => ({\n        diffStyle: viewMode,\n        disableFileHeader: true,\n        ...diffOptions,\n      }),\n      [viewMode, diffOptions],\n    );\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        data-code-type=\"patch-diff\"\n        {...rest}\n      >\n        {showHeader && (\n          <div\n            className={cx(headerVariants({ variant }), classNames?.header)}\n            style={customStyles?.header}\n          >\n            <Flexbox horizontal align=\"center\" gap={8}>\n              <MaterialFileTypeIcon filename={fileName || displayName} size={18} type=\"file\" />\n              <span>{displayName}</span>\n            </Flexbox>\n            <Flexbox horizontal align=\"center\" gap={8}>\n              {(deletions > 0 || additions > 0) && (\n                <Flexbox horizontal className={styles.stats} gap={8}>\n                  {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n                  {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n                </Flexbox>\n              )}\n              {actions && (\n                <Flexbox align=\"center\" className={cx(`${prefix}-actions`, styles.actions)} gap={4}>\n                  {actions}\n                </Flexbox>\n              )}\n            </Flexbox>\n          </div>\n        )}\n        <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n          <PierrePatchDiff options={options} patch={patch} />\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nPatchDiff.displayName = 'PatchDiff';\n\nexport default PatchDiff;\n"],"mappings":";;;;;;;;;;;AAaA,MAAM,qBAAqB,UAA4D;CACrF,MAAM,QAAQ,MAAM,MAAM,KAAK;CAC/B,IAAI,YAAY;CAChB,IAAI,YAAY;AAEhB,MAAK,MAAM,QAAQ,MACjB,KAAI,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,WAAW,MAAM,CACjD;UACS,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,WAAW,MAAM,CACxD;AAIJ,QAAO;EAAE;EAAW;EAAW;;AAGjC,MAAaA,cAAY,MACtB,EACC,OACA,UACA,UACA,WAAW,SACX,aAAa,MACb,UAAU,UACV,WACA,YACA,QAAQ,cACR,eACA,aACA,GAAG,WACC;CACJ,MAAM,cAAc,cAAc;AAChC,MAAI,SAAU,QAAO;EAErB,MAAM,QAAQ,MAAM,MAAM,+CAA+C;AACzE,MAAI,QAAQ,GAAI,QAAO,MAAM;AAC7B,MAAI,SAAU,QAAO;AACrB,SAAO;IACN;EAAC;EAAU;EAAO;EAAS,CAAC;CAE/B,MAAM,EAAE,WAAW,cAAc,cAAc,kBAAkB,MAAM,EAAE,CAAC,MAAM,CAAC;CAEjF,MAAM,UAAU,cAAc;AAC5B,MAAI,CAAC,cAAe,QAAO;AAC3B,SAAO,cAAc;GACnB,cAAc;GACd;GACD,CAAC;IACD,CAAC,eAAe,MAAM,CAAC;CAE1B,MAAM,UAAU,eACP;EACL,WAAW;EACX,mBAAmB;EACnB,GAAG;EACJ,GACD,CAAC,UAAU,YAAY,CACxB;AAED,QACE,qBAACC;EACC,WAAW,GAAG,SAAS,EAAE,SAAS,CAAC,EAAE,UAAU;EAC/C,kBAAe;EACf,GAAI;aAEH,cACC,qBAAC;GACC,WAAW,GAAG,eAAe,EAAE,SAAS,CAAC,EAAE,YAAY,OAAO;GAC9D,OAAO,cAAc;cAErB,qBAACA;IAAQ;IAAW,OAAM;IAAS,KAAK;eACtC,oBAACC;KAAqB,UAAU,YAAY;KAAa,MAAM;KAAI,MAAK;MAAS,EACjF,oBAAC,oBAAM,cAAmB;KAClB,EACV,qBAACD;IAAQ;IAAW,OAAM;IAAS,KAAK;gBACpC,YAAY,KAAK,YAAY,MAC7B,qBAACA;KAAQ;KAAW,WAAW,OAAO;KAAO,KAAK;gBAC/C,YAAY,KAAK,qBAAC;MAAK,WAAW,OAAO;iBAAW,KAAE;OAAiB,EACvE,YAAY,KAAK,qBAAC;MAAK,WAAW,OAAO;iBAAW,KAAE;OAAiB;MAChE,EAEX,WACC,oBAACA;KAAQ,OAAM;KAAS,WAAW,GAAG,GAAG,OAAO,WAAW,OAAO,QAAQ;KAAE,KAAK;eAC9E;MACO;KAEJ;IACN,EAER,oBAAC;GAAI,WAAW,GAAG,OAAO,MAAM,YAAY,KAAK;GAAE,OAAO,cAAc;aACtE,oBAACE;IAAyB;IAAgB;KAAS;IAC/C;GACE;EAGf;AAED,YAAU,cAAc;AAExB,wBAAeH"}
+{"version":3,"file":"PatchDiff.mjs","names":["PatchDiff","Flexbox","PierrePatchDiff"],"sources":["../../src/CodeDiff/PatchDiff.tsx"],"sourcesContent":["'use client';\n\nimport type { FileDiffOptions } from '@pierre/diffs';\nimport { PatchDiff as PierrePatchDiff } from '@pierre/diffs/react';\nimport { cx } from 'antd-style';\nimport { memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport MaterialFileTypeIcon from '@/MaterialFileTypeIcon';\n\nimport { headerVariants, prefix, styles, variants } from './style';\nimport type { PatchDiffProps } from './type';\n\nconst countPatchChanges = (patch: string): { additions: number; deletions: number } => {\n  const lines = patch.split('\\n');\n  let additions = 0;\n  let deletions = 0;\n\n  for (const line of lines) {\n    if (line.startsWith('+') && !line.startsWith('+++')) {\n      additions++;\n    } else if (line.startsWith('-') && !line.startsWith('---')) {\n      deletions++;\n    }\n  }\n\n  return { additions, deletions };\n};\n\nexport const PatchDiff = memo<PatchDiffProps>(\n  ({\n    patch,\n    language,\n    fileName,\n    viewMode = 'split',\n    showHeader = true,\n    variant = 'filled',\n    className,\n    classNames,\n    styles: customStyles,\n    actionsRender,\n    diffOptions,\n    ...rest\n  }) => {\n    const displayName = useMemo(() => {\n      if (fileName) return fileName;\n      // Try to extract filename from patch header\n      const match = patch.match(/^(?:-{3}|\\+{3})\\s+(?:a\\/|b\\/)?(.+?)(?:\\t|$)/m);\n      if (match?.[1]) return match[1];\n      if (language) return language;\n      return 'patch';\n    }, [fileName, patch, language]);\n\n    const { additions, deletions } = useMemo(() => countPatchChanges(patch), [patch]);\n\n    const actions = useMemo(() => {\n      if (!actionsRender) return null;\n      return actionsRender({\n        originalNode: null,\n        patch,\n      });\n    }, [actionsRender, patch]);\n\n    const options = useMemo<FileDiffOptions<string>>(\n      () => ({\n        diffStyle: viewMode,\n        disableFileHeader: true,\n        ...diffOptions,\n      }),\n      [viewMode, diffOptions],\n    );\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        data-code-type=\"patch-diff\"\n        {...rest}\n      >\n        {showHeader && (\n          <div\n            className={cx(headerVariants({ variant }), classNames?.header)}\n            style={customStyles?.header}\n          >\n            <Flexbox horizontal align=\"center\" gap={8}>\n              <MaterialFileTypeIcon filename={fileName || displayName} size={18} type=\"file\" />\n              <span>{displayName}</span>\n            </Flexbox>\n            <Flexbox horizontal align=\"center\" gap={8}>\n              {(deletions > 0 || additions > 0) && (\n                <Flexbox horizontal className={styles.stats} gap={8}>\n                  {deletions > 0 && <span className={styles.deletions}>-{deletions}</span>}\n                  {additions > 0 && <span className={styles.additions}>+{additions}</span>}\n                </Flexbox>\n              )}\n              {actions && (\n                <Flexbox align=\"center\" className={cx(`${prefix}-actions`, styles.actions)} gap={4}>\n                  {actions}\n                </Flexbox>\n              )}\n            </Flexbox>\n          </div>\n        )}\n        <div className={cx(styles.body, classNames?.body)} style={customStyles?.body}>\n          <PierrePatchDiff options={options} patch={patch} />\n        </div>\n      </Flexbox>\n    );\n  },\n);\n\nPatchDiff.displayName = 'PatchDiff';\n\nexport default PatchDiff;\n"],"mappings":";;;;;;;;;AAaA,MAAM,qBAAqB,UAA4D;CACrF,MAAM,QAAQ,MAAM,MAAM,KAAK;CAC/B,IAAI,YAAY;CAChB,IAAI,YAAY;AAEhB,MAAK,MAAM,QAAQ,MACjB,KAAI,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,WAAW,MAAM,CACjD;UACS,KAAK,WAAW,IAAI,IAAI,CAAC,KAAK,WAAW,MAAM,CACxD;AAIJ,QAAO;EAAE;EAAW;EAAW;;AAGjC,MAAaA,cAAY,MACtB,EACC,OACA,UACA,UACA,WAAW,SACX,aAAa,MACb,UAAU,UACV,WACA,YACA,QAAQ,cACR,eACA,aACA,GAAG,WACC;CACJ,MAAM,cAAc,cAAc;AAChC,MAAI,SAAU,QAAO;EAErB,MAAM,QAAQ,MAAM,MAAM,+CAA+C;AACzE,MAAI,QAAQ,GAAI,QAAO,MAAM;AAC7B,MAAI,SAAU,QAAO;AACrB,SAAO;IACN;EAAC;EAAU;EAAO;EAAS,CAAC;CAE/B,MAAM,EAAE,WAAW,cAAc,cAAc,kBAAkB,MAAM,EAAE,CAAC,MAAM,CAAC;CAEjF,MAAM,UAAU,cAAc;AAC5B,MAAI,CAAC,cAAe,QAAO;AAC3B,SAAO,cAAc;GACnB,cAAc;GACd;GACD,CAAC;IACD,CAAC,eAAe,MAAM,CAAC;CAE1B,MAAM,UAAU,eACP;EACL,WAAW;EACX,mBAAmB;EACnB,GAAG;EACJ,GACD,CAAC,UAAU,YAAY,CACxB;AAED,QACE,qBAACC,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,SAAS,CAAC,EAAE,UAAU;EAC/C,kBAAe;EACf,GAAI;YAHN,CAKG,cACC,qBAAC,OAAD;GACE,WAAW,GAAG,eAAe,EAAE,SAAS,CAAC,EAAE,YAAY,OAAO;GAC9D,OAAO,cAAc;aAFvB,CAIE,qBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,KAAK;cAAxC,CACE,oBAAC,sBAAD;KAAsB,UAAU,YAAY;KAAa,MAAM;KAAI,MAAK;KAAS,CAAA,EACjF,oBAAC,QAAD,EAAA,UAAO,aAAmB,CAAA,CAClB;OACV,qBAACA,mBAAD;IAAS,YAAA;IAAW,OAAM;IAAS,KAAK;cAAxC,EACI,YAAY,KAAK,YAAY,MAC7B,qBAACA,mBAAD;KAAS,YAAA;KAAW,WAAW,OAAO;KAAO,KAAK;eAAlD,CACG,YAAY,KAAK,qBAAC,QAAD;MAAM,WAAW,OAAO;gBAAxB,CAAmC,KAAE,UAAiB;SACvE,YAAY,KAAK,qBAAC,QAAD;MAAM,WAAW,OAAO;gBAAxB,CAAmC,KAAE,UAAiB;QAChE;QAEX,WACC,oBAACA,mBAAD;KAAS,OAAM;KAAS,WAAW,GAAG,0BAAqB,OAAO,QAAQ;KAAE,KAAK;eAC9E;KACO,CAAA,CAEJ;MACN;MAER,oBAAC,OAAD;GAAK,WAAW,GAAG,OAAO,MAAM,YAAY,KAAK;GAAE,OAAO,cAAc;aACtE,oBAACC,WAAD;IAA0B;IAAgB;IAAS,CAAA;GAC/C,CAAA,CACE;;EAGf;AAED,YAAU,cAAc"}

package/es/CodeDiff/index.mjs

@@ -1,4 +1,3 @@
-import CodeDiff_default from "./CodeDiff.mjs";
-import PatchDiff_default from "./PatchDiff.mjs";
-
-export { CodeDiff_default as CodeDiff, PatchDiff_default as PatchDiff };
+import CodeDiff from "./CodeDiff.mjs";
+import PatchDiff from "./PatchDiff.mjs";
+export { CodeDiff, PatchDiff };

package/es/CodeDiff/style.mjs

@@ -1,58 +1,57 @@
 import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
 import { createStaticStyles, cx } from "antd-style";
 import { cva } from "class-variance-authority";
-
 //#region src/CodeDiff/style.ts
 const prefix = "lobe-code-diff";
-const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
+const styles = createStaticStyles(({ css, cssVar }) => {
 	return {
-		actions: css$1`
+		actions: css`
       position: absolute;
       z-index: 2;
       inset-block-start: 8px;
       inset-inline-end: 8px;
 
       opacity: 0;
-      transition: opacity 0.2s ${cssVar$1.motionEaseInOut};
+      transition: opacity 0.2s ${cssVar.motionEaseInOut};
     `,
-		additions: css$1`
-      color: ${cssVar$1.colorSuccess};
-      font-family: ${cssVar$1.fontFamilyCode};
+		additions: css`
+      color: ${cssVar.colorSuccess};
+      font-family: ${cssVar.fontFamilyCode};
       font-size: 12px;
     `,
-		body: css$1`
+		body: css`
       overflow: auto;
 
       width: 100%;
 
-      font-family: ${cssVar$1.fontFamilyCode};
+      font-family: ${cssVar.fontFamilyCode};
       font-size: 13px;
       line-height: 1.6;
 
       /* Override @pierre/diffs shadow DOM CSS variables */
-      --pdiff-font-family: ${cssVar$1.fontFamilyCode};
+      --pdiff-font-family: ${cssVar.fontFamilyCode};
       --pdiff-font-size: 13px;
       --pdiff-line-height: 1.6;
       --pdiff-bg-color: transparent;
-      --pdiff-border-color: ${cssVar$1.colorBorderSecondary};
-      --pdiff-gutter-bg: ${cssVar$1.colorFillQuaternary};
-      --pdiff-gutter-color: ${cssVar$1.colorTextQuaternary};
-      --pdiff-added-bg: ${cssVar$1.colorSuccessBgHover};
-      --pdiff-added-highlight-bg: ${cssVar$1.colorSuccessBg};
-      --pdiff-removed-bg: ${cssVar$1.colorErrorBgHover};
-      --pdiff-removed-highlight-bg: ${cssVar$1.colorErrorBg};
-      --pdiff-info-bg: ${cssVar$1.colorInfoBg};
+      --pdiff-border-color: ${cssVar.colorBorderSecondary};
+      --pdiff-gutter-bg: ${cssVar.colorFillQuaternary};
+      --pdiff-gutter-color: ${cssVar.colorTextQuaternary};
+      --pdiff-added-bg: ${cssVar.colorSuccessBgHover};
+      --pdiff-added-highlight-bg: ${cssVar.colorSuccessBg};
+      --pdiff-removed-bg: ${cssVar.colorErrorBgHover};
+      --pdiff-removed-highlight-bg: ${cssVar.colorErrorBg};
+      --pdiff-info-bg: ${cssVar.colorInfoBg};
     `,
 		borderless: staticStylish.variantBorderlessWithoutHover,
-		deletions: css$1`
-      color: ${cssVar$1.colorError};
-      font-family: ${cssVar$1.fontFamilyCode};
+		deletions: css`
+      color: ${cssVar.colorError};
+      font-family: ${cssVar.fontFamilyCode};
       font-size: 12px;
     `,
-		filled: cx(staticStylish.variantFilledWithoutHover, css$1`
-        background: ${cssVar$1.colorFillQuaternary};
+		filled: cx(staticStylish.variantFilledWithoutHover, css`
+        background: ${cssVar.colorFillQuaternary};
       `),
-		header: css$1`
+		header: css`
       display: flex;
       gap: 8px;
       align-items: center;
@@ -60,32 +59,32 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
 
       padding: 8px 12px;
 
-      font-family: ${cssVar$1.fontFamilyCode};
+      font-family: ${cssVar.fontFamilyCode};
       font-size: 13px;
-      color: ${cssVar$1.colorTextSecondary};
+      color: ${cssVar.colorTextSecondary};
 
-      border-block-end: 1px solid ${cssVar$1.colorBorderSecondary};
+      border-block-end: 1px solid ${cssVar.colorBorderSecondary};
     `,
-		headerBorderless: css$1`
+		headerBorderless: css`
       padding-inline: 0;
       border-block-end: none;
     `,
-		headerFilled: css$1`
+		headerFilled: css`
       background: transparent;
     `,
-		headerOutlined: css$1`
-      background: ${cssVar$1.colorFillQuaternary};
+		headerOutlined: css`
+      background: ${cssVar.colorFillQuaternary};
     `,
 		outlined: staticStylish.variantOutlinedWithoutHover,
-		root: cx(prefix, css$1`
+		root: cx(prefix, css`
         position: relative;
 
         overflow: hidden;
 
         width: 100%;
-        border-radius: ${cssVar$1.borderRadius};
+        border-radius: ${cssVar.borderRadius};
 
-        transition: background-color 100ms ${cssVar$1.motionEaseOut};
+        transition: background-color 100ms ${cssVar.motionEaseOut};
 
         &:hover {
           .${prefix}-actions {
@@ -93,7 +92,7 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
           }
         }
       `),
-		stats: css$1`
+		stats: css`
       display: flex;
       gap: 8px;
       align-items: center;
@@ -116,7 +115,7 @@ const headerVariants = cva(styles.header, {
 		borderless: styles.headerBorderless
 	} }
 });
-
 //#endregion
 export { headerVariants, prefix, styles, variants };
+
 //# sourceMappingURL=style.mjs.map

package/es/CodeDiff/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["cssVar","lobeStaticStylish"],"sources":["../../src/CodeDiff/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const prefix = 'lobe-code-diff';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    actions: css`\n      position: absolute;\n      z-index: 2;\n      inset-block-start: 8px;\n      inset-inline-end: 8px;\n\n      opacity: 0;\n      transition: opacity 0.2s ${cssVar.motionEaseInOut};\n    `,\n    additions: css`\n      color: ${cssVar.colorSuccess};\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n    `,\n    body: css`\n      overflow: auto;\n\n      width: 100%;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      line-height: 1.6;\n\n      /* Override @pierre/diffs shadow DOM CSS variables */\n      --pdiff-font-family: ${cssVar.fontFamilyCode};\n      --pdiff-font-size: 13px;\n      --pdiff-line-height: 1.6;\n      --pdiff-bg-color: transparent;\n      --pdiff-border-color: ${cssVar.colorBorderSecondary};\n      --pdiff-gutter-bg: ${cssVar.colorFillQuaternary};\n      --pdiff-gutter-color: ${cssVar.colorTextQuaternary};\n      --pdiff-added-bg: ${cssVar.colorSuccessBgHover};\n      --pdiff-added-highlight-bg: ${cssVar.colorSuccessBg};\n      --pdiff-removed-bg: ${cssVar.colorErrorBgHover};\n      --pdiff-removed-highlight-bg: ${cssVar.colorErrorBg};\n      --pdiff-info-bg: ${cssVar.colorInfoBg};\n    `,\n    borderless: lobeStaticStylish.variantBorderlessWithoutHover,\n    deletions: css`\n      color: ${cssVar.colorError};\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n    `,\n    filled: cx(\n      lobeStaticStylish.variantFilledWithoutHover,\n      css`\n        background: ${cssVar.colorFillQuaternary};\n      `,\n    ),\n    header: css`\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      justify-content: space-between;\n\n      padding: 8px 12px;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      color: ${cssVar.colorTextSecondary};\n\n      border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n    `,\n    headerBorderless: css`\n      padding-inline: 0;\n      border-block-end: none;\n    `,\n    headerFilled: css`\n      background: transparent;\n    `,\n    headerOutlined: css`\n      background: ${cssVar.colorFillQuaternary};\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    root: cx(\n      prefix,\n      css`\n        position: relative;\n\n        overflow: hidden;\n\n        width: 100%;\n        border-radius: ${cssVar.borderRadius};\n\n        transition: background-color 100ms ${cssVar.motionEaseOut};\n\n        &:hover {\n          .${prefix}-actions {\n            opacity: 1;\n          }\n        }\n      `,\n    ),\n    stats: css`\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.headerFilled,\n      outlined: styles.headerOutlined,\n      borderless: styles.headerBorderless,\n    },\n  },\n});\n"],"mappings":";;;;;AAKA,MAAa,SAAS;AAEtB,MAAa,SAAS,oBAAoB,EAAE,YAAK,uBAAa;AAC5D,QAAO;EACL,SAAS,KAAG;;;;;;;iCAOiBA,SAAO,gBAAgB;;EAEpD,WAAW,KAAG;eACHA,SAAO,aAAa;qBACdA,SAAO,eAAe;;;EAGvC,MAAM,KAAG;;;;;qBAKQA,SAAO,eAAe;;;;;6BAKdA,SAAO,eAAe;;;;8BAIrBA,SAAO,qBAAqB;2BAC/BA,SAAO,oBAAoB;8BACxBA,SAAO,oBAAoB;0BAC/BA,SAAO,oBAAoB;oCACjBA,SAAO,eAAe;4BAC9BA,SAAO,kBAAkB;sCACfA,SAAO,aAAa;yBACjCA,SAAO,YAAY;;EAExC,YAAYC,cAAkB;EAC9B,WAAW,KAAG;eACHD,SAAO,WAAW;qBACZA,SAAO,eAAe;;;EAGvC,QAAQ,GACNC,cAAkB,2BAClB,KAAG;sBACaD,SAAO,oBAAoB;QAE5C;EACD,QAAQ,KAAG;;;;;;;;qBAQMA,SAAO,eAAe;;eAE5BA,SAAO,mBAAmB;;oCAELA,SAAO,qBAAqB;;EAE5D,kBAAkB,KAAG;;;;EAIrB,cAAc,KAAG;;;EAGjB,gBAAgB,KAAG;oBACHA,SAAO,oBAAoB;;EAE3C,UAAUC,cAAkB;EAC5B,MAAM,GACJ,QACA,KAAG;;;;;;yBAMgBD,SAAO,aAAa;;6CAEAA,SAAO,cAAc;;;aAGrD,OAAO;;;;QAKf;EACD,OAAO,KAAG;;;;;EAKX;EACD;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC;AAEF,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/CodeDiff/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const prefix = 'lobe-code-diff';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    actions: css`\n      position: absolute;\n      z-index: 2;\n      inset-block-start: 8px;\n      inset-inline-end: 8px;\n\n      opacity: 0;\n      transition: opacity 0.2s ${cssVar.motionEaseInOut};\n    `,\n    additions: css`\n      color: ${cssVar.colorSuccess};\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n    `,\n    body: css`\n      overflow: auto;\n\n      width: 100%;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      line-height: 1.6;\n\n      /* Override @pierre/diffs shadow DOM CSS variables */\n      --pdiff-font-family: ${cssVar.fontFamilyCode};\n      --pdiff-font-size: 13px;\n      --pdiff-line-height: 1.6;\n      --pdiff-bg-color: transparent;\n      --pdiff-border-color: ${cssVar.colorBorderSecondary};\n      --pdiff-gutter-bg: ${cssVar.colorFillQuaternary};\n      --pdiff-gutter-color: ${cssVar.colorTextQuaternary};\n      --pdiff-added-bg: ${cssVar.colorSuccessBgHover};\n      --pdiff-added-highlight-bg: ${cssVar.colorSuccessBg};\n      --pdiff-removed-bg: ${cssVar.colorErrorBgHover};\n      --pdiff-removed-highlight-bg: ${cssVar.colorErrorBg};\n      --pdiff-info-bg: ${cssVar.colorInfoBg};\n    `,\n    borderless: lobeStaticStylish.variantBorderlessWithoutHover,\n    deletions: css`\n      color: ${cssVar.colorError};\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 12px;\n    `,\n    filled: cx(\n      lobeStaticStylish.variantFilledWithoutHover,\n      css`\n        background: ${cssVar.colorFillQuaternary};\n      `,\n    ),\n    header: css`\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      justify-content: space-between;\n\n      padding: 8px 12px;\n\n      font-family: ${cssVar.fontFamilyCode};\n      font-size: 13px;\n      color: ${cssVar.colorTextSecondary};\n\n      border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n    `,\n    headerBorderless: css`\n      padding-inline: 0;\n      border-block-end: none;\n    `,\n    headerFilled: css`\n      background: transparent;\n    `,\n    headerOutlined: css`\n      background: ${cssVar.colorFillQuaternary};\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    root: cx(\n      prefix,\n      css`\n        position: relative;\n\n        overflow: hidden;\n\n        width: 100%;\n        border-radius: ${cssVar.borderRadius};\n\n        transition: background-color 100ms ${cssVar.motionEaseOut};\n\n        &:hover {\n          .${prefix}-actions {\n            opacity: 1;\n          }\n        }\n      `,\n    ),\n    stats: css`\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n  },\n});\n\nexport const headerVariants = cva(styles.header, {\n  defaultVariants: {\n    variant: 'filled',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.headerFilled,\n      outlined: styles.headerOutlined,\n      borderless: styles.headerBorderless,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS;AAEtB,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;AAC5D,QAAO;EACL,SAAS,GAAG;;;;;;;iCAOiB,OAAO,gBAAgB;;EAEpD,WAAW,GAAG;eACH,OAAO,aAAa;qBACd,OAAO,eAAe;;;EAGvC,MAAM,GAAG;;;;;qBAKQ,OAAO,eAAe;;;;;6BAKd,OAAO,eAAe;;;;8BAIrB,OAAO,qBAAqB;2BAC/B,OAAO,oBAAoB;8BACxB,OAAO,oBAAoB;0BAC/B,OAAO,oBAAoB;oCACjB,OAAO,eAAe;4BAC9B,OAAO,kBAAkB;sCACf,OAAO,aAAa;yBACjC,OAAO,YAAY;;EAExC,YAAYA,cAAkB;EAC9B,WAAW,GAAG;eACH,OAAO,WAAW;qBACZ,OAAO,eAAe;;;EAGvC,QAAQ,GACNA,cAAkB,2BAClB,GAAG;sBACa,OAAO,oBAAoB;QAE5C;EACD,QAAQ,GAAG;;;;;;;;qBAQM,OAAO,eAAe;;eAE5B,OAAO,mBAAmB;;oCAEL,OAAO,qBAAqB;;EAE5D,kBAAkB,GAAG;;;;EAIrB,cAAc,GAAG;;;EAGjB,gBAAgB,GAAG;oBACH,OAAO,oBAAoB;;EAE3C,UAAUA,cAAkB;EAC5B,MAAM,GACJ,QACA,GAAG;;;;;;yBAMgB,OAAO,aAAa;;6CAEA,OAAO,cAAc;;;aAGrD,OAAO;;;;QAKf;EACD,OAAO,GAAG;;;;;EAKX;EACD;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC;AAEF,MAAa,iBAAiB,IAAI,OAAO,QAAQ;CAC/C,iBAAiB,EACf,SAAS,UACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC"}

package/es/CodeDiff/type.d.mts

@@ -1,5 +1,4 @@
 import { FlexboxProps } from "../Flex/type.mjs";
-import "../Flex/index.mjs";
 import { CSSProperties, ReactNode } from "react";
 import { FileDiffOptions } from "@pierre/diffs";
 

package/es/CodeEditor/CodeEditor.d.mts

@@ -1,8 +1,8 @@
 import { CodeEditorProps } from "./type.mjs";
-import * as react56 from "react";
+import * as _$react from "react";
 
 //#region src/CodeEditor/CodeEditor.d.ts
-declare const CodeEditor: react56.NamedExoticComponent<CodeEditorProps>;
+declare const CodeEditor: _$react.NamedExoticComponent<CodeEditorProps>;
 //#endregion
 export { CodeEditor };
 //# sourceMappingURL=CodeEditor.d.mts.map

package/es/CodeEditor/CodeEditor.mjs

@@ -1,13 +1,11 @@
-'use client';
-
+"use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
 import { styles, variants } from "./style.mjs";
-import SyntaxHighlighter_default from "../Highlighter/SyntaxHighlighter/index.mjs";
+import SyntaxHighlighter from "../Highlighter/SyntaxHighlighter/index.mjs";
 import { memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cssVar, cx } from "antd-style";
 import useMergeState from "use-merge-value";
-
 //#region src/CodeEditor/CodeEditor.tsx
 const CodeEditor = memo(({ autoFocus, classNames, styles: customStyles, defaultValue = "", onChange, placeholder = "", style, className, onValueChange, value, language = "markdown", variant = "borderless", width, height, flex, ref, ...rest }) => {
 	const [code, setCode] = useMergeState(defaultValue, {
@@ -21,7 +19,7 @@ const CodeEditor = memo(({ autoFocus, classNames, styles: customStyles, defaultV
 		height,
 		style,
 		width,
-		children: [value ? /* @__PURE__ */ jsx(SyntaxHighlighter_default, {
+		children: [value ? /* @__PURE__ */ jsx(SyntaxHighlighter, {
 			className: cx(styles.highlight, classNames?.highlight),
 			language,
 			style: customStyles?.highlight,
@@ -50,8 +48,7 @@ const CodeEditor = memo(({ autoFocus, classNames, styles: customStyles, defaultV
 	});
 });
 CodeEditor.displayName = "CodeEditor";
-var CodeEditor_default = CodeEditor;
-
 //#endregion
-export { CodeEditor_default as default };
+export { CodeEditor as default };
+
 //# sourceMappingURL=CodeEditor.mjs.map

package/es/CodeEditor/CodeEditor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.mjs","names":["Flexbox","SyntaxHighlighter"],"sources":["../../src/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { styles, variants } from '@/CodeEditor/style';\nimport { Flexbox } from '@/Flex';\nimport SyntaxHighlighter from '@/Highlighter/SyntaxHighlighter';\n\nimport type { CodeEditorProps } from './type';\n\nconst CodeEditor = memo<CodeEditorProps>(\n  ({\n    autoFocus,\n    classNames,\n    styles: customStyles,\n    defaultValue = '',\n    onChange,\n    placeholder = '',\n    style,\n    className,\n    onValueChange,\n    value,\n    language = 'markdown',\n    variant = 'borderless',\n    width,\n    height,\n    flex,\n    ref,\n    ...rest\n  }) => {\n    const [code, setCode] = useMergeState(defaultValue, {\n      defaultValue,\n      onChange: onValueChange,\n      value,\n    });\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        flex={flex}\n        height={height}\n        style={style}\n        width={width}\n      >\n        {value ? (\n          <SyntaxHighlighter\n            className={cx(styles.highlight, classNames?.highlight)}\n            language={language}\n            style={customStyles?.highlight}\n            variant={variant}\n          >\n            {value}\n          </SyntaxHighlighter>\n        ) : (\n          <pre\n            className={cx(styles.highlight, classNames?.highlight)}\n            style={{\n              color: cssVar.colorTextDescription,\n            }}\n          >\n            {placeholder || ' '}\n          </pre>\n        )}\n\n        <textarea\n          autoCapitalize=\"off\"\n          autoComplete=\"off\"\n          autoCorrect=\"off\"\n          autoFocus={autoFocus}\n          className={cx(styles.textarea, classNames?.textarea)}\n          data-gramm={false}\n          ref={ref}\n          style={customStyles?.textarea}\n          value={code}\n          onChange={(e) => {\n            onChange?.(e);\n            setCode(e.target.value);\n          }}\n          {...rest}\n        />\n      </Flexbox>\n    );\n  },\n);\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;;;AAYA,MAAM,aAAa,MAChB,EACC,WACA,YACA,QAAQ,cACR,eAAe,IACf,UACA,cAAc,IACd,OACA,WACA,eACA,OACA,WAAW,YACX,UAAU,cACV,OACA,QACA,MACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,MAAM,WAAW,cAAc,cAAc;EAClD;EACA,UAAU;EACV;EACD,CAAC;AAEF,QACE,qBAACA;EACC,WAAW,GAAG,SAAS,EAAE,SAAS,CAAC,EAAE,UAAU;EACzC;EACE;EACD;EACA;aAEN,QACC,oBAACC;GACC,WAAW,GAAG,OAAO,WAAW,YAAY,UAAU;GAC5C;GACV,OAAO,cAAc;GACZ;aAER;IACiB,GAEpB,oBAAC;GACC,WAAW,GAAG,OAAO,WAAW,YAAY,UAAU;GACtD,OAAO,EACL,OAAO,OAAO,sBACf;aAEA,eAAe;IACZ,EAGR,oBAAC;GACC,gBAAe;GACf,cAAa;GACb,aAAY;GACD;GACX,WAAW,GAAG,OAAO,UAAU,YAAY,SAAS;GACpD,cAAY;GACP;GACL,OAAO,cAAc;GACrB,OAAO;GACP,WAAW,MAAM;AACf,eAAW,EAAE;AACb,YAAQ,EAAE,OAAO,MAAM;;GAEzB,GAAI;IACJ;GACM;EAGf;AAED,WAAW,cAAc;AAEzB,yBAAe"}
+{"version":3,"file":"CodeEditor.mjs","names":["Flexbox"],"sources":["../../src/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client';\n\nimport { cssVar, cx } from 'antd-style';\nimport { memo } from 'react';\nimport useMergeState from 'use-merge-value';\n\nimport { styles, variants } from '@/CodeEditor/style';\nimport { Flexbox } from '@/Flex';\nimport SyntaxHighlighter from '@/Highlighter/SyntaxHighlighter';\n\nimport type { CodeEditorProps } from './type';\n\nconst CodeEditor = memo<CodeEditorProps>(\n  ({\n    autoFocus,\n    classNames,\n    styles: customStyles,\n    defaultValue = '',\n    onChange,\n    placeholder = '',\n    style,\n    className,\n    onValueChange,\n    value,\n    language = 'markdown',\n    variant = 'borderless',\n    width,\n    height,\n    flex,\n    ref,\n    ...rest\n  }) => {\n    const [code, setCode] = useMergeState(defaultValue, {\n      defaultValue,\n      onChange: onValueChange,\n      value,\n    });\n\n    return (\n      <Flexbox\n        className={cx(variants({ variant }), className)}\n        flex={flex}\n        height={height}\n        style={style}\n        width={width}\n      >\n        {value ? (\n          <SyntaxHighlighter\n            className={cx(styles.highlight, classNames?.highlight)}\n            language={language}\n            style={customStyles?.highlight}\n            variant={variant}\n          >\n            {value}\n          </SyntaxHighlighter>\n        ) : (\n          <pre\n            className={cx(styles.highlight, classNames?.highlight)}\n            style={{\n              color: cssVar.colorTextDescription,\n            }}\n          >\n            {placeholder || ' '}\n          </pre>\n        )}\n\n        <textarea\n          autoCapitalize=\"off\"\n          autoComplete=\"off\"\n          autoCorrect=\"off\"\n          autoFocus={autoFocus}\n          className={cx(styles.textarea, classNames?.textarea)}\n          data-gramm={false}\n          ref={ref}\n          style={customStyles?.textarea}\n          value={code}\n          onChange={(e) => {\n            onChange?.(e);\n            setCode(e.target.value);\n          }}\n          {...rest}\n        />\n      </Flexbox>\n    );\n  },\n);\n\nCodeEditor.displayName = 'CodeEditor';\n\nexport default CodeEditor;\n"],"mappings":";;;;;;;;;AAYA,MAAM,aAAa,MAChB,EACC,WACA,YACA,QAAQ,cACR,eAAe,IACf,UACA,cAAc,IACd,OACA,WACA,eACA,OACA,WAAW,YACX,UAAU,cACV,OACA,QACA,MACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,MAAM,WAAW,cAAc,cAAc;EAClD;EACA,UAAU;EACV;EACD,CAAC;AAEF,QACE,qBAACA,mBAAD;EACE,WAAW,GAAG,SAAS,EAAE,SAAS,CAAC,EAAE,UAAU;EACzC;EACE;EACD;EACA;YALT,CAOG,QACC,oBAAC,mBAAD;GACE,WAAW,GAAG,OAAO,WAAW,YAAY,UAAU;GAC5C;GACV,OAAO,cAAc;GACZ;aAER;GACiB,CAAA,GAEpB,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,WAAW,YAAY,UAAU;GACtD,OAAO,EACL,OAAO,OAAO,sBACf;aAEA,eAAe;GACZ,CAAA,EAGR,oBAAC,YAAD;GACE,gBAAe;GACf,cAAa;GACb,aAAY;GACD;GACX,WAAW,GAAG,OAAO,UAAU,YAAY,SAAS;GACpD,cAAY;GACP;GACL,OAAO,cAAc;GACrB,OAAO;GACP,WAAW,MAAM;AACf,eAAW,EAAE;AACb,YAAQ,EAAE,OAAO,MAAM;;GAEzB,GAAI;GACJ,CAAA,CACM;;EAGf;AAED,WAAW,cAAc"}

package/es/CodeEditor/index.mjs

@@ -1,3 +1,2 @@
-import CodeEditor_default from "./CodeEditor.mjs";
-
-export { CodeEditor_default as default };
+import CodeEditor from "./CodeEditor.mjs";
+export { CodeEditor as default };

package/es/CodeEditor/style.mjs

@@ -1,11 +1,10 @@
 import { staticStylish } from "../styles/theme/customStylishStatic.mjs";
 import { createStaticStyles, cx } from "antd-style";
 import { cva } from "class-variance-authority";
-
 //#region src/CodeEditor/style.ts
-const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
+const styles = createStaticStyles(({ css, cssVar }) => {
 	return {
-		borderless: cx(staticStylish.variantBorderlessWithoutHover, css$1`
+		borderless: cx(staticStylish.variantBorderlessWithoutHover, css`
         border-radius: 0;
 
         pre,
@@ -14,18 +13,18 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
         }
       `),
 		filled: staticStylish.variantFilledWithoutHover,
-		highlight: css$1`
+		highlight: css`
       pointer-events: none;
     `,
 		outlined: staticStylish.variantOutlinedWithoutHover,
-		root: css$1`
+		root: css`
       position: relative;
 
       overflow: hidden auto;
 
       width: 100%;
       height: fit-content;
-      border-radius: ${cssVar$1.borderRadius};
+      border-radius: ${cssVar.borderRadius};
 
       font-size: 12px;
 
@@ -40,7 +39,7 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
       code {
         overflow: hidden;
 
-        font-family: ${cssVar$1.fontFamilyCode};
+        font-family: ${cssVar.fontFamilyCode};
         font-size: inherit;
         line-height: inherit;
         word-break: inherit;
@@ -48,7 +47,7 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
         white-space: pre-wrap;
       }
     `,
-		textarea: css$1`
+		textarea: css`
       resize: none;
 
       position: absolute;
@@ -68,10 +67,10 @@ const styles = createStaticStyles(({ css: css$1, cssVar: cssVar$1 }) => {
 
       background: transparent;
       outline: none;
-      caret-color: ${cssVar$1.colorText};
+      caret-color: ${cssVar.colorText};
 
       &::placeholder {
-        color: ${cssVar$1.colorTextQuaternary};
+        color: ${cssVar.colorTextQuaternary};
       }
 
       &:focus {
@@ -90,7 +89,7 @@ const variants = cva(styles.root, {
 		borderless: styles.borderless
 	} }
 });
-
 //#endregion
 export { styles, variants };
+
 //# sourceMappingURL=style.mjs.map

package/es/CodeEditor/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":["lobeStaticStylish","cssVar"],"sources":["../../src/CodeEditor/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    borderless: cx(\n      lobeStaticStylish.variantBorderlessWithoutHover,\n      css`\n        border-radius: 0;\n\n        pre,\n        textarea {\n          padding: 0;\n        }\n      `,\n    ),\n    filled: lobeStaticStylish.variantFilledWithoutHover,\n    highlight: css`\n      pointer-events: none;\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    root: css`\n      position: relative;\n\n      overflow: hidden auto;\n\n      width: 100%;\n      height: fit-content;\n      border-radius: ${cssVar.borderRadius};\n\n      font-size: 12px;\n\n      pre,\n      textarea {\n        margin: 0;\n        padding: 16px;\n      }\n\n      textarea,\n      pre,\n      code {\n        overflow: hidden;\n\n        font-family: ${cssVar.fontFamilyCode};\n        font-size: inherit;\n        line-height: inherit;\n        word-break: inherit;\n        word-wrap: break-word;\n        white-space: pre-wrap;\n      }\n    `,\n    textarea: css`\n      resize: none;\n\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n\n      overflow: hidden;\n\n      box-sizing: border-box;\n      width: 100%;\n      height: 100%;\n      padding: 0;\n      border: none;\n\n      color: transparent;\n      text-align: start;\n\n      background: transparent;\n      outline: none;\n      caret-color: ${cssVar.colorText};\n\n      &::placeholder {\n        color: ${cssVar.colorTextQuaternary};\n      }\n\n      &:focus {\n        border: none;\n        outline: none;\n        box-shadow: none;\n      }\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    variant: 'borderless',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n  },\n});\n"],"mappings":";;;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,YAAK,uBAAa;AAC5D,QAAO;EACL,YAAY,GACVA,cAAkB,+BAClB,KAAG;;;;;;;QAQJ;EACD,QAAQA,cAAkB;EAC1B,WAAW,KAAG;;;EAGd,UAAUA,cAAkB;EAC5B,MAAM,KAAG;;;;;;;uBAOUC,SAAO,aAAa;;;;;;;;;;;;;;;uBAepBA,SAAO,eAAe;;;;;;;;EAQzC,UAAU,KAAG;;;;;;;;;;;;;;;;;;;;qBAoBIA,SAAO,UAAU;;;iBAGrBA,SAAO,oBAAoB;;;;;;;;;EASzC;EACD;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,EACf,SAAS,cACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC"}
+{"version":3,"file":"style.mjs","names":["lobeStaticStylish"],"sources":["../../src/CodeEditor/style.ts"],"sourcesContent":["import { createStaticStyles, cx } from 'antd-style';\nimport { cva } from 'class-variance-authority';\n\nimport { lobeStaticStylish } from '@/styles';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  return {\n    borderless: cx(\n      lobeStaticStylish.variantBorderlessWithoutHover,\n      css`\n        border-radius: 0;\n\n        pre,\n        textarea {\n          padding: 0;\n        }\n      `,\n    ),\n    filled: lobeStaticStylish.variantFilledWithoutHover,\n    highlight: css`\n      pointer-events: none;\n    `,\n    outlined: lobeStaticStylish.variantOutlinedWithoutHover,\n    root: css`\n      position: relative;\n\n      overflow: hidden auto;\n\n      width: 100%;\n      height: fit-content;\n      border-radius: ${cssVar.borderRadius};\n\n      font-size: 12px;\n\n      pre,\n      textarea {\n        margin: 0;\n        padding: 16px;\n      }\n\n      textarea,\n      pre,\n      code {\n        overflow: hidden;\n\n        font-family: ${cssVar.fontFamilyCode};\n        font-size: inherit;\n        line-height: inherit;\n        word-break: inherit;\n        word-wrap: break-word;\n        white-space: pre-wrap;\n      }\n    `,\n    textarea: css`\n      resize: none;\n\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n\n      overflow: hidden;\n\n      box-sizing: border-box;\n      width: 100%;\n      height: 100%;\n      padding: 0;\n      border: none;\n\n      color: transparent;\n      text-align: start;\n\n      background: transparent;\n      outline: none;\n      caret-color: ${cssVar.colorText};\n\n      &::placeholder {\n        color: ${cssVar.colorTextQuaternary};\n      }\n\n      &:focus {\n        border: none;\n        outline: none;\n        box-shadow: none;\n      }\n    `,\n  };\n});\n\nexport const variants = cva(styles.root, {\n  defaultVariants: {\n    variant: 'borderless',\n  },\n\n  variants: {\n    variant: {\n      filled: styles.filled,\n      outlined: styles.outlined,\n      borderless: styles.borderless,\n    },\n  },\n});\n"],"mappings":";;;;AAKA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;AAC5D,QAAO;EACL,YAAY,GACVA,cAAkB,+BAClB,GAAG;;;;;;;QAQJ;EACD,QAAQA,cAAkB;EAC1B,WAAW,GAAG;;;EAGd,UAAUA,cAAkB;EAC5B,MAAM,GAAG;;;;;;;uBAOU,OAAO,aAAa;;;;;;;;;;;;;;;uBAepB,OAAO,eAAe;;;;;;;;EAQzC,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;qBAoBI,OAAO,UAAU;;;iBAGrB,OAAO,oBAAoB;;;;;;;;;EASzC;EACD;AAEF,MAAa,WAAW,IAAI,OAAO,MAAM;CACvC,iBAAiB,EACf,SAAS,cACV;CAED,UAAU,EACR,SAAS;EACP,QAAQ,OAAO;EACf,UAAU,OAAO;EACjB,YAAY,OAAO;EACpB,EACF;CACF,CAAC"}

package/es/CodeEditor/type.d.mts

@@ -1,5 +1,4 @@
 import { FlexboxProps } from "../Flex/type.mjs";
-import "../Flex/index.mjs";
 import { TextAreaProps } from "../types/index.mjs";
 import { CSSProperties, Ref } from "react";
 

package/es/Collapse/Collapse.d.mts

@@ -1,8 +1,8 @@
 import { CollapseProps } from "./type.mjs";
-import * as react58 from "react";
+import * as _$react from "react";
 
 //#region src/Collapse/Collapse.d.ts
-declare const Collapse: react58.NamedExoticComponent<CollapseProps>;
+declare const Collapse: _$react.NamedExoticComponent<CollapseProps>;
 //#endregion
 export { Collapse };
 //# sourceMappingURL=Collapse.d.mts.map

package/es/Collapse/Collapse.mjs

@@ -1,14 +1,12 @@
-'use client';
-
+"use client";
 import FlexBasic_default from "../Flex/FlexBasic.mjs";
-import Icon_default from "../Icon/Icon.mjs";
+import Icon from "../Icon/Icon.mjs";
 import { DEFAULT_PADDING, getPadding, styles, variants } from "./style.mjs";
 import { isValidElement, memo, useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Collapse, ConfigProvider } from "antd";
 import { cx, useThemeMode } from "antd-style";
 import { ChevronDown } from "lucide-react";
-
 //#region src/Collapse/Collapse.tsx
 const Collapse$1 = memo(({ style, variant = "filled", gap = 0, className, padding = DEFAULT_PADDING, size, collapsible = true, items, styles: customStyles, classNames, ref, ...rest }) => {
 	const { isDarkMode } = useThemeMode();
@@ -26,7 +24,7 @@ const Collapse$1 = memo(({ style, variant = "filled", gap = 0, className, paddin
 			className: cx(styles.title, !desc && classNames?.header),
 			gap: 8,
 			style: desc ? void 0 : customStyles?.header,
-			children: [isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon_default, {
+			children: [isValidElement(icon) ? icon : /* @__PURE__ */ jsx(Icon, {
 				icon,
 				size: { size: "1.1em" }
 			}), content]
@@ -67,7 +65,7 @@ const Collapse$1 = memo(({ style, variant = "filled", gap = 0, className, paddin
 			items: antdItems,
 			ref,
 			size,
-			expandIcon: ({ isActive }) => /* @__PURE__ */ jsx(Icon_default, {
+			expandIcon: ({ isActive }) => /* @__PURE__ */ jsx(Icon, {
 				className: styles.icon,
 				icon: ChevronDown,
 				size: 16,
@@ -82,8 +80,7 @@ const Collapse$1 = memo(({ style, variant = "filled", gap = 0, className, paddin
 	});
 });
 Collapse$1.displayName = "Collapse";
-var Collapse_default = Collapse$1;
-
 //#endregion
-export { Collapse_default as default };
+export { Collapse$1 as default };
+
 //# sourceMappingURL=Collapse.mjs.map

package/es/Collapse/Collapse.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Collapse.mjs","names":["Collapse","Flexbox","Icon","AntdCollapse"],"sources":["../../src/Collapse/Collapse.tsx"],"sourcesContent":["'use client';\n\nimport { Collapse as AntdCollapse, ConfigProvider } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { ChevronDown } from 'lucide-react';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { DEFAULT_PADDING, getPadding, styles, variants } from './style';\nimport type { CollapseProps } from './type';\n\nconst Collapse = memo<CollapseProps>(\n  ({\n    style,\n    variant = 'filled',\n    gap = 0,\n    className,\n    padding = DEFAULT_PADDING,\n    size,\n    collapsible = true,\n    items,\n    styles: customStyles,\n    classNames,\n    ref,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n\n    const antdItems = useMemo(\n      () =>\n        items.map(({ icon, desc, label, ...itemRest }) => {\n          let content = (\n            <div\n              className={cx(styles.title, !icon && !desc && classNames?.header, classNames?.title)}\n              style={{\n                ...(!icon && !desc ? customStyles?.header : {}),\n                ...customStyles?.title,\n              }}\n            >\n              {label}\n            </div>\n          );\n\n          if (icon) {\n            content = (\n              <Flexbox\n                horizontal\n                className={cx(styles.title, !desc && classNames?.header)}\n                gap={8}\n                style={desc ? undefined : customStyles?.header}\n              >\n                {isValidElement(icon) ? icon : <Icon icon={icon} size={{ size: '1.1em' }} />}\n                {content}\n              </Flexbox>\n            );\n          }\n\n          if (desc) {\n            content = (\n              <Flexbox className={classNames?.header} style={customStyles?.header}>\n                {content}\n                <div className={cx(styles.desc, classNames?.desc)} style={customStyles?.desc}>\n                  {desc}\n                </div>\n              </Flexbox>\n            );\n          }\n\n          return {\n            label: content,\n            ...itemRest,\n          };\n        }),\n      [items, classNames, customStyles, styles],\n    );\n\n    return (\n      <ConfigProvider\n        theme={{\n          components: {\n            Collapse: {\n              contentPadding: getPadding(typeof padding === 'object' ? padding?.body : padding),\n              headerPadding: getPadding(typeof padding === 'object' ? padding?.header : padding),\n            },\n          },\n        }}\n      >\n        <AntdCollapse\n          ghost\n          className={cx(variants({ collapsible, gap: !!gap, isDarkMode, variant }), className)}\n          collapsible={collapsible ? 'header' : 'icon'}\n          items={antdItems}\n          ref={ref}\n          size={size}\n          expandIcon={({ isActive }) => (\n            <Icon\n              className={styles.icon}\n              icon={ChevronDown}\n              size={16}\n              style={{ rotate: isActive ? undefined : '-90deg' }}\n            />\n          )}\n          style={{\n            gap,\n            ...style,\n          }}\n          {...rest}\n        />\n      </ConfigProvider>\n    );\n  },\n);\n\nCollapse.displayName = 'Collapse';\n\nexport default Collapse;\n"],"mappings":";;;;;;;;;;;;AAaA,MAAMA,aAAW,MACd,EACC,OACA,UAAU,UACV,MAAM,GACN,WACA,UAAU,iBACV,MACA,cAAc,MACd,OACA,QAAQ,cACR,YACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,YAAY,cAEd,MAAM,KAAK,EAAE,MAAM,MAAM,OAAO,GAAG,eAAe;EAChD,IAAI,UACF,oBAAC;GACC,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,CAAC,QAAQ,YAAY,QAAQ,YAAY,MAAM;GACpF,OAAO;IACL,GAAI,CAAC,QAAQ,CAAC,OAAO,cAAc,SAAS,EAAE;IAC9C,GAAG,cAAc;IAClB;aAEA;IACG;AAGR,MAAI,KACF,WACE,qBAACC;GACC;GACA,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,YAAY,OAAO;GACxD,KAAK;GACL,OAAO,OAAO,SAAY,cAAc;cAEvC,eAAe,KAAK,GAAG,OAAO,oBAACC;IAAW;IAAM,MAAM,EAAE,MAAM,SAAS;KAAI,EAC3E;IACO;AAId,MAAI,KACF,WACE,qBAACD;GAAQ,WAAW,YAAY;GAAQ,OAAO,cAAc;cAC1D,SACD,oBAAC;IAAI,WAAW,GAAG,OAAO,MAAM,YAAY,KAAK;IAAE,OAAO,cAAc;cACrE;KACG;IACE;AAId,SAAO;GACL,OAAO;GACP,GAAG;GACJ;GACD,EACJ;EAAC;EAAO;EAAY;EAAc;EAAO,CAC1C;AAED,QACE,oBAAC;EACC,OAAO,EACL,YAAY,EACV,UAAU;GACR,gBAAgB,WAAW,OAAO,YAAY,WAAW,SAAS,OAAO,QAAQ;GACjF,eAAe,WAAW,OAAO,YAAY,WAAW,SAAS,SAAS,QAAQ;GACnF,EACF,EACF;YAED,oBAACE;GACC;GACA,WAAW,GAAG,SAAS;IAAE;IAAa,KAAK,CAAC,CAAC;IAAK;IAAY;IAAS,CAAC,EAAE,UAAU;GACpF,aAAa,cAAc,WAAW;GACtC,OAAO;GACF;GACC;GACN,aAAa,EAAE,eACb,oBAACD;IACC,WAAW,OAAO;IAClB,MAAM;IACN,MAAM;IACN,OAAO,EAAE,QAAQ,WAAW,SAAY,UAAU;KAClD;GAEJ,OAAO;IACL;IACA,GAAG;IACJ;GACD,GAAI;IACJ;GACa;EAGtB;AAED,WAAS,cAAc;AAEvB,uBAAeF"}
+{"version":3,"file":"Collapse.mjs","names":["Collapse","Flexbox","AntdCollapse"],"sources":["../../src/Collapse/Collapse.tsx"],"sourcesContent":["'use client';\n\nimport { Collapse as AntdCollapse, ConfigProvider } from 'antd';\nimport { cx, useThemeMode } from 'antd-style';\nimport { ChevronDown } from 'lucide-react';\nimport { isValidElement, memo, useMemo } from 'react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { DEFAULT_PADDING, getPadding, styles, variants } from './style';\nimport type { CollapseProps } from './type';\n\nconst Collapse = memo<CollapseProps>(\n  ({\n    style,\n    variant = 'filled',\n    gap = 0,\n    className,\n    padding = DEFAULT_PADDING,\n    size,\n    collapsible = true,\n    items,\n    styles: customStyles,\n    classNames,\n    ref,\n    ...rest\n  }) => {\n    const { isDarkMode } = useThemeMode();\n\n    const antdItems = useMemo(\n      () =>\n        items.map(({ icon, desc, label, ...itemRest }) => {\n          let content = (\n            <div\n              className={cx(styles.title, !icon && !desc && classNames?.header, classNames?.title)}\n              style={{\n                ...(!icon && !desc ? customStyles?.header : {}),\n                ...customStyles?.title,\n              }}\n            >\n              {label}\n            </div>\n          );\n\n          if (icon) {\n            content = (\n              <Flexbox\n                horizontal\n                className={cx(styles.title, !desc && classNames?.header)}\n                gap={8}\n                style={desc ? undefined : customStyles?.header}\n              >\n                {isValidElement(icon) ? icon : <Icon icon={icon} size={{ size: '1.1em' }} />}\n                {content}\n              </Flexbox>\n            );\n          }\n\n          if (desc) {\n            content = (\n              <Flexbox className={classNames?.header} style={customStyles?.header}>\n                {content}\n                <div className={cx(styles.desc, classNames?.desc)} style={customStyles?.desc}>\n                  {desc}\n                </div>\n              </Flexbox>\n            );\n          }\n\n          return {\n            label: content,\n            ...itemRest,\n          };\n        }),\n      [items, classNames, customStyles, styles],\n    );\n\n    return (\n      <ConfigProvider\n        theme={{\n          components: {\n            Collapse: {\n              contentPadding: getPadding(typeof padding === 'object' ? padding?.body : padding),\n              headerPadding: getPadding(typeof padding === 'object' ? padding?.header : padding),\n            },\n          },\n        }}\n      >\n        <AntdCollapse\n          ghost\n          className={cx(variants({ collapsible, gap: !!gap, isDarkMode, variant }), className)}\n          collapsible={collapsible ? 'header' : 'icon'}\n          items={antdItems}\n          ref={ref}\n          size={size}\n          expandIcon={({ isActive }) => (\n            <Icon\n              className={styles.icon}\n              icon={ChevronDown}\n              size={16}\n              style={{ rotate: isActive ? undefined : '-90deg' }}\n            />\n          )}\n          style={{\n            gap,\n            ...style,\n          }}\n          {...rest}\n        />\n      </ConfigProvider>\n    );\n  },\n);\n\nCollapse.displayName = 'Collapse';\n\nexport default Collapse;\n"],"mappings":";;;;;;;;;;AAaA,MAAMA,aAAW,MACd,EACC,OACA,UAAU,UACV,MAAM,GACN,WACA,UAAU,iBACV,MACA,cAAc,MACd,OACA,QAAQ,cACR,YACA,KACA,GAAG,WACC;CACJ,MAAM,EAAE,eAAe,cAAc;CAErC,MAAM,YAAY,cAEd,MAAM,KAAK,EAAE,MAAM,MAAM,OAAO,GAAG,eAAe;EAChD,IAAI,UACF,oBAAC,OAAD;GACE,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,CAAC,QAAQ,YAAY,QAAQ,YAAY,MAAM;GACpF,OAAO;IACL,GAAI,CAAC,QAAQ,CAAC,OAAO,cAAc,SAAS,EAAE;IAC9C,GAAG,cAAc;IAClB;aAEA;GACG,CAAA;AAGR,MAAI,KACF,WACE,qBAACC,mBAAD;GACE,YAAA;GACA,WAAW,GAAG,OAAO,OAAO,CAAC,QAAQ,YAAY,OAAO;GACxD,KAAK;GACL,OAAO,OAAO,KAAA,IAAY,cAAc;aAJ1C,CAMG,eAAe,KAAK,GAAG,OAAO,oBAAC,MAAD;IAAY;IAAM,MAAM,EAAE,MAAM,SAAS;IAAI,CAAA,EAC3E,QACO;;AAId,MAAI,KACF,WACE,qBAACA,mBAAD;GAAS,WAAW,YAAY;GAAQ,OAAO,cAAc;aAA7D,CACG,SACD,oBAAC,OAAD;IAAK,WAAW,GAAG,OAAO,MAAM,YAAY,KAAK;IAAE,OAAO,cAAc;cACrE;IACG,CAAA,CACE;;AAId,SAAO;GACL,OAAO;GACP,GAAG;GACJ;GACD,EACJ;EAAC;EAAO;EAAY;EAAc;EAAO,CAC1C;AAED,QACE,oBAAC,gBAAD;EACE,OAAO,EACL,YAAY,EACV,UAAU;GACR,gBAAgB,WAAW,OAAO,YAAY,WAAW,SAAS,OAAO,QAAQ;GACjF,eAAe,WAAW,OAAO,YAAY,WAAW,SAAS,SAAS,QAAQ;GACnF,EACF,EACF;YAED,oBAACC,UAAD;GACE,OAAA;GACA,WAAW,GAAG,SAAS;IAAE;IAAa,KAAK,CAAC,CAAC;IAAK;IAAY;IAAS,CAAC,EAAE,UAAU;GACpF,aAAa,cAAc,WAAW;GACtC,OAAO;GACF;GACC;GACN,aAAa,EAAE,eACb,oBAAC,MAAD;IACE,WAAW,OAAO;IAClB,MAAM;IACN,MAAM;IACN,OAAO,EAAE,QAAQ,WAAW,KAAA,IAAY,UAAU;IAClD,CAAA;GAEJ,OAAO;IACL;IACA,GAAG;IACJ;GACD,GAAI;GACJ,CAAA;EACa,CAAA;EAGtB;AAED,WAAS,cAAc"}

package/es/Collapse/index.mjs

@@ -1,3 +1,2 @@
-import Collapse_default from "./Collapse.mjs";
-
-export { Collapse_default as default };
+import Collapse from "./Collapse.mjs";
+export { Collapse as default };