@nocobase/plugin-charts 0.9.1-alpha.2

package/lib/client/index.js

@@ -0,0 +1,161 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+function _core() {
+  const data = require("@formily/core");
+
+  _core = function _core() {
+    return data;
+  };
+
+  return data;
+}
+
+function _client() {
+  const data = require("@nocobase/client");
+
+  _client = function _client() {
+    return data;
+  };
+
+  return data;
+}
+
+function _json() {
+  const data = _interopRequireDefault(require("json5"));
+
+  _json = function _json() {
+    return data;
+  };
+
+  return data;
+}
+
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+
+  _react = function _react() {
+    return data;
+  };
+
+  return data;
+}
+
+var _ChartBlockEngine = require("./ChartBlockEngine");
+
+var _ChartBlockInitializer = require("./ChartBlockInitializer");
+
+var _ChartQueryMetadataProvider = require("./ChartQueryMetadataProvider");
+
+require("./Icons");
+
+var _locale = require("./locale");
+
+var _select = require("./select");
+
+var _QueriesTable = require("./settings/QueriesTable");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+(0, _core().registerValidateRules)({
+  json5: (value, rule) => {
+    if (!value) {
+      return '';
+    }
+
+    try {
+      const val = _json().default.parse(value);
+
+      if (!isNaN(val)) {
+        return {
+          type: 'error',
+          message: (0, _locale.lang)('Invalid JSON format')
+        };
+      }
+
+      return '';
+    } catch (error) {
+      console.error(error);
+      return {
+        type: 'error',
+        message: (0, _locale.lang)('Invalid JSON format')
+      };
+    }
+  }
+});
+
+var _default = _react().default.memo(props => {
+  const api = (0, _client().useAPIClient)();
+  const items = (0, _react().useContext)(_client().SchemaInitializerContext);
+  const children = items.BlockInitializers.items[0].children;
+
+  if (children) {
+    const hasChartItem = children.some(child => (child === null || child === void 0 ? void 0 : child.component) === 'ChartBlockInitializer');
+
+    if (!hasChartItem) {
+      children.push({
+        key: 'chart',
+        type: 'item',
+        icon: 'PieChartOutlined',
+        title: '{{t("Chart",{ns:"charts"})}}',
+        component: 'ChartBlockInitializer'
+      });
+    }
+  }
+
+  const validateSQL = sql => {
+    return new Promise(resolve => {
+      api.request({
+        url: 'chartsQueries:validate',
+        method: 'post',
+        data: {
+          sql
+        }
+      }).then(({
+        data
+      }) => {
+        var _data$data;
+
+        resolve(data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.errorMessage);
+      }).catch(() => {
+        resolve('Invalid SQL');
+      });
+    });
+  };
+
+  return _react().default.createElement(_ChartQueryMetadataProvider.ChartQueryMetadataProvider, null, _react().default.createElement(_client().SettingsCenterProvider, {
+    settings: {
+      charts: {
+        title: '{{t("Charts", {ns:"charts"})}}',
+        icon: 'PieChartOutlined',
+        tabs: {
+          queries: {
+            title: '{{t("Queries", {ns:"charts"})}}',
+            component: _QueriesTable.QueriesTable
+          }
+        }
+      }
+    }
+  }, _react().default.createElement(_client().SchemaComponentOptions, {
+    scope: {
+      validateSQL
+    },
+    components: {
+      CustomSelect: _select.CustomSelect,
+      ChartBlockInitializer: _ChartBlockInitializer.ChartBlockInitializer,
+      ChartBlockEngine: _ChartBlockEngine.ChartBlockEngine
+    }
+  }, _react().default.createElement(_client().SchemaInitializerContext.Provider, {
+    value: items
+  }, props.children))));
+});
+
+exports.default = _default;

package/lib/client/locale/en-US.d.ts

@@ -0,0 +1,23 @@
+declare const _default: {
+    Edit: string;
+    Delete: string;
+    Cancel: string;
+    Submit: string;
+    Actions: string;
+    Title: string;
+    Enable: string;
+    'SAML manager': string;
+    'SAML Providers': string;
+    'Redirect url': string;
+    'SP entity id': string;
+    'Add provider': string;
+    'Edit provider': string;
+    'Client id': string;
+    'Entity id or issuer': string;
+    'Login Url': string;
+    'Public cert': string;
+    'Delete provider': string;
+    'Are you sure you want to delete it?': string;
+    'Sign in button name, which will be displayed on the sign in page': string;
+};
+export default _default;

package/lib/client/locale/en-US.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  Edit: 'Edit',
+  Delete: 'Delete',
+  Cancel: 'Cancel',
+  Submit: 'Submit',
+  Actions: 'Actions',
+  Title: 'Title',
+  Enable: 'Enable',
+  'SAML manager': 'SAML manager',
+  'SAML Providers': 'SAML Providers',
+  'Redirect url': 'Redirect url',
+  'SP entity id': 'SP entity id',
+  'Add provider': 'Add',
+  'Edit provider': 'Edit',
+  'Client id': 'Client id',
+  'Entity id or issuer': 'Entity id or issuer',
+  'Login Url': 'Login Url',
+  'Public cert': 'Public cert',
+  'Delete provider': 'Delete',
+  'Are you sure you want to delete it?': 'Are you sure you want to delete it?',
+  'Sign in button name, which will be displayed on the sign in page': 'Sign in button name, which will be displayed on the sign in page'
+};
+exports.default = _default;

package/lib/client/locale/index.d.ts

@@ -0,0 +1,3 @@
+export declare const NAMESPACE = "charts";
+export declare function lang(key: string): string;
+export declare function useChartsTranslation(): import("react-i18next").UseTranslationResponse<"charts", undefined>;

package/lib/client/locale/index.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NAMESPACE = void 0;
+exports.lang = lang;
+exports.useChartsTranslation = useChartsTranslation;
+
+function _client() {
+  const data = require("@nocobase/client");
+
+  _client = function _client() {
+    return data;
+  };
+
+  return data;
+}
+
+function _reactI18next() {
+  const data = require("react-i18next");
+
+  _reactI18next = function _reactI18next() {
+    return data;
+  };
+
+  return data;
+}
+
+const NAMESPACE = 'charts'; // i18n.addResources('zh-CN', NAMESPACE, zhCN);
+// i18n.addResources('en-US', NAMESPACE, enUS);
+// i18n.addResources('ja-JP', NAMESPACE, jaJP);
+// i18n.addResources('ru-RU', NAMESPACE, ruRU);
+// i18n.addResources('tr-TR', NAMESPACE, trTR);
+
+exports.NAMESPACE = NAMESPACE;
+
+function lang(key) {
+  return _client().i18n.t(key, {
+    ns: NAMESPACE
+  });
+}
+
+function useChartsTranslation() {
+  return (0, _reactI18next().useTranslation)(NAMESPACE);
+}

package/lib/client/locale/ja-JP.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/lib/client/locale/ja-JP.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {};
+exports.default = _default;

package/lib/client/locale/ru-RU.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/lib/client/locale/ru-RU.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {};
+exports.default = _default;

package/lib/client/locale/tr-TR.d.ts

@@ -0,0 +1,2 @@
+declare const _default: {};
+export default _default;

package/lib/client/locale/tr-TR.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {};
+exports.default = _default;

package/lib/client/locale/zh-CN.d.ts

@@ -0,0 +1,61 @@
+declare const _default: {
+    Edit: string;
+    Delete: string;
+    Cancel: string;
+    Submit: string;
+    Actions: string;
+    Title: string;
+    Enable: string;
+    Chart: string;
+    Charts: string;
+    Queries: string;
+    'Select chart query': string;
+    'Select query data': string;
+    Type: string;
+    'Chart type': string;
+    'Chart title': string;
+    'Basic charts': string;
+    'More charts': string;
+    'Chart config': string;
+    'Add query': string;
+    'Edit query': string;
+    'Invalid JSON format,must be an object array.': string;
+    Area: string;
+    Bar: string;
+    Column: string;
+    Funnel: string;
+    Line: string;
+    Pie: string;
+    Radar: string;
+    Scatter: string;
+    'Edit chart block': string;
+    'Chart preview': string;
+    'Delete queries': string;
+    'Delete query': string;
+    'Add chart query': string;
+    'Add SQL query': string;
+    'Add JSON query': string;
+    'Data preview': string;
+    'Category axis / Dimension': string;
+    'Value axis / Metrics': string;
+    'JSON config': string;
+    'Json config references': string;
+    'Create chart block': string;
+    'Invalid JSON format': string;
+    'Json config references: ': string;
+    'Sector Angle / Metric': string;
+    'Sector label / Dimensional': string;
+    'Color legend / Dimensional': string;
+    'Funnel Layer Width/Metrics': string;
+    'Branch Tags/Dimensions': string;
+    'Branch Length/Metrics': string;
+    'Please check the chart config': string;
+    '1 \u300Ctime\u300Dor \u300COrdered Noun\u300D field,1 \u300CNumerical\u300D field,1 \u300CUnordered Noun\u300D field (optional)': string;
+    '1 \u300Ctime\u300D or \u300Cordered noun\u300D field, 1 \u300Cvalue\u300D field, 0~ 1 \u300Cunordered noun\u300D': string;
+    '1 \u300Ctime\u300D or \u300Cordered noun\u300D field, 1 \u300Cvalue\u300D field, 0 to 1 \u300Cunordered noun\u300D': string;
+    '1 \u300CUnordered Noun\u300D field, 1 \u300CNumeric\u300D field': string;
+    '1 \u300CTime\u300D or \u300COrder Noun\u300D field, 1 \u300CValue\u300D field': string;
+    '1~ 2 \u300CUnordered Noun\u300D fields, 1 \u300CNumeric\u300D field': string;
+    '1 \u300CNumeric\u300D field, 0~ 1 \u300CUnordered Noun\u300D field': string;
+};
+export default _default;

package/lib/client/locale/zh-CN.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  Edit: '编辑',
+  Delete: '删除',
+  Cancel: '取消',
+  Submit: '提交',
+  Actions: '操作',
+  Title: '名称',
+  Enable: '启用',
+  Chart: '图表',
+  Charts: '图表',
+  Queries: '查询列表',
+  'Select chart query': '选择图表数据',
+  'Select query data': '选择查询数据',
+  Type: '类型',
+  'Chart type': '图表类型',
+  'Chart title': '图表标题',
+  'Basic charts': '基础图表',
+  'More charts': '更多图表',
+  'Chart config': '图表配置',
+  'Add query': '添加查询',
+  'Edit query': '编辑查询',
+  'Invalid JSON format,must be an object array.': '无效的JSON格式，必须是对象数组。',
+  Area: '面积图',
+  Bar: '条形图',
+  Column: '柱状图',
+  Funnel: '漏斗图',
+  Line: '折线图',
+  Pie: '饼图',
+  Radar: '雷达图',
+  Scatter: '散点图',
+  'Edit chart block': '编辑图表区块',
+  'Chart preview': '图表预览',
+  'Delete queries': '删除查询列表',
+  'Delete query': '删除查询',
+  'Add chart query': '添加图表查询',
+  'Add SQL query': '添加SQL查询',
+  'Add JSON query': '添加JSON查询',
+  'Data preview': '数据预览',
+  'Category axis / Dimension': '类别轴 / 维度',
+  'Value axis / Metrics': '值轴 / 度量',
+  'JSON config': 'JSON 配置',
+  'Json config references': 'JSON配置参考',
+  'Create chart block': '创建图表区块',
+  'Invalid JSON format': '无效的JSON格式',
+  'Json config references: ': 'JSON配置参考: ',
+  'Sector Angle / Metric': '扇形角 / 度量',
+  'Sector label / Dimensional': '扇形标签 / 维度',
+  'Color legend / Dimensional': '颜色系列 / 维度',
+  'Funnel Layer Width/Metrics': '漏斗层宽度 / 度量',
+  'Branch Tags/Dimensions': '分支标签 / 维度',
+  'Branch Length/Metrics': '分支长度 / 度量',
+  'Please check the chart config': '请检查图表配置',
+  '1 「time」or 「Ordered Noun」 field,1 「Numerical」 field,1 「Unordered Noun」 field (optional)': '1 个「时间」或「有序名词」字段,1 个「数值」字段,1 个「无序名词」字段(可选)',
+  '1 「time」 or 「ordered noun」 field, 1 「value」 field, 0~ 1 「unordered noun」': '1 个「时间」或「有序名词」字段,1 个「数值」字段,0 ～ 1 个「无序名词」',
+  '1 「time」 or 「ordered noun」 field, 1 「value」 field, 0 to 1 「unordered noun」': '1 个「时间」或「有序名词」字段,1 个「数值」字段,0 ～ 1 个「无序名词」',
+  '1 「Unordered Noun」 field, 1 「Numeric」 field': '1 个「无序名词」字段,1 个「数值」字段',
+  '1 「Time」 or 「Order Noun」 field, 1 「Value」 field': '1 个「时间」或「有序名词」字段,1 个「数值」字段',
+  '1~ 2 「Unordered Noun」 fields, 1 「Numeric」 field': '1 ~ 2 个「无序名词」字段,1 个「数值」字段',
+  '1 「Numeric」 field, 0~ 1 「Unordered Noun」 field': '1 个「数值」字段,0 ~ 1 个「无序名词」字段'
+};
+exports.default = _default;

package/lib/client/select/CustomSelect.d.ts

@@ -0,0 +1,11 @@
+import type { SelectProps } from 'antd';
+import React from 'react';
+import { ReadPretty } from './ReadPretty';
+export declare const CustomSelect: React.ForwardRefExoticComponent<Partial<SelectProps<any, any> & {
+    objectValue?: boolean;
+    onChange?: (v: any) => void;
+    multiple: boolean;
+}> & React.RefAttributes<unknown>> & {
+    ReadPretty: typeof ReadPretty;
+};
+export default CustomSelect;

package/lib/client/select/CustomSelect.js

@@ -0,0 +1,193 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.CustomSelect = void 0;
+
+function _icons() {
+  const data = require("@ant-design/icons");
+
+  _icons = function _icons() {
+    return data;
+  };
+
+  return data;
+}
+
+function _css() {
+  const data = require("@emotion/css");
+
+  _css = function _css() {
+    return data;
+  };
+
+  return data;
+}
+
+function _react() {
+  const data = require("@formily/react");
+
+  _react = function _react() {
+    return data;
+  };
+
+  return data;
+}
+
+function _shared() {
+  const data = require("@formily/shared");
+
+  _shared = function _shared() {
+    return data;
+  };
+
+  return data;
+}
+
+function _client() {
+  const data = require("@nocobase/client");
+
+  _client = function _client() {
+    return data;
+  };
+
+  return data;
+}
+
+function _antd() {
+  const data = require("antd");
+
+  _antd = function _antd() {
+    return data;
+  };
+
+  return data;
+}
+
+function _react2() {
+  const data = _interopRequireDefault(require("react"));
+
+  _react2 = function _react2() {
+    return data;
+  };
+
+  return data;
+}
+
+var _locale = require("../locale");
+
+var _ReadPretty = require("./ReadPretty");
+
+const _excluded = ["options"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const isEmptyObject = val => !(0, _shared().isValid)(val) || typeof val === 'object' && Object.keys(val).length === 0;
+
+const Option = _antd().Select.Option,
+      OptGroup = _antd().Select.OptGroup;
+
+const filterOption = (input, option) => {
+  var _option$label;
+
+  return ((_option$label = option === null || option === void 0 ? void 0 : option.label) !== null && _option$label !== void 0 ? _option$label : '').toLowerCase().includes((input || '').toLowerCase());
+};
+
+const InternalSelect = (0, _react().connect)(props => {
+  const others = _extends({}, props);
+
+  const _others = _objectSpread({}, others),
+        options = _others.options,
+        othersProps = _objectWithoutProperties(_others, _excluded);
+
+  const mode = props.mode || props.multiple ? 'multiple' : undefined;
+  const group1 = options.filter(option => option.group === 2);
+  const group2 = options.filter(option => option.group === 1);
+  return _react2().default.createElement(_antd().Select, _objectSpread(_objectSpread({
+    showSearch: true,
+    filterOption: filterOption,
+    allowClear: true
+  }, othersProps), {}, {
+    onChange: changed => {
+      var _props$onChange;
+
+      (_props$onChange = props.onChange) === null || _props$onChange === void 0 ? void 0 : _props$onChange.call(props, changed === undefined ? null : changed);
+    },
+    mode: mode
+  }), _react2().default.createElement(OptGroup, {
+    label: (0, _locale.lang)('Basic charts')
+  }, group1.map(option => _react2().default.createElement(Option, {
+    value: option.key,
+    label: (0, _locale.lang)(option.title)
+  }, _react2().default.createElement(_antd().Popover, {
+    placement: 'right',
+    zIndex: 99999999999,
+    content: () => {
+      var _lang;
+
+      return _react2().default.createElement("span", null, (_lang = (0, _locale.lang)(option === null || option === void 0 ? void 0 : option.description)) === null || _lang === void 0 ? void 0 : _lang.split(',').map(item => _react2().default.createElement("div", null, item)));
+    },
+    trigger: "hover"
+  }, _react2().default.createElement("div", {
+    className: (0, _css().css)`
+                    display: flex;
+                    gap: 4px;
+                    align-items: center;
+                  `
+  }, _react2().default.createElement(_client().Icon, {
+    type: option.iconId
+  }), _react2().default.createElement("span", {
+    role: "img",
+    "aria-label": (0, _locale.lang)(option.title)
+  }, (0, _locale.lang)(option.title))))))), _react2().default.createElement(OptGroup, {
+    label: (0, _locale.lang)('More charts')
+  }, group2.map(option => _react2().default.createElement(Option, {
+    value: option.key,
+    label: (0, _locale.lang)(option.title)
+  }, _react2().default.createElement(_antd().Popover, {
+    placement: 'right',
+    zIndex: 99999999999,
+    content: () => {
+      var _lang2;
+
+      return _react2().default.createElement("span", null, (_lang2 = (0, _locale.lang)(option === null || option === void 0 ? void 0 : option.description)) === null || _lang2 === void 0 ? void 0 : _lang2.split(',').map(item => _react2().default.createElement("div", null, item)));
+    },
+    trigger: "hover"
+  }, _react2().default.createElement("div", {
+    className: (0, _css().css)`
+                    display: flex;
+                    gap: 4px;
+                    align-items: center;
+                  `
+  }, _react2().default.createElement(_client().Icon, {
+    type: option.iconId
+  }), _react2().default.createElement("span", {
+    role: "img",
+    "aria-label": (0, _locale.lang)(option.title)
+  }, (0, _locale.lang)(option.title))))))));
+}, (0, _react().mapProps)({
+  dataSource: 'options',
+  loading: true
+}, (props, field) => {
+  return _objectSpread(_objectSpread({}, props), {}, {
+    suffixIcon: (field === null || field === void 0 ? void 0 : field['loading']) || (field === null || field === void 0 ? void 0 : field['validating']) ? _react2().default.createElement(_icons().LoadingOutlined, null) : props === null || props === void 0 ? void 0 : props.suffixIcon
+  });
+}), (0, _react().mapReadPretty)(_ReadPretty.ReadPretty));
+const CustomSelect = InternalSelect;
+exports.CustomSelect = CustomSelect;
+CustomSelect.ReadPretty = _ReadPretty.ReadPretty;
+var _default = CustomSelect;
+exports.default = _default;

package/lib/client/select/ReadPretty.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ReadPretty: React.MemoExoticComponent<React.FunctionComponent<Pick<any, string | number | symbol>>>;