@vtx/components 4.0.0-beta.94 → 4.0.0-beta.95

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  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); }
2
- var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth"];
2
+ var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth", "formProps"];
3
3
  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; }
4
4
  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; }
5
5
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -51,6 +51,8 @@ function VtxCombogrid(props, ref) {
51
51
  _props$headFootHeight = props.headFootHeight,
52
52
  headFootHeight = _props$headFootHeight === void 0 ? 95 : _props$headFootHeight,
53
53
  popoverWidth = props.popoverWidth,
54
+ _props$formProps = props.formProps,
55
+ formProps = _props$formProps === void 0 ? {} : _props$formProps,
54
56
  rest = _objectWithoutProperties(props, _excluded);
55
57
  var prefixCls = getPrefixCls('', 'vtx-combogrid');
56
58
  var _useStyle = useStyle(prefixCls, {
@@ -184,8 +186,9 @@ function VtxCombogrid(props, ref) {
184
186
  return wrapSSR( /*#__PURE__*/_jsxs("div", {
185
187
  className: "".concat(prefixCls, "-popover"),
186
188
  ref: ref,
187
- children: [formLen > 0 && /*#__PURE__*/_jsx(Form, {
188
- form: form,
189
+ children: [formLen > 0 && /*#__PURE__*/_jsx(Form, _objectSpread(_objectSpread({
190
+ form: form
191
+ }, formProps), {}, {
189
192
  children: /*#__PURE__*/_jsxs(Row, {
190
193
  gutter: 8,
191
194
  children: [/*#__PURE__*/_jsxs(Col, {
@@ -223,7 +226,7 @@ function VtxCombogrid(props, ref) {
223
226
  })]
224
227
  })]
225
228
  })
226
- }), /*#__PURE__*/_jsx("div", {
229
+ })), /*#__PURE__*/_jsx("div", {
227
230
  className: "".concat(prefixCls, "-main"),
228
231
  children: /*#__PURE__*/_jsx(VtxDatagrid, _objectSpread(_objectSpread(_objectSpread({
229
232
  toolbar: false
@@ -59,8 +59,7 @@ var genStyle = function genStyle(token) {
59
59
  })), "".concat(antTabs, "-tab-active"), _defineProperty({
60
60
  background: 'rgba(22,119,255,0.08)',
61
61
  border: '1px solid rgba(22,119,255,0.1)',
62
- color: colorPrimary,
63
- fontWeight: 500
62
+ color: colorPrimary
64
63
  }, "".concat(antTabs, "-tab-btn"), {
65
64
  color: colorPrimary
66
65
  })), "".concat(antTabs, "-ink-bar"), {
@@ -28,6 +28,7 @@ import { useContext, useEffect, useMemo, useRef, useState } from 'react';
28
28
  import VtxIcon from "../vtx-icon";
29
29
  import { VtxProvider, useIntl } from "../vtx-provider";
30
30
  import { useStyle } from "./style/index";
31
+ import { useMemoizedFn } from 'ahooks';
31
32
  import { jsxs as _jsxs } from "react/jsx-runtime";
32
33
  import { jsx as _jsx } from "react/jsx-runtime";
33
34
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -68,6 +69,19 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
68
69
  setPopOpen = _useState4[1];
69
70
  var ref = useRef();
70
71
  var size = useSize(ref);
72
+ var getDropdownWidth = useMemoizedFn(function (data) {
73
+ var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
74
+ return data.reduce(function (maxWidth, item) {
75
+ var textWidth = Array.from(item[fieldNames.label]).reduce(function (width, char) {
76
+ return width + (char.charCodeAt(0) > 255 ? 14 : 8);
77
+ }, 0);
78
+ var currentWidth = level * 24 + textWidth + 64;
79
+ return Math.max(maxWidth, currentWidth, getDropdownWidth(item[fieldNames.children] || [], level + 1));
80
+ }, 0);
81
+ });
82
+ var dropdownWidth = useMemo(function () {
83
+ return Math.max(280, getDropdownWidth(treeData || []));
84
+ }, [treeData]);
71
85
  var keyNodesMapping = useMemo(function () {
72
86
  var keyNodesMapping = {};
73
87
  // 建议:添加树数据有效性检查
@@ -201,8 +215,13 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
201
215
  },
202
216
  styles: {
203
217
  popup: {
204
- maxHeight: 300,
205
- overflow: 'auto'
218
+ root: {
219
+ maxHeight: 300,
220
+ overflow: 'auto'
221
+ },
222
+ itemTitle: {
223
+ wordBreak: 'break-all'
224
+ }
206
225
  }
207
226
  },
208
227
  classNames: {
@@ -212,7 +231,8 @@ var VtxTreeSelect = function VtxTreeSelect(_ref) {
212
231
  treeDefaultExpandAll: true,
213
232
  fieldNames: fieldNames,
214
233
  labelInValue: _labelInValue,
215
- disabled: disabled
234
+ disabled: disabled,
235
+ popupMatchSelectWidth: dropdownWidth
216
236
  }, props), {}, {
217
237
  onChange: function onChange(value, label, extra) {
218
238
  return onChangeTreeSelect(value, label, extra, selectedNodes);
@@ -14,7 +14,7 @@ var _vtxDatagrid = _interopRequireDefault(require("../vtx-datagrid"));
14
14
  var _style = require("./style");
15
15
  var _vtxProvider = require("../vtx-provider");
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
- var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth"];
17
+ var _excluded = ["setPopoverVisible", "multiple", "onChange", "getTableData", "columns", "searchForms", "selectedRowKeys", "setSelectedRowKeys", "spread", "defaultPageSize", "customEnumText", "headFootHeight", "popoverWidth", "formProps"];
18
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
19
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
20
20
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -59,6 +59,8 @@ function VtxCombogrid(props, ref) {
59
59
  _props$headFootHeight = props.headFootHeight,
60
60
  headFootHeight = _props$headFootHeight === void 0 ? 95 : _props$headFootHeight,
61
61
  popoverWidth = props.popoverWidth,
62
+ _props$formProps = props.formProps,
63
+ formProps = _props$formProps === void 0 ? {} : _props$formProps,
62
64
  rest = _objectWithoutProperties(props, _excluded);
63
65
  var prefixCls = getPrefixCls('', 'vtx-combogrid');
64
66
  var _useStyle = (0, _style.useStyle)(prefixCls, {
@@ -192,8 +194,9 @@ function VtxCombogrid(props, ref) {
192
194
  return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
193
195
  className: "".concat(prefixCls, "-popover"),
194
196
  ref: ref,
195
- children: [formLen > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form, {
196
- form: form,
197
+ children: [formLen > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Form, _objectSpread(_objectSpread({
198
+ form: form
199
+ }, formProps), {}, {
197
200
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Row, {
198
201
  gutter: 8,
199
202
  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Col, {
@@ -231,7 +234,7 @@ function VtxCombogrid(props, ref) {
231
234
  })]
232
235
  })]
233
236
  })
234
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
237
+ })), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
235
238
  className: "".concat(prefixCls, "-main"),
236
239
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vtxDatagrid.default, _objectSpread(_objectSpread(_objectSpread({
237
240
  toolbar: false
@@ -66,8 +66,7 @@ var genStyle = function genStyle(token) {
66
66
  })), "".concat(antTabs, "-tab-active"), _defineProperty({
67
67
  background: 'rgba(22,119,255,0.08)',
68
68
  border: '1px solid rgba(22,119,255,0.1)',
69
- color: colorPrimary,
70
- fontWeight: 500
69
+ color: colorPrimary
71
70
  }, "".concat(antTabs, "-tab-btn"), {
72
71
  color: colorPrimary
73
72
  })), "".concat(antTabs, "-ink-bar"), {
@@ -73,6 +73,19 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
73
73
  setPopOpen = _useState4[1];
74
74
  var ref = (0, _react.useRef)();
75
75
  var size = (0, _ahooks.useSize)(ref);
76
+ var getDropdownWidth = (0, _ahooks.useMemoizedFn)(function (data) {
77
+ var level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
78
+ return data.reduce(function (maxWidth, item) {
79
+ var textWidth = Array.from(item[fieldNames.label]).reduce(function (width, char) {
80
+ return width + (char.charCodeAt(0) > 255 ? 14 : 8);
81
+ }, 0);
82
+ var currentWidth = level * 24 + textWidth + 64;
83
+ return Math.max(maxWidth, currentWidth, getDropdownWidth(item[fieldNames.children] || [], level + 1));
84
+ }, 0);
85
+ });
86
+ var dropdownWidth = (0, _react.useMemo)(function () {
87
+ return Math.max(280, getDropdownWidth(treeData || []));
88
+ }, [treeData]);
76
89
  var keyNodesMapping = (0, _react.useMemo)(function () {
77
90
  var keyNodesMapping = {};
78
91
  // 建议:添加树数据有效性检查
@@ -206,8 +219,13 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
206
219
  },
207
220
  styles: {
208
221
  popup: {
209
- maxHeight: 300,
210
- overflow: 'auto'
222
+ root: {
223
+ maxHeight: 300,
224
+ overflow: 'auto'
225
+ },
226
+ itemTitle: {
227
+ wordBreak: 'break-all'
228
+ }
211
229
  }
212
230
  },
213
231
  classNames: {
@@ -217,7 +235,8 @@ var VtxTreeSelect = exports.VtxTreeSelect = function VtxTreeSelect(_ref) {
217
235
  treeDefaultExpandAll: true,
218
236
  fieldNames: fieldNames,
219
237
  labelInValue: _labelInValue,
220
- disabled: disabled
238
+ disabled: disabled,
239
+ popupMatchSelectWidth: dropdownWidth
221
240
  }, props), {}, {
222
241
  onChange: function onChange(value, label, extra) {
223
242
  return onChangeTreeSelect(value, label, extra, selectedNodes);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vtx/components",
3
- "version": "4.0.0-beta.94",
3
+ "version": "4.0.0-beta.95",
4
4
  "description": "React components for Vortex",
5
5
  "keywords": [
6
6
  "react",