@code-hike/mdx - npm Package Compare versions

Comparing version 0.3.0--canary.105.d3f27ad.0 to 0.3.0--canary.111.04b44e6.0

dist/components.cjs.js

@@ -296,3 +296,3 @@ 'use strict';
         : ((_c = (_b = theme.tokenColors.find(function (tc) { var _a; return (_a = tc.scope) === null || _a === void 0 ? void 0 : _a.includes("string"); })) === null || _b === void 0 ? void 0 : _b.settings) === null || _c === void 0 ? void 0 : _c.foreground) || "yellow";
-    return (React__default['default'].createElement("span", { style: { outline: "2px solid " + border } }, children));
+    return (React__default['default'].createElement("span", { className: "ch-code-box-annotation", style: { outline: "2px solid " + border } }, children));
 }
@@ -304,3 +304,11 @@ function Background(_a) {
             theme.colors["editor.selectionHighlightBackground"]);
-    return (React__default['default'].createElement("div", { style: __assign(__assign({}, style), { background: bg }) }, children));
+    return (React__default['default'].createElement("div", { style: __assign(__assign({}, style), { background: bg }), className: "ch-code-bg-annotation" },
+        React__default['default'].createElement("span", { className: "ch-code-bg-annotation-border", style: {
+                background: "#00a2d3",
+                width: "3px",
+                height: "100%",
+                position: "absolute",
+                left: 0,
+            } }),
+        children));
 }
@@ -307,0 +315,0 @@ function Label(_a) {

dist/components.d.ts

@@ -19,3 +19,3 @@ /// <reference types="react" />
         data: any;
-        theme: import("@code-hike/smooth-code/dist/themes").EditorTheme;
+        theme: import("@code-hike/utils").EditorTheme;
     }) => import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)>) | undefined>;
@@ -22,0 +22,0 @@ Annotation: typeof Annotation;

dist/components.esm.js

@@ -288,3 +288,3 @@ import React from 'react';
         : ((_c = (_b = theme.tokenColors.find(function (tc) { var _a; return (_a = tc.scope) === null || _a === void 0 ? void 0 : _a.includes("string"); })) === null || _b === void 0 ? void 0 : _b.settings) === null || _c === void 0 ? void 0 : _c.foreground) || "yellow";
-    return (React.createElement("span", { style: { outline: "2px solid " + border } }, children));
+    return (React.createElement("span", { className: "ch-code-box-annotation", style: { outline: "2px solid " + border } }, children));
 }
@@ -296,3 +296,11 @@ function Background(_a) {
             theme.colors["editor.selectionHighlightBackground"]);
-    return (React.createElement("div", { style: __assign(__assign({}, style), { background: bg }) }, children));
+    return (React.createElement("div", { style: __assign(__assign({}, style), { background: bg }), className: "ch-code-bg-annotation" },
+        React.createElement("span", { className: "ch-code-bg-annotation-border", style: {
+                background: "#00a2d3",
+                width: "3px",
+                height: "100%",
+                position: "absolute",
+                left: 0,
+            } }),
+        children));
 }
@@ -299,0 +307,0 @@ function Label(_a) {

dist/index.cjs.js

@@ -136,3 +136,3 @@ 'use strict';
         : ((_c = (_b = theme.tokenColors.find(function (tc) { var _a; return (_a = tc.scope) === null || _a === void 0 ? void 0 : _a.includes("string"); })) === null || _b === void 0 ? void 0 : _b.settings) === null || _c === void 0 ? void 0 : _c.foreground) || "yellow";
-    return (React__default['default'].createElement("span", { style: { outline: "2px solid " + border } }, children));
+    return (React__default['default'].createElement("span", { className: "ch-code-box-annotation", style: { outline: "2px solid " + border } }, children));
 }
@@ -144,3 +144,11 @@ function Background(_a) {
             theme.colors["editor.selectionHighlightBackground"]);
-    return (React__default['default'].createElement("div", { style: __assign(__assign({}, style), { background: bg }) }, children));
+    return (React__default['default'].createElement("div", { style: __assign(__assign({}, style), { background: bg }), className: "ch-code-bg-annotation" },
+        React__default['default'].createElement("span", { className: "ch-code-bg-annotation-border", style: {
+                background: "#00a2d3",
+                width: "3px",
+                height: "100%",
+                position: "absolute",
+                left: 0,
+            } }),
+        children));
 }
@@ -479,2 +487,4 @@ function Label(_a) {
 }
+var CH_CODE_CONFIG_PLACEHOLDER = "CH_CodeConfig";
+var CH_CODE_CONFIG_VAR_NAME = "chCodeConfig";
 function toJSX(node, _a) {
@@ -494,22 +504,49 @@ var _b = _a.type, type = _b === void 0 ? "mdxJsxFlowElement" : _b, props = _a.props, name = _a.name, _c = _a.appendProps, appendProps = _c === void 0 ? false : _c;
         }
-        node.attributes.push({
-            type: "mdxJsxAttribute",
-            name: key,
-            value: {
-                type: "mdxJsxAttributeValueExpression",
-                value: JSON.stringify(props[key]),
-                data: {
-                    estree: {
-                        type: "Program",
-                        body: [
-                            {
-                                type: "ExpressionStatement",
-                                expression: valueToEstree(props[key]),
-                            },
-                        ],
-                        sourceType: "module",
+        if (props[key] === CH_CODE_CONFIG_PLACEHOLDER) {
+            node.attributes.push({
+                type: "mdxJsxAttribute",
+                name: key,
+                value: {
+                    type: "mdxJsxAttributeValueExpression",
+                    value: CH_CODE_CONFIG_VAR_NAME,
+                    data: {
+                        estree: {
+                            type: "Program",
+                            body: [
+                                {
+                                    type: "ExpressionStatement",
+                                    expression: {
+                                        type: "Identifier",
+                                        name: CH_CODE_CONFIG_VAR_NAME,
+                                    },
+                                },
+                            ],
+                            sourceType: "module",
+                        },
                     },
                 },
-            },
-        });
+            });
+        }
+        else {
+            node.attributes.push({
+                type: "mdxJsxAttribute",
+                name: key,
+                value: {
+                    type: "mdxJsxAttributeValueExpression",
+                    value: JSON.stringify(props[key]),
+                    data: {
+                        estree: {
+                            type: "Program",
+                            body: [
+                                {
+                                    type: "ExpressionStatement",
+                                    expression: valueToEstree(props[key]),
+                                },
+                            ],
+                            sourceType: "module",
+                        },
+                    },
+                },
+            });
+        }
     });
@@ -704,5 +741,3 @@ }
                         files: [file],
-                        codeConfig: {
-                            theme: config.theme,
-                        },
+                        codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                     };
@@ -763,5 +798,3 @@ return [2 /*return*/, props];
                         files: allFiles,
-                        codeConfig: {
-                            theme: config.theme,
-                        },
+                        codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                     };
@@ -1089,3 +1122,3 @@ return [2 /*return*/, props];
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1141,3 +1174,3 @@ presetConfig: presetConfig,
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1193,3 +1226,3 @@ presetConfig: presetConfig,
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1206,5 +1239,4 @@ presetConfig: presetConfig,
 
-function remarkCodeHike(_a) {
+function remarkCodeHike(config) {
     var _this = this;
-    var theme = _a.theme;
     return function (tree) { return __awaiter(_this, void 0, void 0, function () {
@@ -1221,2 +1253,3 @@ var hasCodeHikeImport, e_1;
                     });
+                    addConfig(tree, config);
                     if (!hasCodeHikeImport) {
@@ -1228,18 +1261,18 @@ addImportNode(tree);
                     _a.trys.push([1, 8, , 9]);
-                    return [4 /*yield*/, transformScrollycodings(tree, { theme: theme })];
+                    return [4 /*yield*/, transformScrollycodings(tree, config)];
                 case 2:
                     _a.sent();
-                    return [4 /*yield*/, transformSpotlights(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSpotlights(tree, config)];
                 case 3:
                     _a.sent();
-                    return [4 /*yield*/, transformSlideshows(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSlideshows(tree, config)];
                 case 4:
                     _a.sent();
-                    return [4 /*yield*/, transformSections(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSections(tree, config)];
                 case 5:
                     _a.sent();
-                    return [4 /*yield*/, transformEditorNodes(tree, { theme: theme })];
+                    return [4 /*yield*/, transformEditorNodes(tree, config)];
                 case 6:
                     _a.sent();
-                    return [4 /*yield*/, transformCodeNodes(tree, { theme: theme })];
+                    return [4 /*yield*/, transformCodeNodes(tree, config)];
                 case 7:
@@ -1257,2 +1290,35 @@ _a.sent();
 }
+function addConfig(tree, config) {
+    tree.children.unshift({
+        type: "mdxjsEsm",
+        value: "export const chCodeConfig = {}",
+        data: {
+            estree: {
+                type: "Program",
+                body: [
+                    {
+                        type: "ExportNamedDeclaration",
+                        declaration: {
+                            type: "VariableDeclaration",
+                            declarations: [
+                                {
+                                    type: "VariableDeclarator",
+                                    id: {
+                                        type: "Identifier",
+                                        name: CH_CODE_CONFIG_VAR_NAME,
+                                    },
+                                    init: valueToEstree(config),
+                                },
+                            ],
+                            kind: "const",
+                        },
+                        specifiers: [],
+                        source: null,
+                    },
+                ],
+                sourceType: "module",
+            },
+        },
+    });
+}
 function addImportNode(tree) {
@@ -1259,0 +1325,0 @@ tree.children.unshift({

dist/index.esm.js

@@ -122,3 +122,3 @@ import { highlight } from '@code-hike/highlighter';
         : ((_c = (_b = theme.tokenColors.find(function (tc) { var _a; return (_a = tc.scope) === null || _a === void 0 ? void 0 : _a.includes("string"); })) === null || _b === void 0 ? void 0 : _b.settings) === null || _c === void 0 ? void 0 : _c.foreground) || "yellow";
-    return (React.createElement("span", { style: { outline: "2px solid " + border } }, children));
+    return (React.createElement("span", { className: "ch-code-box-annotation", style: { outline: "2px solid " + border } }, children));
 }
@@ -130,3 +130,11 @@ function Background(_a) {
             theme.colors["editor.selectionHighlightBackground"]);
-    return (React.createElement("div", { style: __assign(__assign({}, style), { background: bg }) }, children));
+    return (React.createElement("div", { style: __assign(__assign({}, style), { background: bg }), className: "ch-code-bg-annotation" },
+        React.createElement("span", { className: "ch-code-bg-annotation-border", style: {
+                background: "#00a2d3",
+                width: "3px",
+                height: "100%",
+                position: "absolute",
+                left: 0,
+            } }),
+        children));
 }
@@ -465,2 +473,4 @@ function Label(_a) {
 }
+var CH_CODE_CONFIG_PLACEHOLDER = "CH_CodeConfig";
+var CH_CODE_CONFIG_VAR_NAME = "chCodeConfig";
 function toJSX(node, _a) {
@@ -480,22 +490,49 @@ var _b = _a.type, type = _b === void 0 ? "mdxJsxFlowElement" : _b, props = _a.props, name = _a.name, _c = _a.appendProps, appendProps = _c === void 0 ? false : _c;
         }
-        node.attributes.push({
-            type: "mdxJsxAttribute",
-            name: key,
-            value: {
-                type: "mdxJsxAttributeValueExpression",
-                value: JSON.stringify(props[key]),
-                data: {
-                    estree: {
-                        type: "Program",
-                        body: [
-                            {
-                                type: "ExpressionStatement",
-                                expression: valueToEstree(props[key]),
-                            },
-                        ],
-                        sourceType: "module",
+        if (props[key] === CH_CODE_CONFIG_PLACEHOLDER) {
+            node.attributes.push({
+                type: "mdxJsxAttribute",
+                name: key,
+                value: {
+                    type: "mdxJsxAttributeValueExpression",
+                    value: CH_CODE_CONFIG_VAR_NAME,
+                    data: {
+                        estree: {
+                            type: "Program",
+                            body: [
+                                {
+                                    type: "ExpressionStatement",
+                                    expression: {
+                                        type: "Identifier",
+                                        name: CH_CODE_CONFIG_VAR_NAME,
+                                    },
+                                },
+                            ],
+                            sourceType: "module",
+                        },
                     },
                 },
-            },
-        });
+            });
+        }
+        else {
+            node.attributes.push({
+                type: "mdxJsxAttribute",
+                name: key,
+                value: {
+                    type: "mdxJsxAttributeValueExpression",
+                    value: JSON.stringify(props[key]),
+                    data: {
+                        estree: {
+                            type: "Program",
+                            body: [
+                                {
+                                    type: "ExpressionStatement",
+                                    expression: valueToEstree(props[key]),
+                                },
+                            ],
+                            sourceType: "module",
+                        },
+                    },
+                },
+            });
+        }
     });
@@ -690,5 +727,3 @@ }
                         files: [file],
-                        codeConfig: {
-                            theme: config.theme,
-                        },
+                        codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                     };
@@ -749,5 +784,3 @@ return [2 /*return*/, props];
                         files: allFiles,
-                        codeConfig: {
-                            theme: config.theme,
-                        },
+                        codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                     };
@@ -1075,3 +1108,3 @@ return [2 /*return*/, props];
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1127,3 +1160,3 @@ presetConfig: presetConfig,
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1179,3 +1212,3 @@ presetConfig: presetConfig,
                         props: {
-                            codeConfig: { theme: theme },
+                            codeConfig: CH_CODE_CONFIG_PLACEHOLDER,
                             editorSteps: editorSteps,
@@ -1192,5 +1225,4 @@ presetConfig: presetConfig,
 
-function remarkCodeHike(_a) {
+function remarkCodeHike(config) {
     var _this = this;
-    var theme = _a.theme;
     return function (tree) { return __awaiter(_this, void 0, void 0, function () {
@@ -1207,2 +1239,3 @@ var hasCodeHikeImport, e_1;
                     });
+                    addConfig(tree, config);
                     if (!hasCodeHikeImport) {
@@ -1214,18 +1247,18 @@ addImportNode(tree);
                     _a.trys.push([1, 8, , 9]);
-                    return [4 /*yield*/, transformScrollycodings(tree, { theme: theme })];
+                    return [4 /*yield*/, transformScrollycodings(tree, config)];
                 case 2:
                     _a.sent();
-                    return [4 /*yield*/, transformSpotlights(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSpotlights(tree, config)];
                 case 3:
                     _a.sent();
-                    return [4 /*yield*/, transformSlideshows(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSlideshows(tree, config)];
                 case 4:
                     _a.sent();
-                    return [4 /*yield*/, transformSections(tree, { theme: theme })];
+                    return [4 /*yield*/, transformSections(tree, config)];
                 case 5:
                     _a.sent();
-                    return [4 /*yield*/, transformEditorNodes(tree, { theme: theme })];
+                    return [4 /*yield*/, transformEditorNodes(tree, config)];
                 case 6:
                     _a.sent();
-                    return [4 /*yield*/, transformCodeNodes(tree, { theme: theme })];
+                    return [4 /*yield*/, transformCodeNodes(tree, config)];
                 case 7:
@@ -1243,2 +1276,35 @@ _a.sent();
 }
+function addConfig(tree, config) {
+    tree.children.unshift({
+        type: "mdxjsEsm",
+        value: "export const chCodeConfig = {}",
+        data: {
+            estree: {
+                type: "Program",
+                body: [
+                    {
+                        type: "ExportNamedDeclaration",
+                        declaration: {
+                            type: "VariableDeclaration",
+                            declarations: [
+                                {
+                                    type: "VariableDeclarator",
+                                    id: {
+                                        type: "Identifier",
+                                        name: CH_CODE_CONFIG_VAR_NAME,
+                                    },
+                                    init: valueToEstree(config),
+                                },
+                            ],
+                            kind: "const",
+                        },
+                        specifiers: [],
+                        source: null,
+                    },
+                ],
+                sourceType: "module",
+            },
+        },
+    });
+}
 function addImportNode(tree) {
@@ -1245,0 +1311,0 @@ tree.children.unshift({

dist/plugin.d.ts

 import { Node } from "unist";
-export declare function remarkCodeHike({ theme }: {
+declare type CodeHikeConfig = {
     theme: any;
-}): (tree: Node) => Promise<void>;
+    lineNumbers?: boolean;
+};
+export declare function remarkCodeHike(config: CodeHikeConfig): (tree: Node) => Promise<void>;
+export {};

dist/plugin/unist-utils.d.ts

@@ -9,2 +9,4 @@ import { Node, Parent } from "unist";
 export declare function visitAsync(tree: Node, type: string | string[], visitor: (node: Node, index: number, parent: Parent | undefined) => void | Promise<any>): Promise<void>;
+export declare const CH_CODE_CONFIG_PLACEHOLDER: any;
+export declare const CH_CODE_CONFIG_VAR_NAME = "chCodeConfig";
 export declare function toJSX(node: Node, { type, props, name, appendProps, }: {
@@ -11,0 +13,0 @@ type?: string;

package.json

 {
   "name": "@code-hike/mdx",
-  "version": "0.3.0--canary.105.d3f27ad.0",
+  "version": "0.3.0--canary.111.04b44e6.0",
   "main": "dist/index.cjs.js",
@@ -20,3 +20,3 @@ "typings": "dist/index.d.ts",
   "devDependencies": {
-    "@code-hike/script": "0.3.0--canary.105.d3f27ad.0",
+    "@code-hike/script": "0.3.0--canary.111.04b44e6.0",
     "@types/react": "^17.0.2",
@@ -26,8 +26,8 @@ "react": "^17.0.2"
   "dependencies": {
-    "@code-hike/highlighter": "0.3.0--canary.105.d3f27ad.0",
-    "@code-hike/mini-browser": "0.3.0--canary.105.d3f27ad.0",
-    "@code-hike/mini-editor": "0.3.0--canary.105.d3f27ad.0",
-    "@code-hike/scroller": "0.3.0--canary.105.d3f27ad.0",
-    "@code-hike/smooth-code": "0.3.0--canary.105.d3f27ad.0",
-    "@code-hike/utils": "0.3.0--canary.105.d3f27ad.0",
+    "@code-hike/highlighter": "0.3.0--canary.111.04b44e6.0",
+    "@code-hike/mini-browser": "0.3.0--canary.111.04b44e6.0",
+    "@code-hike/mini-editor": "0.3.0--canary.111.04b44e6.0",
+    "@code-hike/scroller": "0.3.0--canary.111.04b44e6.0",
+    "@code-hike/smooth-code": "0.3.0--canary.111.04b44e6.0",
+    "@code-hike/utils": "0.3.0--canary.111.04b44e6.0",
     "@codesandbox/sandpack-client": "^0.1.20",
@@ -58,3 +58,3 @@ "estree-util-value-to-estree": "^1.3.0",
   },
-  "gitHead": "d3f27aded88764d43892bb074815fd8fc089bf4c"
+  "gitHead": "04b44e6d7fb3798aebe32eebcd3fba6ebb55b82e"
 }

No alert changes

Improved metrics

Total package byte prevSize

161431

increased by4.16%

Number of downloads

9230

increased by6.67%

Lines of code

3475

increased by4.61%

Dependency changes

• + Added@code-hike/classer@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/highlighter@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/mini-browser@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/mini-editor@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/mini-frame@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/mini-terminal@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/scroller@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/smooth-code@0.3.0--canary.111.04b44e6.0(transitive)

• + Added@code-hike/utils@0.3.0--canary.111.04b44e6.0(transitive)

• - Removed@code-hike/classer@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/highlighter@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/mini-browser@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/mini-editor@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/mini-frame@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/mini-terminal@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/scroller@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/smooth-code@0.3.0--canary.105.d3f27ad.0(transitive)

• - Removed@code-hike/utils@0.3.0--canary.105.d3f27ad.0(transitive)

• Updated@code-hike/highlighter@0.3.0--canary.111.04b44e6.0

• Updated@code-hike/mini-browser@0.3.0--canary.111.04b44e6.0

• Updated@code-hike/mini-editor@0.3.0--canary.111.04b44e6.0

• Updated@code-hike/scroller@0.3.0--canary.111.04b44e6.0

• Updated@code-hike/smooth-code@0.3.0--canary.111.04b44e6.0

• Updated@code-hike/utils@0.3.0--canary.111.04b44e6.0