@ebiz/designer-components 0.0.47 → 0.0.49

package/src/components/charts/feature/nodeRender/angular-node.js

@@ -1,100 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-// Angular 框架依赖配置
-import { ViewContainerRef, Injector } from '@angular/core';
-// 原有的nodeRender方法
-import nodeRender from './index';
-
-// 判断是否为Angular组件
-function isAngularComponent(component) {
-  // 检查 ɵcmp 属性
-  if (component?.['ɵcmp']) {
-    return true;
-  }
-  // 检查 ngComponentDef 属性
-  if (component?.['ngComponentDef']) {
-    return true;
-  }
-  // 检查 ɵfac 和 ɵdir 属性
-  if (component?.['ɵfac'] && component?.['ɵdir']) {
-    return true;
-  }
-  return false;
-}
-
-// 判断是否为dom节点
-function isDOM(obj) {
-  return obj instanceof HTMLElement;
-}
-
-// Angular 框架下的渲染及卸载
-function createAngular(container, componentReturn, data, nodeInstance) {
-  if (!ViewContainerRef) {
-    throw new Error('Angular is not installed. Please install angular.');
-  }
-  // 通过 injector 获取 ViewContainerRef 实例
-  const { component, injector } = componentReturn;
-  const viewContainerRef = injector.get(ViewContainerRef);
-  // 创建组件实例
-  const app = viewContainerRef.createComponent(component);
-  // 传递数据
-  if (data) {
-    app.instance.data = data;
-  }
-
-  // 返回组件的 DOM 元素
-  const nativeElement = app.location.nativeElement;
-  container.appendChild(nativeElement);
-
-  // 卸载组件准备
-  setTimeout(() => {
-    // 将 Angular 实例 unmount update添加到 appIns 对象中
-    nodeInstance.setComponentApp({
-      app: app,
-      unmount: () => {app.destroy();},
-      update: (newData) => {
-        app.instance.data = Object.assign({}, app.instance.data, newData);
-      }
-    });
-  }, 10)
-}
-
-// Angular 组件渲染
-function renderAngularComponent(container, componentFun, data, nodeInstance) {
-  // 函数式组件处理
-  if (typeof componentFun === 'function') {
-    const dom = componentFun(container, data);
-    if (!dom) return;
-    // 有返回值 返回dom
-    if (isDOM(dom)) {
-      dom && container.appendChild(dom);
-    }
-    // 有返回值 返回Angular组件
-    else if (typeof dom === 'object' && dom !== null) {
-      if (dom.component && dom.injector && isAngularComponent(dom.component)) {
-        createAngular(container, dom, data, nodeInstance);
-      } else {
-        throw new Error('Provided object does not contain a valid Angular component and injector.');
-      }
-    } else {
-      throw new Error('Please provide correct function.');
-    }
-  }
-  // 非Angular组件异常处理
-  else {
-    throw new Error('Provided component is not a valid angular component.');
-  }
-}
-
-// 用新的Angular节点渲染方法替代原有方法
-nodeRender.render = renderAngularComponent;
-export default nodeRender;

package/src/components/charts/feature/nodeRender/index.js

@@ -1,31 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-// 默认节点渲染方法
-function render(container, component, data, nodeInstance) {
-  let dom = component(container, data);
-  dom && container.appendChild(dom);
-    setTimeout(() => {
-        nodeInstance.setComponentApp({
-              app: null,
-              unmount: () => {},
-              update: (newData) => {
-                container.innerHTML = '';
-                let dom = component(container, newData);
-                dom && container.appendChild(dom);
-            }
-        });
-    }, 10)
-}
-
-  
-let nodeRender = { render };
-export default nodeRender;

package/src/components/charts/feature/nodeRender/react-node.js

@@ -1,83 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import nodeRender from './index';
-import React, { useState } from 'react';
-import { createRoot } from 'react-dom/client';
-
-// React 框架下的渲染及卸载 container需为空容器
-function createReact(container, component, data, nodeInstance) {
-  let setState;
-  let app = React.createElement(() => {
-    const [newData, setNewData] = useState(data);
-    setState = setNewData;
-    return React.cloneElement(component, { data: newData });
-  })
-  const root = createRoot(container); 
-  root.render(app);
-  // 卸载组件准备
-  setTimeout(() => {
-    // 将 react 实例 unmount update添加到 appIns 对象中
-    nodeInstance.setComponentApp({
-      app: app,
-      unmount: () => {root.unmount()},
-      update: (newData) => {
-        setState((prevState) => (
-          Object.assign({}, prevState, newData)
-        ))
-      }
-    });
-  }, 10)
-}
-
-// 判断是否为dom节点
-function isDOM(obj) {
-  return obj instanceof HTMLElement;
-}
-
-// 判断是否为react组件
-function isReactElement(obj) {
-  if (!React) {
-    throw new Error('React is not installed. Please install react.');
-  }
-  return React.isValidElement(obj);
-}
-
-// React 组件渲染
-function renderReactComponent(container, component, data, nodeInstance) {
-  // 函数式组件处理
-  if (typeof component === 'function') {
-    const dom = component(container, data);
-    if (!dom) return;
-    // 有返回值 返回dom
-    if (isDOM(dom)) {
-      dom && container.appendChild(dom);
-    }
-    // 有返回值 返回react组件
-    else if (isReactElement(dom)) {
-      createReact(container, dom, data, nodeInstance);
-    } else {
-      throw new Error('Please provide correct function.');
-    }
-  }
-  // React组件处理
-  else if (isReactElement(component)) {
-    createReact(container, component, data, nodeInstance);
-  }
-  // 非React组件异常处理
-  else {
-    throw new Error('Provided component is not a valid react component.');
-  }
-}
-
-// 用新的React节点渲染方法替代原有方法
-nodeRender.render = renderReactComponent;
-export default nodeRender;

package/src/components/charts/feature/nodeRender/vue-node.js

@@ -1,109 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-// Vue 框架依赖配置
-import { createApp, h ,ref } from 'vue';
-// 原有的nodeRender方法
-import nodeRender from './index';
-
-// 创建 Vue 应用
-function createVueApp(options) {
-  if (!createApp) {
-    throw new Error('Vue is not installed. Please install Vue to use createApp.');
-  }
-  return createApp(options);
-}
-
-// 创建 Vue 组件或元素
-function createElement(tag, props, children) {
-  if (!h) {
-    throw new Error('Vue is not installed. Please install Vue to use the createElement function.');
-  }
-  return h(tag, props, children);
-}
-
-// 渲染vue组件
-function createVue(container, component, data, nodeInstance) {
-  // 挂载vue节点
-  const app = createVueApp({
-    data() {
-      return {
-        data: ref(data)
-      }
-    },
-    render() {
-      return createElement(component, {
-        data: this.data
-      });
-    }
-  });
-  const vm = app.mount(container);
-  // 添加Vue节点实例
-  setTimeout(() => {
-    nodeInstance.setComponentApp({
-        app: app,
-        unmount: app.unmount,
-        update: (newdata) => {
-          vm.data = Object.assign({}, vm.data, newdata);
-        }
-    })
-  }, 10);
-}
-
-
-// 判断是否为vue组件
-function isVueComponent(component) {
-  // 检查是否是 Vue 组件
-  if (typeof component === 'function' && component.prototype && component.prototype.$options) {
-    return true;
-  }
-  if (typeof component === 'object' && (component.render || (component.type?.render && component.type?.__scopeId))) {
-    return true;
-  }
-  return false;
-}
-
-// 判断是否为dom节点
-function isDOM(obj) {
-  return obj instanceof HTMLElement;
-}
-
-// Vue 组件渲染
-function renderVueComponent(container, component, data, nodeInstance) {
-  // debugger
-  // 函数式组件处理
-  if (typeof component === 'function') {
-    const dom = component(container, data);
-    if (!dom) return;
-    // 有返回值 返回dom
-    if (isDOM(dom)) {
-      dom && container.appendChild(dom);
-    }
-    // 有返回值 返回vue组件
-    else if (isVueComponent(dom)) {
-      createVue(container, dom, data, nodeInstance);
-    } else {
-      throw new Error('Please provide correct function.');
-    }
-  }
-  // Vue组件处理
-  else if (isVueComponent(component)) {
-    createVue(container, component, data, nodeInstance);
-  }
-  // 非Vue组件异常处理
-  else {
-    throw new Error('Provided component is not a valid Vue component.');
-  }
-}
-
-// 用新的vue节点渲染方法替代原有方法
-nodeRender.render = renderVueComponent;
-export default nodeRender;

package/src/components/charts/feature/performance/lttb.js

@@ -1,85 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-var UNDEFINED = 'undefined';
-var CtorUint32Array = typeof Uint32Array === UNDEFINED ? Array : Uint32Array;
-var CtorUint16Array = typeof Uint16Array === UNDEFINED ? Array : Uint16Array;
-function getIndicesCtor(rawCount) {
-  return rawCount > 65535 ? CtorUint32Array : CtorUint16Array;
-}
-
-export function lttb(data) {
-  let rate = 1 / Math.round(data.length / 1040);
-  let newData = []; //返回数据
-  const len = data.length; // y 轴值的总数量
-  let sampledIndex = 0; // 初始采样索引 0
-  const frameSize = Math.floor(1 / rate); // x 轴的缩放比例，每次的步长
-  // 当前的真实索引 raw 原始的，注意，这里是索引，不是具体值
-  let currentRawIndex = 0;
-  let maxArea; // 最大面积
-  let area; // 临时计算面积
-  let nextRawIndex; // 下一个原始索引
-  // getIndicesCtor 根据 this._rawCount 的大小，判断返回哪种类型
-  // Uint32Array or Uint16Array 初始化扇区缓存，初始数据全部是0
-  const newIndices = new (getIndicesCtor(len))(Math.ceil(len / frameSize) + 2); 
-  // First frame use the first data.
-  newIndices[sampledIndex++] = currentRawIndex;
-   // 去除首尾两个点，步长循环处理
-  for (let i = 1; i < len - 1; i += frameSize) {
-      // 后一个桶的 x 轴平均值，这里加上 frameSize 是因为起点已经确认
-      // 第二个桶开始点，应该与第一个间隔frameSize。
-      const nextFrameStart = Math.min(i + frameSize, len - 1);
-      const nextFrameEnd = Math.min(i + frameSize * 2, len);
-      const avgX = (nextFrameEnd + nextFrameStart) / 2;
-      // 后一个桶的 y 的平均点
-      let avgY = 0;
-      for (let idx = nextFrameStart; idx < nextFrameEnd; idx++) {
-          const rawIndex = idx;
-          const y = data[rawIndex] ; // 获取 y 轴真实的数值，data 中给的
-          if (isNaN(y)) { // 是非数字，跳过当前循环，开始下一个循环
-              continue;
-          }
-          avgY += y ; // 累加
-      }
-      // 值的平均，桶或者点集的总和（排除非法值）除以长度
-      avgY /= (nextFrameEnd - nextFrameStart);
-      const frameStart = i; // 当前点集 起始索引
-      const frameEnd = Math.min(i + frameSize, len); // 当前点集，结束索引
-      const pointAX = i - 1; // A 为三个点中的首个点。当前为 0
-      const pointAY = data[currentRawIndex] ; // 首个点的真实 y 值
-      maxArea = -1; // 初始最大面积
-      // 整体上来看，x 轴为点的位置坐标，为值，y 轴为真实的数值
-      nextRawIndex = frameStart;
-      for (let idx = frameStart; idx < frameEnd; idx++) {
-          const rawIndex = idx;
-          const y = data[rawIndex] ;
-          if (isNaN(y)) { // 是非数字，就跳过当前循环
-              continue;
-          }
-          // 构筑直角坐标系，三角形的面积和，等于左侧矩形加上右侧梯形减去右上三角形
-          // 整理可得如下公式。
-          area = Math.abs((pointAX - avgX) * (y - pointAY)
-              - (pointAX - idx) * (avgY - pointAY)
-          );
-          if (area > maxArea) {
-              maxArea = area;
-              nextRawIndex = rawIndex; // Next a is this b
-          }
-      }
-      // 找到下一桶的最大面积真实索引，同时 sampleIndex++ 下移一位
-    newIndices[sampledIndex++] = nextRawIndex;
-    newData.push(data[nextRawIndex]);
-      // This a is the next a (chosen b) 对于下一个桶，当前的最佳桶就是上一个桶。
-      currentRawIndex = nextRawIndex;
-  }
-  newIndices[sampledIndex++] = len - 1; // 最后一个点
-  return newData;
-}

package/src/components/charts/feature/readScreen/index.js

@@ -1,19 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-function readScreen(dom, readScreenText){
-    if(readScreenText){
-        dom.setAttribute('tabindex', '0');
-        dom.setAttribute('aria-label', readScreenText);
-    }
-}
-
-export default readScreen;

package/src/components/charts/feature/token/color/bpit/dark.js

@@ -1,67 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import board from '../hdesign/board';
-import { getThemeColor, getColorGroup } from '../util';
-
-const gray = {
-  ...board.gray,
-  ...board.transparent,
-};
-
-// 图表的状态颜色
-const colorState = {
-  // 错误色
-  colorError: board.red.colorRed40,
-  colorAlert: board.orange.colorOrange50,
-  colorWarning: board.yellow.colorYellow40,
-  // 成功色
-  colorSuccess: board.mint.colorMint60,
-  // 信息色
-  colorInfo: board.blue.colorBlue50,
-  // 失效色
-  colorNone: board.gray.colorGray60,
-};
-
-// 告警色组
-const colorAlarms = {
-  // 暂定
-  colorAlarmFatal: board.red.colorRed70,
-  colorAlarmError: board.red.colorRed40,
-  colorAlarmWarning: board.orange.colorOrange50,
-  colorAlarmSecondary: board.yellow.colorYellow40,
-  // 暂定
-  colorAlarmOrdinary: board.yellow.colorYellow20,
-}
-
-
-// 图表配色对象
-const colorChart = {
-  colorChart1: board.blue.colorBlue50,
-  colorChart2: board.cyan.colorCyan40,
-  colorChart3: board.indigo.colorIndigo50,
-  colorChart4: board.brand.colorBrand30,
-  colorChart5: board.pink.colorPink30,
-  colorChart6: board.green.colorGreen40,
-  colorChart7: board.yellow.colorYellow60,
-  colorChart8: board.mint.colorMint40,
-  colorChart9: board.purple.colorPurple40,
-  colorChart10: board.rose.colorRose40,
-  colorChart11: board.orange.colorOrange30,
-  colorChart12: board.red.colorRed40,
-};
-
-// 图表内置的颜色组
-const colorGroup = getColorGroup(colorChart);
-
-const dark = getThemeColor(gray, colorState, colorGroup, colorAlarms, board);
-
-export default dark;

package/src/components/charts/feature/token/color/bpit/index.js

@@ -1,20 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import light from './light';
-import dark from './dark';
-
-const bpit = {
-  light,
-  dark,
-};
-
-export default bpit;

package/src/components/charts/feature/token/color/bpit/light.js

@@ -1,66 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import board from '../hdesign/board';
-import { getThemeColor, getColorGroup } from '../util';
-
-const gray = {
-  ...board.gray,
-  ...board.transparent,
-};
-
-// 图表的状态颜色
-const colorState = {
-  // 错误色
-  colorError: board.red.colorRed50,
-  colorAlert: board.orange.colorOrange50,
-  colorWarning: board.yellow.colorYellow50,
-  // 成功色
-  colorSuccess: board.mint.colorMint50,
-  // 信息色
-  colorInfo: board.blue.colorBlue50,
-  // 失效色
-  colorNone: board.gray.colorGray30,
-};
-
-// 告警色组
-const colorAlarms = {
-  // 暂定
-  colorAlarmFatal: board.red.colorRed70,
-  colorAlarmError: board.red.colorRed50,
-  colorAlarmWarning: board.orange.colorOrange50,
-  colorAlarmSecondary: board.yellow.colorYellow50,
-  // 暂定
-  colorAlarmOrdinary: board.yellow.colorYellow20,
-}
-
-// 图表配色对象
-const colorChart = {
-  colorChart1: board.blue.colorBlue50,
-  colorChart2: board.cyan.colorCyan40,
-  colorChart3: board.indigo.colorIndigo50,
-  colorChart4: board.brand.colorBrand20,
-  colorChart5: board.pink.colorPink30,
-  colorChart6: board.green.colorGreen40,
-  colorChart7: board.yellow.colorYellow60,
-  colorChart8: board.mint.colorMint40,
-  colorChart9: board.purple.colorPurple30,
-  colorChart10: board.rose.colorRose40,
-  colorChart11: board.orange.colorOrange30,
-  colorChart12: board.red.colorRed40,
-};
-
-// 图表内置的颜色组
-const colorGroup = getColorGroup(colorChart);
-
-const light = getThemeColor(gray, colorState, colorGroup, colorAlarms, board);
-
-export default light;