diff --git a/.github/workflows/preview-release.yml b/.github/workflows/preview-release.yml index 5c1914a95..ca7d0cbeb 100644 --- a/.github/workflows/preview-release.yml +++ b/.github/workflows/preview-release.yml @@ -3,6 +3,7 @@ on: pull_request: types: [ready_for_review, synchronize, opened, labeled] paths: [packages/**] + workflow_dispatch: jobs: preview-release: diff --git a/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range-change-fn.md b/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range-change-fn.md new file mode 100644 index 000000000..71b3e62fd --- /dev/null +++ b/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range-change-fn.md @@ -0,0 +1,3 @@ +```ts +(date: DateRange) => void +``` diff --git a/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range.md b/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range.md new file mode 100644 index 000000000..e883781cc --- /dev/null +++ b/sites/docs/src/lib/content/api-reference/extended-types/shared/date-range.md @@ -0,0 +1,8 @@ +```ts +import type { DateValue } from "@internationalized/date"; + +type DateRange = { + start: DateValue | undefined; + end: DateValue | undefined; +}; +``` diff --git a/sites/docs/src/lib/content/api-reference/helpers.ts b/sites/docs/src/lib/content/api-reference/helpers.ts index 63351c1c9..c9c8d5e2a 100644 --- a/sites/docs/src/lib/content/api-reference/helpers.ts +++ b/sites/docs/src/lib/content/api-reference/helpers.ts @@ -7,6 +7,8 @@ import OnEscapeKeydown from "./extended-types/shared/on-escape-keydown.md"; import EscapeKeydownBehavior from "./extended-types/shared/escape-keydown-behavior.md"; import Dir from "./extended-types/shared/dir.md"; import To from "./extended-types/portal/to.md"; +import DateRange from "./extended-types/shared/date-range.md"; +import DateRangeChangeFn from "./extended-types/shared/date-range-change-fn.md"; import type { APISchema, CSSVarSchema, DataAttrSchema, PropSchema } from "$lib/types/api.js"; import * as C from "$lib/content/constants.js"; @@ -518,3 +520,17 @@ export const disabledDataAttr: DataAttrSchema = { value: "''", description: "Present when the component is disabled.", }; + +export const valueDateRangeProp: PropSchema = createPropSchema({ + type: { + type: "DateRange", + definition: DateRange, + }, + description: "The selected date range.", + bindable: true, +}); + +export const valueDateRangeChangeFn: PropSchema = createFunctionProp({ + definition: DateRangeChangeFn, + description: "A function that is called when the selected date range changes.", +}); diff --git a/sites/docs/src/lib/content/api-reference/range-calendar.ts b/sites/docs/src/lib/content/api-reference/range-calendar.ts index 1e9e94afc..5558fc383 100644 --- a/sites/docs/src/lib/content/api-reference/range-calendar.ts +++ b/sites/docs/src/lib/content/api-reference/range-calendar.ts @@ -1,9 +1,19 @@ -import type { RangeCalendarRootPropsWithoutHTML } from "bits-ui"; -import { createApiSchema, createFunctionProp, withChildProps } from "./helpers.js"; +import type { + RangeCalendarCellPropsWithoutHTML, + RangeCalendarDayPropsWithoutHTML, + RangeCalendarRootPropsWithoutHTML, +} from "bits-ui"; import { + createApiSchema, + createDataAttrSchema, + valueDateRangeChangeFn, + valueDateRangeProp, + withChildProps, +} from "./helpers.js"; +import { + cell as calendarCell, + day as calendarDay, root as calendarRoot, - cell, - day, grid, gridBody, gridHead, @@ -20,18 +30,8 @@ export const root = createApiSchema({ title: "Root", description: "The root range calendar component which contains all other calendar components.", props: { - value: { - type: { - type: "DateRange", - definition: "{ start: DateValue | undefined; end: DateValue | undefined; }", - }, - description: "The selected date range.", - bindable: true, - }, - onValueChange: createFunctionProp({ - definition: "(date: DateRange | undefined) => void", - description: "A function that is called when the selected date range changes.", - }), + value: valueDateRangeProp, + onValueChange: valueDateRangeChangeFn, placeholder: calendarRoot.props!.placeholder, onPlaceholderChange: calendarRoot.props!.onPlaceholderChange, pagedNavigation: calendarRoot.props!.pagedNavigation, @@ -73,6 +73,31 @@ export const root = createApiSchema({ ], }); +const dayCellAttrs = [ + ...(calendarCell.dataAttributes ?? []), + createDataAttrSchema({ + name: "selection-start", + description: "Present when the cell is the start of a selection.", + }), + createDataAttrSchema({ + name: "selection-end", + description: "Present when the cell is the end of a selection.", + }), + createDataAttrSchema({ + name: "highlighted", + description: "Present when the cell is highlighted within a range.", + }), +]; + +export const cell = createApiSchema({ + ...calendarCell, + dataAttributes: dayCellAttrs, +}); + +export const day = createApiSchema({ + ...calendarDay, + dataAttributes: dayCellAttrs, +}); export const rangeCalendar = [ root, header,