@wangxinowo/vue-datepicker-next 1.0.0

package/src/components/input/__tests__/__snapshots__/demo.test.js.snap

@@ -0,0 +1,86 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders ./antdv-demo/docs/input/demo/addon.md correctly 1`] = `
+<div>
+  <div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon">Http://</span><input type="text" class="ant-input"><span class="ant-input-group-addon">.com</span></span></span></div>
+  <div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><span class="ant-input-group-addon"><div tabindex="0" class="ant-select ant-select-enabled" style="width: 90px;"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Http://" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+          Http://
+        </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div></span><input type="text" class="ant-input"><span class="ant-input-group-addon"><div tabindex="0" class="ant-select ant-select-enabled" style="width: 80px;"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title=".com" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+          .com
+        </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div></span></span></span></div>
+<div style="margin-bottom: 16px;"><span class="ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><input type="text" class="ant-input"><span class="ant-input-group-addon"><i aria-label="icon: setting" class="anticon anticon-setting"><svg viewBox="64 64 896 896" data-icon="setting" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M924.8 625.7l-65.5-56c3.1-19 4.7-38.4 4.7-57.8s-1.6-38.8-4.7-57.8l65.5-56a32.03 32.03 0 0 0 9.3-35.2l-.9-2.6a443.74 443.74 0 0 0-79.7-137.9l-1.8-2.1a32.12 32.12 0 0 0-35.1-9.5l-81.3 28.9c-30-24.6-63.5-44-99.7-57.6l-15.7-85a32.05 32.05 0 0 0-25.8-25.7l-2.7-.5c-52.1-9.4-106.9-9.4-159 0l-2.7.5a32.05 32.05 0 0 0-25.8 25.7l-15.8 85.4a351.86 351.86 0 0 0-99 57.4l-81.9-29.1a32 32 0 0 0-35.1 9.5l-1.8 2.1a446.02 446.02 0 0 0-79.7 137.9l-.9 2.6c-4.5 12.5-.8 26.5 9.3 35.2l66.3 56.6c-3.1 18.8-4.6 38-4.6 57.1 0 19.2 1.5 38.4 4.6 57.1L99 625.5a32.03 32.03 0 0 0-9.3 35.2l.9 2.6c18.1 50.4 44.9 96.9 79.7 137.9l1.8 2.1a32.12 32.12 0 0 0 35.1 9.5l81.9-29.1c29.8 24.5 63.1 43.9 99 57.4l15.8 85.4a32.05 32.05 0 0 0 25.8 25.7l2.7.5a449.4 449.4 0 0 0 159 0l2.7-.5a32.05 32.05 0 0 0 25.8-25.7l15.7-85a350 350 0 0 0 99.7-57.6l81.3 28.9a32 32 0 0 0 35.1-9.5l1.8-2.1c34.8-41.1 61.6-87.5 79.7-137.9l.9-2.6c4.5-12.3.8-26.3-9.3-35zM788.3 465.9c2.5 15.1 3.8 30.6 3.8 46.1s-1.3 31-3.8 46.1l-6.6 40.1 74.7 63.9a370.03 370.03 0 0 1-42.6 73.6L721 702.8l-31.4 25.8c-23.9 19.6-50.5 35-79.3 45.8l-38.1 14.3-17.9 97a377.5 377.5 0 0 1-85 0l-17.9-97.2-37.8-14.5c-28.5-10.8-55-26.2-78.7-45.7l-31.4-25.9-93.4 33.2c-17-22.9-31.2-47.6-42.6-73.6l75.5-64.5-6.5-40c-2.4-14.9-3.7-30.3-3.7-45.5 0-15.3 1.2-30.6 3.7-45.5l6.5-40-75.5-64.5c11.3-26.1 25.6-50.7 42.6-73.6l93.4 33.2 31.4-25.9c23.7-19.5 50.2-34.9 78.7-45.7l37.9-14.3 17.9-97.2c28.1-3.2 56.8-3.2 85 0l17.9 97 38.1 14.3c28.7 10.8 55.4 26.2 79.3 45.8l31.4 25.8 92.8-32.9c17 22.9 31.2 47.6 42.6 73.6L781.8 426l6.5 39.9zM512 326c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm79.2 255.2A111.6 111.6 0 0 1 512 614c-29.9 0-58-11.7-79.2-32.8A111.6 111.6 0 0 1 400 502c0-29.9 11.7-58 32.8-79.2C454 401.6 482.1 390 512 390c29.9 0 58 11.6 79.2 32.8A111.6 111.6 0 0 1 624 502c0 29.9-11.7 58-32.8 79.2z"></path></svg></i></span></span></span></div>
+</div>
+`;
+
+exports[`renders ./antdv-demo/docs/input/demo/allowClear.md correctly 1`] = `<div><span class="ant-input-affix-wrapper"><input placeholder="input with clear icon" type="text" class="ant-input"><span class="ant-input-suffix"></span></span> <br> <br> <span class="ant-input-affix-wrapper ant-input-affix-wrapper-textarea-with-clear-btn"><textarea placeholder="textarea with clear icon" class="ant-input"></textarea></span></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/autosize-textarea.md correctly 1`] = `
+<div><textarea placeholder="Autosize height based on content lines" class="ant-input" style="height: 0px; min-height: -9007199254740991px; max-height: 9007199254740991px; overflow-y: hidden; overflow-x: hidden;"></textarea>
+  <div style="margin: 24px 0px;"></div> <textarea placeholder="Autosize height with minimum and maximum number of lines" class="ant-input" style="height: -24px; min-height: -8px; max-height: -24px; overflow-y: hidden; overflow-x: hidden;"></textarea>
+  <div style="margin: 24px 0px;"></div> <textarea placeholder="Controlled autosize" class="ant-input" style="height: -20px; min-height: -12px; max-height: -20px; overflow-y: hidden; overflow-x: hidden;"></textarea>
+</div>
+`;
+
+exports[`renders ./antdv-demo/docs/input/demo/basic.md correctly 1`] = `<input placeholder="Basic usage" type="text" class="ant-input">`;
+
+exports[`renders ./antdv-demo/docs/input/demo/group.md correctly 1`] = `
+<div><span class="ant-input-group ant-input-group-lg"><div class="ant-row" style="margin-left: -4px; margin-right: -4px;"><div class="ant-col ant-col-5" style="padding-left: 4px; padding-right: 4px;"><input type="text" class="ant-input"></div> <div class="ant-col ant-col-8" style="padding-left: 4px; padding-right: 4px;"><input type="text" class="ant-input"></div></div></span> <br> <span class="ant-input-group ant-input-group-compact"><input type="text" class="ant-input" style="width: 20%;"><input type="text" class="ant-input" style="width: 30%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Zhejiang" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Zhejiang
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div><input type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Option1
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div><input type="text" class="ant-input" style="width: 50%;"></span> <br> <span class="ant-input-group ant-input-group-compact"><input type="text" class="ant-input" style="width: 50%;"><span class="ant-calendar-picker" style="width: 50%;"><div class=""><input readonly="true" placeholder="Select date" class="ant-calendar-picker-input ant-input"><i aria-label="icon: calendar" class="anticon anticon-calendar ant-calendar-picker-icon"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Option1-1" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Option1-1
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div>
+<div tabindex="0" class="ant-select ant-select-enabled">
+  <div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single">
+    <div class="ant-select-selection__rendered">
+      <div title="Option2-2" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Option2-2
+      </div>
+    </div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
+  </div>
+</div></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Between" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Between
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div><input placeholder="Minimum" type="text" class="ant-input" style="width: 100px; text-align: center;"><input placeholder="~" type="text" disabled="disabled" class="ant-input ant-input-disabled" style="width: 30px; pointer-events: none; background-color: rgb(255, 255, 255); border-left: 0;"><input placeholder="Maximum" type="text" class="ant-input" style="width: 100px; text-align: center; border-left: 0;"></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Sign Up" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Sign Up
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div>
+<div tabindex="-1" class="ant-select ant-select-combobox ant-select-enabled ant-select-show-search ant-select-auto-complete" style="width: 200px;">
+  <div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single">
+    <div class="ant-select-selection__rendered">
+      <ul>
+        <li class="ant-select-search ant-select-search--inline">
+          <div class="ant-select-search__field__wrap"><input placeholder="Email" type="text" value="" class="ant-input ant-select-search__field"><span class="ant-select-search__field__mirror">&nbsp;</span></div>
+        </li>
+      </ul>
+    </div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span>
+  </div>
+</div></span> <br> <span class="ant-input-group ant-input-group-compact"><div tabindex="0" class="ant-select ant-select-enabled" style="width: 30%;"><div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="test-uuid" class="ant-select-selection ant-select-selection--single"><div class="ant-select-selection__rendered"><div title="Home" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">
+        Home
+      </div></div><span unselectable="on" class="ant-select-arrow" style="user-select: none;"><i aria-label="icon: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i></span></div>
+</div><span tabindex="0" class="ant-cascader-picker" style="width: 70%;"><input placeholder="Select Address" type="text" readonly="true" class="ant-input ant-cascader-input "><span class="ant-cascader-picker-label"></span><i aria-label="icon: down" class="anticon anticon-down ant-cascader-picker-arrow"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="">
+    <path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path>
+  </svg></i></span></span></div>
+`;
+
+exports[`renders ./antdv-demo/docs/input/demo/password-input.md correctly 1`] = `<span class="ant-input-affix-wrapper ant-input-password"><input placeholder="input password" type="password" class="ant-input"><span class="ant-input-suffix"><i aria-label="icon: eye-invisible" tabindex="-1" class="anticon anticon-eye-invisible ant-input-password-icon"><svg viewBox="64 64 896 896" data-icon="eye-invisible" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 0 0 0-51.5zm-63.57-320.64L836 122.88a8 8 0 0 0-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 0 0 0 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 0 0 0 11.31L155.17 889a8 8 0 0 0 11.31 0l712.15-712.12a8 8 0 0 0 0-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 0 0-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 0 1 146.2-106.69L401.31 546.2A112 112 0 0 1 396 512z"></path><path d="M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 0 0 227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 0 1-112 112z"></path></svg></i></span></span>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/presuffix.md correctly 1`] = `<div class="components-input-demo-presuffix"><span class="ant-input-affix-wrapper"><span class="ant-input-prefix"><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i></span><input placeholder="Basic usage" type="text" class="ant-input"><span class="ant-input-suffix"><i aria-label="icon: info-circle" class="anticon anticon-info-circle" style="color: rgba(0, 0, 0, 0.45);"><svg viewBox="64 64 896 896" data-icon="info-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"></path><path d="M464 336a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z"></path></svg></i></span></span> <br> <br> <span class="ant-input-affix-wrapper"><span class="ant-input-prefix">￥</span><input type="text" class="ant-input"><span class="ant-input-suffix">RMB</span></span></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/search-input.md correctly 1`] = `<div><span class="ant-input-search ant-input-affix-wrapper" style="width: 200px;"><input placeholder="input search text" type="text" class="ant-input"><span class="ant-input-suffix"><i aria-label="icon: search" tabindex="-1" class="anticon anticon-search ant-input-search-icon"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></span> <br><br> <span class="ant-input-search ant-input-search-enter-button ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><input placeholder="input search text" type="text" class="ant-input"><span class="ant-input-group-addon"><button type="button" class="ant-btn ant-btn-primary ant-input-search-button"><i aria-label="icon: search" class="anticon anticon-search"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></button></span></span></span> <br><br> <span class="ant-input-search ant-input-search-enter-button ant-input-search-large ant-input-group-wrapper ant-input-group-wrapper-lg"><span class="ant-input-wrapper ant-input-group"><input placeholder="input search text" type="text" class="ant-input ant-input-lg"><span class="ant-input-group-addon"><button type="button" class="ant-btn ant-btn-primary ant-btn-lg ant-input-search-button"><span>Search</span></button></span></span></span> <br><br> <span class="ant-input-search ant-input-search-enter-button ant-input-search-large ant-input-group-wrapper ant-input-group-wrapper-lg"><span class="ant-input-wrapper ant-input-group"><input placeholder="input search text" type="text" class="ant-input ant-input-lg"><span class="ant-input-group-addon"><button type="button" class="ant-btn ant-btn-lg ant-input-search-button"><span>Custom</span></button></span></span></span></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/search-input-loading.md correctly 1`] = `<div><span class="ant-input-search ant-input-affix-wrapper"><input placeholder="input search loading deault" type="text" class="ant-input"><span class="ant-input-suffix"><i aria-label="icon: loading" class="anticon anticon-loading ant-input-search-icon"><svg viewBox="0 0 1024 1024" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="anticon-spin"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></i></span></span> <br> <br> <span class="ant-input-search ant-input-search-enter-button ant-input-group-wrapper"><span class="ant-input-wrapper ant-input-group"><input placeholder="input search loading with enterButton" type="text" class="ant-input"><span class="ant-input-group-addon"><button type="button" class="ant-btn ant-btn-primary ant-input-search-button"><i aria-label="icon: loading" class="anticon anticon-loading"><svg viewBox="0 0 1024 1024" data-icon="loading" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="anticon-spin"><path d="M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z"></path></svg></i></button></span></span></span></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/size.md correctly 1`] = `<div class="components-input-demo-size"><input placeholder="large size" type="text" class="ant-input ant-input-lg"> <input placeholder="default size" type="text" class="ant-input"> <input placeholder="small size" type="text" class="ant-input ant-input-sm"></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/textarea.md correctly 1`] = `<textarea placeholder="Basic usage" class="ant-input" rows="4"></textarea>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/textarea-resize.md correctly 1`] = `<div><button type="button" class="ant-btn" style="margin-bottom: 16px;"><span>Auto Resize: false</span></button> <textarea class="ant-input" rows="4"></textarea></div>`;
+
+exports[`renders ./antdv-demo/docs/input/demo/tooltip.md correctly 1`] = `<input placeholder="Input a number" type="text" maxlength="25" class="ant-input" style="width: 120px;">`;

package/src/components/input/__tests__/__snapshots__/index.test.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Input should support maxLength 1`] = `<input type="text" maxlength="3" class="ant-input">`;
+
+exports[`Input.Search should support suffix 1`] = `<span class="ant-input-search ant-input-affix-wrapper"><input type="text" class="ant-input"><span class="ant-input-suffix">suffix<i aria-label="icon: search" tabindex="-1" class="anticon anticon-search ant-input-search-icon"><svg viewBox="64 64 896 896" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></i></span></span>`;
+
+exports[`TextArea should support disabled 1`] = `<textarea disabled="disabled" class="ant-input ant-input-disabled"></textarea>`;
+
+exports[`TextArea should support maxLength 1`] = `<textarea maxlength="10" class="ant-input"></textarea>`;

package/src/components/input/__tests__/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../../../tests/shared/demoTest';
+
+demoTest('input');

package/src/components/input/__tests__/index.test.js

@@ -0,0 +1,124 @@
+import { mount } from '@vue/test-utils';
+import { asyncExpect } from '@/tests/utils';
+import Input from '..';
+import Form from '../../form';
+import focusTest from '../../../tests/shared/focusTest';
+
+const { TextArea, Password } = Input;
+
+describe('Input', () => {
+  focusTest(Input);
+  focusTest(TextArea);
+  focusTest(Password);
+
+  it('should support maxLength', async () => {
+    const wrapper = mount(Input, { attrs: { maxLength: 3 }, sync: false });
+    await asyncExpect(() => {
+      expect(wrapper.html()).toMatchSnapshot();
+    }, 0);
+  });
+  it('select()', () => {
+    const wrapper = mount(Input);
+    wrapper.vm.select();
+  });
+
+  it('should not support allowClear when it is disabled', () => {
+    const wrapper = mount(Input, {
+      propsData: { allowClear: true, defaultValue: '111', disabled: true },
+      sync: false,
+    });
+    expect(wrapper.findAll('.ant-input-clear-icon').length).toBe(0);
+  });
+});
+
+focusTest(TextArea);
+
+describe('TextArea', () => {
+  it('should auto calculate height according to content length', async () => {
+    const wrapper = mount(TextArea, {
+      propsData: { value: '', readOnly: true, autoSize: true },
+      sync: false,
+    });
+    const mockFunc = jest.spyOn(wrapper.vm.$refs.resizableTextArea, 'resizeTextarea');
+
+    await asyncExpect(() => {
+      expect(mockFunc).toHaveBeenCalledTimes(1);
+      wrapper.setProps({ value: '1111\n2222\n3333' });
+    });
+    await asyncExpect(() => {
+      expect(mockFunc).toHaveBeenCalledTimes(2);
+    });
+    await asyncExpect(() => {
+      wrapper.setProps({ value: '1111' });
+    });
+
+    await asyncExpect(() => {
+      expect(mockFunc).toHaveBeenCalledTimes(3);
+    }, 100);
+  });
+
+  it('should support disabled', async () => {
+    const wrapper = mount(TextArea, { propsData: { disabled: true }, sync: false });
+    await asyncExpect(() => {
+      expect(wrapper.html()).toMatchSnapshot();
+    });
+  });
+
+  it('should support maxLength', async () => {
+    const wrapper = mount(TextArea, { attrs: { maxLength: 10 }, sync: false });
+    await asyncExpect(() => {
+      expect(wrapper.html()).toMatchSnapshot();
+    });
+  });
+});
+
+describe('As Form Control', () => {
+  it('should be reset when wrapped in form.getFieldDecorator without initialValue', async () => {
+    const Demo = {
+      methods: {
+        reset() {
+          this.form.resetFields();
+        },
+      },
+
+      render() {
+        const { getFieldDecorator } = this.form;
+        return (
+          <Form>
+            <Form.Item>{getFieldDecorator('input')(<Input />)}</Form.Item>
+            <Form.Item>{getFieldDecorator('textarea')(<Input.TextArea />)}</Form.Item>
+            <button type="button" onClick={this.reset}>
+              reset
+            </button>
+          </Form>
+        );
+      },
+    };
+    const DemoForm = Form.create()(Demo);
+    const wrapper = mount(DemoForm, { sync: false });
+    await asyncExpect(() => {
+      wrapper.find('input').element.value = '111';
+      wrapper.find('input').trigger('input');
+      wrapper.find('textarea').element.value = '222';
+      wrapper.find('textarea').trigger('input');
+    });
+    await asyncExpect(() => {
+      expect(wrapper.find('input').element.value).toBe('111');
+      expect(wrapper.find('textarea').element.value).toBe('222');
+      wrapper.find('button').trigger('click');
+    });
+    await asyncExpect(() => {
+      expect(wrapper.find('input').element.value).toBe('');
+      expect(wrapper.find('textarea').element.value).toBe('');
+    });
+  });
+});
+
+describe('Input.Search', () => {
+  it('should support suffix', async () => {
+    const wrapper = mount(Input.Search, { propsData: { suffix: 'suffix' }, sync: false });
+    await asyncExpect(() => {
+      expect(wrapper.html()).toMatchSnapshot();
+    });
+  });
+});

package/src/components/input/calculateNodeHeight.js

@@ -0,0 +1,151 @@
+// Thanks to https://github.com/andreypopp/react-textarea-autosize/
+
+/**
+ * calculateNodeHeight(uiTextNode, useCache = false)
+ */
+
+const HIDDEN_TEXTAREA_STYLE = `
+  min-height:0 !important;
+  max-height:none !important;
+  height:0 !important;
+  visibility:hidden !important;
+  overflow:hidden !important;
+  position:absolute !important;
+  z-index:-1000 !important;
+  top:0 !important;
+  right:0 !important
+`;
+
+const SIZING_STYLE = [
+  'letter-spacing',
+  'line-height',
+  'padding-top',
+  'padding-bottom',
+  'font-family',
+  'font-weight',
+  'font-size',
+  'font-variant',
+  'text-rendering',
+  'text-transform',
+  'width',
+  'text-indent',
+  'padding-left',
+  'padding-right',
+  'border-width',
+  'box-sizing',
+];
+
+const computedStyleCache = {};
+let hiddenTextarea;
+
+export function calculateNodeStyling(node, useCache = false) {
+  const nodeRef =
+    node.getAttribute('id') || node.getAttribute('data-reactid') || node.getAttribute('name');
+
+  if (useCache && computedStyleCache[nodeRef]) {
+    return computedStyleCache[nodeRef];
+  }
+
+  const style = window.getComputedStyle(node);
+
+  const boxSizing =
+    style.getPropertyValue('box-sizing') ||
+    style.getPropertyValue('-moz-box-sizing') ||
+    style.getPropertyValue('-webkit-box-sizing');
+
+  const paddingSize =
+    parseFloat(style.getPropertyValue('padding-bottom')) +
+    parseFloat(style.getPropertyValue('padding-top'));
+
+  const borderSize =
+    parseFloat(style.getPropertyValue('border-bottom-width')) +
+    parseFloat(style.getPropertyValue('border-top-width'));
+
+  const sizingStyle = SIZING_STYLE.map(name => `${name}:${style.getPropertyValue(name)}`).join(';');
+
+  const nodeInfo = {
+    sizingStyle,
+    paddingSize,
+    borderSize,
+    boxSizing,
+  };
+
+  if (useCache && nodeRef) {
+    computedStyleCache[nodeRef] = nodeInfo;
+  }
+
+  return nodeInfo;
+}
+
+export default function calculateNodeHeight(
+  uiTextNode,
+  useCache = false,
+  minRows = null,
+  maxRows = null,
+) {
+  if (!hiddenTextarea) {
+    hiddenTextarea = document.createElement('textarea');
+    document.body.appendChild(hiddenTextarea);
+  }
+
+  // Fix wrap="off" issue
+  // https://github.com/ant-design/ant-design/issues/6577
+  if (uiTextNode.getAttribute('wrap')) {
+    hiddenTextarea.setAttribute('wrap', uiTextNode.getAttribute('wrap'));
+  } else {
+    hiddenTextarea.removeAttribute('wrap');
+  }
+
+  // Copy all CSS properties that have an impact on the height of the content in
+  // the textbox
+  const { paddingSize, borderSize, boxSizing, sizingStyle } = calculateNodeStyling(
+    uiTextNode,
+    useCache,
+  );
+
+  // Need to have the overflow attribute to hide the scrollbar otherwise
+  // text-lines will not calculated properly as the shadow will technically be
+  // narrower for content
+  hiddenTextarea.setAttribute('style', `${sizingStyle};${HIDDEN_TEXTAREA_STYLE}`);
+  hiddenTextarea.value = uiTextNode.value || uiTextNode.placeholder || '';
+
+  let minHeight = Number.MIN_SAFE_INTEGER;
+  let maxHeight = Number.MAX_SAFE_INTEGER;
+  let height = hiddenTextarea.scrollHeight;
+  let overflowY;
+
+  if (boxSizing === 'border-box') {
+    // border-box: add border, since height = content + padding + border
+    height += borderSize;
+  } else if (boxSizing === 'content-box') {
+    // remove padding, since height = content
+    height -= paddingSize;
+  }
+
+  if (minRows !== null || maxRows !== null) {
+    // measure height of a textarea with a single row
+    hiddenTextarea.value = ' ';
+    const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
+    if (minRows !== null) {
+      minHeight = singleRowHeight * minRows;
+      if (boxSizing === 'border-box') {
+        minHeight = minHeight + paddingSize + borderSize;
+      }
+      height = Math.max(minHeight, height);
+    }
+    if (maxRows !== null) {
+      maxHeight = singleRowHeight * maxRows;
+      if (boxSizing === 'border-box') {
+        maxHeight = maxHeight + paddingSize + borderSize;
+      }
+      overflowY = height > maxHeight ? '' : 'hidden';
+      height = Math.min(maxHeight, height);
+    }
+  }
+  return {
+    height: `${height}px`,
+    minHeight: `${minHeight}px`,
+    maxHeight: `${maxHeight}px`,
+    overflowY,
+  };
+}

package/src/components/input/index.js

@@ -0,0 +1,27 @@
+import Vue from 'vue';
+import Input from './Input';
+import Group from './Group';
+import Search from './Search';
+import TextArea from './TextArea';
+import Password from './Password';
+import antInputDirective from '../_util/antInputDirective';
+import Base from '../base';
+
+Vue.use(antInputDirective);
+
+Input.Group = Group;
+Input.Search = Search;
+Input.TextArea = TextArea;
+Input.Password = Password;
+
+/* istanbul ignore next */
+Input.install = function(Vue) {
+  Vue.use(Base);
+  Vue.component(Input.name, Input);
+  Vue.component(Input.Group.name, Input.Group);
+  Vue.component(Input.Search.name, Input.Search);
+  Vue.component(Input.TextArea.name, Input.TextArea);
+  Vue.component(Input.Password.name, Input.Password);
+};
+
+export default Input;

package/src/components/input/inputProps.js

@@ -0,0 +1,36 @@
+import PropTypes from '../_util/vue-types';
+export default {
+  prefixCls: PropTypes.string,
+  inputPrefixCls: PropTypes.string,
+  defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  placeholder: [String, Number],
+  type: {
+    default: 'text',
+    type: String,
+  },
+  name: String,
+  size: PropTypes.oneOf(['small', 'large', 'default']),
+  disabled: PropTypes.bool,
+  readOnly: PropTypes.bool,
+  addonBefore: PropTypes.any,
+  addonAfter: PropTypes.any,
+  // onPressEnter?: React.FormEventHandler<any>;
+  // onKeyDown?: React.FormEventHandler<any>;
+  // onChange?: React.ChangeEventHandler<HTMLInputElement>;
+  // onClick?: React.FormEventHandler<any>;
+  // onFocus?: React.FormEventHandler<any>;
+  // onBlur?: React.FormEventHandler<any>;
+  prefix: PropTypes.any,
+  suffix: PropTypes.any,
+  // spellCheck: Boolean,
+  autoFocus: Boolean,
+  allowClear: Boolean,
+  lazy: {
+    default: true,
+    type: Boolean,
+  },
+  maxLength: PropTypes.number,
+  loading: PropTypes.bool,
+  className: PropTypes.string,
+};

package/src/components/input/style/index.js

@@ -0,0 +1,5 @@
+import '../../style/index.less';
+import './index.less';
+
+// style dependencies
+import '../../button/style';

package/src/components/input/style/index.less

@@ -0,0 +1,52 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+@import './mixin';
+
+// Input styles
+.@{ant-prefix}-input {
+  .reset-component;
+  .input;
+}
+
+//== Style for input-group: input with label, with button or dropdown...
+.@{ant-prefix}-input-group {
+  .reset-component;
+  .input-group(~'@{ant-prefix}-input');
+  &-wrapper {
+    display: inline-block;
+    width: 100%;
+    text-align: start;
+    vertical-align: top; // https://github.com/ant-design/ant-design/issues/6403
+  }
+}
+
+// Input with affix: prefix or suffix
+.@{ant-prefix}-input-affix-wrapper {
+  .reset-component;
+  .input-affix-wrapper(~'@{ant-prefix}-input');
+}
+
+.@{ant-prefix}-input-password-icon {
+  color: @text-color-secondary;
+  cursor: pointer;
+  transition: all 0.3s;
+
+  &:hover {
+    color: #333;
+  }
+}
+
+.@{ant-prefix}-input-clear-icon {
+  .clear-icon;
+  vertical-align: 0;
+}
+
+.@{ant-prefix}-input-textarea-clear-icon {
+  .clear-icon;
+  position: absolute;
+  top: 0;
+  right: 0;
+  margin: 8px 8px 0 0;
+}
+
+@import './search-input';