@antv/gpt-vis 0.0.3 → 0.0.5

package/dist/cjs/ChartCodeRender/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import './index.css';
 import { WithChartCodeOptions } from './type';
 export declare const withChartCode: (options: WithChartCodeOptions) => keyof JSX.IntrinsicElements | import("hast-util-to-jsx-runtime/lib/components").Component<React.ClassAttributes<HTMLElement> & React.HTMLAttributes<HTMLElement> & import("hast-util-to-jsx-runtime/lib/components").ExtraProps> | undefined;
 /**

package/dist/cjs/ChartCodeRender/index.js

@@ -34,12 +34,30 @@ __export(ChartCodeRender_exports, {
 });
 module.exports = __toCommonJS(ChartCodeRender_exports);
 var import_icons = require("@ant-design/icons");
-var import_lodash_es = require("lodash-es");
+var import_lodash = require("lodash");
 var import_react = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
 var import_constants = require("../constants");
-var import_index = require("./index.css");
+var StyledGPTVis = import_styled_components.default.div`
+  min-width: 600px;
+  max-width: 100%;
+`;
+var StyledLoading = import_styled_components.default.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  width: 400px;
+  height: 400px;
+  background-image: linear-gradient(135deg, #e3f3ff 0%, #f1eeff 100%);
+  color: rgba(0, 0, 0, 88%);
+
+  &-icon {
+    margin-bottom: 6px;
+  }
+`;
 var Loading = () => {
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "gpt-vis-loading" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "gpt-vis-loading-icon" }, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement(StyledLoading, { className: "gpt-vis-loading" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "gpt-vis-loading-icon" }, /* @__PURE__ */ import_react.default.createElement(
     import_icons.LoadingOutlined,
     {
       style: { fontSize: "24px", color: "rgb(56, 177, 246)" }
@@ -89,7 +107,7 @@ var withCodeBlock = (options) => {
       if (!ChartComponent) {
         return /* @__PURE__ */ import_react.default.createElement("code", null, `Chart type "${type}" is not supported.`);
       }
-      return /* @__PURE__ */ import_react.default.createElement("div", { className: "gpt-vis" }, /* @__PURE__ */ import_react.default.createElement(ChartComponent, { ...chartJson }));
+      return /* @__PURE__ */ import_react.default.createElement(StyledGPTVis, { className: "gpt-vis" }, /* @__PURE__ */ import_react.default.createElement(ChartComponent, { ...chartJson }));
     }
     const languageName = ((_a = className.match(/language-(.*)/)) == null ? void 0 : _a[1]) || "";
     const extraLanguageRenderers = extraRenderers || languageRenderers;
@@ -111,7 +129,7 @@ var withChartCode = (options) => {
 var withDefaultChartCode = (options) => {
   return withChartCode({
     ...options,
-    components: [import_constants.DEFAULT_CHART_COMPONENTS, ...(0, import_lodash_es.get)(options, "components", [])]
+    components: [import_constants.DEFAULT_CHART_COMPONENTS, ...(0, import_lodash.get)(options, "components", [])]
   });
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/esm/ChartCodeRender/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import './index.css';
 import { WithChartCodeOptions } from './type';
 export declare const withChartCode: (options: WithChartCodeOptions) => keyof JSX.IntrinsicElements | import("hast-util-to-jsx-runtime/lib/components").Component<React.ClassAttributes<HTMLElement> & React.HTMLAttributes<HTMLElement> & import("hast-util-to-jsx-runtime/lib/components").ExtraProps> | undefined;
 /**

package/dist/esm/ChartCodeRender/index.js

@@ -5,12 +5,20 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["children", "className", "node"];
 import { LoadingOutlined } from '@ant-design/icons';
-import { get } from 'lodash-es';
+import { get } from 'lodash';
 import React, { useRef, useState } from 'react';
+import styled from 'styled-components';
 import { DEFAULT_CHART_COMPONENTS } from "../constants";
-import "./index.css";
+var StyledGPTVis = styled.div.withConfig({
+  displayName: "StyledGPTVis",
+  componentId: "gpt-vis-ed04__sc-1osp6pj-0"
+})(["min-width:600px;max-width:100%;"]);
+var StyledLoading = styled.div.withConfig({
+  displayName: "StyledLoading",
+  componentId: "gpt-vis-ed04__sc-1osp6pj-1"
+})(["display:flex;align-items:center;justify-content:center;flex-direction:column;width:400px;height:400px;background-image:linear-gradient(135deg,#e3f3ff 0%,#f1eeff 100%);color:rgba(0,0,0,88%);&-icon{margin-bottom:6px;}"]);
 var Loading = function Loading() {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement(StyledLoading, {
     className: "gpt-vis-loading"
   }, /*#__PURE__*/React.createElement("div", {
     className: "gpt-vis-loading-icon"
@@ -79,7 +87,7 @@ var withCodeBlock = function withCodeBlock(options) {
 
       // Render the supported chart component with data
 
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React.createElement(StyledGPTVis, {
         className: "gpt-vis"
       }, /*#__PURE__*/React.createElement(ChartComponent, chartJson));
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/gpt-vis",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "A chart library for LLM Agent",
   "repository": {
     "type": "git",
@@ -59,7 +59,7 @@
     "@antv/l7": "^2.22.0",
     "@antv/larkmap": "^1.4.17",
     "@babel/runtime": "^7.18.0",
-    "lodash-es": "^4.17.21",
+    "lodash": "^4.17.21",
     "react-markdown": "^9.0.1",
     "rehype-raw": "^7.0.0",
     "styled-components": "^6.0.7"
@@ -73,7 +73,6 @@
     "@testing-library/jest-dom": "^5.1.1",
     "@testing-library/react": "^15.0.0",
     "@types/jest": "^29.4.0",
-    "@types/lodash-es": "^4.17.12",
     "@types/react": "^18.0.0",
     "antd": "^5.0.0",
     "husky": "^8.0.0",

package/dist/cjs/ChartCodeRender/index.css

@@ -1,19 +0,0 @@
-.gpt-vis {
-  min-width: 600px;
-  max-width: 100%;
-}
-
-.gpt-vis-loading {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  width: 400px;
-  height: 400px;
-  background-image: linear-gradient(135deg, #e3f3ff 0%, #f1eeff 100%);
-  color: rgba(0, 0, 0, 88%);
-
-  &-icon {
-    margin-bottom: 6px;
-  }
-}

package/dist/esm/ChartCodeRender/index.css

@@ -1,19 +0,0 @@
-.gpt-vis {
-  min-width: 600px;
-  max-width: 100%;
-}
-
-.gpt-vis-loading {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  width: 400px;
-  height: 400px;
-  background-image: linear-gradient(135deg, #e3f3ff 0%, #f1eeff 100%);
-  color: rgba(0, 0, 0, 88%);
-
-  &-icon {
-    margin-bottom: 6px;
-  }
-}