Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@opentiny/vue-calendar

Package Overview
Dependencies
Maintainers
1
Versions
61
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@opentiny/vue-calendar - npm Package Compare versions

Comparing version 3.6.0 to 3.6.1-alpha.0

LICENSE

1

index.d.ts

@@ -13,3 +13,2 @@ /**

import Calendar from './src/index';
import '@opentiny/vue-theme/calendar/index.css';
export default Calendar;

@@ -1,67 +0,40 @@

import { $prefix, $props, $setup } from '@opentiny/vue-common';
import PCTemplate from './pc';
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
enumerableOnly && (symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
})), keys.push.apply(keys, symbols);
}
return keys;
function _extends() {
_extends = Object.assign ? Object.assign.bind() : 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);
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = null != arguments[i] ? arguments[i] : {};
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
_defineProperty(target, key, source[key]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
function _defineProperty(obj, key, value) {
key = _toPropertyKey(key);
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _toPrimitive(input, hint) {
if (typeof input !== "object" || input === null) return input;
var prim = input[Symbol.toPrimitive];
if (prim !== undefined) {
var res = prim.call(input, hint || "default");
if (typeof res !== "object") return res;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return (hint === "string" ? String : Number)(input);
}
function _toPropertyKey(arg) {
var key = _toPrimitive(arg, "string");
return typeof key === "symbol" ? key : String(key);
}
var template = function template() {
return PCTemplate;
import { defineComponent, $prefix, $props, $setup } from "@opentiny/vue-common";
import PcTemplate from "./pc.js";
import "@opentiny/vue-theme/calendar/index.css";
var template = function template2(mode) {
if ("mobile" === (process.env.TINY_MODE || mode))
return MobileTemplate;
else
return PcTemplate;
};
var Calendar = {
name: $prefix + 'Calendar',
props: _objectSpread2(_objectSpread2({}, $props), {}, {
var Calendar = defineComponent({
name: $prefix + "Calendar",
props: _extends({}, $props, {
/**
* @property {String} [mode='month'] - 显示模式,month|year 可选
*/
mode: {
type: String,
default: 'month',
default: "month",
validator: function validator(value) {
return ~['month', 'year'].indexOf(value);
return Boolean(~["month", "year"].indexOf(value));
}
},
/**
* @property {Number} [year=getFullYear()] - 指定年份,默认今年
*/
year: {

@@ -73,9 +46,22 @@ type: Number,

},
/**
* @property {Number} [month=getMonth()] - 指定月份,默认当月
*/
month: {
type: Number,
default: function _default() {
default: function _default2() {
return new Date().getMonth() + 1;
}
},
/**
* @property {Array} events - 事件列表
* @example
* [{ time: 1534297845236, title: '消息', content: '这是一条消息', type: 'primary' },
* { time: 1534297845236, title: '消息', content: '还有', type: 'info' }]
* type 类型: warning、error、info、success
*/
events: Array,
/**
* @property {Boolean} [showSelected=false] - 显示选中的日期
*/
showSelected: Boolean

@@ -85,44 +71,15 @@ }),

return $setup({
props: props,
context: context,
template: template
props,
context,
template
});
}
};
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = ".tiny-transition-zoom-in-top-enter-active,.tiny-transition-zoom-in-top-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);-webkit-transform-origin:center top;transform-origin:center top}.tiny-transition-zoom-in-top-enter,.tiny-transition-zoom-in-top-enter-from,.tiny-transition-zoom-in-top-leave-to{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center top;transform-origin:center top}.tiny-calendar{--ti-calendar-bg-color:var(--ti-base-color-light);--ti-calendar-list-item-selected-text-color:var(--ti-base-color-light);--ti-calendar-hover-text-color:var(--ti-base-color-brand-5);--ti-calendar-border-color:var(--ti-base-color-border);--ti-calendar-text-color-primary:var(--ti-base-color-brand-6);--ti-calendar-background-color-primary:rgba(24, 144, 255, 0.1);--ti-calendar-bg-color-success:var(--ti-base-color-success-normal);--ti-calendar-bg-color-warning:var(--ti-base-color-warning-normal);--ti-calendar-bg-color-danger:var(--ti-base-color-bg-8);--ti-calendar-text-color-info:var(--ti-base-color-info-normal);--ti-calendar-tool-width:var(--ti-base-size-width-normal);--ti-calendar-content-heard-font-size:var(--ti-common-font-size-1);--ti-calendar-selected-border-radius:var(--ti-base-radius-large);--ti-calendar-input-height:var(--ti-base-size-height-minor);--ti-calendar-input-border-radius:var(--ti-common-border-radius-normal);--ti-calendar-input-font-size:var(--ti-common-font-size-base);--ti-calendar-list-item-height:var(--ti-base-size-height-minor);--ti-calendar-list-item-hover-bg-color:var(--ti-base-color-hover-background);--ti-calendar-list-item-selected-bg-color:var(--ti-base-color-selected-background);--ti-calendar-disabled-text-color:var(--ti-common-color-text-disabled);--ti-calendar-disabled-info-bg-color:var(--ti-base-color-bg-5);--ti-calendar-disabled-success-bg-color:var(--ti-base-color-bg-5);--ti-calendar-disabled-warning-bg-color:var(--ti-base-color-bg-5);--ti-calendar-disabled-error-bg-color:var(--ti-base-color-bg-5);background:var(--ti-calendar-bg-color);overflow:hidden;margin:10px}.tiny-calendar.is-popover.tiny-popover.tiny-popper{padding:0;margin:2px 0 0}.tiny-calendar .tiny-calendar__header{overflow:hidden;margin-bottom:12px}.tiny-calendar .tiny-calendar__selected{border:1px solid var(--ti-calendar-text-color-primary);background:var(--ti-calendar-background-color-primary);padding:8px;color:var(--ti-calendar-text-color-info);line-height:140%;border-radius:var(--ti-calendar-selected-border-radius);margin-bottom:8px}.tiny-calendar .tiny-calendar__tool{list-style:none;overflow:hidden;float:right;margin-bottom:8px}.tiny-calendar .tiny-calendar__tool>li{float:left;margin-right:8px}.tiny-calendar .tiny-calendar__tool>li>span{display:inline-block}.tiny-calendar .tiny-calendar__tool>li:last-child{margin-left:16px;margin-right:0}.tiny-calendar .tiny-calendar__input{width:var(--ti-calendar-tool-width);position:relative;outline:0}.tiny-calendar .tiny-calendar__input>input{width:100%;height:var(--ti-calendar-input-height);line-height:var(--ti-calendar-input-height);border:1px solid var(--ti-calendar-border-color);color:var(--ti-calendar-text-color-info);border-radius:var(--ti-calendar-input-border-radius);background:var(--ti-calendar-bg-color);font-size:var(--ti-calendar-input-font-size);padding:0 30px 0 8px;display:block;white-space:nowrap;-webkit-transition:border .3s;transition:border .3s;outline:0;-webkit-box-sizing:border-box;box-sizing:border-box}.tiny-calendar .tiny-calendar__input>input.active,.tiny-calendar .tiny-calendar__input>input:active,.tiny-calendar .tiny-calendar__input>input:focus,.tiny-calendar .tiny-calendar__input>input:hover,.tiny-calendar .tiny-calendar__input>input[active]{border:1px solid var(--ti-calendar-text-color-primary)}.tiny-calendar .tiny-calendar__input>input[readonly]{cursor:not-allowed}.tiny-calendar .tiny-calendar__input-btn{bottom:0;right:4px;position:absolute;top:0;outline:0;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;overflow:hidden;font-size:var(--ti-common-font-size-base);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer}.tiny-calendar .tiny-calendar__input-btn svg{fill:var(--ti-calendar-text-color-primary)}.tiny-calendar .tiny-calendar__input-btn svg:hover{fill:var(--ti-calendar-hover-text-color)}.tiny-calendar .tiny-calendar__tabs{list-style:none;overflow:hidden}.tiny-calendar .tiny-calendar__tabs>li{position:relative;float:left;width:calc(var(--ti-calendar-tool-width)/ 2);height:var(--ti-calendar-input-height);line-height:var(--ti-calendar-input-height);border:1px solid var(--ti-calendar-border-color);text-align:center;font-size:var(--ti-calendar-input-font-size);font-weight:500;color:var(--ti-calendar-text-color-info);cursor:pointer}.tiny-calendar .tiny-calendar__tabs>li:first-child{border-radius:3px 0 0 3px}.tiny-calendar .tiny-calendar__tabs>li:last-child{margin-left:-1px;border-radius:0 3px 3px 0}.tiny-calendar .tiny-calendar__tabs>li:hover{color:var(--ti-calendar-text-color-primary)}.tiny-calendar .tiny-calendar__tabs>.active{color:var(--ti-calendar-text-color-primary);border:1px solid var(--ti-calendar-text-color-primary);z-index:1}.tiny-calendar .tiny-calendar__main{width:100%;overflow:hidden}.tiny-calendar .tiny-calendar__main table{width:100%}.tiny-calendar .tiny-calendar__main table>tr>th{line-height:18px;padding:0 10px 5px 10px;font-size:var(--ti-calendar-content-heard-font-size);text-align:right;width:14.28571429%}.tiny-calendar .tiny-calendar__main table>tr>td{text-align:right;padding:0 5px 0 0}.tiny-calendar .tiny-calendar__main.year table>tr>td{width:33.33333333%}.tiny-calendar .tiny-calendar__day{border-top:3px solid var(--ti-calendar-border-color);margin:0 3px 5px 3px;height:100px;padding:5px}.tiny-calendar .tiny-calendar__day.selected{background:var(--ti-calendar-background-color-primary)}.tiny-calendar .tiny-calendar__day.selected .label{color:var(--ti-calendar-text-color-primary)}.tiny-calendar .tiny-calendar__day:hover{background:var(--ti-calendar-background-color-primary)}.tiny-calendar .tiny-calendar__day.disable{color:var(--ti-calendar-disabled-text-color)}.tiny-calendar .tiny-calendar__day.disable .info:before{background:var(--ti-calendar-disabled-info-bg-color)}.tiny-calendar .tiny-calendar__day.disable .success:before{background:var(--ti-calendar-disabled-success-bg-color)}.tiny-calendar .tiny-calendar__day.disable .warning:before{background:var(--ti-calendar-disabled-warning-bg-color)}.tiny-calendar .tiny-calendar__day.disable .error:before{background:var(--ti-calendar-disabled-error-bg-color)}.tiny-calendar .tiny-calendar__day.this-month,.tiny-calendar .tiny-calendar__day.today{border-color:var(--ti-calendar-text-color-primary)}.tiny-calendar .tiny-calendar__events{text-align:left;height:calc(100% - 18px);overflow-y:auto}.tiny-calendar .tiny-calendar__events .event{margin:5px 10px;cursor:pointer}.tiny-calendar .tiny-calendar__events .event:before{content:'';width:6px;height:6px;border-radius:50%;display:inline-block;margin-right:3px}.tiny-calendar .tiny-calendar__events .info:before{background:var(--ti-calendar-text-color-info)}.tiny-calendar .tiny-calendar__events .success:before{background:var(--ti-calendar-bg-color-success)}.tiny-calendar .tiny-calendar__events .warning:before{background:var(--ti-calendar-bg-color-warning)}.tiny-calendar .tiny-calendar__events .error:before{background:var(--ti-calendar-bg-color-danger)}.tiny-calendar__tip{display:block;min-width:160px}.tiny-calendar__tip-header{overflow:hidden;border-bottom:1px solid rgba(255,255,255,.5);padding:5px 0;font-size:var(--ti-calendar-content-heard-font-size)}.tiny-calendar__tip-year{float:left}.tiny-calendar__tip-hours{float:right}.tiny-calendar__tip-title{margin:5px 0;font-weight:700}.tiny-calendar .tiny-calendar__selector{width:var(--ti-calendar-tool-width);max-height:300px;overflow-y:auto;overflow-x:hidden}.tiny-calendar .tiny-calendar__list-item{min-height:var(--ti-calendar-list-item-height);line-height:var(--ti-calendar-list-item-height);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 8px;color:var(--ti-calendar-text-color-info)}.tiny-calendar .tiny-calendar__list-item:hover{cursor:pointer;background:var(--ti-calendar-list-item-hover-bg-color)}.tiny-calendar .tiny-calendar__list-item.is-selected{background:var(--ti-calendar-list-item-selected-bg-color);color:var(--ti-calendar-list-item-selected-text-color)}";
styleInject(css_248z);
Calendar.install = function (Vue) {
});
var version = "3.7.0";
Calendar.install = function(Vue) {
Vue.component(Calendar.name, Calendar);
};
Calendar.version = '3.6.0';
export { Calendar as default };
Calendar.version = version;
export {
Calendar as default
};

@@ -1,54 +0,71 @@

import { renderless, api } from '@opentiny/vue-renderless/calendar/vue';
import { setup, props } from '@opentiny/vue-common';
import Tooltip from '@opentiny/vue-tooltip';
import Popover from '@opentiny/vue-popover';
import Button from '@opentiny/vue-button';
import { iconChevronUp, iconChevronDown } from '@opentiny/vue-icon';
import { resolveComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, createCommentVNode, renderSlot, createVNode, withCtx, createBlock, resolveDynamicComponent, Fragment, renderList, normalizeClass, withDirectives, vShow, createTextVNode } from 'vue';
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
import { renderless, api } from "@opentiny/vue-renderless/calendar/vue";
import { defineComponent, props, setup as _setup } from "@opentiny/vue-common";
import Tooltip from "@opentiny/vue-tooltip";
import Popover from "@opentiny/vue-popover";
import Button from "@opentiny/vue-button";
import { iconChevronUp, iconChevronDown } from "@opentiny/vue-icon";
import { resolveComponent, openBlock, createElementBlock, createCommentVNode, createElementVNode, toDisplayString, renderSlot, createVNode, withCtx, createBlock, resolveDynamicComponent, Fragment, renderList, normalizeClass, withDirectives, vShow, createTextVNode } from "vue";
function _createForOfIteratorHelperLoose(o, allowArrayLike) {
var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
if (it)
return (it = it.call(o)).next.bind(it);
if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
if (it)
o = it;
var i = 0;
return function() {
if (i >= o.length)
return { done: true };
return { done: false, value: o[i++] };
};
}
throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
if (!o)
return;
if (typeof o === "string")
return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
if (n === "Object" && o.constructor)
n = o.constructor.name;
if (n === "Map" || n === "Set")
return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
if (len == null || len > arr.length)
len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++)
arr2[i] = arr[i];
return arr2;
}
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
var _export_sfc = function _export_sfc2(sfc, props) {
var target = sfc.__vccOpts || sfc;
for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
target[key] = val;
}
return target;
};
var script = {
var _sfc_main = /* @__PURE__ */ defineComponent({
components: {
Tooltip: Tooltip,
Popover: Popover,
Button: Button,
Tooltip,
Popover,
Button,
IconChevronUp: iconChevronUp(),
IconChevronDown: iconChevronDown()
},
props: [].concat(_toConsumableArray(props), ['mode', 'year', 'month', 'events', 'showSelected']),
setup: function setup$1(props, context) {
return setup({
props: props,
context: context,
renderless: renderless,
api: api
props: [].concat(props, ["mode", "year", "month", "events", "showSelected"]),
setup: function setup(props2, context) {
return _setup({
props: props2,
context,
renderless,
api
});
}
};
});
var _hoisted_1 = {

@@ -147,12 +164,18 @@ class: "tiny-calendar"

};
function render(_ctx, _cache, $props, $setup, $data, $options) {
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
var _component_Popover = resolveComponent("Popover");
var _component_Button = resolveComponent("Button");
var _component_tooltip = resolveComponent("tooltip");
return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [$props.showSelected && _ctx.state.selectedTip ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(_ctx.state.selectedTip), 1)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "tool", {
return openBlock(), createElementBlock("div", _hoisted_1, [createCommentVNode(" 头部 "), createElementVNode("div", _hoisted_2, [_ctx.showSelected && _ctx.state.selectedTip ? (openBlock(), createElementBlock(
"div",
_hoisted_3,
toDisplayString(_ctx.state.selectedTip),
1
/* TEXT */
)) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "tool", {
slotScope: _ctx.state
}, function () {
}, function() {
return [createElementVNode("ul", _hoisted_4, [createElementVNode("li", null, [createVNode(_component_Popover, {
modelValue: _ctx.state.showYear,
"onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) {
"onUpdate:modelValue": _cache[0] || (_cache[0] = function($event) {
return _ctx.state.showYear = $event;

@@ -166,216 +189,419 @@ }),

}, {
reference: withCtx(function () {
reference: withCtx(function() {
return [createElementVNode("div", _hoisted_5, [createElementVNode("input", {
value: _ctx.state.activeYear + _ctx.t('ui.datepicker.year'),
value: _ctx.state.activeYear + _ctx.t("ui.datepicker.year"),
type: "text",
readonly: ""
}, null, 8, _hoisted_6), createElementVNode("div", _hoisted_7, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.showYear ? 'icon-chevron-up' : 'icon-chevron-down'), {
}, null, 8, _hoisted_6), createElementVNode("div", _hoisted_7, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.showYear ? "icon-chevron-up" : "icon-chevron-down"), {
class: "tiny-svg-size"
}))])])];
}),
default: withCtx(function () {
return [createElementVNode("div", _hoisted_8, [createElementVNode("ul", _hoisted_9, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.state.dropdownYear, function (year) {
return openBlock(), createElementBlock("li", {
key: year,
class: normalizeClass(['tiny-calendar__list-item', {
'is-selected': _ctx.state.activeYear === year
}]),
onClick: function onClick() {
_ctx.state.activeYear = year;
_ctx.state.showYear = false;
},
title: year + _ctx.t('ui.datepicker.year')
}, toDisplayString(year + _ctx.t('ui.datepicker.year')), 11, _hoisted_10);
}), 128))])])];
default: withCtx(function() {
return [createElementVNode("div", _hoisted_8, [createElementVNode("ul", _hoisted_9, [(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.state.dropdownYear, function(year) {
return openBlock(), createElementBlock("li", {
key: year,
class: normalizeClass(["tiny-calendar__list-item", {
"is-selected": _ctx.state.activeYear === year
}]),
onClick: function onClick() {
_ctx.state.activeYear = year;
_ctx.state.showYear = false;
},
title: year + _ctx.t("ui.datepicker.year")
}, toDisplayString(year + _ctx.t("ui.datepicker.year")), 11, _hoisted_10);
}),
128
/* KEYED_FRAGMENT */
))])])];
}),
_: 1
}, 8, ["modelValue"])]), withDirectives(createElementVNode("li", null, [createVNode(_component_Popover, {
modelValue: _ctx.state.showMonth,
"onUpdate:modelValue": _cache[1] || (_cache[1] = function ($event) {
return _ctx.state.showMonth = $event;
}),
transition: "tiny-transition-zoom-in-top",
placement: "bottom-start",
trigger: "click",
"popper-class": "tiny-calendar is-popover",
"visible-arrow": false
}, {
reference: withCtx(function () {
return [createElementVNode("div", _hoisted_11, [createElementVNode("input", {
value: _ctx.t('ui.datepicker.month' + _ctx.state.activeMonth),
type: "text",
readonly: ""
}, null, 8, _hoisted_12), createElementVNode("div", _hoisted_13, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.showYear ? 'icon-chevron-up' : 'icon-chevron-down'), {
class: "tiny-svg-size"
}))])])];
}),
default: withCtx(function () {
return [createElementVNode("div", _hoisted_14, [createElementVNode("ul", _hoisted_15, [(openBlock(), createElementBlock(Fragment, null, renderList(12, function (month) {
return createElementVNode("li", {
key: month,
class: normalizeClass(['tiny-calendar__list-item', {
'is-selected': _ctx.state.activeMonth === month
}]),
onClick: function onClick() {
_ctx.state.activeMonth = month;
_ctx.state.showMonth = false;
},
title: _ctx.t('ui.datepicker.month' + month)
}, toDisplayString(_ctx.t('ui.datepicker.month' + month)), 11, _hoisted_16);
}), 64))])])];
}),
_: 1
}, 8, ["modelValue"])], 512), [[vShow, _ctx.state.displayMode === 'month']]), createElementVNode("li", null, [createVNode(_component_Button, {
/* STABLE */
}, 8, ["modelValue"])]), withDirectives(createElementVNode(
"li",
null,
[createVNode(_component_Popover, {
modelValue: _ctx.state.showMonth,
"onUpdate:modelValue": _cache[1] || (_cache[1] = function($event) {
return _ctx.state.showMonth = $event;
}),
transition: "tiny-transition-zoom-in-top",
placement: "bottom-start",
trigger: "click",
"popper-class": "tiny-calendar is-popover",
"visible-arrow": false
}, {
reference: withCtx(function() {
return [createElementVNode("div", _hoisted_11, [createElementVNode("input", {
value: _ctx.t("ui.datepicker.month" + _ctx.state.activeMonth),
type: "text",
readonly: ""
}, null, 8, _hoisted_12), createElementVNode("div", _hoisted_13, [(openBlock(), createBlock(resolveDynamicComponent(_ctx.state.showYear ? "icon-chevron-up" : "icon-chevron-down"), {
class: "tiny-svg-size"
}))])])];
}),
default: withCtx(function() {
return [createElementVNode("div", _hoisted_14, [createElementVNode("ul", _hoisted_15, [(openBlock(), createElementBlock(
Fragment,
null,
renderList(12, function(month) {
return createElementVNode("li", {
key: month,
class: normalizeClass(["tiny-calendar__list-item", {
"is-selected": _ctx.state.activeMonth === month
}]),
onClick: function onClick() {
_ctx.state.activeMonth = month;
_ctx.state.showMonth = false;
},
title: _ctx.t("ui.datepicker.month" + month)
}, toDisplayString(_ctx.t("ui.datepicker.month" + month)), 11, _hoisted_16);
}),
64
/* STABLE_FRAGMENT */
))])])];
}),
_: 1
/* STABLE */
}, 8, ["modelValue"])],
512
/* NEED_PATCH */
), [[vShow, _ctx.state.displayMode === "month"]]), createElementVNode("li", null, [createVNode(_component_Button, {
type: "primary",
onClick: _ctx.toToday
}, {
default: withCtx(function () {
return [createTextVNode(toDisplayString(_ctx.state.displayMode === 'month' ? _ctx.t('ui.datepicker.today') : _ctx.t('ui.datepicker.currentMonth')), 1)];
default: withCtx(function() {
return [createTextVNode(
toDisplayString(_ctx.state.displayMode === "month" ? _ctx.t("ui.datepicker.today") : _ctx.t("ui.datepicker.currentMonth")),
1
/* TEXT */
)];
}),
_: 1
}, 8, ["onClick"])]), createElementVNode("li", null, [createElementVNode("ul", _hoisted_17, [createElementVNode("li", {
class: normalizeClass({
active: _ctx.state.displayMode === 'month'
}),
onClick: _cache[2] || (_cache[2] = function ($event) {
return _ctx.toggeModel('month');
})
}, toDisplayString(_ctx.t('ui.datepicker.month')), 3), createElementVNode("li", {
class: normalizeClass({
active: _ctx.state.displayMode === 'year'
}),
onClick: _cache[3] || (_cache[3] = function ($event) {
return _ctx.toggeModel('year');
})
}, toDisplayString(_ctx.t('ui.calendar.showType.year')), 3)])])])];
})]), createElementVNode("div", {
class: normalizeClass(['tiny-calendar__main', _ctx.state.displayMode])
}, [withDirectives(createElementVNode("table", _hoisted_18, [createElementVNode("tr", null, [createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.sun')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.mon')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.tue')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.wed')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.thu')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.fri')), 1), createElementVNode("th", null, toDisplayString(_ctx.t('ui.datepicker.weeks.sat')), 1)]), (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.state.calendar, function (item, index) {
return openBlock(), createElementBlock("tr", {
key: index
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(item, function (day, i) {
return openBlock(), createElementBlock("td", {
key: i,
onClick: function onClick($event) {
return _ctx.selectDay(day);
},
width: "14.2857%"
}, [createElementVNode("div", {
class: normalizeClass(['tiny-calendar__day', {
selected: !(day.isLast || day.isNext) && _ctx.state.selectedDate === _ctx.getTime(day.value),
disable: day.isLast || day.isNext,
today: _ctx.isToday(day)
}])
}, [createElementVNode("div", _hoisted_20, toDisplayString(day.value), 1), !(day.isLast || day.isNext) ? (openBlock(), createElementBlock("ul", _hoisted_21, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.getEventByDay(day.value), function (_ref, j) {
var type = _ref.type,
title = _ref.title,
content = _ref.content,
_ref$parseTime = _ref.parseTime,
year = _ref$parseTime.year,
month = _ref$parseTime.month,
day = _ref$parseTime.day,
hours = _ref$parseTime.hours,
minutes = _ref$parseTime.minutes;
return openBlock(), createElementBlock("li", {
key: j
}, [renderSlot(_ctx.$slots, "day", {
slotScope: {
type: type,
title: title,
content: content,
year: year,
month: month,
day: day,
hours: hours,
minutes: minutes
}
}, function () {
return [createVNode(_component_tooltip, {
type: type,
placement: "right",
class: "tiny-calendar__tip",
"popper-class": "tiny-calendar__tip",
mode: "hover"
}, {
content: withCtx(function () {
return [createElementVNode("div", null, [createElementVNode("div", _hoisted_22, [createElementVNode("div", _hoisted_23, toDisplayString("".concat(year, "-").concat(month, "-").concat(day)), 1), createElementVNode("div", _hoisted_24, toDisplayString("".concat(hours, ":").concat(minutes)), 1)]), createElementVNode("div", {
class: normalizeClass(['tiny-calendar__tip-title', type || 'info'])
}, toDisplayString(title), 3), createElementVNode("div", _hoisted_25, toDisplayString(content), 1)])];
/* STABLE */
}, 8, ["onClick"])]), createElementVNode("li", null, [createElementVNode("ul", _hoisted_17, [createElementVNode(
"li",
{
class: normalizeClass({
active: _ctx.state.displayMode === "month"
}),
onClick: _cache[2] || (_cache[2] = function($event) {
return _ctx.toggeModel("month");
})
},
toDisplayString(_ctx.t("ui.datepicker.month")),
3
/* TEXT, CLASS */
), createElementVNode(
"li",
{
class: normalizeClass({
active: _ctx.state.displayMode === "year"
}),
onClick: _cache[3] || (_cache[3] = function($event) {
return _ctx.toggeModel("year");
})
},
toDisplayString(_ctx.t("ui.calendar.showType.year")),
3
/* TEXT, CLASS */
)])])])];
})]), createElementVNode(
"div",
{
class: normalizeClass(["tiny-calendar__main", _ctx.state.displayMode])
},
[createCommentVNode(" 月模式 "), withDirectives(createElementVNode(
"table",
_hoisted_18,
[createElementVNode("tr", null, [createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.sun")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.mon")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.tue")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.wed")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.thu")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.fri")),
1
/* TEXT */
), createElementVNode(
"th",
null,
toDisplayString(_ctx.t("ui.datepicker.weeks.sat")),
1
/* TEXT */
)]), (openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.state.calendar, function(item, index) {
return openBlock(), createElementBlock("tr", {
key: index
}, [(openBlock(true), createElementBlock(
Fragment,
null,
renderList(item, function(day, i) {
return openBlock(), createElementBlock("td", {
key: i,
onClick: function onClick($event) {
return _ctx.selectDay(day);
},
width: "14.2857%"
}, [createElementVNode(
"div",
{
class: normalizeClass(["tiny-calendar__day", {
selected: !(day.isLast || day.isNext) && _ctx.state.selectedDate === _ctx.getTime(day.value),
disable: day.isLast || day.isNext,
today: _ctx.isToday(day)
}])
},
[createElementVNode(
"div",
_hoisted_20,
toDisplayString(day.value),
1
/* TEXT */
), !(day.isLast || day.isNext) ? (openBlock(), createElementBlock("ul", _hoisted_21, [(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.getEventByDay(day.value), function(_ref, j) {
var type = _ref.type, title = _ref.title, content = _ref.content, _ref$parseTime = _ref.parseTime, year = _ref$parseTime.year, month = _ref$parseTime.month, day2 = _ref$parseTime.day, hours = _ref$parseTime.hours, minutes = _ref$parseTime.minutes;
return openBlock(), createElementBlock("li", {
key: j
}, [renderSlot(_ctx.$slots, "day", {
slotScope: {
type,
title,
content,
year,
month,
day: day2,
hours,
minutes
}
}, function() {
return [createVNode(_component_tooltip, {
type,
placement: "right",
class: "tiny-calendar__tip",
"popper-class": "tiny-calendar__tip",
mode: "hover"
}, {
content: withCtx(function() {
return [createElementVNode("div", null, [createElementVNode("div", _hoisted_22, [createElementVNode(
"div",
_hoisted_23,
toDisplayString(year + "-" + month + "-" + day2),
1
/* TEXT */
), createElementVNode(
"div",
_hoisted_24,
toDisplayString(hours + ":" + minutes),
1
/* TEXT */
)]), createElementVNode(
"div",
{
class: normalizeClass(["tiny-calendar__tip-title", type || "info"])
},
toDisplayString(title),
3
/* TEXT, CLASS */
), createElementVNode(
"div",
_hoisted_25,
toDisplayString(content),
1
/* TEXT */
)])];
}),
default: withCtx(function() {
return [createElementVNode(
"div",
{
class: normalizeClass(["event", type || "info"])
},
toDisplayString(title),
3
/* TEXT, CLASS */
)];
}),
_: 2
/* DYNAMIC */
}, 1032, ["type"])];
})]);
}),
128
/* KEYED_FRAGMENT */
))])) : createCommentVNode("v-if", true)],
2
/* CLASS */
)], 8, _hoisted_19);
}),
default: withCtx(function () {
return [createElementVNode("div", {
class: normalizeClass(['event', type || 'info'])
}, toDisplayString(title), 3)];
128
/* KEYED_FRAGMENT */
))]);
}),
128
/* KEYED_FRAGMENT */
))],
512
/* NEED_PATCH */
), [[vShow, _ctx.state.displayMode === "month"]]), createCommentVNode(" 年模式 "), withDirectives(createElementVNode(
"table",
_hoisted_26,
[(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.genMonths(), function(item, i) {
return openBlock(), createElementBlock("tr", {
key: i
}, [(openBlock(true), createElementBlock(
Fragment,
null,
renderList(item, function(mth, j) {
return openBlock(), createElementBlock("td", {
key: j,
onClick: function onClick($event) {
return _ctx.selectMonth(mth);
},
width: "25%"
}, [createElementVNode(
"div",
{
class: normalizeClass(["tiny-calendar__day", {
selected: _ctx.state.activeMonth === mth,
"this-month": _ctx.isThisMonth(mth)
}])
},
[createElementVNode(
"div",
_hoisted_28,
toDisplayString(_ctx.t("ui.datepicker.month" + mth)),
1
/* TEXT */
), createElementVNode("ul", _hoisted_29, [(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.getEventByMonth(mth), function(_ref2, k) {
var type = _ref2.type, title = _ref2.title, content = _ref2.content, _ref2$parseTime = _ref2.parseTime, year = _ref2$parseTime.year, month = _ref2$parseTime.month, day = _ref2$parseTime.day, hours = _ref2$parseTime.hours, minutes = _ref2$parseTime.minutes;
return openBlock(), createElementBlock("li", {
key: k
}, [renderSlot(_ctx.$slots, "month", {
slotScope: {
type,
title,
content,
year,
month,
day,
hours,
minutes
}
}, function() {
return [createVNode(_component_tooltip, {
type,
class: "tiny-calendar__tip",
placement: "right",
"popper-class": "tiny-calendar__tip",
mode: "hover"
}, {
content: withCtx(function() {
return [createElementVNode("div", null, [createElementVNode("div", _hoisted_30, [createElementVNode(
"div",
_hoisted_31,
toDisplayString(year + "-" + month + "-" + day),
1
/* TEXT */
), createElementVNode(
"div",
_hoisted_32,
toDisplayString(hours + ":" + minutes),
1
/* TEXT */
)]), createElementVNode(
"div",
{
class: normalizeClass(["tiny-calendar__tip-title", type || "info"])
},
toDisplayString(title),
3
/* TEXT, CLASS */
), createElementVNode(
"div",
_hoisted_33,
toDisplayString(content),
1
/* TEXT */
)])];
}),
default: withCtx(function() {
return [createElementVNode(
"div",
{
class: normalizeClass(["event", type || "info"])
},
toDisplayString(title),
3
/* TEXT, CLASS */
)];
}),
_: 2
/* DYNAMIC */
}, 1032, ["type"])];
})]);
}),
128
/* KEYED_FRAGMENT */
))])],
2
/* CLASS */
)], 8, _hoisted_27);
}),
_: 2
}, 1032, ["type"])];
})]);
}), 128))])) : createCommentVNode("", true)], 2)], 8, _hoisted_19);
}), 128))]);
}), 128))], 512), [[vShow, _ctx.state.displayMode === 'month']]), withDirectives(createElementVNode("table", _hoisted_26, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.genMonths(), function (item, i) {
return openBlock(), createElementBlock("tr", {
key: i
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(item, function (mth, j) {
return openBlock(), createElementBlock("td", {
key: j,
onClick: function onClick($event) {
return _ctx.selectMonth(mth);
},
width: "25%"
}, [createElementVNode("div", {
class: normalizeClass(['tiny-calendar__day', {
selected: _ctx.state.activeMonth === mth,
'this-month': _ctx.isThisMonth(mth)
}])
}, [createElementVNode("div", _hoisted_28, toDisplayString(_ctx.t('ui.datepicker.month' + mth)), 1), createElementVNode("ul", _hoisted_29, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.getEventByMonth(mth), function (_ref2, k) {
var type = _ref2.type,
title = _ref2.title,
content = _ref2.content,
_ref2$parseTime = _ref2.parseTime,
year = _ref2$parseTime.year,
month = _ref2$parseTime.month,
day = _ref2$parseTime.day,
hours = _ref2$parseTime.hours,
minutes = _ref2$parseTime.minutes;
return openBlock(), createElementBlock("li", {
key: k
}, [renderSlot(_ctx.$slots, "month", {
slotScope: {
type: type,
title: title,
content: content,
year: year,
month: month,
day: day,
hours: hours,
minutes: minutes
}
}, function () {
return [createVNode(_component_tooltip, {
type: type,
class: "tiny-calendar__tip",
placement: "right",
"popper-class": "tiny-calendar__tip",
mode: "hover"
}, {
content: withCtx(function () {
return [createElementVNode("div", null, [createElementVNode("div", _hoisted_30, [createElementVNode("div", _hoisted_31, toDisplayString("".concat(year, "-").concat(month, "-").concat(day)), 1), createElementVNode("div", _hoisted_32, toDisplayString("".concat(hours, ":").concat(minutes)), 1)]), createElementVNode("div", {
class: normalizeClass(['tiny-calendar__tip-title', type || 'info'])
}, toDisplayString(title), 3), createElementVNode("div", _hoisted_33, toDisplayString(content), 1)])];
}),
default: withCtx(function () {
return [createElementVNode("div", {
class: normalizeClass(['event', type || 'info'])
}, toDisplayString(title), 3)];
}),
_: 2
}, 1032, ["type"])];
})]);
}), 128))])], 2)], 8, _hoisted_27);
}), 128))]);
}), 128))], 512), [[vShow, _ctx.state.displayMode === 'year']])], 2)]);
128
/* KEYED_FRAGMENT */
))]);
}),
128
/* KEYED_FRAGMENT */
))],
512
/* NEED_PATCH */
), [[vShow, _ctx.state.displayMode === "year"]])],
2
/* CLASS */
)]);
}
script.render = render;
export { script as default };
var pc = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
export {
pc as default
};
{
"name": "@opentiny/vue-calendar",
"version": "3.6.0",
"version": "3.6.1-alpha.0",
"description": "",
"main": "lib/index.js",
"scripts": {
"lint": "eslint src/**/*{.js,.html,.vue} --quiet",
"build:ui2": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../build/build-ui.js",
"build:ui3": "cross-env BUILD_TARGET=single NODE_ENV=production node ../../example/build/build-ui.js"
},
"main": "./lib/index.js",
"dependencies": {
"@opentiny/vue-common": "~3.6.0",
"@opentiny/vue-icon": "~3.6.0",
"@opentiny/vue-renderless": "~3.6.0",
"@opentiny/vue-tooltip": "~3.6.0",
"@opentiny/vue-popover": "~3.6.0",
"@opentiny/vue-theme": "~3.6.0",
"@opentiny/vue-theme-mobile": "~3.6.0"
"@opentiny/vue-common": "~3.6.1-alpha.0",
"@opentiny/vue-icon": "~3.6.1-alpha.0",
"@opentiny/vue-renderless": "~3.6.1-alpha.0",
"@opentiny/vue-tooltip": "~3.6.1-alpha.0",
"@opentiny/vue-popover": "~3.6.1-alpha.0"
},
"license": "MIT",
"types": "index.d.ts",
"sideEffects": false
"scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
}
}

@@ -1,2 +0,2 @@

declare const _default: import("vue").DefineComponent<{
declare const _default: import("@vue/runtime-core").DefineComponent<{
/**

@@ -8,2 +8,3 @@ * @property {String} [mode='month'] - 显示模式,month|year 可选

default: string;
validator: (value: string) => boolean;
};

@@ -36,3 +37,5 @@ /**

showSelected: BooleanConstructor;
}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
/**

@@ -44,2 +47,3 @@ * @property {String} [mode='month'] - 显示模式,month|year 可选

default: string;
validator: (value: string) => boolean;
};

@@ -46,0 +50,0 @@ /**

@@ -1,19 +0,15 @@

declare const _default: {
components: {
Tooltip: any;
Popover: any;
Button: any;
IconChevronUp: any;
IconChevronDown: any;
};
props: string[];
setup(props: any, context: any): {
t: any;
vm: any;
f: (props: any, attrs?: {}) => {};
a: (attrs: any, filters: any, include: any) => {};
d: (props: any) => void;
dp: (props: any) => void;
};
};
export default _default;
declare const _sfc_main: import("@vue/runtime-core").DefineComponent<Readonly<{
[x: string]: any;
}>, {
t: (this: any, path: any, options?: any) => any;
vm: any;
f: (props: any, attrs?: {}) => {};
a: (attrs: any, filters: any, include: any) => {};
d: (props: any) => void;
dp: (props: any) => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<Readonly<{
[x: string]: any;
}>>>, {
[x: string]: any;
}>;
export default _sfc_main;
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc