Merge pull request #1702 from XiaoMi/develop

Develop

.babelrc

@@ -1,6 +1,6 @@
 {
   "presets": [
-    "@babel/preset-env", "@babel/preset-react"
+    "@babel/preset-env", "@babel/preset-react","@babel/preset-typescript"
     // [
     //   "env",
     //   {

CHANGELOG.md

@@ -1,8 +1,31 @@
 # 更新日志
+
+# 3.6.0
+- 新增 `Table` 组件 rowExpandable 方法，对内嵌式表格中左侧箭头进行自定义[#1679](https://github.com/XiaoMi/hiui/issues/1679)
+- 新增 `Form` 组件新增 clearValidates 方法，用于清除表单校验 [#1691](https://github.com/XiaoMi/hiui/issues/1691)
+- 新增 `Form` 组件 getFieldsError、getFieldsValue 方法，用于静默获取表单状态 [#1680](https://github.com/XiaoMi/hiui/issues/1680)
+- 新增 `SelectTree` disabled 属性，控制禁用状态[#1675](https://github.com/XiaoMi/hiui/issues/1675)
+- 优化 `Table` expandedRender 函数接受 Promise，可以进行异步渲染[#1679](https://github.com/XiaoMi/hiui/issues/1679)
+- 优化 `Tabs` 组件 在 type 为 editable 时右上角的加号的显示隐藏随 onAdd 方法自动显示隐藏 [#1662](https://github.com/XiaoMi/hiui/issues/1662)
+- 修复 `Modal` 组件 confirm 方法传入 className 属性无效问题 [#1584](https://github.com/XiaoMi/hiui/issues/1584)
+- 修复 `Modal` 组件 closeable 属性无效问题 [#1645](https://github.com/XiaoMi/hiui/issues/1645)
+- 修复 `Form` 组件 setFieldsValue 方式调用显示异常问题 [#1642](https://github.com/XiaoMi/hiui/issues/1642)
+- 修复 `Form` 组件中包裹多个 List 组件，值未展示问题 [#1649](https://github.com/XiaoMi/hiui/issues/1649)
+- 修复 `Table` 组件 data值为带正负符号的数字类型字符串时，无法进行求和及平均值的问题 [#1616](https://github.com/XiaoMi/hiui/issues/1616)
+- 修复 `Tabs` 组件 panes 数据源异步变更，导致Tabs.Pane重渲染时，底部高亮线偏移的问题 [#1651](https://github.com/XiaoMi/hiui/issues/1651)
+- 修复 `DatePicker` 组件 type 为 timeperiod 在受控时，选择完成时间后该组件内容显示为空 [#1653](https://github.com/XiaoMi/hiui/issues/1653)
+- 修复 `Select` 组件在分组形态下，搜索功能无效 [#1655](https://github.com/XiaoMi/hiui/issues/1655)
+- 修复 `DatePicker` type 为 daterange 时，且 showTime 为 true 选择时间显示异常 [#1640](https://github.com/XiaoMi/hiui/issues/1640)
+- 修复 `Cascader` id 为 Number 类型时导致节点重复添加问题[#1648](https://github.com/XiaoMi/hiui/issues/1648)
+- 修复 `Tabs` 组件 onDelete、onAdd 等方法获取数据操作异常问题[#1676](https://github.com/XiaoMi/hiui/issues/1676)
+- 修复 `DatePicker` maxDate 属性设置日期后，月份禁用错误 [#1690](https://github.com/XiaoMi/hiui/issues/1690)
+- 修复 `Upload` 在 type 为 drag 时，通过拖动文件上传，data数据不可更新[#1693](https://github.com/XiaoMi/hiui/issues/1693)
+- 修复 `DatePicker` 在 type 为 daterange 时, 时间区间选择同一天无效问题[#1688](https://github.com/XiaoMi/hiui/issues/1688)
+
 ## 3.5.0
 
 - 新增 `Table` 组件 showColHighlight 方法 [#1602](https://github.com/XiaoMi/hiui/issues/1602)
-- 修复 `Table` 组件 列冻结无法展示求和及平均值的问题 [#1616](https://github.com/XiaoMi/hiui/issues/1616)
+- 修复 `Table` 组件列冻结无法展示求和及平均值的问题 [#1616](https://github.com/XiaoMi/hiui/issues/1616)
 - 新增 `Table` 组件 表格表头事件回调函数输出 [#1625](https://github.com/XiaoMi/hiui/issues/1625)
 - 新增 `Form` SchemaForm 中 component 属性接受 ReactNode，SchemaForm 新增 updateSchema 更新函数 [#1612](https://github.com/XiaoMi/hiui/issues/1612)
 - 新增 `DatePicker` onSelect 选择日期的回调函数 [#1592](https://github.com/XiaoMi/hiui/issues/1592)
@@ -16,7 +39,7 @@
 - 修复 `TimePicker` 时间范围选择，为空时无法选择打开弹窗时的当前值 [#1530](https://github.com/XiaoMi/hiui/issues/1530)
 - 修复 `Collapse`  onChange 属性未传入控制台报错问题 [#1580](https://github.com/XiaoMi/hiui/issues/1580)
 - 修复 `Select` 组件在异步多选时，关闭弹层下拉选项内容丢失问题 [#1578](https://github.com/XiaoMi/hiui/issues/1578)
-- 修复 `Table` 组件 data值为数字类型字符串时，无法进行求和及平均值的问题 [#1616](https://github.com/XiaoMi/hiui/issues/1616)
+- 修复 `Table` 组件 data值为数字类型字符串时，无法进行求和及平均值的问题 [#1616](https://github.com/XiaoMi/hiui/issues/1616)
 
 ## 3.4.0
 

build/webpack.config.base.js

@@ -1,5 +1,6 @@
 const HtmlWebpackPlugin = require('html-webpack-plugin')
 const rehypePrism = require('@mapbox/rehype-prism')
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')
 const paths = require('./paths')
 
 const IS_GITHUB = process.env.DOC_ENV === 'github'
@@ -11,7 +12,7 @@ module.exports = {
     chunkFilename: '[name].chunk.js'
   },
   resolve: {
-    extensions: ['.web.js', '.js', '.jsx', '.json'],
+    extensions: ['.web.js', '.js', '.jsx', '.json', '.ts', '.tsx'],
     alias: {
       '@components': paths.components,
       '@libs': paths.siteLibs,
@@ -21,7 +22,7 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /\.(js|jsx)$/,
+        test: /\.(js|jsx|ts|tsx)$/,
         use: [
           {
             loader: require.resolve('./stringReplace'),
@@ -33,7 +34,7 @@ module.exports = {
           {
             loader: 'babel-loader',
             options: {
-              presets: ['@babel/preset-env', '@babel/preset-react'],
+              presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'],
               plugins: ['@babel/plugin-proposal-class-properties']
             }
           }
@@ -103,6 +104,10 @@ module.exports = {
       inject: true,
       template: paths.siteTemplate,
       baseUrl: IS_GITHUB ? '/hiui' : ''
+    }),
+    new ForkTsCheckerWebpackPlugin({
+      async: false,
+      tsconfig: `${paths.basePath}/tsconfig.json`
     })
   ]
 }

components/alert/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react'
+
+interface AlertProps {
+  prefixCls?: string
+  style?: React.CSSProperties
+  className?: string
+  type?: 'primary' | 'warning' | 'success' | 'danger'
+  theme?: 'hiui-blue' | 'orange' | 'cyan' | 'blue' | 'purple'
+  title: string
+  content?: string
+  closeable?: boolean
+  duration?: null | number
+  onClose?: () => void
+}
+
+declare class Alert extends React.Component<AlertProps, any> {}
+
+export default Alert

components/cascader/Menu.js

@@ -85,7 +85,7 @@ const Menu = forwardRef(
                         currentDeep.current = _deep
                       }
                     }}
-                    key={optionValue + index}
+                    key={optionValue + option[labelKey]}
                   >
                     <span className={classNames(`hi-cascader-menu__item--label`)}>
                       {isFiltered && option.hightlight

components/date-picker/components/RangePanel.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState, useCallback, useContext } from 'react'
+import React, { useEffect, useState, useCallback, useContext, useRef } from 'react'
 import classNames from 'classnames'
 import Header from './Header'
 import Calender from './Calender'
@@ -24,7 +24,7 @@ const RangePanel = () => {
     locale,
     onSelect
   } = useContext(DPContext)
-
+  const calenderClickIsEnd = useRef(false)
   const [showRangeMask, setShowRangeMask] = useState(false)
   const [views, setViews] = useState([getView(type), getView(type)])
   const [iFormat] = useFormat({
@@ -67,13 +67,13 @@ const RangePanel = () => {
 
   const setRanges = (date) => {
     const newRange = { ...range }
-    if (range.selecting) {
-      if (newRange.start > date) {
+    if (range.selecting || !calenderClickIsEnd.current) {
+      if (newRange.start >= date) {
         newRange.selecting = false
         newRange.end = newRange.start
         newRange.start = date
       }
-      onSelect(date, true)
+      onSelect(date, calenderClickIsEnd)
       if (type === 'weekrange') {
         onPick([newRange.start.startOf('week'), newRange.end.endOf('week')], showTime)
       } else {
@@ -93,6 +93,7 @@ const RangePanel = () => {
    * @param {*} dir
    */
   const onCalenderPick = (date, uIndex) => {
+    calenderClickIsEnd.current = !calenderClickIsEnd.current
     if (type === 'timeperiod' && views[uIndex] === 'date') {
       onPick([date, moment(date).hour(date.hour() + timeInterval / 60)], true)
       onSelect(date, true)
@@ -122,7 +123,7 @@ const RangePanel = () => {
   }
 
   const onTimeChange = (date, cIndex) => {
-    const _innerDates = _.cloneDeep(calRenderDates)
+    const _innerDates = _.cloneDeep([range.start, range.end])
     _innerDates[cIndex] = date
     onPick(_innerDates, true)
   }
@@ -283,7 +284,7 @@ const RangePanel = () => {
         <React.Fragment>
           <div className="hi-datepicker__mask" onClick={() => setShowRangeMask(false)} />
           <TimePanel
-            dates={calRenderDates}
+            dates={[range.start, range.end]}
             onTimeChange={onTimeChange}
             style={{
               position: 'absolute',

components/date-picker/hooks/useCalenderData.js

@@ -76,7 +76,7 @@ const getYearOrMonthRows = ({ originDate, renderDate, type, view, range, localeD
           const maxMoment = moment(max)
           const maxYear = maxMoment.year()
           const maxMonth = maxMoment.month()
-          col.type = _y < maxYear ? 'disabled' : col.type
+          col.type = _y > maxYear ? 'disabled' : col.type
           col.type = _y === maxYear && _m > maxMonth ? 'disabled' : col.type
         }
       }

components/date-picker/hooks/useDate.js

@@ -16,6 +16,7 @@ const useDate = ({ value, defaultValue, cacheDate, type, format, locale }) => {
     setOutDate(d)
     cacheDate.current = d
   }, [value, type])
+
   return [outDate, changeOutDate]
 }
 

components/date-picker/utils.js

@@ -230,7 +230,7 @@ export const parseValue = (value, type, format, locale = 'zh-CN') => {
   const _format = FORMATS(locale)[type]
   const _value = moment(value, _format)
   const isValid = moment(_value).isValid()
-  if (value && typeof value === 'object' && type.includes('range')) {
+  if (value && typeof value === 'object' && (type.includes('range') || type === 'timeperiod')) {
     if (type === 'weekrange') {
       return [
         value.start ? moment(value.start, _format).startOf('week') : null,