@arcblock/ux 2.1.55 → 2.1.56

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.
@@ -19,7 +19,7 @@ var _autoHidden = _interopRequireDefault(require("./auto-hidden"));
19
19
 
20
20
  var _jsxRuntime = require("react/jsx-runtime");
21
21
 
22
- const _excluded = ["logo", "brand", "brandAddon", "description", "children", "addons", "prepend"];
22
+ const _excluded = ["logo", "brand", "brandAddon", "description", "children", "addons", "prepend", "align"];
23
23
 
24
24
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
25
 
@@ -45,7 +45,8 @@ function Header(_ref) {
45
45
  description,
46
46
  children,
47
47
  addons,
48
- prepend
48
+ prepend,
49
+ align
49
50
  } = _ref,
50
51
  rest = _objectWithoutProperties(_ref, _excluded);
51
52
 
@@ -80,7 +81,9 @@ function Header(_ref) {
80
81
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
81
82
  className: "header-brand-addon",
82
83
  children: brandAddon
83
- }), children, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
84
+ }), align === 'right' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
85
+ flexGrow: 1
86
+ }), children, align === 'left' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
84
87
  flexGrow: 1
85
88
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
86
89
  className: "header-addons",
@@ -103,7 +106,8 @@ Header.propTypes = {
103
106
  // 右侧区域, 可以放置 icons/actions/login 等
104
107
  addons: _propTypes.default.node,
105
108
  // logo 左侧内容
106
- prepend: _propTypes.default.node
109
+ prepend: _propTypes.default.node,
110
+ align: _propTypes.default.oneOf(['left', 'right'])
107
111
  };
108
112
  Header.defaultProps = {
109
113
  logo: null,
@@ -112,7 +116,8 @@ Header.defaultProps = {
112
116
  description: null,
113
117
  children: null,
114
118
  addons: null,
115
- prepend: null
119
+ prepend: null,
120
+ align: 'left'
116
121
  };
117
122
 
118
123
  const Root = _styledComponents.default.div.withConfig({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arcblock/ux",
3
- "version": "2.1.55",
3
+ "version": "2.1.56",
4
4
  "description": "Common used react components for arcblock products",
5
5
  "keywords": [
6
6
  "react",
@@ -52,10 +52,10 @@
52
52
  "react": ">=18.1.0",
53
53
  "react-ga": "^2.7.0"
54
54
  },
55
- "gitHead": "8cfcdd2b41ec392d73b0f7cb906e83309f36aec2",
55
+ "gitHead": "5a8e5ecc8cad24b64ef38558457b32657e18ef44",
56
56
  "dependencies": {
57
- "@arcblock/icons": "^2.1.55",
58
- "@arcblock/react-hooks": "^2.1.55",
57
+ "@arcblock/icons": "^2.1.56",
58
+ "@arcblock/react-hooks": "^2.1.56",
59
59
  "@babel/plugin-syntax-dynamic-import": "^7.8.3",
60
60
  "@emotion/react": "^11.9.0",
61
61
  "@emotion/styled": "^11.8.1",
@@ -9,7 +9,7 @@ import AutoHidden from './auto-hidden';
9
9
  * Header 组件
10
10
  * TODO: Layout/dashboard 可以复用此处的 header
11
11
  */
12
- function Header({ logo, brand, brandAddon, description, children, addons, prepend, ...rest }) {
12
+ function Header({ logo, brand, brandAddon, description, children, addons, prepend, align, ...rest }) {
13
13
  const theme = useTheme();
14
14
  return (
15
15
  <Root {...rest} $theme={theme}>
@@ -25,8 +25,9 @@ function Header({ logo, brand, brandAddon, description, children, addons, prepen
25
25
  </div>
26
26
  </AutoHidden>
27
27
  <div className="header-brand-addon">{brandAddon}</div>
28
+ {align === 'right' && <Box flexGrow={1} />}
28
29
  {children}
29
- <Box flexGrow={1} />
30
+ {align === 'left' && <Box flexGrow={1} />}
30
31
  <div className="header-addons">{addons}</div>
31
32
  </Container>
32
33
  </Root>
@@ -47,6 +48,7 @@ Header.propTypes = {
47
48
  addons: PropTypes.node,
48
49
  // logo 左侧内容
49
50
  prepend: PropTypes.node,
51
+ align: PropTypes.oneOf(['left', 'right']),
50
52
  };
51
53
 
52
54
  Header.defaultProps = {
@@ -57,6 +59,7 @@ Header.defaultProps = {
57
59
  children: null,
58
60
  addons: null,
59
61
  prepend: null,
62
+ align: 'left',
60
63
  };
61
64
 
62
65
  const Root = styled.div`