@wangxinowo/vue-datepicker-next 1.0.0

package/src/components/style/v2-compatible-reset.less

@@ -0,0 +1,51 @@
+// For 2.x reset compatibility
+//   import 'antd/style/v2-compatible-reset';
+//     or
+//   @import '~antd/style/v2-compatible-reset.css';
+// unify the setting of elements's margin and padding for browsers
+body,
+div,
+dl,
+dt,
+dd,
+ul,
+ol,
+li,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+pre,
+code,
+form,
+fieldset,
+legend,
+input,
+textarea,
+p,
+blockquote,
+th,
+td,
+hr,
+button,
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  margin: 0;
+  padding: 0;
+}
+
+ul,
+ol {
+  list-style: none;
+}

package/src/components/style/v2-compatible-reset.tsx

@@ -0,0 +1 @@
+import './v2-compatible-reset.less';

package/src/components/tag/CheckableTag.jsx

@@ -0,0 +1,43 @@
+import PropTypes from '../_util/vue-types';
+import { ConfigConsumerProps } from '../config-provider/configConsumerProps';
+
+export default {
+  name: 'ACheckableTag',
+  model: {
+    prop: 'checked',
+  },
+  props: {
+    prefixCls: PropTypes.string,
+    checked: Boolean,
+  },
+  inject: {
+    configProvider: { default: () => ConfigConsumerProps },
+  },
+  computed: {
+    classes() {
+      const { checked, prefixCls: customizePrefixCls } = this;
+      const getPrefixCls = this.configProvider.getPrefixCls;
+      const prefixCls = getPrefixCls('tag', customizePrefixCls);
+      return {
+        [`${prefixCls}`]: true,
+        [`${prefixCls}-checkable`]: true,
+        [`${prefixCls}-checkable-checked`]: checked,
+      };
+    },
+  },
+  methods: {
+    handleClick() {
+      const { checked } = this;
+      this.$emit('input', !checked);
+      this.$emit('change', !checked);
+    },
+  },
+  render() {
+    const { classes, handleClick, $slots } = this;
+    return (
+      <div class={classes} onClick={handleClick}>
+        {$slots.default}
+      </div>
+    );
+  },
+};

package/src/components/tag/Tag.jsx

@@ -0,0 +1,145 @@
+import PropTypes from '../_util/vue-types';
+import Icon from '../icon';
+import getTransitionProps from '../_util/getTransitionProps';
+import omit from 'omit.js';
+import Wave from '../_util/wave';
+import { hasProp, getListeners, getOptionProps } from '../_util/props-util';
+import BaseMixin from '../_util/BaseMixin';
+import { ConfigConsumerProps } from '../config-provider/configConsumerProps';
+import warning from '../_util/warning';
+
+const PresetColorTypes = [
+  'pink',
+  'red',
+  'yellow',
+  'orange',
+  'cyan',
+  'green',
+  'blue',
+  'purple',
+  'geekblue',
+  'magenta',
+  'volcano',
+  'gold',
+  'lime',
+];
+const PresetColorRegex = new RegExp(`^(${PresetColorTypes.join('|')})(-inverse)?$`);
+
+export default {
+  name: 'ATag',
+  mixins: [BaseMixin],
+  model: {
+    prop: 'visible',
+    event: 'close.visible',
+  },
+  props: {
+    prefixCls: PropTypes.string,
+    color: PropTypes.string,
+    closable: PropTypes.bool.def(false),
+    visible: PropTypes.bool,
+    afterClose: PropTypes.func,
+  },
+  inject: {
+    configProvider: { default: () => ConfigConsumerProps },
+  },
+  data() {
+    let _visible = true;
+    const props = getOptionProps(this);
+    if ('visible' in props) {
+      _visible = this.visible;
+    }
+    warning(
+      !('afterClose' in props),
+      'Tag',
+      "'afterClose' will be deprecated, please use 'close' event, we will remove this in the next version.",
+    );
+    return {
+      _visible,
+    };
+  },
+  watch: {
+    visible(val) {
+      this.setState({
+        _visible: val,
+      });
+    },
+  },
+  methods: {
+    setVisible(visible, e) {
+      this.$emit('close', e);
+      this.$emit('close.visible', false);
+      const afterClose = this.afterClose;
+      if (afterClose) {
+        // next version remove.
+        afterClose();
+      }
+      if (e.defaultPrevented) {
+        return;
+      }
+      if (!hasProp(this, 'visible')) {
+        this.setState({ _visible: visible });
+      }
+    },
+
+    handleIconClick(e) {
+      e.stopPropagation();
+      this.setVisible(false, e);
+    },
+
+    isPresetColor() {
+      const { color } = this.$props;
+      if (!color) {
+        return false;
+      }
+      return PresetColorRegex.test(color);
+    },
+    getTagStyle() {
+      const { color } = this.$props;
+      const isPresetColor = this.isPresetColor();
+      return {
+        backgroundColor: color && !isPresetColor ? color : undefined,
+      };
+    },
+
+    getTagClassName(prefixCls) {
+      const { color } = this.$props;
+      const isPresetColor = this.isPresetColor();
+      return {
+        [prefixCls]: true,
+        [`${prefixCls}-${color}`]: isPresetColor,
+        [`${prefixCls}-has-color`]: color && !isPresetColor,
+      };
+    },
+
+    renderCloseIcon() {
+      const { closable } = this.$props;
+      return closable ? <Icon type="close" onClick={this.handleIconClick} /> : null;
+    },
+  },
+
+  render() {
+    const { prefixCls: customizePrefixCls } = this.$props;
+    const getPrefixCls = this.configProvider.getPrefixCls;
+    const prefixCls = getPrefixCls('tag', customizePrefixCls);
+    const { _visible: visible } = this.$data;
+    const tag = (
+      <span
+        v-show={visible}
+        {...{ on: omit(getListeners(this), ['close']) }}
+        class={this.getTagClassName(prefixCls)}
+        style={this.getTagStyle()}
+      >
+        {this.$slots.default}
+        {this.renderCloseIcon()}
+      </span>
+    );
+    const transitionProps = getTransitionProps(`${prefixCls}-zoom`, {
+      appear: false,
+    });
+    return (
+      <Wave>
+        <transition {...transitionProps}>{tag}</transition>
+      </Wave>
+    );
+  },
+};

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

@@ -0,0 +1,92 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders ./antdv-demo/docs/tag/demo/basic.md correctly 1`] = `
+<div><span class="ant-tag">Tag 1</span> <span class="ant-tag"><a href="https://github.com/vueComponent/ant-design">Link</a></span> <span class="ant-tag">
+    Tag 2
+  <i aria-label="icon: close" tabindex="-1" class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span> <span class="ant-tag">
+    Prevent Default
+  <i aria-label="icon: close" tabindex="-1" class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span></div>
+`;
+
+exports[`renders ./antdv-demo/docs/tag/demo/checkable.md correctly 1`] = `
+<div>
+  <div class="ant-tag ant-tag-checkable">
+    Tag1
+  </div>
+  <div class="ant-tag ant-tag-checkable">
+    Tag2
+  </div>
+  <div class="ant-tag ant-tag-checkable">
+    Tag3
+  </div>
+</div>
+`;
+
+exports[`renders ./antdv-demo/docs/tag/demo/colorful.md correctly 1`] = `
+<div>
+  <h4 style="margin-bottom: 16px;">
+    Presets:
+  </h4>
+  <div><span class="ant-tag ant-tag-pink">
+      pink
+    </span> <span class="ant-tag ant-tag-red">
+      red
+    </span> <span class="ant-tag ant-tag-orange">
+      orange
+    </span> <span class="ant-tag ant-tag-green">
+      green
+    </span> <span class="ant-tag ant-tag-cyan">
+      cyan
+    </span> <span class="ant-tag ant-tag-blue">
+      blue
+    </span> <span class="ant-tag ant-tag-purple">
+      purple
+    </span></div>
+  <h4>
+    Custom:
+  </h4>
+  <div><span class="ant-tag ant-tag-has-color" style="background-color: rgb(255, 85, 0);">
+      #f50
+    </span> <span class="ant-tag ant-tag-has-color" style="background-color: rgb(45, 183, 245);">
+      #2db7f5
+    </span> <span class="ant-tag ant-tag-has-color" style="background-color: rgb(135, 208, 104);">
+      #87d068
+    </span> <span class="ant-tag ant-tag-has-color" style="background-color: rgb(16, 142, 233);">
+      #108ee9
+    </span></div>
+</div>
+`;
+
+exports[`renders ./antdv-demo/docs/tag/demo/control.md correctly 1`] = `
+<div><span class="ant-tag">
+      Unremovable
+    </span><span class="ant-tag">
+      Tag 2
+    <i aria-label="icon: close" tabindex="-1" class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span><span class="ant-tag">
+        Tag 3Tag 3Tag 3Tag 3...
+      <i aria-label="icon: close" tabindex="-1" class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span> <span class="ant-tag" style="border-style: dashed; background: rgb(255, 255, 255);"><i aria-label="icon: plus" class="anticon anticon-plus"><svg viewBox="64 64 896 896" data-icon="plus" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"></path><path d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"></path></svg></i> New Tag
+  </span></div>
+`;
+
+exports[`renders ./antdv-demo/docs/tag/demo/controlled.md correctly 1`] = `
+<div><span class="ant-tag">
+    Movies
+  <i aria-label="icon: close" tabindex="-1" class="anticon anticon-close"><svg viewBox="64 64 896 896" data-icon="close" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path></svg></i></span> <br> <button type="button" class="ant-btn ant-btn-sm"><span>Toggle</span></button></div>
+`;
+
+exports[`renders ./antdv-demo/docs/tag/demo/hot-tags.md correctly 1`] = `
+<div><span>Categories:</span>
+  <div class="ant-tag ant-tag-checkable">
+    Movies
+  </div>
+  <div class="ant-tag ant-tag-checkable">
+    Books
+  </div>
+  <div class="ant-tag ant-tag-checkable">
+    Music
+  </div>
+  <div class="ant-tag ant-tag-checkable">
+    Sports
+  </div>
+</div>
+`;

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

@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Tag visibility can be controlled by visible with hidden as initial value 1`] = `<span class="ant-tag" style="display: none;"></span>`;
+
+exports[`Tag visibility can be controlled by visible with hidden as initial value 2`] = `<span class="ant-tag" style=""></span>`;
+
+exports[`Tag visibility can be controlled by visible with hidden as initial value 3`] = `<span class="ant-tag" style="display: none;"></span>`;
+
+exports[`Tag visibility can be controlled by visible with visible as initial value 1`] = `<span class="ant-tag"></span>`;
+
+exports[`Tag visibility can be controlled by visible with visible as initial value 2`] = `<span class="ant-tag" style="display: none;"></span>`;
+
+exports[`Tag visibility can be controlled by visible with visible as initial value 3`] = `<span class="ant-tag" style=""></span>`;

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

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

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

@@ -0,0 +1,82 @@
+import { mount } from '@vue/test-utils';
+import { asyncExpect } from '@/tests/utils';
+import Tag from '..';
+import mountTest from '../../../tests/shared/mountTest';
+
+describe('Tag', () => {
+  mountTest(Tag);
+  mountTest(Tag.CheckableTag);
+  it('should be closable', async () => {
+    const onClose = jest.fn();
+    const wrapper = mount(
+      {
+        render() {
+          return <Tag closable onClose={onClose} />;
+        },
+      },
+      { sync: false, attachToDocument: true },
+    );
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-close').length).toBe(1);
+      expect(wrapper.findAll('.ant-tag').filter(w => w.isVisible()).length).toBe(1);
+      wrapper.find('.anticon-close').trigger('click');
+      expect(onClose).toBeCalled();
+    });
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.ant-tag').filter(w => w.isVisible()).length).toBe(0);
+    });
+  });
+
+  it('should not be closed when prevent default', async () => {
+    const onClose = e => {
+      e.preventDefault();
+    };
+    const wrapper = mount(
+      {
+        render() {
+          return <Tag closable onClose={onClose} />;
+        },
+      },
+      { sync: false },
+    );
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-close').length).toBe(1);
+      expect(wrapper.findAll('.ant-tag').filter(w => w.isVisible()).length).toBe(1);
+      wrapper.find('.anticon-close').trigger('click');
+    });
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.ant-tag').filter(w => w.isVisible()).length).toBe(1);
+    }, 0);
+  });
+  describe('visibility', () => {
+    it('can be controlled by visible with visible as initial value', async () => {
+      const wrapper = mount(Tag, { propsData: { visible: true }, sync: false });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+        wrapper.setProps({ visible: false });
+      });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+        wrapper.setProps({ visible: true });
+      });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+      });
+    });
+
+    it('can be controlled by visible with hidden as initial value', async () => {
+      const wrapper = mount(Tag, { propsData: { visible: false }, sync: false });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+        wrapper.setProps({ visible: true });
+      });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+        wrapper.setProps({ visible: false });
+      });
+      await asyncExpect(() => {
+        expect(wrapper.html()).toMatchSnapshot();
+      });
+    });
+  });
+});

package/src/components/tag/index.js

@@ -0,0 +1,14 @@
+import Tag from './Tag';
+import CheckableTag from './CheckableTag';
+import Base from '../base';
+
+Tag.CheckableTag = CheckableTag;
+
+/* istanbul ignore next */
+Tag.install = function(Vue) {
+  Vue.use(Base);
+  Vue.component(Tag.name, Tag);
+  Vue.component(Tag.CheckableTag.name, Tag.CheckableTag);
+};
+
+export default Tag;

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

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

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

@@ -0,0 +1,106 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+
+@tag-prefix-cls: ~'@{ant-prefix}-tag';
+
+.@{tag-prefix-cls} {
+  .reset-component;
+
+  display: inline-block;
+  height: auto;
+  margin-right: 8px;
+  padding: 0 7px;
+  font-size: @tag-font-size;
+  line-height: 20px;
+  white-space: nowrap;
+  background: @tag-default-bg;
+  border: @border-width-base @border-style-base @border-color-base;
+  border-radius: @border-radius-base;
+  cursor: default;
+  opacity: 1;
+  transition: all 0.3s @ease-in-out-circ;
+
+  &:hover {
+    opacity: 0.85;
+  }
+
+  &,
+  a,
+  a:hover {
+    color: @tag-default-color;
+  }
+
+  > a:first-child:last-child {
+    display: inline-block;
+    margin: 0 -8px;
+    padding: 0 8px;
+  }
+
+  .@{iconfont-css-prefix}-close {
+    .iconfont-size-under-12px(10px);
+
+    margin-left: 3px;
+    color: @text-color-secondary;
+    font-weight: bold;
+    cursor: pointer;
+    transition: all 0.3s @ease-in-out-circ;
+
+    &:hover {
+      color: @heading-color;
+    }
+  }
+
+  &-has-color {
+    border-color: transparent;
+    &,
+    a,
+    a:hover,
+    .@{iconfont-css-prefix}-close,
+    .@{iconfont-css-prefix}-close:hover {
+      color: @text-color-inverse;
+    }
+  }
+
+  &-checkable {
+    background-color: transparent;
+    border-color: transparent;
+    &:not(&-checked):hover {
+      color: @primary-color;
+    }
+    &:active,
+    &-checked {
+      color: @text-color-inverse;
+    }
+    &-checked {
+      background-color: @primary-6;
+    }
+    &:active {
+      background-color: @primary-7;
+    }
+  }
+
+  &-hidden {
+    display: none;
+  }
+
+  // mixin to iterate over colors and create CSS class for each one
+  .make-color-classes(@i: length(@preset-colors)) when (@i > 0) {
+    .make-color-classes(@i - 1);
+    @color: extract(@preset-colors, @i);
+    @lightColor: '@{color}-1';
+    @lightBorderColor: '@{color}-3';
+    @darkColor: '@{color}-6';
+    &-@{color} {
+      color: @@darkColor;
+      background: @@lightColor;
+      border-color: @@lightBorderColor;
+    }
+    &-@{color}-inverse {
+      color: @text-color-inverse;
+      background: @@darkColor;
+      border-color: @@darkColor;
+    }
+  }
+
+  .make-color-classes();
+}

package/src/components/time-picker/__tests__/__snapshots__/demo.test.js.snap

@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/12hours.md correctly 1`] = `<div><span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span></div>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/addon.md correctly 1`] = `<div><span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span></div>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/basic.md correctly 1`] = `<span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/disabled.md correctly 1`] = `<span class="ant-time-picker"><input type="text" placeholder="Select time" disabled="disabled" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/hide-column.md correctly 1`] = `
+<span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span><i aria-label="icon: close-circle" tabindex="-1" class="anticon anticon-close-circle ant-time-picker-clear"><svg viewBox="64 64 896 896" data-icon="close-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 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
+  </svg></i></span>
+`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/interval-options.md correctly 1`] = `<span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/size.md correctly 1`] = `
+<div><span class="ant-time-picker ant-time-picker-large"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span><i aria-label="icon: close-circle" tabindex="-1" class="anticon anticon-close-circle ant-time-picker-clear"><svg viewBox="64 64 896 896" data-icon="close-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 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
+    </svg></i></span> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span><i aria-label="icon: close-circle" tabindex="-1" class="anticon anticon-close-circle ant-time-picker-clear"><svg viewBox="64 64 896 896" data-icon="close-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 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
+    </svg></i></span> <span class="ant-time-picker ant-time-picker-small"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span><i aria-label="icon: close-circle" tabindex="-1" class="anticon anticon-close-circle ant-time-picker-clear"><svg viewBox="64 64 896 896" data-icon="close-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 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
+    </svg></i></span></div>
+`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/suffix.md correctly 1`] = `<span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: smile" class="anticon anticon-smile ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="smile" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"></path></svg></i></span></span>`;
+
+exports[`renders ./antdv-demo/docs/time-picker/demo/value.md correctly 1`] = `
+<div>
+  <p>use value and @change</p> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span> <br> <br>
+  <p>v-model</p> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span> <br> <br>
+  <p>Do not change</p> <span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span><i aria-label="icon: close-circle" tabindex="-1" class="anticon anticon-close-circle ant-time-picker-clear"><svg viewBox="64 64 896 896" data-icon="close-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 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path>
+    </svg></i></span>
+</div>
+`;

package/src/components/time-picker/__tests__/__snapshots__/index.test.js.snap

@@ -0,0 +1,5 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TimePicker not render clean icon when allowClear is false 1`] = `<span class="ant-time-picker"><input type="text" placeholder="Select time" readonly="true" class="ant-time-picker-input"><span class="ant-time-picker-icon"><i aria-label="icon: clock-circle" class="anticon anticon-clock-circle ant-time-picker-clock-icon"><svg viewBox="64 64 896 896" data-icon="clock-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="M686.7 638.6L544.1 535.5V288c0-4.4-3.6-8-8-8H488c-4.4 0-8 3.6-8 8v275.4c0 2.6 1.2 5 3.3 6.5l165.4 120.6c3.6 2.6 8.6 1.8 11.2-1.7l28.6-39c2.6-3.7 1.8-8.7-1.8-11.2z"></path></svg></i></span></span>`;
+
+exports[`TimePicker renders addon correctly 1`] = `<div class="ant-time-picker-panel-addon"><button type="button">Ok</button></div>`;

package/src/components/time-picker/__tests__/demo.test.js

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