linkmore-design 1.0.13 → 1.0.14

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.
Files changed (7) hide show
  1. package/dist/index.umd.js +80 -6
  2. package/dist/index.umd.min.js +6 -6
  3. package/es/Dropdown/index.d.ts +1 -0
  4. package/es/Dropdown/index.js +78 -7
  5. package/lib/Dropdown/index.d.ts +1 -0
  6. package/lib/Dropdown/index.js +81 -7
  7. package/package.json +1 -1
package/es/Dropdown/index.d.ts CHANGED
@@ -3,6 +3,7 @@ import { DropdownProps, Dropdown } from 'antd';
3
3
  export interface IDropdownProps extends DropdownProps {
4
4
  className?: string;
5
5
  style?: React.CSSProperties;
6
+ dropdownmatchwidth?: boolean;
6
7
  }
7
8
  interface LmDropdownInterface extends React.FC<IDropdownProps> {
8
9
  Button?: typeof Dropdown.Button;
package/es/Dropdown/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import "antd/es/dropdown/style";
2
2
  import _Dropdown from "antd/es/dropdown";
3
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
4
 
4
5
  var __rest = this && this.__rest || function (s, e) {
5
6
  var t = {};
@@ -14,7 +15,7 @@ var __rest = this && this.__rest || function (s, e) {
14
15
  return t;
15
16
  };
16
17
 
17
- import React from 'react';
18
+ import React, { useRef, useEffect, useState } from 'react';
18
19
  import classNames from 'classnames';
19
20
  var prefixCls = 'lm_dropdown';
20
21
 
@@ -22,24 +23,94 @@ var CLMDropdown = function CLMDropdown(props) {
22
23
  var children = props.children,
23
24
  className = props.className,
24
25
  overlayClassName = props.overlayClassName,
25
- others = __rest(props, ["children", "className", "overlayClassName"]);
26
+ _props$dropdownmatchw = props.dropdownmatchwidth,
27
+ dropdownmatchwidth = _props$dropdownmatchw === void 0 ? false : _props$dropdownmatchw,
28
+ others = __rest(props, ["children", "className", "overlayClassName", "dropdownmatchwidth"]);
26
29
 
27
- return /*#__PURE__*/React.createElement(_Dropdown, Object.assign({
30
+ var dropdownRef = useRef(null);
31
+
32
+ var _useState = useState(''),
33
+ _useState2 = _slicedToArray(_useState, 2),
34
+ minwidth = _useState2[0],
35
+ setMinWidth = _useState2[1];
36
+
37
+ useEffect(function () {
38
+ var _a, _b, _c;
39
+
40
+ if (dropdownmatchwidth) {
41
+ var dropdown_dom = (_a = dropdownRef.current.getElementsByClassName("lm_dropdown")) === null || _a === void 0 ? void 0 : _a[0];
42
+
43
+ if (dropdown_dom) {
44
+ console.log((_b = dropdown_dom.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width);
45
+ setMinWidth(((_c = dropdown_dom.getBoundingClientRect()) === null || _c === void 0 ? void 0 : _c.width) || '');
46
+ }
47
+ }
48
+ }, []);
49
+
50
+ if (!dropdownmatchwidth) {
51
+ return /*#__PURE__*/React.createElement(_Dropdown, Object.assign({
52
+ className: classNames(className, prefixCls)
53
+ }, others, {
54
+ overlayClassName: classNames(overlayClassName, 'lm_dropdown_overlay')
55
+ }), children);
56
+ }
57
+
58
+ return /*#__PURE__*/React.createElement("div", {
59
+ ref: dropdownRef
60
+ }, /*#__PURE__*/React.createElement(_Dropdown, Object.assign({
28
61
  className: classNames(className, prefixCls)
29
62
  }, others, {
30
- overlayClassName: classNames(overlayClassName, 'lm_dropdown_overlay')
31
- }), children);
63
+ overlayClassName: classNames(overlayClassName, 'lm_dropdown_overlay'),
64
+ overlayStyle: minwidth ? Object.assign({
65
+ minWidth: minwidth
66
+ }, others.overlayStyle) : Object.assign({}, others.overlayStyle)
67
+ }), children));
32
68
  };
33
69
 
34
70
  var LMDropdown = CLMDropdown;
35
71
 
36
72
  LMDropdown.Button = function (props) {
37
- return /*#__PURE__*/React.createElement(_Dropdown.Button, Object.assign({
73
+ var _props$dropdownmatchw2 = props.dropdownmatchwidth,
74
+ dropdownmatchwidth = _props$dropdownmatchw2 === void 0 ? false : _props$dropdownmatchw2;
75
+ var dropdownRef = useRef(null);
76
+
77
+ var _useState3 = useState(''),
78
+ _useState4 = _slicedToArray(_useState3, 2),
79
+ minwidth = _useState4[0],
80
+ setMinWidth = _useState4[1];
81
+
82
+ useEffect(function () {
83
+ var _a, _b;
84
+
85
+ if (dropdownmatchwidth) {
86
+ var dropdown_dom = (_a = dropdownRef.current.getElementsByClassName("lm_dropdown_button")) === null || _a === void 0 ? void 0 : _a[0];
87
+
88
+ if (dropdown_dom) {
89
+ setMinWidth(((_b = dropdown_dom.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width) || '');
90
+ }
91
+ }
92
+ }, []);
93
+
94
+ if (!dropdownmatchwidth) {
95
+ return /*#__PURE__*/React.createElement(_Dropdown.Button, Object.assign({
96
+ size: 'small'
97
+ }, props, {
98
+ overlayClassName: classNames(props.overlayClassName, 'lm_dropdown_overlay'),
99
+ className: classNames(props.className, 'lm_dropdown_button')
100
+ }));
101
+ }
102
+
103
+ return /*#__PURE__*/React.createElement("div", {
104
+ ref: dropdownRef
105
+ }, /*#__PURE__*/React.createElement(_Dropdown.Button, Object.assign({
38
106
  size: 'small'
39
107
  }, props, {
40
108
  overlayClassName: classNames(props.overlayClassName, 'lm_dropdown_overlay'),
109
+ overlayStyle: minwidth ? Object.assign({
110
+ minWidth: minwidth
111
+ }, props.overlayStyle) : Object.assign({}, props.overlayStyle),
41
112
  className: classNames(props.className, 'lm_dropdown_button')
42
- }));
113
+ })));
43
114
  };
44
115
 
45
116
  export default LMDropdown;
package/lib/Dropdown/index.d.ts CHANGED
@@ -3,6 +3,7 @@ import { DropdownProps, Dropdown } from 'antd';
3
3
  export interface IDropdownProps extends DropdownProps {
4
4
  className?: string;
5
5
  style?: React.CSSProperties;
6
+ dropdownmatchwidth?: boolean;
6
7
  }
7
8
  interface LmDropdownInterface extends React.FC<IDropdownProps> {
8
9
  Button?: typeof Dropdown.Button;
package/lib/Dropdown/index.js CHANGED
@@ -1,5 +1,7 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
+
3
5
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
6
 
5
7
  Object.defineProperty(exports, "__esModule", {
@@ -11,7 +13,9 @@ require("antd/es/dropdown/style");
11
13
 
12
14
  var _dropdown = _interopRequireDefault(require("antd/es/dropdown"));
13
15
 
14
- var _react = _interopRequireDefault(require("react"));
16
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
+
18
+ var _react = _interopRequireWildcard(require("react"));
15
19
 
16
20
  var _classnames = _interopRequireDefault(require("classnames"));
17
21
 
@@ -34,24 +38,94 @@ var CLMDropdown = function CLMDropdown(props) {
34
38
  var children = props.children,
35
39
  className = props.className,
36
40
  overlayClassName = props.overlayClassName,
37
- others = __rest(props, ["children", "className", "overlayClassName"]);
41
+ _props$dropdownmatchw = props.dropdownmatchwidth,
42
+ dropdownmatchwidth = _props$dropdownmatchw === void 0 ? false : _props$dropdownmatchw,
43
+ others = __rest(props, ["children", "className", "overlayClassName", "dropdownmatchwidth"]);
44
+
45
+ var dropdownRef = (0, _react.useRef)(null);
46
+
47
+ var _useState = (0, _react.useState)(''),
48
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
49
+ minwidth = _useState2[0],
50
+ setMinWidth = _useState2[1];
51
+
52
+ (0, _react.useEffect)(function () {
53
+ var _a, _b, _c;
54
+
55
+ if (dropdownmatchwidth) {
56
+ var dropdown_dom = (_a = dropdownRef.current.getElementsByClassName("lm_dropdown")) === null || _a === void 0 ? void 0 : _a[0];
57
+
58
+ if (dropdown_dom) {
59
+ console.log((_b = dropdown_dom.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width);
60
+ setMinWidth(((_c = dropdown_dom.getBoundingClientRect()) === null || _c === void 0 ? void 0 : _c.width) || '');
61
+ }
62
+ }
63
+ }, []);
64
+
65
+ if (!dropdownmatchwidth) {
66
+ return /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
67
+ className: (0, _classnames.default)(className, prefixCls)
68
+ }, others, {
69
+ overlayClassName: (0, _classnames.default)(overlayClassName, 'lm_dropdown_overlay')
70
+ }), children);
71
+ }
38
72
 
39
- return /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
73
+ return /*#__PURE__*/_react.default.createElement("div", {
74
+ ref: dropdownRef
75
+ }, /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
40
76
  className: (0, _classnames.default)(className, prefixCls)
41
77
  }, others, {
42
- overlayClassName: (0, _classnames.default)(overlayClassName, 'lm_dropdown_overlay')
43
- }), children);
78
+ overlayClassName: (0, _classnames.default)(overlayClassName, 'lm_dropdown_overlay'),
79
+ overlayStyle: minwidth ? Object.assign({
80
+ minWidth: minwidth
81
+ }, others.overlayStyle) : Object.assign({}, others.overlayStyle)
82
+ }), children));
44
83
  };
45
84
 
46
85
  var LMDropdown = CLMDropdown;
47
86
 
48
87
  LMDropdown.Button = function (props) {
49
- return /*#__PURE__*/_react.default.createElement(_dropdown.default.Button, Object.assign({
88
+ var _props$dropdownmatchw2 = props.dropdownmatchwidth,
89
+ dropdownmatchwidth = _props$dropdownmatchw2 === void 0 ? false : _props$dropdownmatchw2;
90
+ var dropdownRef = (0, _react.useRef)(null);
91
+
92
+ var _useState3 = (0, _react.useState)(''),
93
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
94
+ minwidth = _useState4[0],
95
+ setMinWidth = _useState4[1];
96
+
97
+ (0, _react.useEffect)(function () {
98
+ var _a, _b;
99
+
100
+ if (dropdownmatchwidth) {
101
+ var dropdown_dom = (_a = dropdownRef.current.getElementsByClassName("lm_dropdown_button")) === null || _a === void 0 ? void 0 : _a[0];
102
+
103
+ if (dropdown_dom) {
104
+ setMinWidth(((_b = dropdown_dom.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.width) || '');
105
+ }
106
+ }
107
+ }, []);
108
+
109
+ if (!dropdownmatchwidth) {
110
+ return /*#__PURE__*/_react.default.createElement(_dropdown.default.Button, Object.assign({
111
+ size: 'small'
112
+ }, props, {
113
+ overlayClassName: (0, _classnames.default)(props.overlayClassName, 'lm_dropdown_overlay'),
114
+ className: (0, _classnames.default)(props.className, 'lm_dropdown_button')
115
+ }));
116
+ }
117
+
118
+ return /*#__PURE__*/_react.default.createElement("div", {
119
+ ref: dropdownRef
120
+ }, /*#__PURE__*/_react.default.createElement(_dropdown.default.Button, Object.assign({
50
121
  size: 'small'
51
122
  }, props, {
52
123
  overlayClassName: (0, _classnames.default)(props.overlayClassName, 'lm_dropdown_overlay'),
124
+ overlayStyle: minwidth ? Object.assign({
125
+ minWidth: minwidth
126
+ }, props.overlayStyle) : Object.assign({}, props.overlayStyle),
53
127
  className: (0, _classnames.default)(props.className, 'lm_dropdown_button')
54
- }));
128
+ })));
55
129
  };
56
130
 
57
131
  var _default = LMDropdown;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "linkmore-design",
3
- "version": "1.0.13",
3
+ "version": "1.0.14",
4
4
  "author": {
5
5
  "name": "nowthen",
6
6
  "email": "rnlvwyx@gmail.com"