@rainbow-oh/yee-c 0.3.0 → 0.4.1
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/cjs/Anchor/anchor.js +29 -14
- package/dist/cjs/Form/demo/basic.js +56 -81
- package/dist/cjs/Form/demo/form-table.js +68 -67
- package/dist/cjs/Menu/style/index.less +2 -0
- package/dist/cjs/Segmented/demo/variant.d.ts +3 -0
- package/dist/cjs/Segmented/demo/variant.js +50 -0
- package/dist/cjs/Segmented/interface.d.ts +5 -0
- package/dist/cjs/Segmented/segmented.js +3 -0
- package/dist/cjs/Segmented/style/index.less +24 -0
- package/dist/cjs/Tag/demo/variant.d.ts +3 -0
- package/dist/cjs/Tag/demo/variant.js +39 -0
- package/dist/cjs/Tag/interface.d.ts +5 -0
- package/dist/cjs/Tag/style/index.less +108 -25
- package/dist/cjs/Tag/tag.js +3 -0
- package/dist/cjs/style/color.css +3 -3
- package/dist/cjs/style/themes.css +1 -1
- package/dist/cjs/style/variables.css +4 -4
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Anchor/anchor.js +37 -15
- package/dist/esm/Form/demo/basic.js +2 -18
- package/dist/esm/Form/demo/form-table.js +4 -10
- package/dist/esm/Menu/style/index.less +2 -0
- package/dist/esm/Segmented/demo/variant.d.ts +3 -0
- package/dist/esm/Segmented/demo/variant.js +49 -0
- package/dist/esm/Segmented/interface.d.ts +5 -0
- package/dist/esm/Segmented/segmented.js +4 -2
- package/dist/esm/Segmented/style/index.less +24 -0
- package/dist/esm/Tag/demo/variant.d.ts +3 -0
- package/dist/esm/Tag/demo/variant.js +48 -0
- package/dist/esm/Tag/interface.d.ts +5 -0
- package/dist/esm/Tag/style/index.less +108 -25
- package/dist/esm/Tag/tag.js +4 -2
- package/dist/esm/style/color.css +3 -3
- package/dist/esm/style/themes.css +1 -1
- package/dist/esm/style/variables.css +4 -4
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/yee-c.min.css +2 -2
- package/dist/umd/yee-c.min.js +1 -1
- package/package.json +1 -1
- package/src/Anchor/anchor.tsx +35 -16
- package/src/Form/demo/basic.tsx +2 -24
- package/src/Form/demo/form-table.tsx +16 -13
- package/src/Menu/style/index.less +2 -0
- package/src/Segmented/demo/variant.tsx +28 -0
- package/src/Segmented/index.en-US.md +2 -0
- package/src/Segmented/index.zh-CN.md +2 -0
- package/src/Segmented/interface.ts +5 -0
- package/src/Segmented/segmented.tsx +2 -0
- package/src/Segmented/style/index.less +24 -0
- package/src/Tag/demo/variant.tsx +47 -0
- package/src/Tag/index.en-US.md +2 -0
- package/src/Tag/index.zh-CN.md +2 -0
- package/src/Tag/interface.ts +5 -0
- package/src/Tag/style/index.less +108 -25
- package/src/Tag/tag.tsx +2 -0
- package/src/style/color.css +3 -3
- package/src/version.ts +1 -1
|
@@ -8,45 +8,128 @@
|
|
|
8
8
|
white-space: nowrap;
|
|
9
9
|
height: var(--yee-tag-height);
|
|
10
10
|
padding: var(--yee-tag-padding);
|
|
11
|
-
color: var(--yee-tag-color);
|
|
12
11
|
font-size: var(--yee-tag-font-size);
|
|
13
12
|
line-height: var(--yee-tag-line-height);
|
|
14
|
-
background-color: var(--yee-tag-item-bg-color);
|
|
15
13
|
background-clip: padding-box;
|
|
16
14
|
border: var(--yee-tag-border-width) solid var(--yee-tag-border-color);
|
|
17
15
|
border-radius: var(--yee-tag-border-radius);
|
|
18
16
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
// ============ 变体 variant ============
|
|
18
|
+
// filled：浅色底 + 彩色字（默认）
|
|
19
|
+
&-filled {
|
|
20
|
+
color: var(--yee-tag-color);
|
|
21
|
+
background-color: var(--yee-tag-item-bg-color);
|
|
22
|
+
border-color: var(--yee-tag-border-color);
|
|
24
23
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
24
|
+
&@{pls}-info {
|
|
25
|
+
color: var(--yee-tag-info-color);
|
|
26
|
+
background-color: var(--yee-tag-info-bg-color);
|
|
27
|
+
border-color: var(--yee-tag-info-border-color);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
&@{pls}-success {
|
|
31
|
+
color: var(--yee-tag-success-color);
|
|
32
|
+
background-color: var(--yee-tag-success-bg-color);
|
|
33
|
+
border-color: var(--yee-tag-success-border-color);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
&@{pls}-warning {
|
|
37
|
+
color: var(--yee-tag-warning-color);
|
|
38
|
+
background-color: var(--yee-tag-warning-bg-color);
|
|
39
|
+
border-color: var(--yee-tag-warning-border-color);
|
|
40
|
+
}
|
|
30
41
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
42
|
+
&@{pls}-error {
|
|
43
|
+
color: var(--yee-tag-error-color);
|
|
44
|
+
background-color: var(--yee-tag-error-bg-color);
|
|
45
|
+
border-color: var(--yee-tag-error-border-color);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
&@{pls}-disabled {
|
|
49
|
+
color: var(--yee-tag-disabled-color);
|
|
50
|
+
background-color: var(--yee-tag-disabled-bg-color);
|
|
51
|
+
border-color: var(--yee-tag-disabled-border-color);
|
|
52
|
+
cursor: not-allowed;
|
|
53
|
+
}
|
|
35
54
|
}
|
|
36
55
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
56
|
+
// solid：纯色底 + 白字
|
|
57
|
+
&-solid {
|
|
58
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
59
|
+
background-color: var(--yee-tag-color);
|
|
60
|
+
border-color: transparent;
|
|
61
|
+
|
|
62
|
+
&@{pls}-info {
|
|
63
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
64
|
+
background-color: var(--yee-tag-info-color);
|
|
65
|
+
border-color: transparent;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
&@{pls}-success {
|
|
69
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
70
|
+
background-color: var(--yee-tag-success-color);
|
|
71
|
+
border-color: transparent;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
&@{pls}-warning {
|
|
75
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
76
|
+
background-color: var(--yee-tag-warning-color);
|
|
77
|
+
border-color: transparent;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
&@{pls}-error {
|
|
81
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
82
|
+
background-color: var(--yee-tag-error-color);
|
|
83
|
+
border-color: transparent;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
&@{pls}-disabled {
|
|
87
|
+
color: var(--yee-tag-solid-color, #fff);
|
|
88
|
+
background-color: var(--yee-tag-disabled-color);
|
|
89
|
+
border-color: transparent;
|
|
90
|
+
cursor: not-allowed;
|
|
91
|
+
}
|
|
41
92
|
}
|
|
42
93
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
94
|
+
// outlined：透明底 + 彩色字 + 彩色描边
|
|
95
|
+
&-outlined {
|
|
96
|
+
color: var(--yee-tag-color);
|
|
97
|
+
background-color: transparent;
|
|
98
|
+
border-color: var(--yee-tag-border-color);
|
|
99
|
+
|
|
100
|
+
&@{pls}-info {
|
|
101
|
+
color: var(--yee-tag-info-color);
|
|
102
|
+
background-color: transparent;
|
|
103
|
+
border-color: var(--yee-tag-info-color);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
&@{pls}-success {
|
|
107
|
+
color: var(--yee-tag-success-color);
|
|
108
|
+
background-color: transparent;
|
|
109
|
+
border-color: var(--yee-tag-success-color);
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
&@{pls}-warning {
|
|
113
|
+
color: var(--yee-tag-warning-color);
|
|
114
|
+
background-color: transparent;
|
|
115
|
+
border-color: var(--yee-tag-warning-color);
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
&@{pls}-error {
|
|
119
|
+
color: var(--yee-tag-error-color);
|
|
120
|
+
background-color: transparent;
|
|
121
|
+
border-color: var(--yee-tag-error-color);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
&@{pls}-disabled {
|
|
125
|
+
color: var(--yee-tag-disabled-color);
|
|
126
|
+
background-color: transparent;
|
|
127
|
+
border-color: var(--yee-tag-disabled-color);
|
|
128
|
+
cursor: not-allowed;
|
|
129
|
+
}
|
|
48
130
|
}
|
|
49
131
|
|
|
132
|
+
// ============ 其他修饰 ============
|
|
50
133
|
&-dashed {
|
|
51
134
|
background-color: var(--yee-tag-item-dashed-bg-color);
|
|
52
135
|
border-style: dashed;
|
package/dist/esm/Tag/tag.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
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
|
-
var _excluded = ["prefixCls", "closable", "status", "dashed", "children", "size", "checked", "checkable", "className", "icon", "classNames", "styles", "onClose", "onChange"];
|
|
2
|
+
var _excluded = ["prefixCls", "closable", "status", "dashed", "children", "size", "checked", "checkable", "className", "icon", "classNames", "styles", "variant", "onClose", "onChange"];
|
|
3
3
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
4
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
5
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
@@ -30,6 +30,8 @@ var Tag = /*#__PURE__*/forwardRef(function (baseprops, ref) {
|
|
|
30
30
|
icon = props.icon,
|
|
31
31
|
classNames = props.classNames,
|
|
32
32
|
styles = props.styles,
|
|
33
|
+
_props$variant = props.variant,
|
|
34
|
+
variant = _props$variant === void 0 ? 'filled' : _props$variant,
|
|
33
35
|
onClose = props.onClose,
|
|
34
36
|
onChange = props.onChange,
|
|
35
37
|
rest = _objectWithoutProperties(props, _excluded);
|
|
@@ -38,7 +40,7 @@ var Tag = /*#__PURE__*/forwardRef(function (baseprops, ref) {
|
|
|
38
40
|
onChange === null || onChange === void 0 || onChange(!checked);
|
|
39
41
|
}
|
|
40
42
|
};
|
|
41
|
-
var cls = clsx(prefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(status), status), "".concat(prefixCls, "-dashed"), dashed), "".concat(prefixCls, "-checked"), checked), "".concat(prefixCls, "-").concat(size), size), "".concat(prefixCls, "-checkable"), checkable), className);
|
|
43
|
+
var cls = clsx(prefixCls, ["".concat(prefixCls, "-").concat(variant)], _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(status), status), "".concat(prefixCls, "-dashed"), dashed), "".concat(prefixCls, "-checked"), checked), "".concat(prefixCls, "-").concat(size), size), "".concat(prefixCls, "-checkable"), checkable), className);
|
|
42
44
|
var renderClose = function renderClose() {
|
|
43
45
|
return closable ? /*#__PURE__*/React.createElement(Button, {
|
|
44
46
|
className: clsx("".concat(prefixCls, "-close"), classNames === null || classNames === void 0 ? void 0 : classNames.close),
|
package/dist/esm/style/color.css
CHANGED
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
|
|
58
58
|
/* --global-- */
|
|
59
59
|
--yee-global-font-color: var(--yee-text-color);
|
|
60
|
-
--yee-placeholder-color: var(--yee-text-color-
|
|
60
|
+
--yee-placeholder-color: var(--yee-text-color-secondary);
|
|
61
61
|
--yee-title-prefix-bg-color: var(--yee-primary-color);
|
|
62
62
|
--yee-remove-icon: var(--yee-text-color-auxiliary);
|
|
63
63
|
--yee-remove-icon-hover: var(--yee-text-color-auxiliary);
|
|
@@ -264,8 +264,8 @@
|
|
|
264
264
|
--yee-menu-item-hover-color: var(--yee-color-option-hover);
|
|
265
265
|
--yee-menu-item-selected-color: var(--yee-color-option-active);
|
|
266
266
|
--yee-menu-item-selected-bg-color: var(--yee-color-option-active-bg);
|
|
267
|
-
--yee-menu-item-arrow-color: var(--yee-text-color
|
|
268
|
-
--yee-menu-item-arrow-hover-color: var(--yee-text-color-
|
|
267
|
+
--yee-menu-item-arrow-color: var(--yee-text-color);
|
|
268
|
+
--yee-menu-item-arrow-hover-color: var(--yee-text-color-secondary);
|
|
269
269
|
--yee-menu-item-arrow-selected-color: var(--yee-primary-color);
|
|
270
270
|
--yee-menu-item-bg-color: #fff;
|
|
271
271
|
--yee-menu-item-title-bg-color: #f0f0f0;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* @rainbow-oh/yee-c CSS Variables
|
|
3
3
|
* Auto-generated, do not edit manually
|
|
4
|
-
* Generated on 2026-06-
|
|
4
|
+
* Generated on 2026-06-30T03:06:46.452Z
|
|
5
5
|
*/
|
|
6
6
|
|
|
7
7
|
/* ========== color.css ========== */
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
|
|
65
65
|
/* --global-- */
|
|
66
66
|
--yee-global-font-color: var(--yee-text-color);
|
|
67
|
-
--yee-placeholder-color: var(--yee-text-color-
|
|
67
|
+
--yee-placeholder-color: var(--yee-text-color-secondary);
|
|
68
68
|
--yee-title-prefix-bg-color: var(--yee-primary-color);
|
|
69
69
|
--yee-remove-icon: var(--yee-text-color-auxiliary);
|
|
70
70
|
--yee-remove-icon-hover: var(--yee-text-color-auxiliary);
|
|
@@ -271,8 +271,8 @@
|
|
|
271
271
|
--yee-menu-item-hover-color: var(--yee-color-option-hover);
|
|
272
272
|
--yee-menu-item-selected-color: var(--yee-color-option-active);
|
|
273
273
|
--yee-menu-item-selected-bg-color: var(--yee-color-option-active-bg);
|
|
274
|
-
--yee-menu-item-arrow-color: var(--yee-text-color
|
|
275
|
-
--yee-menu-item-arrow-hover-color: var(--yee-text-color-
|
|
274
|
+
--yee-menu-item-arrow-color: var(--yee-text-color);
|
|
275
|
+
--yee-menu-item-arrow-hover-color: var(--yee-text-color-secondary);
|
|
276
276
|
--yee-menu-item-arrow-selected-color: var(--yee-primary-color);
|
|
277
277
|
--yee-menu-item-bg-color: #fff;
|
|
278
278
|
--yee-menu-item-title-bg-color: #f0f0f0;
|
package/dist/esm/version.d.ts
CHANGED
package/dist/esm/version.js
CHANGED