@king-design/vue 2.0.0-beta.0

package/components/timepicker/index.spec.js

@@ -0,0 +1,425 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import BasicDemo from '~/components/timepicker/demos/basic';
+import RangeDemo from '~/components/timepicker/demos/range';
+import StepDemo from '~/components/timepicker/demos/step';
+import StepRangeDemo from '~/components/timepicker/demos/stepRange';
+import FormatDemo from '~/components/timepicker/demos/format';
+import { mount, unmount, dispatchEvent, getElement, wait } from '../../test/utils';
+import { Timepicker } from 'kpc';
+import { Component } from 'intact-vue-next';
+describe('Timepicker', function () {
+  afterEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            unmount();
+            _context.next = 3;
+            return wait(400);
+
+          case 3:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })));
+  it('select time', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _mount, instance, element, _element$querySelecto, picker1, picker2, dropdown, next, ok, ok2, _picker2$querySelecto, close;
+
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+            _element$querySelecto = element.querySelectorAll('.k-select'), picker1 = _element$querySelecto[0], picker2 = _element$querySelecto[1];
+            picker1.click();
+            _context2.next = 5;
+            return wait(300);
+
+          case 5:
+            dropdown = getElement('.k-time-content');
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            next = dropdown.querySelector('.k-scroll-select-item:nth-child(11)');
+            next.click();
+            _context2.next = 11;
+            return wait();
+
+          case 11:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            expect(instance.get('time')).to.be.null;
+            next.click();
+            _context2.next = 16;
+            return wait();
+
+          case 16:
+            expect(instance.get('time')).to.be.null;
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            ok = dropdown.querySelector('.k-btn');
+            ok.click();
+            _context2.next = 22;
+            return wait(300);
+
+          case 22:
+            expect(instance.get('time')).to.eql('02:00:00');
+            expect(dropdown.style.display).to.eql('none'); // set time
+
+            instance.set('time', '03:03:03');
+            picker1.click();
+            _context2.next = 28;
+            return wait(300);
+
+          case 28:
+            expect(dropdown.innerHTML).to.matchSnapshot(); // multiple
+
+            picker2.click();
+            _context2.next = 32;
+            return wait(300);
+
+          case 32:
+            dropdown = getElement('.k-time-content');
+            dropdown.querySelector('.k-scroll-select-item:nth-child(11)').click();
+            ok2 = dropdown.querySelector('.k-btn');
+            ok2.click();
+            dropdown.querySelector('.k-scroll-select-item:nth-child(12)').click();
+            ok2.click();
+            _context2.next = 40;
+            return wait();
+
+          case 40:
+            expect(instance.get('timeArray')).to.eql(['01:00:00', '02:00:00']); // click the same time will do nothing
+
+            ok2.click();
+            _context2.next = 44;
+            return wait();
+
+          case 44:
+            expect(instance.get('timeArray')).to.eql(['01:00:00', '02:00:00']); // remove one value
+
+            _picker2$querySelecto = picker2.querySelectorAll('.k-select-close'), close = _picker2$querySelecto[1];
+            close.click();
+            _context2.next = 49;
+            return wait();
+
+          case 49:
+            expect(instance.get('timeArray')).to.eql(['01:00:00']);
+            expect(dropdown.innerHTML).to.matchSnapshot(); // clear
+
+            picker2.querySelector('.k-select-clear').click();
+            _context2.next = 54;
+            return wait();
+
+          case 54:
+            expect(instance.get('timeArray')).to.eql([]);
+            ok2.click();
+            _context2.next = 58;
+            return wait();
+
+          case 58:
+            expect(instance.get('timeArray')).to.eql(['00:00:00']); // set value
+
+            instance.set('timeArray', ['03:03:03', '03:03:04']);
+            _context2.next = 62;
+            return wait();
+
+          case 62:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+
+          case 63:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  })));
+  it('range', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+    var _mount2, instance, element, picker, dropdown, _dropdown$querySelect, start, end;
+
+    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            _mount2 = mount(RangeDemo), instance = _mount2[0], element = _mount2[1];
+            picker = element.querySelector('.k-select');
+            picker.click();
+            _context3.next = 5;
+            return wait(300);
+
+          case 5:
+            dropdown = getElement('.k-time-content');
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            _dropdown$querySelect = dropdown.querySelectorAll('.k-datepicker-calendar-wrapper'), start = _dropdown$querySelect[0], end = _dropdown$querySelect[1];
+            start.querySelector('.k-active').nextElementSibling.click();
+            _context3.next = 11;
+            return wait();
+
+          case 11:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            end.querySelector('.k-active').nextElementSibling.nextElementSibling.click();
+            _context3.next = 15;
+            return wait();
+
+          case 15:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            dropdown.querySelector('.k-btn').click();
+            _context3.next = 19;
+            return wait();
+
+          case 19:
+            expect(instance.get('time')).to.eql(['01:00:00', '02:00:00']);
+
+          case 20:
+          case "end":
+            return _context3.stop();
+        }
+      }
+    }, _callee3);
+  })));
+  it('step', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+    var _mount3, instance, element, picker, dropdown;
+
+    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            _mount3 = mount(StepDemo), instance = _mount3[0], element = _mount3[1];
+            picker = element.querySelector('.k-select');
+            picker.click();
+            _context4.next = 5;
+            return wait();
+
+          case 5:
+            dropdown = getElement('.k-select-menu');
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            dropdown.querySelector('.k-select-option').click();
+            expect(instance.get('time')).to.eql('00:00:00');
+
+          case 9:
+          case "end":
+            return _context4.stop();
+        }
+      }
+    }, _callee4);
+  })));
+  it('step range', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+    var _mount4, instance, element, picker, dropdown, _dropdown$querySelect2, start, end;
+
+    return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+      while (1) {
+        switch (_context5.prev = _context5.next) {
+          case 0:
+            _mount4 = mount(StepRangeDemo), instance = _mount4[0], element = _mount4[1];
+            picker = element.querySelector('.k-select');
+            picker.click();
+            _context5.next = 5;
+            return wait();
+
+          case 5:
+            dropdown = getElement('.k-time-content');
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            _dropdown$querySelect2 = dropdown.querySelectorAll('.k-datepicker-calendar-wrapper'), start = _dropdown$querySelect2[0], end = _dropdown$querySelect2[1];
+            start.querySelector('.k-active').nextElementSibling.click();
+            _context5.next = 11;
+            return wait();
+
+          case 11:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            end.querySelector('.k-active').nextElementSibling.click();
+            _context5.next = 15;
+            return wait();
+
+          case 15:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            dropdown.querySelector('.k-btn').click();
+            expect(instance.get('time')).to.eql(['00:30:00', '00:30:00']);
+
+          case 18:
+          case "end":
+            return _context5.stop();
+        }
+      }
+    }, _callee5);
+  })));
+  it('format', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
+    var _mount5, instance, element, _element$querySelecto2, input1, input2, input3, content, _content$querySelecto, scroll1, scroll2;
+
+    return _regeneratorRuntime.wrap(function _callee6$(_context6) {
+      while (1) {
+        switch (_context6.prev = _context6.next) {
+          case 0:
+            _mount5 = mount(FormatDemo), instance = _mount5[0], element = _mount5[1];
+            _element$querySelecto2 = element.querySelectorAll('.k-select'), input1 = _element$querySelecto2[0], input2 = _element$querySelecto2[1], input3 = _element$querySelecto2[2];
+            input1.click();
+            _context6.next = 5;
+            return wait();
+
+          case 5:
+            content = getElement('.k-time-content');
+            expect(content.innerHTML).to.matchSnapshot(); // is '02'
+
+            content.querySelector('.k-scroll-select-item:nth-child(12)').click();
+            _context6.next = 10;
+            return wait();
+
+          case 10:
+            content.querySelector('.k-btn').click();
+            _context6.next = 13;
+            return wait();
+
+          case 13:
+            expect(instance.get('time1')).to.eql('02:00 am');
+            expect(input1.innerHTML).to.matchSnapshot();
+            input2.click();
+            _context6.next = 18;
+            return wait();
+
+          case 18:
+            content = getElement('.k-select-menu');
+            expect(content.innerHTML).to.matchSnapshot();
+            content.querySelector('.k-select-option').click();
+            _context6.next = 23;
+            return wait();
+
+          case 23:
+            expect(instance.get('time2')).to.eql('00:00:00');
+            expect(input2.innerHTML).to.matchSnapshot();
+            input3.click();
+            _context6.next = 28;
+            return wait();
+
+          case 28:
+            content = getElement('.k-time-content');
+            expect(content.innerHTML).to.matchSnapshot();
+            _content$querySelecto = content.querySelectorAll('.k-scroll-select'), scroll1 = _content$querySelecto[0], scroll2 = _content$querySelecto[1];
+            scroll1.querySelector('.k-scroll-select-item:nth-child(11)').click();
+            scroll2.querySelector('.k-scroll-select-item:nth-child(12)').click();
+            _context6.next = 35;
+            return wait();
+
+          case 35:
+            expect(content.innerHTML).to.matchSnapshot();
+            content.querySelector('.k-btn').click();
+            _context6.next = 39;
+            return wait();
+
+          case 39:
+            expect(instance.get('time3')).eql(['00:30:00.000', '01:00:00.000']);
+            expect(input3.innerHTML).to.matchSnapshot();
+
+          case 41:
+          case "end":
+            return _context6.stop();
+        }
+      }
+    }, _callee6);
+  })));
+  it('can input', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
+    var Demo, _mount6, instance, element, _element$querySelecto3, basicInput, multipleInput, rangeInput, formatInput, input;
+
+    return _regeneratorRuntime.wrap(function _callee8$(_context9) {
+      while (1) {
+        switch (_context9.prev = _context9.next) {
+          case 0:
+            Demo = /*#__PURE__*/function (_Component) {
+              _inheritsLoose(Demo, _Component);
+
+              function Demo() {
+                var _context7;
+
+                var _this;
+
+                for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+                  args[_key] = arguments[_key];
+                }
+
+                _this = _Component.call.apply(_Component, _concatInstanceProperty(_context7 = [this]).call(_context7, args)) || this;
+                _this.Timepicker = Timepicker;
+                return _this;
+              }
+
+              return Demo;
+            }(Component);
+
+            Demo.template = "\n                const {Timepicker} = this;\n                <div>\n                    <Timepicker v-model=\"basic\" min=\"01:34:56\" max=\"15:02:59\" />\n                    <Timepicker v-model=\"multiple\" multiple />\n                    <Timepicker v-model=\"range\" range min=\"01:34:56\" max=\"15:02:59\" />\n                    <Timepicker v-model=\"format\" range step=\"00:30:00\" valueFormat=\"HH:mm:ss.SSS\" showFormat=\"HH:mm\"/>\n                </div>\n            ";
+            _mount6 = mount(Demo), instance = _mount6[0], element = _mount6[1];
+            _element$querySelecto3 = element.querySelectorAll('.k-input-inner'), basicInput = _element$querySelecto3[0], multipleInput = _element$querySelecto3[1], rangeInput = _element$querySelecto3[2], formatInput = _element$querySelecto3[3];
+
+            input = /*#__PURE__*/function () {
+              var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7(_input, value) {
+                return _regeneratorRuntime.wrap(function _callee7$(_context8) {
+                  while (1) {
+                    switch (_context8.prev = _context8.next) {
+                      case 0:
+                        _input.value = value;
+                        dispatchEvent(_input, 'input');
+                        _context8.next = 4;
+                        return wait();
+
+                      case 4:
+                      case "end":
+                        return _context8.stop();
+                    }
+                  }
+                }, _callee7);
+              }));
+
+              return function input(_x, _x2) {
+                return _ref8.apply(this, arguments);
+              };
+            }(); // input disabled value
+
+
+            _context9.next = 7;
+            return input(basicInput, '01:01:01');
+
+          case 7:
+            expect(instance.get('basic')).to.eql(undefined); // input correct value
+
+            _context9.next = 10;
+            return input(basicInput, '03:03:03');
+
+          case 10:
+            expect(instance.get('basic')).to.eql('03:03:03'); // input multple values
+
+            _context9.next = 13;
+            return input(multipleInput, '01:01:01');
+
+          case 13:
+            expect(instance.get('multiple')).to.eql(['01:01:01']);
+            _context9.next = 16;
+            return input(multipleInput, '02:02:02');
+
+          case 16:
+            expect(instance.get('multiple')).to.eql(['01:01:01', '02:02:02']); // input disabled range value
+
+            _context9.next = 19;
+            return input(rangeInput, '01:01:01~05:05:05');
+
+          case 19:
+            expect(instance.get('range')).to.eql(undefined); // input correct range value
+
+            _context9.next = 22;
+            return input(rangeInput, '03:03:03~05:05:05');
+
+          case 22:
+            expect(instance.get('range')).to.eql(['03:03:03', '05:05:05']); // input correct formated value
+
+            _context9.next = 25;
+            return input(formatInput, '01:00~02:00');
+
+          case 25:
+            expect(instance.get('format')).to.eql(['01:00:00.000', '02:00:00.000']);
+
+          case 26:
+          case "end":
+            return _context9.stop();
+        }
+      }
+    }, _callee8);
+  })));
+});
+
+export {normalize} from 'intact-vue-next';

package/components/timepicker/panelPicker.d.ts

@@ -0,0 +1,57 @@
+import { TypeDefs } from 'intact-vue-next';
+import { BasePicker } from '../datepicker/basepicker';
+import dayjs from '../datepicker/dayjs';
+import { State } from '../../hooks/useState';
+import { PanelTypes } from '../datepicker/usePanel';
+import { TimepickerProps, TimepickerEvents, TimepickerBlocks } from './constants';
+export declare class PanelPicker<Multipe extends boolean = false, Range extends boolean = false> extends BasePicker<TimepickerProps<Multipe, Range>, TimepickerEvents, TimepickerBlocks> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<TimepickerProps<boolean, boolean>>>;
+    formats: {
+        getValueFormat: () => string;
+        getShowFormat: () => string;
+        createDateByValueFormat: (value: import("../datepicker/basepicker").Value) => dayjs.Dayjs;
+        createDateByShowFormat: (value: import("../datepicker/basepicker").Value) => dayjs.Dayjs;
+        getShowString: (value: dayjs.Dayjs) => string;
+        getValueString: (value: dayjs.Dayjs) => string;
+    };
+    disabled: {
+        isDisabled: (value: dayjs.Dayjs, type?: dayjs.OpUnitType) => boolean;
+        isDisabledConfirm: () => boolean;
+        maxDate: State<dayjs.Dayjs | null>;
+        minDate: State<dayjs.Dayjs | null>;
+        isDisabledTime: (value: dayjs.Dayjs, flag: import("../datepicker/usePanel").PanelFlags) => boolean;
+        isDisabledTimeByStep: (value: string, flag: import("../datepicker/usePanel").PanelFlags) => boolean;
+    };
+    panel: {
+        startPanel: State<PanelTypes>;
+        endPanel: State<PanelTypes>;
+        changePanel: (type: PanelTypes, flag?: import("../datepicker/usePanel").PanelFlags) => void;
+        getPanel: (flag: import("../datepicker/usePanel").PanelFlags) => State<PanelTypes>;
+        reset: () => void;
+        startRef: import("intact").RefObject<import("../datepicker/calendar").DatepickerCalendar>;
+        endRef: import("intact").RefObject<import("../datepicker/calendar").DatepickerCalendar>;
+    };
+    value: {
+        format: () => string | string[];
+        onConfirm: () => void;
+        getTimeValue: (flag: import("../datepicker/usePanel").PanelFlags) => dayjs.Dayjs | null | undefined;
+        convertToDayjs: (v: import("../datepicker/basepicker").Value | [import("../datepicker/basepicker").Value, import("../datepicker/basepicker").Value] | import("../datepicker/basepicker").Value[] | [import("../datepicker/basepicker").Value, import("../datepicker/basepicker").Value][] | null | undefined) => import("../datepicker/basepicker").DayjsValue;
+        value: State<import("../datepicker/basepicker").StateValue>;
+        setValue: (v: import("../datepicker/basepicker").StateValueItem, fromInput: boolean) => void;
+        getDayjsValue: () => import("../datepicker/basepicker").DayjsValue;
+        onChangeTime: (date: dayjs.Dayjs, flag: import("../datepicker/usePanel").PanelFlags) => void;
+        onChangeTimeByStep: (v: string, flag: import("../datepicker/usePanel").PanelFlags) => void;
+    };
+    step: {
+        options: State<{
+            value: string;
+            label: string;
+        }[] | null>;
+    };
+    protected getPlaceholder(): string | number | boolean | import("misstime/dist/utils/types").VNode<any> | import("intact").Children[];
+    protected getLabel(): string | string[];
+}
+
+
+export {normalize} from 'intact-vue-next';

package/components/timepicker/panelPicker.js

@@ -0,0 +1,55 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import template from './panelPicker.vdt';
+import { BasePicker } from '../datepicker/basepicker';
+import { isNullOrUndefined } from 'intact-shared';
+import { _$ } from '../../i18n';
+import { useFormats } from './useFormats';
+import { useValue } from './useValue';
+import { useDisabled } from './useDisabled';
+import { usePanel } from '../datepicker/usePanel';
+import { PanelTypes } from '../datepicker/usePanel';
+import { useStep } from './useStep';
+import { typeDefs } from './constants';
+export var PanelPicker = /*#__PURE__*/function (_BasePicker) {
+  _inheritsLoose(PanelPicker, _BasePicker);
+
+  function PanelPicker() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _BasePicker.call.apply(_BasePicker, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.formats = useFormats();
+    _this.disabled = useDisabled(_this.formats);
+    _this.panel = usePanel(PanelTypes.Time);
+    _this.value = useValue(_this.formats, _this.disabled, _this.panel);
+    _this.step = useStep(_this.disabled, _this.formats);
+    return _this;
+  }
+
+  var _proto = PanelPicker.prototype;
+
+  _proto.getPlaceholder = function getPlaceholder() {
+    var _this$get = this.get(),
+        placeholder = _this$get.placeholder,
+        range = _this$get.range;
+
+    if (!isNullOrUndefined(placeholder)) return placeholder;
+    return range ? _$('开始时间 ~ 结束时间') : _$('请选择时间');
+  };
+
+  _proto.getLabel = function getLabel() {
+    return this.value.format();
+  };
+
+  return PanelPicker;
+}(BasePicker);
+PanelPicker.template = template;
+PanelPicker.typeDefs = typeDefs;
+
+export {normalize} from 'intact-vue-next';

package/components/timepicker/panelPicker.vdt.js

@@ -0,0 +1,109 @@
+import { createElementVNode as _$ce, createUnknownComponentVNode as _$cc, superCall as _$su, extend as _$ex, EMPTY_OBJ as _$em, className as _$cn, createTextVNode as _$ct } from 'intact-vue-next';
+import { Icon } from '../icon';
+import { DropdownMenu } from '../dropdown';
+import { makePanelStyles } from './styles';
+import { DatepickerTime } from '../datepicker/time';
+import { _$ } from '../../i18n';
+import { Button } from '../button';
+import { PanelFlags } from '../datepicker/usePanel';
+import { last } from '../datepicker/helpers';
+import { ScrollSelect } from '../scrollSelect';
+var _$tmp0 = {
+  'className': 'k-timepicker'
+};
+var _$tmp1 = {
+  'className': 'k-icon-time'
+};
+export default function ($props, $blocks, $__proto__) {
+  var _classNameObj;
+
+  $blocks || ($blocks = {});
+  $props || ($props = {});
+  var $this = this;
+
+  var _this$get = this.get(),
+      className = _this$get.className,
+      range = _this$get.range,
+      multiple = _this$get.multiple;
+
+  var _this$value = this.value,
+      value = _this$value.value.value,
+      onConfirm = _this$value.onConfirm,
+      onChangeTime = _this$value.onChangeTime,
+      onChangeTimeByStep = _this$value.onChangeTimeByStep,
+      getTimeValue = _this$value.getTimeValue;
+  var lastValue = last(value);
+  var classNameObj = (_classNameObj = {
+    'k-time-content': true,
+    'k-range': range
+  }, _classNameObj[className] = className, _classNameObj[makePanelStyles()] = true, _classNameObj);
+  var options = this.step.options.value;
+  var _this$disabled = this.disabled,
+      isDisabledTime = _this$disabled.isDisabledTime,
+      isDisabledTimeByStep = _this$disabled.isDisabledTimeByStep,
+      isDisabledConfirm = _this$disabled.isDisabledConfirm;
+  var _this$formats = this.formats,
+      getValueFormat = _this$formats.getValueFormat,
+      getValueString = _this$formats.getValueString;
+
+  var generatePanel = function generatePanel(flag) {
+    var timeValue = getTimeValue(flag);
+    return _$ce(2, 'div', [range ? _$ce(2, 'div', flag === PanelFlags.Start ? _$('开始时间') : _$('结束时间'), 0, 'k-timepicker-title') : undefined, !options ? _$cc(DatepickerTime, {
+      'value': timeValue,
+      'ev-$change:value': function ev$changeValue(v) {
+        return onChangeTime(v, flag);
+      },
+      'format': getValueFormat(),
+      'flag': flag,
+      'isDisabledTime': isDisabledTime
+    }) : _$ce(2, 'div', _$cc(ScrollSelect, {
+      'value': timeValue ? getValueString(timeValue) : timeValue,
+      'ev-$change:value': function ev$changeValue(v) {
+        return onChangeTimeByStep(v, flag);
+      },
+      'data': options,
+      'disable': function disable(v) {
+        return isDisabledTimeByStep(v, flag);
+      }
+    }), 2, 'k-datepicker-time')], 0, 'k-datepicker-calendar-wrapper');
+  };
+
+  return _$su.call($this, _$tmp0, function ($blocks) {
+    var _$blocks = {},
+        __$blocks = _$ex({}, $blocks);
+
+    return (_$blocks['base-menu'] = function ($super) {
+      return _$cc(DropdownMenu, {
+        'className': _$cn(classNameObj),
+        'children': _$ce(2, 'div', [_$ce(2, 'div', [generatePanel(PanelFlags.Start), _$ct('\n                    '), range ? generatePanel(PanelFlags.End) : null], 0, 'k-datepicker-calendars'), _$ce(2, 'div', _$cc(Button, {
+          'type': 'primary',
+          'size': 'small',
+          'disabled': isDisabledConfirm(),
+          'ev-click': onConfirm,
+          'children': _$('确定')
+        }), 2, 'k-datepicker-footer')], 4, 'k-datepicker-wrapper')
+      });
+    }, __$blocks['base-menu'] = function ($super, data) {
+      var block = $blocks['base-menu'];
+
+      var callBlock = function callBlock() {
+        return _$blocks['base-menu'].call($this, $super, data);
+      };
+
+      return block ? block.call($this, callBlock, data) : callBlock();
+    }), (_$blocks['suffix'] = function ($super) {
+      return _$cc(Icon, _$tmp1);
+    }, __$blocks['suffix'] = function ($super, data) {
+      var block = $blocks['suffix'];
+
+      var callBlock = function callBlock() {
+        return _$blocks['suffix'].call($this, $super, data);
+      };
+
+      return block ? block.call($this, callBlock, data) : callBlock();
+    }), __$blocks;
+  }.call($this, $blocks), $__proto__);
+}
+;
+
+export {normalize} from 'intact-vue-next';

package/components/timepicker/selectPicker.d.ts

@@ -0,0 +1,30 @@
+import { Component, TypeDefs } from 'intact-vue-next';
+import { TimepickerProps, TimepickerEvents, TimepickerBlocks } from './constants';
+export declare class SelectPicker extends Component<TimepickerProps, TimepickerEvents, TimepickerBlocks> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<TimepickerProps<boolean, boolean>>>;
+    formats: {
+        getValueFormat: () => string;
+        getShowFormat: () => string;
+        createDateByValueFormat: (value: import("../datepicker/basepicker").Value) => import("dayjs").Dayjs;
+        createDateByShowFormat: (value: import("../datepicker/basepicker").Value) => import("dayjs").Dayjs;
+        getShowString: (value: import("dayjs").Dayjs) => string;
+        getValueString: (value: import("dayjs").Dayjs) => string;
+    };
+    disabled: {
+        isDisabled: (value: import("dayjs").Dayjs, type?: import("dayjs").OpUnitType) => boolean;
+        isDisabledTime: (value: import("dayjs").Dayjs, flag: import("../datepicker/usePanel").PanelFlags) => boolean;
+        isDisabledConfirm: () => boolean;
+        maxDate: import("../../hooks/useState").State<import("dayjs").Dayjs | null>;
+        minDate: import("../../hooks/useState").State<import("dayjs").Dayjs | null>;
+    };
+    step: {
+        options: import("../../hooks/useState").State<{
+            value: string;
+            label: string;
+        }[] | null>;
+    };
+}
+
+
+export {normalize} from 'intact-vue-next';