@gmfe/react 2.15.4-alpha.0 → 2.15.6-alpha.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gmfe/react",
-  "version": "2.15.4-alpha.0",
+  "version": "2.15.6-alpha.0",
   "description": "",
   "author": "liyatang <liyatang@qq.com>",
   "homepage": "https://github.com/gmfe/gmfe#readme",
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@gm-common/tool": "^1.0.0",
-    "@gmfe/locales": "^2.15.4-alpha.0",
+    "@gmfe/locales": "^2.15.6-alpha.0",
     "big.js": "^5.2.2",
     "classnames": "^2.2.5",
     "lodash": "^4.17.14",
@@ -35,5 +35,5 @@
     "prop-types": "^15.7.2",
     "react-window": "^1.8.5"
   },
-  "gitHead": "2c13925c3699572748de29cf0256ca1431c30f01"
+  "gitHead": "9b7441b57c7287e500be9fa86f930d0c7c1411c7"
 }

package/src/component/box/box.js

@@ -1,31 +1,63 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
+import Flex from '../flex'
+import StickyLayout from '../../hoc/sticky_layout'
 
-/** Box，用来包裹一块内容 */
-const Box = props => {
-  const { hasGap, className, children, ...rest } = props
-
+// 暂时没什么用
+const Info = props => {
   return (
     <div
-      {...rest}
+      {...props}
+      className={classNames('gm-box-table-info', props.className)}
+    />
+  )
+}
+
+Info.propTypes = {
+  className: PropTypes.string,
+  style: PropTypes.object
+}
+
+const BoxHeader = StickyLayout(props => {
+  const { info, action, headerProps = {} } = props
+  const { className: headerClassName } = headerProps
+
+  return (
+    <Flex
+      {...headerProps}
       className={classNames(
-        'gm-box',
-        {
-          'gm-padding-tb-10 gm-padding-lr-20 ': hasGap
-        },
-        className
+        'gm-box-table-header common-sticky-header',
+        headerClassName
       )}
+      alignCenter
     >
-      {children}
+      <Flex>{info}</Flex>
+      <Flex flex />
+      <Flex>{action}</Flex>
+    </Flex>
+  )
+})
+
+const BoxTable = props => {
+  const { children, className, ...rest } = props
+
+  return (
+    <div {...rest} className={classNames('gm-box gm-box-table', className)}>
+      <BoxHeader {...props} />
+      <div>{children}</div>
     </div>
   )
 }
 
-Box.propTypes = {
-  hasGap: PropTypes.bool,
+BoxTable.Info = Info
+
+BoxTable.propTypes = {
+  info: PropTypes.element,
+  action: PropTypes.element,
   className: PropTypes.string,
-  style: PropTypes.object
+  style: PropTypes.object,
+  headerProps: PropTypes.object
 }
 
-export default Box
+export default BoxTable

package/src/hoc/sticky_layout.js

@@ -142,7 +142,7 @@ const handleTopSentinelLeave = currentStickyRef => {
 }
 
 function StickyLayout(Component) {
-  const StickyLayout = ({ sticky, ...rest }) => {
+  const _StickyLayout = ({ sticky, ...rest }) => {
     const currentStickyRef = useRef(null)
     const topSentinelRef = useRef(null)
     const bottomSentinelRef = useRef(null)
@@ -215,15 +215,15 @@ function StickyLayout(Component) {
     )
   }
 
-  StickyLayout.defaultProps = {
-    sticky: false
+  _StickyLayout.defaultProps = {
+    sticky: true
   }
 
-  StickyLayout.propTypes = {
+  _StickyLayout.propTypes = {
     sticky: PropTypes.oneOfType([PropTypes.bool, PropTypes.object])
   }
 
-  return StickyLayout
+  return _StickyLayout
 }
 
 export default StickyLayout