one-design-next 0.0.47 → 0.0.48
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/dist/collapse/index.d.ts
CHANGED
|
@@ -35,6 +35,26 @@ interface CollapseProps {
|
|
|
35
35
|
* 自定义样式
|
|
36
36
|
*/
|
|
37
37
|
style?: React.CSSProperties;
|
|
38
|
+
/**
|
|
39
|
+
* 展开图标名称
|
|
40
|
+
*/
|
|
41
|
+
expandIconName?: string;
|
|
42
|
+
/**
|
|
43
|
+
* 展开图标位置
|
|
44
|
+
*/
|
|
45
|
+
expandIconPosition?: 'left' | 'right';
|
|
46
|
+
/**
|
|
47
|
+
* 禁用项是否隐藏图标
|
|
48
|
+
*/
|
|
49
|
+
hideIconWhenDisabled?: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* 内容区内层自定义类名
|
|
52
|
+
*/
|
|
53
|
+
contentInnerClassName?: string;
|
|
54
|
+
/**
|
|
55
|
+
* 内容区内层自定义样式
|
|
56
|
+
*/
|
|
57
|
+
contentInnerStyle?: React.CSSProperties;
|
|
38
58
|
}
|
|
39
59
|
declare const Collapse: React.FC<CollapseProps>;
|
|
40
60
|
export default Collapse;
|
package/dist/collapse/index.js
CHANGED
|
@@ -23,7 +23,15 @@ var Collapse = function Collapse(_ref) {
|
|
|
23
23
|
_ref$accordion = _ref.accordion,
|
|
24
24
|
accordion = _ref$accordion === void 0 ? false : _ref$accordion,
|
|
25
25
|
className = _ref.className,
|
|
26
|
-
style = _ref.style
|
|
26
|
+
style = _ref.style,
|
|
27
|
+
_ref$expandIconName = _ref.expandIconName,
|
|
28
|
+
expandIconName = _ref$expandIconName === void 0 ? 'right' : _ref$expandIconName,
|
|
29
|
+
_ref$expandIconPositi = _ref.expandIconPosition,
|
|
30
|
+
expandIconPosition = _ref$expandIconPositi === void 0 ? 'left' : _ref$expandIconPositi,
|
|
31
|
+
_ref$hideIconWhenDisa = _ref.hideIconWhenDisabled,
|
|
32
|
+
hideIconWhenDisabled = _ref$hideIconWhenDisa === void 0 ? false : _ref$hideIconWhenDisa,
|
|
33
|
+
contentInnerClassName = _ref.contentInnerClassName,
|
|
34
|
+
contentInnerStyle = _ref.contentInnerStyle;
|
|
27
35
|
// 标准化 activeKey 为数组
|
|
28
36
|
var normalizeKeys = function normalizeKeys(keys) {
|
|
29
37
|
if (keys === undefined) return [];
|
|
@@ -92,14 +100,18 @@ var Collapse = function Collapse(_ref) {
|
|
|
92
100
|
asChild: true
|
|
93
101
|
}, /*#__PURE__*/React.createElement("div", {
|
|
94
102
|
"data-odn-collapse-header": true,
|
|
95
|
-
"data-odn-collapse-header-disabled": item.disabled
|
|
96
|
-
|
|
103
|
+
"data-odn-collapse-header-disabled": item.disabled,
|
|
104
|
+
"data-odn-collapse-icon-position": expandIconPosition
|
|
105
|
+
}, !(hideIconWhenDisabled && item.disabled) && /*#__PURE__*/React.createElement(Icon, {
|
|
97
106
|
"data-odn-collapse-header-icon": true,
|
|
98
|
-
name:
|
|
99
|
-
|
|
107
|
+
"data-odn-collapse-header-icon-name": expandIconName,
|
|
108
|
+
name: expandIconName
|
|
109
|
+
}), item.label)), item.children != null && /*#__PURE__*/React.createElement(CollapsibleContent, {
|
|
100
110
|
"data-odn-collapse-content": true
|
|
101
111
|
}, /*#__PURE__*/React.createElement("div", {
|
|
102
|
-
"data-odn-collapse-content-inner": true
|
|
112
|
+
"data-odn-collapse-content-inner": true,
|
|
113
|
+
className: contentInnerClassName,
|
|
114
|
+
style: contentInnerStyle
|
|
103
115
|
}, item.children))));
|
|
104
116
|
}));
|
|
105
117
|
};
|
|
@@ -19,19 +19,25 @@ html {
|
|
|
19
19
|
[data-odn-collapsible-item-root]:first-child [data-odn-collapse-header] {
|
|
20
20
|
border-radius: var(--odn-border-radius) var(--odn-border-radius) 0 0;
|
|
21
21
|
}
|
|
22
|
-
[data-odn-collapsible-item-root]:last-child [data-odn-collapse-item] {
|
|
23
|
-
border-bottom: 0;
|
|
24
|
-
}
|
|
25
22
|
[data-odn-collapsible-item-root]:last-child [data-odn-collapse-content-inner],
|
|
26
23
|
[data-odn-collapsible-item-root]:last-child [data-odn-collapse-header] {
|
|
27
24
|
border-radius: 0 0 var(--odn-border-radius) var(--odn-border-radius);
|
|
28
25
|
}
|
|
26
|
+
[data-odn-collapsible-item-root]:last-child [data-odn-collapse-item] {
|
|
27
|
+
border-bottom: 0;
|
|
28
|
+
}
|
|
29
29
|
[data-odn-collapsible-item-root] {
|
|
30
30
|
/* Base UI Root 使用 data-open / data-closed，与 Radix 的 data-state 不同 */
|
|
31
31
|
}
|
|
32
|
-
[data-odn-collapsible-item-root][data-open] [data-odn-collapse-header-icon] {
|
|
32
|
+
[data-odn-collapsible-item-root][data-open] [data-odn-collapse-header-icon-name=right] {
|
|
33
33
|
transform: rotate(90deg);
|
|
34
34
|
}
|
|
35
|
+
[data-odn-collapsible-item-root][data-open] [data-odn-collapse-header-icon-name=up] {
|
|
36
|
+
transform: rotate(0deg);
|
|
37
|
+
}
|
|
38
|
+
[data-odn-collapsible-item-root][data-open] [data-odn-collapse-content] {
|
|
39
|
+
border-top: var(--odn-line-width) var(--odn-line-type) var(--odn-color-border);
|
|
40
|
+
}
|
|
35
41
|
|
|
36
42
|
[data-odn-collapse-header] {
|
|
37
43
|
position: relative;
|
|
@@ -48,13 +54,16 @@ html {
|
|
|
48
54
|
cursor: not-allowed;
|
|
49
55
|
opacity: 0.4;
|
|
50
56
|
}
|
|
57
|
+
[data-odn-collapse-header][data-odn-collapse-icon-position=right] [data-odn-collapse-header-icon] {
|
|
58
|
+
margin-left: auto;
|
|
59
|
+
order: 2;
|
|
60
|
+
}
|
|
51
61
|
|
|
52
62
|
[data-odn-collapse-header-icon] {
|
|
53
63
|
transition: transform 0.2s cubic-bezier(0.32, 0.72, 0, 1);
|
|
54
64
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
border-top: var(--odn-line-width) var(--odn-line-type) var(--odn-color-border);
|
|
65
|
+
[data-odn-collapse-header-icon][data-odn-collapse-header-icon-name=up] {
|
|
66
|
+
transform: rotate(180deg);
|
|
58
67
|
}
|
|
59
68
|
|
|
60
69
|
/* 高度动画由 CollapsibleContent 内 Motion 驱动；此处只做布局（与 animate-ui Base 面板思路一致） */
|
package/dist/icon/svg-data.d.ts
CHANGED
|
@@ -4270,6 +4270,14 @@ export declare const svgData: {
|
|
|
4270
4270
|
readonly viewBox: "0 0 24 24";
|
|
4271
4271
|
readonly content: "<g fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 9a2.4 2.4 0 0 0-.706-1.706l-3.588-3.588A2.4 2.4 0 0 0 15 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2z\"></path><path d=\"M15 3v5a1 1 0 0 0 1 1h5\"></path></g>";
|
|
4272
4272
|
};
|
|
4273
|
+
readonly store: {
|
|
4274
|
+
readonly viewBox: "0 0 24 24";
|
|
4275
|
+
readonly content: "<g fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M15 21v-5a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v5\"></path><path d=\"M17.774 10.31a1.12 1.12 0 0 0-1.549 0 2.5 2.5 0 0 1-3.451 0 1.12 1.12 0 0 0-1.548 0 2.5 2.5 0 0 1-3.452 0 1.12 1.12 0 0 0-1.549 0 2.5 2.5 0 0 1-3.77-3.248l2.889-4.184A2 2 0 0 1 7 2h10a2 2 0 0 1 1.653.873l2.895 4.192a2.5 2.5 0 0 1-3.774 3.244\"></path><path d=\"M4 10.95V19a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8.05\"></path></g>";
|
|
4276
|
+
};
|
|
4277
|
+
readonly 'shopping-bag': {
|
|
4278
|
+
readonly viewBox: "0 0 24 24";
|
|
4279
|
+
readonly content: "<g fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 10a4 4 0 0 1-8 0\"></path><path d=\"M3.103 6.034h17.794\"></path><path d=\"M3.4 5.467a2 2 0 0 0-.4 1.2V20a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6.667a2 2 0 0 0-.4-1.2l-2-2.667A2 2 0 0 0 17 2H7a2 2 0 0 0-1.6.8z\"></path></g>";
|
|
4280
|
+
};
|
|
4273
4281
|
readonly vote: {
|
|
4274
4282
|
readonly viewBox: "0 0 24 24";
|
|
4275
4283
|
readonly content: "<g fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m9 12 2 2 4-4\"></path><path d=\"M5 7c0-1.1.9-2 2-2h10a2 2 0 0 1 2 2v12H5V7Z\"></path><path d=\"M22 19H2\"></path></g>";
|