@ossy/calendar

Calendar feature package for the Ossy platform — schedule views for occurrences (bookings, timesheets, holidays, deadlines) with month, week, day, and year spans, plus a yearly workday/holiday overview for consultancy planning.

Pages

Auto-discovered by @ossy/app via the "ossy": { "src": "./src" } field in package.json.

| File | Page id | Default paths | |---|---|---| | home.page.jsx | calendar/home | /calendar (en), /kalender (sv) |

The home page uses Page from @ossy/design-system for title, description, and module status tags. DataLoader pulls consultancy resources from /@ossy/consultancy/ and renders the yearly Calendar grid; it falls back to static month data when no resources are loaded.

View layer

Composable schedule views for any occurrence list. Pass occurrences directly from your data layer.

| Export | Description | |---|---| | CalendarView | Unified entry with span prop (year | month | week | day) | | CalendarMonthView | Month grid with day selection | | CalendarWeekView | Week columns with timed events | | CalendarDayView | Single-day timeline | | CalendarYearView | Year overview with month navigation |

Utilities from ./views/calendar-utils.js (also re-exported from the package root):

| Export | Description | |---|---| | addDaysMs, startOfDayMs, endOfDayMs | Anchor navigation helpers | | buildMonthGrid, buildWeekDays | Grid builders for month/week views | | occurrencesInRange | Filter occurrences by time range |

Each occurrence uses the CalendarOccurrence shape: id, source, kind, startMs, endMs, title, optional status and href.

import { CalendarView, addDaysMs } from '@ossy/calendar'

const [anchorMs, setAnchorMs] = useState(Date.now())

<CalendarView
  span="month"
  anchorMs={anchorMs}
  occurrences={occurrences}
  onPrev={() => setAnchorMs((ms) => addDaysMs(ms, -30))}
  onNext={() => setAnchorMs((ms) => addDaysMs(ms, 30))}
/>

Home / planning components

| Export | Description | |---|---| | Calendar | 12-month grid with workday/weekend/holiday highlighting | | CalendarDaySurfaceStyles | Injects CSS for day cell theming | | DataLoader | Context provider that loads consultancy resources and provides calendar data | | CalendarHomeContent | Embeddable home content (uses Page + ContentHeader) |

Hooks

| Export | Description | |---|---| | useCalendarMonths | Returns the array of months with day-level data | | useCompany | Returns the CompanyClient instance from context | | useContracts | Returns contracts from the loaded company data | | useEmployees | Returns employees from the loaded company data | | useForecast | Returns fiscal year projections via ForecastClient |

Utilities

| Export | Description | |---|---| | CompanyClient | Models a company with fiscal years, employees, and contracts | | ForecastClient | Projects income, costs, and hours for a fiscal year | | CalendarClient | Generates date spans; checks workdays/holidays (Sweden locale) | | Tax | Static Swedish tax rate constants | | Definition | Module definition object (id, actions, views, status) |

DataLoader resolves consultancy resources via ConsultancySchema ids from @ossy/consultancy (companyBasicInfo, contract, employee).

Preview

Calendar pages and views are exercised in @ossy/app-test (production build path). Sample occurrence data for tests lives in src/stories/fixtures.js (sampleOccurrences, storyAnchorMs).

See packages/app-test/README.md.

Usage

npm install @ossy/calendar
npm run build

Install the package — @ossy/app discovers pages automatically. Import view components when building custom schedule UIs in other feature packages.

Peer dependencies

| Package | Version | |---|---| | @ossy/consultancy | * | | @ossy/design-system | >=1.0.0 | | @ossy/resources | >=1.0.0 | | @ossy/router-react | >=1.0.0 | | @ossy/sdk-react | >=1.0.0 | | react | >=19.0.0 <20.0.0 |

Dependencies

| Package | Description | |---|---| | date-holidays | Swedish public holiday detection for workday calculation |