hc-busin-components 1.0.1 → 1.0.3

package/dist/CombinTable/index.js

@@ -1,5 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["columns", "search", "fieldNames", "placeholder", "border", "prefixIcon", "addonBefore", "addonAfter", "request", "values", "setValues", "setting", "refresh", "topNode", "defaultAfterChange", "defaultSelectKey"];
+var _excluded = ["columns", "search", "fieldNames", "placeholder", "border", "prefixIcon", "addonBefore", "addonAfter", "request", "values", "setValues", "setting", "refresh", "topNode", "defaultAfterChange", "defaultSelectKey", "pagination"],
+  _excluded2 = ["onChange", "className", "plain"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -19,6 +20,13 @@ import React, { useEffect, useMemo, useState } from 'react';
 import CombineSearch from "../CombineSearch";
 import Icon from "../Icon";
 import RenderContent from "./components/RenderContent";
+import { useCombinTableStyles } from "./styles";
+var DEFAULT_PAGINATION = {
+  hideOnSinglePage: false,
+  showSizeChanger: true,
+  showQuickJumper: true,
+  pageSize: 10
+};
 var CombinTable = function CombinTable(props) {
   var columns = props.columns,
     _props$search = props.search,
@@ -43,7 +51,11 @@ var CombinTable = function CombinTable(props) {
     topNode = props.topNode,
     defaultAfterChange = props.defaultAfterChange,
     defaultSelectKey = props.defaultSelectKey,
+    paginationProp = props.pagination,
     tableProps = _objectWithoutProperties(props, _excluded);
+  var _useCombinTableStyles = useCombinTableStyles(),
+    styles = _useCombinTableStyles.styles,
+    cx = _useCombinTableStyles.cx;
   var SearchProps = {
     fieldNames: fieldNames,
     placeholder: placeholder,
@@ -171,6 +183,22 @@ var CombinTable = function CombinTable(props) {
     }
     return doms;
   }, [setting, refresh, values, search, request]);
+  var paginationConfig = useMemo(function () {
+    if (paginationProp === false) {
+      return false;
+    }
+    var userPagination = paginationProp === undefined ? DEFAULT_PAGINATION : paginationProp;
+    var userOnChange = userPagination.onChange,
+      className = userPagination.className,
+      plain = userPagination.plain,
+      restPagination = _objectWithoutProperties(userPagination, _excluded2);
+    return _objectSpread(_objectSpread({}, restPagination), {}, {
+      className: cx(!plain && styles.paginationHighlight, className),
+      onChange: function onChange(page, size) {
+        userOnChange === null || userOnChange === void 0 || userOnChange(page, size, values);
+      }
+    });
+  }, [paginationProp, values, styles.paginationHighlight, cx]);
 
   // 获取表头筛选项
   useEffect(function () {
@@ -201,13 +229,7 @@ var CombinTable = function CombinTable(props) {
   }, topNode) : null, /*#__PURE__*/React.createElement(Table, _extends({
     columns: resetColumns
   }, tableProps, {
-    pagination: _objectSpread(_objectSpread({}, tableProps.pagination), {}, {
-      onChange: function onChange(page, size) {
-        if (tableProps !== null && tableProps !== void 0 && tableProps.pagination && tableProps !== null && tableProps !== void 0 && tableProps.pagination.onChange) {
-          tableProps === null || tableProps === void 0 || tableProps.pagination.onChange(page, size, values);
-        }
-      }
-    })
+    pagination: paginationConfig
   })), /*#__PURE__*/React.createElement(Modal, {
     title: localStorage.getItem('i18nextLng') === 'en-US' || localStorage.getItem('language') === 'en-US' ? 'Table Header Setting' : '表头设置',
     destroyOnClose: true,

package/dist/CombinTable/styles/index.d.ts

@@ -1,3 +1,9 @@
+export declare const useCombinTableStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    container: import("antd-style").SerializedStyles;
+    paginationHighlight: import("antd-style").SerializedStyles;
+}>;
+/** @deprecated 使用 useCombinTableStyles */
 export declare const useFilterStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
     container: import("antd-style").SerializedStyles;
+    paginationHighlight: import("antd-style").SerializedStyles;
 }>;

package/dist/CombinTable/styles/index.js

@@ -1,11 +1,15 @@
-var _templateObject;
+var _templateObject, _templateObject2;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-import { createStyles } from "antd-style";
-export var useFilterStyles = createStyles(function (_ref) {
+import { createStyles } from 'antd-style';
+export var useCombinTableStyles = createStyles(function (_ref) {
   var prefixCls = _ref.prefixCls,
     token = _ref.token,
     css = _ref.css;
   return {
-    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    /* transform: translateY(); */\n  "])))
+    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    /* transform: translateY(); */\n  "]))),
+    paginationHighlight: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    .", "-pagination-item:not(.", "-pagination-item-active):hover {\n      border-color: ", ";\n      background: ", ";\n\n      a {\n        color: ", ";\n      }\n    }\n\n    .", "-pagination-item-active {\n      border-color: ", ";\n      background: ", ";\n\n      a {\n        color: #fff;\n      }\n\n      &:hover {\n        border-color: ", ";\n        background: ", ";\n\n        a {\n          color: #fff;\n        }\n      }\n    }\n\n    .", "-pagination-prev:hover .", "-pagination-item-link,\n    .", "-pagination-next:hover .", "-pagination-item-link,\n    .", "-pagination-jump-prev:hover .", "-pagination-item-link,\n    .", "-pagination-jump-next:hover .", "-pagination-item-link {\n      border-color: ", ";\n      color: ", ";\n    }\n  "])), prefixCls, prefixCls, token.colorPrimary, token.colorPrimaryBg, token.colorPrimary, prefixCls, token.colorPrimary, token.colorPrimary, token.colorPrimaryHover, token.colorPrimaryHover, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, prefixCls, token.colorPrimary, token.colorPrimary)
   };
-});
+});
+
+/** @deprecated 使用 useCombinTableStyles */
+export var useFilterStyles = useCombinTableStyles;

package/dist/CombinTable/types/index.d.ts

@@ -3,13 +3,16 @@ import { GetProp, GetProps, Table, TablePaginationConfig } from 'antd';
 import ComBineSearchProps, { CombineOptionsType } from "../../CombineSearch/types";
 type TableProps = GetProps<typeof Table>;
 type column = GetProp<typeof Table, 'columns'>[number];
-type pagination = false | Omit<TablePaginationConfig, 'onChange'>;
+export type CombinTablePaginationConfig = Omit<TablePaginationConfig, 'onChange'> & {
+    /** 朴素分页风格；`true` 为 antd 默认样式，不传或为 `false` 时高亮当前页 */
+    plain?: boolean;
+    onChange?: (page: number, size: number, values: Record<string, any>) => void;
+};
+type pagination = false | CombinTablePaginationConfig;
 export type ColumnProps = column & CombineOptionsType;
 interface AntTableProps extends Omit<TableProps, 'columns' | 'pagination'> {
     columns?: ColumnProps[];
-    pagination?: pagination & {
-        onChange?: (page: number, size: number, values: Record<string, any>) => void;
-    };
+    pagination?: pagination;
     setting?: boolean;
     refresh?: boolean;
     topNode?: React.ReactNode;

package/dist/CombineSearch/components/Tags.js

@@ -5,7 +5,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 /* eslint-disable no-case-declarations */
-import { CloseCircleOutlined } from '@ant-design/icons';
+
 import { Divider, Space, Tag } from 'antd';
 import React, { useCallback, useMemo } from 'react';
 import Icon from "../../Icon";
@@ -64,7 +64,11 @@ var CombineTags = function CombineTags(_ref) {
           },
           className: styles.currentTag,
           key: key,
-          closeIcon: /*#__PURE__*/React.createElement(CloseCircleOutlined, null),
+          closeIcon: /*#__PURE__*/React.createElement("span", {
+            className: styles.closeIcon
+          }, /*#__PURE__*/React.createElement(Icon, {
+            name: "v35_Failure_Filled"
+          })),
           onClose: function onClose() {
             setCombineValues(function (values) {
               return JSON.parse(JSON.stringify(_objectSpread(_objectSpread({}, values), {}, _defineProperty({}, key, undefined))));
@@ -97,7 +101,11 @@ var CombineTags = function CombineTags(_ref) {
     style: {
       display: 'flex',
       alignItems: 'center',
-      width: '50px'
+      width: '60px'
+    },
+    onClick: function onClick() {
+      setCombineValues({});
+      setCurrent('');
     }
   }, /*#__PURE__*/React.createElement(Divider, {
     type: "vertical"
@@ -105,11 +113,13 @@ var CombineTags = function CombineTags(_ref) {
     name: "v35_TrashCan",
     style: {
       cursor: 'pointer'
-    },
-    onClick: function onClick() {
-      setCombineValues({});
-      setCurrent('');
     }
-  })) : null);
+  }), /*#__PURE__*/React.createElement("p", {
+    style: {
+      fontSize: '12px',
+      marginLeft: '4px',
+      cursor: 'pointer'
+    }
+  }, "\u6E05\u7A7A")) : null);
 };
 export default CombineTags;

package/dist/CombineSearch/style/index.d.ts

@@ -11,4 +11,5 @@ export declare const useTagsStyles: (props?: unknown) => import("antd-style").Re
     label: import("antd-style").SerializedStyles;
     value: import("antd-style").SerializedStyles;
     currentTag: import("antd-style").SerializedStyles;
+    closeIcon: import("antd-style").SerializedStyles;
 }>;

package/dist/CombineSearch/style/index.js

@@ -1,4 +1,4 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 import { createStyles } from "antd-style";
 import edit from "./edit.svg";
@@ -8,7 +8,7 @@ export var useCombineBoxStyles = createStyles(function (_ref, props) {
     token = _ref.token,
     stylish = _ref.stylish;
   return {
-    card: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border-radius: ", "px;\n    min-width: 300px;\n    background-color: #f7f7f7;\n    border: ", ";\n    .icon-span {\n      width: 28px;\n      min-width: 28px;\n      display: flex;\n      justify-content: end;\n      align-items: center;\n      transform: translateX(5px)\n    }\n    .select-no-padding {\n      .", "-select-selector {\n        padding: 0 0 0 12px !important\n      }\n    }\n  "])), token.borderRadius, props.focus ? "1px solid ".concat(token.colorPrimary) : "1px solid ".concat(props.border ? token.colorBorder : 'transparent'), prefixCls),
+    card: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border-radius: ", "px;\n    min-width: 300px;\n    background-color: #f7f7f7;\n    border: ", ";\n    .icon-span {\n      width: 28px;\n      min-width: 28px;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      .hc-icon {\n        transform: translateX(2px)\n      }\n    }\n    .select-no-padding {\n      .", "-select-selector {\n        padding: 0px !important\n      }\n    }\n  "])), token.borderRadius, props.focus ? "1px solid ".concat(token.colorPrimary) : "1px solid ".concat(props.border ? token.colorBorder : 'transparent'), prefixCls),
     box: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    width: 100%;\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    justify-content: space-between;\n  "]))),
     left: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    width: 100%;\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    flex-wrap: wrap;\n  "]))),
     right: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    display: flex;\n    gap: 2px;\n    align-items: center;\n  "])))
@@ -21,6 +21,7 @@ export var useTagsStyles = createStyles(function (_ref2) {
   return {
     label: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    color: rgba(0, 0, 0, 0.3);\n    cursor: url(", "), pointer;\n  "])), edit),
     value: css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    color: rgba(89, 89, 89, 1);\n    padding-right: 12px;\n    overflow: hidden;\n    cursor: url(", "), pointer;\n  "])), edit),
-    currentTag: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    max-width: 350px;\n    overflow: hidden;\n  "])))
+    currentTag: css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    max-width: 350px;\n    background-color: #f4f4f4;\n    border-color: #E0E0E0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  "]))),
+    closeIcon: css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 0;\n    font-size: 12px;\n\n    /* Icon \u4E3A 1em\uFF0C\u9700\u76F4\u63A5\u6539 svg \u5C3A\u5BF8 */\n    .hc-icon {\n      width: 12px;\n      height: 12px;\n      font-size: 12px;\n      vertical-align: middle;\n    }\n  "])))
   };
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hc-busin-components",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -57,11 +57,30 @@
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
+  "dependencies": {
+    "@ant-design/plots": "^1.0.9",
+    "@codemirror/lang-javascript": "^6.2.3",
+    "@codemirror/lang-yaml": "^6.1.2",
+    "@codemirror/language": "^6.11.0",
+    "@codemirror/state": "^6.5.2",
+    "@codemirror/view": "^6.36.5",
+    "@lezer/highlight": "^1.2.1",
+    "@uiw/react-codemirror": "^4.23.10",
+    "antd-style": "^3.7.1",
+    "copy-to-clipboard": "^3.3.3",
+    "js-yaml": "^4.1.0",
+    "lodash": "^4.17.21",
+    "moment": "^2.30.1",
+    "rc-calendar": "^9.15.11",
+    "rc-time-picker": "^3.7.3",
+    "xterm": "^4.19.0",
+    "xterm-addon-fit": "^0.5.0",
+    "yaml": "^1.10.2"
+  },
   "devDependencies": {
     "@ant-design/compatible": "^5.1.3",
     "@ant-design/happy-work-theme": "^1.0.0",
     "@ant-design/icons": "^5.5.2",
-    "@ant-design/plots": "^1.0.9",
     "@codesandbox/sandpack-react": "^2.19.10",
     "@commitlint/cli": "^17.1.2",
     "@commitlint/config-conventional": "^17.1.0",
@@ -76,11 +95,9 @@
     "@types/react-dom": "^18.0.0",
     "@umijs/lint": "^4.0.0",
     "antd": "^5.24.3",
-    "antd-style": "^3.7.1",
     "antd-token-previewer": "^2.0.8",
     "classnames": "^2.5.1",
     "cross-fetch": "^4.0.0",
-    "dayjs": "^1.11.13",
     "dumi": "^2.3.0",
     "eslint": "^8.23.0",
     "eslint-plugin-unicorn": "^56.0.1",
@@ -88,7 +105,6 @@
     "husky": "^8.0.1",
     "jsonml-to-react-element": "^1.1.11",
     "lint-staged": "^13.0.3",
-    "lodash": "^4.17.21",
     "prettier": "^2.7.1",
     "prettier-plugin-organize-imports": "^3.0.0",
     "prettier-plugin-packagejson": "^2.2.18",
@@ -100,22 +116,6 @@
     "styled-components": "^6.1.15",
     "stylelint": "^14.9.1",
     "sylvanas": "^0.6.1",
-    "vanilla-tilt": "^1.8.1",
-    "@codemirror/lang-javascript": "^6.2.3",
-    "@codemirror/lang-yaml": "^6.1.2",
-    "@codemirror/language": "^6.11.0",
-    "@codemirror/state": "^6.5.2",
-    "@codemirror/view": "^6.36.5",
-    "@lezer/highlight": "^1.2.1",
-    "@uiw/react-codemirror": "^4.23.10",
-    "copy-to-clipboard": "^3.3.3",
-    "js-yaml": "^4.1.0",
-    "moment": "^2.30.1",
-    "rc-calendar": "^9.15.11",
-    "rc-time-picker": "^3.7.3",
-    "xterm": "^4.19.0",
-    "xterm-addon-fit": "^0.5.0",
-    "yaml": "^1.10.2"
-  },
-  "dependencies": {}
+    "vanilla-tilt": "^1.8.1"
+  }
 }