feat(select): add input-props prop, closes #1351

CHANGELOG.en-US.md

@@ -5,6 +5,7 @@
 ### Feats
 
 - `n-auto-complete` add `get-derived-show-from-value` prop, closes [#1292](https://github.com/TuSimple/naive-ui/issues/1292).
+- `n-select` add `input-props` prop, closes [#1351](https://github.com/TuSimple/naive-ui/issues/1351).
 
 ### Fixes
 

CHANGELOG.zh-CN.md

@@ -5,6 +5,7 @@
 ### Feats
 
 - `n-auto-complete` 新增 `get-derived-show-from-value` 属性，关闭 [#1292](https://github.com/TuSimple/naive-ui/issues/1292)
+- `n-select` 新增 `input-props` 属性，关闭 [#1351](https://github.com/TuSimple/naive-ui/issues/1351)
 
 ### Fixes
 

src/_internal/selection/src/Selection.tsx

@@ -11,7 +11,8 @@ import {
   nextTick,
   CSSProperties,
   watchEffect,
-  onMounted
+  onMounted,
+  InputHTMLAttributes
 } from 'vue'
 import { VOverflow, VOverflowInst } from 'vueuc'
 import type { SelectBaseOption } from '../../../select/src/interface'
@@ -77,6 +78,7 @@ export default defineComponent({
       type: Boolean,
       default: true
     },
+    inputProps: Object as PropType<InputHTMLAttributes>,
     focused: Boolean,
     renderTag: Function as PropType<RenderTag>,
     onKeyup: Function as PropType<(e: KeyboardEvent) => void>,
@@ -547,6 +549,7 @@ export default defineComponent({
           key="__input-tag__"
         >
           <input
+            {...this.inputProps}
             ref="patternInputRef"
             tabindex={-1}
             disabled={disabled}
@@ -741,6 +744,7 @@ export default defineComponent({
             class={`${clsPrefix}-base-selection-label`}
           >
             <input
+              {...this.inputProps}
               ref="patternInputRef"
               class={`${clsPrefix}-base-selection-input`}
               value={

src/input/demos/enUS/index.demo-entry.md

@@ -32,7 +32,7 @@ event
 | clearable | `boolean` | `false` | Whether the input is clearable. |
 | default-value | `string \| [string, string] \| null` | `null` | Default value when not manually set. |
 | disabled | `boolean` | `false` | Whether to disable the input. |
-| input-props | `object` | `undefined` | The props of the input element inside the component. This is disabled if the `pair` property is true. |
+| input-props | `HTMLInputAttributes` | `undefined` | The props of the input element inside the component. This is disabled if the `pair` property is true. |
 | loading | `boolean` | `undefined` | Set loading state. If set (true/false), the element will always take up enough space for the loading indicator. |
 | maxlength | `number` | `undefined` | Maximum input length. |
 | minlength | `number` | `undefined` | Minimum input length. |

src/input/demos/zhCN/index.demo-entry.md

@@ -31,7 +31,7 @@ focus
 | clearable | `boolean` | `false` | 是否可清空 |
 | default-value | `string \| [string, string] \| null` | `null` | 输入框默认值 |
 | disabled | `boolean` | `false` | 是否禁用 |
-| input-props | `object` | `undefined` | 组件中 input 元素的属性，对 `pair` 类型不生效 |
+| input-props | `HTMLInputAttributes` | `undefined` | 组件中 input 元素的属性，对 `pair` 类型不生效 |
 | loading | `boolean` | `undefined` | 是否展示加载图标，设为非 `undefined` 会占据空间 |
 | maxlength | `number` | `undefined` | 最大输入长度 |
 | minlength | `number` | `undefined` | 最小输入长度 |

src/select/demos/enUS/index.demo-entry.md

@@ -40,6 +40,7 @@ render-person
 | fallback-option | `false \| (value: string \| number) => SelectOption` | `value => ({ label: '' + value, value })` | The option to be created according the value which has no corresponding option in the options of the component. If set to `false`, the fallback option won't be created and displayed and the value has no corresponding option will be viewed as a invalid value and it will be removed in the operations of the component. |
 | filterable | `boolean` | `false` | Whether it can filter options. |
 | filter | `(pattern: string, option: Object) => boolean` | A basic string based search method. | Filter function. |
+| input-props | `HTMLInputAttributes` | `undefined` | The attributes of input element in the trigger. It only works when the select is filter. |
 | loading | `boolean` | `false` | Whether to show loading status. |
 | max-tag-count | `number \| 'responsive'` | `undefined` | Max tag count in multiple mode. `responsive` will keep all the tags in single line. |
 | multiple | `boolean` | `false` | Whether to select multiple values. |

src/select/demos/zhCN/index.demo-entry.md

@@ -46,6 +46,7 @@ options-change-debug
 | fallback-option | `false \| (value: string \| number) => SelectOption` | `value => ({ label: '' + value, value })` | 在传入的选项中没有对应当前值的选项时，这个值应该对应的选项。如果设为 `false`，不会为找不到对应选项的值生成回退选项也不会显示它，未在选项中的值会被视为不合法，操作过程中会被组件清除掉 |
 | filterable | `boolean` | `false` | 是否可以过滤 |
 | filter | `(pattern: string, option: object) => boolean` | 一个简单的字符串搜索算法 | 过滤器函数 |
+| input-props | `HTMLInputAttributes` | `undefined` | 触发器中 input 元素的属性，只在可过滤时有意义 |
 | loading | `boolean` | `false` | 是否为加载状态 |
 | max-tag-count | `number \| 'responsive'` | `undefined` | 多选标签的最大显示数量，`responsive` 会将所有标签保持在一行 |
 | multiple | `boolean` | `false` | 是否为多选 |

src/select/src/Select.tsx

@@ -9,7 +9,8 @@ import {
   watch,
   Transition,
   withDirectives,
-  vShow
+  vShow,
+  InputHTMLAttributes
 } from 'vue'
 import { happensIn } from 'seemly'
 import { createTreeMate, TreeNode } from 'treemate'
@@ -138,6 +139,7 @@ const selectProps = {
   'onUpdate:value': [Function, Array] as PropType<
   MaybeArray<OnUpdateValue> | undefined
   >,
+  inputProps: Object as PropType<InputHTMLAttributes>,
   // for jsx
   onUpdateValue: [Function, Array] as PropType<
   MaybeArray<OnUpdateValue> | undefined
@@ -703,6 +705,7 @@ export default defineComponent({
                   default: () => (
                     <NInternalSelection
                       ref="triggerRef"
+                      inputProps={this.inputProps}
                       clsPrefix={mergedClsPrefix}
                       showArrow={this.showArrow}
                       maxTagCount={this.maxTagCount}