@capillarytech/blaze-ui 0.1.6-alpha.35 → 0.1.6-alpha.37
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.
- package/CapUnifiedSelect/CapUnifiedSelect.js +1 -1
- package/index.js +3 -2
- package/package.json +1 -1
- package/utils/index.js +1 -7
- package/utils/withStyles.js +19 -10
- package/components/CapInput/CapInput.js +0 -60
- package/components/CapInput/Number.js +0 -39
- package/components/CapInput/Search.js +0 -34
- package/components/CapInput/TextArea.js +0 -41
- package/components/CapInput/index.js +0 -13
- package/components/CapInput/messages.js +0 -24
- package/components/CapInput/styles.js +0 -8
- package/components/CapSkeleton/CapSkeleton.js +0 -24
- package/components/CapSkeleton/index.js +0 -7
- package/components/CapSpin/CapSpin.js +0 -30
- package/components/CapSpin/index.js +0 -7
- package/components/CapTable/CapTable.js +0 -118
- package/components/CapTable/index.js +0 -7
- package/components/CapTable/loadable.js +0 -18
- package/components/CapTable/styles.js +0 -23
- package/components/CapTestSelect/CapTestSelect.js +0 -36
- package/components/CapTestSelect/index.js +0 -7
- package/components/CapUnifiedSelect/CapUnifiedSelect.js +0 -361
- package/components/CapUnifiedSelect/index.js +0 -7
- package/components/CapUnifiedSelect/messages.js +0 -27
- package/components/CapUnifiedSelect/styles.js +0 -36
- package/components/LocaleHoc/index.js +0 -42
- package/components/assets/upload.svg +0 -3
- package/components/index.js +0 -22
- package/components/styled/index.js +0 -14
- package/components/styled/variables.js +0 -70
- package/components/translations/en.js +0 -333
|
@@ -8,7 +8,7 @@ import uploadIcon from '../assets/upload.svg';
|
|
|
8
8
|
|
|
9
9
|
import { InfoCircleOutlined, SearchOutlined, WarningFilled, DownOutlined } from '@ant-design/icons';
|
|
10
10
|
|
|
11
|
-
import withStyles from '
|
|
11
|
+
import withStyles from '../utils/withStyles';
|
|
12
12
|
import { SelectWrapper, HeaderWrapper, selectStyles } from './styles';
|
|
13
13
|
|
|
14
14
|
const CapUnifiedSelect = ({
|
package/index.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
// Import and export all components
|
|
2
2
|
export { default as CapInput } from './CapInput';
|
|
3
|
+
export { default as CapSkeleton } from './CapSkeleton';
|
|
4
|
+
export { default as CapSpin } from './CapSpin';
|
|
3
5
|
export { default as CapTable } from './CapTable';
|
|
4
|
-
export { default as CapTestSelect } from './CapTestSelect'; // Test component for Ant Design v5 integration
|
|
5
6
|
export { default as CapUnifiedSelect } from './CapUnifiedSelect';
|
|
6
7
|
|
|
7
8
|
// Export utilities
|
|
@@ -12,4 +13,4 @@ export * as styledVars from './styled/variables';
|
|
|
12
13
|
export { default as styled } from './styled';
|
|
13
14
|
|
|
14
15
|
// Export utils
|
|
15
|
-
export * as Utils from '
|
|
16
|
+
export * as Utils from './utils';
|
package/package.json
CHANGED
package/utils/index.js
CHANGED
|
@@ -1,7 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.withStyles = void 0;
|
|
5
|
-
var _withStyles = _interopRequireDefault(require("./withStyles"));
|
|
6
|
-
exports.withStyles = _withStyles.default;
|
|
7
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
1
|
+
export { default as withStyles } from './withStyles';
|
package/utils/withStyles.js
CHANGED
|
@@ -1,15 +1,24 @@
|
|
|
1
|
-
|
|
1
|
+
import styled from 'styled-components';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
/**
|
|
4
|
+
* Enhances a React component with additional styles using styled-components.
|
|
5
|
+
* @param {React.ComponentType} WrappedComponent - The React component to enhance.
|
|
6
|
+
* @param {TemplateStringsArray} styles - CSS styles as a TemplateStringsArray.
|
|
7
|
+
* @returns {React.ComponentType} Returns the enhanced styled component.
|
|
8
|
+
*/
|
|
7
9
|
const withStyledComponent = (WrappedComponent, styles) => {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
/**
|
|
11
|
+
* A styled component generated by combining WrappedComponent with additional styles.
|
|
12
|
+
* @type {React.ComponentType}
|
|
13
|
+
*/
|
|
14
|
+
const StyledComponent = styled(WrappedComponent)`
|
|
15
|
+
${styles};
|
|
16
|
+
`;
|
|
17
|
+
|
|
18
|
+
// Set default props from the original component to the styled component
|
|
12
19
|
StyledComponent.defaultProps = WrappedComponent.defaultProps;
|
|
20
|
+
|
|
13
21
|
return StyledComponent;
|
|
14
22
|
};
|
|
15
|
-
|
|
23
|
+
|
|
24
|
+
export default withStyledComponent;
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _icons = require("@ant-design/icons");
|
|
9
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
|
-
var styledVars = _interopRequireWildcard(require("../styled/variables"));
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
14
|
-
const StyledIcon = _styledComponents.default.span.withConfig({
|
|
15
|
-
displayName: "StyledIcon",
|
|
16
|
-
componentId: "sc-1ghbg8a-0"
|
|
17
|
-
})(["color:", ";color:", ";"], props => props.status === "error" && styledVars.CAP_RED, props => props.status === "success" && styledVars.CAP_PRIMARY.base);
|
|
18
|
-
const CapInput = _react.default.forwardRef((props, ref) => {
|
|
19
|
-
const {
|
|
20
|
-
alwaysShowFocus,
|
|
21
|
-
errorMessage,
|
|
22
|
-
isVerified,
|
|
23
|
-
suffix,
|
|
24
|
-
showSuffix = true,
|
|
25
|
-
...rest
|
|
26
|
-
} = props;
|
|
27
|
-
const inputRef = (0, _react.useRef)(null);
|
|
28
|
-
(0, _react.useEffect)(() => {
|
|
29
|
-
if (alwaysShowFocus && inputRef.current) {
|
|
30
|
-
inputRef.current.focus();
|
|
31
|
-
}
|
|
32
|
-
}, [alwaysShowFocus]);
|
|
33
|
-
const inputSuffix = errorMessage && (0, _jsxRuntime.jsx)(StyledIcon, {
|
|
34
|
-
status: "error",
|
|
35
|
-
children: (0, _jsxRuntime.jsx)(_icons.WarningOutlined, {})
|
|
36
|
-
}) || isVerified && (0, _jsxRuntime.jsx)(StyledIcon, {
|
|
37
|
-
status: "success",
|
|
38
|
-
children: (0, _jsxRuntime.jsx)(_icons.CheckCircleOutlined, {})
|
|
39
|
-
}) || suffix || null;
|
|
40
|
-
return (0, _jsxRuntime.jsx)(_antd.Input, {
|
|
41
|
-
...rest,
|
|
42
|
-
ref: ref || inputRef,
|
|
43
|
-
suffix: showSuffix === false ? null : inputSuffix,
|
|
44
|
-
status: errorMessage ? 'error' : undefined
|
|
45
|
-
});
|
|
46
|
-
});
|
|
47
|
-
CapInput.displayName = 'CapInput';
|
|
48
|
-
CapInput.propTypes = {
|
|
49
|
-
alwaysShowFocus: _propTypes.default.bool,
|
|
50
|
-
errorMessage: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]),
|
|
51
|
-
isVerified: _propTypes.default.bool,
|
|
52
|
-
size: _propTypes.default.oneOf(['large', 'middle', 'small']),
|
|
53
|
-
suffix: _propTypes.default.node,
|
|
54
|
-
showSuffix: _propTypes.default.bool
|
|
55
|
-
};
|
|
56
|
-
CapInput.defaultProps = {
|
|
57
|
-
size: 'large',
|
|
58
|
-
showSuffix: true
|
|
59
|
-
};
|
|
60
|
-
var _default = exports.default = CapInput;
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const CapInputNumber = _react.default.forwardRef((props, ref) => {
|
|
11
|
-
const {
|
|
12
|
-
size = 'large',
|
|
13
|
-
...rest
|
|
14
|
-
} = props;
|
|
15
|
-
return (0, _jsxRuntime.jsx)(_antd.InputNumber, {
|
|
16
|
-
...rest,
|
|
17
|
-
ref: ref,
|
|
18
|
-
size: size
|
|
19
|
-
});
|
|
20
|
-
});
|
|
21
|
-
CapInputNumber.displayName = 'CapInputNumber';
|
|
22
|
-
CapInputNumber.propTypes = {
|
|
23
|
-
size: _propTypes.default.oneOf(['large', 'middle', 'small']),
|
|
24
|
-
min: _propTypes.default.number,
|
|
25
|
-
max: _propTypes.default.number,
|
|
26
|
-
step: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
27
|
-
precision: _propTypes.default.number,
|
|
28
|
-
decimalSeparator: _propTypes.default.string,
|
|
29
|
-
formatter: _propTypes.default.func,
|
|
30
|
-
parser: _propTypes.default.func,
|
|
31
|
-
controls: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.object]),
|
|
32
|
-
keyboard: _propTypes.default.bool,
|
|
33
|
-
stringMode: _propTypes.default.bool
|
|
34
|
-
};
|
|
35
|
-
CapInputNumber.defaultProps = {
|
|
36
|
-
size: 'large',
|
|
37
|
-
keyboard: true
|
|
38
|
-
};
|
|
39
|
-
var _default = exports.default = CapInputNumber;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const {
|
|
11
|
-
Search
|
|
12
|
-
} = _antd.Input;
|
|
13
|
-
const CapInputSearch = _react.default.forwardRef((props, ref) => {
|
|
14
|
-
const {
|
|
15
|
-
size = 'large',
|
|
16
|
-
...rest
|
|
17
|
-
} = props;
|
|
18
|
-
return (0, _jsxRuntime.jsx)(Search, {
|
|
19
|
-
...rest,
|
|
20
|
-
ref: ref,
|
|
21
|
-
size: size
|
|
22
|
-
});
|
|
23
|
-
});
|
|
24
|
-
CapInputSearch.displayName = 'CapInputSearch';
|
|
25
|
-
CapInputSearch.propTypes = {
|
|
26
|
-
size: _propTypes.default.oneOf(['large', 'middle', 'small']),
|
|
27
|
-
enterButton: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.node]),
|
|
28
|
-
loading: _propTypes.default.bool,
|
|
29
|
-
onSearch: _propTypes.default.func
|
|
30
|
-
};
|
|
31
|
-
CapInputSearch.defaultProps = {
|
|
32
|
-
size: 'large'
|
|
33
|
-
};
|
|
34
|
-
var _default = exports.default = CapInputSearch;
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const {
|
|
11
|
-
TextArea
|
|
12
|
-
} = _antd.Input;
|
|
13
|
-
const CapInputTextArea = _react.default.forwardRef((props, ref) => {
|
|
14
|
-
const {
|
|
15
|
-
size = 'large',
|
|
16
|
-
...rest
|
|
17
|
-
} = props;
|
|
18
|
-
return (0, _jsxRuntime.jsx)(TextArea, {
|
|
19
|
-
...rest,
|
|
20
|
-
ref: ref,
|
|
21
|
-
size: size
|
|
22
|
-
});
|
|
23
|
-
});
|
|
24
|
-
CapInputTextArea.displayName = 'CapInputTextArea';
|
|
25
|
-
CapInputTextArea.propTypes = {
|
|
26
|
-
size: _propTypes.default.oneOf(['large', 'middle', 'small']),
|
|
27
|
-
autoSize: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.shape({
|
|
28
|
-
minRows: _propTypes.default.number,
|
|
29
|
-
maxRows: _propTypes.default.number
|
|
30
|
-
})]),
|
|
31
|
-
rows: _propTypes.default.number,
|
|
32
|
-
maxLength: _propTypes.default.number,
|
|
33
|
-
showCount: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.shape({
|
|
34
|
-
formatter: _propTypes.default.func
|
|
35
|
-
})])
|
|
36
|
-
};
|
|
37
|
-
CapInputTextArea.defaultProps = {
|
|
38
|
-
size: 'large',
|
|
39
|
-
rows: 4
|
|
40
|
-
};
|
|
41
|
-
var _default = exports.default = CapInputTextArea;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _CapInput = _interopRequireDefault(require("./CapInput"));
|
|
6
|
-
var _Number = _interopRequireDefault(require("./Number"));
|
|
7
|
-
var _Search = _interopRequireDefault(require("./Search"));
|
|
8
|
-
var _TextArea = _interopRequireDefault(require("./TextArea"));
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
_CapInput.default.Number = _Number.default;
|
|
11
|
-
_CapInput.default.Search = _Search.default;
|
|
12
|
-
_CapInput.default.TextArea = _TextArea.default;
|
|
13
|
-
var _default = exports.default = _CapInput.default;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _reactIntl = require("react-intl");
|
|
6
|
-
const scope = 'blaze.components.CapInput';
|
|
7
|
-
var _default = exports.default = (0, _reactIntl.defineMessages)({
|
|
8
|
-
placeholder: {
|
|
9
|
-
id: `${scope}.placeholder`,
|
|
10
|
-
defaultMessage: 'Enter text...'
|
|
11
|
-
},
|
|
12
|
-
searchPlaceholder: {
|
|
13
|
-
id: `${scope}.searchPlaceholder`,
|
|
14
|
-
defaultMessage: 'Search...'
|
|
15
|
-
},
|
|
16
|
-
textAreaPlaceholder: {
|
|
17
|
-
id: `${scope}.textAreaPlaceholder`,
|
|
18
|
-
defaultMessage: 'Enter your text here...'
|
|
19
|
-
},
|
|
20
|
-
numberPlaceholder: {
|
|
21
|
-
id: `${scope}.numberPlaceholder`,
|
|
22
|
-
defaultMessage: 'Enter number...'
|
|
23
|
-
}
|
|
24
|
-
});
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.inputStyles = void 0;
|
|
5
|
-
var _styledComponents = require("styled-components");
|
|
6
|
-
var styledVars = _interopRequireWildcard(require("../styled/variables"));
|
|
7
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
8
|
-
const inputStyles = exports.inputStyles = (0, _styledComponents.css)(["&.ant-input,&.ant-input-affix-wrapper,&.ant-input-number,&.ant-input-textarea{font-family:", ";border-radius:", ";transition:", ";&:hover{border-color:", ";}&:focus,&.ant-input-affix-wrapper-focused{border-color:", ";box-shadow:none;}&.ant-input-status-error,&.ant-input-affix-wrapper-status-error,&.ant-input-number-status-error{border-color:", ";&:hover{border-color:", ";}&:focus,&.ant-input-affix-wrapper-focused{border-color:", ";box-shadow:none;}}&.ant-input-disabled,&.ant-input-affix-wrapper-disabled{background-color:", ";cursor:not-allowed;}}&.ant-input-lg,&.ant-input-affix-wrapper-lg{font-size:14px;padding:10px 12px;}&.ant-input-textarea{.ant-input{font-family:", ";}}&.ant-input-number{width:100%;.ant-input-number-handler-wrap{opacity:1;}}&.ant-input-search{.ant-input-search-button{background-color:", ";border-color:", ";&:hover{background-color:", ";border-color:", ";}}}"], styledVars.FONT_FAMILY, styledVars.RADIUS_04, styledVars.TRANSITION_ALL, styledVars.CAP_G11, styledVars.CAP_G01, styledVars.CAP_RED, styledVars.CAP_RED, styledVars.CAP_RED, styledVars.CAP_G08, styledVars.FONT_FAMILY, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.base, styledVars.CAP_PRIMARY.hover, styledVars.CAP_PRIMARY.hover);
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const CapSkeleton = _ref => {
|
|
11
|
-
let {
|
|
12
|
-
className,
|
|
13
|
-
...rest
|
|
14
|
-
} = _ref;
|
|
15
|
-
const combinedClassName = `cap-skeleton-v2 ${className || ''}`.trim();
|
|
16
|
-
return (0, _jsxRuntime.jsx)(_antd.Skeleton, {
|
|
17
|
-
className: combinedClassName,
|
|
18
|
-
...rest
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
|
-
CapSkeleton.propTypes = {
|
|
22
|
-
className: _propTypes.default.string
|
|
23
|
-
};
|
|
24
|
-
var _default = exports.default = CapSkeleton;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _CapSkeleton = _interopRequireDefault(require("./CapSkeleton"));
|
|
6
|
-
exports.default = _CapSkeleton.default;
|
|
7
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const CapSpin = _ref => {
|
|
11
|
-
let {
|
|
12
|
-
className,
|
|
13
|
-
...rest
|
|
14
|
-
} = _ref;
|
|
15
|
-
return (0, _jsxRuntime.jsx)(_antd.Spin, {
|
|
16
|
-
className: className,
|
|
17
|
-
...rest
|
|
18
|
-
});
|
|
19
|
-
};
|
|
20
|
-
CapSpin.propTypes = {
|
|
21
|
-
className: _propTypes.default.string,
|
|
22
|
-
size: _propTypes.default.oneOf(['small', 'default', 'large']),
|
|
23
|
-
spinning: _propTypes.default.bool,
|
|
24
|
-
tip: _propTypes.default.string,
|
|
25
|
-
delay: _propTypes.default.number,
|
|
26
|
-
indicator: _propTypes.default.node,
|
|
27
|
-
fullscreen: _propTypes.default.bool,
|
|
28
|
-
wrapperClassName: _propTypes.default.string
|
|
29
|
-
};
|
|
30
|
-
var _default = exports.default = CapSpin;
|
|
@@ -1,118 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _lodash = require("lodash");
|
|
8
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
9
|
-
var _styles = require("./styles");
|
|
10
|
-
var _LocaleHoc = _interopRequireDefault(require("../LocaleHoc"));
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
14
|
-
const SCROLL_THRESHOLD = 80;
|
|
15
|
-
const DEBOUNCE_DELAY = 250;
|
|
16
|
-
const DEFAULT_ROW_HEIGHT = 54;
|
|
17
|
-
const DEFAULT_SCROLL_HEIGHT = 400;
|
|
18
|
-
const CapTable = _ref => {
|
|
19
|
-
let {
|
|
20
|
-
id,
|
|
21
|
-
className,
|
|
22
|
-
children,
|
|
23
|
-
infiniteScroll,
|
|
24
|
-
pagination,
|
|
25
|
-
dataSource,
|
|
26
|
-
offset_limit,
|
|
27
|
-
setPagination,
|
|
28
|
-
scroll,
|
|
29
|
-
showLoader,
|
|
30
|
-
...rest
|
|
31
|
-
} = _ref;
|
|
32
|
-
const scrollRef = (0, _react.useRef)(null);
|
|
33
|
-
const [hasMore, setHasMore] = (0, _react.useState)(true);
|
|
34
|
-
const currentOffsetRef = (0, _react.useRef)(0);
|
|
35
|
-
const loadMore = (0, _react.useCallback)(() => {
|
|
36
|
-
if (!showLoader && hasMore) {
|
|
37
|
-
const nextOffset = currentOffsetRef.current + 1;
|
|
38
|
-
const newOffsetLimit = {
|
|
39
|
-
...offset_limit,
|
|
40
|
-
offset: nextOffset
|
|
41
|
-
};
|
|
42
|
-
currentOffsetRef.current = nextOffset;
|
|
43
|
-
setPagination(newOffsetLimit);
|
|
44
|
-
}
|
|
45
|
-
}, [showLoader, hasMore, setPagination, offset_limit]);
|
|
46
|
-
const handleScroll = (0, _react.useCallback)((0, _lodash.debounce)(event => {
|
|
47
|
-
const target = event.target;
|
|
48
|
-
if (!target || !infiniteScroll || !hasMore || showLoader) return;
|
|
49
|
-
const scrollTop = Math.ceil(target.scrollTop);
|
|
50
|
-
const visibleHeight = target.clientHeight;
|
|
51
|
-
const totalHeight = target.scrollHeight;
|
|
52
|
-
const scrolledPercentage = (scrollTop + visibleHeight) / totalHeight * 100;
|
|
53
|
-
if (scrolledPercentage >= SCROLL_THRESHOLD) {
|
|
54
|
-
loadMore();
|
|
55
|
-
}
|
|
56
|
-
}, DEBOUNCE_DELAY), [infiniteScroll, showLoader, hasMore, loadMore]);
|
|
57
|
-
(0, _react.useEffect)(() => {
|
|
58
|
-
const tableBody = document.querySelector(`#${id} .ant-table-body`);
|
|
59
|
-
if (!tableBody) return;
|
|
60
|
-
scrollRef.current = tableBody;
|
|
61
|
-
tableBody.addEventListener('scroll', handleScroll, {
|
|
62
|
-
passive: true
|
|
63
|
-
});
|
|
64
|
-
const shouldLoadInitially = tableBody.scrollHeight <= tableBody.clientHeight && !showLoader && hasMore;
|
|
65
|
-
if (shouldLoadInitially) {
|
|
66
|
-
currentOffsetRef.current = 0;
|
|
67
|
-
loadMore();
|
|
68
|
-
}
|
|
69
|
-
return () => {
|
|
70
|
-
var _scrollRef$current;
|
|
71
|
-
(_scrollRef$current = scrollRef.current) == null ? void 0 : _scrollRef$current.removeEventListener('scroll', handleScroll);
|
|
72
|
-
handleScroll.cancel();
|
|
73
|
-
};
|
|
74
|
-
}, [id, handleScroll, showLoader, hasMore, loadMore]);
|
|
75
|
-
(0, _react.useEffect)(() => {
|
|
76
|
-
if (!(dataSource != null && dataSource.length)) {
|
|
77
|
-
currentOffsetRef.current = 0;
|
|
78
|
-
setHasMore(true);
|
|
79
|
-
} else {
|
|
80
|
-
setHasMore(true);
|
|
81
|
-
}
|
|
82
|
-
}, [dataSource]);
|
|
83
|
-
const tableClassName = (0, _classnames.default)('cap-table-v2', className, {
|
|
84
|
-
'show-loader': showLoader,
|
|
85
|
-
'infinite-scroll': infiniteScroll,
|
|
86
|
-
'has-more': hasMore
|
|
87
|
-
});
|
|
88
|
-
return (0, _jsxRuntime.jsx)(_styles.StyledTable, {
|
|
89
|
-
id: id,
|
|
90
|
-
className: tableClassName,
|
|
91
|
-
dataSource: dataSource,
|
|
92
|
-
pagination: false,
|
|
93
|
-
scroll: {
|
|
94
|
-
x: scroll == null ? void 0 : scroll.x,
|
|
95
|
-
y: (scroll == null ? void 0 : scroll.y) || DEFAULT_SCROLL_HEIGHT,
|
|
96
|
-
scrollToFirstRowOnChange: false
|
|
97
|
-
},
|
|
98
|
-
virtual: infiniteScroll,
|
|
99
|
-
rowHeight: DEFAULT_ROW_HEIGHT,
|
|
100
|
-
...rest,
|
|
101
|
-
children: children
|
|
102
|
-
});
|
|
103
|
-
};
|
|
104
|
-
CapTable.propTypes = {
|
|
105
|
-
id: _propTypes.default.string.isRequired,
|
|
106
|
-
className: _propTypes.default.string,
|
|
107
|
-
children: _propTypes.default.node,
|
|
108
|
-
infiniteScroll: _propTypes.default.bool,
|
|
109
|
-
pagination: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.bool]),
|
|
110
|
-
dataSource: _propTypes.default.array,
|
|
111
|
-
offset_limit: _propTypes.default.object,
|
|
112
|
-
setPagination: _propTypes.default.func,
|
|
113
|
-
scroll: _propTypes.default.object,
|
|
114
|
-
showLoader: _propTypes.default.bool
|
|
115
|
-
};
|
|
116
|
-
var _default = exports.default = (0, _LocaleHoc.default)(CapTable, {
|
|
117
|
-
key: 'CapTable'
|
|
118
|
-
});
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _loadable = _interopRequireDefault(require("./loadable"));
|
|
6
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
7
|
-
var _default = exports.default = _loadable.default;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _CapSkeleton = _interopRequireDefault(require("../CapSkeleton"));
|
|
6
|
-
var _capUiUtils = require("@capillarytech/cap-ui-utils");
|
|
7
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
11
|
-
const LoadableComponent = (0, _capUiUtils.loadable)(() => Promise.resolve().then(() => _interopRequireWildcard(require('./CapTable'))));
|
|
12
|
-
const CapTableLoadable = props => (0, _jsxRuntime.jsx)(_react.Suspense, {
|
|
13
|
-
fallback: (0, _jsxRuntime.jsx)(_CapSkeleton.default, {}),
|
|
14
|
-
children: (0, _jsxRuntime.jsx)(LoadableComponent, {
|
|
15
|
-
...props
|
|
16
|
-
})
|
|
17
|
-
});
|
|
18
|
-
var _default = exports.default = CapTableLoadable;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.StyledTable = void 0;
|
|
5
|
-
var _antd = require("antd");
|
|
6
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
7
|
-
var styledVars = _interopRequireWildcard(require("../styled/variables"));
|
|
8
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const {
|
|
11
|
-
CAP_G09,
|
|
12
|
-
CAP_G01,
|
|
13
|
-
CAP_G06,
|
|
14
|
-
CAP_G07,
|
|
15
|
-
CAP_G10,
|
|
16
|
-
SPACING_16,
|
|
17
|
-
SPACING_24,
|
|
18
|
-
FONT_SIZE_S
|
|
19
|
-
} = styledVars;
|
|
20
|
-
const StyledTable = exports.StyledTable = (0, _styledComponents.default)(_antd.Table).withConfig({
|
|
21
|
-
displayName: "StyledTable",
|
|
22
|
-
componentId: "sc-1ldu1k4-0"
|
|
23
|
-
})(["&.cap-table-v2{.ant-table{border:1px solid ", ";}}&.show-loader{.ant-table-body > table > tbody::after{content:'", "';display:flex;justify-content:center;position:absolute;width:100%;align-items:center;height:60px;text-align:center;font-size:16px;color:gray;border-top:1px solid ", ";}}.ant-table{border:1px solid ", ";.ant-table-thead > tr > th{color:", ";font-size:", ";line-height:", ";background-color:", ";text-align:left;}.ant-table-thead > tr > th,.ant-table-tbody > tr > td{padding:", " ", ";}.ant-table-tbody > tr > td{border-bottom:1px solid ", ";}.ant-table-tbody > tr:last-child > td{border-bottom:none;}.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-thead > tr:hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td{background-color:", ";}.ant-table-thead > tr > th .ant-table-column-sorter-up,.ant-table-thead > tr > th .ant-table-column-sorter-down{&.active{color:", ";}&:not(.active){color:", ";}}.ant-table-thead{.table-children{padding:6px ", " 16px;position:relative;}.table-parent{padding-bottom:0;padding-left:", ";}.table-children.show-separator:not(:last-child)::after{content:'';height:8px;width:1px;right:0;top:30%;background-color:", ";position:absolute;}}.ant-table-thead > tr > th .ant-table-column-sorter{vertical-align:unset;}.ant-table-body table{table-layout:fixed;width:100%;}}&.no-pagination-loader{.ant-table-body > table > tbody::after{content:'';height:unset;display:none;}}&.hide-hover{.ant-table{.ant-table-thead > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr.ant-table-row-hover:not(.ant-table-expanded-row) > td,.ant-table-thead > tr:hover:not(.ant-table-expanded-row) > td,.ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td{background:none;}}}a{color:", ";}"], CAP_G07, props => props.loadMoreData, CAP_G07, CAP_G07, CAP_G01, FONT_SIZE_S, SPACING_16, CAP_G10, SPACING_16, SPACING_24, CAP_G07, CAP_G09, CAP_G01, CAP_G06, SPACING_24, SPACING_24, CAP_G07, CAP_G01);
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
7
|
-
var _antd = require("antd");
|
|
8
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
const CapTestSelect = props => {
|
|
11
|
-
return (0, _jsxRuntime.jsx)(_antd.Select, {
|
|
12
|
-
...props
|
|
13
|
-
});
|
|
14
|
-
};
|
|
15
|
-
CapTestSelect.propTypes = {
|
|
16
|
-
allowClear: _propTypes.default.bool,
|
|
17
|
-
defaultValue: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]))]),
|
|
18
|
-
disabled: _propTypes.default.bool,
|
|
19
|
-
loading: _propTypes.default.bool,
|
|
20
|
-
mode: _propTypes.default.oneOf(['multiple', 'tags']),
|
|
21
|
-
placeholder: _propTypes.default.string,
|
|
22
|
-
showSearch: _propTypes.default.bool,
|
|
23
|
-
value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]))]),
|
|
24
|
-
options: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
25
|
-
label: _propTypes.default.node,
|
|
26
|
-
value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
|
|
27
|
-
disabled: _propTypes.default.bool
|
|
28
|
-
}))
|
|
29
|
-
};
|
|
30
|
-
CapTestSelect.defaultProps = {
|
|
31
|
-
allowClear: false,
|
|
32
|
-
disabled: false,
|
|
33
|
-
loading: false,
|
|
34
|
-
showSearch: false
|
|
35
|
-
};
|
|
36
|
-
var _default = exports.default = CapTestSelect;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.default = void 0;
|
|
5
|
-
var _CapTestSelect = _interopRequireDefault(require("./CapTestSelect"));
|
|
6
|
-
exports.default = _CapTestSelect.default;
|
|
7
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|