@object-ui/plugin-calendar 0.3.1 → 2.0.0

package/dist/index.umd.cjs

@@ -1,6 +1,6 @@
-(function(_,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("react"),require("@object-ui/core"),require("lucide-react"),require("@object-ui/components")):typeof define=="function"&&define.amd?define(["exports","react","@object-ui/core","lucide-react","@object-ui/components"],p):(_=typeof globalThis<"u"?globalThis:_||self,p(_.ObjectUIPluginCalendar={},_.React,_.ObjectUICore,_.LucideReact,_.ObjectUIComponents))})(this,(function(_,p,ee,te,N){"use strict";function ue(e){const l=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const f=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(l,n,f.get?f:{enumerable:!0,get:()=>e[n]})}}return l.default=e,Object.freeze(l)}const re=ue(p);var U={exports:{}},Y={};var ne;function fe(){if(ne)return Y;ne=1;var e=Symbol.for("react.transitional.element"),l=Symbol.for("react.fragment");function n(f,g,c){var m=null;if(c!==void 0&&(m=""+c),g.key!==void 0&&(m=""+g.key),"key"in g){c={};for(var a in g)a!=="key"&&(c[a]=g[a])}else c=g;return g=c.ref,{$$typeof:e,type:f,key:m,ref:g!==void 0?g:null,props:c}}return Y.Fragment=l,Y.jsx=n,Y.jsxs=n,Y}var $={};var ae;function me(){return ae||(ae=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===b?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case M:return"Fragment";case C:return"Profiler";case s:return"StrictMode";case X:return"Suspense";case q:return"SuspenseList";case D:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case A:return"Portal";case I:return t.displayName||"Context";case P:return(t._context.displayName||"Context")+".Consumer";case R:var d=t.render;return t=t.displayName,t||(t=d.displayName||d.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case Q:return d=t.displayName||null,d!==null?d:e(t.type)||"Memo";case W:d=t._payload,t=t._init;try{return e(t(d))}catch{}}return null}function l(t){return""+t}function n(t){try{l(t);var d=!1}catch{d=!0}if(d){d=console;var h=d.error,y=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return h.call(d,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",y),l(t)}}function f(t){if(t===M)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===W)return"<...>";try{var d=e(t);return d?"<"+d+">":"<...>"}catch{return"<...>"}}function g(){var t=x.A;return t===null?null:t.getOwner()}function c(){return Error("react-stack-top-frame")}function m(t){if(k.call(t,"key")){var d=Object.getOwnPropertyDescriptor(t,"key").get;if(d&&d.isReactWarning)return!1}return t.key!==void 0}function a(t,d){function h(){O||(O=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",d))}h.isReactWarning=!0,Object.defineProperty(t,"key",{get:h,configurable:!0})}function o(){var t=e(this.type);return V[t]||(V[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function u(t,d,h,y,J,Z){var j=h.ref;return t={$$typeof:F,type:t,key:d,props:h,_owner:y},(j!==void 0?j:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:o}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:J}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:Z}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function i(t,d,h,y,J,Z){var j=d.children;if(j!==void 0)if(y)if(v(j)){for(y=0;y<j.length;y++)T(j[y]);Object.freeze&&Object.freeze(j)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else T(j);if(k.call(d,"key")){j=e(t);var L=Object.keys(d).filter(function(we){return we!=="key"});y=0<L.length?"{key: someKey, "+L.join(": ..., ")+": ...}":"{key: someKey}",de[j+y]||(L=0<L.length?"{"+L.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+(function(N,j){typeof exports=="object"&&typeof module<"u"?j(exports,require("react"),require("@object-ui/core"),require("@object-ui/react"),require("lucide-react"),require("@object-ui/components")):typeof define=="function"&&define.amd?define(["exports","react","@object-ui/core","@object-ui/react","lucide-react","@object-ui/components"],j):(N=typeof globalThis<"u"?globalThis:N||self,j(N.ObjectUIPluginCalendar={},N.React,N.ObjectUICore,N.ObjectUIReact,N.LucideReact,N.ObjectUIComponents))})(this,(function(N,j,B,fe,$,p){"use strict";function me(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const l in e)if(l!=="default"){const u=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(n,l,u.get?u:{enumerable:!0,get:()=>e[l]})}}return n.default=e,Object.freeze(n)}const W=me(j);var U={exports:{}},P={};var ne;function ge(){if(ne)return P;ne=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function l(u,f,s){var m=null;if(s!==void 0&&(m=""+s),f.key!==void 0&&(m=""+f.key),"key"in f){s={};for(var a in f)a!=="key"&&(s[a]=f[a])}else s=f;return f=s.ref,{$$typeof:e,type:u,key:m,ref:f!==void 0?f:null,props:s}}return P.Fragment=n,P.jsx=l,P.jsxs=l,P}var M={};var le;function pe(){return le||(le=1,process.env.NODE_ENV!=="production"&&(function(){function e(t){if(t==null)return null;if(typeof t=="function")return t.$$typeof===C?null:t.displayName||t.name||null;if(typeof t=="string")return t;switch(t){case k:return"Fragment";case q:return"Profiler";case L:return"StrictMode";case T:return"Suspense";case K:return"SuspenseList";case _:return"Activity"}if(typeof t=="object")switch(typeof t.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),t.$$typeof){case V:return"Portal";case i:return t.displayName||"Context";case Y:return(t._context.displayName||"Context")+".Consumer";case F:var o=t.render;return t=t.displayName,t||(t=o.displayName||o.name||"",t=t!==""?"ForwardRef("+t+")":"ForwardRef"),t;case ee:return o=t.displayName||null,o!==null?o:e(t.type)||"Memo";case b:o=t._payload,t=t._init;try{return e(t(o))}catch{}}return null}function n(t){return""+t}function l(t){try{n(t);var o=!1}catch{o=!0}if(o){o=console;var x=o.error,D=typeof Symbol=="function"&&Symbol.toStringTag&&t[Symbol.toStringTag]||t.constructor.name||"Object";return x.call(o,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",D),n(t)}}function u(t){if(t===k)return"<>";if(typeof t=="object"&&t!==null&&t.$$typeof===b)return"<...>";try{var o=e(t);return o?"<"+o+">":"<...>"}catch{return"<...>"}}function f(){var t=E.A;return t===null?null:t.getOwner()}function s(){return Error("react-stack-top-frame")}function m(t){if(h.call(t,"key")){var o=Object.getOwnPropertyDescriptor(t,"key").get;if(o&&o.isReactWarning)return!1}return t.key!==void 0}function a(t,o){function x(){A||(A=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",o))}x.isReactWarning=!0,Object.defineProperty(t,"key",{get:x,configurable:!0})}function d(){var t=e(this.type);return z[t]||(z[t]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),t=this.props.ref,t!==void 0?t:null}function c(t,o,x,D,J,re){var v=x.ref;return t={$$typeof:I,type:t,key:o,props:x,_owner:D},(v!==void 0?v:null)!==null?Object.defineProperty(t,"ref",{enumerable:!1,get:d}):Object.defineProperty(t,"ref",{enumerable:!1,value:null}),t._store={},Object.defineProperty(t._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(t,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(t,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:J}),Object.defineProperty(t,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:re}),Object.freeze&&(Object.freeze(t.props),Object.freeze(t)),t}function y(t,o,x,D,J,re){var v=o.children;if(v!==void 0)if(D)if(te(v)){for(D=0;D<v.length;D++)w(v[D]);Object.freeze&&Object.freeze(v)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else w(v);if(h.call(o,"key")){v=e(t);var R=Object.keys(o).filter(function(Se){return Se!=="key"});D=0<R.length?"{key: someKey, "+R.join(": ..., ")+": ...}":"{key: someKey}",ue[v+D]||(R=0<R.length?"{"+R.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,y,j,L,j),de[j+y]=!0)}if(j=null,h!==void 0&&(n(h),j=""+h),m(d)&&(n(d.key),j=""+d.key),"key"in d){h={};for(var K in d)K!=="key"&&(h[K]=d[K])}else h=d;return j&&a(h,typeof t=="function"?t.displayName||t.name||"Unknown":t),u(t,j,h,g(),J,Z)}function T(t){S(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===W&&(t._payload.status==="fulfilled"?S(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function S(t){return typeof t=="object"&&t!==null&&t.$$typeof===F}var w=p,F=Symbol.for("react.transitional.element"),A=Symbol.for("react.portal"),M=Symbol.for("react.fragment"),s=Symbol.for("react.strict_mode"),C=Symbol.for("react.profiler"),P=Symbol.for("react.consumer"),I=Symbol.for("react.context"),R=Symbol.for("react.forward_ref"),X=Symbol.for("react.suspense"),q=Symbol.for("react.suspense_list"),Q=Symbol.for("react.memo"),W=Symbol.for("react.lazy"),D=Symbol.for("react.activity"),b=Symbol.for("react.client.reference"),x=w.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,k=Object.prototype.hasOwnProperty,v=Array.isArray,E=console.createTask?console.createTask:function(){return null};w={react_stack_bottom_frame:function(t){return t()}};var O,V={},H=w.react_stack_bottom_frame.bind(w,c)(),z=E(f(c)),de={};$.Fragment=M,$.jsx=function(t,d,h){var y=1e4>x.recentlyCreatedOwnerStacks++;return i(t,d,h,!1,y?Error("react-stack-top-frame"):H,y?E(f(t)):z)},$.jsxs=function(t,d,h){var y=1e4>x.recentlyCreatedOwnerStacks++;return i(t,d,h,!0,y?Error("react-stack-top-frame"):H,y?E(f(t)):z)}})()),$}var le;function ge(){return le||(le=1,process.env.NODE_ENV==="production"?U.exports=fe():U.exports=me()),U.exports}var r=ge();function pe(e){return e.data?e.data:e.staticData?{provider:"value",items:e.staticData}:e.objectName?{provider:"object",object:e.objectName}:null}function be(e){if(e){if(typeof e=="string"){const l=e.split(" "),n=l[0],f=l[1]?.toLowerCase()==="desc"?"desc":"asc";return{[n]:f}}if(Array.isArray(e))return e.reduce((l,n)=>(n.field&&n.order&&(l[n.field]=n.order),l),{})}}function xe(e){return e.filter&&typeof e.filter=="object"&&"calendar"in e.filter?e.filter.calendar:e.calendar?e.calendar:null}const oe=({schema:e,dataSource:l,className:n,onEventClick:f,onDateClick:g})=>{const[c,m]=p.useState([]),[a,o]=p.useState(!0),[u,i]=p.useState(null),[T,S]=p.useState(null),[w,F]=p.useState(new Date),[A,M]=p.useState("month"),s=pe(e),C=xe(e),P=s?.provider==="value";p.useEffect(()=>{(async()=>{try{if(o(!0),P&&s?.provider==="value"){m(s.items),o(!1);return}if(!l)throw new Error("DataSource required for object/api providers");if(s?.provider==="object"){const b=s.object,x=await l.find(b,{$filter:e.filter,$orderby:be(e.sort)});m(x?.data||[])}else s?.provider==="api"&&(console.warn("API provider not yet implemented for ObjectCalendar"),m([]));o(!1)}catch(b){i(b),o(!1)}})()},[s,l,P,e.filter,e.sort]),p.useEffect(()=>{!P&&l&&(async()=>{try{if(!l)return;const b=s?.provider==="object"?s.object:e.objectName;if(!b)return;const x=await l.getObjectSchema(b);S(x)}catch(b){console.error("Failed to fetch object schema:",b)}})()},[e.objectName,l,P,s]);const I=p.useMemo(()=>{if(!C||!c.length)return[];const{startDateField:D,endDateField:b,titleField:x,colorField:k}=C;return c.map((v,E)=>{const O=v[D],V=b?v[b]:null,H=v[x]||"Untitled",z=k?v[k]:void 0;return{id:v.id||v._id||`event-${E}`,title:H,start:O?new Date(O):new Date,end:V?new Date(V):void 0,color:z,allDay:!V,data:v}}).filter(v=>!isNaN(v.start.getTime()))},[c,C]),R=p.useMemo(()=>{const D=w.getFullYear(),b=w.getMonth(),x=new Date(D,b,1),k=new Date(x);k.setDate(k.getDate()-k.getDay());const v=[],E=new Date(k);for(let O=0;O<42;O++)v.push(new Date(E)),E.setDate(E.getDate()+1);return v},[w]),X=p.useCallback(D=>I.filter(b=>{const x=new Date(b.start);x.setHours(0,0,0,0);const k=b.end?new Date(b.end):x;k.setHours(23,59,59,999);const v=new Date(D);return v.setHours(0,0,0,0),v>=x&&v<=k}),[I]),q=p.useCallback(D=>{F(b=>{const x=new Date(b);return x.setMonth(x.getMonth()+(D==="next"?1:-1)),x})},[]);if(a)return r.jsx("div",{className:n,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsx("div",{className:"text-muted-foreground",children:"Loading calendar..."})})});if(u)return r.jsx("div",{className:n,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsxs("div",{className:"text-destructive",children:["Error: ",u.message]})})});if(!C)return r.jsx("div",{className:n,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsx("div",{className:"text-muted-foreground",children:"Calendar configuration required. Please specify startDateField and titleField."})})});const Q=["January","February","March","April","May","June","July","August","September","October","November","December"],W=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];return r.jsx("div",{className:n,children:r.jsxs("div",{className:"border rounded-lg bg-background",children:[r.jsxs("div",{className:"flex items-center justify-between p-4 border-b",children:[r.jsxs("h2",{className:"text-xl font-semibold",children:[Q[w.getMonth()]," ",w.getFullYear()]}),r.jsxs("div",{className:"flex gap-2",children:[r.jsx("button",{onClick:()=>q("prev"),className:"px-3 py-1 border rounded hover:bg-muted",children:"Previous"}),r.jsx("button",{onClick:()=>F(new Date),className:"px-3 py-1 border rounded hover:bg-muted",children:"Today"}),r.jsx("button",{onClick:()=>q("next"),className:"px-3 py-1 border rounded hover:bg-muted",children:"Next"})]})]}),r.jsxs("div",{className:"p-4",children:[r.jsx("div",{className:"grid grid-cols-7 gap-px mb-px",children:W.map(D=>r.jsx("div",{className:"text-center text-sm font-medium text-muted-foreground py-2",children:D},D))}),r.jsx("div",{className:"grid grid-cols-7 gap-px bg-border",children:R.map((D,b)=>{const x=X(D),k=D.getMonth()===w.getMonth(),v=D.getDate()===new Date().getDate()&&D.getMonth()===new Date().getMonth()&&D.getFullYear()===new Date().getFullYear();return r.jsxs("div",{className:`min-h-24 bg-background p-2 ${k?"":"text-muted-foreground bg-muted/30"} ${v?"ring-2 ring-primary":""}`,onClick:()=>g?.(D),children:[r.jsx("div",{className:"text-sm font-medium mb-1",children:D.getDate()}),r.jsxs("div",{className:"space-y-1",children:[x.slice(0,3).map(E=>r.jsx("div",{className:"text-xs px-1 py-0.5 rounded bg-primary/10 hover:bg-primary/20 cursor-pointer truncate",onClick:O=>{O.stopPropagation(),f?.(E.data)},style:E.color?{borderLeft:`3px solid ${E.color}`}:void 0,children:E.title},E.id)),x.length>3&&r.jsxs("div",{className:"text-xs text-muted-foreground",children:["+",x.length-3," more"]})]})]},b)})})]})]})})},G="bg-blue-500 text-white";function ie({events:e=[],view:l="month",currentDate:n=new Date,onEventClick:f,onDateClick:g,onViewChange:c,onNavigate:m,className:a}){const[o,u]=re.useState(l),[i,T]=re.useState(n),S=()=>{const s=new Date(i);o==="month"?s.setMonth(s.getMonth()-1):o==="week"?s.setDate(s.getDate()-7):s.setDate(s.getDate()-1),T(s),m?.(s)},w=()=>{const s=new Date(i);o==="month"?s.setMonth(s.getMonth()+1):o==="week"?s.setDate(s.getDate()+7):s.setDate(s.getDate()+1),T(s),m?.(s)},F=()=>{const s=new Date;T(s),m?.(s)},A=s=>{u(s),c?.(s)},M=()=>{if(o==="month")return i.toLocaleDateString("default",{month:"long",year:"numeric"});if(o==="week"){const s=se(i),C=new Date(s);return C.setDate(C.getDate()+6),`${s.toLocaleDateString("default",{month:"short",day:"numeric"})} - ${C.toLocaleDateString("default",{month:"short",day:"numeric",year:"numeric"})}`}else return i.toLocaleDateString("default",{weekday:"long",month:"long",day:"numeric",year:"numeric"})};return r.jsxs("div",{className:N.cn("flex flex-col h-full bg-background",a),children:[r.jsxs("div",{className:"flex items-center justify-between p-4 border-b",children:[r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsx(N.Button,{variant:"outline",size:"sm",onClick:F,children:"Today"}),r.jsxs("div",{className:"flex items-center",children:[r.jsx(N.Button,{variant:"ghost",size:"icon",onClick:S,className:"h-8 w-8",children:r.jsx(te.ChevronLeftIcon,{className:"h-4 w-4"})}),r.jsx(N.Button,{variant:"ghost",size:"icon",onClick:w,className:"h-8 w-8",children:r.jsx(te.ChevronRightIcon,{className:"h-4 w-4"})})]}),r.jsx("h2",{className:"text-lg font-semibold ml-2",children:M()})]}),r.jsx("div",{className:"flex items-center gap-2",children:r.jsxs(N.Select,{value:o,onValueChange:A,children:[r.jsx(N.SelectTrigger,{className:"w-32",children:r.jsx(N.SelectValue,{})}),r.jsxs(N.SelectContent,{children:[r.jsx(N.SelectItem,{value:"day",children:"Day"}),r.jsx(N.SelectItem,{value:"week",children:"Week"}),r.jsx(N.SelectItem,{value:"month",children:"Month"})]})]})})]}),r.jsxs("div",{className:"flex-1 overflow-auto",children:[o==="month"&&r.jsx(he,{date:i,events:e,onEventClick:f,onDateClick:g}),o==="week"&&r.jsx(ve,{date:i,events:e,onEventClick:f,onDateClick:g}),o==="day"&&r.jsx(ye,{date:i,events:e,onEventClick:f})]})]})}function se(e){const l=new Date(e),n=l.getDay(),f=l.getDate()-n;return l.setDate(f),l}function De(e){const l=e.getFullYear(),n=e.getMonth(),f=new Date(l,n,1),g=new Date(l,n+1,0),c=f.getDay(),m=[];for(let o=c-1;o>=0;o--){const u=new Date(f.getTime());u.setDate(u.getDate()-(o+1)),m.push(u)}for(let o=1;o<=g.getDate();o++)m.push(new Date(l,n,o));const a=42-m.length;for(let o=1;o<=a;o++){const u=new Date(g.getTime());u.setDate(u.getDate()+o),m.push(u)}return m}function ce(e,l){return e.getFullYear()===l.getFullYear()&&e.getMonth()===l.getMonth()&&e.getDate()===l.getDate()}function B(e,l){return l.filter(n=>{const f=new Date(n.start),g=n.end?new Date(n.end):new Date(f),c=new Date(e);c.setHours(0,0,0,0);const m=new Date(e);m.setHours(23,59,59,999);const a=new Date(f);a.setHours(0,0,0,0);const o=new Date(g);return o.setHours(23,59,59,999),c<=o&&m>=a})}function he({date:e,events:l,onEventClick:n,onDateClick:f}){const g=De(e),c=new Date,m=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];return r.jsxs("div",{className:"flex flex-col h-full",children:[r.jsx("div",{className:"grid grid-cols-7 border-b",children:m.map(a=>r.jsx("div",{className:"p-2 text-center text-sm font-medium text-muted-foreground border-r last:border-r-0",children:a},a))}),r.jsx("div",{className:"grid grid-cols-7 flex-1 auto-rows-fr",children:g.map((a,o)=>{const u=B(a,l),i=a.getMonth()===e.getMonth(),T=ce(a,c);return r.jsxs("div",{className:N.cn("border-b border-r last:border-r-0 p-2 min-h-[100px] cursor-pointer hover:bg-accent/50",!i&&"bg-muted/30 text-muted-foreground"),onClick:()=>f?.(a),children:[r.jsx("div",{className:N.cn("text-sm font-medium mb-1",T&&"inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground h-6 w-6"),children:a.getDate()}),r.jsxs("div",{className:"space-y-1",children:[u.slice(0,3).map(S=>r.jsx("div",{className:N.cn("text-xs px-2 py-1 rounded truncate cursor-pointer hover:opacity-80",S.color||G),style:S.color&&S.color.startsWith("#")?{backgroundColor:S.color}:void 0,onClick:w=>{w.stopPropagation(),n?.(S)},children:S.title},S.id)),u.length>3&&r.jsxs("div",{className:"text-xs text-muted-foreground px-2",children:["+",u.length-3," more"]})]})]},o)})})]})}function ve({date:e,events:l,onEventClick:n,onDateClick:f}){const g=se(e),c=Array.from({length:7},(a,o)=>{const u=new Date(g);return u.setDate(u.getDate()+o),u}),m=new Date;return r.jsxs("div",{className:"flex flex-col h-full",children:[r.jsx("div",{className:"grid grid-cols-7 border-b",children:c.map(a=>{const o=ce(a,m);return r.jsxs("div",{className:"p-3 text-center border-r last:border-r-0",children:[r.jsx("div",{className:"text-sm font-medium text-muted-foreground",children:a.toLocaleDateString("default",{weekday:"short"})}),r.jsx("div",{className:N.cn("text-lg font-semibold mt-1",o&&"inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground h-8 w-8"),children:a.getDate()})]},a.toISOString())})}),r.jsx("div",{className:"grid grid-cols-7 flex-1",children:c.map(a=>{const o=B(a,l);return r.jsx("div",{className:"border-r last:border-r-0 p-2 min-h-[400px] cursor-pointer hover:bg-accent/50",onClick:()=>f?.(a),children:r.jsx("div",{className:"space-y-2",children:o.map(u=>r.jsxs("div",{className:N.cn("text-sm px-3 py-2 rounded cursor-pointer hover:opacity-80",u.color||G),style:u.color&&u.color.startsWith("#")?{backgroundColor:u.color}:void 0,onClick:i=>{i.stopPropagation(),n?.(u)},children:[r.jsx("div",{className:"font-medium",children:u.title}),!u.allDay&&r.jsx("div",{className:"text-xs opacity-90 mt-1",children:u.start.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"})})]},u.id))})},a.toISOString())})})]})}function ye({date:e,events:l,onEventClick:n}){const f=B(e,l),g=Array.from({length:24},(c,m)=>m);return r.jsx("div",{className:"flex flex-col h-full",children:r.jsx("div",{className:"flex-1 overflow-auto",children:g.map(c=>{const m=f.filter(a=>a.allDay?c===0:a.start.getHours()===c);return r.jsxs("div",{className:"flex border-b min-h-[60px]",children:[r.jsx("div",{className:"w-20 p-2 text-sm text-muted-foreground border-r",children:c===0?"12 AM":c<12?`${c} AM`:c===12?"12 PM":`${c-12} PM`}),r.jsx("div",{className:"flex-1 p-2 space-y-2",children:m.map(a=>r.jsxs("div",{className:N.cn("px-3 py-2 rounded cursor-pointer hover:opacity-80",a.color||G),style:a.color&&a.color.startsWith("#")?{backgroundColor:a.color}:void 0,onClick:()=>n?.(a),children:[r.jsx("div",{className:"font-medium",children:a.title}),!a.allDay&&r.jsxs("div",{className:"text-xs opacity-90 mt-1",children:[a.start.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"}),a.end&&` - ${a.end.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"})}`]})]},a.id))})]},c)})})})}ee.ComponentRegistry.register("calendar-view",({schema:e,className:l,onAction:n,...f})=>{const g=p.useMemo(()=>!e.data||!Array.isArray(e.data)?[]:e.data.map((i,T)=>{const S=e.titleField||"title",w=e.startDateField||"start",F=e.endDateField||"end",A=e.colorField||"color",M=e.allDayField||"allDay",s=i[S]||"Untitled",C=i[w]?new Date(i[w]):new Date,P=i[F]?new Date(i[F]):void 0,I=i[M]!==void 0?i[M]:!1;let R=i[A];return R&&e.colorMapping&&e.colorMapping[R]&&(R=e.colorMapping[R]),{id:String(i.id||i._id||T),title:s,start:C,end:P,allDay:I,color:R,data:i}}),[e.data,e.titleField,e.startDateField,e.endDateField,e.colorField,e.allDayField,e.colorMapping]),c=p.useCallback(i=>{n&&n({type:"event_click",payload:{event:i.data,eventId:i.id}}),e.onEventClick&&e.onEventClick(i.data)},[n,e]),m=p.useCallback(i=>{n&&n({type:"date_click",payload:{date:i}}),e.onDateClick&&e.onDateClick(i)},[n,e]),a=p.useCallback(i=>{n&&n({type:"view_change",payload:{view:i}}),e.onViewChange&&e.onViewChange(i)},[n,e]),o=p.useCallback(i=>{n&&n({type:"navigate",payload:{date:i}}),e.onNavigate&&e.onNavigate(i)},[n,e]),u=e.view&&["month","week","day"].includes(e.view)?e.view:"month";return r.jsx(ie,{events:g,view:u,currentDate:e.currentDate?new Date(e.currentDate):void 0,onEventClick:c,onDateClick:e.allowCreate||e.onDateClick?m:void 0,onViewChange:a,onNavigate:o,className:l,...f})},{label:"Calendar View",inputs:[{name:"data",type:"array",label:"Data",description:"Array of record objects to display as events"},{name:"titleField",type:"string",label:"Title Field",defaultValue:"title",description:"Field name to use for event title"},{name:"startDateField",type:"string",label:"Start Date Field",defaultValue:"start",description:"Field name for event start date"},{name:"endDateField",type:"string",label:"End Date Field",defaultValue:"end",description:"Field name for event end date (optional)"},{name:"allDayField",type:"string",label:"All Day Field",defaultValue:"allDay",description:"Field name for all-day flag"},{name:"colorField",type:"string",label:"Color Field",defaultValue:"color",description:"Field name for event color"},{name:"colorMapping",type:"object",label:"Color Mapping",description:'Map field values to colors (e.g., {meeting: "blue", deadline: "red"})'},{name:"view",type:"enum",enum:["month","week","day"],defaultValue:"month",label:"View Mode",description:"Calendar view mode (month, week, or day)"},{name:"currentDate",type:"string",label:"Current Date",description:"ISO date string for initial calendar date"},{name:"allowCreate",type:"boolean",label:"Allow Create",defaultValue:!1,description:"Allow creating events by clicking on dates"},{name:"className",type:"string",label:"CSS Class"}],defaultProps:{view:"month",titleField:"title",startDateField:"start",endDateField:"end",allDayField:"allDay",colorField:"color",allowCreate:!1,data:[{id:1,title:"Team Meeting",start:new Date(new Date().setHours(10,0,0,0)).toISOString(),end:new Date(new Date().setHours(11,0,0,0)).toISOString(),color:"#3b82f6",allDay:!1},{id:2,title:"Project Deadline",start:new Date(new Date().setDate(new Date().getDate()+3)).toISOString(),color:"#ef4444",allDay:!0},{id:3,title:"Conference",start:new Date(new Date().setDate(new Date().getDate()+7)).toISOString(),end:new Date(new Date().setDate(new Date().getDate()+9)).toISOString(),color:"#10b981",allDay:!0}],className:"h-[600px] border rounded-lg"}});const je=({schema:e})=>r.jsx(oe,{schema:e,dataSource:null});ee.ComponentRegistry.register("object-calendar",je,{label:"Object Calendar",category:"plugin",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"calendar",type:"object",label:"Calendar Config",description:"startDateField, endDateField, titleField, colorField"}]}),_.CalendarView=ie,_.ObjectCalendar=oe,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));
+  <%s key={someKey} {...props} />`,D,v,R,v),ue[v+D]=!0)}if(v=null,x!==void 0&&(l(x),v=""+x),m(o)&&(l(o.key),v=""+o.key),"key"in o){x={};for(var ae in o)ae!=="key"&&(x[ae]=o[ae])}else x=o;return v&&a(x,typeof t=="function"?t.displayName||t.name||"Unknown":t),c(t,v,x,f(),J,re)}function w(t){g(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===b&&(t._payload.status==="fulfilled"?g(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function g(t){return typeof t=="object"&&t!==null&&t.$$typeof===I}var S=j,I=Symbol.for("react.transitional.element"),V=Symbol.for("react.portal"),k=Symbol.for("react.fragment"),L=Symbol.for("react.strict_mode"),q=Symbol.for("react.profiler"),Y=Symbol.for("react.consumer"),i=Symbol.for("react.context"),F=Symbol.for("react.forward_ref"),T=Symbol.for("react.suspense"),K=Symbol.for("react.suspense_list"),ee=Symbol.for("react.memo"),b=Symbol.for("react.lazy"),_=Symbol.for("react.activity"),C=Symbol.for("react.client.reference"),E=S.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,h=Object.prototype.hasOwnProperty,te=Array.isArray,O=console.createTask?console.createTask:function(){return null};S={react_stack_bottom_frame:function(t){return t()}};var A,z={},H=S.react_stack_bottom_frame.bind(S,s)(),de=O(u(s)),ue={};M.Fragment=k,M.jsx=function(t,o,x){var D=1e4>E.recentlyCreatedOwnerStacks++;return y(t,o,x,!1,D?Error("react-stack-top-frame"):H,D?O(u(t)):de)},M.jsxs=function(t,o,x){var D=1e4>E.recentlyCreatedOwnerStacks++;return y(t,o,x,!0,D?Error("react-stack-top-frame"):H,D?O(u(t)):de)}})()),M}var ie;function be(){return ie||(ie=1,process.env.NODE_ENV==="production"?U.exports=ge():U.exports=pe()),U.exports}var r=be();const G="bg-blue-500 text-white";function X({events:e=[],view:n="month",currentDate:l=new Date,locale:u="default",onEventClick:f,onDateClick:s,onViewChange:m,onNavigate:a,onAddClick:d,className:c}){const[y,w]=W.useState(n),[g,S]=W.useState(l);W.useEffect(()=>{S(l)},[l]),W.useEffect(()=>{w(n)},[n]);const I=()=>{const i=new Date(g);y==="month"?i.setMonth(i.getMonth()-1):y==="week"?i.setDate(i.getDate()-7):i.setDate(i.getDate()-1),S(i),a?.(i)},V=()=>{const i=new Date(g);y==="month"?i.setMonth(i.getMonth()+1):y==="week"?i.setDate(i.getDate()+7):i.setDate(i.getDate()+1),S(i),a?.(i)},k=()=>{const i=new Date;S(i),a?.(i)},L=i=>{w(i),m?.(i)},q=()=>{if(y==="month")return g.toLocaleDateString(u,{month:"long",year:"numeric"});if(y==="week"){const i=oe(g),F=new Date(i);return F.setDate(F.getDate()+6),`${i.toLocaleDateString(u,{month:"short",day:"numeric"})} - ${F.toLocaleDateString(u,{month:"short",day:"numeric",year:"numeric"})}`}else return g.toLocaleDateString(u,{weekday:"long",month:"long",day:"numeric",year:"numeric"})},Y=i=>{i&&(S(i),a?.(i))};return r.jsxs("div",{className:p.cn("flex flex-col h-full bg-background",c),children:[r.jsxs("div",{className:"flex items-center justify-between p-4 border-b",children:[r.jsxs("div",{className:"flex items-center gap-4",children:[r.jsxs("div",{className:"flex items-center bg-muted/50 rounded-lg p-1 gap-1",children:[r.jsx(p.Button,{variant:"ghost",size:"sm",onClick:k,className:"h-8",children:"Today"}),r.jsx("div",{className:"h-4 w-px bg-border mx-1"}),r.jsx(p.Button,{variant:"ghost",size:"icon",onClick:I,className:"h-8 w-8",children:r.jsx($.ChevronLeftIcon,{className:"h-4 w-4"})}),r.jsx(p.Button,{variant:"ghost",size:"icon",onClick:V,className:"h-8 w-8",children:r.jsx($.ChevronRightIcon,{className:"h-4 w-4"})})]}),r.jsxs(p.Popover,{children:[r.jsx(p.PopoverTrigger,{asChild:!0,children:r.jsxs(p.Button,{variant:"ghost",className:p.cn("text-xl font-semibold h-auto px-3 py-1 hover:bg-muted/50 transition-colors","flex items-center gap-2"),children:[r.jsx($.CalendarIcon,{className:"h-5 w-5 text-muted-foreground"}),r.jsx("span",{children:q()})]})}),r.jsx(p.PopoverContent,{className:"w-auto p-0",align:"start",children:r.jsx(p.Calendar,{mode:"single",selected:g,onSelect:Y,initialFocus:!0,fromYear:2e3,toYear:2050})})]})]}),r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsxs(p.Select,{value:y,onValueChange:L,children:[r.jsx(p.SelectTrigger,{className:"w-32 bg-background",children:r.jsx(p.SelectValue,{})}),r.jsxs(p.SelectContent,{children:[r.jsx(p.SelectItem,{value:"day",children:"Day"}),r.jsx(p.SelectItem,{value:"week",children:"Week"}),r.jsx(p.SelectItem,{value:"month",children:"Month"})]})]}),d&&r.jsxs(p.Button,{onClick:d,size:"sm",className:"gap-1",children:[r.jsx($.PlusIcon,{className:"h-4 w-4"}),"New"]})]})]}),r.jsxs("div",{className:"flex-1 overflow-auto",children:[y==="month"&&r.jsx(ye,{date:g,events:e,onEventClick:f,onDateClick:s}),y==="week"&&r.jsx(je,{date:g,events:e,onEventClick:f,onDateClick:s}),y==="day"&&r.jsx(De,{date:g,events:e,onEventClick:f})]})]})}function oe(e){const n=new Date(e),l=n.getDay(),u=n.getDate()-l;return n.setDate(u),n}function xe(e){const n=e.getFullYear(),l=e.getMonth(),u=new Date(n,l,1),f=new Date(n,l+1,0),s=u.getDay(),m=[];for(let d=s-1;d>=0;d--){const c=new Date(u.getTime());c.setDate(c.getDate()-(d+1)),m.push(c)}for(let d=1;d<=f.getDate();d++)m.push(new Date(n,l,d));const a=42-m.length;for(let d=1;d<=a;d++){const c=new Date(f.getTime());c.setDate(c.getDate()+d),m.push(c)}return m}function se(e,n){return e.getFullYear()===n.getFullYear()&&e.getMonth()===n.getMonth()&&e.getDate()===n.getDate()}function Q(e,n){return n.filter(l=>{const u=new Date(l.start),f=l.end?new Date(l.end):new Date(u),s=new Date(e);s.setHours(0,0,0,0);const m=new Date(e);m.setHours(23,59,59,999);const a=new Date(u);a.setHours(0,0,0,0);const d=new Date(f);return d.setHours(23,59,59,999),s<=d&&m>=a})}function ye({date:e,events:n,onEventClick:l,onDateClick:u}){const f=xe(e),s=new Date,m=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];return r.jsxs("div",{className:"flex flex-col h-full",children:[r.jsx("div",{className:"grid grid-cols-7 border-b",children:m.map(a=>r.jsx("div",{className:"p-2 text-center text-sm font-medium text-muted-foreground border-r last:border-r-0",children:a},a))}),r.jsx("div",{className:"grid grid-cols-7 flex-1 auto-rows-fr",children:f.map((a,d)=>{const c=Q(a,n),y=a.getMonth()===e.getMonth(),w=se(a,s);return r.jsxs("div",{className:p.cn("border-b border-r last:border-r-0 p-2 min-h-[100px] cursor-pointer hover:bg-accent/50",!y&&"bg-muted/30 text-muted-foreground"),onClick:()=>u?.(a),children:[r.jsx("div",{className:p.cn("text-sm font-medium mb-1",w&&"inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground h-6 w-6"),children:a.getDate()}),r.jsxs("div",{className:"space-y-1",children:[c.slice(0,3).map(g=>r.jsx("div",{className:p.cn("text-xs px-2 py-1 rounded truncate cursor-pointer hover:opacity-80",g.color||G),style:g.color&&g.color.startsWith("#")?{backgroundColor:g.color}:void 0,onClick:S=>{S.stopPropagation(),l?.(g)},children:g.title},g.id)),c.length>3&&r.jsxs("div",{className:"text-xs text-muted-foreground px-2",children:["+",c.length-3," more"]})]})]},d)})})]})}function je({date:e,events:n,onEventClick:l,onDateClick:u}){const f=oe(e),s=Array.from({length:7},(a,d)=>{const c=new Date(f);return c.setDate(c.getDate()+d),c}),m=new Date;return r.jsxs("div",{className:"flex flex-col h-full",children:[r.jsx("div",{className:"grid grid-cols-7 border-b",children:s.map(a=>{const d=se(a,m);return r.jsxs("div",{className:"p-3 text-center border-r last:border-r-0",children:[r.jsx("div",{className:"text-sm font-medium text-muted-foreground",children:a.toLocaleDateString(locale,{weekday:"short"})}),r.jsx("div",{className:p.cn("text-lg font-semibold mt-1",d&&"inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground h-8 w-8"),children:a.getDate()})]},a.toISOString())})}),r.jsx("div",{className:"grid grid-cols-7 flex-1",children:s.map(a=>{const d=Q(a,n);return r.jsx("div",{className:"border-r last:border-r-0 p-2 min-h-[400px] cursor-pointer hover:bg-accent/50",onClick:()=>u?.(a),children:r.jsx("div",{className:"space-y-2",children:d.map(c=>r.jsxs("div",{className:p.cn("text-sm px-3 py-2 rounded cursor-pointer hover:opacity-80",c.color||G),style:c.color&&c.color.startsWith("#")?{backgroundColor:c.color}:void 0,onClick:y=>{y.stopPropagation(),l?.(c)},children:[r.jsx("div",{className:"font-medium",children:c.title}),!c.allDay&&r.jsx("div",{className:"text-xs opacity-90 mt-1",children:c.start.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"})})]},c.id))})},a.toISOString())})})]})}function De({date:e,events:n,onEventClick:l}){const u=Q(e,n),f=Array.from({length:24},(s,m)=>m);return r.jsx("div",{className:"flex flex-col h-full",children:r.jsx("div",{className:"flex-1 overflow-auto",children:f.map(s=>{const m=u.filter(a=>a.allDay?s===0:a.start.getHours()===s);return r.jsxs("div",{className:"flex border-b min-h-[60px]",children:[r.jsx("div",{className:"w-20 p-2 text-sm text-muted-foreground border-r",children:s===0?"12 AM":s<12?`${s} AM`:s===12?"12 PM":`${s-12} PM`}),r.jsx("div",{className:"flex-1 p-2 space-y-2",children:m.map(a=>r.jsxs("div",{className:p.cn("px-3 py-2 rounded cursor-pointer hover:opacity-80",a.color||G),style:a.color&&a.color.startsWith("#")?{backgroundColor:a.color}:void 0,onClick:()=>l?.(a),children:[r.jsx("div",{className:"font-medium",children:a.title}),!a.allDay&&r.jsxs("div",{className:"text-xs opacity-90 mt-1",children:[a.start.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"}),a.end&&` - ${a.end.toLocaleTimeString("default",{hour:"numeric",minute:"2-digit"})}`]})]},a.id))})]},s)})})})}function ve(e){return"data"in e&&e.data?e.data:"staticData"in e&&e.staticData?{provider:"value",items:e.staticData}:e.objectName?{provider:"object",object:e.objectName}:null}function he(e){if(e){if(typeof e=="string"){const n=e.split(" "),l=n[0],u=n[1]?.toLowerCase()==="desc"?"desc":"asc";return{[l]:u}}if(Array.isArray(e))return e.reduce((n,l)=>(l.field&&l.order&&(n[l.field]=l.order),n),{})}}function we(e){return"filter"in e&&e.filter&&typeof e.filter=="object"&&"calendar"in e.filter?e.filter.calendar:e.calendar?e.calendar:e.startDateField||e.dateField?{startDateField:e.startDateField||e.dateField,endDateField:e.endDateField||e.endField,titleField:e.titleField||"name",colorField:e.colorField,allDayField:e.allDayField}:null}const ce=({schema:e,dataSource:n,className:l,onEventClick:u,onDateClick:f,onNavigate:s,onViewChange:m,...a})=>{const[d,c]=j.useState([]),[y,w]=j.useState(!0),[g,S]=j.useState(null),[I,V]=j.useState(null),[k,L]=j.useState(new Date),[q,Y]=j.useState("month"),i=j.useMemo(()=>ve(e),[e.data,e.staticData,e.objectName]),F=j.useMemo(()=>we(e),[e.filter,e.calendar,e.dateField,e.endField,e.titleField,e.colorField]),T=i?.provider==="value";j.useEffect(()=>{let b=!0;return(async()=>{try{if(!b)return;if(w(!0),T&&i?.provider==="value"){b&&(c(i.items),w(!1));return}if(e.data||a.data){const C=e.data||a.data;if(Array.isArray(C)){c(C),w(!1);return}}if(!n)throw new Error("DataSource required for object/api providers");if(i?.provider==="object"){const C=i.object,E=await n.find(C,{$filter:e.filter,$orderby:he(e.sort)});let h=[];Array.isArray(E)?h=E:E&&typeof E=="object"&&(Array.isArray(E.data)?h=E.data:Array.isArray(E.value)&&(h=E.value)),b&&c(h)}else i?.provider==="api"&&(console.warn("API provider not yet implemented for ObjectCalendar"),b&&c([]));b&&w(!1)}catch(C){console.error("[ObjectCalendar] Error fetching data:",C),b&&(S(C),w(!1))}})(),()=>{b=!1}},[i,n,T,e.filter,e.sort]),j.useEffect(()=>{!T&&n&&(async()=>{try{if(!n)return;const _=i?.provider==="object"?i.object:e.objectName;if(!_)return;const C=await n.getObjectSchema(_);V(C)}catch(_){console.error("Failed to fetch object schema:",_)}})()},[e.objectName,n,T,i]);const K=j.useMemo(()=>{if(!F||!d.length)return[];const{startDateField:b,endDateField:_,titleField:C,colorField:E}=F;return d.map((h,te)=>{const O=h[b],A=_?h[_]:null,z=h[C]||"Untitled",H=E?h[E]:void 0;return{id:h.id||h._id||`event-${te}`,title:z,start:O?new Date(O):new Date,end:A?new Date(A):void 0,color:H,allDay:!A,data:h}}).filter(h=>!isNaN(h.start.getTime()))},[d,F]),ee=j.useCallback(()=>{f?.(new Date)},[f]);return y?r.jsx("div",{className:l,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsx("div",{className:"text-muted-foreground",children:"Loading calendar..."})})}):g?r.jsx("div",{className:l,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsxs("div",{className:"text-destructive",children:["Error: ",g.message]})})}):F?r.jsx("div",{className:l,children:r.jsx("div",{className:"border rounded-lg bg-background h-[calc(100vh-200px)] min-h-[600px]",children:r.jsx(X,{events:K,currentDate:k,view:e.defaultView||"month",onEventClick:b=>u?.(b.data),onDateClick:f,onNavigate:b=>{L(b),s?.(b)},onViewChange:b=>{Y(b),m?.(b)},onAddClick:ee})})}):r.jsx("div",{className:l,children:r.jsx("div",{className:"flex items-center justify-center h-96",children:r.jsx("div",{className:"text-muted-foreground",children:"Calendar configuration required. Please specify startDateField and titleField."})})})};B.ComponentRegistry.register("calendar-view",({schema:e,className:n,onAction:l,...u})=>{const f=j.useMemo(()=>!e.data||!Array.isArray(e.data)?[]:e.data.map((a,d)=>{const c=e.titleField||"title",y=e.startDateField||"start",w=e.endDateField||"end",g=e.colorField||"color",S=e.allDayField||"allDay";return{id:a._id||a.id||d,title:a[c]||"Untitled Event",start:new Date(a[y]),end:a[w]?new Date(a[w]):void 0,allDay:a[S],color:a[g],data:a}}),[e.data,e.titleField,e.startDateField,e.endDateField,e.colorField,e.allDayField]),s=a=>{e.onEventClick&&l?.({type:"event-click",payload:a})},m=()=>{l?.({type:"create",payload:{}})};return r.jsx(X,{className:n,events:f,onEventClick:s,onAddClick:m,...u})},{namespace:"plugin-calendar",label:"Calendar View",inputs:[{name:"data",type:"array",label:"Data",description:"Array of record objects to display as events"},{name:"titleField",type:"string",label:"Title Field",defaultValue:"title",description:"Field name to use for event title"},{name:"startDateField",type:"string",label:"Start Date Field",defaultValue:"start",description:"Field name for event start date"},{name:"endDateField",type:"string",label:"End Date Field",defaultValue:"end",description:"Field name for event end date (optional)"},{name:"allDayField",type:"string",label:"All Day Field",defaultValue:"allDay",description:"Field name for all-day flag"},{name:"colorField",type:"string",label:"Color Field",defaultValue:"color",description:"Field name for event color"},{name:"colorMapping",type:"object",label:"Color Mapping",description:'Map field values to colors (e.g., {meeting: "blue", deadline: "red"})'},{name:"view",type:"enum",enum:["month","week","day"],defaultValue:"month",label:"View Mode",description:"Calendar view mode (month, week, or day)"},{name:"currentDate",type:"string",label:"Current Date",description:"ISO date string for initial calendar date"},{name:"allowCreate",type:"boolean",label:"Allow Create",defaultValue:!1,description:"Allow creating events by clicking on dates"},{name:"className",type:"string",label:"CSS Class"}],defaultProps:{view:"month",titleField:"title",startDateField:"start",endDateField:"end",allDayField:"allDay",colorField:"color",allowCreate:!1,data:[{id:1,title:"Team Meeting",start:new Date(new Date().setHours(10,0,0,0)).toISOString(),end:new Date(new Date().setHours(11,0,0,0)).toISOString(),color:"#3b82f6",allDay:!1},{id:2,title:"Project Deadline",start:new Date(new Date().setDate(new Date().getDate()+3)).toISOString(),color:"#ef4444",allDay:!0},{id:3,title:"Conference",start:new Date(new Date().setDate(new Date().getDate()+7)).toISOString(),end:new Date(new Date().setDate(new Date().getDate()+9)).toISOString(),color:"#10b981",allDay:!0}],className:"h-[600px] border rounded-lg"}});const Z=({schema:e})=>{const{dataSource:n}=fe.useSchemaContext();return r.jsx(ce,{schema:e,dataSource:n})};B.ComponentRegistry.register("object-calendar",Z,{namespace:"plugin-calendar",label:"Object Calendar",category:"view",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"calendar",type:"object",label:"Calendar Config",description:"startDateField, endDateField, titleField, colorField"}]}),B.ComponentRegistry.register("calendar",Z,{namespace:"view",label:"Calendar View",category:"view",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"calendar",type:"object",label:"Calendar Config",description:"startDateField, endDateField, titleField, colorField"}]}),N.CalendarView=X,N.ObjectCalendar=ce,N.ObjectCalendarRenderer=Z,Object.defineProperty(N,Symbol.toStringTag,{value:"Module"})}));

package/dist/src/CalendarView.d.ts

@@ -18,12 +18,14 @@ export interface CalendarViewProps {
     events?: CalendarEvent[];
     view?: "month" | "week" | "day";
     currentDate?: Date;
+    locale?: string;
     onEventClick?: (event: CalendarEvent) => void;
     onDateClick?: (date: Date) => void;
     onViewChange?: (view: "month" | "week" | "day") => void;
     onNavigate?: (date: Date) => void;
+    onAddClick?: () => void;
     className?: string;
 }
-declare function CalendarView({ events, view, currentDate, onEventClick, onDateClick, onViewChange, onNavigate, className, }: CalendarViewProps): import("react/jsx-runtime").JSX.Element;
+declare function CalendarView({ events, view, currentDate, locale, onEventClick, onDateClick, onViewChange, onNavigate, onAddClick, className, }: CalendarViewProps): import("react/jsx-runtime").JSX.Element;
 export { CalendarView };
 //# sourceMappingURL=CalendarView.d.ts.map

package/dist/src/CalendarView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarView.d.ts","sourceRoot":"","sources":["../../src/CalendarView.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAUH,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,IAAI,CAAA;IACX,GAAG,CAAC,EAAE,IAAI,CAAA;IACV,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,GAAG,CAAA;CACX;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,CAAC,EAAE,aAAa,EAAE,CAAA;IACxB,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,CAAA;IAC/B,WAAW,CAAC,EAAE,IAAI,CAAA;IAClB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAA;IAC7C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IAClC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,KAAK,IAAI,CAAA;IACvD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EACpB,MAAW,EACX,IAAc,EACd,WAAwB,EACxB,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,UAAU,EACV,SAAS,GACV,EAAE,iBAAiB,2CA2InB;AA8TD,OAAO,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"CalendarView.d.ts","sourceRoot":"","sources":["../../src/CalendarView.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAsBH,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,IAAI,CAAA;IACX,GAAG,CAAC,EAAE,IAAI,CAAA;IACV,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,GAAG,CAAA;CACX;AAED,MAAM,WAAW,iBAAiB;IAChC,MAAM,CAAC,EAAE,aAAa,EAAE,CAAA;IACxB,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,CAAA;IAC/B,WAAW,CAAC,EAAE,IAAI,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAA;IAC7C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IAClC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,KAAK,IAAI,CAAA;IACvD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IACjC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EACpB,MAAW,EACX,IAAc,EACd,WAAwB,EACxB,MAAkB,EAClB,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,UAAU,EACV,UAAU,EACV,SAAS,GACV,EAAE,iBAAiB,2CA4LnB;AA8TD,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/src/ObjectCalendar.d.ts

@@ -1,13 +1,27 @@
 import { default as React } from 'react';
 import { ObjectGridSchema, DataSource } from '@object-ui/types';
+export interface CalendarSchema {
+    type: 'calendar';
+    objectName?: string;
+    dateField?: string;
+    endField?: string;
+    titleField?: string;
+    colorField?: string;
+    filter?: any;
+    sort?: any;
+    /** Initial view mode */
+    defaultView?: 'month' | 'week' | 'day';
+}
 export interface ObjectCalendarProps {
-    schema: ObjectGridSchema;
+    schema: ObjectGridSchema | CalendarSchema;
     dataSource?: DataSource;
     className?: string;
     onEventClick?: (record: any) => void;
     onDateClick?: (date: Date) => void;
     onEdit?: (record: any) => void;
     onDelete?: (record: any) => void;
+    onNavigate?: (date: Date) => void;
+    onViewChange?: (view: 'month' | 'week' | 'day') => void;
 }
 export declare const ObjectCalendar: React.FC<ObjectCalendarProps>;
 //# sourceMappingURL=ObjectCalendar.d.ts.map

package/dist/src/ObjectCalendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectCalendar.d.ts","sourceRoot":"","sources":["../../src/ObjectCalendar.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAoD,MAAM,OAAO,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAA4B,MAAM,kBAAkB,CAAC;AAE/F,MAAM,WAAW,mBAAmB;IAClC,MAAM,EAAE,gBAAgB,CAAC;IACzB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;CAClC;AAuED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAsRxD,CAAC"}
+{"version":3,"file":"ObjectCalendar.d.ts","sourceRoot":"","sources":["../../src/ObjectCalendar.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAoD,MAAM,OAAO,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAA4B,MAAM,kBAAkB,CAAC;AAG/F,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,UAAU,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,CAAC;CACxC;AAED,MAAM,WAAW,mBAAmB;IAClC,MAAM,EAAE,gBAAgB,GAAG,cAAc,CAAC;IAC1C,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,KAAK,IAAI,CAAC;CACzD;AAkFD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAuNxD,CAAC"}

package/dist/src/index.d.ts

@@ -1,6 +1,10 @@
+import { default as React } from 'react';
 import { ObjectCalendar, ObjectCalendarProps } from './ObjectCalendar';
 export { ObjectCalendar };
 export type { ObjectCalendarProps };
 export { CalendarView } from './CalendarView';
 export type { CalendarViewProps, CalendarEvent } from './CalendarView';
+export declare const ObjectCalendarRenderer: React.FC<{
+    schema: any;
+}>;
 //# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAG5D,OAAO,EAAE,cAAc,EAAE,CAAC;AAC1B,YAAY,EAAE,mBAAmB,EAAE,CAAC;AAGpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAGvE,OAAO,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAG5D,OAAO,EAAE,cAAc,EAAE,CAAC;AAC1B,YAAY,EAAE,mBAAmB,EAAE,CAAC;AAGpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAGvE,OAAO,0BAA0B,CAAC;AAGlC,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,MAAM,EAAE,GAAG,CAAA;CAAE,CAG5D,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@object-ui/plugin-calendar",
-  "version": "0.3.1",
+  "version": "2.0.0",
   "type": "module",
   "license": "MIT",
   "description": "Calendar view plugins for Object UI - includes both ObjectQL-integrated and standalone calendar components",
@@ -25,23 +25,24 @@
   },
   "dependencies": {
     "lucide-react": "^0.563.0",
-    "@object-ui/components": "0.3.1",
-    "@object-ui/core": "0.3.1",
-    "@object-ui/fields": "0.3.1",
-    "@object-ui/react": "0.3.1",
-    "@object-ui/types": "0.3.1"
+    "@object-ui/components": "2.0.0",
+    "@object-ui/core": "2.0.0",
+    "@object-ui/fields": "2.0.0",
+    "@object-ui/react": "2.0.0",
+    "@object-ui/types": "2.0.0"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
-    "@types/react": "^19.2.9",
+    "@types/react": "^19.2.13",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^4.2.1",
+    "@vitejs/plugin-react": "^5.1.3",
     "typescript": "^5.9.3",
     "vite": "^7.3.1",
-    "vite-plugin-dts": "^4.5.4"
+    "vite-plugin-dts": "^4.5.4",
+    "@object-ui/data-objectstack": "2.0.0"
   },
   "scripts": {
     "build": "vite build",

package/src/CalendarView.test.tsx

@@ -0,0 +1,118 @@
+import { describe, it, expect, vi } from 'vitest';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { CalendarView, CalendarEvent } from './CalendarView';
+import React from 'react';
+
+// Mock ResizeObserver
+class ResizeObserver {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+}
+global.ResizeObserver = ResizeObserver;
+
+// Mock PointerEvents which are not in JSDOM but needed for Radix
+if (!global.PointerEvent) {
+  class PointerEvent extends Event {
+    button: number;
+    ctrlKey: boolean;
+    metaKey: boolean;
+    shiftKey: boolean;
+    constructor(type: string, props: any = {}) {
+      super(type, props);
+      this.button = props.button || 0;
+      this.ctrlKey = props.ctrlKey || false;
+      this.metaKey = props.metaKey || false;
+      this.shiftKey = props.shiftKey || false;
+    }
+  }
+  // @ts-expect-error Mocking global PointerEvent
+  global.PointerEvent = PointerEvent as any;
+}
+
+// Mock HTMLElement.offsetParent for Radix Popper
+Object.defineProperty(HTMLElement.prototype, 'offsetParent', {
+  get() {
+    return this.parentElement;
+  },
+});
+
+describe('CalendarView', () => {
+  const mockEvents: CalendarEvent[] = [
+    {
+      id: '1',
+      title: 'Test Event 1',
+      start: new Date(2024, 0, 15, 10, 0), // Jan 15, 2024
+      end: new Date(2024, 0, 15, 11, 0),
+    }
+  ];
+
+  const defaultDate = new Date(2024, 0, 15); // Jan 15, 2024
+
+  it('renders the header correctly', () => {
+    render(<CalendarView currentDate={defaultDate} locale="en-US" />);
+    
+    // Check for month label
+    expect(screen.getByText('January 2024')).toBeInTheDocument();
+  });
+
+  it('renders navigation buttons', () => {
+    render(<CalendarView currentDate={defaultDate} locale="en-US" />);
+    
+    expect(screen.getByText('Today')).toBeInTheDocument();
+    
+    // We expect 5 buttons:
+    // 1. Today
+    // 2. Prev (Chevron)
+    // 3. Next (Chevron)
+    // 4. Date Picker Trigger (Button wrapping text)
+    // 5. Select View Trigger (Button)
+    
+    const buttons = screen.getAllByRole('button');
+    // Just verify we have the essential ones
+    expect(buttons.length).toBeGreaterThanOrEqual(4); 
+    
+    // Verify specific triggers via aria-expanded or combobox functionality if possible, 
+    // or just by existence to satisfy "I don't see the dropdown" check.
+  });
+
+  it('renders the view switcher dropdown trigger', () => {
+    render(<CalendarView currentDate={defaultDate} view="month" locale="en-US" />);
+    // The SelectValue should display "Month"
+    const selectTrigger = screen.getByText('Month');
+    expect(selectTrigger).toBeInTheDocument();
+    
+    // Ensure it's inside a button (Radix Select Trigger)
+    const triggerButton = selectTrigger.closest('button');
+    expect(triggerButton).toBeInTheDocument();
+  });
+
+  it('renders the date picker trigger', () => {
+    render(<CalendarView currentDate={defaultDate} locale="en-US" />);
+    // The date label (e.g. "January 2024") is now inside a PopoverTrigger button
+    const dateLabel = screen.getByText('January 2024');
+    expect(dateLabel).toBeInTheDocument();
+
+    const triggerButton = dateLabel.closest('button');
+    expect(triggerButton).toBeInTheDocument();
+    expect(triggerButton).toHaveClass('text-xl font-semibold');
+  });
+
+  it('opens date picker on click', () => {
+    // We need to mock pointer interactions for Popover usually, but let's try basic click
+    render(<CalendarView currentDate={defaultDate} locale="en-US" />);
+    const dateTrigger = screen.getByText('January 2024');
+    
+    fireEvent.click(dateTrigger);
+    
+    // After click, the Calendar component inside PopoverContent should appear.
+    // However, Radix portals might make this tricky in simple jest-dom without proper setup.
+    // We just verify the trigger is clickable.
+    expect(dateTrigger).toBeEnabled();
+  });
+
+  it('renders events in month view', () => {
+    render(<CalendarView currentDate={defaultDate} events={mockEvents} locale="en-US" />);
+    expect(screen.getByText('Test Event 1')).toBeInTheDocument();
+  });
+});

package/src/CalendarView.tsx

@@ -9,8 +9,20 @@
 "use client"
 
 import * as React from "react"
-import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react"
-import { cn, Button, Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@object-ui/components"
+import { ChevronLeftIcon, ChevronRightIcon, CalendarIcon, PlusIcon } from "lucide-react"
+import { 
+  cn, 
+  Button, 
+  Select, 
+  SelectContent, 
+  SelectItem, 
+  SelectTrigger, 
+  SelectValue,
+  Calendar,
+  Popover,
+  PopoverContent,
+  PopoverTrigger
+} from "@object-ui/components"
 
 const DEFAULT_EVENT_COLOR = "bg-blue-500 text-white"
 
@@ -28,10 +40,12 @@ export interface CalendarViewProps {
   events?: CalendarEvent[]
   view?: "month" | "week" | "day"
   currentDate?: Date
+  locale?: string
   onEventClick?: (event: CalendarEvent) => void
   onDateClick?: (date: Date) => void
   onViewChange?: (view: "month" | "week" | "day") => void
   onNavigate?: (date: Date) => void
+  onAddClick?: () => void
   className?: string
 }
 
@@ -39,15 +53,26 @@ function CalendarView({
   events = [],
   view = "month",
   currentDate = new Date(),
+  locale = "default",
   onEventClick,
   onDateClick,
   onViewChange,
   onNavigate,
+  onAddClick,
   className,
 }: CalendarViewProps) {
   const [selectedView, setSelectedView] = React.useState(view)
   const [selectedDate, setSelectedDate] = React.useState(currentDate)
 
+  // Sync state if props change
+  React.useEffect(() => {
+    setSelectedDate(currentDate)
+  }, [currentDate])
+
+  React.useEffect(() => {
+    setSelectedView(view)
+  }, [view])
+
   const handlePrevious = () => {
     const newDate = new Date(selectedDate)
     if (selectedView === "month") {
@@ -87,7 +112,7 @@ function CalendarView({
 
   const getDateLabel = () => {
     if (selectedView === "month") {
-      return selectedDate.toLocaleDateString("default", {
+      return selectedDate.toLocaleDateString(locale, {
         month: "long",
         year: "numeric",
       })
@@ -95,16 +120,16 @@ function CalendarView({
       const weekStart = getWeekStart(selectedDate)
       const weekEnd = new Date(weekStart)
       weekEnd.setDate(weekEnd.getDate() + 6)
-      return `${weekStart.toLocaleDateString("default", {
+      return `${weekStart.toLocaleDateString(locale, {
         month: "short",
         day: "numeric",
-      })} - ${weekEnd.toLocaleDateString("default", {
+      })} - ${weekEnd.toLocaleDateString(locale, {
         month: "short",
         day: "numeric",
         year: "numeric",
       })}`
     } else {
-      return selectedDate.toLocaleDateString("default", {
+      return selectedDate.toLocaleDateString(locale, {
         weekday: "long",
         month: "long",
         day: "numeric",
@@ -113,37 +138,70 @@ function CalendarView({
     }
   }
 
+  const handleDateSelect = (date: Date | undefined) => {
+    if (date) {
+      setSelectedDate(date)
+      onNavigate?.(date)
+    }
+  }
+
   return (
     <div className={cn("flex flex-col h-full bg-background", className)}>
       {/* Header */}
       <div className="flex items-center justify-between p-4 border-b">
-        <div className="flex items-center gap-2">
-          <Button variant="outline" size="sm" onClick={handleToday}>
-            Today
-          </Button>
-          <div className="flex items-center">
-            <Button
-              variant="ghost"
-              size="icon"
-              onClick={handlePrevious}
-              className="h-8 w-8"
-            >
-              <ChevronLeftIcon className="h-4 w-4" />
-            </Button>
-            <Button
-              variant="ghost"
-              size="icon"
-              onClick={handleNext}
-              className="h-8 w-8"
-            >
-              <ChevronRightIcon className="h-4 w-4" />
-            </Button>
+        <div className="flex items-center gap-4">
+          <div className="flex items-center bg-muted/50 rounded-lg p-1 gap-1">
+             <Button variant="ghost" size="sm" onClick={handleToday} className="h-8">
+               Today
+             </Button>
+             <div className="h-4 w-px bg-border mx-1" />
+             <Button
+               variant="ghost"
+               size="icon"
+               onClick={handlePrevious}
+               className="h-8 w-8"
+             >
+               <ChevronLeftIcon className="h-4 w-4" />
+             </Button>
+             <Button
+               variant="ghost"
+               size="icon"
+               onClick={handleNext}
+               className="h-8 w-8"
+             >
+               <ChevronRightIcon className="h-4 w-4" />
+             </Button>
           </div>
-          <h2 className="text-lg font-semibold ml-2">{getDateLabel()}</h2>
+          
+          <Popover>
+            <PopoverTrigger asChild>
+              <Button 
+                variant="ghost" 
+                className={cn(
+                  "text-xl font-semibold h-auto px-3 py-1 hover:bg-muted/50 transition-colors",
+                  "flex items-center gap-2"
+                )}
+              >
+                <CalendarIcon className="h-5 w-5 text-muted-foreground" />
+                <span>{getDateLabel()}</span>
+              </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-auto p-0" align="start">
+              <Calendar
+                mode="single"
+                selected={selectedDate}
+                onSelect={handleDateSelect}
+                initialFocus
+                fromYear={2000}
+                toYear={2050}
+              />
+            </PopoverContent>
+          </Popover>
         </div>
+
         <div className="flex items-center gap-2">
           <Select value={selectedView} onValueChange={handleViewChange}>
-            <SelectTrigger className="w-32">
+            <SelectTrigger className="w-32 bg-background">
               <SelectValue />
             </SelectTrigger>
             <SelectContent>
@@ -152,6 +210,13 @@ function CalendarView({
               <SelectItem value="month">Month</SelectItem>
             </SelectContent>
           </Select>
+          
+          {onAddClick && (
+            <Button onClick={onAddClick} size="sm" className="gap-1">
+              <PlusIcon className="h-4 w-4" />
+              New
+            </Button>
+          )}
         </div>
       </div>
 
@@ -366,7 +431,7 @@ function WeekView({ date, events, onEventClick, onDateClick }: WeekViewProps) {
               className="p-3 text-center border-r last:border-r-0"
             >
               <div className="text-sm font-medium text-muted-foreground">
-                {day.toLocaleDateString("default", { weekday: "short" })}
+                {day.toLocaleDateString(locale, { weekday: "short" })}
               </div>
               <div
                 className={cn(