doc: 增加 Clearable 文档

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/Inputs.razor

@@ -222,4 +222,33 @@
     </div>
 </DemoBlock>
 
+<DemoBlock Title="@Localizer["ClearableTitle"]"
+           Introduction="@Localizer["ClearableIntro"]"
+           Name="OnInput">
+    <div class="row g-3">
+        <div class="col-12 col-sm-6">
+            <BootstrapInput Value="Model.Name" Clearable="true" ShowLabel="true" DisplayText="Clearable" />
+        </div>
+    </div>
+    <div class="row form-inline g-3 mt-0">
+        <div class="col-12 col-sm-6">
+            <BootstrapInput Value="Model.Name" Clearable="true" ShowLabel="true" DisplayText="Clearable" />
+        </div>
+    </div>
+    <div class="row g-3 mt-0">
+        <div class="col-12 col-sm-6">
+            <BootstrapInputGroup>
+                <BootstrapInputGroupLabel ShowRequiredMark DisplayText="Clearable"></BootstrapInputGroupLabel>
+                <BootstrapInput Value="@Model.Name" Clearable="true" />
+            </BootstrapInputGroup>
+        </div>
+        <div class="col-12 col-sm-6">
+            <BootstrapInputGroup>
+                <BootstrapInput Value="@Model.Name" Clearable="true" />
+                <BootstrapInputGroupLabel ShowRequiredMark DisplayText="Clearable"></BootstrapInputGroupLabel>
+            </BootstrapInputGroup>
+        </div>
+    </div>
+</DemoBlock>
+
 <AttributeTable Items="@GetAttributes()" />

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -2780,7 +2780,9 @@
     "InputsFormatStringSetting": "Set up",
     "InputsFormatStringTips": "The <code>BootstrapInput</code> component binds <code>byte[]</code> array and formats it as an example of <code>base64</code> encoded string",
     "UseInputEvent": "Whether use oninput event when bind-value",
-    "IsTrim": "automatically trim white space when entering content"
+    "IsTrim": "automatically trim white space when entering content",
+    "ClearableTitle": "Clearable",
+    "ClearableIntro": "By setting the <code>Clearable=\"true\"</code> parameter, a small <b>Clear</b> button will be displayed when the component gains focus or when the mouse hovers over it."
   },
   "BootstrapBlazor.Server.Components.Samples.InputNumbers": {
     "InputNumbersTitle": "InputNumber",

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -2780,7 +2780,9 @@
     "InputsFormatStringSetting": "设置",
     "InputsFormatStringTips": "<code>BootstrapInput</code> 组件绑定 <code>byte[]</code> 数组，格式化成 <code>base64</code> 编码字符串示例",
     "UseInputEvent": "是否在文本框输入值时触发",
-    "IsTrim": "是否自动去除空格"
+    "IsTrim": "是否自动去除空格",
+    "ClearableTitle": "清除",
+    "ClearableIntro": "通过设置 <code>Clearable=\"true\"</code> 参数，使组件获得焦点或者鼠标悬浮时显示一个 <b>清除</b> 小按钮"
   },
   "BootstrapBlazor.Server.Components.Samples.InputNumbers": {
     "InputNumbersTitle": "InputNumber 组件",