diff --git a/.gitignore b/.gitignore
index 0aa51ed..3252b77 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,3 +6,5 @@ cypress/results/*
cypress/reports/*
cypress/screenshots/*
cypress/videos/*
+
+playwright-report
\ No newline at end of file
diff --git a/e2e/spec.spec.js b/e2e/spec.spec.js
index 8136298..1bb1e72 100644
--- a/e2e/spec.spec.js
+++ b/e2e/spec.spec.js
@@ -176,4 +176,29 @@ test.describe('basic', () => {
'Selected: None'
)
})
+
+ test('should highlight today when highlightToday is enabled', async ({
+ page,
+ }) => {
+ await page.goto('/')
+
+ const today = new Date()
+ const todayISO = new Date(
+ today.getFullYear(),
+ today.getMonth(),
+ today.getDate()
+ ).toISOString()
+
+ // Highlight today should be enabled by default
+ await expect(page.locator(`[data-date="${todayISO}"]`)).toHaveClass(
+ /preachjs-calendar--grid-cell-today/
+ )
+
+ // Toggle off highlight today
+ await page.locator('[name="highlight-today"]').click()
+
+ await expect(page.locator(`[data-date="${todayISO}"]`)).not.toHaveClass(
+ /preachjs-calendar--grid-cell-today/
+ )
+ })
})
diff --git a/example/src/main.css b/example/src/main.css
index 559d3c6..ba4c9f5 100644
--- a/example/src/main.css
+++ b/example/src/main.css
@@ -275,6 +275,14 @@ button {
background: #efefef;
}
+.preachjs-calendar
+ .preachjs-calendar--grid
+ .preachjs-calendar--grid-body
+ .preachjs-calendar--grid-cell.preachjs-calendar--grid-cell-today
+ button {
+ border: 1px solid black;
+}
+
.preachjs-calendar
.preachjs-calendar--grid
.preachjs-calendar--grid-body
diff --git a/example/src/main.js b/example/src/main.js
index 32ea691..39675d9 100644
--- a/example/src/main.js
+++ b/example/src/main.js
@@ -8,6 +8,7 @@ const selectedDate = signal()
const readOnly = signal(false)
const minDate = signal()
const maxDate = signal()
+const highlightToday = signal(true)
function parseDateInput(value) {
if (!value) return undefined
@@ -81,6 +82,15 @@ const App = () => {
}}
/>
+
{
value={selectedDate.value}
min={minDate.value}
max={maxDate.value}
+ highlightToday={highlightToday.value}
onSelect={value => {
selectedDate.value = value
}}
diff --git a/playwright-report/index.html b/playwright-report/index.html
deleted file mode 100644
index 4fe34e1..0000000
--- a/playwright-report/index.html
+++ /dev/null
@@ -1,90 +0,0 @@
-
-
-
-
-
-
-
-
- Playwright Test Report
-
-
-
-
-
-
-
-data:application/zip;base64,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
\ No newline at end of file
diff --git a/src/calendar.d.ts b/src/calendar.d.ts
index 60bd68c..a610d5c 100644
--- a/src/calendar.d.ts
+++ b/src/calendar.d.ts
@@ -18,4 +18,5 @@ export type CalendarProps = {
onSelect?: (nextValue: CalendarValue) => void
min?: Date
max?: Date
+ highlightToday?: boolean
}
diff --git a/src/calendar.js b/src/calendar.js
index 22183ca..9281217 100644
--- a/src/calendar.js
+++ b/src/calendar.js
@@ -27,6 +27,7 @@ export function Calendar({
arrowRight: ArrowRight = () => <>>,
min = undefined,
max = undefined,
+ highlightToday = false,
}) {
const selecting = useRef(false)
const refRange$ = useSignal([])
@@ -192,6 +193,10 @@ export function Calendar({
}
}
+ const isToday =
+ highlightToday &&
+ dateItem.date.toDateString() === new Date().toDateString()
+
const gridCellStyles = [
'preachjs-calendar--grid-cell',
readOnly && 'read-only',
@@ -199,6 +204,7 @@ export function Calendar({
isRangeStart && 'preachjs-calendar--grid-cell-start',
isInRange && 'preachjs-calendar--grid-cell-in-range',
isRangeEnd && 'preachjs-calendar--grid-cell-end',
+ isToday && 'preachjs-calendar--grid-cell-today',
]
const isDisabled =