@ray-js/code-sandbox 0.0.4 → 0.0.6

package/lib/codesandbox/index.js

@@ -26,7 +26,7 @@ const CodeSandbox = _ref => {
     react: ReactLib
   });
   const [title, setTitle] = React.useState(defaultTitle);
-  const [content, setContent] = React.useState( /*#__PURE__*/React.createElement(context.__loading__, null));
+  const [content, setContent] = React.useState(/*#__PURE__*/React.createElement(context.__loading__, null));
   // @ts-ignore
   context.___setContent___ = setContent;
   // @ts-ignore

package/lib/loading/index.js

@@ -1,6 +1,6 @@
 import { Button, View } from '@ray-js/ray';
 import React from 'react';
-import Loading from '@ray-js/components-ty-loading';
+import Loading from './ray-loading';
 import styles from './index.module.less';
 export const SandboxLoading = _ref => {
   let {

package/lib/loading/ray-loading/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IProps } from './props';
+declare const Loading: React.FC<IProps>;
+export default Loading;

package/lib/loading/ray-loading/index.js

@@ -0,0 +1,32 @@
+/* eslint-disable react/self-closing-comp */
+/* eslint-disable react/no-unknown-property */
+import React from 'react';
+import styles from './index.module.less';
+import { defaultProps } from './props';
+import { View } from '@ray-js/ray';
+function createSvgIcon(svg) {
+  return `data:image/svg+xml,${encodeURIComponent(`${svg}`)}`;
+}
+function CircularLoading(_ref) {
+  let {
+    color = '#1989FA'
+  } = _ref;
+  return createSvgIcon(`<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="32" height="32" viewBox="0 0 32 32"><defs><clipPath id="master_svg0_1695_29273"><rect x="0" y="0" width="32" height="32" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_1695_29273)"><g><path d="M14.73077392578125,8.807690000000001L14.73077392578125,6.26923C14.73077392578125,5.568254,15.29902692578125,5,16.00000392578125,5C16.70097392578125,5,17.26923392578125,5.568254,17.26923392578125,6.26923L17.26923392578125,8.807690000000001C17.26923392578125,9.50867,16.70097392578125,10.07693,16.00000392578125,10.07693C15.29902692578125,10.07693,14.73077392578125,9.50867,14.73077392578125,8.807690000000001Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(0.7071067690849304,0.7071067690849304,-0.7071067690849304,0.7071067690849304,11.880707750418878,-14.033822285849965)" style="opacity:0.05000000074505806;"><path d="M22.88067626953125,11.132061337890626L22.88067626953125,8.593601337890625C22.88067626953125,7.892624337890625,23.44892926953125,7.324371337890625,24.14990626953125,7.324371337890625C24.85088626953125,7.324371337890625,25.41913626953125,7.892624337890625,25.41913626953125,8.593601337890625L25.41913626953125,11.132061337890626C25.41913626953125,11.833041337890625,24.85088626953125,12.401291337890626,24.14990626953125,12.401291337890626C23.44892926953125,12.401291337890626,22.88067626953125,11.833041337890625,22.88067626953125,11.132061337890626Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(0,1,-1,0,41.73081970214844,-12.269180297851562)" style="opacity:0.10000000149011612;"><path d="M27,18.53850970214844L27,16.000049702148438C27,15.299072702148438,27.568253,14.730819702148438,28.26923,14.730819702148438C28.97021,14.730819702148438,29.53846,15.299072702148438,29.53846,16.000049702148438L29.53846,18.53850970214844C29.53846,19.23948970214844,28.97021,19.80773970214844,28.26923,19.80773970214844C27.568253,19.80773970214844,27,19.23948970214844,27,18.53850970214844Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(-0.7071067690849304,0.7071067690849304,-0.7071067690849304,-0.7071067690849304,58.30294381839121,21.611726407169044)" style="opacity:0.15000000596046448;"><path d="M24.675537109375,26.68848833984375L24.675537109375,24.15002833984375C24.675537109375,23.44905133984375,25.243790109375,22.88079833984375,25.944767109375,22.88079833984375C26.645747109375,22.88079833984375,27.213997109375,23.44905133984375,27.213997109375,24.15002833984375L27.213997109375,26.68848833984375C27.213997109375,27.389468339843752,26.645747109375,27.95771833984375,25.944767109375,27.95771833984375C25.243790109375,27.95771833984375,24.675537109375,27.389468339843752,24.675537109375,26.68848833984375Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(-1,0,0,-1,34.5384521484375,54)" style="opacity:0.30000001192092896;"><path d="M17.26922607421875,30.80769L17.26922607421875,28.26923C17.26922607421875,27.568254,17.83747907421875,27,18.53845607421875,27C19.23942607421875,27,19.80768607421875,27.568254,19.80768607421875,28.26923L19.80768607421875,30.80769C19.80768607421875,31.508670000000002,19.23942607421875,32.07693,18.53845607421875,32.07693C17.83747907421875,32.07693,17.26922607421875,31.508670000000002,17.26922607421875,30.80769Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(-0.7071068286895752,-0.7071067094802856,0.7071067094802856,-0.7071068286895752,-1.8805817391439632,48.572416538932885)" style="opacity:0.550000011920929;"><path d="M9.119384765625,28.483379697265626L9.119384765625,25.944919697265625C9.119384765625,25.243942697265624,9.687637765625,24.675689697265625,10.388614765625,24.675689697265625C11.089594765625,24.675689697265625,11.657844765625,25.243942697265624,11.657844765625,25.944919697265625L11.657844765625,28.483379697265626C11.657844765625,29.184359697265627,11.089594765625,29.752609697265626,10.388614765625,29.752609697265626C9.687637765625,29.752609697265626,9.119384765625,29.184359697265627,9.119384765625,28.483379697265626Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(0,-1,1,0,-12.269241333007812,22.269241333007812)" style="opacity:0.699999988079071;"><path d="M5,21.076931333007813L5,18.538471333007813C5,17.83749433300781,5.568253,17.269241333007812,6.26923,17.269241333007812C6.97021,17.269241333007812,7.538460000000001,17.83749433300781,7.538460000000001,18.538471333007813L7.538460000000001,21.076931333007813C7.538460000000001,21.777911333007815,6.97021,22.346161333007814,6.26923,22.346161333007814C5.568253,22.346161333007814,5,21.777911333007815,5,21.076931333007813Z" fill="#3678E3" fill-opacity="1"/></g><g transform="matrix(0.7071066498756409,-0.70710688829422,0.70710688829422,0.7071066498756409,-4.303046450104375,7.850115344526785)" style="opacity:0.8500000238418579;"><path d="M7.32440185546875,12.926983212890626L7.32440185546875,10.388523212890625C7.32440185546875,9.687546212890625,7.89265485546875,9.119293212890625,8.59363185546875,9.119293212890625C9.29461185546875,9.119293212890625,9.86286185546875,9.687546212890625,9.86286185546875,10.388523212890625L9.86286185546875,12.926983212890626C9.86286185546875,13.627963212890625,9.29461185546875,14.196213212890626,8.59363185546875,14.196213212890626C7.89265485546875,14.196213212890626,7.32440185546875,13.627963212890625,7.32440185546875,12.926983212890626Z" fill="#3678E3" fill-opacity="1"/></g></g></svg>`);
+}
+const Loading = props => {
+  const icon = CircularLoading({
+    color: '#1989FA'
+  });
+  return /*#__PURE__*/React.createElement(View, {
+    className: styles.loading,
+    style: {
+      backgroundImage: `url('${icon}')`,
+      backgroundSize: `${props.size} ${props.size}`,
+      width: props.size,
+      height: props.size
+    }
+  });
+};
+Loading.displayName = 'Loading';
+Loading.defaultProps = defaultProps;
+export default Loading;

package/lib/loading/ray-loading/index.module.less

@@ -0,0 +1,17 @@
+@keyframes animation-rotate {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.loading {
+  animation-duration: 0.5s;
+  animation-delay: 0s;
+  animation-name: animation-rotate;
+  animation-timing-function: steps(8);
+  animation-iteration-count: infinite;
+}

package/lib/loading/ray-loading/props.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+export interface IProps {
+    /**
+     * @description.zh 类名
+     * @description.en class name
+     */
+    className?: string;
+    /**
+     * @description.zh 样式
+     * @description.en Style
+     */
+    style?: React.CSSProperties;
+    /**
+     * @description.zh 颜色
+     * @description.en Color
+     * @default '#000000'
+     */
+    color?: string;
+    /**
+     * @description.zh 加载图标大小
+     * @description.en  Size of loading icon
+     * @default '60rpx'
+     */
+    size?: string;
+}
+export declare const defaultProps: IProps;

package/lib/loading/ray-loading/props.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  size: '60rpx',
+  color: '#000000'
+};

package/lib/txp/codesandbox/index.d.ts

@@ -1,5 +1,6 @@
 import { DrawerProps } from 'antd';
 import React from 'react';
+import { EditorAPI } from '@saber2pr/monaco';
 export interface CodeSandboxProps {
     code: string;
     title: string;
@@ -10,6 +11,7 @@ export interface CodeSandboxProps {
     langKey?: string;
     emptyText?: string;
     isZhLanguage?: boolean;
+    editorApi?: EditorAPI;
 }
 export declare const CodeSandbox: React.FC<CodeSandboxProps>;
 export declare const checkShowCodeSandbox: (code: string) => boolean;
@@ -25,8 +27,9 @@ export interface UseCodeSandboxDrawerOps {
     isZhLanguage?: boolean;
     code: string;
     langKey?: string;
+    editorApi?: EditorAPI;
 }
-export declare const useCodeSandboxDrawer: ({ getContainer, title, height, placement, isZhLanguage, pageName, txpCode, emptyText, langKey, baseUri, code, }: UseCodeSandboxDrawerOps) => {
+export declare const useCodeSandboxDrawer: ({ getContainer, title, height, placement, isZhLanguage, pageName, txpCode, emptyText, langKey, baseUri, code, editorApi, }: UseCodeSandboxDrawerOps) => {
     modal: React.JSX.Element;
     show: boolean;
     setShow: React.Dispatch<React.SetStateAction<boolean>>;
@@ -41,4 +44,5 @@ export declare const CodeSandboxButton: React.FC<{
     baseUri: string;
     emptyText?: string;
     isZhLanguage?: boolean;
+    editorApi?: EditorAPI;
 }>;

package/lib/txp/codesandbox/index.js

@@ -19,11 +19,12 @@ export const CodeSandbox = _ref => {
     baseUri,
     langKey,
     emptyText,
-    isZhLanguage
+    isZhLanguage,
+    editorApi
   } = _ref;
   const iframeRef = useRef();
   const [ts, setTs] = useState(Date.now());
-  const apiRef = useRef();
+  const apiRef = useRef(editorApi);
   useEffect(() => {
     const handle = event => {
       var _event$data;
@@ -86,7 +87,8 @@ export const useCodeSandboxDrawer = _ref2 => {
     emptyText,
     langKey,
     baseUri,
-    code
+    code,
+    editorApi
   } = _ref2;
   const [show, setShow] = useState(false);
   return {
@@ -107,6 +109,7 @@ export const useCodeSandboxDrawer = _ref2 => {
         setShow(false);
       }
     }, /*#__PURE__*/React.createElement(CodeSandbox, {
+      editorApi: editorApi,
       isZhLanguage: isZhLanguage,
       emptyText: emptyText,
       langKey: langKey,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/code-sandbox",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "小程序 CodeSandbox 容器",
   "main": "lib/index",
   "files": [
@@ -17,7 +17,7 @@
   ],
   "scripts": {
     "lint": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
-    "build": "patch-package && ray build --type=component",
+    "build": "export BROWSERSLIST='Last 3 versions' && patch-package && ray build --type=component",
     "watch": "ray start --type=component --output ./example/src/lib",
     "build:tuya": "ray build ./example",
     "build:wechat": "ray build ./example --target=wechat",
@@ -40,9 +40,8 @@
   "devDependencies": {
     "@commitlint/cli": "^7.2.1",
     "@commitlint/config-conventional": "^9.0.1",
-    "@ray-js/cli": "^1.4.9",
-    "@ray-js/components-ty-loading": "^0.1.1",
-    "@ray-js/ray": "^1.4.9",
+    "@ray-js/cli": "^1.5.45",
+    "@ray-js/ray": "^1.5.45",
     "@saber2pr/monaco": "^0.0.90",
     "antd": "^5.20.2",
     "axios": "^1.7.4",
@@ -55,9 +54,6 @@
     "standard-version": "9.3.2",
     "styled-components": "^6.1.12"
   },
-  "resolutions": {
-    "@ray-js/builder-mp": "1.4.15"
-  },
   "husky": {
     "hooks": {
       "commit-msg": "commitlint -E HUSKY_GIT_PARAMS --config commitlint.config.js",
@@ -74,4 +70,4 @@
       "git add"
     ]
   }
-}
+}