Upgrade

package.json

@@ -1,6 +1,6 @@
 {
- "name": "@duetds/date-picker",
- "version": "1.4.0",
+ "name": "web-date-picker",
+ "version": "1.4.1",
  "description": "Duet Date Picker is an open source version of Duet Design System’s accessible date picker.",
  "author": "LocalTapiola Services Ltd <duetdesignsystem@lahitapiola.fi>",
  "license": "MIT",
@@ -57,30 +57,31 @@
  "email": "duetdesignsystem@lahitapiola.fi"
  },
  "dependencies": {
- "@stencil/core": "^2.3.0"
+ "@stencil/core": "^4.12.0"
  },
  "devDependencies": {
- "@stencil/sass": "1.3.2",
- "@stencil/utils": "latest",
- "@types/jest": "26.0.10",
- "@types/jest-image-snapshot": "3.1.0",
- "@types/puppeteer": "3.0.1",
- "@typescript-eslint/eslint-plugin": "2.13.0",
- "@typescript-eslint/parser": "2.13.0",
- "eslint": "6.8.0",
- "eslint-config-prettier": "6.7.0",
- "eslint-plugin-prettier": "3.1.2",
- "husky": "4.2.5",
- "jest": "26.4.1",
- "jest-cli": "26.4.1",
- "jest-image-snapshot": "4.1.0",
- "prettier": "1.19.1",
+ "@stencil/core": "^4.12.0",
+ "@stencil/sass": "^3.0.9",
+ "@types/jest": "^29.5.11",
+ "@types/jest-image-snapshot": "6.4.0",
+ "@types/puppeteer": "5.4.7",
+ "@typescript-eslint/eslint-plugin": "6.20.0",
+ "@typescript-eslint/parser": "6.20.0",
+ "eslint": "8.56.0",
+ "eslint-config-prettier": "9.1.0",
+ "eslint-plugin-prettier": "5.1.3",
+ "husky": "9.0.7",
+ "jest": "^29.7.0",
+ "jest-cli": "^29.7.0",
+ "jest-image-snapshot": "6.4.0",
+ "prettier": "3.2.4",
  "prettier-stylelint": "0.4.2",
- "pretty-quick": "^2.0.1",
- "puppeteer": "5.2.1",
+ "pretty-quick": "^4.0.0",
+ "puppeteer": "^21.10.0",
  "sass-lint": "1.13.1",
  "sass-lint-auto-fix": "0.21.2",
- "typescript": "3.9.7"
+ "typescript": "5.3.3",
+ "workbox-build": "^7.0.0"
  },
  "sasslintConfig": "./.sasslintrc.json",
  "eslintConfig": {

src/components/duet-date-picker/date-picker-month.tsx

@@ -1,7 +1,7 @@
 import { h, FunctionalComponent } from "@stencil/core"
 import { DuetLocalizedText } from "./date-localization"
 import { DatePickerDay, DatePickerDayProps } from "./date-picker-day"
-import { getViewOfMonth, inRange, DaysOfWeek, isEqual } from "./date-utils"
+import { getViewOfMonth, inRange, DaysOfWeek, isInList } from "./date-utils"
 import { DateDisabledPredicate } from "./duet-date-picker"
 
 function chunk<T>(array: T[], chunkSize: number): T[][] {
@@ -22,7 +22,7 @@ function mapWithOffset<T, U>(array: T[], startingOffset: number, mapFn: (item: T
 }
 
 type DatePickerMonthProps = {
- selectedDate: Date
+ selectedDates: Date[]
  focusedDate: Date
  labelledById: string
  localization: DuetLocalizedText
@@ -37,7 +37,7 @@ type DatePickerMonthProps = {
 }
 
 export const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({
- selectedDate,
+ selectedDates,
  focusedDate,
  labelledById,
  localization,
@@ -74,7 +74,7 @@ export const DatePickerMonth: FunctionalComponent<DatePickerMonthProps> = ({
  day={day}
  today={today}
  focusedDay={focusedDate}
- isSelected={isEqual(day, selectedDate)}
+ isSelected={isInList(day, selectedDates)}
  disabled={isDateDisabled(day)}
  inRange={inRange(day, min, max)}
  onDaySelect={onDateSelect}

src/components/duet-date-picker/date-utils.ts

@@ -82,6 +82,13 @@ export function isEqual(a: Date, b: Date): boolean {
  return isEqualMonth(a, b) && a.getDate() === b.getDate()
 }
 
+/**
+ * Compare if date a is in date list b
+ */
+export function isInList(a: Date, b: Date[]): boolean {
+ return b.some(b => isEqual(a, b))
+}
+
 /**
  * Compare if two dates are in the same month of the same year.
  */