@varlet/ui 1.23.4-alpha.4 → 1.23.4

package/lib/date-picker/src/day-picker-panel.js

@@ -1,355 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.render = render;
-exports.default = void 0;
-
-var dayjs = _interopRequireWildcard(require("dayjs"));
-
-var _isSameOrBefore = _interopRequireDefault(require("dayjs/esm/plugin/isSameOrBefore"));
-
-var _isSameOrAfter = _interopRequireDefault(require("dayjs/esm/plugin/isSameOrAfter"));
-
-var _panelHeader = _interopRequireDefault(require("./panel-header.js"));
-
-var _button = _interopRequireDefault(require("../../button"));
-
-var _vue = require("vue");
-
-var _props = require("../props");
-
-var _shared = require("../../utils/shared");
-
-var _locale = require("../../locale");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-dayjs.extend(_isSameOrBefore.default);
-dayjs.extend(_isSameOrAfter.default);
-
-var _withScopeId = n => ((0, _vue.pushScopeId)(""), n = n(), (0, _vue.popScopeId)(), n);
-
-var _hoisted_1 = {
-  class: "var-day-picker__panel"
-};
-var _hoisted_2 = {
-  class: "var-day-picker__content"
-};
-var _hoisted_3 = {
-  class: "var-day-picker__head"
-};
-var _hoisted_4 = {
-  class: "var-day-picker__body"
-};
-
-function render(_ctx, _cache) {
-  var _component_panel_header = (0, _vue.resolveComponent)("panel-header");
-
-  var _component_var_button = (0, _vue.resolveComponent)("var-button");
-
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", _hoisted_1, [(0, _vue.createElementVNode)("div", _hoisted_2, [(0, _vue.createVNode)(_component_panel_header, {
-    type: "day",
-    date: _ctx.preview,
-    disabled: _ctx.panelBtnDisabled,
-    onCheckPanel: _ctx.clickMonth,
-    onCheckDate: _ctx.checkDate
-  }, null, 8
-  /* PROPS */
-  , ["date", "disabled", "onCheckPanel", "onCheckDate"]), (0, _vue.createVNode)(_vue.Transition, {
-    name: _ctx.reverse ? 'var-date-picker-reverse-translatex' : 'var-date-picker-translatex'
-  }, {
-    default: (0, _vue.withCtx)(() => [((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-      key: _ctx.panelKey
-    }, [(0, _vue.createElementVNode)("ul", _hoisted_3, [((0, _vue.openBlock)(true), (0, _vue.createElementBlock)(_vue.Fragment, null, (0, _vue.renderList)(_ctx.sortWeekList, week => {
-      return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
-        key: week.index
-      }, (0, _vue.toDisplayString)(_ctx.getDayAbbr(week.index)), 1
-      /* TEXT */
-      );
-    }), 128
-    /* KEYED_FRAGMENT */
-    ))]), (0, _vue.createElementVNode)("ul", _hoisted_4, [((0, _vue.openBlock)(true), (0, _vue.createElementBlock)(_vue.Fragment, null, (0, _vue.renderList)(_ctx.days, (day, index) => {
-      return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
-        key: index
-      }, [(0, _vue.createVNode)(_component_var_button, (0, _vue.mergeProps)({
-        type: "primary",
-        class: ["var-day-picker__button", {
-          'var-day-picker__button--usable': day > 0
-        }],
-        "var-day-picker-cover": "",
-        round: "",
-        ripple: false
-      }, _extends({}, _ctx.buttonProps(day)), {
-        onClick: $event => _ctx.chooseDay(day)
-      }), {
-        default: (0, _vue.withCtx)(() => [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(_ctx.filterDay(day)), 1
-        /* TEXT */
-        )]),
-        _: 2
-        /* DYNAMIC */
-
-      }, 1040
-      /* FULL_PROPS, DYNAMIC_SLOTS */
-      , ["class", "onClick"])]);
-    }), 128
-    /* KEYED_FRAGMENT */
-    ))])]))]),
-    _: 1
-    /* STABLE */
-
-  }, 8
-  /* PROPS */
-  , ["name"])])]);
-}
-
-var _default = (0, _vue.defineComponent)({
-  render,
-  name: 'DayPickerPanel',
-  components: {
-    VarButton: _button.default,
-    PanelHeader: _panelHeader.default
-  },
-  props: {
-    choose: {
-      type: Object,
-      required: true
-    },
-    preview: {
-      type: Object,
-      required: true
-    },
-    current: {
-      type: String,
-      required: true
-    },
-    clickMonth: {
-      type: Function,
-      required: true
-    },
-    componentProps: {
-      type: Object,
-      required: true
-    }
-  },
-  emits: ['check-preview', 'choose-day'],
-
-  setup(props, {
-    emit
-  }) {
-    var [currentYear, currentMonth, currentDay] = props.current.split('-');
-    var days = (0, _vue.ref)([]);
-    var reverse = (0, _vue.ref)(false);
-    var panelKey = (0, _vue.ref)(0);
-    var panelBtnDisabled = (0, _vue.reactive)({
-      left: false,
-      right: false
-    });
-    var isCurrent = (0, _vue.computed)(() => props.preview.previewYear === currentYear && props.preview.previewMonth.index === currentMonth);
-    var isSame = (0, _vue.computed)(() => props.choose.chooseYear === props.preview.previewYear && props.choose.chooseMonth.index === props.preview.previewMonth.index);
-    var sortWeekList = (0, _vue.computed)(() => {
-      var index = _props.WEEK_HEADER.findIndex(week => week.index === props.componentProps.firstDayOfWeek);
-
-      if (index === -1 || index === 0) return _props.WEEK_HEADER;
-      return _props.WEEK_HEADER.slice(index).concat(_props.WEEK_HEADER.slice(0, index));
-    });
-
-    var getDayAbbr = key => {
-      var _pack$value$datePicke, _pack$value$datePicke2;
-
-      return (_pack$value$datePicke = (_pack$value$datePicke2 = _locale.pack.value.datePickerWeekDict) == null ? void 0 : _pack$value$datePicke2[key].abbr) != null ? _pack$value$datePicke : '';
-    };
-
-    var filterDay = day => day > 0 ? day : '';
-
-    var initDate = () => {
-      var {
-        preview: {
-          previewMonth,
-          previewYear
-        }
-      } = props;
-      var monthNum = dayjs(previewYear + "-" + previewMonth.index).daysInMonth();
-      var firstDayToWeek = dayjs(previewYear + "-" + previewMonth.index + "-01").day();
-      var index = sortWeekList.value.findIndex(week => week.index === "" + firstDayToWeek);
-      days.value = [...Array(index).fill(-1), ...Array.from(Array(monthNum + 1).keys())].filter(value => value);
-    };
-
-    var initHeader = () => {
-      var {
-        preview: {
-          previewYear,
-          previewMonth
-        },
-        componentProps: {
-          max,
-          min
-        }
-      } = props;
-
-      if (max) {
-        var date = previewYear + "-" + ((0, _shared.toNumber)(previewMonth.index) + 1);
-        panelBtnDisabled.right = !dayjs(date).isSameOrBefore(dayjs(max), 'month');
-      }
-
-      if (min) {
-        var _date = previewYear + "-" + ((0, _shared.toNumber)(previewMonth.index) - 1);
-
-        panelBtnDisabled.left = !dayjs(_date).isSameOrAfter(dayjs(min), 'month');
-      }
-    };
-
-    var inRange = day => {
-      var {
-        preview: {
-          previewYear,
-          previewMonth
-        },
-        componentProps: {
-          min,
-          max
-        }
-      } = props;
-      var isBeforeMax = true;
-      var isAfterMin = true;
-      var previewDate = previewYear + "-" + previewMonth.index + "-" + day;
-      if (max) isBeforeMax = dayjs(previewDate).isSameOrBefore(dayjs(max), 'day');
-      if (min) isAfterMin = dayjs(previewDate).isSameOrAfter(dayjs(min), 'day');
-      return isBeforeMax && isAfterMin;
-    };
-
-    var shouldChoose = val => {
-      var {
-        choose: {
-          chooseDays,
-          chooseRangeDay
-        },
-        componentProps: {
-          range
-        }
-      } = props;
-      if (!chooseRangeDay.length) return false;
-
-      if (range) {
-        var isBeforeMax = dayjs(val).isSameOrBefore(dayjs(chooseRangeDay[1]), 'day');
-        var isAfterMin = dayjs(val).isSameOrAfter(dayjs(chooseRangeDay[0]), 'day');
-        return isBeforeMax && isAfterMin;
-      }
-
-      return chooseDays.includes(val);
-    };
-
-    var buttonProps = day => {
-      if (day < 0) {
-        return {
-          text: true,
-          outline: false,
-          textColor: ''
-        };
-      }
-
-      var {
-        choose: {
-          chooseDay
-        },
-        preview: {
-          previewYear,
-          previewMonth
-        },
-        componentProps: {
-          allowedDates,
-          color,
-          multiple,
-          range
-        }
-      } = props;
-      var val = previewYear + "-" + previewMonth.index + "-" + day;
-
-      var dayExist = () => {
-        if (range || multiple) return shouldChoose(val);
-        return (0, _shared.toNumber)(chooseDay) === day && isSame.value;
-      };
-
-      var computeDisabled = () => {
-        if (!inRange(day)) return true;
-        if (!allowedDates) return false;
-        return !allowedDates(val);
-      };
-
-      var disabled = computeDisabled();
-
-      var computeText = () => {
-        if (disabled) return true;
-        if (range || multiple) return !shouldChoose(val);
-        return !isSame.value || (0, _shared.toNumber)(chooseDay) !== day;
-      };
-
-      var computeOutline = () => {
-        // 不满足基本条件， 基本条件为当前年、当前月、当前日并且 showCurrent 为true的情况
-        if (!(isCurrent.value && (0, _shared.toNumber)(currentDay) === day && props.componentProps.showCurrent)) return false; // 存在着 disabled
-
-        if ((range || multiple || isSame.value) && disabled) return true; // 在选择范围之外
-
-        if (range || multiple) return !shouldChoose(val); // 同一年但是未被选择的情况
-
-        if (isSame.value) return chooseDay !== currentDay;
-        return true;
-      };
-
-      var textColorOrClass = () => {
-        if (disabled) return '';
-        if (computeOutline()) return color != null ? color : '';
-        if (dayExist()) return '';
-        return 'var-date-picker-main__color';
-      };
-
-      var isClass = textColorOrClass().startsWith('var-date-picker');
-      return {
-        disabled,
-        text: computeText(),
-        outline: computeOutline(),
-        textColor: isClass ? '' : textColorOrClass(),
-        class: isClass ? textColorOrClass() : ''
-      };
-    };
-
-    var checkDate = checkType => {
-      reverse.value = checkType === 'prev';
-      panelKey.value += checkType === 'prev' ? -1 : 1;
-      emit('check-preview', 'month', checkType);
-    };
-
-    var chooseDay = day => {
-      emit('choose-day', day);
-    };
-
-    (0, _vue.onMounted)(() => {
-      initDate();
-      initHeader();
-    });
-    (0, _vue.watch)(() => props.preview, () => {
-      initDate();
-      initHeader();
-    });
-    return {
-      days,
-      reverse,
-      panelKey,
-      sortWeekList,
-      panelBtnDisabled,
-      filterDay,
-      getDayAbbr,
-      checkDate,
-      chooseDay,
-      buttonProps
-    };
-  }
-
-});
-
-exports.default = _default;

package/lib/date-picker/src/month-picker-panel.js

@@ -1,289 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.render = render;
-exports.default = void 0;
-
-var _vue = require("vue");
-
-var dayjs = _interopRequireWildcard(require("dayjs"));
-
-var _isSameOrBefore = _interopRequireDefault(require("dayjs/esm/plugin/isSameOrBefore"));
-
-var _isSameOrAfter = _interopRequireDefault(require("dayjs/esm/plugin/isSameOrAfter"));
-
-var _props = require("../props");
-
-var _panelHeader = _interopRequireDefault(require("./panel-header.js"));
-
-var _button = _interopRequireDefault(require("../../button"));
-
-var _shared = require("../../utils/shared");
-
-var _locale = require("../../locale");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-dayjs.extend(_isSameOrBefore.default);
-dayjs.extend(_isSameOrAfter.default);
-
-var _withScopeId = n => ((0, _vue.pushScopeId)(""), n = n(), (0, _vue.popScopeId)(), n);
-
-var _hoisted_1 = {
-  class: "var-month-picker__panel"
-};
-var _hoisted_2 = {
-  class: "var-month-picker__content"
-};
-
-function render(_ctx, _cache) {
-  var _component_panel_header = (0, _vue.resolveComponent)("panel-header");
-
-  var _component_var_button = (0, _vue.resolveComponent)("var-button");
-
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", _hoisted_1, [(0, _vue.createElementVNode)("div", _hoisted_2, [(0, _vue.createVNode)(_component_panel_header, {
-    type: "month",
-    date: _ctx.preview,
-    disabled: _ctx.panelBtnDisabled,
-    onCheckPanel: _ctx.clickYear,
-    onCheckDate: _ctx.checkDate
-  }, null, 8
-  /* PROPS */
-  , ["date", "disabled", "onCheckPanel", "onCheckDate"]), (0, _vue.createVNode)(_vue.Transition, {
-    name: _ctx.reverse ? 'var-date-picker-reverse-translatex' : 'var-date-picker-translatex'
-  }, {
-    default: (0, _vue.withCtx)(() => [((0, _vue.openBlock)(), (0, _vue.createElementBlock)("ul", {
-      key: _ctx.panelKey
-    }, [((0, _vue.openBlock)(true), (0, _vue.createElementBlock)(_vue.Fragment, null, (0, _vue.renderList)(_ctx.MONTH_LIST, month => {
-      return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
-        key: month.index
-      }, [(0, _vue.createVNode)(_component_var_button, (0, _vue.mergeProps)({
-        type: "primary",
-        class: "var-month-picker__button",
-        "var-month-picker-cover": "",
-        ripple: false
-      }, _extends({}, _ctx.buttonProps(month.index)), {
-        onClick: $event => _ctx.chooseMonth(month)
-      }), {
-        default: (0, _vue.withCtx)(() => [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(_ctx.getMonthAbbr(month.index)), 1
-        /* TEXT */
-        )]),
-        _: 2
-        /* DYNAMIC */
-
-      }, 1040
-      /* FULL_PROPS, DYNAMIC_SLOTS */
-      , ["onClick"])]);
-    }), 128
-    /* KEYED_FRAGMENT */
-    ))]))]),
-    _: 1
-    /* STABLE */
-
-  }, 8
-  /* PROPS */
-  , ["name"])])]);
-}
-
-var _default = (0, _vue.defineComponent)({
-  render,
-  name: 'MonthPickerPanel',
-  components: {
-    VarButton: _button.default,
-    PanelHeader: _panelHeader.default
-  },
-  props: {
-    choose: {
-      type: Object,
-      required: true
-    },
-    preview: {
-      type: Object,
-      required: true
-    },
-    current: {
-      type: String,
-      required: true
-    },
-    clickYear: {
-      type: Function,
-      required: true
-    },
-    componentProps: {
-      type: Object,
-      required: true
-    }
-  },
-  emits: ['check-preview', 'choose-month'],
-
-  setup(props, {
-    emit
-  }) {
-    var [currentYear, currentMonth] = props.current.split('-');
-    var reverse = (0, _vue.ref)(false);
-    var panelKey = (0, _vue.ref)(0);
-    var panelBtnDisabled = (0, _vue.reactive)({
-      left: false,
-      right: false
-    });
-    var isSameYear = (0, _vue.computed)(() => props.choose.chooseYear === props.preview.previewYear);
-    var isCurrentYear = (0, _vue.computed)(() => props.preview.previewYear === currentYear);
-
-    var getMonthAbbr = key => {
-      var _pack$value$datePicke, _pack$value$datePicke2;
-
-      return (_pack$value$datePicke = (_pack$value$datePicke2 = _locale.pack.value.datePickerMonthDict) == null ? void 0 : _pack$value$datePicke2[key].abbr) != null ? _pack$value$datePicke : '';
-    };
-
-    var inRange = key => {
-      var {
-        preview: {
-          previewYear
-        },
-        componentProps: {
-          min,
-          max
-        }
-      } = props;
-      var isBeforeMax = true;
-      var isAfterMin = true;
-      var previewDate = previewYear + "-" + key;
-      if (max) isBeforeMax = dayjs(previewDate).isSameOrBefore(dayjs(max), 'month');
-      if (min) isAfterMin = dayjs(previewDate).isSameOrAfter(dayjs(min), 'month');
-      return isBeforeMax && isAfterMin;
-    };
-
-    var shouldChoose = val => {
-      var {
-        choose: {
-          chooseMonths,
-          chooseDays,
-          chooseRangeMonth
-        },
-        componentProps: {
-          type,
-          range
-        }
-      } = props;
-      if (!chooseRangeMonth.length) return false;
-
-      if (range) {
-        var isBeforeMax = dayjs(val).isSameOrBefore(dayjs(chooseRangeMonth[1]), 'month');
-        var isAfterMin = dayjs(val).isSameOrAfter(dayjs(chooseRangeMonth[0]), 'month');
-        return isBeforeMax && isAfterMin;
-      }
-
-      if (type === 'month') return chooseMonths.includes(val);
-      return chooseDays.some(value => value.includes(val));
-    };
-
-    var buttonProps = key => {
-      var {
-        choose: {
-          chooseMonth
-        },
-        preview: {
-          previewYear
-        },
-        componentProps: {
-          allowedDates,
-          color,
-          multiple,
-          range
-        }
-      } = props;
-      var val = previewYear + "-" + key;
-
-      var monthExist = () => {
-        if (range || multiple) return shouldChoose(val);
-        return chooseMonth.index === key && isSameYear.value;
-      };
-
-      var computeDisabled = () => {
-        if (!inRange(key)) return true;
-        if (!allowedDates) return false;
-        return !allowedDates(val);
-      };
-
-      var disabled = computeDisabled();
-
-      var computeText = () => {
-        if (disabled) return true;
-        if (range || multiple) return !shouldChoose(val);
-        return !isSameYear.value || chooseMonth.index !== key;
-      };
-
-      var computeOutline = () => {
-        // 不满足基本条件， 基本条件为当前年、当前月并且 showCurrent 为true的情况
-        if (!(isCurrentYear.value && currentMonth === key && props.componentProps.showCurrent)) return false; // 存在着 disabled
-
-        if ((range || multiple || isSameYear.value) && disabled) return true; // 在选择范围之外
-
-        if (range || multiple) return !shouldChoose(val); // 同一年但是未被选择的情况
-
-        if (isSameYear.value) return chooseMonth.index !== currentMonth;
-        return true;
-      };
-
-      var textColorOrClass = () => {
-        if (disabled) return '';
-        if (computeOutline()) return color != null ? color : '';
-        if (monthExist()) return '';
-        return 'var-date-picker-main__color';
-      };
-
-      var isClass = textColorOrClass().startsWith('var-date-picker');
-      return {
-        disabled,
-        outline: computeOutline(),
-        text: computeText(),
-        color: !computeText() ? color : '',
-        textColor: isClass ? '' : textColorOrClass(),
-        class: isClass ? textColorOrClass() : ''
-      };
-    };
-
-    var chooseMonth = month => {
-      emit('choose-month', month);
-    };
-
-    var checkDate = checkType => {
-      reverse.value = checkType === 'prev';
-      panelKey.value += checkType === 'prev' ? -1 : 1;
-      emit('check-preview', 'year', checkType);
-    };
-
-    (0, _vue.watch)(() => props.preview.previewYear, year => {
-      var {
-        componentProps: {
-          min,
-          max
-        }
-      } = props;
-      if (max) panelBtnDisabled.right = !dayjs("" + ((0, _shared.toNumber)(year) + 1)).isSameOrBefore(dayjs(max), 'year');
-      if (min) panelBtnDisabled.left = !dayjs("" + ((0, _shared.toNumber)(year) - 1)).isSameOrAfter(dayjs(min), 'year');
-    }, {
-      immediate: true
-    });
-    return {
-      pack: _locale.pack,
-      MONTH_LIST: _props.MONTH_LIST,
-      reverse,
-      panelKey,
-      panelBtnDisabled,
-      buttonProps,
-      getMonthAbbr,
-      chooseMonth,
-      checkDate
-    };
-  }
-
-});
-
-exports.default = _default;