attic-datepicker - npm Package Compare versions

Comparing version 0.0.7 to 0.0.8

dist/attic-datepicker.es.js

@@ -28,3 +28,3 @@ var __defProp = Object.defineProperty;
 const useDirective = (binding) => {
-  const { instance } = binding;
+  const { instance, arg, value } = binding;
   document.body.addEventListener("click", ($event) => {
@@ -34,3 +34,3 @@ if (instance.$el.contains($event.target)) {
     }
-    return instance.showCalendar = false;
+    instance.showCalendar = instance.$el.contains($event.target) || document.getElementById(value) === $event.target || value === $event.target;
   });
@@ -66,4 +66,4 @@ };
       const years2 = [];
-      const startYear = parseInt(dayjs().subtract(100, "years").format("YYYY"));
-      for (let i = 0; i <= 100; i++) {
+      const startYear = parseInt(dayjs().add(5, "years").subtract(105, "years").format("YYYY"));
+      for (let i = 0; i <= 105; i++) {
         years2.push(startYear + i);
@@ -182,8 +182,13 @@ }
 ];
-const _hoisted_4 = { class: "space-y-5" };
-const _hoisted_5 = { class: "text-center font-bold" };
-const _hoisted_6 = { class: "grid grid-cols-7" };
+const _hoisted_4$1 = { class: "space-y-5" };
+const _hoisted_5$1 = { class: "text-center font-bold" };
+const _hoisted_6$1 = { class: "grid grid-cols-7" };
 const _hoisted_7 = { class: "font-semibold text-sm text-gray-400 text-center" };
-const _hoisted_8 = ["onClick"];
-const _hoisted_9 = /* @__PURE__ */ createElementVNode("svg", {
+const _hoisted_8 = { key: 0 };
+const _hoisted_9 = ["onClick"];
+const _hoisted_10 = {
+  key: 1,
+  class: "h-full w-full bg-gray-100 absolute z-0"
+};
+const _hoisted_11 = /* @__PURE__ */ createElementVNode("svg", {
   class: "w-3",
@@ -201,4 +206,4 @@ xmlns: "http://www.w3.org/2000/svg",
 ], -1);
-const _hoisted_10 = [
-  _hoisted_9
+const _hoisted_12 = [
+  _hoisted_11
 ];
@@ -211,4 +216,4 @@ function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
     }, _hoisted_3$1),
-    createElementVNode("div", _hoisted_4, [
-      createElementVNode("h2", _hoisted_5, [
+    createElementVNode("div", _hoisted_4$1, [
+      createElementVNode("h2", _hoisted_5$1, [
         createElementVNode("span", {
@@ -223,3 +228,3 @@ class: "hover:bg-attic-secondary hover:text-white p-2 rounded-lg cursor-pointer",
       ]),
-      createElementVNode("div", _hoisted_6, [
+      createElementVNode("div", _hoisted_6$1, [
         (openBlock(true), createElementBlock(Fragment, null, renderList($setup.dayjs.weekdaysMin(), (weekDay) => {
@@ -230,19 +235,23 @@ return openBlock(), createElementBlock("div", _hoisted_7, toDisplayString(weekDay), 1);
           return openBlock(), createElementBlock("div", null, [
-            $setup.isSameMonth(day) ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: normalizeClass([
-                { "bg-attic-primary text-white": $setup.isSelectedDay(day) },
-                { "rounded-full": !$setup.atticDatepicker.isRange },
-                { "rounded-l-full": $setup.atticDatepicker.isRange && $setup.atticDatepicker.selectedDate.value && $setup.atticDatepicker.selectedDate.value.isSame(day) },
-                { "rounded-r-full": $setup.atticDatepicker.isRange && $setup.atticDatepicker.selectedEndDate.value && $setup.atticDatepicker.selectedEndDate.value.isSame(day) },
-                { "bg-gray-100 rounded-none": $setup.isInBetweenRange(day) }
-              ])
-            }, [
+            $setup.isSameMonth(day) ? (openBlock(), createElementBlock("div", _hoisted_8, [
               createElementVNode("div", {
-                class: "hover:border hover:rounded-full mx-auto border-primary cursor-pointer flex justify-center items-center font-bold text-sm w-12 h-12",
+                class: "mx-auto border-primary cursor-pointer font-bold text-sm relative",
                 onClick: ($event) => $setup.selectDate(day)
               }, [
-                createElementVNode("span", null, toDisplayString(day.format("DD")), 1)
-              ], 8, _hoisted_8)
-            ], 2)) : createCommentVNode("", true)
+                $setup.atticDatepicker.isRange && $setup.isSelectedDay(day) && ($setup.atticDatepicker.selectedDate.value && $setup.atticDatepicker.selectedEndDate.value) ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(["h-full w-1/2 bg-gray-100 absolute z-0", [
+                    { "right-0": $setup.atticDatepicker.isRange && $setup.atticDatepicker.selectedDate.value && $setup.atticDatepicker.selectedDate.value.isSame(day) },
+                    { "left-0": $setup.atticDatepicker.isRange && $setup.atticDatepicker.selectedEndDate.value && $setup.atticDatepicker.selectedEndDate.value.isSame(day) }
+                  ]])
+                }, null, 2)) : createCommentVNode("", true),
+                $setup.isInBetweenRange(day) ? (openBlock(), createElementBlock("div", _hoisted_10)) : createCommentVNode("", true),
+                createElementVNode("span", {
+                  class: normalizeClass(["z-10 block relative text-center align-middle hover:rounded-full block w-12 h-12 text-center align-middle flex items-center justify-center", [
+                    { "bg-attic-primary text-white rounded-full": $setup.isSelectedDay(day) },
+                    { "hover:bg-gray-200": !$setup.isSelectedDay(day) }
+                  ]])
+                }, toDisplayString(day.format("DD")), 3)
+              ], 8, _hoisted_9)
+            ])) : createCommentVNode("", true)
           ]);
@@ -255,3 +264,3 @@ }), 256))
       class: "w-10 h-10 hover:bg-gray-100 rounded-full flex items-center justify-center"
-    }, _hoisted_10)
+    }, _hoisted_12)
   ]);
@@ -307,3 +316,3 @@ }
 class Datepicker {
-  constructor(date, format, isRange, autoApply) {
+  constructor(date, format, isRange, keepOpen) {
     __publicField(this, "modelValue");
@@ -313,3 +322,3 @@ __publicField(this, "selectedDate");
     __publicField(this, "isRange");
-    __publicField(this, "autoApply");
+    __publicField(this, "keepOpen");
     __publicField(this, "format");
@@ -319,3 +328,3 @@ this.modelValue = ref(null);
     this.selectedEndDate = ref(null);
-    this.autoApply = autoApply;
+    this.keepOpen = keepOpen;
     this.isRange = isRange;
@@ -364,3 +373,3 @@ this.format = format;
   ableToClose() {
-    if (this.autoApply) {
+    if (!this.keepOpen) {
       if (this.isRange && this.selectedDate.value && this.selectedEndDate.value) {
@@ -376,4 +385,4 @@ return true;
   getValue() {
-    if (!this.isRange) {
-      this.modelValue.value = this.selectedDate.value;
+    if (!this.isRange && this.selectedDate.value) {
+      this.modelValue.value = this.selectedDate.value.format(this.format);
       return;
@@ -399,5 +408,9 @@ }
     },
+    trigger: {
+      type: String,
+      default: null
+    },
     showXMonths: Number,
     isRange: Boolean,
-    autoApply: Boolean
+    keepOpen: Boolean
   },
@@ -422,3 +435,3 @@ components: {
     const showCalendar = ref(false);
-    const atticDatepicker = new Datepicker(props.modelValue, props.format, props.isRange || props.isRange === "true", props.autoApply || props.autoApply === "true");
+    const atticDatepicker = new Datepicker(props.modelValue, props.format, props.isRange || props.isRange === "true", typeof props.keepOpen === "string" ? !(props.keepOpen === "false") : props.keepOpen);
     const calendarView = computed(() => {
@@ -461,8 +474,14 @@ const date = ref(atticDatepicker.selectedDate.value ?? dayjs());
 };
-const _hoisted_1 = { class: "space-y-2 relative" };
+const _hoisted_1 = { class: "md:space-y-2" };
 const _hoisted_2 = { key: 0 };
-const _hoisted_3 = {
+const _hoisted_3 = { key: 1 };
+const _hoisted_4 = {
+  key: 2,
+  class: "text-gray-400"
+};
+const _hoisted_5 = {
   key: 0,
-  class: "attic-datepicker-calendar absolute bg-white rounded-[28px] border py-5 px-6 shadow-xl flex items-start space-x-3 z-[99] min-w-0"
+  class: "attic-datepicker-calendar md:absolute fixed bg-white md:rounded-[28px] border py-5 px-6 md:shadow-xl z-[99] md:top-auto md:right-auto md:h-auto md:w-auto md:space-y-0 top-0 right-0 h-full w-full space-y-8 overflow-y-auto"
 };
+const _hoisted_6 = { class: "md:flex md:items-start md:space-x-3 md:space-y-0 space-y-8" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
@@ -477,4 +496,4 @@ const _component_Calendar = resolveComponent("Calendar");
     }, () => [
-      createElementVNode("div", mergeProps({ class: "relative block w-full pl-3 pr-12 py-2.5 rounded-lg overflow-hidden text-sm transition-colors bg-white border focus:ring focus:outline-none dark:focus:ring-opacity-20" }, _ctx.$attrs), [
-        $setup.atticDatepicker.selectedDate.value ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString($setup.atticDatepicker.selectedDate.value.format($props.format)), 1)) : createCommentVNode("", true)
+      createElementVNode("div", mergeProps({ class: "relative block w-full pl-3 pr-12 py-3 rounded-lg overflow-hidden text-sm transition-colors bg-white border focus:ring focus:outline-none shadow" }, _ctx.$attrs), [
+        !$props.isRange && $setup.atticDatepicker.selectedDate.value ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString($setup.atticDatepicker.modelValue.value), 1)) : $props.isRange && $setup.atticDatepicker.modelValue.value && $setup.atticDatepicker.modelValue.value.length > 1 ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString($setup.atticDatepicker.modelValue.value[0]) + " ~ " + toDisplayString($setup.atticDatepicker.modelValue.value[1]), 1)) : (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(_ctx.$attrs.placeholder ?? "Select Date"), 1))
       ], 16)
@@ -491,8 +510,14 @@ ]),
       default: withCtx(() => [
-        $setup.showCalendar ? (openBlock(), createElementBlock("div", _hoisted_3, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(parseInt($props.showXMonths ?? 1), (x) => {
-            return openBlock(), createBlock(_component_Calendar, {
-              date: $setup.calendarView.date.value.add(x - 1, "month")
-            }, null, 8, ["date"]);
-          }), 256))
+        $setup.showCalendar ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          createElementVNode("div", _hoisted_6, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(parseInt($props.showXMonths ?? 1), (x) => {
+              return openBlock(), createBlock(_component_Calendar, {
+                date: $setup.calendarView.date.value.add(x - 1, "month")
+              }, null, 8, ["date"]);
+            }), 256))
+          ]),
+          createElementVNode("button", {
+            class: "sm:hidden w-full bg-red-500 rounded text-white font-bold p-3",
+            onClick: _cache[0] || (_cache[0] = ($event) => $setup.showCalendar = false)
+          }, " Close ")
         ])) : createCommentVNode("", true)
@@ -503,3 +528,3 @@ ]),
   ])), [
-    [_directive_attic]
+    [_directive_attic, $props.trigger, "away"]
   ]);
@@ -506,0 +531,0 @@ }

dist/attic-datepicker.js

@@ -1,9 +0,9 @@
-(function(e,S){typeof exports=="object"&&typeof module<"u"?module.exports=S(require("vue")):typeof define=="function"&&define.amd?define(["vue"],S):(e=typeof globalThis<"u"?globalThis:e||self,e.AtticDatepicker=S(e.Vue))})(this,function(e){"use strict";var ze=Object.defineProperty;var Ue=(e,S,L)=>S in e?ze(e,S,{enumerable:!0,configurable:!0,writable:!0,value:L}):e[S]=L;var H=(e,S,L)=>(Ue(e,typeof S!="symbol"?S+"":S,L),L);const S=c=>{const s=[];for(let l=0;l<=c.date(0).day();l++)s.push(c.date(0).subtract(l,"day"));return s.sort((l,t)=>l.date()-t.date())},L=c=>Array.from({length:c.daysInMonth()},(s,l)=>c.date(l+1)),te=c=>{const{instance:s}=c;document.body.addEventListener("click",l=>s.$el.contains(l.target)?s.showCalendar=!0:s.showCalendar=!1)};var J=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},ne={exports:{}};(function(c,s){(function(l,t){c.exports=t()})(J,function(){var l=1e3,t=6e4,u=36e5,y="millisecond",o="second",d="minute",k="hour",_="day",C="week",i="month",w="quarter",E="year",B="date",I="Invalid Date",T=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,q=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,G={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_")},R=function(p,r,n){var h=String(p);return!h||h.length>=r?p:""+Array(r+1-h.length).join(n)+p},Q={s:R,z:function(p){var r=-p.utcOffset(),n=Math.abs(r),h=Math.floor(n/60),a=n%60;return(r<=0?"+":"-")+R(h,2,"0")+":"+R(a,2,"0")},m:function p(r,n){if(r.date()<n.date())return-p(n,r);var h=12*(n.year()-r.year())+(n.month()-r.month()),a=r.clone().add(h,i),m=n-a<0,f=r.clone().add(h+(m?-1:1),i);return+(-(h+(n-a)/(m?a-f:f-a))||0)},a:function(p){return p<0?Math.ceil(p)||0:Math.floor(p)},p:function(p){return{M:i,y:E,w:C,d:_,D:B,h:k,m:d,s:o,ms:y,Q:w}[p]||String(p||"").toLowerCase().replace(/s$/,"")},u:function(p){return p===void 0}},O="en",Y={};Y[O]=G;var K=function(p){return p instanceof Z},X=function p(r,n,h){var a;if(!r)return O;if(typeof r=="string"){var m=r.toLowerCase();Y[m]&&(a=m),n&&(Y[m]=n,a=m);var f=r.split("-");if(!a&&f.length>1)return p(f[0])}else{var D=r.name;Y[D]=r,a=D}return!h&&a&&(O=a),a||!h&&O},v=function(p,r){if(K(p))return p.clone();var n=typeof r=="object"?r:{};return n.date=p,n.args=arguments,new Z(n)},g=Q;g.l=X,g.i=K,g.w=function(p,r){return v(p,{locale:r.$L,utc:r.$u,x:r.$x,$offset:r.$offset})};var Z=function(){function p(n){this.$L=X(n.locale,null,!0),this.parse(n)}var r=p.prototype;return r.parse=function(n){this.$d=function(h){var a=h.date,m=h.utc;if(a===null)return new Date(NaN);if(g.u(a))return new Date;if(a instanceof Date)return new Date(a);if(typeof a=="string"&&!/Z$/i.test(a)){var f=a.match(T);if(f){var D=f[2]-1||0,M=(f[7]||"0").substring(0,3);return m?new Date(Date.UTC(f[1],D,f[3]||1,f[4]||0,f[5]||0,f[6]||0,M)):new Date(f[1],D,f[3]||1,f[4]||0,f[5]||0,f[6]||0,M)}}return new Date(a)}(n),this.$x=n.x||{},this.init()},r.init=function(){var n=this.$d;this.$y=n.getFullYear(),this.$M=n.getMonth(),this.$D=n.getDate(),this.$W=n.getDay(),this.$H=n.getHours(),this.$m=n.getMinutes(),this.$s=n.getSeconds(),this.$ms=n.getMilliseconds()},r.$utils=function(){return g},r.isValid=function(){return this.$d.toString()!==I},r.isSame=function(n,h){var a=v(n);return this.startOf(h)<=a&&a<=this.endOf(h)},r.isAfter=function(n,h){return v(n)<this.startOf(h)},r.isBefore=function(n,h){return this.endOf(h)<v(n)},r.$g=function(n,h,a){return g.u(n)?this[h]:this.set(a,n)},r.unix=function(){return Math.floor(this.valueOf()/1e3)},r.valueOf=function(){return this.$d.getTime()},r.startOf=function(n,h){var a=this,m=!!g.u(h)||h,f=g.p(n),D=function(W,V){var A=g.w(a.$u?Date.UTC(a.$y,V,W):new Date(a.$y,V,W),a);return m?A:A.endOf(_)},M=function(W,V){return g.w(a.toDate()[W].apply(a.toDate("s"),(m?[0,0,0,0]:[23,59,59,999]).slice(V)),a)},$=this.$W,x=this.$M,j=this.$D,N="set"+(this.$u?"UTC":"");switch(f){case E:return m?D(1,0):D(31,11);case i:return m?D(1,x):D(0,x+1);case C:var z=this.$locale().weekStart||0,U=($<z?$+7:$)-z;return D(m?j-U:j+(6-U),x);case _:case B:return M(N+"Hours",0);case k:return M(N+"Minutes",1);case d:return M(N+"Seconds",2);case o:return M(N+"Milliseconds",3);default:return this.clone()}},r.endOf=function(n){return this.startOf(n,!1)},r.$set=function(n,h){var a,m=g.p(n),f="set"+(this.$u?"UTC":""),D=(a={},a[_]=f+"Date",a[B]=f+"Date",a[i]=f+"Month",a[E]=f+"FullYear",a[k]=f+"Hours",a[d]=f+"Minutes",a[o]=f+"Seconds",a[y]=f+"Milliseconds",a)[m],M=m===_?this.$D+(h-this.$W):h;if(m===i||m===E){var $=this.clone().set(B,1);$.$d[D](M),$.init(),this.$d=$.set(B,Math.min(this.$D,$.daysInMonth())).$d}else D&&this.$d[D](M);return this.init(),this},r.set=function(n,h){return this.clone().$set(n,h)},r.get=function(n){return this[g.p(n)]()},r.add=function(n,h){var a,m=this;n=Number(n);var f=g.p(h),D=function(x){var j=v(m);return g.w(j.date(j.date()+Math.round(x*n)),m)};if(f===i)return this.set(i,this.$M+n);if(f===E)return this.set(E,this.$y+n);if(f===_)return D(1);if(f===C)return D(7);var M=(a={},a[d]=t,a[k]=u,a[o]=l,a)[f]||1,$=this.$d.getTime()+n*M;return g.w($,this)},r.subtract=function(n,h){return this.add(-1*n,h)},r.format=function(n){var h=this,a=this.$locale();if(!this.isValid())return a.invalidDate||I;var m=n||"YYYY-MM-DDTHH:mm:ssZ",f=g.z(this),D=this.$H,M=this.$m,$=this.$M,x=a.weekdays,j=a.months,N=function(V,A,ee,P){return V&&(V[A]||V(h,m))||ee[A].slice(0,P)},z=function(V){return g.s(D%12||12,V,"0")},U=a.meridiem||function(V,A,ee){var P=V<12?"AM":"PM";return ee?P.toLowerCase():P},W={YY:String(this.$y).slice(-2),YYYY:this.$y,M:$+1,MM:g.s($+1,2,"0"),MMM:N(a.monthsShort,$,j,3),MMMM:N(j,$),D:this.$D,DD:g.s(this.$D,2,"0"),d:String(this.$W),dd:N(a.weekdaysMin,this.$W,x,2),ddd:N(a.weekdaysShort,this.$W,x,3),dddd:x[this.$W],H:String(D),HH:g.s(D,2,"0"),h:z(1),hh:z(2),a:U(D,M,!0),A:U(D,M,!1),m:String(M),mm:g.s(M,2,"0"),s:String(this.$s),ss:g.s(this.$s,2,"0"),SSS:g.s(this.$ms,3,"0"),Z:f};return m.replace(q,function(V,A){return A||W[V]||f.replace(":","")})},r.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},r.diff=function(n,h,a){var m,f=g.p(h),D=v(n),M=(D.utcOffset()-this.utcOffset())*t,$=this-D,x=g.m(this,D);return x=(m={},m[E]=x/12,m[i]=x,m[w]=x/3,m[C]=($-M)/6048e5,m[_]=($-M)/864e5,m[k]=$/u,m[d]=$/t,m[o]=$/l,m)[f]||$,a?x:g.a(x)},r.daysInMonth=function(){return this.endOf(i).$D},r.$locale=function(){return Y[this.$L]},r.locale=function(n,h){if(!n)return this.$L;var a=this.clone(),m=X(n,h,!0);return m&&(a.$L=m),a},r.clone=function(){return g.w(this.$d,this)},r.toDate=function(){return new Date(this.valueOf())},r.toJSON=function(){return this.isValid()?this.toISOString():null},r.toISOString=function(){return this.$d.toISOString()},r.toString=function(){return this.$d.toUTCString()},p}(),ue=Z.prototype;return v.prototype=ue,[["$ms",y],["$s",o],["$m",d],["$H",k],["$W",_],["$M",i],["$y",E],["$D",B]].forEach(function(p){ue[p[1]]=function(r){return this.$g(r,p[0],p[1])}}),v.extend=function(p,r){return p.$i||(p(r,Z,v),p.$i=!0),v},v.locale=X,v.isDayjs=K,v.unix=function(p){return v(1e3*p)},v.en=Y[O],v.Ls=Y,v.p={},v})})(ne);const b=ne.exports;var ae={exports:{}};(function(c,s){(function(l,t){c.exports=t()})(J,function(){return function(l,t,u){var y=t.prototype,o=function(i){return i&&(i.indexOf?i:i.s)},d=function(i,w,E,B,I){var T=i.name?i:i.$locale(),q=o(T[w]),G=o(T[E]),R=q||G.map(function(O){return O.slice(0,B)});if(!I)return R;var Q=T.weekStart;return R.map(function(O,Y){return R[(Y+(Q||0))%7]})},k=function(){return u.Ls[u.locale()]},_=function(i,w){return i.formats[w]||function(E){return E.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,function(B,I,T){return I||T.slice(1)})}(i.formats[w.toUpperCase()])},C=function(){var i=this;return{months:function(w){return w?w.format("MMMM"):d(i,"months")},monthsShort:function(w){return w?w.format("MMM"):d(i,"monthsShort","months",3)},firstDayOfWeek:function(){return i.$locale().weekStart||0},weekdays:function(w){return w?w.format("dddd"):d(i,"weekdays")},weekdaysMin:function(w){return w?w.format("dd"):d(i,"weekdaysMin","weekdays",2)},weekdaysShort:function(w){return w?w.format("ddd"):d(i,"weekdaysShort","weekdays",3)},longDateFormat:function(w){return _(i.$locale(),w)},meridiem:this.$locale().meridiem,ordinal:this.$locale().ordinal}};y.localeData=function(){return C.bind(this)()},u.localeData=function(){var i=k();return{firstDayOfWeek:function(){return i.weekStart||0},weekdays:function(){return u.weekdays()},weekdaysShort:function(){return u.weekdaysShort()},weekdaysMin:function(){return u.weekdaysMin()},months:function(){return u.months()},monthsShort:function(){return u.monthsShort()},longDateFormat:function(w){return _(i,w)},meridiem:i.meridiem,ordinal:i.ordinal}},u.months=function(){return d(k(),"months")},u.monthsShort=function(){return d(k(),"monthsShort","months",3)},u.weekdays=function(i){return d(k(),"weekdays",null,null,i)},u.weekdaysShort=function(i){return d(k(),"weekdaysShort","weekdays",3,i)},u.weekdaysMin=function(i){return d(k(),"weekdaysMin","weekdays",2,i)}}})})(ae);const he=ae.exports;var re={exports:{}};(function(c,s){(function(l,t){c.exports=t()})(J,function(){return function(l,t){t.prototype.weekday=function(u){var y=this.$locale().weekStart||0,o=this.$W,d=(o<y?o+7:o)-y;return this.$utils().u(u)?d:this.subtract(d,"day").add(u,"day")}}})})(re);const fe=re.exports;var se={exports:{}};(function(c,s){(function(l,t){c.exports=t()})(J,function(){return function(l,t,u){t.prototype.isBetween=function(y,o,d,k){var _=u(y),C=u(o),i=(k=k||"()")[0]==="(",w=k[1]===")";return(i?this.isAfter(_,d):!this.isBefore(_,d))&&(w?this.isBefore(C,d):!this.isAfter(C,d))||(i?this.isBefore(_,d):!this.isAfter(_,d))&&(w?this.isAfter(C,d):!this.isBefore(C,d))}}})})(se);const me=se.exports,pe=()=>({calendar:e.computed(()=>({monthView:{date:s=>S(s).concat(L(s))}}))}),F=(c,s)=>{const l=c.__vccOpts||c;for(const[t,u]of s)l[t]=u;return l},we={name:"YearCalendar",setup(c,{emit:s}){e.inject("atticDatepicker");const l=e.inject("calendarView");return{years:e.computed(()=>{const y=[],o=parseInt(b().subtract(100,"years").format("YYYY"));for(let d=0;d<=100;d++)y.push(o+d);return y.reverse()}),selectYear:y=>{l.value.date.value=l.value.date.value.year(y),s("changeView","dates")},dayjs:b}}},ye={class:"flex-1"},De={class:"max-h-72 max-w-sm overflow-y-auto space-y-5 font-bold text-sm"},ge=["onClick"];function ke(c,s,l,t,u,y){return e.openBlock(),e.createElementBlock("div",ye,[e.createElementVNode("div",De,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.years,o=>(e.openBlock(),e.createElementBlock("button",{class:"w-full hover:bg-attic-thirdly rounded-xl py-3 hover:text-white",onClick:d=>t.selectYear(o)},e.toDisplayString(o),9,ge))),256))])])}const oe=F(we,[["render",ke]]),$e={name:"MonthsCalendar",setup(c,{emit:s}){e.inject("atticDatepicker");const l=e.inject("calendarView");return{selectMonth:u=>{l.value.date.value=l.value.date.value.month(u),s("changeView","dates")},dayjs:b}}},Me={class:"flex-1"},_e={class:"grid grid-cols-2 gap-3 font-bold text-sm w-full"},ve=["onClick"];function xe(c,s,l,t,u,y){return e.openBlock(),e.createElementBlock("div",Me,[e.createElementVNode("div",_e,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(12,o=>e.createElementVNode("button",{class:"rounded-xl py-3 hover:bg-attic-thirdly hover:text-white px-2",onClick:d=>t.selectMonth(o-1)},e.toDisplayString(t.dayjs().month(o-1).format("MMMM")),9,ve)),64))])])}const ie=F($e,[["render",xe]]),Ve={name:"MonthCalendar",setup(c,{emit:s}){const l=e.inject("calendarView"),t=e.inject("atticDatepicker"),u=e.inject("showCalendar"),y=e.inject("monthDays"),o=e.inject("date");return{atticDatepicker:t,calendarView:l,isSameMonth:i=>i.isSame(o.value.format("YYYY-MM"),"month"),isInBetweenRange:i=>t.isRange&&t.selectedDate.value&&t.selectedEndDate.value&&i.isBetween(t.selectedDate.value,t.selectedEndDate.value),isSelectedDay:i=>t.selectedDate.value&&t.selectedDate.value.isSame(i)||t.selectedEndDate.value&&t.selectedEndDate.value.isSame(i),dayjs:b,monthDays:y,date:o,selectDate:i=>{t.selectDate(i),u.value=!t.ableToClose()}}}},Se={class:"flex-1 flex"},Ce=[e.createElementVNode("svg",{class:"w-3",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 444.531 444.531","xml:space":"preserve"},[e.createElementVNode("g",null,[e.createElementVNode("path",{d:`M213.13,222.409L351.88,83.653c7.05-7.043,10.567-15.657,10.567-25.841c0-10.183-3.518-18.793-10.567-25.835
+(function(e,v){typeof exports=="object"&&typeof module<"u"?module.exports=v(require("vue")):typeof define=="function"&&define.amd?define(["vue"],v):(e=typeof globalThis<"u"?globalThis:e||self,e.AtticDatepicker=v(e.Vue))})(this,function(e){"use strict";var Pe=Object.defineProperty;var qe=(e,v,T)=>v in e?Pe(e,v,{enumerable:!0,configurable:!0,writable:!0,value:T}):e[v]=T;var I=(e,v,T)=>(qe(e,typeof v!="symbol"?v+"":v,T),T);const v=l=>{const r=[];for(let c=0;c<=l.date(0).day();c++)r.push(l.date(0).subtract(c,"day"));return r.sort((c,t)=>c.date()-t.date())},T=l=>Array.from({length:l.daysInMonth()},(r,c)=>l.date(c+1)),te=l=>{const{instance:r,arg:c,value:t}=l;document.body.addEventListener("click",d=>{if(r.$el.contains(d.target))return r.showCalendar=!0;r.showCalendar=r.$el.contains(d.target)||document.getElementById(t)===d.target||t===d.target})};var J=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},ne={exports:{}};(function(l,r){(function(c,t){l.exports=t()})(J,function(){var c=1e3,t=6e4,d=36e5,y="millisecond",s="second",u="minute",k="hour",$="day",C="week",i="month",w="quarter",E="year",B="date",H="Invalid Date",R=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,q=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,G={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_")},A=function(p,o,n){var h=String(p);return!h||h.length>=o?p:""+Array(o+1-h.length).join(n)+p},Q={s:A,z:function(p){var o=-p.utcOffset(),n=Math.abs(o),h=Math.floor(n/60),a=n%60;return(o<=0?"+":"-")+A(h,2,"0")+":"+A(a,2,"0")},m:function p(o,n){if(o.date()<n.date())return-p(n,o);var h=12*(n.year()-o.year())+(n.month()-o.month()),a=o.clone().add(h,i),m=n-a<0,f=o.clone().add(h+(m?-1:1),i);return+(-(h+(n-a)/(m?a-f:f-a))||0)},a:function(p){return p<0?Math.ceil(p)||0:Math.floor(p)},p:function(p){return{M:i,y:E,w:C,d:$,D:B,h:k,m:u,s,ms:y,Q:w}[p]||String(p||"").toLowerCase().replace(/s$/,"")},u:function(p){return p===void 0}},N="en",O={};O[N]=G;var K=function(p){return p instanceof Z},X=function p(o,n,h){var a;if(!o)return N;if(typeof o=="string"){var m=o.toLowerCase();O[m]&&(a=m),n&&(O[m]=n,a=m);var f=o.split("-");if(!a&&f.length>1)return p(f[0])}else{var D=o.name;O[D]=o,a=D}return!h&&a&&(N=a),a||!h&&N},V=function(p,o){if(K(p))return p.clone();var n=typeof o=="object"?o:{};return n.date=p,n.args=arguments,new Z(n)},g=Q;g.l=X,g.i=K,g.w=function(p,o){return V(p,{locale:o.$L,utc:o.$u,x:o.$x,$offset:o.$offset})};var Z=function(){function p(n){this.$L=X(n.locale,null,!0),this.parse(n)}var o=p.prototype;return o.parse=function(n){this.$d=function(h){var a=h.date,m=h.utc;if(a===null)return new Date(NaN);if(g.u(a))return new Date;if(a instanceof Date)return new Date(a);if(typeof a=="string"&&!/Z$/i.test(a)){var f=a.match(R);if(f){var D=f[2]-1||0,M=(f[7]||"0").substring(0,3);return m?new Date(Date.UTC(f[1],D,f[3]||1,f[4]||0,f[5]||0,f[6]||0,M)):new Date(f[1],D,f[3]||1,f[4]||0,f[5]||0,f[6]||0,M)}}return new Date(a)}(n),this.$x=n.x||{},this.init()},o.init=function(){var n=this.$d;this.$y=n.getFullYear(),this.$M=n.getMonth(),this.$D=n.getDate(),this.$W=n.getDay(),this.$H=n.getHours(),this.$m=n.getMinutes(),this.$s=n.getSeconds(),this.$ms=n.getMilliseconds()},o.$utils=function(){return g},o.isValid=function(){return this.$d.toString()!==H},o.isSame=function(n,h){var a=V(n);return this.startOf(h)<=a&&a<=this.endOf(h)},o.isAfter=function(n,h){return V(n)<this.startOf(h)},o.isBefore=function(n,h){return this.endOf(h)<V(n)},o.$g=function(n,h,a){return g.u(n)?this[h]:this.set(a,n)},o.unix=function(){return Math.floor(this.valueOf()/1e3)},o.valueOf=function(){return this.$d.getTime()},o.startOf=function(n,h){var a=this,m=!!g.u(h)||h,f=g.p(n),D=function(W,S){var L=g.w(a.$u?Date.UTC(a.$y,S,W):new Date(a.$y,S,W),a);return m?L:L.endOf($)},M=function(W,S){return g.w(a.toDate()[W].apply(a.toDate("s"),(m?[0,0,0,0]:[23,59,59,999]).slice(S)),a)},_=this.$W,x=this.$M,j=this.$D,Y="set"+(this.$u?"UTC":"");switch(f){case E:return m?D(1,0):D(31,11);case i:return m?D(1,x):D(0,x+1);case C:var F=this.$locale().weekStart||0,U=(_<F?_+7:_)-F;return D(m?j-U:j+(6-U),x);case $:case B:return M(Y+"Hours",0);case k:return M(Y+"Minutes",1);case u:return M(Y+"Seconds",2);case s:return M(Y+"Milliseconds",3);default:return this.clone()}},o.endOf=function(n){return this.startOf(n,!1)},o.$set=function(n,h){var a,m=g.p(n),f="set"+(this.$u?"UTC":""),D=(a={},a[$]=f+"Date",a[B]=f+"Date",a[i]=f+"Month",a[E]=f+"FullYear",a[k]=f+"Hours",a[u]=f+"Minutes",a[s]=f+"Seconds",a[y]=f+"Milliseconds",a)[m],M=m===$?this.$D+(h-this.$W):h;if(m===i||m===E){var _=this.clone().set(B,1);_.$d[D](M),_.init(),this.$d=_.set(B,Math.min(this.$D,_.daysInMonth())).$d}else D&&this.$d[D](M);return this.init(),this},o.set=function(n,h){return this.clone().$set(n,h)},o.get=function(n){return this[g.p(n)]()},o.add=function(n,h){var a,m=this;n=Number(n);var f=g.p(h),D=function(x){var j=V(m);return g.w(j.date(j.date()+Math.round(x*n)),m)};if(f===i)return this.set(i,this.$M+n);if(f===E)return this.set(E,this.$y+n);if(f===$)return D(1);if(f===C)return D(7);var M=(a={},a[u]=t,a[k]=d,a[s]=c,a)[f]||1,_=this.$d.getTime()+n*M;return g.w(_,this)},o.subtract=function(n,h){return this.add(-1*n,h)},o.format=function(n){var h=this,a=this.$locale();if(!this.isValid())return a.invalidDate||H;var m=n||"YYYY-MM-DDTHH:mm:ssZ",f=g.z(this),D=this.$H,M=this.$m,_=this.$M,x=a.weekdays,j=a.months,Y=function(S,L,ee,P){return S&&(S[L]||S(h,m))||ee[L].slice(0,P)},F=function(S){return g.s(D%12||12,S,"0")},U=a.meridiem||function(S,L,ee){var P=S<12?"AM":"PM";return ee?P.toLowerCase():P},W={YY:String(this.$y).slice(-2),YYYY:this.$y,M:_+1,MM:g.s(_+1,2,"0"),MMM:Y(a.monthsShort,_,j,3),MMMM:Y(j,_),D:this.$D,DD:g.s(this.$D,2,"0"),d:String(this.$W),dd:Y(a.weekdaysMin,this.$W,x,2),ddd:Y(a.weekdaysShort,this.$W,x,3),dddd:x[this.$W],H:String(D),HH:g.s(D,2,"0"),h:F(1),hh:F(2),a:U(D,M,!0),A:U(D,M,!1),m:String(M),mm:g.s(M,2,"0"),s:String(this.$s),ss:g.s(this.$s,2,"0"),SSS:g.s(this.$ms,3,"0"),Z:f};return m.replace(q,function(S,L){return L||W[S]||f.replace(":","")})},o.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},o.diff=function(n,h,a){var m,f=g.p(h),D=V(n),M=(D.utcOffset()-this.utcOffset())*t,_=this-D,x=g.m(this,D);return x=(m={},m[E]=x/12,m[i]=x,m[w]=x/3,m[C]=(_-M)/6048e5,m[$]=(_-M)/864e5,m[k]=_/d,m[u]=_/t,m[s]=_/c,m)[f]||_,a?x:g.a(x)},o.daysInMonth=function(){return this.endOf(i).$D},o.$locale=function(){return O[this.$L]},o.locale=function(n,h){if(!n)return this.$L;var a=this.clone(),m=X(n,h,!0);return m&&(a.$L=m),a},o.clone=function(){return g.w(this.$d,this)},o.toDate=function(){return new Date(this.valueOf())},o.toJSON=function(){return this.isValid()?this.toISOString():null},o.toISOString=function(){return this.$d.toISOString()},o.toString=function(){return this.$d.toUTCString()},p}(),ue=Z.prototype;return V.prototype=ue,[["$ms",y],["$s",s],["$m",u],["$H",k],["$W",$],["$M",i],["$y",E],["$D",B]].forEach(function(p){ue[p[1]]=function(o){return this.$g(o,p[0],p[1])}}),V.extend=function(p,o){return p.$i||(p(o,Z,V),p.$i=!0),V},V.locale=X,V.isDayjs=K,V.unix=function(p){return V(1e3*p)},V.en=O[N],V.Ls=O,V.p={},V})})(ne);const b=ne.exports;var ae={exports:{}};(function(l,r){(function(c,t){l.exports=t()})(J,function(){return function(c,t,d){var y=t.prototype,s=function(i){return i&&(i.indexOf?i:i.s)},u=function(i,w,E,B,H){var R=i.name?i:i.$locale(),q=s(R[w]),G=s(R[E]),A=q||G.map(function(N){return N.slice(0,B)});if(!H)return A;var Q=R.weekStart;return A.map(function(N,O){return A[(O+(Q||0))%7]})},k=function(){return d.Ls[d.locale()]},$=function(i,w){return i.formats[w]||function(E){return E.replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,function(B,H,R){return H||R.slice(1)})}(i.formats[w.toUpperCase()])},C=function(){var i=this;return{months:function(w){return w?w.format("MMMM"):u(i,"months")},monthsShort:function(w){return w?w.format("MMM"):u(i,"monthsShort","months",3)},firstDayOfWeek:function(){return i.$locale().weekStart||0},weekdays:function(w){return w?w.format("dddd"):u(i,"weekdays")},weekdaysMin:function(w){return w?w.format("dd"):u(i,"weekdaysMin","weekdays",2)},weekdaysShort:function(w){return w?w.format("ddd"):u(i,"weekdaysShort","weekdays",3)},longDateFormat:function(w){return $(i.$locale(),w)},meridiem:this.$locale().meridiem,ordinal:this.$locale().ordinal}};y.localeData=function(){return C.bind(this)()},d.localeData=function(){var i=k();return{firstDayOfWeek:function(){return i.weekStart||0},weekdays:function(){return d.weekdays()},weekdaysShort:function(){return d.weekdaysShort()},weekdaysMin:function(){return d.weekdaysMin()},months:function(){return d.months()},monthsShort:function(){return d.monthsShort()},longDateFormat:function(w){return $(i,w)},meridiem:i.meridiem,ordinal:i.ordinal}},d.months=function(){return u(k(),"months")},d.monthsShort=function(){return u(k(),"monthsShort","months",3)},d.weekdays=function(i){return u(k(),"weekdays",null,null,i)},d.weekdaysShort=function(i){return u(k(),"weekdaysShort","weekdays",3,i)},d.weekdaysMin=function(i){return u(k(),"weekdaysMin","weekdays",2,i)}}})})(ae);const he=ae.exports;var re={exports:{}};(function(l,r){(function(c,t){l.exports=t()})(J,function(){return function(c,t){t.prototype.weekday=function(d){var y=this.$locale().weekStart||0,s=this.$W,u=(s<y?s+7:s)-y;return this.$utils().u(d)?u:this.subtract(u,"day").add(d,"day")}}})})(re);const fe=re.exports;var se={exports:{}};(function(l,r){(function(c,t){l.exports=t()})(J,function(){return function(c,t,d){t.prototype.isBetween=function(y,s,u,k){var $=d(y),C=d(s),i=(k=k||"()")[0]==="(",w=k[1]===")";return(i?this.isAfter($,u):!this.isBefore($,u))&&(w?this.isBefore(C,u):!this.isAfter(C,u))||(i?this.isBefore($,u):!this.isAfter($,u))&&(w?this.isAfter(C,u):!this.isBefore(C,u))}}})})(se);const me=se.exports,pe=()=>({calendar:e.computed(()=>({monthView:{date:r=>v(r).concat(T(r))}}))}),z=(l,r)=>{const c=l.__vccOpts||l;for(const[t,d]of r)c[t]=d;return c},we={name:"YearCalendar",setup(l,{emit:r}){e.inject("atticDatepicker");const c=e.inject("calendarView");return{years:e.computed(()=>{const y=[],s=parseInt(b().add(5,"years").subtract(105,"years").format("YYYY"));for(let u=0;u<=105;u++)y.push(s+u);return y.reverse()}),selectYear:y=>{c.value.date.value=c.value.date.value.year(y),r("changeView","dates")},dayjs:b}}},ye={class:"flex-1"},De={class:"max-h-72 max-w-sm overflow-y-auto space-y-5 font-bold text-sm"},ge=["onClick"];function ke(l,r,c,t,d,y){return e.openBlock(),e.createElementBlock("div",ye,[e.createElementVNode("div",De,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.years,s=>(e.openBlock(),e.createElementBlock("button",{class:"w-full hover:bg-attic-thirdly rounded-xl py-3 hover:text-white",onClick:u=>t.selectYear(s)},e.toDisplayString(s),9,ge))),256))])])}const oe=z(we,[["render",ke]]),_e={name:"MonthsCalendar",setup(l,{emit:r}){e.inject("atticDatepicker");const c=e.inject("calendarView");return{selectMonth:d=>{c.value.date.value=c.value.date.value.month(d),r("changeView","dates")},dayjs:b}}},Me={class:"flex-1"},$e={class:"grid grid-cols-2 gap-3 font-bold text-sm w-full"},Ve=["onClick"];function xe(l,r,c,t,d,y){return e.openBlock(),e.createElementBlock("div",Me,[e.createElementVNode("div",$e,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(12,s=>e.createElementVNode("button",{class:"rounded-xl py-3 hover:bg-attic-thirdly hover:text-white px-2",onClick:u=>t.selectMonth(s-1)},e.toDisplayString(t.dayjs().month(s-1).format("MMMM")),9,Ve)),64))])])}const ie=z(_e,[["render",xe]]),Se={name:"MonthCalendar",setup(l,{emit:r}){const c=e.inject("calendarView"),t=e.inject("atticDatepicker"),d=e.inject("showCalendar"),y=e.inject("monthDays"),s=e.inject("date");return{atticDatepicker:t,calendarView:c,isSameMonth:i=>i.isSame(s.value.format("YYYY-MM"),"month"),isInBetweenRange:i=>t.isRange&&t.selectedDate.value&&t.selectedEndDate.value&&i.isBetween(t.selectedDate.value,t.selectedEndDate.value),isSelectedDay:i=>t.selectedDate.value&&t.selectedDate.value.isSame(i)||t.selectedEndDate.value&&t.selectedEndDate.value.isSame(i),dayjs:b,monthDays:y,date:s,selectDate:i=>{t.selectDate(i),d.value=!t.ableToClose()}}}},ve={class:"flex-1 flex"},Ce=[e.createElementVNode("svg",{class:"w-3",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 444.531 444.531","xml:space":"preserve"},[e.createElementVNode("g",null,[e.createElementVNode("path",{d:`M213.13,222.409L351.88,83.653c7.05-7.043,10.567-15.657,10.567-25.841c0-10.183-3.518-18.793-10.567-25.835
                           l-21.409-21.416C323.432,3.521,314.817,0,304.637,0s-18.791,3.521-25.841,10.561L92.649,196.425
                           c-7.044,7.043-10.566,15.656-10.566,25.841s3.521,18.791,10.566,25.837l186.146,185.864c7.05,7.043,15.66,10.564,25.841,10.564
                           s18.795-3.521,25.834-10.564l21.409-21.412c7.05-7.039,10.567-15.604,10.567-25.697c0-10.085-3.518-18.746-10.567-25.978
-                          L213.13,222.409z`})])],-1)],be={class:"space-y-5"},Ee={class:"text-center font-bold"},Be={class:"grid grid-cols-7"},Ye={class:"font-semibold text-sm text-gray-400 text-center"},Ne=["onClick"],Oe=[e.createElementVNode("svg",{class:"w-3",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 444.531 444.531","xml:space":"preserve"},[e.createElementVNode("g",null,[e.createElementVNode("path",{d:`M352.025,196.712L165.884,10.848C159.029,3.615,150.469,0,140.187,0c-10.282,0-18.842,3.619-25.697,10.848L92.792,32.264
+                          L213.13,222.409z`})])],-1)],be={class:"space-y-5"},Ee={class:"text-center font-bold"},Be={class:"grid grid-cols-7"},Oe={class:"font-semibold text-sm text-gray-400 text-center"},Ye={key:0},Ne=["onClick"],je={key:1,class:"h-full w-full bg-gray-100 absolute z-0"},Le=[e.createElementVNode("svg",{class:"w-3",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 444.531 444.531","xml:space":"preserve"},[e.createElementVNode("g",null,[e.createElementVNode("path",{d:`M352.025,196.712L165.884,10.848C159.029,3.615,150.469,0,140.187,0c-10.282,0-18.842,3.619-25.697,10.848L92.792,32.264
                     c-7.044,7.043-10.566,15.604-10.566,25.692c0,9.897,3.521,18.56,10.566,25.981l138.753,138.473L92.786,361.168
                     c-7.042,7.043-10.564,15.604-10.564,25.693c0,9.896,3.521,18.562,10.564,25.98l21.7,21.413
                     c7.043,7.043,15.612,10.564,25.697,10.564c10.089,0,18.656-3.521,25.697-10.564l186.145-185.864
-                    c7.046-7.423,10.571-16.084,10.571-25.981C362.597,212.321,359.071,203.755,352.025,196.712z`})])],-1)];function je(c,s,l,t,u,y){return e.openBlock(),e.createElementBlock("div",Se,[e.createElementVNode("button",{onClick:s[0]||(s[0]=o=>t.calendarView.subtractMonth()),class:"w-10 h-10 hover:bg-gray-100 rounded-full flex items-center justify-center"},Ce),e.createElementVNode("div",be,[e.createElementVNode("h2",Ee,[e.createElementVNode("span",{class:"hover:bg-attic-secondary hover:text-white p-2 rounded-lg cursor-pointer",onClick:s[1]||(s[1]=o=>c.$emit("changeView","months"))},e.toDisplayString(t.date.format("MMMM")),1),e.createElementVNode("span",{class:"hover:bg-attic-secondary hover:text-white p-2 rounded-lg cursor-pointer",onClick:s[2]||(s[2]=o=>c.$emit("changeView","years"))},e.toDisplayString(t.date.format("YYYY")),1)]),e.createElementVNode("div",Be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dayjs.weekdaysMin(),o=>(e.openBlock(),e.createElementBlock("div",Ye,e.toDisplayString(o),1))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.monthDays,o=>(e.openBlock(),e.createElementBlock("div",null,[t.isSameMonth(o)?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass([{"bg-attic-primary text-white":t.isSelectedDay(o)},{"rounded-full":!t.atticDatepicker.isRange},{"rounded-l-full":t.atticDatepicker.isRange&&t.atticDatepicker.selectedDate.value&&t.atticDatepicker.selectedDate.value.isSame(o)},{"rounded-r-full":t.atticDatepicker.isRange&&t.atticDatepicker.selectedEndDate.value&&t.atticDatepicker.selectedEndDate.value.isSame(o)},{"bg-gray-100 rounded-none":t.isInBetweenRange(o)}])},[e.createElementVNode("div",{class:"hover:border hover:rounded-full mx-auto border-primary cursor-pointer flex justify-center items-center font-bold text-sm w-12 h-12",onClick:d=>t.selectDate(o)},[e.createElementVNode("span",null,e.toDisplayString(o.format("DD")),1)],8,Ne)],2)):e.createCommentVNode("",!0)]))),256))])]),e.createElementVNode("button",{onClick:s[3]||(s[3]=o=>t.calendarView.addMonth()),class:"w-10 h-10 hover:bg-gray-100 rounded-full flex items-center justify-center"},Oe)])}const ce=F(Ve,[["render",je]]),Ae={name:"Calendar",props:{date:Object},components:{YearsCalendar:oe,MonthsCalendar:ie,DatesCalendar:ce},setup(c){const{calendar:s}=pe(),l=e.ref("dates"),t=e.computed(()=>s.value.monthView.date(c.date)),u=e.ref(c.date);e.provide("date",u),e.provide("monthDays",t);const y=o=>{l.value=o};return e.watch(()=>c.date,(o,d)=>{u.value=o}),{displayView:l,changeView:y}}};function Le(c,s,l,t,u,y){const o=e.resolveComponent("YearsCalendar"),d=e.resolveComponent("MonthsCalendar"),k=e.resolveComponent("DatesCalendar");return e.openBlock(),e.createElementBlock("div",null,[e.withDirectives(e.createVNode(o,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="years"]]),e.withDirectives(e.createVNode(d,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="months"]]),e.withDirectives(e.createVNode(k,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="dates"]])])}const le=F(Ae,[["render",Le]]);class Te{constructor(s,l,t,u){H(this,"modelValue");H(this,"selectedDate");H(this,"selectedEndDate");H(this,"isRange");H(this,"autoApply");H(this,"format");this.modelValue=e.ref(null),this.selectedDate=e.ref(null),this.selectedEndDate=e.ref(null),this.autoApply=u,this.isRange=t,this.format=l,e.watch(()=>this.selectedDate.value,(y,o)=>{this.getValue()}),e.watch(()=>this.selectedEndDate.value,(y,o)=>{this.getValue()}),this.setDates(s)}setDates(s){if(s){if(typeof s=="string"){this.selectedDate.value=b(s);return}typeof s=="object"&&this.isRange&&(this.selectedDate.value=b(s[0]),s.length>1&&(this.selectedEndDate.value=b(s[1])))}}selectDate(s){if(!this.isRange){this.selectedDate.value=s;return}if(this.selectedDate.value&&this.selectedEndDate.value){this.selectedDate.value=s,this.selectedEndDate.value=null;return}if(!this.selectedDate.value||s.diff(this.selectedDate.value,"day")<0){this.selectedDate.value=s;return}s.diff(this.selectedDate.value,"day")>0&&(this.selectedEndDate.value=s)}ableToClose(){return!!(this.autoApply&&(this.isRange&&this.selectedDate.value&&this.selectedEndDate.value||!this.isRange))}getValue(){if(!this.isRange){this.modelValue.value=this.selectedDate.value;return}(this.selectedDate.value||this.selectedEndDate.value)&&(this.modelValue.value=[this.selectedDate.value?this.selectedDate.value.format(this.format):null,this.selectedEndDate.value?this.selectedEndDate.value.format(this.format):null])}}const Ze="";b.extend(he),b.extend(fe),b.extend(me);const Re={name:"AtticDatepicker",props:{modelValue:Object,endDate:String,format:{type:String,default:"DD MMM YYYY"},showXMonths:Number,isRange:Boolean,autoApply:Boolean},components:{Calendar:le,YearsCalendar:oe,MonthsCalendar:ie,DatesCalendar:ce},directives:{attic:{mounted:(c,s)=>{te(s)},updated:(c,s)=>{te(s)}}},setup(c,{emit:s}){const l=e.ref(!1),t=new Te(c.modelValue,c.format,c.isRange||c.isRange==="true",c.autoApply||c.autoApply==="true"),u=e.computed(()=>{const o=e.ref(t.selectedDate.value??b()),d=()=>{o.value=o.value.subtract(1,"month")},k=()=>{o.value=o.value.add(1,"month")};return e.watch(()=>t.selectedDate.value,(_,C)=>{o.value=_}),{subtractMonth:d,addMonth:k,date:o}}),y=()=>{t.selectedDate.value=null,l.value=!1};return e.watch(()=>t.modelValue.value,(o,d)=>{s("update:modelValue",o)}),e.provide("atticDatepicker",t),e.provide("showCalendar",l),e.provide("calendarView",u),e.provide("showXMonths",c.showXMonths),{clearDate:y,atticDatepicker:t,showCalendar:l,calendarView:u,dayjs:b}}},He={class:"space-y-2 relative"},Ie={key:0},We={key:0,class:"attic-datepicker-calendar absolute bg-white rounded-[28px] border py-5 px-6 shadow-xl flex items-start space-x-3 z-[99] min-w-0"};function Fe(c,s,l,t,u,y){const o=e.resolveComponent("Calendar"),d=e.resolveDirective("attic");return e.withDirectives((e.openBlock(),e.createElementBlock("div",He,[e.renderSlot(c.$slots,"default",{value:t.atticDatepicker.modelValue.value,placeholder:c.$attrs.placeholder,clear:t.clearDate},()=>[e.createElementVNode("div",e.mergeProps({class:"relative block w-full pl-3 pr-12 py-2.5 rounded-lg overflow-hidden text-sm transition-colors bg-white border focus:ring focus:outline-none dark:focus:ring-opacity-20"},c.$attrs),[t.atticDatepicker.selectedDate.value?(e.openBlock(),e.createElementBlock("span",Ie,e.toDisplayString(t.atticDatepicker.selectedDate.value.format(l.format)),1)):e.createCommentVNode("",!0)],16)]),e.createVNode(e.Transition,{"enter-from-class":"opacity-0 translate-y-3","enter-to-class":"opacity-100 translate-y-0","enter-active-class":"transform transition ease-out duration-200","leave-active-class":"transform transition ease-in duration-150","leave-from-class":"opacity-100 translate-y-0","leave-to-class":"opacity-0 translate-y-3"},{default:e.withCtx(()=>[t.showCalendar?(e.openBlock(),e.createElementBlock("div",We,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(parseInt(l.showXMonths??1),k=>(e.openBlock(),e.createBlock(o,{date:t.calendarView.date.value.add(k-1,"month")},null,8,["date"]))),256))])):e.createCommentVNode("",!0)]),_:1})])),[[d]])}const de=F(Re,[["render",Fe]]),Pe="";return Object.assign(de,{install:c=>{c.component("AtticDatepicker",de)}},{Calendar:le})});
+                    c7.046-7.423,10.571-16.084,10.571-25.981C362.597,212.321,359.071,203.755,352.025,196.712z`})])],-1)];function Te(l,r,c,t,d,y){return e.openBlock(),e.createElementBlock("div",ve,[e.createElementVNode("button",{onClick:r[0]||(r[0]=s=>t.calendarView.subtractMonth()),class:"w-10 h-10 hover:bg-gray-100 rounded-full flex items-center justify-center"},Ce),e.createElementVNode("div",be,[e.createElementVNode("h2",Ee,[e.createElementVNode("span",{class:"hover:bg-attic-secondary hover:text-white p-2 rounded-lg cursor-pointer",onClick:r[1]||(r[1]=s=>l.$emit("changeView","months"))},e.toDisplayString(t.date.format("MMMM")),1),e.createElementVNode("span",{class:"hover:bg-attic-secondary hover:text-white p-2 rounded-lg cursor-pointer",onClick:r[2]||(r[2]=s=>l.$emit("changeView","years"))},e.toDisplayString(t.date.format("YYYY")),1)]),e.createElementVNode("div",Be,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.dayjs.weekdaysMin(),s=>(e.openBlock(),e.createElementBlock("div",Oe,e.toDisplayString(s),1))),256)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.monthDays,s=>(e.openBlock(),e.createElementBlock("div",null,[t.isSameMonth(s)?(e.openBlock(),e.createElementBlock("div",Ye,[e.createElementVNode("div",{class:"mx-auto border-primary cursor-pointer font-bold text-sm relative",onClick:u=>t.selectDate(s)},[t.atticDatepicker.isRange&&t.isSelectedDay(s)&&t.atticDatepicker.selectedDate.value&&t.atticDatepicker.selectedEndDate.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["h-full w-1/2 bg-gray-100 absolute z-0",[{"right-0":t.atticDatepicker.isRange&&t.atticDatepicker.selectedDate.value&&t.atticDatepicker.selectedDate.value.isSame(s)},{"left-0":t.atticDatepicker.isRange&&t.atticDatepicker.selectedEndDate.value&&t.atticDatepicker.selectedEndDate.value.isSame(s)}]])},null,2)):e.createCommentVNode("",!0),t.isInBetweenRange(s)?(e.openBlock(),e.createElementBlock("div",je)):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(["z-10 block relative text-center align-middle hover:rounded-full block w-12 h-12 text-center align-middle flex items-center justify-center",[{"bg-attic-primary text-white rounded-full":t.isSelectedDay(s)},{"hover:bg-gray-200":!t.isSelectedDay(s)}]])},e.toDisplayString(s.format("DD")),3)],8,Ne)])):e.createCommentVNode("",!0)]))),256))])]),e.createElementVNode("button",{onClick:r[3]||(r[3]=s=>t.calendarView.addMonth()),class:"w-10 h-10 hover:bg-gray-100 rounded-full flex items-center justify-center"},Le)])}const le=z(Se,[["render",Te]]),Re={name:"Calendar",props:{date:Object},components:{YearsCalendar:oe,MonthsCalendar:ie,DatesCalendar:le},setup(l){const{calendar:r}=pe(),c=e.ref("dates"),t=e.computed(()=>r.value.monthView.date(l.date)),d=e.ref(l.date);e.provide("date",d),e.provide("monthDays",t);const y=s=>{c.value=s};return e.watch(()=>l.date,(s,u)=>{d.value=s}),{displayView:c,changeView:y}}};function Ae(l,r,c,t,d,y){const s=e.resolveComponent("YearsCalendar"),u=e.resolveComponent("MonthsCalendar"),k=e.resolveComponent("DatesCalendar");return e.openBlock(),e.createElementBlock("div",null,[e.withDirectives(e.createVNode(s,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="years"]]),e.withDirectives(e.createVNode(u,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="months"]]),e.withDirectives(e.createVNode(k,{onChangeView:t.changeView},null,8,["onChangeView"]),[[e.vShow,t.displayView==="dates"]])])}const ce=z(Re,[["render",Ae]]);class Ie{constructor(r,c,t,d){I(this,"modelValue");I(this,"selectedDate");I(this,"selectedEndDate");I(this,"isRange");I(this,"keepOpen");I(this,"format");this.modelValue=e.ref(null),this.selectedDate=e.ref(null),this.selectedEndDate=e.ref(null),this.keepOpen=d,this.isRange=t,this.format=c,e.watch(()=>this.selectedDate.value,(y,s)=>{this.getValue()}),e.watch(()=>this.selectedEndDate.value,(y,s)=>{this.getValue()}),this.setDates(r)}setDates(r){if(r){if(typeof r=="string"){this.selectedDate.value=b(r);return}typeof r=="object"&&this.isRange&&(this.selectedDate.value=b(r[0]),r.length>1&&(this.selectedEndDate.value=b(r[1])))}}selectDate(r){if(!this.isRange){this.selectedDate.value=r;return}if(this.selectedDate.value&&this.selectedEndDate.value){this.selectedDate.value=r,this.selectedEndDate.value=null;return}if(!this.selectedDate.value||r.diff(this.selectedDate.value,"day")<0){this.selectedDate.value=r;return}r.diff(this.selectedDate.value,"day")>0&&(this.selectedEndDate.value=r)}ableToClose(){return!!(!this.keepOpen&&(this.isRange&&this.selectedDate.value&&this.selectedEndDate.value||!this.isRange))}getValue(){if(!this.isRange&&this.selectedDate.value){this.modelValue.value=this.selectedDate.value.format(this.format);return}(this.selectedDate.value||this.selectedEndDate.value)&&(this.modelValue.value=[this.selectedDate.value?this.selectedDate.value.format(this.format):null,this.selectedEndDate.value?this.selectedEndDate.value.format(this.format):null])}}const Ke="";b.extend(he),b.extend(fe),b.extend(me);const He={name:"AtticDatepicker",props:{modelValue:Object,endDate:String,format:{type:String,default:"DD MMM YYYY"},trigger:{type:String,default:null},showXMonths:Number,isRange:Boolean,keepOpen:Boolean},components:{Calendar:ce,YearsCalendar:oe,MonthsCalendar:ie,DatesCalendar:le},directives:{attic:{mounted:(l,r)=>{te(r)},updated:(l,r)=>{te(r)}}},setup(l,{emit:r}){const c=e.ref(!1),t=new Ie(l.modelValue,l.format,l.isRange||l.isRange==="true",typeof l.keepOpen=="string"?l.keepOpen!=="false":l.keepOpen),d=e.computed(()=>{const s=e.ref(t.selectedDate.value??b()),u=()=>{s.value=s.value.subtract(1,"month")},k=()=>{s.value=s.value.add(1,"month")};return e.watch(()=>t.selectedDate.value,($,C)=>{s.value=$}),{subtractMonth:u,addMonth:k,date:s}}),y=()=>{t.selectedDate.value=null,c.value=!1};return e.watch(()=>t.modelValue.value,(s,u)=>{r("update:modelValue",s)}),e.provide("atticDatepicker",t),e.provide("showCalendar",c),e.provide("calendarView",d),e.provide("showXMonths",l.showXMonths),{clearDate:y,atticDatepicker:t,showCalendar:c,calendarView:d,dayjs:b}}},We={class:"md:space-y-2"},ze={key:0},Fe={key:1},Ue={key:2,class:"text-gray-400"},Je={key:0,class:"attic-datepicker-calendar md:absolute fixed bg-white md:rounded-[28px] border py-5 px-6 md:shadow-xl z-[99] md:top-auto md:right-auto md:h-auto md:w-auto md:space-y-0 top-0 right-0 h-full w-full space-y-8 overflow-y-auto"},Xe={class:"md:flex md:items-start md:space-x-3 md:space-y-0 space-y-8"};function Ze(l,r,c,t,d,y){const s=e.resolveComponent("Calendar"),u=e.resolveDirective("attic");return e.withDirectives((e.openBlock(),e.createElementBlock("div",We,[e.renderSlot(l.$slots,"default",{value:t.atticDatepicker.modelValue.value,placeholder:l.$attrs.placeholder,clear:t.clearDate},()=>[e.createElementVNode("div",e.mergeProps({class:"relative block w-full pl-3 pr-12 py-3 rounded-lg overflow-hidden text-sm transition-colors bg-white border focus:ring focus:outline-none shadow"},l.$attrs),[!c.isRange&&t.atticDatepicker.selectedDate.value?(e.openBlock(),e.createElementBlock("span",ze,e.toDisplayString(t.atticDatepicker.modelValue.value),1)):c.isRange&&t.atticDatepicker.modelValue.value&&t.atticDatepicker.modelValue.value.length>1?(e.openBlock(),e.createElementBlock("span",Fe,e.toDisplayString(t.atticDatepicker.modelValue.value[0])+" ~ "+e.toDisplayString(t.atticDatepicker.modelValue.value[1]),1)):(e.openBlock(),e.createElementBlock("span",Ue,e.toDisplayString(l.$attrs.placeholder??"Select Date"),1))],16)]),e.createVNode(e.Transition,{"enter-from-class":"opacity-0 translate-y-3","enter-to-class":"opacity-100 translate-y-0","enter-active-class":"transform transition ease-out duration-200","leave-active-class":"transform transition ease-in duration-150","leave-from-class":"opacity-100 translate-y-0","leave-to-class":"opacity-0 translate-y-3"},{default:e.withCtx(()=>[t.showCalendar?(e.openBlock(),e.createElementBlock("div",Je,[e.createElementVNode("div",Xe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(parseInt(c.showXMonths??1),k=>(e.openBlock(),e.createBlock(s,{date:t.calendarView.date.value.add(k-1,"month")},null,8,["date"]))),256))]),e.createElementVNode("button",{class:"sm:hidden w-full bg-red-500 rounded text-white font-bold p-3",onClick:r[0]||(r[0]=k=>t.showCalendar=!1)}," Close ")])):e.createCommentVNode("",!0)]),_:1})])),[[u,c.trigger,"away"]])}const de=z(He,[["render",Ze]]),et="";return Object.assign(de,{install:l=>{l.component("AtticDatepicker",de)}},{Calendar:ce})});

package.json

@@ -9,3 +9,3 @@ {
   "private": false,
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "Beautiful single and range date picker that is built with Tailwind CSS and Vue 3 using day.js",
@@ -12,0 +12,0 @@ "keywords": [

README.md

@@ -11,3 +11,3 @@ <p align="center">
     </a>
-    <a href="#" target="_blank">
+    <a href="https://www.npmjs.com/package/attic-datepicker" target="_blank">
         <img src="https://img.shields.io/npm/dw/attic-datepicker?style=for-the-badge" alt="Buy Me A Coffee" height="24">
@@ -19,3 +19,3 @@ </a>
     <a href="https://atticdatepicker.com" target="_blank">
-      <img alt="Attic Datepicker" width="600" src="https://user-images.githubusercontent.com/7081446/185246191-1ab31700-d07d-490e-84e8-b9bf092ac52a.png">
+      <img alt="Attic Datepicker" width="128" src="https://atticdatepicker.com/assets/logo.fcdc01bf.svg" />
     </a>
@@ -26,1 +26,48 @@ <br><br>
 
+---
+
+## Documentation
+
+You can read the full documentation on the website, visit [atticdatepicker.com](https://atticdatepicker.com).
+
+## Example
+
+The reason I created this package was because I couldn't find a datepicker that was easy to implement, up to date or flexible. Here is a simple example how to use Attic Datepicker. 
+
+```vue
+<template>
+  <div>
+    <attic-datepicker format="MM DD YYYY" v-model="selectedDate" />
+  </div>
+</template>
+
+<script>
+import { ref } from 'vue';
+import AtticDatepicker from 'attic-datepicker';
+
+export default {
+  components: {
+      AtticDatepicker
+  },
+  setup() {
+    const selectedDate = ref([]);
+
+    return {
+        selectedDate
+    };
+  }
+};
+</script>
+```
+
+## Changelog
+All notable changes to this project will be documented in this file, [Read](CHANGELOG.md).
+
+## License
+The [MIT](LICENSE) License. Please [see](http://opensource.org/licenses/MIT) for more information.
+
+## Thanks to
+- [Vue](https://vuejs.org/)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [day.js](https://day.js.org/)
+- and other support...

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

106693

increased by9.42%

Lines of code

1676

increased by3.14%

Number of lines in readme file

71

increased by195.83%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes