cosey 0.6.17 → 0.6.18

package/components/copy/copy.style.js

@@ -4,10 +4,15 @@ var stdin_default = getSimpleStyleHook("CoMask", (token) => {
   const { componentCls } = token;
   return {
     [componentCls]: {
+      width: token.sizeLG,
+      height: `${token.sizeLG} !important`,
+      fontSize: token.fontSize,
+      transition: "none",
       "&:not(.is-copied):hover": {
         opacity: 0.75
       },
       "&.is-copied": {
+        fontSize: token.fontSizeXL,
         [`${componentCls}-icon`]: {
           color: token.colorSuccess
         }

package/components/editor/editor.style.js

@@ -1,4 +1,4 @@
-import { getHljs } from '../highlight/highlight.style.js';
+import { getHljsDark } from '../highlight/highlight.style.js';
 import { getGlobalStyleHook } from '../theme/getGlobalStyleHook.js';
 import { getSimpleStyleHook } from '../theme/getSimpleStyleHook.js';
 import { getTruncateStyle } from '../style/mixins.js';
@@ -357,7 +357,7 @@ const getEditorButtonStyle = (token) => {
   };
 };
 const useHljsStyle = getGlobalStyleHook("CoGlobalHighlight", () => {
-  return getHljs();
+  return getHljsDark();
 });
 var stdin_default = getSimpleStyleHook("CoEditor", (token) => {
   return [getEditorStyle(token), getEditorToolbarStyle(token), getEditorButtonStyle(token)];

package/components/highlight/highlight.js

@@ -1,4 +1,5 @@
 import { defineComponent, computed, createVNode } from 'vue';
+import { ElScrollbar } from 'element-plus';
 import { highlightSlots, highlightProps } from './highlight.api.js';
 import stdin_default$1 from './highlight.style.js';
 import stdin_default$2 from '../copy/copy.js';
@@ -22,14 +23,16 @@ var stdin_default = defineComponent({
     return () => {
       return createVNode("div", {
         "class": [hashId.value, prefixCls.value]
-      }, [createVNode("pre", {
-        "style": {
-          maxHeight: props.maxHeight
-        }
-      }, [createVNode("code", {
-        "class": "hljs",
-        "innerHTML": highlightedCode.value
-      }, null)]), createVNode("div", {
+      }, [createVNode(ElScrollbar, {
+        "tag": "pre",
+        "class": `${prefixCls.value}-scroll`,
+        "view-class": "hljs",
+        "maxHeight": props.maxHeight
+      }, {
+        default: () => [createVNode("code", {
+          "innerHTML": highlightedCode.value
+        }, null)]
+      }), createVNode("div", {
         "class": `${prefixCls.value}-copy`
       }, [createVNode(stdin_default$2, {
         "text": props.code,

package/components/highlight/highlight.style.d.ts

@@ -1,5 +1,6 @@
 import { CSSObject } from '../cssinjs';
-export declare function getHljs(): CSSObject;
+export declare function getHljsDark(): CSSObject;
+export declare function getHljsLight(): CSSObject;
 declare const _default: (_prefixCls?: import("vue").ComputedRef<string> | string, themeManager?: import("../theme/theme-context").ThemeManager) => {
     hashId: import("vue").Ref<string, string>;
 };

package/components/highlight/highlight.style.js

@@ -1,6 +1,6 @@
 import { getSimpleStyleHook } from '../theme/getSimpleStyleHook.js';
 
-function getHljs() {
+function getHljsDark() {
   return {
     ".hljs": {
       color: "#abb2bf",
@@ -42,31 +42,71 @@ function getHljs() {
     }
   };
 }
+function getHljsLight() {
+  return {
+    ".hljs": {
+      color: "#383a42",
+      background: "#fafafa"
+    },
+    ".hljs-comment,.hljs-quote": {
+      color: "#a0a1a7",
+      fontStyle: "italic"
+    },
+    ".hljs-doctag,.hljs-keyword,.hljs-formula": {
+      color: "#a626a4"
+    },
+    ".hljs-section,.hljs-name,.hljs-selector-tag,.hljs-deletion,.hljs-subst": {
+      color: "#e45649"
+    },
+    ".hljs-literal": {
+      color: "#0184bb"
+    },
+    ".hljs-string,.hljs-regexp,.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string": {
+      color: "#50a14f"
+    },
+    ".hljs-attr,.hljs-variable,.hljs-template-variable,.hljs-type,.hljs-selector-class,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-number": {
+      color: "#986801"
+    },
+    ".hljs-symbol,.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-title": {
+      color: "#4078f2"
+    },
+    ".hljs-built_in,.hljs-title.class_,.hljs-class .hljs-title": {
+      color: "#c18401"
+    },
+    ".hljs-emphasis": {
+      fontStyle: "italic"
+    },
+    ".hljs-strong": {
+      fontWeight: "bold"
+    },
+    ".hljs-link": {
+      textDecoration: "underline"
+    }
+  };
+}
 var stdin_default = getSimpleStyleHook("CoHighlight", (token) => {
   const { componentCls } = token;
   return {
     [componentCls]: {
       position: "relative",
-      pre: {
-        padding: token.paddingSM,
-        overflow: "auto",
-        color: "#abb2bf",
-        background: "#282c34",
+      [`${componentCls}-scroll`]: {
         borderRadius: token.borderRadius
       },
+      pre: {
+        padding: token.paddingSM
+      },
       [`${componentCls}-copy`]: {
         position: "absolute",
         insetBlockStart: token.sizeXXS,
         insetInlineEnd: token.sizeXXS,
-        zIndex: 10,
-        color: token.colorWhite,
-        "&:hover,&:active": {
-          color: `${token.colorWhite} !important`
-        }
+        zIndex: 10
       },
-      ...getHljs()
+      ...getHljsLight(),
+      ":root.dark &": {
+        ...getHljsDark()
+      }
     }
   };
 });
 
-export { stdin_default as default, getHljs };
+export { stdin_default as default, getHljsDark, getHljsLight };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cosey",
-  "version": "0.6.17",
+  "version": "0.6.18",
   "description": "基于 Vue3 + vite 的后台管理系统框架",
   "type": "module",
   "main": "index.js",