@opentiny/vue-renderless 3.6.0 → 3.6.1-alpha.2

package/picker/vue.js

@@ -1,14 +1,80 @@
-import { getPanel, getType, watchIsRange, parseAsFormatAndType, watchPickerVisible, getValueEmpty, getMode, displayValue, typeValueResolveMap, formatAsFormatAndType, dateFormatter, dateParser, rangeFormatter, rangeParser, parsedValue, firstInputId, secondInputId, focus, blur, parseValue, formatToValue, parseString, formatToString, handleMouseEnter, handleChange, handleStartInput, handleEndInput, handleStartChange, handleEndChange, handleClose, handleFocus, handleKeydown, hidePicker, showPicker, emitInput, isValidValue, emitChange, mountPicker, updateOptions, handleClickIcon, handlePick, handleSelectRange, getTimezone, getValueFormat, watchModelValue, computedFormat, computedTriggerClass, computedHaveTrigger, intiPopper, initGlobalTimezone, emitDbTime } from './index';
-import { DATEPICKER } from '@opentiny/vue-renderless/common';
-export var api = ['state', 'btnClick', 'handleEndChange', 'handleEndInput', 'focus', 'handleFocus', 'handleStartChange', 'handleStartInput', 'handleKeydown', 'handleMouseEnter', 'handleClickIcon', 'handleMouseEnter', 'handleChange', 'handleClose', 'handlePick', 'handleSelectRange', 'handleSelectChange', 'popperElm'];
-var initState = function initState(_ref) {
-  var api = _ref.api,
-    reactive = _ref.reactive,
-    refs = _ref.refs,
-    computed = _ref.computed,
-    props = _ref.props,
-    utils = _ref.utils;
-  var state = reactive({
+import "../chunk-PKUHTIDK.js";
+import {
+  getPanel,
+  getType,
+  watchIsRange,
+  parseAsFormatAndType,
+  watchPickerVisible,
+  getValueEmpty,
+  getMode,
+  displayValue,
+  typeValueResolveMap,
+  formatAsFormatAndType,
+  dateFormatter,
+  dateParser,
+  rangeFormatter,
+  rangeParser,
+  parsedValue,
+  firstInputId,
+  secondInputId,
+  focus,
+  blur,
+  parseValue,
+  formatToValue,
+  parseString,
+  formatToString,
+  handleMouseEnter,
+  handleChange,
+  handleStartInput,
+  handleEndInput,
+  handleStartChange,
+  handleEndChange,
+  handleClose,
+  handleFocus,
+  handleKeydown,
+  hidePicker,
+  showPicker,
+  emitInput,
+  isValidValue,
+  emitChange,
+  mountPicker,
+  updateOptions,
+  handleClickIcon,
+  handlePick,
+  handleSelectRange,
+  getTimezone,
+  getValueFormat,
+  watchModelValue,
+  computedFormat,
+  computedTriggerClass,
+  computedHaveTrigger,
+  intiPopper,
+  initGlobalTimezone,
+  emitDbTime
+} from "./index";
+import { DATEPICKER } from "@opentiny/vue-renderless/common";
+const api = [
+  "state",
+  "btnClick",
+  "handleEndChange",
+  "handleEndInput",
+  "focus",
+  "handleFocus",
+  "handleStartChange",
+  "handleStartInput",
+  "handleKeydown",
+  "handleMouseEnter",
+  "handleClickIcon",
+  "handleMouseEnter",
+  "handleChange",
+  "handleClose",
+  "handlePick",
+  "handleSelectRange",
+  "handleSelectChange",
+  "popperElm"
+];
+const initState = ({ api: api2, reactive, refs, computed, props, utils }) => {
+  const state = reactive({
     date: null,
     pickerVisible: false,
     showClose: false,
@@ -16,400 +82,132 @@ var initState = function initState(_ref) {
     valueOnOpen: null,
     popperElm: null,
     unwatchPickerOptions: null,
-    ranged: computed(function () {
-      return state.type.indexOf(DATEPICKER.Range) > -1;
-    }),
-    reference: computed(function () {
-      return refs.reference.$el || refs.reference;
-    }),
-    formDisabled: computed(function () {
-      return (parent.tinyForm || {}).disabled;
-    }),
-    refInput: computed(function () {
-      return state.reference ? [].slice.call(state.reference.querySelectorAll('input')) : [];
-    }),
-    valueIsEmpty: computed(function () {
-      return api.getValueEmpty();
-    }),
-    triggerClass: computed(function () {
-      return api.computedTriggerClass();
-    }),
-    selectionMode: computed(function () {
-      return api.getMode();
-    }),
-    haveTrigger: computed(function () {
-      return api.computedHaveTrigger();
-    }),
-    displayValue: computed(function () {
-      return api.displayValue();
-    }),
-    parsedValue: computed(function () {
-      return api.parsedValue();
-    }),
-    pickerSize: computed(function () {
-      return props.size;
-    }),
-    pickerDisabled: computed(function () {
-      return props.disabled || state.formDisabled;
-    }),
-    firstInputId: computed(function () {
-      return api.firstInputId();
-    }),
-    secondInputId: computed(function () {
-      return api.secondInputId();
-    }),
-    type: computed(function () {
-      return api.getType();
-    }),
-    timezone: computed(function () {
-      return api.getTimezone();
-    }),
-    valueFormat: computed(function () {
-      return getValueFormat({
-        props: props,
-        utils: utils
-      });
-    }),
-    format: computed(function () {
-      return api.computedFormat();
-    })
+    ranged: computed(() => state.type.includes(DATEPICKER.Range)),
+    reference: computed(() => refs.reference.$el || refs.reference),
+    formDisabled: computed(() => (parent.tinyForm || {}).disabled),
+    refInput: computed(() => state.reference ? [].slice.call(state.reference.querySelectorAll("input")) : []),
+    valueIsEmpty: computed(() => api2.getValueEmpty()),
+    triggerClass: computed(() => api2.computedTriggerClass()),
+    selectionMode: computed(() => api2.getMode()),
+    haveTrigger: computed(() => api2.computedHaveTrigger()),
+    displayValue: computed(() => api2.displayValue()),
+    parsedValue: computed(() => api2.parsedValue()),
+    pickerSize: computed(() => props.size),
+    pickerDisabled: computed(() => props.disabled || state.formDisabled),
+    firstInputId: computed(() => api2.firstInputId()),
+    secondInputId: computed(() => api2.secondInputId()),
+    type: computed(() => api2.getType()),
+    timezone: computed(() => api2.getTimezone()),
+    valueFormat: computed(() => getValueFormat({ props, utils })),
+    format: computed(() => api2.computedFormat())
   });
   return state;
 };
-var initApi2 = function initApi2(_ref2) {
-  var api = _ref2.api,
-    props = _ref2.props,
-    state = _ref2.state,
-    t = _ref2.t;
-  Object.assign(api, {
-    t: t,
-    state: state,
+const initApi2 = ({ api: api2, props, state, t }) => {
+  Object.assign(api2, {
+    t,
+    state,
     blur: blur(state),
-    getMode: getMode({
-      state: state
-    }),
-    getType: getType({
-      props: props
-    }),
-    dateParser: dateParser({
-      t: t
-    }),
-    rangeParser: rangeParser(api),
-    rangeFormatter: rangeFormatter(api),
-    dateFormatter: dateFormatter({
-      t: t
-    }),
+    getMode: getMode({ state }),
+    getType: getType({ props }),
+    dateParser: dateParser({ t }),
+    rangeParser: rangeParser(api2),
+    rangeFormatter: rangeFormatter(api2),
+    dateFormatter: dateFormatter({ t }),
     getValueEmpty: getValueEmpty(props),
     handleEndInput: handleEndInput(state),
     handleStartInput: handleStartInput(state),
-    firstInputId: firstInputId({
-      props: props,
-      state: state
-    }),
-    secondInputId: secondInputId({
-      props: props,
-      state: state
-    }),
-    handleMouseEnter: handleMouseEnter({
-      props: props,
-      state: state
-    }),
-    initGlobalTimezone: initGlobalTimezone({
-      api: api,
-      state: state,
-      props: props
-    }),
-    parseValue: parseValue({
-      api: api,
-      props: props,
-      state: state
-    }),
+    firstInputId: firstInputId({ props, state }),
+    secondInputId: secondInputId({ props, state }),
+    handleMouseEnter: handleMouseEnter({ props, state }),
+    initGlobalTimezone: initGlobalTimezone({ api: api2, state, props }),
+    parseValue: parseValue({ api: api2, props, state }),
     handleSelectRange: handleSelectRange(state)
   });
 };
-var initApi = function initApi(_ref3) {
-  var api = _ref3.api,
-    props = _ref3.props,
-    hooks = _ref3.hooks,
-    state = _ref3.state,
-    vnode = _ref3.vnode,
-    others = _ref3.others,
-    utils = _ref3.utils;
-  var t = vnode.t,
-    emit = vnode.emit,
-    refs = vnode.refs,
-    dispatch = vnode.dispatch,
-    nextTick = vnode.nextTick,
-    vm = vnode.vm;
-  var TimePanel = others.TimePanel,
-    TimeRangePanel = others.TimeRangePanel;
-  var _intiPopper = intiPopper({
-      props: props,
-      hooks: hooks,
-      vnode: vnode
-    }),
-    destroyPopper = _intiPopper.destroyPopper,
-    popperElm = _intiPopper.popperElm,
-    updatePopper = _intiPopper.updatePopper;
+const initApi = ({ api: api2, props, hooks, state, vnode, others, utils }) => {
+  const { t, emit, refs, dispatch, nextTick, vm } = vnode;
+  const { TimePanel, TimeRangePanel } = others;
+  const { destroyPopper, popperElm, updatePopper } = intiPopper({ props, hooks, vnode });
   state.popperElm = popperElm;
   state.picker = null;
-  Object.assign(api, {
-    destroyPopper: destroyPopper,
-    emitDbTime: emitDbTime({
-      emit: emit,
-      state: state,
-      t: t
-    }),
-    hidePicker: hidePicker({
-      destroyPopper: destroyPopper,
-      state: state
-    }),
-    handleSelectChange: function handleSelectChange(_ref4) {
-      var tz = _ref4.tz,
-        date = _ref4.date;
-      return emit('select-change', {
-        tz: tz,
-        date: date
-      });
-    },
+  Object.assign(api2, {
+    destroyPopper,
+    emitDbTime: emitDbTime({ emit, state, t }),
+    hidePicker: hidePicker({ destroyPopper, state }),
+    handleSelectChange: ({ tz, date }) => emit("select-change", { tz, date }),
     getPanel: getPanel(others),
-    handleFocus: handleFocus({
-      emit: emit,
-      refs: refs,
-      state: state
-    }),
-    getTimezone: getTimezone({
-      props: props,
-      utils: utils
-    }),
-    emitChange: emitChange({
-      api: api,
-      dispatch: dispatch,
-      emit: emit,
-      props: props,
-      state: state
-    }),
-    parsedValue: parsedValue({
-      api: api,
-      props: props,
-      state: state,
-      t: t
-    }),
-    parseAsFormatAndType: parseAsFormatAndType({
-      api: api
-    }),
-    typeValueResolveMap: typeValueResolveMap({
-      api: api,
-      t: t
-    }),
-    updateOptions: updateOptions({
-      api: api,
-      props: props,
-      state: state
-    }),
-    focus: focus({
-      api: api,
-      props: props,
-      refs: refs
-    }),
-    handleChange: handleChange({
-      api: api,
-      state: state
-    }),
-    isValidValue: isValidValue({
-      api: api,
-      state: state
-    }),
-    emitInput: emitInput({
-      api: api,
-      emit: emit,
-      props: props,
-      state: state
-    }),
-    handleKeydown: handleKeydown({
-      api: api,
-      state: state
-    }),
-    handleEndChange: handleEndChange({
-      api: api,
-      state: state
-    }),
-    handleStartChange: handleStartChange({
-      api: api,
-      state: state
-    }),
-    handleClickIcon: handleClickIcon({
-      api: api,
-      props: props,
-      state: state
-    }),
-    showPicker: showPicker({
-      api: api,
-      nextTick: nextTick,
-      updatePopper: updatePopper,
-      state: state
-    }),
-    formatToValue: formatToValue({
-      api: api,
-      props: props,
-      state: state
-    }),
-    formatAsFormatAndType: formatAsFormatAndType({
-      api: api
-    }),
-    parseString: parseString({
-      api: api,
-      state: state
-    }),
-    handleClose: handleClose({
-      api: api,
-      props: props,
-      state: state
-    }),
-    displayValue: displayValue({
-      api: api,
-      props: props,
-      state: state
-    }),
-    handlePick: handlePick({
-      api: api,
-      state: state
-    }),
-    watchPickerVisible: watchPickerVisible({
-      api: api,
-      vm: vm,
-      dispatch: dispatch,
-      emit: emit,
-      props: props,
-      state: state
-    }),
-    formatToString: formatToString({
-      api: api,
-      state: state
-    }),
-    watchIsRange: watchIsRange({
-      api: api,
-      props: props,
-      state: state,
-      TimePanel: TimePanel,
-      TimeRangePanel: TimeRangePanel
-    }),
-    mountPicker: mountPicker({
-      api: api,
-      vm: vm,
-      props: props,
-      state: state,
-      updatePopper: updatePopper
-    }),
-    watchModelValue: watchModelValue({
-      api: api,
-      props: props,
-      state: state,
-      dispatch: dispatch
-    }),
-    computedFormat: computedFormat({
-      props: props,
-      utils: utils
-    }),
-    computedTriggerClass: computedTriggerClass({
-      props: props,
-      state: state
-    }),
-    computedHaveTrigger: computedHaveTrigger({
-      props: props
-    })
-  });
-  initApi2({
-    api: api,
-    props: props,
-    state: state,
-    t: t
+    handleFocus: handleFocus({ emit, refs, state }),
+    getTimezone: getTimezone({ props, utils }),
+    emitChange: emitChange({ api: api2, dispatch, emit, props, state }),
+    parsedValue: parsedValue({ api: api2, props, state, t }),
+    parseAsFormatAndType: parseAsFormatAndType({ api: api2 }),
+    typeValueResolveMap: typeValueResolveMap({ api: api2, t }),
+    updateOptions: updateOptions({ api: api2, props, state }),
+    focus: focus({ api: api2, props, refs }),
+    handleChange: handleChange({ api: api2, state }),
+    isValidValue: isValidValue({ api: api2, state }),
+    emitInput: emitInput({ api: api2, emit, props, state }),
+    handleKeydown: handleKeydown({ api: api2, state }),
+    handleEndChange: handleEndChange({ api: api2, state }),
+    handleStartChange: handleStartChange({ api: api2, state }),
+    handleClickIcon: handleClickIcon({ api: api2, props, state }),
+    showPicker: showPicker({ api: api2, nextTick, updatePopper, state }),
+    formatToValue: formatToValue({ api: api2, props, state }),
+    formatAsFormatAndType: formatAsFormatAndType({ api: api2 }),
+    parseString: parseString({ api: api2, state }),
+    handleClose: handleClose({ api: api2, props, state }),
+    displayValue: displayValue({ api: api2, props, state }),
+    handlePick: handlePick({ api: api2, state }),
+    watchPickerVisible: watchPickerVisible({ api: api2, vm, dispatch, emit, props, state }),
+    formatToString: formatToString({ api: api2, state }),
+    watchIsRange: watchIsRange({ api: api2, props, state, TimePanel, TimeRangePanel }),
+    mountPicker: mountPicker({ api: api2, vm, props, state, updatePopper }),
+    watchModelValue: watchModelValue({ api: api2, props, state, dispatch }),
+    computedFormat: computedFormat({ props, utils }),
+    computedTriggerClass: computedTriggerClass({ props, state }),
+    computedHaveTrigger: computedHaveTrigger({ props })
   });
+  initApi2({ api: api2, props, state, t });
 };
-var initWatch = function initWatch(_ref5) {
-  var api = _ref5.api,
-    state = _ref5.state,
-    props = _ref5.props,
-    watch = _ref5.watch,
-    markRaw = _ref5.markRaw;
-  watch(function () {
-    return state.type;
-  }, function (type) {
-    return state.panel = markRaw(api.getPanel(type));
-  }, {
-    immediate: true
-  });
-  watch(function () {
-    return state.pickerVisible;
-  }, api.watchPickerVisible);
-  watch(function () {
-    return props.defaultValue;
-  }, function (value) {
-    return state.picker && (state.picker.state.defaultValue = value);
-  });
-  watch(function () {
-    return state.parsedValue;
-  }, function (value) {
-    return state.picker && (state.picker.state.value = value);
-  }, {
-    immediate: true
-  });
-  watch(function () {
-    return props.isRange;
-  }, api.watchIsRange);
-  watch(function () {
-    return props.modelValue;
-  }, api.watchModelValue);
-  watch(function () {
-    return props.pickerOptions;
-  }, api.updateOptions, {
-    deep: true
-  });
+const initWatch = ({ api: api2, state, props, watch, markRaw }) => {
+  watch(
+    () => state.type,
+    (type) => state.panel = markRaw(api2.getPanel(type)),
+    { immediate: true }
+  );
+  watch(() => state.pickerVisible, api2.watchPickerVisible);
+  watch(
+    () => props.defaultValue,
+    (value) => state.picker && (state.picker.state.defaultValue = value)
+  );
+  watch(
+    () => state.parsedValue,
+    (value) => state.picker && (state.picker.state.value = value),
+    { immediate: true }
+  );
+  watch(() => props.isRange, api2.watchIsRange);
+  watch(() => props.modelValue, api2.watchModelValue);
+  watch(() => props.pickerOptions, api2.updateOptions, { deep: true });
 };
-export var renderless = function renderless(props, hooks, vnode, others) {
-  var api = {};
-  var reactive = hooks.reactive,
-    computed = hooks.computed,
-    watch = hooks.watch,
-    onBeforeUnmount = hooks.onBeforeUnmount,
-    inject = hooks.inject,
-    markRaw = hooks.markRaw;
-  var refs = vnode.refs,
-    service = vnode.service,
-    parent = vnode.parent;
-  var _ref6 = service || {},
-    _ref6$utils = _ref6.utils,
-    utils = _ref6$utils === void 0 ? {} : _ref6$utils;
-  var state = initState({
-    api: api,
-    reactive: reactive,
-    refs: refs,
-    computed: computed,
-    props: props,
-    utils: utils
-  });
-  parent.tinyForm = parent.tinyForm || inject('form', null);
-  initApi({
-    api: api,
-    props: props,
-    hooks: hooks,
-    state: state,
-    vnode: vnode,
-    others: others,
-    utils: utils
-  });
-  initWatch({
-    api: api,
-    state: state,
-    props: props,
-    watch: watch,
-    markRaw: markRaw
-  });
-  api.initGlobalTimezone();
-  onBeforeUnmount(function () {
-    api.destroyPopper('remove');
+const renderless = (props, hooks, vnode, others) => {
+  const api2 = {};
+  const { reactive, computed, watch, onBeforeUnmount, inject, markRaw } = hooks;
+  const { refs, service, parent: parent2 } = vnode;
+  const { utils = {} } = service || {};
+  const state = initState({ api: api2, reactive, refs, computed, props, utils });
+  parent2.tinyForm = parent2.tinyForm || inject("form", null);
+  initApi({ api: api2, props, hooks, state, vnode, others, utils });
+  initWatch({ api: api2, state, props, watch, markRaw });
+  api2.initGlobalTimezone();
+  onBeforeUnmount(() => {
+    api2.destroyPopper("remove");
     state.popperElm = null;
     state.picker = null;
   });
-  return api;
-};
+  return api2;
+};
+export {
+  api,
+  renderless
+};