@chaomingd/design 0.0.68
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/LICENSE +21 -0
- package/README.md +23 -0
- package/dist/esm/CheckGroup/context.d.ts +9 -0
- package/dist/esm/CheckGroup/context.js +6 -0
- package/dist/esm/CheckGroup/hooks/useCheckGroup.d.ts +21 -0
- package/dist/esm/CheckGroup/hooks/useCheckGroup.js +180 -0
- package/dist/esm/CheckGroup/index.d.ts +9 -0
- package/dist/esm/CheckGroup/index.js +79 -0
- package/dist/esm/CheckGroup/type.d.ts +28 -0
- package/dist/esm/CheckGroup/type.js +1 -0
- package/dist/esm/Grid/index.d.ts +15 -0
- package/dist/esm/Grid/index.js +64 -0
- package/dist/esm/Grid/index.less +7 -0
- package/dist/esm/KaTeXRenderer/index.d.ts +9 -0
- package/dist/esm/KaTeXRenderer/index.js +33 -0
- package/dist/esm/KaTeXRenderer/index.less +0 -0
- package/dist/esm/PixelPlayer/index.d.ts +28 -0
- package/dist/esm/PixelPlayer/index.js +118 -0
- package/dist/esm/PixelPlayer/index.less +29 -0
- package/dist/esm/PixelPlayer/lib/peer-stream.d.ts +62 -0
- package/dist/esm/PixelPlayer/lib/peer-stream.js +876 -0
- package/dist/esm/PixelPlayer/useAutoLayoutContainer.d.ts +2 -0
- package/dist/esm/PixelPlayer/useAutoLayoutContainer.js +53 -0
- package/dist/esm/PixelPlayer/useVideoWithCustomEvent.d.ts +5 -0
- package/dist/esm/PixelPlayer/useVideoWithCustomEvent.js +37 -0
- package/dist/esm/Resizer/index.d.ts +17 -0
- package/dist/esm/Resizer/index.js +73 -0
- package/dist/esm/Resizer/index.less +73 -0
- package/dist/esm/SetupAntApp/index.d.ts +1 -0
- package/dist/esm/SetupAntApp/index.js +10 -0
- package/dist/esm/Transition/index.d.ts +4 -0
- package/dist/esm/Transition/index.js +132 -0
- package/dist/esm/Transition/type.d.ts +33 -0
- package/dist/esm/Transition/type.js +12 -0
- package/dist/esm/Transition/utils.d.ts +6 -0
- package/dist/esm/Transition/utils.js +15 -0
- package/dist/esm/UploadFile/components/IconButton/index.d.ts +11 -0
- package/dist/esm/UploadFile/components/IconButton/index.js +26 -0
- package/dist/esm/UploadFile/components/IconButton/index.less +58 -0
- package/dist/esm/UploadFile/components/Slash.d.ts +2 -0
- package/dist/esm/UploadFile/components/Slash.js +15 -0
- package/dist/esm/UploadFile/components/SvgIcons.d.ts +11 -0
- package/dist/esm/UploadFile/components/SvgIcons.js +141 -0
- package/dist/esm/UploadFile/hooks/useUploadModel.d.ts +16 -0
- package/dist/esm/UploadFile/hooks/useUploadModel.js +376 -0
- package/dist/esm/UploadFile/index.d.ts +4 -0
- package/dist/esm/UploadFile/index.js +277 -0
- package/dist/esm/UploadFile/index.less +274 -0
- package/dist/esm/UploadFile/type.d.ts +63 -0
- package/dist/esm/UploadFile/type.js +1 -0
- package/dist/esm/UploadFile/utils/formatBitString.d.ts +1 -0
- package/dist/esm/UploadFile/utils/formatBitString.js +9 -0
- package/dist/esm/UploadFile/utils/getExt.d.ts +1 -0
- package/dist/esm/UploadFile/utils/getExt.js +6 -0
- package/dist/esm/UploadFile/utils/isImage.d.ts +1 -0
- package/dist/esm/UploadFile/utils/isImage.js +8 -0
- package/dist/esm/UploadFile/utils/normalizeExt.d.ts +1 -0
- package/dist/esm/UploadFile/utils/normalizeExt.js +4 -0
- package/dist/esm/UploadFile/utils/validateFileTypes.d.ts +13 -0
- package/dist/esm/UploadFile/utils/validateFileTypes.js +83 -0
- package/dist/esm/UploadFile/utils/validateRule.d.ts +3 -0
- package/dist/esm/UploadFile/utils/validateRule.js +22 -0
- package/dist/esm/UploadFile/utils/validateUpload.d.ts +5 -0
- package/dist/esm/UploadFile/utils/validateUpload.js +35 -0
- package/dist/esm/constant/index.d.ts +7 -0
- package/dist/esm/constant/index.js +18 -0
- package/dist/esm/constants/cssPrefix.d.ts +1 -0
- package/dist/esm/constants/cssPrefix.js +1 -0
- package/dist/esm/getAntApp/index.d.ts +8 -0
- package/dist/esm/getAntApp/index.js +17 -0
- package/dist/esm/index.d.ts +10 -0
- package/dist/esm/index.js +10 -0
- package/dist/esm/interface.d.ts +1 -0
- package/dist/esm/interface.js +1 -0
- package/dist/esm/styles/cssVar.less +28 -0
- package/dist/esm/styles/reset.css +3 -0
- package/dist/esm/styles/var.d.ts +1 -0
- package/dist/esm/styles/var.js +1 -0
- package/dist/esm/styles/var.less +2 -0
- package/dist/esm/variable.less +52 -0
- package/dist/lib/CheckGroup/context.d.ts +9 -0
- package/dist/lib/CheckGroup/context.js +12 -0
- package/dist/lib/CheckGroup/hooks/useCheckGroup.d.ts +21 -0
- package/dist/lib/CheckGroup/hooks/useCheckGroup.js +164 -0
- package/dist/lib/CheckGroup/index.d.ts +9 -0
- package/dist/lib/CheckGroup/index.js +93 -0
- package/dist/lib/CheckGroup/type.d.ts +28 -0
- package/dist/lib/CheckGroup/type.js +5 -0
- package/dist/lib/Grid/index.d.ts +15 -0
- package/dist/lib/Grid/index.js +77 -0
- package/dist/lib/Grid/index.less +7 -0
- package/dist/lib/KaTeXRenderer/index.d.ts +9 -0
- package/dist/lib/KaTeXRenderer/index.js +41 -0
- package/dist/lib/KaTeXRenderer/index.less +0 -0
- package/dist/lib/PixelPlayer/index.d.ts +28 -0
- package/dist/lib/PixelPlayer/index.js +108 -0
- package/dist/lib/PixelPlayer/index.less +29 -0
- package/dist/lib/PixelPlayer/lib/peer-stream.d.ts +62 -0
- package/dist/lib/PixelPlayer/lib/peer-stream.js +707 -0
- package/dist/lib/PixelPlayer/useAutoLayoutContainer.d.ts +2 -0
- package/dist/lib/PixelPlayer/useAutoLayoutContainer.js +60 -0
- package/dist/lib/PixelPlayer/useVideoWithCustomEvent.d.ts +5 -0
- package/dist/lib/PixelPlayer/useVideoWithCustomEvent.js +35 -0
- package/dist/lib/Resizer/index.d.ts +17 -0
- package/dist/lib/Resizer/index.js +75 -0
- package/dist/lib/Resizer/index.less +73 -0
- package/dist/lib/SetupAntApp/index.d.ts +1 -0
- package/dist/lib/SetupAntApp/index.js +16 -0
- package/dist/lib/Transition/index.d.ts +4 -0
- package/dist/lib/Transition/index.js +128 -0
- package/dist/lib/Transition/type.d.ts +33 -0
- package/dist/lib/Transition/type.js +18 -0
- package/dist/lib/Transition/utils.d.ts +6 -0
- package/dist/lib/Transition/utils.js +22 -0
- package/dist/lib/UploadFile/components/IconButton/index.d.ts +11 -0
- package/dist/lib/UploadFile/components/IconButton/index.js +29 -0
- package/dist/lib/UploadFile/components/IconButton/index.less +58 -0
- package/dist/lib/UploadFile/components/Slash.d.ts +2 -0
- package/dist/lib/UploadFile/components/Slash.js +22 -0
- package/dist/lib/UploadFile/components/SvgIcons.d.ts +11 -0
- package/dist/lib/UploadFile/components/SvgIcons.js +158 -0
- package/dist/lib/UploadFile/hooks/useUploadModel.d.ts +16 -0
- package/dist/lib/UploadFile/hooks/useUploadModel.js +306 -0
- package/dist/lib/UploadFile/index.d.ts +4 -0
- package/dist/lib/UploadFile/index.js +280 -0
- package/dist/lib/UploadFile/index.less +274 -0
- package/dist/lib/UploadFile/type.d.ts +63 -0
- package/dist/lib/UploadFile/type.js +5 -0
- package/dist/lib/UploadFile/utils/formatBitString.d.ts +1 -0
- package/dist/lib/UploadFile/utils/formatBitString.js +15 -0
- package/dist/lib/UploadFile/utils/getExt.d.ts +1 -0
- package/dist/lib/UploadFile/utils/getExt.js +12 -0
- package/dist/lib/UploadFile/utils/isImage.d.ts +1 -0
- package/dist/lib/UploadFile/utils/isImage.js +14 -0
- package/dist/lib/UploadFile/utils/normalizeExt.d.ts +1 -0
- package/dist/lib/UploadFile/utils/normalizeExt.js +10 -0
- package/dist/lib/UploadFile/utils/validateFileTypes.d.ts +13 -0
- package/dist/lib/UploadFile/utils/validateFileTypes.js +87 -0
- package/dist/lib/UploadFile/utils/validateRule.d.ts +3 -0
- package/dist/lib/UploadFile/utils/validateRule.js +28 -0
- package/dist/lib/UploadFile/utils/validateUpload.d.ts +5 -0
- package/dist/lib/UploadFile/utils/validateUpload.js +31 -0
- package/dist/lib/constant/index.d.ts +7 -0
- package/dist/lib/constant/index.js +24 -0
- package/dist/lib/constants/cssPrefix.d.ts +1 -0
- package/dist/lib/constants/cssPrefix.js +7 -0
- package/dist/lib/getAntApp/index.d.ts +8 -0
- package/dist/lib/getAntApp/index.js +27 -0
- package/dist/lib/index.d.ts +10 -0
- package/dist/lib/index.js +69 -0
- package/dist/lib/interface.d.ts +1 -0
- package/dist/lib/interface.js +5 -0
- package/dist/lib/styles/cssVar.less +28 -0
- package/dist/lib/styles/reset.css +3 -0
- package/dist/lib/styles/var.d.ts +1 -0
- package/dist/lib/styles/var.js +7 -0
- package/dist/lib/styles/var.less +2 -0
- package/dist/lib/variable.less +52 -0
- package/package.json +54 -0
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-non-null-assertion -- assert it is not null */
|
|
2
|
+
|
|
3
|
+
import { useEffect, useRef } from 'react';
|
|
4
|
+
export var useAutoLayoutContainer = function useAutoLayoutContainer(videoRef, positionOrigin) {
|
|
5
|
+
var containerRef = useRef(null);
|
|
6
|
+
useEffect(function () {
|
|
7
|
+
var positionStyles = {
|
|
8
|
+
'top-left': {
|
|
9
|
+
top: 0,
|
|
10
|
+
left: 0
|
|
11
|
+
},
|
|
12
|
+
'top-right': {
|
|
13
|
+
top: 0,
|
|
14
|
+
right: 0
|
|
15
|
+
},
|
|
16
|
+
'bottom-left': {
|
|
17
|
+
bottom: 0,
|
|
18
|
+
left: 0
|
|
19
|
+
},
|
|
20
|
+
'bottom-right': {
|
|
21
|
+
bottom: 0,
|
|
22
|
+
right: 0
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
// 暂不支持自适应
|
|
26
|
+
var setup = function setup() {
|
|
27
|
+
if (!containerRef.current) {
|
|
28
|
+
requestAnimationFrame(setup);
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
var clientWidth = containerRef.current.clientWidth;
|
|
32
|
+
var clientHeight = containerRef.current.clientHeight;
|
|
33
|
+
if (clientHeight === 0 && clientWidth === 0) {
|
|
34
|
+
// 重新查询
|
|
35
|
+
requestAnimationFrame(setup);
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
var ratio = clientWidth / clientHeight;
|
|
39
|
+
var height = "".concat(clientHeight, "px");
|
|
40
|
+
var width = "".concat(clientWidth, "px");
|
|
41
|
+
var defaultRatio = 1920 / 1080;
|
|
42
|
+
if (ratio > defaultRatio) {
|
|
43
|
+
videoRef.current.style.width = width;
|
|
44
|
+
} else {
|
|
45
|
+
videoRef.current.style.height = height;
|
|
46
|
+
}
|
|
47
|
+
videoRef.current.style.position = 'absolute';
|
|
48
|
+
Object.assign(videoRef.current.style, positionStyles[positionOrigin]);
|
|
49
|
+
};
|
|
50
|
+
setup();
|
|
51
|
+
}, []);
|
|
52
|
+
return containerRef;
|
|
53
|
+
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type PeerStream } from './lib/peer-stream';
|
|
3
|
+
type EventHandlers = Record<string, (event: Event) => void>;
|
|
4
|
+
export declare const useVideoWithCustomEvent: (eventHandlers: EventHandlers) => import("react").RefObject<PeerStream>;
|
|
5
|
+
export {};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import { useEffect, useRef } from 'react';
|
|
3
|
+
function lowercaseFirstLetter(word) {
|
|
4
|
+
return word.charAt(0).toLowerCase() + word.slice(1);
|
|
5
|
+
}
|
|
6
|
+
export var useVideoWithCustomEvent = function useVideoWithCustomEvent(eventHandlers) {
|
|
7
|
+
var videoRef = useRef(null);
|
|
8
|
+
useEffect(function () {
|
|
9
|
+
var addEventListeners = function addEventListeners() {
|
|
10
|
+
Object.entries(eventHandlers).forEach(function (_ref) {
|
|
11
|
+
var _videoRef$current;
|
|
12
|
+
var _ref2 = _slicedToArray(_ref, 2),
|
|
13
|
+
eventHandlerName = _ref2[0],
|
|
14
|
+
eventHandler = _ref2[1];
|
|
15
|
+
var eventName = lowercaseFirstLetter(eventHandlerName.replace(/^on/, ''));
|
|
16
|
+
(_videoRef$current = videoRef.current) === null || _videoRef$current === void 0 || _videoRef$current.addEventListener(eventName, eventHandler);
|
|
17
|
+
});
|
|
18
|
+
};
|
|
19
|
+
var removeEventListeners = function removeEventListeners() {
|
|
20
|
+
Object.entries(eventHandlers).forEach(function (_ref3) {
|
|
21
|
+
var _videoRef$current2;
|
|
22
|
+
var _ref4 = _slicedToArray(_ref3, 2),
|
|
23
|
+
eventHandlerName = _ref4[0],
|
|
24
|
+
eventHandler = _ref4[1];
|
|
25
|
+
var eventName = lowercaseFirstLetter(eventHandlerName.replace(/^on/, ''));
|
|
26
|
+
(_videoRef$current2 = videoRef.current) === null || _videoRef$current2 === void 0 || _videoRef$current2.removeEventListener(eventName, eventHandler);
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
addEventListeners();
|
|
30
|
+
|
|
31
|
+
// Cleanup function
|
|
32
|
+
return function () {
|
|
33
|
+
removeEventListeners();
|
|
34
|
+
};
|
|
35
|
+
}, [eventHandlers]);
|
|
36
|
+
return videoRef;
|
|
37
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { IConfig as IResizerConfig } from '@chaomingd/hooks';
|
|
2
|
+
import { HTMLAttributes, MutableRefObject } from 'react';
|
|
3
|
+
import './index.less';
|
|
4
|
+
export interface ResizerProps extends HTMLAttributes<HTMLDivElement> {
|
|
5
|
+
resizerConfig?: Omit<IResizerConfig, 'elRef'>;
|
|
6
|
+
thumbClassName?: string;
|
|
7
|
+
thumbStyle?: ResizerProps['style'];
|
|
8
|
+
containerRef?: MutableRefObject<HTMLDivElement | null>;
|
|
9
|
+
manu?: boolean;
|
|
10
|
+
thumbColor?: string;
|
|
11
|
+
onResize?: (size: {
|
|
12
|
+
width: number;
|
|
13
|
+
height: number;
|
|
14
|
+
}) => void;
|
|
15
|
+
}
|
|
16
|
+
declare const _default: import("react").NamedExoticComponent<ResizerProps>;
|
|
17
|
+
export default _default;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
4
|
+
var _excluded = ["children", "resizerConfig", "thumbClassName", "style", "thumbStyle", "containerRef", "className", "manu", "thumbColor", "onResize"];
|
|
5
|
+
import { useResizer } from '@chaomingd/hooks';
|
|
6
|
+
import classNames from 'classnames';
|
|
7
|
+
import { memo, useRef, useState } from 'react';
|
|
8
|
+
import "./index.less";
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
+
var Resizer = function Resizer(_ref) {
|
|
12
|
+
var children = _ref.children,
|
|
13
|
+
resizerConfig = _ref.resizerConfig,
|
|
14
|
+
thumbClassName = _ref.thumbClassName,
|
|
15
|
+
style = _ref.style,
|
|
16
|
+
thumbStyle = _ref.thumbStyle,
|
|
17
|
+
containerRef = _ref.containerRef,
|
|
18
|
+
className = _ref.className,
|
|
19
|
+
manu = _ref.manu,
|
|
20
|
+
thumbColor = _ref.thumbColor,
|
|
21
|
+
onResize = _ref.onResize,
|
|
22
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
23
|
+
var thumbRef = useRef();
|
|
24
|
+
var elRef = useRef(null);
|
|
25
|
+
var _useState = useState(false),
|
|
26
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
27
|
+
resizing = _useState2[0],
|
|
28
|
+
setResizing = _useState2[1];
|
|
29
|
+
var direction = (resizerConfig === null || resizerConfig === void 0 ? void 0 : resizerConfig.direction) || 'left';
|
|
30
|
+
useResizer(_objectSpread(_objectSpread({
|
|
31
|
+
elRef: thumbRef,
|
|
32
|
+
firstUpdate: true
|
|
33
|
+
}, resizerConfig || {}), {}, {
|
|
34
|
+
updator: function updator(state) {
|
|
35
|
+
var _resizerConfig$updato;
|
|
36
|
+
var el = elRef.current;
|
|
37
|
+
if (!el) return;
|
|
38
|
+
if (manu !== true) {
|
|
39
|
+
if (direction === 'left' || direction === 'right') {
|
|
40
|
+
el.style.width = state.deltaX + 'px';
|
|
41
|
+
} else {
|
|
42
|
+
el.style.height = state.deltaY + 'px';
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
resizerConfig === null || resizerConfig === void 0 || (_resizerConfig$updato = resizerConfig.updator) === null || _resizerConfig$updato === void 0 || _resizerConfig$updato.call(resizerConfig, state);
|
|
46
|
+
onResize === null || onResize === void 0 || onResize({
|
|
47
|
+
width: state.deltaX,
|
|
48
|
+
height: state.deltaY
|
|
49
|
+
});
|
|
50
|
+
},
|
|
51
|
+
resizingChange: setResizing
|
|
52
|
+
}));
|
|
53
|
+
return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
|
|
54
|
+
ref: function ref(el) {
|
|
55
|
+
elRef.current = el;
|
|
56
|
+
if (containerRef) {
|
|
57
|
+
containerRef.current = el;
|
|
58
|
+
}
|
|
59
|
+
},
|
|
60
|
+
style: _objectSpread(_objectSpread({}, style), {}, {
|
|
61
|
+
transition: resizing ? 'none' : undefined
|
|
62
|
+
}),
|
|
63
|
+
className: classNames('laf-resizer', className),
|
|
64
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
65
|
+
ref: thumbRef,
|
|
66
|
+
style: _objectSpread(_objectSpread({}, thumbStyle || {}), {}, {
|
|
67
|
+
'--laf-resizer-thumb-color': thumbColor
|
|
68
|
+
}),
|
|
69
|
+
className: classNames('laf-resizer-thumb', thumbClassName, resizing && 'laf-resizer-thumb-resizing', "laf-resizer-thumb-direction-".concat(direction))
|
|
70
|
+
}), children]
|
|
71
|
+
}));
|
|
72
|
+
};
|
|
73
|
+
export default /*#__PURE__*/memo(Resizer);
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
.laf-resizer {
|
|
2
|
+
position: relative;
|
|
3
|
+
|
|
4
|
+
&-thumb {
|
|
5
|
+
position: absolute;
|
|
6
|
+
z-index: 1000;
|
|
7
|
+
background-color: transparent;
|
|
8
|
+
transition: background-color 0.3s;
|
|
9
|
+
user-select: none;
|
|
10
|
+
|
|
11
|
+
&:hover {
|
|
12
|
+
background-color: var(--laf-resizer-thumb-color);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
&-resizing {
|
|
16
|
+
background-color: var(--laf-resizer-thumb-color);
|
|
17
|
+
|
|
18
|
+
&::after {
|
|
19
|
+
display: block;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
&::after {
|
|
24
|
+
content: '';
|
|
25
|
+
position: absolute;
|
|
26
|
+
top: 50%;
|
|
27
|
+
left: 50%;
|
|
28
|
+
transform: translate(-50%, -50%);
|
|
29
|
+
width: 200px;
|
|
30
|
+
height: 200px;
|
|
31
|
+
min-width: 100%;
|
|
32
|
+
min-height: 100%;
|
|
33
|
+
cursor: inherit;
|
|
34
|
+
display: none;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
&-direction-left {
|
|
38
|
+
width: 2px;
|
|
39
|
+
left: 0;
|
|
40
|
+
top: 0;
|
|
41
|
+
transform: translateX(-50%);
|
|
42
|
+
height: 100%;
|
|
43
|
+
cursor: col-resize;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
&-direction-right {
|
|
47
|
+
width: 2px;
|
|
48
|
+
right: 0;
|
|
49
|
+
top: 0;
|
|
50
|
+
transform: translateX(50%);
|
|
51
|
+
height: 100%;
|
|
52
|
+
cursor: col-resize;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&-direction-top {
|
|
56
|
+
width: 100%;
|
|
57
|
+
left: 0;
|
|
58
|
+
top: 0;
|
|
59
|
+
transform: translateY(-50%);
|
|
60
|
+
height: 2px;
|
|
61
|
+
cursor: row-resize;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
&-direction-bottom {
|
|
65
|
+
width: 100%;
|
|
66
|
+
left: 0;
|
|
67
|
+
bottom: 0;
|
|
68
|
+
transform: translateY(50%);
|
|
69
|
+
height: 2px;
|
|
70
|
+
cursor: row-resize;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function SetupAntApp(): null;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TransitionProps } from './type';
|
|
3
|
+
declare const Transition: ({ children, visible, exitUnMount, transitionName, duration, appear, ...props }: TransitionProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
|
|
4
|
+
export default Transition;
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
|
+
var _excluded = ["children", "visible", "exitUnMount", "transitionName", "duration", "appear"];
|
|
3
|
+
import { useModel } from '@chaomingd/store';
|
|
4
|
+
import { useLatest, useUnmount } from 'ahooks';
|
|
5
|
+
import { useEffect, useMemo, useRef } from 'react';
|
|
6
|
+
import { ETransitionStatus } from "./type";
|
|
7
|
+
import { DEFAULT_DURATION, getDuration } from "./utils";
|
|
8
|
+
var Transition = function Transition(_ref) {
|
|
9
|
+
var children = _ref.children,
|
|
10
|
+
visible = _ref.visible,
|
|
11
|
+
_ref$exitUnMount = _ref.exitUnMount,
|
|
12
|
+
exitUnMount = _ref$exitUnMount === void 0 ? true : _ref$exitUnMount,
|
|
13
|
+
transitionName = _ref.transitionName,
|
|
14
|
+
_ref$duration = _ref.duration,
|
|
15
|
+
duration = _ref$duration === void 0 ? DEFAULT_DURATION : _ref$duration,
|
|
16
|
+
_ref$appear = _ref.appear,
|
|
17
|
+
appear = _ref$appear === void 0 ? true : _ref$appear,
|
|
18
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
19
|
+
var propsRef = useLatest(props);
|
|
20
|
+
var transitionModel = useModel({
|
|
21
|
+
state: {
|
|
22
|
+
status: visible && !appear ? ETransitionStatus.entered : ETransitionStatus.exited
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
var transitionClassNames = useMemo(function () {
|
|
26
|
+
var baseClassNames;
|
|
27
|
+
if (!transitionName) {
|
|
28
|
+
baseClassNames = ['transtion'];
|
|
29
|
+
} else {
|
|
30
|
+
baseClassNames = typeof transitionName === 'string' ? [transitionName] : transitionName;
|
|
31
|
+
}
|
|
32
|
+
return baseClassNames.map(function (baseClassName) {
|
|
33
|
+
var classNames = {};
|
|
34
|
+
Object.keys(ETransitionStatus).forEach(function (status) {
|
|
35
|
+
classNames[status] = "".concat(baseClassName, "-").concat(status);
|
|
36
|
+
});
|
|
37
|
+
return classNames;
|
|
38
|
+
});
|
|
39
|
+
}, [transitionName]);
|
|
40
|
+
var _transitionModel$useG = transitionModel.useGetState(),
|
|
41
|
+
status = _transitionModel$useG.status;
|
|
42
|
+
var transitionClassNamesWithStatus = useMemo(function () {
|
|
43
|
+
return transitionClassNames.map(function (item) {
|
|
44
|
+
return item[status];
|
|
45
|
+
});
|
|
46
|
+
}, [transitionClassNames, status]);
|
|
47
|
+
var transitionTimerRef = useRef();
|
|
48
|
+
var enteringTimerRef = useRef();
|
|
49
|
+
useEffect(function () {
|
|
50
|
+
clearTimeout(transitionTimerRef.current);
|
|
51
|
+
clearTimeout(enteringTimerRef.current);
|
|
52
|
+
var _transitionModel$getS = transitionModel.getState(),
|
|
53
|
+
currentStatus = _transitionModel$getS.status;
|
|
54
|
+
if (visible) {
|
|
55
|
+
if (![ETransitionStatus.entering, ETransitionStatus.entered].includes(currentStatus)) {
|
|
56
|
+
var _propsRef$current, _propsRef$current$onE;
|
|
57
|
+
transitionModel.setState({
|
|
58
|
+
status: ETransitionStatus.enter
|
|
59
|
+
});
|
|
60
|
+
(_propsRef$current = propsRef.current) === null || _propsRef$current === void 0 || (_propsRef$current$onE = _propsRef$current.onEnter) === null || _propsRef$current$onE === void 0 || _propsRef$current$onE.call(_propsRef$current);
|
|
61
|
+
}
|
|
62
|
+
} else {
|
|
63
|
+
if (![ETransitionStatus.exited, ETransitionStatus.exiting].includes(currentStatus)) {
|
|
64
|
+
var _propsRef$current2, _propsRef$current2$on;
|
|
65
|
+
transitionModel.setState({
|
|
66
|
+
status: ETransitionStatus.exit
|
|
67
|
+
});
|
|
68
|
+
(_propsRef$current2 = propsRef.current) === null || _propsRef$current2 === void 0 || (_propsRef$current2$on = _propsRef$current2.onExit) === null || _propsRef$current2$on === void 0 || _propsRef$current2$on.call(_propsRef$current2);
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
// eslint-disable-next-line
|
|
72
|
+
}, [visible]);
|
|
73
|
+
// entering
|
|
74
|
+
useEffect(function () {
|
|
75
|
+
if ([ETransitionStatus.enter, ETransitionStatus.exit].includes(status)) {
|
|
76
|
+
clearTimeout(enteringTimerRef.current);
|
|
77
|
+
enteringTimerRef.current = setTimeout(function () {
|
|
78
|
+
if (status === ETransitionStatus.enter) {
|
|
79
|
+
var _propsRef$current3, _propsRef$current3$on;
|
|
80
|
+
transitionModel.setState({
|
|
81
|
+
status: ETransitionStatus.entering
|
|
82
|
+
});
|
|
83
|
+
(_propsRef$current3 = propsRef.current) === null || _propsRef$current3 === void 0 || (_propsRef$current3$on = _propsRef$current3.onEntering) === null || _propsRef$current3$on === void 0 || _propsRef$current3$on.call(_propsRef$current3);
|
|
84
|
+
} else if (status === ETransitionStatus.exit) {
|
|
85
|
+
var _propsRef$current4, _propsRef$current4$on;
|
|
86
|
+
transitionModel.setState({
|
|
87
|
+
status: ETransitionStatus.exiting
|
|
88
|
+
});
|
|
89
|
+
(_propsRef$current4 = propsRef.current) === null || _propsRef$current4 === void 0 || (_propsRef$current4$on = _propsRef$current4.onExiting) === null || _propsRef$current4$on === void 0 || _propsRef$current4$on.call(_propsRef$current4);
|
|
90
|
+
}
|
|
91
|
+
}, 17);
|
|
92
|
+
}
|
|
93
|
+
// eslint-disable-next-line
|
|
94
|
+
}, [status]);
|
|
95
|
+
// entered
|
|
96
|
+
useEffect(function () {
|
|
97
|
+
if ([ETransitionStatus.entering, ETransitionStatus.exiting].includes(status)) {
|
|
98
|
+
clearTimeout(transitionTimerRef.current);
|
|
99
|
+
transitionTimerRef.current = setTimeout(function () {
|
|
100
|
+
if (status === ETransitionStatus.entering) {
|
|
101
|
+
var _propsRef$current5, _propsRef$current5$on;
|
|
102
|
+
transitionModel.setState({
|
|
103
|
+
status: ETransitionStatus.entered
|
|
104
|
+
});
|
|
105
|
+
(_propsRef$current5 = propsRef.current) === null || _propsRef$current5 === void 0 || (_propsRef$current5$on = _propsRef$current5.onEntered) === null || _propsRef$current5$on === void 0 || _propsRef$current5$on.call(_propsRef$current5);
|
|
106
|
+
} else if (status === ETransitionStatus.exiting) {
|
|
107
|
+
var _propsRef$current6, _propsRef$current6$on;
|
|
108
|
+
transitionModel.setState({
|
|
109
|
+
status: ETransitionStatus.exited
|
|
110
|
+
});
|
|
111
|
+
(_propsRef$current6 = propsRef.current) === null || _propsRef$current6 === void 0 || (_propsRef$current6$on = _propsRef$current6.onExited) === null || _propsRef$current6$on === void 0 || _propsRef$current6$on.call(_propsRef$current6);
|
|
112
|
+
}
|
|
113
|
+
}, getDuration({
|
|
114
|
+
duration: duration,
|
|
115
|
+
status: ETransitionStatus.entering === status ? ETransitionStatus.enter : ETransitionStatus.exit
|
|
116
|
+
}));
|
|
117
|
+
}
|
|
118
|
+
// eslint-disable-next-line
|
|
119
|
+
}, [status]);
|
|
120
|
+
useUnmount(function () {
|
|
121
|
+
clearTimeout(transitionTimerRef.current);
|
|
122
|
+
clearTimeout(enteringTimerRef.current);
|
|
123
|
+
});
|
|
124
|
+
if (exitUnMount) {
|
|
125
|
+
if (status === ETransitionStatus.exited) return null;
|
|
126
|
+
}
|
|
127
|
+
if (typeof children === 'function') {
|
|
128
|
+
return children(status, transitionClassNamesWithStatus[0], transitionClassNamesWithStatus);
|
|
129
|
+
}
|
|
130
|
+
return children;
|
|
131
|
+
};
|
|
132
|
+
export default Transition;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { ReactElement } from 'react';
|
|
2
|
+
export interface TransitionProps {
|
|
3
|
+
visible?: boolean;
|
|
4
|
+
appear?: boolean;
|
|
5
|
+
exitUnMount?: boolean;
|
|
6
|
+
children: ReactElement | ((status: ETransitionStatus, transitionName: string, transitionNames: string[]) => ReactElement);
|
|
7
|
+
duration?: number | {
|
|
8
|
+
enter: number;
|
|
9
|
+
exit: number;
|
|
10
|
+
};
|
|
11
|
+
transitionName?: string | string[];
|
|
12
|
+
onEnter?: () => any;
|
|
13
|
+
onEntering?: () => any;
|
|
14
|
+
onEntered?: () => any;
|
|
15
|
+
onExit?: () => any;
|
|
16
|
+
onExiting?: () => any;
|
|
17
|
+
onExited?: () => any;
|
|
18
|
+
}
|
|
19
|
+
export declare enum ETransitionStatus {
|
|
20
|
+
none = "none",
|
|
21
|
+
enter = "enter",
|
|
22
|
+
entering = "entering",
|
|
23
|
+
entered = "entered",
|
|
24
|
+
exit = "exit",
|
|
25
|
+
exiting = "exiting",
|
|
26
|
+
exited = "exited"
|
|
27
|
+
}
|
|
28
|
+
export interface ITransitionState {
|
|
29
|
+
status: ETransitionStatus;
|
|
30
|
+
}
|
|
31
|
+
export declare const ENTER_STATUS_SQUENCE: ETransitionStatus[];
|
|
32
|
+
export declare const EXIT_STATUS_SQUENCE: ETransitionStatus[];
|
|
33
|
+
export type TransitionClassNames = Record<ETransitionStatus, string>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export var ETransitionStatus = /*#__PURE__*/function (ETransitionStatus) {
|
|
2
|
+
ETransitionStatus["none"] = "none";
|
|
3
|
+
ETransitionStatus["enter"] = "enter";
|
|
4
|
+
ETransitionStatus["entering"] = "entering";
|
|
5
|
+
ETransitionStatus["entered"] = "entered";
|
|
6
|
+
ETransitionStatus["exit"] = "exit";
|
|
7
|
+
ETransitionStatus["exiting"] = "exiting";
|
|
8
|
+
ETransitionStatus["exited"] = "exited";
|
|
9
|
+
return ETransitionStatus;
|
|
10
|
+
}({});
|
|
11
|
+
export var ENTER_STATUS_SQUENCE = [ETransitionStatus.entering, ETransitionStatus.entered];
|
|
12
|
+
export var EXIT_STATUS_SQUENCE = [ETransitionStatus.exiting, ETransitionStatus.exited];
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export var DEFAULT_DURATION = 300;
|
|
2
|
+
export function getDuration(_ref) {
|
|
3
|
+
var duration = _ref.duration,
|
|
4
|
+
status = _ref.status;
|
|
5
|
+
var dur;
|
|
6
|
+
if (duration === undefined) {
|
|
7
|
+
dur = DEFAULT_DURATION;
|
|
8
|
+
} else if (typeof duration === 'number') {
|
|
9
|
+
dur = duration;
|
|
10
|
+
} else {
|
|
11
|
+
var _duration;
|
|
12
|
+
dur = (_duration = duration[status]) !== null && _duration !== void 0 ? _duration : DEFAULT_DURATION;
|
|
13
|
+
}
|
|
14
|
+
return dur;
|
|
15
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC, HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
export interface IButtonIconProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
icon?: ReactNode;
|
|
5
|
+
size?: 'default' | 'middle' | 'small' | 'large';
|
|
6
|
+
clickable?: boolean;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
type?: 'primary' | 'default' | 'danger';
|
|
9
|
+
}
|
|
10
|
+
declare const IconButton: FC<IButtonIconProps>;
|
|
11
|
+
export default IconButton;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["size", "disabled", "clickable", "icon", "type", "className"];
|
|
4
|
+
import { CSS_PREFIX } from "../../../constants/cssPrefix";
|
|
5
|
+
import classNames from 'classnames';
|
|
6
|
+
import React from 'react';
|
|
7
|
+
import "./index.less";
|
|
8
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
+
var preCls = "".concat(CSS_PREFIX, "-icon-btn");
|
|
10
|
+
var IconButton = function IconButton(_ref) {
|
|
11
|
+
var _ref$size = _ref.size,
|
|
12
|
+
size = _ref$size === void 0 ? 'default' : _ref$size,
|
|
13
|
+
disabled = _ref.disabled,
|
|
14
|
+
_ref$clickable = _ref.clickable,
|
|
15
|
+
clickable = _ref$clickable === void 0 ? true : _ref$clickable,
|
|
16
|
+
icon = _ref.icon,
|
|
17
|
+
_ref$type = _ref.type,
|
|
18
|
+
type = _ref$type === void 0 ? 'default' : _ref$type,
|
|
19
|
+
className = _ref.className,
|
|
20
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
21
|
+
return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({}, props), {}, {
|
|
22
|
+
className: classNames(preCls, "".concat(preCls, "-size--").concat(size), clickable && "".concat(preCls, "--clickable"), disabled && "".concat(preCls, "--disabled"), "".concat(preCls, "-type-").concat(type), className),
|
|
23
|
+
children: icon
|
|
24
|
+
}));
|
|
25
|
+
};
|
|
26
|
+
export default IconButton;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@import '../../../styles/var.less';
|
|
2
|
+
|
|
3
|
+
.buttonIconType(@type) {
|
|
4
|
+
&-type-@{type} {
|
|
5
|
+
color: ~'var(--cm-icon-btn-@{type}-color)';
|
|
6
|
+
|
|
7
|
+
&:hover {
|
|
8
|
+
color: ~'var(--cm-icon-btn-@{type}-color-hover)';
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
&:active {
|
|
12
|
+
color: ~'var(--cm-icon-btn-@{type}-color-active)';
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
}
|
|
16
|
+
&--disabled&-type-@{type} {
|
|
17
|
+
color: ~'var(--cm-icon-btn-@{type}-color-disabled)';
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@fontSizeMap: {
|
|
22
|
+
@large: 32px;
|
|
23
|
+
@default: 24px;
|
|
24
|
+
@middle: 18px;
|
|
25
|
+
@small: 16px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.buttonSize(@size) {
|
|
29
|
+
&-size--@{size} {
|
|
30
|
+
font-size: @fontSizeMap[@@size];
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
@preCls: ~'@{prefix}-icon-btn';
|
|
35
|
+
|
|
36
|
+
.@{preCls} {
|
|
37
|
+
display: inline-block;
|
|
38
|
+
line-height: 1em;
|
|
39
|
+
// size
|
|
40
|
+
.buttonSize(default);
|
|
41
|
+
.buttonSize(middle);
|
|
42
|
+
.buttonSize(small);
|
|
43
|
+
.buttonSize(large);
|
|
44
|
+
|
|
45
|
+
// type
|
|
46
|
+
.buttonIconType(default);
|
|
47
|
+
.buttonIconType(primary);
|
|
48
|
+
.buttonIconType(danger);
|
|
49
|
+
|
|
50
|
+
&--clickable {
|
|
51
|
+
cursor: pointer;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
&--disabled {
|
|
55
|
+
cursor: not-allowed;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
var SlashSvg = function SlashSvg() {
|
|
4
|
+
return /*#__PURE__*/_jsx("svg", {
|
|
5
|
+
width: "1em",
|
|
6
|
+
height: "1em",
|
|
7
|
+
viewBox: "0 0 16 16",
|
|
8
|
+
fill: "currentColor",
|
|
9
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
10
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
11
|
+
d: "M4.06689 13.8119L11.0669 1.6875L11.9329 2.1875L4.93292 14.3119L4.06689 13.8119Z"
|
|
12
|
+
})
|
|
13
|
+
});
|
|
14
|
+
};
|
|
15
|
+
export default SlashSvg;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { HTMLAttributes } from 'react';
|
|
2
|
+
type SvgIconProps = HTMLAttributes<HTMLOrSVGElement>;
|
|
3
|
+
export declare const SlashSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare const ZipSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare const RarSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare const DocSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const PdfSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const TxtSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const CloseSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const DeleteSvg: (props: SvgIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export {};
|