fix(date-picker, time-picker): icon doesn't work with clearable

Fix https://github.com/TuSimple/naive-ui/issues/222

CHANGELOG.en-US.md

@@ -14,6 +14,8 @@
 - Fix `n-tree`'s `selected-keys` prop influences original array.
 - Fix `n-select`'s input has useless empty row in multiple filterable mode.
 - Fix `n-button`'s loading icon doesn't show on iOS Safari, closes [#219](https://github.com/TuSimple/naive-ui/issues/219).
+- Fix `n-date-picker` doesn't show icon when clearable.
+- Fix `n-time-picker` icon mis-aligned when clearable, closes [#222](https://github.com/TuSimple/naive-ui/issues/222).
 
 ## 2.12.2 (2021-06-19)
 

CHANGELOG.zh-CN.md

@@ -14,6 +14,8 @@
 - 修复 `n-tree` 对 `selected-keys` 属性影响原数组
 - 修复 `n-select` 砸爱 multiple filterable 模式下输入框有无用的空行
 - 修复 `n-button` 的 loading 图标在 iOS Safari 上不显示，关闭 [#219](https://github.com/TuSimple/naive-ui/issues/219)
+- 修复 `n-date-picker` 非 clearable 不显示图标
+- 修复 `n-time-picker` clearable 状态下图标位置不正确，关闭 [#222](https://github.com/TuSimple/naive-ui/issues/222)
 
 ## 2.12.2 (2021-06-19)
 

src/date-picker/src/DatePicker.tsx

@@ -620,13 +620,14 @@ export default defineComponent({
     }
   },
   render () {
+    const { clearable } = this
     const commonInputProps: InputProps = {
       bordered: this.mergedBordered,
       size: this.mergedSize,
       passivelyActivated: true,
       disabled: this.disabled,
       readonly: this.disabled,
-      clearable: this.clearable,
+      clearable,
       onClear: this.handleClear,
       onClick: this.handleTriggerClick,
       onActivate: this.handleInputActivate,
@@ -693,7 +694,7 @@ export default defineComponent({
                               {{ default: () => <ToIcon /> }}
                             </NBaseIcon>
                           ),
-                          clear: () => (
+                          [clearable ? 'clear' : 'suffix']: () => (
                             <NBaseIcon
                               clsPrefix={mergedClsPrefix}
                               class={`${mergedClsPrefix}-date-picker-icon`}
@@ -721,7 +722,7 @@ export default defineComponent({
                         {...commonInputProps}
                       >
                         {{
-                          clear: () => (
+                          [clearable ? 'clear' : 'suffix']: () => (
                             <NBaseIcon
                               clsPrefix={mergedClsPrefix}
                               class={`${mergedClsPrefix}-date-picker-icon`}

src/time-picker/src/TimePicker.tsx

@@ -621,7 +621,7 @@ export default defineComponent({
                     >
                       {this.showIcon
                         ? {
-                            suffix: () => (
+                            [this.clearable ? 'clear' : 'suffix']: () => (
                               <NBaseIcon
                                 clsPrefix={mergedClsPrefix}
                                 class={`${mergedClsPrefix}-time-picker-icon`}