Skip to content

Commit 500449f

Browse files
committed
chore: bump zag-js
1 parent a22b821 commit 500449f

File tree

22 files changed

+1318
-595
lines changed

22 files changed

+1318
-595
lines changed

bun.lock

Lines changed: 337 additions & 337 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/react/CHANGELOG.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,34 @@
11
## [Unreleased]
22

3+
### Added
4+
5+
- **Date Picker**: Added non-Gregorian calendar support via `createCalendar` prop (Persian, Buddhist, Islamic, Hebrew,
6+
and other calendar systems)
7+
8+
```jsx
9+
import { PersianCalendar } from "@internationalized/date"
10+
11+
function createCalendar(identifier) {
12+
switch (identifier) {
13+
case "persian":
14+
return new PersianCalendar()
15+
default:
16+
throw new Error(`Unsupported calendar: ${identifier}`)
17+
}
18+
}
19+
20+
<DatePicker.Root locale="fa-IR" createCalendar={createCalendar}>
21+
{/* ... */}
22+
</DatePicker.Root>
23+
```
24+
- **Date Picker**: Added `data-type` attribute to weekend table header and cell
25+
326
### Fixed
427

28+
- **Combobox**: Fixed `onValueChange` returning empty `items` array when using controlled value
29+
- **Popover**: Fixed nested popover z-index layering
30+
- **Toast**: Fixed types to ensure `parent`/`index` are exposed as props and `expand`/`collapse` are exposed on the
31+
store
532
- **Radio Group, Listbox, Progress, Segment Group**: Fixed group labels rendering orphan label elements; now render as
633
`span` per W3C ARIA pattern
734

packages/react/package.json

Lines changed: 64 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -85,70 +85,70 @@
8585
"sideEffects": false,
8686
"dependencies": {
8787
"@internationalized/date": "3.11.0",
88-
"@zag-js/accordion": "1.34.1",
89-
"@zag-js/anatomy": "1.34.1",
90-
"@zag-js/angle-slider": "1.34.1",
91-
"@zag-js/async-list": "1.34.1",
92-
"@zag-js/auto-resize": "1.34.1",
93-
"@zag-js/avatar": "1.34.1",
94-
"@zag-js/carousel": "1.34.1",
95-
"@zag-js/cascade-select": "1.34.1",
96-
"@zag-js/checkbox": "1.34.1",
97-
"@zag-js/clipboard": "1.34.1",
98-
"@zag-js/collapsible": "1.34.1",
99-
"@zag-js/collection": "1.34.1",
100-
"@zag-js/color-picker": "1.34.1",
101-
"@zag-js/color-utils": "1.34.1",
102-
"@zag-js/combobox": "1.34.1",
103-
"@zag-js/core": "1.34.1",
104-
"@zag-js/date-picker": "1.34.1",
105-
"@zag-js/date-utils": "1.34.1",
106-
"@zag-js/dialog": "1.34.1",
107-
"@zag-js/dom-query": "1.34.1",
108-
"@zag-js/drawer": "1.34.1",
109-
"@zag-js/editable": "1.34.1",
110-
"@zag-js/file-upload": "1.34.1",
111-
"@zag-js/file-utils": "1.34.1",
112-
"@zag-js/floating-panel": "1.34.1",
113-
"@zag-js/focus-trap": "1.34.1",
114-
"@zag-js/highlight-word": "1.34.1",
115-
"@zag-js/hover-card": "1.34.1",
116-
"@zag-js/i18n-utils": "1.34.1",
117-
"@zag-js/image-cropper": "1.34.1",
118-
"@zag-js/json-tree-utils": "1.34.1",
119-
"@zag-js/listbox": "1.34.1",
120-
"@zag-js/marquee": "1.34.1",
121-
"@zag-js/menu": "1.34.1",
122-
"@zag-js/navigation-menu": "1.34.1",
123-
"@zag-js/number-input": "1.34.1",
124-
"@zag-js/pagination": "1.34.1",
125-
"@zag-js/password-input": "1.34.1",
126-
"@zag-js/pin-input": "1.34.1",
127-
"@zag-js/popover": "1.34.1",
128-
"@zag-js/presence": "1.34.1",
129-
"@zag-js/progress": "1.34.1",
130-
"@zag-js/qr-code": "1.34.1",
131-
"@zag-js/radio-group": "1.34.1",
132-
"@zag-js/rating-group": "1.34.1",
133-
"@zag-js/react": "1.34.1",
134-
"@zag-js/scroll-area": "1.34.1",
135-
"@zag-js/select": "1.34.1",
136-
"@zag-js/signature-pad": "1.34.1",
137-
"@zag-js/slider": "1.34.1",
138-
"@zag-js/splitter": "1.34.1",
139-
"@zag-js/steps": "1.34.1",
140-
"@zag-js/switch": "1.34.1",
141-
"@zag-js/tabs": "1.34.1",
142-
"@zag-js/tags-input": "1.34.1",
143-
"@zag-js/timer": "1.34.1",
144-
"@zag-js/toast": "1.34.1",
145-
"@zag-js/toggle": "1.34.1",
146-
"@zag-js/toggle-group": "1.34.1",
147-
"@zag-js/tooltip": "1.34.1",
148-
"@zag-js/tour": "1.34.1",
149-
"@zag-js/tree-view": "1.34.1",
150-
"@zag-js/types": "1.34.1",
151-
"@zag-js/utils": "1.34.1"
88+
"@zag-js/accordion": "1.35.0",
89+
"@zag-js/anatomy": "1.35.0",
90+
"@zag-js/angle-slider": "1.35.0",
91+
"@zag-js/async-list": "1.35.0",
92+
"@zag-js/auto-resize": "1.35.0",
93+
"@zag-js/avatar": "1.35.0",
94+
"@zag-js/carousel": "1.35.0",
95+
"@zag-js/cascade-select": "1.35.0",
96+
"@zag-js/checkbox": "1.35.0",
97+
"@zag-js/clipboard": "1.35.0",
98+
"@zag-js/collapsible": "1.35.0",
99+
"@zag-js/collection": "1.35.0",
100+
"@zag-js/color-picker": "1.35.0",
101+
"@zag-js/color-utils": "1.35.0",
102+
"@zag-js/combobox": "1.35.0",
103+
"@zag-js/core": "1.35.0",
104+
"@zag-js/date-picker": "1.35.0",
105+
"@zag-js/date-utils": "1.35.0",
106+
"@zag-js/dialog": "1.35.0",
107+
"@zag-js/dom-query": "1.35.0",
108+
"@zag-js/drawer": "1.35.0",
109+
"@zag-js/editable": "1.35.0",
110+
"@zag-js/file-upload": "1.35.0",
111+
"@zag-js/file-utils": "1.35.0",
112+
"@zag-js/floating-panel": "1.35.0",
113+
"@zag-js/focus-trap": "1.35.0",
114+
"@zag-js/highlight-word": "1.35.0",
115+
"@zag-js/hover-card": "1.35.0",
116+
"@zag-js/i18n-utils": "1.35.0",
117+
"@zag-js/image-cropper": "1.35.0",
118+
"@zag-js/json-tree-utils": "1.35.0",
119+
"@zag-js/listbox": "1.35.0",
120+
"@zag-js/marquee": "1.35.0",
121+
"@zag-js/menu": "1.35.0",
122+
"@zag-js/navigation-menu": "1.35.0",
123+
"@zag-js/number-input": "1.35.0",
124+
"@zag-js/pagination": "1.35.0",
125+
"@zag-js/password-input": "1.35.0",
126+
"@zag-js/pin-input": "1.35.0",
127+
"@zag-js/popover": "1.35.0",
128+
"@zag-js/presence": "1.35.0",
129+
"@zag-js/progress": "1.35.0",
130+
"@zag-js/qr-code": "1.35.0",
131+
"@zag-js/radio-group": "1.35.0",
132+
"@zag-js/rating-group": "1.35.0",
133+
"@zag-js/react": "1.35.0",
134+
"@zag-js/scroll-area": "1.35.0",
135+
"@zag-js/select": "1.35.0",
136+
"@zag-js/signature-pad": "1.35.0",
137+
"@zag-js/slider": "1.35.0",
138+
"@zag-js/splitter": "1.35.0",
139+
"@zag-js/steps": "1.35.0",
140+
"@zag-js/switch": "1.35.0",
141+
"@zag-js/tabs": "1.35.0",
142+
"@zag-js/tags-input": "1.35.0",
143+
"@zag-js/timer": "1.35.0",
144+
"@zag-js/toast": "1.35.0",
145+
"@zag-js/toggle": "1.35.0",
146+
"@zag-js/toggle-group": "1.35.0",
147+
"@zag-js/tooltip": "1.35.0",
148+
"@zag-js/tour": "1.35.0",
149+
"@zag-js/tree-view": "1.35.0",
150+
"@zag-js/types": "1.35.0",
151+
"@zag-js/utils": "1.35.0"
152152
},
153153
"devDependencies": {
154154
"@biomejs/biome": "2.4.4",

packages/react/src/components/date-picker/date-picker-root.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ export const DatePickerRoot = forwardRef<HTMLDivElement, DatePickerRootProps>((p
1616
const [presenceProps, datePickerProps] = splitPresenceProps(props)
1717
const [useDatePickerProps, localProps] = splitRootProps(datePickerProps, [
1818
'closeOnSelect',
19+
'createCalendar',
1920
'defaultFocusedValue',
2021
'defaultOpen',
2122
'defaultValue',

packages/react/src/components/date-picker/date-picker.stories.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,3 +33,4 @@ export { SelectToday } from './examples/select-today'
3333
export { FixedWeeks } from './examples/fixed-weeks'
3434
export { Form } from './examples/form'
3535
export { MaxSelectedDates } from './examples/max-selected-dates'
36+
export { CustomCalendar } from './examples/custom-calendar'
Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
import { DatePicker } from '@ark-ui/react/date-picker'
2+
import { Portal } from '@ark-ui/react/portal'
3+
import { PersianCalendar } from '@internationalized/date'
4+
import { CalendarIcon, ChevronLeftIcon, ChevronRightIcon } from 'lucide-react'
5+
import button from 'styles/button.module.css'
6+
import styles from 'styles/date-picker.module.css'
7+
8+
function createCalendar(identifier: string) {
9+
switch (identifier) {
10+
case 'persian':
11+
return new PersianCalendar()
12+
default:
13+
throw new Error(`Unsupported calendar: ${identifier}`)
14+
}
15+
}
16+
17+
export const CustomCalendar = () => {
18+
return (
19+
<DatePicker.Root className={styles.Root} locale="fa-IR" createCalendar={createCalendar}>
20+
<DatePicker.Label className={styles.Label}>Label</DatePicker.Label>
21+
<DatePicker.Control className={styles.Control}>
22+
<DatePicker.Trigger className={button.Root} style={{ width: '100%', justifyContent: 'space-between' }}>
23+
<DatePicker.ValueText placeholder="Select date" />
24+
<CalendarIcon />
25+
</DatePicker.Trigger>
26+
</DatePicker.Control>
27+
<Portal>
28+
<DatePicker.Positioner>
29+
<DatePicker.Content className={styles.Content}>
30+
<DatePicker.View view="day" className={styles.View}>
31+
<DatePicker.Context>
32+
{(datePicker) => (
33+
<>
34+
<DatePicker.ViewControl className={styles.ViewControl}>
35+
<DatePicker.PrevTrigger className={styles.PrevTrigger}>
36+
<ChevronLeftIcon />
37+
</DatePicker.PrevTrigger>
38+
<DatePicker.ViewTrigger className={styles.ViewTrigger}>
39+
<DatePicker.RangeText />
40+
</DatePicker.ViewTrigger>
41+
<DatePicker.NextTrigger className={styles.NextTrigger}>
42+
<ChevronRightIcon />
43+
</DatePicker.NextTrigger>
44+
</DatePicker.ViewControl>
45+
<DatePicker.Table className={styles.Table}>
46+
<DatePicker.TableHead className={styles.TableHead}>
47+
<DatePicker.TableRow className={styles.TableRow}>
48+
{datePicker.weekDays.map((weekDay, id) => (
49+
<DatePicker.TableHeader className={styles.TableHeader} key={id}>
50+
{weekDay.short}
51+
</DatePicker.TableHeader>
52+
))}
53+
</DatePicker.TableRow>
54+
</DatePicker.TableHead>
55+
<DatePicker.TableBody className={styles.TableBody}>
56+
{datePicker.weeks.map((week, id) => (
57+
<DatePicker.TableRow className={styles.TableRow} key={id}>
58+
{week.map((day, id) => (
59+
<DatePicker.TableCell className={styles.TableCell} key={id} value={day}>
60+
<DatePicker.TableCellTrigger className={styles.TableCellTrigger}>
61+
{day.day}
62+
</DatePicker.TableCellTrigger>
63+
</DatePicker.TableCell>
64+
))}
65+
</DatePicker.TableRow>
66+
))}
67+
</DatePicker.TableBody>
68+
</DatePicker.Table>
69+
</>
70+
)}
71+
</DatePicker.Context>
72+
</DatePicker.View>
73+
<DatePicker.View view="month" className={styles.View}>
74+
<DatePicker.Context>
75+
{(datePicker) => (
76+
<>
77+
<DatePicker.ViewControl className={styles.ViewControl}>
78+
<DatePicker.PrevTrigger className={styles.PrevTrigger}>
79+
<ChevronLeftIcon />
80+
</DatePicker.PrevTrigger>
81+
<DatePicker.ViewTrigger className={styles.ViewTrigger}>
82+
<DatePicker.RangeText />
83+
</DatePicker.ViewTrigger>
84+
<DatePicker.NextTrigger className={styles.NextTrigger}>
85+
<ChevronRightIcon />
86+
</DatePicker.NextTrigger>
87+
</DatePicker.ViewControl>
88+
<DatePicker.Table className={styles.Table}>
89+
<DatePicker.TableBody className={styles.TableBody}>
90+
{datePicker.getMonthsGrid({ columns: 4, format: 'short' }).map((months, id) => (
91+
<DatePicker.TableRow className={styles.TableRow} key={id}>
92+
{months.map((month, id) => (
93+
<DatePicker.TableCell className={styles.TableCell} key={id} value={month.value}>
94+
<DatePicker.TableCellTrigger className={styles.MonthTableCellTrigger}>
95+
{month.label}
96+
</DatePicker.TableCellTrigger>
97+
</DatePicker.TableCell>
98+
))}
99+
</DatePicker.TableRow>
100+
))}
101+
</DatePicker.TableBody>
102+
</DatePicker.Table>
103+
</>
104+
)}
105+
</DatePicker.Context>
106+
</DatePicker.View>
107+
<DatePicker.View view="year" className={styles.View}>
108+
<DatePicker.Context>
109+
{(datePicker) => (
110+
<>
111+
<DatePicker.ViewControl className={styles.ViewControl}>
112+
<DatePicker.PrevTrigger className={styles.PrevTrigger}>
113+
<ChevronLeftIcon />
114+
</DatePicker.PrevTrigger>
115+
<DatePicker.ViewTrigger className={styles.ViewTrigger}>
116+
<DatePicker.RangeText />
117+
</DatePicker.ViewTrigger>
118+
<DatePicker.NextTrigger className={styles.NextTrigger}>
119+
<ChevronRightIcon />
120+
</DatePicker.NextTrigger>
121+
</DatePicker.ViewControl>
122+
<DatePicker.Table className={styles.Table}>
123+
<DatePicker.TableBody className={styles.TableBody}>
124+
{datePicker.getYearsGrid({ columns: 4 }).map((years, id) => (
125+
<DatePicker.TableRow className={styles.TableRow} key={id}>
126+
{years.map((year, id) => (
127+
<DatePicker.TableCell className={styles.TableCell} key={id} value={year.value}>
128+
<DatePicker.TableCellTrigger className={styles.YearTableCellTrigger}>
129+
{year.label}
130+
</DatePicker.TableCellTrigger>
131+
</DatePicker.TableCell>
132+
))}
133+
</DatePicker.TableRow>
134+
))}
135+
</DatePicker.TableBody>
136+
</DatePicker.Table>
137+
</>
138+
)}
139+
</DatePicker.Context>
140+
</DatePicker.View>
141+
</DatePicker.Content>
142+
</DatePicker.Positioner>
143+
</Portal>
144+
</DatePicker.Root>
145+
)
146+
}

packages/solid/CHANGELOG.md

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,34 @@
11
## [Unreleased]
22

3+
### Added
4+
5+
- **Date Picker**: Added non-Gregorian calendar support via `createCalendar` prop (Persian, Buddhist, Islamic, Hebrew,
6+
and other calendar systems)
7+
8+
```jsx
9+
import { PersianCalendar } from "@internationalized/date"
10+
11+
function createCalendar(identifier) {
12+
switch (identifier) {
13+
case "persian":
14+
return new PersianCalendar()
15+
default:
16+
throw new Error(`Unsupported calendar: ${identifier}`)
17+
}
18+
}
19+
20+
<DatePicker.Root locale="fa-IR" createCalendar={createCalendar}>
21+
{/* ... */}
22+
</DatePicker.Root>
23+
```
24+
- **Date Picker**: Added `data-type` attribute to weekend table header and cell
25+
326
### Fixed
427

28+
- **Combobox**: Fixed `onValueChange` returning empty `items` array when using controlled value
29+
- **Popover**: Fixed nested popover z-index layering
30+
- **Toast**: Fixed types to ensure `parent`/`index` are exposed as props and `expand`/`collapse` are exposed on the
31+
store
532
- **Radio Group, Listbox, Progress, Segment Group**: Fixed group labels rendering orphan label elements; now render as
633
`span` per W3C ARIA pattern
734

0 commit comments

Comments
 (0)