@oceanbase/design 1.0.0-alpha.5 → 1.0.0-alpha.6
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/design.min.css +1 -1
- package/dist/design.min.js +1 -1
- package/dist/reset.css +2 -1
- package/es/alert/style/index.js +17 -19
- package/es/button/style/index.js +10 -2
- package/es/config-provider/index.d.ts +2 -1
- package/es/config-provider/index.js +41 -16
- package/es/form/FormItem.d.ts +1 -1
- package/es/index.d.ts +0 -1
- package/es/index.js +0 -1
- package/es/style/global.d.ts +5 -0
- package/es/style/global.js +62 -0
- package/es/style/reset.css +2 -1
- package/es/theme/compact.d.ts +1 -1
- package/es/theme/compact.js +2 -6
- package/es/theme/default.js +28 -9
- package/lib/alert/style/index.js +15 -16
- package/lib/button/style/index.js +8 -2
- package/lib/config-provider/index.d.ts +2 -1
- package/lib/config-provider/index.js +60 -12
- package/lib/form/FormItem.d.ts +1 -1
- package/lib/index.d.ts +0 -1
- package/lib/index.js +0 -1
- package/lib/style/global.d.ts +5 -0
- package/lib/style/global.js +101 -0
- package/lib/style/reset.css +2 -1
- package/lib/theme/compact.d.ts +1 -1
- package/lib/theme/compact.js +1 -5
- package/lib/theme/default.js +28 -9
- package/package.json +2 -2
- package/es/global.css +0 -48
- package/lib/global.css +0 -48
package/dist/reset.css
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
/* antd/dist/reset.css is imported in global.tsx */
|
|
2
|
+
/* reserve this file for compatibility with antd */
|
package/es/alert/style/index.js
CHANGED
|
@@ -2,6 +2,7 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
|
|
|
2
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
3
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
4
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 { unit } from '@ant-design/cssinjs';
|
|
5
6
|
import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
|
|
6
7
|
import { upperFirst } from 'lodash';
|
|
7
8
|
var genAlertTypeStyle = function genAlertTypeStyle(type, token) {
|
|
@@ -42,12 +43,23 @@ export var genAlertStyle = function genAlertStyle(token) {
|
|
|
42
43
|
var contentStartOffset = calc(iconWidth).add(token.marginXS).equal();
|
|
43
44
|
// close icon width (approximate)
|
|
44
45
|
var closeIconWidth = height;
|
|
45
|
-
|
|
46
|
+
// Common calculated values
|
|
47
|
+
var contentWidth = unit(calc(contentStartOffset).add(closeIconWidth).add(token.padding).equal());
|
|
48
|
+
var actionWidth = unit(calc(contentStartOffset).add(token.padding).equal());
|
|
49
|
+
return _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
|
|
46
50
|
// vertical align to flex-start
|
|
47
51
|
alignItems: 'flex-start !important',
|
|
48
52
|
paddingInline: token.padding,
|
|
49
53
|
position: 'relative'
|
|
50
|
-
}, "".concat(componentCls, "-
|
|
54
|
+
}, "".concat(componentCls, "-content"), {
|
|
55
|
+
flex: "1 1 calc(100% - ".concat(contentWidth, ")"),
|
|
56
|
+
minWidth: 0,
|
|
57
|
+
maxWidth: "calc(100% - ".concat(contentWidth, ")"),
|
|
58
|
+
wordBreak: 'break-word'
|
|
59
|
+
}), "".concat(componentCls, "-action"), {
|
|
60
|
+
width: "calc(100% - ".concat(actionWidth, ")"),
|
|
61
|
+
marginInlineStart: contentStartOffset
|
|
62
|
+
}), "".concat(componentCls, "-icon"), {
|
|
51
63
|
height: height,
|
|
52
64
|
fontSize: token.fontSizeLG,
|
|
53
65
|
marginInlineEnd: token.marginXS,
|
|
@@ -73,18 +85,11 @@ export var genAlertStyle = function genAlertStyle(token) {
|
|
|
73
85
|
a: {
|
|
74
86
|
textDecoration: 'underline'
|
|
75
87
|
}
|
|
76
|
-
}), "&".concat(componentCls, "-success"), genAlertTypeStyle('success', token)), "&".concat(componentCls, "-info"), genAlertTypeStyle('info', token)), "&".concat(componentCls, "-warning"), genAlertTypeStyle('warning', token)), "&".concat(componentCls, "-error"), genAlertTypeStyle('error', token))), "".concat(componentCls, ":not(").concat(componentCls, "-with-description)"), _defineProperty(
|
|
88
|
+
}), "&".concat(componentCls, "-success"), genAlertTypeStyle('success', token)), "&".concat(componentCls, "-info"), genAlertTypeStyle('info', token)), "&".concat(componentCls, "-warning"), genAlertTypeStyle('warning', token)), "&".concat(componentCls, "-error"), genAlertTypeStyle('error', token))), "".concat(componentCls, ":not(").concat(componentCls, "-with-description)"), _defineProperty({
|
|
77
89
|
flexWrap: 'wrap'
|
|
78
|
-
}, "".concat(componentCls, "-
|
|
79
|
-
flex: "1 1 ".concat(calc('100%').sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal()),
|
|
80
|
-
minWidth: 0,
|
|
81
|
-
maxWidth: calc('100%').sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal(),
|
|
82
|
-
wordBreak: 'break-word'
|
|
83
|
-
}), "".concat(componentCls, "-action"), {
|
|
84
|
-
width: calc('100%').sub(contentStartOffset).sub(token.padding).equal(),
|
|
85
|
-
marginInlineStart: contentStartOffset,
|
|
90
|
+
}, "".concat(componentCls, "-action"), {
|
|
86
91
|
marginTop: token.marginXS
|
|
87
|
-
})), "".concat(componentCls).concat(componentCls, "-with-description"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(
|
|
92
|
+
})), "".concat(componentCls).concat(componentCls, "-with-description"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({
|
|
88
93
|
paddingBlock: token.paddingSM,
|
|
89
94
|
flexWrap: 'wrap'
|
|
90
95
|
}, "".concat(componentCls, "-message"), {
|
|
@@ -94,14 +99,7 @@ export var genAlertStyle = function genAlertStyle(token) {
|
|
|
94
99
|
wordBreak: 'break-word'
|
|
95
100
|
}), "".concat(componentCls, "-description"), {
|
|
96
101
|
wordBreak: 'break-word'
|
|
97
|
-
}), "".concat(componentCls, "-content"), {
|
|
98
|
-
flex: "1 1 ".concat(calc('100%').sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal()),
|
|
99
|
-
minWidth: 0,
|
|
100
|
-
maxWidth: calc('100%').sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal(),
|
|
101
|
-
wordBreak: 'break-word'
|
|
102
102
|
}), "".concat(componentCls, "-action"), {
|
|
103
|
-
width: calc('100%').sub(contentStartOffset).sub(token.padding).equal(),
|
|
104
|
-
marginInlineStart: contentStartOffset,
|
|
105
103
|
marginTop: token.marginSM
|
|
106
104
|
}), "".concat(componentCls, "-close-icon"), {
|
|
107
105
|
top: token.paddingSM
|
package/es/button/style/index.js
CHANGED
|
@@ -1,10 +1,18 @@
|
|
|
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); }
|
|
1
5
|
import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
|
|
2
6
|
export var genButtonStyle = function genButtonStyle(token) {
|
|
3
|
-
|
|
7
|
+
var componentCls = token.componentCls;
|
|
8
|
+
return _defineProperty({}, "".concat(componentCls), {
|
|
9
|
+
// remove box-shadow for button
|
|
10
|
+
boxShadow: 'none !important'
|
|
11
|
+
});
|
|
4
12
|
};
|
|
5
13
|
export default (function (prefixCls, isAliyun) {
|
|
6
14
|
var useStyle = genComponentStyleHook('Button', function (token) {
|
|
7
|
-
return
|
|
15
|
+
return [genButtonStyle(token)];
|
|
8
16
|
});
|
|
9
17
|
return useStyle(prefixCls);
|
|
10
18
|
});
|
|
@@ -14,8 +14,9 @@ export * from 'antd/es/config-provider/SizeContext';
|
|
|
14
14
|
export * from 'antd/es/config-provider/DisabledContext';
|
|
15
15
|
export * from 'antd/es/config-provider';
|
|
16
16
|
export interface ThemeConfig extends AntThemeConfig {
|
|
17
|
-
isDark?: boolean;
|
|
18
17
|
isAliyun?: boolean;
|
|
18
|
+
isDark?: boolean;
|
|
19
|
+
isCompact?: boolean;
|
|
19
20
|
}
|
|
20
21
|
export type CardConfig = AntCardConfig & {
|
|
21
22
|
divided?: boolean;
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
var _excluded = ["children", "theme", "locale", "navigate", "hideOnSinglePage", "card", "collapse", "form", "spin", "table", "tabs", "styleProviderProps", "appProps"];
|
|
2
2
|
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); }
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
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."); }
|
|
5
|
+
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); }
|
|
6
|
+
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; }
|
|
7
|
+
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; } }
|
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
3
9
|
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; }
|
|
4
10
|
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; }
|
|
5
11
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
@@ -19,7 +25,9 @@ import StaticFunction from "../static-function";
|
|
|
19
25
|
import themeConfig from "../theme";
|
|
20
26
|
import defaultTheme, { fontFamilyEn, fontWeightEn, fontWeightStrongEn } from "../theme/default";
|
|
21
27
|
import darkTheme from "../theme/dark";
|
|
28
|
+
import compactTheme from "../theme/compact";
|
|
22
29
|
import DefaultRenderEmpty from "./DefaultRenderEmpty";
|
|
30
|
+
import GlobalStyle from "../style/global";
|
|
23
31
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
24
32
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
25
33
|
export * from "./navigate";
|
|
@@ -32,8 +40,8 @@ var ExtendedConfigContext = /*#__PURE__*/React.createContext({
|
|
|
32
40
|
hideOnSinglePage: false,
|
|
33
41
|
injectStaticFunction: true
|
|
34
42
|
});
|
|
35
|
-
var getLocaleTokenValue = function getLocaleTokenValue(locale, tokenKey, tokenValue, tokenValueEn) {
|
|
36
|
-
return tokenValue !==
|
|
43
|
+
var getLocaleTokenValue = function getLocaleTokenValue(mergedThemeToken, locale, tokenKey, tokenValue, tokenValueEn) {
|
|
44
|
+
return tokenValue !== mergedThemeToken[tokenKey] ? _defineProperty({}, tokenKey, tokenValue) : ['en', 'en-gb'].includes(locale.locale) ? _defineProperty({}, tokenKey, tokenValueEn) : {};
|
|
37
45
|
};
|
|
38
46
|
var ConfigProvider = function ConfigProvider(_ref3) {
|
|
39
47
|
var _mergedTheme$token, _mergedTheme$token2, _mergedTheme$token3, _parentContext$pagina;
|
|
@@ -55,10 +63,27 @@ var ConfigProvider = function ConfigProvider(_ref3) {
|
|
|
55
63
|
var parentContext = React.useContext(AntConfigProvider.ConfigContext);
|
|
56
64
|
var parentExtendedContext = React.useContext(ExtendedConfigContext);
|
|
57
65
|
var _merge = merge({}, parentContext.theme, theme),
|
|
66
|
+
isAliyun = _merge.isAliyun,
|
|
58
67
|
isDark = _merge.isDark,
|
|
59
|
-
|
|
60
|
-
var
|
|
61
|
-
var
|
|
68
|
+
isCompact = _merge.isCompact;
|
|
69
|
+
var aliyunThemeConfig = isAliyun ? aliyunTheme : undefined;
|
|
70
|
+
var darkThemeConfig = isDark && !isAliyun ? isCompact ? darkTheme : _objectSpread(_objectSpread({}, darkTheme), {}, {
|
|
71
|
+
token: _objectSpread(_objectSpread({}, darkTheme.token), Object.fromEntries(Object.entries(defaultTheme.token).filter(function (_ref4) {
|
|
72
|
+
var _key$toLowerCase;
|
|
73
|
+
var _ref5 = _slicedToArray(_ref4, 1),
|
|
74
|
+
key = _ref5[0];
|
|
75
|
+
return !(key !== null && key !== void 0 && (_key$toLowerCase = key.toLowerCase()) !== null && _key$toLowerCase !== void 0 && _key$toLowerCase.startsWith('color'));
|
|
76
|
+
})))
|
|
77
|
+
}) : undefined;
|
|
78
|
+
var compactThemeConfig = isCompact && !isAliyun ? isDark ? compactTheme : _objectSpread(_objectSpread({}, compactTheme), {}, {
|
|
79
|
+
token: _objectSpread(_objectSpread({}, compactTheme.token), Object.fromEntries(Object.entries(defaultTheme.token).filter(function (_ref6) {
|
|
80
|
+
var _key$toLowerCase2;
|
|
81
|
+
var _ref7 = _slicedToArray(_ref6, 1),
|
|
82
|
+
key = _ref7[0];
|
|
83
|
+
return (key === null || key === void 0 || (_key$toLowerCase2 = key.toLowerCase()) === null || _key$toLowerCase2 === void 0 ? void 0 : _key$toLowerCase2.startsWith('color')) && !['colorBgBase', 'colorTextBase'].includes(key);
|
|
84
|
+
})))
|
|
85
|
+
}) : undefined;
|
|
86
|
+
var mergedTheme = merge({}, isAliyun ? {} : isDark || isCompact ? themeConfig.defaultSeed : defaultTheme, parentContext.theme, aliyunThemeConfig, darkThemeConfig, compactThemeConfig, theme);
|
|
62
87
|
var _themeConfig$useToken = themeConfig.useToken(),
|
|
63
88
|
token = _themeConfig$useToken.token;
|
|
64
89
|
var fontFamily = ((_mergedTheme$token = mergedTheme.token) === null || _mergedTheme$token === void 0 ? void 0 : _mergedTheme$token.fontFamily) || token.fontFamily;
|
|
@@ -74,9 +99,9 @@ var ConfigProvider = function ConfigProvider(_ref3) {
|
|
|
74
99
|
locale: mergedLocale,
|
|
75
100
|
card: merge({}, parentContext.card, card),
|
|
76
101
|
collapse: merge({}, {
|
|
77
|
-
expandIcon: function expandIcon(
|
|
102
|
+
expandIcon: function expandIcon(_ref8) {
|
|
78
103
|
var _mergedTheme$token4, _mergedTheme$token5;
|
|
79
|
-
var isActive =
|
|
104
|
+
var isActive = _ref8.isActive;
|
|
80
105
|
return /*#__PURE__*/_jsx(CaretRightOutlined, {
|
|
81
106
|
rotate: isActive ? 90 : 0,
|
|
82
107
|
style: {
|
|
@@ -91,12 +116,12 @@ var ConfigProvider = function ConfigProvider(_ref3) {
|
|
|
91
116
|
spin: merge({}, parentContext.spin, spin),
|
|
92
117
|
table: merge({}, {
|
|
93
118
|
expandable: {
|
|
94
|
-
expandIcon: function expandIcon(
|
|
119
|
+
expandIcon: function expandIcon(_ref9) {
|
|
95
120
|
var _mergedTheme$token6, _mergedTheme$token7;
|
|
96
|
-
var expandable =
|
|
97
|
-
expanded =
|
|
98
|
-
onExpand =
|
|
99
|
-
record =
|
|
121
|
+
var expandable = _ref9.expandable,
|
|
122
|
+
expanded = _ref9.expanded,
|
|
123
|
+
onExpand = _ref9.onExpand,
|
|
124
|
+
record = _ref9.record;
|
|
100
125
|
return expandable && /*#__PURE__*/_jsx(CaretRightOutlined, {
|
|
101
126
|
onClick: function onClick(e) {
|
|
102
127
|
return onExpand(record, e);
|
|
@@ -112,7 +137,7 @@ var ConfigProvider = function ConfigProvider(_ref3) {
|
|
|
112
137
|
}, parentContext.table, table),
|
|
113
138
|
tabs: merge({}, parentContext.tabs, tabs),
|
|
114
139
|
theme: merge({}, mergedTheme, {
|
|
115
|
-
token: _objectSpread(_objectSpread(_objectSpread({}, getLocaleTokenValue(mergedLocale, 'fontFamily', fontFamily, fontFamilyEn)), getLocaleTokenValue(mergedLocale, 'fontWeight', fontWeight, fontWeightEn)), getLocaleTokenValue(mergedLocale, 'fontWeightStrong', fontWeightStrong, fontWeightStrongEn))
|
|
140
|
+
token: _objectSpread(_objectSpread(_objectSpread({}, getLocaleTokenValue(mergedTheme.token || {}, mergedLocale, 'fontFamily', fontFamily, fontFamilyEn)), getLocaleTokenValue(mergedTheme.token || {}, mergedLocale, 'fontWeight', fontWeight, fontWeightEn)), getLocaleTokenValue(mergedTheme.token || {}, mergedLocale, 'fontWeightStrong', fontWeightStrong, fontWeightStrongEn))
|
|
116
141
|
}),
|
|
117
142
|
renderEmpty: parentContext.renderEmpty || function (componentName) {
|
|
118
143
|
return /*#__PURE__*/_jsx(DefaultRenderEmpty, {
|
|
@@ -127,12 +152,12 @@ var ConfigProvider = function ConfigProvider(_ref3) {
|
|
|
127
152
|
// inject static function to outermost ConfigProvider only
|
|
128
153
|
injectStaticFunction: false
|
|
129
154
|
},
|
|
130
|
-
children: /*#__PURE__*/
|
|
131
|
-
children: /*#__PURE__*/_jsxs(App, _objectSpread(_objectSpread({
|
|
155
|
+
children: /*#__PURE__*/_jsxs(StyleProvider, _objectSpread(_objectSpread({}, mergedStyleProviderProps), {}, {
|
|
156
|
+
children: [/*#__PURE__*/_jsx(GlobalStyle, {}), /*#__PURE__*/_jsxs(App, _objectSpread(_objectSpread({
|
|
132
157
|
component: false
|
|
133
158
|
}, appProps), {}, {
|
|
134
159
|
children: [children, parentExtendedContext.injectStaticFunction && /*#__PURE__*/_jsx(StaticFunction, {})]
|
|
135
|
-
}))
|
|
160
|
+
}))]
|
|
136
161
|
}))
|
|
137
162
|
})
|
|
138
163
|
}));
|
package/es/form/FormItem.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ import type { FormItemProps as AntFormItemProps } from 'antd/es/form';
|
|
|
4
4
|
import type { TooltipProps } from '../tooltip';
|
|
5
5
|
declare const AntFormItem: (<Values = any>(props: AntFormItemProps<Values>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
|
|
6
6
|
useStatus: () => {
|
|
7
|
-
status?: "" | "
|
|
7
|
+
status?: "" | "warning" | "error" | "success" | "validating";
|
|
8
8
|
errors: React.ReactNode[];
|
|
9
9
|
warnings: React.ReactNode[];
|
|
10
10
|
};
|
package/es/index.d.ts
CHANGED
package/es/index.js
CHANGED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useStyleRegister } from '@ant-design/cssinjs';
|
|
3
|
+
import themeConfig from "../theme";
|
|
4
|
+
import interFont from "../fonts/Inter.woff2";
|
|
5
|
+
import consolasFont from "../fonts/Consolas.woff2";
|
|
6
|
+
import helveticaNeueFont from "../fonts/HelveticaNeue.woff2";
|
|
7
|
+
import 'antd/dist/reset.css';
|
|
8
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
var genGlobalStyle = function genGlobalStyle(token) {
|
|
11
|
+
return [
|
|
12
|
+
// Priority: local font > self-hosting font > remote font
|
|
13
|
+
{
|
|
14
|
+
'@font-face': {
|
|
15
|
+
fontFamily: "'Inter'",
|
|
16
|
+
src: "local('Inter'), url(".concat(interFont, ") format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*2aG4RJIdUGYAAAAAAAAAAAAADmfOAQ/Inter.woff2') format('woff2')"),
|
|
17
|
+
fontDisplay: 'swap'
|
|
18
|
+
}
|
|
19
|
+
}, {
|
|
20
|
+
'@font-face': {
|
|
21
|
+
fontFamily: "'Consolas'",
|
|
22
|
+
src: "local('Consolas'), url(".concat(consolasFont, ") format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*R8bMTqAdGWgAAAAAAAAAAAAADmfOAQ/Consolas.woff2') format('woff2')"),
|
|
23
|
+
fontDisplay: 'swap'
|
|
24
|
+
}
|
|
25
|
+
}, {
|
|
26
|
+
'@font-face': {
|
|
27
|
+
fontFamily: "'Helvetica Neue'",
|
|
28
|
+
src: "local('Helvetica Neue'), url(".concat(helveticaNeueFont, ") format('woff2'), url('https://mdn.alipayobjects.com/huamei_fhnyvh/afts/file/A*3EzqR6aYJMkAAAAAAAAAAAAADmfOAQ/HelveticaNeue.woff2') format('woff2')"),
|
|
29
|
+
fontDisplay: 'swap'
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
// Global element styles
|
|
33
|
+
{
|
|
34
|
+
'pre, code, kbd, samp': {
|
|
35
|
+
fontFamily: token.fontFamilyCode
|
|
36
|
+
},
|
|
37
|
+
'*': {
|
|
38
|
+
scrollbarColor: "".concat(token.colorFillSecondary, " transparent")
|
|
39
|
+
},
|
|
40
|
+
'.rc-virtual-list-scrollbar-thumb': {
|
|
41
|
+
background: "".concat(token.colorFillSecondary, " !important")
|
|
42
|
+
}
|
|
43
|
+
}];
|
|
44
|
+
};
|
|
45
|
+
var GlobalStyle = function GlobalStyle() {
|
|
46
|
+
var _themeConfig$useToken = themeConfig.useToken(),
|
|
47
|
+
theme = _themeConfig$useToken.theme,
|
|
48
|
+
token = _themeConfig$useToken.token;
|
|
49
|
+
var wrapSSR = useStyleRegister({
|
|
50
|
+
theme: theme,
|
|
51
|
+
token: token,
|
|
52
|
+
path: ['global'],
|
|
53
|
+
hashId: '',
|
|
54
|
+
// Empty hashId for global styles
|
|
55
|
+
order: -1000 // Inject before other styles
|
|
56
|
+
}, function () {
|
|
57
|
+
return genGlobalStyle(token);
|
|
58
|
+
});
|
|
59
|
+
return wrapSSR( /*#__PURE__*/_jsx(_Fragment, {}));
|
|
60
|
+
};
|
|
61
|
+
export { GlobalStyle };
|
|
62
|
+
export default GlobalStyle;
|
package/es/style/reset.css
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
/* antd/dist/reset.css is imported in global.tsx */
|
|
2
|
+
/* reserve this file for compatibility with antd */
|
package/es/theme/compact.d.ts
CHANGED
package/es/theme/compact.js
CHANGED
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
import themeConfig from "./index";
|
|
1
|
+
import theme from "./index";
|
|
3
2
|
var compactTheme = {
|
|
4
|
-
token: theme.
|
|
5
|
-
algorithm: theme.compactAlgorithm,
|
|
6
|
-
token: themeConfig.defaultSeed
|
|
7
|
-
}),
|
|
3
|
+
token: theme.defaultSeed,
|
|
8
4
|
components: {
|
|
9
5
|
InputNumber: {
|
|
10
6
|
handleVisible: true
|
package/es/theme/default.js
CHANGED
|
@@ -19,6 +19,9 @@ var colorFillQuaternary = '#F5F7FC';
|
|
|
19
19
|
var colorBorderSecondary = colorFillSecondary;
|
|
20
20
|
var fontSizeSM = 12;
|
|
21
21
|
var tagColorBorder = colorTextQuaternary;
|
|
22
|
+
var borderRadius = 4;
|
|
23
|
+
var borderRadiusMD = 6;
|
|
24
|
+
var borderRadiusLG = 8;
|
|
22
25
|
export var fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'";
|
|
23
26
|
export var fontWeightWeakEn = 400;
|
|
24
27
|
export var fontWeightEn = 500;
|
|
@@ -31,9 +34,9 @@ var defaultTheme = {
|
|
|
31
34
|
fontWeight: 400,
|
|
32
35
|
fontWeightStrong: 500,
|
|
33
36
|
borderRadiusSM: 2,
|
|
34
|
-
borderRadius:
|
|
35
|
-
borderRadiusMD:
|
|
36
|
-
borderRadiusLG:
|
|
37
|
+
borderRadius: borderRadius,
|
|
38
|
+
borderRadiusMD: borderRadiusMD,
|
|
39
|
+
borderRadiusLG: borderRadiusLG,
|
|
37
40
|
fontSizeSM: fontSizeSM,
|
|
38
41
|
fontSize: 13,
|
|
39
42
|
lineHeight: 20 / 13,
|
|
@@ -97,7 +100,7 @@ var defaultTheme = {
|
|
|
97
100
|
},
|
|
98
101
|
components: {
|
|
99
102
|
Alert: {
|
|
100
|
-
borderRadiusLG:
|
|
103
|
+
borderRadiusLG: borderRadiusMD
|
|
101
104
|
},
|
|
102
105
|
Badge: {
|
|
103
106
|
statusSize: 8
|
|
@@ -118,16 +121,29 @@ var defaultTheme = {
|
|
|
118
121
|
},
|
|
119
122
|
Card: {
|
|
120
123
|
headerFontSize: 16,
|
|
121
|
-
borderRadiusLG:
|
|
124
|
+
borderRadiusLG: borderRadiusLG
|
|
122
125
|
},
|
|
123
126
|
Collapse: {
|
|
124
127
|
colorBorder: colorBorderSecondary
|
|
125
128
|
},
|
|
129
|
+
DatePicker: {
|
|
130
|
+
borderRadiusLG: borderRadiusMD
|
|
131
|
+
},
|
|
126
132
|
Descriptions: {
|
|
127
133
|
labelColor: colorTextSecondary
|
|
128
134
|
},
|
|
135
|
+
Dropdown: {
|
|
136
|
+
borderRadiusLG: borderRadiusMD
|
|
137
|
+
},
|
|
138
|
+
Input: {
|
|
139
|
+
borderRadiusLG: borderRadiusMD
|
|
140
|
+
},
|
|
129
141
|
InputNumber: {
|
|
130
|
-
handleVisible: true
|
|
142
|
+
handleVisible: true,
|
|
143
|
+
borderRadiusLG: borderRadiusMD
|
|
144
|
+
},
|
|
145
|
+
Popover: {
|
|
146
|
+
borderRadiusLG: borderRadiusMD
|
|
131
147
|
},
|
|
132
148
|
Progress: {
|
|
133
149
|
defaultColor: colorPrimarySecondary
|
|
@@ -141,6 +157,7 @@ var defaultTheme = {
|
|
|
141
157
|
},
|
|
142
158
|
Select: {
|
|
143
159
|
// work for all multiple select component, including Select, TreeSelect and Cascader and so on
|
|
160
|
+
borderRadiusLG: borderRadiusMD,
|
|
144
161
|
multipleItemBg: colorFillQuaternary,
|
|
145
162
|
multipleItemBorderColor: tagColorBorder,
|
|
146
163
|
multipleItemBorderColorDisabled: tagColorBorder
|
|
@@ -154,7 +171,7 @@ var defaultTheme = {
|
|
|
154
171
|
handleColorDisabled: '#b3ccff'
|
|
155
172
|
},
|
|
156
173
|
Skeleton: {
|
|
157
|
-
blockRadius:
|
|
174
|
+
blockRadius: borderRadius
|
|
158
175
|
},
|
|
159
176
|
Tabs: {
|
|
160
177
|
horizontalItemGutter: 24,
|
|
@@ -164,7 +181,7 @@ var defaultTheme = {
|
|
|
164
181
|
},
|
|
165
182
|
Tag: {
|
|
166
183
|
colorBorder: tagColorBorder,
|
|
167
|
-
borderRadiusSM:
|
|
184
|
+
borderRadiusSM: borderRadius
|
|
168
185
|
},
|
|
169
186
|
Table: {
|
|
170
187
|
cellFontSize: fontSizeSM,
|
|
@@ -178,13 +195,15 @@ var defaultTheme = {
|
|
|
178
195
|
rowSelectedHoverBg: colorFillTertiary
|
|
179
196
|
},
|
|
180
197
|
Tooltip: {
|
|
198
|
+
borderRadius: borderRadiusMD,
|
|
181
199
|
colorBgSpotlight: '#ffffff',
|
|
182
200
|
colorTextLightSolid: colorText
|
|
183
201
|
},
|
|
184
202
|
Menu: {
|
|
203
|
+
borderRadiusLG: borderRadiusMD,
|
|
185
204
|
paddingContentVertical: 0,
|
|
186
205
|
itemHeight: 30,
|
|
187
|
-
itemBorderRadius:
|
|
206
|
+
itemBorderRadius: borderRadius,
|
|
188
207
|
// 80 means 50% opacity
|
|
189
208
|
itemHoverBg: colorFillSecondary + '80',
|
|
190
209
|
itemActiveBg: colorFillSecondary + '80',
|
package/lib/alert/style/index.js
CHANGED
|
@@ -23,6 +23,7 @@ __export(style_exports, {
|
|
|
23
23
|
genAlertStyle: () => genAlertStyle
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(style_exports);
|
|
26
|
+
var import_cssinjs = require("@ant-design/cssinjs");
|
|
26
27
|
var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
|
|
27
28
|
var import_lodash = require("lodash");
|
|
28
29
|
var genAlertTypeStyle = (type, token) => {
|
|
@@ -59,12 +60,26 @@ var genAlertStyle = (token) => {
|
|
|
59
60
|
const iconWidth = token.fontSizeLG;
|
|
60
61
|
const contentStartOffset = calc(iconWidth).add(token.marginXS).equal();
|
|
61
62
|
const closeIconWidth = height;
|
|
63
|
+
const contentWidth = (0, import_cssinjs.unit)(
|
|
64
|
+
calc(contentStartOffset).add(closeIconWidth).add(token.padding).equal()
|
|
65
|
+
);
|
|
66
|
+
const actionWidth = (0, import_cssinjs.unit)(calc(contentStartOffset).add(token.padding).equal());
|
|
62
67
|
return {
|
|
63
68
|
[`${componentCls}`]: {
|
|
64
69
|
// vertical align to flex-start
|
|
65
70
|
alignItems: "flex-start !important",
|
|
66
71
|
paddingInline: token.padding,
|
|
67
72
|
position: "relative",
|
|
73
|
+
[`${componentCls}-content`]: {
|
|
74
|
+
flex: `1 1 calc(100% - ${contentWidth})`,
|
|
75
|
+
minWidth: 0,
|
|
76
|
+
maxWidth: `calc(100% - ${contentWidth})`,
|
|
77
|
+
wordBreak: "break-word"
|
|
78
|
+
},
|
|
79
|
+
[`${componentCls}-action`]: {
|
|
80
|
+
width: `calc(100% - ${actionWidth})`,
|
|
81
|
+
marginInlineStart: contentStartOffset
|
|
82
|
+
},
|
|
68
83
|
[`${componentCls}-icon`]: {
|
|
69
84
|
height,
|
|
70
85
|
fontSize: token.fontSizeLG,
|
|
@@ -103,15 +118,7 @@ var genAlertStyle = (token) => {
|
|
|
103
118
|
},
|
|
104
119
|
[`${componentCls}:not(${componentCls}-with-description)`]: {
|
|
105
120
|
flexWrap: "wrap",
|
|
106
|
-
[`${componentCls}-content`]: {
|
|
107
|
-
flex: `1 1 ${calc("100%").sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal()}`,
|
|
108
|
-
minWidth: 0,
|
|
109
|
-
maxWidth: calc("100%").sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal(),
|
|
110
|
-
wordBreak: "break-word"
|
|
111
|
-
},
|
|
112
121
|
[`${componentCls}-action`]: {
|
|
113
|
-
width: calc("100%").sub(contentStartOffset).sub(token.padding).equal(),
|
|
114
|
-
marginInlineStart: contentStartOffset,
|
|
115
122
|
marginTop: token.marginXS
|
|
116
123
|
}
|
|
117
124
|
},
|
|
@@ -127,15 +134,7 @@ var genAlertStyle = (token) => {
|
|
|
127
134
|
[`${componentCls}-description`]: {
|
|
128
135
|
wordBreak: "break-word"
|
|
129
136
|
},
|
|
130
|
-
[`${componentCls}-content`]: {
|
|
131
|
-
flex: `1 1 ${calc("100%").sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal()}`,
|
|
132
|
-
minWidth: 0,
|
|
133
|
-
maxWidth: calc("100%").sub(contentStartOffset).sub(closeIconWidth).sub(token.padding).equal(),
|
|
134
|
-
wordBreak: "break-word"
|
|
135
|
-
},
|
|
136
137
|
[`${componentCls}-action`]: {
|
|
137
|
-
width: calc("100%").sub(contentStartOffset).sub(token.padding).equal(),
|
|
138
|
-
marginInlineStart: contentStartOffset,
|
|
139
138
|
marginTop: token.marginSM
|
|
140
139
|
},
|
|
141
140
|
[`${componentCls}-close-icon`]: {
|
|
@@ -25,11 +25,17 @@ __export(style_exports, {
|
|
|
25
25
|
module.exports = __toCommonJS(style_exports);
|
|
26
26
|
var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
|
|
27
27
|
var genButtonStyle = (token) => {
|
|
28
|
-
|
|
28
|
+
const { componentCls } = token;
|
|
29
|
+
return {
|
|
30
|
+
[`${componentCls}`]: {
|
|
31
|
+
// remove box-shadow for button
|
|
32
|
+
boxShadow: "none !important"
|
|
33
|
+
}
|
|
34
|
+
};
|
|
29
35
|
};
|
|
30
36
|
var style_default = (prefixCls, isAliyun) => {
|
|
31
37
|
const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Button", (token) => {
|
|
32
|
-
return
|
|
38
|
+
return [genButtonStyle(token)];
|
|
33
39
|
});
|
|
34
40
|
return useStyle(prefixCls);
|
|
35
41
|
};
|
|
@@ -14,8 +14,9 @@ export * from 'antd/es/config-provider/SizeContext';
|
|
|
14
14
|
export * from 'antd/es/config-provider/DisabledContext';
|
|
15
15
|
export * from 'antd/es/config-provider';
|
|
16
16
|
export interface ThemeConfig extends AntThemeConfig {
|
|
17
|
-
isDark?: boolean;
|
|
18
17
|
isAliyun?: boolean;
|
|
18
|
+
isDark?: boolean;
|
|
19
|
+
isCompact?: boolean;
|
|
19
20
|
}
|
|
20
21
|
export type CardConfig = AntCardConfig & {
|
|
21
22
|
divided?: boolean;
|