@tiny-codes/react-easy 1.0.6 → 1.0.8
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/CHANGELOG.md +16 -0
- package/es/components/ConfirmAction/index.d.ts +1 -45
- package/es/components/FloatDrawer/index.d.ts +173 -0
- package/es/components/FloatDrawer/index.js +173 -0
- package/es/components/FloatDrawer/index.js.map +1 -0
- package/es/components/FloatDrawer/style/index.d.ts +3 -0
- package/es/components/FloatDrawer/style/index.js +151 -0
- package/es/components/FloatDrawer/style/index.js.map +1 -0
- package/es/components/ModalAction/index.d.ts +3 -32
- package/es/components/ModalAction/index.js +8 -5
- package/es/components/ModalAction/index.js.map +1 -1
- package/es/components/index.d.ts +2 -0
- package/es/components/index.js +1 -0
- package/es/components/index.js.map +1 -1
- package/es/utils/color.d.ts +8 -0
- package/es/utils/color.js +45 -0
- package/es/utils/color.js.map +1 -0
- package/es/utils/index.d.ts +1 -0
- package/es/utils/index.js +1 -1
- package/es/utils/index.js.map +1 -1
- package/lib/components/ConfirmAction/index.d.ts +1 -45
- package/lib/components/FloatDrawer/index.d.ts +173 -0
- package/lib/components/FloatDrawer/index.js +193 -0
- package/lib/components/FloatDrawer/index.js.map +7 -0
- package/lib/components/FloatDrawer/style/index.d.ts +3 -0
- package/lib/components/FloatDrawer/style/index.js +211 -0
- package/lib/components/FloatDrawer/style/index.js.map +7 -0
- package/lib/components/ModalAction/index.d.ts +3 -32
- package/lib/components/ModalAction/index.js +6 -4
- package/lib/components/ModalAction/index.js.map +2 -2
- package/lib/components/index.d.ts +2 -0
- package/lib/components/index.js +3 -0
- package/lib/components/index.js.map +2 -2
- package/lib/utils/color.d.ts +8 -0
- package/lib/utils/color.js +53 -0
- package/lib/utils/color.js.map +7 -0
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.js +23 -0
- package/lib/utils/index.js.map +3 -3
- package/package.json +4 -3
package/CHANGELOG.md
CHANGED
|
@@ -110,51 +110,7 @@ export declare const genRenderer: (defaultProps: Partial<ConfirmActionProps<any,
|
|
|
110
110
|
* @param WrappedComponent ConfirmAction component | ConfirmAction组件
|
|
111
111
|
* @param defaultProps Default properties | 默认属性
|
|
112
112
|
*/
|
|
113
|
-
export declare const withDefaultConfirmActionProps: <TP extends object, E extends keyof TP>(WrappedComponent: ComponentType<Omit<ModalFuncProps, "onOk"> & ConfirmActionTrigger<TP, E> & {
|
|
114
|
-
/**
|
|
115
|
-
* **EN:** Whether to display in red danger mode, which will automatically affect the color of
|
|
116
|
-
* the title, icon, and confirm button. Default is `false`, for DeleteConfirmAction, the
|
|
117
|
-
* defaults is `true`.
|
|
118
|
-
*
|
|
119
|
-
* - You can explicitly set `titleColor`, `iconColor`, and `okButtonProps.type` to override
|
|
120
|
-
*
|
|
121
|
-
* **CN:** 是否显示为红色危险模式,会自动影响标题、图标和确认按钮的颜色。默认`false`,DeleteConfirmAction组件的默认值为`true`。
|
|
122
|
-
*
|
|
123
|
-
* - 可以显式设置`titleColor`、`iconColor`和`okButtonProps.type`来覆盖
|
|
124
|
-
*/
|
|
125
|
-
danger?: boolean | undefined;
|
|
126
|
-
/**
|
|
127
|
-
* **EN:** The color of confirm box title, default is `warning`
|
|
128
|
-
*
|
|
129
|
-
* **CN:** 弹框标题颜色,默认`warning`
|
|
130
|
-
*/
|
|
131
|
-
titleColor?: TextProps['type'] | 'primary';
|
|
132
|
-
/**
|
|
133
|
-
* **EN:** The color of confirm box content
|
|
134
|
-
*
|
|
135
|
-
* **CN:** 弹框内容文本颜色
|
|
136
|
-
*/
|
|
137
|
-
contentColor?: TextProps['type'] | 'primary';
|
|
138
|
-
/**
|
|
139
|
-
* **EN:** The color of confirm box title icon, default is the same as `titleColor`
|
|
140
|
-
*
|
|
141
|
-
* **CN:** 弹框标题图标颜色,默认与`titleColor`相同
|
|
142
|
-
*/
|
|
143
|
-
iconColor?: TextProps['type'] | 'primary';
|
|
144
|
-
/**
|
|
145
|
-
* **EN:** Callback when click confirm button
|
|
146
|
-
*
|
|
147
|
-
* **CN:** 点击确认按钮的回调
|
|
148
|
-
*/
|
|
149
|
-
onOk?: ((...args: Parameters<TP[E]>) => unknown | Promise<unknown>) | undefined;
|
|
150
|
-
/**
|
|
151
|
-
* **EN:** Callback after confirm event, won't trigger if failed, the argument is the return
|
|
152
|
-
* value of `onOk`
|
|
153
|
-
*
|
|
154
|
-
* **CN:** 确认事件完成后的回调,失败时不会触发,参数为`onOk`的返回值
|
|
155
|
-
*/
|
|
156
|
-
afterOk?: ((data?: any) => void) | undefined;
|
|
157
|
-
} & RefAttributes<ConfirmActionRef>>, defaultProps?: Partial<ConfirmActionProps<TP, E>> | undefined) => import("react").ForwardRefExoticComponent<Omit<ModalFuncProps, "onOk"> & ConfirmActionTrigger<TP, E> & {
|
|
113
|
+
export declare const withDefaultConfirmActionProps: <TP extends object, E extends keyof TP>(WrappedComponent: ComponentType<PropsWithoutRef<ConfirmActionProps<TP, E>> & RefAttributes<ConfirmActionRef>>, defaultProps?: Partial<ConfirmActionProps<TP, E>>) => import("react").ForwardRefExoticComponent<Omit<ModalFuncProps, "onOk"> & ConfirmActionTrigger<TP, E> & {
|
|
158
114
|
/**
|
|
159
115
|
* **EN:** Whether to display in red danger mode, which will automatically affect the color of
|
|
160
116
|
* the title, icon, and confirm button. Default is `false`, for DeleteConfirmAction, the
|
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
import type { CSSProperties, FC, ReactNode } from 'react';
|
|
2
|
+
import { type CardProps } from 'antd';
|
|
3
|
+
export interface FloatDrawerProps {
|
|
4
|
+
/**
|
|
5
|
+
* **EN:** Whether the drawer is open
|
|
6
|
+
*
|
|
7
|
+
* **CN:** 抽屉是否打开
|
|
8
|
+
*/
|
|
9
|
+
open?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* **EN:** Position of the drawer
|
|
12
|
+
*
|
|
13
|
+
* **CN:** 抽屉的位置
|
|
14
|
+
*
|
|
15
|
+
* @default 'right'
|
|
16
|
+
*/
|
|
17
|
+
position?: 'left' | 'right' | 'top' | 'bottom';
|
|
18
|
+
/**
|
|
19
|
+
* **EN:** Default size of the drawer. If the drawer is placed on the left or right, this is the
|
|
20
|
+
* width, otherwise it is the height.
|
|
21
|
+
*
|
|
22
|
+
* **CN:** 抽屉的默认宽度。如果抽屉放在左侧或右侧,则为宽度,否则为高度。
|
|
23
|
+
*
|
|
24
|
+
* @default 300
|
|
25
|
+
*/
|
|
26
|
+
defaultSize?: number;
|
|
27
|
+
/**
|
|
28
|
+
* **EN:** Minimum size of the drawer
|
|
29
|
+
*
|
|
30
|
+
* **CN:** 抽屉的最小宽度
|
|
31
|
+
*
|
|
32
|
+
* @default 0
|
|
33
|
+
*/
|
|
34
|
+
minSize?: number;
|
|
35
|
+
/**
|
|
36
|
+
* **EN:** Maximum size of the drawer
|
|
37
|
+
*
|
|
38
|
+
* **CN:** 抽屉的最大宽度
|
|
39
|
+
*
|
|
40
|
+
* @default Infinity
|
|
41
|
+
*/
|
|
42
|
+
maxSize?: number;
|
|
43
|
+
/**
|
|
44
|
+
* **EN:** Cache key for storing the drawer size in localStorage. If not set, the size will not be
|
|
45
|
+
* cached.
|
|
46
|
+
*
|
|
47
|
+
* **CN:** 指定一个localStorage缓存键,用于记忆抽屉宽度。如果不设置,则不使用缓存。
|
|
48
|
+
*/
|
|
49
|
+
cacheKey?: string;
|
|
50
|
+
/**
|
|
51
|
+
* **EN:** Custom class name for the root element
|
|
52
|
+
*
|
|
53
|
+
* **CN:** 根元素的自定义类名
|
|
54
|
+
*/
|
|
55
|
+
className?: string;
|
|
56
|
+
/**
|
|
57
|
+
* **EN:** Custom class names for specific elements
|
|
58
|
+
*
|
|
59
|
+
* **CN:** 特定元素的自定义类名
|
|
60
|
+
*/
|
|
61
|
+
classNames?: {
|
|
62
|
+
/**
|
|
63
|
+
* **EN:** Class name for the drawer element
|
|
64
|
+
*
|
|
65
|
+
* **CN:** 抽屉元素的类名
|
|
66
|
+
*/
|
|
67
|
+
drawer?: string;
|
|
68
|
+
/**
|
|
69
|
+
* **EN:** Class name for the expand handle
|
|
70
|
+
*
|
|
71
|
+
* **CN:** 展开手柄的类名
|
|
72
|
+
*/
|
|
73
|
+
expandHandle?: string;
|
|
74
|
+
/**
|
|
75
|
+
* **EN:** Class name for the resize handle
|
|
76
|
+
*
|
|
77
|
+
* **CN:** 调整大小手柄的类名
|
|
78
|
+
*/
|
|
79
|
+
resizeHandle?: string;
|
|
80
|
+
/**
|
|
81
|
+
* **EN:** Class name for the handle icon
|
|
82
|
+
*
|
|
83
|
+
* **CN:** 手柄图标的类名
|
|
84
|
+
*/
|
|
85
|
+
handleIcon?: string;
|
|
86
|
+
/**
|
|
87
|
+
* **EN:** Class name for the content area
|
|
88
|
+
*
|
|
89
|
+
* **CN:** 内容区域的类名
|
|
90
|
+
*/
|
|
91
|
+
content?: string;
|
|
92
|
+
/**
|
|
93
|
+
* **EN:** Class name for the card element
|
|
94
|
+
*
|
|
95
|
+
* **CN:** 卡片元素的类名
|
|
96
|
+
*/
|
|
97
|
+
card?: string;
|
|
98
|
+
};
|
|
99
|
+
/**
|
|
100
|
+
* **EN:** Custom styles for the root element
|
|
101
|
+
*
|
|
102
|
+
* **CN:** 根元素的自定义样式
|
|
103
|
+
*/
|
|
104
|
+
style?: CSSProperties;
|
|
105
|
+
/**
|
|
106
|
+
* **EN:** Custom styles for specific elements
|
|
107
|
+
*
|
|
108
|
+
* **CN:** 特定元素的自定义样式
|
|
109
|
+
*/
|
|
110
|
+
styles?: {
|
|
111
|
+
/**
|
|
112
|
+
* **EN:** Styles for the drawer element
|
|
113
|
+
*
|
|
114
|
+
* **CN:** 抽屉元素的样式
|
|
115
|
+
*/
|
|
116
|
+
drawer?: CSSProperties;
|
|
117
|
+
/**
|
|
118
|
+
* **EN:** Styles for the expand handle
|
|
119
|
+
*
|
|
120
|
+
* **CN:** 展开手柄的样式
|
|
121
|
+
*/
|
|
122
|
+
expandHandle?: CSSProperties;
|
|
123
|
+
/**
|
|
124
|
+
* **EN:** Styles for the resize handle
|
|
125
|
+
*
|
|
126
|
+
* **CN:** 调整大小手柄的样式
|
|
127
|
+
*/
|
|
128
|
+
resizeHandle?: CSSProperties;
|
|
129
|
+
/**
|
|
130
|
+
* **EN:** Styles for the handle icon
|
|
131
|
+
*
|
|
132
|
+
* **CN:** 手柄图标的样式
|
|
133
|
+
*/
|
|
134
|
+
handleIcon?: CSSProperties;
|
|
135
|
+
/**
|
|
136
|
+
* **EN:** Styles for the content area
|
|
137
|
+
*
|
|
138
|
+
* **CN:** 内容区域的样式
|
|
139
|
+
*/
|
|
140
|
+
content?: CSSProperties;
|
|
141
|
+
/**
|
|
142
|
+
* **EN:** Styles for the card element
|
|
143
|
+
*
|
|
144
|
+
* **CN:** 卡片元素的样式
|
|
145
|
+
*/
|
|
146
|
+
card?: CSSProperties;
|
|
147
|
+
};
|
|
148
|
+
/**
|
|
149
|
+
* **EN:** Custom properties for the card element
|
|
150
|
+
*
|
|
151
|
+
* **CN:** 卡片元素的自定义属性
|
|
152
|
+
*/
|
|
153
|
+
cardProps?: Omit<CardProps, 'children'>;
|
|
154
|
+
/**
|
|
155
|
+
* **EN:** Content to be rendered inside the drawer
|
|
156
|
+
*
|
|
157
|
+
* **CN:** 抽屉内容
|
|
158
|
+
*/
|
|
159
|
+
children?: ReactNode;
|
|
160
|
+
/**
|
|
161
|
+
* **EN:** Callback function when the open state changes
|
|
162
|
+
*
|
|
163
|
+
* **CN:** 打开状态变化时的回调函数
|
|
164
|
+
*/
|
|
165
|
+
onOpenChange?: (open: boolean) => void;
|
|
166
|
+
}
|
|
167
|
+
/**
|
|
168
|
+
* **EN:** FloatDrawer component for creating a draggable, resizable drawer
|
|
169
|
+
*
|
|
170
|
+
* **CN:** FloatDrawer组件,用于创建可拖动、可调整大小的抽屉
|
|
171
|
+
*/
|
|
172
|
+
declare const FloatDrawer: FC<FloatDrawerProps>;
|
|
173
|
+
export default FloatDrawer;
|
|
@@ -0,0 +1,173 @@
|
|
|
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
|
+
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; }
|
|
3
|
+
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; }
|
|
4
|
+
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; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
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); }
|
|
7
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
9
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
10
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
11
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
12
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
13
|
+
import { useContext, useEffect, useMemo, useRef, useState } from 'react';
|
|
14
|
+
import { Card, ConfigProvider } from 'antd';
|
|
15
|
+
import classNames from 'classnames';
|
|
16
|
+
import { DownOutlined, LeftOutlined, RightOutlined, UpOutlined } from '@ant-design/icons';
|
|
17
|
+
import useRefFunction from "../../hooks/useRefFunction";
|
|
18
|
+
import useStyle from "./style";
|
|
19
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
20
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
21
|
+
/**
|
|
22
|
+
* **EN:** FloatDrawer component for creating a draggable, resizable drawer
|
|
23
|
+
*
|
|
24
|
+
* **CN:** FloatDrawer组件,用于创建可拖动、可调整大小的抽屉
|
|
25
|
+
*/
|
|
26
|
+
var FloatDrawer = function FloatDrawer(props) {
|
|
27
|
+
var open = props.open,
|
|
28
|
+
_props$position = props.position,
|
|
29
|
+
position = _props$position === void 0 ? 'right' : _props$position,
|
|
30
|
+
cardProps = props.cardProps,
|
|
31
|
+
children = props.children,
|
|
32
|
+
className = props.className,
|
|
33
|
+
classNamesInProps = props.classNames,
|
|
34
|
+
style = props.style,
|
|
35
|
+
styles = props.styles,
|
|
36
|
+
cacheKey = props.cacheKey,
|
|
37
|
+
_props$defaultSize = props.defaultSize,
|
|
38
|
+
defaultSize = _props$defaultSize === void 0 ? 300 : _props$defaultSize,
|
|
39
|
+
_props$minSize = props.minSize,
|
|
40
|
+
minSize = _props$minSize === void 0 ? 0 : _props$minSize,
|
|
41
|
+
_props$maxSize = props.maxSize,
|
|
42
|
+
maxSize = _props$maxSize === void 0 ? +Infinity : _props$maxSize,
|
|
43
|
+
onOpenChange = props.onOpenChange;
|
|
44
|
+
var _useContext = useContext(ConfigProvider.ConfigContext),
|
|
45
|
+
getPrefixCls = _useContext.getPrefixCls;
|
|
46
|
+
var prefixCls = getPrefixCls('re-float-drawer');
|
|
47
|
+
var _useStyle = useStyle(prefixCls),
|
|
48
|
+
_useStyle2 = _slicedToArray(_useStyle, 3),
|
|
49
|
+
wrapCSSVar = _useStyle2[0],
|
|
50
|
+
hashId = _useStyle2[1],
|
|
51
|
+
cssVarCls = _useStyle2[2];
|
|
52
|
+
var _useState = useState(),
|
|
53
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
54
|
+
isOpen = _useState2[0],
|
|
55
|
+
setIsOpen = _useState2[1];
|
|
56
|
+
var _useState3 = useState(cacheKey && localStorage.getItem(cacheKey) ? Number(localStorage.getItem(cacheKey)) || defaultSize : defaultSize),
|
|
57
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
58
|
+
size = _useState4[0],
|
|
59
|
+
setSize = _useState4[1];
|
|
60
|
+
var sizeMap = useMemo(function () {
|
|
61
|
+
var type = position === 'left' || position === 'right' ? 'width' : 'height';
|
|
62
|
+
return _defineProperty({}, type, size);
|
|
63
|
+
}, [position, size]);
|
|
64
|
+
var _useState5 = useState(false),
|
|
65
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
66
|
+
isDragging = _useState6[0],
|
|
67
|
+
setIsDragging = _useState6[1];
|
|
68
|
+
var dragStartPos = useRef(0);
|
|
69
|
+
var dragStartSize = useRef(size);
|
|
70
|
+
var classString = classNames(prefixCls, className, _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-open"), isOpen), "".concat(prefixCls, "-closed"), !isOpen), "".concat(prefixCls, "-").concat(position), position), hashId, cssVarCls);
|
|
71
|
+
var closeIcon = useMemo(function () {
|
|
72
|
+
return position === 'left' ? /*#__PURE__*/_jsx(RightOutlined, {}) : position === 'top' ? /*#__PURE__*/_jsx(DownOutlined, {}) : position === 'bottom' ? /*#__PURE__*/_jsx(UpOutlined, {}) : /*#__PURE__*/_jsx(LeftOutlined, {});
|
|
73
|
+
}, [position]);
|
|
74
|
+
var openIcon = useMemo(function () {
|
|
75
|
+
return position === 'left' ? /*#__PURE__*/_jsx(LeftOutlined, {}) : position === 'top' ? /*#__PURE__*/_jsx(UpOutlined, {}) : position === 'bottom' ? /*#__PURE__*/_jsx(DownOutlined, {}) : /*#__PURE__*/_jsx(RightOutlined, {});
|
|
76
|
+
}, [position]);
|
|
77
|
+
|
|
78
|
+
// Handle drawer visibility
|
|
79
|
+
var toggleDrawer = function toggleDrawer() {
|
|
80
|
+
setIsOpen(!isOpen);
|
|
81
|
+
onOpenChange === null || onOpenChange === void 0 || onOpenChange(!isOpen);
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
// Handle resize events
|
|
85
|
+
var handleResizeStart = useRefFunction(function (e) {
|
|
86
|
+
setIsDragging(true);
|
|
87
|
+
if (position === 'top' || position === 'bottom') {
|
|
88
|
+
dragStartPos.current = e.clientY;
|
|
89
|
+
} else {
|
|
90
|
+
dragStartPos.current = e.clientX;
|
|
91
|
+
}
|
|
92
|
+
dragStartSize.current = size;
|
|
93
|
+
e.preventDefault();
|
|
94
|
+
});
|
|
95
|
+
var handleResize = useRefFunction(function (e) {
|
|
96
|
+
if (isDragging) {
|
|
97
|
+
var newSize;
|
|
98
|
+
if (position === 'left') {
|
|
99
|
+
newSize = dragStartSize.current - (dragStartPos.current - e.clientX);
|
|
100
|
+
} else if (position === 'top') {
|
|
101
|
+
newSize = dragStartSize.current - (dragStartPos.current - e.clientY);
|
|
102
|
+
} else if (position === 'bottom') {
|
|
103
|
+
newSize = dragStartSize.current - (e.clientY - dragStartPos.current);
|
|
104
|
+
} else {
|
|
105
|
+
newSize = dragStartSize.current - (e.clientX - dragStartPos.current);
|
|
106
|
+
}
|
|
107
|
+
if (newSize >= minSize && newSize <= maxSize) {
|
|
108
|
+
setSize(newSize);
|
|
109
|
+
if (cacheKey) {
|
|
110
|
+
localStorage.setItem(cacheKey, String(newSize));
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
});
|
|
115
|
+
var handleResizeEnd = useRefFunction(function () {
|
|
116
|
+
setIsDragging(false);
|
|
117
|
+
});
|
|
118
|
+
|
|
119
|
+
// Controlled open state
|
|
120
|
+
useEffect(function () {
|
|
121
|
+
setIsOpen(open);
|
|
122
|
+
}, [open]);
|
|
123
|
+
|
|
124
|
+
// Handle global events
|
|
125
|
+
useEffect(function () {
|
|
126
|
+
if (isDragging) {
|
|
127
|
+
window.addEventListener('mousemove', handleResize);
|
|
128
|
+
window.addEventListener('mouseup', handleResizeEnd);
|
|
129
|
+
} else {
|
|
130
|
+
window.removeEventListener('mousemove', handleResize);
|
|
131
|
+
window.removeEventListener('mouseup', handleResizeEnd);
|
|
132
|
+
}
|
|
133
|
+
return function () {
|
|
134
|
+
window.removeEventListener('mousemove', handleResize);
|
|
135
|
+
window.removeEventListener('mouseup', handleResizeEnd);
|
|
136
|
+
};
|
|
137
|
+
}, [isDragging]);
|
|
138
|
+
return wrapCSSVar( /*#__PURE__*/_jsx("div", {
|
|
139
|
+
className: classString,
|
|
140
|
+
style: style,
|
|
141
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
142
|
+
className: classNames("".concat(prefixCls, "-drawer"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.drawer),
|
|
143
|
+
style: _objectSpread(_objectSpread({}, sizeMap), styles === null || styles === void 0 ? void 0 : styles.drawer),
|
|
144
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
145
|
+
className: classNames("".concat(prefixCls, "-resize-handle"), isDragging && "".concat(prefixCls, "-resize-handle-dragging"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.resizeHandle),
|
|
146
|
+
style: styles === null || styles === void 0 ? void 0 : styles.resizeHandle,
|
|
147
|
+
onMouseDown: handleResizeStart
|
|
148
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
149
|
+
className: classNames("".concat(prefixCls, "-content"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.content),
|
|
150
|
+
style: styles === null || styles === void 0 ? void 0 : styles.content,
|
|
151
|
+
children: /*#__PURE__*/_jsx(Card, _objectSpread(_objectSpread({
|
|
152
|
+
bordered: false,
|
|
153
|
+
variant: "borderless",
|
|
154
|
+
className: classNames("".concat(prefixCls, "-card"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.card),
|
|
155
|
+
style: styles === null || styles === void 0 ? void 0 : styles.card
|
|
156
|
+
}, cardProps), {}, {
|
|
157
|
+
children: children
|
|
158
|
+
}))
|
|
159
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
160
|
+
className: classNames("".concat(prefixCls, "-expand-handle"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.expandHandle),
|
|
161
|
+
style: styles === null || styles === void 0 ? void 0 : styles.expandHandle,
|
|
162
|
+
onClick: toggleDrawer,
|
|
163
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
164
|
+
className: classNames("".concat(prefixCls, "-handle-icon"), classNamesInProps === null || classNamesInProps === void 0 ? void 0 : classNamesInProps.handleIcon),
|
|
165
|
+
style: styles === null || styles === void 0 ? void 0 : styles.handleIcon,
|
|
166
|
+
children: isOpen ? openIcon : closeIcon
|
|
167
|
+
})
|
|
168
|
+
})]
|
|
169
|
+
})
|
|
170
|
+
}));
|
|
171
|
+
};
|
|
172
|
+
export default FloatDrawer;
|
|
173
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useContext","useEffect","useMemo","useRef","useState","Card","ConfigProvider","classNames","DownOutlined","LeftOutlined","RightOutlined","UpOutlined","useRefFunction","useStyle","jsx","_jsx","jsxs","_jsxs","FloatDrawer","props","open","_props$position","position","cardProps","children","className","classNamesInProps","style","styles","cacheKey","_props$defaultSize","defaultSize","_props$minSize","minSize","_props$maxSize","maxSize","Infinity","onOpenChange","_useContext","ConfigContext","getPrefixCls","prefixCls","_useStyle","_useStyle2","_slicedToArray","wrapCSSVar","hashId","cssVarCls","_useState","_useState2","isOpen","setIsOpen","_useState3","localStorage","getItem","Number","_useState4","size","setSize","sizeMap","type","_defineProperty","_useState5","_useState6","isDragging","setIsDragging","dragStartPos","dragStartSize","classString","concat","closeIcon","openIcon","toggleDrawer","handleResizeStart","e","current","clientY","clientX","preventDefault","handleResize","newSize","setItem","String","handleResizeEnd","window","addEventListener","removeEventListener","drawer","_objectSpread","resizeHandle","onMouseDown","content","bordered","variant","card","expandHandle","onClick","handleIcon"],"sources":["../../../src/components/FloatDrawer/index.tsx"],"sourcesContent":["import type { CSSProperties, FC, ReactNode } from 'react';\nimport { useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport { Card, type CardProps, ConfigProvider } from 'antd';\nimport classNames from 'classnames';\nimport { DownOutlined, LeftOutlined, RightOutlined, UpOutlined } from '@ant-design/icons';\nimport useRefFunction from '../../hooks/useRefFunction';\nimport useStyle from './style';\n\nexport interface FloatDrawerProps {\n /**\n * **EN:** Whether the drawer is open\n *\n * **CN:** 抽屉是否打开\n */\n open?: boolean;\n /**\n * **EN:** Position of the drawer\n *\n * **CN:** 抽屉的位置\n *\n * @default 'right'\n */\n position?: 'left' | 'right' | 'top' | 'bottom';\n /**\n * **EN:** Default size of the drawer. If the drawer is placed on the left or right, this is the\n * width, otherwise it is the height.\n *\n * **CN:** 抽屉的默认宽度。如果抽屉放在左侧或右侧,则为宽度,否则为高度。\n *\n * @default 300\n */\n defaultSize?: number;\n /**\n * **EN:** Minimum size of the drawer\n *\n * **CN:** 抽屉的最小宽度\n *\n * @default 0\n */\n minSize?: number;\n /**\n * **EN:** Maximum size of the drawer\n *\n * **CN:** 抽屉的最大宽度\n *\n * @default Infinity\n */\n maxSize?: number;\n /**\n * **EN:** Cache key for storing the drawer size in localStorage. If not set, the size will not be\n * cached.\n *\n * **CN:** 指定一个localStorage缓存键,用于记忆抽屉宽度。如果不设置,则不使用缓存。\n */\n cacheKey?: string;\n /**\n * **EN:** Custom class name for the root element\n *\n * **CN:** 根元素的自定义类名\n */\n className?: string;\n /**\n * **EN:** Custom class names for specific elements\n *\n * **CN:** 特定元素的自定义类名\n */\n classNames?: {\n /**\n * **EN:** Class name for the drawer element\n *\n * **CN:** 抽屉元素的类名\n */\n drawer?: string;\n /**\n * **EN:** Class name for the expand handle\n *\n * **CN:** 展开手柄的类名\n */\n expandHandle?: string;\n /**\n * **EN:** Class name for the resize handle\n *\n * **CN:** 调整大小手柄的类名\n */\n resizeHandle?: string;\n /**\n * **EN:** Class name for the handle icon\n *\n * **CN:** 手柄图标的类名\n */\n handleIcon?: string;\n /**\n * **EN:** Class name for the content area\n *\n * **CN:** 内容区域的类名\n */\n content?: string;\n /**\n * **EN:** Class name for the card element\n *\n * **CN:** 卡片元素的类名\n */\n card?: string;\n };\n /**\n * **EN:** Custom styles for the root element\n *\n * **CN:** 根元素的自定义样式\n */\n style?: CSSProperties;\n /**\n * **EN:** Custom styles for specific elements\n *\n * **CN:** 特定元素的自定义样式\n */\n styles?: {\n /**\n * **EN:** Styles for the drawer element\n *\n * **CN:** 抽屉元素的样式\n */\n drawer?: CSSProperties;\n /**\n * **EN:** Styles for the expand handle\n *\n * **CN:** 展开手柄的样式\n */\n expandHandle?: CSSProperties;\n /**\n * **EN:** Styles for the resize handle\n *\n * **CN:** 调整大小手柄的样式\n */\n resizeHandle?: CSSProperties;\n /**\n * **EN:** Styles for the handle icon\n *\n * **CN:** 手柄图标的样式\n */\n handleIcon?: CSSProperties;\n /**\n * **EN:** Styles for the content area\n *\n * **CN:** 内容区域的样式\n */\n content?: CSSProperties;\n /**\n * **EN:** Styles for the card element\n *\n * **CN:** 卡片元素的样式\n */\n card?: CSSProperties;\n };\n /**\n * **EN:** Custom properties for the card element\n *\n * **CN:** 卡片元素的自定义属性\n */\n cardProps?: Omit<CardProps, 'children'>;\n /**\n * **EN:** Content to be rendered inside the drawer\n *\n * **CN:** 抽屉内容\n */\n children?: ReactNode;\n /**\n * **EN:** Callback function when the open state changes\n *\n * **CN:** 打开状态变化时的回调函数\n */\n onOpenChange?: (open: boolean) => void;\n}\n\n/**\n * **EN:** FloatDrawer component for creating a draggable, resizable drawer\n *\n * **CN:** FloatDrawer组件,用于创建可拖动、可调整大小的抽屉\n */\nconst FloatDrawer: FC<FloatDrawerProps> = (props) => {\n const {\n open,\n position = 'right',\n cardProps,\n children,\n className,\n classNames: classNamesInProps,\n style,\n styles,\n cacheKey,\n defaultSize = 300,\n minSize = 0,\n maxSize = +Infinity,\n onOpenChange,\n } = props;\n const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);\n const prefixCls = getPrefixCls('re-float-drawer');\n const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);\n const [isOpen, setIsOpen] = useState<boolean>();\n const [size, setSize] = useState(\n cacheKey && localStorage.getItem(cacheKey) ? Number(localStorage.getItem(cacheKey)) || defaultSize : defaultSize\n );\n const sizeMap = useMemo(() => {\n const type = position === 'left' || position === 'right' ? 'width' : 'height';\n return {\n [type]: size,\n };\n }, [position, size]);\n const [isDragging, setIsDragging] = useState(false);\n const dragStartPos = useRef<number>(0);\n const dragStartSize = useRef<number>(size);\n const classString = classNames(\n prefixCls,\n className,\n {\n [`${prefixCls}-open`]: isOpen,\n [`${prefixCls}-closed`]: !isOpen,\n [`${prefixCls}-${position}`]: position,\n },\n hashId,\n cssVarCls\n );\n const closeIcon = useMemo(() => {\n return position === 'left' ? (\n <RightOutlined />\n ) : position === 'top' ? (\n <DownOutlined />\n ) : position === 'bottom' ? (\n <UpOutlined />\n ) : (\n <LeftOutlined />\n );\n }, [position]);\n const openIcon = useMemo(() => {\n return position === 'left' ? (\n <LeftOutlined />\n ) : position === 'top' ? (\n <UpOutlined />\n ) : position === 'bottom' ? (\n <DownOutlined />\n ) : (\n <RightOutlined />\n );\n }, [position]);\n\n // Handle drawer visibility\n const toggleDrawer = () => {\n setIsOpen(!isOpen);\n onOpenChange?.(!isOpen);\n };\n\n // Handle resize events\n const handleResizeStart = useRefFunction((e: React.MouseEvent) => {\n setIsDragging(true);\n if (position === 'top' || position === 'bottom') {\n dragStartPos.current = e.clientY;\n } else {\n dragStartPos.current = e.clientX;\n }\n dragStartSize.current = size;\n e.preventDefault();\n });\n const handleResize = useRefFunction((e: MouseEvent) => {\n if (isDragging) {\n let newSize: number;\n if (position === 'left') {\n newSize = dragStartSize.current - (dragStartPos.current - e.clientX);\n } else if (position === 'top') {\n newSize = dragStartSize.current - (dragStartPos.current - e.clientY);\n } else if (position === 'bottom') {\n newSize = dragStartSize.current - (e.clientY - dragStartPos.current);\n } else {\n newSize = dragStartSize.current - (e.clientX - dragStartPos.current);\n }\n if (newSize >= minSize && newSize <= maxSize) {\n setSize(newSize);\n if (cacheKey) {\n localStorage.setItem(cacheKey, String(newSize));\n }\n }\n }\n });\n const handleResizeEnd = useRefFunction(() => {\n setIsDragging(false);\n });\n\n // Controlled open state\n useEffect(() => {\n setIsOpen(open);\n }, [open]);\n\n // Handle global events\n useEffect(() => {\n if (isDragging) {\n window.addEventListener('mousemove', handleResize);\n window.addEventListener('mouseup', handleResizeEnd);\n } else {\n window.removeEventListener('mousemove', handleResize);\n window.removeEventListener('mouseup', handleResizeEnd);\n }\n return () => {\n window.removeEventListener('mousemove', handleResize);\n window.removeEventListener('mouseup', handleResizeEnd);\n };\n }, [isDragging]);\n\n return wrapCSSVar(\n <div className={classString} style={style}>\n <div\n className={classNames(`${prefixCls}-drawer`, classNamesInProps?.drawer)}\n style={{ ...sizeMap, ...styles?.drawer }}\n >\n <div\n className={classNames(\n `${prefixCls}-resize-handle`,\n isDragging && `${prefixCls}-resize-handle-dragging`,\n classNamesInProps?.resizeHandle\n )}\n style={styles?.resizeHandle}\n onMouseDown={handleResizeStart}\n />\n <div className={classNames(`${prefixCls}-content`, classNamesInProps?.content)} style={styles?.content}>\n <Card\n bordered={false}\n variant=\"borderless\"\n className={classNames(`${prefixCls}-card`, classNamesInProps?.card)}\n style={styles?.card}\n {...cardProps}\n >\n {children}\n </Card>\n </div>\n <div\n className={classNames(`${prefixCls}-expand-handle`, classNamesInProps?.expandHandle)}\n style={styles?.expandHandle}\n onClick={toggleDrawer}\n >\n <div\n className={classNames(`${prefixCls}-handle-icon`, classNamesInProps?.handleIcon)}\n style={styles?.handleIcon}\n >\n {isOpen ? openIcon : closeIcon}\n </div>\n </div>\n </div>\n </div>\n );\n};\n\nexport default FloatDrawer;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const _default: (prefixCls: string, rootCls?: string | undefined) => readonly [(node: import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>, string, string];
|
|
3
|
+
export default _default;
|
|
@@ -0,0 +1,151 @@
|
|
|
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
|
+
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; }
|
|
3
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
4
|
+
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); }
|
|
5
|
+
import { genStyleHooks } from 'antd/es/theme/internal';
|
|
6
|
+
import { getColorLuminance } from "../../../utils";
|
|
7
|
+
var genStyle = function genStyle(token) {
|
|
8
|
+
var _componentCls;
|
|
9
|
+
var componentCls = token.componentCls;
|
|
10
|
+
return _defineProperty({}, componentCls, (_componentCls = {
|
|
11
|
+
position: 'absolute',
|
|
12
|
+
display: 'flex',
|
|
13
|
+
overflow: 'visible',
|
|
14
|
+
zIndex: token.zIndexPopupBase
|
|
15
|
+
}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_componentCls, '&-left', {
|
|
16
|
+
left: 0,
|
|
17
|
+
top: 0,
|
|
18
|
+
bottom: 0
|
|
19
|
+
}), '&-right', {
|
|
20
|
+
right: 0,
|
|
21
|
+
top: 0,
|
|
22
|
+
bottom: 0
|
|
23
|
+
}), '&-top', {
|
|
24
|
+
left: 0,
|
|
25
|
+
right: 0,
|
|
26
|
+
top: 0
|
|
27
|
+
}), '&-bottom', {
|
|
28
|
+
left: 0,
|
|
29
|
+
right: 0,
|
|
30
|
+
bottom: 0
|
|
31
|
+
}), "&".concat(componentCls, "-open"), {
|
|
32
|
+
// visibility: 'visible',
|
|
33
|
+
}), "&".concat(componentCls, "-closed"), {
|
|
34
|
+
pointerEvents: 'none'
|
|
35
|
+
}), "".concat(componentCls, "-drawer"), {
|
|
36
|
+
transition: 'transform 0.3s ease-in-out',
|
|
37
|
+
overflow: 'visible'
|
|
38
|
+
}), "&".concat(componentCls, "-left ").concat(componentCls, "-drawer,\n &").concat(componentCls, "-right ").concat(componentCls, "-drawer"), {
|
|
39
|
+
height: '100%'
|
|
40
|
+
}), "&".concat(componentCls, "-top ").concat(componentCls, "-drawer,\n &").concat(componentCls, "-bottom ").concat(componentCls, "-drawer"), {
|
|
41
|
+
width: '100%'
|
|
42
|
+
}), "&".concat(componentCls, "-open").concat(componentCls, "-left ").concat(componentCls, "-drawer,\n &").concat(componentCls, "-open").concat(componentCls, "-right ").concat(componentCls, "-drawer,\n &").concat(componentCls, "-open").concat(componentCls, "-top ").concat(componentCls, "-drawer,\n &").concat(componentCls, "-open").concat(componentCls, "-bottom ").concat(componentCls, "-drawer"), {
|
|
43
|
+
transform: 'translate(0, 0)'
|
|
44
|
+
}), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_componentCls, "&".concat(componentCls, "-open").concat(componentCls, "-left ").concat(componentCls, "-drawer"), {
|
|
45
|
+
boxShadow: "2px 0 10px ".concat(token.colorFill)
|
|
46
|
+
}), "&".concat(componentCls, "-open").concat(componentCls, "-right ").concat(componentCls, "-drawer"), {
|
|
47
|
+
boxShadow: "-2px 0 10px ".concat(token.colorFill)
|
|
48
|
+
}), "&".concat(componentCls, "-open").concat(componentCls, "-top ").concat(componentCls, "-drawer"), {
|
|
49
|
+
boxShadow: "0 2px 10px ".concat(token.colorFill)
|
|
50
|
+
}), "&".concat(componentCls, "-open").concat(componentCls, "-bottom ").concat(componentCls, "-drawer"), {
|
|
51
|
+
boxShadow: "0 -2px 10px ".concat(token.colorFill)
|
|
52
|
+
}), "&".concat(componentCls, "-closed").concat(componentCls, "-left ").concat(componentCls, "-drawer"), {
|
|
53
|
+
transform: 'translateX(-100%)'
|
|
54
|
+
}), "&".concat(componentCls, "-closed").concat(componentCls, "-right ").concat(componentCls, "-drawer"), {
|
|
55
|
+
transform: 'translateX(100%)'
|
|
56
|
+
}), "&".concat(componentCls, "-closed").concat(componentCls, "-top ").concat(componentCls, "-drawer"), {
|
|
57
|
+
transform: 'translateY(-100%)'
|
|
58
|
+
}), "&".concat(componentCls, "-closed").concat(componentCls, "-bottom ").concat(componentCls, "-drawer"), {
|
|
59
|
+
transform: 'translateY(100%)'
|
|
60
|
+
}), "".concat(componentCls, "-expand-handle"), {
|
|
61
|
+
position: 'absolute',
|
|
62
|
+
zIndex: 2,
|
|
63
|
+
cursor: 'pointer',
|
|
64
|
+
color: token.colorTextTertiary,
|
|
65
|
+
backgroundColor: getColorLuminance(token.colorBgBase) > 0.5 ? '#fafafa' : '#141414',
|
|
66
|
+
display: 'flex',
|
|
67
|
+
alignItems: 'center',
|
|
68
|
+
justifyContent: 'center',
|
|
69
|
+
pointerEvents: 'all',
|
|
70
|
+
'&:hover': {
|
|
71
|
+
color: token.colorText,
|
|
72
|
+
backgroundColor: getColorLuminance(token.colorBgBase) > 0.5 ? '#f0f0f0' : '#1a1a1a'
|
|
73
|
+
}
|
|
74
|
+
}), "&".concat(componentCls, "-left ").concat(componentCls, "-expand-handle,\n &").concat(componentCls, "-right ").concat(componentCls, "-expand-handle"), {
|
|
75
|
+
top: '50%',
|
|
76
|
+
width: 24,
|
|
77
|
+
height: 60
|
|
78
|
+
}), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_componentCls, "&".concat(componentCls, "-top ").concat(componentCls, "-expand-handle,\n &").concat(componentCls, "-bottom ").concat(componentCls, "-expand-handle"), {
|
|
79
|
+
left: '50%',
|
|
80
|
+
width: 60,
|
|
81
|
+
height: 24
|
|
82
|
+
}), "&".concat(componentCls, "-left ").concat(componentCls, "-expand-handle"), {
|
|
83
|
+
right: 0,
|
|
84
|
+
transform: 'translate(100%, -50%)',
|
|
85
|
+
borderRadius: '0 8px 8px 0',
|
|
86
|
+
boxShadow: "2px 0 5px ".concat(token.colorFill)
|
|
87
|
+
}), "&".concat(componentCls, "-right ").concat(componentCls, "-expand-handle"), {
|
|
88
|
+
left: 0,
|
|
89
|
+
transform: 'translate(-100%, -50%)',
|
|
90
|
+
borderRadius: '8px 0 0 8px',
|
|
91
|
+
boxShadow: "-2px 0 5px ".concat(token.colorFill)
|
|
92
|
+
}), "&".concat(componentCls, "-top ").concat(componentCls, "-expand-handle"), {
|
|
93
|
+
bottom: 0,
|
|
94
|
+
transform: 'translate(-50%, 100%)',
|
|
95
|
+
borderRadius: '0 0 8px 8px',
|
|
96
|
+
boxShadow: "0 2px 5px ".concat(token.colorFill)
|
|
97
|
+
}), "&".concat(componentCls, "-bottom ").concat(componentCls, "-expand-handle"), {
|
|
98
|
+
top: 0,
|
|
99
|
+
transform: 'translate(-50%, -100%)',
|
|
100
|
+
borderRadius: '8px 8px 0 0',
|
|
101
|
+
boxShadow: "0 -2px 5px ".concat(token.colorFill)
|
|
102
|
+
}), "".concat(componentCls, "-handle-icon"), {
|
|
103
|
+
userSelect: 'none',
|
|
104
|
+
lineHeight: 0
|
|
105
|
+
}), "".concat(componentCls, "-resize-handle"), {
|
|
106
|
+
position: 'absolute',
|
|
107
|
+
border: "1px solid transparent",
|
|
108
|
+
zIndex: 1,
|
|
109
|
+
backgroundColor: token.colorBgTextHover,
|
|
110
|
+
'&:hover': {
|
|
111
|
+
backgroundColor: token.colorBgTextActive
|
|
112
|
+
},
|
|
113
|
+
'&&-dragging': {
|
|
114
|
+
backgroundColor: token.colorBgTextActive
|
|
115
|
+
}
|
|
116
|
+
}), "&".concat(componentCls, "-left ").concat(componentCls, "-resize-handle"), {
|
|
117
|
+
right: 0,
|
|
118
|
+
width: 1,
|
|
119
|
+
height: '100%',
|
|
120
|
+
cursor: 'col-resize'
|
|
121
|
+
}), "&".concat(componentCls, "-right ").concat(componentCls, "-resize-handle"), {
|
|
122
|
+
left: 0,
|
|
123
|
+
width: 1,
|
|
124
|
+
height: '100%',
|
|
125
|
+
cursor: 'col-resize'
|
|
126
|
+
}), "&".concat(componentCls, "-top ").concat(componentCls, "-resize-handle"), {
|
|
127
|
+
bottom: 0,
|
|
128
|
+
height: 1,
|
|
129
|
+
width: '100%',
|
|
130
|
+
cursor: 'row-resize'
|
|
131
|
+
}), _defineProperty(_defineProperty(_componentCls, "&".concat(componentCls, "-bottom ").concat(componentCls, "-resize-handle"), {
|
|
132
|
+
top: 0,
|
|
133
|
+
height: 1,
|
|
134
|
+
width: '100%',
|
|
135
|
+
cursor: 'row-resize'
|
|
136
|
+
}), "".concat(componentCls, "-content"), _defineProperty({
|
|
137
|
+
height: '100%'
|
|
138
|
+
}, "".concat(componentCls, "-card"), _defineProperty({
|
|
139
|
+
display: 'flex',
|
|
140
|
+
flexDirection: 'column',
|
|
141
|
+
height: '100%'
|
|
142
|
+
}, "".concat(token.antCls, "-card-body"), {
|
|
143
|
+
flex: 1,
|
|
144
|
+
minHeight: 0,
|
|
145
|
+
overflow: 'auto'
|
|
146
|
+
})))));
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
150
|
+
export default genStyleHooks('re-float-drawer', genStyle);
|
|
151
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["genStyleHooks","getColorLuminance","genStyle","token","_componentCls","componentCls","_defineProperty","position","display","overflow","zIndex","zIndexPopupBase","left","top","bottom","right","concat","pointerEvents","transition","height","width","transform","boxShadow","colorFill","cursor","color","colorTextTertiary","backgroundColor","colorBgBase","alignItems","justifyContent","colorText","borderRadius","userSelect","lineHeight","border","colorBgTextHover","colorBgTextActive","flexDirection","antCls","flex","minHeight"],"sources":["../../../../src/components/FloatDrawer/style/index.ts"],"sourcesContent":["import { genStyleHooks } from 'antd/es/theme/internal';\nimport type { AliasToken, GenerateStyle } from 'antd/es/theme/internal';\nimport type { CSSObject } from '@ant-design/cssinjs';\nimport type { FullToken } from '@ant-design/cssinjs-utils';\nimport { getColorLuminance } from '../../../utils';\n\ntype REFloatDrawerToken = FullToken<{ ''?: object }, AliasToken, ''>;\n\nconst genStyle: GenerateStyle<REFloatDrawerToken> = (token): CSSObject => {\n const { componentCls } = token;\n return {\n [componentCls]: {\n position: 'absolute',\n display: 'flex',\n overflow: 'visible',\n zIndex: token.zIndexPopupBase,\n ['&-left']: {\n left: 0,\n top: 0,\n bottom: 0,\n },\n ['&-right']: {\n right: 0,\n top: 0,\n bottom: 0,\n },\n ['&-top']: {\n left: 0,\n right: 0,\n top: 0,\n },\n ['&-bottom']: {\n left: 0,\n right: 0,\n bottom: 0,\n },\n\n [`&${componentCls}-open`]: {\n // visibility: 'visible',\n },\n [`&${componentCls}-closed`]: {\n pointerEvents: 'none',\n },\n [`${componentCls}-drawer`]: {\n transition: 'transform 0.3s ease-in-out',\n overflow: 'visible',\n },\n [`&${componentCls}-left ${componentCls}-drawer,\n &${componentCls}-right ${componentCls}-drawer`]: {\n height: '100%',\n },\n [`&${componentCls}-top ${componentCls}-drawer,\n &${componentCls}-bottom ${componentCls}-drawer`]: {\n width: '100%',\n },\n [`&${componentCls}-open${componentCls}-left ${componentCls}-drawer,\n &${componentCls}-open${componentCls}-right ${componentCls}-drawer,\n &${componentCls}-open${componentCls}-top ${componentCls}-drawer,\n &${componentCls}-open${componentCls}-bottom ${componentCls}-drawer`]: {\n transform: 'translate(0, 0)',\n },\n [`&${componentCls}-open${componentCls}-left ${componentCls}-drawer`]: {\n boxShadow: `2px 0 10px ${token.colorFill}`,\n },\n [`&${componentCls}-open${componentCls}-right ${componentCls}-drawer`]: {\n boxShadow: `-2px 0 10px ${token.colorFill}`,\n },\n [`&${componentCls}-open${componentCls}-top ${componentCls}-drawer`]: {\n boxShadow: `0 2px 10px ${token.colorFill}`,\n },\n [`&${componentCls}-open${componentCls}-bottom ${componentCls}-drawer`]: {\n boxShadow: `0 -2px 10px ${token.colorFill}`,\n },\n [`&${componentCls}-closed${componentCls}-left ${componentCls}-drawer`]: {\n transform: 'translateX(-100%)',\n },\n [`&${componentCls}-closed${componentCls}-right ${componentCls}-drawer`]: {\n transform: 'translateX(100%)',\n },\n [`&${componentCls}-closed${componentCls}-top ${componentCls}-drawer`]: {\n transform: 'translateY(-100%)',\n },\n [`&${componentCls}-closed${componentCls}-bottom ${componentCls}-drawer`]: {\n transform: 'translateY(100%)',\n },\n [`${componentCls}-expand-handle`]: {\n position: 'absolute',\n zIndex: 2,\n cursor: 'pointer',\n color: token.colorTextTertiary,\n backgroundColor: getColorLuminance(token.colorBgBase) > 0.5 ? '#fafafa' : '#141414',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n pointerEvents: 'all',\n '&:hover': {\n color: token.colorText,\n backgroundColor: getColorLuminance(token.colorBgBase) > 0.5 ? '#f0f0f0' : '#1a1a1a',\n },\n },\n [`&${componentCls}-left ${componentCls}-expand-handle,\n &${componentCls}-right ${componentCls}-expand-handle`]: {\n top: '50%',\n width: 24,\n height: 60,\n },\n [`&${componentCls}-top ${componentCls}-expand-handle,\n &${componentCls}-bottom ${componentCls}-expand-handle`]: {\n left: '50%',\n width: 60,\n height: 24,\n },\n [`&${componentCls}-left ${componentCls}-expand-handle`]: {\n right: 0,\n transform: 'translate(100%, -50%)',\n borderRadius: '0 8px 8px 0',\n boxShadow: `2px 0 5px ${token.colorFill}`,\n },\n [`&${componentCls}-right ${componentCls}-expand-handle`]: {\n left: 0,\n transform: 'translate(-100%, -50%)',\n borderRadius: '8px 0 0 8px',\n boxShadow: `-2px 0 5px ${token.colorFill}`,\n },\n [`&${componentCls}-top ${componentCls}-expand-handle`]: {\n bottom: 0,\n transform: 'translate(-50%, 100%)',\n borderRadius: '0 0 8px 8px',\n boxShadow: `0 2px 5px ${token.colorFill}`,\n },\n [`&${componentCls}-bottom ${componentCls}-expand-handle`]: {\n top: 0,\n transform: 'translate(-50%, -100%)',\n borderRadius: '8px 8px 0 0',\n boxShadow: `0 -2px 5px ${token.colorFill}`,\n },\n [`${componentCls}-handle-icon`]: {\n userSelect: 'none',\n lineHeight: 0,\n },\n [`${componentCls}-resize-handle`]: {\n position: 'absolute',\n border: `1px solid transparent`,\n zIndex: 1,\n backgroundColor: token.colorBgTextHover,\n '&:hover': {\n backgroundColor: token.colorBgTextActive,\n },\n '&&-dragging': {\n backgroundColor: token.colorBgTextActive,\n },\n },\n [`&${componentCls}-left ${componentCls}-resize-handle`]: {\n right: 0,\n width: 1,\n height: '100%',\n cursor: 'col-resize',\n },\n [`&${componentCls}-right ${componentCls}-resize-handle`]: {\n left: 0,\n width: 1,\n height: '100%',\n cursor: 'col-resize',\n },\n [`&${componentCls}-top ${componentCls}-resize-handle`]: {\n bottom: 0,\n height: 1,\n width: '100%',\n cursor: 'row-resize',\n },\n [`&${componentCls}-bottom ${componentCls}-resize-handle`]: {\n top: 0,\n height: 1,\n width: '100%',\n cursor: 'row-resize',\n },\n [`${componentCls}-content`]: {\n height: '100%',\n [`${componentCls}-card`]: {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n\n [`${token.antCls}-card-body`]: {\n flex: 1,\n minHeight: 0,\n overflow: 'auto',\n },\n },\n },\n },\n };\n};\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport default genStyleHooks('re-float-drawer' as any, genStyle);\n"],"mappings":"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"}
|