@fullcalendar/multimonth
Advanced tools
Comparing version 6.1.0 to 6.1.1
/*! | ||
FullCalendar Multi-Month Plugin v6.1.0 | ||
Docs & License: https://fullcalendar.io/docs/multimonth-view | ||
(c) 2022 Adam Shaw | ||
FullCalendar Multi-Month Plugin v6.1.1 | ||
Docs & License: https://fullcalendar.io/docs/multimonth-grid | ||
(c) 2023 Adam Shaw | ||
*/ | ||
@@ -6,0 +6,0 @@ FullCalendar.MultiMonth = (function (exports, core, internal$1, internal, preact) { |
/*! | ||
FullCalendar Multi-Month Plugin v6.1.0 | ||
Docs & License: https://fullcalendar.io/docs/multimonth-view | ||
(c) 2022 Adam Shaw | ||
FullCalendar Multi-Month Plugin v6.1.1 | ||
Docs & License: https://fullcalendar.io/docs/multimonth-grid | ||
(c) 2023 Adam Shaw | ||
*/ | ||
FullCalendar.MultiMonth=function(t,e,l,i,n){"use strict";class o extends i.DateComponent{constructor(){super(...arguments),this.buildDayTableModel=i.memoize(l.buildDayTableModel),this.slicer=new l.DayTableSlicer,this.state={labelId:i.getUniqueDomId()}}render(){const{props:t,state:e,context:o}=this,{dateProfile:a,forPrint:r}=t,{options:s}=o,c=this.buildDayTableModel(a,o.dateProfileGenerator),d=this.slicer.sliceProps(t,a,s.nextDayThreshold,o,c),m=null!=t.tableWidth?t.tableWidth/s.aspectRatio:null,h=c.cells.length,u=null!=m?m/h:null;return n.createElement("div",{ref:t.elRef,"data-date":t.isoDateStr,className:"fc-multimonth-month",style:{width:t.width},role:"grid","aria-labelledby":e.labelId},n.createElement("div",{className:"fc-multimonth-header",style:{marginBottom:u},role:"presentation"},n.createElement("div",{className:"fc-multimonth-title",id:e.labelId},o.dateEnv.format(t.dateProfile.currentRange.start,t.titleFormat)),n.createElement("table",{className:["fc-multimonth-header-table",o.theme.getClass("table")].join(" "),role:"presentation"},n.createElement("thead",{role:"rowgroup"},n.createElement(i.DayHeader,{dateProfile:t.dateProfile,dates:c.headerDates,datesRepDistinctDays:!1})))),n.createElement("div",{className:["fc-multimonth-daygrid","fc-daygrid","fc-daygrid-body",!r&&"fc-daygrid-body-balanced",r&&"fc-daygrid-body-unbalanced",r&&"fc-daygrid-body-natural"].join(" "),style:{marginTop:-u}},n.createElement("table",{className:["fc-multimonth-daygrid-table",o.theme.getClass("table")].join(" "),style:{height:r?"":m},role:"presentation"},n.createElement("tbody",{role:"rowgroup"},n.createElement(l.TableRows,Object.assign({},d,{dateProfile:a,cells:c.cells,eventSelection:t.eventSelection,dayMaxEvents:!r,dayMaxEventRows:!r,showWeekNumbers:s.weekNumbers,clientWidth:t.clientWidth,clientHeight:t.clientHeight,forPrint:r}))))))}}class a extends i.DateComponent{constructor(){super(...arguments),this.splitDateProfileByMonth=i.memoize(s),this.buildMonthFormat=i.memoize(m),this.scrollElRef=n.createRef(),this.firstMonthElRef=n.createRef(),this.needsScrollReset=!1,this.handleSizing=t=>{t&&this.updateSize()}}render(){const{context:t,props:e,state:l}=this,{options:a}=t,{clientWidth:r,clientHeight:s}=l,c=l.monthHPadding||0,d=Math.min(null!=r?Math.floor(r/(a.multiMonthMinWidth+c)):1,a.multiMonthMaxColumns)||1,m=100/d+"%",h=null==r?null:r/d-c,u=null!=r&&1===d,f=this.splitDateProfileByMonth(t.dateProfileGenerator,e.dateProfile,t.dateEnv,!u&&a.fixedWeekCount,a.showNonCurrentDates),g=this.buildMonthFormat(a.multiMonthTitleFormat,f),p=["fc-multimonth",u?"fc-multimonth-singlecol":"fc-multimonth-multicol",null!=h&&h<400?"fc-multimonth-compact":""];return n.createElement(i.ViewContainer,{elRef:this.scrollElRef,elClasses:p,viewSpec:t.viewSpec},f.map((t,l)=>{const a=i.formatIsoMonthStr(t.currentRange.start);return n.createElement(o,Object.assign({},e,{key:a,isoDateStr:a,elRef:0===l?this.firstMonthElRef:void 0,titleFormat:g,dateProfile:t,width:m,tableWidth:h,clientWidth:r,clientHeight:s}))}))}componentDidMount(){this.updateSize(),this.context.addResizeHandler(this.handleSizing),this.requestScrollReset()}componentDidUpdate(t){i.isPropsEqual(t,this.props)||this.handleSizing(!1),t.dateProfile!==this.props.dateProfile?this.requestScrollReset():this.flushScrollReset()}componentWillUnmount(){this.context.removeResizeHandler(this.handleSizing)}updateSize(){const t=this.scrollElRef.current,e=this.firstMonthElRef.current;t&&this.setState({clientWidth:t.clientWidth,clientHeight:t.clientHeight}),e&&t&&null==this.state.monthHPadding&&this.setState({monthHPadding:t.clientWidth-e.firstChild.offsetWidth})}requestScrollReset(){this.needsScrollReset=!0,this.flushScrollReset()}flushScrollReset(){if(this.needsScrollReset&&null!=this.state.monthHPadding){const{currentDate:t}=this.props.dateProfile,e=this.scrollElRef.current,l=e.querySelector(`[data-date="${i.formatIsoMonthStr(t)}"]`);e.scrollTop=l.getBoundingClientRect().top-this.firstMonthElRef.current.getBoundingClientRect().top,this.needsScrollReset=!1}}shouldComponentUpdate(){return!0}}const r=i.createDuration(1,"month");function s(t,e,n,o,a){const{start:s,end:c}=e.currentRange;let d=s;const m=[];for(;d.valueOf()<c.valueOf();){const s=n.add(d,r),c={start:t.skipHiddenDays(d),end:t.skipHiddenDays(s,-1,!0)};let h=l.buildDayTableRenderRange({currentRange:c,snapToWeek:!0,fixedWeekCount:o,dateEnv:n});h={start:t.skipHiddenDays(h.start),end:t.skipHiddenDays(h.end,-1,!0)};const u=e.activeRange?i.intersectRanges(e.activeRange,a?h:c):null;m.push({currentDate:e.currentDate,isValid:e.isValid,validRange:e.validRange,renderRange:h,activeRange:u,currentRange:c,currentRangeUnit:"month",isRangeAllDay:!0,dateIncrement:e.dateIncrement,slotMinTime:e.slotMaxTime,slotMaxTime:e.slotMinTime}),d=s}return m}const c=i.createFormatter({year:"numeric",month:"long"}),d=i.createFormatter({month:"long"});function m(t,e){return t||(e[0].currentRange.start.getUTCFullYear()!==e[e.length-1].currentRange.start.getUTCFullYear()?c:d)}const h={multiMonthTitleFormat:i.createFormatter,multiMonthMaxColumns:Number,multiMonthMinWidth:Number};i.injectStyles(".fc .fc-multimonth{border:1px solid var(--fc-border-color);display:flex;flex-wrap:wrap;overflow-x:hidden;overflow-y:auto}.fc .fc-multimonth-title{font-size:1.2em;font-weight:700;padding:1em 0;text-align:center}.fc .fc-multimonth-daygrid{background:var(--fc-page-bg-color)}.fc .fc-multimonth-daygrid-table,.fc .fc-multimonth-header-table{table-layout:fixed;width:100%}.fc .fc-multimonth-daygrid-table{border-top-style:hidden!important}.fc .fc-multimonth-singlecol .fc-multimonth{position:relative}.fc .fc-multimonth-singlecol .fc-multimonth-header{background:var(--fc-page-bg-color);position:relative;top:0;z-index:2}.fc .fc-multimonth-singlecol .fc-multimonth-daygrid{position:relative;z-index:1}.fc .fc-multimonth-singlecol .fc-multimonth-daygrid-table,.fc .fc-multimonth-singlecol .fc-multimonth-header-table{border-left-style:hidden;border-right-style:hidden}.fc .fc-multimonth-singlecol .fc-multimonth-month:last-child .fc-multimonth-daygrid-table{border-bottom-style:hidden}.fc .fc-multimonth-multicol{line-height:1}.fc .fc-multimonth-multicol .fc-multimonth-month{padding:0 1.2em 1.2em}.fc .fc-multimonth-multicol .fc-daygrid-more-link{border:1px solid var(--fc-event-border-color);display:block;float:none;padding:1px}.fc .fc-multimonth-compact{line-height:1}.fc .fc-multimonth-compact .fc-multimonth-daygrid-table,.fc .fc-multimonth-compact .fc-multimonth-header-table{font-size:.9em}.fc-media-screen .fc-multimonth-singlecol .fc-multimonth-header{position:sticky}.fc-media-print .fc-multimonth{overflow:visible}");var u=e.createPlugin({name:"@fullcalendar/multimonth",initialView:"multiMonthYear",optionRefiners:h,views:{multiMonth:{component:a,dateProfileGeneratorClass:l.TableDateProfileGenerator,multiMonthMinWidth:350,multiMonthMaxColumns:3},multiMonthYear:{type:"multiMonth",duration:{years:1},fixedWeekCount:!0,showNonCurrentDates:!1}}});return e.globalPlugins.push(u),t.default=u,Object.defineProperty(t,"__esModule",{value:!0}),t}({},FullCalendar,FullCalendar.DayGrid.Internal,FullCalendar.Internal,FullCalendar.Preact); |
80
index.js
@@ -1,17 +0,13 @@ | ||
'use strict'; | ||
import { createPlugin } from '@fullcalendar/core'; | ||
import { buildDayTableModel, DayTableSlicer, TableRows, buildDayTableRenderRange, TableDateProfileGenerator } from '@fullcalendar/daygrid/internal'; | ||
import { DateComponent, memoize, getUniqueDomId, DayHeader, ViewContainer, formatIsoMonthStr, isPropsEqual, createDuration, intersectRanges, createFormatter, injectStyles } from '@fullcalendar/core/internal'; | ||
import { createElement, createRef } from '@fullcalendar/core/preact'; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
var core = require('@fullcalendar/core'); | ||
var internal$1 = require('@fullcalendar/daygrid/internal'); | ||
var internal = require('@fullcalendar/core/internal'); | ||
var preact = require('@fullcalendar/core/preact'); | ||
class SingleMonth extends internal.DateComponent { | ||
class SingleMonth extends DateComponent { | ||
constructor() { | ||
super(...arguments); | ||
this.buildDayTableModel = internal.memoize(internal$1.buildDayTableModel); | ||
this.slicer = new internal$1.DayTableSlicer(); | ||
this.buildDayTableModel = memoize(buildDayTableModel); | ||
this.slicer = new DayTableSlicer(); | ||
this.state = { | ||
labelId: internal.getUniqueDomId(), | ||
labelId: getUniqueDomId(), | ||
}; | ||
@@ -29,12 +25,12 @@ } | ||
const rowHeight = tableHeight != null ? tableHeight / rowCnt : null; | ||
return (preact.createElement("div", { ref: props.elRef, "data-date": props.isoDateStr, className: "fc-multimonth-month", style: { width: props.width }, role: "grid", "aria-labelledby": state.labelId }, | ||
preact.createElement("div", { className: "fc-multimonth-header", style: { marginBottom: rowHeight }, role: "presentation" }, | ||
preact.createElement("div", { className: "fc-multimonth-title", id: state.labelId }, context.dateEnv.format(props.dateProfile.currentRange.start, props.titleFormat)), | ||
preact.createElement("table", { className: [ | ||
return (createElement("div", { ref: props.elRef, "data-date": props.isoDateStr, className: "fc-multimonth-month", style: { width: props.width }, role: "grid", "aria-labelledby": state.labelId }, | ||
createElement("div", { className: "fc-multimonth-header", style: { marginBottom: rowHeight }, role: "presentation" }, | ||
createElement("div", { className: "fc-multimonth-title", id: state.labelId }, context.dateEnv.format(props.dateProfile.currentRange.start, props.titleFormat)), | ||
createElement("table", { className: [ | ||
'fc-multimonth-header-table', | ||
context.theme.getClass('table'), | ||
].join(' '), role: "presentation" }, | ||
preact.createElement("thead", { role: "rowgroup" }, | ||
preact.createElement(internal.DayHeader, { dateProfile: props.dateProfile, dates: dayTableModel.headerDates, datesRepDistinctDays: false })))), | ||
preact.createElement("div", { className: [ | ||
createElement("thead", { role: "rowgroup" }, | ||
createElement(DayHeader, { dateProfile: props.dateProfile, dates: dayTableModel.headerDates, datesRepDistinctDays: false })))), | ||
createElement("div", { className: [ | ||
'fc-multimonth-daygrid', | ||
@@ -47,18 +43,18 @@ 'fc-daygrid', | ||
].join(' '), style: { marginTop: -rowHeight } }, | ||
preact.createElement("table", { className: [ | ||
createElement("table", { className: [ | ||
'fc-multimonth-daygrid-table', | ||
context.theme.getClass('table'), | ||
].join(' '), style: { height: forPrint ? '' : tableHeight }, role: "presentation" }, | ||
preact.createElement("tbody", { role: "rowgroup" }, | ||
preact.createElement(internal$1.TableRows, Object.assign({}, slicedProps, { dateProfile: dateProfile, cells: dayTableModel.cells, eventSelection: props.eventSelection, dayMaxEvents: !forPrint, dayMaxEventRows: !forPrint, showWeekNumbers: options.weekNumbers, clientWidth: props.clientWidth, clientHeight: props.clientHeight, forPrint: forPrint }))))))); | ||
createElement("tbody", { role: "rowgroup" }, | ||
createElement(TableRows, Object.assign({}, slicedProps, { dateProfile: dateProfile, cells: dayTableModel.cells, eventSelection: props.eventSelection, dayMaxEvents: !forPrint, dayMaxEventRows: !forPrint, showWeekNumbers: options.weekNumbers, clientWidth: props.clientWidth, clientHeight: props.clientHeight, forPrint: forPrint }))))))); | ||
} | ||
} | ||
class MultiMonthView extends internal.DateComponent { | ||
class MultiMonthView extends DateComponent { | ||
constructor() { | ||
super(...arguments); | ||
this.splitDateProfileByMonth = internal.memoize(splitDateProfileByMonth); | ||
this.buildMonthFormat = internal.memoize(buildMonthFormat); | ||
this.scrollElRef = preact.createRef(); | ||
this.firstMonthElRef = preact.createRef(); | ||
this.splitDateProfileByMonth = memoize(splitDateProfileByMonth); | ||
this.buildMonthFormat = memoize(buildMonthFormat); | ||
this.scrollElRef = createRef(); | ||
this.firstMonthElRef = createRef(); | ||
this.needsScrollReset = false; | ||
@@ -94,5 +90,5 @@ this.handleSizing = (isForced) => { | ||
]; | ||
return (preact.createElement(internal.ViewContainer, { elRef: this.scrollElRef, elClasses: rootClassNames, viewSpec: context.viewSpec }, monthDateProfiles.map((monthDateProfile, i) => { | ||
const monthStr = internal.formatIsoMonthStr(monthDateProfile.currentRange.start); | ||
return (preact.createElement(SingleMonth, Object.assign({}, props, { key: monthStr, isoDateStr: monthStr, elRef: i === 0 ? this.firstMonthElRef : undefined, titleFormat: monthTitleFormat, dateProfile: monthDateProfile, width: monthWidthPct, tableWidth: monthTableWidth, clientWidth: clientWidth, clientHeight: clientHeight }))); | ||
return (createElement(ViewContainer, { elRef: this.scrollElRef, elClasses: rootClassNames, viewSpec: context.viewSpec }, monthDateProfiles.map((monthDateProfile, i) => { | ||
const monthStr = formatIsoMonthStr(monthDateProfile.currentRange.start); | ||
return (createElement(SingleMonth, Object.assign({}, props, { key: monthStr, isoDateStr: monthStr, elRef: i === 0 ? this.firstMonthElRef : undefined, titleFormat: monthTitleFormat, dateProfile: monthDateProfile, width: monthWidthPct, tableWidth: monthTableWidth, clientWidth: clientWidth, clientHeight: clientHeight }))); | ||
}))); | ||
@@ -106,3 +102,3 @@ } | ||
componentDidUpdate(prevProps) { | ||
if (!internal.isPropsEqual(prevProps, this.props)) { // an external change? | ||
if (!isPropsEqual(prevProps, this.props)) { // an external change? | ||
this.handleSizing(false); | ||
@@ -148,3 +144,3 @@ } | ||
const scrollEl = this.scrollElRef.current; | ||
const monthEl = scrollEl.querySelector(`[data-date="${internal.formatIsoMonthStr(currentDate)}"]`); | ||
const monthEl = scrollEl.querySelector(`[data-date="${formatIsoMonthStr(currentDate)}"]`); | ||
scrollEl.scrollTop = monthEl.getBoundingClientRect().top - | ||
@@ -163,3 +159,3 @@ this.firstMonthElRef.current.getBoundingClientRect().top; | ||
// ------------------------------------------------------------------------------------------------- | ||
const oneMonthDuration = internal.createDuration(1, 'month'); | ||
const oneMonthDuration = createDuration(1, 'month'); | ||
function splitDateProfileByMonth(dateProfileGenerator, dateProfile, dateEnv, fixedWeekCount, showNonCurrentDates) { | ||
@@ -176,3 +172,3 @@ const { start, end } = dateProfile.currentRange; | ||
}; | ||
let renderRange = internal$1.buildDayTableRenderRange({ | ||
let renderRange = buildDayTableRenderRange({ | ||
currentRange, | ||
@@ -189,3 +185,3 @@ snapToWeek: true, | ||
const activeRange = dateProfile.activeRange ? | ||
internal.intersectRanges(dateProfile.activeRange, showNonCurrentDates ? renderRange : currentRange) : | ||
intersectRanges(dateProfile.activeRange, showNonCurrentDates ? renderRange : currentRange) : | ||
null; | ||
@@ -211,4 +207,4 @@ monthDateProfiles.push({ | ||
// ------------------------------------------------------------------------------------------------- | ||
const YEAR_MONTH_FORMATTER = internal.createFormatter({ year: 'numeric', month: 'long' }); | ||
const YEAR_FORMATTER = internal.createFormatter({ month: 'long' }); | ||
const YEAR_MONTH_FORMATTER = createFormatter({ year: 'numeric', month: 'long' }); | ||
const YEAR_FORMATTER = createFormatter({ month: 'long' }); | ||
function buildMonthFormat(formatOverride, monthDateProfiles) { | ||
@@ -223,3 +219,3 @@ return formatOverride || | ||
const OPTION_REFINERS = { | ||
multiMonthTitleFormat: internal.createFormatter, | ||
multiMonthTitleFormat: createFormatter, | ||
multiMonthMaxColumns: Number, | ||
@@ -230,5 +226,5 @@ multiMonthMinWidth: Number, | ||
var css_248z = ".fc .fc-multimonth{border:1px solid var(--fc-border-color);display:flex;flex-wrap:wrap;overflow-x:hidden;overflow-y:auto}.fc .fc-multimonth-title{font-size:1.2em;font-weight:700;padding:1em 0;text-align:center}.fc .fc-multimonth-daygrid{background:var(--fc-page-bg-color)}.fc .fc-multimonth-daygrid-table,.fc .fc-multimonth-header-table{table-layout:fixed;width:100%}.fc .fc-multimonth-daygrid-table{border-top-style:hidden!important}.fc .fc-multimonth-singlecol .fc-multimonth{position:relative}.fc .fc-multimonth-singlecol .fc-multimonth-header{background:var(--fc-page-bg-color);position:relative;top:0;z-index:2}.fc .fc-multimonth-singlecol .fc-multimonth-daygrid{position:relative;z-index:1}.fc .fc-multimonth-singlecol .fc-multimonth-daygrid-table,.fc .fc-multimonth-singlecol .fc-multimonth-header-table{border-left-style:hidden;border-right-style:hidden}.fc .fc-multimonth-singlecol .fc-multimonth-month:last-child .fc-multimonth-daygrid-table{border-bottom-style:hidden}.fc .fc-multimonth-multicol{line-height:1}.fc .fc-multimonth-multicol .fc-multimonth-month{padding:0 1.2em 1.2em}.fc .fc-multimonth-multicol .fc-daygrid-more-link{border:1px solid var(--fc-event-border-color);display:block;float:none;padding:1px}.fc .fc-multimonth-compact{line-height:1}.fc .fc-multimonth-compact .fc-multimonth-daygrid-table,.fc .fc-multimonth-compact .fc-multimonth-header-table{font-size:.9em}.fc-media-screen .fc-multimonth-singlecol .fc-multimonth-header{position:sticky}.fc-media-print .fc-multimonth{overflow:visible}"; | ||
internal.injectStyles(css_248z); | ||
injectStyles(css_248z); | ||
var index = core.createPlugin({ | ||
var index = createPlugin({ | ||
name: '@fullcalendar/multimonth', | ||
@@ -240,3 +236,3 @@ initialView: 'multiMonthYear', | ||
component: MultiMonthView, | ||
dateProfileGeneratorClass: internal$1.TableDateProfileGenerator, | ||
dateProfileGeneratorClass: TableDateProfileGenerator, | ||
multiMonthMinWidth: 350, | ||
@@ -254,2 +250,2 @@ multiMonthMaxColumns: 3, | ||
exports["default"] = index; | ||
export { index as default }; |
{ | ||
"name": "@fullcalendar/multimonth", | ||
"version": "6.1.0", | ||
"version": "6.1.1", | ||
"title": "FullCalendar Multi-Month Plugin", | ||
@@ -13,8 +13,8 @@ "description": "Display a sequence or grid of multiple months", | ||
], | ||
"homepage": "https://fullcalendar.io/docs/multimonth-view", | ||
"homepage": "https://fullcalendar.io/docs/multimonth-grid", | ||
"dependencies": { | ||
"@fullcalendar/daygrid": "~6.1.0" | ||
"@fullcalendar/daygrid": "~6.1.1" | ||
}, | ||
"peerDependencies": { | ||
"@fullcalendar/core": "~6.1.0" | ||
"@fullcalendar/core": "~6.1.1" | ||
}, | ||
@@ -34,6 +34,6 @@ "type": "module", | ||
}, | ||
"copyright": "2022 Adam Shaw", | ||
"copyright": "2023 Adam Shaw", | ||
"types": "./index.d.ts", | ||
"main": "./index.js", | ||
"module": "./index.esm.js", | ||
"main": "./index.cjs", | ||
"module": "./index.js", | ||
"unpkg": "./index.global.min.js", | ||
@@ -43,11 +43,7 @@ "jsdelivr": "./index.global.min.js", | ||
"./package.json": "./package.json", | ||
"./index.cjs": "./index.cjs", | ||
".": { | ||
"types": "./index.d.ts", | ||
"require": "./index.js", | ||
"import": "./index.esm.js" | ||
}, | ||
"./internal": { | ||
"types": "./internal.d.ts", | ||
"require": "./internal.js", | ||
"import": "./internal.esm.js" | ||
"require": "./index.cjs", | ||
"import": "./index.js" | ||
} | ||
@@ -54,0 +50,0 @@ }, |
# FullCalendar Multi-Month Plugin | ||
Display a sequence or grid of multiple months | ||
Display multiple months, in a grid or vertical stack | ||
@@ -6,0 +6,0 @@ ## Installation |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
50458
0
Updated@fullcalendar/daygrid@~6.1.1